UNPKG

4.51 kBJavaScriptView Raw
1'use strict';
2
3Object.defineProperty(exports, '__esModule', { value: true });
4
5var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
6var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
7var css = require('@emotion/css');
8var AccordionPrimitive = require('@radix-ui/react-accordion');
9var box = require('@spark-web/box');
10var heading = require('@spark-web/heading');
11var icon = require('@spark-web/icon');
12var stack = require('@spark-web/stack');
13var theme = require('@spark-web/theme');
14var jsxRuntime = require('react/jsx-runtime');
15
16function _interopNamespace(e) {
17 if (e && e.__esModule) return e;
18 var n = Object.create(null);
19 if (e) {
20 Object.keys(e).forEach(function (k) {
21 if (k !== 'default') {
22 var d = Object.getOwnPropertyDescriptor(e, k);
23 Object.defineProperty(n, k, d.get ? d : {
24 enumerable: true,
25 get: function () { return e[k]; }
26 });
27 }
28 });
29 }
30 n["default"] = e;
31 return Object.freeze(n);
32}
33
34var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
35
36var _excluded = ["children"];
37var openAnimation = css.keyframes({
38 from: {
39 height: 0,
40 opacity: 0
41 },
42 to: {
43 height: 'var(--radix-accordion-content-height)',
44 opacity: 1
45 }
46});
47var closeAnimation = css.keyframes({
48 from: {
49 height: 'var(--radix-accordion-content-height)',
50 opacity: 1
51 },
52 to: {
53 height: 0,
54 opacity: 0
55 }
56});
57function AccordionItem(_ref) {
58 var _ref$headingElement = _ref.headingElement,
59 headingElement = _ref$headingElement === void 0 ? 'h3' : _ref$headingElement,
60 _ref$background = _ref.background,
61 background = _ref$background === void 0 ? 'surface' : _ref$background,
62 children = _ref.children,
63 data = _ref.data,
64 label = _ref.label,
65 level = _ref.level,
66 value = _ref.value;
67 var theme$1 = theme.useTheme();
68 return /*#__PURE__*/jsxRuntime.jsx(AccordionPrimitive__namespace.Item, {
69 value: value,
70 asChild: true,
71 children: /*#__PURE__*/jsxRuntime.jsxs(box.Box, {
72 data: data,
73 background: background,
74 borderRadius: "medium",
75 padding: "large",
76 children: [/*#__PURE__*/jsxRuntime.jsx(AccordionPrimitive__namespace.Header, {
77 asChild: true,
78 children: /*#__PURE__*/jsxRuntime.jsx(heading.Heading, {
79 as: headingElement !== null && headingElement !== void 0 ? headingElement : 'h3',
80 level: level !== null && level !== void 0 ? level : '3',
81 children: /*#__PURE__*/jsxRuntime.jsx(AccordionPrimitive__namespace.Trigger, {
82 asChild: true,
83 children: /*#__PURE__*/jsxRuntime.jsxs(box.Box, {
84 display: "flex",
85 justifyContent: "spaceBetween",
86 alignItems: "start",
87 gap: "small",
88 children: [/*#__PURE__*/jsxRuntime.jsx(box.Box, {
89 flex: 1,
90 children: label
91 }), /*#__PURE__*/jsxRuntime.jsxs(box.Box, {
92 display: "flex",
93 alignItems: "center",
94 children: ["\u200B", /*#__PURE__*/jsxRuntime.jsx(icon.ChevronDownIcon, {
95 size: "xxsmall"
96 })]
97 })]
98 })
99 })
100 })
101 }), /*#__PURE__*/jsxRuntime.jsx(AccordionPrimitive__namespace.Content, {
102 className: css.css({
103 '@media screen and (prefers-reduced-motion: no-preference)': {
104 '&[data-state="open"]': {
105 animation: "".concat(openAnimation, " ").concat(theme$1.animation.standard.duration, "ms ").concat(theme$1.animation.standard.easing)
106 },
107 '&[data-state="closed"]': {
108 animation: "".concat(closeAnimation, " ").concat(theme$1.animation.standard.duration, "ms ").concat(theme$1.animation.standard.easing)
109 }
110 }
111 }),
112 children: /*#__PURE__*/jsxRuntime.jsx(box.Box, {
113 paddingTop: "xlarge",
114 children: children
115 })
116 })]
117 })
118 });
119}
120function Accordion(_ref2) {
121 var children = _ref2.children,
122 rest = _objectWithoutProperties(_ref2, _excluded);
123 return /*#__PURE__*/jsxRuntime.jsx(AccordionPrimitive__namespace.Root, _objectSpread(_objectSpread({
124 asChild: true
125 }, rest), {}, {
126 children: /*#__PURE__*/jsxRuntime.jsx(stack.Stack, {
127 gap: "small",
128 width: "full",
129 children: children
130 })
131 }));
132}
133
134exports.Accordion = Accordion;
135exports.AccordionItem = AccordionItem;