@iress-oss/ids-components 6.0.0-alpha.0 → 6.0.0-alpha.1

package/dist/components/Menu/Menu.js

@@ -1,95 +1,95 @@
-import { jsx as u } from "react/jsx-runtime";
-import { useContext as w, useMemo as s, useCallback as z, useEffect as E, createContext as G } from "react";
+import { jsx as p } from "react/jsx-runtime";
+import { createContext as w, useContext as z, useMemo as s, useCallback as E, useEffect as G } from "react";
 import { useControlledState as H } from "../../hooks/useControlledState.js";
 import { useIdIfNeeded as K } from "../../hooks/useIdIfNeeded.js";
-import { C as R } from "../../floating-ui.react-CPN4oQCc.js";
-import { s as b } from "../../factory-DHLOr79I.js";
+import { C as R } from "../../floating-ui.react-CmSaAiNF.js";
+import { s as v } from "../../factory-oPXoMw9H.js";
 import { toArray as q } from "../../helpers/formatting/toArray.js";
 import { menu as B } from "./Menu.styles.js";
 import { c as D } from "../../cx-DN21T1EH.js";
 import { PopoverContext as F } from "../Popover/hooks/usePopover.js";
 import { GlobalCSSClass as J } from "../../enums.js";
 function L() {
-  return G(void 0);
+  return w(void 0);
 }
 function O() {
   return Q;
 }
