@salutejs/plasma-new-hope 0.192.0-canary.1539.11802074105.0 → 0.192.0-canary.1550.11801015277.0

package/styled-components/cjs/components/Select/Select.styles.js

@@ -4,40 +4,25 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.base = exports.Ul = exports.StyledPopover = exports.OuterLabel = exports.HelperText = void 0;
+exports.base = exports.Ul = void 0;
 var _styledComponents = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("styled-components"));
-var _engines = /*#__PURE__*/require("../../engines");
-var _Popover = /*#__PURE__*/require("../Popover");
 var _utils = /*#__PURE__*/require("./utils");
 var _Select = /*#__PURE__*/require("./Select.tokens");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
-var Popover = /*#__PURE__*/(0, _engines.component)(_Popover.popoverConfig);
-var StyledPopover = exports.StyledPopover = /*#__PURE__*/(0, _styledComponents["default"])(Popover).withConfig({
+var Ul = exports.Ul = /*#__PURE__*/_styledComponents["default"].ul.withConfig({
   componentId: "plasma-new-hope__sc-le54jv-0"
-})([".", "{width:", ";}.", "{width:100%;}"], /*#__PURE__*/String(_Popover.popoverClasses.root), function (_ref) {
+})(["box-sizing:border-box;background:var(", ");box-shadow:", ",inset 0 0 0 var(", ",0rem) var(", ",transparent);border-radius:var(", ");width:", ";height:", ";overflow:", ";margin:", ";padding:calc(var(", ") + var(", ",0rem)) 0;"], _Select.constants.background, _Select.constants.boxShadow, _Select.tokens.dropdownBorderWidth, _Select.tokens.dropdownBorderColor, _Select.tokens.borderRadius, function (_ref) {
   var listWidth = _ref.listWidth;
   return listWidth || '100%';
-}, /*#__PURE__*/String(_Popover.popoverClasses.target));
-var Ul = exports.Ul = /*#__PURE__*/_styledComponents["default"].ul.withConfig({
-  componentId: "plasma-new-hope__sc-le54jv-1"
-})(["box-sizing:border-box;background:var(", ");box-shadow:", ";border-radius:var(", ");width:", ";height:", ";overflow:", ";border:var(", ") solid var(", ");margin:", ";padding:var(", ");"], _Select.constants.background, _Select.constants.boxShadow, _Select.tokens.borderRadius, function (_ref2) {
-  var listWidth = _ref2.listWidth;
-  return listWidth || '100%';
-}, function (_ref3) {
-  var listHeight = _ref3.listHeight;
+}, function (_ref2) {
+  var listHeight = _ref2.listHeight;
   return listHeight ? (0, _utils.getCorrectHeight)(listHeight) : 'auto';
-}, function (_ref4) {
-  var listOverflow = _ref4.listOverflow;
+}, function (_ref3) {
+  var listOverflow = _ref3.listOverflow;
   return listOverflow || 'initial';
-}, _Select.tokens.popoverBorderWidth, _Select.tokens.popoverBorderColor, function (_ref5) {
-  var isInnerUl = _ref5.isInnerUl;
-  return isInnerUl ? "calc(var(".concat(_Select.tokens.padding, ") * -1) 0 0 var(").concat(_Select.tokens.padding, ")") : 0;
-}, _Select.tokens.padding);
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([".", ",.", "{display:block;}"], _Popover.popoverClasses.wrapper, _Popover.popoverClasses.target);
-var OuterLabel = exports.OuterLabel = /*#__PURE__*/_styledComponents["default"].label.withConfig({
-  componentId: "plasma-new-hope__sc-le54jv-2"
-})(["display:block;margin-bottom:var(", ");color:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");"], _Select.tokens.labelOffset, _Select.constants.textfieldOuterLabelColor, _Select.tokens.labelFontFamily, _Select.tokens.labelFontSize, _Select.tokens.labelFontStyle, _Select.tokens.labelFontWeight, _Select.tokens.labelFontLetterSpacing, _Select.tokens.labelFontLineHeight);
-var HelperText = exports.HelperText = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-le54jv-3"
-})(["margin-top:var(", ");color:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");"], _Select.tokens.helperTextOffset, _Select.tokens.helperTextColor, _Select.tokens.helperTextFontFamily, _Select.tokens.helperTextFontSize, _Select.tokens.helperTextFontStyle, _Select.tokens.helperTextFontWeight, _Select.tokens.helperTextFontLetterSpacing, _Select.tokens.helperTextFontLineHeight);
+}, function (_ref4) {
+  var isInnerUl = _ref4.isInnerUl;
+  return isInnerUl ? "calc(var(".concat(_Select.tokens.padding, ") * -1) 0 0 0") : 0;
+}, _Select.tokens.padding, _Select.tokens.dropdownBorderWidth);
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);

