@edifice.io/react 2.0.0-develop-rc.7 → 2.0.0-develop-rc.10

package/dist/editor.js

@@ -1,58 +1,59 @@
-import { EditorContent, useEditor } from "@tiptap/react";
-import { default as default2 } from "./modules/editor/components/Editor/Editor.js";
-import { default as default3 } from "./modules/editor/components/BubbleMenuEditImage/BubbleMenuEditImage.js";
-import { default as default4 } from "./modules/editor/components/NodeView/AudioNodeView.js";
-import { default as default5 } from "./modules/editor/components/NodeView/AttachmentNodeView.js";
-import { default as default6 } from "./modules/editor/components/NodeView/ImageNodeView.js";
-import { default as default7 } from "./modules/editor/components/NodeView/LinkerNodeView.js";
-import { default as default8 } from "./modules/editor/components/NodeView/VideoNodeView.js";
-import { default as default9 } from "./modules/editor/components/Toolbar/TableToolbar.js";
-import { default as default10 } from "./modules/editor/components/Toolbar/LinkToolbar.js";
-import { EditorToolbar } from "./modules/editor/components/EditorToolbar/EditorToolbar.js";
-import { AttachmentRenderer } from "./modules/editor/components/Renderer/AttachmentRenderer.js";
-import { AudioRenderer } from "./modules/editor/components/Renderer/AudioRenderer.js";
-import { LinkerRenderer } from "./modules/editor/components/Renderer/LinkerRenderer.js";
-import { MediaRenderer } from "./modules/editor/components/Renderer/MediaRenderer.js";
-import { useActionOptions } from "./modules/editor/hooks/useActionOptions.js";
-import { useCommentEditor } from "./modules/editor/hooks/useCommentEditor.js";
-import { EditorContext, useEditorContext } from "./modules/editor/hooks/useEditorContext.js";
-import { useImageModal } from "./modules/editor/hooks/useImageModal.js";
-import { useImageSelection } from "./modules/editor/hooks/useImageSelection.js";
-import { useLinkToolbar } from "./modules/editor/hooks/useLinkToolbar.js";
-import { useMathsModal } from "./modules/editor/hooks/useMathsModal.js";
-import { useMediaLibraryEditor } from "./modules/editor/hooks/useMediaLibraryEditor.js";
-import { useResizeMedia } from "./modules/editor/hooks/useResizeMedia.js";
-import { useSpeechRecognition } from "./modules/editor/hooks/useSpeechRecognition.js";
-import { useSpeechSynthetisis } from "./modules/editor/hooks/useSpeechSynthetisis.js";
-import { useTipTapEditor } from "./modules/editor/hooks/useTipTapEditor.js";
+import { EditorContent as r, useEditor as t } from "@tiptap/react";
+import { default as d } from "./modules/editor/components/Editor/Editor.js";
+import { default as i } from "./modules/editor/components/BubbleMenuEditImage/BubbleMenuEditImage.js";
+import { default as p } from "./modules/editor/components/NodeView/AudioNodeView.js";
+import { default as s } from "./modules/editor/components/NodeView/AttachmentNodeView.js";
+import { default as n } from "./modules/editor/components/NodeView/ImageNodeView.js";
+import { default as E } from "./modules/editor/components/NodeView/LinkerNodeView.js";
+import { default as c } from "./modules/editor/components/NodeView/VideoNodeView.js";
+import { default as T } from "./modules/editor/components/Toolbar/TableToolbar.js";
+import { default as R } from "./modules/editor/components/Toolbar/LinkToolbar.js";
+import { EditorToolbar as g } from "./modules/editor/components/EditorToolbar/EditorToolbar.js";
+import { AttachmentRenderer as A } from "./modules/editor/components/Renderer/AttachmentRenderer.js";
+import { AudioRenderer as N } from "./modules/editor/components/Renderer/AudioRenderer.js";
+import { LinkerRenderer as C } from "./modules/editor/components/Renderer/LinkerRenderer.js";
+import { MediaRenderer as S } from "./modules/editor/components/Renderer/MediaRenderer.js";
+import { useActionOptions as z } from "./modules/editor/hooks/useActionOptions.js";
+import { useCommentEditor as O } from "./modules/editor/hooks/useCommentEditor.js";
+import { EditorContext as q, useEditorContext as v } from "./modules/editor/hooks/useEditorContext.js";
+import { useImageModal as F } from "./modules/editor/hooks/useImageModal.js";
+import { useImageSelection as H } from "./modules/editor/hooks/useImageSelection.js";
+import { useLinkToolbar as K } from "./modules/editor/hooks/useLinkToolbar.js";
+import { useMathsModal as Q } from "./modules/editor/hooks/useMathsModal.js";
+import { useMediaLibraryEditor as W } from "./modules/editor/hooks/useMediaLibraryEditor.js";
+import { useResizeMedia as Y } from "./modules/editor/hooks/useResizeMedia.js";
+import { useSpeechRecognition as _ } from "./modules/editor/hooks/useSpeechRecognition.js";
+import { useSpeechSynthetisis as ee } from "./modules/editor/hooks/useSpeechSynthetisis.js";
+import { useTipTapEditor as re } from "./modules/editor/hooks/useTipTapEditor.js";
 export {
-  default5 as AttachmentNodeView,
-  AttachmentRenderer,
-  default4 as AudioNodeView,
-  AudioRenderer,
-  default3 as BubbleMenuEditImage,
-  default2 as Editor,
-  EditorContent,
-  EditorContext,
-  EditorToolbar,
-  default6 as ImageNodeView,
-  default10 as LinkToolbar,
-  default7 as LinkerNodeView,
-  LinkerRenderer,
-  MediaRenderer,
-  default9 as TableToolbar,
-  default8 as VideoNodeView,
-  useActionOptions,
-  useCommentEditor,
-  useEditor,
-  useEditorContext,
-  useImageModal,
-  useImageSelection,
-  useLinkToolbar,
-  useMathsModal,
-  useMediaLibraryEditor,
-  useResizeMedia,
-  useSpeechRecognition,
-  useSpeechSynthetisis,
-  useTipTapEditor
+  s as AttachmentNodeView,
+  A as AttachmentRenderer,
+  p as AudioNodeView,
+  N as AudioRenderer,
+  i as BubbleMenuEditImage,
+  d as Editor,
+  r as EditorContent,
+  q as EditorContext,
+  g as EditorToolbar,
+  n as ImageNodeView,
+  R as LinkToolbar,
+  E as LinkerNodeView,
+  C as LinkerRenderer,
+  S as MediaRenderer,
+  T as TableToolbar,
+  c as VideoNodeView,
+  z as useActionOptions,
+  O as useCommentEditor,
+  t as useEditor,
+  v as useEditorContext,
+  F as useImageModal,
+  H as useImageSelection,
+  K as useLinkToolbar,
+  Q as useMathsModal,
+  W as useMediaLibraryEditor,
+  Y as useResizeMedia,
+  _ as useSpeechRecognition,
+  ee as useSpeechSynthetisis,
+  re as useTipTapEditor
 };
