@salutejs/plasma-new-hope 0.173.0-canary.1452.11459530697.0 → 0.173.0-canary.1497.11456665098.0

package/es/components/Dropdown/ui/DropdownInner/DropdownInner.js

@@ -1,8 +1,9 @@
 import React from 'react';
-import '@salutejs/plasma-core';
+import { safeUseId } from '@salutejs/plasma-core';
 import '@linaria/react';
 import { DropdownItem } from '../DropdownItem/DropdownItem.js';
-import { StyledPopover, Ul } from '../../Dropdown.styles.js';
+import { Ul } from '../../Dropdown.styles.js';
+import { FloatingPopover } from '../../FloatingPopover.js';
 import '../../../../utils/react.js';
 import 'focus-visible';
 import 'styled-components';
@@ -13,23 +14,13 @@ import 'react-dom';
 var DropdownInner = function DropdownInner(_ref) {
   var item = _ref.item,
     currentLevel = _ref.currentLevel,
-    focusedPath = _ref.focusedPath,
     path = _ref.path,
     dispatchPath = _ref.dispatchPath,
     index = _ref.index,
     trigger = _ref.trigger,
-    itemRole = _ref.itemRole,
     listHeight = _ref.listHeight,
     listOverflow = _ref.listOverflow,
-    handleGlobalToggle = _ref.handleGlobalToggle,
-    closeOnSelect = _ref.closeOnSelect,
-    onHover = _ref.onHover,
-    onItemSelect = _ref.onItemSelect,
-    onItemClick = _ref.onItemClick,
-    listWidth = _ref.listWidth,
-    variant = _ref.variant,
-    hasArrow = _ref.hasArrow,
-    size = _ref.size;
+    listWidth = _ref.listWidth;
   var handleToggle = function handleToggle(opened) {
     if (opened) {
       dispatchPath({
@@ -45,80 +36,54 @@ var DropdownInner = function DropdownInner(_ref) {
     }
   };
   var isCurrentListOpen = path[currentLevel + 1] === item.value.toString();
-  var listId = "tree_level_".concat(currentLevel + 2);
+  var treeId = safeUseId();
+  var listId = "".concat(treeId, "_tree_level_").concat(currentLevel + 2);
   var nextLevel = currentLevel + 1;
   if (item !== null && item !== void 0 && item.items) {
-    return /*#__PURE__*/React.createElement(StyledPopover, {
-      opened: isCurrentListOpen,
-      usePortal: false,
+    return /*#__PURE__*/React.createElement(FloatingPopover, {
       placement: "right-start",
+      opened: isCurrentListOpen,
+      onToggle: handleToggle,
       trigger: trigger,
       target: /*#__PURE__*/React.createElement(DropdownItem, {
         item: item,
         index: index,
         path: path,
-        focusedPath: focusedPath,
         currentLevel: currentLevel,
-        itemRole: itemRole,
-        onHover: onHover,
-        onItemSelect: onItemSelect,
-        onItemClick: onItemClick,
-        variant: variant,
-        hasArrow: hasArrow,
         ariaControls: listId,
         ariaExpanded: isCurrentListOpen,
         ariaLevel: nextLevel,
-        ariaLabel: item.label,
-        size: size
+        ariaLabel: item.label
       }),
-      onToggle: handleToggle,
-      isFocusTrapped: false,
-      preventOverflow: false
+      isInner: true
     }, /*#__PURE__*/React.createElement(Ul, {
+      id: listId,
+      role: "group",
+      isInnerUl: true,
       listHeight: listHeight,
       listOverflow: listOverflow,
-      role: "group",
-      id: listId,
-      listWidth: listWidth,
-      isInnerUl: true
+      listWidth: listWidth
     }, item.items.map(function (innerItem, innerIndex) {
       return /*#__PURE__*/React.createElement(DropdownInner, {
         key: "".concat(innerIndex, "/").concat(currentLevel),
         item: innerItem,
         currentLevel: nextLevel,
-        focusedPath: focusedPath,
         path: path,
         dispatchPath: dispatchPath,
         index: innerIndex,
         trigger: trigger,
-        itemRole: itemRole,
         listHeight: listHeight,
         listOverflow: listOverflow,
-        handleGlobalToggle: handleGlobalToggle,
-        closeOnSelect: closeOnSelect,
-        onHover: onHover,
-        onItemSelect: onItemSelect,
-        onItemClick: onItemClick,
-        listWidth: listWidth,
-        variant: variant,
-        hasArrow: hasArrow,
-        size: size
+        listWidth: listWidth
       });
     })));
   }
   return /*#__PURE__*/React.createElement(DropdownItem, {
     item: item,
+    path: path,
     index: index,
-    focusedPath: focusedPath,
     currentLevel: currentLevel,
-    itemRole: itemRole,
-    handleGlobalToggle: handleGlobalToggle,
-    closeOnSelect: closeOnSelect,
-    onHover: onHover,
-    onItemSelect: onItemSelect,
-    onItemClick: onItemClick,
-    variant: variant,
-    size: size
+    ariaLevel: nextLevel
   });
 };
 

package/es/components/Dropdown/ui/DropdownInner/DropdownInner.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownInner.js","sources":["../../../../../src/components/Dropdown/ui/DropdownInner/DropdownInner.tsx"],"sourcesContent":["import React from 'react';\nimport type { FC } from 'react';\n\nimport { DropdownItem } from '..';\nimport { Ul, StyledPopover } from '../../Dropdown.styles';\n\nimport { DropdownInnerProps } from './DropdownInner.type';\n\nconst DropdownInner: FC<DropdownInnerProps> = ({\n    item,\n    currentLevel,\n    focusedPath,\n    path,\n    dispatchPath,\n    index,\n    trigger,\n    itemRole,\n    listHeight,\n    listOverflow,\n    handleGlobalToggle,\n    closeOnSelect,\n    onHover,\n    onItemSelect,\n    onItemClick,\n    listWidth,\n    variant,\n    hasArrow,\n    size,\n}) => {\n    const handleToggle = (opened: boolean): void => {\n        if (opened) {\n            dispatchPath({ type: 'changed_on_level', value: item.value.toString(), level: currentLevel + 1 });\n        } else {\n            dispatchPath({ type: 'cut_by_level', level: currentLevel + 1 });\n        }\n    };\n\n    const isCurrentListOpen = path[currentLevel + 1] === item.value.toString();\n\n    const listId = `tree_level_${currentLevel + 2}`;\n    const nextLevel = currentLevel + 1;\n\n    if (item?.items) {\n        return (\n            <StyledPopover\n                opened={isCurrentListOpen}\n                usePortal={false}\n                placement=\"right-start\"\n                trigger={trigger}\n                target={\n                    <DropdownItem\n                        item={item}\n                        index={index}\n                        path={path}\n                        focusedPath={focusedPath}\n                        currentLevel={currentLevel}\n                        itemRole={itemRole}\n                        onHover={onHover}\n                        onItemSelect={onItemSelect}\n                        onItemClick={onItemClick}\n                        variant={variant}\n                        hasArrow={hasArrow}\n                        ariaControls={listId}\n                        ariaExpanded={isCurrentListOpen}\n                        ariaLevel={nextLevel}\n                        ariaLabel={item.label}\n                        size={size}\n                    />\n                }\n                onToggle={handleToggle}\n                isFocusTrapped={false}\n                preventOverflow={false}\n            >\n                <Ul\n                    listHeight={listHeight}\n                    listOverflow={listOverflow}\n                    role=\"group\"\n                    id={listId}\n                    listWidth={listWidth}\n                    isInnerUl\n                >\n                    {item.items.map((innerItem, innerIndex) => (\n                        <DropdownInner\n                            key={`${innerIndex}/${currentLevel}`}\n                            item={innerItem}\n                            currentLevel={nextLevel}\n                            focusedPath={focusedPath}\n                            path={path}\n                            dispatchPath={dispatchPath}\n                            index={innerIndex}\n                            trigger={trigger}\n                            itemRole={itemRole}\n                            listHeight={listHeight}\n                            listOverflow={listOverflow}\n                            handleGlobalToggle={handleGlobalToggle}\n                            closeOnSelect={closeOnSelect}\n                            onHover={onHover}\n                            onItemSelect={onItemSelect}\n                            onItemClick={onItemClick}\n                            listWidth={listWidth}\n                            variant={variant}\n                            hasArrow={hasArrow}\n                            size={size}\n                        />\n                    ))}\n                </Ul>\n            </StyledPopover>\n        );\n    }\n\n    return (\n        <DropdownItem\n            item={item}\n            index={index}\n            focusedPath={focusedPath}\n            currentLevel={currentLevel}\n            itemRole={itemRole}\n            handleGlobalToggle={handleGlobalToggle}\n            closeOnSelect={closeOnSelect}\n            onHover={onHover}\n            onItemSelect={onItemSelect}\n            onItemClick={onItemClick}\n            variant={variant}\n            size={size}\n        />\n    );\n};\n\nexport { DropdownInner };\n"],"names":["DropdownInner","_ref","item","currentLevel","focusedPath","path","dispatchPath","index","trigger","itemRole","listHeight","listOverflow","handleGlobalToggle","closeOnSelect","onHover","onItemSelect","onItemClick","listWidth","variant","hasArrow","size","handleToggle","opened","type","value","toString","level","isCurrentListOpen","listId","concat","nextLevel","items","React","createElement","StyledPopover","usePortal","placement","target","DropdownItem","ariaControls","ariaExpanded","ariaLevel","ariaLabel","label","onToggle","isFocusTrapped","preventOverflow","Ul","role","id","isInnerUl","map","innerItem","innerIndex","key"],"mappings":"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"}
+{"version":3,"file":"DropdownInner.js","sources":["../../../../../src/components/Dropdown/ui/DropdownInner/DropdownInner.tsx"],"sourcesContent":["import React from 'react';\nimport type { FC } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { DropdownItem } from '..';\nimport { Ul } from '../../Dropdown.styles';\nimport { FloatingPopover } from '../../FloatingPopover';\n\nimport { DropdownInnerProps } from './DropdownInner.type';\n\nconst DropdownInner: FC<DropdownInnerProps> = ({\n    item,\n    currentLevel,\n    path,\n    dispatchPath,\n    index,\n    trigger,\n    listHeight,\n    listOverflow,\n    listWidth,\n}) => {\n    const handleToggle = (opened: boolean): void => {\n        if (opened) {\n            dispatchPath({ type: 'changed_on_level', value: item.value.toString(), level: currentLevel + 1 });\n        } else {\n            dispatchPath({ type: 'cut_by_level', level: currentLevel + 1 });\n        }\n    };\n\n    const isCurrentListOpen = path[currentLevel + 1] === item.value.toString();\n\n    const treeId = safeUseId();\n    const listId = `${treeId}_tree_level_${currentLevel + 2}`;\n    const nextLevel = currentLevel + 1;\n\n    if (item?.items) {\n        return (\n            <FloatingPopover\n                placement=\"right-start\"\n                opened={isCurrentListOpen}\n                onToggle={handleToggle}\n                trigger={trigger}\n                target={\n                    <DropdownItem\n                        item={item}\n                        index={index}\n                        path={path}\n                        currentLevel={currentLevel}\n                        ariaControls={listId}\n                        ariaExpanded={isCurrentListOpen}\n                        ariaLevel={nextLevel}\n                        ariaLabel={item.label}\n                    />\n                }\n                isInner\n            >\n                <Ul\n                    id={listId}\n                    role=\"group\"\n                    isInnerUl\n                    listHeight={listHeight}\n                    listOverflow={listOverflow}\n                    listWidth={listWidth}\n                >\n                    {item.items.map((innerItem, innerIndex) => (\n                        <DropdownInner\n                            key={`${innerIndex}/${currentLevel}`}\n                            item={innerItem}\n                            currentLevel={nextLevel}\n                            path={path}\n                            dispatchPath={dispatchPath}\n                            index={innerIndex}\n                            trigger={trigger}\n                            listHeight={listHeight}\n                            listOverflow={listOverflow}\n                            listWidth={listWidth}\n                        />\n                    ))}\n                </Ul>\n            </FloatingPopover>\n        );\n    }\n\n    return <DropdownItem item={item} path={path} index={index} currentLevel={currentLevel} ariaLevel={nextLevel} />;\n};\n\nexport { DropdownInner };\n"],"names":["DropdownInner","_ref","item","currentLevel","path","dispatchPath","index","trigger","listHeight","listOverflow","listWidth","handleToggle","opened","type","value","toString","level","isCurrentListOpen","treeId","safeUseId","listId","concat","nextLevel","items","React","createElement","FloatingPopover","placement","onToggle","target","DropdownItem","ariaControls","ariaExpanded","ariaLevel","ariaLabel","label","isInner","Ul","id","role","isInnerUl","map","innerItem","innerIndex","key"],"mappings":"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"}

package/es/components/Dropdown/ui/DropdownItem/DropdownItem.css

@@ -1,8 +1,48 @@
 .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);}
 
-.DropdownItem_styles_blclup_s1gkzlls__8eef3b3a{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
-.DropdownItem_styles_blclup_sz6s14y__8eef3b3a{margin-left:auto;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
-.DropdownItem_styles_blclup_d1m97l2m__8eef3b3a{line-height:0;color:var(--plasma-dropdown-disclosure-icon-color);}
-.DropdownItem_styles_blclup_soib72h__8eef3b3a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-flex:1;-ms-flex:1;flex:1;}
-.DropdownItem_styles_blclup_d6l2f0g__8eef3b3a{height:1px;margin-top:var(--d6l2f0g-0);margin-right:var(--plasma-dropdown-divider-margin-right);margin-bottom:var(--d6l2f0g-1);margin-left:var(--plasma-dropdown-divider-margin-left);background:var(--plasma-dropdown-divider-color);}
-.DropdownItem_styles_blclup_w1jav4ek__8eef3b3a{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;margin:0;box-sizing:content-box;padding-top:var(--w1jav4ek-0);padding-right:var(--plasma-dropdown-item-padding-right);padding-bottom:var(--w1jav4ek-1);padding-left:var(--plasma-dropdown-item-padding-left);font-family:var(--plasma-dropdown-item-font-family);font-size:var(--plasma-dropdown-item-font-size);font-style:var(--plasma-dropdown-item-font-style);font-weight:var(--plasma-dropdown-item-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-item-line-height);-moz-letter-spacing:var(--plasma-dropdown-item-line-height);-ms-letter-spacing:var(--plasma-dropdown-item-line-height);letter-spacing:var(--plasma-dropdown-item-line-height);line-height:var(--plasma-dropdown-item-font-weight);background:var(--plasma-dropdown-item-background);color:var(--plasma-dropdown-item-color);border-radius:var(--plasma-dropdown-item-border-radius);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;}.DropdownItem_styles_blclup_w1jav4ek__8eef3b3a:hover:not(.DropdownItem_styles_blclup_dropdownItemIsDisabled__8eef3b3a){cursor:pointer;background:var(--plasma-dropdown-item-background-hover);}.DropdownItem_styles_blclup_w1jav4ek__8eef3b3a.DropdownItem_styles_blclup_dropdownItemIsActive__8eef3b3a{background:var(--plasma-dropdown-item-background-hover);}.DropdownItem_styles_blclup_w1jav4ek__8eef3b3a.DropdownItem_styles_blclup_dropdownItemIsDisabled__8eef3b3a{opacity:var(--plasma-dropdown-disabled-opacity);cursor:not-allowed;}.DropdownItem_styles_blclup_w1jav4ek__8eef3b3a:focus{outline:none;}.DropdownItem_styles_blclup_w1jav4ek__8eef3b3a::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:var(--plasma-dropdown-item-border-radius);-webkit-transition:none;transition:none;pointer-events:none;}.DropdownItem_styles_blclup_w1jav4ek__8eef3b3a.DropdownItem_styles_blclup_dropdownItemIsFocused__8eef3b3a:before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-dropdown-focus-color);}
+.DropdownDivider_styles_v3xor1_s1brpi5d__3a791565{background:var(--plasma-dropdown-divider-color);width:var(--plasma-dropdown-divider-width);height:var(--plasma-dropdown-divider-height);margin:var(--plasma-dropdown-divider-margin-top) var(--plasma-dropdown-divider-margin-right) var(--plasma-dropdown-divider-margin-bottom) var(--plasma-dropdown-divider-margin-left);}
+
+.DropdownFooter_styles_1j4sg1p_stiw0r3__41ff7287{background:var(--plasma-dropdown-footer-background);font-family:var(--plasma-dropdown-footer-font-family);font-size:var(--plasma-dropdown-footer-font-size);font-style:var(--plasma-dropdown-footer-font-style);font-weight:var(--plasma-dropdown-footer-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-footer-line-height);-moz-letter-spacing:var(--plasma-dropdown-footer-line-height);-ms-letter-spacing:var(--plasma-dropdown-footer-line-height);letter-spacing:var(--plasma-dropdown-footer-line-height);line-height:var(--plasma-dropdown-footer-font-weight);width:var(--plasma-dropdown-footer-width);height:var(--plasma-dropdown-footer-height);padding:var(--plasma-dropdown-footer-padding-top) var(--plasma-dropdown-footer-padding-right) var(--plasma-dropdown-footer-padding-bottom) var(--plasma-dropdown-footer-padding-left);margin:var(--plasma-dropdown-footer-margin-top) var(--plasma-dropdown-footer-margin-right) var(--plasma-dropdown-footer-margin-bottom) var(--plasma-dropdown-footer-margin-left);}
+
+.DropdownGroup_styles_1o990eo_scop7qk__fca8c58e{background:var(--plasma-dropdown-group-background);width:var(--plasma-dropdown-group-width);height:var(--plasma-dropdown-group-height);padding:var(--plasma-dropdown-group-padding-top) var(--plasma-dropdown-group-padding-right) var(--plasma-dropdown-group-padding-bottom) var(--plasma-dropdown-group-padding-left);margin:var(--plasma-dropdown-group-margin-top) var(--plasma-dropdown-group-margin-right) var(--plasma-dropdown-group-margin-bottom) var(--plasma-dropdown-group-margin-left);}
+.DropdownGroup_styles_1o990eo_s1oaw95y__fca8c58e{font-family:var(--plasma-dropdown-group-label-font-family);font-size:var(--plasma-dropdown-group-label-font-size);font-style:var(--plasma-dropdown-group-label-font-style);font-weight:var(--plasma-dropdown-group-label-font-weight);-webkit-letter-spacing:var(--plasma-dropdown-group-label-letter-spacing);-moz-letter-spacing:var(--plasma-dropdown-group-label-letter-spacing);-ms-letter-spacing:var(--plasma-dropdown-group-label-letter-spacing);letter-spacing:var(--plasma-dropdown-group-label-letter-spacing);line-height:var(--plasma-dropdown-group-label-line-height);color:var(--plasma-dropdown-group-label-color);padding:var(--plasma-dropdown-group-label-padding-top) var(--plasma-dropdown-group-label-padding-right) var(--plasma-dropdown-group-label-padding-bottom) var(--plasma-dropdown-group-label-padding-left);margin:var(--plasma-dropdown-group-label-margin-top) var(--plasma-dropdown-group-label-margin-right) var(--plasma-dropdown-group-label-margin-bottom) var(--plasma-dropdown-group-label-margin-left);}
+
+.DropdownHeader_styles_196gwgm_s133b1g2__3510806e{background:var(--plasma-dropdown-header-background);font-family:var(--plasma-dropdown-header-font-family);font-size:var(--plasma-dropdown-header-font-size);font-style:var(--plasma-dropdown-header-font-style);font-weight:var(--plasma-dropdown-header-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-header-line-height);-moz-letter-spacing:var(--plasma-dropdown-header-line-height);-ms-letter-spacing:var(--plasma-dropdown-header-line-height);letter-spacing:var(--plasma-dropdown-header-line-height);line-height:var(--plasma-dropdown-header-font-weight);width:var(--plasma-dropdown-header-width);height:var(--plasma-dropdown-header-height);padding:var(--plasma-dropdown-header-padding-top) var(--plasma-dropdown-header-padding-right) var(--plasma-dropdown-header-padding-bottom) var(--plasma-dropdown-header-padding-left);margin:var(--plasma-dropdown-header-margin-top) var(--plasma-dropdown-header-margin-right) var(--plasma-dropdown-header-margin-bottom) var(--plasma-dropdown-header-margin-left);}
+
+.DropdownItem_styles_1lyg81y_s1iqs5in__b17ea060{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;min-width:var(--plasma-dropdown-item-content-left-width);color:var(--plasma-dropdown-item-content-left-color);}
+.DropdownItem_styles_1lyg81y_sfg3dyd__b17ea060{margin-left:auto;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;min-width:var(--plasma-dropdown-item-content-right-width);color:var(--plasma-dropdown-item-content-right-color);}
+.DropdownItem_styles_1lyg81y_s1dea6tl__b17ea060{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060{box-sizing:content-box;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-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;width:auto;font-family:var(--plasma-dropdown-item-font-family);font-size:var(--plasma-dropdown-item-font-size);font-style:var(--plasma-dropdown-item-font-style);font-weight:var(--plasma-dropdown-item-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-item-line-height);-moz-letter-spacing:var(--plasma-dropdown-item-line-height);-ms-letter-spacing:var(--plasma-dropdown-item-line-height);letter-spacing:var(--plasma-dropdown-item-line-height);line-height:var(--plasma-dropdown-item-font-weight);background:var(--plasma-dropdown-item-background);color:var(--plasma-dropdown-item-color);border-radius:var(--plasma-dropdown-item-border-radius);width:var(--plasma-dropdown-item-width);height:var(--plasma-dropdown-item-height);padding:var(--plasma-dropdown-item-padding-top) var(--plasma-dropdown-item-padding-right) var(--plasma-dropdown-item-padding-bottom) var(--plasma-dropdown-item-padding-left);margin:var(--plasma-dropdown-item-margin-top) var(--plasma-dropdown-item-margin-right) var(--plasma-dropdown-item-margin-bottom) var(--plasma-dropdown-item-margin-left);}.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060:focus{outline:none;}.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:var(--plasma-dropdown-item-border-radius);-webkit-transition:none;transition:none;pointer-events:none;}.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060.DropdownItem_styles_1lyg81y_focusVisible__b17ea060:focus::before,.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-dropdown-focus-color);}.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060:hover:not(.DropdownItem_styles_1lyg81y_dropdownItemIsDisabled__b17ea060){cursor:pointer;background:var(--plasma-dropdown-item-background-hover);}.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060.DropdownItem_styles_1lyg81y_dropdownItemIsSelected__b17ea060{color:var(--plasma-dropdown-item-color-selected);background:var(--plasma-dropdown-item-background-selected);}.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060.DropdownItem_styles_1lyg81y_dropdownItemIsSelected__b17ea060:hover:not(.DropdownItem_styles_1lyg81y_dropdownItemIsDisabled__b17ea060){background:var(--plasma-dropdown-item-background-selected-hover);}.DropdownItem_styles_1lyg81y_b1b2nce8__b17ea060.DropdownItem_styles_1lyg81y_dropdownItemIsDisabled__b17ea060{opacity:var(--plasma-dropdown-disabled-opacity);cursor:not-allowed;}
+
+.Popover_styles_rmr9za_s1g1xbt5__0bafa6fb{display:inline-block;}
+.Popover_styles_rmr9za_s12xwbyh__0bafa6fb{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;box-sizing:border-box;position:relative;}
+.Popover_styles_rmr9za_s1pd4d8a__0bafa6fb{width:var(--plasma-popover-arrow-mask-width);height:var(--plasma-popover-arrow-mask-height);}.Popover_styles_rmr9za_s1pd4d8a__0bafa6fb::before{position:absolute;width:var(--plasma-popover-arrow-mask-width);height:var(--plasma-popover-arrow-mask-height);-webkit-mask-image:var(--plasma-popover-arrow-mask-image);mask-image:var(--plasma-popover-arrow-mask-image);background:var(--plasma-popover-arrow-background);content:'';-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
+.Popover_styles_rmr9za_s16xlixz__0bafa6fb{position:absolute;z-index:var(--s16xlixz-0);}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='top'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{bottom:calc(0px - var(--plasma-popover-arrow-height));}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='bottom'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{top:calc(0px - var(--plasma-popover-arrow-height));}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='bottom'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb::before{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='left'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{right:calc(0px - var(--plasma-popover-arrow-height));}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='left'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb::before{-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='right'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{left:calc(0px - var(--plasma-popover-arrow-height));}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='right'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb::before{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='top-start'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{bottom:calc(0px - var(--plasma-popover-arrow-height));left:var(--plasma-popover-arrow-edge-margin) !important;-webkit-transform:unset !important;-ms-transform:unset !important;transform:unset !important;}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='top-end'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{bottom:calc(0px - var(--plasma-popover-arrow-height));left:unset !important;right:var(--plasma-popover-arrow-edge-margin) !important;-webkit-transform:unset !important;-ms-transform:unset !important;transform:unset !important;}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='bottom-start'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{top:calc(0px - var(--plasma-popover-arrow-height));left:var(--plasma-popover-arrow-edge-margin) !important;-webkit-transform:unset !important;-ms-transform:unset !important;transform:unset !important;}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='bottom-start'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb::before{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='bottom-end'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{top:calc(0px - var(--plasma-popover-arrow-height));left:unset !important;right:var(--plasma-popover-arrow-edge-margin) !important;-webkit-transform:unset !important;-ms-transform:unset !important;transform:unset !important;}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='bottom-end'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb::before{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='left-start'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb,.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='right-start'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{top:var(--plasma-popover-arrow-edge-margin) !important;-webkit-transform:unset !important;-ms-transform:unset !important;transform:unset !important;}.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='left-end'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb,.Popover_styles_rmr9za_s16xlixz__0bafa6fb[data-popper-placement^='right-end'] > .Popover_styles_rmr9za_popoverArrow__0bafa6fb{top:unset !important;bottom:var(--plasma-popover-arrow-edge-margin) !important;-webkit-transform:unset !important;-ms-transform:unset !important;transform:unset !important;}
+
+.Dropdown_styles_3w3l45_s1rwu6ky__59648b20 .Dropdown_styles_3w3l45_popoverTarget__59648b20{display:block;}
+.Dropdown_styles_3w3l45_s10jhp3l__59648b20{box-sizing:border-box;background:var(--plasma-dropdown-background);box-shadow:var(--plasma-dropdown-box-shadow);border-radius:var(--plasma-dropdown-border-radius);width:var(--plasma-dropdown-width);height:var(--plasma-dropdown-height);padding:var(--plasma-dropdown-padding-top) var(--plasma-dropdown-padding-right) var(--plasma-dropdown-padding-bottom) var(--plasma-dropdown-padding-left);}
+
+.Dropdown_styles_18f0qpm_un7uamp__64c00440{box-sizing:border-box;width:var(--un7uamp-0);height:var(--un7uamp-1);margin:var(--un7uamp-2);padding:var(--plasma-dropdown-padding) 0;overflow:var(--un7uamp-3);background:var(--surface-solid-card);box-shadow:0px 4px 14px -4px rgba(8,8,8,0.08),0px 1px 4px -1px rgba(0,0,0,0.04);border-radius:var(--plasma-dropdown-border-radius);}
+
+
+.CellTextboxLabel_styles_1x97zqi_supiagz__b05150dd{color:var(--plasma-cell-label-color);font-size:var(--plasma-cell-label-font-size);font-weight:var(--plasma-cell-label-font-weight);font-family:var(--plasma-cell-label-font-family);font-style:var(--plasma-cell-label-font-style);line-height:var(--plasma-cell-label-line-height);-webkit-letter-spacing:var(--plasma-cell-label-letter-spacing);-moz-letter-spacing:var(--plasma-cell-label-letter-spacing);-ms-letter-spacing:var(--plasma-cell-label-letter-spacing);letter-spacing:var(--plasma-cell-label-letter-spacing);}
+
+.CellTextboxTitle_styles_jogov7_s16psy9b__edbbb199{color:var(--plasma-cell-title-color);font-size:var(--plasma-cell-title-font-size);font-weight:var(--plasma-cell-title-font-weight);font-family:var(--plasma-cell-title-font-family);font-style:var(--plasma-cell-title-font-style);line-height:var(--plasma-cell-title-line-height);-webkit-letter-spacing:var(--plasma-cell-title-letter-spacing);-moz-letter-spacing:var(--plasma-cell-title-letter-spacing);-ms-letter-spacing:var(--plasma-cell-title-letter-spacing);letter-spacing:var(--plasma-cell-title-letter-spacing);}
+
+.CellTextboxSubtitle_styles_n7i06q_s1bdz4u4__8e9f9a5a{color:var(--plasma-cell-subtitle-color);font-size:var(--plasma-cell-subtitle-font-size);font-weight:var(--plasma-cell-subtitle-font-weight);font-family:var(--plasma-cell-subtitle-font-family);font-style:var(--plasma-cell-subtitle-font-style);line-height:var(--plasma-cell-subtitle-line-height);-webkit-letter-spacing:var(--plasma-cell-subtitle-letter-spacing);-moz-letter-spacing:var(--plasma-cell-subtitle-letter-spacing);-ms-letter-spacing:var(--plasma-cell-subtitle-letter-spacing);letter-spacing:var(--plasma-cell-subtitle-letter-spacing);}
+
+.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_cellStretchingFixed__a35afa10{width:var(--plasma-cell-width);}.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_cellStretchingFilled__a35afa10{width:100%;}.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_cellStretchingAuto__a35afa10{width:auto;}
+.Cell_styles_1lali49_c1e5qbb3__a35afa10{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:auto;-ms-flex:auto;flex:auto;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;gap:var(--plasma-cell-gap);height:auto;}
+.Cell_styles_1lali49_cdgokyj__a35afa10{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;height:auto;}
+.Cell_styles_1lali49_c1k87ec1__a35afa10{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:var(--c1k87ec1-0);-webkit-box-align:var(--c1k87ec1-0);-ms-flex-align:var(--c1k87ec1-0);align-items:var(--c1k87ec1-0);}
+.Cell_styles_1lali49_c1spqh22__a35afa10{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:var(--c1spqh22-0);-webkit-box-align:var(--c1spqh22-0);-ms-flex-align:var(--c1spqh22-0);align-items:var(--c1spqh22-0);text-align:right;}
+
+.base_pir0qf_b1sr9i7l__baa3f156{color:var(--plasma-cell-color);background-color:var(--plasma-cell-background-color);width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;gap:var(--plasma-cell-gap);}.base_pir0qf_b1sr9i7l__baa3f156:focus{outline:0 none;}
+
+.CellTextbox_styles_rgpies_cz0uqdu__c842929b{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--plasma-cell-textbox-gap);}
+
+.DropdownItem_styles_17va0nk_c1gkzlls__c9d95fff{--plasma-cell-title-color:var(--text-primary);--plasma-cell-background-color:var(--plasma-colors-transparent);--plasma-cell-padding:var(--plasma-dropdown-cell-padding);--plasma-cell-padding-left-content:var(--plasma-dropdown-cell-padding-left-content);--plasma-cell-padding-content:var(--plasma-dropdown-cell-padding-content);--plasma-cell-padding-right-content:var(--plasma-dropdown-cell-padding-right-content);--plasma-cell-textbox-gap:var(--plasma-dropdown-cell-textbox-gap);--plasma-cell-gap:var(--plasma-dropdown-cell-gap);--plasma-cell-title-font-family:var(--plasma-dropdown-cell-title-font-family);--plasma-cell-title-font-size:var(--plasma-dropdown-cell-title-font-size);--plasma-cell-title-font-style:var(--plasma-dropdown-cell-title-font-style);--plasma-cell-title-font-weight:var(--plasma-dropdown-cell-title-font-weight);--plasma-cell-title-letter-spacing:var(--plasma-dropdown-cell-title-letter-spacing);--plasma-cell-title-line-height:var(--plasma-dropdown-cell-title-line-height);width:100%;}
+
+.DropdownItem_styles_17va0nk_d1m97l2m__c9d95fff{line-height:0;color:var(--text-secondary);}
+.DropdownItem_styles_17va0nk_doib72h__c9d95fff{height:1px;margin-top:var(--doib72h-0);margin-right:var(--plasma-dropdown-divider-margin-right);margin-bottom:var(--doib72h-1);margin-left:var(--plasma-dropdown-divider-margin-left);background:var(--plasma-dropdown-divider-color);}
+.DropdownItem_styles_17va0nk_w6l2f0g__c9d95fff{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;min-height:var(--plasma-dropdown-item-height);margin:0;box-sizing:content-box;padding:var(--w6l2f0g-0);font-family:var(--plasma-dropdown-item-font-family);font-size:var(--plasma-dropdown-item-font-size);font-style:var(--plasma-dropdown-item-font-style);font-weight:var(--plasma-dropdown-item-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-item-line-height);-moz-letter-spacing:var(--plasma-dropdown-item-line-height);-ms-letter-spacing:var(--plasma-dropdown-item-line-height);letter-spacing:var(--plasma-dropdown-item-line-height);line-height:var(--plasma-dropdown-item-font-weight);background-color:var(--plasma-colors-transparent);border-radius:var(--plasma-dropdown-border-radius);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:0.125rem solid transparent;border-left:0.125rem solid transparent;background-clip:padding-box;position:relative;}.DropdownItem_styles_17va0nk_w6l2f0g__c9d95fff:hover:not(.DropdownItem_styles_17va0nk_dropdownItemIsDisabled__c9d95fff){cursor:pointer;background-color:var(--surface-transparent-secondary);}.DropdownItem_styles_17va0nk_w6l2f0g__c9d95fff.DropdownItem_styles_17va0nk_dropdownItemIsActive__c9d95fff{background-color:var(--surface-transparent-secondary);}.DropdownItem_styles_17va0nk_w6l2f0g__c9d95fff.DropdownItem_styles_17va0nk_dropdownItemIsDisabled__c9d95fff{opacity:0.4;cursor:not-allowed;}.DropdownItem_styles_17va0nk_w6l2f0g__c9d95fff:focus{outline:none;}.DropdownItem_styles_17va0nk_w6l2f0g__c9d95fff::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:var(--plasma-dropdown-item-border-radius);-webkit-transition:none;transition:none;pointer-events:none;}.DropdownItem_styles_17va0nk_w6l2f0g__c9d95fff.DropdownItem_styles_17va0nk_dropdownItemIsFocused__c9d95fff:before{outline:none;box-shadow:0 0 0 0.0625rem var(--surface-accent);}

package/es/components/Dropdown/ui/DropdownItem/DropdownItem.js

@@ -1,30 +1,21 @@
-import React, { useRef, useEffect } from 'react';
+import React, { useRef, useContext, useEffect } from 'react';
 import { classes } from '../../Dropdown.tokens.js';
 import { cx } from '../../../../utils/index.js';
 import '@linaria/react';
 import { IconDisclosureRight } from '../../../_Icon/Icons/IconDisclosureRight.js';
-import { Divider, Wrapper, StyledContentLeft, StyledText, StyledContentRight, DisclosureIconWrapper } from './DropdownItem.styles.js';
+import { Context } from '../../Dropdown.js';
+import { getItemId } from '../../utils/getItemId.js';
+import { Divider, Wrapper, CellWrapper, StyledCell, DisclosureIconWrapper } from './DropdownItem.styles.js';
 
 var DropdownItem = function DropdownItem(_ref) {
   var item = _ref.item,
     path = _ref.path,
-    focusedPath = _ref.focusedPath,
     currentLevel = _ref.currentLevel,
     index = _ref.index,
-    itemRole = _ref.itemRole,
-    closeOnSelect = _ref.closeOnSelect,
-    handleGlobalToggle = _ref.handleGlobalToggle,
-    onHover = _ref.onHover,
-    onItemSelect = _ref.onItemSelect,
-    onItemClick = _ref.onItemClick,
     ariaControls = _ref.ariaControls,
     ariaExpanded = _ref.ariaExpanded,
-    ariaHasPopup = _ref.ariaHasPopup,
     ariaLevel = _ref.ariaLevel,
-    ariaLabel = _ref.ariaLabel,
-    variant = _ref.variant,
-    hasArrow = _ref.hasArrow,
-    size = _ref.size;
+    ariaLabel = _ref.ariaLabel;
   var value = item.value,
     label = item.label,
     disabled = item.disabled,
@@ -34,6 +25,19 @@ var DropdownItem = function DropdownItem(_ref) {
     dividerBefore = item.dividerBefore,
     dividerAfter = item.dividerAfter;
   var ref = useRef(null);
+  var _useContext = useContext(Context),
+    focusedPath = _useContext.focusedPath,
+    size = _useContext.size,
+    variant = _useContext.variant,
+    itemRole = _useContext.itemRole,
+    handleGlobalToggle = _useContext.handleGlobalToggle,
+    closeOnSelect = _useContext.closeOnSelect,
+    onHover = _useContext.onHover,
+    onItemSelect = _useContext.onItemSelect,
+    onItemClick = _useContext.onItemClick,
+    hasArrow = _useContext.hasArrow,
+    treeId = _useContext.treeId;
+  var hasDescendants = Boolean(item.items);
   var disclosureIconSize = size === 'xs' ? 'xs' : 's';
   var isDisabledClassName = disabled || isDisabled ? classes.dropdownItemIsDisabled : undefined;
   var focusedClass = currentLevel === focusedPath.length - 1 && index === (focusedPath === null || focusedPath === void 0 ? void 0 : focusedPath[currentLevel]) ? classes.dropdownItemIsFocused : undefined;
@@ -57,7 +61,9 @@ var DropdownItem = function DropdownItem(_ref) {
     if (onItemClick) {
       onItemClick(item, event);
     }
-    if (handleGlobalToggle && closeOnSelect) {
+
+    // Закрываем весь дропдаун целиком при клике на айтем без потомков. Только при closeOnSelect === true.
+    if (closeOnSelect && !hasDescendants) {
       handleGlobalToggle(false, event);
     }
   };
@@ -69,20 +75,25 @@ var DropdownItem = function DropdownItem(_ref) {
   return /*#__PURE__*/React.createElement(React.Fragment, null, dividerBefore && /*#__PURE__*/React.createElement(Divider, {
     variant: variant
   }), /*#__PURE__*/React.createElement(Wrapper, {
+    ref: ref,
     className: cx(isDisabledClassName, focusedClass, activeClass),
-    id: value.toString(),
+    id: getItemId(treeId, value.toString()),
     role: itemRole,
-    ref: ref,
-    "aria-disabled": disabled || isDisabled,
     onClick: handleClick,
     onMouseEnter: handleHover,
     variant: variant,
+    "aria-disabled": disabled || isDisabled,
     "aria-controls": ariaControls,
     "aria-expanded": ariaExpanded,
-    "aria-haspopup": ariaHasPopup,
     "aria-level": ariaLevel,
     "aria-label": ariaLabel
-  }, contentLeft && /*#__PURE__*/React.createElement(StyledContentLeft, null, contentLeft), /*#__PURE__*/React.createElement(StyledText, null, label), contentRight && /*#__PURE__*/React.createElement(StyledContentRight, null, contentRight), item.items && hasArrow && /*#__PURE__*/React.createElement(DisclosureIconWrapper, null, /*#__PURE__*/React.createElement(IconDisclosureRight, {
+  }, /*#__PURE__*/React.createElement(CellWrapper, null, /*#__PURE__*/React.createElement(StyledCell, {
+    contentLeft: contentLeft,
+    contentRight: contentRight,
+    alignContentLeft: "center",
+    alignContentRight: "center",
+    title: label
+  })), item.items && hasArrow && /*#__PURE__*/React.createElement(DisclosureIconWrapper, null, /*#__PURE__*/React.createElement(IconDisclosureRight, {
     size: disclosureIconSize,
     color: "inherit"
   }))), dividerAfter && /*#__PURE__*/React.createElement(Divider, {

package/es/components/Dropdown/ui/DropdownItem/DropdownItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownItem.js","sources":["../../../../../src/components/Dropdown/ui/DropdownItem/DropdownItem.tsx"],"sourcesContent":["import React, { useEffect, useRef, FC } from 'react';\n\nimport { classes } from '../../Dropdown.tokens';\nimport { cx } from '../../../../utils';\nimport { IconDisclosureRight } from '../../../_Icon';\n\nimport {\n    StyledContentLeft,\n    StyledContentRight,\n    StyledText,\n    Wrapper,\n    DisclosureIconWrapper,\n    Divider,\n} from './DropdownItem.styles';\nimport type { DropdownItemProps } from './DropdownItem.type';\n\nexport const DropdownItem: FC<DropdownItemProps> = ({\n    item,\n    path,\n    focusedPath,\n    currentLevel,\n    index,\n    itemRole,\n    closeOnSelect,\n    handleGlobalToggle,\n    onHover,\n    onItemSelect,\n    onItemClick,\n    ariaControls,\n    ariaExpanded,\n    ariaHasPopup,\n    ariaLevel,\n    ariaLabel,\n    variant,\n    hasArrow,\n    size,\n}) => {\n    const { value, label, disabled, isDisabled, contentLeft, contentRight, dividerBefore, dividerAfter } = item;\n\n    const ref = useRef<HTMLLIElement | null>(null);\n\n    const disclosureIconSize = size === 'xs' ? 'xs' : 's';\n    const isDisabledClassName = disabled || isDisabled ? classes.dropdownItemIsDisabled : undefined;\n    const focusedClass =\n        currentLevel === focusedPath.length - 1 && index === focusedPath?.[currentLevel]\n            ? classes.dropdownItemIsFocused\n            : undefined;\n    const activeClass = value === path?.[currentLevel + 1] ? classes.dropdownItemIsActive : undefined;\n\n    useEffect(() => {\n        if (focusedClass && ref?.current) {\n            ref.current.scrollIntoView({\n                behavior: 'smooth',\n                block: 'center',\n                inline: 'center',\n            });\n        }\n    }, [focusedClass]);\n\n    const handleClick = (event: React.MouseEvent<HTMLLIElement>): void => {\n        if (disabled || isDisabled) {\n            return;\n        }\n\n        if (onItemSelect) {\n            onItemSelect(item, event);\n        }\n\n        if (onItemClick) {\n            onItemClick(item, event);\n        }\n\n        if (handleGlobalToggle && closeOnSelect) {\n            handleGlobalToggle(false, event);\n        }\n    };\n\n    const handleHover = () => {\n        if (onHover) {\n            onHover(index);\n        }\n    };\n\n    return (\n        <>\n            {dividerBefore && <Divider variant={variant} />}\n            <Wrapper\n                className={cx(isDisabledClassName, focusedClass, activeClass)}\n                id={value.toString()}\n                role={itemRole}\n                ref={ref}\n                aria-disabled={disabled || isDisabled}\n                onClick={handleClick}\n                onMouseEnter={handleHover}\n                variant={variant}\n                aria-controls={ariaControls}\n                aria-expanded={ariaExpanded}\n                aria-haspopup={ariaHasPopup}\n                aria-level={ariaLevel}\n                aria-label={ariaLabel}\n            >\n                {contentLeft && <StyledContentLeft>{contentLeft}</StyledContentLeft>}\n                <StyledText>{label}</StyledText>\n                {contentRight && <StyledContentRight>{contentRight}</StyledContentRight>}\n\n                {item.items && hasArrow && (\n                    <DisclosureIconWrapper>\n                        <IconDisclosureRight size={disclosureIconSize} color=\"inherit\" />\n                    </DisclosureIconWrapper>\n                )}\n            </Wrapper>\n            {dividerAfter && <Divider variant={variant} />}\n        </>\n    );\n};\n"],"names":["DropdownItem","_ref","item","path","focusedPath","currentLevel","index","itemRole","closeOnSelect","handleGlobalToggle","onHover","onItemSelect","onItemClick","ariaControls","ariaExpanded","ariaHasPopup","ariaLevel","ariaLabel","variant","hasArrow","size","value","label","disabled","isDisabled","contentLeft","contentRight","dividerBefore","dividerAfter","ref","useRef","disclosureIconSize","isDisabledClassName","classes","dropdownItemIsDisabled","undefined","focusedClass","length","dropdownItemIsFocused","activeClass","dropdownItemIsActive","useEffect","current","scrollIntoView","behavior","block","inline","handleClick","event","handleHover","React","createElement","Fragment","Divider","Wrapper","className","cx","id","toString","role","onClick","onMouseEnter","StyledContentLeft","StyledText","StyledContentRight","items","DisclosureIconWrapper","IconDisclosureRight","color"],"mappings":"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"}
+{"version":3,"file":"DropdownItem.js","sources":["../../../../../src/components/Dropdown/ui/DropdownItem/DropdownItem.tsx"],"sourcesContent":["import React, { useEffect, useRef, FC, useContext } from 'react';\n\nimport { classes } from '../../Dropdown.tokens';\nimport { cx } from '../../../../utils';\nimport { IconDisclosureRight } from '../../../_Icon';\nimport { Context } from '../../Dropdown';\nimport { getItemId } from '../../utils';\n\nimport { Wrapper, DisclosureIconWrapper, Divider, CellWrapper, StyledCell } from './DropdownItem.styles';\nimport type { DropdownItemProps } from './DropdownItem.type';\n\nexport const DropdownItem: FC<DropdownItemProps> = ({\n    item,\n    path,\n    currentLevel,\n    index,\n    ariaControls,\n    ariaExpanded,\n    ariaLevel,\n    ariaLabel,\n}) => {\n    const { value, label, disabled, isDisabled, contentLeft, contentRight, dividerBefore, dividerAfter } = item;\n\n    const ref = useRef<HTMLLIElement | null>(null);\n\n    const {\n        focusedPath,\n        size,\n        variant,\n        itemRole,\n        handleGlobalToggle,\n        closeOnSelect,\n        onHover,\n        onItemSelect,\n        onItemClick,\n        hasArrow,\n        treeId,\n    } = useContext(Context);\n\n    const hasDescendants = Boolean(item.items);\n    const disclosureIconSize = size === 'xs' ? 'xs' : 's';\n    const isDisabledClassName = disabled || isDisabled ? classes.dropdownItemIsDisabled : undefined;\n    const focusedClass =\n        currentLevel === focusedPath.length - 1 && index === focusedPath?.[currentLevel]\n            ? classes.dropdownItemIsFocused\n            : undefined;\n    const activeClass = value === path?.[currentLevel + 1] ? classes.dropdownItemIsActive : undefined;\n\n    useEffect(() => {\n        if (focusedClass && ref?.current) {\n            ref.current.scrollIntoView({\n                behavior: 'smooth',\n                block: 'center',\n                inline: 'center',\n            });\n        }\n    }, [focusedClass]);\n\n    const handleClick = (event: React.MouseEvent<HTMLLIElement>): void => {\n        if (disabled || isDisabled) {\n            return;\n        }\n\n        if (onItemSelect) {\n            onItemSelect(item, event);\n        }\n\n        if (onItemClick) {\n            onItemClick(item, event);\n        }\n\n        // Закрываем весь дропдаун целиком при клике на айтем без потомков. Только при closeOnSelect === true.\n        if (closeOnSelect && !hasDescendants) {\n            handleGlobalToggle(false, event);\n        }\n    };\n\n    const handleHover = () => {\n        if (onHover) {\n            onHover(index);\n        }\n    };\n\n    return (\n        <>\n            {dividerBefore && <Divider variant={variant} />}\n\n            <Wrapper\n                ref={ref}\n                className={cx(isDisabledClassName, focusedClass, activeClass)}\n                id={getItemId(treeId, value.toString())}\n                role={itemRole}\n                onClick={handleClick}\n                onMouseEnter={handleHover}\n                variant={variant}\n                aria-disabled={disabled || isDisabled}\n                aria-controls={ariaControls}\n                aria-expanded={ariaExpanded}\n                aria-level={ariaLevel}\n                aria-label={ariaLabel}\n            >\n                <CellWrapper>\n                    <StyledCell\n                        contentLeft={contentLeft}\n                        contentRight={contentRight}\n                        alignContentLeft=\"center\"\n                        alignContentRight=\"center\"\n                        title={label}\n                    />\n                </CellWrapper>\n\n                {item.items && hasArrow && (\n                    <DisclosureIconWrapper>\n                        <IconDisclosureRight size={disclosureIconSize} color=\"inherit\" />\n                    </DisclosureIconWrapper>\n                )}\n            </Wrapper>\n\n            {dividerAfter && <Divider variant={variant} />}\n        </>\n    );\n};\n"],"names":["DropdownItem","_ref","item","path","currentLevel","index","ariaControls","ariaExpanded","ariaLevel","ariaLabel","value","label","disabled","isDisabled","contentLeft","contentRight","dividerBefore","dividerAfter","ref","useRef","_useContext","useContext","Context","focusedPath","size","variant","itemRole","handleGlobalToggle","closeOnSelect","onHover","onItemSelect","onItemClick","hasArrow","treeId","hasDescendants","Boolean","items","disclosureIconSize","isDisabledClassName","classes","dropdownItemIsDisabled","undefined","focusedClass","length","dropdownItemIsFocused","activeClass","dropdownItemIsActive","useEffect","current","scrollIntoView","behavior","block","inline","handleClick","event","handleHover","React","createElement","Fragment","Divider","Wrapper","className","cx","id","getItemId","toString","role","onClick","onMouseEnter","CellWrapper","StyledCell","alignContentLeft","alignContentRight","title","DisclosureIconWrapper","IconDisclosureRight","color"],"mappings":"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"}

package/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js

@@ -1,34 +1,38 @@
-import './DropdownItem.styles_blclup.css';
+import './DropdownItem.styles_17va0nk.css';
 import { styled } from '@linaria/react';
 import { tokens } from '../../Dropdown.tokens.js';
+import 'react';
+import { cellConfig } from '../../../Cell/Cell.js';
+import '@linaria/core';
+import { component, mergeConfig } from '../../../../engines/common.js';
 
-var StyledContentLeft = /*#__PURE__*/styled('div')({
-  name: "StyledContentLeft",
-  "class": "s1gkzlls",
+var mergedCellConfig = /*#__PURE__*/mergeConfig(cellConfig);
+var Cell = /*#__PURE__*/component(mergedCellConfig);
+var CellWrapper = /*#__PURE__*/styled('div')({
+  name: "CellWrapper",
+  "class": "c1gkzlls",
   propsAsIs: false
 });
-var StyledContentRight = /*#__PURE__*/styled('div')({
-  name: "StyledContentRight",
+var _exp29 = function _exp29() {
+  return Cell;
+};
+var StyledCell = /*#__PURE__*/styled(_exp29())({
+  name: "StyledCell",
   "class": "sz6s14y",
-  propsAsIs: false
+  propsAsIs: true
 });
 var DisclosureIconWrapper = /*#__PURE__*/styled('div')({
   name: "DisclosureIconWrapper",
   "class": "d1m97l2m",
   propsAsIs: false
 });
-var StyledText = /*#__PURE__*/styled('div')({
-  name: "StyledText",
-  "class": "soib72h",
-  propsAsIs: false
-});
-var _exp3 = function _exp3() {
+var _exp31 = function _exp31() {
   return function (_ref) {
     var variant = _ref.variant;
     return "var(".concat(variant === 'tight' ? tokens.dividerMarginTopTight : tokens.dividerMarginTop, ")");
   };
 };
-var _exp5 = function _exp5() {
+var _exp33 = function _exp33() {
   return function (_ref2) {
     var variant = _ref2.variant;
     return "var(".concat(variant === 'tight' ? tokens.dividerMarginBottomTight : tokens.dividerMarginBottom, ")");
@@ -36,34 +40,27 @@ var _exp5 = function _exp5() {
 };
 var Divider = /*#__PURE__*/styled('div')({
   name: "Divider",
-  "class": "d6l2f0g",
+  "class": "doib72h",
   propsAsIs: false,
   vars: {
-    "d6l2f0g-0": [/*#__PURE__*/_exp3()],
-    "d6l2f0g-1": [/*#__PURE__*/_exp5()]
+    "doib72h-0": [/*#__PURE__*/_exp31()],
+    "doib72h-1": [/*#__PURE__*/_exp33()]
   }
 });
-var _exp8 = function _exp8() {
+var _exp37 = function _exp37() {
   return function (_ref3) {
     var variant = _ref3.variant;
-    return "var(".concat(variant === 'tight' ? tokens.itemPaddingTopTight : tokens.itemPaddingTop, ")");
-  };
-};
-var _exp10 = function _exp10() {
-  return function (_ref4) {
-    var variant = _ref4.variant;
-    return "var(".concat(variant === 'tight' ? tokens.itemPaddingBottomTight : tokens.itemPaddingBottom, ")");
+    return "var(".concat(variant === 'tight' ? tokens.itemPaddingTight : tokens.itemPadding, ")");
   };
 };
 var Wrapper = /*#__PURE__*/styled('li')({
   name: "Wrapper",
-  "class": "w1jav4ek",
+  "class": "w6l2f0g",
   propsAsIs: false,
   vars: {
-    "w1jav4ek-0": [/*#__PURE__*/_exp8()],
-    "w1jav4ek-1": [/*#__PURE__*/_exp10()]
+    "w6l2f0g-0": [/*#__PURE__*/_exp37()]
   }
 });
 
-export { DisclosureIconWrapper, Divider, StyledContentLeft, StyledContentRight, StyledText, Wrapper };
+export { CellWrapper, DisclosureIconWrapper, Divider, StyledCell, Wrapper };
 //# sourceMappingURL=DropdownItem.styles.js.map

package/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownItem.styles.js","sources":["../../../../../src/components/Dropdown/ui/DropdownItem/DropdownItem.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { classes, tokens } from '../../Dropdown.tokens';\nimport { addFocus, applyEllipsis } from '../../../../mixins';\nimport { DropdownProps } from '../../Dropdown.types';\n\nexport const StyledContentLeft = styled.div`\n    display: inline-flex;\n`;\n\nexport const StyledContentRight = styled.div`\n    margin-left: auto;\n    display: inline-flex;\n`;\n\nexport const DisclosureIconWrapper = styled.div`\n    line-height: 0;\n    color: var(${tokens.disclosureIconColor});\n`;\n\nexport const StyledText = styled.div`\n    ${applyEllipsis()};\n    flex: 1;\n`;\n\nexport const Divider = styled.div<{ variant: DropdownProps['variant'] }>`\n    height: 1px;\n    margin-top: ${({ variant }) =>\n        `var(${variant === 'tight' ? tokens.dividerMarginTopTight : tokens.dividerMarginTop})`};\n    margin-right: var(${tokens.dividerMarginRight});\n    margin-bottom: ${({ variant }) =>\n        `var(${variant === 'tight' ? tokens.dividerMarginBottomTight : tokens.dividerMarginBottom})`};\n    margin-left: var(${tokens.dividerMarginLeft});\n    background: var(${tokens.dividerColor});\n`;\n\nexport const Wrapper = styled.li<{ variant: DropdownProps['variant'] }>`\n    display: flex;\n    align-items: center;\n    margin: 0;\n    box-sizing: content-box;\n    padding-top: ${({ variant }) => `var(${variant === 'tight' ? tokens.itemPaddingTopTight : tokens.itemPaddingTop})`};\n    padding-right: var(${tokens.itemPaddingRight});\n    padding-bottom: ${({ variant }) =>\n        `var(${variant === 'tight' ? tokens.itemPaddingBottomTight : tokens.itemPaddingBottom})`};\n    padding-left: var(${tokens.itemPaddingLeft});\n    font-family: var(${tokens.itemFontFamily});\n    font-size: var(${tokens.itemFontSize});\n    font-style: var(${tokens.itemFontStyle});\n    font-weight: var(${tokens.itemFontWeightBold});\n    letter-spacing: var(${tokens.itemFontLetterSpacing});\n    line-height: var(${tokens.itemFontLineHeight});\n    background: var(${tokens.itemBackground});\n    color: var(${tokens.itemColor});\n    border-radius: var(${tokens.itemBorderRadius});\n    user-select: none;\n\n    &:hover:not(.${classes.dropdownItemIsDisabled}) {\n        cursor: pointer;\n        background: var(${tokens.itemBackgroundHover});\n    }\n\n    &.${classes.dropdownItemIsActive} {\n        background: var(${tokens.itemBackgroundHover});\n    }\n\n    &.${classes.dropdownItemIsDisabled} {\n        opacity: var(${tokens.disabledOpacity});\n        cursor: not-allowed;\n    }\n\n    :focus {\n        outline: none;\n    }\n\n    ${addFocus({\n        outlineSize: '0.0625rem',\n        outlineOffset: '0',\n        outlineColor: `var(${tokens.focusColor})`,\n        outlineRadius: `var(${tokens.itemBorderRadius})`,\n        hasTransition: false,\n        customFocusRules: `\n            &.${classes.dropdownItemIsFocused}:before {\n                outline: none;\n                box-shadow: 0 0 0 0.0625rem var(${tokens.focusColor});\n            }\n        `,\n    })};\n`;\n"],"names":["StyledContentLeft","styled","name","class","propsAsIs","StyledContentRight","DisclosureIconWrapper","StyledText","_exp3","_ref","variant","tokens","dividerMarginTopTight","dividerMarginTop","_exp5","_ref2","dividerMarginBottomTight","dividerMarginBottom","Divider","vars","_exp8","_ref3","itemPaddingTopTight","itemPaddingTop","_exp10","_ref4","itemPaddingBottomTight","itemPaddingBottom","Wrapper"],"mappings":"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"}
+{"version":3,"file":"DropdownItem.styles.js","sources":["../../../../../src/components/Dropdown/ui/DropdownItem/DropdownItem.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { classes, tokens, constants } from '../../Dropdown.tokens';\nimport { addFocus } from '../../../../mixins';\nimport { DropdownProps } from '../../Dropdown.types';\nimport { cellConfig, cellTokens } from '../../../Cell';\nimport { component, mergeConfig } from '../../../../engines';\n\nconst mergedCellConfig = mergeConfig(cellConfig);\nconst Cell = component(mergedCellConfig);\n\nexport const CellWrapper = styled.div`\n    ${cellTokens.cellTitleColor}: var(${constants.cellTitleColor});\n    ${cellTokens.cellBackgroundColor}: var(${constants.cellBackgroundColor});\n    ${cellTokens.cellPadding}: var(${tokens.cellPadding});\n    ${cellTokens.cellPaddingLeftContent}: var(${tokens.cellPaddingLeftContent});\n    ${cellTokens.cellPaddingContent}: var(${tokens.cellPaddingContent});\n    ${cellTokens.cellPaddingRightContent}: var(${tokens.cellPaddingRightContent});\n    ${cellTokens.cellTextboxGap}: var(${tokens.cellTextboxGap});\n    ${cellTokens.cellGap}: var(${tokens.cellGap});\n    ${cellTokens.cellTitleFontFamily}: var(${tokens.cellTitleFontFamily});\n    ${cellTokens.cellTitleFontSize}: var(${tokens.cellTitleFontSize});\n    ${cellTokens.cellTitleFontStyle}: var(${tokens.cellTitleFontStyle});\n    ${cellTokens.cellTitleFontWeight}: var(${tokens.cellTitleFontWeight});\n    ${cellTokens.cellTitleLetterSpacing}: var(${tokens.cellTitleLetterSpacing});\n    ${cellTokens.cellTitleLineHeight}: var(${tokens.cellTitleLineHeight});\n    width: 100%;\n`;\n\nexport const StyledCell = styled(Cell)``;\n\nexport const DisclosureIconWrapper = styled.div`\n    line-height: 0;\n    color: var(${constants.disclosureIconColor});\n`;\n\nexport const Divider = styled.div<{ variant: DropdownProps['variant'] }>`\n    height: 1px;\n    margin-top: ${({ variant }) =>\n        `var(${variant === 'tight' ? tokens.dividerMarginTopTight : tokens.dividerMarginTop})`};\n    margin-right: var(${tokens.dividerMarginRight});\n    margin-bottom: ${({ variant }) =>\n        `var(${variant === 'tight' ? tokens.dividerMarginBottomTight : tokens.dividerMarginBottom})`};\n    margin-left: var(${tokens.dividerMarginLeft});\n    background: var(${tokens.dividerColor});\n`;\n\nexport const Wrapper = styled.li<{ variant: DropdownProps['variant'] }>`\n    display: flex;\n    align-items: center;\n    min-height: var(${tokens.itemHeight});\n    margin: 0;\n    box-sizing: content-box;\n    padding: ${({ variant }) => `var(${variant === 'tight' ? tokens.itemPaddingTight : tokens.itemPadding})`};\n    font-family: var(${tokens.itemFontFamily});\n    font-size: var(${tokens.itemFontSize});\n    font-style: var(${tokens.itemFontStyle});\n    font-weight: var(${tokens.itemFontWeightBold});\n    letter-spacing: var(${tokens.itemFontLetterSpacing});\n    line-height: var(${tokens.itemFontLineHeight});\n    background-color: var(${constants.itemBackground});\n    border-radius: var(${tokens.borderRadius});\n    user-select: none;\n    border-right: 0.125rem solid transparent;\n    border-left: 0.125rem solid transparent;\n    background-clip: padding-box;\n\n    &:hover:not(.${classes.dropdownItemIsDisabled}) {\n        cursor: pointer;\n        background-color: var(${constants.itemBackgroundHover});\n    }\n\n    &.${classes.dropdownItemIsActive} {\n        background-color: var(${constants.itemBackgroundHover});\n    }\n\n    &.${classes.dropdownItemIsDisabled} {\n        opacity: ${constants.opacity};\n        cursor: not-allowed;\n    }\n\n    :focus {\n        outline: none;\n    }\n\n    ${addFocus({\n        outlineSize: '0.0625rem',\n        outlineOffset: '0',\n        outlineColor: `var(${constants.focusColor})`,\n        outlineRadius: `var(${tokens.itemBorderRadius})`,\n        hasTransition: false,\n        customFocusRules: `\n            &.${classes.dropdownItemIsFocused}:before {\n                outline: none;\n                box-shadow: 0 0 0 0.0625rem var(${constants.focusColor});\n            }\n        `,\n    })};\n`;\n"],"names":["mergedCellConfig","mergeConfig","cellConfig","Cell","component","CellWrapper","styled","name","class","propsAsIs","_exp29","StyledCell","DisclosureIconWrapper","_exp31","_ref","variant","tokens","dividerMarginTopTight","dividerMarginTop","_exp33","_ref2","dividerMarginBottomTight","dividerMarginBottom","Divider","vars","_exp37","_ref3","itemPaddingTight","itemPadding","Wrapper"],"mappings":";;;;;;;AAQA,IAAMA,gBAAgB,gBAAGC,WAAW,CAACC,UAAU,CAAC,CAAA;AAChD,IAAMC,IAAI,gBAAGC,SAAS,CAACJ,gBAAgB,CAAC,CAAA;AAEjC,IAAMK,WAAW,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAgBhC,EAAA;AAAC,IAAAC,MAAA,GA1BgBA,SA0BhBA,MAAAA,GAAA;AAAA,EAAA,OAE+BP,IAAI,CAAA;AAAA,CAAA,CAAA;AAA9B,IAAMQ,UAAU,gBAAGL,MAAM,CAAAI,MAAA,EAAA,CAAA,CAAA;AAAAH,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAAQ,EAAA;AAEjC,IAAMG,qBAAqB,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,uBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAG1C,EAAA;AAAC,IAAAI,MAAA,GAjCgBA,SAiChBA,MAAAA,GAAA;AAAA,EAAA,OAIgB,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,OAAAA,GAAAA,IAAAA,CAAAA,OAAAA,CAAAA;AAAAA,IAAAA,OAAAA,MAAAA,CAAAA,MAAAA,CACNA,OAAO,KAAK,OAAO,GAAGC,MAAM,CAACC,qBAAqB,GAAGD,MAAM,CAACE,gBAAiB,EAAA,GAAA,CAAA,CAAA;GAAE,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,MAAA,GAtC5EA,SAsC4EA,MAAAA,GAAA;AAAA,EAAA,OAEzE,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGL,OAAAA,GAAAA,KAAAA,CAAAA,OAAAA,CAAAA;AAAAA,IAAAA,OAAAA,MAAAA,CAAAA,MAAAA,CACTA,OAAO,KAAK,OAAO,GAAGC,MAAM,CAACK,wBAAwB,GAAGL,MAAM,CAACM,mBAAoB,EAAA,GAAA,CAAA,CAAA;GAAE,CAAA;AAAA,CAAA,CAAA;AAN7F,IAAMC,OAAO,gBAAGjB,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,SAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAAe,EAAAA,IAAA,EAAA;AAAA,IAAA,WAAA,EAAA,cAEXX,MAC4E,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cAEzEM,MAC+E,EAAA,CAAA;AAAA,GAAA;AAAA,CAGnG,EAAA;AAAC,IAAAM,MAAA,GA5CgBA,SA4ChBA,MAAAA,GAAA;AAAA,EAAA,OAQa,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGX,OAAAA,GAAAA,KAAAA,CAAAA,OAAAA,CAAAA;AAAAA,IAAAA,OAAAA,MAAAA,CAAAA,MAAAA,CAAqBA,OAAO,KAAK,OAAO,GAAGC,MAAM,CAACW,gBAAgB,GAAGX,MAAM,CAACY,WAAY,EAAA,GAAA,CAAA,CAAA;GAAE,CAAA;AAAA,CAAA,CAAA;AANrG,IAAMC,OAAO,gBAAGvB,MAAM,CAAA,IAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,SAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAAe,EAAAA,IAAA,EAAA;AAAA,IAAA,WAAA,EAAA,cAMdC,MAA6F,EAAA,CAAA;AAAA,GAAA;AAAA,CA6C3G;;;;"}

package/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles_17va0nk.css

@@ -0,0 +1,5 @@
+.c1gkzlls{--plasma-cell-title-color:var(--text-primary);--plasma-cell-background-color:var(--plasma-colors-transparent);--plasma-cell-padding:var(--plasma-dropdown-cell-padding);--plasma-cell-padding-left-content:var(--plasma-dropdown-cell-padding-left-content);--plasma-cell-padding-content:var(--plasma-dropdown-cell-padding-content);--plasma-cell-padding-right-content:var(--plasma-dropdown-cell-padding-right-content);--plasma-cell-textbox-gap:var(--plasma-dropdown-cell-textbox-gap);--plasma-cell-gap:var(--plasma-dropdown-cell-gap);--plasma-cell-title-font-family:var(--plasma-dropdown-cell-title-font-family);--plasma-cell-title-font-size:var(--plasma-dropdown-cell-title-font-size);--plasma-cell-title-font-style:var(--plasma-dropdown-cell-title-font-style);--plasma-cell-title-font-weight:var(--plasma-dropdown-cell-title-font-weight);--plasma-cell-title-letter-spacing:var(--plasma-dropdown-cell-title-letter-spacing);--plasma-cell-title-line-height:var(--plasma-dropdown-cell-title-line-height);width:100%;}
+
+.d1m97l2m{line-height:0;color:var(--text-secondary);}
+.doib72h{height:1px;margin-top:var(--doib72h-0);margin-right:var(--plasma-dropdown-divider-margin-right);margin-bottom:var(--doib72h-1);margin-left:var(--plasma-dropdown-divider-margin-left);background:var(--plasma-dropdown-divider-color);}
+.w6l2f0g{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;min-height:var(--plasma-dropdown-item-height);margin:0;box-sizing:content-box;padding:var(--w6l2f0g-0);font-family:var(--plasma-dropdown-item-font-family);font-size:var(--plasma-dropdown-item-font-size);font-style:var(--plasma-dropdown-item-font-style);font-weight:var(--plasma-dropdown-item-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-item-line-height);-moz-letter-spacing:var(--plasma-dropdown-item-line-height);-ms-letter-spacing:var(--plasma-dropdown-item-line-height);letter-spacing:var(--plasma-dropdown-item-line-height);line-height:var(--plasma-dropdown-item-font-weight);background-color:var(--plasma-colors-transparent);border-radius:var(--plasma-dropdown-border-radius);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:0.125rem solid transparent;border-left:0.125rem solid transparent;background-clip:padding-box;position:relative;}.w6l2f0g:hover:not(.dropdown-item-is-disabled){cursor:pointer;background-color:var(--surface-transparent-secondary);}.w6l2f0g.dropdown-item-is-active{background-color:var(--surface-transparent-secondary);}.w6l2f0g.dropdown-item-is-disabled{opacity:0.4;cursor:not-allowed;}.w6l2f0g:focus{outline:none;}.w6l2f0g::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:var(--plasma-dropdown-item-border-radius);-webkit-transition:none;transition:none;pointer-events:none;}.w6l2f0g.dropdown-item-is-focused:before{outline:none;box-shadow:0 0 0 0.0625rem var(--surface-accent);}

package/es/components/Dropdown/ui/DropdownItemOld/DropdownItem.styles.js

@@ -1,4 +1,4 @@
-import './DropdownItem.styles_12e50g5.css';
+import './DropdownItem.styles_1lyg81y.css';
 import { styled } from '@linaria/react';
 import 'focus-visible';
 import 'styled-components';

package/es/components/Dropdown/ui/DropdownItemOld/{DropdownItem.styles_12e50g5.css → DropdownItem.styles_1lyg81y.css}

@@ -1,4 +1,4 @@
 .s1iqs5in{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;min-width:var(--plasma-dropdown-item-content-left-width);color:var(--plasma-dropdown-item-content-left-color);}
 .sfg3dyd{margin-left:auto;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;min-width:var(--plasma-dropdown-item-content-right-width);color:var(--plasma-dropdown-item-content-right-color);}
 .s1dea6tl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
-.b1b2nce8{box-sizing:content-box;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-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;width:auto;font-family:var(--plasma-dropdown-item-font-family);font-size:var(--plasma-dropdown-item-font-size);font-style:var(--plasma-dropdown-item-font-style);font-weight:var(--plasma-dropdown-item-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-item-line-height);-moz-letter-spacing:var(--plasma-dropdown-item-line-height);-ms-letter-spacing:var(--plasma-dropdown-item-line-height);letter-spacing:var(--plasma-dropdown-item-line-height);line-height:var(--plasma-dropdown-item-font-weight);background:var(--plasma-dropdown-item-background);color:var(--plasma-dropdown-item-color);border-radius:var(--plasma-dropdown-item-border-radius);width:var(--plasma-dropdown-item-width);height:var(--plasma-dropdown-item-height);padding:var(--plasma-dropdown-item-padding-top) var(--plasma-dropdown-item-padding-right) var(--plasma-dropdown-item-padding-bottom) var(--plasma-dropdown-item-padding-left);margin:var(--plasma-dropdown-item-margin-top) var(--plasma-dropdown-item-margin-right) var(--plasma-dropdown-item-margin-bottom) var(--plasma-dropdown-item-margin-left);}.b1b2nce8:focus{outline:none;}.b1b2nce8::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:var(--plasma-dropdown-item-border-radius);-webkit-transition:none;transition:none;pointer-events:none;}.b1b2nce8.focus-visible:focus::before,.b1b2nce8[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-dropdown-focus-color);}.b1b2nce8:hover:not(.dropdown-item-is-disabled){cursor:pointer;background:var(--plasma-dropdown-item-background-hover);}.b1b2nce8.dropdownItemIsSelected{color:var(--plasma-dropdown-item-color-selected);background:var(--plasma-dropdown-item-background-selected);}.b1b2nce8.dropdownItemIsSelected:hover:not(.dropdown-item-is-disabled){background:var(--plasma-dropdown-item-background-selected-hover);}.b1b2nce8.dropdown-item-is-disabled{opacity:var(--plasma-dropdown-disabled-opacity);cursor:not-allowed;}
+.b1b2nce8{box-sizing:content-box;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-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;width:auto;font-family:var(--plasma-dropdown-item-font-family);font-size:var(--plasma-dropdown-item-font-size);font-style:var(--plasma-dropdown-item-font-style);font-weight:var(--plasma-dropdown-item-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-item-line-height);-moz-letter-spacing:var(--plasma-dropdown-item-line-height);-ms-letter-spacing:var(--plasma-dropdown-item-line-height);letter-spacing:var(--plasma-dropdown-item-line-height);line-height:var(--plasma-dropdown-item-font-weight);background:var(--plasma-dropdown-item-background);color:var(--plasma-dropdown-item-color);border-radius:var(--plasma-dropdown-item-border-radius);width:var(--plasma-dropdown-item-width);height:var(--plasma-dropdown-item-height);padding:var(--plasma-dropdown-item-padding-top) var(--plasma-dropdown-item-padding-right) var(--plasma-dropdown-item-padding-bottom) var(--plasma-dropdown-item-padding-left);margin:var(--plasma-dropdown-item-margin-top) var(--plasma-dropdown-item-margin-right) var(--plasma-dropdown-item-margin-bottom) var(--plasma-dropdown-item-margin-left);}.b1b2nce8:focus{outline:none;}.b1b2nce8::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:var(--plasma-dropdown-item-border-radius);-webkit-transition:none;transition:none;pointer-events:none;}.b1b2nce8.focus-visible:focus::before,.b1b2nce8[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-dropdown-focus-color);}.b1b2nce8:hover:not(.dropdown-item-is-disabled){cursor:pointer;background:var(--plasma-dropdown-item-background-hover);}.b1b2nce8.dropdown-item-is-selected{color:var(--plasma-dropdown-item-color-selected);background:var(--plasma-dropdown-item-background-selected);}.b1b2nce8.dropdown-item-is-selected:hover:not(.dropdown-item-is-disabled){background:var(--plasma-dropdown-item-background-selected-hover);}.b1b2nce8.dropdown-item-is-disabled{opacity:var(--plasma-dropdown-disabled-opacity);cursor:not-allowed;}