package/styled-components/cjs/components/Select/Select.tokens.js

@@ -13,31 +13,19 @@ var classes = exports.classes = {
   textfieldTarget: 'select-textfield-target',
   selectChipIsFocused: 'select-chip-is-focused',
   selectWithoutBoxShadow: 'select-without-box-shadow',
-  selectItemCheckbox: 'select-item-checkbox',
   selectSpinner: 'select-spinner'
 };
 var tokens = exports.tokens = {
   borderRadius: '--plasma-select-border-radius',
   padding: '--plasma-select-padding',
-  focusOffset: '--plasma-select-focus-offset',
   fontFamily: '--plasma-select-font-family',
   fontSize: '--plasma-select-font-size',
   fontStyle: '--plasma-select-font-style',
   fontWeight: '--plasma-select-font-weight',
   fontLetterSpacing: '--plasma-select-font-letter-spacing',
   fontLineHeight: '--plasma-select-font-line-height',
-  labelFontFamily: '--plasma-select-label-font-family',
-  labelFontSize: '--plasma-select-label-font-size',
-  labelFontStyle: '--plasma-select-label-font-style',
-  labelFontWeight: '--plasma-select-label-font-weight',
-  labelFontLetterSpacing: '--plasma-select-label-font-letter-spacing',
-  labelFontLineHeight: '--plasma-select-label-font-line-height',
-  helperTextFontFamily: '--plasma-select-helper-text-font-family',
-  helperTextFontSize: '--plasma-select-helper-text-font-size',
-  helperTextFontStyle: '--plasma-select-helper-text-font-style',
-  helperTextFontWeight: '--plasma-select-helper-text-font-weight',
-  helperTextFontLetterSpacing: '--plasma-select-helper-text-font-letter-spacing',
-  helperTextFontLineHeight: '--plasma-select-helper-text-font-line-height',
+  dropdownBorderColor: '--plasma-select-dropdown-border-color',
+  dropdownBorderWidth: '--plasma-select-dropdown-border-width',
   itemHeight: '--plasma-select-item-height',
   itemBorderRadius: '--plasma-select-item-border-radius',
   itemPadding: '--plasma-select-item-padding',
@@ -46,6 +34,18 @@ var tokens = exports.tokens = {
   itemIconSizeTight: '--plasma-select-item-icon-size-tight',
   itemIconMargin: '--plasma-select-item-icon-margin',
   itemBackgroundHover: '--plasma-select-item-background-hover',
+  cellPadding: '--plasma-select-cell-padding',
+  cellPaddingLeftContent: '--plasma-select-cell-padding-left-content',
+  cellPaddingContent: '--plasma-select-cell-padding-content',
+  cellPaddingRightContent: '--plasma-select-cell-padding-right-content',
+  cellTextboxGap: '--plasma-select-cell-textbox-gap',
+  cellGap: '--plasma-select-cell-gap',
+  cellTitleFontFamily: '--plasma-select-cell-title-font-family',
+  cellTitleFontSize: '--plasma-select-cell-title-font-size',
+  cellTitleFontStyle: '--plasma-select-cell-title-font-style',
+  cellTitleFontWeight: '--plasma-select-cell-title-font-weight',
+  cellTitleLetterSpacing: '--plasma-select-cell-title-letter-spacing',
+  cellTitleLineHeight: '--plasma-select-cell-title-line-height',
   checkboxTriggerSize: '--plasma-select-checkbox-trigger-size',
   checkboxTriggerSizeTight: '--plasma-select-checkbox-trigger-size-tight',
   checkboxTriggerBorderRadius: '--plasma-select-checkbox-trigger-border-radius',
@@ -54,53 +54,116 @@ var tokens = exports.tokens = {
   checkboxIconColor: '--plasma-select-checkbox-icon-color',
   checkboxTriggerBorderColor: '--plasma-select-checkbox-trigger-border-color',
   indicatorSize: '--plasma-select-indicator-size',
-  targetButtonColor: '--plasma-select-target-button-color',
-  targetButtonColorHover: '--plasma-select-target-button-color-hover',
-  targetButtonColorActive: '--plasma-select-target-button-color-active',
-  targetButtonArrowColor: '--plasma-select-target-button-arrow-color',
-  targetButtonArrowColorHover: '--plasma-select-target-button-arrow-color-hover',
-  targetButtonArrowColorActive: '--plasma-select-target-button-arrow-color-active',
-  targetTextfieldArrowColor: '--plasma-select-target-textfield-arrow-color',
-  targetTextfieldArrowColorHover: '--plasma-select-target-textfield-arrow-color-hover',
-  targetTextfieldArrowColorActive: '--plasma-select-target-textfield-arrow-color-active',
-  targetButtonArrowMargin: '--plasma-select-target-button-arrow-margin',
-  targetTextfieldArrowMargin: '--plasma-select-target-textfield-arrow-margin',
-  targetButtonBackgroundColor: '--plasma-select-target-button-background-color',
-  targetButtonBackgroundColorHover: '--plasma-select-target-button-background-color-hover',
-  targetButtonBackgroundColorActive: '--plasma-select-target-button-background-color-active',
-  targetTextfieldBackgroundColor: '--plasma-select-target-textfield-background-color',
-  targetTextfieldBackgroundColorOpened: '--plasma-select-target-textfield-background-color-opened',
-  targetTextfieldBorderColor: '--plasma-select-target-textfield-border-color',
-  targetTextfieldBorderColorHover: '--plasma-select-target-textfield-border-color-hover',
-  targetTextfieldBorderOpenedColor: '--plasma-select-target-textfield-border-opened-color',
-  targetTextfieldBorderSize: '--plasma-select-target-textfield-border-size',
-  targetButtonPadding: '--plasma-select-target-button-padding',
-  targetTextfieldPadding: '--plasma-select-target-textfield-padding',
-  targetTextfieldChipPadding: '--plasma-select-target-textfield-chip-padding',
   targetHeight: '--plasma-select-target-height',
-  chipColor: '--plasma-select-chip-color',
-  chipBackground: '--plasma-select-chip-background',
-  chipBackgroundHover: '--plasma-select-chip-background-hover',
-  chipBackgroundActive: '--plasma-select-chip-background-active',
-  chipGap: '--plasma-select-chip-gap',
-  chipBorderRadius: '--plasma-select-chip-border-radius',
-  chipHeight: '--plasma-select-chip-height',
-  chipPaddingRight: '--plasma-select-chip-padding-right',
-  chipPaddingLeft: '--plasma-select-chip-padding-left',
-  chipCloseIconSize: '--plasma-select-chip-close-icon-size',
-  chipClearContentMarginLeft: '--plasma-select-chip-clear-content-margin-left',
-  chipClearContentMarginRight: '--plasma-select-chip-clear-content-margin-right',
-  popoverBorderColor: '--plasma-select-popover-border-color',
-  popoverBorderWidth: '--plasma-select-popover-border-width',
-  labelOffset: '--plasma-select-label-offset',
-  innerLabelGap: '--plasma-select-inner-label-gap',
-  helperTextColor: '--plasma-select-helper-text-color',
-  helperTextOffset: '--plasma-select-helper-text-offset',
-  spinnerSize: '--plasma-select-spinner-size',
-  spinnerSizeTight: '--plasma-select-spinner-size-tight',
+  // Токены для Button
+  buttonColor: '--plasma-select-button-color',
+  buttonColorHover: '--plasma-select-button-color-hover',
+  buttonColorActive: '--plasma-select-button-color-active',
+  buttonArrowColor: '--plasma-select-button-arrow-color',
+  buttonArrowColorHover: '--plasma-select-button-arrow-color-hover',
+  buttonArrowColorActive: '--plasma-select-button-arrow-color-active',
+  buttonArrowMargin: '--plasma-select-button-arrow-margin',
+  buttonBackgroundColor: '--plasma-select-button-background-color',
+  buttonBackgroundColorHover: '--plasma-select-button-background-color-hover',
+  buttonBackgroundColorActive: '--plasma-select-button-background-color-active',
+  buttonPadding: '--plasma-select-button-padding',
+  // Токены для TextField
+  textFieldColor: '--plasma-select-textfield-color',
+  textFieldBackgroundColor: '--plasma-select-textfield-background-color',
+  textFieldBackgroundColorHover: '--plasma-select-textfield-background-color-hover',
+  textFieldBackgroundColorFocus: '--plasma-select-textfield-background-color-focus',
+  textFieldBorderColor: '--plasma-select-textfield-border-color',
+  textFieldBorderColorHover: '--plasma-select-textfield-border-color-hover',
+  textFieldBorderColorFocus: '--plasma-select-textfield-border-color-focus',
+  textFieldPlaceholderColor: '--plasma-select-textfield-placeholder-color',
+  textFieldPlaceholderColorFocus: '--plasma-select-textfield-placeholder-color-focus',
+  textFieldOptionalColor: '--plasma-select-textfield-optional-color',
+  textFieldHeight: '--plasma-select-textfield-height',
+  textFieldBorderWidth: '--plasma-select-textfield-border-width',
+  textFieldBorderRadius: '--plasma-select-textfield-border-radius',
+  textFieldPadding: '--plasma-select-textfield-padding',
+  textFieldPaddingWithChips: '--plasma-select-textfield-padding-with-chips',
+  textFieldLeftContentMargin: '--plasma-select-textfield-left-content-margin',
+  textFieldRightContentMargin: '--plasma-select-textfield-right-content-margin',
+  textFieldFontFamily: '--plasma-select-textfield-font-family',
+  textFieldFontStyle: '--plasma-select-textfield-font-style',
+  textFieldFontSize: '--plasma-select-textfield-font-size',
+  textFieldFontWeight: '--plasma-select-textfield-font-weight',
+  textFieldLetterSpacing: '--plasma-select-textfield-letter-spacing',
+  textFieldLineHeight: '--plasma-select-textfield-line-height',
+  textFieldContentSlotColor: '--plasma-select-textfield-content-slot-color',
+  textFieldContentSlotColorHover: '--plasma-select-textfield-content-slot-color-hover',
+  textFieldContentSlotColorActive: '--plasma-select-textfield-content-slot-color-active',
+  textFieldContentSlotRightColor: '--plasma-select-textfield-content-right-slot-color',
+  textFieldContentSlotRightColorHover: '--plasma-select-textfield-content-right-slot-color-hover',
+  textFieldContentSlotRightColorActive: '--plasma-select-textfield-content-right-slot-color-active',
+  textFieldLabelColor: '--plasma-select-textfield-label-color',
+  textFieldLabelOffset: '--plasma-select-textfield-label-offset',
+  textFieldLabelFontFamily: '--plasma-select-textfield-label-font-family',
+  textFieldLabelFontStyle: '--plasma-select-textfield-label-font-style',
+  textFieldLabelFontSize: '--plasma-select-textfield-label-font-size',
+  textFieldLabelFontWeight: '--plasma-select-textfield-label-font-weight',
+  textFieldLabelLetterSpacing: '--plasma-select-textfield-label-letter-spacing',
+  textFieldLabelLineHeight: '--plasma-select-textfield-label-line-height',
+  textFieldLabelInnerFontFamily: '--plasma-select-textfield-placement-inner-label-font-family',
+  textFieldLabelInnerFontStyle: '--plasma-select-textfield-placement-inner-label-font-style',
+  textFieldLabelInnerFontSize: '--plasma-select-textfield-placement-inner-label-font-size',
+  textFieldLabelInnerFontWeight: '--plasma-select-textfield-placement-inner-label-font-weight',
+  textFieldLabelInnerLetterSpacing: '--plasma-select-textfield-placement-inner-label-letter-spacing',
+  textFieldLabelInnerLineHeight: '--plasma-select-textfield-placement-inner-label-line-height',
+  textFieldLabelInnerPadding: '--plasma-select-textfield-placement-inner-label-padding',
+  textFieldContentLabelInnerPadding: '--plasma-select-textfield-placement-inner-content-padding',
+  textFieldTitleCaptionColor: '--plasma-select-textfield-title-caption-color',
+  textFieldTitleCaptionInnerLabelOffset: '--plasma-select-textfield-title-caption-label-inner-offset',
+  textFieldTitleCaptionFontFamily: '--plasma-select-textfield-title-caption-font-family',
+  textFieldTitleCaptionFontStyle: '--plasma-select-textfield-title-caption-font-style',
+  textFieldTitleCaptionFontSize: '--plasma-select-textfield-title-caption-font-size',
+  textFieldTitleCaptionFontWeight: '--plasma-select-textfield-title-caption-font-weight',
+  textFieldTitleCaptionLetterSpacing: '--plasma-select-textfield-title-caption-letter-spacing',
+  textFieldTitleCaptionLineHeight: '--plasma-select-textfield-title-caption-line-height',
+  textFieldLeftHelperColor: '--plasma-select-textfield-left-helper-color',
+  textFieldLeftHelperOffset: '--plasma-select-textfield-left-helper-offset',
+  textFieldLeftHelperFontFamily: '--plasma-select-textfield-left-helper-font-family',
+  textFieldLeftHelperFontStyle: '--plasma-select-textfield-left-helper-font-style',
+  textFieldLeftHelperFontSize: '--plasma-select-textfield-left-helper-font-size',
+  textFieldLeftHelperFontWeight: '--plasma-select-textfield-left-helper-font-weight',
+  textFieldLeftHelperLetterSpacing: '--plasma-select-textfield-left-helper-letter-spacing',
+  textFieldLeftHelperLineHeight: '--plasma-select-textfield-left-helper-line-height',
+  textFieldTextBeforeColor: '--plasma-select-textfield-before-text-color',
+  textFieldTextAfterColor: '--plasma-select-textfield-after-text-color',
+  textFieldTextBeforeMargin: '--plasma-select-textfield-before-text-margin',
+  textFieldTextAfterMargin: '--plasma-select-textfield-after-text-margin',
+  textFieldDisabledOpacity: '--plasma-select-textfield-disabled-opacity',
+  textFieldChipHeight: '--plasma-select-textfield-chip-height',
+  textFieldChipBorderRadius: '--plasma-select-textfield-chip-border-radius',
+  textFieldChipGap: '--plasma-select-textfield-chip-gap',
+  textFieldChipBackground: '--plasma-select-textfield--chip-background',
+  textFieldChipColor: '--plasma-select-textfield-chip-color',
+  textFieldChipBackgroundHover: '--plasma-select-textfield-chip-background-hover',
+  textFieldChipColorHover: '--plasma-select-textfield-chip-color-hover',
+  textFieldChipScaleHover: '--plasma-select-textfield-chip-scale-hover',
+  textFieldChipBackgroundActive: '--plasma-select-textfield-chip-background-active',
+  textFieldChipColorActive: '--plasma-select-textfield-chip-color-active',
+  textFieldChipScaleActive: '--plasma-select-textfield-chip-scale-active',
+  textFieldChipCloseIconColor: '--plasma-select-textfield-chip-close-icons-color',
+  textFieldChipOutlineSize: '--plasma-select-textfield-chip-outline-size',
+  textFieldChipWidth: '--plasma-select-textfield-chip-width',
+  textFieldChipPaddingTop: '--plasma-select-textfield-chip-padding-top',
+  textFieldChipPaddingRight: '--plasma-select-textfield-chip-padding-right',
+  textFieldChipPaddingBottom: '--plasma-select-textfield-chip-padding-bottom',
+  textFieldChipPaddingLeft: '--plasma-select-textfield-chip-padding-left',
+  textFieldChipCloseIconSize: '--plasma-select-textfield-chip-close-icon-size',
+  textFieldChipFontFamily: '--plasma-select-textfield-chip-font-family',
+  textFieldChipFontSize: '--plasma-select-textfield-chip-font-size',
+  textFieldChipFontStyle: '--plasma-select-textfield-chip-font-style',
+  textFieldChipFontWeight: '--plasma-select-textfield-chip-font-weight',
+  textFieldChipLetterSpacing: '--plasma-select-textfield-chip-letter-spacing',
+  textFieldChipLineHeight: '--plasma-select-textfield-chip-line-height',
+  textFieldChipClearContentMarginLeft: '--plasma-select-textfield-chip-clear-content-margin-left',
+  textFieldChipClearContentMarginRight: '--plasma-select-textfield-chip-clear-content-margin-right',
+  textFieldFocusColor: '--plasma-select-textfield-focus-color',
   disclosureIconColor: '--plasma-select-disclosure-icon-color',
-  disclosureIconColorHover: '--plasma-select-disclosure-icon-color-hover',
-  contentLeftColor: '--plasma-select-content-left-color'
+  disclosureIconColorHover: '--plasma-select-disclosure-icon-color-hover'
 };
 var constants = exports.constants = {
   focusColor: '--surface-accent',
@@ -118,5 +181,7 @@ var constants = exports.constants = {
   fontStyle: '--plasma-typo-body-xs-font-style',
   fontWeight: '--plasma-typo-body-xs-font-weight',
   fontLetterSpacing: '--plasma-typo-body-xs-letter-spacing',
-  fontLineHeight: '--plasma-typo-body-xs-line-height'
+  fontLineHeight: '--plasma-typo-body-xs-line-height',
+  cellTitleColor: '--text-primary',
+  cellBackgroundColor: '--plasma-colors-transparent'
 };

package/styled-components/cjs/components/Select/hooks/useKeyboardNavigation.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useKeyNavigation = exports.keys = void 0;
+exports.useKeyNavigation = exports.keys = exports.getItemByFocused = void 0;
 var JUMP_SIZE = 10;
 var keys = exports.keys = {
   Enter: 'Enter',
@@ -20,7 +20,7 @@ var keys = exports.keys = {
   PageUp: 'PageUp',
   PageDown: 'PageDown'
 };
-var getFurtherPath = function getFurtherPath(focusedPath, focusedToValueMap) {
+var getItemByFocused = exports.getItemByFocused = function getItemByFocused(focusedPath, focusedToValueMap) {
   var focusedPathAsString = focusedPath.reduce(function (acc, n) {
     return "".concat(acc, "/").concat(n);
   }, '').replace(/^(\/)/, '');
@@ -33,14 +33,8 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
     dispatchPath = _ref.dispatchPath,
     pathMap = _ref.pathMap,
     focusedToValueMap = _ref.focusedToValueMap,
-    handleToggle = _ref.handleToggle,
-    handlePressDown = _ref.handlePressDown,
-    focusedChipIndex = _ref.focusedChipIndex,
-    dispatchFocusedChipIndex = _ref.dispatchFocusedChipIndex,
-    value = _ref.value,
-    valueToItemMap = _ref.valueToItemMap,
-    multiselect = _ref.multiselect,
-    isTargetAmount = _ref.isTargetAmount;
+    handleListToggle = _ref.handleListToggle,
+    handlePressDown = _ref.handlePressDown;
   var currentIndex = (focusedPath === null || focusedPath === void 0 ? void 0 : focusedPath[focusedPath.length - 1]) || 0;
   var currentLength = pathMap.get(path === null || path === void 0 ? void 0 : path[focusedPath.length - 1]) || 0;
   var onKeyDown = function onKeyDown(event) {
@@ -66,12 +60,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             dispatchFocusedPath({
               type: 'set_initial_focus'
             });
-            handleToggle(true);
-          }
-          if (Array.isArray(value)) {
-            dispatchFocusedChipIndex({
-              type: 'reset'
-            });
+            handleListToggle(true);
           }
           break;
         }
@@ -96,12 +85,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             dispatchFocusedPath({
               type: 'set_initial_focus'
             });
-            handleToggle(true);
-          }
-          if (Array.isArray(value)) {
-            dispatchFocusedChipIndex({
-              type: 'reset'
-            });
+            handleListToggle(true);
           }
           break;
         }
@@ -120,12 +104,8 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
               }
             }
             if (path.length === 1) {
-              handleToggle(false);
+              handleListToggle(false);
             }
-          } else if (Array.isArray(value) && !isTargetAmount) {
-            dispatchFocusedChipIndex({
-              type: 'moveLeft'
-            });
           }
           break;
         }
