@salutejs/plasma-new-hope 0.193.0-canary.1558.11807380775.0 → 0.193.0-canary.1559.11816419999.0

package/styled-components/cjs/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.js

@@ -8,5 +8,8 @@ var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"))
 var _CellTextboxTitle = /*#__PURE__*/require("./CellTextboxTitle.styles");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 var CellTextboxTitle = exports.CellTextboxTitle = function CellTextboxTitle(props) {
-  return /*#__PURE__*/_react["default"].createElement(_CellTextboxTitle.StyledTextboxTitle, null, props.children);
+  // TODO: #1548
+  return /*#__PURE__*/_react["default"].createElement(_CellTextboxTitle.StyledTextboxTitle, {
+    className: "cell-textbox-title"
+  }, props.children);
 };

package/styled-components/cjs/components/Chip/Chip.js

@@ -46,7 +46,9 @@ var chipRoot = exports.chipRoot = function chipRoot(Root) {
     var txt = !text && typeof children === 'string' ? children : text;
     var pilledClass = pilled ? _Chip2.classes.pilled : undefined;
     var handleClick = function handleClick(event) {
-      if (disabled || readOnly) {
+      // TODO: #1547
+      // eslint-disable-next-line no-underscore-dangle
+      if (disabled || readOnly && !rest._forceChipManipulationWithReadonly) {
         return;
       }
       onClick === null || onClick === void 0 || onClick(event);

package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.js

@@ -310,7 +310,6 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
         focusedToValueMap: focusedToValueMap,
         handleListToggle: handleListToggle,
         handlePressDown: handlePressDown,
-        multiselect: multiple,
         setTextValue: setTextValue
       }),
       onKeyDown = _useKeyNavigation.onKeyDown;

package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.tokens.js

@@ -57,7 +57,6 @@ var tokens = exports.tokens = {
   checkboxIconColor: '--plasma-combobox-checkbox-icon-color',
   checkboxTriggerBorderColor: '--plasma-combobox-checkbox-trigger-border-color',
   indicatorSize: '--plasma-combobox-indicator-size',
-  targetHeight: '--plasma-combobox-target-height',
   // Токены для TextField
   textFieldColor: '--plasma-combobox-new-textfield-color',
   textFieldClearColor: '--plasma-combobox-new-textfield-clear-color',

package/styled-components/cjs/components/Combobox/ComboboxNew/FloatingPopover.js

@@ -64,13 +64,27 @@ var FloatingPopover = exports.FloatingPopover = /*#__PURE__*/(0, _react2.forward
   /*#__PURE__*/
   // root - принимает ref контейнера портала.
   // id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.
-  _react2["default"].createElement(_react.FloatingPortal, {
-    root: portal,
-    id: portal ? undefined : wrappedId
-  }, /*#__PURE__*/_react2["default"].createElement("div", {
+  _react2["default"].createElement(_react.FloatingPortal, getFloatingPortalProps(portal, wrappedId), /*#__PURE__*/_react2["default"].createElement("div", {
     ref: refs.setFloating,
     style: _objectSpread(_objectSpread({}, floatingStyles), {}, {
       zIndex: 1
     })
   }, children)));
-});
+});
+// root - принимает ref контейнера портала.
+// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.
+var getFloatingPortalProps = function getFloatingPortalProps(portal, wrappedId) {
+  if (!portal) {
+    return {
+      id: wrappedId
+    };
+  }
+  if (typeof portal === 'string') {
+    return {
+      id: portal
+    };
+  }
+  return {
+    root: portal
+  };
+};

package/styled-components/cjs/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js

@@ -35,7 +35,6 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
     focusedToValueMap = _ref.focusedToValueMap,
     handleListToggle = _ref.handleListToggle,
     handlePressDown = _ref.handlePressDown,
-    multiselect = _ref.multiselect,
     setTextValue = _ref.setTextValue;
   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;
@@ -130,7 +129,6 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
               break;
             }
             var currentItem = getItemByFocused(focusedPath, focusedToValueMap);
