@salutejs/plasma-new-hope 0.170.0-canary.1459.11367029149.0 → 0.170.0-canary.1484.11368065603.0

package/emotion/es/examples/plasma_web/components/TextField/TextField.stories.tsx

@@ -4,8 +4,7 @@ import { action } from '@storybook/addon-actions';
 import { IconPlaceholder } from '@salutejs/plasma-sb-utils';
 
 import { WithTheme } from '../../../_helpers';
-import { IconCross } from '../../../../components/_Icon';
-import type { PopoverPlacement } from '../Popover/Popover';
+import { IconChevronLeft } from '../../../../components/_Icon';
 
 import { TextField } from './TextField';
 
@@ -17,29 +16,7 @@ const onChipsChange = action('onChipsChange');
 
 const sizes = ['l', 'm', 's', 'xs'];
 const views = ['default', 'positive', 'warning', 'negative'];
-const hintViews = ['default', 'onDark', 'onLight'];
-const hintSizes = ['m', 's'];
-const hintTriggers = ['hover', 'click'];
 const labelPlacements = ['outer', 'inner'];
-const placements: Array<PopoverPlacement> = [
-    'top',
-    'top-start',
-    'top-end',
-
-    'bottom',
-    'bottom-start',
-    'bottom-end',
-
-    'left',
-    'left-start',
-    'left-end',
-
-    'right',
-    'right-start',
-    'right-end',
-
-    'auto',
-];
 
 const meta: Meta<typeof TextField> = {
     title: 'plasma_web/TextField',
@@ -93,46 +70,6 @@ const meta: Meta<typeof TextField> = {
                 type: 'inline-radio',
             },
         },
-        hintText: {
-            control: { type: 'text' },
-        },
-        hintView: {
-            options: hintViews,
-            control: {
-                type: 'select',
-            },
-            if: { arg: 'hintText', neq: '' },
-        },
-        hintSize: {
-            options: hintSizes,
-            control: {
-                type: 'select',
-            },
-            if: { arg: 'hintText', neq: '' },
-        },
-        hintTrigger: {
-            options: hintTriggers,
-            control: {
-                type: 'inline-radio',
-            },
-            if: { arg: 'hintText', neq: '' },
-        },
-        hintPlacement: {
-            options: placements,
-            control: {
-                type: 'select',
-            },
-            if: { arg: 'hintText', neq: '' },
-            mappers: placements,
-        },
-        hintHasArrow: {
-            control: { type: 'boolean' },
-            if: { arg: 'hintText', neq: '' },
-        },
-        hintWidth: {
-            control: { type: 'text' },
-            if: { arg: 'hintText', neq: '' },
-        },
     },
 };
 
