@okam/stack-ui 1.44.6 → 2.0.1

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## 2.0.1 (2026-02-27)
+
+### 🩹 Fixes
+
+- remove async from option render ([#418](https://github.com/OKAMca/stack/pull/418))
+
+### ❤️ Thank You
+
+- Marie-Maxime Tanguay @marie-maxime
+
+# 2.0.0 (2026-02-05)
+
+This was a version bump only for stack-ui to align it with other projects, there were no code changes.
+
 ## 1.44.6 (2026-01-23)
 
 ### 🩹 Fixes

package/index122.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";const r=require("react/jsx-runtime"),j=require("react-aria"),s=require("./index7.js"),$=require("./index170.js"),b=require("./index171.js"),B={narrow:{value:"narrow"},abbreviated:{value:"short",transform:e=>e.map(o=>o.slice(0,2))},short:{value:"short"},long:{value:"long"}};function v({themeName:e="calendar",customTheme:o,tokens:a,state:l,weekdayStyle:i="abbreviated",...c}){const{value:u,transform:y}=B[i],d=j.useCalendarGrid({...c,weekdayStyle:u},l),{gridProps:x,headerProps:h,weeksInMonth:m}=d,w=y?.(d.weekDays)??d.weekDays;return r.jsxs(s.Box,{as:"table",...x,themeName:`${e}.calendarTable`,tokens:a,children:[r.jsx(s.Box,{as:"thead",themeName:`${e}.calendarHeaderContainer`,...h,tokens:a,children:r.jsx(s.Box,{as:"tr",themeName:`${e}.calendarHeaderRow`,tokens:a,children:w.map(n=>r.jsx(s.Box,{as:"th",themeName:`${e}.calendarDayLabel`,tokens:a,children:n},`day-${n}`))})}),r.jsx(s.Box,{as:"tbody",themeName:`${e}.calendarBody`,tokens:a,children:[...Array.from({length:m}).keys()].map(n=>r.jsx(s.Box,{as:"tr",themeName:`${e}.calendarWeekRow`,tokens:a,children:l.getDatesInWeek(n).map((t,p)=>{if(t==null)return r.jsx(s.Box,{themeName:`${e}.calendarCellContainer`,tokens:{isEmpty:!0,...a},as:"td"},p);const g=$.getIsDateOutsideRange(t,l);return r.jsx(b,{themeName:e,tokens:{isOutsideRange:g,isEmpty:!1,...a},state:l,date:t},t?.day)})},`week-${n}`))})]})}module.exports=v;
+"use strict";const r=require("react/jsx-runtime"),j=require("react-aria"),s=require("./index7.js"),$=require("./index171.js"),b=require("./index172.js"),B={narrow:{value:"narrow"},abbreviated:{value:"short",transform:e=>e.map(o=>o.slice(0,2))},short:{value:"short"},long:{value:"long"}};function v({themeName:e="calendar",customTheme:o,tokens:a,state:l,weekdayStyle:i="abbreviated",...c}){const{value:u,transform:y}=B[i],d=j.useCalendarGrid({...c,weekdayStyle:u},l),{gridProps:x,headerProps:h,weeksInMonth:m}=d,w=y?.(d.weekDays)??d.weekDays;return r.jsxs(s.Box,{as:"table",...x,themeName:`${e}.calendarTable`,tokens:a,children:[r.jsx(s.Box,{as:"thead",themeName:`${e}.calendarHeaderContainer`,...h,tokens:a,children:r.jsx(s.Box,{as:"tr",themeName:`${e}.calendarHeaderRow`,tokens:a,children:w.map(n=>r.jsx(s.Box,{as:"th",themeName:`${e}.calendarDayLabel`,tokens:a,children:n},`day-${n}`))})}),r.jsx(s.Box,{as:"tbody",themeName:`${e}.calendarBody`,tokens:a,children:[...Array.from({length:m}).keys()].map(n=>r.jsx(s.Box,{as:"tr",themeName:`${e}.calendarWeekRow`,tokens:a,children:l.getDatesInWeek(n).map((t,p)=>{if(t==null)return r.jsx(s.Box,{themeName:`${e}.calendarCellContainer`,tokens:{isEmpty:!0,...a},as:"td"},p);const g=$.getIsDateOutsideRange(t,l);return r.jsx(b,{themeName:e,tokens:{isOutsideRange:g,isEmpty:!1,...a},state:l,date:t},t?.day)})},`week-${n}`))})]})}module.exports=v;

package/index122.mjs

@@ -2,8 +2,8 @@
 import { jsxs as b, jsx as r } from "react/jsx-runtime";
 import { useCalendarGrid as g } from "react-aria";
 import { Box as l } from "./index7.mjs";
-import { getIsDateOutsideRange as v } from "./index170.mjs";
-import C from "./index171.mjs";
+import { getIsDateOutsideRange as v } from "./index171.mjs";
+import C from "./index172.mjs";
 const k = {
   narrow: {
     value: "narrow"

package/index131.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),p=require("react"),h=require("react-aria"),$=require("./index88.js"),u=require("./index7.js"),f=require("./index74.js"),B=require("./index172.js");function l({item:o,state:i,themeName:n="li"}){const r=p.useRef(null),{optionProps:e,isFocusVisible:c}=h.useOption({key:o.key},i,r),a=$(n);return t.jsx(f.TypographyWithForwardRef,{as:"li",...e,tokens:{className:`${a} ${c?"has-focus-ring":""}`},ref:r,children:o.rendered})}function x(o){const{children:i,listBoxRef:n,themeName:r,...e}=o;return t.jsx(h.FocusScope,{autoFocus:!0,restoreFocus:!0,contain:!0,children:t.jsx(u.BoxWithForwardRef,{...e,ref:n,as:"ul",themeName:`${r}.ul`,children:i})})}function k(o){const i=p.useRef(null),{listBoxRef:n=i,state:r,themeName:e="option",optionsWithHeaders:c}=o,{listBoxProps:a}=h.useListBox(o,r,n),d=Array.from(r.collection),y=B.getListboxSections(d,c??[]);return c?.some(s=>s.key?.includes("header-"))?t.jsx(x,{...a,listBoxRef:n,themeName:e,children:y.map(s=>{const j=s.header!=null?`section-${s.header.key}`:`section-${s.items[0]?.key??"empty"}`;return t.jsx(u.Box,{as:"li",themeName:`${e}.group`,children:t.jsxs(u.Box,{as:"section",themeName:`${e}.section`,children:[s.header!=null&&t.jsx(f.Typography,{as:"header",themeName:`${e}.headerText`,children:s.header.rendered},s.header.key),t.jsx(u.Box,{as:"ul",themeName:`${e}.list`,children:s.items.map(m=>t.jsx(l,{themeName:`${e}.li`,item:m,state:r},String(m.key)))})]})},j)})}):t.jsx(x,{...a,listBoxRef:n,themeName:e,children:d.map(s=>t.jsx(l,{themeName:`${e}.li`,item:s,state:r},s.key))})}exports.ListBox=k;exports.Option=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),p=require("react"),h=require("react-aria"),$=require("./index88.js"),u=require("./index7.js"),f=require("./index74.js"),B=require("./index170.js");function l({item:o,state:i,themeName:n="li"}){const r=p.useRef(null),{optionProps:e,isFocusVisible:c}=h.useOption({key:o.key},i,r),a=$(n);return t.jsx(f.TypographyWithForwardRef,{as:"li",...e,tokens:{className:`${a} ${c?"has-focus-ring":""}`},ref:r,children:o.rendered})}function x(o){const{children:i,listBoxRef:n,themeName:r,...e}=o;return t.jsx(h.FocusScope,{autoFocus:!0,restoreFocus:!0,contain:!0,children:t.jsx(u.BoxWithForwardRef,{...e,ref:n,as:"ul",themeName:`${r}.ul`,children:i})})}function k(o){const i=p.useRef(null),{listBoxRef:n=i,state:r,themeName:e="option",optionsWithHeaders:c}=o,{listBoxProps:a}=h.useListBox(o,r,n),d=Array.from(r.collection),y=B.getListboxSections(d,c??[]);return c?.some(s=>s.key?.includes("header-"))?t.jsx(x,{...a,listBoxRef:n,themeName:e,children:y.map(s=>{const j=s.header!=null?`section-${s.header.key}`:`section-${s.items[0]?.key??"empty"}`;return t.jsx(u.Box,{as:"li",themeName:`${e}.group`,children:t.jsxs(u.Box,{as:"section",themeName:`${e}.section`,children:[s.header!=null&&t.jsx(f.Typography,{as:"header",themeName:`${e}.headerText`,children:s.header.rendered},s.header.key),t.jsx(u.Box,{as:"ul",themeName:`${e}.list`,children:s.items.map(m=>t.jsx(l,{themeName:`${e}.li`,item:m,state:r},String(m.key)))})]})},j)})}):t.jsx(x,{...a,listBoxRef:n,themeName:e,children:d.map(s=>t.jsx(l,{themeName:`${e}.li`,item:s,state:r},s.key))})}exports.ListBox=k;exports.Option=l;

package/index131.mjs

@@ -5,7 +5,7 @@ import { useListBox as $, FocusScope as N, useOption as k } from "react-aria";
 import B from "./index88.mjs";
 import { Box as c, BoxWithForwardRef as g } from "./index7.mjs";
 import { Typography as F, TypographyWithForwardRef as R } from "./index74.mjs";
-import { getListboxSections as L } from "./index172.mjs";
+import { getListboxSections as L } from "./index170.mjs";
 function u({ item: s, state: i, themeName: n = "li" }) {
   const t = p(null), { optionProps: e, isFocusVisible: a } = k({ key: s.key }, i, t), m = B(n);
   return /* @__PURE__ */ r(

package/index170.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function l(e,u){if(e==null)return!1;const{minValue:t,maxValue:n}=u;return t!=null&&e.compare(t)<0||n!=null&&e.compare(n)>0}exports.getIsDateOutsideRange=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function c(o,r){const i=[];let e=null;const s=[];for(const t of r){const u=t.key==="header"||t.key?.toString().includes("header-"),n=o.find(l=>typeof l.rendered!="string"?!1:l.rendered===t.value);u?(e!=null&&i.push(e),e={header:{key:t.key,rendered:t.value},items:[]}):e!=null?n!=null&&e.items.push(n):n!=null&&s.push(n)}return e!=null&&i.push(e),[...s.length>0?[{items:s}]:[],...i]}exports.getListboxSections=c;

package/index170.mjs

@@ -1,9 +1,13 @@
-function r(e, u) {
-  if (e == null)
-    return !1;
-  const { minValue: n, maxValue: l } = u;
-  return n != null && e.compare(n) < 0 || l != null && e.compare(l) > 0;
+function d(r, o) {
+  const l = [];
+  let e = null;
+  const s = [];
+  for (const n of o) {
+    const u = n.key === "header" || n.key?.toString().includes("header-"), t = r.find((i) => typeof i.rendered != "string" ? !1 : i.rendered === n.value);
+    u ? (e != null && l.push(e), e = { header: { key: n.key, rendered: n.value }, items: [] }) : e != null ? t != null && e.items.push(t) : t != null && s.push(t);
+  }
+  return e != null && l.push(e), [...s.length > 0 ? [{ items: s }] : [], ...l];
 }
 export {
-  r as getIsDateOutsideRange
+  d as getListboxSections
 };

package/index171.js

@@ -1,2 +1 @@
-"use client";
-"use strict";const o=require("react/jsx-runtime"),i=require("@internationalized/date"),B=require("react"),n=require("react-aria"),c=require("./index7.js");function F(r){const{themeName:a="calendar",tokens:R,state:d,date:e}=r,u=B.useRef(null),{isUnavailable:k,cellProps:y,buttonProps:b,isSelected:t,isOutsideVisibleRange:h,isDisabled:C,formattedDate:S,isInvalid:q}=n.useCalendarCell(r,d,u),s=d?.highlightedRange,m=s?.start,f=s?.end,g=s!=null&&m!=null?i.isSameDay(e,m):t,x=s!=null&&f!=null?i.isSameDay(e,f):t,{locale:j}=n.useLocale(),D=i.getDayOfWeek(e,j),N=t&&(g||D===0||e.day===1),P=t&&(x||D===6||e.day===e.calendar.getDaysInMonth(e)),{focusProps:$,isFocusVisible:p}=n.useFocusRing(),l={isInvalid:q,isDisabled:C,isUnavailable:k,isSelected:t,isFocusVisible:p,isOutsideVisibleRange:h,...R};return o.jsx(c.Box,{as:"td",...y,"aria-disabled":!1,themeName:`${a}.cellContainer`,tokens:l,children:o.jsx(c.BoxWithForwardRef,{...n.mergeProps(b,$),ref:u,"aria-hidden":h,themeName:`${a}.cell`,tokens:{...l,isRoundedLeft:N,isRoundedRight:P},children:o.jsx(c.Box,{themeName:`${a}.cellDate`,tokens:{...l,isSelectionStart:g,isSelectionEnd:x},children:S})})})}module.exports=F;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function l(e,u){if(e==null)return!1;const{minValue:t,maxValue:n}=u;return t!=null&&e.compare(t)<0||n!=null&&e.compare(n)>0}exports.getIsDateOutsideRange=l;

package/index171.mjs

@@ -1,50 +1,9 @@
-"use client";
-import { jsx as o } from "react/jsx-runtime";
-import { isSameDay as g, getDayOfWeek as W } from "@internationalized/date";
-import { useRef as $ } from "react";
-import { useCalendarCell as v, useLocale as B, useFocusRing as I, mergeProps as L } from "react-aria";
-import { Box as p, BoxWithForwardRef as V } from "./index7.mjs";
-function U(l) {
-  const { themeName: s = "calendar", tokens: D, state: i, date: e } = l, r = $(null), {
-    isUnavailable: R,
-    cellProps: k,
-    buttonProps: b,
-    isSelected: t,
-    isOutsideVisibleRange: c,
-    isDisabled: y,
-    formattedDate: C,
-    isInvalid: S
-  } = v(l, i, r), n = i?.highlightedRange, d = n?.start, m = n?.end, u = n != null && d != null ? g(e, d) : t, f = n != null && m != null ? g(e, m) : t, { locale: x } = B(), h = W(e, x), N = t && (u || h === 0 || e.day === 1), P = t && (f || h === 6 || e.day === e.calendar.getDaysInMonth(e)), { focusProps: F, isFocusVisible: O } = I(), a = {
-    isInvalid: S,
-    isDisabled: y,
-    isUnavailable: R,
-    isSelected: t,
-    isFocusVisible: O,
-    isOutsideVisibleRange: c,
-    ...D
-  };
-  return /* @__PURE__ */ o(
-    p,
-    {
-      as: "td",
-      ...k,
-      "aria-disabled": !1,
-      themeName: `${s}.cellContainer`,
-      tokens: a,
-      children: /* @__PURE__ */ o(
-        V,
-        {
-          ...L(b, F),
-          ref: r,
-          "aria-hidden": c,
-          themeName: `${s}.cell`,
-          tokens: { ...a, isRoundedLeft: N, isRoundedRight: P },
-          children: /* @__PURE__ */ o(p, { themeName: `${s}.cellDate`, tokens: { ...a, isSelectionStart: u, isSelectionEnd: f }, children: C })
-        }
-      )
-    }
-  );
+function r(e, u) {
+  if (e == null)
+    return !1;
+  const { minValue: n, maxValue: l } = u;
+  return n != null && e.compare(n) < 0 || l != null && e.compare(l) > 0;
 }
 export {
-  U as default
+  r as getIsDateOutsideRange
 };

package/index172.js

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function c(o,r){const i=[];let e=null;const s=[];for(const t of r){const u=t.key==="header"||t.key?.toString().includes("header-"),n=o.find(l=>typeof l.rendered!="string"?!1:l.rendered===t.value);u?(e!=null&&i.push(e),e={header:{key:t.key,rendered:t.value},items:[]}):e!=null?n!=null&&e.items.push(n):n!=null&&s.push(n)}return e!=null&&i.push(e),[...s.length>0?[{items:s}]:[],...i]}exports.getListboxSections=c;
+"use client";
+"use strict";const o=require("react/jsx-runtime"),i=require("@internationalized/date"),B=require("react"),n=require("react-aria"),c=require("./index7.js");function F(r){const{themeName:a="calendar",tokens:R,state:d,date:e}=r,u=B.useRef(null),{isUnavailable:k,cellProps:y,buttonProps:b,isSelected:t,isOutsideVisibleRange:h,isDisabled:C,formattedDate:S,isInvalid:q}=n.useCalendarCell(r,d,u),s=d?.highlightedRange,m=s?.start,f=s?.end,g=s!=null&&m!=null?i.isSameDay(e,m):t,x=s!=null&&f!=null?i.isSameDay(e,f):t,{locale:j}=n.useLocale(),D=i.getDayOfWeek(e,j),N=t&&(g||D===0||e.day===1),P=t&&(x||D===6||e.day===e.calendar.getDaysInMonth(e)),{focusProps:$,isFocusVisible:p}=n.useFocusRing(),l={isInvalid:q,isDisabled:C,isUnavailable:k,isSelected:t,isFocusVisible:p,isOutsideVisibleRange:h,...R};return o.jsx(c.Box,{as:"td",...y,"aria-disabled":!1,themeName:`${a}.cellContainer`,tokens:l,children:o.jsx(c.BoxWithForwardRef,{...n.mergeProps(b,$),ref:u,"aria-hidden":h,themeName:`${a}.cell`,tokens:{...l,isRoundedLeft:N,isRoundedRight:P},children:o.jsx(c.Box,{themeName:`${a}.cellDate`,tokens:{...l,isSelectionStart:g,isSelectionEnd:x},children:S})})})}module.exports=F;

package/index172.mjs

@@ -1,13 +1,50 @@
-function d(r, o) {
-  const l = [];
-  let e = null;
-  const s = [];
-  for (const n of o) {
-    const u = n.key === "header" || n.key?.toString().includes("header-"), t = r.find((i) => typeof i.rendered != "string" ? !1 : i.rendered === n.value);
-    u ? (e != null && l.push(e), e = { header: { key: n.key, rendered: n.value }, items: [] }) : e != null ? t != null && e.items.push(t) : t != null && s.push(t);
-  }
-  return e != null && l.push(e), [...s.length > 0 ? [{ items: s }] : [], ...l];
+"use client";
+import { jsx as o } from "react/jsx-runtime";
+import { isSameDay as g, getDayOfWeek as W } from "@internationalized/date";
+import { useRef as $ } from "react";
+import { useCalendarCell as v, useLocale as B, useFocusRing as I, mergeProps as L } from "react-aria";
+import { Box as p, BoxWithForwardRef as V } from "./index7.mjs";
+function U(l) {
+  const { themeName: s = "calendar", tokens: D, state: i, date: e } = l, r = $(null), {
+    isUnavailable: R,
+    cellProps: k,
+    buttonProps: b,
+    isSelected: t,
+    isOutsideVisibleRange: c,
+    isDisabled: y,
+    formattedDate: C,
+    isInvalid: S
+  } = v(l, i, r), n = i?.highlightedRange, d = n?.start, m = n?.end, u = n != null && d != null ? g(e, d) : t, f = n != null && m != null ? g(e, m) : t, { locale: x } = B(), h = W(e, x), N = t && (u || h === 0 || e.day === 1), P = t && (f || h === 6 || e.day === e.calendar.getDaysInMonth(e)), { focusProps: F, isFocusVisible: O } = I(), a = {
+    isInvalid: S,
+    isDisabled: y,
+    isUnavailable: R,
+    isSelected: t,
+    isFocusVisible: O,
+    isOutsideVisibleRange: c,
+    ...D
+  };
+  return /* @__PURE__ */ o(
+    p,
+    {
+      as: "td",
+      ...k,
+      "aria-disabled": !1,
+      themeName: `${s}.cellContainer`,
+      tokens: a,
+      children: /* @__PURE__ */ o(
+        V,
+        {
+          ...L(b, F),
+          ref: r,
+          "aria-hidden": c,
+          themeName: `${s}.cell`,
+          tokens: { ...a, isRoundedLeft: N, isRoundedRight: P },
+          children: /* @__PURE__ */ o(p, { themeName: `${s}.cellDate`, tokens: { ...a, isSelectionStart: u, isSelectionEnd: f }, children: C })
+        }
+      )
+    }
+  );
 }
 export {
-  d as getListboxSections
+  U as default
 };

package/index40.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";const n=require("react/jsx-runtime"),e=require("react"),l=require("react-aria"),w=require("./index77.js"),a=require("./index7.js"),M=require("./index8.js");function O({item:d,state:o,...f}){const{key:t,rendered:s,type:k}=d,{themeName:i="option",tokens:g,as:b="li",customTheme:C,linkElementType:P=M.Anchor,...j}=w.mergeDefaultComponentProps(f,d.props),m=e.useRef(null),{optionProps:q,isFocused:y,isDisabled:E,isFocusVisible:F,isPressed:R,isSelected:V,allowsSelection:A,descriptionProps:D,labelProps:L,hasAction:N}=l.useOption({key:t},o,m),r=o.selectionManager.isLink(t),S=o.selectionManager.canSelectItem(t),c={...g,type:k,isFocused:y,isDisabled:E,isFocusVisible:F,isPressed:R,isSelected:V,allowsSelection:A,hasAction:N,isLink:r,isSelectable:S},T=r?P:a.BoxWithForwardRef,$=r?"a":b,B=async()=>{if(e.Children.count(s)>1){const[p,u]=e.Children.toArray(s),h=e.isValidElement(p),x=e.isValidElement(u);return!h&&!x?s:n.jsxs(n.Fragment,{children:[h&&n.jsx(a.Box,{themeName:`${i}.label`,tokens:c,children:e.cloneElement(p,L)}),x&&n.jsx(a.Box,{themeName:`${i}.description`,tokens:c,children:e.cloneElement(u,D)})]})}return s};return n.jsx(l.FocusRing,{focusRingClass:"has-focus-ring",children:n.jsx(T,{as:$,...l.mergeProps(j,q),ref:m,themeName:`${i}.option`,tokens:c,customTheme:C,children:B()})})}module.exports=O;
+"use strict";const n=require("react/jsx-runtime"),e=require("react"),l=require("react-aria"),w=require("./index77.js"),a=require("./index7.js"),M=require("./index8.js");function O({item:d,state:o,...f}){const{key:t,rendered:s,type:k}=d,{themeName:i="option",tokens:g,as:b="li",customTheme:C,linkElementType:P=M.Anchor,...j}=w.mergeDefaultComponentProps(f,d.props),m=e.useRef(null),{optionProps:q,isFocused:E,isDisabled:y,isFocusVisible:F,isPressed:R,isSelected:V,allowsSelection:A,descriptionProps:D,labelProps:L,hasAction:N}=l.useOption({key:t},o,m),r=o.selectionManager.isLink(t),S=o.selectionManager.canSelectItem(t),c={...g,type:k,isFocused:E,isDisabled:y,isFocusVisible:F,isPressed:R,isSelected:V,allowsSelection:A,hasAction:N,isLink:r,isSelectable:S},T=r?P:a.BoxWithForwardRef,$=r?"a":b,B=()=>{if(e.Children.count(s)>1){const[p,u]=e.Children.toArray(s),h=e.isValidElement(p),x=e.isValidElement(u);return!h&&!x?s:n.jsxs(n.Fragment,{children:[h&&n.jsx(a.Box,{themeName:`${i}.label`,tokens:c,children:e.cloneElement(p,L)}),x&&n.jsx(a.Box,{themeName:`${i}.description`,tokens:c,children:e.cloneElement(u,D)})]})}return s};return n.jsx(l.FocusRing,{focusRingClass:"has-focus-ring",children:n.jsx(T,{as:$,...l.mergeProps(j,q),ref:m,themeName:`${i}.option`,tokens:c,customTheme:C,children:B()})})}module.exports=O;

package/index40.mjs

@@ -6,18 +6,18 @@ import { mergeDefaultComponentProps as G } from "./index77.mjs";
 import { BoxWithForwardRef as H, Box as k } from "./index7.mjs";
 import { Anchor as J } from "./index8.mjs";
 function _({
-  item: c,
+  item: l,
   state: n,
   ...g
 }) {
-  const { key: s, rendered: e, type: b } = c, {
+  const { key: s, rendered: e, type: b } = l, {
     themeName: t = "option",
-    tokens: y,
-    as: P = "li",
-    customTheme: x,
+    tokens: P,
+    as: x = "li",
+    customTheme: y,
     linkElementType: C = J,
     ...F
-  } = G(g, c.props), l = W(null), {
+  } = G(g, l.props), c = W(null), {
     optionProps: E,
     isFocused: L,
     isDisabled: N,
@@ -28,8 +28,8 @@ function _({
     descriptionProps: A,
     labelProps: D,
     hasAction: $
-  } = q({ key: s }, n, l), i = n.selectionManager.isLink(s), j = n.selectionManager.canSelectItem(s), r = {
-    ...y,
+  } = q({ key: s }, n, c), i = n.selectionManager.isLink(s), j = n.selectionManager.canSelectItem(s), r = {
+    ...P,
     type: b,
     isFocused: L,
     isDisabled: N,
@@ -40,7 +40,7 @@ function _({
     hasAction: $,
     isLink: i,
     isSelectable: j
-  }, w = i ? C : H, B = i ? "a" : P, M = async () => {
+  }, w = i ? C : H, B = i ? "a" : x, M = () => {
     if (u.count(e) > 1) {
       const [m, a] = u.toArray(e), p = f(m), d = f(a);
       return !p && !d ? e : /* @__PURE__ */ O(I, { children: [
@@ -55,10 +55,10 @@ function _({
     {
       as: B,
       ...z(F, E),
-      ref: l,
+      ref: c,
       themeName: `${t}.option`,
       tokens: r,
-      customTheme: x,
+      customTheme: y,
       children: M()
     }
   ) });

package/index81.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),s=require("@okam/core-lib"),u=require("react"),t=s.createCtxNullable(),d=t[0],a=t[1];function l(r){const{state:o,children:c,TransitionAnimation:e}=r,n=u.useMemo(()=>({state:o,TransitionAnimation:e}),[o,e]);return i.jsx(a,{value:n,children:c})}exports.AccordionContextProvider=l;exports.useAccordionCtx=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),s=require("@okam/react-utils"),u=require("react"),e=s.createCtxNullable(),d=e[0],a=e[1];function l(r){const{state:o,children:c,TransitionAnimation:t}=r,n=u.useMemo(()=>({state:o,TransitionAnimation:t}),[o,t]);return i.jsx(a,{value:n,children:c})}exports.AccordionContextProvider=l;exports.useAccordionCtx=d;

package/index81.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as e } from "react/jsx-runtime";
-import { createCtxNullable as s } from "@okam/core-lib";
+import { createCtxNullable as s } from "@okam/react-utils";
 import { useMemo as m } from "react";
 const r = s(), l = r[0], a = r[1];
 function f(n) {

package/index82.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react/jsx-runtime"),S=require("@okam/core-lib"),e=require("react"),[p,R]=S.createCtxNullable();function v(x){const{controller:o,children:f,id:t,slides:s,modules:n,...l}=x,[i,u]=e.useState(),c=e.useRef(null),a=e.useRef(null),r=e.useRef(null),[C,d]=e.useState(0),w=e.useMemo(()=>({swiper:r.current?.swiper,activeIndex:C,setActiveIndex:d,swiperRef:r,slides:s,controller:o??i,setController:u,prevNavigationRef:c,nextNavigationRef:a,id:t,modules:n,swiperProps:l}),[r,C,d,s,o,i,u,c,a,t,n,l]);return P.jsx(R,{value:w,children:f})}const b=v,g=p;exports.CarouselContextProvider=v;exports.SwiperControllerContextProvider=b;exports.useCarousel=p;exports.useSwiperController=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react/jsx-runtime"),S=require("@okam/react-utils"),e=require("react"),[p,R]=S.createCtxNullable();function v(x){const{controller:t,children:f,id:o,slides:s,modules:n,...l}=x,[i,u]=e.useState(),c=e.useRef(null),a=e.useRef(null),r=e.useRef(null),[C,d]=e.useState(0),w=e.useMemo(()=>({swiper:r.current?.swiper,activeIndex:C,setActiveIndex:d,swiperRef:r,slides:s,controller:t??i,setController:u,prevNavigationRef:c,nextNavigationRef:a,id:o,modules:n,swiperProps:l}),[r,C,d,s,t,i,u,c,a,o,n,l]);return P.jsx(R,{value:w,children:f})}const g=v,m=p;exports.CarouselContextProvider=v;exports.SwiperControllerContextProvider=g;exports.useCarousel=p;exports.useSwiperController=m;

package/index82.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as x } from "react/jsx-runtime";
-import { createCtxNullable as w } from "@okam/core-lib";
+import { createCtxNullable as w } from "@okam/react-utils";
 import { useState as v, useRef as o, useMemo as P } from "react";
 const [R, N] = w();
 function S(C) {

package/index83.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),o=require("@okam/core-lib"),e=require("react"),[u,c]=o.createCtx();function l({children:s}){const[t,r]=e.useState(!1);e.useEffect(()=>{r(!0)},[]);const n=e.useMemo(()=>({isClient:t}),[t]);return i.jsx(c,{value:n,children:s})}exports.IsClientContextProvider=l;exports.useIsClient=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),o=require("@okam/react-utils"),e=require("react"),[u,c]=o.createCtx();function l({children:s}){const[t,r]=e.useState(!1);e.useEffect(()=>{r(!0)},[]);const n=e.useMemo(()=>({isClient:t}),[t]);return i.jsx(c,{value:n,children:s})}exports.IsClientContextProvider=l;exports.useIsClient=u;

package/index83.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as s } from "react/jsx-runtime";
-import { createCtx as i } from "@okam/core-lib";
+import { createCtx as i } from "@okam/react-utils";
 import { useState as n, useEffect as u, useMemo as f } from "react";
 const [a, l] = i();
 function p({ children: t }) {

package/index84.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),C=require("@okam/core-lib"),M=require("react"),v=require("react-stately"),P=require("./index86.js"),i=C.createCtxNullable(),d=i[0],q=i[1];function S({children:s,defaultSelectedKey:e,defaultIsOpen:u,onCloseCallback:c,onOpenCallback:a,tabs:x,openBtn:r,closeBtn:n,...l}){const t=v.useTabListState({...l,children:x,defaultSelectedKey:e}),b=M.useMemo(()=>({openBtn:r,closeBtn:n,tabState:t,defaultSelectedKey:e}),[r,n,t,e]);return o.jsx(q,{value:b,children:o.jsx(P.SidePanelContextProvider,{onCloseCallback:()=>{c?.(),t?.setSelectedKey?.(e)},onOpenCallback:a,defaultIsOpen:u,defaultSelectedKey:e.toString(),children:s})})}exports.MenuContextProvider=S;exports.useMenu=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),M=require("@okam/react-utils"),b=require("react"),v=require("react-stately"),P=require("./index86.js"),s=M.createCtxNullable(),d=s[0],q=s[1];function S({children:i,defaultSelectedKey:e,defaultIsOpen:u,onCloseCallback:c,onOpenCallback:a,tabs:l,openBtn:r,closeBtn:n,...x}){const t=v.useTabListState({...x,children:l,defaultSelectedKey:e}),C=b.useMemo(()=>({openBtn:r,closeBtn:n,tabState:t,defaultSelectedKey:e}),[r,n,t,e]);return o.jsx(q,{value:C,children:o.jsx(P.SidePanelContextProvider,{onCloseCallback:()=>{c?.(),t?.setSelectedKey?.(e)},onOpenCallback:a,defaultIsOpen:u,defaultSelectedKey:e.toString(),children:i})})}exports.MenuContextProvider=S;exports.useMenu=d;

package/index84.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as e } from "react/jsx-runtime";
-import { createCtxNullable as p } from "@okam/core-lib";
+import { createCtxNullable as p } from "@okam/react-utils";
 import { useMemo as b } from "react";
 import { useTabListState as l } from "react-stately";
 import { SidePanelContextProvider as v } from "./index86.mjs";

package/index86.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("react/jsx-runtime"),b=require("@okam/core-lib"),n=require("react"),x=require("react-stately"),q=require("./index79.js"),[R,B]=b.createCtx();function h(a){const{children:u,defaultSelectedKey:o,onOpenCallback:c,onCloseCallback:i,defaultIsOpen:p=!1,onOpenChange:d,isOpen:P,defaultOpen:f,type:O="dialog"}=a,S=f??p,g=n.useRef(null),y=n.useRef(null),e=x.useOverlayTriggerState({isOpen:P,defaultOpen:S,onOpenChange(s){if(d?.(s),!s){i?.();return}c?.()}}),{triggerProps:t,overlayProps:r,labelProps:l}=q({type:O},e),v=n.useMemo(()=>({labelProps:l,overlayProps:r,defaultSelectedKey:o,overlayState:e,buttonProps:{closeButtonProps:t,closeButtonRef:y,openButtonProps:t,openButtonRef:g}}),[l,r,o,e,t]);return C.jsx(B,{value:v,children:u})}exports.SidePanelContextProvider=h;exports.useSidePanel=R;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("react/jsx-runtime"),b=require("@okam/react-utils"),n=require("react"),x=require("react-stately"),q=require("./index79.js"),[R,B]=b.createCtx();function h(a){const{children:u,defaultSelectedKey:o,onOpenCallback:c,onCloseCallback:i,defaultIsOpen:p=!1,onOpenChange:d,isOpen:P,defaultOpen:f,type:O="dialog"}=a,S=f??p,g=n.useRef(null),y=n.useRef(null),e=x.useOverlayTriggerState({isOpen:P,defaultOpen:S,onOpenChange(s){if(d?.(s),!s){i?.();return}c?.()}}),{triggerProps:t,overlayProps:r,labelProps:l}=q({type:O},e),v=n.useMemo(()=>({labelProps:l,overlayProps:r,defaultSelectedKey:o,overlayState:e,buttonProps:{closeButtonProps:t,closeButtonRef:y,openButtonProps:t,openButtonRef:g}}),[l,r,o,e,t]);return C.jsx(B,{value:v,children:u})}exports.SidePanelContextProvider=h;exports.useSidePanel=R;

package/index86.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as C } from "react/jsx-runtime";
-import { createCtx as S } from "@okam/core-lib";
+import { createCtx as S } from "@okam/react-utils";
 import { useRef as a, useMemo as b } from "react";
 import { useOverlayTriggerState as x } from "react-stately";
 import B from "./index79.mjs";

package/index87.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),o=require("react");function u(){const e=o.createContext(void 0);function r(){const t=o.use(e);return t===void 0?null:t}return[r,e.Provider]}const i={typography:()=>""},[s,l]=u();function c({children:e,brandTheme:r=i}){const t=o.useMemo(()=>({brandTheme:r}),[r]);return n.jsx(l,{value:t,children:e})}function a(e){return({children:t})=>n.jsx(c,{brandTheme:e,children:t})}exports.ThemeContextProvider=c;exports.createCtxNullable=u;exports.createThemeProvider=a;exports.useTheme=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),i=require("@okam/react-utils"),c=require("react"),u={typography:()=>""},[s,m]=i.createCtxNullableStrict();function n({children:e,brandTheme:t=u}){const r=c.useMemo(()=>({brandTheme:t}),[t]);return o.jsx(m,{value:r,children:e})}function a(e){return({children:r})=>o.jsx(n,{brandTheme:e,children:r})}exports.ThemeContextProvider=n;exports.createThemeProvider=a;exports.useTheme=s;

package/index87.mjs

@@ -1,27 +1,19 @@
 "use client";
 import { jsx as o } from "react/jsx-runtime";
-import { useMemo as n, createContext as u, use as c } from "react";
-function i() {
-  const e = u(void 0);
-  function r() {
-    const t = c(e);
-    return t === void 0 ? null : t;
-  }
-  return [r, e.Provider];
-}
-const m = {
+import { createCtxNullableStrict as m } from "@okam/react-utils";
+import { useMemo as n } from "react";
+const i = {
   typography: () => ""
-}, [f, s] = i();
-function v({ children: e, brandTheme: r = m }) {
-  const t = n(() => ({ brandTheme: r }), [r]);
-  return /* @__PURE__ */ o(s, { value: t, children: e });
+}, [p, c] = m();
+function u({ children: e, brandTheme: t = i }) {
+  const r = n(() => ({ brandTheme: t }), [t]);
+  return /* @__PURE__ */ o(c, { value: r, children: e });
 }
-function h(e) {
-  return ({ children: t }) => /* @__PURE__ */ o(v, { brandTheme: e, children: t });
+function v(e) {
+  return ({ children: r }) => /* @__PURE__ */ o(u, { brandTheme: e, children: r });
 }
 export {
-  v as ThemeContextProvider,
-  i as createCtxNullable,
-  h as createThemeProvider,
-  f as useTheme
+  u as ThemeContextProvider,
+  v as createThemeProvider,
+  p as useTheme
 };

package/index89.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react/jsx-runtime"),x=require("@okam/core-lib"),T=require("radashi"),a=require("react"),b=require("./index80.js"),i=x.createCtx(),q=i[0],v=i[1];function C({useTranslationFunc:c,children:u,namespace:o="common",translateFunctionName:e="t"}){const l=c(o),d=(t,n)=>(b.log(`translation function not found: translateFunctionName: ${e}`,"warn",{key:t,obj:n,namespace:o}),t),r=T.get(l,e,d),s=a.useCallback((t,n)=>n==null?r(t):r(t,n),[r]),f=a.useMemo(()=>({t:s}),[s]);return g.jsx(v,{value:f,children:u})}exports.TranslationContextProvider=C;exports.useTranslation=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react/jsx-runtime"),x=require("@okam/react-utils"),T=require("radashi"),a=require("react"),q=require("./index80.js"),i=x.createCtx(),v=i[0],C=i[1];function b({useTranslationFunc:c,children:u,namespace:o="common",translateFunctionName:e="t"}){const l=c(o),d=(t,n)=>(q.log(`translation function not found: translateFunctionName: ${e}`,"warn",{key:t,obj:n,namespace:o}),t),r=T.get(l,e,d),s=a.useCallback((t,n)=>n==null?r(t):r(t,n),[r]),f=a.useMemo(()=>({t:s}),[s]);return g.jsx(C,{value:f,children:u})}exports.TranslationContextProvider=b;exports.useTranslation=v;

package/index89.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as m } from "react/jsx-runtime";
-import { createCtx as f } from "@okam/core-lib";
+import { createCtx as f } from "@okam/react-utils";
 import { get as p } from "radashi";
 import { useCallback as x, useMemo as C } from "react";
 import { log as b } from "./index80.mjs";

package/index90.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),i=require("@okam/core-lib"),s=require("react"),t=i.createCtx(),l=t[0],S=t[1];function h(o){const{userQuery:c,children:u}=o,[e,r]=s.useState(c),a=s.useMemo(()=>({userSearchQuery:e,setUserSearchQuery:r}),[e,r]);return n.jsx(S,{value:a,children:u})}exports.SearchBarProvider=h;exports.useUserQueryValHook=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),i=require("@okam/react-utils"),s=require("react"),t=i.createCtx(),l=t[0],S=t[1];function h(c){const{userQuery:o,children:u}=c,[e,r]=s.useState(o),a=s.useMemo(()=>({userSearchQuery:e,setUserSearchQuery:r}),[e,r]);return n.jsx(S,{value:a,children:u})}exports.SearchBarProvider=h;exports.useUserQueryValHook=l;

package/index90.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as a } from "react/jsx-runtime";
-import { createCtx as n } from "@okam/core-lib";
+import { createCtx as n } from "@okam/react-utils";
 import { useState as i, useMemo as m } from "react";
 const o = n(), p = o[0], h = o[1];
 function x(s) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@okam/stack-ui",
-  "version": "1.44.6",
+  "version": "2.0.1",
   "repository": {
     "url": "https://github.com/OKAMca/stack.git"
   },
@@ -30,8 +30,8 @@
   },
   "dependencies": {
     "@internationalized/date": "^3.10.1",
-    "@okam/core-lib": "1.17.4",
     "@okam/logger": "1.1.0",
+    "@okam/react-utils": "0.0.1",
     "@react-aria/selection": "^3.27.0",
     "@react-aria/utils": "^3.32.0",
     "@react-spring/web": "^10.0.3",
@@ -49,4 +49,4 @@
     "tailwind-variants": "^3.2.2",
     "usehooks-ts": "^3.1.0"
   }
-}
+}

package/providers/Theme/index.d.ts

@@ -1,6 +1,5 @@
 import { ReactNode } from 'react';
 import { TTheme, TThemePanelContext, TThemeProviderProps } from './interface';
-export declare function createCtxNullable<A extends object | null>(): readonly [() => A | null, import('react').Provider<A | undefined>];
 declare const useTheme: () => TThemePanelContext<TTheme> | null;
 export declare function ThemeContextProvider({ children, brandTheme }: TThemeProviderProps<TTheme>): import("react/jsx-runtime").JSX.Element;
 export declare function createThemeProvider(brandTheme: TTheme): ({ children }: {