@televet/kibble-ui 5.0.2-beta.menu.3 → 5.0.2-beta.menu.4

package/dist/chunks/{menu.component-DgJSzOB8.js → menu.component-D_Fd8OGb.js}

@@ -1,5 +1,5 @@
 import { j as e } from "./jsx-runtime-C5mzlN2N.js";
-import st, { forwardRef as h, useEffect as G, useId as Y, useRef as le, useCallback as j, useState as B, useMemo as D } from "react";
+import st, { forwardRef as h, useEffect as _, useId as Y, useRef as le, useCallback as j, useState as B, useMemo as D } from "react";
 import { B as T } from "./index-9BerxEcw.js";
 import { B as Z } from "./button.component-BO6oee_V.js";
 import { I as he } from "./icon.component-PV_nHBId.js";
@@ -12,11 +12,11 @@ import { u as it } from "./usePortalContentRef-DO_jc4W9.js";
 import { u as te, s as fe, c as Me, d as Pe, P as ut } from "./index-C9UYIjEB.js";
 import { c as lt } from "./create-slot-recipe-context-D_FXDJGp.js";
 import { d as dt } from "./icons-CoSqruIn.js";
-import { a as _, d as g, b as O, e as pt, u as mt, f as xt, g as ht, n as gt } from "./use-locale-context-Bw4Gg9Z0.js";
+import { a as O, d as g, b as $, e as pt, u as mt, f as xt, g as ht, n as gt } from "./use-locale-context-Bw4Gg9Z0.js";
 import { m as ft, c as Mt } from "./index-CbVKVxMW.js";
 import { a6 as p } from "./index-fHSGm2nC.js";
 import { W as Pt } from "./checkbox.component-DE35wBj-.js";