+//# sourceMappingURL=editor.js.map

package/dist/editor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/hooks/useBrowserInfo/useBrowserInfo.js

@@ -1,16 +1,17 @@
-import UAParser from "ua-parser-js";
-function useBrowserInfo(userAgent) {
-  var _a, _b, _c;
-  const uaParser = new UAParser(userAgent), os = uaParser.getOS(), device = uaParser.getDevice(), browser = uaParser.getBrowser(), isIphone = ((_a = device.model) == null ? void 0 : _a.indexOf("iPhone")) !== -1, isIpod = ((_b = device.model) == null ? void 0 : _b.indexOf("iPod")) !== -1, isIpad = ((_c = device.model) == null ? void 0 : _c.indexOf("iPad")) !== -1;
+import m from "ua-parser-js";
+function u(t) {
+  var s, n, r;
+  const o = new m(t), i = o.getOS(), e = o.getDevice(), d = o.getBrowser(), c = ((s = e.model) == null ? void 0 : s.indexOf("iPhone")) !== -1, a = ((n = e.model) == null ? void 0 : n.indexOf("iPod")) !== -1, f = ((r = e.model) == null ? void 0 : r.indexOf("iPad")) !== -1;
   return {
-    os,
-    device,
-    browser,
-    isIphone,
-    isIpod,
-    isIpad
+    os: i,
+    device: e,
+    browser: d,
+    isIphone: c,
+    isIpod: a,
+    isIpad: f
   };
 }
 export {
-  useBrowserInfo as default
+  u as default
 };
+//# sourceMappingURL=useBrowserInfo.js.map

package/dist/hooks/useBrowserInfo/useBrowserInfo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBrowserInfo.js","sources":["../../../src/hooks/useBrowserInfo/useBrowserInfo.ts"],"sourcesContent":["import UAParser from 'ua-parser-js';\n\nexport default function useBrowserInfo(userAgent?: string) {\n  const uaParser = new UAParser(userAgent);\n\n  const os: UAParser.IOS = uaParser.getOS();\n  const device: UAParser.IDevice = uaParser.getDevice();\n  const browser: UAParser.IBrowser = uaParser.getBrowser();\n\n  const isIphone = device.model?.indexOf('iPhone') !== -1;\n  const isIpod = device.model?.indexOf('iPod') !== -1;\n  const isIpad = device.model?.indexOf('iPad') !== -1;\n\n  return { os, device, browser, isIphone, isIpod, isIpad };\n}\n"],"names":["useBrowserInfo","userAgent","uaParser","UAParser","os","getOS","device","getDevice","browser","getBrowser","isIphone","model","indexOf","isIpod","isIpad"],"mappings":";AAEA,SAAwBA,EAAeC,GAAoB;;AACnDC,QAAAA,IAAW,IAAIC,EAASF,CAAS,GAEjCG,IAAmBF,EAASG,SAC5BC,IAA2BJ,EAASK,aACpCC,IAA6BN,EAASO,cAEtCC,MAAWJ,IAAAA,EAAOK,UAAPL,gBAAAA,EAAcM,QAAQ,eAAc,IAC/CC,MAASP,IAAAA,EAAOK,UAAPL,gBAAAA,EAAcM,QAAQ,aAAY,IAC3CE,MAASR,IAAAA,EAAOK,UAAPL,gBAAAA,EAAcM,QAAQ,aAAY;AAE1C,SAAA;AAAA,IAAER,IAAAA;AAAAA,IAAIE,QAAAA;AAAAA,IAAQE,SAAAA;AAAAA,IAASE,UAAAA;AAAAA,IAAUG,QAAAA;AAAAA,IAAQC,QAAAA;AAAAA,EAAAA;AAClD;"}

package/dist/hooks/useClickOutside/useClickOutside.js

@@ -1,26 +1,27 @@
-import { useRef, useEffect } from "react";
-const DEFAULT_EVENTS = ["mousedown", "touchstart"];
-function useClickOutside(handler, events, nodes) {
-  const ref = useRef();
-  return useEffect(() => {
-    const listener = (event) => {
+import { useRef as d, useEffect as f } from "react";
+const i = ["mousedown", "touchstart"];
+function l(o, s, c) {
+  const r = d();
+  return f(() => {
+    const u = (t) => {
       const {
-        target
-      } = event ?? {};
-      if (Array.isArray(nodes)) {
-        const shouldIgnore = (target == null ? void 0 : target.hasAttribute("data-ignore-outside-clicks")) || !document.body.contains(target) && target.tagName !== "HTML";
-        nodes.every((node) => !!node && !event.composedPath().includes(node)) && !shouldIgnore && handler();
-      } else ref.current && !ref.current.contains(target) && handler();
+        target: e
+      } = t ?? {};
+      if (Array.isArray(c)) {
+        const a = (e == null ? void 0 : e.hasAttribute("data-ignore-outside-clicks")) || !document.body.contains(e) && e.tagName !== "HTML";
+        c.every((n) => !!n && !t.composedPath().includes(n)) && !a && o();
+      } else r.current && !r.current.contains(e) && o();
     };
-    return (events || DEFAULT_EVENTS).forEach((fn) => {
-      document.addEventListener(fn, listener);
+    return (s || i).forEach((t) => {
+      document.addEventListener(t, u);
     }), () => {
-      (events || DEFAULT_EVENTS).forEach((fn) => {
-        document.removeEventListener(fn, listener);
+      (s || i).forEach((t) => {
+        document.removeEventListener(t, u);
       });
     };
-  }, [ref, handler, nodes, events]), ref;
+  }, [r, o, c, s]), r;
 }
 export {
-  useClickOutside as default
+  l as default
 };
+//# sourceMappingURL=useClickOutside.js.map

package/dist/hooks/useClickOutside/useClickOutside.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClickOutside.js","sources":["../../../src/hooks/useClickOutside/useClickOutside.ts"],"sourcesContent":["// https://mantine.dev/hooks/use-click-outside\nimport { useEffect, useRef } from 'react';\n\nconst DEFAULT_EVENTS = ['mousedown', 'touchstart'];\n\nexport default function useClickOutside<T extends HTMLElement = any>(\n  handler: () => void,\n  events?: string[] | null,\n  nodes?: Array<HTMLElement | null>,\n) {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    const listener = (event: any) => {\n      const { target } = event ?? {};\n      if (Array.isArray(nodes)) {\n        const shouldIgnore =\n          target?.hasAttribute('data-ignore-outside-clicks') ||\n          (!document.body.contains(target) && target.tagName !== 'HTML');\n        const shouldTrigger = nodes.every(\n          (node) => !!node && !event.composedPath().includes(node),\n        );\n        shouldTrigger && !shouldIgnore && handler();\n      } else if (ref.current && !ref.current.contains(target)) {\n        handler();\n      }\n    };\n\n    (events || DEFAULT_EVENTS).forEach((fn) => {\n      document.addEventListener(fn, listener);\n    });\n\n    return () => {\n      (events || DEFAULT_EVENTS).forEach((fn) => {\n        document.removeEventListener(fn, listener);\n      });\n    };\n  }, [ref, handler, nodes, events]);\n\n  return ref;\n}\n"],"names":["DEFAULT_EVENTS","useClickOutside","handler","events","nodes","ref","useRef","useEffect","listener","event","target","Array","isArray","shouldIgnore","hasAttribute","document","body","contains","tagName","every","node","composedPath","includes","current","forEach","fn","addEventListener","removeEventListener"],"mappings":";AAGA,MAAMA,IAAiB,CAAC,aAAa,YAAY;AAEzBC,SAAAA,EACtBC,GACAC,GACAC,GACA;AACA,QAAMC,IAAMC;AAEZC,SAAAA,EAAU,MAAM;AACRC,UAAAA,IAAWA,CAACC,MAAe;AACzB,YAAA;AAAA,QAAEC,QAAAA;AAAAA,MAAAA,IAAWD,KAAS,CAAA;AACxBE,UAAAA,MAAMC,QAAQR,CAAK,GAAG;AACxB,cAAMS,KACJH,KAAAA,gBAAAA,EAAQI,aAAa,kCACpB,CAACC,SAASC,KAAKC,SAASP,CAAM,KAAKA,EAAOQ,YAAY;AAIxC,QAHKd,EAAMe,MACzBC,CAAAA,MAAS,CAAC,CAACA,KAAQ,CAACX,EAAMY,aAAAA,EAAeC,SAASF,CAAI,CACzD,KACiB,CAACP,KAAgBX;MAAQ,MAC5C,CAAWG,EAAIkB,WAAW,CAAClB,EAAIkB,QAAQN,SAASP,CAAM,KAC5CR;IACV;AAGDC,YAAAA,KAAUH,GAAgBwB,QAASC,CAAOA,MAAA;AAChCC,eAAAA,iBAAiBD,GAAIjB,CAAQ;AAAA,IAAA,CACvC,GAEM,MAAM;AACVL,OAAAA,KAAUH,GAAgBwB,QAASC,CAAOA,MAAA;AAChCE,iBAAAA,oBAAoBF,GAAIjB,CAAQ;AAAA,MAAA,CAC1C;AAAA,IAAA;AAAA,KAEF,CAACH,GAAKH,GAASE,GAAOD,CAAM,CAAC,GAEzBE;AACT;"}

package/dist/hooks/useDebounce/useDebounce.js

@@ -1,15 +1,16 @@
-import { useState, useEffect } from "react";
-function useDebounce(value, delay) {
-  const [debouncedValue, setDebouncedValue] = useState(value);
-  return useEffect(() => {
-    const timer = setTimeout(() => {
-      setDebouncedValue(value);
-    }, delay || 500);
+import { useState as r, useEffect as c } from "react";
+function f(e, t) {
+  const [u, o] = r(e);
+  return c(() => {
+    const n = setTimeout(() => {
+      o(e);
+    }, t || 500);
     return () => {
-      clearTimeout(timer);
+      clearTimeout(n);
     };
-  }, [value, delay]), debouncedValue;
+  }, [e, t]), u;
 }
 export {
-  useDebounce as default
+  f as default
 };
+//# sourceMappingURL=useDebounce.js.map

package/dist/hooks/useDebounce/useDebounce.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebounce.js","sources":["../../../src/hooks/useDebounce/useDebounce.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nfunction useDebounce<T>(value: T, delay?: number): T {\n  const [debouncedValue, setDebouncedValue] = useState<T>(value);\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      setDebouncedValue(value);\n    }, delay || 500);\n\n    return () => {\n      clearTimeout(timer);\n    };\n  }, [value, delay]);\n\n  return debouncedValue;\n}\n\nexport default useDebounce;\n"],"names":["useDebounce","value","delay","debouncedValue","setDebouncedValue","useState","useEffect","timer","setTimeout","clearTimeout"],"mappings":";AAEA,SAASA,EAAeC,GAAUC,GAAmB;AACnD,QAAM,CAACC,GAAgBC,CAAiB,IAAIC,EAAYJ,CAAK;AAE7DK,SAAAA,EAAU,MAAM;AACRC,UAAAA,IAAQC,WAAW,MAAM;AAC7BJ,MAAAA,EAAkBH,CAAK;AAAA,IAAA,GACtBC,KAAS,GAAG;AAEf,WAAO,MAAM;AACXO,mBAAaF,CAAK;AAAA,IAAA;AAAA,EACpB,GACC,CAACN,GAAOC,CAAK,CAAC,GAEVC;AACT;"}

package/dist/hooks/useDropdown/useDropdown.js

@@ -1,158 +1,159 @@
-import { useId, useState, useRef, useEffect, useCallback } from "react";
-import { useFloating, autoUpdate, offset, size, flip, useHover, safePolygon } from "@floating-ui/react";
-import { mergeRefs } from "../../utils/ref.js";
-const useDropdown = (placement, extraTriggerKeyDownHandler, isTriggerHovered = !1) => {
-  const id = useId(), [visible, setVisible] = useState(!1), [activeIndex, setActiveIndex] = useState(-1), [isFocused, setIsFocused] = useState(null), {
-    refs,
-    floatingStyles,
-    context
-  } = useFloating({
-    placement,
-    open: visible,
-    onOpenChange: setVisible,
-    whileElementsMounted: autoUpdate,
-    middleware: [offset(4), size({
+import { useId as N, useState as b, useRef as g, useEffect as E, useCallback as l } from "react";
+import { useFloating as z, autoUpdate as V, offset as W, size as q, flip as B, useHover as G, safePolygon as J } from "@floating-ui/react";
+import { mergeRefs as v } from "../../utils/ref.js";
+const T = (C, p, y = !1) => {
+  const d = N(), [o, r] = b(!1), [a, c] = b(-1), [w, A] = b(null), {
+    refs: I,
+    floatingStyles: D,
+    context: O
+  } = z({
+    placement: C,
+    open: o,
+    onOpenChange: r,
+    whileElementsMounted: V,
+    middleware: [W(4), q({
       apply({
-        rects,
-        elements
+        rects: e,
+        elements: t
       }) {
-        elements.floating.style.minWidth = `${rects.reference.width}px`;
+        t.floating.style.minWidth = `${e.reference.width}px`;
       }
-    }), flip({
+    }), B({
       padding: 0
     })]
   });
-  useHover(context, {
-    enabled: isTriggerHovered,
+  G(O, {
+    enabled: y,
     // Configure the delay for opening and closing separately.
     delay: {
       open: 200
     },
-    handleClose: safePolygon()
+    handleClose: J()
   });
-  const menuRef = useRef(null), triggerRef = useRef(null), itemRefs = useRef({});
-  useEffect(() => {
-    visible ? menuRef.current && (menuRef.current.focus(), setActiveIndex(0)) : (setActiveIndex(-1), itemRefs.current = {});
-  }, [visible]), useEffect(() => {
-    if (activeIndex !== -1) {
-      const currentItem = Object.values(itemRefs.current)[activeIndex];
-      if (currentItem) {
-        const id2 = currentItem.getAttribute("id");
-        setIsFocused(id2), currentItem.focus();
+  const f = g(null), i = g(null), n = g({});
+  E(() => {
+    o ? f.current && (f.current.focus(), c(0)) : (c(-1), n.current = {});
+  }, [o]), E(() => {
+    if (a !== -1) {
+      const e = Object.values(n.current)[a];
+      if (e) {
+        const t = e.getAttribute("id");
+        A(t), e.focus();
       }
     }
-  }, [activeIndex]);
-  const nextItem = () => {
-    const itemCount = Object.values(itemRefs.current).length;
-    setActiveIndex((prevIndex) => (prevIndex + 1) % itemCount);
-  }, previousItem = () => {
-    const itemCount = Object.values(itemRefs.current).length;
-    setActiveIndex((prevIndex) => (prevIndex - 1 + itemCount) % itemCount);
-  }, firstItem = () => {
-    setActiveIndex(0);
-  }, lastItem = () => {
-    const itemCount = Object.values(itemRefs.current).length;
-    setActiveIndex(itemCount - 1);
-  }, openDropdown = useCallback(() => {
-    setVisible(!0);
-  }, []), closeDropdown = useCallback(() => {
-    triggerRef.current && (triggerRef.current.focus({
+  }, [a]);
+  const j = () => {
+    const t = Object.values(n.current).length;
+    c((s) => (s + 1) % t);
+  }, P = () => {
+    const t = Object.values(n.current).length;
+    c((s) => (s - 1 + t) % t);
+  }, R = () => {
+    c(0);
+  }, x = () => {
+    const t = Object.values(n.current).length;
+    c(t - 1);
+  }, m = l(() => {
+    r(!0);
+  }, []), u = l(() => {
+    i.current && (i.current.focus({
       preventScroll: !0
-    }), setVisible(!1));
-  }, []), stopEvents = (flag, event) => {
-    flag && (event.stopPropagation(), event.preventDefault());
-  }, onTriggerKeyDown = useCallback((event) => {
-    let flag = !1;
-    switch (event.code) {
+    }), r(!1));
+  }, []), k = (e, t) => {
+    e && (t.stopPropagation(), t.preventDefault());
+  }, M = l((e) => {
+    let t = !1;
+    switch (e.code) {
       case " ":
       case "Space":
       case "Enter":
       case "ArrowDown":
       case "Down":
-        openDropdown(), flag = !0;
+        m(), t = !0;
         break;
       case "Esc":
       case "Escape":
-        closeDropdown(), flag = !0;
+        u(), t = !0;
         break;
       case "Up":
       case "ArrowUp":
-        openDropdown(), flag = !0;
+        m(), t = !0;
         break;
     }
-    extraTriggerKeyDownHandler == null || extraTriggerKeyDownHandler(event), stopEvents(flag, event);
-  }, [closeDropdown, openDropdown]), onMenuItemMouseEnter = (event) => {
-    const index = Object.values(itemRefs.current).findIndex((item) => item.id === event.currentTarget.getAttribute("id"));
-    setActiveIndex(index);
-  }, onMenuItemKeyDown = useCallback((event, onSuccess) => {
-    let flag = !1;
-    if (event.shiftKey)
-      event.key === "Tab" && (closeDropdown(), flag = !0);
+    p == null || p(e), k(t, e);
+  }, [u, m]), U = (e) => {
+    const s = Object.values(n.current).findIndex((h) => h.id === e.currentTarget.getAttribute("id"));
+    c(s);
+  }, $ = l((e, t) => {
+    let s = !1;
+    if (e.shiftKey)
+      e.key === "Tab" && (u(), s = !0);
     else {
-      switch (event.code) {
+      switch (e.code) {
         case "Escape":
-          closeDropdown();
+          u();
           break;
         case " ":
         case "Enter":
-          activeIndex !== -1 && (Object.values(itemRefs.current)[activeIndex].getAttribute("role") === "menuitem" && triggerRef.current && (triggerRef.current.focus(), setVisible(!1)), onSuccess == null || onSuccess()), flag = !0;
+          a !== -1 && (Object.values(n.current)[a].getAttribute("role") === "menuitem" && i.current && (i.current.focus(), r(!1)), t == null || t()), s = !0;
           break;
         case "ArrowDown":
         case "Down":
-          nextItem(), flag = !0;
+          j(), s = !0;
           break;
         case "ArrowUp":
         case "Up":
-          previousItem(), flag = !0;
+          P(), s = !0;
           break;
         case "Home":
-          firstItem(), flag = !0;
+          R(), s = !0;
           break;
         case "End":
-          lastItem(), flag = !0;
+          x(), s = !0;
           break;
       }
-      stopEvents(flag, event);
+      k(s, e);
     }
-  }, [activeIndex, closeDropdown]), onTriggerClick = useCallback((event) => {
-    setVisible(visible !== !0), event.stopPropagation(), event.preventDefault();
-  }, [visible]);
+  }, [a, u]), F = l((e) => {
+    r(o !== !0), e.stopPropagation(), e.preventDefault();
+  }, [o]);
   return {
-    isFocused,
-    visible,
-    itemRefs,
-    triggerRef,
-    menuRef,
+    isFocused: w,
+    visible: o,
+    itemRefs: n,
+    triggerRef: i,
+    menuRef: f,
     /* TriggerProps to spread to any Trigger component */
     triggerProps: {
-      ref: mergeRefs(triggerRef, refs.setReference),
-      id: `dropdown-toggle-${id}`,
+      ref: v(i, I.setReference),
+      id: `dropdown-toggle-${d}`,
       "aria-haspopup": "menu",
-      "aria-controls": `dropdown-${id}`,
-      "aria-expanded": !!visible,
-      className: `${visible ? "selected" : ""}`,
-      onClick: onTriggerClick,
-      onKeyDown: onTriggerKeyDown,
-      "aria-activedescendant": isFocused
+      "aria-controls": `dropdown-${d}`,
+      "aria-expanded": !!o,
+      className: `${o ? "selected" : ""}`,
+      onClick: F,
+      onKeyDown: M,
+      "aria-activedescendant": w
     },
     /* MenuProps to spread to any Menu Component */
     menuProps: {
-      ref: mergeRefs(menuRef, refs.setFloating),
+      ref: v(f, I.setFloating),
       className: "dropdown-menu",
-      "aria-labelledby": `dropdown-toggle-${id}`,
+      "aria-labelledby": `dropdown-toggle-${d}`,
       style: {
-        ...floatingStyles
+        ...D
       }
     },
     /* ItemProps to spread to any item Component */
     itemProps: {
-      onMenuItemMouseEnter,
-      onMenuItemClick: closeDropdown,
-      onMenuItemKeyDown
+      onMenuItemMouseEnter: U,
+      onMenuItemClick: u,
+      onMenuItemKeyDown: $
     },
-    setVisible
+    setVisible: r
   };
 };
 export {
-  useDropdown as default
+  T as default
 };
+//# sourceMappingURL=useDropdown.js.map

package/dist/hooks/useDropdown/useDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDropdown.js","sources":["../../../src/hooks/useDropdown/useDropdown.ts"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport {\n  Dispatch,\n  MutableRefObject,\n  SetStateAction,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n} from 'react';\n\nimport {\n  Placement,\n  autoUpdate,\n  flip,\n  offset,\n  safePolygon,\n  size,\n  useFloating,\n  useHover,\n} from '@floating-ui/react';\n\nimport { mergeRefs } from '../../utils/ref';\n\nexport enum KEYS {\n  Enter = 'Enter',\n  Space = 'Space',\n  ArrowDown = 'ArrowDown',\n  ArrowUp = 'ArrowUp',\n  Down = 'Down',\n  Up = 'Up',\n  Tab = 'Tab',\n  Esc = 'Esc',\n  Escape = 'Escape',\n  Home = 'Home',\n  End = 'End',\n  PageUp = 'PageUp',\n  PageDown = 'PageDown',\n}\n\nexport interface UseDropdownProps {\n  isFocused: string | null;\n  visible: boolean;\n  itemRefs: MutableRefObject<{ [key: string]: HTMLElement | null }>;\n  triggerRef: MutableRefObject<HTMLButtonElement | null>;\n  menuRef: MutableRefObject<HTMLUListElement | null>;\n  triggerProps: Record<string, any>;\n  menuProps: Record<string, any>;\n  itemProps: Record<string, any>;\n  setVisible: Dispatch<SetStateAction<boolean>>;\n}\n\nconst useDropdown = (\n  placement: Placement | undefined,\n  extraTriggerKeyDownHandler?: (\n    event: React.KeyboardEvent<HTMLButtonElement>,\n  ) => void,\n  isTriggerHovered = false,\n): UseDropdownProps => {\n  /* Unique Dropdown Id */\n  const id = useId();\n\n  /* states */\n  const [visible, setVisible] = useState<boolean>(false);\n  const [activeIndex, setActiveIndex] = useState<number>(-1);\n  const [isFocused, setIsFocused] = useState<string | null>(null);\n\n  const { refs, floatingStyles, context } = useFloating({\n    placement,\n    open: visible,\n    onOpenChange: setVisible,\n    whileElementsMounted: autoUpdate,\n    middleware: [\n      offset(4),\n      size({\n        apply({ rects, elements }) {\n          elements.floating.style.minWidth = `${rects.reference.width}px`;\n        },\n      }),\n      flip({ padding: 0 }),\n    ],\n  });\n\n  // Hover interaction for the dropdown trigger. This is used to open the dropdown on hover. The dropdown should be closed on mouse leave.\n  useHover(context, {\n    enabled: isTriggerHovered,\n    // Configure the delay for opening and closing separately.\n    delay: {\n      open: 200,\n    },\n    handleClose: safePolygon(),\n  });\n\n  /* refs */\n  const menuRef = useRef<HTMLUListElement | null>(null);\n  const triggerRef = useRef<HTMLButtonElement | null>(null);\n  const itemRefs = useRef({});\n\n  useEffect(() => {\n    if (visible) {\n      if (menuRef.current) {\n        menuRef.current.focus();\n        setActiveIndex(0);\n      }\n    } else {\n      setActiveIndex(-1);\n      itemRefs.current = {};\n    }\n  }, [visible]);\n\n  useEffect(() => {\n    if (activeIndex !== -1) {\n      const currentItem = Object.values(itemRefs.current)[\n        activeIndex\n      ] as HTMLElement;\n\n      if (currentItem) {\n        const id = currentItem.getAttribute('id') as string;\n        setIsFocused(id);\n        currentItem.focus();\n      }\n    }\n  }, [activeIndex]);\n\n  const nextItem = () => {\n    const items = Object.values(itemRefs.current);\n    const itemCount = items.length;\n    setActiveIndex((prevIndex) => (prevIndex + 1) % itemCount);\n  };\n\n  const previousItem = () => {\n    const items = Object.values(itemRefs.current);\n    const itemCount = items.length;\n    setActiveIndex((prevIndex) => (prevIndex - 1 + itemCount) % itemCount);\n  };\n\n  const firstItem = () => {\n    setActiveIndex(0);\n  };\n\n  const lastItem = () => {\n    const items = Object.values(itemRefs.current);\n    const itemCount = items.length;\n    setActiveIndex(itemCount - 1);\n  };\n\n  const openDropdown = useCallback(() => {\n    setVisible(true);\n  }, []);\n\n  const closeDropdown = useCallback(() => {\n    if (triggerRef.current) {\n      // Closing the dropdown should not scroll the window content.\n      triggerRef.current.focus({ preventScroll: true });\n      setVisible(false);\n    }\n  }, []);\n\n  const stopEvents = (flag: boolean, event: React.KeyboardEvent) => {\n    if (flag) {\n      event.stopPropagation();\n      event.preventDefault();\n    }\n  };\n\n  const onTriggerKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      let flag = false;\n\n      switch (event.code) {\n        case ' ':\n        case KEYS.Space:\n        case KEYS.Enter:\n        case KEYS.ArrowDown:\n        case KEYS.Down:\n          openDropdown();\n          flag = true;\n          break;\n        case KEYS.Esc:\n        case KEYS.Escape:\n          closeDropdown();\n          flag = true;\n          break;\n        case KEYS.Up:\n        case KEYS.ArrowUp:\n          openDropdown();\n          flag = true;\n          break;\n        default:\n          break;\n      }\n\n      extraTriggerKeyDownHandler?.(event);\n      stopEvents(flag, event);\n    },\n    [closeDropdown, openDropdown],\n  );\n\n  const onMenuItemMouseEnter = (event: React.MouseEvent) => {\n    const items: HTMLElement[] = Object.values(itemRefs.current);\n\n    const index = items.findIndex(\n      (item) => item.id === event.currentTarget.getAttribute('id'),\n    );\n\n    setActiveIndex(index);\n  };\n\n  const onMenuItemKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLElement>, onSuccess?: () => void) => {\n      let flag = false;\n\n      if (event.shiftKey) {\n        if (event.key === 'Tab') {\n          closeDropdown();\n          flag = true;\n        }\n      } else {\n        switch (event.code) {\n          case KEYS.Escape:\n            closeDropdown();\n            break;\n          // FIX WB2-1334: Space event prevents user to insert Space during search, so we comment it to keep a trace.\n          // case KEYS.Space:\n          case ' ':\n          case KEYS.Enter:\n            if (activeIndex !== -1) {\n              const currentItem = Object.values(itemRefs.current)[\n                activeIndex\n              ] as HTMLElement;\n              const role = currentItem.getAttribute('role');\n\n              if (role === 'menuitem') {\n                if (triggerRef.current) {\n                  triggerRef.current.focus();\n                  setVisible(false);\n                }\n              }\n\n              onSuccess?.();\n            }\n            flag = true;\n            break;\n          case KEYS.ArrowDown:\n          case KEYS.Down:\n            nextItem();\n            flag = true;\n            break;\n          case KEYS.ArrowUp:\n          case KEYS.Up:\n            previousItem();\n            flag = true;\n            break;\n          case KEYS.Home:\n            firstItem();\n            flag = true;\n            break;\n          case KEYS.End:\n            lastItem();\n            flag = true;\n            break;\n          default:\n            break;\n        }\n        stopEvents(flag, event);\n      }\n    },\n    [activeIndex, closeDropdown],\n  );\n\n  const onTriggerClick = useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      if (visible === true) {\n        setVisible(false);\n      } else {\n        setVisible(true);\n      }\n      event.stopPropagation();\n      event.preventDefault();\n    },\n    [visible],\n  );\n\n  return {\n    isFocused,\n    visible,\n    itemRefs,\n    triggerRef,\n    menuRef,\n    /* TriggerProps to spread to any Trigger component */\n    triggerProps: {\n      ref: mergeRefs(triggerRef, refs.setReference),\n      id: `dropdown-toggle-${id}`,\n      'aria-haspopup': 'menu',\n      'aria-controls': `dropdown-${id}`,\n      'aria-expanded': visible ? true : false,\n      className: `${visible ? 'selected' : ''}`,\n      onClick: onTriggerClick,\n      onKeyDown: onTriggerKeyDown,\n      'aria-activedescendant': isFocused,\n    },\n    /* MenuProps to spread to any Menu Component */\n    menuProps: {\n      ref: mergeRefs(menuRef, refs.setFloating),\n      className: 'dropdown-menu',\n      'aria-labelledby': `dropdown-toggle-${id}`,\n      style: { ...floatingStyles },\n    },\n    /* ItemProps to spread to any item Component */\n    itemProps: {\n      onMenuItemMouseEnter,\n      onMenuItemClick: closeDropdown,\n      onMenuItemKeyDown,\n    },\n    setVisible,\n  };\n};\n\nexport default useDropdown;\n"],"names":["useDropdown","placement","extraTriggerKeyDownHandler","isTriggerHovered","id","useId","visible","setVisible","useState","activeIndex","setActiveIndex","isFocused","setIsFocused","refs","floatingStyles","context","useFloating","open","onOpenChange","whileElementsMounted","autoUpdate","middleware","offset","size","apply","rects","elements","floating","style","minWidth","reference","width","flip","padding","useHover","enabled","delay","handleClose","safePolygon","menuRef","useRef","triggerRef","itemRefs","useEffect","current","focus","currentItem","Object","values","getAttribute","nextItem","itemCount","length","prevIndex","previousItem","firstItem","lastItem","openDropdown","useCallback","closeDropdown","preventScroll","stopEvents","flag","event","stopPropagation","preventDefault","onTriggerKeyDown","code","KEYS","onMenuItemMouseEnter","index","findIndex","item","currentTarget","onMenuItemKeyDown","onSuccess","shiftKey","key","onTriggerClick","triggerProps","ref","mergeRefs","setReference","className","onClick","onKeyDown","menuProps","setFloating","itemProps","onMenuItemClick"],"mappings":";;;AAqDA,MAAMA,IAAcA,CAClBC,GACAC,GAGAC,IAAmB,OACE;AAErB,QAAMC,IAAKC,KAGL,CAACC,GAASC,CAAU,IAAIC,EAAkB,EAAK,GAC/C,CAACC,GAAaC,CAAc,IAAIF,EAAiB,EAAE,GACnD,CAACG,GAAWC,CAAY,IAAIJ,EAAwB,IAAI,GAExD;AAAA,IAAEK,MAAAA;AAAAA,IAAMC,gBAAAA;AAAAA,IAAgBC,SAAAA;AAAAA,MAAYC,EAAY;AAAA,IACpDf,WAAAA;AAAAA,IACAgB,MAAMX;AAAAA,IACNY,cAAcX;AAAAA,IACdY,sBAAsBC;AAAAA,IACtBC,YAAY,CACVC,EAAO,CAAC,GACRC,EAAK;AAAA,MACHC,MAAM;AAAA,QAAEC,OAAAA;AAAAA,QAAOC,UAAAA;AAAAA,MAAAA,GAAY;AACzBA,QAAAA,EAASC,SAASC,MAAMC,WAAW,GAAGJ,EAAMK,UAAUC,KAAK;AAAA,MAC7D;AAAA,IACD,CAAA,GACDC,EAAK;AAAA,MAAEC,SAAS;AAAA,IAAA,CAAG,CAAC;AAAA,EAAA,CAEvB;AAGDC,EAAAA,EAASnB,GAAS;AAAA,IAChBoB,SAAShC;AAAAA;AAAAA,IAETiC,OAAO;AAAA,MACLnB,MAAM;AAAA,IACR;AAAA,IACAoB,aAAaC,EAAY;AAAA,EAAA,CAC1B;AAGKC,QAAAA,IAAUC,EAAgC,IAAI,GAC9CC,IAAaD,EAAiC,IAAI,GAClDE,IAAWF,EAAO,CAAA,CAAE;AAE1BG,EAAAA,EAAU,MAAM;AACd,IAAIrC,IACEiC,EAAQK,YACVL,EAAQK,QAAQC,SAChBnC,EAAe,CAAC,MAGlBA,EAAe,EAAE,GACjBgC,EAASE,UAAU;EACrB,GACC,CAACtC,CAAO,CAAC,GAEZqC,EAAU,MAAM;AACd,QAAIlC,MAAgB,IAAI;AACtB,YAAMqC,IAAcC,OAAOC,OAAON,EAASE,OAAO,EAChDnC,CAAW;AAGb,UAAIqC,GAAa;AACT1C,cAAAA,IAAK0C,EAAYG,aAAa,IAAI;AACxCrC,QAAAA,EAAaR,CAAE,GACf0C,EAAYD,MAAM;AAAA,MACpB;AAAA,IACF;AAAA,EAAA,GACC,CAACpC,CAAW,CAAC;AAEhB,QAAMyC,IAAWA,MAAM;AAErB,UAAMC,IADQJ,OAAOC,OAAON,EAASE,OAAO,EACpBQ;AACRC,IAAAA,EAAAA,CAAAA,OAAeA,IAAY,KAAKF,CAAS;AAAA,EAAA,GAGrDG,IAAeA,MAAM;AAEzB,UAAMH,IADQJ,OAAOC,OAAON,EAASE,OAAO,EACpBQ;AACxB1C,IAAAA,EAAgB2C,CAAeA,OAAAA,IAAY,IAAIF,KAAaA,CAAS;AAAA,EAAA,GAGjEI,IAAYA,MAAM;AACtB7C,IAAAA,EAAe,CAAC;AAAA,EAAA,GAGZ8C,IAAWA,MAAM;AAErB,UAAML,IADQJ,OAAOC,OAAON,EAASE,OAAO,EACpBQ;AACxB1C,IAAAA,EAAeyC,IAAY,CAAC;AAAA,EAAA,GAGxBM,IAAeC,EAAY,MAAM;AACrCnD,IAAAA,EAAW,EAAI;AAAA,EACjB,GAAG,CAAE,CAAA,GAECoD,IAAgBD,EAAY,MAAM;AACtC,IAAIjB,EAAWG,YAEbH,EAAWG,QAAQC,MAAM;AAAA,MAAEe,eAAe;AAAA,IAAA,CAAM,GAChDrD,EAAW,EAAK;AAAA,EAEpB,GAAG,CAAE,CAAA,GAECsD,IAAaA,CAACC,GAAeC,MAA+B;AAChE,IAAID,MACFC,EAAMC,gBAAgB,GACtBD,EAAME,eAAe;AAAA,EACvB,GAGIC,IAAmBR,EACvB,CAACK,MAAkD;AACjD,QAAID,IAAO;AAEX,YAAQC,EAAMI,MAAI;AAAA,MAChB,KAAK;AAAA,MACL,KAAKC;AAAAA,MACL,KAAKA;AAAAA,MACL,KAAKA;AAAAA,MACL,KAAKA;AACU,QAAAX,KACNK,IAAA;AACP;AAAA,MACF,KAAKM;AAAAA,MACL,KAAKA;AACW,QAAAT,KACPG,IAAA;AACP;AAAA,MACF,KAAKM;AAAAA,MACL,KAAKA;AACU,QAAAX,KACNK,IAAA;AACP;AAAA,IAGJ;AAEA5D,IAAAA,KAAAA,QAAAA,EAA6B6D,IAC7BF,EAAWC,GAAMC,CAAK;AAAA,EAAA,GAExB,CAACJ,GAAeF,CAAY,CAC9B,GAEMY,IAAuBA,CAACN,MAA4B;AAGlDO,UAAAA,IAFuBvB,OAAOC,OAAON,EAASE,OAAO,EAEvC2B,UACjBC,CAASA,MAAAA,EAAKpE,OAAO2D,EAAMU,cAAcxB,aAAa,IAAI,CAC7D;AAEAvC,IAAAA,EAAe4D,CAAK;AAAA,EAAA,GAGhBI,IAAoBhB,EACxB,CAACK,GAAyCY,MAA2B;AACnE,QAAIb,IAAO;AAEX,QAAIC,EAAMa;AACJb,MAAAA,EAAMc,QAAQ,UACFlB,KACPG,IAAA;AAAA,SAEJ;AACL,cAAQC,EAAMI,MAAI;AAAA,QAChB,KAAKC;AACW,UAAAT;AACd;AAAA,QAGF,KAAK;AAAA,QACL,KAAKS;AACH,UAAI3D,MAAgB,OACEsC,OAAOC,OAAON,EAASE,OAAO,EAChDnC,CAAW,EAEYwC,aAAa,MAAM,MAE/B,cACPR,EAAWG,YACbH,EAAWG,QAAQC,SACnBtC,EAAW,EAAK,IAIRoE,KAAA,QAAAA,MAEPb,IAAA;AACP;AAAA,QACF,KAAKM;AAAAA,QACL,KAAKA;AACM,UAAAlB,KACFY,IAAA;AACP;AAAA,QACF,KAAKM;AAAAA,QACL,KAAKA;AACU,UAAAd,KACNQ,IAAA;AACP;AAAA,QACF,KAAKM;AACO,UAAAb,KACHO,IAAA;AACP;AAAA,QACF,KAAKM;AACM,UAAAZ,KACFM,IAAA;AACP;AAAA,MAGJ;AACAD,MAAAA,EAAWC,GAAMC,CAAK;AAAA,IACxB;AAAA,EAAA,GAEF,CAACtD,GAAakD,CAAa,CAC7B,GAEMmB,IAAiBpB,EACrB,CAACK,MAA+C;AAC9C,IACExD,EADED,MAAY,EACE,GAIlByD,EAAMC,gBAAgB,GACtBD,EAAME,eAAe;AAAA,EAAA,GAEvB,CAAC3D,CAAO,CACV;AAEO,SAAA;AAAA,IACLK,WAAAA;AAAAA,IACAL,SAAAA;AAAAA,IACAoC,UAAAA;AAAAA,IACAD,YAAAA;AAAAA,IACAF,SAAAA;AAAAA;AAAAA,IAEAwC,cAAc;AAAA,MACZC,KAAKC,EAAUxC,GAAY5B,EAAKqE,YAAY;AAAA,MAC5C9E,IAAI,mBAAmBA,CAAE;AAAA,MACzB,iBAAiB;AAAA,MACjB,iBAAiB,YAAYA,CAAE;AAAA,MAC/B,iBAAiBE,EAAAA;AAAAA,MACjB6E,WAAW,GAAG7E,IAAU,aAAa,EAAE;AAAA,MACvC8E,SAASN;AAAAA,MACTO,WAAWnB;AAAAA,MACX,yBAAyBvD;AAAAA,IAC3B;AAAA;AAAA,IAEA2E,WAAW;AAAA,MACTN,KAAKC,EAAU1C,GAAS1B,EAAK0E,WAAW;AAAA,MACxCJ,WAAW;AAAA,MACX,mBAAmB,mBAAmB/E,CAAE;AAAA,MACxCwB,OAAO;AAAA,QAAE,GAAGd;AAAAA,MAAe;AAAA,IAC7B;AAAA;AAAA,IAEA0E,WAAW;AAAA,MACTnB,sBAAAA;AAAAA,MACAoB,iBAAiB9B;AAAAA,MACjBe,mBAAAA;AAAAA,IACF;AAAA,IACAnE,YAAAA;AAAAA,EAAAA;AAEJ;"}