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

package/dist/components/Slider/Slider.js

@@ -1,112 +1,112 @@
-import { jsx as u, jsxs as F } from "react/jsx-runtime";
-import { c as R } from "../../cx-DN21T1EH.js";
-import { slider as w } from "./Slider.styles.js";
-import { forwardRef as A, useCallback as h } from "react";
-import { propagateTestid as b } from "../../helpers/utility/propagateTestid.js";
-import { SliderTicks as D } from "./components/SliderTicks.js";
-import { useControlledState as G } from "../../hooks/useControlledState.js";
-import { useIdIfNeeded as L } from "../../hooks/useIdIfNeeded.js";
-import { IressReadonly as q } from "../Readonly/Readonly.js";
+import { jsx as c, jsxs as x } from "react/jsx-runtime";
+import { c as F } from "../../cx-DN21T1EH.js";
+import { slider as R } from "./Slider.styles.js";
+import { forwardRef as T, useCallback as N } from "react";
+import { propagateTestid as f } from "../../helpers/utility/propagateTestid.js";
+import { SliderTicks as w } from "./components/SliderTicks.js";
+import { useControlledState as A } from "../../hooks/useControlledState.js";
+import { useIdIfNeeded as D } from "../../hooks/useIdIfNeeded.js";
+import { IressReadonly as G } from "../Readonly/Readonly.js";
 import "../Readonly/Readonly.styles.js";
