@plesk/ui-library 3.39.0 → 3.40.0

package/cjs/components/Toolbar/RegistryContextBeta.js

@@ -0,0 +1,112 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useRegistryItem = exports.useRegistry = exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("react");
+// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
+
+const RegistryContext = /*#__PURE__*/(0, _react.createContext)(undefined);
+RegistryContext.displayName = 'RegistryContext';
+const useRegistryContext = () => (0, _react.useContext)(RegistryContext);
+var _default = exports.default = RegistryContext;
+class Registry {
+  constructor() {
+    (0, _defineProperty2.default)(this, "items", []);
+  }
+  register(item) {
+    this.items.push(item);
+  }
+  unregister(item) {
+    this.items = this.items.filter(i => i !== item);
+  }
+  compact() {
+    let changed = false;
+    for (const item of [...this.items].reverse()) {
+      if (!item.isCompact) {
+        item.compact();
+        changed = true;
+        break;
+      }
+    }
+    return changed;
+  }
+  expand() {
+    let changed = false;
+    for (const item of this.items) {
+      if (this.checkItemIsCompactOrHasCompactItems(item)) {
+        item.expand();
+        changed = true;
+        break;
+      }
+    }
+    return changed;
+  }
+  get isCompact() {
+    return this.items.every(_ref => {
+      let {
+        isCompact
+      } = _ref;
+      return isCompact;
+    });
+  }
+  get hasCompactItems() {
+    return this.items.some(this.checkItemIsCompactOrHasCompactItems);
+  }
+  checkItemIsCompactOrHasCompactItems(item) {
+    return item.isCompact || 'hasCompactItems' in item && item.hasCompactItems;
+  }
+}
+class RegistryItem {
+  constructor(_ref2) {
+    let {
+      onCompactStateChange
+    } = _ref2;
+    (0, _defineProperty2.default)(this, "_isCompact", false);
+    (0, _defineProperty2.default)(this, "onCompactStateChange", void 0);
+    this.onCompactStateChange = onCompactStateChange;
+  }
+  compact() {
+    this._isCompact = true;
+    this.onCompactStateChange(true);
+  }
+  expand() {
+    this._isCompact = false;
+    this.onCompactStateChange(false);
+  }
+  get isCompact() {
+    return this._isCompact;
+  }
+}
+const useRegistry = () => {
+  const parentRegistry = useRegistryContext();
+  const [registry] = (0, _react.useState)(() => new Registry());
+  (0, _react.useLayoutEffect)(() => {
+    if (!parentRegistry) return undefined;
+    parentRegistry.register(registry);
+    return () => {
+      parentRegistry.unregister(registry);
+    };
+  }, [parentRegistry, registry]);
+  return registry;
+};
+exports.useRegistry = useRegistry;
+const useRegistryItem = () => {
+  const registry = useRegistryContext();
+  const [isCompact, setIsCompact] = (0, _react.useState)(false);
+  const [registryItem] = (0, _react.useState)(() => new RegistryItem({
+    onCompactStateChange: setIsCompact
+  }));
+  (0, _react.useLayoutEffect)(() => {
+    if (!registry) return undefined;
+    registry.register(registryItem);
+    return () => {
+      registry.unregister(registryItem);
+    };
+  }, [registry, registryItem]);
+  return [isCompact];
+};
+exports.useRegistryItem = useRegistryItem;

package/cjs/components/Toolbar/Toolbar.js

@@ -10,9 +10,12 @@ var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../constants");
 var _RegistryContext = _interopRequireWildcard(require("./RegistryContext"));
+var _RegistryContextBeta = _interopRequireWildcard(require("./RegistryContextBeta"));
 var _DistractionFreeModeContext = _interopRequireDefault(require("../DistractionFreeModeContext"));
 var _ToolbarItem = require("./ToolbarItem");
 var _Squeezer = _interopRequireDefault(require("../Squeezer"));
+var _hooks = require("../../hooks");
+var _ToolbarBetaProvider = require("./ToolbarBetaProvider");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (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; }
@@ -26,7 +29,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  * @since 0.0.57
  */
 