-const [ve, m] = _({
+const [ve, m] = O({
   name: "MenuContext",
   hookName: "useMenuContext",
   providerName: "<MenuProvider />",
@@ -31,16 +31,16 @@ const Ce = h((o, n) => {
   return /* @__PURE__ */ e.jsx(g.div, { ...s, ref: n });
 });
 Ce.displayName = "MenuArrowTip";
-const [ne, Zt] = _({
+const [ne, Zt] = O({
   name: "MenuItemContext",
   hookName: "useMenuItemContext",
   providerName: "<MenuItemProvider />"
-}), [oe, Ie] = _({
+}), [oe, Ie] = O({
   name: "MenuItemPropsContext",
   hookName: "useMenuItemPropsContext",
   providerName: "<MenuItemPropsProvider />"
 }), be = h((o, n) => {
-  const [t, s] = O()(o, [
+  const [t, s] = $()(o, [
     "checked",
     "closeOnSelect",
     "disabled",
@@ -70,22 +70,22 @@ const we = h((o, n) => {
 });
 we.displayName = "MenuIndicator";
 const Ne = h((o, n) => {
-  const [t, s] = O()(o, [
+  const [t, s] = $()(o, [
     "closeOnSelect",
     "disabled",
     "value",
     "valueText",
     "onSelect"
   ]), c = m(), u = p(c.getItemProps(t), s), a = c.getItemState(t);
-  return G(() => c.addItemListener({ id: a.id, onSelect: t.onSelect }), [a.id, t.onSelect]), /* @__PURE__ */ e.jsx(oe, { value: t, children: /* @__PURE__ */ e.jsx(ne, { value: a, children: /* @__PURE__ */ e.jsx(g.div, { ...u, ref: n }) }) });
+  return _(() => c.addItemListener({ id: a.id, onSelect: t.onSelect }), [a.id, t.onSelect]), /* @__PURE__ */ e.jsx(oe, { value: t, children: /* @__PURE__ */ e.jsx(ne, { value: a, children: /* @__PURE__ */ e.jsx(g.div, { ...u, ref: n }) }) });
 });
 Ne.displayName = "MenuItem";
-const [ye, Ae] = _({
+const [ye, Ae] = O({
   name: "MenuItemGroupContext",
   hookName: "useMenuItemGroupContext",
   providerName: "<MenuItemGroupProvider />"
 }), Te = h((o, n) => {
-  const [t, s] = O()(o, ["id"]), c = m(), a = { id: Y(), ...t }, i = p(c.getItemGroupProps(a), s);
+  const [t, s] = $()(o, ["id"]), c = m(), a = { id: Y(), ...t }, i = p(c.getItemGroupProps(a), s);
   return /* @__PURE__ */ e.jsx(ye, { value: a, children: /* @__PURE__ */ e.jsx(g.div, { ...i, ref: n }) });
 });
 Te.displayName = "MenuItemGroup";
@@ -110,7 +110,7 @@ const $e = h((o, n) => {
 });
 $e.displayName = "MenuPositioner";
 const Re = h((o, n) => {
-  const [t, s] = O()(o, [
+  const [t, s] = $()(o, [
     "closeOnSelect",
     "disabled",
     "value",
@@ -125,7 +125,7 @@ const Re = h((o, n) => {
 });
 Re.displayName = "MenuRadioItem";
 const Le = h((o, n) => {
-  const [t, s] = O()(o, [
+  const [t, s] = $()(o, [
     "id",
     "onValueChange",
     "value"
@@ -135,9 +135,9 @@ const Le = h((o, n) => {
 Le.displayName = "MenuRadioItemGroup";
 const Be = (o) => {
   const n = le(o), t = le(!1);
-  G(() => {
+  _(() => {
     n.current = o;
-  }), G(() => {
+  }), _(() => {
     t.current !== !0 && (t.current = !0, n.current());
   }, []);
 }, vt = (o) => {
@@ -148,18 +148,18 @@ const Be = (o) => {
     ...o
   }, u = ht(ft, c);
   return { api: Mt(u, gt), service: u };
-}, [ze, Fe] = _({
+}, [ze, Fe] = O({
   name: "MenuMachineContext",
   hookName: "useMenuMachineContext",
   providerName: "<MenuMachineProvider />",
   strict: !1
-}), [We, jt] = _({
+}), [We, jt] = O({
   name: "MenuMachineContext",
   hookName: "useMenuMachineContext",
   providerName: "<MenuMachineProvider />",
   strict: !1
 }), Ct = (o) => {
-  const [n, t] = fe(o), [s, c] = O()(t, [
+  const [n, t] = fe(o), [s, c] = $()(t, [
     "anchorPoint",
     "aria-label",
     "closeOnSelect",
@@ -332,7 +332,7 @@ const Ke = ({
   }, [n]), a = j(() => {
     n || c(!1);
   }, [n]);
-  return G(() => {
+  return _(() => {
     n && c(!1);
   }, [n]), /* @__PURE__ */ e.jsx(ge, { label: t.text || "", open: s && !n, ...o, children: /* @__PURE__ */ e.jsx(
     T,
@@ -521,7 +521,7 @@ const Ke = ({
     shouldTruncateText: Je,
     ...se
   } = n || {}, [Qe, Ue] = B(!1), [q, J] = B(""), [F, Q] = B(I);
-  G(() => {
+  _(() => {
     console.log("positionerProps", t);
   }, [t]);
   const ce = D(() => {
@@ -536,10 +536,10 @@ const Ke = ({
       const P = M.indexOf(l), v = M.indexOf(d);
       return P !== -1 && v !== -1 ? P - v : P !== -1 ? -1 : v !== -1 ? 1 : 0;
     });
-  }, [ce, M]), $ = D(() => I?.filter((r) => r.type === "checkbox") || [], [I]), U = j(
-    (r) => $.some((l) => l.value === r && l.checked),
-    [$]
-  ), b = D(() => $.filter((r) => r.checked), [$]), ie = j(
+  }, [ce, M]), R = D(() => I?.filter((r) => r.type === "checkbox") || [], [I]), U = j(
+    (r) => R.some((l) => l.value === r && l.checked),
+    [R]
+  ), b = D(() => R.filter((r) => r.checked), [R]), ie = j(
     ({ groupName: r, clear: l }) => {
       let d;
       const P = F.filter((v) => v.type === "checkbox" && !v.disabled);
@@ -588,7 +588,7 @@ const Ke = ({
     },
     [I, a, b]
   );
-  return G(() => {
+  return _(() => {
     Q(w ? I : ue(q, I));
   }, [q, w, ue, I]), /* @__PURE__ */ e.jsxs(
     bt,
@@ -650,7 +650,7 @@ const Ke = ({
                   "data-testid": `${i}-checkbox-group-header`,
                   px: 3,
                   mt: K ? 1 : 2,
-                  children: y && !!$.length && /* @__PURE__ */ e.jsx(
+                  children: y && !!R.length && /* @__PURE__ */ e.jsx(
                     pe,
                     {
                       onToggle: ie,
@@ -661,8 +661,8 @@ const Ke = ({
               ),
               A && /* @__PURE__ */ e.jsx(z, { justifyContent: "center", py: 5, children: /* @__PURE__ */ e.jsx(at, { fullScreen: !0 }) }),
               /* @__PURE__ */ e.jsx(T, { className: "Menu__List", "data-testid": `${i}-list`, children: ae.length ? /* @__PURE__ */ e.jsx(e.Fragment, { children: ae.map(([r, l]) => {
-                const d = r === "default", P = Object.keys(l), v = d ? st.Fragment : yt, tt = l.checkbox?.map((R) => R.value)?.some(
-                  (R) => b.some((E) => E.value === R && E.checked)
+                const d = r === "default", P = Object.keys(l), v = d ? st.Fragment : yt, tt = l.checkbox?.map((L) => L.value)?.some(
+                  (L) => b.some((E) => E.value === L && E.checked)
                 );
                 return /* @__PURE__ */ e.jsxs(v, { children: [
                   !d && /* @__PURE__ */ e.jsx(At, { children: /* @__PURE__ */ e.jsxs(z, { alignItems: "center", justifyContent: "space-between", children: [
@@ -677,20 +677,23 @@ const Ke = ({
                     )
                   ] }) }),
                   Object.entries(l).map(
-                    ([R, E]) => E.map((L, nt) => {
-                      const { groupLabel: ot, ...rt } = L;
+                    ([L, E]) => E.map((G, nt) => {
+                      const { groupLabel: ot, ...rt } = G;
                       return /* @__PURE__ */ e.jsx(
                         _t,
                         {
                           ...rt,
                           shouldTruncateText: Je,
-                          ...L.type === "checkbox" && {
-                            checked: U(L.value)
+                          ...G.type === "checkbox" && {
+                            checked: U(G.value)
                           },
-                          "data-testid": `${i}-item-${L.label}`,
-                          onSelect: () => Xe(L)
+                          "data-testid": `${i}-item-${G.label}`,
+                          onSelect: () => Xe(G),
+                          ...G.type === "submenu" && {
+                            positionerProps: t
+                          }
                         },
-                        `menu-item-${ot}-${R}-${nt}`
+                        `menu-item-${ot}-${L}-${nt}`
                       );
                     })
                   )
@@ -706,4 +709,4 @@ const Ke = ({
 export {
   Ot as M
 };
-//# sourceMappingURL=menu.component-DgJSzOB8.js.map
+//# sourceMappingURL=menu.component-D_Fd8OGb.js.map