-import { s as z } from "../../factory-DHLOr79I.js";
-import { s as B } from "../../is-valid-prop-DFFvE05x.js";
-import { GlobalCSSClass as E } from "../../enums.js";
-import { useNoDefaultValueInForms as H } from "../../patterns/Form/hooks/useNoDefaultValueInForms.js";
-const J = (r = 0, c = 10, d = 1) => {
-  const l = [];
-  for (let i = r; i <= c; i += d) l.push(i);
-  return l;
-}, K = ({
+import { s as W } from "../../factory-oPXoMw9H.js";
+import { s as q } from "../../is-valid-prop-Ce0wiweq.js";
+import { GlobalCSSClass as z } from "../../enums.js";
+import { useNoDefaultValueInForms as B } from "../../patterns/Form/hooks/useNoDefaultValueInForms.js";
+const E = (r = 0, i = 10, n = 1) => {
+  const o = [];
+  for (let l = r; l <= i; l += n) o.push(l);
+  return o;
+}, H = ({
   "data-testid": r,
-  defaultValue: c,
-  className: d,
-  formatValue: l,
-  hiddenValueTooltip: i,
+  defaultValue: i,
+  className: n,
+  formatValue: o,
+  hiddenValueTooltip: l,
   max: a = 10,
   min: s = 0,
-  onChange: n,
-  readOnly: f,
-  step: S = 1,
-  style: I,
-  tickLabels: v,
-  value: N,
-  ...o
-}, $) => {
-  H({
+  onChange: g,
+  readOnly: m,
+  step: b = 1,
+  style: y,
+  tickLabels: S,
+  value: h,
+  ...u
+}, C) => {
+  B({
     component: "IressSelect",
-    defaultValue: c
+    defaultValue: i
   });
-  const y = L({ id: o == null ? void 0 : o.id }), m = (typeof v == "boolean" ? J(s, a, S) : v ?? []).map(
-    (t) => typeof t == "number" ? { value: t } : t
-  ), { value: e, setValue: g } = G({
+  const v = D({ id: u?.id }), d = (typeof S == "boolean" ? E(s, a, b) : S ?? []).map(
+    (e) => typeof e == "number" ? { value: e } : e
+  ), { value: t, setValue: I } = A({
     component: "IressSlider",
-    defaultValue: N ? void 0 : c ?? s,
-    value: N
-  }), k = h(() => {
-    const t = m == null ? void 0 : m.find((C) => C.value === e);
-    return l ? l(e ?? 0, t, f) : (t == null ? void 0 : t.label) ?? e;
-  }, [m, l, e, f]), M = h(() => {
-    const t = Math.min(
-      Number(((e ?? 0) - s) * 100 / (a - s)),
+    defaultValue: h ? void 0 : i ?? s,
+    value: h
+  }), k = N(() => {
+    const e = d?.find((j) => j.value === t);
+    return o ? o(t ?? 0, e, m) : e?.label ?? t;
+  }, [d, o, t, m]), $ = N(() => {
+    const e = Math.min(
+      Number(((t ?? 0) - s) * 100 / (a - s)),
       100
     );
-    return `calc(${t}% + ((1.75rem / 2) - ${t * 0.285}px))`;
-  }, [a, s, e]);
-  if (f)
-    return /* @__PURE__ */ u(
-      q,
+    return `calc(${e}% + ((1.75rem / 2) - ${e * 0.285}px))`;
+  }, [a, s, t]);
+  if (m)
+    return /* @__PURE__ */ c(
+      G,
       {
-        "data-testid": b(r, "slider"),
-        name: o == null ? void 0 : o.name,
-        value: e,
+        "data-testid": f(r, "slider"),
+        name: u?.name,
+        value: t,
         children: k()
       }
     );
-  const p = w(), [V, j] = B(o), x = {
-    ...I,
-    "--iress-thumb-value-offset": M()
+  const p = R(), [L, M] = q(u), V = {
+    ...y,
+    "--iress-thumb-value-offset": $()
   };
-  return /* @__PURE__ */ F(
-    z.div,
+  return /* @__PURE__ */ x(
+    W.div,
     {
-      ...V,
-      className: R(d, p.root, E.Slider),
-      style: x,
+      ...L,
+      className: F(n, p.root, z.Slider),
+      style: V,
       "data-testid": r,
       children: [
-        !i && /* @__PURE__ */ u("output", { className: p.thumbValue, children: k() }),
-        /* @__PURE__ */ u(
+        !l && /* @__PURE__ */ c("output", { className: p.thumbValue, children: k() }),
+        /* @__PURE__ */ c(
           "input",
           {
             className: p.control,
             max: a,
             min: s,
-            step: S,
-            ...j,
-            value: e,
+            step: b,
+            ...M,
+            value: t,
             type: "range",
-            onChange: (t) => {
-              n == null || n(t, Number(t.target.value)), g(Number(t.target.value));
+            onChange: (e) => {
+              g?.(e, Number(e.target.value)), I(Number(e.target.value));
             },
-            ref: $,
-            list: `${y}--markers`,
-            "data-testid": b(r, "slider")
+            ref: C,
+            list: `${v}--markers`,
+            "data-testid": f(r, "slider")
           }
         ),
-        /* @__PURE__ */ u(
-          D,
+        /* @__PURE__ */ c(
+          w,
           {
-            tickLabels: m,
-            id: `${y}--markers`,
+            tickLabels: d,
+            id: `${v}--markers`,
             max: a,
             min: s,
-            "data-testid": b(r, "datalist")
+            "data-testid": f(r, "datalist")
           }
         )
       ]
     }
   );
-}, lt = A(K);
+}, le = T(H);
 export {
-  lt as IressSlider
+  le as IressSlider
 };

package/dist/components/Slider/Slider.styles.js

@@ -1,4 +1,4 @@
-import { s as e } from "../../sva-TRyehFkb.js";
+import { s as e } from "../../sva-OmxClA9g.js";
 const i = e({
   slots: [
     "root",

package/dist/components/Slider/components/SliderTicks.js

@@ -1,11 +1,10 @@
-import { jsx as d, jsxs as v } from "react/jsx-runtime";
-import { slider as m } from "../Slider.styles.js";
-import { c as n } from "../../../cx-DN21T1EH.js";
+import { jsx as o, jsxs as v } from "react/jsx-runtime";
+import { slider as n } from "../Slider.styles.js";
+import { c as d } from "../../../cx-DN21T1EH.js";
 import { propagateTestid as f } from "../../../helpers/utility/propagateTestid.js";
-import { s as u } from "../../../factory-DHLOr79I.js";
+import { s as u } from "../../../factory-oPXoMw9H.js";
 const N = (t, s, e, i, a) => {
-  var r;
-  const c = s === 0 ? t - a : t - (((r = e[s - 1]) == null ? void 0 : r.value) ?? 0);
+  const c = s === 0 ? t - a : t - (e[s - 1]?.value ?? 0);
   return `${Number(c / (i - a) * 100)}%`;
 }, T = ({
   allTickLabels: t,
@@ -15,34 +14,34 @@ const N = (t, s, e, i, a) => {
   min: a,
   tickLabel: c
 }) => {
-  const l = m(), { className: r, label: k, value: o, ...p } = c, h = {
+  const l = n(), { className: m, label: k, value: r, ...p } = c, h = {
     "--iress-tick-label-width": N(
-      o,
+      r,
       e,
       t,
       i,
       a
     )
   };
-  return /* @__PURE__ */ v("div", { className: n(l.tickMark), style: h, children: [
-    /* @__PURE__ */ d("option", { value: o, "data-testid": s }),
-    /* @__PURE__ */ d(
+  return /* @__PURE__ */ v("div", { className: d(l.tickMark), style: h, children: [
+    /* @__PURE__ */ o("option", { value: r, "data-testid": s }),
+    /* @__PURE__ */ o(
       u.div,
       {
         ...p,
-        className: n(l.tickMarkLabel, r),
-        children: k ?? `${o}`
+        className: d(l.tickMarkLabel, m),
+        children: k ?? `${r}`
       }
     )
-  ] }, o);
+  ] }, r);
 }, g = ({
   max: t = 10,
   min: s = 0,
   tickLabels: e = [],
   ...i
 }) => {
-  const a = m();
-  return /* @__PURE__ */ d("datalist", { className: a.tickMarkList, ...i, children: e.map((c, l) => /* @__PURE__ */ d(
+  const a = n();
+  return /* @__PURE__ */ o("datalist", { className: a.tickMarkList, ...i, children: e.map((c, l) => /* @__PURE__ */ o(
     T,
     {
       allTickLabels: e,

package/dist/components/Spinner/Spinner.styles.js

@@ -1,4 +1,4 @@
-import { a } from "../../cva-B2x59Dph.js";
+import { c as a } from "../../cva-JiDXAa83.js";
 const o = a({
   base: {
     boxSizing: "border-box"

package/dist/components/Stack/Stack.js

@@ -1,7 +1,7 @@
 import { jsx as t } from "react/jsx-runtime";
 import { useMemo as a } from "react";
 import { stack as c } from "./Stack.styles.js";
-import { s as i } from "../../factory-DHLOr79I.js";
+import { s as i } from "../../factory-oPXoMw9H.js";
 import { GlobalCSSClass as p } from "../../enums.js";
 import { c as f } from "../../cx-DN21T1EH.js";
 const n = ({

package/dist/components/Stack/Stack.styles.js

@@ -1,5 +1,5 @@
-import { a as e } from "../../cva-B2x59Dph.js";
-const a = e({
+import { c as e } from "../../cva-JiDXAa83.js";
+const i = e({
   base: {
     display: "flex",
     flexDirection: "column",
@@ -23,5 +23,5 @@ const a = e({
   }
 });
 export {
-  a as stack
+  i as stack
 };

package/dist/components/TabSet/Tab/Tab.js

@@ -1,145 +1,145 @@
-import { jsxs as I, Fragment as L, jsx as m } from "react/jsx-runtime";
-import { forwardRef as D, useRef as M, useContext as N, useImperativeHandle as R, useLayoutEffect as $, useCallback as g, useMemo as j } from "react";
-import { idsLogger as F } from "../../../helpers/utility/idsLogger.js";
-import { useIdIfNeeded as K } from "../../../hooks/useIdIfNeeded.js";
-import { createPortal as q } from "react-dom";
-import { s as G } from "../../../factory-DHLOr79I.js";
-import { tab as U } from "./Tab.styles.js";
-import { c as Y } from "../../../cx-DN21T1EH.js";
-import { a as h } from "../../../floating-ui.react-CPN4oQCc.js";
-import { focusableElements as z } from "../../../helpers/dom/focusableElements.js";
-import { GlobalCSSClass as B } from "../../../enums.js";
-import { TabSetContext as J } from "../TabSetProvider.js";
-const O = (a, e, i, n) => {
-  var s;
-  const t = a.querySelector("[id]"), r = t == null ? void 0 : t.getAttribute("id");
-  t == null || t.removeAttribute("id"), a.removeAttribute("tabindex"), a.removeAttribute("data-active"), a.removeAttribute("aria-selected"), (s = i.ref) == null || s.call(i, e), e.tabIndex = n ? 0 : -1, n ? e.setAttribute("data-active", "") : e.removeAttribute("data-active"), r && e.setAttribute("id", r), e.setAttribute("aria-selected", String(n));
-}, Q = ({
-  activate: a,
+import { jsxs as k, Fragment as E, jsx as u } from "react/jsx-runtime";
+import { forwardRef as M, useRef as L, useContext as D, useImperativeHandle as N, useLayoutEffect as R, useCallback as S, useMemo as $ } from "react";
+import { idsLogger as j } from "../../../helpers/utility/idsLogger.js";
+import { useIdIfNeeded as F } from "../../../hooks/useIdIfNeeded.js";
+import { createPortal as H } from "react-dom";
+import { s as K } from "../../../factory-oPXoMw9H.js";
+import { tab as q } from "./Tab.styles.js";
+import { c as G } from "../../../cx-DN21T1EH.js";
+import { a as U } from "../../../floating-ui.react-CmSaAiNF.js";
+import { focusableElements as W } from "../../../helpers/dom/focusableElements.js";
+import { GlobalCSSClass as Y } from "../../../enums.js";
+import { TabSetContext as z } from "../TabSetProvider.js";
+const B = (i, e, s, n) => {
+  const t = i.querySelector("[id]"), r = t?.getAttribute("id");
+  t?.removeAttribute("id"), i.removeAttribute("tabindex"), i.removeAttribute("data-active"), i.removeAttribute("aria-selected"), s.ref?.(e), e.tabIndex = n ? 0 : -1, n ? e.setAttribute("data-active", "") : e.removeAttribute("data-active"), r && e.setAttribute("id", r), e.setAttribute("aria-selected", String(n));
+}, J = ({
+  activate: i,
   children: e,
-  selected: i,
+  selected: s,
   ...n
-}) => /* @__PURE__ */ m(
-  h,
+}) => /* @__PURE__ */ u(
+  U,
   {
-    render: (t) => /* @__PURE__ */ m(
+    render: (t) => /* @__PURE__ */ u(
       "div",
       {
         ...n,
         ...t,
-        "aria-selected": i,
-        onClick: () => a(),
-        onKeyDown: (r) => ["Space", "Enter"].includes(r.key) && a(),
+        "aria-selected": s,
+        onClick: () => i(),
+        onKeyDown: (r) => ["Space", "Enter"].includes(r.key) && i(),
         ref: (r) => {
           if (!r) return;
-          const s = z(r)[0];
-          s && O(
+          const m = W(r)[0];
+          m && B(
             r,
-            s,
+            m,
             t,
-            i
+            s
           );
         },
         children: e
       }
     )
   }
-), V = ({
-  active: a,
+), O = ({
+  active: i,
   children: e,
-  className: i,
+  className: s,
   "data-testid": n,
   href: t,
   label: r,
-  type: s = "button",
-  value: C,
-  ...l
-}, x) => {
-  const u = K({ id: l.id }), b = M(null), c = N(J), { register: p, unregister: A, setHover: d } = c ?? {}, { onMouseEnter: v, onMouseLeave: w } = l;
-  R(x, () => b.current), $(() => {
-    const o = b.current;
+  type: m = "button",
+  value: v,
+  ...b
+}, T) => {
+  const c = F({ id: b.id }), d = L(null), a = D(z), { register: A, unregister: g, setHover: f } = a ?? {}, { onMouseEnter: w, onMouseLeave: y } = b;
+  N(T, () => d.current), R(() => {
+    const o = d.current;
     if (o)
-      return p == null || p(o, C), () => A == null ? void 0 : A(o);
-  }, [p, A, C]);
-  const y = c ? c.isActive(b.current) : a, S = Y(
-    i,
-    U({ active: y, insideTabSet: !!c }),
-    B.Tab
-  ), k = g(
+      return A?.(o, v), () => g?.(o);
+  }, [A, g, v]);
+  const p = a ? a.isActive(d.current) : i, h = G(
+    s,
+    q({ active: p, insideTabSet: !!a }),
+    Y.Tab
+  ), x = S(
     (o) => {
-      v == null || v(o), d == null || d(o.currentTarget);
+      w?.(o), f?.(o.currentTarget);
     },
-    [v, d]
-  ), E = g(
+    [w, f]
+  ), I = S(
     (o) => {
-      w == null || w(o), d == null || d();
+      y?.(o), f?.();
     },
-    [w, d]
-  ), T = j(
-    () => G(t ? "a" : "button"),
+    [y, f]
+  ), C = $(
+    () => K(t ? "a" : "button"),
     [t]
   );
-  if (e && t && F(
+  if (e && t && j(
     "IressTab: You should not use `children` with `href` prop, as the `children` will be seen before the page navigates."
-  ), c) {
-    const o = e && y;
-    return /* @__PURE__ */ I(L, { children: [
-      /* @__PURE__ */ m(
-        Q,
+  ), a) {
+    const o = e && p;
+    return /* @__PURE__ */ k(E, { children: [
+      /* @__PURE__ */ u(
+        J,
         {
-          activate: () => c.activate(b.current),
-          selected: y,
-          children: /* @__PURE__ */ m(
-            T,
+          activate: () => a.activate(d.current),
+          selected: p,
+          children: /* @__PURE__ */ u(
+            C,
             {
-              className: S,
-              "aria-controls": e ? `${u}--panel` : void 0,
+              className: h,
+              "aria-controls": e ? `${c}--panel` : void 0,
               role: "tab",
               "data-testid": n,
-              ...l,
+              ...b,
               href: t,
-              id: u,
-              onMouseEnter: k,
-              onMouseLeave: E,
-              ref: b,
-              type: s,
+              id: c,
+              onMouseEnter: x,
+              onMouseLeave: I,
+              ref: d,
+              type: m,
               children: r
             }
           )
         }
       ),
-      o && c.panel && q(
-        /* @__PURE__ */ m(
+      a.panel && H(
+        /* @__PURE__ */ u(
           "div",
           {
-            "aria-labelledby": u,
-            id: `${u}--panel`,
+            "aria-labelledby": c,
+            id: `${c}--panel`,
             role: "tabpanel",
-            onKeyDown: (f) => {
-              (f.key === "ArrowLeft" || f.key === "ArrowRight" || f.key === "ArrowUp" || f.key === "ArrowDown") && f.stopPropagation();
+            onKeyDown: (l) => {
+              (l.key === "ArrowLeft" || l.key === "ArrowRight" || l.key === "ArrowUp" || l.key === "ArrowDown") && l.stopPropagation();
             },
+            hidden: !o,
             children: e
           }
         ),
-        c.panel,
-        `${u}--panel`
+        a.panel,
+        `${c}--panel`
       )
     ] });
   }
-  return /* @__PURE__ */ m(
-    T,
+  return /* @__PURE__ */ u(
+    C,
     {
-      className: S,
+      className: h,
       "data-testid": n,
-      ...l,
+      ...b,
       href: t,
-      id: u,
-      ref: b,
-      type: s,
+      id: c,
+      ref: d,
+      type: m,
       children: r
     }
   );
-}, nt = D(V);
+}, ae = M(O);
 export {
-  nt as IressTab
+  ae as IressTab
 };

package/dist/components/TabSet/Tab/Tab.styles.js

@@ -1,4 +1,4 @@
-import { a as t } from "../../../cva-B2x59Dph.js";
+import { c as t } from "../../../cva-JiDXAa83.js";
 const e = t({
   base: {
     alignItems: "center",