-class Toolbar extends _react.Component {
+class ToolbarClassComponent extends _react.Component {
   constructor(props) {
     super(props);
     (0, _defineProperty2.default)(this, "state", {
@@ -83,9 +86,50 @@ class Toolbar extends _react.Component {
     });
   }
 }
-(0, _defineProperty2.default)(Toolbar, "defaultProps", {
+(0, _defineProperty2.default)(ToolbarClassComponent, "defaultProps", {
   children: null,
   className: null,
   baseClassName: `${_constants.CLS_PREFIX}toolbar`
 });
+const ToolbarBeta = _ref2 => {
+  let {
+    children,
+    className,
+    baseClassName = `${_constants.CLS_PREFIX}toolbar`,
+    ...props
+  } = _ref2;
+  const containerRef = (0, _react.useRef)(null);
+  const [isDistractionFreeModeEnabled, setIsDistractionFreeModeEnabled] = (0, _react.useState)(false);
+  const distractionFreeModeContextValue = (0, _react.useMemo)(() => ({
+    enabled: isDistractionFreeModeEnabled,
+    toggle: () => setIsDistractionFreeModeEnabled(current => !current)
+  }), [isDistractionFreeModeEnabled]);
+  const registry = (0, _RegistryContextBeta.useRegistry)();
+  (0, _hooks.useSqueeze)({
+    ref: containerRef,
+    compact: () => registry.compact(),
+    expand: () => registry.expand()
+  });
+  const toolbarItems = (0, _ToolbarItem.toToolbarItems)(children, true);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    ref: containerRef,
+    className: (0, _classnames.default)(baseClassName, className),
+    ...props,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RegistryContextBeta.default.Provider, {
+      value: registry,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DistractionFreeModeContext.default.Provider, {
+        value: distractionFreeModeContextValue,
+        children: toolbarItems
+      })
+    })
+  });
+};
+const Toolbar = props => {
+  const isToolbarBeta = (0, _ToolbarBetaProvider.useToolbarBetaContext)();
+  return isToolbarBeta ? /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarBeta, {
+    ...props
+  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarClassComponent, {
+    ...props
+  });
+};
 var _default = exports.default = Toolbar;

package/cjs/components/Toolbar/ToolbarBetaProvider.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useToolbarBetaContext = exports.default = void 0;
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
+// Copyright 1999-2024. Plesk International GmbH. All rights reserved.
+
+const ToolbarBetaContext = /*#__PURE__*/(0, _react.createContext)(false);
+const useToolbarBetaContext = () => (0, _react.useContext)(ToolbarBetaContext);
+exports.useToolbarBetaContext = useToolbarBetaContext;
+const ToolbarBetaProvider = _ref => {
+  let {
+    children
+  } = _ref;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarBetaContext.Provider, {
+    value: true,
+    children: children
+  });
+};
+var _default = exports.default = ToolbarBetaProvider;

package/cjs/components/Toolbar/ToolbarGroup.js

@@ -12,9 +12,11 @@ var _constants = require("../../constants");
 var _Dropdown = _interopRequireDefault(require("../Dropdown"));
 var _ToolbarMenu = _interopRequireDefault(require("./ToolbarMenu"));
 var _RegistryContext = _interopRequireWildcard(require("./RegistryContext"));
+var _RegistryContextBeta = _interopRequireWildcard(require("./RegistryContextBeta"));
 var _DistractionFreeModeContext = _interopRequireDefault(require("../DistractionFreeModeContext"));
 var _ToolbarItem = require("./ToolbarItem");
 var _ToolbarExpander = _interopRequireDefault(require("./ToolbarExpander"));
+var _ToolbarBetaProvider = require("./ToolbarBetaProvider");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (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; }
@@ -26,7 +28,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  * @since 0.0.57
  */
 
