@iress-oss/ids-components 5.13.1 → 5.14.1

package/dist/components/Popover/InputPopover/InputPopover.js

@@ -1,47 +1,49 @@
 import { jsx as o, jsxs as j } from "react/jsx-runtime";
 import { forwardRef as F } from "react";
-import { c as i } from "../../../index-Cu0xwYjD.js";
+import { c as i } from "../../../index-2QXL0WYc.js";
 import { GlobalCSSClass as S } from "../../../enums.js";
 import { propagateTestid as m } from "../../../helpers/utility/propagateTestid.js";
-import { s as r } from "../../../Popover.module-COHnD5HM.js";
+import { s as r } from "../../../Popover.module-BVX_vz5-.js";
 import { InputPopoverProvider as W } from "./InputPopoverProvider.js";
 import { PopoverContent as b } from "../components/PopoverContent.js";
 import { InputPopoverActivator as w } from "./InputPopoverActivator.js";
 import { composePopoverWidth as E } from "../helpers/composePopoverWidth.js";
-const G = ({
+import { NestedPopoverActivator as G } from "../components/NestedPopoverActivator.js";
+import { usePopover as R } from "../hooks/usePopover.js";
+const k = ({
   activator: p,
   align: s = "auto",
-  autoHighlight: c = !0,
-  children: v,
+  autoHighlight: v = !0,
+  children: c,
   className: n,
-  container: l,
-  contentClassName: d,
+  container: d,
+  contentClassName: l,
   defaultShow: f,
-  disabledAutoToggle: a,
-  displayMode: e = "overlay",
+  disabledAutoToggle: e,
+  displayMode: a = "overlay",
   focusStartIndex: u,
-  minLength: h,
-  onActivated: I,
-  onDeactivated: P,
+  minLength: P,
+  onActivated: h,
+  onDeactivated: I,
   onNavigate: x,
-  show: y,
-  type: A = "listbox",
-  width: C,
+  show: A,
+  type: N = "listbox",
+  width: y,
   ...t
-}, N) => /* @__PURE__ */ o(
+}, C) => /* @__PURE__ */ o(
   W,
   {
     align: s,
-    autoHighlight: c,
+    autoHighlight: v,
     defaultShow: f,
-    disabledAutoToggle: a,
-    matchActivatorWidth: e === "overlay",
-    onActivated: I,
-    onDeactivated: P,
+    disabledAutoToggle: e,
+    matchActivatorWidth: a === "overlay",
+    onActivated: h,
+    onDeactivated: I,
     onNavigate: x,
-    ref: N,
-    type: A,
-    show: y,
+    ref: C,
+    type: N,
+    show: A,
     focusStartIndex: u,
     children: /* @__PURE__ */ j(
       "div",
@@ -54,32 +56,32 @@ const G = ({
           r.hasInputActivator
         ),
         children: [
-          /* @__PURE__ */ o(
+          /* @__PURE__ */ o(G, { parentPopover: R(), children: /* @__PURE__ */ o(
             w,
             {
               "data-testid": m(t["data-testid"], "activator"),
-              disabledAutoToggle: a,
-              minLength: h,
+              disabledAutoToggle: e,
+              minLength: P,
               children: p
             }
-          ),
+          ) }),
           /* @__PURE__ */ o(
             b,
             {
-              className: i(r.inputActivatorPortal, d),
-              container: l,
+              className: i(r.inputActivatorPortal, l),
+              container: d,
               "data-testid": m(t["data-testid"], "content"),
-              displayMode: e,
-              style: E(C),
+              displayMode: a,
+              style: E(y),
               virtualFocus: !0,
-              children: v
+              children: c
             }
           )
         ]
       }
     )
   }
-), O = F(G);
+), V = F(k);
 export {
-  O as IressInputPopover
+  V as IressInputPopover
 };

package/dist/components/Popover/InputPopover/InputPopoverActivator.js

@@ -1,5 +1,5 @@
 import { jsx as E } from "react/jsx-runtime";
-import { s as R } from "../../../Popover.module-COHnD5HM.js";
+import { s as R } from "../../../Popover.module-BVX_vz5-.js";
 import { usePopover as k } from "../hooks/usePopover.js";
 import { useCallback as f, cloneElement as F } from "react";
 import { hasFocus as S } from "../helpers/hasFocus.js";

package/dist/components/Popover/InputPopover/InputPopoverProvider.js

