@dmsi/wedgekit-react 2.1.0 → 2.1.2

package/dist/components/DataGrid/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DataGrid/index.tsx"],"names":[],"mappings":"AAsDA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAgBxC,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,EAC1D,EAAE,EACF,aAAa,EACb,MAAM,EACN,IAAI,EACJ,OAAO,EACP,MAAM,EACN,aAAqB,EACrB,UAAU,EACV,UAAU,EACV,aAAqB,EACrB,OAAe,EACf,OAAO,EAAE,eAAe,EACxB,eAAe,EACf,aAAa,EAAE,qBAAqB,EACpC,qBAAqB,EACrB,YAAY,EAAE,oBAAoB,EAClC,oBAAoB,EACpB,kBAAkB,EAClB,aAAa,EACb,aAAa,EACb,YAAY,EACZ,oBAAoB,EACpB,qBAA0B,EAC1B,sBAA2B,EAC3B,sBAAsB,EACtB,WAAW,EACX,mBAAmB,EACnB,SAAiB,EACjB,cAAkC,EAClC,kBAAkB,EAClB,SAAS,EACT,UAAkB,EAClB,eAAuB,EACvB,aAAa,EACb,UAAU,EACV,OAAO,EACP,YAAyB,EACzB,kBAA2B,EAC3B,iBAAiB,EACjB,kBAA0B,EAC1B,kBAAkB,EAClB,QAAQ,EAAE,gBAAgB,EAC1B,gBAAgB,EAChB,QAAQ,EAAE,gBAAgB,EAC1B,gBAAgB,EAChB,GAAG,GACJ,EAAE,aAAa,CAAC,CAAC,CAAC,2CAi7BlB;AAeD,YAAY,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DataGrid/index.tsx"],"names":[],"mappings":"AAsDA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAgBxC,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,EAC1D,EAAE,EACF,aAAa,EACb,MAAM,EACN,IAAI,EACJ,OAAO,EACP,MAAM,EACN,aAAqB,EACrB,UAAU,EACV,UAAU,EACV,aAAqB,EACrB,OAAe,EACf,OAAO,EAAE,eAAe,EACxB,eAAe,EACf,aAAa,EAAE,qBAAqB,EACpC,qBAAqB,EACrB,YAAY,EAAE,oBAAoB,EAClC,oBAAoB,EACpB,kBAAkB,EAClB,aAAa,EACb,aAAa,EACb,YAAY,EACZ,oBAAoB,EACpB,qBAA0B,EAC1B,sBAA2B,EAC3B,sBAAsB,EACtB,WAAW,EACX,mBAAmB,EACnB,SAAiB,EACjB,cAAkC,EAClC,kBAAkB,EAClB,SAAS,EACT,UAAkB,EAClB,eAAuB,EACvB,aAAa,EACb,UAAU,EACV,OAAO,EACP,YAAyB,EACzB,kBAA2B,EAC3B,iBAAiB,EACjB,kBAA0B,EAC1B,kBAAkB,EAClB,QAAQ,EAAE,gBAAgB,EAC1B,gBAAgB,EAChB,QAAQ,EAAE,gBAAgB,EAC1B,gBAAgB,EAChB,GAAG,GACJ,EAAE,aAAa,CAAC,CAAC,CAAC,2CAy7BlB;AAeD,YAAY,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,eAAe,QAAQ,CAAC"}

package/dist/components/DataGrid/index.js

@@ -1,158 +1,158 @@
 "use client";
 import { jsx as n, jsxs as d, Fragment as Nt } from "react/jsx-runtime";
-import $t, { useImperativeHandle as Pt, useState as f, useCallback as H, useEffect as ie, useRef as ce, useId as kt, useLayoutEffect as Dt } from "react";
+import $t, { useImperativeHandle as Pt, useState as g, useCallback as q, useEffect as ce, useRef as ae, useId as kt, useLayoutEffect as Dt } from "react";
 import { useInfiniteScroll as Lt } from "../../hooks/useInfiniteScroll.js";
 import { useTableLayout as Et } from "../../hooks/useTableLayout/useTableLayout.js";
-import { componentGap as Le, componentPadding as Ee } from "../../classNames.js";
-import { Button as Me } from "../Button.js";
+import { componentGap as Ee, componentPadding as Me } from "../../classNames.js";
+import { Button as Te } from "../Button.js";
 import { Checkbox as Mt } from "../Checkbox.js";
 import { DraggableCellHeader as Tt, DataGridCell as jt } from "../DataGridCell.js";
-import { Icon as Te } from "../Icon.js";
+import { Icon as je } from "../Icon.js";
 import { Label as Wt } from "../Label.js";
 import { Menu as _t } from "../Menu.js";
 import { MenuOption as At } from "../MenuOption.js";
-import { Paragraph as w } from "../Paragraph.js";
+import { Paragraph as y } from "../Paragraph.js";
 import { Select as Ft } from "../Select.js";
 import { Subheader as $ } from "../Subheader.js";
 import { useReactTable as Gt, flexRender as Ot } from "../../node_modules/@tanstack/react-table/build/lib/index.js";
-import { useSensors as Ht, useSensor as ae, DndContext as Kt, closestCenter as Vt, KeyboardSensor as Zt, TouchSensor as qt, MouseSensor as Bt } from "../../node_modules/@dnd-kit/core/dist/core.esm.js";
+import { useSensors as Ht, useSensor as de, DndContext as qt, closestCenter as Kt, KeyboardSensor as Vt, TouchSensor as Zt, MouseSensor as Bt } from "../../node_modules/@dnd-kit/core/dist/core.esm.js";
 import { SortableContext as Jt, horizontalListSortingStrategy as Qt, arrayMove as Xt } from "../../node_modules/@dnd-kit/sortable/dist/sortable.esm.js";
 import { restrictToHorizontalAxis as Yt } from "../../node_modules/@dnd-kit/modifiers/dist/modifiers.esm.js";
 import { Notification as Ut } from "../Notification.js";
 import { useVirtualizer as eo } from "../../node_modules/@tanstack/react-virtual/dist/esm/index.js";
-import { clsx as S } from "../../node_modules/clsx/dist/clsx.js";
-import { PinnedColumns as je } from "./PinnedColumns.js";
-import { getSortIcon as We } from "./utils.js";
+import { clsx as v } from "../../node_modules/clsx/dist/clsx.js";
+import { PinnedColumns as We } from "./PinnedColumns.js";
+import { getSortIcon as _e } from "./utils.js";
 import { TableBody as to } from "./TableBody/index.js";
 import { SummaryRow as oo } from "./SummaryRow/index.js";
-import { Spinner as de } from "../Spinner.js";
-import { Tooltip as _e } from "../Tooltip.js";
-import Ae from "../../static/no-results-image.png.js";
+import { Spinner as me } from "../Spinner.js";
+import { Tooltip as Ae } from "../Tooltip.js";
+import Fe from "../../static/no-results-image.png.js";
 import { getExpandedRowModel as no, getGroupedRowModel as ro, getFilteredRowModel as lo, getSortedRowModel as so, getCoreRowModel as io } from "../../node_modules/@tanstack/table-core/build/lib/index.js";
