@vkontakte/vkui 4.34.1 → 4.35.1

package/dist/cssm/components/ClickPopper/ClickPopper.js

@@ -1,71 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["getRef", "content", "children", "onShownChange", "shown"];
-import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from "react";
-import { useDOM } from "../../lib/dom";
-import { Popper } from "../Popper/Popper";
-import { useExternRef } from "../../hooks/useExternRef";
-import { useEventListener } from "../../hooks/useEventListener";
-import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
-import { usePatchChildrenRef } from "../../hooks/usePatchChildrenRef";
-export var ClickPopper = function ClickPopper(_ref) {
-  var getRef = _ref.getRef,
-      content = _ref.content,
-      children = _ref.children,
-      onShownChange = _ref.onShownChange,
-      _shown = _ref.shown,
-      restProps = _objectWithoutProperties(_ref, _excluded);
-
-  var _React$useState = React.useState(_shown || 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 _shown === "boolean" ? _shown : computedShown;
-
-  var _useDOM = useDOM(),
-      document = _useDOM.document;
-
-  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 _shown !== "boolean") {
-      setComputedShown(value);
-    }
-
-    typeof onShownChange === "function" && onShownChange(value);
-  };
-
-  useGlobalEventListener(document, "click", function (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);
-    }
-  });
-  var targetClickEvent = useEventListener("click", function () {
-    setShown(!shown);
-  });
-  React.useEffect(function () {
-    if (childRef.current !== null) {
-      targetClickEvent.add(childRef.current);
-    }
-  }, [childRef, targetClickEvent]);
-  return createScopedElement(React.Fragment, null, child, shown && createScopedElement(Popper, _extends({}, restProps, {
-    targetRef: childRef,
-    getRef: patchedPopperRef
-  }), content));
-};
-//# sourceMappingURL=ClickPopper.js.map

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/ClickPopper/ClickPopper.tsx"],"names":["React","useDOM","Popper","useExternRef","useEventListener","useGlobalEventListener","usePatchChildrenRef","ClickPopper","getRef","content","children","onShownChange","_shown","shown","restProps","useState","computedShown","setComputedShown","dropdownNode","setPopperNode","document","patchedPopperRef","childRef","child","setShown","value","e","current","contains","target","targetClickEvent","useEffect","add"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,MAAT;AACA,SAASC,MAAT;AACA,SAASC,YAAT;AACA,SAASC,gBAAT;AACA,SAASC,sBAAT;AACA,SAASC,mBAAT;AAqBA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAc,OAOH;AAAA,MANtBC,MAMsB,QANtBA,MAMsB;AAAA,MALtBC,OAKsB,QALtBA,OAKsB;AAAA,MAJtBC,QAIsB,QAJtBA,QAIsB;AAAA,MAHtBC,aAGsB,QAHtBA,aAGsB;AAAA,MAFfC,MAEe,QAFtBC,KAEsB;AAAA,MADnBC,SACmB;;AACtB,wBAA0Cd,KAAK,CAACe,QAAN,CAAeH,MAAM,IAAI,KAAzB,CAA1C;AAAA;AAAA,MAAOI,aAAP;AAAA,MAAsBC,gBAAtB;;AACA,yBAAsCjB,KAAK,CAACe,QAAN,CACpC,IADoC,CAAtC;AAAA;AAAA,MAAOG,YAAP;AAAA,MAAqBC,aAArB;;AAIA,MAAMN,KAAK,GAAG,OAAOD,MAAP,KAAkB,SAAlB,GAA8BA,MAA9B,GAAuCI,aAArD;;AAEA,gBAAqBf,MAAM,EAA3B;AAAA,MAAQmB,QAAR,WAAQA,QAAR;;AAEA,MAAMC,gBAAgB,GAAGlB,YAAY,CAAiBgB,aAAjB,EAAgCX,MAAhC,CAArC;;AAEA,6BAA0BF,mBAAmB,CAACI,QAAD,CAA7C;AAAA;AAAA,MAAOY,QAAP;AAAA,MAAiBC,KAAjB;;AAEA,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAoB;AACnC,QAAI,OAAOb,MAAP,KAAkB,SAAtB,EAAiC;AAC/BK,MAAAA,gBAAgB,CAACQ,KAAD,CAAhB;AACD;;AACD,WAAOd,aAAP,KAAyB,UAAzB,IAAuCA,aAAa,CAACc,KAAD,CAApD;AACD,GALD;;AAOApB,EAAAA,sBAAsB,CAACe,QAAD,EAAW,OAAX,EAAoB,UAACM,CAAD,EAAmB;AAAA;;AAC3D,QACER,YAAY,IACZ,uBAACI,QAAQ,CAACK,OAAV,8CAAC,kBAAkBC,QAAlB,CAA2BF,CAAC,CAACG,MAA7B,CAAD,CADA,IAEA,CAACX,YAAY,CAACU,QAAb,CAAsBF,CAAC,CAACG,MAAxB,CAHH,EAIE;AACAL,MAAAA,QAAQ,CAAC,KAAD,CAAR;AACD;AACF,GARqB,CAAtB;AAUA,MAAMM,gBAAgB,GAAG1B,gBAAgB,CAAC,OAAD,EAAU,YAAM;AACvDoB,IAAAA,QAAQ,CAAC,CAACX,KAAF,CAAR;AACD,GAFwC,CAAzC;AAIAb,EAAAA,KAAK,CAAC+B,SAAN,CAAgB,YAAM;AACpB,QAAIT,QAAQ,CAACK,OAAT,KAAqB,IAAzB,EAA+B;AAC7BG,MAAAA,gBAAgB,CAACE,GAAjB,CAAqBV,QAAQ,CAACK,OAA9B;AACD;AACF,GAJD,EAIG,CAACL,QAAD,EAAWQ,gBAAX,CAJH;AAMA,SACE,oBAAC,KAAD,CAAO,QAAP,QACGP,KADH,EAEGV,KAAK,IACJ,oBAAC,MAAD,eAAYC,SAAZ;AAAuB,IAAA,SAAS,EAAEQ,QAAlC;AAA4C,IAAA,MAAM,EAAED;AAApD,MACGZ,OADH,CAHJ,CADF;AAUD,CA1DM","sourcesContent":["import * as React from \"react\";\nimport { useDOM } from \"../../lib/dom\";\nimport { Popper, PopperCommonProps } from \"../Popper/Popper\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useEventListener } from \"../../hooks/useEventListener\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { usePatchChildrenRef } from \"../../hooks/usePatchChildrenRef\";\n\nexport interface ClickPopperProps extends PopperCommonProps {\n  /**\n   * Содержимое `ClickPopper`\n   */\n  content?: React.ReactNode;\n  /**\n   * Если передан, то тултип будет показан/скрыт в зависимости от значения свойства\n   */\n  shown?: boolean;\n  /**\n   * Вызывается при каждом изменении видимости тултипа\n   */\n  onShownChange?: (shown: boolean) => void;\n  /**\n   * Либо jsx-элемент (div, button, etc.), либо компонент со свойством `getRootRef`, которое применяется к корневому элементу компонента\n   */\n  children?: React.ReactElement;\n}\n\nexport const ClickPopper = ({\n  getRef,\n  content,\n  children,\n  onShownChange,\n  shown: _shown,\n  ...restProps\n}: ClickPopperProps) => {\n  const [computedShown, setComputedShown] = React.useState(_shown || false);\n  const [dropdownNode, setPopperNode] = React.useState<HTMLElement | null>(\n    null\n  );\n\n  const shown = typeof _shown === \"boolean\" ? _shown : computedShown;\n\n  const { document } = useDOM();\n\n  const patchedPopperRef = useExternRef<HTMLDivElement>(setPopperNode, getRef);\n\n  const [childRef, child] = usePatchChildrenRef(children);\n\n  const setShown = (value: boolean) => {\n    if (typeof _shown !== \"boolean\") {\n      setComputedShown(value);\n    }\n    typeof onShownChange === \"function\" && onShownChange(value);\n  };\n\n  useGlobalEventListener(document, \"click\", (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  const targetClickEvent = useEventListener(\"click\", () => {\n    setShown(!shown);\n  });\n\n  React.useEffect(() => {\n    if (childRef.current !== null) {\n      targetClickEvent.add(childRef.current);\n    }\n  }, [childRef, targetClickEvent]);\n\n  return (\n    <React.Fragment>\n      {child}\n      {shown && (\n        <Popper {...restProps} targetRef={childRef} getRef={patchedPopperRef}>\n          {content}\n        </Popper>\n      )}\n    </React.Fragment>\n  );\n};\n"],"file":"ClickPopper.js"}