-class ToolbarGroup extends _react.Component {
+class ToolbarGroupClassComponent extends _react.Component {
   constructor(props) {
     super(props);
     (0, _defineProperty2.default)(this, "state", {
@@ -146,7 +148,7 @@ class ToolbarGroup extends _react.Component {
     });
   }
 }
-(0, _defineProperty2.default)(ToolbarGroup, "defaultProps", {
+(0, _defineProperty2.default)(ToolbarGroupClassComponent, "defaultProps", {
   registry: undefined,
   distractionFreeMode: undefined
 });
@@ -158,7 +160,7 @@ const ToolbarGroupWrapper = _ref => {
   } = _ref;
   const registry = (0, _react.useContext)(_RegistryContext.default);
   const distractionFreeMode = (0, _react.useContext)(_DistractionFreeModeContext.default);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarGroup, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarGroupClassComponent, {
     groupable: groupable,
     baseClassName: baseClassName,
     ...props,
@@ -167,4 +169,64 @@ const ToolbarGroupWrapper = _ref => {
   });
 };
 ToolbarGroupWrapper.displayName = 'ToolbarGroup';
-var _default = exports.default = ToolbarGroupWrapper;
+const ToolbarGroupBeta = _ref2 => {
+  let {
+    baseClassName = `${_constants.CLS_PREFIX}toolbar__group`,
+    className,
+    title,
+    children,
+    groupable = true,
+    ...props
+  } = _ref2;
+  const [compact] = (0, _RegistryContextBeta.useRegistryItem)();
+  const registry = (0, _RegistryContextBeta.useRegistry)();
+  const [availableInDistractionFreeMode, setAvailableInDistractionFreeMode] = (0, _react.useState)(false);
+  const distractionFreeMode = (0, _react.useContext)(_DistractionFreeModeContext.default);
+  const distractionFreeModeContextValue = {
+    enabled: distractionFreeMode?.enabled ?? false,
+    toggle: () => {
+      if (distractionFreeMode) {
+        distractionFreeMode.toggle();
+        setAvailableInDistractionFreeMode(current => !current);
+      }
+    }
+  };
+  let hasExpander = _react.Children.toArray(children).some(child => /*#__PURE__*/(0, _react.isValidElement)(child) && child.type === _ToolbarExpander.default);
+  if (groupable && compact && _react.Children.count(children) > 1) {
+    hasExpander = false;
+    children = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default, {
+      menu: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ToolbarMenu.default, {
+        onItemClick: () => {},
+        children: children
+      }),
+      children: title
+    });
+  } else {
+    children = /*#__PURE__*/(0, _jsxRuntime.jsx)(_RegistryContextBeta.default.Provider, {
+      value: registry,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DistractionFreeModeContext.default.Provider, {
+        value: distractionFreeModeContextValue,
+        children: (0, _ToolbarItem.toToolbarItems)(children, true)
+      })
+    });
+  }
+  if (distractionFreeModeContextValue.enabled && !availableInDistractionFreeMode) {
+    return null;
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: (0, _classnames.default)(baseClassName, className, {
+      [`${baseClassName}--grow`]: hasExpander || distractionFreeModeContextValue.enabled && availableInDistractionFreeMode
+    }),
+    ...props,
+    children: children
+  });
+};
+const ToolbarGroup = props => {
+  const isToolbarBeta = (0, _ToolbarBetaProvider.useToolbarBetaContext)();
+  return isToolbarBeta ? /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarGroupBeta, {
+    ...props
+  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarGroupWrapper, {
+    ...props
+  });
+};
+var _default = exports.default = ToolbarGroup;

package/cjs/components/Toolbar/ToolbarItem.js

@@ -13,6 +13,7 @@ var _ResponsiveContext = _interopRequireDefault(require("../ResponsiveContext"))
 var _RegistryContext = _interopRequireDefault(require("./RegistryContext"));
 var _ToolbarGroup = _interopRequireDefault(require("./ToolbarGroup"));
 var _ToolbarExpander = _interopRequireDefault(require("./ToolbarExpander"));
+var _RegistryContextBeta = require("./RegistryContextBeta");
 var _jsxRuntime = require("react/jsx-runtime");
 // Copyright 1999-2023. Plesk International GmbH. All rights reserved.
 
@@ -54,17 +55,31 @@ class ToolbarItem extends _react.Component {
   }
 }
 ToolbarItem.contextType = _RegistryContext.default;