@@ -168,13 +105,13 @@ const StoryDemo = ({ enableContentLeft, enableContentRight, view, ...rest }: Sto
     const iconSize = rest.size === 'xs' ? 'xs' : 's';
 
     return (
-        <div style={{ display: 'flex', flexDirection: 'column', gap: '2rem', width: '70%', margin: '0 auto' }}>
+        <div style={{ display: 'flex', flexDirection: 'column', gap: '2rem' }}>
             <TextField
                 {...rest}
                 enumerationType="plain"
                 value={text}
-                contentLeft={enableContentLeft ? <IconCross color="inherit" size={iconSize} /> : undefined}
-                contentRight={enableContentRight ? <IconCross color="inherit" size={iconSize} /> : undefined}
+                contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
+                contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
                 view={view}
                 onChange={(e) => {
                     setText(e.target.value);
@@ -208,27 +145,17 @@ export const Default: StoryObj<StoryPropsDefault> = {
         view: 'default',
         label: 'Лейбл',
         labelPlacement: 'outer',
-        titleCaption: 'Подпись к полю',
-        textBefore: '',
-        textAfter: '',
         placeholder: 'Заполните поле',
         leftHelper: 'Подсказка к полю',
         disabled: false,
         readOnly: false,
+        required: false,
+        requiredPlacement: 'right',
+        optional: false,
         enableContentLeft: true,
         enableContentRight: true,
         clear: false,
         hasDivider: false,
-        optional: false,
-        required: false,
-        requiredPlacement: 'right',
-        hintText: 'Текст подсказки',
-        hintTrigger: 'hover',
-        hintView: 'default',
-        hintSize: 'm',
-        hintPlacement: 'auto',
-        hintWidth: '10rem',
-        hintHasArrow: true,
     },
     render: (args) => <StoryDemo {...args} />,
 };
@@ -249,6 +176,8 @@ type StoryPropsChips = Omit<
     | 'checked'
     | 'maxLength'
     | 'minLength'
+    | 'required'
+    | 'optional'
     | 'enumerationType'
 > & {
     enableContentLeft: boolean;
@@ -265,7 +194,7 @@ const StoryChips = ({ enableContentLeft, enableContentRight, view, ...rest }: St
             {...rest}
             enumerationType="chip"
             value={text}
-            contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
+            contentLeft={enableContentLeft ? <IconChevronLeft color="inherit" size={iconSize} /> : undefined}
             contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
             view={view}
             onChange={(e) => {
@@ -275,7 +204,6 @@ const StoryChips = ({ enableContentLeft, enableContentRight, view, ...rest }: St
             onFocus={onFocus}
             onBlur={onBlur}
             onChangeChips={onChipsChange}
-            style={{ width: '70%', margin: '0 auto' }}
         />
     );
 };

package/es/components/Accordion/ui/AccordionItem/AccordionItem.css

@@ -1,13 +1,14 @@
 .IconRoot_7pl7ig_svvlqhf__32c458a1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:var(--svvlqhf-0);height:var(--svvlqhf-0);-webkit-flex:0 0 var(--svvlqhf-0);-ms-flex:0 0 var(--svvlqhf-0);flex:0 0 var(--svvlqhf-0);}
 
-.AccordionItem_styles_aus2x3_s1d847tf__94808ef4{background:var(--plasma-accordion-item-background);border:var(--plasma-accordion-item-border);border-bottom:var(--plasma-accordion-item-border-bottom);}.AccordionItem_styles_aus2x3_s1d847tf__94808ef4:last-child{border-bottom:var(--plasma-accordion-item-border);}.AccordionItem_styles_aus2x3_s1d847tf__94808ef4.AccordionItem_styles_aus2x3_accordionDisabled__94808ef4{opacity:0.4;cursor:not-allowed;}
-.AccordionItem_styles_aus2x3_s18inj31__94808ef4{width:100%;border:none;padding:var(--plasma-accordion-item-padding);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-accordion-item-gap);-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;box-sizing:border-box;cursor:pointer;position:relative;}.AccordionItem_styles_aus2x3_s18inj31__94808ef4:focus{outline:none;}.AccordionItem_styles_aus2x3_s18inj31__94808ef4::before{content:'';position:absolute;top:0.125rem;left:0.125rem;right:0.125rem;bottom:0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:0;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.AccordionItem_styles_aus2x3_s18inj31__94808ef4.AccordionItem_styles_aus2x3_focusVisible__94808ef4:focus::before,.AccordionItem_styles_aus2x3_s18inj31__94808ef4[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-accordion-item-focus);}
-.AccordionItem_styles_aus2x3_s1kvo44v__94808ef4{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-accordion-item-gap);-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
-.AccordionItem_styles_aus2x3_s2tqnbp__94808ef4{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.AccordionItem_styles_aus2x3_s2tqnbp__94808ef4.AccordionItem_styles_aus2x3_accordionItemShowBody__94808ef4{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
-.AccordionItem_styles_aus2x3_s11daj3x__94808ef4{-webkit-transition:0.2s;transition:0.2s;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.AccordionItem_styles_aus2x3_s11daj3x__94808ef4.AccordionItem_styles_aus2x3_accordionItemShowBody__94808ef4{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}
-.AccordionItem_styles_aus2x3_sy09zp7__94808ef4{color:var(--plasma-accordion-item-title-color);font-family:var(--plasma-accordion-item-title-font-family);font-size:var(--plasma-accordion-item-title-font-size);font-weight:var(--plasma-accordion-item-title-font-weight);font-style:var(--plasma-accordion-item-title-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);letter-spacing:var(--plasma-accordion-item-title-letter-spacing);line-height:var(--plasma-accordion-item-title-line-height);text-align:left;}
-.AccordionItem_styles_aus2x3_sbzgv9z__94808ef4{display:grid;grid-template-rows:0fr;-webkit-transition:grid-template-rows 0.2s ease-out;transition:grid-template-rows 0.2s ease-out;overflow:hidden;}.AccordionItem_styles_aus2x3_sbzgv9z__94808ef4.AccordionItem_styles_aus2x3_accordionItemShowBody__94808ef4{grid-template-rows:1fr;padding-bottom:var(--plasma-accordion-item-padding-vertical);}.AccordionItem_styles_aus2x3_sbzgv9z__94808ef4.AccordionItem_styles_aus2x3_accordionItemShowBody__94808ef4.AccordionItem_styles_aus2x3_accordionPlusAnimationElement__94808ef4{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
-.AccordionItem_styles_aus2x3_s1ewkyyv__94808ef4{color:var(--plasma-accordion-item-text-color);font-family:var(--plasma-accordion-item-text-font-family);font-size:var(--plasma-accordion-item-text-font-size);font-weight:var(--plasma-accordion-item-text-font-weight);font-style:var(--plasma-accordion-item-text-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);letter-spacing:var(--plasma-accordion-item-text-letter-spacing);line-height:var(--plasma-accordion-item-text-line-height);overflow:hidden;padding-right:var(--plasma-accordion-item-padding-horizontal);padding-left:var(--plasma-accordion-item-padding-horizontal-left);text-align:left;}
-.AccordionItem_styles_aus2x3_s15qiue1__94808ef4{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);}
-.AccordionItem_styles_aus2x3_syldew1__94808ef4{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;}.AccordionItem_styles_aus2x3_syldew1__94808ef4.AccordionItem_styles_aus2x3_accordionPlusAnimationElement__94808ef4{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.AccordionItem_styles_aus2x3_syldew1__94808ef4.AccordionItem_styles_aus2x3_accordionItemShowBody__94808ef4{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
-.AccordionItem_styles_aus2x3_s1he8scv__94808ef4{position:relative;height:1rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:1rem;}
+.AccordionItem_styles_t0tdpe_s1d847tf__c045d912{background:var(--plasma-accordion-item-background);border:var(--plasma-accordion-item-border);border-bottom:var(--plasma-accordion-item-border-bottom);}.AccordionItem_styles_t0tdpe_s1d847tf__c045d912:last-child{border-bottom:var(--plasma-accordion-item-border);}.AccordionItem_styles_t0tdpe_s1d847tf__c045d912.AccordionItem_styles_t0tdpe_accordionDisabled__c045d912{opacity:0.4;cursor:not-allowed;}
+.AccordionItem_styles_t0tdpe_s18inj31__c045d912{width:100%;border:none;padding:var(--plasma-accordion-item-padding);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-accordion-item-gap);-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;box-sizing:border-box;cursor:pointer;position:relative;}.AccordionItem_styles_t0tdpe_s18inj31__c045d912:focus{outline:none;}.AccordionItem_styles_t0tdpe_s18inj31__c045d912::before{content:'';position:absolute;top:0.125rem;left:0.125rem;right:0.125rem;bottom:0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:0;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.AccordionItem_styles_t0tdpe_s18inj31__c045d912.AccordionItem_styles_t0tdpe_focusVisible__c045d912:focus::before,.AccordionItem_styles_t0tdpe_s18inj31__c045d912[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-accordion-item-focus);}
+.AccordionItem_styles_t0tdpe_s1kvo44v__c045d912{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-accordion-item-gap);-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
+.AccordionItem_styles_t0tdpe_s2tqnbp__c045d912{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.AccordionItem_styles_t0tdpe_s2tqnbp__c045d912.AccordionItem_styles_t0tdpe_accordionItemShowBody__c045d912{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
+.AccordionItem_styles_t0tdpe_s11daj3x__c045d912{margin-top:calc(0px - var(--plasma-accordion-item-padding-vertical));margin-right:calc(0px - var(--plasma-accordion-item-padding-horizontal-left));margin-bottom:calc(0px - var(--plasma-accordion-item-padding-vertical));}
+.AccordionItem_styles_t0tdpe_sy09zp7__c045d912{-webkit-transition:0.2s;transition:0.2s;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.AccordionItem_styles_t0tdpe_sy09zp7__c045d912.AccordionItem_styles_t0tdpe_accordionItemShowBody__c045d912{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}
+.AccordionItem_styles_t0tdpe_sbzgv9z__c045d912{color:var(--plasma-accordion-item-title-color);font-family:var(--plasma-accordion-item-title-font-family);font-size:var(--plasma-accordion-item-title-font-size);font-weight:var(--plasma-accordion-item-title-font-weight);font-style:var(--plasma-accordion-item-title-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);letter-spacing:var(--plasma-accordion-item-title-letter-spacing);line-height:var(--plasma-accordion-item-title-line-height);text-align:left;}
+.AccordionItem_styles_t0tdpe_s1ewkyyv__c045d912{display:grid;grid-template-rows:0fr;-webkit-transition:grid-template-rows 0.2s ease-out;transition:grid-template-rows 0.2s ease-out;overflow:hidden;}.AccordionItem_styles_t0tdpe_s1ewkyyv__c045d912.AccordionItem_styles_t0tdpe_accordionItemShowBody__c045d912{grid-template-rows:1fr;padding-bottom:var(--plasma-accordion-item-padding-vertical);}.AccordionItem_styles_t0tdpe_s1ewkyyv__c045d912.AccordionItem_styles_t0tdpe_accordionItemShowBody__c045d912.AccordionItem_styles_t0tdpe_accordionPlusAnimationElement__c045d912{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
+.AccordionItem_styles_t0tdpe_s15qiue1__c045d912{color:var(--plasma-accordion-item-text-color);font-family:var(--plasma-accordion-item-text-font-family);font-size:var(--plasma-accordion-item-text-font-size);font-weight:var(--plasma-accordion-item-text-font-weight);font-style:var(--plasma-accordion-item-text-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);letter-spacing:var(--plasma-accordion-item-text-letter-spacing);line-height:var(--plasma-accordion-item-text-line-height);overflow:hidden;padding-right:var(--plasma-accordion-item-padding-horizontal);padding-left:var(--plasma-accordion-item-padding-horizontal-left);text-align:left;}
+.AccordionItem_styles_t0tdpe_syldew1__c045d912{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);}
+.AccordionItem_styles_t0tdpe_s1he8scv__c045d912{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;}.AccordionItem_styles_t0tdpe_s1he8scv__c045d912.AccordionItem_styles_t0tdpe_accordionPlusAnimationElement__c045d912{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.AccordionItem_styles_t0tdpe_s1he8scv__c045d912.AccordionItem_styles_t0tdpe_accordionItemShowBody__c045d912{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
+.AccordionItem_styles_t0tdpe_s1c2l4h5__c045d912{position:relative;height:1rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:1rem;}

package/es/components/Accordion/ui/AccordionItem/AccordionItem.js

@@ -1,12 +1,12 @@
 import { slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2 } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
-import React, { useState, useRef, useEffect } from 'react';
+import React, { forwardRef, useState, useRef, useEffect } from 'react';
 import { convertRoundnessMatrix } from '../../../../utils/roundness.js';
 import { classes, tokens } from '../../Accordion.tokens.js';
 import { cx } from '../../../../utils/index.js';
-import { StyledAccordionItem, StyledAccordionHeader, StyledAccordionHeaderLeft, StyledAccordionContentLeft, StyledAccordionTitle, StyledAccordionContentRight, StyledAccordionBodyAnimate, StyledAccordionBody, StyledArrow, StyledPlus, StyledMinus } from './AccordionItem.styles.js';
+import { StyledAccordionItem, StyledAccordionHeader, StyledAccordionHeaderLeft, StyledAccordionContentLeft, StyledAccordionTitle, StyledAccordionContentRightDefault, StyledAccordionContentRight, StyledAccordionBodyAnimate, StyledAccordionBody, StyledArrow, StyledPlus, StyledMinus } from './AccordionItem.styles.js';
 
 var _StyledMinus, _StyledArrow;
-var AccordionItem = function AccordionItem(_ref) {
+var AccordionItem = /*#__PURE__*/forwardRef(function (_ref, outerRef) {
   var _ref2;
   var value = _ref.value,
     contentRight = _ref.contentRight,
@@ -24,6 +24,7 @@ var AccordionItem = function AccordionItem(_ref) {
     disabled = _ref.disabled,
     _ref$alignWithTitle = _ref.alignWithTitle,
     alignWithTitle = _ref$alignWithTitle === void 0 ? true : _ref$alignWithTitle,
+    opened = _ref.opened,
     view = _ref.view,
     onChange = _ref.onChange;
   var key = (_ref2 = eventKey !== null && eventKey !== void 0 ? eventKey : index) !== null && _ref2 !== void 0 ? _ref2 : 0;
@@ -46,11 +47,11 @@ var AccordionItem = function AccordionItem(_ref) {
     var leftPaddingBody = leftContentWidth && (alignWithTitle || view === 'clear') ? "calc(".concat(leftContentWidth, "px + var(").concat(tokens.accordionItemGap, "))") : 0;
     setLeftPadding(leftPaddingBody);
   }, [value, type, leftContentRef, setLeftPadding]);
-  var openedBodyClass = value ? classes.accordionItemShowBody : undefined;
-  var StyledAnimationPLus = function StyledAnimationPLus() {
+  var openedBodyClass = (opened !== null && opened !== void 0 ? opened : value) ? classes.accordionItemShowBody : undefined;
+  var StyledAnimationPlus = function StyledAnimationPlus() {
     return /*#__PURE__*/React.createElement(StyledPlus, null, _StyledMinus || (_StyledMinus = /*#__PURE__*/React.createElement(StyledMinus, {
       size: "xs",
-      color: "inhert"
+      color: "inherit"
     })), /*#__PURE__*/React.createElement(StyledMinus, {
       size: "xs",
       color: "inhert",
@@ -61,14 +62,15 @@ var AccordionItem = function AccordionItem(_ref) {
   var disabledClass = disabled ? classes.accordionDisabled : '';
   var leftContent = contentLeft !== null && contentLeft !== void 0 ? contentLeft : type === 'arrow' ? _StyledArrow || (_StyledArrow = /*#__PURE__*/React.createElement(StyledArrow, {
     size: "xs",
-    color: "inhert"
+    color: "inherit"
   })) : undefined;
   var leftContentRotate = type === 'arrow' && value ? classes.accordionItemShowBody : undefined;
-  var rightContent = contentRight !== null && contentRight !== void 0 ? contentRight : type === 'sign' ? /*#__PURE__*/React.createElement(StyledAnimationPLus, null) : undefined;
+  var rightContent = contentRight !== null && contentRight !== void 0 ? contentRight : type === 'sign' ? /*#__PURE__*/React.createElement(StyledAnimationPlus, null) : undefined;
   var rightContentRotate = type === 'sign' && value ? classes.accordionItemShowBody : undefined;
   return /*#__PURE__*/React.createElement(StyledAccordionItem, {
     className: cx(classes.accordionItem, className, disabledClass),
     key: key,
+    ref: outerRef,
     style: _objectSpread2({
       borderRadius: accordionBorderRadius
     }, style)
@@ -82,7 +84,7 @@ var AccordionItem = function AccordionItem(_ref) {
   }, /*#__PURE__*/React.createElement(StyledAccordionHeaderLeft, null, leftContent && /*#__PURE__*/React.createElement(StyledAccordionContentLeft, {
     ref: leftContentRef,
     className: leftContentRotate
-  }, leftContent), /*#__PURE__*/React.createElement(StyledAccordionTitle, null, title)), /*#__PURE__*/React.createElement(StyledAccordionContentRight, {
+  }, leftContent), /*#__PURE__*/React.createElement(StyledAccordionTitle, null, title)), contentRight ? /*#__PURE__*/React.createElement(StyledAccordionContentRightDefault, null, contentRight) : /*#__PURE__*/React.createElement(StyledAccordionContentRight, {
     className: rightContentRotate
   }, rightContent && rightContent)), /*#__PURE__*/React.createElement(StyledAccordionBodyAnimate, {
     "aria-labelledby": "accordion-item-".concat(key),
@@ -95,7 +97,7 @@ var AccordionItem = function AccordionItem(_ref) {
   }, /*#__PURE__*/React.createElement(StyledAccordionBody, {
     className: classes.accordionItemBody
   }, children)));
-};
+});
 
 export { AccordionItem };
 //# sourceMappingURL=AccordionItem.js.map

package/es/components/Accordion/ui/AccordionItem/AccordionItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.js","sources":["../../../../../src/components/Accordion/ui/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\n\nimport { convertRoundnessMatrix } from '../../../../utils/roundness';\nimport { classes, tokens } from '../../Accordion.tokens';\nimport { cx } from '../../../../utils';\n\nimport {\n    StyledAccordionItem,\n    StyledAccordionHeader,\n    StyledAccordionBody,\n    StyledAccordionTitle,\n    StyledAccordionContentLeft,\n    StyledAccordionHeaderLeft,\n    StyledAccordionContentRight,\n    StyledArrow,\n    StyledMinus,\n    StyledPlus,\n    StyledAccordionBodyAnimate,\n} from './AccordionItem.styles';\nimport type { AccordionItemProps } from './AccordionItem.types';\n\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n    value,\n    contentRight,\n    contentLeft,\n    title,\n    pin = 'square-square',\n    children,\n    type = 'sign',\n    index,\n    className,\n    style,\n    eventKey,\n    disabled,\n    alignWithTitle = true,\n    view,\n    onChange,\n}) => {\n    const key = eventKey ?? index ?? 0;\n\n    const [leftPadding, setLeftPadding] = useState<string | number | null>();\n\n    const handleOpen = () => {\n        if (disabled) {\n            return;\n        }\n        if (onChange) {\n            onChange(key, !value);\n        }\n    };\n\n    const leftContentRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        const leftContentWidth = leftContentRef?.current?.offsetWidth ?? 0;\n        const leftPaddingBody =\n            leftContentWidth && (alignWithTitle || view === 'clear')\n                ? `calc(${leftContentWidth}px + var(${tokens.accordionItemGap}))`\n                : 0;\n        setLeftPadding(leftPaddingBody);\n    }, [value, type, leftContentRef, setLeftPadding]);\n\n    const openedBodyClass = value ? classes.accordionItemShowBody : undefined;\n\n    const StyledAnimationPLus = () => (\n        <StyledPlus>\n            <StyledMinus size=\"xs\" color=\"inhert\" />\n            <StyledMinus\n                size=\"xs\"\n                color=\"inhert\"\n                className={openedBodyClass ?? classes.accordionPlusAnimationElement}\n            />\n        </StyledPlus>\n    );\n\n    const accordionBorderRadius = convertRoundnessMatrix(pin, `var(${tokens.accordionItemBorderRadius})`, '1.5rem');\n    const disabledClass = disabled ? classes.accordionDisabled : '';\n\n    const leftContent = contentLeft ?? (type === 'arrow' ? <StyledArrow size=\"xs\" color=\"inhert\" /> : undefined);\n    const leftContentRotate = type === 'arrow' && value ? classes.accordionItemShowBody : undefined;\n\n    const rightContent = contentRight ?? (type === 'sign' ? <StyledAnimationPLus /> : undefined);\n    const rightContentRotate = type === 'sign' && value ? classes.accordionItemShowBody : undefined;\n\n    return (\n        <StyledAccordionItem\n            className={cx(classes.accordionItem, className, disabledClass)}\n            key={key}\n            style={{ borderRadius: accordionBorderRadius, ...style }}\n        >\n            <StyledAccordionHeader\n                role=\"tab\"\n                tabIndex={0}\n                onClick={handleOpen}\n                aria-expanded={value}\n                aria-controls={`accordion-item-section${key}`}\n                id={`accordion-item-${key}`}\n            >\n                <StyledAccordionHeaderLeft>\n                    {leftContent && (\n                        <StyledAccordionContentLeft ref={leftContentRef} className={leftContentRotate}>\n                            {leftContent}\n                        </StyledAccordionContentLeft>\n                    )}\n                    <StyledAccordionTitle>{title}</StyledAccordionTitle>\n                </StyledAccordionHeaderLeft>\n\n                <StyledAccordionContentRight className={rightContentRotate}>\n                    {rightContent && rightContent}\n                </StyledAccordionContentRight>\n            </StyledAccordionHeader>\n            <StyledAccordionBodyAnimate\n                aria-labelledby={`accordion-item-${key}`}\n                aria-hidden={!value}\n                id={`accordion-item-section${key}`}\n                className={cx(openedBodyClass)}\n                style={{ paddingLeft: `${leftPadding}` }}\n            >\n                <StyledAccordionBody className={classes.accordionItemBody}>{children}</StyledAccordionBody>\n            </StyledAccordionBodyAnimate>\n        </StyledAccordionItem>\n    );\n};\n"],"names":["AccordionItem","_ref","_ref2","value","contentRight","contentLeft","title","_ref$pin","pin","children","_ref$type","type","index","className","style","eventKey","disabled","_ref$alignWithTitle","alignWithTitle","view","onChange","key","_useState","useState","_useState2","_slicedToArray","leftPadding","setLeftPadding","handleOpen","leftContentRef","useRef","useEffect","_leftContentRef$curre","_leftContentRef$curre2","leftContentWidth","current","offsetWidth","leftPaddingBody","concat","tokens","accordionItemGap","openedBodyClass","classes","accordionItemShowBody","undefined","StyledAnimationPLus","React","createElement","StyledPlus","_StyledMinus","StyledMinus","size","color","accordionPlusAnimationElement","accordionBorderRadius","convertRoundnessMatrix","accordionItemBorderRadius","disabledClass","accordionDisabled","leftContent","_StyledArrow","StyledArrow","leftContentRotate","rightContent","rightContentRotate","StyledAccordionItem","cx","accordionItem","_objectSpread","borderRadius","StyledAccordionHeader","role","tabIndex","onClick","id","StyledAccordionHeaderLeft","StyledAccordionContentLeft","ref","StyledAccordionTitle","StyledAccordionContentRight","StyledAccordionBodyAnimate","paddingLeft","StyledAccordionBody","accordionItemBody"],"mappings":"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"}
+{"version":3,"file":"AccordionItem.js","sources":["../../../../../src/components/Accordion/ui/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import React, { useState, useRef, forwardRef, useEffect } from 'react';\n\nimport { convertRoundnessMatrix } from '../../../../utils/roundness';\nimport { classes, tokens } from '../../Accordion.tokens';\nimport { cx } from '../../../../utils';\n\nimport {\n    StyledAccordionItem,\n    StyledAccordionHeader,\n    StyledAccordionBody,\n    StyledAccordionTitle,\n    StyledAccordionContentLeft,\n    StyledAccordionHeaderLeft,\n    StyledAccordionContentRight,\n    StyledArrow,\n    StyledMinus,\n    StyledPlus,\n    StyledAccordionBodyAnimate,\n    StyledAccordionContentRightDefault,\n} from './AccordionItem.styles';\nimport type { AccordionItemProps } from './AccordionItem.types';\n\nexport const AccordionItem = forwardRef<HTMLDivElement, AccordionItemProps>(\n    (\n        {\n            value,\n            contentRight,\n            contentLeft,\n            title,\n            pin = 'square-square',\n            children,\n            type = 'sign',\n            index,\n            className,\n            style,\n            eventKey,\n            disabled,\n            alignWithTitle = true,\n            opened,\n            view,\n            onChange,\n        },\n        outerRef,\n    ) => {\n        const key = eventKey ?? index ?? 0;\n\n        const [leftPadding, setLeftPadding] = useState<string | number | null>();\n\n        const handleOpen = () => {\n            if (disabled) {\n                return;\n            }\n            if (onChange) {\n                onChange(key, !value);\n            }\n        };\n\n        const leftContentRef = useRef<HTMLDivElement>(null);\n\n        useEffect(() => {\n            const leftContentWidth = leftContentRef?.current?.offsetWidth ?? 0;\n            const leftPaddingBody =\n                leftContentWidth && (alignWithTitle || view === 'clear')\n                    ? `calc(${leftContentWidth}px + var(${tokens.accordionItemGap}))`\n                    : 0;\n            setLeftPadding(leftPaddingBody);\n        }, [value, type, leftContentRef, setLeftPadding]);\n\n        const openedBodyClass = opened ?? value ? classes.accordionItemShowBody : undefined;\n\n        const StyledAnimationPlus = () => (\n            <StyledPlus>\n                <StyledMinus size=\"xs\" color=\"inherit\" />\n                <StyledMinus\n                    size=\"xs\"\n                    color=\"inhert\"\n                    className={openedBodyClass ?? classes.accordionPlusAnimationElement}\n                />\n            </StyledPlus>\n        );\n\n        const accordionBorderRadius = convertRoundnessMatrix(pin, `var(${tokens.accordionItemBorderRadius})`, '1.5rem');\n        const disabledClass = disabled ? classes.accordionDisabled : '';\n\n        const leftContent = contentLeft ?? (type === 'arrow' ? <StyledArrow size=\"xs\" color=\"inherit\" /> : undefined);\n        const leftContentRotate = type === 'arrow' && value ? classes.accordionItemShowBody : undefined;\n\n        const rightContent = contentRight ?? (type === 'sign' ? <StyledAnimationPlus /> : undefined);\n        const rightContentRotate = type === 'sign' && value ? classes.accordionItemShowBody : undefined;\n\n        return (\n            <StyledAccordionItem\n                className={cx(classes.accordionItem, className, disabledClass)}\n                key={key}\n                ref={outerRef}\n                style={{ borderRadius: accordionBorderRadius, ...style }}\n            >\n                <StyledAccordionHeader\n                    role=\"tab\"\n                    tabIndex={0}\n                    onClick={handleOpen}\n                    aria-expanded={value}\n                    aria-controls={`accordion-item-section${key}`}\n                    id={`accordion-item-${key}`}\n                >\n                    <StyledAccordionHeaderLeft>\n                        {leftContent && (\n                            <StyledAccordionContentLeft ref={leftContentRef} className={leftContentRotate}>\n                                {leftContent}\n                            </StyledAccordionContentLeft>\n                        )}\n                        <StyledAccordionTitle>{title}</StyledAccordionTitle>\n                    </StyledAccordionHeaderLeft>\n\n                    {contentRight ? (\n                        <StyledAccordionContentRightDefault>{contentRight}</StyledAccordionContentRightDefault>\n                    ) : (\n                        <StyledAccordionContentRight className={rightContentRotate}>\n                            {rightContent && rightContent}\n                        </StyledAccordionContentRight>\n                    )}\n                </StyledAccordionHeader>\n                <StyledAccordionBodyAnimate\n                    aria-labelledby={`accordion-item-${key}`}\n                    aria-hidden={!value}\n                    id={`accordion-item-section${key}`}\n                    className={cx(openedBodyClass)}\n                    style={{ paddingLeft: `${leftPadding}` }}\n                >\n                    <StyledAccordionBody className={classes.accordionItemBody}>{children}</StyledAccordionBody>\n                </StyledAccordionBodyAnimate>\n            </StyledAccordionItem>\n        );\n    },\n);\n"],"names":["AccordionItem","forwardRef","_ref","outerRef","_ref2","value","contentRight","contentLeft","title","_ref$pin","pin","children","_ref$type","type","index","className","style","eventKey","disabled","_ref$alignWithTitle","alignWithTitle","opened","view","onChange","key","_useState","useState","_useState2","_slicedToArray","leftPadding","setLeftPadding","handleOpen","leftContentRef","useRef","useEffect","_leftContentRef$curre","_leftContentRef$curre2","leftContentWidth","current","offsetWidth","leftPaddingBody","concat","tokens","accordionItemGap","openedBodyClass","classes","accordionItemShowBody","undefined","StyledAnimationPlus","React","createElement","StyledPlus","_StyledMinus","StyledMinus","size","color","accordionPlusAnimationElement","accordionBorderRadius","convertRoundnessMatrix","accordionItemBorderRadius","disabledClass","accordionDisabled","leftContent","_StyledArrow","StyledArrow","leftContentRotate","rightContent","rightContentRotate","StyledAccordionItem","cx","accordionItem","ref","_objectSpread","borderRadius","StyledAccordionHeader","role","tabIndex","onClick","id","StyledAccordionHeaderLeft","StyledAccordionContentLeft","StyledAccordionTitle","StyledAccordionContentRightDefault","StyledAccordionContentRight","StyledAccordionBodyAnimate","paddingLeft","StyledAccordionBody","accordionItemBody"],"mappings":"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"}

package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js

@@ -1,4 +1,4 @@
-import './AccordionItem.styles_aus2x3.css';
+import './AccordionItem.styles_t0tdpe.css';
 import { styled } from '@linaria/react';
 import 'react';
 import { IconChevronDownFill } from '../../../_Icon/Icons/IconChevronDownFill.js';
@@ -24,47 +24,52 @@ var StyledAccordionContentRight = /*#__PURE__*/styled('div')({
   "class": "s2tqnbp",
   propsAsIs: false
 });
+var StyledAccordionContentRightDefault = /*#__PURE__*/styled('div')({
+  name: "StyledAccordionContentRightDefault",
+  "class": "s11daj3x",
+  propsAsIs: false
+});
 var StyledAccordionContentLeft = /*#__PURE__*/styled('div')({
   name: "StyledAccordionContentLeft",
-  "class": "s11daj3x",
+  "class": "sy09zp7",
   propsAsIs: false
 });
 var StyledAccordionTitle = /*#__PURE__*/styled('div')({
   name: "StyledAccordionTitle",
-  "class": "sy09zp7",
+  "class": "sbzgv9z",
   propsAsIs: false
 });
 var StyledAccordionBodyAnimate = /*#__PURE__*/styled('div')({
   name: "StyledAccordionBodyAnimate",
-  "class": "sbzgv9z",
+  "class": "s1ewkyyv",
   propsAsIs: false
 });
 var StyledAccordionBody = /*#__PURE__*/styled('div')({
   name: "StyledAccordionBody",
-  "class": "s1ewkyyv",
+  "class": "s15qiue1",
   propsAsIs: false
 });
-var _exp31 = function _exp31() {
+var _exp34 = function _exp34() {
   return IconChevronDownFill;
 };
-var StyledArrow = /*#__PURE__*/styled(_exp31())({
+var StyledArrow = /*#__PURE__*/styled(_exp34())({
   name: "StyledArrow",
-  "class": "s15qiue1",
+  "class": "syldew1",
   propsAsIs: true
 });
-var _exp33 = function _exp33() {
+var _exp36 = function _exp36() {
   return IconMinus;
 };
-var StyledMinus = /*#__PURE__*/styled(_exp33())({
+var StyledMinus = /*#__PURE__*/styled(_exp36())({
   name: "StyledMinus",
-  "class": "syldew1",
+  "class": "s1he8scv",
   propsAsIs: true
 });
 var StyledPlus = /*#__PURE__*/styled('div')({
   name: "StyledPlus",
-  "class": "s1he8scv",
+  "class": "s1c2l4h5",
   propsAsIs: false
 });
 
-export { StyledAccordionBody, StyledAccordionBodyAnimate, StyledAccordionContentLeft, StyledAccordionContentRight, StyledAccordionHeader, StyledAccordionHeaderLeft, StyledAccordionItem, StyledAccordionTitle, StyledArrow, StyledMinus, StyledPlus };
+export { StyledAccordionBody, StyledAccordionBodyAnimate, StyledAccordionContentLeft, StyledAccordionContentRight, StyledAccordionContentRightDefault, StyledAccordionHeader, StyledAccordionHeaderLeft, StyledAccordionItem, StyledAccordionTitle, StyledArrow, StyledMinus, StyledPlus };
 //# sourceMappingURL=AccordionItem.styles.js.map

package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.styles.js","sources":["../../../../../src/components/Accordion/ui/AccordionItem/AccordionItem.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { IconChevronDownFill, IconMinus } from '../../../_Icon';\nimport { classes, tokens } from '../../Accordion.tokens';\nimport { addFocus } from '../../../../mixins';\n\nexport const StyledAccordionItem = styled.div`\n    background: var(${tokens.accordionItemBackground});\n    border: var(${tokens.accordionItemBorder});\n    border-bottom: var(${tokens.accordionItemBorderBottom});\n\n    &:last-child {\n        border-bottom: var(${tokens.accordionItemBorder});\n    }\n\n    &.${classes.accordionDisabled} {\n        opacity: 0.4;\n        cursor: not-allowed;\n    }\n`;\n\nexport const StyledAccordionHeader = styled.button`\n    width: 100%;\n    border: none;\n    padding: var(${tokens.accordionItemPadding});\n    display: flex;\n    gap: var(${tokens.accordionItemGap});\n    justify-content: space-between;\n    align-items: center;\n    background: none;\n    box-sizing: border-box;\n    cursor: pointer;\n\n    &:focus {\n        outline: none;\n    }\n\n    ${addFocus({\n        outlineOffset: '0.125rem',\n        outlineSize: '0.125rem',\n        outlineRadius: '0',\n        outlineColor: `var(${tokens.accordionItemFocus})`,\n    })}\n`;\n\nexport const StyledAccordionHeaderLeft = styled.div`\n    display: flex;\n    gap: var(${tokens.accordionItemGap});\n    justify-content: space-between;\n    align-items: center;\n`;\n\nexport const StyledAccordionContentRight = styled.div`\n    transition: 0.2s;\n    transform: rotate(90deg);\n\n    &.${classes.accordionItemShowBody} {\n        transition: 0.2s;\n        transform: rotate(0deg);\n    }\n`;\n\nexport const StyledAccordionContentLeft = styled.div`\n    transition: 0.2s;\n    display: flex;\n    align-items: center;\n\n    &.${classes.accordionItemShowBody} {\n        transition: 0.2s;\n        transform: rotate(180deg);\n    }\n`;\n\nexport const StyledAccordionTitle = styled.div`\n    color: var(${tokens.accordionItemTitleColor});\n    font-family: var(${tokens.accordionItemTitleFontFamily});\n    font-size: var(${tokens.accordionItemTitleFontSize});\n    font-weight: var(${tokens.accordionItemTitleFontWeight});\n    font-style: var(${tokens.accordionItemTitleFontStyle});\n    letter-spacing: var(${tokens.accordionItemTitleLetterSpacing});\n    line-height: var(${tokens.accordionItemTitleLineHeight});\n    text-align: left;\n`;\n\nexport const StyledAccordionBodyAnimate = styled.div`\n    display: grid;\n    grid-template-rows: 0fr;\n    transition: grid-template-rows 0.2s ease-out;\n    overflow: hidden;\n\n    &.${classes.accordionItemShowBody} {\n        grid-template-rows: 1fr;\n        padding-bottom: var(${tokens.accordionItemPaddingVertical});\n\n        &.${classes.accordionPlusAnimationElement} {\n            transition: 0.2s;\n            transform: rotate(0deg);\n        }\n    }\n`;\n\nexport const StyledAccordionBody = styled.div`\n    color: var(${tokens.accordionItemTextColor});\n    font-family: var(${tokens.accordionItemTextFontFamily});\n    font-size: var(${tokens.accordionItemTextFontSize});\n    font-weight: var(${tokens.accordionItemTextFontWeight});\n    font-style: var(${tokens.accordionItemTextFontStyle});\n    letter-spacing: var(${tokens.accordionItemTextLetterSpacing});\n    line-height: var(${tokens.accordionItemTextLineHeight});\n    overflow: hidden;\n    padding-right: var(${tokens.accordionItemPaddingHorizontal});\n    padding-left: var(${tokens.accordionItemPaddingHorizontalLeft});\n    text-align: left;\n`;\n\nexport const StyledArrow = styled(IconChevronDownFill)`\n    pointer-events: none;\n    user-select: none;\n    color: var(${tokens.accordionItemIconColor});\n`;\n\nexport const StyledMinus = styled(IconMinus)`\n    pointer-events: none;\n    user-select: none;\n    color: var(${tokens.accordionItemIconColor});\n    display: flex;\n    align-items: center;\n    position: absolute;\n    top: 0;\n    left: 0;\n\n    &.${classes.accordionPlusAnimationElement} {\n        transition: 0.2s;\n        transform: rotate(90deg);\n    }\n\n    &.${classes.accordionItemShowBody} {\n        transition: 0.2s;\n        transform: rotate(0deg);\n    }\n`;\n\nexport const StyledPlus = styled.div`\n    position: relative;\n    height: 1rem;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1rem;\n`;\n"],"names":["StyledAccordionItem","styled","name","class","propsAsIs","StyledAccordionHeader","StyledAccordionHeaderLeft","StyledAccordionContentRight","StyledAccordionContentLeft","StyledAccordionTitle","StyledAccordionBodyAnimate","StyledAccordionBody","_exp31","IconChevronDownFill","StyledArrow","_exp33","IconMinus","StyledMinus","StyledPlus"],"mappings":";;;;;AAMO,IAAMA,mBAAmB,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,qBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAaxC,EAAA;AAEM,IAAMC,qBAAqB,gBAAGJ,MAAM,CAAA,QAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,uBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAsB1C,EAAA;AAEM,IAAME,yBAAyB,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,2BAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAK9C,EAAA;AAEM,IAAMG,2BAA2B,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,6BAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAQhD,EAAA;AAEM,IAAMI,0BAA0B,gBAAGP,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,4BAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAS/C,EAAA;AAEM,IAAMK,oBAAoB,gBAAGR,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,sBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CASzC,EAAA;AAEM,IAAMM,0BAA0B,gBAAGT,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,4BAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAe/C,EAAA;AAEM,IAAMO,mBAAmB,gBAAGV,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,qBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAYxC,EAAA;AAAC,IAAAQ,MAAA,GAhHgBA,SAgHhBA,MAAAA,GAAA;AAAA,EAAA,OAEgCC,mBAAmB,CAAA;AAAA,CAAA,CAAA;AAA9C,IAAMC,WAAW,gBAAGb,MAAM,CAAAW,MAAA,EAAA,CAAA,CAAA;AAAAV,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAIhC,EAAA;AAAC,IAAAW,MAAA,GAtHgBA,SAsHhBA,MAAAA,GAAA;AAAA,EAAA,OAEgCC,SAAS,CAAA;AAAA,CAAA,CAAA;AAApC,IAAMC,WAAW,gBAAGhB,MAAM,CAAAc,MAAA,EAAA,CAAA,CAAA;AAAAb,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAmBhC,EAAA;AAEM,IAAMc,UAAU,gBAAGjB,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAO/B;;;;"}
+{"version":3,"file":"AccordionItem.styles.js","sources":["../../../../../src/components/Accordion/ui/AccordionItem/AccordionItem.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { IconChevronDownFill, IconMinus } from '../../../_Icon';\nimport { classes, tokens } from '../../Accordion.tokens';\nimport { addFocus } from '../../../../mixins';\n\nexport const StyledAccordionItem = styled.div`\n    background: var(${tokens.accordionItemBackground});\n    border: var(${tokens.accordionItemBorder});\n    border-bottom: var(${tokens.accordionItemBorderBottom});\n\n    &:last-child {\n        border-bottom: var(${tokens.accordionItemBorder});\n    }\n\n    &.${classes.accordionDisabled} {\n        opacity: 0.4;\n        cursor: not-allowed;\n    }\n`;\n\nexport const StyledAccordionHeader = styled.button`\n    width: 100%;\n    border: none;\n    padding: var(${tokens.accordionItemPadding});\n    display: flex;\n    gap: var(${tokens.accordionItemGap});\n    justify-content: space-between;\n    align-items: center;\n    background: none;\n    box-sizing: border-box;\n    cursor: pointer;\n\n    &:focus {\n        outline: none;\n    }\n\n    ${addFocus({\n        outlineOffset: '0.125rem',\n        outlineSize: '0.125rem',\n        outlineRadius: '0',\n        outlineColor: `var(${tokens.accordionItemFocus})`,\n    })}\n`;\n\nexport const StyledAccordionHeaderLeft = styled.div`\n    display: flex;\n    gap: var(${tokens.accordionItemGap});\n    justify-content: space-between;\n    align-items: center;\n`;\n\nexport const StyledAccordionContentRight = styled.div`\n    transition: 0.2s;\n    transform: rotate(90deg);\n\n    &.${classes.accordionItemShowBody} {\n        transition: 0.2s;\n        transform: rotate(0deg);\n    }\n`;\n\nexport const StyledAccordionContentRightDefault = styled.div`\n    margin-top: calc(0px - var(${tokens.accordionItemPaddingVertical}));\n    margin-right: calc(0px - var(${tokens.accordionItemPaddingHorizontalLeft}));\n    margin-bottom: calc(0px - var(${tokens.accordionItemPaddingVertical}));\n`;\n\nexport const StyledAccordionContentLeft = styled.div`\n    transition: 0.2s;\n    display: flex;\n    align-items: center;\n\n    &.${classes.accordionItemShowBody} {\n        transition: 0.2s;\n        transform: rotate(180deg);\n    }\n`;\n\nexport const StyledAccordionTitle = styled.div`\n    color: var(${tokens.accordionItemTitleColor});\n    font-family: var(${tokens.accordionItemTitleFontFamily});\n    font-size: var(${tokens.accordionItemTitleFontSize});\n    font-weight: var(${tokens.accordionItemTitleFontWeight});\n    font-style: var(${tokens.accordionItemTitleFontStyle});\n    letter-spacing: var(${tokens.accordionItemTitleLetterSpacing});\n    line-height: var(${tokens.accordionItemTitleLineHeight});\n    text-align: left;\n`;\n\nexport const StyledAccordionBodyAnimate = styled.div`\n    display: grid;\n    grid-template-rows: 0fr;\n    transition: grid-template-rows 0.2s ease-out;\n    overflow: hidden;\n\n    &.${classes.accordionItemShowBody} {\n        grid-template-rows: 1fr;\n        padding-bottom: var(${tokens.accordionItemPaddingVertical});\n\n        &.${classes.accordionPlusAnimationElement} {\n            transition: 0.2s;\n            transform: rotate(0deg);\n        }\n    }\n`;\n\nexport const StyledAccordionBody = styled.div`\n    color: var(${tokens.accordionItemTextColor});\n    font-family: var(${tokens.accordionItemTextFontFamily});\n    font-size: var(${tokens.accordionItemTextFontSize});\n    font-weight: var(${tokens.accordionItemTextFontWeight});\n    font-style: var(${tokens.accordionItemTextFontStyle});\n    letter-spacing: var(${tokens.accordionItemTextLetterSpacing});\n    line-height: var(${tokens.accordionItemTextLineHeight});\n    overflow: hidden;\n    padding-right: var(${tokens.accordionItemPaddingHorizontal});\n    padding-left: var(${tokens.accordionItemPaddingHorizontalLeft});\n    text-align: left;\n`;\n\nexport const StyledArrow = styled(IconChevronDownFill)`\n    pointer-events: none;\n    user-select: none;\n    color: var(${tokens.accordionItemIconColor});\n`;\n\nexport const StyledMinus = styled(IconMinus)`\n    pointer-events: none;\n    user-select: none;\n    color: var(${tokens.accordionItemIconColor});\n    display: flex;\n    align-items: center;\n    position: absolute;\n    top: 0;\n    left: 0;\n\n    &.${classes.accordionPlusAnimationElement} {\n        transition: 0.2s;\n        transform: rotate(90deg);\n    }\n\n    &.${classes.accordionItemShowBody} {\n        transition: 0.2s;\n        transform: rotate(0deg);\n    }\n`;\n\nexport const StyledPlus = styled.div`\n    position: relative;\n    height: 1rem;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1rem;\n`;\n"],"names":["StyledAccordionItem","styled","name","class","propsAsIs","StyledAccordionHeader","StyledAccordionHeaderLeft","StyledAccordionContentRight","StyledAccordionContentRightDefault","StyledAccordionContentLeft","StyledAccordionTitle","StyledAccordionBodyAnimate","StyledAccordionBody","_exp34","IconChevronDownFill","StyledArrow","_exp36","IconMinus","StyledMinus","StyledPlus"],"mappings":";;;;;AAMO,IAAMA,mBAAmB,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,qBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAaxC,EAAA;AAEM,IAAMC,qBAAqB,gBAAGJ,MAAM,CAAA,QAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,uBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAsB1C,EAAA;AAEM,IAAME,yBAAyB,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,2BAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAK9C,EAAA;AAEM,IAAMG,2BAA2B,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,6BAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAQhD,EAAA;AAEM,IAAMI,kCAAkC,gBAAGP,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,oCAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAIvD,EAAA;AAEM,IAAMK,0BAA0B,gBAAGR,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,4BAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAS/C,EAAA;AAEM,IAAMM,oBAAoB,gBAAGT,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,sBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CASzC,EAAA;AAEM,IAAMO,0BAA0B,gBAAGV,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,4BAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAe/C,EAAA;AAEM,IAAMQ,mBAAmB,gBAAGX,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,qBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAYxC,EAAA;AAAC,IAAAS,MAAA,GAtHgBA,SAsHhBA,MAAAA,GAAA;AAAA,EAAA,OAEgCC,mBAAmB,CAAA;AAAA,CAAA,CAAA;AAA9C,IAAMC,WAAW,gBAAGd,MAAM,CAAAY,MAAA,EAAA,CAAA,CAAA;AAAAX,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAIhC,EAAA;AAAC,IAAAY,MAAA,GA5HgBA,SA4HhBA,MAAAA,GAAA;AAAA,EAAA,OAEgCC,SAAS,CAAA;AAAA,CAAA,CAAA;AAApC,IAAMC,WAAW,gBAAGjB,MAAM,CAAAe,MAAA,EAAA,CAAA,CAAA;AAAAd,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAmBhC,EAAA;AAEM,IAAMe,UAAU,gBAAGlB,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAO/B;;;;"}

package/es/components/Accordion/ui/AccordionItem/{AccordionItem.styles_aus2x3.css → AccordionItem.styles_t0tdpe.css}

@@ -2,10 +2,11 @@
 .s18inj31{width:100%;border:none;padding:var(--plasma-accordion-item-padding);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-accordion-item-gap);-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;box-sizing:border-box;cursor:pointer;position:relative;}.s18inj31:focus{outline:none;}.s18inj31::before{content:'';position:absolute;top:0.125rem;left:0.125rem;right:0.125rem;bottom:0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:0;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.s18inj31.focus-visible:focus::before,.s18inj31[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-accordion-item-focus);}
 .s1kvo44v{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-accordion-item-gap);-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
 .s2tqnbp{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.s2tqnbp.accordion-item-show-body{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
-.s11daj3x{-webkit-transition:0.2s;transition:0.2s;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.s11daj3x.accordion-item-show-body{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}
-.sy09zp7{color:var(--plasma-accordion-item-title-color);font-family:var(--plasma-accordion-item-title-font-family);font-size:var(--plasma-accordion-item-title-font-size);font-weight:var(--plasma-accordion-item-title-font-weight);font-style:var(--plasma-accordion-item-title-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);letter-spacing:var(--plasma-accordion-item-title-letter-spacing);line-height:var(--plasma-accordion-item-title-line-height);text-align:left;}
-.sbzgv9z{display:grid;grid-template-rows:0fr;-webkit-transition:grid-template-rows 0.2s ease-out;transition:grid-template-rows 0.2s ease-out;overflow:hidden;}.sbzgv9z.accordion-item-show-body{grid-template-rows:1fr;padding-bottom:var(--plasma-accordion-item-padding-vertical);}.sbzgv9z.accordion-item-show-body.accordion-plus-animation-element{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
-.s1ewkyyv{color:var(--plasma-accordion-item-text-color);font-family:var(--plasma-accordion-item-text-font-family);font-size:var(--plasma-accordion-item-text-font-size);font-weight:var(--plasma-accordion-item-text-font-weight);font-style:var(--plasma-accordion-item-text-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);letter-spacing:var(--plasma-accordion-item-text-letter-spacing);line-height:var(--plasma-accordion-item-text-line-height);overflow:hidden;padding-right:var(--plasma-accordion-item-padding-horizontal);padding-left:var(--plasma-accordion-item-padding-horizontal-left);text-align:left;}
-.s15qiue1{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);}
-.syldew1{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;}.syldew1.accordion-plus-animation-element{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.syldew1.accordion-item-show-body{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
-.s1he8scv{position:relative;height:1rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:1rem;}
+.s11daj3x{margin-top:calc(0px - var(--plasma-accordion-item-padding-vertical));margin-right:calc(0px - var(--plasma-accordion-item-padding-horizontal-left));margin-bottom:calc(0px - var(--plasma-accordion-item-padding-vertical));}
+.sy09zp7{-webkit-transition:0.2s;transition:0.2s;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.sy09zp7.accordion-item-show-body{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}
+.sbzgv9z{color:var(--plasma-accordion-item-title-color);font-family:var(--plasma-accordion-item-title-font-family);font-size:var(--plasma-accordion-item-title-font-size);font-weight:var(--plasma-accordion-item-title-font-weight);font-style:var(--plasma-accordion-item-title-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);letter-spacing:var(--plasma-accordion-item-title-letter-spacing);line-height:var(--plasma-accordion-item-title-line-height);text-align:left;}
+.s1ewkyyv{display:grid;grid-template-rows:0fr;-webkit-transition:grid-template-rows 0.2s ease-out;transition:grid-template-rows 0.2s ease-out;overflow:hidden;}.s1ewkyyv.accordion-item-show-body{grid-template-rows:1fr;padding-bottom:var(--plasma-accordion-item-padding-vertical);}.s1ewkyyv.accordion-item-show-body.accordion-plus-animation-element{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
+.s15qiue1{color:var(--plasma-accordion-item-text-color);font-family:var(--plasma-accordion-item-text-font-family);font-size:var(--plasma-accordion-item-text-font-size);font-weight:var(--plasma-accordion-item-text-font-weight);font-style:var(--plasma-accordion-item-text-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);letter-spacing:var(--plasma-accordion-item-text-letter-spacing);line-height:var(--plasma-accordion-item-text-line-height);overflow:hidden;padding-right:var(--plasma-accordion-item-padding-horizontal);padding-left:var(--plasma-accordion-item-padding-horizontal-left);text-align:left;}
+.syldew1{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);}
+.s1he8scv{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;}.s1he8scv.accordion-plus-animation-element{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.s1he8scv.accordion-item-show-body{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
+.s1c2l4h5{position:relative;height:1rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:1rem;}