@salutejs/plasma-new-hope 0.88.0-canary.1223.9302553119.0 → 0.88.0-canary.1223.9380263327.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Accordion/Accordion.css +1 -0
- package/cjs/components/Accordion/Accordion.js +66 -0
- package/cjs/components/Accordion/Accordion.js.map +1 -0
- package/cjs/components/Accordion/Accordion.styles.js +9 -0
- package/cjs/components/Accordion/Accordion.styles.js.map +1 -0
- package/cjs/components/Accordion/Accordion.styles_1mo1sxr.css +1 -0
- package/cjs/components/Accordion/Accordion.tokens.js +44 -0
- package/cjs/components/Accordion/Accordion.tokens.js.map +1 -0
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js +97 -0
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js.map +1 -0
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +63 -0
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js.map +1 -0
- package/cjs/components/Accordion/utils/index.js +26 -0
- package/cjs/components/Accordion/utils/index.js.map +1 -0
- package/cjs/components/Accordion/variations/_size/base.js +9 -0
- package/cjs/components/Accordion/variations/_size/base.js.map +1 -0
- package/cjs/components/Accordion/variations/_size/base_x642ct.css +1 -0
- package/cjs/components/Accordion/variations/_view/base.js +9 -0
- package/cjs/components/Accordion/variations/_view/base.js.map +1 -0
- package/cjs/components/Accordion/variations/_view/base_x642ct.css +1 -0
- package/cjs/components/_Icon/Icon.assets/ChevronDownFill.js +33 -0
- package/cjs/components/_Icon/Icon.assets/ChevronDownFill.js.map +1 -0
- package/cjs/components/_Icon/Icon.assets/Minus.js +22 -0
- package/cjs/components/_Icon/Icon.assets/Minus.js.map +1 -0
- package/cjs/components/_Icon/Icons/IconChevronDownFill.js +23 -0
- package/cjs/components/_Icon/Icons/IconChevronDownFill.js.map +1 -0
- package/cjs/components/_Icon/Icons/IconMinus.js +23 -0
- package/cjs/components/_Icon/Icons/IconMinus.js.map +1 -0
- package/cjs/index.css +2 -0
- package/cjs/index.js +8 -0
- package/cjs/index.js.map +1 -1
- package/es/components/Accordion/Accordion.css +1 -0
- package/es/components/Accordion/Accordion.js +61 -0
- package/es/components/Accordion/Accordion.js.map +1 -0
- package/es/components/Accordion/Accordion.styles.js +5 -0
- package/es/components/Accordion/Accordion.styles.js.map +1 -0
- package/es/components/Accordion/Accordion.styles_1mo1sxr.css +1 -0
- package/es/components/Accordion/Accordion.tokens.js +39 -0
- package/es/components/Accordion/Accordion.tokens.js.map +1 -0
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.js +93 -0
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.js.map +1 -0
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +49 -0
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js.map +1 -0
- package/es/components/Accordion/utils/index.js +21 -0
- package/es/components/Accordion/utils/index.js.map +1 -0
- package/es/components/Accordion/variations/_size/base.js +5 -0
- package/es/components/Accordion/variations/_size/base.js.map +1 -0
- package/es/components/Accordion/variations/_size/base_x642ct.css +1 -0
- package/es/components/Accordion/variations/_view/base.js +5 -0
- package/es/components/Accordion/variations/_view/base.js.map +1 -0
- package/es/components/Accordion/variations/_view/base_x642ct.css +1 -0
- package/es/components/_Icon/Icon.assets/ChevronDownFill.js +29 -0
- package/es/components/_Icon/Icon.assets/ChevronDownFill.js.map +1 -0
- package/es/components/_Icon/Icon.assets/Minus.js +18 -0
- package/es/components/_Icon/Icon.assets/Minus.js.map +1 -0
- package/es/components/_Icon/Icons/IconChevronDownFill.js +19 -0
- package/es/components/_Icon/Icons/IconChevronDownFill.js.map +1 -0
- package/es/components/_Icon/Icons/IconMinus.js +19 -0
- package/es/components/_Icon/Icons/IconMinus.js.map +1 -0
- package/es/index.css +2 -0
- package/es/index.js +3 -0
- package/es/index.js.map +1 -1
- package/package.json +2 -2
- package/styled-components/cjs/components/Accordion/Accordion.js +23 -2
- package/styled-components/cjs/components/Accordion/Accordion.tokens.js +4 -4
- package/styled-components/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js +10 -3
- package/styled-components/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +5 -5
- package/styled-components/cjs/components/Accordion/utils/index.js +23 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Accordion/Accordion.config.js +6 -6
- package/styled-components/cjs/examples/plasma_b2c/components/Accordion/Accordion.stories.tsx +1 -0
- package/styled-components/cjs/examples/plasma_web/components/Accordion/Accordion.config.js +6 -6
- package/styled-components/cjs/examples/plasma_web/components/Accordion/Accordion.stories.tsx +1 -0
- package/styled-components/cjs/index.js +11 -0
- package/styled-components/es/components/Accordion/Accordion.js +24 -3
- package/styled-components/es/components/Accordion/Accordion.tokens.js +4 -4
- package/styled-components/es/components/Accordion/ui/AccordionItem/AccordionItem.js +10 -3
- package/styled-components/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +5 -5
- package/styled-components/es/components/Accordion/utils/index.js +17 -0
- package/styled-components/es/examples/plasma_b2c/components/Accordion/Accordion.config.js +6 -6
- package/styled-components/es/examples/plasma_b2c/components/Accordion/Accordion.stories.tsx +1 -0
- package/styled-components/es/examples/plasma_web/components/Accordion/Accordion.config.js +6 -6
- package/styled-components/es/examples/plasma_web/components/Accordion/Accordion.stories.tsx +1 -0
- package/styled-components/es/index.js +2 -1
- package/types/components/Accordion/Accordion.d.ts +2 -0
- package/types/components/Accordion/Accordion.d.ts.map +1 -1
- package/types/components/Accordion/Accordion.tokens.d.ts +4 -4
- package/types/components/Accordion/Accordion.types.d.ts +5 -1
- package/types/components/Accordion/Accordion.types.d.ts.map +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.d.ts.map +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.styles.d.ts.map +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.types.d.ts +10 -4
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.types.d.ts.map +1 -1
- package/types/components/Accordion/utils/index.d.ts +17 -0
- package/types/components/Accordion/utils/index.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/Accordion/Accordion.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Accordion/Accordion.d.ts +1 -0
- package/types/examples/plasma_b2c/components/Accordion/Accordion.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Accordion/Accordion.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Accordion/Accordion.d.ts +1 -0
- package/types/examples/plasma_web/components/Accordion/Accordion.d.ts.map +1 -1
- package/types/index.d.ts +1 -0
- package/types/index.d.ts.map +1 -1
- /package/cjs/components/{_Icon/Icons/IconClose.css → Accordion/ui/AccordionItem/AccordionItem.css} +0 -0
- /package/es/components/{_Icon/Icons/IconClose.css → Accordion/ui/AccordionItem/AccordionItem.css} +0 -0
|
@@ -19,12 +19,12 @@ var tokens = exports.tokens = {
|
|
|
19
19
|
accordionBackground: '--plasma-accordion-background',
|
|
20
20
|
accordionItemBackground: '--plasma-accordion-item-background',
|
|
21
21
|
accordionItemBorderRadius: '--plasma-accordion-item-border-radius',
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
accordionItemPaddingLeft: '--plasma-accordion-item-padding-left',
|
|
22
|
+
accordionItemPadding: '--plasma-accordion-item-padding',
|
|
23
|
+
accordionItemPaddingVertical: '--plasma-accordion-item-padding-vertical',
|
|
24
|
+
accordionItemPaddingHorizontal: '--plasma-accordion-item-padding-horizontal',
|
|
26
25
|
accordionItemGap: '--plasma-accordion-item-gap',
|
|
27
26
|
accordionItemFocus: '--plasma-accordion-item-focus',
|
|
27
|
+
accordionItemBorderBottom: '--plasma-accordion-item-border-bottom',
|
|
28
28
|
accordionItemTitleColor: '--plasma-accordion-item-title-color',
|
|
29
29
|
accordionItemTitleFontFamily: '--plasma-accordion-item-title-font-family',
|
|
30
30
|
accordionItemTitleFontSize: '--plasma-accordion-item-title-font-size',
|
|
@@ -28,6 +28,9 @@ var AccordionItem = exports.AccordionItem = function AccordionItem(_ref) {
|
|
|
28
28
|
body = _ref.body,
|
|
29
29
|
_ref$type = _ref.type,
|
|
30
30
|
type = _ref$type === void 0 ? 'sign' : _ref$type,
|
|
31
|
+
index = _ref.index,
|
|
32
|
+
eventKey = _ref.eventKey,
|
|
33
|
+
updateValue = _ref.updateValue,
|
|
31
34
|
onChangeValue = _ref.onChangeValue;
|
|
32
35
|
var _useState = (0, _react.useState)(value),
|
|
33
36
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -39,7 +42,8 @@ var AccordionItem = exports.AccordionItem = function AccordionItem(_ref) {
|
|
|
39
42
|
setLeftPadding = _useState4[1];
|
|
40
43
|
var showHandler = function showHandler() {
|
|
41
44
|
setShow(!show);
|
|
42
|
-
|
|
45
|
+
updateValue && updateValue(index, !show);
|
|
46
|
+
onChangeValue && onChangeValue(!show, eventKey);
|
|
43
47
|
};
|
|
44
48
|
var onKeyPress = function onKeyPress(event) {
|
|
45
49
|
event.persist();
|
|
@@ -50,10 +54,11 @@ var AccordionItem = exports.AccordionItem = function AccordionItem(_ref) {
|
|
|
50
54
|
var leftContentRef = (0, _react.useRef)(null);
|
|
51
55
|
(0, _react.useEffect)(function () {
|
|
52
56
|
var _leftContentRef$curre, _leftContentRef$curre2;
|
|
57
|
+
setShow(value);
|
|
53
58
|
var leftContentWidth = (_leftContentRef$curre = leftContentRef === null || leftContentRef === void 0 || (_leftContentRef$curre2 = leftContentRef.current) === null || _leftContentRef$curre2 === void 0 ? void 0 : _leftContentRef$curre2.offsetWidth) !== null && _leftContentRef$curre !== void 0 ? _leftContentRef$curre : 0;
|
|
54
59
|
var leftPaddingBody = leftContentWidth ? "calc(".concat(leftContentWidth, "px + var(").concat(_Accordion.tokens.accordionItemGap, "))") : 0;
|
|
55
60
|
setLeftPadding(leftPaddingBody);
|
|
56
|
-
}, [type, leftContentRef, setLeftPadding]);
|
|
61
|
+
}, [value, type, leftContentRef, setLeftPadding]);
|
|
57
62
|
var showedBody = show ? _Accordion.classes.accordionItemShowBody : undefined;
|
|
58
63
|
var StyledAnimationPLus = function StyledAnimationPLus() {
|
|
59
64
|
return /*#__PURE__*/_react["default"].createElement(_AccordionItem.StyledPlus, null, _StyledMinus || (_StyledMinus = /*#__PURE__*/_react["default"].createElement(_AccordionItem.StyledMinus, {
|
|
@@ -65,7 +70,7 @@ var AccordionItem = exports.AccordionItem = function AccordionItem(_ref) {
|
|
|
65
70
|
className: showedBody !== null && showedBody !== void 0 ? showedBody : _Accordion.classes.accordionPlusAnimationElement
|
|
66
71
|
}));
|
|
67
72
|
};
|
|
68
|
-
var accordionBorderRadius = (0, _roundness.convertRoundnessMatrix)(pin, "var(".concat(_Accordion.tokens.accordionItemBorderRadius, ")"));
|
|
73
|
+
var accordionBorderRadius = (0, _roundness.convertRoundnessMatrix)(pin, "var(".concat(_Accordion.tokens.accordionItemBorderRadius, ")"), '1.5rem');
|
|
69
74
|
var leftContent = contentLeft !== null && contentLeft !== void 0 ? contentLeft : type === 'arrow' ? _StyledArrow || (_StyledArrow = /*#__PURE__*/_react["default"].createElement(_AccordionItem.StyledArrow, {
|
|
70
75
|
size: "xs",
|
|
71
76
|
color: "inhert"
|
|
@@ -75,7 +80,9 @@ var AccordionItem = exports.AccordionItem = function AccordionItem(_ref) {
|
|
|
75
80
|
var rightContentRotate = type === 'sign' && show ? _Accordion.classes.accordionItemShowBody : undefined;
|
|
76
81
|
return /*#__PURE__*/_react["default"].createElement(_AccordionItem.StyledAccordionItem, {
|
|
77
82
|
role: "tab",
|
|
83
|
+
className: _Accordion.classes.accordionItem,
|
|
78
84
|
tabIndex: 0,
|
|
85
|
+
key: eventKey,
|
|
79
86
|
style: {
|
|
80
87
|
borderRadius: accordionBorderRadius
|
|
81
88
|
},
|
|
@@ -11,7 +11,7 @@ var _mixins = /*#__PURE__*/require("../../../../mixins");
|
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
12
12
|
var StyledAccordionItem = exports.StyledAccordionItem = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
13
13
|
componentId: "plasma-new-hope__sc-20ij9z-0"
|
|
14
|
-
})(["background:var(", ");&:focus{outline:none;}", ""], _Accordion.tokens.accordionItemBackground, /*#__PURE__*/(0, _mixins.addFocus)({
|
|
14
|
+
})(["background:var(", ");border-bottom:var(", ");&:focus{outline:none;}", " &:last-child{border-bottom:none;}"], _Accordion.tokens.accordionItemBackground, _Accordion.tokens.accordionItemBorderBottom, /*#__PURE__*/(0, _mixins.addFocus)({
|
|
15
15
|
outlineOffset: '0.125rem',
|
|
16
16
|
outlineSize: '0.125rem',
|
|
17
17
|
outlineRadius: '0',
|
|
@@ -19,7 +19,7 @@ var StyledAccordionItem = exports.StyledAccordionItem = /*#__PURE__*/_styledComp
|
|
|
19
19
|
}));
|
|
20
20
|
var StyledAccordionHeader = exports.StyledAccordionHeader = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
21
21
|
componentId: "plasma-new-hope__sc-20ij9z-1"
|
|
22
|
-
})(["padding
|
|
22
|
+
})(["padding:var(", ");display:flex;gap:var(", ");justify-content:space-between;align-items:center;cursor:pointer;"], _Accordion.tokens.accordionItemPadding, _Accordion.tokens.accordionItemGap);
|
|
23
23
|
var StyledAccordionHeaderLeft = exports.StyledAccordionHeaderLeft = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
24
24
|
componentId: "plasma-new-hope__sc-20ij9z-2"
|
|
25
25
|
})(["display:flex;gap:var(", ");justify-content:space-between;align-items:center;"], _Accordion.tokens.accordionItemGap);
|
|
@@ -31,13 +31,13 @@ var StyledAccordionContentLeft = exports.StyledAccordionContentLeft = /*#__PURE_
|
|
|
31
31
|
})(["transition:0.2s;display:flex;align-items:center;&&.", "{transition:0.2s;transform:rotate(180deg);}"], _Accordion.classes.accordionItemShowBody);
|
|
32
32
|
var StyledAccordionTitle = exports.StyledAccordionTitle = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
33
33
|
componentId: "plasma-new-hope__sc-20ij9z-5"
|
|
34
|
-
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");"], _Accordion.tokens.accordionItemTitleColor, _Accordion.tokens.
|
|
34
|
+
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");"], _Accordion.tokens.accordionItemTitleColor, _Accordion.tokens.accordionItemTitleFontFamily, _Accordion.tokens.accordionItemTitleFontSize, _Accordion.tokens.accordionItemTitleFontWeight, _Accordion.tokens.accordionItemTitleFontStyle, _Accordion.tokens.accordionItemTitleLetterSpacing, _Accordion.tokens.accordionItemTitleLineHeight);
|
|
35
35
|
var StyledAccordionBodyAnimate = exports.StyledAccordionBodyAnimate = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
36
36
|
componentId: "plasma-new-hope__sc-20ij9z-6"
|
|
37
|
-
})(["display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.2s ease-out;overflow:hidden;&&.", "{grid-template-rows:1fr;padding-bottom:var(", ");&.", "{transition:0.2s;transform:rotate(0deg);}}"], _Accordion.classes.accordionItemShowBody, _Accordion.tokens.
|
|
37
|
+
})(["display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.2s ease-out;overflow:hidden;&&.", "{grid-template-rows:1fr;padding-bottom:var(", ");&.", "{transition:0.2s;transform:rotate(0deg);}}"], _Accordion.classes.accordionItemShowBody, _Accordion.tokens.accordionItemPaddingVertical, _Accordion.classes.accordionPlusAnimationElement);
|
|
38
38
|
var StyledAccordionBody = exports.StyledAccordionBody = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
39
39
|
componentId: "plasma-new-hope__sc-20ij9z-7"
|
|
40
|
-
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");overflow:hidden;padding-right:var(", ");padding-left:var(", ");"], _Accordion.tokens.accordionItemTextColor, _Accordion.tokens.
|
|
40
|
+
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");overflow:hidden;padding-right:var(", ");padding-left:var(", ");"], _Accordion.tokens.accordionItemTextColor, _Accordion.tokens.accordionItemTextFontFamily, _Accordion.tokens.accordionItemTextFontSize, _Accordion.tokens.accordionItemTextFontWeight, _Accordion.tokens.accordionItemTextFontStyle, _Accordion.tokens.accordionItemTextLetterSpacing, _Accordion.tokens.accordionItemTextLineHeight, _Accordion.tokens.accordionItemPaddingHorizontal, _Accordion.tokens.accordionItemPaddingHorizontal);
|
|
41
41
|
var StyledArrow = exports.StyledArrow = /*#__PURE__*/(0, _styledComponents["default"])(_Icon.IconChevronDownFill).withConfig({
|
|
42
42
|
componentId: "plasma-new-hope__sc-20ij9z-8"
|
|
43
43
|
})(["pointer-events:none;user-select:none;color:var(", ");"], _Accordion.tokens.accordionItemTextColor);
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.updatePropsRecursively = exports.getChildren = void 0;
|
|
7
|
+
var _react = /*#__PURE__*/require("react");
|
|
8
|
+
var updatePropsRecursively = exports.updatePropsRecursively = function updatePropsRecursively(children, activeIndex, updateValue) {
|
|
9
|
+
return _react.Children.map(children || [], function (child, index) {
|
|
10
|
+
if (! /*#__PURE__*/(0, _react.isValidElement)(child)) {
|
|
11
|
+
return child;
|
|
12
|
+
}
|
|
13
|
+
var props = {
|
|
14
|
+
index: index,
|
|
15
|
+
value: activeIndex === index,
|
|
16
|
+
updateValue: updateValue
|
|
17
|
+
};
|
|
18
|
+
return /*#__PURE__*/(0, _react.cloneElement)(child, props);
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
var getChildren = exports.getChildren = function getChildren(children, activeIndex, updateValue) {
|
|
22
|
+
return updatePropsRecursively(children, activeIndex, updateValue);
|
|
23
|
+
};
|
|
@@ -13,14 +13,14 @@ var config = exports.config = {
|
|
|
13
13
|
},
|
|
14
14
|
variations: {
|
|
15
15
|
view: {
|
|
16
|
-
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":20rem;", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":var(--surface-clear);"], _Accordion.accordionTokens.accordionGap, _Accordion.accordionTokens.accordionWidth, _Accordion.accordionTokens.accordionItemBackground, _Accordion.accordionTokens.accordionItemTitleColor, _Accordion.accordionTokens.accordionItemTextColor, _Accordion.accordionTokens.accordionItemFocus, _Accordion.accordionTokens.accordionBackground),
|
|
17
|
-
clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":0
|
|
16
|
+
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":20rem;", ":var(", ") var(", ");", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":var(--surface-clear);", ":0;"], _Accordion.accordionTokens.accordionGap, _Accordion.accordionTokens.accordionWidth, _Accordion.accordionTokens.accordionItemPadding, _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemBackground, _Accordion.accordionTokens.accordionItemTitleColor, _Accordion.accordionTokens.accordionItemTextColor, _Accordion.accordionTokens.accordionItemFocus, _Accordion.accordionTokens.accordionBackground, _Accordion.accordionTokens.accordionItemBorderBottom),
|
|
17
|
+
clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":0;", ":20rem;", ":var(", ") 0rem;", ":var(--surface-clear);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":0rem !important;", ":var(--surface-clear);", ":0.125rem solid var(--surface-solid-tertiary);"], _Accordion.accordionTokens.accordionGap, _Accordion.accordionTokens.accordionWidth, _Accordion.accordionTokens.accordionItemPadding, _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemBackground, _Accordion.accordionTokens.accordionItemTitleColor, _Accordion.accordionTokens.accordionItemTextColor, _Accordion.accordionTokens.accordionItemFocus, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionBackground, _Accordion.accordionTokens.accordionItemBorderBottom)
|
|
18
18
|
},
|
|
19
19
|
size: {
|
|
20
|
-
l: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.0625rem;", ":1.25rem;", ":
|
|
21
|
-
m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.875rem;", ":1.125rem;", ":0.
|
|
22
|
-
s: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.6875rem;", ":0.875rem;", ":0.
|
|
23
|
-
xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.5rem;", ":0.75rem;", ":0.
|
|
20
|
+
l: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.0625rem;", ":1.25rem;", ":0.5rem;", ":0.875rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemGap, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionItemTitleFontFamily, _Accordion.accordionTokens.accordionItemTitleFontSize, _Accordion.accordionTokens.accordionItemTitleFontStyle, _Accordion.accordionTokens.accordionItemTitleFontWeight, _Accordion.accordionTokens.accordionItemTitleLetterSpacing, _Accordion.accordionTokens.accordionItemTitleLineHeight, _Accordion.accordionTokens.accordionItemTextFontFamily, _Accordion.accordionTokens.accordionItemTextFontSize, _Accordion.accordionTokens.accordionItemTextFontStyle, _Accordion.accordionTokens.accordionItemTextFontWeight, _Accordion.accordionTokens.accordionItemTextLetterSpacing, _Accordion.accordionTokens.accordionItemTextLineHeight),
|
|
21
|
+
m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.875rem;", ":1.125rem;", ":0.375rem;", ":0.75rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemGap, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionItemTitleFontFamily, _Accordion.accordionTokens.accordionItemTitleFontSize, _Accordion.accordionTokens.accordionItemTitleFontStyle, _Accordion.accordionTokens.accordionItemTitleFontWeight, _Accordion.accordionTokens.accordionItemTitleLetterSpacing, _Accordion.accordionTokens.accordionItemTitleLineHeight, _Accordion.accordionTokens.accordionItemTextFontFamily, _Accordion.accordionTokens.accordionItemTextFontSize, _Accordion.accordionTokens.accordionItemTextFontStyle, _Accordion.accordionTokens.accordionItemTextFontWeight, _Accordion.accordionTokens.accordionItemTextLetterSpacing, _Accordion.accordionTokens.accordionItemTextLineHeight),
|
|
22
|
+
s: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.6875rem;", ":0.875rem;", ":0.375rem;", ":0.625rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemGap, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionItemTitleFontFamily, _Accordion.accordionTokens.accordionItemTitleFontSize, _Accordion.accordionTokens.accordionItemTitleFontStyle, _Accordion.accordionTokens.accordionItemTitleFontWeight, _Accordion.accordionTokens.accordionItemTitleLetterSpacing, _Accordion.accordionTokens.accordionItemTitleLineHeight, _Accordion.accordionTokens.accordionItemTextFontFamily, _Accordion.accordionTokens.accordionItemTextFontSize, _Accordion.accordionTokens.accordionItemTextFontStyle, _Accordion.accordionTokens.accordionItemTextFontWeight, _Accordion.accordionTokens.accordionItemTextLetterSpacing, _Accordion.accordionTokens.accordionItemTextLineHeight),
|
|
23
|
+
xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.5rem;", ":0.75rem;", ":0.25rem;", ":0.5rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemGap, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionItemTitleFontFamily, _Accordion.accordionTokens.accordionItemTitleFontSize, _Accordion.accordionTokens.accordionItemTitleFontStyle, _Accordion.accordionTokens.accordionItemTitleFontWeight, _Accordion.accordionTokens.accordionItemTitleLetterSpacing, _Accordion.accordionTokens.accordionItemTitleLineHeight, _Accordion.accordionTokens.accordionItemTextFontFamily, _Accordion.accordionTokens.accordionItemTextFontSize, _Accordion.accordionTokens.accordionItemTextFontStyle, _Accordion.accordionTokens.accordionItemTextFontWeight, _Accordion.accordionTokens.accordionItemTextLetterSpacing, _Accordion.accordionTokens.accordionItemTextLineHeight)
|
|
24
24
|
},
|
|
25
25
|
stretching: {
|
|
26
26
|
filled: /*#__PURE__*/(0, _styledComponents.css)([""]),
|
|
@@ -13,14 +13,14 @@ var config = exports.config = {
|
|
|
13
13
|
},
|
|
14
14
|
variations: {
|
|
15
15
|
view: {
|
|
16
|
-
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":20rem;", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":var(--surface-clear);"], _Accordion.accordionTokens.accordionGap, _Accordion.accordionTokens.accordionWidth, _Accordion.accordionTokens.accordionItemBackground, _Accordion.accordionTokens.accordionItemTitleColor, _Accordion.accordionTokens.accordionItemTextColor, _Accordion.accordionTokens.accordionItemFocus, _Accordion.accordionTokens.accordionBackground),
|
|
17
|
-
clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":20rem;", ":
|
|
16
|
+
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":20rem;", ":var(", ") var(", ");", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":var(--surface-clear);", ":0;"], _Accordion.accordionTokens.accordionGap, _Accordion.accordionTokens.accordionWidth, _Accordion.accordionTokens.accordionItemPadding, _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemBackground, _Accordion.accordionTokens.accordionItemTitleColor, _Accordion.accordionTokens.accordionItemTextColor, _Accordion.accordionTokens.accordionItemFocus, _Accordion.accordionTokens.accordionBackground, _Accordion.accordionTokens.accordionItemBorderBottom),
|
|
17
|
+
clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":20rem;", ":var(", ") 0rem;", ":var(--surface-clear);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":0rem !important;", ":var(--surface-clear);", ":0.125rem solid var(--surface-solid-tertiary);"], _Accordion.accordionTokens.accordionGap, _Accordion.accordionTokens.accordionWidth, _Accordion.accordionTokens.accordionItemPadding, _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemBackground, _Accordion.accordionTokens.accordionItemTitleColor, _Accordion.accordionTokens.accordionItemTextColor, _Accordion.accordionTokens.accordionItemFocus, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionBackground, _Accordion.accordionTokens.accordionItemBorderBottom)
|
|
18
18
|
},
|
|
19
19
|
size: {
|
|
20
|
-
l: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.0625rem;", ":1.25rem;", ":
|
|
21
|
-
m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.875rem;", ":1.125rem;", ":0.
|
|
22
|
-
s: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.6875rem;", ":0.875rem;", ":0.
|
|
23
|
-
xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.5rem;", ":0.75rem;", ":0.
|
|
20
|
+
l: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.0625rem;", ":1.25rem;", ":0.5rem;", ":0.875rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemGap, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionItemTitleFontFamily, _Accordion.accordionTokens.accordionItemTitleFontSize, _Accordion.accordionTokens.accordionItemTitleFontStyle, _Accordion.accordionTokens.accordionItemTitleFontWeight, _Accordion.accordionTokens.accordionItemTitleLetterSpacing, _Accordion.accordionTokens.accordionItemTitleLineHeight, _Accordion.accordionTokens.accordionItemTextFontFamily, _Accordion.accordionTokens.accordionItemTextFontSize, _Accordion.accordionTokens.accordionItemTextFontStyle, _Accordion.accordionTokens.accordionItemTextFontWeight, _Accordion.accordionTokens.accordionItemTextLetterSpacing, _Accordion.accordionTokens.accordionItemTextLineHeight),
|
|
21
|
+
m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.875rem;", ":1.125rem;", ":0.375rem;", ":0.75rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemGap, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionItemTitleFontFamily, _Accordion.accordionTokens.accordionItemTitleFontSize, _Accordion.accordionTokens.accordionItemTitleFontStyle, _Accordion.accordionTokens.accordionItemTitleFontWeight, _Accordion.accordionTokens.accordionItemTitleLetterSpacing, _Accordion.accordionTokens.accordionItemTitleLineHeight, _Accordion.accordionTokens.accordionItemTextFontFamily, _Accordion.accordionTokens.accordionItemTextFontSize, _Accordion.accordionTokens.accordionItemTextFontStyle, _Accordion.accordionTokens.accordionItemTextFontWeight, _Accordion.accordionTokens.accordionItemTextLetterSpacing, _Accordion.accordionTokens.accordionItemTextLineHeight),
|
|
22
|
+
s: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.6875rem;", ":0.875rem;", ":0.375rem;", ":0.625rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemGap, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionItemTitleFontFamily, _Accordion.accordionTokens.accordionItemTitleFontSize, _Accordion.accordionTokens.accordionItemTitleFontStyle, _Accordion.accordionTokens.accordionItemTitleFontWeight, _Accordion.accordionTokens.accordionItemTitleLetterSpacing, _Accordion.accordionTokens.accordionItemTitleLineHeight, _Accordion.accordionTokens.accordionItemTextFontFamily, _Accordion.accordionTokens.accordionItemTextFontSize, _Accordion.accordionTokens.accordionItemTextFontStyle, _Accordion.accordionTokens.accordionItemTextFontWeight, _Accordion.accordionTokens.accordionItemTextLetterSpacing, _Accordion.accordionTokens.accordionItemTextLineHeight),
|
|
23
|
+
xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.5rem;", ":0.75rem;", ":0.25rem;", ":0.5rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _Accordion.accordionTokens.accordionItemPaddingVertical, _Accordion.accordionTokens.accordionItemPaddingHorizontal, _Accordion.accordionTokens.accordionItemGap, _Accordion.accordionTokens.accordionItemBorderRadius, _Accordion.accordionTokens.accordionItemTitleFontFamily, _Accordion.accordionTokens.accordionItemTitleFontSize, _Accordion.accordionTokens.accordionItemTitleFontStyle, _Accordion.accordionTokens.accordionItemTitleFontWeight, _Accordion.accordionTokens.accordionItemTitleLetterSpacing, _Accordion.accordionTokens.accordionItemTitleLineHeight, _Accordion.accordionTokens.accordionItemTextFontFamily, _Accordion.accordionTokens.accordionItemTextFontSize, _Accordion.accordionTokens.accordionItemTextFontStyle, _Accordion.accordionTokens.accordionItemTextFontWeight, _Accordion.accordionTokens.accordionItemTextLetterSpacing, _Accordion.accordionTokens.accordionItemTextLineHeight)
|
|
24
24
|
},
|
|
25
25
|
stretching: {
|
|
26
26
|
filled: /*#__PURE__*/(0, _styledComponents.css)([""]),
|
|
@@ -530,4 +530,15 @@ Object.keys(_Range).forEach(function (key) {
|
|
|
530
530
|
return _Range[key];
|
|
531
531
|
}
|
|
532
532
|
});
|
|
533
|
+
});
|
|
534
|
+
var _Accordion = /*#__PURE__*/require("./components/Accordion");
|
|
535
|
+
Object.keys(_Accordion).forEach(function (key) {
|
|
536
|
+
if (key === "default" || key === "__esModule") return;
|
|
537
|
+
if (key in exports && exports[key] === _Accordion[key]) return;
|
|
538
|
+
Object.defineProperty(exports, key, {
|
|
539
|
+
enumerable: true,
|
|
540
|
+
get: function get() {
|
|
541
|
+
return _Accordion[key];
|
|
542
|
+
}
|
|
543
|
+
});
|
|
533
544
|
});
|
|
@@ -1,9 +1,16 @@
|
|
|
1
|
-
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
4
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
5
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import React, { Children, forwardRef, useMemo, useState } from 'react';
|
|
2
8
|
import { cx } from '../../utils';
|
|
3
9
|
import { base } from './Accordion.styles';
|
|
4
10
|
import { classes } from './Accordion.tokens';
|
|
5
11
|
import { base as viewCSS } from './variations/_view/base';
|
|
6
12
|
import { base as sizeCSS } from './variations/_size/base';
|
|
13
|
+
import { getChildren } from './utils';
|
|
7
14
|
export var accordionRoot = function accordionRoot(Root) {
|
|
8
15
|
return /*#__PURE__*/forwardRef(function (_ref, outerRootRef) {
|
|
9
16
|
var size = _ref.size,
|
|
@@ -11,14 +18,28 @@ export var accordionRoot = function accordionRoot(Root) {
|
|
|
11
18
|
_ref$stretching = _ref.stretching,
|
|
12
19
|
stretching = _ref$stretching === void 0 ? 'filled' : _ref$stretching,
|
|
13
20
|
children = _ref.children,
|
|
14
|
-
className = _ref.className
|
|
21
|
+
className = _ref.className,
|
|
22
|
+
once = _ref.once;
|
|
15
23
|
var stretchingClass = classes["".concat(stretching, "Stretching")];
|
|
24
|
+
var _useState = useState(),
|
|
25
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
26
|
+
activeIndex = _useState2[0],
|
|
27
|
+
setActiveIndex = _useState2[1];
|
|
28
|
+
var updateValue = function updateValue(index, value) {
|
|
29
|
+
value && setActiveIndex(index);
|
|
30
|
+
};
|
|
31
|
+
var childrenArray = useMemo(function () {
|
|
32
|
+
return Children.toArray(children);
|
|
33
|
+
}, [children]);
|
|
34
|
+
var childrenMemo = useMemo(function () {
|
|
35
|
+
return getChildren(childrenArray, activeIndex, updateValue);
|
|
36
|
+
}, [activeIndex, updateValue, childrenArray]);
|
|
16
37
|
return /*#__PURE__*/React.createElement(Root, {
|
|
17
38
|
ref: outerRootRef,
|
|
18
39
|
size: size,
|
|
19
40
|
view: view,
|
|
20
41
|
className: cx(stretchingClass, classes.accordionRoot, className)
|
|
21
|
-
}, children);
|
|
42
|
+
}, once ? childrenMemo : children);
|
|
22
43
|
});
|
|
23
44
|
};
|
|
24
45
|
export var accordionConfig = {
|
|
@@ -13,12 +13,12 @@ export var tokens = {
|
|
|
13
13
|
accordionBackground: '--plasma-accordion-background',
|
|
14
14
|
accordionItemBackground: '--plasma-accordion-item-background',
|
|
15
15
|
accordionItemBorderRadius: '--plasma-accordion-item-border-radius',
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
accordionItemPaddingLeft: '--plasma-accordion-item-padding-left',
|
|
16
|
+
accordionItemPadding: '--plasma-accordion-item-padding',
|
|
17
|
+
accordionItemPaddingVertical: '--plasma-accordion-item-padding-vertical',
|
|
18
|
+
accordionItemPaddingHorizontal: '--plasma-accordion-item-padding-horizontal',
|
|
20
19
|
accordionItemGap: '--plasma-accordion-item-gap',
|
|
21
20
|
accordionItemFocus: '--plasma-accordion-item-focus',
|
|
21
|
+
accordionItemBorderBottom: '--plasma-accordion-item-border-bottom',
|
|
22
22
|
accordionItemTitleColor: '--plasma-accordion-item-title-color',
|
|
23
23
|
accordionItemTitleFontFamily: '--plasma-accordion-item-title-font-family',
|
|
24
24
|
accordionItemTitleFontSize: '--plasma-accordion-item-title-font-size',
|
|
@@ -19,6 +19,9 @@ export var AccordionItem = function AccordionItem(_ref) {
|
|
|
19
19
|
body = _ref.body,
|
|
20
20
|
_ref$type = _ref.type,
|
|
21
21
|
type = _ref$type === void 0 ? 'sign' : _ref$type,
|
|
22
|
+
index = _ref.index,
|
|
23
|
+
eventKey = _ref.eventKey,
|
|
24
|
+
updateValue = _ref.updateValue,
|
|
22
25
|
onChangeValue = _ref.onChangeValue;
|
|
23
26
|
var _useState = useState(value),
|
|
24
27
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -30,7 +33,8 @@ export var AccordionItem = function AccordionItem(_ref) {
|
|
|
30
33
|
setLeftPadding = _useState4[1];
|
|
31
34
|
var showHandler = function showHandler() {
|
|
32
35
|
setShow(!show);
|
|
33
|
-
|
|
36
|
+
updateValue && updateValue(index, !show);
|
|
37
|
+
onChangeValue && onChangeValue(!show, eventKey);
|
|
34
38
|
};
|
|
35
39
|
var onKeyPress = function onKeyPress(event) {
|
|
36
40
|
event.persist();
|
|
@@ -41,10 +45,11 @@ export var AccordionItem = function AccordionItem(_ref) {
|
|
|
41
45
|
var leftContentRef = useRef(null);
|
|
42
46
|
useEffect(function () {
|
|
43
47
|
var _leftContentRef$curre, _leftContentRef$curre2;
|
|
48
|
+
setShow(value);
|
|
44
49
|
var leftContentWidth = (_leftContentRef$curre = leftContentRef === null || leftContentRef === void 0 || (_leftContentRef$curre2 = leftContentRef.current) === null || _leftContentRef$curre2 === void 0 ? void 0 : _leftContentRef$curre2.offsetWidth) !== null && _leftContentRef$curre !== void 0 ? _leftContentRef$curre : 0;
|
|
45
50
|
var leftPaddingBody = leftContentWidth ? "calc(".concat(leftContentWidth, "px + var(").concat(tokens.accordionItemGap, "))") : 0;
|
|
46
51
|
setLeftPadding(leftPaddingBody);
|
|
47
|
-
}, [type, leftContentRef, setLeftPadding]);
|
|
52
|
+
}, [value, type, leftContentRef, setLeftPadding]);
|
|
48
53
|
var showedBody = show ? classes.accordionItemShowBody : undefined;
|
|
49
54
|
var StyledAnimationPLus = function StyledAnimationPLus() {
|
|
50
55
|
return /*#__PURE__*/React.createElement(StyledPlus, null, _StyledMinus || (_StyledMinus = /*#__PURE__*/React.createElement(StyledMinus, {
|
|
@@ -56,7 +61,7 @@ export var AccordionItem = function AccordionItem(_ref) {
|
|
|
56
61
|
className: showedBody !== null && showedBody !== void 0 ? showedBody : classes.accordionPlusAnimationElement
|
|
57
62
|
}));
|
|
58
63
|
};
|
|
59
|
-
var accordionBorderRadius = convertRoundnessMatrix(pin, "var(".concat(tokens.accordionItemBorderRadius, ")"));
|
|
64
|
+
var accordionBorderRadius = convertRoundnessMatrix(pin, "var(".concat(tokens.accordionItemBorderRadius, ")"), '1.5rem');
|
|
60
65
|
var leftContent = contentLeft !== null && contentLeft !== void 0 ? contentLeft : type === 'arrow' ? _StyledArrow || (_StyledArrow = /*#__PURE__*/React.createElement(StyledArrow, {
|
|
61
66
|
size: "xs",
|
|
62
67
|
color: "inhert"
|
|
@@ -66,7 +71,9 @@ export var AccordionItem = function AccordionItem(_ref) {
|
|
|
66
71
|
var rightContentRotate = type === 'sign' && show ? classes.accordionItemShowBody : undefined;
|
|
67
72
|
return /*#__PURE__*/React.createElement(StyledAccordionItem, {
|
|
68
73
|
role: "tab",
|
|
74
|
+
className: classes.accordionItem,
|
|
69
75
|
tabIndex: 0,
|
|
76
|
+
key: eventKey,
|
|
70
77
|
style: {
|
|
71
78
|
borderRadius: accordionBorderRadius
|
|
72
79
|
},
|
|
@@ -4,7 +4,7 @@ import { classes, tokens } from '../../Accordion.tokens';
|
|
|
4
4
|
import { addFocus } from '../../../../mixins';
|
|
5
5
|
export var StyledAccordionItem = /*#__PURE__*/styled.div.withConfig({
|
|
6
6
|
componentId: "plasma-new-hope__sc-20ij9z-0"
|
|
7
|
-
})(["background:var(", ");&:focus{outline:none;}", ""], tokens.accordionItemBackground, /*#__PURE__*/addFocus({
|
|
7
|
+
})(["background:var(", ");border-bottom:var(", ");&:focus{outline:none;}", " &:last-child{border-bottom:none;}"], tokens.accordionItemBackground, tokens.accordionItemBorderBottom, /*#__PURE__*/addFocus({
|
|
8
8
|
outlineOffset: '0.125rem',
|
|
9
9
|
outlineSize: '0.125rem',
|
|
10
10
|
outlineRadius: '0',
|
|
@@ -12,7 +12,7 @@ export var StyledAccordionItem = /*#__PURE__*/styled.div.withConfig({
|
|
|
12
12
|
}));
|
|
13
13
|
export var StyledAccordionHeader = /*#__PURE__*/styled.div.withConfig({
|
|
14
14
|
componentId: "plasma-new-hope__sc-20ij9z-1"
|
|
15
|
-
})(["padding
|
|
15
|
+
})(["padding:var(", ");display:flex;gap:var(", ");justify-content:space-between;align-items:center;cursor:pointer;"], tokens.accordionItemPadding, tokens.accordionItemGap);
|
|
16
16
|
export var StyledAccordionHeaderLeft = /*#__PURE__*/styled.div.withConfig({
|
|
17
17
|
componentId: "plasma-new-hope__sc-20ij9z-2"
|
|
18
18
|
})(["display:flex;gap:var(", ");justify-content:space-between;align-items:center;"], tokens.accordionItemGap);
|
|
@@ -24,13 +24,13 @@ export var StyledAccordionContentLeft = /*#__PURE__*/styled.div.withConfig({
|
|
|
24
24
|
})(["transition:0.2s;display:flex;align-items:center;&&.", "{transition:0.2s;transform:rotate(180deg);}"], classes.accordionItemShowBody);
|
|
25
25
|
export var StyledAccordionTitle = /*#__PURE__*/styled.div.withConfig({
|
|
26
26
|
componentId: "plasma-new-hope__sc-20ij9z-5"
|
|
27
|
-
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");"], tokens.accordionItemTitleColor, tokens.
|
|
27
|
+
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");"], tokens.accordionItemTitleColor, tokens.accordionItemTitleFontFamily, tokens.accordionItemTitleFontSize, tokens.accordionItemTitleFontWeight, tokens.accordionItemTitleFontStyle, tokens.accordionItemTitleLetterSpacing, tokens.accordionItemTitleLineHeight);
|
|
28
28
|
export var StyledAccordionBodyAnimate = /*#__PURE__*/styled.div.withConfig({
|
|
29
29
|
componentId: "plasma-new-hope__sc-20ij9z-6"
|
|
30
|
-
})(["display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.2s ease-out;overflow:hidden;&&.", "{grid-template-rows:1fr;padding-bottom:var(", ");&.", "{transition:0.2s;transform:rotate(0deg);}}"], classes.accordionItemShowBody, tokens.
|
|
30
|
+
})(["display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.2s ease-out;overflow:hidden;&&.", "{grid-template-rows:1fr;padding-bottom:var(", ");&.", "{transition:0.2s;transform:rotate(0deg);}}"], classes.accordionItemShowBody, tokens.accordionItemPaddingVertical, classes.accordionPlusAnimationElement);
|
|
31
31
|
export var StyledAccordionBody = /*#__PURE__*/styled.div.withConfig({
|
|
32
32
|
componentId: "plasma-new-hope__sc-20ij9z-7"
|
|
33
|
-
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");overflow:hidden;padding-right:var(", ");padding-left:var(", ");"], tokens.accordionItemTextColor, tokens.
|
|
33
|
+
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");overflow:hidden;padding-right:var(", ");padding-left:var(", ");"], tokens.accordionItemTextColor, tokens.accordionItemTextFontFamily, tokens.accordionItemTextFontSize, tokens.accordionItemTextFontWeight, tokens.accordionItemTextFontStyle, tokens.accordionItemTextLetterSpacing, tokens.accordionItemTextLineHeight, tokens.accordionItemPaddingHorizontal, tokens.accordionItemPaddingHorizontal);
|
|
34
34
|
export var StyledArrow = /*#__PURE__*/styled(IconChevronDownFill).withConfig({
|
|
35
35
|
componentId: "plasma-new-hope__sc-20ij9z-8"
|
|
36
36
|
})(["pointer-events:none;user-select:none;color:var(", ");"], tokens.accordionItemTextColor);
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Children, cloneElement, isValidElement } from 'react';
|
|
2
|
+
export var updatePropsRecursively = function updatePropsRecursively(children, activeIndex, updateValue) {
|
|
3
|
+
return Children.map(children || [], function (child, index) {
|
|
4
|
+
if (! /*#__PURE__*/isValidElement(child)) {
|
|
5
|
+
return child;
|
|
6
|
+
}
|
|
7
|
+
var props = {
|
|
8
|
+
index: index,
|
|
9
|
+
value: activeIndex === index,
|
|
10
|
+
updateValue: updateValue
|
|
11
|
+
};
|
|
12
|
+
return /*#__PURE__*/cloneElement(child, props);
|
|
13
|
+
});
|
|
14
|
+
};
|
|
15
|
+
export var getChildren = function getChildren(children, activeIndex, updateValue) {
|
|
16
|
+
return updatePropsRecursively(children, activeIndex, updateValue);
|
|
17
|
+
};
|
|
@@ -7,14 +7,14 @@ export var config = {
|
|
|
7
7
|
},
|
|
8
8
|
variations: {
|
|
9
9
|
view: {
|
|
10
|
-
"default": /*#__PURE__*/css(["", ":0.125rem;", ":20rem;", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":var(--surface-clear);"], accordionTokens.accordionGap, accordionTokens.accordionWidth, accordionTokens.accordionItemBackground, accordionTokens.accordionItemTitleColor, accordionTokens.accordionItemTextColor, accordionTokens.accordionItemFocus, accordionTokens.accordionBackground),
|
|
11
|
-
clear: /*#__PURE__*/css(["", ":0
|
|
10
|
+
"default": /*#__PURE__*/css(["", ":0.125rem;", ":20rem;", ":var(", ") var(", ");", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":var(--surface-clear);", ":0;"], accordionTokens.accordionGap, accordionTokens.accordionWidth, accordionTokens.accordionItemPadding, accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemBackground, accordionTokens.accordionItemTitleColor, accordionTokens.accordionItemTextColor, accordionTokens.accordionItemFocus, accordionTokens.accordionBackground, accordionTokens.accordionItemBorderBottom),
|
|
11
|
+
clear: /*#__PURE__*/css(["", ":0;", ":20rem;", ":var(", ") 0rem;", ":var(--surface-clear);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":0rem !important;", ":var(--surface-clear);", ":0.125rem solid var(--surface-solid-tertiary);"], accordionTokens.accordionGap, accordionTokens.accordionWidth, accordionTokens.accordionItemPadding, accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemBackground, accordionTokens.accordionItemTitleColor, accordionTokens.accordionItemTextColor, accordionTokens.accordionItemFocus, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionBackground, accordionTokens.accordionItemBorderBottom)
|
|
12
12
|
},
|
|
13
13
|
size: {
|
|
14
|
-
l: /*#__PURE__*/css(["", ":1.0625rem;", ":1.25rem;", ":
|
|
15
|
-
m: /*#__PURE__*/css(["", ":0.875rem;", ":1.125rem;", ":0.
|
|
16
|
-
s: /*#__PURE__*/css(["", ":0.6875rem;", ":0.875rem;", ":0.
|
|
17
|
-
xs: /*#__PURE__*/css(["", ":0.5rem;", ":0.75rem;", ":0.
|
|
14
|
+
l: /*#__PURE__*/css(["", ":1.0625rem;", ":1.25rem;", ":0.5rem;", ":0.875rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemGap, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionItemTitleFontFamily, accordionTokens.accordionItemTitleFontSize, accordionTokens.accordionItemTitleFontStyle, accordionTokens.accordionItemTitleFontWeight, accordionTokens.accordionItemTitleLetterSpacing, accordionTokens.accordionItemTitleLineHeight, accordionTokens.accordionItemTextFontFamily, accordionTokens.accordionItemTextFontSize, accordionTokens.accordionItemTextFontStyle, accordionTokens.accordionItemTextFontWeight, accordionTokens.accordionItemTextLetterSpacing, accordionTokens.accordionItemTextLineHeight),
|
|
15
|
+
m: /*#__PURE__*/css(["", ":0.875rem;", ":1.125rem;", ":0.375rem;", ":0.75rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemGap, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionItemTitleFontFamily, accordionTokens.accordionItemTitleFontSize, accordionTokens.accordionItemTitleFontStyle, accordionTokens.accordionItemTitleFontWeight, accordionTokens.accordionItemTitleLetterSpacing, accordionTokens.accordionItemTitleLineHeight, accordionTokens.accordionItemTextFontFamily, accordionTokens.accordionItemTextFontSize, accordionTokens.accordionItemTextFontStyle, accordionTokens.accordionItemTextFontWeight, accordionTokens.accordionItemTextLetterSpacing, accordionTokens.accordionItemTextLineHeight),
|
|
16
|
+
s: /*#__PURE__*/css(["", ":0.6875rem;", ":0.875rem;", ":0.375rem;", ":0.625rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemGap, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionItemTitleFontFamily, accordionTokens.accordionItemTitleFontSize, accordionTokens.accordionItemTitleFontStyle, accordionTokens.accordionItemTitleFontWeight, accordionTokens.accordionItemTitleLetterSpacing, accordionTokens.accordionItemTitleLineHeight, accordionTokens.accordionItemTextFontFamily, accordionTokens.accordionItemTextFontSize, accordionTokens.accordionItemTextFontStyle, accordionTokens.accordionItemTextFontWeight, accordionTokens.accordionItemTextLetterSpacing, accordionTokens.accordionItemTextLineHeight),
|
|
17
|
+
xs: /*#__PURE__*/css(["", ":0.5rem;", ":0.75rem;", ":0.25rem;", ":0.5rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemGap, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionItemTitleFontFamily, accordionTokens.accordionItemTitleFontSize, accordionTokens.accordionItemTitleFontStyle, accordionTokens.accordionItemTitleFontWeight, accordionTokens.accordionItemTitleLetterSpacing, accordionTokens.accordionItemTitleLineHeight, accordionTokens.accordionItemTextFontFamily, accordionTokens.accordionItemTextFontSize, accordionTokens.accordionItemTextFontStyle, accordionTokens.accordionItemTextFontWeight, accordionTokens.accordionItemTextLetterSpacing, accordionTokens.accordionItemTextLineHeight)
|
|
18
18
|
},
|
|
19
19
|
stretching: {
|
|
20
20
|
filled: /*#__PURE__*/css([""]),
|
|
@@ -7,14 +7,14 @@ export var config = {
|
|
|
7
7
|
},
|
|
8
8
|
variations: {
|
|
9
9
|
view: {
|
|
10
|
-
"default": /*#__PURE__*/css(["", ":0.125rem;", ":20rem;", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":var(--surface-clear);"], accordionTokens.accordionGap, accordionTokens.accordionWidth, accordionTokens.accordionItemBackground, accordionTokens.accordionItemTitleColor, accordionTokens.accordionItemTextColor, accordionTokens.accordionItemFocus, accordionTokens.accordionBackground),
|
|
11
|
-
clear: /*#__PURE__*/css(["", ":0.125rem;", ":20rem;", ":
|
|
10
|
+
"default": /*#__PURE__*/css(["", ":0.125rem;", ":20rem;", ":var(", ") var(", ");", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":var(--surface-clear);", ":0;"], accordionTokens.accordionGap, accordionTokens.accordionWidth, accordionTokens.accordionItemPadding, accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemBackground, accordionTokens.accordionItemTitleColor, accordionTokens.accordionItemTextColor, accordionTokens.accordionItemFocus, accordionTokens.accordionBackground, accordionTokens.accordionItemBorderBottom),
|
|
11
|
+
clear: /*#__PURE__*/css(["", ":0.125rem;", ":20rem;", ":var(", ") 0rem;", ":var(--surface-clear);", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-accent);", ":0rem !important;", ":var(--surface-clear);", ":0.125rem solid var(--surface-solid-tertiary);"], accordionTokens.accordionGap, accordionTokens.accordionWidth, accordionTokens.accordionItemPadding, accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemBackground, accordionTokens.accordionItemTitleColor, accordionTokens.accordionItemTextColor, accordionTokens.accordionItemFocus, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionBackground, accordionTokens.accordionItemBorderBottom)
|
|
12
12
|
},
|
|
13
13
|
size: {
|
|
14
|
-
l: /*#__PURE__*/css(["", ":1.0625rem;", ":1.25rem;", ":
|
|
15
|
-
m: /*#__PURE__*/css(["", ":0.875rem;", ":1.125rem;", ":0.
|
|
16
|
-
s: /*#__PURE__*/css(["", ":0.6875rem;", ":0.875rem;", ":0.
|
|
17
|
-
xs: /*#__PURE__*/css(["", ":0.5rem;", ":0.75rem;", ":0.
|
|
14
|
+
l: /*#__PURE__*/css(["", ":1.0625rem;", ":1.25rem;", ":0.5rem;", ":0.875rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemGap, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionItemTitleFontFamily, accordionTokens.accordionItemTitleFontSize, accordionTokens.accordionItemTitleFontStyle, accordionTokens.accordionItemTitleFontWeight, accordionTokens.accordionItemTitleLetterSpacing, accordionTokens.accordionItemTitleLineHeight, accordionTokens.accordionItemTextFontFamily, accordionTokens.accordionItemTextFontSize, accordionTokens.accordionItemTextFontStyle, accordionTokens.accordionItemTextFontWeight, accordionTokens.accordionItemTextLetterSpacing, accordionTokens.accordionItemTextLineHeight),
|
|
15
|
+
m: /*#__PURE__*/css(["", ":0.875rem;", ":1.125rem;", ":0.375rem;", ":0.75rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemGap, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionItemTitleFontFamily, accordionTokens.accordionItemTitleFontSize, accordionTokens.accordionItemTitleFontStyle, accordionTokens.accordionItemTitleFontWeight, accordionTokens.accordionItemTitleLetterSpacing, accordionTokens.accordionItemTitleLineHeight, accordionTokens.accordionItemTextFontFamily, accordionTokens.accordionItemTextFontSize, accordionTokens.accordionItemTextFontStyle, accordionTokens.accordionItemTextFontWeight, accordionTokens.accordionItemTextLetterSpacing, accordionTokens.accordionItemTextLineHeight),
|
|
16
|
+
s: /*#__PURE__*/css(["", ":0.6875rem;", ":0.875rem;", ":0.375rem;", ":0.625rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemGap, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionItemTitleFontFamily, accordionTokens.accordionItemTitleFontSize, accordionTokens.accordionItemTitleFontStyle, accordionTokens.accordionItemTitleFontWeight, accordionTokens.accordionItemTitleLetterSpacing, accordionTokens.accordionItemTitleLineHeight, accordionTokens.accordionItemTextFontFamily, accordionTokens.accordionItemTextFontSize, accordionTokens.accordionItemTextFontStyle, accordionTokens.accordionItemTextFontWeight, accordionTokens.accordionItemTextLetterSpacing, accordionTokens.accordionItemTextLineHeight),
|
|
17
|
+
xs: /*#__PURE__*/css(["", ":0.5rem;", ":0.75rem;", ":0.25rem;", ":0.5rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], accordionTokens.accordionItemPaddingVertical, accordionTokens.accordionItemPaddingHorizontal, accordionTokens.accordionItemGap, accordionTokens.accordionItemBorderRadius, accordionTokens.accordionItemTitleFontFamily, accordionTokens.accordionItemTitleFontSize, accordionTokens.accordionItemTitleFontStyle, accordionTokens.accordionItemTitleFontWeight, accordionTokens.accordionItemTitleLetterSpacing, accordionTokens.accordionItemTitleLineHeight, accordionTokens.accordionItemTextFontFamily, accordionTokens.accordionItemTextFontSize, accordionTokens.accordionItemTextFontStyle, accordionTokens.accordionItemTextFontWeight, accordionTokens.accordionItemTextLetterSpacing, accordionTokens.accordionItemTextLineHeight)
|
|
18
18
|
},
|
|
19
19
|
stretching: {
|
|
20
20
|
filled: /*#__PURE__*/css([""]),
|
|
@@ -47,4 +47,5 @@ export * from './components/Select';
|
|
|
47
47
|
export * from './components/Divider';
|
|
48
48
|
export * from './components/Toolbar';
|
|
49
49
|
export * from './components/Slider';
|
|
50
|
-
export * from './components/Range';
|
|
50
|
+
export * from './components/Range';
|
|
51
|
+
export * from './components/Accordion';
|