-const co = [5, 10, 15, 20, 25, 30, 35], Fe = "h-[185px]";
+const co = [5, 10, 15, 20, 25, 30, 35], Ge = "h-[185px]";
 function Fo({
   id: s,
-  rowIdAccessor: v,
+  rowIdAccessor: b,
   testid: l,
   data: k,
-  columns: Ge,
+  columns: Oe,
   status: D,
   isLoadingMore: L = !1,
-  onLoadMore: Oe,
+  onLoadMore: He,
   pagination: r,
   showFilterRow: K = !1,
   hasMore: V = !1,
-  sorting: me,
-  onSortingChange: He,
-  columnFilters: ue,
+  sorting: ue,
+  onSortingChange: qe,
+  columnFilters: fe,
   onColumnFiltersChange: Ke,
   rowSelection: Z,
   onRowSelectionChange: E,
-  filteredSortedData: fe,
+  filteredSortedData: ge,
   totalRowCount: M,
   hideStatusBar: Ve,
   centerHeader: Ze,
   enableColumnSelector: he,
-  predeterminedLeftPins: qe = [],
-  predeterminedRightPins: Be = [],
-  useMenuDefaultMinWidth: Je,
-  rowDisabled: Qe,
-  rowDisabledAccessor: Xe,
+  predeterminedLeftPins: Be = [],
+  predeterminedRightPins: Je = [],
+  useMenuDefaultMinWidth: Qe,
+  rowDisabled: Xe,
+  rowDisabledAccessor: Ye,
   isLoading: h = !1,
-  loadingMessage: Ye = "Loading Results",
-  loadingDescription: ge,
+  loadingMessage: Ue = "Loading Results",
+  loadingDescription: pe,
   maxHeight: T,
-  fillHeight: y = !1,
-  manualFiltering: q = !1,
-  notifications: B,
-  summaryRow: pe,
+  fillHeight: C = !1,
+  manualFiltering: B = !1,
+  notifications: J,
+  summaryRow: Se,
   groupBy: j,
-  groupRowMode: J = "spanning",
-  groupDefaultExpand: Se = "none",
-  allowUserGrouping: Q,
-  groupSelectionMode: X = "row",
-  hideGroupedColumns: Ue,
-  grouping: C,
-  onGroupingChange: et,
+  groupRowMode: Q = "spanning",
+  groupDefaultExpand: ve = "none",
+  allowUserGrouping: X,
+  groupSelectionMode: Y = "row",
+  hideGroupedColumns: et,
+  grouping: R,
+  onGroupingChange: tt,
   expanded: W,
-  onExpandedChange: tt,
-  ref: ot
+  onExpandedChange: ot,
+  ref: nt
 }) {
-  Pt(ot, () => ({
-    getSavedLayout: () => rt()
+  Pt(nt, () => ({
+    getSavedLayout: () => lt()
   }));
-  const [ve, be] = f([]), [xe, we] = f([]), [nt, ye] = f({}), [Y, U] = f(null), {
-    columns: b,
-    setColumns: ee,
-    getSavedLayout: rt,
-    resetToDefaults: Ce
-  } = Et(Ge, s ?? l), [Re, te] = f(
-    b.map((e) => e.id)
-  ), [ze, lt] = f(
+  const [be, xe] = g([]), [we, ye] = g([]), [rt, Ce] = g({}), [U, ee] = g(null), {
+    columns: x,
+    setColumns: te,
+    getSavedLayout: lt,
+    resetToDefaults: Re
+  } = Et(Oe, s ?? l), [ze, oe] = g(
+    x.map((e) => e.id)
+  ), [Ie, st] = g(
     Object.fromEntries(
-      b.filter((e) => !!e.id).map((e) => [e.id, e.meta?.visible ?? !0])
+      x.filter((e) => !!e.id).map((e) => [e.id, e.meta?.visible ?? !0])
     )
-  ), Ie = H(
+  ), Ne = q(
     (e) => {
-      lt(
+      st(
         Object.fromEntries(
-          b.filter((o) => !!o.id).map((o) => [o.id, o.meta?.visible ?? !0])
+          x.filter((o) => !!o.id).map((o) => [o.id, o.meta?.visible ?? !0])
         )
-      ), e && te(b.map((o) => o.id));
+      ), e && oe(x.map((o) => o.id));
     },
-    [b]
-  ), st = H(() => {
-    Ce();
-  }, [Ce]);
-  ie(() => {
-    Ie(!0);
-  }, [Ie]);
-  const it = r ? me ?? ve : ve, ct = r ? (e) => {
+    [x]
+  ), it = q(() => {
+    Re();
+  }, [Re]);
+  ce(() => {
+    Ne(!0);
+  }, [Ne]);
+  const ct = r ? ue ?? be : be, at = r ? (e) => {
     const o = typeof e == "function" ? e(
-      me ?? []
+      ue ?? []
     ) : e;
-    (He ?? be)(o);
-  } : be, Ne = r != null || q, at = Ne ? ue ?? xe : xe, dt = Ne ? (e) => {
-    const o = typeof e == "function" ? e(ue ?? []) : e;
-    (Ke ?? we)(o);
-  } : we, R = Z ?? nt, z = ce(R);
-  z.current = R;
-  const $e = H(
+    (qe ?? xe)(o);
+  } : xe, $e = r != null || B, dt = $e ? fe ?? we : we, mt = $e ? (e) => {
+    const o = typeof e == "function" ? e(fe ?? []) : e;
+    (Ke ?? ye)(o);
+  } : ye, z = Z ?? rt, I = ae(z);
+  I.current = z;
+  const Pe = q(
     (e) => {
       if (r) {
-        const o = typeof e == "function" ? e(z.current) : e;
-        z.current = o, (E ?? ye)(o);
+        const o = typeof e == "function" ? e(I.current) : e;
+        I.current = o, (E ?? Ce)(o);
       } else if (Z && E) {
-        const o = typeof e == "function" ? e(z.current) : e;
-        z.current = o, E(o);
+        const o = typeof e == "function" ? e(I.current) : e;
+        I.current = o, E(o);
       } else
-        ye(e);
+        Ce(e);
     },
     [Z, E, r]
-  ), [mt, Pe] = f(
+  ), [ut, ke] = g(
     j ?? []
   );
-  ie(() => {
-    C === void 0 && j !== void 0 && Pe(j);
-  }, [j, C]);
-  const oe = C ?? mt, ut = C !== void 0 ? (e) => {
+  ce(() => {
+    R === void 0 && j !== void 0 && ke(j);
+  }, [j, R]);
+  const ne = R ?? ut, ft = R !== void 0 ? (e) => {
     const o = typeof e == "function" ? e(
-      C
+      R
     ) : e;
-    et?.(o);
-  } : Pe, [ft, ke] = f(
-    () => Se === "all" ? !0 : {}
-  ), ht = W ?? ft, gt = W !== void 0 ? (e) => {
+    tt?.(o);
+  } : ke, [gt, De] = g(
+    () => ve === "all" ? !0 : {}
+  ), ht = W ?? gt, pt = W !== void 0 ? (e) => {
     const o = typeof e == "function" ? e(
       W
     ) : e;
-    tt?.(o);
-  } : ke, pt = Ue ? {
-    ...ze,
-    ...Object.fromEntries(oe.map((e) => [e, !1]))
-  } : ze, St = kt(), u = ce(null), De = ce(!1), vt = H(
+    ot?.(o);
+  } : De, St = et ? {
+    ...Ie,
+    ...Object.fromEntries(ne.map((e) => [e, !1]))
+  } : Ie, vt = kt(), f = ae(null), Le = ae(!1), bt = q(
     (e, o) => {
-      ee((t) => t.map((a) => a.id === e ? {
+      te((t) => t.map((a) => a.id === e ? {
         ...a,
         meta: {
           ...a.meta,
@@ -160,14 +160,14 @@ function Fo({
         }
       } : a));
     },
-    [ee]
+    [te]
   ), c = Gt({
-    columns: b,
+    columns: x,
     data: k,
     defaultColumn: { minSize: 50 },
     getCoreRowModel: io(),
     getSortedRowModel: so(),
-    getFilteredRowModel: q ? void 0 : lo(),
+    getFilteredRowModel: B ? void 0 : lo(),
     getGroupedRowModel: ro(),
     getExpandedRowModel: no(),
     // Grouping only ever happens client-side in this grid — there is no
@@ -182,31 +182,31 @@ function Fo({
     // internal state update on every grouping change.
     autoResetPageIndex: !1,
     autoResetExpanded: !1,
-    manualFiltering: q,
+    manualFiltering: B,
     columnResizeMode: "onChange",
-    getRowId: v ? (e) => String(e[v]) : (e, o) => String(e.id ?? o + 1),
+    getRowId: b ? (e) => String(e[b]) : (e, o) => String(e.id ?? o + 1),
     state: {
-      columnOrder: Re,
-      sorting: it,
-      columnFilters: at,
-      rowSelection: R,
-      columnVisibility: pt,
-      grouping: oe,
+      columnOrder: ze,
+      sorting: ct,
+      columnFilters: dt,
+      rowSelection: z,
+      columnVisibility: St,
+      grouping: ne,
       expanded: ht
     },
     initialState: {
       columnPinning: {
-        left: qe,
-        right: Be
+        left: Be,
+        right: Je
       }
     },
     enableColumnPinning: !0,
-    onColumnOrderChange: te,
-    onSortingChange: P(ct),
-    onColumnFiltersChange: P(dt),
-    onRowSelectionChange: P($e),
-    onGroupingChange: P(ut),
-    onExpandedChange: P(gt),
+    onColumnOrderChange: oe,
+    onSortingChange: P(at),
+    onColumnFiltersChange: P(mt),
+    onRowSelectionChange: P(Pe),
+    onGroupingChange: P(ft),
+    onExpandedChange: P(pt),
     filterFns: {
       startsWith: (e, o, t) => {
         const i = e?.getValue(o);
@@ -218,23 +218,23 @@ function Fo({
       }
     }
   });
-  ie(() => {
-    if (Se !== "first" || W !== void 0)
+  ce(() => {
+    if (ve !== "first" || W !== void 0)
       return;
     const e = {};
     let o = c.getGroupedRowModel().rows.find((t) => t.depth === 0 && t.getIsGrouped());
     for (; o; )
       e[o.id] = !0, o = o.subRows.find((t) => t.getIsGrouped());
-    Object.keys(e).length > 0 && ke(e);
-  }, [oe]);
-  const _ = r ? fe?.map((e) => String(e.id)) ?? [] : Array.from(
+    Object.keys(e).length > 0 && De(e);
+  }, [ne]);
+  const _ = r ? ge?.map((e) => String(e.id)) ?? [] : Array.from(
     { length: M ?? k.length },
     (e, o) => String(o + 1)
-  ), ne = _.every(
-    (e) => R[e]
-  ), bt = !ne && _.some((e) => R[e]), xt = () => {
-    $e((e) => {
-      if (!ne) {
+  ), re = _.every(
+    (e) => z[e]
+  ), xt = !re && _.some((e) => z[e]), wt = () => {
+    Pe((e) => {
+      if (!re) {
         const t = {};
         for (const i of _)
           t[i] = !0;
@@ -248,108 +248,111 @@ function Fo({
     });
   };
   Lt({
-    containerRef: u,
-    onLoadMore: Oe ?? (() => {
+    containerRef: f,
+    onLoadMore: He ?? (() => {
     }),
     isLoading: L,
     enabled: !r
   }), Dt(() => {
-    if (De.current || !u.current) return;
-    const e = u.current.offsetWidth;
+    if (Le.current || !f.current) return;
+    const e = f.current.offsetWidth;
     if (e === 0) return;
-    const o = c.getLeftLeafColumns().reduce((p, O) => p + O.getSize(), 0), t = c.getRightLeafColumns().reduce((p, O) => p + O.getSize(), 0), i = e - o - t, a = c.getCenterLeafColumns();
+    const o = c.getLeftLeafColumns().reduce((u, S) => u + S.getSize(), 0), t = c.getRightLeafColumns().reduce((u, S) => u + S.getSize(), 0), i = e - o - t, a = c.getCenterLeafColumns();
     if (a.length === 0) return;
-    const m = Math.floor(i / a.length), N = {};
-    a.forEach((p) => {
-      N[p.id] = Math.max(m, 50);
-    }), c.setColumnSizing(N), De.current = !0;
+    const m = a.reduce(
+      (u, S) => u + S.getSize(),
+      0
+    ), O = m > 0 ? i / m : 1, H = {};
+    a.forEach((u) => {
+      H[u.id] = Math.max(Math.floor(u.getSize() * O), 50);
+    }), c.setColumnSizing(H), Le.current = !0;
   }, []);
-  const wt = (e) => {
+  const yt = (e) => {
     const { active: o, over: t } = e;
-    o && t && o.id !== t.id && te((i) => {
-      const a = i.indexOf(o.id), m = i.indexOf(t.id), N = Xt(i, a, m);
-      return ee((p) => N.map((zt) => p.find((It) => It.id === zt)).filter(Boolean)), N;
+    o && t && o.id !== t.id && oe((i) => {
+      const a = i.indexOf(o.id), m = i.indexOf(t.id), O = Xt(i, a, m);
+      return te((H) => O.map((S) => H.find((It) => It.id === S)).filter(Boolean)), O;
     });
-  }, yt = Ht(
-    ae(Bt),
-    ae(qt),
-    ae(Zt)
-  ), re = c.getCenterLeafColumns(), Ct = re.map((e) => e.id), Rt = Re.filter(
-    (e) => Ct.includes(e)
+  }, Ct = Ht(
+    de(Bt),
+    de(Zt),
+    de(Vt)
+  ), le = c.getCenterLeafColumns(), Rt = le.map((e) => e.id), zt = ze.filter(
+    (e) => Rt.includes(e)
   ), A = eo({
-    count: re.length,
-    estimateSize: (e) => re[e].getSize(),
-    getScrollElement: () => u.current,
+    count: le.length,
+    estimateSize: (e) => le[e].getSize(),
+    getScrollElement: () => f.current,
     horizontal: !0,
     overscan: 8
-  }), g = A.getVirtualItems();
-  let F, I;
-  A && g?.length && (F = g[0]?.start ?? 0, I = A.getTotalSize() - (g[g.length - 1]?.end ?? 0));
-  const G = c.getRowModel().rows.length === 0, x = pe && !G ? pe : void 0, le = x ? c.getFilteredRowModel().rows.map((e) => e.original) : [], se = x ? r ? fe ?? k : k : [];
+  }), p = A.getVirtualItems();
+  let F, N;
+  A && p?.length && (F = p[0]?.start ?? 0, N = A.getTotalSize() - (p[p.length - 1]?.end ?? 0));
+  const G = c.getRowModel().rows.length === 0, w = Se && !G ? Se : void 0, se = w ? c.getFilteredRowModel().rows.map((e) => e.original) : [], ie = w ? r ? ge ?? k : k : [];
   return /* @__PURE__ */ n(
-    Kt,
+    qt,
     {
-      id: St,
-      collisionDetection: Vt,
+      id: vt,
+      collisionDetection: Kt,
       modifiers: [Yt],
-      onDragEnd: wt,
-      sensors: yt,
+      onDragEnd: yt,
+      sensors: Ct,
       children: /* @__PURE__ */ n(
         Jt,
         {
-          items: Rt,
+          items: zt,
           strategy: Qt,
           children: /* @__PURE__ */ d(
             "div",
             {
-              className: S(
+              className: v(
                 "flex flex-col gap-2 w-full",
-                y ? "grow min-h-0" : "grow-0 h-fit"
+                C ? "grow min-h-0" : "grow-0 h-fit"
               ),
               children: [
-                B && B.length > 0 && /* @__PURE__ */ n("div", { className: "flex flex-col gap-2 shrink-0 [color:initial]", children: B.map((e, o) => /* @__PURE__ */ n(Ut, { ...e }, e.id ?? o)) }),
+                J && J.length > 0 && /* @__PURE__ */ n("div", { className: "flex flex-col gap-2 shrink-0 [color:initial]", children: J.map((e, o) => /* @__PURE__ */ n(Ut, { ...e }, e.id ?? o)) }),
                 /* @__PURE__ */ d(
                   "div",
                   {
                     id: s,
                     "data-testid": l,
-                    className: S(
+                    className: v(
                       "flex flex-col rounded border border-border-primary-normal overflow-hidden text-text-primary-normal",
-                      y ? "flex-1 min-h-0" : "grow-0 h-fit"
+                      C ? "flex-1 min-h-0" : "grow-0 h-fit"
                     ),
                     children: [
                       /* @__PURE__ */ d(
                         "div",
                         {
-                          className: S(
+                          className: v(
                             "flex overflow-auto scrollbar-thin relative contain-paint will-change-transform",
-                            G ? "overflow-y-hidden" : !y && "min-h-[120px]",
-                            y && "flex-1 min-h-0"
+                            G ? "overflow-y-hidden" : !C && "min-h-[120px]",
+                            C && "flex-1 min-h-0"
                           ),
                           style: T !== void 0 ? { maxHeight: typeof T == "number" ? `${T}px` : T } : void 0,
-                          ref: u,
+                          ref: f,
                           inert: h || void 0,
                           "aria-busy": h || void 0,
                           children: [
                             /* @__PURE__ */ n(
-                              je,
+                              We,
                               {
                                 testid: l,
                                 pinDirection: "left",
                                 table: c,
-                                tableContainerRef: u,
+                                tableContainerRef: f,
                                 pagination: r,
                                 isLoadingMore: L,
                                 hasMore: V,
                                 showFilterRow: K,
-                                groupRowMode: J,
-                                groupSelectionMode: X,
-                                allowUserGrouping: Q,
-                                hoveredRowId: Y,
-                                setHoveredRowId: U,
-                                summaryRow: x,
-                                filteredRows: le,
-                                allRows: se,
+                                groupRowMode: Q,
+                                groupSelectionMode: Y,
+                                allowUserGrouping: X,
+                                hoveredRowId: U,
+                                setHoveredRowId: ee,
+                                summaryRow: w,
+                                filteredRows: se,
+                                allRows: ie,
                                 totalRowCount: M
                               }
                             ),
@@ -370,7 +373,7 @@ function Fo({
                                         }
                                       )
                                     ) : null,
-                                    g.map((o) => {
+                                    p.map((o) => {
                                       const t = e.headers[o.index];
                                       if (t) {
                                         if (typeof t.column.columnDef.header == "string") {
@@ -384,9 +387,9 @@ function Fo({
                                               header: t,
                                               locked: t.column.columnDef.meta?.locked,
                                               center: Ze,
-                                              allowUserGrouping: Q,
-                                              isLast: !I && o.index === g[g.length - 1]?.index,
-                                              className: S(
+                                              allowUserGrouping: X,
+                                              isLast: !N && o.index === p[p.length - 1]?.index,
+                                              className: v(
                                                 t.column.getCanSort() ? "cursor-pointer" : "cursor-grab",
                                                 "group",
                                                 {
@@ -394,10 +397,10 @@ function Fo({
                                                   "justify-end": a === "right"
                                                 }
                                               ),
-                                              useMenuDefaultMinWidth: Je,
+                                              useMenuDefaultMinWidth: Qe,
                                               children: [
                                                 a === "left" && /* @__PURE__ */ n(
-                                                  _e,
+                                                  Ae,
                                                   {
                                                     showOnTruncation: !0,
                                                     message: t.column.columnDef.header,
@@ -405,14 +408,14 @@ function Fo({
                                                     children: /* @__PURE__ */ n($, { as: "p", addOverflow: !0, tall: !0, children: t.column.columnDef.header })
                                                   }
                                                 ),
-                                                We(t.column.getIsSorted()),
-                                                !t.column.getIsSorted() && t.column.getCanSort() && !c.getState().columnSizingInfo.isResizingColumn && We(
+                                                _e(t.column.getIsSorted()),
+                                                !t.column.getIsSorted() && t.column.getCanSort() && !c.getState().columnSizingInfo.isResizingColumn && _e(
                                                   t.column.getNextSortingOrder(),
                                                   !0
                                                 ),
                                                 t.column.getSortIndex() !== -1 && c.getState().sorting.length > 1 && /* @__PURE__ */ n($, { tall: !0, children: t.column.getSortIndex() + 1 }),
                                                 a === "right" && /* @__PURE__ */ n(
-                                                  _e,
+                                                  Ae,
                                                   {
                                                     showOnTruncation: !0,
                                                     message: t.column.columnDef.header,
@@ -453,9 +456,9 @@ function Fo({
                                               {
                                                 id: s ? `${s}-select-all-checkbox` : void 0,
                                                 testid: l ? `${l}-select-all-checkbox` : void 0,
-                                                checked: ne,
-                                                indeterminate: bt,
-                                                onChange: xt
+                                                checked: re,
+                                                indeterminate: xt,
+                                                onChange: wt
                                               }
                                             )
                                           }
@@ -465,12 +468,12 @@ function Fo({
                                         ) }, t.id);
                                       }
                                     }),
-                                    I ? (
+                                    N ? (
                                       //fake empty column to the right for virtualization scroll padding
                                       /* @__PURE__ */ n(
                                         "th",
                                         {
-                                          style: { display: "flex", width: I }
+                                          style: { display: "flex", width: N }
                                         }
                                       )
                                     ) : null
@@ -485,59 +488,59 @@ function Fo({
                                   testid: l,
                                   columnVirtualizer: A,
                                   table: c,
-                                  tableContainerRef: u,
+                                  tableContainerRef: f,
                                   virtualPaddingLeft: F,
-                                  virtualPaddingRight: I,
+                                  virtualPaddingRight: N,
                                   pagination: r,
                                   isLoadingMore: L,
                                   hasMore: V,
                                   showFilterRow: K,
                                   enableColumnSelector: he,
-                                  groupRowMode: J,
-                                  groupSelectionMode: X,
-                                  rowDisabled: Qe,
-                                  rowDisabledAccessor: Xe,
-                                  hoveredRowId: Y,
-                                  setHoveredRowId: U
+                                  groupRowMode: Q,
+                                  groupSelectionMode: Y,
+                                  rowDisabled: Xe,
+                                  rowDisabledAccessor: Ye,
+                                  hoveredRowId: U,
+                                  setHoveredRowId: ee
                                 }
                               ),
-                              x && /* @__PURE__ */ n(
+                              w && /* @__PURE__ */ n(
                                 oo,
                                 {
                                   id: s,
                                   testid: l,
                                   table: c,
-                                  summaryConfig: x,
-                                  filteredRows: le,
-                                  allRows: se,
+                                  summaryConfig: w,
+                                  filteredRows: se,
+                                  allRows: ie,
                                   totalRowCount: M,
                                   locked: !1
                                 }
                               )
                             ] }),
                             /* @__PURE__ */ n(
-                              je,
+                              We,
                               {
                                 id: s,
                                 enableColumnSelector: he,
-                                toggleColumnVisibility: vt,
-                                resetColumnVisibility: st,
+                                toggleColumnVisibility: bt,
+                                resetColumnVisibility: it,
                                 testid: l,
                                 pinDirection: "right",
                                 table: c,
-                                tableContainerRef: u,
+                                tableContainerRef: f,
                                 pagination: r,
                                 isLoadingMore: L,
                                 hasMore: V,
                                 showFilterRow: K,
-                                groupRowMode: J,
-                                groupSelectionMode: X,
-                                allowUserGrouping: Q,
-                                hoveredRowId: Y,
-                                setHoveredRowId: U,
-                                summaryRow: x,
-                                filteredRows: le,
-                                allRows: se,
+                                groupRowMode: Q,
+                                groupSelectionMode: Y,
+                                allowUserGrouping: X,
+                                hoveredRowId: U,
+                                setHoveredRowId: ee,
+                                summaryRow: w,
+                                filteredRows: se,
+                                allRows: ie,
                                 totalRowCount: M
                               }
                             )
@@ -547,34 +550,34 @@ function Fo({
                       h && G && /* @__PURE__ */ d(
                         "div",
                         {
-                          className: S(
-                            Fe,
+                          className: v(
+                            Ge,
                             "flex flex-col items-center justify-center",
-                            Le,
-                            Ee
+                            Ee,
+                            Me
                           ),
                           children: [
-                            /* @__PURE__ */ n(de, { size: "large" }),
-                            /* @__PURE__ */ n($, { color: "text-secondary-normal", children: Ye }),
-                            ge && /* @__PURE__ */ n(w, { color: "text-secondary-normal", children: ge })
+                            /* @__PURE__ */ n(me, { size: "large" }),
+                            /* @__PURE__ */ n($, { color: "text-secondary-normal", children: Ue }),
+                            pe && /* @__PURE__ */ n(y, { color: "text-secondary-normal", children: pe })
                           ]
                         }
                       ),
                       !h && G && /* @__PURE__ */ d(
                         "div",
                         {
-                          className: S(
-                            Fe,
+                          className: v(
+                            Ge,
                             "flex flex-col items-center justify-center",
-                            Le,
-                            Ee
+                            Ee,
+                            Me
                           ),
                           "data-testid": l ? `${l}-no-results` : void 0,
                           children: [
                             /* @__PURE__ */ n(
                               "img",
                               {
-                                src: Ae?.src ?? Ae,
+                                src: Fe?.src ?? Fe,
                                 alt: "No Results",
                                 className: "h-30 opacity-20",
                                 width: 120,
@@ -582,15 +585,15 @@ function Fo({
                               }
                             ),
                             /* @__PURE__ */ n($, { color: "text-secondary-normal", children: "No Results" }),
-                            /* @__PURE__ */ n(w, { color: "text-secondary-normal", children: "To view results, enter or update your search criteria." })
+                            /* @__PURE__ */ n(y, { color: "text-secondary-normal", children: "To view results, enter or update your search criteria." })
                           ]
                         }
                       ),
-                      !Ve && /* @__PURE__ */ d("div", { className: S("p-2 pt-[7px] border-t border-border-primary-normal min-h-[34px]", !y && "h-full"), children: [
+                      !Ve && /* @__PURE__ */ d("div", { className: v("p-2 pt-[7px] border-t border-border-primary-normal min-h-[34px]", !C && "h-full"), children: [
                         r && /* @__PURE__ */ d("div", { className: "flex justify-between items-center", children: [
                           /* @__PURE__ */ n("div", { className: "flex items-center gap-1 w-min", children: h ? /* @__PURE__ */ d("div", { className: "flex items-center gap-2 whitespace-nowrap", children: [
-                            /* @__PURE__ */ n(de, { size: "small" }),
-                            /* @__PURE__ */ n(w, { children: D || "Loading..." })
+                            /* @__PURE__ */ n(me, { size: "small" }),
+                            /* @__PURE__ */ n(y, { children: D || "Loading..." })
                           ] }) : /* @__PURE__ */ d(Nt, { children: [
                             /* @__PURE__ */ n(
                               Ft,
@@ -624,18 +627,18 @@ function Fo({
                           ] }) }),
                           /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
                             /* @__PURE__ */ n(
-                              Me,
+                              Te,
                               {
                                 id: s ? `${s}-prev-page-button` : void 0,
                                 testid: l ? `${l}-prev-page-button` : void 0,
                                 iconOnly: !0,
-                                leftIcon: /* @__PURE__ */ n(Te, { name: "chevron_left" }),
+                                leftIcon: /* @__PURE__ */ n(je, { name: "chevron_left" }),
                                 onClick: () => r.onPageChange(r.pageIndex - 1),
                                 variant: "tertiary",
                                 disabled: r.pageIndex === 0
                               }
                             ),
-                            /* @__PURE__ */ d(w, { children: [
+                            /* @__PURE__ */ d(y, { children: [
                               r.pageIndex * r.pageSize + 1,
                               " -",
                               " ",
@@ -648,12 +651,12 @@ function Fo({
                               r.total
                             ] }),
                             /* @__PURE__ */ n(
-                              Me,
+                              Te,
                               {
                                 id: s ? `${s}-next-page-button` : void 0,
                                 testid: l ? `${l}-next-page-button` : void 0,
                                 iconOnly: !0,
-                                leftIcon: /* @__PURE__ */ n(Te, { name: "chevron_right" }),
+                                leftIcon: /* @__PURE__ */ n(je, { name: "chevron_right" }),
                                 onClick: () => r.onPageChange(r.pageIndex + 1),
                                 variant: "tertiary",
                                 disabled: (r.pageIndex + 1) * r.pageSize >= r.total
@@ -662,11 +665,11 @@ function Fo({
                           ] })
                         ] }),
                         !r && h && /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
-                          /* @__PURE__ */ n(de, { size: "small" }),
-                          /* @__PURE__ */ n(w, { testid: l ? `${l}-status-text` : void 0, children: D || "Loading..." })
+                          /* @__PURE__ */ n(me, { size: "small" }),
+                          /* @__PURE__ */ n(y, { testid: l ? `${l}-status-text` : void 0, children: D || "Loading..." })
                         ] }),
                         !r && !h && D && /* @__PURE__ */ n(
-                          w,
+                          y,
                           {
                             testid: l ? `${l}-status-text` : void 0,
                             children: D
@@ -685,9 +688,9 @@ function Fo({
   );
 }
 function P(s) {
-  return (v) => {
+  return (b) => {
     s(
-      (l) => typeof v == "function" ? v(l) : v
+      (l) => typeof b == "function" ? b(l) : b
     );
   };
 }

package/dist/components/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAGpE,MAAM,MAAM,SAAS,GAAG,OAAO,GAC7B,cAAc,GACd,eAAe,GAAG;IAChB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C,eAAe,CAAC,EAAE,WAAW,GAAG,SAAS,GAAG,YAAY,CAAC;IACzD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEJ,wBAAgB,IAAI,CAAC,EACnB,EAAQ,EACR,SAAS,EACT,OAAmB,EACnB,eAA6B,EAC7B,QAAgB,EAChB,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAiB,EACjB,MAAM,EACN,MAAM,EACN,KAAa,EACb,WAAW,EACX,GAAG,KAAK,EACT,EAAE,SAAS,2CAmFX"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAGpE,MAAM,MAAM,SAAS,GAAG,OAAO,GAC7B,cAAc,GACd,eAAe,GAAG;IAChB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C,eAAe,CAAC,EAAE,WAAW,GAAG,SAAS,GAAG,YAAY,CAAC;IACzD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEJ,wBAAgB,IAAI,CAAC,EACnB,EAAQ,EACR,SAAS,EACT,OAAmB,EACnB,eAA6B,EAC7B,QAAgB,EAChB,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAiB,EACjB,MAAM,EACN,MAAM,EACN,KAAa,EACb,WAAW,EACX,GAAG,KAAK,EACT,EAAE,SAAS,2CAsFX"}

package/dist/components/Link.js

@@ -1,64 +1,67 @@
 import { jsx as C } from "react/jsx-runtime";
-import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
+import { clsx as r } from "../node_modules/clsx/dist/clsx.js";
 import { baseTransition as D, typography as l, componentPaddingY as I } from "../classNames.js";
 function T({
-  as: x = "a",
-  className: s,
-  variant: r = "primary",
+  as: s = "a",
+  className: x,
+  variant: i = "primary",
   typographyStyle: o = "paragraph",
   disabled: t = !1,
-  color: c,
+  color: n,
   paddedY: p,
-  align: i,
+  align: e,
   underline: d = !1,
   testid: f,
-  active: n,
+  active: c,
   block: m = !1,
   addOverflow: u,
   ...a
 }) {
-  const y = x, v = r === "primary" && !t && e(
-    n ? "text-text-link-active" : "text-text-link-normal",
+  const y = s, v = i === "primary" && !t && r(
+    c ? "text-text-link-active" : "text-text-link-normal",
     "hover:text-text-link-hover active:text-text-link-active"
-  ), h = r === "secondary" && !t && e(
-    n ? "text-text-link-active" : "text-text-primary-normal",
+  ), h = i === "secondary" && !t && r(
+    c ? "text-text-link-active" : "text-text-primary-normal",
     "hover:text-text-link-hover active:text-text-link-active"
-  ), S = r === "critical" && !t && e(
-    n ? "text-text-action-critical-active" : "text-text-action-critical-normal",
+  ), S = i === "critical" && !t && r(
+    c ? "text-text-action-critical-active" : "text-text-action-critical-normal",
     "hover:text-text-action-critical-hover active:text-text-action-critical-active"
-  ), k = t && r === "critical" && e("text-text-action-critical-disabled"), g = t && ["primary", "secondary"].includes(r) && e("text-text-link-disabled"), w = t && e("pointer-events-none cursor-default"), j = d ? "decoration-current" : "decoration-decoration-underline", Y = p && I;
+  ), k = t && i === "critical" && r("text-text-action-critical-disabled"), w = t && ["primary", "secondary"].includes(i) && r("text-text-link-disabled"), g = t && r("pointer-events-none cursor-default"), j = d ? "decoration-current" : "decoration-decoration-underline", Y = p && I;
   return /* @__PURE__ */ C(
     y,
     {
-      className: e(
+      className: r(
         "inline",
         t ? "cursor-default" : "cursor-pointer",
         "underline decoration-[10%] underline-offset-[32%]",
         !t && "hover:decoration-current",
         !t && "active:decoration-decoration-underline",
-        "flex flex-col items-center justify-center",
+        "flex flex-col justify-center",
+        (!e || e === "center") && "items-center",
+        e === "left" && "items-start",
+        e === "right" && "items-end",
         D,
         v,
         h,
         S,
         k,
-        g,
         w,
+        g,
         j,
         o === "caption" && l.caption,
         o === "paragraph" && l.paragraph,
-        i === "left" && "text-left",
-        i === "center" && "text-center",
-        i === "right" && "text-right",
+        e === "left" && "text-left",
+        e === "center" && "text-center",
+        e === "right" && "text-right",
         Y,
         u && "whitespace-nowrap text-ellipsis overflow-hidden",
-        s,
+        x,
         m ? "w-full" : "w-fit"
       ),
       ...a,
       style: {
         ...a.style,
-        color: c ? `var(--color-${c})` : void 0
+        color: n ? `var(--color-${n})` : void 0
       },
       "aria-disabled": t,
       tabIndex: t ? -1 : void 0,

package/dist/components/MainBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MainBar.d.ts","sourceRoot":"","sources":["../../src/components/MainBar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASlD,KAAK,YAAY,GAAG;IAClB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAE/B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oQAAoQ;IACpQ,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,EAAE,EACF,MAAM,EACN,WAAW,EAAE,IAAI,EACjB,YAAY,EAAE,KAAK,EACnB,iBAAiB,EAAE,UAAU,EAC7B,kBAAkB,EAAE,WAAW,EAC/B,MAAc,EACd,aAAqB,EACrB,IAAI,GACL,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,2CA6DtC"}
+{"version":3,"file":"MainBar.d.ts","sourceRoot":"","sources":["../../src/components/MainBar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASlD,KAAK,YAAY,GAAG;IAClB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAE/B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oQAAoQ;IACpQ,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,EAAE,EACF,MAAM,EACN,WAAW,EAAE,IAAI,EACjB,YAAY,EAAE,KAAK,EACnB,iBAAiB,EAAE,UAAU,EAC7B,kBAAkB,EAAE,WAAW,EAC/B,MAAc,EACd,aAAqB,EACrB,IAAI,GACL,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,2CAkEtC"}

package/dist/components/MainBar.js

@@ -1,45 +1,48 @@
-import { jsx as e, Fragment as f, jsxs as r } from "react/jsx-runtime";
+import { jsx as e, Fragment as h, jsxs as c } from "react/jsx-runtime";
 import { clsx as n } from "../node_modules/clsx/dist/clsx.js";
-import { layoutGap as s, layoutGroupGap as x, containerPaddingX as g, containerPaddingY as u, componentPaddingTopUsingComponentGap2xMobile as b } from "../classNames.js";
-function w({
-  id: c,
-  testid: l,
-  leftContent: a,
+import { layoutGap as l, layoutGroupGap as k, containerPaddingX as u, containerPaddingY as g, componentPaddingTopUsingComponentGap2xMobile as b } from "../classNames.js";
+function C({
+  id: r,
+  testid: m,
+  leftContent: s,
   rightContent: o,
   mobileLeftContent: i,
-  mobileRightContent: d,
-  footer: m = !1,
-  centerContent: p = !1,
+  mobileRightContent: p,
+  footer: x = !1,
+  centerContent: f = !1,
   cart: t
 }) {
-  return !a && !o ? /* @__PURE__ */ e(f, {}) : /* @__PURE__ */ r(
+  const a = !!(s || o || t), d = !!(i || p);
+  return !a && !d ? /* @__PURE__ */ e(h, {}) : /* @__PURE__ */ c(
     "div",
     {
-      id: c,
-      "data-testid": l,
+      id: r,
+      "data-testid": m,
       className: n(
         "min-h-mobile-container-padding",
         "bg-background-brand-normal items-center justify-between",
         "z-10 shadow-4",
-        "flex",
-        x,
-        g,
-        m ? u : p ? "py-[calc((var(--spacing-mobile-component-gap)_+_8px)_/_2)] desktop:py-desktop-component-gap compact:py-desktop-compact-component-gap" : b
+        a && d && "flex",
+        a && !d && "hidden desktop:flex",
+        !a && d && "flex desktop:hidden",
+        k,
+        u,
+        x ? g : f ? "py-[calc((var(--spacing-mobile-component-gap)_+_8px)_/_2)] desktop:py-desktop-component-gap compact:py-desktop-compact-component-gap" : b
       ),
       children: [
-        a && /* @__PURE__ */ e(
+        s && /* @__PURE__ */ e(
           "div",
           {
-            className: n("hidden desktop:flex items-center flex-1 min-w-0 overflow-x-auto no-scrollbar", s),
-            children: a
+            className: n("hidden desktop:flex items-center flex-1 min-w-0 overflow-x-auto no-scrollbar", l),
+            children: s
           }
         ),
-        (o || t) && /* @__PURE__ */ r(
+        (o || t) && /* @__PURE__ */ c(
           "div",
           {
             className: n(
               "hidden desktop:flex items-center ml-auto",
-              s
+              l
             ),
             children: [
               o,
@@ -49,11 +52,11 @@ function w({
           }
         ),
         i && /* @__PURE__ */ e("div", { className: n("flex items-center desktop:hidden flex-1 min-w-0 overflow-x-auto no-scrollbar"), children: i }),
-        d && /* @__PURE__ */ e("div", { className: n("flex items-center desktop:hidden"), children: d })
+        p && /* @__PURE__ */ e("div", { className: n("flex items-center desktop:hidden"), children: p })
       ]
     }
   );
 }
 export {
-  w as MainBar
+  C as MainBar
 };

package/dist/components/MobileNavMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MobileNavMenu.d.ts","sourceRoot":"","sources":["../../src/components/MobileNavMenu.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAc,eAAe,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAYlF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,WAAW,EAAE,eAAe,CAAC;IAC7B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC9C,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC7B,sDAAsD;IACtD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,qFAAqF;IACrF,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,qBAAqB,CAAC;CAC5C,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,MAAM,EACN,WAAW,EACX,IAAI,EACJ,OAAO,EACP,UAAU,EACV,SAAkB,EAClB,MAAM,EACN,mBAA2B,EAC3B,KAAe,EACf,kBAAkB,GACnB,EAAE,kBAAkB,sCA4MpB"}
+{"version":3,"file":"MobileNavMenu.d.ts","sourceRoot":"","sources":["../../src/components/MobileNavMenu.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAc,eAAe,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAYlF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,WAAW,EAAE,eAAe,CAAC;IAC7B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC9C,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC7B,sDAAsD;IACtD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,qFAAqF;IACrF,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,qBAAqB,CAAC;CAC5C,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,MAAM,EACN,WAAW,EACX,IAAI,EACJ,OAAO,EACP,UAAU,EACV,SAAkB,EAClB,MAAM,EACN,mBAA2B,EAC3B,KAAe,EACf,kBAAkB,GACnB,EAAE,kBAAkB,sCA6MpB"}

package/dist/components/MobileNavMenu.js

@@ -1,21 +1,22 @@
 "use client";
-import { jsxs as a, Fragment as N, jsx as n } from "react/jsx-runtime";
-import { useState as g, useRef as $, useLayoutEffect as I, useEffect as w } from "react";
-import { createPortal as j } from "react-dom";
-import { NestedMenu as A } from "./NestedMenu.js";
-import { MenuOption as D } from "./MenuOption.js";
+import { jsxs as a, Fragment as $, jsx as o } from "react/jsx-runtime";
+import { useState as g, useRef as I, useLayoutEffect as j, useEffect as w } from "react";
+import { createPortal as A } from "react-dom";
+import { NestedMenu as D } from "./NestedMenu.js";
+import { MenuOption as H } from "./MenuOption.js";
 import { Icon as m } from "./Icon.js";
 import { Stack as k } from "./Stack.js";
-import { Button as H } from "./Button.js";
-import { Heading1 as L } from "./Heading.js";
-import { Theme as R } from "./Theme.js";
-import { useMounted as X } from "../hooks/useMounted.js";
-import { useKeydown as Y } from "../hooks/useKeydown.js";
-import { findDocumentRoot as K } from "../utils.js";
+import { Button as L } from "./Button.js";
+import { Heading1 as R } from "./Heading.js";
+import { Theme as X } from "./Theme.js";
+import { useMatchesMobile as Y } from "../hooks/useMatchesMedia.js";
+import { useMounted as K } from "../hooks/useMounted.js";
+import { useKeydown as O } from "../hooks/useKeydown.js";
+import { findDocumentRoot as T } from "../utils.js";
 import { clsx as v } from "../node_modules/clsx/dist/clsx.js";
-function te({
+function re({
   id: c,
-  testid: o,
+  testid: n,
   currentMenu: i,
   open: r,
   onClose: l,
@@ -23,17 +24,17 @@ function te({
   direction: b = "left",
   footer: E,
   hideFooterOnSubMenu: x = !1,
-  theme: C = "brand",
-  pinnedSubMenuEntry: M
+  theme: M = "brand",
+  pinnedSubMenuEntry: C
 }) {
   const [s, d] = g(
     null
-  ), [y, u] = g(0), z = X(), p = $(null), S = {
+  ), [p, u] = g(0), z = K(), S = Y(), y = I(null), N = {
     transform: r ? "translateX(0)" : b === "right" ? "translateX(100%)" : "translateX(-100%)"
   };
-  I(() => {
+  j(() => {
     r && (d(null), u(0));
-  }, [r]), Y(
+  }, [r]), O(
     {
       ArrowUp: () => {
         const e = i.subEntries?.length || 0;
@@ -44,7 +45,7 @@ function te({
         e !== 0 && u((t) => t >= e - 1 ? 0 : t + 1);
       },
       "Enter/Space": () => {
-        const e = (i.subEntries || [])[y];
+        const e = (i.subEntries || [])[p];
         e && f(
           e,
           e.subEntries?.length ? "subEntry" : e.onClick ? "onClick" : void 0
@@ -79,9 +80,9 @@ function te({
     }
     e.url && (h?.(e), l());
   }
-  return z ? j(
-    /* @__PURE__ */ a(N, { children: [
-      /* @__PURE__ */ n(
+  return !z || !S ? null : A(
+    /* @__PURE__ */ a($, { children: [
+      /* @__PURE__ */ o(
         "div",
         {
           className: v(
@@ -97,8 +98,8 @@ function te({
         "div",
         {
           id: c,
-          "data-testid": o,
-          ref: p,
+          "data-testid": n,
+          ref: y,
           role: "dialog",
           "aria-modal": "true",
           className: v(
@@ -107,9 +108,9 @@ function te({
             "transition-transform duration-300 ease-in-out",
             b === "right" ? "right-0" : "left-0"
           ),
-          style: S,
+          style: N,
           children: [
-            /* @__PURE__ */ n(R, { theme: C, children: /* @__PURE__ */ a(
+            /* @__PURE__ */ o(X, { theme: M, children: /* @__PURE__ */ a(
               k,
               {
                 horizontal: !0,
@@ -120,14 +121,14 @@ function te({
                 justify: "between",
                 backgroundColor: "background-primary-normal",
                 children: [
-                  /* @__PURE__ */ n(L, { color: "text-primary-normal", children: s?.label ?? i.label }),
-                  /* @__PURE__ */ n(
-                    H,
+                  /* @__PURE__ */ o(R, { color: "text-primary-normal", children: s?.label ?? i.label }),
+                  /* @__PURE__ */ o(
+                    L,
                     {
                       id: c ? `${c}-close-button` : void 0,
-                      testid: o ? `${o}-close-button` : void 0,
+                      testid: n ? `${n}-close-button` : void 0,
                       iconOnly: !0,
-                      leftIcon: /* @__PURE__ */ n(m, { className: "icon", name: "close", size: 24 }),
+                      leftIcon: /* @__PURE__ */ o(m, { className: "icon", name: "close", size: 24 }),
                       variant: "tertiary",
                       onClick: l
                     }
@@ -136,25 +137,25 @@ function te({
               }
             ) }),
             /* @__PURE__ */ a(k, { justify: "between", overflowY: "auto", grow: !0, children: [
-              /* @__PURE__ */ n("div", { className: "my-4", children: s ? /* @__PURE__ */ n(
-                A,
+              /* @__PURE__ */ o("div", { className: "my-4", children: s ? /* @__PURE__ */ o(
+                D,
                 {
-                  testid: o ? `${o}-nested-menu` : void 0,
+                  testid: n ? `${n}-nested-menu` : void 0,
                   currentMenu: s,
                   onMenuClick: f,
-                  pinnedEntry: M
+                  pinnedEntry: C
                 }
-              ) : (i.subEntries ?? []).map((e, t) => /* @__PURE__ */ n(
-                D,
+              ) : (i.subEntries ?? []).map((e, t) => /* @__PURE__ */ o(
+                H,
                 {
-                  testid: o ? `${o}-${e.id}` : void 0,
-                  selected: y === t,
+                  testid: n ? `${n}-${e.id}` : void 0,
+                  selected: p === t,
                   onClick: () => f(
                     e,
                     e.subEntries?.length ? "subEntry" : e.onClick ? "onClick" : void 0
                   ),
-                  before: e.icon ? /* @__PURE__ */ n(m, { name: e.icon }) : void 0,
-                  after: e.subEntries?.length ? /* @__PURE__ */ n(m, { name: "chevron_right", className: "icon", size: 24 }) : void 0,
+                  before: e.icon ? /* @__PURE__ */ o(m, { name: e.icon }) : void 0,
+                  after: e.subEntries?.length ? /* @__PURE__ */ o(m, { name: "chevron_right", className: "icon", size: 24 }) : void 0,
                   children: e.label
                 },
                 e.id
@@ -165,9 +166,9 @@ function te({
         }
       )
     ] }),
-    K(p.current)
-  ) : null;
+    T(y.current)
+  );
 }
 export {
-  te as MobileNavMenu
+  re as MobileNavMenu
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dmsi/wedgekit-react",
-  "version": "2.1.0",
+  "version": "2.1.2",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",