-const toToolbarItems = children => _react.Children.map(children, child => {
-  if (! /*#__PURE__*/(0, _react.isValidElement)(child)) {
-    return child;
-  }
-  if (child.type === _ToolbarGroup.default || child.type === _ToolbarExpander.default) {
-    return child;
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarItem, {
-    children: /*#__PURE__*/(0, _react.cloneElement)(child, {
-      className: (0, _classnames.default)(child.props.className, `${_constants.CLS_PREFIX}toolbar__group-item`)
-    })
+const ToolbarItemBeta = _ref => {
+  let {
+    children
+  } = _ref;
+  const [isCompact] = (0, _RegistryContextBeta.useRegistryItem)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ResponsiveContext.default.Provider, {
+    value: isCompact,
+    children: children
   });
-});
+};
+const toToolbarItems = function (children) {
+  let isBeta = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  return _react.Children.map(children, child => {
+    if (! /*#__PURE__*/(0, _react.isValidElement)(child)) {
+      return child;
+    }
+    if (child.type === _ToolbarGroup.default || child.type === _ToolbarExpander.default) {
+      return child;
+    }
+    const Component = isBeta ? ToolbarItemBeta : ToolbarItem;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
+      children: /*#__PURE__*/(0, _react.cloneElement)(child, {
+        className: (0, _classnames.default)(child.props.className, `${_constants.CLS_PREFIX}toolbar__group-item`)
+      })
+    });
+  });
+};
 exports.toToolbarItems = toToolbarItems;

package/cjs/components/Toolbar/ToolbarMenu.js

@@ -13,6 +13,7 @@ var _Button = _interopRequireDefault(require("../Button"));
 var _Dropdown = _interopRequireDefault(require("../Dropdown"));
 var _List = require("../List");
 var _utils = require("../utils");