-const Q = L(), et = ({
-  changeOnBlur: m,
-  className: M,
-  defaultSelected: A,
-  fluid: v,
+const Q = L(), to = ({
+  changeOnBlur: f,
+  className: b,
+  defaultSelected: M,
+  fluid: A,
   id: I,
   layout: n = "stack",
-  multiSelect: e,
-  noWrap: l,
+  multiSelect: t,
+  noWrap: u,
   onChange: N,
-  role: C = "list",
+  role: m = "list",
   selected: h,
   ...k
 }) => {
-  const r = K({ id: I }), t = w(F), o = s(() => (t == null ? void 0 : t.type) === "listbox" || (t == null ? void 0 : t.type) === "menu" ? (t.setHasInnerRole(!0), t.type) : e ? "listbox" : C, [e, t, C]), P = s(() => ({
-    "aria-multiselectable": o === "listbox" && e ? !0 : void 0,
-    "aria-orientation": o === "menu" ? n === "stack" ? "vertical" : "horizontal" : void 0
-  }), [n, e, o]), i = s(
-    () => o && ["menu", "listbox"].includes(o),
-    [o]
-  ), d = s(
-    () => !t && i,
-    [t, i]
+  const r = K({ id: I }), o = z(F), e = s(() => o?.type === "listbox" || o?.type === "menu" ? (o.setHasInnerRole(!0), o.type) : t ? "listbox" : m, [t, o, m]), P = s(() => ({
+    "aria-multiselectable": e === "listbox" && t ? !0 : void 0,
+    "aria-orientation": e === "menu" ? n === "stack" ? "vertical" : "horizontal" : void 0
+  }), [n, t, e]), i = s(
+    () => e && ["menu", "listbox"].includes(e),
+    [e]
+  ), l = s(
+    () => !o && i,
+    [o, i]
   ), a = s(
-    () => o === "listbox" || !!e,
-    [o, e]
-  ), { toggleValue: x, value: f } = H({
+    () => e === "listbox" || !!t,
+    [e, t]
+  ), { toggleValue: C, value: d } = H({
     component: "IressMenu",
-    defaultValue: A,
-    multiple: e,
+    defaultValue: M,
+    multiple: t,
     onChange: N,
     propName: "selected",
     value: h
-  }), g = z(
-    (c) => !a || c === void 0 ? !1 : e ? q(f).includes(c) : f === c,
-    [e, f, a]
+  }), x = E(
+    (c) => !a || c === void 0 ? !1 : t ? q(d).includes(c) : d === c,
+    [t, d, a]
   ), y = s(
     () => ({
-      changeOnBlur: m && o === "listbox",
+      changeOnBlur: f && e === "listbox",
       hasArrowKeyNav: i,
-      isComposite: d,
-      isSelected: g,
+      isComposite: l,
+      isSelected: x,
       layout: n,
-      multiSelect: e,
-      noWrap: l,
-      role: o,
+      multiSelect: t,
+      noWrap: u,
+      role: e,
       supportsSelection: a,
-      toggle: x
+      toggle: C
     }),
     [
-      m,
+      f,
       i,
-      d,
-      g,
+      l,
+      x,
       n,
+      t,
+      u,
       e,
-      l,
-      o,
       a,
-      x
+      C
     ]
   );
-  E(() => (t != null && t.toggleAriaControls && r && t.toggleAriaControls(r, !0), () => {
-    t != null && t.toggleAriaControls && r && t.toggleAriaControls(r, !1);
-  }), [r, t]);
-  const V = B({ fluid: v, layout: n, noWrap: l, insidePopover: !!t }), p = {
+  G(() => (o?.toggleAriaControls && r && o.toggleAriaControls(r, !0), () => {
+    o?.toggleAriaControls && r && o.toggleAriaControls(r, !1);
+  }), [r, o]);
+  const V = B({ fluid: A, layout: n, noWrap: u, insidePopover: !!o }), g = {
     ...k,
     ...P,
-    className: D(M, V.root, J.Menu),
+    className: D(b, V.root, J.Menu),
     id: r,
-    role: o
+    role: e
   }, { Provider: j } = O();
-  return /* @__PURE__ */ u(j, { value: y, children: d ? /* @__PURE__ */ u(R, { loop: o === "menu", render: /* @__PURE__ */ u(b.div, { ...p }) }) : /* @__PURE__ */ u(b.div, { ...p }) });
+  return /* @__PURE__ */ p(j, { value: y, children: l ? /* @__PURE__ */ p(R, { loop: e === "menu", render: /* @__PURE__ */ p(v.div, { ...g }) }) : /* @__PURE__ */ p(v.div, { ...g }) });
 };
 export {
-  et as IressMenu,
+  to as IressMenu,
   Q as MenuContext
 };

package/dist/components/Menu/Menu.styles.js

@@ -1,4 +1,4 @@
-import { s as e } from "../../sva-TRyehFkb.js";
+import { s as e } from "../../sva-OmxClA9g.js";
 const o = e({
   slots: ["root", "item", "checkboxMark", "append", "contents", "text"],
   base: {

package/dist/components/Menu/MenuDivider/MenuDivider.js

@@ -1,22 +1,22 @@
-import { jsx as e } from "react/jsx-runtime";
+import { jsx as t } from "react/jsx-runtime";
 import { useContext as i } from "react";
-import { MenuContext as s } from "../Menu.js";
-import { IressDivider as m } from "../../Divider/Divider.js";
+import { MenuContext as m } from "../Menu.js";
+import { IressDivider as s } from "../../Divider/Divider.js";
 import "../../Divider/Divider.styles.js";
-import { c as a } from "../../../cx-DN21T1EH.js";
-import { GlobalCSSClass as l } from "../../../enums.js";
+import { c as n } from "../../../cx-DN21T1EH.js";
+import { GlobalCSSClass as a } from "../../../enums.js";
 const d = ({
   className: r,
-  ...t
+  ...e
 }) => {
-  const o = i(s);
-  return /* @__PURE__ */ e(
-    m,
+  const o = i(m);
+  return /* @__PURE__ */ t(
+    s,
     {
-      ...t,
-      className: a(r, l.MenuDivider),
-      role: (o == null ? void 0 : o.role) === "menu" ? void 0 : "presentation",
-      vertical: (o == null ? void 0 : o.layout) && o.layout !== "stack"
+      ...e,
+      className: n(r, a.MenuDivider),
+      role: o?.role === "menu" ? void 0 : "presentation",
+      vertical: o?.layout && o.layout !== "stack"
     }
   );
 };

package/dist/components/Menu/MenuItem/MenuItem.js

@@ -1,189 +1,187 @@
-import { jsx as p, jsxs as F, Fragment as G } from "react/jsx-runtime";
-import { forwardRef as J, useContext as H, useRef as Q, useMemo as a, useCallback as L, useImperativeHandle as X, cloneElement as Y } from "react";
-import { useMenuItemRole as Z } from "./hooks/useMenuItemRole.js";
-import { idsLogger as _ } from "../../../helpers/utility/idsLogger.js";
-import { MenuContext as B } from "../Menu.js";
-import { IressCheckboxMark as T } from "../../CheckboxMark/CheckboxMark.js";
+import { jsx as l, jsxs as K, Fragment as U } from "react/jsx-runtime";
+import { forwardRef as H, useContext as W, useRef as L, useMemo as n, useCallback as B, useImperativeHandle as V, cloneElement as $ } from "react";
+import { useMenuItemRole as q } from "./hooks/useMenuItemRole.js";
+import { idsLogger as z } from "../../../helpers/utility/idsLogger.js";
+import { MenuContext as J } from "../Menu.js";
+import { IressCheckboxMark as Q } from "../../CheckboxMark/CheckboxMark.js";
 import "../../CheckboxMark/CheckboxMark.styles.js";
-import { propagateTestid as K } from "../../../helpers/utility/propagateTestid.js";
-import { c as D } from "../../../cva-B2x59Dph.js";
-import { c as $ } from "../../../cx-DN21T1EH.js";
-import { s as tt } from "../../../is-valid-prop-DFFvE05x.js";
-import { menu as et } from "../Menu.styles.js";
+import { propagateTestid as X } from "../../../helpers/utility/propagateTestid.js";
+import { c as Y } from "../../../css-fGu_jDvv.js";
+import { c as Z } from "../../../cx-DN21T1EH.js";
+import { s as _ } from "../../../is-valid-prop-Ce0wiweq.js";
+import { menu as T } from "../Menu.styles.js";
 import "../../Popover/Popover.js";
 import "../../Popover/Popover.styles.js";
-import "../../../InputPopover-BWWuoQZ2.js";
-import { usePopoverItem as rt } from "../../Popover/hooks/usePopoverItem.js";
-import { a as st } from "../../../floating-ui.react-CPN4oQCc.js";
-import { IressMenuDivider as ot } from "../MenuDivider/MenuDivider.js";
-import { PopoverContext as it } from "../../Popover/hooks/usePopover.js";
-import { GlobalCSSClass as at } from "../../../enums.js";
-import { spreadUnlessUndefined as lt } from "../../../helpers/utility/spreadUnlessUndefined.js";
-const ct = ({
-  append: b,
-  canToggle: h,
-  children: I,
-  className: m,
-  "data-testid": S,
-  divider: V,
-  element: P,
-  onBlur: g,
-  onClick: l,
-  onKeyDown: c,
-  prepend: v,
-  selected: u,
-  value: i,
-  ...N
-}, q) => {
-  const t = H(B), s = H(it), n = Z(), k = Q(null), o = a(() => (t != null && t.supportsSelection && u && _(
+import "../../Popover/InputPopover/InputPopover.js";
+import { usePopoverItem as ee } from "../../Popover/hooks/usePopoverItem.js";
+import { a as te } from "../../../floating-ui.react-CmSaAiNF.js";
+import { IressMenuDivider as re } from "../MenuDivider/MenuDivider.js";
+import { PopoverContext as oe } from "../../Popover/hooks/usePopover.js";
+import { GlobalCSSClass as se } from "../../../enums.js";
+import { spreadUnlessUndefined as ne } from "../../../helpers/utility/spreadUnlessUndefined.js";
+const ie = ({
+  append: c,
+  canToggle: m,
+  children: h,
+  className: x,
+  "data-testid": a,
+  divider: D,
+  element: k,
+  onBlur: y,
+  onClick: p,
+  onKeyDown: f,
+  prepend: d,
+  selected: S,
+  value: s,
+  ...M
+}, F) => {
+  const e = W(J), b = W(oe), u = q(), w = L(null), r = n(() => (e?.supportsSelection && S && z(
     "IressMenuItem: The selected prop on IressMenuItem does not work when used inside an IressMenu with role=listbox or the multiSelect prop set to true. Use the selected prop on IressMenu instead."
-  ), t != null && t.supportsSelection ? t.isSelected(i) : u), [t, u, i]), y = a(
+  ), e?.supportsSelection ? e.isSelected(s) : S), [e, S, s]), C = n(
     () => ({
-      "aria-current": t != null && t.supportsSelection ? void 0 : o,
-      "aria-selected": t != null && t.supportsSelection ? o : void 0
+      "aria-current": e?.supportsSelection ? void 0 : r,
+      "aria-selected": e?.supportsSelection ? r : void 0
     }),
-    [t == null ? void 0 : t.supportsSelection, o]
-  ), A = L(
-    (e) => {
-      var r, U, W;
-      l == null || l(e), !e.defaultPrevented && (t != null && t.supportsSelection && t.toggle(i, h || t != null && t.multiSelect ? !o : !0), t != null && t.hasArrowKeyNav && !(t != null && t.multiSelect) && ((r = s == null ? void 0 : s.setShow) == null || r.call(s, !1), (W = (U = s == null ? void 0 : s.getFocusableActivator) == null ? void 0 : U.call(s)) == null || W.focus()));
+    [e?.supportsSelection, r]
+  ), P = B(
+    (t) => {
+      p?.(t), !t.defaultPrevented && (e?.supportsSelection && e.toggle(s, m || e?.multiSelect ? !r : !0), e?.hasArrowKeyNav && !e?.multiSelect && (b?.setShow?.(!1), b?.getFocusableActivator?.()?.focus(), b?.resetActiveIndex()));
     },
-    [h, t, l, s, o, i]
-  ), E = L(
-    (e) => {
-      c == null || c(e), !e.defaultPrevented && e.key === "Tab" && t != null && t.supportsSelection && t != null && t.changeOnBlur && (t == null || t.toggle(i, !0));
+    [m, e, p, b, r, s]
+  ), A = B(
+    (t) => {
+      f?.(t), !t.defaultPrevented && t.key === "Tab" && e?.supportsSelection && e?.changeOnBlur && e?.toggle(s, !0);
     },
-    [t, c, i]
-  ), z = a(
+    [e, f, s]
+  ), G = n(
     () => ({
-      onBlur: (e) => {
-        const r = new Event("blur", {
+      onBlur: (t) => {
+        const o = new Event("blur", {
           bubbles: !0
         });
-        Object.defineProperty(r, "target", {
+        Object.defineProperty(o, "target", {
           writable: !1,
-          value: { value: "", ...e.target }
-        }), Object.defineProperty(r, "relatedTarget", {
+          value: { value: "", ...t.target }
+        }), Object.defineProperty(o, "relatedTarget", {
           writable: !1,
-          value: { value: "", ...e.target }
-        }), g == null || g(r), !r.defaultPrevented && t != null && t.supportsSelection && t != null && t.changeOnBlur && (t == null || t.toggle(i, !0));
+          value: { value: "", ...t.target }
+        }), y?.(o), !o.defaultPrevented && e?.supportsSelection && e?.changeOnBlur && e?.toggle(s, !0);
       },
-      onKeyDown: (e) => {
-        if (e.key === "Enter") {
-          const r = new Event("click", {
+      onKeyDown: (t) => {
+        if (t.key === "Enter") {
+          const o = new Event("click", {
             bubbles: !0
           });
-          if (Object.defineProperty(r, "target", {
+          if (Object.defineProperty(o, "target", {
             writable: !1,
-            value: { value: "", ...e.target }
-          }), l == null || l(r), r.defaultPrevented)
+            value: { value: "", ...t.target }
+          }), p?.(o), o.defaultPrevented)
             return;
-          e.preventDefault(), t == null || t.toggle(
-            i,
-            h || t != null && t.multiSelect ? !o : !0
+          t.preventDefault(), e?.toggle(
+            s,
+            m || e?.multiSelect ? !r : !0
           );
         }
-        c == null || c(e);
+        f?.(t);
       }
     }),
-    [h, t, g, l, c, o, i]
-  ), { isActiveInPopover: O, ...d } = rt(
+    [m, e, y, p, f, r, s]
+  ), { isActiveInPopover: N, ...v } = ee(
     void 0,
-    z
-  ), f = a(
-    () => et({
-      hasAppendOrPrepend: !!(b ?? v ?? (t == null ? void 0 : t.multiSelect)),
-      isActiveInPopover: O,
-      layout: t == null ? void 0 : t.layout,
-      multiSelect: !!(t != null && t.multiSelect),
-      noWrap: t == null ? void 0 : t.noWrap,
-      selected: o
+    G
+  ), i = n(
+    () => T({
+      hasAppendOrPrepend: !!(c ?? d ?? e?.multiSelect),
+      isActiveInPopover: N,
+      layout: e?.layout,
+      multiSelect: !!e?.multiSelect,
+      noWrap: e?.noWrap,
+      selected: r
     }),
     [
-      b,
-      O,
-      t == null ? void 0 : t.layout,
-      t == null ? void 0 : t.multiSelect,
-      t == null ? void 0 : t.noWrap,
-      v,
-      o
+      c,
+      N,
+      e?.layout,
+      e?.multiSelect,
+      e?.noWrap,
+      d,
+      r
     ]
-  ), j = a(() => t != null && t.multiSelect ? /* @__PURE__ */ p(
-    T,
+  ), E = n(() => e?.multiSelect ? /* @__PURE__ */ l(
+    Q,
     {
-      checked: o,
-      className: f.checkboxMark,
-      "data-testid": K(S, "checkbox-mark")
+      checked: r,
+      className: i.checkboxMark,
+      "data-testid": X(a, "checkbox-mark")
     }
-  ) : v, [
-    f.checkboxMark,
-    S,
-    t == null ? void 0 : t.multiSelect,
-    v,
-    o
-  ]), [w, x] = a(
-    () => tt(N),
-    [N]
-  ), C = a(
+  ) : d, [
+    i.checkboxMark,
+    a,
+    e?.multiSelect,
+    d,
+    r
+  ]), [O, I] = n(
+    () => _(M),
+    [M]
+  ), j = n(
     () => ({
-      ...y,
-      children: /* @__PURE__ */ F(G, { children: [
-        j,
-        I && /* @__PURE__ */ p("span", { className: f.contents, children: I }),
-        b && /* @__PURE__ */ p("span", { className: f.append, children: b })
+      ...C,
+      children: /* @__PURE__ */ K(U, { children: [
+        E,
+        h && /* @__PURE__ */ l("span", { className: i.contents, children: h }),
+        c && /* @__PURE__ */ l("span", { className: i.append, children: c })
       ] }),
-      className: $(
-        m,
-        f.item,
-        D(w),
-        at.MenuItem
+      className: Z(
+        x,
+        i.item,
+        Y(O),
+        se.MenuItem
       ),
-      "data-testid": S,
-      id: d.id,
-      onClick: A,
-      onKeyDown: E,
-      ref: (e) => {
-        var r;
-        t != null && t.isComposite || (r = d.ref) == null || r.call(d, e), e && (k.current = e);
+      "data-testid": a,
+      id: v.id,
+      onClick: P,
+      onKeyDown: A,
+      ref: (t) => {
+        e?.isComposite || v.ref?.(t), t && (w.current = t);
       },
-      role: n === "listitem" ? void 0 : n,
-      tabIndex: t != null && t.hasArrowKeyNav ? d.tabIndex : void 0
+      role: u === "listitem" ? void 0 : u,
+      tabIndex: e?.hasArrowKeyNav ? v.tabIndex : void 0
     }),
     [
-      b,
-      y,
-      I,
-      m,
-      f.append,
-      f.contents,
-      f.item,
-      S,
+      c,
+      C,
+      h,
+      x,
+      i.append,
+      i.contents,
+      i.item,
+      a,
+      P,
       A,
+      e?.hasArrowKeyNav,
+      e?.isComposite,
+      v,
       E,
-      t == null ? void 0 : t.hasArrowKeyNav,
-      t == null ? void 0 : t.isComposite,
-      d,
-      j,
-      n,
-      w
+      u,
+      O
     ]
-  ), M = a(() => {
-    const e = P ?? (x.href ? "a" : "button"), r = e === "button" ? { type: "button" } : {};
-    return /* @__PURE__ */ p(
-      e,
+  ), g = n(() => {
+    const t = k ?? (I.href ? "a" : "button"), o = t === "button" ? { type: "button" } : {};
+    return /* @__PURE__ */ l(
+      t,
       {
-        ...lt(C, x),
-        ...r
+        ...ne(j, I),
+        ...o
       }
     );
-  }, [P, x, C]);
-  X(q, () => k.current);
-  const R = a(() => n === "listitem" ? /* @__PURE__ */ p("span", { role: "listitem", children: M }) : M, [M, n]);
-  return /* @__PURE__ */ F(G, { children: [
-    t != null && t.isComposite ? /* @__PURE__ */ p(st, { render: (e) => Y(R, e) }) : R,
-    V && /* @__PURE__ */ p(ot, { mt: "spacing.100" })
+  }, [k, I, j]);
+  V(F, () => w.current);
+  const R = n(() => u === "listitem" ? /* @__PURE__ */ l("span", { role: "listitem", children: g }) : g, [g, u]);
+  return /* @__PURE__ */ K(U, { children: [
+    e?.isComposite ? /* @__PURE__ */ l(te, { render: (t) => $(R, t) }) : R,
+    D && /* @__PURE__ */ l(re, { mt: "spacing.100" })
   ] });
-}, jt = J(ct);
+}, Ae = H(ie);
 export {
-  jt as IressMenuItem
+  Ae as IressMenuItem
 };

package/dist/components/Menu/MenuItem/hooks/useMenuItemRole.js

@@ -1,10 +1,10 @@
-import { useContext as r } from "react";
+import { useContext as t } from "react";
 import { MenuContext as n } from "../../Menu.js";
 import { PopoverContext as i } from "../../../Popover/hooks/usePopover.js";
-const l = () => {
-  const t = r(n), o = r(i), e = (t == null ? void 0 : t.role) ?? (o == null ? void 0 : o.type);
-  return e === "listbox" ? "option" : e === "menu" ? "menuitem" : e === "list" ? "listitem" : void 0;
+const s = () => {
+  const e = t(n), r = t(i), o = e?.role ?? r?.type;
+  return o === "listbox" ? "option" : o === "menu" ? "menuitem" : o === "list" ? "listitem" : void 0;
 };
 export {
-  l as useMenuItemRole
+  s as useMenuItemRole
 };