package/src/components/ClickPopper/ClickPopper.tsx

@@ -1,86 +0,0 @@
-import * as React from "react";
-import { useDOM } from "../../lib/dom";
-import { Popper, PopperCommonProps } from "../Popper/Popper";
-import { useExternRef } from "../../hooks/useExternRef";
-import { useEventListener } from "../../hooks/useEventListener";
-import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
-import { usePatchChildrenRef } from "../../hooks/usePatchChildrenRef";
-
-export interface ClickPopperProps extends PopperCommonProps {
-  /**
-   * Содержимое `ClickPopper`
-   */
-  content?: React.ReactNode;
-  /**
-   * Если передан, то тултип будет показан/скрыт в зависимости от значения свойства
-   */
-  shown?: boolean;
-  /**
-   * Вызывается при каждом изменении видимости тултипа
-   */
-  onShownChange?: (shown: boolean) => void;
-  /**
-   * Либо jsx-элемент (div, button, etc.), либо компонент со свойством `getRootRef`, которое применяется к корневому элементу компонента
-   */
-  children?: React.ReactElement;
-}
-
-export const ClickPopper = ({
-  getRef,
-  content,
-  children,
-  onShownChange,
-  shown: _shown,
-  ...restProps
-}: ClickPopperProps) => {
-  const [computedShown, setComputedShown] = React.useState(_shown || false);
-  const [dropdownNode, setPopperNode] = React.useState<HTMLElement | null>(
-    null
-  );
-
-  const shown = typeof _shown === "boolean" ? _shown : computedShown;
-
-  const { document } = useDOM();
-
-  const patchedPopperRef = useExternRef<HTMLDivElement>(setPopperNode, getRef);
-
-  const [childRef, child] = usePatchChildrenRef(children);
-
-  const setShown = (value: boolean) => {
-    if (typeof _shown !== "boolean") {
-      setComputedShown(value);
-    }
-    typeof onShownChange === "function" && onShownChange(value);
-  };
-
-  useGlobalEventListener(document, "click", (e: MouseEvent) => {
-    if (
-      dropdownNode &&
-      !childRef.current?.contains(e.target as Node) &&
-      !dropdownNode.contains(e.target as Node)
-    ) {
-      setShown(false);
-    }
-  });
-
-  const targetClickEvent = useEventListener("click", () => {
-    setShown(!shown);
-  });
-
-  React.useEffect(() => {
-    if (childRef.current !== null) {
-      targetClickEvent.add(childRef.current);
-    }
-  }, [childRef, targetClickEvent]);
-
-  return (
-    <React.Fragment>
-      {child}
-      {shown && (
-        <Popper {...restProps} targetRef={childRef} getRef={patchedPopperRef}>
-          {content}
-        </Popper>
-      )}
-    </React.Fragment>
-  );
-};