@@ -135,7 +115,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             if (!focusedPath.length) {
               break;
             }
-            var currentItem = getFurtherPath(focusedPath, focusedToValueMap);
+            var currentItem = getItemByFocused(focusedPath, focusedToValueMap);
             if (currentItem !== null && currentItem !== void 0 && currentItem.items) {
               if (path.length > focusedPath.length) {
                 dispatchFocusedPath({
@@ -149,39 +129,13 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
                 });
               }
             }
-          } else if (Array.isArray(value) && !isTargetAmount) {
-            dispatchFocusedChipIndex({
-              type: 'moveRight',
-              total: value.length
-            });
-          }
-          break;
-        }
-      case keys.Backspace:
-        {
-          if (!multiselect || !Array.isArray(value)) break;
-          if (focusedChipIndex !== null) {
-            var _currentItem = valueToItemMap.get(value[focusedChipIndex]);
-            handlePressDown(_currentItem);
-            if (value.length === 1) {
-              dispatchFocusedChipIndex({
-                type: 'reset'
-              });
-              break;
-            }
-            if (focusedChipIndex === value.length - 1) {
-              dispatchFocusedChipIndex({
-                type: 'moveLeft'
-              });
-              break;
-            }
           }
           break;
         }
       case keys.Space:
         {
           event.preventDefault();
-          var _currentItem2 = getFurtherPath(focusedPath, focusedToValueMap);
+          var _currentItem = getItemByFocused(focusedPath, focusedToValueMap);
           if (!path[0]) {
             dispatchPath({
               type: 'opened_first_level'
@@ -191,22 +145,17 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             });
             break;
           }
-          if (!_currentItem2 || _currentItem2 !== null && _currentItem2 !== void 0 && _currentItem2.disabled) {
+          if (!_currentItem || _currentItem !== null && _currentItem !== void 0 && _currentItem.disabled) {
             break;
           }
-          handlePressDown(_currentItem2);
+          handlePressDown(_currentItem);
           break;
         }
       case keys.Enter:
         {
           event.preventDefault();
-          if (Array.isArray(value)) {
-            dispatchFocusedChipIndex({
-              type: 'reset'
-            });
-          }
-          var _currentItem3 = getFurtherPath(focusedPath, focusedToValueMap);
-          if (_currentItem3 !== null && _currentItem3 !== void 0 && _currentItem3.disabled) {
+          var _currentItem2 = getItemByFocused(focusedPath, focusedToValueMap);
+          if (_currentItem2 !== null && _currentItem2 !== void 0 && _currentItem2.disabled) {
             break;
           }
           if (!path[0]) {
@@ -218,7 +167,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             });
             break;
           }
-          if (_currentItem3 !== null && _currentItem3 !== void 0 && _currentItem3.items) {
+          if (_currentItem2 !== null && _currentItem2 !== void 0 && _currentItem2.items) {
             if (path.length > focusedPath.length) {
               dispatchFocusedPath({
                 type: 'add_focus',
@@ -227,12 +176,12 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             } else {
               dispatchPath({
                 type: 'added_next_level',
-                value: _currentItem3.value.toString()
+                value: _currentItem2.value.toString()
               });
             }
             break;
           }
-          handlePressDown(_currentItem3);
+          handlePressDown(_currentItem2);
           break;
         }
       case keys.Tab:
@@ -244,10 +193,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
           dispatchPath({
             type: 'reset'
           });
-          dispatchFocusedChipIndex({
-            type: 'reset'
-          });
-          handleToggle(false);
+          handleListToggle(false);
           break;
         }
       case keys.Home:
@@ -269,7 +215,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             dispatchFocusedPath({
               type: 'set_initial_focus'
             });
-            handleToggle(true);
+            handleListToggle(true);
           }
           break;
         }