+var _Button2 = require("../Button/Button");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (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; }
@@ -33,7 +34,7 @@ const toMenuItem = (child, isLast, onItemClick) => {
         } = child.props);
         props.onClick = (0, _utils.wrapFunction)(props.onClick, onItemClick);
         Object.keys(other).forEach(k => {
-          if (!(_Button.default.defaultProps && k in _Button.default.defaultProps)) {
+          if (!_Button2.BUTTON_PROP_NAMES.includes(k)) {
             props[k] = other[k];
           }
         });

package/cjs/components/Toolbar/index.js

@@ -4,6 +4,12 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "ToolbarBetaProvider", {
+  enumerable: true,
+  get: function () {
+    return _ToolbarBetaProvider.default;
+  }
+});
 Object.defineProperty(exports, "ToolbarExpander", {
   enumerable: true,
   get: function () {
@@ -24,4 +30,5 @@ Object.defineProperty(exports, "default", {
 });
 var _Toolbar = _interopRequireDefault(require("./Toolbar"));
 var _ToolbarGroup = _interopRequireDefault(require("./ToolbarGroup"));
-var _ToolbarExpander = _interopRequireDefault(require("./ToolbarExpander"));
+var _ToolbarExpander = _interopRequireDefault(require("./ToolbarExpander"));
+var _ToolbarBetaProvider = _interopRequireDefault(require("./ToolbarBetaProvider"));

package/cjs/components/index.js

@@ -82,6 +82,7 @@ var _exportNames = {
   ProgressDialog: true,
   ProgressDialogStep: true,
   ProgressStep: true,
+  PROGRESS_STEP_DEFAULT_STATUS: true,
   Rating: true,
   Section: true,
   SegmentedControl: true,
@@ -103,6 +104,7 @@ var _exportNames = {
   Toolbar: true,
   ToolbarGroup: true,
   ToolbarExpander: true,
+  ToolbarBetaProvider: true,
   Tooltip: true,
   Tour: true,
   Translate: true,
@@ -496,6 +498,12 @@ Object.defineProperty(exports, "Overlay", {
     return _Overlay.default;
   }
 });
+Object.defineProperty(exports, "PROGRESS_STEP_DEFAULT_STATUS", {
+  enumerable: true,
+  get: function () {
+    return _ProgressStep.PROGRESS_STEP_DEFAULT_STATUS;
+  }
+});
 Object.defineProperty(exports, "PageHeader", {
   enumerable: true,
   get: function () {
@@ -718,6 +726,12 @@ Object.defineProperty(exports, "Toolbar", {
     return _Toolbar.default;
   }
 });
+Object.defineProperty(exports, "ToolbarBetaProvider", {
+  enumerable: true,
+  get: function () {
+    return _Toolbar.ToolbarBetaProvider;
+  }
+});
 Object.defineProperty(exports, "ToolbarExpander", {
   enumerable: true,
   get: function () {
@@ -877,7 +891,7 @@ var _Progress = _interopRequireDefault(require("./Progress"));
 var _ProgressBar = _interopRequireDefault(require("./ProgressBar"));
 var _ProgressDialog = _interopRequireDefault(require("./ProgressDialog"));
 var _ProgressDialogStep = _interopRequireDefault(require("./ProgressDialogStep"));
-var _ProgressStep = _interopRequireDefault(require("./ProgressStep"));
+var _ProgressStep = _interopRequireWildcard(require("./ProgressStep"));
 var _Rating = _interopRequireDefault(require("./Rating"));
 var _Section = _interopRequireWildcard(require("./Section"));
 Object.keys(_Section).forEach(function (key) {

package/cjs/hooks/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "useSqueeze", {
+  enumerable: true,
+  get: function () {
+    return _useSqueeze.useSqueeze;
+  }
+});
+var _useSqueeze = require("./useSqueeze");

package/cjs/hooks/useResizeObserver.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useResizeObserver = void 0;
+var _react = require("react");
+// Copyright 1999-2024. Plesk International GmbH. All rights reserved.
+
+const useResizeObserver = _ref => {
+  let {
+    ref,
+    onResize
+  } = _ref;
+  const onResizeRef = (0, _react.useRef)(undefined);
+  onResizeRef.current = onResize;
+  (0, _react.useEffect)(() => {
+    if (!ref.current) return undefined;
+    if (typeof window === 'undefined' || !('ResizeObserver' in window)) return undefined;
+    const observer = new ResizeObserver(() => {
+      onResizeRef.current?.();
+    });
+    observer.observe(ref.current);
+    return () => {
+      observer.disconnect();
+    };
+  }, [ref]);
+};
+exports.useResizeObserver = useResizeObserver;

package/cjs/hooks/useSqueeze.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useSqueeze = void 0;
+var _react = require("react");
+var _useResizeObserver = require("./useResizeObserver");
+// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
+
+const useSqueeze = _ref => {
+  let {
+    ref,
+    compact,
+    expand
+  } = _ref;
+  const minWidth = (0, _react.useRef)(0);
+  const lastAction = (0, _react.useRef)(null);
+  const [recheck, setRecheck] = (0, _react.useState)(false);
+  const checkRef = (0, _react.useRef)();
+  const check = () => {
+    if (!ref.current) return;
+    const root = ref.current;
+    const width = Math.ceil(root.getBoundingClientRect().width);
+    const scrollWidth = Math.floor(root.scrollWidth);
+    let isCompactChanged = false;
+    if (scrollWidth > width) {
+      isCompactChanged = compact();
+      minWidth.current = scrollWidth;
+      lastAction.current = 'compact';
+    } else if (minWidth.current && width > minWidth.current || lastAction.current === 'expand') {
+      isCompactChanged = expand();
+      lastAction.current = 'expand';
+    }
+    if (isCompactChanged) {
+      setRecheck(c => !c);
+    }
+  };
+  checkRef.current = check;
+  (0, _react.useLayoutEffect)(() => {
+    checkRef.current?.();
+  }, [recheck]);
+  (0, _useResizeObserver.useResizeObserver)({
+    ref,
+    onResize: check
+  });
+};
+exports.useSqueeze = useSqueeze;

package/cjs/index.js

@@ -46,5 +46,5 @@ Object.keys(_components).forEach(function (key) {
   });
 });
 // Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-const version = exports.version = "3.39.0";
+const version = exports.version = "3.40.0";
 (0, _svg4everybody.default)();