@@ -1,101 +1,103 @@
-import { jsx as H } from "react/jsx-runtime";
-import { forwardRef as N, useRef as V, useMemo as d } from "react";
-import { o as _, f as q, c as y, d as U, j as $, g as z, h as G, i as K } from "../../../floating-ui.react-D_ysmiM3.js";
-import { POPOVER_USE_MAX_HEIGHT as X } from "../Popover.types.js";
-import { usePopoverState as k } from "../hooks/usePopoverState.js";
-import { usePopoverNavigation as B } from "../hooks/usePopoverNavigation.js";
-import { usePopoverAria as J } from "../hooks/usePopoverAria.js";
-import { PopoverContext as L } from "../PopoverProvider.js";
-import { usePopoverImperativeHandle as Q } from "../hooks/usePopoverImperativeHandle.js";
-import { focusableElements as W } from "../../../helpers/dom/focusableElements.js";
-const Y = N(
+import { jsx as N } from "react/jsx-runtime";
+import { forwardRef as V, useRef as _, useMemo as h } from "react";
+import { o as q, f as y, c as U, d as $, j as z, g as G, h as K, i as X } from "../../../floating-ui.react-RKRjRgyj.js";
+import { POPOVER_USE_MAX_HEIGHT as k } from "../Popover.types.js";
+import { usePopoverState as B } from "../hooks/usePopoverState.js";
+import { usePopoverNavigation as J } from "../hooks/usePopoverNavigation.js";
+import { usePopoverAria as L } from "../hooks/usePopoverAria.js";
+import { PopoverContext as Q } from "../PopoverProvider.js";
+import { usePopoverImperativeHandle as W } from "../hooks/usePopoverImperativeHandle.js";
+import { focusableElements as Y } from "../../../helpers/dom/focusableElements.js";
+const Z = V(
   ({
     align: c,
-    autoHighlight: h,
+    autoHighlight: v,
     children: w,
-    defaultShow: v,
+    defaultShow: I,
     disabledAutoToggle: u,
     focusStartIndex: g,
     matchActivatorWidth: l = !0,
     onActivated: a,
     onDeactivated: m,
-    onNavigate: I,
-    show: O,
+    onNavigate: O,
+    show: F,
     type: n
-  }, F) => {
-    const E = c === "auto", f = V(null), t = k({
-      defaultShow: v,
-      show: O
-    }), R = d(() => {
-      const o = [_(5), q({ padding: 5 })];
-      return l && o.push(
-        y({
-          apply({ rects: r, availableHeight: s, elements: C }) {
+  }, E) => {
+    const R = c === "auto", f = _(null), r = B({
+      defaultShow: I,
+      show: F
+    }), S = h(() => {
+      const e = [q(5), y({ padding: 5 })];
+      return l && e.push(
+        U({
+          apply({ rects: t, availableHeight: s, elements: H }) {
             requestAnimationFrame(() => {
-              Object.assign(C.floating.style, {
-                width: `${r.reference.width}px`,
-                maxHeight: s > X ? `${s}px` : void 0
+              Object.assign(H.floating.style, {
+                width: `${t.reference.width}px`,
+                maxHeight: s > k ? `${s}px` : void 0
               });
             });
           },
           padding: 5
         })
-      ), o;
-    }, [l]), e = U({
-      open: t.show,
-      onOpenChange: (o, r, s) => {
-        t.setShow(o), o ? a == null || a(r, s, i) : m == null || m(r, s, i);
+      ), e;
+    }, [l]), o = $({
+      open: r.show,
+      onOpenChange: (e, t, s) => {
+        r.setShow(e), e ? a == null || a(t, s, i) : m == null || m(t, s, i);
       },
-      middleware: R,
-      placement: E ? void 0 : c,
-      whileElementsMounted: $
-    }), S = z(e.context, {
+      middleware: S,
+      placement: R ? void 0 : c,
+      whileElementsMounted: z
+    }), M = G(o.context, {
       enabled: !u,
       escapeKey: !1
-    }), M = G(e.context, {
+    }), b = K(o.context, {
       role: n
-    }), { activeIndex: i, list: x, listNav: b } = B(
-      e.context,
+    }), { activeIndex: i, list: x, listNav: j, setActiveIndex: d } = J(
+      o.context,
       n,
       {
-        focusItemOnOpen: h,
+        focusItemOnOpen: v,
         virtual: !0
       },
-      I,
+      O,
       g
-    ), P = K([S, M, b]), p = J(), j = d(
+    ), P = X([M, b, j]), p = L(), C = h(
       () => ({
         ...p,
-        ...t,
+        ...r,
         activeIndex: i,
-        api: e,
+        api: o,
         disabledAutoToggle: u,
         getFocusableActivator: () => {
-          const o = e.elements.reference;
-          return (o == null ? void 0 : o.querySelector("[role=combobox]")) ?? W(o)[0];
+          const e = o.elements.reference;
+          return (e == null ? void 0 : e.querySelector("[role=combobox]")) ?? Y(e)[0];
         },
         getVirtualFocus: () => f.current,
         interactions: P,
         list: x,
-        setShowWithReason: (o, r, s) => e.context.onOpenChange(o, r, s),
-        setVirtualFocus: (o) => f.current = o,
+        setActiveIndex: d,
+        setShowWithReason: (e, t, s) => o.context.onOpenChange(e, t, s),
+        setVirtualFocus: (e) => f.current = e,
         type: n
       }),
       [
         i,
-        e,
+        o,
         p,
         u,
         P,
         x,
-        t,
+        d,
+        r,
         n
       ]
     );
-    return Q(F, e, p, t), /* @__PURE__ */ H(L.Provider, { value: j, children: w });
+    return W(E, o, p, r), /* @__PURE__ */ N(Q.Provider, { value: C, children: w });
   }
 );
-Y.displayName = "InputPopoverProvider";
+Z.displayName = "InputPopoverProvider";
 export {
-  Y as InputPopoverProvider
+  Z as InputPopoverProvider
 };

package/dist/components/Popover/Popover.js

@@ -1,81 +1,83 @@
-import { jsx as t, jsxs as I } from "react/jsx-runtime";
-import { forwardRef as N, useRef as W } from "react";
-import { c as j } from "../../index-Cu0xwYjD.js";
+import { jsx as t, jsxs as C } from "react/jsx-runtime";
+import { forwardRef as I, useRef as W } from "react";
+import { c as j } from "../../index-2QXL0WYc.js";
 import { PopoverType as R } from "./Popover.types.js";
 import { FloatingUIAlign as S, GlobalCSSClass as b } from "../../enums.js";
 import { idsLogger as k } from "../../helpers/utility/idsLogger.js";
-import { propagateTestid as a } from "../../helpers/utility/propagateTestid.js";
-import { s as E } from "../../Popover.module-COHnD5HM.js";
+import { propagateTestid as s } from "../../helpers/utility/propagateTestid.js";
+import { s as E } from "../../Popover.module-BVX_vz5-.js";
 import { PopoverProvider as F } from "./PopoverProvider.js";
 import { PopoverActivator as G } from "./components/PopoverActivator.js";
 import { PopoverContent as L } from "./components/PopoverContent.js";
 import { composePopoverWidth as U } from "./helpers/composePopoverWidth.js";
-const q = ({
+import { usePopover as q } from "./hooks/usePopover.js";
+import { NestedPopoverActivator as z } from "./components/NestedPopoverActivator.js";
+const B = ({
   activator: p,
   align: d = "auto",
   children: n,
-  className: l,
-  container: c,
-  contentClassName: f,
-  defaultShow: v,
+  className: c,
+  container: l,
+  contentClassName: v,
+  defaultShow: f,
   disabledAutoToggle: h,
   displayMode: e = "overlay",
-  focusStartIndex: g,
-  matchActivatorWidth: P,
+  focusStartIndex: P,
+  matchActivatorWidth: g,
   onActivated: y,
   onDeactivated: A,
-  onNavigate: x,
-  type: T,
-  show: u,
+  onNavigate: u,
+  type: x,
+  show: N,
   width: r,
   virtualFocus: i,
   ...o
-}, w) => {
-  const C = W(null), s = P && e === "overlay";
+}, T) => {
+  const w = W(null), m = g && e === "overlay";
   return r !== void 0 && k(
     "IressPopover: The width prop is deprecated. Please use the --iress-width and --iress-max-width design token instead."
   ), /* @__PURE__ */ t(
     F,
     {
       align: d,
-      defaultShow: v,
+      defaultShow: f,
       disabledAutoToggle: h,
-      focusStartIndex: g,
-      matchActivatorWidth: s,
+      focusStartIndex: P,
+      matchActivatorWidth: m,
       onActivated: y,
       onDeactivated: A,
-      onNavigate: x,
-      ref: w,
-      show: u,
-      type: T,
+      onNavigate: u,
+      ref: T,
+      show: N,
+      type: x,
       virtualFocus: i,
-      children: /* @__PURE__ */ I(
+      children: /* @__PURE__ */ C(
         "div",
         {
           ...o,
           className: j(
-            l,
+            c,
             b.FormElement,
             E.popover
           ),
-          ref: C,
+          ref: w,
           children: [
-            /* @__PURE__ */ t(
+            /* @__PURE__ */ t(z, { parentPopover: q(), children: /* @__PURE__ */ t(
               G,
               {
-                "data-testid": a(o["data-testid"], "activator"),
+                "data-testid": s(o["data-testid"], "activator"),
                 children: p
               }
-            ),
+            ) }),
             /* @__PURE__ */ t(
               L,
               {
-                className: f,
-                container: c,
-                "data-testid": a(o["data-testid"], "content"),
+                className: v,
+                container: l,
+                "data-testid": s(o["data-testid"], "content"),
                 displayMode: e,
                 style: {
-                  ...U(r, s),
+                  ...U(r, m),
                   ...o.style
                 },
                 virtualFocus: i,
@@ -87,9 +89,9 @@ const q = ({
       )
     }
   );
-}, m = N(q);
-m.Align = S;
-m.Type = R;
+}, a = I(B);
+a.Align = S;
+a.Type = R;
 export {
-  m as IressPopover
+  a as IressPopover
 };

package/dist/components/Popover/PopoverProvider.js

@@ -1,93 +1,94 @@
-import { jsx as V } from "react/jsx-runtime";
-import { createContext as _, forwardRef as k, useRef as q, useMemo as f } from "react";
-import { o as U, b as $, f as y, s as z, c as G, d as X, e as B, g as J, h as K, i as L, j as Q } from "../../floating-ui.react-D_ysmiM3.js";
-import { POPOVER_USE_MAX_HEIGHT as W } from "./Popover.types.js";
-import { usePopoverState as Y } from "./hooks/usePopoverState.js";
-import { usePopoverNavigation as Z } from "./hooks/usePopoverNavigation.js";
+import { jsx as _ } from "react/jsx-runtime";
+import { createContext as k, forwardRef as q, useRef as U, useMemo as f } from "react";
+import { o as $, b as y, f as z, s as G, c as X, d as B, e as J, g as K, h as L, i as Q, j as W } from "../../floating-ui.react-RKRjRgyj.js";
+import { POPOVER_USE_MAX_HEIGHT as Y } from "./Popover.types.js";
+import { usePopoverState as Z } from "./hooks/usePopoverState.js";
+import { usePopoverNavigation as A } from "./hooks/usePopoverNavigation.js";
 import { usePopoverAria as T } from "./hooks/usePopoverAria.js";
-import { usePopoverImperativeHandle as A } from "./hooks/usePopoverImperativeHandle.js";
-import { focusableElements as D } from "../../helpers/dom/focusableElements.js";
-const ee = _(
+import { usePopoverImperativeHandle as D } from "./hooks/usePopoverImperativeHandle.js";
+import { focusableElements as ee } from "../../helpers/dom/focusableElements.js";
+const oe = k(
   void 0
-), oe = k(
+), te = q(
   ({
     align: x,
-    children: C,
+    children: I,
     defaultShow: E,
     disabledAutoToggle: n,
-    focusStartIndex: I,
+    focusStartIndex: R,
     matchActivatorWidth: P,
     onActivated: c,
     onDeactivated: m,
-    onNavigate: R,
+    onNavigate: S,
     type: i,
-    show: S,
+    show: b,
     virtualFocus: u
-  }, b) => {
-    const p = x === "auto", h = q(null), r = Y({
+  }, g) => {
+    const p = x === "auto", h = U(null), r = Z({
       defaultShow: E,
-      show: S
-    }), g = f(() => {
+      show: b
+    }), M = f(() => {
       const e = [
-        U(5),
-        p ? $() : y(),
-        z()
+        $(5),
+        p ? y() : z(),
+        G()
       ];
       return P && e.push(
-        G({
-          apply({ rects: s, availableHeight: t, elements: H }) {
+        X({
+          apply({ rects: s, availableHeight: t, elements: V }) {
             requestAnimationFrame(() => {
-              Object.assign(H.floating.style, {
+              Object.assign(V.floating.style, {
                 width: `${s.reference.width}px`,
-                maxHeight: t > W ? `${t}px` : void 0
+                maxHeight: t > Y ? `${t}px` : void 0
               });
             });
           },
           padding: 5
         })
       ), e;
-    }, [p, P]), o = X({
+    }, [p, P]), o = B({
       open: r.show,
       onOpenChange: (e, s, t) => {
         r.setShow(e), e ? c == null || c(s, t, a) : m == null || m(s, t, a);
       },
-      middleware: g,
+      middleware: M,
       placement: p ? void 0 : x,
-      whileElementsMounted: Q
-    }), M = B(o.context, {
-      enabled: !n
+      whileElementsMounted: W
     }), N = J(o.context, {
       enabled: !n
     }), j = K(o.context, {
+      enabled: !n
+    }), F = L(o.context, {
       role: i
-    }), { activeIndex: a, list: w, listNav: F } = Z(
+    }), { activeIndex: a, list: d, listNav: H, setActiveIndex: v } = A(
       o.context,
       i,
       {
         focusItemOnOpen: !0,
         virtual: u
       },
-      R,
-      I
-    ), l = T(), d = L([M, N, j, F]), v = f(() => u ? {
+      S,
+      R
+    ), l = T(), w = Q([N, j, F, H]), O = f(() => u ? {
       getVirtualFocus: () => h.current,
       setVirtualFocus: (e) => {
         h.current = e;
       }
-    } : {}, [u]), O = f(
+    } : {}, [u]), C = f(
       () => ({
         ...l,
         ...r,
-        ...v,
+        ...O,
         api: o,
         activeIndex: a,
         disabledAutoToggle: n,
         getFocusableActivator: () => {
           const e = o.elements.reference;
-          return (e == null ? void 0 : e.querySelector("[role=combobox]")) ?? D(e)[0];
+          return (e == null ? void 0 : e.querySelector("[role=combobox]")) ?? ee(e)[0];
         },
-        interactions: d,
-        list: w,
+        interactions: w,
+        list: d,
+        setActiveIndex: v,
         setShowWithReason: (e, s, t) => o.context.onOpenChange(e, s, t),
         type: i
       }),
@@ -96,18 +97,19 @@ const ee = _(
         o,
         l,
         n,
-        d,
         w,
+        d,
+        v,
         r,
         i,
-        v
+        O
       ]
     );
-    return A(b, o, l, r, O), /* @__PURE__ */ V(ee.Provider, { value: O, children: C });
+    return D(g, o, l, r, C), /* @__PURE__ */ _(oe.Provider, { value: C, children: I });
   }
 );
-oe.displayName = "PopoverProvider";
+te.displayName = "PopoverProvider";
 export {
-  ee as PopoverContext,
-  oe as PopoverProvider
+  oe as PopoverContext,
+  te as PopoverProvider
 };

package/dist/components/Popover/components/NestedPopoverActivator.js

@@ -0,0 +1,9 @@
+import { jsx as r } from "react/jsx-runtime";
+import { p as e } from "../../../floating-ui.react-RKRjRgyj.js";
+const m = ({
+  children: t,
+  parentPopover: o
+}) => o ? /* @__PURE__ */ r(e, { elementsRef: o.list, children: t }) : t;
+export {
+  m as NestedPopoverActivator
+};

package/dist/components/Popover/components/PopoverActivator.js

@@ -1,11 +1,11 @@
 import { jsx as d } from "react/jsx-runtime";
-import { s as u } from "../../../Popover.module-COHnD5HM.js";
+import { s as u } from "../../../Popover.module-BVX_vz5-.js";
 import { PopoverCssClass as l } from "../Popover.types.js";
 import { usePopover as m } from "../hooks/usePopover.js";
 import { useRef as A, useMemo as g, useEffect as b } from "react";
 import { focusableElements as v } from "../../../helpers/dom/focusableElements.js";
 import { usePopoverActivatorInteractions as T } from "../hooks/usePopoverActivatorInteractions.js";
-import { c as x } from "../../../index-Cu0xwYjD.js";
+import { c as x } from "../../../index-2QXL0WYc.js";
 const P = [
   "aria-controls",
   "aria-expanded",

package/dist/components/Popover/components/PopoverContent.js

@@ -1,8 +1,8 @@
 import { jsx as n } from "react/jsx-runtime";
-import { c } from "../../../index-Cu0xwYjD.js";
-import { s as m } from "../../../Popover.module-COHnD5HM.js";
+import { c } from "../../../index-2QXL0WYc.js";
+import { s as m } from "../../../Popover.module-BVX_vz5-.js";
 import { usePopover as F } from "../hooks/usePopover.js";
-import { k as g, F as h, l as p, m as i, n as P, p as I, q as N } from "../../../floating-ui.react-D_ysmiM3.js";
+import { k as g, F as h, l as p, m as i, n as P, p as I, q as N } from "../../../floating-ui.react-RKRjRgyj.js";
 import { composePopoverFloatingProps as x } from "../helpers/composeFloatingProps.js";
 const l = ({
   children: e,