@@ -293,7 +239,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
               type: 'change_last_focus',
               value: (pathMap.get('root') || 0) - 1
             });
-            handleToggle(true);
+            handleListToggle(true);
           }
           break;
         }

package/styled-components/cjs/components/Select/hooks/usePathMaps.js

@@ -11,17 +11,20 @@ var usePathMaps = exports.usePathMaps = function usePathMaps(items) {
   var focusedToValueMap = new Map();
   var valueToCheckedMap = new Map();
   var valueToItemMap = new Map();
+  var labelToItemMap = new Map();
   pathMap.set('root', (items === null || items === void 0 ? void 0 : items.length) || 0);
   var rec = function rec(items) {
     var prevIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     items === null || items === void 0 || items.forEach(function (item, index) {
       var value = item.value,
+        label = item.label,
         innerItems = item.items;
       var currIndex = "".concat(prevIndex, "/").concat(index).replace(/^(\/)/, '');
       focusedToValueMap.set(currIndex, item);
       valueToCheckedMap.set(value, false);
       if ((0, _utils.isEmpty)(innerItems) || !innerItems) {
         valueToItemMap.set(value, item);
+        labelToItemMap.set(label, item);
       } else {
         pathMap.set(value, innerItems.length);
         rec(innerItems, currIndex);
@@ -29,5 +32,5 @@ var usePathMaps = exports.usePathMaps = function usePathMaps(items) {
     });
   };
   rec(items);
-  return [pathMap, focusedToValueMap, valueToCheckedMap, valueToItemMap];
+  return [pathMap, focusedToValueMap, valueToCheckedMap, valueToItemMap, labelToItemMap];
 };

package/styled-components/cjs/components/Select/reducers/index.js

@@ -24,15 +24,4 @@ Object.keys(_focusedPathReducer).forEach(function (key) {
       return _focusedPathReducer[key];
     }
   });
-});
-var _focusedChipIndexReducer = /*#__PURE__*/require("./focusedChipIndexReducer");
-Object.keys(_focusedChipIndexReducer).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _focusedChipIndexReducer[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _focusedChipIndexReducer[key];
-    }
-  });
 });

