neko-popup 3.0.2 → 3.0.3

package/dist/PopupButton.d.ts

@@ -13,5 +13,4 @@ export interface IPopupButtonProps {
     id?: string;
     onClick?(e: React.MouseEvent): void;
 }
-declare const PopupButton: FC<IPopupButtonProps>;
-export default PopupButton;
+export declare const PopupButton: FC<IPopupButtonProps>;

package/dist/PopupLayer.d.ts

@@ -1,5 +1,5 @@
 import { FC, ReactNode } from 'react';
-interface IPopupLayerProps {
+export interface IPopupLayerProps {
     children?: ReactNode | ReactNode[];
     /** @default 10000 */
     baseZIndex?: number;
@@ -10,5 +10,4 @@ interface IPopupLayerProps {
      */
     disableBodyScrollOnActivePopup?: boolean;
 }
-declare const PopupLayer: FC<IPopupLayerProps>;
-export default PopupLayer;
+export declare const PopupLayer: FC<IPopupLayerProps>;

package/dist/PopupWindow.d.ts

@@ -1,6 +1,7 @@
 import { FC, ReactNode } from 'react';
 import { PopupWindowDisabledType, StateSetter } from './Interfaces';
-interface IPopupWindowProps {
+export type PopupWindowAnimationType = 'fade' | 'scale' | null;
+export interface IPopupWindowProps {
     id: string;
     children: ReactNode | ReactNode[];
     isOpen?: boolean;
@@ -41,5 +42,4 @@ interface IPopupWindowProps {
      */
     onAfterExit?(): void;
 }
-declare const PopupWindow: FC<IPopupWindowProps>;
-export default PopupWindow;
+export declare const PopupWindow: FC<IPopupWindowProps>;

package/dist/index.d.ts

@@ -1,3 +1,4 @@
-export { default as PopupLayer } from './PopupLayer';
-export { default as PopupButton } from './PopupButton';
-export { default as PopupWindow } from './PopupWindow';
+export * from './PopupButton';
+export * from './PopupLayer';
+export * from './PopupWindow';
+export type { IPopupContext, IPopupNode } from './Interfaces';

package/dist/index.es.js

@@ -1,11 +1,6 @@
-import { jsxs as N, jsx as v } from "react/jsx-runtime";
-import { createContext as A, useState as m, useRef as I, useEffect as u, useContext as P, useMemo as z, useLayoutEffect as O } from "react";
+import { jsx as v, jsxs as N } from "react/jsx-runtime";
+import { createContext as A, useContext as I, useState as m, useEffect as u, useRef as P, useMemo as z, useLayoutEffect as O } from "react";
 import { createPortal as w } from "react-dom";
-class B extends Error {
-  constructor(n) {
-    super(n), this.name = "error at [neko-popup]";
-  }
-}
 function C(e) {
   var n, s, o = "";
   if (typeof e == "string" || typeof e == "number") o += e;
@@ -15,12 +10,40 @@ function C(e) {
   } else for (s in e) e[s] && (o && (o += " "), o += s);
   return o;
 }
-function L() {
+function B() {
   for (var e, n, s = 0, o = "", a = arguments.length; s < a; s++) (e = arguments[s]) && (n = C(e)) && (o && (o += " "), o += n);
   return o;
 }
-const E = A({}), g = L, R = (e) => {
-  const [n, s] = m([]), [o, a] = m(!1), b = I(null), l = e.baseZIndex ?? 1e4, x = e.disableBodyScrollOnActivePopup ?? !0;
+const E = A({}), g = B, R = (e) => {
+  const n = I(E), [s, o] = m(!1), a = e.as ?? "button";
+  u(() => {
+    const l = n.nodes.find((x) => x.id === e.popupId);
+    l && o(l.isOpen);
+  }, [n]);
+  function b(l) {
+    n.invokePopup(e.popupId), e.onClick && e.onClick(l);
+  }
+  return /* @__PURE__ */ v(
+    a,
+    {
+      tabIndex: 0,
+      disabled: e.disabled,
+      "aria-disabled": e.disabled,
+      "aria-haspopup": "dialog",
+      id: e.id,
+      className: g("neko-popup-button", s && "neko-popup-button--active", e.className),
+      onClick: b,
+      children: e.children
+    }
+  );
+};
+class L extends Error {
+  constructor(n) {
+    super(n), this.name = "error at [neko-popup]";
+  }
+}
+const T = (e) => {
+  const [n, s] = m([]), [o, a] = m(!1), b = P(null), l = e.baseZIndex ?? 1e4, x = e.disableBodyScrollOnActivePopup ?? !0;
   u(() => {
     const i = new AbortController();
     if (window.addEventListener("keydown", (d) => {
@@ -41,7 +64,7 @@ const E = A({}), g = L, R = (e) => {
   }, [o]);
   function f(i, d) {
     const t = typeof i == "string" ? n.find((r) => r.id === i) : i;
-    if (!t) throw new B(typeof i == "string" ? `Cannot find popup node with id #${i}` : "Entity is not assigned to the node");
+    if (!t) throw new L(typeof i == "string" ? `Cannot find popup node with id #${i}` : "Entity is not assigned to the node");
     const c = d ?? !t.isOpen;
     t.isOpen = c, t.zIndex = c ? Math.max(...n.map((r) => r.zIndex), 0) + 1 : -1, p(t);
   }
@@ -63,28 +86,6 @@ const E = A({}), g = L, R = (e) => {
     e.children,
     /* @__PURE__ */ v("section", { style: { zIndex: l }, ref: b })
   ] });
-}, T = (e) => {
-  const n = P(E), [s, o] = m(!1), a = e.as ?? "button";
-  u(() => {
-    const l = n.nodes.find((x) => x.id === e.popupId);
-    l && o(l.isOpen);
-  }, [n]);
-  function b(l) {
-    n.invokePopup(e.popupId), e.onClick && e.onClick(l);
-  }
-  return /* @__PURE__ */ v(
-    a,
-    {
-      tabIndex: 0,
-      disabled: e.disabled,
-      "aria-disabled": e.disabled,
-      "aria-haspopup": "dialog",
-      id: e.id,
-      className: g("neko-popup-button", s && "neko-popup-button--active", e.className),
-      onClick: b,
-      children: e.children
-    }
-  );
 };
 function D(e, n) {
   const s = z(() => arguments.length === 2 && n !== void 0, []), [o, a] = m(e);
@@ -96,7 +97,7 @@ function D(e, n) {
   ] : [o, a];
 }
 const Z = (e) => {
-  const n = P(E), [s, o] = m(null), [a, b] = D(e.isOpen ?? !1, e.setIsOpen), [l, x] = m(-1), [f, h] = m([]), p = I(null), k = e.animation !== void 0 ? e.animation : "fade", i = e.animationDuraionMs ?? 200;
+  const n = I(E), [s, o] = m(null), [a, b] = D(e.isOpen ?? !1, e.setIsOpen), [l, x] = m(-1), [f, h] = m([]), p = P(null), k = e.animation !== void 0 ? e.animation : "fade", i = e.animationDuraionMs ?? 200;
   O(() => {
     let t = [];
     typeof e.disabled == "boolean" ? t = e.disabled ? ["onEscape", "onLayer"] : [] : t = e.disabled ?? [], n.updateNodeProperty(e.id, "disabled", t);
@@ -148,8 +149,8 @@ const Z = (e) => {
   ), s);
 };
 export {
-  T as PopupButton,
-  R as PopupLayer,
+  R as PopupButton,
+  T as PopupLayer,
   Z as PopupWindow
 };
 //# sourceMappingURL=index.es.js.map

package/dist/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../src/_package/components/ErrorComponents.ts","../node_modules/clsx/dist/clsx.mjs","../src/_package/Interfaces.ts","../src/_package/PopupLayer.tsx","../src/_package/PopupButton.tsx","../src/_package/hooks/useMixedState.ts","../src/_package/PopupWindow.tsx"],"sourcesContent":["class EFKW extends Error {\n  constructor(msg: string) {\n    super(msg);\n\n    this.name = 'error at [neko-popup]';\n  }\n}\n\nexport default EFKW;","function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import React, { createContext, RefObject } from 'react';\nimport clsx from 'clsx';\n\n\n\n\nexport type PopupWindowDisabledType = 'onEscape' | 'onLayer';\nexport type StateSetter<S = any> = React.Dispatch<React.SetStateAction<S>>\nexport type RegisterNodeArgs = Pick<IPopupNode, 'id' | 'isOpen' | 'disabled'>\n\n/** Get value type from nested object path */\nexport type ValueFromPath<T, P> =\n  P extends `${infer K}.${infer R}`\n  ? K extends keyof T\n  ? R extends keyof T[K]\n  ? T[K][R]\n  : never\n  : never\n  : P extends keyof T\n  ? T[P]\n  : never;\n\n\n\nexport interface IPopupNode {\n  id: string\n  isOpen: boolean\n  zIndex: number\n  disabled: PopupWindowDisabledType[]\n}\n\nexport interface IPopupContext {\n  nodes: IPopupNode[]\n  containerRef: RefObject<HTMLDivElement | null>\n\n  invokePopup(id: string, forceState?: boolean): void\n  registerNode(args: RegisterNodeArgs): void\n  updateNodeProperty<K extends keyof IPopupNode>(id: string, key: K, value: ValueFromPath<IPopupNode, K>): void\n}\n\n\n\nexport const PopupContext = createContext<IPopupContext>({} as IPopupContext);\nexport const cn = clsx;","'use client';\n\nimport { FC, ReactNode, useEffect, useRef, useState } from 'react';\n\nimport EFKW from './components/ErrorComponents';\nimport { IPopupNode, PopupContext, RegisterNodeArgs, ValueFromPath } from './Interfaces';\n\n\n\ninterface IPopupLayerProps {\n  children?: ReactNode | ReactNode[]\n\n  /** @default 10000 */\n  baseZIndex?: number\n\n  /**\n   * Disable body scroll when there is at least one open popup\n   * \n   * @default true\n   */\n  disableBodyScrollOnActivePopup?: boolean\n}\n\n\n\nconst PopupLayer: FC<IPopupLayerProps> = (props) => {\n  const [nodes, setNodes] = useState<IPopupNode[]>([]);\n  const [isScrollDisabled, setIsScrollDisabled] = useState(false);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const baseZIndex = props.baseZIndex ?? 10000;\n  const disableBodyScrollOnActivePopup = props.disableBodyScrollOnActivePopup ?? true;\n\n\n\n  // Handle close closest to user popup on escape & scroll\n  useEffect(() => {\n    // === Handle close closest popup on escape\n    const controller = new AbortController();\n\n    window.addEventListener('keydown', e => {\n      const key = e.key;\n\n      if (key === 'Escape') {\n        const maxZIndex = Math.max(...nodes.filter(el => el.isOpen).map(el => el.zIndex));\n        const node = nodes.find(el => el.zIndex === maxZIndex);\n        if (!node || node.disabled.includes('onEscape')) return;\n\n        // eslint-disable-next-line\n        invokePopup(node.id, false);\n      }\n    }, { signal: controller.signal });\n\n\n\n    // === Disable body scroll on active popup\n    if (disableBodyScrollOnActivePopup) {\n      let anyOpenNode = false;\n      nodes.forEach(el => el.isOpen ? anyOpenNode = true : null);\n\n      setIsScrollDisabled(anyOpenNode);\n    }\n\n\n\n    return () => {\n      controller.abort();\n    };\n  }, [nodes]);\n\n  // Handle body scroll\n  useEffect(() => {\n    if (isScrollDisabled) document.body.classList.add('neko-popup--noScroll');\n    else document.body.classList.remove('neko-popup--noScroll');\n  }, [isScrollDisabled]);\n\n\n\n  /** Toggle popup state */\n  function invokePopup(entityOrId: string | IPopupNode, forceState?: boolean) {\n    const node = typeof entityOrId === 'string' ? nodes.find(el => el.id === entityOrId) : entityOrId;\n    if (!node) throw new EFKW(typeof entityOrId === 'string' ? `Cannot find popup node with id #${entityOrId}` : `Entity is not assigned to the node`);\n\n    const newState = forceState ?? !node.isOpen;\n\n    // === Update node\n    node.isOpen = newState;\n    node.zIndex = newState ? Math.max(...nodes.map(el => el.zIndex), 0) + 1 : -1; // Make new popup invocation closer to user using larger z-index\n\n    _updateNodeInNodes(node);\n  }\n\n  /** Update node property */\n  function updateNodeProperty<K extends keyof IPopupNode>(id: string, key: K, value: ValueFromPath<IPopupNode, K>) {\n    const node = nodes.find(el => el.id === id);\n    if (!node) return;\n\n    node[key] = value;\n\n    _updateNodeInNodes(node);\n  }\n\n  /** Update node in nodes array */\n  function _updateNodeInNodes(node: IPopupNode) {\n    setNodes(prev => [...prev.filter(el => el.id !== node.id), node]);\n  }\n\n  /** Add new popup window to state */\n  const registerNode = ({ id, isOpen, disabled }: RegisterNodeArgs) => invokePopup({ id, isOpen: false, disabled, zIndex: -1 }, isOpen);\n\n\n\n  return <PopupContext.Provider value={{\n    nodes,\n    containerRef,\n    invokePopup,\n    registerNode,\n    updateNodeProperty\n  }}>\n    {props.children}\n\n    <section style={{ zIndex: baseZIndex }} ref={containerRef} />\n  </PopupContext.Provider>;\n};\n\nexport default PopupLayer;","'use client';\n\nimport { FC, JSX, ReactNode, useContext, useEffect, useState } from 'react';\n\nimport { cn, PopupContext } from './Interfaces';\n\n\n\nexport interface IPopupButtonProps {\n  popupId: string\n\n  /** \n   * Element tag\n   * \n   * @default \"button\"\n   */\n  as?: 'button' | 'div'\n\n  disabled?: boolean\n  children?: ReactNode | ReactNode[]\n  className?: string\n  id?: string\n\n  onClick?(e: React.MouseEvent): void\n}\n\n\n\nconst PopupButton: FC<IPopupButtonProps> = (props) => {\n  const ctx = useContext(PopupContext);\n\n  const [isActive, setIsActive] = useState(false);\n\n  const Tag: keyof JSX.IntrinsicElements = props.as ?? 'button';\n\n\n\n  // Handle isActive on context change\n  useEffect(() => {\n    const node = ctx.nodes.find(el => el.id === props.popupId);\n    if (!node) return;\n\n    setIsActive(node.isOpen);\n  }, [ctx]);\n\n\n\n  function invokePopup(e: React.MouseEvent) {\n    ctx.invokePopup(props.popupId);\n\n    if (props.onClick) props.onClick(e);\n  }\n\n\n\n  return <Tag\n    tabIndex={0}\n    disabled={props.disabled}\n    aria-disabled={props.disabled}\n    aria-haspopup={'dialog'}\n    id={props.id}\n    className={cn(`neko-popup-button`, isActive && 'neko-popup-button--active', props.className)}\n    onClick={invokePopup}\n  >\n    {props.children}\n  </Tag>;\n};\n\nexport default PopupButton;","'use client';\n\nimport { useEffect, useMemo, useState } from 'react';\n\n\n\n\ntype StateSetter<S> = React.Dispatch<React.SetStateAction<S>>;\ntype InitialState<S> = S | (() => S);\n\nexport default function useMixedState<S = undefined>(): [S | undefined, StateSetter<S | undefined>];\nexport default function useMixedState<S>(initialState: InitialState<S>): [S, StateSetter<S>];\nexport default function useMixedState<S>(state: S, setter?: StateSetter<S>): [S, StateSetter<S>];\n\n\n\n/** \n * Use mixed state hook\n * \n * @param initialStateOrValue Initial state, can be undefined, value or function. If externalSetter not specified, will return default state\n * @param externalSetter External state setter. If specified will return external state\n */\nexport default function useMixedState<S>(initialStateOrValue?: InitialState<S>, externalSetter?: StateSetter<S>) {\n  const isControlled = useMemo(() => arguments.length === 2 && externalSetter !== undefined, []);\n\n  const [state, setter] = useState<S | undefined>(initialStateOrValue);\n\n\n\n  // Propagate state update on external state update even if external setter is not provided\n  useEffect(() => {\n    if (!isControlled) {\n       \n      setter(initialStateOrValue);\n    }\n  }, [initialStateOrValue]);\n\n\n\n  if (isControlled) {\n    return [\n      initialStateOrValue as S,\n      externalSetter as StateSetter<S>\n    ];\n  }\n\n  return [state, setter];\n}","'use client';\n\nimport { FC, ReactNode, useContext, useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport useMixedState from './hooks/useMixedState';\nimport { cn, PopupContext, PopupWindowDisabledType, StateSetter } from './Interfaces';\n\n\n\ntype PopupWindowAnimationType = 'fade' | 'scale' | null\n\n\n\ninterface IPopupWindowProps {\n  id: string\n  children: ReactNode | ReactNode[]\n\n  isOpen?: boolean\n  setIsOpen?: StateSetter<boolean>\n\n  className?: string\n  layerClassName?: string\n  disabled?: PopupWindowDisabledType[] | boolean\n\n  /** \n   * Popup dialog animation type\n   * \n   * @default \"fade\"\n   */\n  animation?: 'fade' | 'scale' | null\n\n  /**\n   * Popup animation duration in msec\n   * \n   * @default 200\n   */\n  animationDuraionMs?: number\n\n  /** \n   * Fire callback when popup invoked to open\n   */\n  onBeforeEnter?(): void\n\n  /** \n   * Fire callback when popup open animation fullfilled. \n   * \n   * @see animationDuration\n   */\n  onAfterEnter?(): void\n\n  /** \n   * Fire callback when popup invoked to close\n   */\n  onBeforeExit?(): void\n\n  /** \n   * Fire callback when popup close animation fullfilled. \n   * \n   * @see animationDuration\n   */\n  onAfterExit?(): void\n}\n\n\n\nconst PopupWindow: FC<IPopupWindowProps> = (props) => {\n  const ctx = useContext(PopupContext);\n\n  const [container, setContainer] = useState<HTMLDivElement | null>(null);\n  const [isOpen, setIsOpen] = useMixedState(props.isOpen ?? false, props.setIsOpen);\n  const [zIndex, setZIndex] = useState(-1);\n  const [disabled, setDisabled] = useState<PopupWindowDisabledType[]>([]);\n\n  const layerRef = useRef<HTMLDivElement>(null);\n\n  const animation: PopupWindowAnimationType = props.animation !== undefined ? props.animation : 'fade';\n  const animationDuration = props.animationDuraionMs ?? 200;\n\n\n\n  // Handle disabled\n  useLayoutEffect(() => {\n    let disabled: PopupWindowDisabledType[] = [];\n\n    if (typeof props.disabled === 'boolean') disabled = props.disabled ? ['onEscape', 'onLayer'] : [];\n    else disabled = props.disabled ?? [];\n\n    ctx.updateNodeProperty(props.id, 'disabled', disabled);\n  }, [props.disabled]);\n\n\n\n  // Mount & register node\n  useEffect(() => {\n    const container = ctx.containerRef.current;\n    if (!container) return;\n\n    setContainer(container);\n\n    ctx.registerNode({\n      id: props.id,\n      isOpen: Boolean(props.isOpen),\n      disabled\n    });\n  }, []);\n\n  // Handle node sync with context\n  useEffect(() => {\n    const node = ctx.nodes.find(el => el.id === props.id);\n    if (!node) return;\n\n    setIsOpen(node.isOpen);\n    setZIndex(node.zIndex);\n    setDisabled(node.disabled);\n  }, [ctx.nodes]);\n\n  // Handle layer z-index change\n  useEffect(() => {\n    const layer = layerRef.current;\n    if (!layer) return;\n\n    if (isOpen) layer.style.zIndex = `${zIndex}`;\n    else setTimeout(() => {\n      layer.style.zIndex = `${-1}`;\n    }, animationDuration);\n  }, [isOpen]);\n\n  // Handle events (onBeforeEnter, etc)\n  useEffect(() => {\n    if (isOpen) {\n      if (props.onBeforeEnter) props.onBeforeEnter();\n\n      setTimeout(() => {\n        if (props.onAfterEnter) props.onAfterEnter();\n      }, animationDuration);\n    } else {\n      if (props.onBeforeExit) props.onBeforeExit();\n\n      setTimeout(() => {\n        if (props.onAfterExit) props.onAfterExit();\n      }, animationDuration);\n    }\n  }, [isOpen]);\n\n\n\n  function layerOnClick() {\n    if (disabled.includes('onLayer')) return;\n\n    ctx.invokePopup(props.id, false);\n  }\n\n\n\n  return container && createPortal(<section\n    className={cn(`neko-popup-backdrop`, isOpen && 'neko-popup-backdrop--active', props.layerClassName)}\n    aria-hidden={!isOpen}\n    style={{ transition: `${animationDuration}ms ease-in-out`, cursor: disabled.includes('onLayer') ? 'default' : 'pointer' }}\n    onClick={layerOnClick}\n    ref={layerRef}\n  >\n    <article\n      id={props.id}\n      className={cn(`neko-popup`, isOpen && 'neko-popup--active', animation && `neko-popup--animation_${animation}`, props.className)}\n      role=\"dialog\"\n      aria-modal\n      onClick={e => e.stopPropagation()}\n    >\n      {props.children}\n    </article>\n  </section>, container);\n};\n\nexport default PopupWindow;"],"names":["EFKW","msg","r","t","f","n","o","clsx","PopupContext","createContext","cn","PopupLayer","props","nodes","setNodes","useState","isScrollDisabled","setIsScrollDisabled","containerRef","useRef","baseZIndex","disableBodyScrollOnActivePopup","useEffect","controller","e","maxZIndex","el","node","invokePopup","anyOpenNode","entityOrId","forceState","newState","_updateNodeInNodes","updateNodeProperty","id","key","value","prev","registerNode","isOpen","disabled","jsxs","jsx","PopupButton","ctx","useContext","isActive","setIsActive","Tag","useMixedState","initialStateOrValue","externalSetter","isControlled","useMemo","state","setter","PopupWindow","container","setContainer","setIsOpen","zIndex","setZIndex","setDisabled","layerRef","animation","animationDuration","useLayoutEffect","layer","layerOnClick","createPortal"],"mappings":"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","x_google_ignoreList":[1]}
+{"version":3,"file":"index.es.js","sources":["../node_modules/clsx/dist/clsx.mjs","../src/_package/Interfaces.ts","../src/_package/PopupButton.tsx","../src/_package/components/ErrorComponents.ts","../src/_package/PopupLayer.tsx","../src/_package/hooks/useMixedState.ts","../src/_package/PopupWindow.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import React, { createContext, RefObject } from 'react';\nimport clsx from 'clsx';\n\n\n\n\nexport type PopupWindowDisabledType = 'onEscape' | 'onLayer';\nexport type StateSetter<S = any> = React.Dispatch<React.SetStateAction<S>>\nexport type RegisterNodeArgs = Pick<IPopupNode, 'id' | 'isOpen' | 'disabled'>\n\n/** Get value type from nested object path */\nexport type ValueFromPath<T, P> =\n  P extends `${infer K}.${infer R}`\n  ? K extends keyof T\n  ? R extends keyof T[K]\n  ? T[K][R]\n  : never\n  : never\n  : P extends keyof T\n  ? T[P]\n  : never;\n\n\n\nexport interface IPopupNode {\n  id: string\n  isOpen: boolean\n  zIndex: number\n  disabled: PopupWindowDisabledType[]\n}\n\nexport interface IPopupContext {\n  nodes: IPopupNode[]\n  containerRef: RefObject<HTMLDivElement | null>\n\n  invokePopup(id: string, forceState?: boolean): void\n  registerNode(args: RegisterNodeArgs): void\n  updateNodeProperty<K extends keyof IPopupNode>(id: string, key: K, value: ValueFromPath<IPopupNode, K>): void\n}\n\n\n\nexport const PopupContext = createContext<IPopupContext>({} as IPopupContext);\nexport const cn = clsx;","'use client';\n\nimport { FC, JSX, ReactNode, useContext, useEffect, useState } from 'react';\n\nimport { cn, PopupContext } from './Interfaces';\n\n\n\nexport interface IPopupButtonProps {\n  popupId: string\n\n  /** \n   * Element tag\n   * \n   * @default \"button\"\n   */\n  as?: 'button' | 'div'\n\n  disabled?: boolean\n  children?: ReactNode | ReactNode[]\n  className?: string\n  id?: string\n\n  onClick?(e: React.MouseEvent): void\n}\n\n\n\nexport const PopupButton: FC<IPopupButtonProps> = (props) => {\n  const ctx = useContext(PopupContext);\n\n  const [isActive, setIsActive] = useState(false);\n\n  const Tag: keyof JSX.IntrinsicElements = props.as ?? 'button';\n\n\n\n  // Handle isActive on context change\n  useEffect(() => {\n    const node = ctx.nodes.find(el => el.id === props.popupId);\n    if (!node) return;\n\n    setIsActive(node.isOpen);\n  }, [ctx]);\n\n\n\n  function invokePopup(e: React.MouseEvent) {\n    ctx.invokePopup(props.popupId);\n\n    if (props.onClick) props.onClick(e);\n  }\n\n\n\n  return <Tag\n    tabIndex={0}\n    disabled={props.disabled}\n    aria-disabled={props.disabled}\n    aria-haspopup={'dialog'}\n    id={props.id}\n    className={cn(`neko-popup-button`, isActive && 'neko-popup-button--active', props.className)}\n    onClick={invokePopup}\n  >\n    {props.children}\n  </Tag>;\n};","class EFKW extends Error {\n  constructor(msg: string) {\n    super(msg);\n\n    this.name = 'error at [neko-popup]';\n  }\n}\n\nexport default EFKW;","'use client';\n\nimport { FC, ReactNode, useEffect, useRef, useState } from 'react';\n\nimport EFKW from './components/ErrorComponents';\nimport { IPopupNode, PopupContext, RegisterNodeArgs, ValueFromPath } from './Interfaces';\n\n\n\nexport interface IPopupLayerProps {\n  children?: ReactNode | ReactNode[]\n\n  /** @default 10000 */\n  baseZIndex?: number\n\n  /**\n   * Disable body scroll when there is at least one open popup\n   * \n   * @default true\n   */\n  disableBodyScrollOnActivePopup?: boolean\n}\n\n\n\nexport const PopupLayer: FC<IPopupLayerProps> = (props) => {\n  const [nodes, setNodes] = useState<IPopupNode[]>([]);\n  const [isScrollDisabled, setIsScrollDisabled] = useState(false);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const baseZIndex = props.baseZIndex ?? 10000;\n  const disableBodyScrollOnActivePopup = props.disableBodyScrollOnActivePopup ?? true;\n\n\n\n  // Handle close closest to user popup on escape & scroll\n  useEffect(() => {\n    // === Handle close closest popup on escape\n    const controller = new AbortController();\n\n    window.addEventListener('keydown', e => {\n      const key = e.key;\n\n      if (key === 'Escape') {\n        const maxZIndex = Math.max(...nodes.filter(el => el.isOpen).map(el => el.zIndex));\n        const node = nodes.find(el => el.zIndex === maxZIndex);\n        if (!node || node.disabled.includes('onEscape')) return;\n\n        // eslint-disable-next-line\n        invokePopup(node.id, false);\n      }\n    }, { signal: controller.signal });\n\n\n\n    // === Disable body scroll on active popup\n    if (disableBodyScrollOnActivePopup) {\n      let anyOpenNode = false;\n      nodes.forEach(el => el.isOpen ? anyOpenNode = true : null);\n\n      setIsScrollDisabled(anyOpenNode);\n    }\n\n\n\n    return () => {\n      controller.abort();\n    };\n  }, [nodes]);\n\n  // Handle body scroll\n  useEffect(() => {\n    if (isScrollDisabled) document.body.classList.add('neko-popup--noScroll');\n    else document.body.classList.remove('neko-popup--noScroll');\n  }, [isScrollDisabled]);\n\n\n\n  /** Toggle popup state */\n  function invokePopup(entityOrId: string | IPopupNode, forceState?: boolean) {\n    const node = typeof entityOrId === 'string' ? nodes.find(el => el.id === entityOrId) : entityOrId;\n    if (!node) throw new EFKW(typeof entityOrId === 'string' ? `Cannot find popup node with id #${entityOrId}` : `Entity is not assigned to the node`);\n\n    const newState = forceState ?? !node.isOpen;\n\n    // === Update node\n    node.isOpen = newState;\n    node.zIndex = newState ? Math.max(...nodes.map(el => el.zIndex), 0) + 1 : -1; // Make new popup invocation closer to user using larger z-index\n\n    _updateNodeInNodes(node);\n  }\n\n  /** Update node property */\n  function updateNodeProperty<K extends keyof IPopupNode>(id: string, key: K, value: ValueFromPath<IPopupNode, K>) {\n    const node = nodes.find(el => el.id === id);\n    if (!node) return;\n\n    node[key] = value;\n\n    _updateNodeInNodes(node);\n  }\n\n  /** Update node in nodes array */\n  function _updateNodeInNodes(node: IPopupNode) {\n    setNodes(prev => [...prev.filter(el => el.id !== node.id), node]);\n  }\n\n  /** Add new popup window to state */\n  const registerNode = ({ id, isOpen, disabled }: RegisterNodeArgs) => invokePopup({ id, isOpen: false, disabled, zIndex: -1 }, isOpen);\n\n\n\n  return <PopupContext.Provider value={{\n    nodes,\n    containerRef,\n    invokePopup,\n    registerNode,\n    updateNodeProperty\n  }}>\n    {props.children}\n\n    <section style={{ zIndex: baseZIndex }} ref={containerRef} />\n  </PopupContext.Provider>;\n};","'use client';\n\nimport { useEffect, useMemo, useState } from 'react';\n\n\n\n\ntype StateSetter<S> = React.Dispatch<React.SetStateAction<S>>;\ntype InitialState<S> = S | (() => S);\n\nexport default function useMixedState<S = undefined>(): [S | undefined, StateSetter<S | undefined>];\nexport default function useMixedState<S>(initialState: InitialState<S>): [S, StateSetter<S>];\nexport default function useMixedState<S>(state: S, setter?: StateSetter<S>): [S, StateSetter<S>];\n\n\n\n/** \n * Use mixed state hook\n * \n * @param initialStateOrValue Initial state, can be undefined, value or function. If externalSetter not specified, will return default state\n * @param externalSetter External state setter. If specified will return external state\n */\nexport default function useMixedState<S>(initialStateOrValue?: InitialState<S>, externalSetter?: StateSetter<S>) {\n  const isControlled = useMemo(() => arguments.length === 2 && externalSetter !== undefined, []);\n\n  const [state, setter] = useState<S | undefined>(initialStateOrValue);\n\n\n\n  // Propagate state update on external state update even if external setter is not provided\n  useEffect(() => {\n    if (!isControlled) {\n       \n      setter(initialStateOrValue);\n    }\n  }, [initialStateOrValue]);\n\n\n\n  if (isControlled) {\n    return [\n      initialStateOrValue as S,\n      externalSetter as StateSetter<S>\n    ];\n  }\n\n  return [state, setter];\n}","'use client';\n\nimport { FC, ReactNode, useContext, useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport useMixedState from './hooks/useMixedState';\nimport { cn, PopupContext, PopupWindowDisabledType, StateSetter } from './Interfaces';\n\n\n\nexport type PopupWindowAnimationType = 'fade' | 'scale' | null\n\n\n\nexport interface IPopupWindowProps {\n  id: string\n  children: ReactNode | ReactNode[]\n\n  isOpen?: boolean\n  setIsOpen?: StateSetter<boolean>\n\n  className?: string\n  layerClassName?: string\n  disabled?: PopupWindowDisabledType[] | boolean\n\n  /** \n   * Popup dialog animation type\n   * \n   * @default \"fade\"\n   */\n  animation?: 'fade' | 'scale' | null\n\n  /**\n   * Popup animation duration in msec\n   * \n   * @default 200\n   */\n  animationDuraionMs?: number\n\n  /** \n   * Fire callback when popup invoked to open\n   */\n  onBeforeEnter?(): void\n\n  /** \n   * Fire callback when popup open animation fullfilled. \n   * \n   * @see animationDuration\n   */\n  onAfterEnter?(): void\n\n  /** \n   * Fire callback when popup invoked to close\n   */\n  onBeforeExit?(): void\n\n  /** \n   * Fire callback when popup close animation fullfilled. \n   * \n   * @see animationDuration\n   */\n  onAfterExit?(): void\n}\n\n\n\nexport const PopupWindow: FC<IPopupWindowProps> = (props) => {\n  const ctx = useContext(PopupContext);\n\n  const [container, setContainer] = useState<HTMLDivElement | null>(null);\n  const [isOpen, setIsOpen] = useMixedState(props.isOpen ?? false, props.setIsOpen);\n  const [zIndex, setZIndex] = useState(-1);\n  const [disabled, setDisabled] = useState<PopupWindowDisabledType[]>([]);\n\n  const layerRef = useRef<HTMLDivElement>(null);\n\n  const animation: PopupWindowAnimationType = props.animation !== undefined ? props.animation : 'fade';\n  const animationDuration = props.animationDuraionMs ?? 200;\n\n\n\n  // Handle disabled\n  useLayoutEffect(() => {\n    let disabled: PopupWindowDisabledType[] = [];\n\n    if (typeof props.disabled === 'boolean') disabled = props.disabled ? ['onEscape', 'onLayer'] : [];\n    else disabled = props.disabled ?? [];\n\n    ctx.updateNodeProperty(props.id, 'disabled', disabled);\n  }, [props.disabled]);\n\n\n\n  // Mount & register node\n  useEffect(() => {\n    const container = ctx.containerRef.current;\n    if (!container) return;\n\n    setContainer(container);\n\n    ctx.registerNode({\n      id: props.id,\n      isOpen: Boolean(props.isOpen),\n      disabled\n    });\n  }, []);\n\n  // Handle node sync with context\n  useEffect(() => {\n    const node = ctx.nodes.find(el => el.id === props.id);\n    if (!node) return;\n\n    setIsOpen(node.isOpen);\n    setZIndex(node.zIndex);\n    setDisabled(node.disabled);\n  }, [ctx.nodes]);\n\n  // Handle layer z-index change\n  useEffect(() => {\n    const layer = layerRef.current;\n    if (!layer) return;\n\n    if (isOpen) layer.style.zIndex = `${zIndex}`;\n    else setTimeout(() => {\n      layer.style.zIndex = `${-1}`;\n    }, animationDuration);\n  }, [isOpen]);\n\n  // Handle events (onBeforeEnter, etc)\n  useEffect(() => {\n    if (isOpen) {\n      if (props.onBeforeEnter) props.onBeforeEnter();\n\n      setTimeout(() => {\n        if (props.onAfterEnter) props.onAfterEnter();\n      }, animationDuration);\n    } else {\n      if (props.onBeforeExit) props.onBeforeExit();\n\n      setTimeout(() => {\n        if (props.onAfterExit) props.onAfterExit();\n      }, animationDuration);\n    }\n  }, [isOpen]);\n\n\n\n  function layerOnClick() {\n    if (disabled.includes('onLayer')) return;\n\n    ctx.invokePopup(props.id, false);\n  }\n\n\n\n  return container && createPortal(<section\n    className={cn(`neko-popup-backdrop`, isOpen && 'neko-popup-backdrop--active', props.layerClassName)}\n    aria-hidden={!isOpen}\n    style={{ transition: `${animationDuration}ms ease-in-out`, cursor: disabled.includes('onLayer') ? 'default' : 'pointer' }}\n    onClick={layerOnClick}\n    ref={layerRef}\n  >\n    <article\n      id={props.id}\n      className={cn(`neko-popup`, isOpen && 'neko-popup--active', animation && `neko-popup--animation_${animation}`, props.className)}\n      role=\"dialog\"\n      aria-modal\n      onClick={e => e.stopPropagation()}\n    >\n      {props.children}\n    </article>\n  </section>, container);\n};"],"names":["r","t","f","n","o","clsx","PopupContext","createContext","cn","PopupButton","props","ctx","useContext","isActive","setIsActive","useState","Tag","useEffect","node","el","invokePopup","e","jsx","EFKW","msg","PopupLayer","nodes","setNodes","isScrollDisabled","setIsScrollDisabled","containerRef","useRef","baseZIndex","disableBodyScrollOnActivePopup","controller","maxZIndex","anyOpenNode","entityOrId","forceState","newState","_updateNodeInNodes","updateNodeProperty","id","key","value","prev","registerNode","isOpen","disabled","jsxs","useMixedState","initialStateOrValue","externalSetter","isControlled","useMemo","state","setter","PopupWindow","container","setContainer","setIsOpen","zIndex","setZIndex","setDisabled","layerRef","animation","animationDuration","useLayoutEffect","layer","layerOnClick","createPortal"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/index.umd.js

@@ -1,2 +1,2 @@
-(function(c,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("react/jsx-runtime"),require("react"),require("react-dom")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","react-dom"],l):(c=typeof globalThis<"u"?globalThis:c||self,l(c["neko-popup"]={},c.jsxRuntime,c.React,c.ReactDOM))})(this,(function(c,l,o,g){"use strict";class C extends Error{constructor(n){super(n),this.name="error at [neko-popup]"}}function I(e){var n,d,i="";if(typeof e=="string"||typeof e=="number")i+=e;else if(typeof e=="object")if(Array.isArray(e)){var a=e.length;for(n=0;n<a;n++)e[n]&&(d=I(e[n]))&&(i&&(i+=" "),i+=d)}else for(d in e)e[d]&&(i&&(i+=" "),i+=d);return i}function N(){for(var e,n,d=0,i="",a=arguments.length;d<a;d++)(e=arguments[d])&&(n=I(e))&&(i&&(i+=" "),i+=n);return i}const h=o.createContext({}),v=N,S=e=>{const[n,d]=o.useState([]),[i,a]=o.useState(!1),x=o.useRef(null),p=e.baseZIndex??1e4,y=e.disableBodyScrollOnActivePopup??!0;o.useEffect(()=>{const s=new AbortController;if(window.addEventListener("keydown",u=>{if(u.key==="Escape"){const f=Math.max(...n.filter(k=>k.isOpen).map(k=>k.zIndex)),r=n.find(k=>k.zIndex===f);if(!r||r.disabled.includes("onEscape"))return;m(r.id,!1)}},{signal:s.signal}),y){let u=!1;n.forEach(t=>t.isOpen?u=!0:null),a(u)}return()=>{s.abort()}},[n]),o.useEffect(()=>{i?document.body.classList.add("neko-popup--noScroll"):document.body.classList.remove("neko-popup--noScroll")},[i]);function m(s,u){const t=typeof s=="string"?n.find(r=>r.id===s):s;if(!t)throw new C(typeof s=="string"?`Cannot find popup node with id #${s}`:"Entity is not assigned to the node");const f=u??!t.isOpen;t.isOpen=f,t.zIndex=f?Math.max(...n.map(r=>r.zIndex),0)+1:-1,b(t)}function P(s,u,t){const f=n.find(r=>r.id===s);f&&(f[u]=t,b(f))}function b(s){d(u=>[...u.filter(t=>t.id!==s.id),s])}const E=({id:s,isOpen:u,disabled:t})=>m({id:s,isOpen:!1,disabled:t,zIndex:-1},u);return l.jsxs(h.Provider,{value:{nodes:n,containerRef:x,invokePopup:m,registerNode:E,updateNodeProperty:P},children:[e.children,l.jsx("section",{style:{zIndex:p},ref:x})]})},O=e=>{const n=o.useContext(h),[d,i]=o.useState(!1),a=e.as??"button";o.useEffect(()=>{const p=n.nodes.find(y=>y.id===e.popupId);p&&i(p.isOpen)},[n]);function x(p){n.invokePopup(e.popupId),e.onClick&&e.onClick(p)}return l.jsx(a,{tabIndex:0,disabled:e.disabled,"aria-disabled":e.disabled,"aria-haspopup":"dialog",id:e.id,className:v("neko-popup-button",d&&"neko-popup-button--active",e.className),onClick:x,children:e.children})};function A(e,n){const d=o.useMemo(()=>arguments.length===2&&n!==void 0,[]),[i,a]=o.useState(e);return o.useEffect(()=>{d||a(e)},[e]),d?[e,n]:[i,a]}const w=e=>{const n=o.useContext(h),[d,i]=o.useState(null),[a,x]=A(e.isOpen??!1,e.setIsOpen),[p,y]=o.useState(-1),[m,P]=o.useState([]),b=o.useRef(null),E=e.animation!==void 0?e.animation:"fade",s=e.animationDuraionMs??200;o.useLayoutEffect(()=>{let t=[];typeof e.disabled=="boolean"?t=e.disabled?["onEscape","onLayer"]:[]:t=e.disabled??[],n.updateNodeProperty(e.id,"disabled",t)},[e.disabled]),o.useEffect(()=>{const t=n.containerRef.current;t&&(i(t),n.registerNode({id:e.id,isOpen:!!e.isOpen,disabled:m}))},[]),o.useEffect(()=>{const t=n.nodes.find(f=>f.id===e.id);t&&(x(t.isOpen),y(t.zIndex),P(t.disabled))},[n.nodes]),o.useEffect(()=>{const t=b.current;t&&(a?t.style.zIndex=`${p}`:setTimeout(()=>{t.style.zIndex="-1"},s))},[a]),o.useEffect(()=>{a?(e.onBeforeEnter&&e.onBeforeEnter(),setTimeout(()=>{e.onAfterEnter&&e.onAfterEnter()},s)):(e.onBeforeExit&&e.onBeforeExit(),setTimeout(()=>{e.onAfterExit&&e.onAfterExit()},s))},[a]);function u(){m.includes("onLayer")||n.invokePopup(e.id,!1)}return d&&g.createPortal(l.jsx("section",{className:v("neko-popup-backdrop",a&&"neko-popup-backdrop--active",e.layerClassName),"aria-hidden":!a,style:{transition:`${s}ms ease-in-out`,cursor:m.includes("onLayer")?"default":"pointer"},onClick:u,ref:b,children:l.jsx("article",{id:e.id,className:v("neko-popup",a&&"neko-popup--active",E&&`neko-popup--animation_${E}`,e.className),role:"dialog","aria-modal":!0,onClick:t=>t.stopPropagation(),children:e.children})}),d)};c.PopupButton=O,c.PopupLayer=S,c.PopupWindow=w,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})}));
+(function(c,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("react/jsx-runtime"),require("react"),require("react-dom")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","react-dom"],l):(c=typeof globalThis<"u"?globalThis:c||self,l(c["neko-popup"]={},c.jsxRuntime,c.React,c.ReactDOM))})(this,(function(c,l,o,g){"use strict";function I(e){var n,d,i="";if(typeof e=="string"||typeof e=="number")i+=e;else if(typeof e=="object")if(Array.isArray(e)){var a=e.length;for(n=0;n<a;n++)e[n]&&(d=I(e[n]))&&(i&&(i+=" "),i+=d)}else for(d in e)e[d]&&(i&&(i+=" "),i+=d);return i}function C(){for(var e,n,d=0,i="",a=arguments.length;d<a;d++)(e=arguments[d])&&(n=I(e))&&(i&&(i+=" "),i+=n);return i}const h=o.createContext({}),v=C,N=e=>{const n=o.useContext(h),[d,i]=o.useState(!1),a=e.as??"button";o.useEffect(()=>{const p=n.nodes.find(y=>y.id===e.popupId);p&&i(p.isOpen)},[n]);function x(p){n.invokePopup(e.popupId),e.onClick&&e.onClick(p)}return l.jsx(a,{tabIndex:0,disabled:e.disabled,"aria-disabled":e.disabled,"aria-haspopup":"dialog",id:e.id,className:v("neko-popup-button",d&&"neko-popup-button--active",e.className),onClick:x,children:e.children})};class S extends Error{constructor(n){super(n),this.name="error at [neko-popup]"}}const O=e=>{const[n,d]=o.useState([]),[i,a]=o.useState(!1),x=o.useRef(null),p=e.baseZIndex??1e4,y=e.disableBodyScrollOnActivePopup??!0;o.useEffect(()=>{const s=new AbortController;if(window.addEventListener("keydown",u=>{if(u.key==="Escape"){const f=Math.max(...n.filter(k=>k.isOpen).map(k=>k.zIndex)),r=n.find(k=>k.zIndex===f);if(!r||r.disabled.includes("onEscape"))return;m(r.id,!1)}},{signal:s.signal}),y){let u=!1;n.forEach(t=>t.isOpen?u=!0:null),a(u)}return()=>{s.abort()}},[n]),o.useEffect(()=>{i?document.body.classList.add("neko-popup--noScroll"):document.body.classList.remove("neko-popup--noScroll")},[i]);function m(s,u){const t=typeof s=="string"?n.find(r=>r.id===s):s;if(!t)throw new S(typeof s=="string"?`Cannot find popup node with id #${s}`:"Entity is not assigned to the node");const f=u??!t.isOpen;t.isOpen=f,t.zIndex=f?Math.max(...n.map(r=>r.zIndex),0)+1:-1,b(t)}function P(s,u,t){const f=n.find(r=>r.id===s);f&&(f[u]=t,b(f))}function b(s){d(u=>[...u.filter(t=>t.id!==s.id),s])}const E=({id:s,isOpen:u,disabled:t})=>m({id:s,isOpen:!1,disabled:t,zIndex:-1},u);return l.jsxs(h.Provider,{value:{nodes:n,containerRef:x,invokePopup:m,registerNode:E,updateNodeProperty:P},children:[e.children,l.jsx("section",{style:{zIndex:p},ref:x})]})};function A(e,n){const d=o.useMemo(()=>arguments.length===2&&n!==void 0,[]),[i,a]=o.useState(e);return o.useEffect(()=>{d||a(e)},[e]),d?[e,n]:[i,a]}const w=e=>{const n=o.useContext(h),[d,i]=o.useState(null),[a,x]=A(e.isOpen??!1,e.setIsOpen),[p,y]=o.useState(-1),[m,P]=o.useState([]),b=o.useRef(null),E=e.animation!==void 0?e.animation:"fade",s=e.animationDuraionMs??200;o.useLayoutEffect(()=>{let t=[];typeof e.disabled=="boolean"?t=e.disabled?["onEscape","onLayer"]:[]:t=e.disabled??[],n.updateNodeProperty(e.id,"disabled",t)},[e.disabled]),o.useEffect(()=>{const t=n.containerRef.current;t&&(i(t),n.registerNode({id:e.id,isOpen:!!e.isOpen,disabled:m}))},[]),o.useEffect(()=>{const t=n.nodes.find(f=>f.id===e.id);t&&(x(t.isOpen),y(t.zIndex),P(t.disabled))},[n.nodes]),o.useEffect(()=>{const t=b.current;t&&(a?t.style.zIndex=`${p}`:setTimeout(()=>{t.style.zIndex="-1"},s))},[a]),o.useEffect(()=>{a?(e.onBeforeEnter&&e.onBeforeEnter(),setTimeout(()=>{e.onAfterEnter&&e.onAfterEnter()},s)):(e.onBeforeExit&&e.onBeforeExit(),setTimeout(()=>{e.onAfterExit&&e.onAfterExit()},s))},[a]);function u(){m.includes("onLayer")||n.invokePopup(e.id,!1)}return d&&g.createPortal(l.jsx("section",{className:v("neko-popup-backdrop",a&&"neko-popup-backdrop--active",e.layerClassName),"aria-hidden":!a,style:{transition:`${s}ms ease-in-out`,cursor:m.includes("onLayer")?"default":"pointer"},onClick:u,ref:b,children:l.jsx("article",{id:e.id,className:v("neko-popup",a&&"neko-popup--active",E&&`neko-popup--animation_${E}`,e.className),role:"dialog","aria-modal":!0,onClick:t=>t.stopPropagation(),children:e.children})}),d)};c.PopupButton=N,c.PopupLayer=O,c.PopupWindow=w,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.umd.js","sources":["../src/_package/components/ErrorComponents.ts","../node_modules/clsx/dist/clsx.mjs","../src/_package/Interfaces.ts","../src/_package/PopupLayer.tsx","../src/_package/PopupButton.tsx","../src/_package/hooks/useMixedState.ts","../src/_package/PopupWindow.tsx"],"sourcesContent":["class EFKW extends Error {\n  constructor(msg: string) {\n    super(msg);\n\n    this.name = 'error at [neko-popup]';\n  }\n}\n\nexport default EFKW;","function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import React, { createContext, RefObject } from 'react';\nimport clsx from 'clsx';\n\n\n\n\nexport type PopupWindowDisabledType = 'onEscape' | 'onLayer';\nexport type StateSetter<S = any> = React.Dispatch<React.SetStateAction<S>>\nexport type RegisterNodeArgs = Pick<IPopupNode, 'id' | 'isOpen' | 'disabled'>\n\n/** Get value type from nested object path */\nexport type ValueFromPath<T, P> =\n  P extends `${infer K}.${infer R}`\n  ? K extends keyof T\n  ? R extends keyof T[K]\n  ? T[K][R]\n  : never\n  : never\n  : P extends keyof T\n  ? T[P]\n  : never;\n\n\n\nexport interface IPopupNode {\n  id: string\n  isOpen: boolean\n  zIndex: number\n  disabled: PopupWindowDisabledType[]\n}\n\nexport interface IPopupContext {\n  nodes: IPopupNode[]\n  containerRef: RefObject<HTMLDivElement | null>\n\n  invokePopup(id: string, forceState?: boolean): void\n  registerNode(args: RegisterNodeArgs): void\n  updateNodeProperty<K extends keyof IPopupNode>(id: string, key: K, value: ValueFromPath<IPopupNode, K>): void\n}\n\n\n\nexport const PopupContext = createContext<IPopupContext>({} as IPopupContext);\nexport const cn = clsx;","'use client';\n\nimport { FC, ReactNode, useEffect, useRef, useState } from 'react';\n\nimport EFKW from './components/ErrorComponents';\nimport { IPopupNode, PopupContext, RegisterNodeArgs, ValueFromPath } from './Interfaces';\n\n\n\ninterface IPopupLayerProps {\n  children?: ReactNode | ReactNode[]\n\n  /** @default 10000 */\n  baseZIndex?: number\n\n  /**\n   * Disable body scroll when there is at least one open popup\n   * \n   * @default true\n   */\n  disableBodyScrollOnActivePopup?: boolean\n}\n\n\n\nconst PopupLayer: FC<IPopupLayerProps> = (props) => {\n  const [nodes, setNodes] = useState<IPopupNode[]>([]);\n  const [isScrollDisabled, setIsScrollDisabled] = useState(false);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const baseZIndex = props.baseZIndex ?? 10000;\n  const disableBodyScrollOnActivePopup = props.disableBodyScrollOnActivePopup ?? true;\n\n\n\n  // Handle close closest to user popup on escape & scroll\n  useEffect(() => {\n    // === Handle close closest popup on escape\n    const controller = new AbortController();\n\n    window.addEventListener('keydown', e => {\n      const key = e.key;\n\n      if (key === 'Escape') {\n        const maxZIndex = Math.max(...nodes.filter(el => el.isOpen).map(el => el.zIndex));\n        const node = nodes.find(el => el.zIndex === maxZIndex);\n        if (!node || node.disabled.includes('onEscape')) return;\n\n        // eslint-disable-next-line\n        invokePopup(node.id, false);\n      }\n    }, { signal: controller.signal });\n\n\n\n    // === Disable body scroll on active popup\n    if (disableBodyScrollOnActivePopup) {\n      let anyOpenNode = false;\n      nodes.forEach(el => el.isOpen ? anyOpenNode = true : null);\n\n      setIsScrollDisabled(anyOpenNode);\n    }\n\n\n\n    return () => {\n      controller.abort();\n    };\n  }, [nodes]);\n\n  // Handle body scroll\n  useEffect(() => {\n    if (isScrollDisabled) document.body.classList.add('neko-popup--noScroll');\n    else document.body.classList.remove('neko-popup--noScroll');\n  }, [isScrollDisabled]);\n\n\n\n  /** Toggle popup state */\n  function invokePopup(entityOrId: string | IPopupNode, forceState?: boolean) {\n    const node = typeof entityOrId === 'string' ? nodes.find(el => el.id === entityOrId) : entityOrId;\n    if (!node) throw new EFKW(typeof entityOrId === 'string' ? `Cannot find popup node with id #${entityOrId}` : `Entity is not assigned to the node`);\n\n    const newState = forceState ?? !node.isOpen;\n\n    // === Update node\n    node.isOpen = newState;\n    node.zIndex = newState ? Math.max(...nodes.map(el => el.zIndex), 0) + 1 : -1; // Make new popup invocation closer to user using larger z-index\n\n    _updateNodeInNodes(node);\n  }\n\n  /** Update node property */\n  function updateNodeProperty<K extends keyof IPopupNode>(id: string, key: K, value: ValueFromPath<IPopupNode, K>) {\n    const node = nodes.find(el => el.id === id);\n    if (!node) return;\n\n    node[key] = value;\n\n    _updateNodeInNodes(node);\n  }\n\n  /** Update node in nodes array */\n  function _updateNodeInNodes(node: IPopupNode) {\n    setNodes(prev => [...prev.filter(el => el.id !== node.id), node]);\n  }\n\n  /** Add new popup window to state */\n  const registerNode = ({ id, isOpen, disabled }: RegisterNodeArgs) => invokePopup({ id, isOpen: false, disabled, zIndex: -1 }, isOpen);\n\n\n\n  return <PopupContext.Provider value={{\n    nodes,\n    containerRef,\n    invokePopup,\n    registerNode,\n    updateNodeProperty\n  }}>\n    {props.children}\n\n    <section style={{ zIndex: baseZIndex }} ref={containerRef} />\n  </PopupContext.Provider>;\n};\n\nexport default PopupLayer;","'use client';\n\nimport { FC, JSX, ReactNode, useContext, useEffect, useState } from 'react';\n\nimport { cn, PopupContext } from './Interfaces';\n\n\n\nexport interface IPopupButtonProps {\n  popupId: string\n\n  /** \n   * Element tag\n   * \n   * @default \"button\"\n   */\n  as?: 'button' | 'div'\n\n  disabled?: boolean\n  children?: ReactNode | ReactNode[]\n  className?: string\n  id?: string\n\n  onClick?(e: React.MouseEvent): void\n}\n\n\n\nconst PopupButton: FC<IPopupButtonProps> = (props) => {\n  const ctx = useContext(PopupContext);\n\n  const [isActive, setIsActive] = useState(false);\n\n  const Tag: keyof JSX.IntrinsicElements = props.as ?? 'button';\n\n\n\n  // Handle isActive on context change\n  useEffect(() => {\n    const node = ctx.nodes.find(el => el.id === props.popupId);\n    if (!node) return;\n\n    setIsActive(node.isOpen);\n  }, [ctx]);\n\n\n\n  function invokePopup(e: React.MouseEvent) {\n    ctx.invokePopup(props.popupId);\n\n    if (props.onClick) props.onClick(e);\n  }\n\n\n\n  return <Tag\n    tabIndex={0}\n    disabled={props.disabled}\n    aria-disabled={props.disabled}\n    aria-haspopup={'dialog'}\n    id={props.id}\n    className={cn(`neko-popup-button`, isActive && 'neko-popup-button--active', props.className)}\n    onClick={invokePopup}\n  >\n    {props.children}\n  </Tag>;\n};\n\nexport default PopupButton;","'use client';\n\nimport { useEffect, useMemo, useState } from 'react';\n\n\n\n\ntype StateSetter<S> = React.Dispatch<React.SetStateAction<S>>;\ntype InitialState<S> = S | (() => S);\n\nexport default function useMixedState<S = undefined>(): [S | undefined, StateSetter<S | undefined>];\nexport default function useMixedState<S>(initialState: InitialState<S>): [S, StateSetter<S>];\nexport default function useMixedState<S>(state: S, setter?: StateSetter<S>): [S, StateSetter<S>];\n\n\n\n/** \n * Use mixed state hook\n * \n * @param initialStateOrValue Initial state, can be undefined, value or function. If externalSetter not specified, will return default state\n * @param externalSetter External state setter. If specified will return external state\n */\nexport default function useMixedState<S>(initialStateOrValue?: InitialState<S>, externalSetter?: StateSetter<S>) {\n  const isControlled = useMemo(() => arguments.length === 2 && externalSetter !== undefined, []);\n\n  const [state, setter] = useState<S | undefined>(initialStateOrValue);\n\n\n\n  // Propagate state update on external state update even if external setter is not provided\n  useEffect(() => {\n    if (!isControlled) {\n       \n      setter(initialStateOrValue);\n    }\n  }, [initialStateOrValue]);\n\n\n\n  if (isControlled) {\n    return [\n      initialStateOrValue as S,\n      externalSetter as StateSetter<S>\n    ];\n  }\n\n  return [state, setter];\n}","'use client';\n\nimport { FC, ReactNode, useContext, useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport useMixedState from './hooks/useMixedState';\nimport { cn, PopupContext, PopupWindowDisabledType, StateSetter } from './Interfaces';\n\n\n\ntype PopupWindowAnimationType = 'fade' | 'scale' | null\n\n\n\ninterface IPopupWindowProps {\n  id: string\n  children: ReactNode | ReactNode[]\n\n  isOpen?: boolean\n  setIsOpen?: StateSetter<boolean>\n\n  className?: string\n  layerClassName?: string\n  disabled?: PopupWindowDisabledType[] | boolean\n\n  /** \n   * Popup dialog animation type\n   * \n   * @default \"fade\"\n   */\n  animation?: 'fade' | 'scale' | null\n\n  /**\n   * Popup animation duration in msec\n   * \n   * @default 200\n   */\n  animationDuraionMs?: number\n\n  /** \n   * Fire callback when popup invoked to open\n   */\n  onBeforeEnter?(): void\n\n  /** \n   * Fire callback when popup open animation fullfilled. \n   * \n   * @see animationDuration\n   */\n  onAfterEnter?(): void\n\n  /** \n   * Fire callback when popup invoked to close\n   */\n  onBeforeExit?(): void\n\n  /** \n   * Fire callback when popup close animation fullfilled. \n   * \n   * @see animationDuration\n   */\n  onAfterExit?(): void\n}\n\n\n\nconst PopupWindow: FC<IPopupWindowProps> = (props) => {\n  const ctx = useContext(PopupContext);\n\n  const [container, setContainer] = useState<HTMLDivElement | null>(null);\n  const [isOpen, setIsOpen] = useMixedState(props.isOpen ?? false, props.setIsOpen);\n  const [zIndex, setZIndex] = useState(-1);\n  const [disabled, setDisabled] = useState<PopupWindowDisabledType[]>([]);\n\n  const layerRef = useRef<HTMLDivElement>(null);\n\n  const animation: PopupWindowAnimationType = props.animation !== undefined ? props.animation : 'fade';\n  const animationDuration = props.animationDuraionMs ?? 200;\n\n\n\n  // Handle disabled\n  useLayoutEffect(() => {\n    let disabled: PopupWindowDisabledType[] = [];\n\n    if (typeof props.disabled === 'boolean') disabled = props.disabled ? ['onEscape', 'onLayer'] : [];\n    else disabled = props.disabled ?? [];\n\n    ctx.updateNodeProperty(props.id, 'disabled', disabled);\n  }, [props.disabled]);\n\n\n\n  // Mount & register node\n  useEffect(() => {\n    const container = ctx.containerRef.current;\n    if (!container) return;\n\n    setContainer(container);\n\n    ctx.registerNode({\n      id: props.id,\n      isOpen: Boolean(props.isOpen),\n      disabled\n    });\n  }, []);\n\n  // Handle node sync with context\n  useEffect(() => {\n    const node = ctx.nodes.find(el => el.id === props.id);\n    if (!node) return;\n\n    setIsOpen(node.isOpen);\n    setZIndex(node.zIndex);\n    setDisabled(node.disabled);\n  }, [ctx.nodes]);\n\n  // Handle layer z-index change\n  useEffect(() => {\n    const layer = layerRef.current;\n    if (!layer) return;\n\n    if (isOpen) layer.style.zIndex = `${zIndex}`;\n    else setTimeout(() => {\n      layer.style.zIndex = `${-1}`;\n    }, animationDuration);\n  }, [isOpen]);\n\n  // Handle events (onBeforeEnter, etc)\n  useEffect(() => {\n    if (isOpen) {\n      if (props.onBeforeEnter) props.onBeforeEnter();\n\n      setTimeout(() => {\n        if (props.onAfterEnter) props.onAfterEnter();\n      }, animationDuration);\n    } else {\n      if (props.onBeforeExit) props.onBeforeExit();\n\n      setTimeout(() => {\n        if (props.onAfterExit) props.onAfterExit();\n      }, animationDuration);\n    }\n  }, [isOpen]);\n\n\n\n  function layerOnClick() {\n    if (disabled.includes('onLayer')) return;\n\n    ctx.invokePopup(props.id, false);\n  }\n\n\n\n  return container && createPortal(<section\n    className={cn(`neko-popup-backdrop`, isOpen && 'neko-popup-backdrop--active', props.layerClassName)}\n    aria-hidden={!isOpen}\n    style={{ transition: `${animationDuration}ms ease-in-out`, cursor: disabled.includes('onLayer') ? 'default' : 'pointer' }}\n    onClick={layerOnClick}\n    ref={layerRef}\n  >\n    <article\n      id={props.id}\n      className={cn(`neko-popup`, isOpen && 'neko-popup--active', animation && `neko-popup--animation_${animation}`, props.className)}\n      role=\"dialog\"\n      aria-modal\n      onClick={e => e.stopPropagation()}\n    >\n      {props.children}\n    </article>\n  </section>, container);\n};\n\nexport default PopupWindow;"],"names":["EFKW","msg","r","t","f","n","o","clsx","PopupContext","createContext","cn","PopupLayer","props","nodes","setNodes","useState","isScrollDisabled","setIsScrollDisabled","containerRef","useRef","baseZIndex","disableBodyScrollOnActivePopup","useEffect","controller","e","maxZIndex","el","node","invokePopup","anyOpenNode","entityOrId","forceState","newState","_updateNodeInNodes","updateNodeProperty","id","key","value","prev","registerNode","isOpen","disabled","jsxs","jsx","PopupButton","ctx","useContext","isActive","setIsActive","Tag","useMixedState","initialStateOrValue","externalSetter","isControlled","useMemo","state","setter","PopupWindow","container","setContainer","setIsOpen","zIndex","setZIndex","setDisabled","layerRef","animation","animationDuration","useLayoutEffect","layer","layerOnClick","createPortal"],"mappings":"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","x_google_ignoreList":[1]}
+{"version":3,"file":"index.umd.js","sources":["../node_modules/clsx/dist/clsx.mjs","../src/_package/Interfaces.ts","../src/_package/PopupButton.tsx","../src/_package/components/ErrorComponents.ts","../src/_package/PopupLayer.tsx","../src/_package/hooks/useMixedState.ts","../src/_package/PopupWindow.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import React, { createContext, RefObject } from 'react';\nimport clsx from 'clsx';\n\n\n\n\nexport type PopupWindowDisabledType = 'onEscape' | 'onLayer';\nexport type StateSetter<S = any> = React.Dispatch<React.SetStateAction<S>>\nexport type RegisterNodeArgs = Pick<IPopupNode, 'id' | 'isOpen' | 'disabled'>\n\n/** Get value type from nested object path */\nexport type ValueFromPath<T, P> =\n  P extends `${infer K}.${infer R}`\n  ? K extends keyof T\n  ? R extends keyof T[K]\n  ? T[K][R]\n  : never\n  : never\n  : P extends keyof T\n  ? T[P]\n  : never;\n\n\n\nexport interface IPopupNode {\n  id: string\n  isOpen: boolean\n  zIndex: number\n  disabled: PopupWindowDisabledType[]\n}\n\nexport interface IPopupContext {\n  nodes: IPopupNode[]\n  containerRef: RefObject<HTMLDivElement | null>\n\n  invokePopup(id: string, forceState?: boolean): void\n  registerNode(args: RegisterNodeArgs): void\n  updateNodeProperty<K extends keyof IPopupNode>(id: string, key: K, value: ValueFromPath<IPopupNode, K>): void\n}\n\n\n\nexport const PopupContext = createContext<IPopupContext>({} as IPopupContext);\nexport const cn = clsx;","'use client';\n\nimport { FC, JSX, ReactNode, useContext, useEffect, useState } from 'react';\n\nimport { cn, PopupContext } from './Interfaces';\n\n\n\nexport interface IPopupButtonProps {\n  popupId: string\n\n  /** \n   * Element tag\n   * \n   * @default \"button\"\n   */\n  as?: 'button' | 'div'\n\n  disabled?: boolean\n  children?: ReactNode | ReactNode[]\n  className?: string\n  id?: string\n\n  onClick?(e: React.MouseEvent): void\n}\n\n\n\nexport const PopupButton: FC<IPopupButtonProps> = (props) => {\n  const ctx = useContext(PopupContext);\n\n  const [isActive, setIsActive] = useState(false);\n\n  const Tag: keyof JSX.IntrinsicElements = props.as ?? 'button';\n\n\n\n  // Handle isActive on context change\n  useEffect(() => {\n    const node = ctx.nodes.find(el => el.id === props.popupId);\n    if (!node) return;\n\n    setIsActive(node.isOpen);\n  }, [ctx]);\n\n\n\n  function invokePopup(e: React.MouseEvent) {\n    ctx.invokePopup(props.popupId);\n\n    if (props.onClick) props.onClick(e);\n  }\n\n\n\n  return <Tag\n    tabIndex={0}\n    disabled={props.disabled}\n    aria-disabled={props.disabled}\n    aria-haspopup={'dialog'}\n    id={props.id}\n    className={cn(`neko-popup-button`, isActive && 'neko-popup-button--active', props.className)}\n    onClick={invokePopup}\n  >\n    {props.children}\n  </Tag>;\n};","class EFKW extends Error {\n  constructor(msg: string) {\n    super(msg);\n\n    this.name = 'error at [neko-popup]';\n  }\n}\n\nexport default EFKW;","'use client';\n\nimport { FC, ReactNode, useEffect, useRef, useState } from 'react';\n\nimport EFKW from './components/ErrorComponents';\nimport { IPopupNode, PopupContext, RegisterNodeArgs, ValueFromPath } from './Interfaces';\n\n\n\nexport interface IPopupLayerProps {\n  children?: ReactNode | ReactNode[]\n\n  /** @default 10000 */\n  baseZIndex?: number\n\n  /**\n   * Disable body scroll when there is at least one open popup\n   * \n   * @default true\n   */\n  disableBodyScrollOnActivePopup?: boolean\n}\n\n\n\nexport const PopupLayer: FC<IPopupLayerProps> = (props) => {\n  const [nodes, setNodes] = useState<IPopupNode[]>([]);\n  const [isScrollDisabled, setIsScrollDisabled] = useState(false);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const baseZIndex = props.baseZIndex ?? 10000;\n  const disableBodyScrollOnActivePopup = props.disableBodyScrollOnActivePopup ?? true;\n\n\n\n  // Handle close closest to user popup on escape & scroll\n  useEffect(() => {\n    // === Handle close closest popup on escape\n    const controller = new AbortController();\n\n    window.addEventListener('keydown', e => {\n      const key = e.key;\n\n      if (key === 'Escape') {\n        const maxZIndex = Math.max(...nodes.filter(el => el.isOpen).map(el => el.zIndex));\n        const node = nodes.find(el => el.zIndex === maxZIndex);\n        if (!node || node.disabled.includes('onEscape')) return;\n\n        // eslint-disable-next-line\n        invokePopup(node.id, false);\n      }\n    }, { signal: controller.signal });\n\n\n\n    // === Disable body scroll on active popup\n    if (disableBodyScrollOnActivePopup) {\n      let anyOpenNode = false;\n      nodes.forEach(el => el.isOpen ? anyOpenNode = true : null);\n\n      setIsScrollDisabled(anyOpenNode);\n    }\n\n\n\n    return () => {\n      controller.abort();\n    };\n  }, [nodes]);\n\n  // Handle body scroll\n  useEffect(() => {\n    if (isScrollDisabled) document.body.classList.add('neko-popup--noScroll');\n    else document.body.classList.remove('neko-popup--noScroll');\n  }, [isScrollDisabled]);\n\n\n\n  /** Toggle popup state */\n  function invokePopup(entityOrId: string | IPopupNode, forceState?: boolean) {\n    const node = typeof entityOrId === 'string' ? nodes.find(el => el.id === entityOrId) : entityOrId;\n    if (!node) throw new EFKW(typeof entityOrId === 'string' ? `Cannot find popup node with id #${entityOrId}` : `Entity is not assigned to the node`);\n\n    const newState = forceState ?? !node.isOpen;\n\n    // === Update node\n    node.isOpen = newState;\n    node.zIndex = newState ? Math.max(...nodes.map(el => el.zIndex), 0) + 1 : -1; // Make new popup invocation closer to user using larger z-index\n\n    _updateNodeInNodes(node);\n  }\n\n  /** Update node property */\n  function updateNodeProperty<K extends keyof IPopupNode>(id: string, key: K, value: ValueFromPath<IPopupNode, K>) {\n    const node = nodes.find(el => el.id === id);\n    if (!node) return;\n\n    node[key] = value;\n\n    _updateNodeInNodes(node);\n  }\n\n  /** Update node in nodes array */\n  function _updateNodeInNodes(node: IPopupNode) {\n    setNodes(prev => [...prev.filter(el => el.id !== node.id), node]);\n  }\n\n  /** Add new popup window to state */\n  const registerNode = ({ id, isOpen, disabled }: RegisterNodeArgs) => invokePopup({ id, isOpen: false, disabled, zIndex: -1 }, isOpen);\n\n\n\n  return <PopupContext.Provider value={{\n    nodes,\n    containerRef,\n    invokePopup,\n    registerNode,\n    updateNodeProperty\n  }}>\n    {props.children}\n\n    <section style={{ zIndex: baseZIndex }} ref={containerRef} />\n  </PopupContext.Provider>;\n};","'use client';\n\nimport { useEffect, useMemo, useState } from 'react';\n\n\n\n\ntype StateSetter<S> = React.Dispatch<React.SetStateAction<S>>;\ntype InitialState<S> = S | (() => S);\n\nexport default function useMixedState<S = undefined>(): [S | undefined, StateSetter<S | undefined>];\nexport default function useMixedState<S>(initialState: InitialState<S>): [S, StateSetter<S>];\nexport default function useMixedState<S>(state: S, setter?: StateSetter<S>): [S, StateSetter<S>];\n\n\n\n/** \n * Use mixed state hook\n * \n * @param initialStateOrValue Initial state, can be undefined, value or function. If externalSetter not specified, will return default state\n * @param externalSetter External state setter. If specified will return external state\n */\nexport default function useMixedState<S>(initialStateOrValue?: InitialState<S>, externalSetter?: StateSetter<S>) {\n  const isControlled = useMemo(() => arguments.length === 2 && externalSetter !== undefined, []);\n\n  const [state, setter] = useState<S | undefined>(initialStateOrValue);\n\n\n\n  // Propagate state update on external state update even if external setter is not provided\n  useEffect(() => {\n    if (!isControlled) {\n       \n      setter(initialStateOrValue);\n    }\n  }, [initialStateOrValue]);\n\n\n\n  if (isControlled) {\n    return [\n      initialStateOrValue as S,\n      externalSetter as StateSetter<S>\n    ];\n  }\n\n  return [state, setter];\n}","'use client';\n\nimport { FC, ReactNode, useContext, useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport useMixedState from './hooks/useMixedState';\nimport { cn, PopupContext, PopupWindowDisabledType, StateSetter } from './Interfaces';\n\n\n\nexport type PopupWindowAnimationType = 'fade' | 'scale' | null\n\n\n\nexport interface IPopupWindowProps {\n  id: string\n  children: ReactNode | ReactNode[]\n\n  isOpen?: boolean\n  setIsOpen?: StateSetter<boolean>\n\n  className?: string\n  layerClassName?: string\n  disabled?: PopupWindowDisabledType[] | boolean\n\n  /** \n   * Popup dialog animation type\n   * \n   * @default \"fade\"\n   */\n  animation?: 'fade' | 'scale' | null\n\n  /**\n   * Popup animation duration in msec\n   * \n   * @default 200\n   */\n  animationDuraionMs?: number\n\n  /** \n   * Fire callback when popup invoked to open\n   */\n  onBeforeEnter?(): void\n\n  /** \n   * Fire callback when popup open animation fullfilled. \n   * \n   * @see animationDuration\n   */\n  onAfterEnter?(): void\n\n  /** \n   * Fire callback when popup invoked to close\n   */\n  onBeforeExit?(): void\n\n  /** \n   * Fire callback when popup close animation fullfilled. \n   * \n   * @see animationDuration\n   */\n  onAfterExit?(): void\n}\n\n\n\nexport const PopupWindow: FC<IPopupWindowProps> = (props) => {\n  const ctx = useContext(PopupContext);\n\n  const [container, setContainer] = useState<HTMLDivElement | null>(null);\n  const [isOpen, setIsOpen] = useMixedState(props.isOpen ?? false, props.setIsOpen);\n  const [zIndex, setZIndex] = useState(-1);\n  const [disabled, setDisabled] = useState<PopupWindowDisabledType[]>([]);\n\n  const layerRef = useRef<HTMLDivElement>(null);\n\n  const animation: PopupWindowAnimationType = props.animation !== undefined ? props.animation : 'fade';\n  const animationDuration = props.animationDuraionMs ?? 200;\n\n\n\n  // Handle disabled\n  useLayoutEffect(() => {\n    let disabled: PopupWindowDisabledType[] = [];\n\n    if (typeof props.disabled === 'boolean') disabled = props.disabled ? ['onEscape', 'onLayer'] : [];\n    else disabled = props.disabled ?? [];\n\n    ctx.updateNodeProperty(props.id, 'disabled', disabled);\n  }, [props.disabled]);\n\n\n\n  // Mount & register node\n  useEffect(() => {\n    const container = ctx.containerRef.current;\n    if (!container) return;\n\n    setContainer(container);\n\n    ctx.registerNode({\n      id: props.id,\n      isOpen: Boolean(props.isOpen),\n      disabled\n    });\n  }, []);\n\n  // Handle node sync with context\n  useEffect(() => {\n    const node = ctx.nodes.find(el => el.id === props.id);\n    if (!node) return;\n\n    setIsOpen(node.isOpen);\n    setZIndex(node.zIndex);\n    setDisabled(node.disabled);\n  }, [ctx.nodes]);\n\n  // Handle layer z-index change\n  useEffect(() => {\n    const layer = layerRef.current;\n    if (!layer) return;\n\n    if (isOpen) layer.style.zIndex = `${zIndex}`;\n    else setTimeout(() => {\n      layer.style.zIndex = `${-1}`;\n    }, animationDuration);\n  }, [isOpen]);\n\n  // Handle events (onBeforeEnter, etc)\n  useEffect(() => {\n    if (isOpen) {\n      if (props.onBeforeEnter) props.onBeforeEnter();\n\n      setTimeout(() => {\n        if (props.onAfterEnter) props.onAfterEnter();\n      }, animationDuration);\n    } else {\n      if (props.onBeforeExit) props.onBeforeExit();\n\n      setTimeout(() => {\n        if (props.onAfterExit) props.onAfterExit();\n      }, animationDuration);\n    }\n  }, [isOpen]);\n\n\n\n  function layerOnClick() {\n    if (disabled.includes('onLayer')) return;\n\n    ctx.invokePopup(props.id, false);\n  }\n\n\n\n  return container && createPortal(<section\n    className={cn(`neko-popup-backdrop`, isOpen && 'neko-popup-backdrop--active', props.layerClassName)}\n    aria-hidden={!isOpen}\n    style={{ transition: `${animationDuration}ms ease-in-out`, cursor: disabled.includes('onLayer') ? 'default' : 'pointer' }}\n    onClick={layerOnClick}\n    ref={layerRef}\n  >\n    <article\n      id={props.id}\n      className={cn(`neko-popup`, isOpen && 'neko-popup--active', animation && `neko-popup--animation_${animation}`, props.className)}\n      role=\"dialog\"\n      aria-modal\n      onClick={e => e.stopPropagation()}\n    >\n      {props.children}\n    </article>\n  </section>, container);\n};"],"names":["r","t","f","n","o","clsx","PopupContext","createContext","cn","PopupButton","props","ctx","useContext","isActive","setIsActive","useState","Tag","useEffect","node","el","invokePopup","e","jsx","EFKW","msg","PopupLayer","nodes","setNodes","isScrollDisabled","setIsScrollDisabled","containerRef","useRef","baseZIndex","disableBodyScrollOnActivePopup","controller","maxZIndex","anyOpenNode","entityOrId","forceState","newState","_updateNodeInNodes","updateNodeProperty","id","key","value","prev","registerNode","isOpen","disabled","jsxs","useMixedState","initialStateOrValue","externalSetter","isControlled","useMemo","state","setter","PopupWindow","container","setContainer","setIsOpen","zIndex","setZIndex","setDisabled","layerRef","animation","animationDuration","useLayoutEffect","layer","layerOnClick","createPortal"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/styles.css

@@ -0,0 +1 @@
+.neko-popup{cursor:auto;max-height:100%;overflow-y:auto}.neko-popup--animation_fade{transition:inherit}.neko-popup--animation_scale{transition:inherit;scale:.8}.neko-popup--animation_scale.neko-popup--active{scale:1}.neko-popup-backdrop{position:fixed;inset:0;width:100%;height:100%;max-height:100%;background:#0003;-webkit-tap-highlight-color:transparent;contain:paint;opacity:0;visibility:hidden;touch-action:none;pointer-events:none;display:flex;align-items:center;justify-content:center}.neko-popup-backdrop--active{opacity:1;visibility:visible;touch-action:auto;pointer-events:auto}.neko-popup-button{cursor:pointer}.neko-popup--noScroll{overflow:hidden;scrollbar-gutter:stable}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neko-popup",
-  "version": "3.0.2",
+  "version": "3.0.3",
   "description": "Simple and cool react popup package 🚀",
   "keywords": [
     "popup",