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

package/dist/components/Popover/helpers/handlePopoverTabKey.js

@@ -1,32 +1,29 @@
-import { t as c } from "../../../index.esm-BnSuefUA.js";
-import { FOCUSABLE_QUERY_SELECTOR as l } from "../../../constants.js";
-import { focusableElements as u } from "../../../helpers/dom/focusableElements.js";
-import { waitUntilTrue as m } from "./waitUntilTrue.js";
-const g = async (t, a) => {
+import { t as o } from "../../../index.esm-CL8gh5wr.js";
+import { FOCUSABLE_QUERY_SELECTOR as c } from "../../../constants.js";
+import { focusableElements as l } from "../../../helpers/dom/focusableElements.js";
+import { waitUntilTrue as u } from "./waitUntilTrue.js";
+const E = async (t, a) => {
   if (a.key !== "Tab")
     return;
   const i = t.api.elements.reference;
   if (!i)
     return;
   let n = i;
-  if (!n.matches(l)) {
-    const e = u(i);
+  if (!n.matches(c)) {
+    const e = l(i);
     n = e[e.length - 1];
   }
   if (a.shiftKey && (t.setShow(!1), n.focus()), !a.shiftKey) {
     t.setShowWithReason(!1);
-    const e = c(document.documentElement).filter(
-      (r) => {
-        var o;
-        return !((o = t.api.elements.floating) != null && o.contains(r)) && !r.hasAttribute("data-floating-ui-focus-guard");
-      }
+    const e = o(document.documentElement).filter(
+      (r) => !t.api.elements.floating?.contains(r) && !r.hasAttribute("data-floating-ui-focus-guard")
     ), f = e.indexOf(n), s = e[f + 1];
     if (f === -1 || !s) return;
-    await m(
+    await u(
       () => !s.hasAttribute("data-floating-ui-inert")
     ), s.focus();
   }
 };
 export {
-  g as handlePopoverTabKey
+  E as handlePopoverTabKey
 };

package/dist/components/Popover/hooks/usePopover.js

@@ -1,139 +1,143 @@
-import { createContext as z, useRef as I, useMemo as p, useCallback as V } from "react";
-import { useControlledState as K } from "../../../hooks/useControlledState.js";
-import { o as E, j as M, i as T, s as W, m as X, u as A, n as B, b as J, c as L, d as Q, p as Y } from "../../../floating-ui.react-CPN4oQCc.js";
+import { createContext as z, useRef as V, useMemo as p, useCallback as x } from "react";
+import { useControlledState as D } from "../../../hooks/useControlledState.js";
+import { o as A, j as E, i as K, s as T, m as W, u as X, n as B, b as J, c as L, d as Q, p as Y } from "../../../floating-ui.react-BetVZ099.js";
 import { usePopoverNavigation as Z } from "./usePopoverNavigation.js";
-import { focusableElements as D } from "../../../helpers/dom/focusableElements.js";
-import { usePopoverAria as ee } from "./usePopoverAria.js";
-import { closestCrossShadow as oe } from "../../../helpers/dom/closestCrossShadow.js";
+import { focusableElements as ee } from "../../../helpers/dom/focusableElements.js";
+import { usePopoverAria as oe } from "./usePopoverAria.js";
+import { closestCrossShadow as te } from "../../../helpers/dom/closestCrossShadow.js";
 import { GlobalCSSClass as se } from "../../../enums.js";
-const te = 200, de = ({
+const ne = 200, fe = ({
   align: i = "auto",
-  autoHighlight: N = !0,
-  component: k = "IressPopover",
-  defaultShow: v,
-  focusStartIndex: H,
-  hasInputActivator: l,
-  matchActivatorWidth: x,
-  onActivated: m,
-  onDeactivated: d,
+  autoHighlight: I = !0,
+  component: M = "IressPopover",
+  defaultShow: N,
+  focusStartIndex: d,
+  hasInputActivator: a,
+  matchActivatorWidth: v,
+  onActivated: k,
+  onDeactivated: H,
   onNavigate: _,
   show: $,
-  type: a,
-  virtualFocus: r
+  type: l,
+  virtualFocus: n
 }) => {
-  const w = I(!1), C = I(null), {
+  const w = V(!1), C = V(null), {
     isControlled: h,
     setValue: f,
-    value: n
-  } = K({
-    component: k,
-    defaultValue: v,
+    value: r
+  } = D({
+    component: M,
+    defaultValue: N,
     propName: "show",
     value: $
   }), j = p(() => {
-    const e = l ? [E(5), M({ padding: 5 })] : [
-      E(5),
-      i === "auto" ? T() : M(),
-      W((s) => ({
-        mainAxis: !oe(
-          s.elements.reference,
+    const e = a ? [A(5), E({ padding: 5 })] : [
+      A(5),
+      i === "auto" ? K() : E(),
+      T((t) => ({
+        mainAxis: !te(
+          t.elements.reference,
           `.${se.Slideout}`
         )
       }))
     ];
-    return x ? [
+    return v ? [
       ...e,
-      X({
-        apply({ rects: s, availableHeight: t, elements: y }) {
+      W({
+        apply({ rects: t, availableHeight: s, elements: y }) {
           requestAnimationFrame(() => {
             Object.assign(y.floating.style, {
-              minWidth: `${s.reference.width}px`,
-              maxHeight: t > te ? `${t}px` : void 0
+              minWidth: `${t.reference.width}px`,
+              maxHeight: s > ne ? `${s}px` : void 0
             });
           });
         },
         padding: 5
       })
     ] : e;
-  }, [x, l, i]), o = A({
-    open: n,
-    onOpenChange: (e, s, t) => {
-      f(e), e ? m == null || m(s, t, u) : d == null || d(s, t, u);
+  }, [v, a, i]), o = X({
+    open: r,
+    onOpenChange: (e, t, s) => {
+      f(e), e ? k?.(t, s, c) : H?.(t, s, c);
     },
     middleware: j,
     placement: i === "auto" ? void 0 : i,
     whileElementsMounted: Y
-  }), { activeIndex: u, list: S, listNav: q, setActiveIndex: b } = Z(
+  }), { activeIndex: c, list: b, listNav: q, setActiveIndex: u } = Z(
     o.context,
-    a,
+    l,
     {
-      focusItemOnOpen: N,
-      virtual: r
+      focusItemOnOpen: I,
+      virtual: n
     },
     _,
-    H
+    d
   ), F = B(o.context, {
-    enabled: !l
+    enabled: !a
   }), G = J(o.context, {
     enabled: !0,
-    escapeKey: !l
+    escapeKey: !a
   }), U = L(o.context, {
-    role: a
-  }), P = ee(), g = Q([F, G, U, q]), O = p(() => r ? {
+    role: l
+  }), S = oe(), P = Q([F, G, U, q]), g = p(() => n ? {
     getVirtualFocus: () => C.current,
     setVirtualFocus: (e) => {
       C.current = e;
     }
-  } : {}, [r]), c = V(() => {
+  } : {}, [n]), m = x(() => {
     const e = o.elements.reference;
-    return (e == null ? void 0 : e.querySelector("[role=combobox]")) ?? D(e)[0];
-  }, [o.elements.reference]), R = V(
-    (e) => !e || !n ? !1 : e === c(),
-    [c, n]
-  );
+    return e?.querySelector("[role=combobox]") ?? ee(e)[0];
+  }, [o.elements.reference]), O = x(
+    (e) => !e || !r ? !1 : e === m(),
+    [m, r]
+  ), R = x(() => {
+    u(d ?? null);
+  }, [d, u]);
   return p(
     () => ({
-      activeIndex: u,
-      ...P,
+      activeIndex: c,
+      ...S,
       api: o,
-      getFocusableActivator: c,
+      getFocusableActivator: m,
       hasInnerRole: () => w.current,
-      interactions: g,
-      isActiveActivator: R,
+      interactions: P,
+      isActiveActivator: O,
       isControlled: h,
-      isVirtualFocus: !!r,
-      list: S,
-      setActiveIndex: b,
+      isVirtualFocus: !!n,
+      list: b,
+      resetActiveIndex: R,
+      setActiveIndex: u,
       setShow: f,
       setShowWithReason: o.context.onOpenChange,
       setHasInnerRole: (e) => {
         w.current = e;
       },
-      show: !!n,
-      type: a,
-      ...O
+      show: !!r,
+      type: l,
+      ...g
     }),
     [
-      u,
+      c,
       o,
+      S,
+      m,
       P,
-      c,
-      g,
-      R,
+      O,
       h,
-      S,
       b,
+      R,
+      u,
       f,
-      n,
-      a,
-      O,
-      r
+      r,
+      l,
+      g,
+      n
     ]
   );
-}, fe = z(
+}, pe = z(
   void 0
 );
 export {
-  fe as PopoverContext,
-  de as usePopover
+  pe as PopoverContext,
+  fe as usePopover
 };

package/dist/components/Popover/hooks/usePopoverActivatorInteractions.js

@@ -1,36 +1,33 @@
-import { useCallback as D } from "react";
-const x = (n, t) => {
-  const u = D(
-    (i) => {
-      var a;
-      (a = t == null ? void 0 : t.onBlur) == null || a.call(t, i);
+import { useCallback as s } from "react";
+const c = (t, n) => {
+  const a = s(
+    (e) => {
+      n?.onBlur?.(e);
     },
-    [t]
-  ), s = D(
-    (i) => {
-      var a;
-      n != null && n.show ? c(i, n) : n && k(i, n), (a = t == null ? void 0 : t.onKeyDown) == null || a.call(t, i);
+    [n]
+  ), i = s(
+    (e) => {
+      t?.show ? l(e, t) : t && o(e, t), n?.onKeyDown?.(e);
     },
-    [t, n]
+    [n, t]
   );
   return {
-    onBlur: u,
-    onKeyDown: s
+    onBlur: a,
+    onKeyDown: i
   };
-}, c = (n, t) => {
-  var s, i, a, g, h, d, y;
-  const u = (t == null ? void 0 : t.getVirtualFocus) !== void 0;
-  if ((a = (i = (s = t == null ? void 0 : t.getVirtualFocus) == null ? void 0 : s.call(t)) == null ? void 0 : i.onKeyDown) == null || a.call(i, n), n.key === "Tab" && ((d = (h = (g = t == null ? void 0 : t.getVirtualFocus) == null ? void 0 : g.call(t)) == null ? void 0 : h.onBlur) == null || d.call(h, n), t != null && t.getVirtualFocus && (t == null || t.setShowWithReason(!1, n.nativeEvent, "focus"))), n.key === "PageUp" && u && t.setActiveIndex(0), n.key === "PageDown" && u) {
-    const l = Math.max((t == null ? void 0 : t.list.current.length) - 1, 0);
-    t.setActiveIndex(l);
+}, l = (t, n) => {
+  const a = n?.getVirtualFocus !== void 0;
+  if (n?.getVirtualFocus?.()?.onKeyDown?.(t), t.key === "Tab" && (n?.getVirtualFocus?.()?.onBlur?.(t), n?.getVirtualFocus && n?.setShowWithReason(!1, t.nativeEvent, "focus")), t.key === "PageUp" && a && n.setActiveIndex(0), t.key === "PageDown" && a) {
+    const i = Math.max(n?.list.current.length - 1, 0);
+    n.setActiveIndex(i);
   }
-  if (n.key === "ArrowUp" && (t == null ? void 0 : t.activeIndex) === 0 && (t == null || t.setShowWithReason(!1, n.nativeEvent, "focus")), n.key === "ArrowRight" && n.isDefaultPrevented() && n.target instanceof HTMLInputElement && ((y = n.target.value) != null && y.length)) {
-    const l = n.target, w = l.selectionStart ?? 0;
-    w < l.value.length && l.setSelectionRange(w + 1, w + 1);
+  if (t.key === "ArrowUp" && n?.activeIndex === 0 && n?.setShowWithReason(!1, t.nativeEvent, "focus"), t.key === "ArrowRight" && t.isDefaultPrevented() && t.target instanceof HTMLInputElement && t.target.value?.length) {
+    const i = t.target, e = i.selectionStart ?? 0;
+    e < i.value.length && i.setSelectionRange(e + 1, e + 1);
   }
-}, k = (n, t) => {
-  n.key === "ArrowDown" && (t == null || t.setShowWithReason(!0, n.nativeEvent, "focus"));
+}, o = (t, n) => {
+  t.key === "ArrowDown" && n?.setShowWithReason(!0, t.nativeEvent, "focus");
 };
 export {
-  x as usePopoverActivatorInteractions
+  c as usePopoverActivatorInteractions
 };

package/dist/components/Popover/hooks/usePopoverItem.js

@@ -1,21 +1,20 @@
-import { h as f } from "../../../floating-ui.react-CPN4oQCc.js";
-import { useContext as m, useId as d, useMemo as x, useEffect as I } from "react";
-import { PopoverContext as a } from "./usePopover.js";
-const C = (i, s = null) => {
-  const t = m(a), { ref: r, index: u } = f({ label: i }), o = d(), e = u === (t == null ? void 0 : t.activeIndex), c = x(() => {
-    if (t)
-      return e && !(t != null && t.isVirtualFocus) ? 0 : -1;
-  }, [e, t]);
-  return I(() => {
-    var n;
-    e && ((n = t == null ? void 0 : t.setVirtualFocus) == null || n.call(t, s));
-  }, [e, t, s]), {
-    id: o,
-    isActiveInPopover: e,
-    ref: r,
-    tabIndex: t ? c : void 0
+import { h as c } from "../../../floating-ui.react-BetVZ099.js";
+import { useContext as p, useId as f, useMemo as m, useEffect as v } from "react";
+import { PopoverContext as d } from "./usePopover.js";
+const l = (r, t = null) => {
+  const e = p(d), { ref: s, index: n } = c({ label: r }), i = f(), o = n === e?.activeIndex, u = m(() => {
+    if (e)
+      return o && !e?.isVirtualFocus ? 0 : -1;
+  }, [o, e]);
+  return v(() => {
+    o && e?.setVirtualFocus?.(t);
+  }, [o, e, t]), {
+    id: i,
+    isActiveInPopover: o,
+    ref: s,
+    tabIndex: e ? u : void 0
   };
 };
 export {
-  C as usePopoverItem
+  l as usePopoverItem
 };

package/dist/components/Popover/hooks/usePopoverNavigation.js

@@ -1,32 +1,32 @@
-import { useMemo as a, useState as O, useEffect as R, useRef as r } from "react";
-import { x as d } from "../../../floating-ui.react-CPN4oQCc.js";
-const A = (l, n, e, t, i = 0) => {
-  const s = a(
-    () => !!(n && ["menu", "listbox"].includes(n)),
-    [n]
-  ), f = a(() => s ? e == null ? void 0 : e.focusItemOnOpen : !1, [e == null ? void 0 : e.focusItemOnOpen, s]), [o, u] = O(null);
-  R(() => {
-    l.open ? u(f ? i : null) : u(null);
-  }, [l.open, f, i]);
-  const c = r([]), v = r(null), I = d(l, {
-    ...e,
-    activeIndex: o,
-    enabled: s,
+import { useMemo as r, useState as O, useEffect as N, useRef as c } from "react";
+import { x as R } from "../../../floating-ui.react-BetVZ099.js";
+const b = (s, e, o, m, u = 0) => {
+  const t = r(
+    () => !!(e && ["menu", "listbox"].includes(e)),
+    [e]
+  ), l = r(() => t ? o?.focusItemOnOpen : !1, [o?.focusItemOnOpen, t]), [i, n] = O(null);
+  N(() => {
+    s.open ? n(l ? u : null) : n(null);
+  }, [s.open, l, u]);
+  const a = c([]), v = c(null), I = R(s, {
+    ...o,
+    activeIndex: i,
+    enabled: t,
     focusItemOnHover: !1,
-    listRef: c,
-    loop: n === "menu",
-    onNavigate: (m) => {
-      u(m), t == null || t(m);
+    listRef: a,
+    loop: e === "menu",
+    onNavigate: (f) => {
+      n(f), m?.(f);
     },
     virtualItemRef: v
   });
   return {
-    activeIndex: o,
-    list: c,
+    activeIndex: i,
+    list: a,
     listNav: I,
-    setActiveIndex: u
+    setActiveIndex: n
   };
 };
 export {
-  A as usePopoverNavigation
+  b as usePopoverNavigation
 };

package/dist/components/Popover/index.js

@@ -1,10 +1,10 @@
 import { IressPopover as e } from "./Popover.js";
-import { popover as s } from "./Popover.styles.js";
-import { I as m } from "../../InputPopover-BWWuoQZ2.js";
-import { usePopoverItem as f } from "./hooks/usePopoverItem.js";
+import { popover as t } from "./Popover.styles.js";
+import { IressInputPopover as s } from "./InputPopover/InputPopover.js";
+import { usePopoverItem as v } from "./hooks/usePopoverItem.js";
 export {
-  m as IressInputPopover,
+  s as IressInputPopover,
   e as IressPopover,
-  s as popover,
-  f as usePopoverItem
+  t as popover,
+  v as usePopoverItem
 };

package/dist/components/Progress/Progress.js

@@ -1,62 +1,56 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useState as v, useEffect as M } from "react";
-import { stringReplacer as b } from "../../helpers/formatting/stringReplacer.js";
-import { c as x } from "../../cva-B2x59Dph.js";
-import { c as C } from "../../cx-DN21T1EH.js";
-import { progress as h } from "./Progress.styles.js";
-import { s as c } from "../../factory-DHLOr79I.js";
-import { s as N } from "../../is-valid-prop-DFFvE05x.js";
-import { GlobalCSSClass as V } from "../../enums.js";
-import { t as j } from "../../index-DlGwAtoO.js";
-const A = ({
+import { jsx as m } from "react/jsx-runtime";
+import { stringReplacer as v } from "../../helpers/formatting/stringReplacer.js";
+import { c as P } from "../../css-fGu_jDvv.js";
+import { c as S } from "../../cx-DN21T1EH.js";
+import { progress as y } from "./Progress.styles.js";
+import { s as n } from "../../factory-oPXoMw9H.js";
+import { s as b } from "../../is-valid-prop-Ce0wiweq.js";
+import { GlobalCSSClass as x } from "../../enums.js";
+import { t as C } from "../../index-CZ9ot38T.js";
+const V = ({
   borderRadius: e,
   className: p,
   max: r = 100,
   min: s,
-  sectionTitle: f = "Progress is {{current}} of {{max}}",
-  style: u,
-  value: o = 0,
-  ...d
+  sectionTitle: c = "Progress is {{current}} of {{max}}",
+  style: f,
+  value: u = 0,
+  ...g
 }) => {
-  const [t, g] = v(o), [S, a] = N(d), l = C(
+  const [d, t] = b(g), a = S(
     p,
-    x(h.raw(), S),
-    V.Progress
-  ), i = () => b(f, [
-    { name: "{{current}}", value: String(t) },
+    P(y.raw(), d),
+    x.Progress
+  ), o = Math.min(Math.max(u, s ?? 0), r), i = () => v(c, [
+    { name: "{{current}}", value: String(o) },
     { name: "{{max}}", value: r.toString() }
-  ]);
-  M(() => {
-    const P = Math.max(o, s ?? 0), y = Math.min(P, r);
-    g(y);
-  }, [o, s, r]);
-  const m = {
-    "--iress-border-radius": e ? j(`radii.${e}`) : void 0,
-    ...u
+  ]), l = {
+    "--iress-border-radius": e ? C(`radii.${e}`) : void 0,
+    ...f
   };
-  return s !== void 0 ? /* @__PURE__ */ n(
-    c.meter,
+  return s !== void 0 ? /* @__PURE__ */ m(
+    n.meter,
     {
       "aria-label": i(),
-      className: l,
+      className: a,
       max: r,
       min: s,
-      value: t,
-      ...a,
-      style: m
+      value: o,
+      ...t,
+      style: l
     }
-  ) : /* @__PURE__ */ n(
-    c.progress,
+  ) : /* @__PURE__ */ m(
+    n.progress,
     {
       "aria-label": i(),
-      className: l,
+      className: a,
       max: r,
-      value: t,
-      ...a,
-      style: m
+      value: o,
+      ...t,
+      style: l
     }
   );
 };
 export {
-  A as IressProgress
+  V as IressProgress
 };

package/dist/components/Progress/Progress.styles.js

@@ -1,4 +1,4 @@
-import { a as r } from "../../cva-B2x59Dph.js";
+import { c as r } from "../../cva-JiDXAa83.js";
 const e = r({
   base: {
     appearance: "none",
@@ -13,20 +13,20 @@ const e = r({
     _progressBar: {
       bg: "transparent",
       height: "progress.height",
-      margin: "spacing.000"
+      margin: "spacing.0"
     },
     _progressValue: {
       appearance: "none",
       bg: "[currentColor]",
       borderRadius: "var(--iress-border-radius)",
-      margin: "spacing.000",
+      margin: "spacing.0",
       transition: "all"
     },
     _mozProgressValue: {
       appearance: "none",
       bg: "[currentColor]",
       borderRadius: "var(--iress-border-radius)",
-      margin: "spacing.000",
+      margin: "spacing.0",
       transition: "all"
     }
   }

package/dist/components/Provider/Provider.js

@@ -1,43 +1,20 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import "react/jsx-runtime";
 import "../Modal/Modal.styles.js";
 import "react";
-import "../../Button-BXzmntRi.js";
+import "../../Button-mmhMLwp9.js";
 import "../Button/CloseButton/CloseButton.js";
-import { IressModalProvider as l } from "../Modal/ModalProvider.js";
-import { I as n } from "../../ToasterProvider-XqpAGfRs.js";
+import "../Modal/hooks/useModal.js";
+import "../Modal/ModalProvider.js";
+import "../Toaster/ToasterProvider.js";
+import "../Toaster/hooks/useToaster.js";
 import "../Toaster/Toaster.styles.js";
 import "../Toaster/components/Toast/Toast.styles.js";
 import "../Slideout/Slideout.styles.js";
-import "../../index-DlGwAtoO.js";
-import { IressSlideoutProvider as h } from "../Slideout/SlideoutProvider.js";
-import { createPortal as e } from "react-dom";
-import { s as f } from "../../typography--vGt_ztU.js";
-const q = ({
-  children: i,
-  container: o,
-  noDefaultFont: m,
-  noIcons: t,
-  position: p,
-  ...d
-}) => /* @__PURE__ */ c(l, { container: o, children: [
-  /* @__PURE__ */ r(n, { container: o, position: p, children: /* @__PURE__ */ r(h, { container: o, ...d, children: i }) }),
-  !m && e(
-    f.map((s) => /* @__PURE__ */ r("link", { rel: "stylesheet", href: s }, s)),
-    document.head,
-    "design-system-font"
-  ),
-  !t && e(
-    /* @__PURE__ */ r(
-      "link",
-      {
-        rel: "stylesheet",
-        href: "https://cdn.iress.com/icons/5.15.4/css/combined.min.css"
-      }
-    ),
-    document.head,
-    "design-system-icons"
-  )
-] });
+import "../../index-CZ9ot38T.js";
+import "../Slideout/hooks/useSlideout.js";
+import "../Slideout/SlideoutProvider.js";
+import "react-dom";
+import { I as h } from "../../Provider-8wS70V56.js";
 export {
-  q as IressProvider
+  h as IressProvider
 };

package/dist/components/Provider/index.js

@@ -1,4 +1,4 @@
-import { IressProvider as o } from "./Provider.js";
+import { I as o } from "../../Provider-8wS70V56.js";
 export {
   o as IressProvider
 };