@vkontakte/vkui 5.2.4 → 5.3.1

package/dist/cssm/components/Popover/Popover.js

@@ -1,8 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["action", "shown", "showDelay", "hideDelay", "offsetDistance", "content", "children", "style", "className", "getRef", "onShownChange"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useEventListener } from '../../hooks/useEventListener';
@@ -13,127 +8,103 @@ import { useTimeout } from '../../hooks/useTimeout';
 import { useDOM } from '../../lib/dom';
 import { FocusTrap } from '../FocusTrap/FocusTrap';
 import { Popper } from '../Popper/Popper';
-import "./Popover.module.css";
+import styles from './Popover.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/Popover
- */
-export var Popover = function Popover(_ref) {
-  var _ref$action = _ref.action,
-    action = _ref$action === void 0 ? 'click' : _ref$action,
-    shownProp = _ref.shown,
-    _ref$showDelay = _ref.showDelay,
-    showDelay = _ref$showDelay === void 0 ? 150 : _ref$showDelay,
-    _ref$hideDelay = _ref.hideDelay,
-    hideDelay = _ref$hideDelay === void 0 ? 150 : _ref$hideDelay,
-    _ref$offsetDistance = _ref.offsetDistance,
-    offsetDistance = _ref$offsetDistance === void 0 ? 8 : _ref$offsetDistance,
-    content = _ref.content,
-    children = _ref.children,
-    styleProp = _ref.style,
-    className = _ref.className,
-    getRef = _ref.getRef,
-    onShownChange = _ref.onShownChange,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var _useDOM = useDOM(),
-    document = _useDOM.document;
-  var hoverable = action === 'hover';
-  var hovered = React.useRef(false);
-  var _React$useState = React.useState(shownProp || false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    computedShown = _React$useState2[0],
-    setComputedShown = _React$useState2[1];
-  var _React$useState3 = React.useState(null),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    dropdownNode = _React$useState4[0],
-    setPopperNode = _React$useState4[1];
-  var shown = typeof shownProp === 'boolean' ? shownProp : computedShown;
-  var patchedPopperRef = useExternRef(setPopperNode, getRef);
-  var _usePatchChildrenRef = usePatchChildrenRef(children),
-    _usePatchChildrenRef2 = _slicedToArray(_usePatchChildrenRef, 2),
-    childRef = _usePatchChildrenRef2[0],
-    child = _usePatchChildrenRef2[1];
-  var setShown = function setShown(value) {
-    if (typeof shownProp !== 'boolean') {
-      setComputedShown(value);
-    }
-    typeof onShownChange === 'function' && onShownChange(value);
-  };
-  var showTimeout = useTimeout(function () {
-    return setShown(true);
-  }, showDelay);
-  var hideTimeout = useTimeout(function () {
-    return setShown(false);
-  }, hideDelay);
-  var handleTargetEnter = function handleTargetEnter() {
-    hovered.current = true;
-    hideTimeout.clear();
-    showTimeout.set();
-  };
-  var handleTargetClick = function handleTargetClick() {
-    if (hovered.current && shown) {
-      return;
-    }
-    setShown(!shown);
-  };
-  var handleTargetLeave = function handleTargetLeave() {
-    hovered.current = false;
-    showTimeout.clear();
-    hideTimeout.set();
-  };
-  var handleContentKeyDownEscape = function handleContentKeyDownEscape() {
-    setShown(false);
-  };
-  var handleOutsideClick = function handleOutsideClick(e) {
-    var _childRef$current;
-    if (dropdownNode && !((_childRef$current = childRef.current) !== null && _childRef$current !== void 0 && _childRef$current.contains(e.target)) && !dropdownNode.contains(e.target)) {
-      setShown(false);
-    }
-  };
-  useGlobalEventListener(document, 'click', handleOutsideClick, {
-    capture: true,
-    passive: true
-  });
-  var targetEnterListener = useEventListener('mouseenter', handleTargetEnter);
-  var targetClickEvent = useEventListener('click', handleTargetClick);
-  var targetLeaveListener = useEventListener('mouseleave', handleTargetLeave);
-  React.useEffect(function () {
-    if (!childRef.current) {
-      return;
-    }
-    targetClickEvent.add(childRef.current);
-  }, [childRef, targetClickEvent]);
-  React.useEffect(function () {
-    if (!childRef.current) {
-      return;
-    }
-    if (hoverable) {
-      targetEnterListener.add(childRef.current);
-      targetLeaveListener.add(childRef.current);
-    }
-    return function () {
-      targetEnterListener.remove();
-      targetLeaveListener.remove();
+ */ export const Popover = ({ action ='click' , shown: shownProp , showDelay =150 , hideDelay =150 , offsetDistance =8 , content , children , style: styleProp , className , getRef , onShownChange , ...restProps })=>{
+    const { document  } = useDOM();
+    const hoverable = action === 'hover';
+    const hovered = React.useRef(false);
+    const [computedShown, setComputedShown] = React.useState(shownProp || false);
+    const [dropdownNode, setPopperNode] = React.useState(null);
+    const shown = typeof shownProp === 'boolean' ? shownProp : computedShown;
+    const patchedPopperRef = useExternRef(setPopperNode, getRef);
+    const [childRef, child] = usePatchChildrenRef(children);
+    const setShown = (value)=>{
+        if (typeof shownProp !== 'boolean') {
+            setComputedShown(value);
+        }
+        typeof onShownChange === 'function' && onShownChange(value);
     };
-  }, [childRef, hoverable, targetEnterListener, targetLeaveListener]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, child, shown && /*#__PURE__*/React.createElement(Popper, _extends({}, restProps, {
-    className: classNames("vkuiPopover", className),
-    targetRef: childRef,
-    getRef: patchedPopperRef,
-    offsetDistance: offsetDistance,
-    style: // Reason: Typescript ругается на CSS Custom Properties в объекте
-    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-    _objectSpread(_objectSpread({}, styleProp), {}, {
-      '--vkui_internal--popover_safe_zone_padding': "".concat(offsetDistance, "px")
-    }),
-    renderContent: function renderContent(_ref2) {
-      var wrapperClassName = _ref2.className;
-      return /*#__PURE__*/React.createElement(FocusTrap, {
-        className: wrapperClassName,
-        onClose: handleContentKeyDownEscape
-      }, content);
-    },
-    onMouseOver: hoverable ? hideTimeout.clear : undefined,
-    onMouseOut: hoverable ? handleTargetLeave : undefined
-  })));
+    const showTimeout = useTimeout(()=>setShown(true), showDelay);
+    const hideTimeout = useTimeout(()=>setShown(false), hideDelay);
+    const handleTargetEnter = ()=>{
+        hovered.current = true;
+        hideTimeout.clear();
+        showTimeout.set();
+    };
+    const handleTargetClick = ()=>{
+        if (hovered.current && shown) {
+            return;
+        }
+        setShown(!shown);
+    };
+    const handleTargetLeave = ()=>{
+        hovered.current = false;
+        showTimeout.clear();
+        hideTimeout.set();
+    };
+    const handleContentKeyDownEscape = ()=>{
+        setShown(false);
+    };
+    const handleOutsideClick = (e)=>{
+        if (dropdownNode && !childRef.current?.contains(e.target) && !dropdownNode.contains(e.target)) {
+            setShown(false);
+        }
+    };
+    useGlobalEventListener(document, 'click', handleOutsideClick, {
+        capture: true,
+        passive: true
+    });
+    const targetEnterListener = useEventListener('mouseenter', handleTargetEnter);
+    const targetClickEvent = useEventListener('click', handleTargetClick);
+    const targetLeaveListener = useEventListener('mouseleave', handleTargetLeave);
+    React.useEffect(()=>{
+        if (!childRef.current) {
+            return;
+        }
+        targetClickEvent.add(childRef.current);
+    }, [
+        childRef,
+        targetClickEvent
+    ]);
+    React.useEffect(()=>{
+        if (!childRef.current) {
+            return;
+        }
+        if (hoverable) {
+            targetEnterListener.add(childRef.current);
+            targetLeaveListener.add(childRef.current);
+        }
+        return ()=>{
+            targetEnterListener.remove();
+            targetLeaveListener.remove();
+        };
+    }, [
+        childRef,
+        hoverable,
+        targetEnterListener,
+        targetLeaveListener
+    ]);
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, child, shown && /*#__PURE__*/ React.createElement(Popper, {
+        ...restProps,
+        className: classNames(styles['Popover'], className),
+        targetRef: childRef,
+        getRef: patchedPopperRef,
+        offsetDistance: offsetDistance,
+        style: // Reason: Typescript ругается на CSS Custom Properties в объекте
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        {
+            ...styleProp,
+            '--vkui_internal--popover_safe_zone_padding': `${offsetDistance}px`
+        },
+        renderContent: ({ className: wrapperClassName  })=>/*#__PURE__*/ React.createElement(FocusTrap, {
+                className: wrapperClassName,
+                onClose: handleContentKeyDownEscape
+            }, content),
+        onMouseOver: hoverable ? hideTimeout.clear : undefined,
+        onMouseOut: hoverable ? handleTargetLeave : undefined
+    }));
 };
+
 //# sourceMappingURL=Popover.js.map

package/dist/cssm/components/Popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","names":["React","classNames","useEventListener","useExternRef","useGlobalEventListener","usePatchChildrenRef","useTimeout","useDOM","FocusTrap","Popper","Popover","action","shownProp","shown","showDelay","hideDelay","offsetDistance","content","children","styleProp","style","className","getRef","onShownChange","restProps","document","hoverable","hovered","useRef","useState","computedShown","setComputedShown","dropdownNode","setPopperNode","patchedPopperRef","childRef","child","setShown","value","showTimeout","hideTimeout","handleTargetEnter","current","clear","set","handleTargetClick","handleTargetLeave","handleContentKeyDownEscape","handleOutsideClick","e","contains","target","capture","passive","targetEnterListener","targetClickEvent","targetLeaveListener","useEffect","add","remove","wrapperClassName","undefined"],"sources":["../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePatchChildrenRef } from '../../hooks/usePatchChildrenRef';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper, PopperCommonProps } from '../Popper/Popper';\nimport styles from './Popover.module.css';\n\nexport interface PopoverProps extends Omit<PopperCommonProps, 'arrow' | 'arrowClassName'> {\n  /**\n   * Механика вызова всплывающего окна.\n   *\n   * - `\"click\"` – показывается/скрывается только при нажатии.\n   * - `\"hover\"` – помимо нажатия, будет показываться/скрывается при наведении/отведении мыши.\n   *\n   * > ⚠️`\"hover\"` на тач-устройствах будет работать как `\"click\"`, с одним лишь нюансом, что не будет закрываться\n   * > при повторном нажатии на целевой элемент. Для закрытия необходимо нажать на область вне целевого элемента\n   * > и выпадающего окна.\n   */\n  action?: 'click' | 'hover';\n  /**\n   * Если передан, то всплывающее окно будет показан/скрыт в зависимости от значения свойства.\n   */\n  shown?: boolean;\n  /**\n   * Количество миллисекунд, после которых произойдёт показ всплывающего окна.\n   *\n   * > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n   */\n  showDelay?: number;\n  /**\n   * Количество миллисекунд, после которых произойдёт скрытие всплывающего окна.\n   *\n   * > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n   */\n  hideDelay?: number;\n  /**\n   * Содержимое всплывающего окна.\n   */\n  content?: React.ReactNode;\n  /**\n   * Целевой элемент. Всплывающее окно появится возле него.\n   *\n   * > ⚠️ Если это пользовательский компонент, то он должен предоставлять параметры либо `getRootRef`, либо `ref` для получения ссылки на DOM-узел.\n   */\n  children?: React.ReactElement;\n  /**\n   * Вызывается при каждом изменении видимости всплывающего окна.\n   */\n  onShownChange?(shown: boolean): void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popover\n */\nexport const Popover = ({\n  action = 'click',\n  shown: shownProp,\n  showDelay = 150,\n  hideDelay = 150,\n  offsetDistance = 8,\n  content,\n  children,\n  style: styleProp,\n  className,\n  getRef,\n  onShownChange,\n  ...restProps\n}: PopoverProps) => {\n  const { document } = useDOM();\n\n  const hoverable = action === 'hover';\n  const hovered = React.useRef(false);\n  const [computedShown, setComputedShown] = React.useState(shownProp || false);\n  const [dropdownNode, setPopperNode] = React.useState<HTMLElement | null>(null);\n\n  const shown = typeof shownProp === 'boolean' ? shownProp : computedShown;\n\n  const patchedPopperRef = useExternRef<HTMLDivElement>(setPopperNode, getRef);\n\n  const [childRef, child] = usePatchChildrenRef(children);\n\n  const setShown = (value: boolean) => {\n    if (typeof shownProp !== 'boolean') {\n      setComputedShown(value);\n    }\n    typeof onShownChange === 'function' && onShownChange(value);\n  };\n\n  const showTimeout = useTimeout(() => setShown(true), showDelay);\n\n  const hideTimeout = useTimeout(() => setShown(false), hideDelay);\n\n  const handleTargetEnter = () => {\n    hovered.current = true;\n    hideTimeout.clear();\n    showTimeout.set();\n  };\n\n  const handleTargetClick = () => {\n    if (hovered.current && shown) {\n      return;\n    }\n    setShown(!shown);\n  };\n\n  const handleTargetLeave = () => {\n    hovered.current = false;\n    showTimeout.clear();\n    hideTimeout.set();\n  };\n\n  const handleContentKeyDownEscape = () => {\n    setShown(false);\n  };\n\n  const handleOutsideClick = (e: MouseEvent) => {\n    if (\n      dropdownNode &&\n      !childRef.current?.contains(e.target as Node) &&\n      !dropdownNode.contains(e.target as Node)\n    ) {\n      setShown(false);\n    }\n  };\n\n  useGlobalEventListener(document, 'click', handleOutsideClick, {\n    capture: true,\n    passive: true,\n  });\n  const targetEnterListener = useEventListener('mouseenter', handleTargetEnter);\n  const targetClickEvent = useEventListener('click', handleTargetClick);\n  const targetLeaveListener = useEventListener('mouseleave', handleTargetLeave);\n\n  React.useEffect(() => {\n    if (!childRef.current) {\n      return;\n    }\n\n    targetClickEvent.add(childRef.current);\n  }, [childRef, targetClickEvent]);\n\n  React.useEffect(() => {\n    if (!childRef.current) {\n      return;\n    }\n\n    if (hoverable) {\n      targetEnterListener.add(childRef.current);\n      targetLeaveListener.add(childRef.current);\n    }\n\n    return () => {\n      targetEnterListener.remove();\n      targetLeaveListener.remove();\n    };\n  }, [childRef, hoverable, targetEnterListener, targetLeaveListener]);\n\n  return (\n    <React.Fragment>\n      {child}\n      {shown && (\n        <Popper\n          {...restProps}\n          className={classNames(styles['Popover'], className)}\n          targetRef={childRef}\n          getRef={patchedPopperRef}\n          offsetDistance={offsetDistance}\n          style={\n            // Reason: Typescript ругается на CSS Custom Properties в объекте\n            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n            {\n              ...styleProp,\n              '--vkui_internal--popover_safe_zone_padding': `${offsetDistance}px`,\n            } as React.CSSProperties\n          }\n          renderContent={({ className: wrapperClassName }) => (\n            <FocusTrap className={wrapperClassName} onClose={handleContentKeyDownEscape}>\n              {content}\n            </FocusTrap>\n          )}\n          onMouseOver={hoverable ? hideTimeout.clear : undefined}\n          onMouseOut={hoverable ? handleTargetLeave : undefined}\n        />\n      )}\n    </React.Fragment>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePatchChildrenRef } from '../../hooks/usePatchChildrenRef';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper, PopperCommonProps } from '../Popper/Popper';\nimport styles from './Popover.module.css';\n\nexport interface PopoverProps extends Omit<PopperCommonProps, 'arrow' | 'arrowClassName'> {\n  /**\n   * Механика вызова всплывающего окна.\n   *\n   * - `\"click\"` – показывается/скрывается только при нажатии.\n   * - `\"hover\"` – помимо нажатия, будет показываться/скрывается при наведении/отведении мыши.\n   *\n   * > ⚠️`\"hover\"` на тач-устройствах будет работать как `\"click\"`, с одним лишь нюансом, что не будет закрываться\n   * > при повторном нажатии на целевой элемент. Для закрытия необходимо нажать на область вне целевого элемента\n   * > и выпадающего окна.\n   */\n  action?: 'click' | 'hover';\n  /**\n   * Если передан, то всплывающее окно будет показан/скрыт в зависимости от значения свойства.\n   */\n  shown?: boolean;\n  /**\n   * Количество миллисекунд, после которых произойдёт показ всплывающего окна.\n   *\n   * > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n   */\n  showDelay?: number;\n  /**\n   * Количество миллисекунд, после которых произойдёт скрытие всплывающего окна.\n   *\n   * > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n   */\n  hideDelay?: number;\n  /**\n   * Содержимое всплывающего окна.\n   */\n  content?: React.ReactNode;\n  /**\n   * Целевой элемент. Всплывающее окно появится возле него.\n   *\n   * > ⚠️ Если это пользовательский компонент, то он должен предоставлять параметры либо `getRootRef`, либо `ref` для получения ссылки на DOM-узел.\n   */\n  children?: React.ReactElement;\n  /**\n   * Вызывается при каждом изменении видимости всплывающего окна.\n   */\n  onShownChange?(shown: boolean): void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popover\n */\nexport const Popover = ({\n  action = 'click',\n  shown: shownProp,\n  showDelay = 150,\n  hideDelay = 150,\n  offsetDistance = 8,\n  content,\n  children,\n  style: styleProp,\n  className,\n  getRef,\n  onShownChange,\n  ...restProps\n}: PopoverProps) => {\n  const { document } = useDOM();\n\n  const hoverable = action === 'hover';\n  const hovered = React.useRef(false);\n  const [computedShown, setComputedShown] = React.useState(shownProp || false);\n  const [dropdownNode, setPopperNode] = React.useState<HTMLElement | null>(null);\n\n  const shown = typeof shownProp === 'boolean' ? shownProp : computedShown;\n\n  const patchedPopperRef = useExternRef<HTMLDivElement>(setPopperNode, getRef);\n\n  const [childRef, child] = usePatchChildrenRef(children);\n\n  const setShown = (value: boolean) => {\n    if (typeof shownProp !== 'boolean') {\n      setComputedShown(value);\n    }\n    typeof onShownChange === 'function' && onShownChange(value);\n  };\n\n  const showTimeout = useTimeout(() => setShown(true), showDelay);\n\n  const hideTimeout = useTimeout(() => setShown(false), hideDelay);\n\n  const handleTargetEnter = () => {\n    hovered.current = true;\n    hideTimeout.clear();\n    showTimeout.set();\n  };\n\n  const handleTargetClick = () => {\n    if (hovered.current && shown) {\n      return;\n    }\n    setShown(!shown);\n  };\n\n  const handleTargetLeave = () => {\n    hovered.current = false;\n    showTimeout.clear();\n    hideTimeout.set();\n  };\n\n  const handleContentKeyDownEscape = () => {\n    setShown(false);\n  };\n\n  const handleOutsideClick = (e: MouseEvent) => {\n    if (\n      dropdownNode &&\n      !childRef.current?.contains(e.target as Node) &&\n      !dropdownNode.contains(e.target as Node)\n    ) {\n      setShown(false);\n    }\n  };\n\n  useGlobalEventListener(document, 'click', handleOutsideClick, {\n    capture: true,\n    passive: true,\n  });\n  const targetEnterListener = useEventListener('mouseenter', handleTargetEnter);\n  const targetClickEvent = useEventListener('click', handleTargetClick);\n  const targetLeaveListener = useEventListener('mouseleave', handleTargetLeave);\n\n  React.useEffect(() => {\n    if (!childRef.current) {\n      return;\n    }\n\n    targetClickEvent.add(childRef.current);\n  }, [childRef, targetClickEvent]);\n\n  React.useEffect(() => {\n    if (!childRef.current) {\n      return;\n    }\n\n    if (hoverable) {\n      targetEnterListener.add(childRef.current);\n      targetLeaveListener.add(childRef.current);\n    }\n\n    return () => {\n      targetEnterListener.remove();\n      targetLeaveListener.remove();\n    };\n  }, [childRef, hoverable, targetEnterListener, targetLeaveListener]);\n\n  return (\n    <React.Fragment>\n      {child}\n      {shown && (\n        <Popper\n          {...restProps}\n          className={classNames(styles['Popover'], className)}\n          targetRef={childRef}\n          getRef={patchedPopperRef}\n          offsetDistance={offsetDistance}\n          style={\n            // Reason: Typescript ругается на CSS Custom Properties в объекте\n            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n            {\n              ...styleProp,\n              '--vkui_internal--popover_safe_zone_padding': `${offsetDistance}px`,\n            } as React.CSSProperties\n          }\n          renderContent={({ className: wrapperClassName }) => (\n            <FocusTrap className={wrapperClassName} onClose={handleContentKeyDownEscape}>\n              {content}\n            </FocusTrap>\n          )}\n          onMouseOver={hoverable ? hideTimeout.clear : undefined}\n          onMouseOut={hoverable ? handleTargetLeave : undefined}\n        />\n      )}\n    </React.Fragment>\n  );\n};\n"],"names":["React","classNames","useEventListener","useExternRef","useGlobalEventListener","usePatchChildrenRef","useTimeout","useDOM","FocusTrap","Popper","styles","Popover","action","shown","shownProp","showDelay","hideDelay","offsetDistance","content","children","style","styleProp","className","getRef","onShownChange","restProps","document","hoverable","hovered","useRef","computedShown","setComputedShown","useState","dropdownNode","setPopperNode","patchedPopperRef","childRef","child","setShown","value","showTimeout","hideTimeout","handleTargetEnter","current","clear","set","handleTargetClick","handleTargetLeave","handleContentKeyDownEscape","handleOutsideClick","e","contains","target","capture","passive","targetEnterListener","targetClickEvent","targetLeaveListener","useEffect","add","remove","Fragment","targetRef","renderContent","wrapperClassName","onClose","onMouseOver","undefined","onMouseOut"],"mappings":"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"}

package/dist/cssm/components/Popper/Popper.js

@@ -1,128 +1,105 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["targetRef", "children", "getRef", "placement", "onPlacementChange", "arrow", "arrowClassName", "sameWidth", "offsetDistance", "offsetSkidding", "forcePortal", "autoUpdateOnTargetResize", "style", "customMiddlewares", "renderContent", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useExternRef } from '../../hooks/useExternRef';
 import { arrowMiddleware, autoPlacementMiddleware, autoUpdateFloatingElement, checkIsNotAutoPlacement, convertFloatingDataToReactCSSProperties, flipMiddleware, getAutoPlacementAlign, offsetMiddleware, shiftMiddleware, sizeMiddleware, useFloating } from '../../lib/floating';
 import { AppRootPortal } from '../AppRoot/AppRootPortal';
 import { ARROW_HEIGHT, ARROW_PADDING, PopperArrow } from '../PopperArrow/PopperArrow';
-import "./Popper.module.css";
+import styles from './Popper.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/Popper
- */
-export var Popper = function Popper(_ref) {
-  var targetRef = _ref.targetRef,
-    children = _ref.children,
-    getRef = _ref.getRef,
-    _ref$placement = _ref.placement,
-    placementProp = _ref$placement === void 0 ? 'bottom-start' : _ref$placement,
-    onPlacementChange = _ref.onPlacementChange,
-    arrow = _ref.arrow,
-    arrowClassName = _ref.arrowClassName,
-    sameWidth = _ref.sameWidth,
-    _ref$offsetDistance = _ref.offsetDistance,
-    offsetDistance = _ref$offsetDistance === void 0 ? 8 : _ref$offsetDistance,
-    _ref$offsetSkidding = _ref.offsetSkidding,
-    offsetSkidding = _ref$offsetSkidding === void 0 ? 0 : _ref$offsetSkidding,
-    _ref$forcePortal = _ref.forcePortal,
-    forcePortal = _ref$forcePortal === void 0 ? true : _ref$forcePortal,
-    _ref$autoUpdateOnTarg = _ref.autoUpdateOnTargetResize,
-    autoUpdateOnTargetResize = _ref$autoUpdateOnTarg === void 0 ? false : _ref$autoUpdateOnTarg,
-    styleProp = _ref.style,
-    customMiddlewares = _ref.customMiddlewares,
-    renderContent = _ref.renderContent,
-    className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var arrowRef = React.useRef(null);
-  var isNotAutoPlacement = checkIsNotAutoPlacement(placementProp);
-  var memoizedMiddlewares = React.useMemo(function () {
-    var middlewares = [offsetMiddleware({
-      crossAxis: offsetSkidding,
-      mainAxis: arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance
-    })];
-
-    // см. https://floating-ui.com/docs/flip#conflict-with-autoplacement
-    if (isNotAutoPlacement) {
-      middlewares.push(flipMiddleware());
-    } else {
-      middlewares.push(autoPlacementMiddleware({
-        alignment: getAutoPlacementAlign(placementProp)
-      }));
-    }
-    middlewares.push(shiftMiddleware());
-    if (sameWidth) {
-      middlewares.push(sizeMiddleware({
-        apply: function apply(_ref2) {
-          var rects = _ref2.rects,
-            elements = _ref2.elements;
-          Object.assign(elements.floating.style, {
-            width: "".concat(rects.reference.width, "px")
-          });
+ */ export const Popper = ({ targetRef , children , getRef , placement: placementProp = 'bottom-start' , onPlacementChange , arrow , arrowClassName , sameWidth , offsetDistance =8 , offsetSkidding =0 , forcePortal =true , autoUpdateOnTargetResize =false , style: styleProp , customMiddlewares , renderContent , className , ...restProps })=>{
+    const arrowRef = React.useRef(null);
+    const isNotAutoPlacement = checkIsNotAutoPlacement(placementProp);
+    const memoizedMiddlewares = React.useMemo(()=>{
+        const middlewares = [
+            offsetMiddleware({
+                crossAxis: offsetSkidding,
+                mainAxis: arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance
+            })
+        ];
+        // см. https://floating-ui.com/docs/flip#conflict-with-autoplacement
+        if (isNotAutoPlacement) {
+            middlewares.push(flipMiddleware());
+        } else {
+            middlewares.push(autoPlacementMiddleware({
+                alignment: getAutoPlacementAlign(placementProp)
+            }));
         }
-      }));
-    }
-    if (customMiddlewares) {
-      middlewares.push.apply(middlewares, _toConsumableArray(customMiddlewares));
-    }
-
-    // см. https://floating-ui.com/docs/arrow#order
-    if (arrow) {
-      middlewares.push(arrowMiddleware({
-        element: arrowRef,
-        padding: ARROW_PADDING
-      }));
-    }
-    return middlewares;
-  }, [arrow, sameWidth, offsetSkidding, offsetDistance, customMiddlewares, placementProp, isNotAutoPlacement]);
-  var _useFloating = useFloating({
-      placement: isNotAutoPlacement ? placementProp : undefined,
-      middleware: memoizedMiddlewares,
-      whileElementsMounted: function whileElementsMounted() {
-        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-          args[_key] = arguments[_key];
+        middlewares.push(shiftMiddleware());
+        if (sameWidth) {
+            middlewares.push(sizeMiddleware({
+                apply ({ rects , elements  }) {
+                    Object.assign(elements.floating.style, {
+                        width: `${rects.reference.width}px`
+                    });
+                }
+            }));
+        }
+        if (customMiddlewares) {
+            middlewares.push(...customMiddlewares);
+        }
+        // см. https://floating-ui.com/docs/arrow#order
+        if (arrow) {
+            middlewares.push(arrowMiddleware({
+                element: arrowRef,
+                padding: ARROW_PADDING
+            }));
         }
-        return autoUpdateFloatingElement.apply(void 0, args.concat([{
-          elementResize: autoUpdateOnTargetResize
-        }]));
-      }
-    }),
-    floatingDataX = _useFloating.x,
-    floatingDataY = _useFloating.y,
-    floatingPositionStrategy = _useFloating.strategy,
-    resolvedPlacement = _useFloating.placement,
-    refs = _useFloating.refs,
-    arrowCoords = _useFloating.middlewareData.arrow;
-  var handleRootRef = useExternRef(refs.setFloating, getRef);
-  React.useEffect(function () {
-    refs.setReference(targetRef.current);
-  }, [refs, targetRef]);
-  React.useEffect(function () {
-    if (resolvedPlacement && onPlacementChange) {
-      onPlacementChange({
-        placement: resolvedPlacement
-      });
-    }
-  }, [onPlacementChange, resolvedPlacement]);
-  var dropdown = /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNames("vkuiPopper", className),
-    ref: handleRootRef,
-    style: _objectSpread(_objectSpread({}, styleProp), convertFloatingDataToReactCSSProperties(floatingPositionStrategy, floatingDataX, floatingDataY, sameWidth ? null : undefined))
-  }), arrow && /*#__PURE__*/React.createElement(PopperArrow, {
-    coords: arrowCoords,
-    placement: resolvedPlacement,
-    arrowClassName: arrowClassName,
-    getRootRef: arrowRef
-  }), renderContent ? renderContent({
-    className: "vkuiPopper__content"
-  }) : /*#__PURE__*/React.createElement("div", {
-    className: "vkuiPopper__content"
-  }, children));
-  return /*#__PURE__*/React.createElement(AppRootPortal, {
-    forcePortal: forcePortal,
-    className: "vkuiPopperPortal"
-  }, dropdown);
+        return middlewares;
+    }, [
+        arrow,
+        sameWidth,
+        offsetSkidding,
+        offsetDistance,
+        customMiddlewares,
+        placementProp,
+        isNotAutoPlacement
+    ]);
+    const { x: floatingDataX , y: floatingDataY , strategy: floatingPositionStrategy , placement: resolvedPlacement , refs , middlewareData: { arrow: arrowCoords  }  } = useFloating({
+        placement: isNotAutoPlacement ? placementProp : undefined,
+        middleware: memoizedMiddlewares,
+        whileElementsMounted (...args) {
+            return autoUpdateFloatingElement(...args, {
+                elementResize: autoUpdateOnTargetResize
+            });
+        }
+    });
+    const handleRootRef = useExternRef(refs.setFloating, getRef);
+    React.useEffect(()=>{
+        refs.setReference(targetRef.current);
+    }, [
+        refs,
+        targetRef
+    ]);
+    React.useEffect(()=>{
+        if (resolvedPlacement && onPlacementChange) {
+            onPlacementChange({
+                placement: resolvedPlacement
+            });
+        }
+    }, [
+        onPlacementChange,
+        resolvedPlacement
+    ]);
+    const dropdown = /*#__PURE__*/ React.createElement("div", {
+        ...restProps,
+        className: classNames(styles['Popper'], className),
+        ref: handleRootRef,
+        style: {
+            ...styleProp,
+            ...convertFloatingDataToReactCSSProperties(floatingPositionStrategy, floatingDataX, floatingDataY, sameWidth ? null : undefined)
+        }
+    }, arrow && /*#__PURE__*/ React.createElement(PopperArrow, {
+        coords: arrowCoords,
+        placement: resolvedPlacement,
+        arrowClassName: arrowClassName,
+        getRootRef: arrowRef
+    }), renderContent ? renderContent({
+        className: ''
+    }) : children);
+    return /*#__PURE__*/ React.createElement(AppRootPortal, {
+        forcePortal: forcePortal
+    }, dropdown);
 };
+
 //# sourceMappingURL=Popper.js.map

package/dist/cssm/components/Popper/Popper.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popper.js","names":["React","classNames","useExternRef","arrowMiddleware","autoPlacementMiddleware","autoUpdateFloatingElement","checkIsNotAutoPlacement","convertFloatingDataToReactCSSProperties","flipMiddleware","getAutoPlacementAlign","offsetMiddleware","shiftMiddleware","sizeMiddleware","useFloating","AppRootPortal","ARROW_HEIGHT","ARROW_PADDING","PopperArrow","Popper","targetRef","children","getRef","placement","placementProp","onPlacementChange","arrow","arrowClassName","sameWidth","offsetDistance","offsetSkidding","forcePortal","autoUpdateOnTargetResize","styleProp","style","customMiddlewares","renderContent","className","restProps","arrowRef","useRef","isNotAutoPlacement","memoizedMiddlewares","useMemo","middlewares","crossAxis","mainAxis","push","alignment","apply","rects","elements","Object","assign","floating","width","reference","element","padding","undefined","middleware","whileElementsMounted","args","elementResize","floatingDataX","x","floatingDataY","y","floatingPositionStrategy","strategy","resolvedPlacement","refs","arrowCoords","middlewareData","handleRootRef","setFloating","useEffect","setReference","current","dropdown"],"sources":["../../../../src/components/Popper/Popper.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport {\n  arrowMiddleware,\n  autoPlacementMiddleware,\n  autoUpdateFloatingElement,\n  checkIsNotAutoPlacement,\n  convertFloatingDataToReactCSSProperties,\n  flipMiddleware,\n  getAutoPlacementAlign,\n  offsetMiddleware,\n  type Placement,\n  type PlacementWithAuto,\n  shiftMiddleware,\n  sizeMiddleware,\n  useFloating,\n  type UseFloatingMiddleware,\n} from '../../lib/floating';\nimport type { HasRef } from '../../types';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { ARROW_HEIGHT, ARROW_PADDING, PopperArrow } from '../PopperArrow/PopperArrow';\nimport styles from './Popper.module.css';\n\nexport interface PopperRenderContentProps {\n  className: string;\n}\n\nexport interface PopperCommonProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: PlacementWithAuto;\n  /**\n   * Отступ по вспомогательной оси\n   */\n  offsetSkidding?: number;\n  /**\n   * Отступ по главной оси\n   */\n  offsetDistance?: number;\n  /**\n   * Отображать ли стрелку, указывающую на якорный элемент\n   */\n  arrow?: boolean;\n  /**\n   * Стиль стрелки\n   */\n  arrowClassName?: string;\n  /**\n   * Выставлять ширину равной target элементу\n   */\n  sameWidth?: boolean;\n  forcePortal?: boolean;\n  /**\n   * Подписывается на изменение геометрии `targetRef`, чтобы пересчитать свою позицию.\n   */\n  autoUpdateOnTargetResize?: boolean;\n  /**\n   * Массив кастомных модификаторов для Popper (необходимо мемоизировать)\n   */\n  customMiddlewares?: UseFloatingMiddleware[];\n  /**\n   * При передаче содержимого в `children`, он будет обёрнут во внутренний контейнер.\n   *\n   * Если хочется управлять этим контейнером, то используйте данную функцию.\n   *\n   * > ⚠️ Параметр `children` будет проигнорирован.\n   */\n  renderContent?(props: PopperRenderContentProps): React.ReactNode;\n  onPlacementChange?(data: { placement?: Placement }): void;\n}\n\nexport interface PopperProps extends PopperCommonProps {\n  targetRef: React.RefObject<HTMLElement>;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popper\n */\nexport const Popper = ({\n  targetRef,\n  children,\n  getRef,\n  placement: placementProp = 'bottom-start',\n  onPlacementChange,\n  arrow,\n  arrowClassName,\n  sameWidth,\n  offsetDistance = 8,\n  offsetSkidding = 0,\n  forcePortal = true,\n  autoUpdateOnTargetResize = false,\n  style: styleProp,\n  customMiddlewares,\n  renderContent,\n  className,\n  ...restProps\n}: PopperProps) => {\n  const arrowRef = React.useRef<HTMLDivElement>(null);\n\n  const isNotAutoPlacement = checkIsNotAutoPlacement(placementProp);\n\n  const memoizedMiddlewares = React.useMemo(() => {\n    const middlewares: UseFloatingMiddleware[] = [\n      offsetMiddleware({\n        crossAxis: offsetSkidding,\n        mainAxis: arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance,\n      }),\n    ];\n\n    // см. https://floating-ui.com/docs/flip#conflict-with-autoplacement\n    if (isNotAutoPlacement) {\n      middlewares.push(flipMiddleware());\n    } else {\n      middlewares.push(\n        autoPlacementMiddleware({ alignment: getAutoPlacementAlign(placementProp) }),\n      );\n    }\n\n    middlewares.push(shiftMiddleware());\n\n    if (sameWidth) {\n      middlewares.push(\n        sizeMiddleware({\n          apply({ rects, elements }) {\n            Object.assign(elements.floating.style, {\n              width: `${rects.reference.width}px`,\n            });\n          },\n        }),\n      );\n    }\n\n    if (customMiddlewares) {\n      middlewares.push(...customMiddlewares);\n    }\n\n    // см. https://floating-ui.com/docs/arrow#order\n    if (arrow) {\n      middlewares.push(\n        arrowMiddleware({\n          element: arrowRef,\n          padding: ARROW_PADDING,\n        }),\n      );\n    }\n\n    return middlewares;\n  }, [\n    arrow,\n    sameWidth,\n    offsetSkidding,\n    offsetDistance,\n    customMiddlewares,\n    placementProp,\n    isNotAutoPlacement,\n  ]);\n\n  const {\n    x: floatingDataX,\n    y: floatingDataY,\n    strategy: floatingPositionStrategy,\n    placement: resolvedPlacement,\n    refs,\n    middlewareData: { arrow: arrowCoords },\n  } = useFloating({\n    placement: isNotAutoPlacement ? placementProp : undefined,\n    middleware: memoizedMiddlewares,\n    whileElementsMounted(...args) {\n      return autoUpdateFloatingElement(...args, {\n        elementResize: autoUpdateOnTargetResize,\n      });\n    },\n  });\n\n  const handleRootRef = useExternRef<HTMLDivElement>(refs.setFloating, getRef);\n\n  React.useEffect(() => {\n    refs.setReference(targetRef.current);\n  }, [refs, targetRef]);\n\n  React.useEffect(() => {\n    if (resolvedPlacement && onPlacementChange) {\n      onPlacementChange({ placement: resolvedPlacement });\n    }\n  }, [onPlacementChange, resolvedPlacement]);\n\n  const dropdown = (\n    <div\n      {...restProps}\n      className={classNames(styles['Popper'], className)}\n      ref={handleRootRef}\n      style={{\n        ...styleProp,\n        ...convertFloatingDataToReactCSSProperties(\n          floatingPositionStrategy,\n          floatingDataX,\n          floatingDataY,\n          sameWidth ? null : undefined,\n        ),\n      }}\n    >\n      {arrow && (\n        <PopperArrow\n          coords={arrowCoords}\n          placement={resolvedPlacement}\n          arrowClassName={arrowClassName}\n          getRootRef={arrowRef}\n        />\n      )}\n      {renderContent ? (\n        renderContent({ className: styles['Popper__content'] })\n      ) : (\n        <div className={styles['Popper__content']}>{children}</div>\n      )}\n    </div>\n  );\n\n  return (\n    <AppRootPortal forcePortal={forcePortal} className={styles['PopperPortal']}>\n      {dropdown}\n    </AppRootPortal>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Popper/Popper.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport {\n  arrowMiddleware,\n  autoPlacementMiddleware,\n  autoUpdateFloatingElement,\n  checkIsNotAutoPlacement,\n  convertFloatingDataToReactCSSProperties,\n  flipMiddleware,\n  getAutoPlacementAlign,\n  offsetMiddleware,\n  type Placement,\n  type PlacementWithAuto,\n  shiftMiddleware,\n  sizeMiddleware,\n  useFloating,\n  type UseFloatingMiddleware,\n} from '../../lib/floating';\nimport type { HasRef } from '../../types';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { ARROW_HEIGHT, ARROW_PADDING, PopperArrow } from '../PopperArrow/PopperArrow';\nimport styles from './Popper.module.css';\n\nexport interface PopperRenderContentProps {\n  className: string;\n}\n\nexport interface PopperCommonProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: PlacementWithAuto;\n  /**\n   * Отступ по вспомогательной оси\n   */\n  offsetSkidding?: number;\n  /**\n   * Отступ по главной оси\n   */\n  offsetDistance?: number;\n  /**\n   * Отображать ли стрелку, указывающую на якорный элемент\n   */\n  arrow?: boolean;\n  /**\n   * Стиль стрелки\n   */\n  arrowClassName?: string;\n  /**\n   * Выставлять ширину равной target элементу\n   */\n  sameWidth?: boolean;\n  forcePortal?: boolean;\n  /**\n   * Подписывается на изменение геометрии `targetRef`, чтобы пересчитать свою позицию.\n   */\n  autoUpdateOnTargetResize?: boolean;\n  /**\n   * Массив кастомных модификаторов для Popper (необходимо мемоизировать)\n   */\n  customMiddlewares?: UseFloatingMiddleware[];\n  /**\n   * При передаче содержимого в `children`, он будет обёрнут во внутренний контейнер.\n   *\n   * Если хочется управлять этим контейнером, то используйте данную функцию.\n   *\n   * > ⚠️ Параметр `children` будет проигнорирован.\n   */\n  renderContent?(props: PopperRenderContentProps): React.ReactNode;\n  onPlacementChange?(data: { placement?: Placement }): void;\n}\n\nexport interface PopperProps extends PopperCommonProps {\n  targetRef: React.RefObject<HTMLElement>;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popper\n */\nexport const Popper = ({\n  targetRef,\n  children,\n  getRef,\n  placement: placementProp = 'bottom-start',\n  onPlacementChange,\n  arrow,\n  arrowClassName,\n  sameWidth,\n  offsetDistance = 8,\n  offsetSkidding = 0,\n  forcePortal = true,\n  autoUpdateOnTargetResize = false,\n  style: styleProp,\n  customMiddlewares,\n  renderContent,\n  className,\n  ...restProps\n}: PopperProps) => {\n  const arrowRef = React.useRef<HTMLDivElement>(null);\n\n  const isNotAutoPlacement = checkIsNotAutoPlacement(placementProp);\n\n  const memoizedMiddlewares = React.useMemo(() => {\n    const middlewares: UseFloatingMiddleware[] = [\n      offsetMiddleware({\n        crossAxis: offsetSkidding,\n        mainAxis: arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance,\n      }),\n    ];\n\n    // см. https://floating-ui.com/docs/flip#conflict-with-autoplacement\n    if (isNotAutoPlacement) {\n      middlewares.push(flipMiddleware());\n    } else {\n      middlewares.push(\n        autoPlacementMiddleware({ alignment: getAutoPlacementAlign(placementProp) }),\n      );\n    }\n\n    middlewares.push(shiftMiddleware());\n\n    if (sameWidth) {\n      middlewares.push(\n        sizeMiddleware({\n          apply({ rects, elements }) {\n            Object.assign(elements.floating.style, {\n              width: `${rects.reference.width}px`,\n            });\n          },\n        }),\n      );\n    }\n\n    if (customMiddlewares) {\n      middlewares.push(...customMiddlewares);\n    }\n\n    // см. https://floating-ui.com/docs/arrow#order\n    if (arrow) {\n      middlewares.push(\n        arrowMiddleware({\n          element: arrowRef,\n          padding: ARROW_PADDING,\n        }),\n      );\n    }\n\n    return middlewares;\n  }, [\n    arrow,\n    sameWidth,\n    offsetSkidding,\n    offsetDistance,\n    customMiddlewares,\n    placementProp,\n    isNotAutoPlacement,\n  ]);\n\n  const {\n    x: floatingDataX,\n    y: floatingDataY,\n    strategy: floatingPositionStrategy,\n    placement: resolvedPlacement,\n    refs,\n    middlewareData: { arrow: arrowCoords },\n  } = useFloating({\n    placement: isNotAutoPlacement ? placementProp : undefined,\n    middleware: memoizedMiddlewares,\n    whileElementsMounted(...args) {\n      return autoUpdateFloatingElement(...args, {\n        elementResize: autoUpdateOnTargetResize,\n      });\n    },\n  });\n\n  const handleRootRef = useExternRef<HTMLDivElement>(refs.setFloating, getRef);\n\n  React.useEffect(() => {\n    refs.setReference(targetRef.current);\n  }, [refs, targetRef]);\n\n  React.useEffect(() => {\n    if (resolvedPlacement && onPlacementChange) {\n      onPlacementChange({ placement: resolvedPlacement });\n    }\n  }, [onPlacementChange, resolvedPlacement]);\n\n  const dropdown = (\n    <div\n      {...restProps}\n      className={classNames(styles['Popper'], className)}\n      ref={handleRootRef}\n      style={{\n        ...styleProp,\n        ...convertFloatingDataToReactCSSProperties(\n          floatingPositionStrategy,\n          floatingDataX,\n          floatingDataY,\n          sameWidth ? null : undefined,\n        ),\n      }}\n    >\n      {arrow && (\n        <PopperArrow\n          coords={arrowCoords}\n          placement={resolvedPlacement}\n          arrowClassName={arrowClassName}\n          getRootRef={arrowRef}\n        />\n      )}\n      {renderContent ? renderContent({ className: '' }) : children}\n    </div>\n  );\n\n  return <AppRootPortal forcePortal={forcePortal}>{dropdown}</AppRootPortal>;\n};\n"],"names":["React","classNames","useExternRef","arrowMiddleware","autoPlacementMiddleware","autoUpdateFloatingElement","checkIsNotAutoPlacement","convertFloatingDataToReactCSSProperties","flipMiddleware","getAutoPlacementAlign","offsetMiddleware","shiftMiddleware","sizeMiddleware","useFloating","AppRootPortal","ARROW_HEIGHT","ARROW_PADDING","PopperArrow","styles","Popper","targetRef","children","getRef","placement","placementProp","onPlacementChange","arrow","arrowClassName","sameWidth","offsetDistance","offsetSkidding","forcePortal","autoUpdateOnTargetResize","style","styleProp","customMiddlewares","renderContent","className","restProps","arrowRef","useRef","isNotAutoPlacement","memoizedMiddlewares","useMemo","middlewares","crossAxis","mainAxis","push","alignment","apply","rects","elements","Object","assign","floating","width","reference","element","padding","x","floatingDataX","y","floatingDataY","strategy","floatingPositionStrategy","resolvedPlacement","refs","middlewareData","arrowCoords","undefined","middleware","whileElementsMounted","args","elementResize","handleRootRef","setFloating","useEffect","setReference","current","dropdown","div","ref","coords","getRootRef"],"mappings":"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"}

package/dist/cssm/components/PopperArrow/PopperArrow.d.ts

@@ -4,7 +4,7 @@ import type { HasRootRef } from '../../types';
 export declare const ARROW_PADDING = 10;
 export declare const ARROW_WIDTH = 20;
 export declare const ARROW_HEIGHT = 8;
-declare type Coords = {
+type Coords = {
     x?: number;
     y?: number;
 };