@orfium/ictinus 5.45.2 → 5.46.1

package/dist/components/Notification/NotificationVisual/NotificationVisual.js

@@ -1,6 +1,6 @@
 import { jsxs as l, jsx as t } from "@emotion/react/jsx-runtime";
 import { generateTestDataId as r } from "../../../utils/helpers.js";
-import { visualContainer as f, descriptionContainer as m } from "./NotificationVisual.style.js";
+import { descriptionContainer as f, visualContainer as m } from "./NotificationVisual.style.js";
 import { boldMessageContainer as u } from "../Notification.style.js";
 import v from "../subcomponents/NotificationActionsArea/NotificationActionsArea.js";
 const N = ({
@@ -13,9 +13,9 @@ const N = ({
   dataTestId: i
 }) => {
   const d = o && s || n && e;
-  return /* @__PURE__ */ l("div", { css: f(), children: [
+  return /* @__PURE__ */ l("div", { css: m(), children: [
     /* @__PURE__ */ t("div", { css: u(), "data-testid": r("visual-title", i), children: a }),
-    /* @__PURE__ */ t("div", { css: m(), "data-testid": r("visual-description", i), children: c }),
+    /* @__PURE__ */ t("div", { css: f(), "data-testid": r("visual-description", i), children: c }),
     d && /* @__PURE__ */ t(v, { primaryCTA: o, primaryCTALabel: s, secondaryCTA: n, secondaryCTALabel: e, dataTestPrefixId: "visual", dataTestId: i })
   ] });
 };

package/dist/components/Notification/Snackbar/Snackbar.js

@@ -1,9 +1,9 @@
 import { jsxs as r, jsx as o } from "@emotion/react/jsx-runtime";
 import { vars as a } from "@orfium/tokens";
 import { generateTestDataId as d } from "../../../utils/helpers.js";
-import { iconContainer as k, typeToColorStyle as x, boldMessageContainer as C, actionContainer as b } from "../Notification.style.js";
+import { typeToColorStyle as k, iconContainer as x, boldMessageContainer as C, actionContainer as b } from "../Notification.style.js";
 import { typeToIconName as u } from "../subcomponents/CompactNotification/CompactNotification.js";
-import { cardContainer as g, topContainer as j, infoContainer as z, descriptionContainer as I } from "./Snackbar.style.js";
+import { infoContainer as g, topContainer as j, descriptionContainer as z, cardContainer as I } from "./Snackbar.style.js";
 import l from "../../Icon/Icon.js";
 import N from "../subcomponents/NotificationActionsArea/NotificationActionsArea.js";
 const B = ({
@@ -21,16 +21,15 @@ const B = ({
   const v = e && t || s && c;
   return (
     // @TODO remove the below or change to data-
-    // eslint-disable-next-line react/no-unknown-property
-    /* @__PURE__ */ r("div", { css: g(i, f), "notification-type": "snackbar", children: [
+    /* @__PURE__ */ r("div", { css: I(i, f), "notification-type": "snackbar", children: [
       /* @__PURE__ */ r("div", { css: j(), children: [
-        /* @__PURE__ */ r("div", { css: z(), children: [
-          /* @__PURE__ */ o("div", { css: k(), children: /* @__PURE__ */ o(l, { name: u(i), color: a.color.text.default[x(i)], size: 24 }) }),
+        /* @__PURE__ */ r("div", { css: g(), children: [
+          /* @__PURE__ */ o("div", { css: x(), children: /* @__PURE__ */ o(l, { name: u(i), color: a.color.text.default[k(i)], size: 24 }) }),
           /* @__PURE__ */ o("div", { css: C(i), children: m })
         ] }),
         /* @__PURE__ */ o("span", { css: b(), onClick: h, "data-testid": d("snackbar-close", n), children: /* @__PURE__ */ o(l, { name: "close", color: a.color.text.default.secondary, size: 24 }) })
       ] }),
-      /* @__PURE__ */ o("div", { css: I(), "data-testid": d("snackbar-description", n), children: p }),
+      /* @__PURE__ */ o("div", { css: z(), "data-testid": d("snackbar-description", n), children: p }),
       v && /* @__PURE__ */ o(N, { primaryCTA: e, primaryCTALabel: t, secondaryCTA: s, secondaryCTALabel: c, dataTestPrefixId: "snackbar", dataTestId: n })
     ] })
   );

package/dist/components/Notification/subcomponents/CompactNotification/CompactNotification.js

@@ -1,8 +1,8 @@
 import { jsxs as c, jsx as o } from "@emotion/react/jsx-runtime";
 import { vars as l } from "@orfium/tokens";
 import { generateTestDataId as t } from "../../../../utils/helpers.js";
-import { iconContainer as C, typeToColorStyle as u, actionContainer as x } from "../../Notification.style.js";
-import { notificationsContainer as v, infoContainer as y, headContainer as g, messageContainer as b, actionsContainer as j, primaryActionContainer as k } from "./CompactNotification.style.js";
+import { typeToColorStyle as C, iconContainer as u, actionContainer as x } from "../../Notification.style.js";
+import { headContainer as v, messageContainer as y, infoContainer as g, primaryActionContainer as b, actionsContainer as j, notificationsContainer as k } from "./CompactNotification.style.js";
 import m from "../../../Icon/Icon.js";
 import z from "../../../Button/Button.js";
 const N = (e) => e === "info" ? "informational" : e, F = ({
@@ -16,16 +16,16 @@ const N = (e) => e === "info" ? "informational" : e, F = ({
   closeCTA: d,
   title: h,
   dataTestId: n
-}) => /* @__PURE__ */ c("div", { css: v(r, p), "data-testid": t(i, n), ...i == "banner" && {
+}) => /* @__PURE__ */ c("div", { css: k(r, p), "data-testid": t(i, n), ...i == "banner" && {
   "notification-type": "banner"
 }, children: [
-  /* @__PURE__ */ c("div", { css: y(), children: [
-    e && /* @__PURE__ */ o("div", { css: C(), children: /* @__PURE__ */ o(m, { name: N(r), color: l.color.text.default[u(r)], size: 24 }) }),
-    i === "banner" && /* @__PURE__ */ o("div", { css: g(), "data-testid": t(`${i}-title`, n), children: h }),
-    /* @__PURE__ */ o("div", { css: b(), "data-testid": t(`${i}-message`, n), children: f })
+  /* @__PURE__ */ c("div", { css: g(), children: [
+    e && /* @__PURE__ */ o("div", { css: u(), children: /* @__PURE__ */ o(m, { name: N(r), color: l.color.text.default[C(r)], size: 24 }) }),
+    i === "banner" && /* @__PURE__ */ o("div", { css: v(), "data-testid": t(`${i}-title`, n), children: h }),
+    /* @__PURE__ */ o("div", { css: y(), "data-testid": t(`${i}-message`, n), children: f })
   ] }),
   /* @__PURE__ */ c("div", { css: j(), children: [
-    a && s && /* @__PURE__ */ o(z, { type: "tertiary", css: k(), onClick: a, "data-testid": t("notification-primary", n), children: s }),
+    a && s && /* @__PURE__ */ o(z, { type: "tertiary", css: b(), onClick: a, "data-testid": t("notification-primary", n), children: s }),
     d && /* @__PURE__ */ o("span", { css: x(), onClick: d, "data-testid": t("notification-close", n), children: /* @__PURE__ */ o(m, { name: "close", color: l.color.text.default.secondary, size: 16 }) })
   ] })
 ] });

package/dist/components/Notification/subcomponents/CompactNotification/CompactNotification.style.js

@@ -1,5 +1,5 @@
 import { css as n } from "@emotion/react";
-import { rem as r, vars as i } from "@orfium/tokens";
+import { vars as i, rem as r } from "@orfium/tokens";
 import { notificationsContainerPerType as a } from "../../Notification.style.js";
 const g = (e, t) => (o) => /* @__PURE__ */ n("box-sizing:border-box;display:flex;justify-content:space-between;overflow:hidden;width:100%;min-height:", r(46), ";border-radius:", i["border-radius"][2], ";color:", i.color.text.default.primary, ";font-size:", i["font-size"][3], ";", a(e, t, o), ";", ""), m = () => /* @__PURE__ */ n("display:flex;align-items:center;padding:0 ", i.spacing[6], ";", ""), f = () => /* @__PURE__ */ n("padding:", i.spacing[6], " 0;", ""), l = () => /* @__PURE__ */ n("display:flex;align-items:center;padding-right:", i.spacing[6], ";font-weight:", i.weight.medium, ";", ""), h = () => /* @__PURE__ */ n("padding-right:", i.spacing[3], ";font-weight:", i.weight.medium, ";", "");
 var s = {

package/dist/components/Notification/subcomponents/NotificationActionsArea/NotificationActionsArea.js

@@ -1,6 +1,6 @@
 import { jsxs as m, jsx as t } from "@emotion/react/jsx-runtime";
 import { generateTestDataId as s } from "../../../../utils/helpers.js";
-import { actionsContainer as l, actionContainer as d } from "../../Notification.style.js";
+import { actionContainer as d, actionsContainer as l } from "../../Notification.style.js";
 import a from "../../../Button/Button.js";
 const v = ({
   primaryCTA: i,

package/dist/components/NumberField/components/Stepper/Stepper.js

@@ -2,7 +2,7 @@ import { jsxs as l, jsx as t } from "@emotion/react/jsx-runtime";
 import { vars as e } from "@orfium/tokens";
 import { rem as p } from "polished";
 import { Button as m } from "react-aria-components";
-import { stepperContainerStyle as d, buttonWrapperStyle as i } from "./Stepper.style.js";
+import { buttonWrapperStyle as i, stepperContainerStyle as d } from "./Stepper.style.js";
 import a from "../../../Icon/Icon.js";
 const x = ({
   size: r,

package/dist/components/ProgressIndicator/components/ProgressBar/ProgressBar.js

@@ -2,25 +2,23 @@ import { jsx as e } from "@emotion/react/jsx-runtime";
 import { isUndefined as n } from "lodash-es";
 import m from "react";
 import { ProgressBar as d } from "react-aria-components";
-import { progressBarContainer as l, barStyles as f, fillStyles as p } from "./ProgressBar.style.js";
+import { fillStyles as l, barStyles as f, progressBarContainer as p } from "./ProgressBar.style.js";
 const c = m.forwardRef(({
   value: r,
   status: t,
   isBlock: s = !1,
   dataTestPrefixId: a
 }, o) => {
-  const i = {
-    ...n(r) ? {
-      isIndeterminate: !0
-    } : {
-      value: r
-    }
+  const i = n(r) ? {
+    isIndeterminate: !0
+  } : {
+    value: r
   };
-  return /* @__PURE__ */ e(d, { ...i, css: l({
+  return /* @__PURE__ */ e(d, { ...i, css: p({
     isBlock: s
   }), ref: o, children: () => /* @__PURE__ */ e("div", { css: f({
     isBlock: s
-  }), className: "bar", "data-testid": `${a}_linear_progress_container`, children: /* @__PURE__ */ e("div", { css: p({
+  }), className: "bar", "data-testid": `${a}_linear_progress_container`, children: /* @__PURE__ */ e("div", { css: l({
     status: t,
     value: r,
     isBlock: s

package/dist/components/ProgressIndicator/components/ProgressBar/ProgressBar.style.js

@@ -1,5 +1,5 @@
 import { css as t } from "@emotion/react";
-import { rem as s, vars as r } from "@orfium/tokens";
+import { vars as r, rem as s } from "@orfium/tokens";
 import { isUndefined as l } from "lodash-es";
 const a = {
   height: {

package/dist/components/Search/Search.js

@@ -4,7 +4,7 @@ import m from "react";
 import I from "react-fast-compare";
 import { vars as t } from "@orfium/tokens";
 import { inputStyle as g } from "../TextInputBase/TextInputBase.style.js";
-import { searchContainer as v, getSX as C, searchInputStyles as b, filterStyles as z } from "./Search.style.js";
+import { searchInputStyles as v, getSX as C, filterStyles as b, searchContainer as z } from "./Search.style.js";
 import T from "../TextInputBase/TextInputBase.js";
 import d from "../Icon/Icon.js";
 import $ from "../Filter/Filter.js";
@@ -22,21 +22,21 @@ const f = m.forwardRef((h, p) => {
   } = h, y = a && a.length > 0, l = !!(o?.defaultValue && o?.label);
   return _(() => {
     s && s();
-  }), /* @__PURE__ */ n("div", { css: v(), "data-testid": "search_container", children: [
+  }), /* @__PURE__ */ n("div", { css: z(), "data-testid": "search_container", children: [
     /* @__PURE__ */ n(T, { dataTestPrefixId: i, isDisabled: r, sx: C({
       hasFilter: l,
       isDisabled: r,
       sx: u
     }), children: [
       /* @__PURE__ */ e(d, { name: "search", size: t.sizing[5], color: t.color.text.default.secondary }),
-      /* @__PURE__ */ e("div", { css: b(), children: /* @__PURE__ */ e("input", { type: "search", css: g({
+      /* @__PURE__ */ e("div", { css: v(), children: /* @__PURE__ */ e("input", { type: "search", css: g({
         placeholder: c
       }), placeholder: c, disabled: r, value: a, ref: p, "data-testid": `${i}_search_input`, ...S }) }),
       y && !r && /* @__PURE__ */ e(d, { name: "close", size: t.sizing[5], color: t.color.text.default.secondary, onClick: () => {
         s();
       }, dataTestId: "search-clear" })
     ] }),
-    l && /* @__PURE__ */ e("div", { css: z(), children: /* @__PURE__ */ e($, { ...o, isDisabled: r, dataTestPrefixId: `${i}_search_filter`, children: x }) })
+    l && /* @__PURE__ */ e("div", { css: b(), children: /* @__PURE__ */ e($, { ...o, isDisabled: r, dataTestPrefixId: `${i}_search_filter`, children: x }) })
   ] });
 });
 f.displayName = "Search";

package/dist/components/Search/StatefulSearch.js

@@ -2,13 +2,13 @@ import { jsx as S } from "@emotion/react/jsx-runtime";
 import v, { forwardRef as g, useState as n } from "react";
 import F from "react-fast-compare";
 import I from "./Search.js";
-const s = g((i, f) => {
+const s = g((f, i) => {
   const {
     onClear: t,
     onInput: l,
     filterConfig: e,
     ...u
-  } = i, [c, a] = n(), [d, o] = n(void 0), m = () => {
+  } = f, [c, a] = n(), [d, o] = n(void 0), m = () => {
     a(""), t && t();
   }, h = () => {
     o(void 0), e?.onClear && e?.onClear();
@@ -26,7 +26,7 @@ const s = g((i, f) => {
       ...e
     }
   } : {};
-  return /* @__PURE__ */ S(I, { ref: f, value: c, onClear: m, onInput: p, ...C, ...u });
+  return /* @__PURE__ */ S(I, { ref: i, value: c, onClear: m, onInput: p, ...C, ...u });
 });
 s.displayName = "StatefulSearch";
 const j = v.memo(s, F);

package/dist/components/Select/Select.js

@@ -4,41 +4,40 @@ import Z from "../MultiTextFieldBase/MultiTextFieldBase.js";
 import { PositionInScreen as ee } from "../utils/PositionInScreen/PositionInScreen.js";
 import _ from "../../hooks/useKeyboardEvents.js";
 import { debounce as te, differenceBy as re, head as se } from "lodash-es";
-import g, { useRef as R, useState as q, useMemo as O, useCallback as ae } from "react";
+import I, { useRef as R, useState as q, useMemo as O, useCallback as oe } from "react";
 import F from "react-fast-compare";
-import { generateUniqueID as oe, generateTestDataId as z } from "../../utils/helpers.js";
+import { generateUniqueID as ae, generateTestDataId as z } from "../../utils/helpers.js";
 import le from "../../hooks/useCombinedRefs.js";
-import { handleSearch as ie } from "../utils/handleSearch.js";
+import ie from "../utils/handleSearch.js";
 import ne from "./components/SelectMenu/SelectMenu.js";
 import { SELECT_ALL_OPTION as ce } from "./constants.js";
 import { suffixContainer as fe, selectWrapper as ue } from "./Select.style.js";
 import de from "../Box/Box.js";
 import pe from "../ProgressIndicator/ProgressIndicator.js";
 import me from "../Icon/Icon.js";
-import he from "../TextField/TextField.js";
-const Ce = {
+import Ce from "../TextField/TextField.js";
+const he = {
   label: "",
   value: ""
-}, H = g.forwardRef((W, K) => {
+}, H = I.forwardRef((W, K) => {
   const {
     selectedOption: t,
     isMulti: i,
     options: p,
     size: m = "normal",
-    isAsync: h = !1,
-    isLoading: C = !1,
+    isAsync: C = !1,
+    isLoading: h = !1,
     asyncSearch: b = () => {
     },
     status: y = {
       type: "normal"
     },
     minCharactersToSearch: D = 0,
-    hasHighlightSearch: be = !1,
-    isSearchable: o = !0,
+    isSearchable: a = !0,
     isVirtualized: U = !1,
-    isDisabled: I,
+    isDisabled: g,
     dataTestId: E,
-    onChange: a,
+    onChange: o,
     isCreatable: x = !1,
     hasSelectAllOption: $ = !1,
     ...P
@@ -66,10 +65,10 @@ const Ce = {
           }, 0);
         },
         onBackspace: () => {
-          w(""), n(!0), i || t && a && "label" in t && t.label === S && (a(void 0), v(""), b(""));
+          S(""), n(!0), i || t && o && "label" in t && t.label === w && (o(void 0), v(""), b(""));
         },
         onAlphaNumerical: () => {
-          o && n(!0);
+          a && n(!0);
         }
       }
     }
@@ -83,45 +82,45 @@ const Ce = {
         }
       }
     }
-  }), [c, n] = q(!1), Y = R(null), u = le(Y, K), [r, v] = q(""), S = O(() => Array.isArray(t) || !t ? r : r || t?.label, [r, t]), G = (e) => {
-    if (i || n(!1), o && v(""), i === !0) {
-      if (a && t)
+  }), [c, n] = q(!1), Y = R(null), u = le(Y, K), [r, v] = q(""), w = O(() => Array.isArray(t) || !t ? r : r || t?.label, [r, t]), G = (e) => {
+    if (i || n(!1), a && v(""), i === !0) {
+      if (o && t)
         if (F(e, ce))
-          a(p.filter((s) => !s.isDisabled));
+          o(p.filter((s) => !s.isDisabled));
         else if (e.isCreated) {
           const s = {
             value: e.value,
             label: e.value.toString(),
             isCreated: !0
           };
-          a([...t, s]);
+          o([...t, s]);
         } else
-          a([...t, e]);
-    } else if (a)
+          o([...t, e]);
+    } else if (o)
       if (e.isCreated) {
         const s = {
           value: e.value,
           label: e.value.toString(),
           isCreated: !0
         };
-        a(s);
+        o(s);
       } else
-        a(e);
+        o(e);
     u.current?.focus();
-  }, w = ae(te((e) => {
+  }, S = oe(te((e) => {
     b(e);
-  }, 400), []), V = g.useCallback((e) => {
+  }, 400), []), V = I.useCallback((e) => {
     c || n(!0), ie({
       event: e,
-      isSearchable: o,
-      isAsync: h,
+      isSearchable: a,
+      isAsync: C,
       setSearchValue: v,
-      onChange: w,
+      onChange: S,
       minCharactersToSearch: D
     });
-  }, [w, h, c, o, D]), k = O(() => {
+  }, [S, C, c, a, D]), k = O(() => {
     const e = i && Array.isArray(t) ? re(p, t, "value") : p, s = [];
-    return h ? s.push(...e) : s.push(...e.filter((l) => !r || l.label.toLowerCase().includes(r.toLowerCase()) || !!l.options?.find((d) => d.label.toLowerCase().includes(r.toLowerCase()))).map((l) => l.label.toLowerCase().includes(r.toLowerCase()) ? l : {
+    return C ? s.push(...e) : s.push(...e.filter((l) => !r || l.label.toLowerCase().includes(r.toLowerCase()) || !!l.options?.find((d) => d.label.toLowerCase().includes(r.toLowerCase()))).map((l) => l.label.toLowerCase().includes(r.toLowerCase()) ? l : {
       ...l,
       options: l.options?.filter((d) => d.label.toLowerCase().includes(r.toLowerCase()))
     })), x && !s.map((d) => d.label.toLowerCase()).includes(r.toLowerCase()) && r.length > 0 && s.push({
@@ -129,21 +128,21 @@ const Ce = {
       label: `Create "${r}"`,
       isCreated: !0
     }), s;
-  }, [i, p, t, h, x, r]), N = O(() => o && !Array.isArray(t) ? r || t?.value ? "close" : "search" : "triangleDown", [t, o, r]), L = g.useCallback(() => {
-    o || n(!c), o && !Array.isArray(t) && (r || t?.value) && (v(""), a && a(i ? [] : void 0), b(""));
-  }, [o, c, t, r, a, b, i]), J = O(() => /* @__PURE__ */ f("div", { css: fe(c, o), children: C ? /* @__PURE__ */ f(de, { py: "2", display: "flex", alignItems: "center", children: /* @__PURE__ */ f(pe, { type: "circular", dataTestPrefixId: "select" }) }) : /* @__PURE__ */ f(me, { size: B.sizing[m === "compact" ? "4" : "5"], name: N, color: B.color.text.default.secondary, onClick: L, hasHover: !1, dataTestId: "select-right-icon" }) }), [c, o, C, m, N, L]), Q = () => {
-    c ? o || u?.current?.blur() : u?.current?.focus();
-  }, X = x && k.length === 1 && k[0].isCreated, T = R(oe("select_")).current;
-  return /* @__PURE__ */ f("div", { ...!(I || y.type === "read-only") && {
+  }, [i, p, t, C, x, r]), N = O(() => a && !Array.isArray(t) ? r || t?.value ? "close" : "search" : "triangleDown", [t, a, r]), L = I.useCallback(() => {
+    a || n(!c), a && !Array.isArray(t) && (r || t?.value) && (v(""), o && o(i ? [] : void 0), b(""));
+  }, [a, c, t, r, o, b, i]), J = O(() => /* @__PURE__ */ f("div", { css: fe(c, a), children: h ? /* @__PURE__ */ f(de, { py: "2", display: "flex", alignItems: "center", children: /* @__PURE__ */ f(pe, { type: "circular", dataTestPrefixId: "select" }) }) : /* @__PURE__ */ f(me, { size: B.sizing[m === "compact" ? "4" : "5"], name: N, color: B.color.text.default.secondary, onClick: L, hasHover: !1, dataTestId: "select-right-icon" }) }), [c, a, h, m, N, L]), Q = () => {
+    c ? a || u?.current?.blur() : u?.current?.focus();
+  }, X = x && k.length === 1 && k[0].isCreated, T = R(ae("select_")).current;
+  return /* @__PURE__ */ f("div", { ...!(g || y.type === "read-only") && {
     onClick: Q
-  }, css: ue(), ...j, children: /* @__PURE__ */ f(ee, { id: T, isVisible: c, setIsVisible: n, hasWrapperWidth: !0, isNonModal: i || o, offsetY: 8, parent: i ? /* @__PURE__ */ f(Z, { selectedOptions: t, onInput: V, onOptionDelete: (e) => {
+  }, css: ue(), ...j, children: /* @__PURE__ */ f(ee, { id: T, isVisible: c, setIsVisible: n, hasWrapperWidth: !0, isNonModal: i || a, offsetY: 8, parent: i ? /* @__PURE__ */ f(Z, { selectedOptions: t, onInput: V, onOptionDelete: (e) => {
     const s = Array.isArray(t) ? t.filter((l) => typeof e != "string" && e ? l.value !== e.value : l.value !== e) : [];
-    a && a(s);
-  }, onClearAllOptions: () => a && a([]), isLoading: C, isDisabled: I, readOnly: !o, dataTestId: z("select-input", E), ...P, status: y, value: S, ref: u, autoComplete: "off", ...M, onClick: () => n(!0), role: "combobox", "aria-expanded": c, "aria-controls": T }) : /* @__PURE__ */ f(he, { suffix: J, ...M, onInput: V, isReadOnly: !o, isDisabled: I, dataTestId: z("select-input", E), ...P, onClick: () => n(!0), status: y, value: S, size: m, ref: u, autoComplete: "off", role: "combobox", "aria-expanded": c, "aria-controls": T }), children: /* @__PURE__ */ f(ne, { ref: A, filteredOptions: k, handleOptionClick: G, selectedOption: i === !0 || !t ? Ce : t, status: y, isLoading: C, isVirtualized: U, size: m, hasSelectAllOption: i && $ && !X }) }) });
+    o && o(s);
+  }, onClearAllOptions: () => o && o([]), isLoading: h, isDisabled: g, readOnly: !a, dataTestId: z("select-input", E), ...P, status: y, value: w, ref: u, autoComplete: "off", ...M, onClick: () => n(!0), role: "combobox", "aria-expanded": c, "aria-controls": T }) : /* @__PURE__ */ f(Ce, { suffix: J, ...M, onInput: V, isReadOnly: !a, isDisabled: g, dataTestId: z("select-input", E), ...P, onClick: () => n(!0), status: y, value: w, size: m, ref: u, autoComplete: "off", role: "combobox", "aria-expanded": c, "aria-controls": T }), children: /* @__PURE__ */ f(ne, { ref: A, filteredOptions: k, handleOptionClick: G, selectedOption: i === !0 || !t ? he : t, status: y, isLoading: h, isVirtualized: U, size: m, hasSelectAllOption: i && $ && !X }) }) });
 });
 H.displayName = "Select";
-const Ne = g.memo(H, F);
+const Ve = I.memo(H, F);
 export {
-  Ne as default,
-  Ce as emptyValue
+  Ve as default,
+  he as emptyValue
 };

package/dist/components/Select/StatefulSelect.js

@@ -1,24 +1,24 @@
 import { jsx as s } from "@emotion/react/jsx-runtime";
 import p, { forwardRef as S, useState as n, useCallback as d } from "react";
 import i from "react-fast-compare";
-import V, { emptyValue as b } from "./Select.js";
-const o = S(({
+import V, { emptyValue as _ } from "./Select.js";
+const u = S(({
   isMulti: e,
   selectedOption: t,
   onChange: a = () => {
   },
-  ...r
-}, u) => {
-  const [c, m] = n(e ? t || [] : t || b), f = d((l) => {
-    m(l), a(l);
+  ...o
+}, r) => {
+  const [c, f] = n(e ? t || [] : t || _), m = d((l) => {
+    f(l), a(l);
   }, [a]);
   return (
     // @ts-ignore
-    /* @__PURE__ */ s(V, { ...r, selectedOption: c, isMulti: e, onChange: f, ref: u })
+    /* @__PURE__ */ s(V, { ...o, selectedOption: c, isMulti: e, onChange: m, ref: r })
   );
 });
-o.displayName = "StatefulSelect";
-const _ = p.memo(o, i);
+u.displayName = "StatefulSelect";
+const R = p.memo(u, i);
 export {
-  _ as default
+  R as default
 };

package/dist/components/Select/components/SelectMenu/SelectMenu.js

@@ -4,7 +4,7 @@ import { SELECT_ALL_OPTION as r } from "../../constants.js";
 import O from "../../../../hooks/useCombinedRefs.js";
 import { head as V, flatMap as M, uniqueId as w } from "lodash-es";
 import { forwardRef as z, useRef as A, useCallback as C, useEffect as R } from "react";
-import { menuStyle as N, innerMenuStyle as k, emptyAndLoadingStyle as S, optionStyle as H } from "./SelectMenu.style.js";
+import { emptyAndLoadingStyle as S, innerMenuStyle as N, menuStyle as k, optionStyle as H } from "./SelectMenu.style.js";
 import j from "../../../List/List.js";
 import c from "../../../List/ListItem.js";
 import d from "../../../List/components/ListItemText/ListItemText.js";
@@ -37,9 +37,9 @@ const F = z((m, b) => {
     L ? /* @__PURE__ */ l(c, { rowSize: n, textValue: r.label, children: /* @__PURE__ */ l(d, { children: r.label }) }, r.value) : null,
     i.map((e) => e.options && e.options?.length > 0 ? /* @__PURE__ */ l(D, { title: e.value, children: e.options.map((t) => /* @__PURE__ */ l(c, { rowSize: n, textValue: t.label, children: /* @__PURE__ */ l(d, { description: t.helperText, children: t.label }) }, t.value)) }, e.value) : /* @__PURE__ */ l(c, { rowSize: n, textValue: e.label, children: /* @__PURE__ */ l(d, { description: e.helperText, children: e.label }) }, e.value))
   ] }) }) : /* @__PURE__ */ l("div", { css: S, children: "No options" });
-  return /* @__PURE__ */ l("div", { css: N({
+  return /* @__PURE__ */ l("div", { css: k({
     ...m
-  }), tabIndex: -1, children: /* @__PURE__ */ l("div", { css: k({
+  }), tabIndex: -1, children: /* @__PURE__ */ l("div", { css: N({
     height: f
   }), children: v ? /* @__PURE__ */ l("div", { css: S, children: "Loading..." }) : T() }) });
 });

package/dist/components/Select/components/SelectMenu/SelectMenu.style.js

@@ -1,5 +1,5 @@
 import { css as r } from "@emotion/react";
-import { rem as t, vars as o } from "@orfium/tokens";
+import { vars as o, rem as t } from "@orfium/tokens";
 import { flexCenter as n } from "../../../../theme/functions.js";
 import { generateStylesFromTokens as d } from "../../../Typography/utils.js";
 const a = {

package/dist/components/TabStepper/components/TabStep/TabStep.js

@@ -3,7 +3,7 @@ import { vars as b } from "@orfium/tokens";
 import T from "lodash-es/get";
 import g from "react";
 import { Tab as h } from "react-aria-components";
-import { stepStyles as x, stepContainer as S, stepTitle as _, stepSubtitle as I } from "./TabStep.style.js";
+import { stepTitle as x, stepSubtitle as S, stepContainer as _, stepStyles as I } from "./TabStep.style.js";
 import j from "../../../Icon/Icon.js";
 const v = {
   done: {
@@ -26,14 +26,14 @@ const v = {
     sx: p,
     ...f
   } = a, u = t !== "pending", r = t !== "pending" ? v[t] : null;
-  return /* @__PURE__ */ o(h, { id: m, ...f, ref: d, css: x(p), "data-status": t, children: l ?? /* @__PURE__ */ n("div", { css: S(), children: [
-    s && /* @__PURE__ */ n("div", { css: [_, c === "end" && {
+  return /* @__PURE__ */ o(h, { id: m, ...f, ref: d, css: I(p), "data-status": t, children: l ?? /* @__PURE__ */ n("div", { css: _(), children: [
+    s && /* @__PURE__ */ n("div", { css: [x, c === "end" && {
       justifyContent: "space-between"
     }, "", ""], "data-role": "title", "data-testid": `${e}_title`, children: [
       s,
       u && /* @__PURE__ */ o(j, { name: r.name, color: T(b.color, r.color), dataTestPrefixId: `${e}_icon` })
     ] }),
-    i && /* @__PURE__ */ o("div", { css: I(), "data-role": "subtitle", "data-testid": `${e}_subtitle`, children: i })
+    i && /* @__PURE__ */ o("div", { css: S(), "data-role": "subtitle", "data-testid": `${e}_subtitle`, children: i })
   ] }) });
 });
 w.displayName = "TabStep";

package/dist/components/TabStepper/components/TabStep/TabStep.style.js

@@ -1,7 +1,7 @@
 import { css as o } from "@emotion/react";
 import { vars as e } from "@orfium/tokens";
-import { flex as r, flexCenterVertical as s } from "../../../../theme/functions.js";
-const l = (t) => /* @__PURE__ */ o("box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;", t, ";", ""), p = () => /* @__PURE__ */ o(r, ";box-sizing:border-box;flex-direction:column;gap:", e.spacing[3], ";", ""), a = () => /* @__PURE__ */ o(s, ";gap:", e.spacing[4], ";", ""), x = () => (t) => /* @__PURE__ */ o(t.tokens.typography.get("normal.body03"), " color:", e.color.text.default.secondary, ";", "");
+import { flexCenterVertical as r, flex as s } from "../../../../theme/functions.js";
+const l = (t) => /* @__PURE__ */ o("box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;", t, ";", ""), p = () => /* @__PURE__ */ o(s, ";box-sizing:border-box;flex-direction:column;gap:", e.spacing[3], ";", ""), a = () => /* @__PURE__ */ o(r, ";gap:", e.spacing[4], ";", ""), x = () => (t) => /* @__PURE__ */ o(t.tokens.typography.get("normal.body03"), " color:", e.color.text.default.secondary, ";", "");
 export {
   p as stepContainer,
   l as stepStyles,

package/dist/components/Table/Table.js

@@ -1,11 +1,11 @@
-import { jsxs as M, jsx as i } from "@emotion/react/jsx-runtime";
+import { jsxs as E, jsx as i } from "@emotion/react/jsx-runtime";
 import { flexRender as D } from "@tanstack/react-table";
-import d, { useRef as _ } from "react";
-import $ from "react-fast-compare";
-import j from "./components/OptimizedTableRow.js";
-import w from "./hooks/useTable.js";
-import { tableContainer as y, tableStyles as A } from "./Table.style.js";
-import L from "./components/TTitle/TTitle.js";
+import d, { useRef as M } from "react";
+import j from "react-fast-compare";
+import w from "./components/OptimizedTableRow.js";
+import y from "./hooks/useTable.js";
+import { tableStyles as A, tableContainer as L } from "./Table.style.js";
+import $ from "./components/TTitle/TTitle.js";
 import q from "./components/THead/THead.js";
 import z from "./components/TR/TR.js";
 import O from "./components/TH/TH.js";
@@ -14,7 +14,7 @@ import J from "./components/TPagination/TPagination.js";
 const K = ({
   type: u = "read-only",
   rowsConfig: c,
-  data: f,
+  data: p,
   columns: b,
   rowSize: R = "sm",
   columnsConfig: S,
@@ -24,33 +24,33 @@ const K = ({
   sx: e,
   dataTestPrefixId: l = "ictinus"
 }) => {
-  const [h, x] = d.useState(!1), s = !!(u === "interactive" && c?.rowSelection), B = !!c?.expanded, a = _(), C = _(null);
+  const [_, x] = d.useState(!1), s = !!(u === "interactive" && c?.rowSelection), h = !!c?.expanded, a = M(), B = M(null);
   d.useEffect(() => {
     a?.current && x(a?.current?.scrollHeight > a?.current?.clientHeight);
   }, []);
-  const m = w({
+  const m = y({
     type: u,
-    data: f,
+    data: p,
     columns: b,
     sorting: r,
     rowsConfig: c,
     columnsConfig: S,
     dataTestPrefixId: l
-  }), H = !!(S || c), v = m.getAllLeafColumns().length, E = d.useMemo(() => ({
+  }), H = !!(S || c), v = m.getAllLeafColumns().length, C = d.useMemo(() => ({
     tr: e?.tr,
     td: e?.td
   }), [e?.tr, e?.td]);
-  return /* @__PURE__ */ M("div", { css: y(), ref: C, "data-testid": `${l}_table_container`, children: [
-    H && /* @__PURE__ */ i(L, { type: u, columnsConfig: S, columns: b, rowsConfig: c, containerRef: C, rowsCount: c?.rowsCount ?? m.getRowModel().rows.length, dataTestPrefixId: l }),
-    /* @__PURE__ */ M("table", { css: A({
+  return /* @__PURE__ */ E("div", { css: L(), ref: B, "data-testid": `${l}_table_container`, children: [
+    H && /* @__PURE__ */ i($, { type: u, columnsConfig: S, columns: b, rowsConfig: c, containerRef: B, rowsCount: c?.rowsCount ?? m.getRowModel().rows.length, dataTestPrefixId: l }),
+    /* @__PURE__ */ E("table", { css: A({
       sx: e?.table
     }), "data-testid": `${l}_table`, children: [
-      /* @__PURE__ */ i(q, { hasStickyHeader: g, hasScrollbar: h, sx: e?.thead, children: m.getHeaderGroups().map((o) => {
-        const p = o.headers.length - +s - +B;
-        return /* @__PURE__ */ i(z, { sx: E.tr, ...s && {
+      /* @__PURE__ */ i(q, { hasStickyHeader: g, hasScrollbar: _, sx: e?.thead, children: m.getHeaderGroups().map((o) => {
+        const f = o.headers.length - +s - +h;
+        return /* @__PURE__ */ i(z, { sx: C.tr, ...s && {
           isSelectable: s,
           isSelected: m.getIsSomePageRowsSelected() || m.getIsAllPageRowsSelected()
-        }, children: o.headers.map((t) => /* @__PURE__ */ i(O, { id: t.id, colSpan: t.colSpan, rowSize: R, width: t.getSize() || 100 / p, metaData: t.column.columnDef.meta, ...t.column.getCanSort() && {
+        }, children: o.headers.map((t) => /* @__PURE__ */ i(O, { id: t.id, colSpan: t.colSpan, rowSize: R, width: t.getSize() || 100 / f, metaData: t.column.columnDef.meta, ...t.column.getCanSort() && {
           colSortingState: r?.sortingColumn?.find((n) => n.id === t.id) ? {
             /** Find and pass the ColumnSort object */
             ...r?.sortingColumn?.find((n) => n.id === t.id),
@@ -64,14 +64,14 @@ const K = ({
           resetSorting: t.column.clearSorting
         }, sx: e?.th, dataTestPrefixId: l, children: t.isPlaceholder ? null : D(t.column.columnDef.header, t.getContext()) }, t.id)) }, o.id);
       }) }),
-      /* @__PURE__ */ i(F, { hasStickyHeader: g, ref: a, sx: e?.tbody, children: m.getRowModel().rows.map((o, p) => {
+      /* @__PURE__ */ i(F, { hasStickyHeader: g, ref: a, sx: e?.tbody, children: m.getRowModel().rows.map((o, f) => {
         const t = o.getIsSelected(), n = o.getIsExpanded();
-        return /* @__PURE__ */ i(j, { row: o, index: p, rowSize: R, isSelectable: s, isExpandable: B, isSelected: t, isExpanded: n, sx: E, dataTestPrefixId: l, data: f, allColumnsLength: v }, o.id);
+        return /* @__PURE__ */ i(w, { row: o, index: f, rowSize: R, isSelectable: s, isExpandable: h, isSelected: t, isExpanded: n, sx: C, dataTestPrefixId: l, data: p, allColumnsLength: v }, o.id);
       }) })
     ] }),
-    T && /* @__PURE__ */ i(J, { pagination: T, isSticky: g && h, dataTestPrefixId: l })
+    T && /* @__PURE__ */ i(J, { pagination: T, isSticky: g && _, dataTestPrefixId: l })
   ] });
-}, et = d.memo(K, $);
+}, et = d.memo(K, j);
 export {
   et as default
 };

package/dist/components/Table/components/TD/TD.js

@@ -1,5 +1,5 @@
 import { jsx as t } from "@emotion/react/jsx-runtime";
-import { simpleTdContainer as p, tdContainer as x, tdContent as C } from "./TD.style.js";
+import { simpleTdContainer as p, tdContent as x, tdContainer as C } from "./TD.style.js";
 const h = ({
   colSpan: s,
   rowSize: a = "sm",
@@ -16,13 +16,13 @@ const h = ({
   const m = o === "checkbox_select", b = o === "details_iconButton", {
     contentAlign: f = "left"
   } = _ ?? {};
-  return c ? /* @__PURE__ */ t("td", { colSpan: s, css: p(), "data-testid": `${i}_table_row_${n}_details`, children: e }) : /* @__PURE__ */ t("td", { css: x({
+  return c ? /* @__PURE__ */ t("td", { colSpan: s, css: p(), "data-testid": `${i}_table_row_${n}_details`, children: e }) : /* @__PURE__ */ t("td", { css: C({
     rowSize: a,
     width: d,
     isCheckbox: m,
     isExpandedButton: b,
     sx: r
-  }), colSpan: s, "data-testid": `${i}_table_row_${n}`, ...l, children: /* @__PURE__ */ t("div", { css: C({
+  }), colSpan: s, "data-testid": `${i}_table_row_${n}`, ...l, children: /* @__PURE__ */ t("div", { css: x({
     contentAlign: f
   }), children: e }) });
 };