package/styled-components/cjs/components/Select/ui/Inner/Inner.js

@@ -5,8 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Inner = void 0;
 var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
+var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
 var _utils = /*#__PURE__*/require("../../../../utils");
 var _Select = /*#__PURE__*/require("../../Select.styles");
+var _FloatingPopover = /*#__PURE__*/require("../../FloatingPopover");
 var _ui = /*#__PURE__*/require("./ui");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 var Inner = exports.Inner = function Inner(_ref) {
@@ -31,15 +33,16 @@ var Inner = exports.Inner = function Inner(_ref) {
     }
   };
   var isCurrentListOpen = path[currentLevel + 1] === item.value.toString();
-  var listId = "tree_level_".concat(currentLevel + 2);
+  var treeId = (0, _plasmaCore.safeUseId)();
+  var listId = "".concat(treeId, "_tree_level_").concat(currentLevel + 2);
   var nextLevel = currentLevel + 1;
   if (!(0, _utils.isEmpty)(item === null || item === void 0 ? void 0 : item.items)) {
     var _item$items;
-    return /*#__PURE__*/_react["default"].createElement(_Select.StyledPopover, {
+    return /*#__PURE__*/_react["default"].createElement(_FloatingPopover.FloatingPopover, {
+      placement: "right",
       opened: isCurrentListOpen,
-      usePortal: false,
-      placement: "right-start",
-      trigger: "click",
+      onToggle: handleToggle,
+      offset: 2,
       target: /*#__PURE__*/_react["default"].createElement(_ui.Item, {
         item: item,
         path: path,
@@ -49,10 +52,7 @@ var Inner = exports.Inner = function Inner(_ref) {
         ariaExpanded: isCurrentListOpen,
         ariaLevel: nextLevel,
         ariaLabel: item.label
-      }),
-      onToggle: handleToggle,
-      isFocusTrapped: false,
-      preventOverflow: false
+      })
     }, /*#__PURE__*/_react["default"].createElement(_Select.Ul, {
       role: "group",
       id: listId,