-            console.log('currentItem', currentItem, focusedPath, focusedToValueMap);
             if (currentItem !== null && currentItem !== void 0 && currentItem.items) {
               if (path.length > focusedPath.length) {
                 dispatchFocusedPath({
@@ -147,32 +145,6 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
           }
           break;
         }
-      case keys.Backspace:
-        {
-          if (!multiselect) break;
-          break;
-        }
-
-      // case keys.Space: {
-      //     event.preventDefault();
-      //
-      //     const currentItem = getItemByFocused(focusedPath, focusedToValueMap);
-      //
-      //     if (!path[0]) {
-      //         dispatchPath({ type: 'opened_first_level' });
-      //         dispatchFocusedPath({ type: 'set_initial_focus' });
-      //         break;
-      //     }
-      //
-      //     if (!currentItem || currentItem?.disabled) {
-      //         break;
-      //     }
-      //
-      //     handlePressDown(currentItem);
-      //
-      //     break;
-      // }
-
       case keys.Enter:
         {
           event.preventDefault();
@@ -189,34 +161,12 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             });
             break;
           }
-
-          // if (currentItem?.items) {
-          //     if (path.length > focusedPath.length) {
-          //         dispatchFocusedPath({ type: 'add_focus', value: 0 });
-          //     } else {
-          //         dispatchPath({ type: 'added_next_level', value: currentItem.value.toString() });
-          //     }
-          //
-          //     break;
-          // }
-
           if (_currentItem) {
             handlePressDown(_currentItem);
           }
           break;
         }
       case keys.Tab:
-        {
-          dispatchPath({
-            type: 'reset'
-          });
-          dispatchFocusedPath({
-            type: 'reset'
-          });
-          handleListToggle(false);
-          setTextValue('');
-          break;
-        }
       case keys.Escape:
         {
           dispatchPath({
@@ -226,6 +176,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
             type: 'reset'
           });
           handleListToggle(false);
+          setTextValue('');
           break;
         }
       case keys.Home:

package/styled-components/cjs/components/Modal/Modal.js

@@ -12,14 +12,11 @@ var _Popup = /*#__PURE__*/require("../Popup");
 var _Overlay = /*#__PURE__*/require("../Overlay");
 var _utils = /*#__PURE__*/require("../Popup/utils");
 var _hooks = /*#__PURE__*/require("../../hooks");
-var _IconClose2 = /*#__PURE__*/require("../_Icon/Icons/IconClose");
 var _Modal = /*#__PURE__*/require("./Modal.tokens");
 var _hooks2 = /*#__PURE__*/require("./hooks");
 var _base = /*#__PURE__*/require("./variations/_view/base");
 var _ModalContext = /*#__PURE__*/require("./ModalContext");
-var _Modal2 = /*#__PURE__*/require("./Modal.styles");
-var _IconClose;
-var _excluded = ["id", "withAnimation", "onClose", "onOverlayClick", "onEscKeyDown", "closeOnEsc", "closeOnOverlayClick", "withBlur", "initialFocusRef", "focusAfterRef", "zIndex", "popupInfo", "children", "view", "opened", "isOpen", "hasBody", "hasClose"];
+var _excluded = ["id", "withAnimation", "onClose", "onOverlayClick", "onEscKeyDown", "closeOnEsc", "closeOnOverlayClick", "withBlur", "initialFocusRef", "focusAfterRef", "zIndex", "popupInfo", "children", "view", "opened", "isOpen"];
 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; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -52,8 +49,6 @@ var modalRoot = exports.modalRoot = function modalRoot(Root) {
       view = _ref.view,
       opened = _ref.opened,
       isOpen = _ref.isOpen,
-      hasBody = _ref.hasBody,
-      hasClose = _ref.hasClose,
       rest = _objectWithoutProperties(_ref, _excluded);
     var innerIsOpen = Boolean(isOpen || opened);
     var trapRef = (0, _hooks.useFocusTrap)(true, initialFocusRef, focusAfterRef, true);
@@ -83,15 +78,6 @@ var modalRoot = exports.modalRoot = function modalRoot(Root) {
         onClose();
       }
     }, [closeOnOverlayClick, onOverlayClick, onClose]);
-    var overlayNode = /*#__PURE__*/_react["default"].createElement(_Overlay.Overlay, {
-      className: _Modal.classes.overlay,
-      zIndex: zIndex || _utils.DEFAULT_Z_INDEX,
-      backgroundColorProperty: overlayBackgroundToken,
-      withBlur: withBlur,
-      transparent: transparent,
-      isClickable: closeOnOverlayClick,
-      onOverlayClick: onModalOverlayKeyDown
-    });
     return /*#__PURE__*/_react["default"].createElement(Popup, _extends({
       id: innerId,
       opened: innerIsOpen,
@@ -99,16 +85,18 @@ var modalRoot = exports.modalRoot = function modalRoot(Root) {
       popupInfo: modalInfo,
       withAnimation: withAnimation,
       zIndex: zIndex,
-      overlay: hasBody ? overlayNode : /*#__PURE__*/_react["default"].createElement(Root, {
+      overlay: /*#__PURE__*/_react["default"].createElement(Root, {
         view: view
-      }, overlayNode)
-    }, rest), hasBody ? /*#__PURE__*/_react["default"].createElement(Root, {
-      view: view
-    }, /*#__PURE__*/_react["default"].createElement(_Modal2.ModalBody, null, /*#__PURE__*/_react["default"].createElement(_Modal2.ModalContent, null, hasClose && /*#__PURE__*/_react["default"].createElement(_Modal2.CloseButton, {
-      onClick: onClose
-    }, _IconClose || (_IconClose = /*#__PURE__*/_react["default"].createElement(_IconClose2.IconClose, {
-      size: "s"
-    }))), children))) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, children));
+      }, /*#__PURE__*/_react["default"].createElement(_Overlay.Overlay, {
+        className: _Modal.classes.overlay,
+        zIndex: zIndex || _utils.DEFAULT_Z_INDEX,
+        backgroundColorProperty: overlayBackgroundToken,
+        withBlur: withBlur,
+        transparent: transparent,
+        isClickable: closeOnOverlayClick,
+        onOverlayClick: onModalOverlayKeyDown
+      }))
+    }, rest), children);
   });
 };
 var modalConfig = exports.modalConfig = {

package/styled-components/cjs/components/Modal/Modal.template-doc.mdx

@@ -62,53 +62,6 @@ export function App() {
 }
 ```
 
-## Использование стилизованной обертки
-
-Для использования стилизованного мобального окна с отступами и крестиком для закрытия, добавьте свойство `hasBody`.
-```tsx live
-import React, { useState } from 'react';
-import { SSRProvider, Button, Modal, PopupProvider } from '@salutejs/{{ package }}';
-
-export function App() {
-    const [isOpenA, setIsOpenA] = useState(false);
-    const [isOpenB, setIsOpenB] = useState(false);
-
-    return (
-        <SSRProvider>
-            <PopupProvider>
-                <div style=\{{ height: "300px" }}>
-                    <div style=\{{ display: 'flex', flexDirection: 'column' }}>
-                        <Button text="Открыть A" onClick={() => setIsOpenA(true)} />
-                    </div>
-                    <Modal
-                        id="modalA"
-                        onClose={() => setIsOpenA(false)}
-                        opened={isOpenA}
-                        placement="center"
-                        offset={[0, 0]}
-                        hasBody
-                    >
-                        <Button onClick={() => setIsOpenA(false)}>Close</Button>
-                        <Button text="Открыть B" onClick={() => setIsOpenB(true)} />
-                        Content
-                        <Modal
-                            id="modalB"
-                            onClose={() => setIsOpenB(false)}
-                            opened={isOpenB}
-                            placement="right"
-                            offset={[0, 0]}
-                        >
-                            <Button onClick={() => setIsOpenB(false)}>Close</Button>
-                            Content
-                        </Modal>
-                    </Modal>
-                </div>
-            </PopupProvider>
-        </SSRProvider>
-    );
-}
-```
-
 ## Подключение анимации
 Подключение анимации аналогично тому, как это происходит в `Popup` - через свойство `withAnimation`(управление через `popupClasses`, `modalClasses`).
 Для добавления анимации в оверлей необходимо использовать класс `.modal-overlay` через переменную `modalClasses.overlay` из пакета.

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

@@ -12,9 +12,5 @@ var classes = exports.classes = {
 };
 var tokens = exports.tokens = {
   modalOverlayWithBlurColor: '--plasma-modal-overlay-with-blur-color',
-  modalOverlayColor: '--plasma-modal-overlay-color',
-  modalBodyBackground: '--plasma-modal-body-background',
-  modalBodyBorderRadius: '--plasma-modal-body-border-radius',
-  modalBodyPadding: '--plasma-modal-body-padding',
-  modalContentPadding: '--plasma-modal-content-padding'
+  modalOverlayColor: '--plasma-modal-overlay-color'
 };

package/styled-components/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.js

@@ -16,7 +16,7 @@ var SelectPerPageRoot = exports.SelectPerPageRoot = /*#__PURE__*/_styledComponen
 })(["display:flex;align-items:center;gap:0.5rem;"]);
 var SelectPerPageSelect = exports.SelectPerPageSelect = /*#__PURE__*/(0, _styledComponents["default"])(Select).withConfig({
   componentId: "plasma-new-hope__sc-1g304l9-1"
-})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":0.125rem;", ":0.125rem;", ":var(", ");", ":calc(var(", ") - 0.125rem);", ":0 0.375rem 0 0;", ":1.5rem;", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], _Select.selectTokens.targetButtonColor, _Pagination.tokens.buttonColor, _Select.selectTokens.targetButtonColorHover, _Pagination.tokens.buttonColorHover, _Select.selectTokens.targetButtonColorActive, _Pagination.tokens.buttonColorActive, _Select.selectTokens.targetButtonBackgroundColor, _Pagination.tokens.buttonBackgroundColor, _Select.selectTokens.targetButtonBackgroundColorHover, _Pagination.tokens.buttonBackgroundColorHover, _Select.selectTokens.targetButtonBackgroundColorActive, _Pagination.tokens.buttonBackgroundColorActive, _Select.selectTokens.targetHeight, _Pagination.tokens.buttonHeight, _Select.selectTokens.targetButtonPadding, _Pagination.tokens.selectTargetPadding, _Select.selectTokens.borderRadius, _Pagination.tokens.buttonRadius, _Select.selectTokens.targetButtonArrowColor, _Pagination.tokens.buttonArrowColor, _Select.selectTokens.targetButtonArrowColorHover, _Pagination.tokens.buttonArrowColorHover, _Select.selectTokens.targetButtonArrowColorActive, _Pagination.tokens.buttonArrowColorActive, _Select.selectTokens.targetButtonArrowMargin, _Pagination.tokens.buttonArrowMargin, _Select.selectTokens.padding, _Select.selectTokens.focusOffset, _Select.selectTokens.itemPadding, _Pagination.tokens.selectItemPadding, _Select.selectTokens.itemBorderRadius, _Pagination.tokens.buttonRadius, _Select.selectTokens.itemIconMargin, _Select.selectTokens.itemIconSize, _Select.selectTokens.itemHeight, _Pagination.tokens.selectItemHeight, _Select.selectTokens.fontFamily, _Pagination.tokens.paginationFontFamily, _Select.selectTokens.fontSize, _Pagination.tokens.paginationFontSize, _Select.selectTokens.fontStyle, _Pagination.tokens.paginationFontStyle, _Select.selectTokens.fontWeight, _Pagination.tokens.paginationFontWeight, _Select.selectTokens.fontLetterSpacing, _Pagination.tokens.paginationLetterSpacing, _Select.selectTokens.fontLineHeight, _Pagination.tokens.paginationLineHeight);
+})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":0.125rem;", ":var(", ");", ":calc(var(", ") - 0.125rem);", ":0 0.375rem 0 0;", ":1.5rem;", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], _Select.selectTokens.buttonColor, _Pagination.tokens.buttonColor, _Select.selectTokens.buttonColorHover, _Pagination.tokens.buttonColorHover, _Select.selectTokens.buttonColorActive, _Pagination.tokens.buttonColorActive, _Select.selectTokens.buttonBackgroundColor, _Pagination.tokens.buttonBackgroundColor, _Select.selectTokens.buttonBackgroundColorHover, _Pagination.tokens.buttonBackgroundColorHover, _Select.selectTokens.buttonBackgroundColorActive, _Pagination.tokens.buttonBackgroundColorActive, _Select.selectTokens.targetHeight, _Pagination.tokens.buttonHeight, _Select.selectTokens.buttonPadding, _Pagination.tokens.selectTargetPadding, _Select.selectTokens.borderRadius, _Pagination.tokens.buttonRadius, _Select.selectTokens.buttonArrowColor, _Pagination.tokens.buttonArrowColor, _Select.selectTokens.buttonArrowColorHover, _Pagination.tokens.buttonArrowColorHover, _Select.selectTokens.buttonArrowColorActive, _Pagination.tokens.buttonArrowColorActive, _Select.selectTokens.buttonArrowMargin, _Pagination.tokens.buttonArrowMargin, _Select.selectTokens.padding, _Select.selectTokens.itemPadding, _Pagination.tokens.selectItemPadding, _Select.selectTokens.itemBorderRadius, _Pagination.tokens.buttonRadius, _Select.selectTokens.itemIconMargin, _Select.selectTokens.itemIconSize, _Select.selectTokens.itemHeight, _Pagination.tokens.selectItemHeight, _Select.selectTokens.fontFamily, _Pagination.tokens.paginationFontFamily, _Select.selectTokens.fontSize, _Pagination.tokens.paginationFontSize, _Select.selectTokens.fontStyle, _Pagination.tokens.paginationFontStyle, _Select.selectTokens.fontWeight, _Pagination.tokens.paginationFontWeight, _Select.selectTokens.fontLetterSpacing, _Pagination.tokens.paginationLetterSpacing, _Select.selectTokens.fontLineHeight, _Pagination.tokens.paginationLineHeight);
 var SelectPerPageTypography = exports.SelectPerPageTypography = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-1g304l9-2"
 })(["font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");"], _Pagination.tokens.paginationFontFamily, _Pagination.tokens.paginationFontSize, _Pagination.tokens.paginationFontStyle, _Pagination.tokens.paginationFontWeight, _Pagination.tokens.paginationLetterSpacing, _Pagination.tokens.paginationLineHeight);

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

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FloatingPopover = void 0;
+var _react = /*#__PURE__*/require("@floating-ui/react");
+var _react2 = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
+var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
+var _utils = /*#__PURE__*/require("./utils");
+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; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var FloatingPopover = exports.FloatingPopover = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
+  var target = _ref.target,
+    children = _ref.children,
+    opened = _ref.opened,
+    onToggle = _ref.onToggle,
+    placement = _ref.placement,
+    portal = _ref.portal,
+    listWidth = _ref.listWidth,
+    _ref$offset = _ref.offset,
+    offset = _ref$offset === void 0 ? 0 : _ref$offset;
+  var _useFloating = (0, _react.useFloating)({
+      placement: (0, _utils.getPlacement)(placement),
+      open: opened,
+      middleware: [(0, _react.offset)(offset), (0, _react.flip)({
+        fallbackPlacements: (0, _utils.getFallbackPlacements)(placement)
+      }), (0, _react.shift)(), (0, _react.size)({
+        apply: function apply(_ref2) {
+          var rects = _ref2.rects,
+            elements = _ref2.elements;
+          Object.assign(elements.floating.style, {
+            width: listWidth || "".concat(rects.reference.width, "px")
+          });
+        }
+      })]
+    }),
+    refs = _useFloating.refs,
+    floatingStyles = _useFloating.floatingStyles;
+  var wrappedId = (0, _plasmaCore.safeUseId)();
+  var handleClick = function handleClick() {
+    if (onToggle) {
+      onToggle(!opened);
+    }
+  };
+
+  // Проверка на target. Это может быть как ReactNode, так и функция, в которую пробрасывается ref.
+  // Это нужно для более тонкой настройки reference-элемента, вокруг которого и будет позиционироваться выпадашка.
+  // Пример: когда в Textfield под инпутом находится helperText (или еще что-либо),
+  // но выпадающий список должен позиционироваться непосредственно возле самого инпута.
+  var isTargetAsFunction = typeof target === 'function';
+  return /*#__PURE__*/_react2["default"].createElement("div", {
+    ref: ref,
+    id: wrappedId
+  }, /*#__PURE__*/_react2["default"].createElement("div", {
+    ref: isTargetAsFunction ? undefined : refs.setReference,
+    onClick: handleClick
+  }, typeof target === 'function' ? target(refs.setReference) : target), opened &&
+  /*#__PURE__*/
+  // root - принимает ref контейнера портала.
+  // id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.
+  _react2["default"].createElement(_react.FloatingPortal, getFloatingPortalProps(portal, wrappedId), /*#__PURE__*/_react2["default"].createElement("div", {
+    ref: refs.setFloating,
+    style: _objectSpread(_objectSpread({}, floatingStyles), {}, {
+      zIndex: 1
+    })
+  }, children)));
+});
+// root - принимает ref контейнера портала.
+// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.
+var getFloatingPortalProps = function getFloatingPortalProps(portal, wrappedId) {
+  if (!portal) {
+    return {
+      id: wrappedId
+    };
+  }
+  if (typeof portal === 'string') {
+    return {
+      id: portal
+    };
+  }
+  return {
+    root: portal
+  };
+};