@pismo/marola 1.0.0-beta.22 → 1.0.0-beta.24

package/dist/components/Tabs/Tabs.js

@@ -1,11 +1,12 @@
 import { jsx as T } from "react/jsx-runtime";
 import * as r from "react";
-import { forwardRef as q, useState as B } from "react";
-import { T as G, u as J, s as Q } from "../../Tabs.module-jkH1Qjn7.js";
-import { Tab as Le } from "./Tab.js";
-import { TabPanel as _e } from "./TabPanel.js";
-import { g as I, a as _, b as C, _ as F, c as $, P as t, d as N, e as M } from "../../useSlotProps-C_I1kEHr.js";
-import { a as O, C as S } from "../../useCompoundItem-B7Eo_qZk.js";
+import { forwardRef as q } from "react";
+import { c as B } from "../../clsx-DB4S2d7J.js";
+import { T as G, u as J, s as Q } from "../../Tabs.module-BGGTkDc5.js";
+import { Tab as Ie } from "./Tab.js";
+import { TabPanel as Fe } from "./TabPanel.js";
+import { g as I, a as _, b as C, _ as F, c as $, P as t, d as N, e as w } from "../../useSlotProps-C_I1kEHr.js";
+import { a as M, C as O } from "../../useCompoundItem-B7Eo_qZk.js";
 import { u as X } from "../../useControlled-CCMYYdCM.js";
 import { L as Y, a as Z } from "../../combineHooksSlotProps-C-zYvfnF.js";
 import { l as ee, m as te, u as oe } from "../../useList-B9C55YB7.js";
@@ -18,21 +19,21 @@ function ne(s) {
   const {
     value: e,
     defaultValue: o,
-    onChange: n,
-    orientation: i = "horizontal",
+    onChange: l,
+    orientation: a = "horizontal",
     direction: c = "ltr",
-    selectionFollowsFocus: l = !1
-  } = s, [d, u] = X({
+    selectionFollowsFocus: n = !1
+  } = s, [d, i] = X({
     controlled: e,
     default: o,
     name: "Tabs",
     state: "value"
-  }), a = r.useCallback((x, y) => {
-    u(y), n == null || n(x, y);
-  }, [n, u]), {
+  }), u = r.useCallback((x, y) => {
+    i(y), l == null || l(x, y);
+  }, [l, i]), {
     subitems: m,
-    contextValue: g
-  } = O(), p = r.useRef(() => {
+    contextValue: h
+  } = M(), p = r.useRef(() => {
   }), f = r.useCallback((x) => {
     var y;
     return (y = m.get(x)) == null ? void 0 : y.id;
@@ -44,12 +45,12 @@ function ne(s) {
       direction: c,
       getTabId: b,
       getTabPanelId: f,
-      onSelected: a,
-      orientation: i,
+      onSelected: u,
+      orientation: a,
       registerTabIdLookup: P,
-      selectionFollowsFocus: l,
+      selectionFollowsFocus: n,
       value: d
-    }, g)
+    }, h)
   };
 }
 function le(s) {
@@ -57,32 +58,32 @@ function le(s) {
     value: e,
     children: o
   } = s, {
-    direction: n,
-    getItemIndex: i,
+    direction: l,
+    getItemIndex: a,
     onSelected: c,
-    orientation: l,
+    orientation: n,
     registerItem: d,
-    registerTabIdLookup: u,
-    selectionFollowsFocus: a,
+    registerTabIdLookup: i,
+    selectionFollowsFocus: u,
     totalSubitemCount: m,
-    value: g,
+    value: h,
     getTabId: p,
     getTabPanelId: f
   } = e, b = r.useMemo(() => ({
-    getItemIndex: i,
+    getItemIndex: a,
     registerItem: d,
     totalSubitemCount: m
-  }), [d, i, m]), P = r.useMemo(() => ({
-    direction: n,
+  }), [d, a, m]), P = r.useMemo(() => ({
+    direction: l,
     getTabId: p,
     getTabPanelId: f,
     onSelected: c,
-    orientation: l,
-    registerTabIdLookup: u,
-    selectionFollowsFocus: a,
-    value: g
-  }), [n, p, f, c, l, u, a, g]);
-  return /* @__PURE__ */ T(S.Provider, {
+    orientation: n,
+    registerTabIdLookup: i,
+    selectionFollowsFocus: u,
+    value: h
+  }), [l, p, f, c, n, i, u, h]);
+  return /* @__PURE__ */ T(O.Provider, {
     value: b,
     children: /* @__PURE__ */ T(G.Provider, {
       value: P,
@@ -96,24 +97,24 @@ const re = ["children", "value", "defaultValue", "orientation", "direction", "on
   } = s;
   return N({
     root: ["root", e]
-  }, M(se));
-}, w = /* @__PURE__ */ r.forwardRef(function(e, o) {
-  var n;
+  }, w(se));
+}, S = /* @__PURE__ */ r.forwardRef(function(e, o) {
+  var l;
   const {
-    children: i,
+    children: a,
     orientation: c = "horizontal",
-    direction: l = "ltr",
+    direction: n = "ltr",
     slotProps: d = {},
-    slots: u = {}
-  } = e, a = F(e, re), m = C({}, e, {
+    slots: i = {}
+  } = e, u = F(e, re), m = C({}, e, {
     orientation: c,
-    direction: l
+    direction: n
   }), {
-    contextValue: g
-  } = ne(m), p = ae(m), f = (n = u.root) != null ? n : "div", b = $({
+    contextValue: h
+  } = ne(m), p = ae(m), f = (l = i.root) != null ? l : "div", b = $({
     elementType: f,
     externalSlotProps: d.root,
-    externalForwardedProps: a,
+    externalForwardedProps: u,
     additionalProps: {
       ref: o
     },
@@ -122,12 +123,12 @@ const re = ["children", "value", "defaultValue", "orientation", "direction", "on
   });
   return /* @__PURE__ */ T(f, C({}, b, {
     children: /* @__PURE__ */ T(le, {
-      value: g,
-      children: i
+      value: h,
+      children: a
     })
   }));
 });
-process.env.NODE_ENV !== "production" && (w.propTypes = {
+process.env.NODE_ENV !== "production" && (S.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
@@ -199,7 +200,7 @@ function ue(s, e) {
     });
   const o = ee(s, e), {
     context: {
-      selectionFollowsFocus: n
+      selectionFollowsFocus: l
     }
   } = e;
   if (e.type === Y.itemsChange) {
@@ -209,7 +210,7 @@ function ue(s, e) {
       });
     te(null, "reset", e.context);
   }
-  return n && o.highlightedValue != null ? C({}, o, {
+  return l && o.highlightedValue != null ? C({}, o, {
     selectedValues: [o.highlightedValue]
   }) : o;
 }
@@ -218,37 +219,37 @@ function ce(s) {
   const {
     rootRef: o
   } = s, {
-    direction: n = "ltr",
-    onSelected: i,
+    direction: l = "ltr",
+    onSelected: a,
     orientation: c = "horizontal",
-    value: l,
+    value: n,
     registerTabIdLookup: d,
-    selectionFollowsFocus: u
+    selectionFollowsFocus: i
   } = J(), {
-    subitems: a,
+    subitems: u,
     contextValue: m
-  } = O(), g = r.useCallback((h) => {
+  } = M(), h = r.useCallback((g) => {
     var v;
-    return (v = a.get(h)) == null ? void 0 : v.id;
-  }, [a]);
-  d(g);
-  const p = r.useMemo(() => Array.from(a.keys()), [a]), f = r.useCallback((h) => {
+    return (v = u.get(g)) == null ? void 0 : v.id;
+  }, [u]);
+  d(h);
+  const p = r.useMemo(() => Array.from(u.keys()), [u]), f = r.useCallback((g) => {
     var v, V;
-    return h == null ? null : (v = (V = a.get(h)) == null ? void 0 : V.ref.current) != null ? v : null;
-  }, [a]), b = n === "rtl";
+    return g == null ? null : (v = (V = u.get(g)) == null ? void 0 : V.ref.current) != null ? v : null;
+  }, [u]), b = l === "rtl";
   let P;
   c === "vertical" ? P = "vertical" : P = b ? "horizontal-rtl" : "horizontal-ltr";
-  const x = r.useCallback((h, v) => {
+  const x = r.useCallback((g, v) => {
     var V;
-    i(h, (V = v[0]) != null ? V : null);
-  }, [i]), y = r.useMemo(() => l === void 0 ? {} : l != null ? {
-    selectedValues: [l]
+    a(g, (V = v[0]) != null ? V : null);
+  }, [a]), y = r.useMemo(() => n === void 0 ? {} : n != null ? {
+    selectedValues: [n]
   } : {
     selectedValues: []
-  }, [l]), U = r.useCallback((h) => {
+  }, [n]), U = r.useCallback((g) => {
     var v, V;
-    return (v = (V = a.get(h)) == null ? void 0 : V.disabled) != null ? v : !1;
-  }, [a]), {
+    return (v = (V = u.get(g)) == null ? void 0 : V.disabled) != null ? v : !1;
+  }, [u]), {
     contextValue: L,
     dispatch: R,
     getRootProps: D,
@@ -259,7 +260,7 @@ function ce(s) {
     rootRef: K
   } = oe({
     controlledProps: y,
-    disabledItemsFocusable: !u,
+    disabledItemsFocusable: !i,
     focusManagement: "DOM",
     getItemDomElement: f,
     isItemDisabled: U,
@@ -268,18 +269,18 @@ function ce(s) {
     onChange: x,
     orientation: P,
     reducerActionContext: r.useMemo(() => ({
-      selectionFollowsFocus: u || !1
-    }), [u]),
+      selectionFollowsFocus: i || !1
+    }), [i]),
     selectionMode: "single",
     stateReducer: ue
   });
   r.useEffect(() => {
-    l !== void 0 && l != null && R({
+    n !== void 0 && n != null && R({
       type: z.valueChange,
-      value: l
+      value: n
     });
-  }, [R, l]);
-  const W = (h = {}) => C({}, h, D(h), {
+  }, [R, n]);
+  const W = (g = {}) => C({}, g, D(g), {
     "aria-orientation": c === "vertical" ? "vertical" : void 0,
     role: "tablist"
   });
@@ -299,24 +300,24 @@ function de(s) {
     value: e,
     children: o
   } = s, {
-    dispatch: n,
-    getItemIndex: i,
+    dispatch: l,
+    getItemIndex: a,
     getItemState: c,
-    registerItem: l,
+    registerItem: n,
     totalSubitemCount: d
-  } = e, u = r.useMemo(() => ({
-    dispatch: n,
+  } = e, i = r.useMemo(() => ({
+    dispatch: l,
     getItemState: c,
-    getItemIndex: i
-  }), [n, i, c]), a = r.useMemo(() => ({
-    getItemIndex: i,
-    registerItem: l,
+    getItemIndex: a
+  }), [l, a, c]), u = r.useMemo(() => ({
+    getItemIndex: a,
+    registerItem: n,
     totalSubitemCount: d
-  }), [l, i, d]);
-  return /* @__PURE__ */ T(S.Provider, {
-    value: a,
+  }), [n, a, d]);
+  return /* @__PURE__ */ T(O.Provider, {
+    value: u,
     children: /* @__PURE__ */ T(Z.Provider, {
-      value: u,
+      value: i,
       children: o
     })
   });
@@ -327,24 +328,24 @@ const me = ["children", "slotProps", "slots"], pe = (s) => {
   } = s;
   return N({
     root: ["root", e]
-  }, M(ie));
+  }, w(ie));
 }, A = /* @__PURE__ */ r.forwardRef(function(e, o) {
-  var n;
+  var l;
   const {
-    children: i,
+    children: a,
     slotProps: c = {},
-    slots: l = {}
+    slots: n = {}
   } = e, d = F(e, me), {
-    isRtl: u,
-    orientation: a,
+    isRtl: i,
+    orientation: u,
     getRootProps: m,
-    contextValue: g
+    contextValue: h
   } = ce({
     rootRef: o
   }), p = C({}, e, {
-    isRtl: u,
-    orientation: a
-  }), f = pe(p), b = (n = l.root) != null ? n : "div", P = $({
+    isRtl: i,
+    orientation: u
+  }), f = pe(p), b = (l = n.root) != null ? l : "div", P = $({
     elementType: b,
     getSlotProps: m,
     externalSlotProps: c.root,
@@ -353,9 +354,9 @@ const me = ["children", "slotProps", "slots"], pe = (s) => {
     className: f.root
   });
   return /* @__PURE__ */ T(de, {
-    value: g,
+    value: h,
     children: /* @__PURE__ */ T(b, C({}, P, {
-      children: i
+      children: a
     }))
   });
 });
@@ -388,14 +389,16 @@ process.env.NODE_ENV !== "production" && (A.propTypes = {
     root: t.elementType
   })
 });
-const Ve = q(({ children: s, onChange: e, dataTestId: o }, n) => {
-  const [i, c] = B("1");
-  return /* @__PURE__ */ T(w, { "data-testid": o, value: i, onChange: (d, u) => {
-    c(u), e && e(u, d);
-  }, ref: n, children: /* @__PURE__ */ T(A, { className: Q.tabs, children: s }) });
-});
+const ye = q(
+  ({ value: s, className: e, "data-testid": o, children: l, onChange: a }, c) => {
+    const n = (d, i) => {
+      a && a(i, d);
+    };
+    return /* @__PURE__ */ T(S, { "data-testid": o, value: s, onChange: (d, i) => n(d, i), ref: c, children: /* @__PURE__ */ T(A, { className: B(Q.tabs, e), children: l }) });
+  }
+);
 export {
-  Le as Tab,
-  _e as TabPanel,
-  Ve as Tabs
+  Ie as Tab,
+  Fe as TabPanel,
+  ye as Tabs
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pismo/marola",
   "description": "CDX tribe component library",
-  "version": "1.0.0-beta.22",
+  "version": "1.0.0-beta.24",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",

package/dist/SelectButton-CoOT2txy.js

@@ -1,61 +0,0 @@
-import './assets/SelectButton.css';
-import { jsxs as c, jsx as _ } from "react/jsx-runtime";
-import * as o from "react";
-import { forwardRef as y } from "react";
-import { c as u } from "./clsx-DB4S2d7J.js";
-import { Typography as p } from "./components/Typography/Typography.js";
-const g = "_select__listbox__option__text_jbvcl_65", v = "_select_jbvcl_65", x = "_select__popup_jbvcl_81", d = "_select__listbox_jbvcl_65", j = "_select__listbox__option_jbvcl_65", m = "_select__listbox__option__icon_jbvcl_102", w = "_select__list__option__icon_jbvcl_123", e = {
-  "u-typography-h1": "_u-typography-h1_jbvcl_1",
-  "u-typography-h2": "_u-typography-h2_jbvcl_8",
-  "u-typography-h3": "_u-typography-h3_jbvcl_15",
-  "u-typography-h4": "_u-typography-h4_jbvcl_22",
-  "u-typography-h5": "_u-typography-h5_jbvcl_29",
-  "u-typography-h6": "_u-typography-h6_jbvcl_36",
-  "u-typography-base": "_u-typography-base_jbvcl_43",
-  "u-typography-base--xxl": "_u-typography-base--xxl_jbvcl_49",
-  "u-typography-base--xl": "_u-typography-base--xl_jbvcl_53",
-  "u-typography-base--lg": "_u-typography-base--lg_jbvcl_57",
-  "u-typography-base--sm": "_u-typography-base--sm_jbvcl_61",
-  "u-typography-base--bold": "_u-typography-base--bold_jbvcl_65",
-  select__listbox__option__text: g,
-  "u-typography-base--strikethrough": "_u-typography-base--strikethrough_jbvcl_68",
-  "u-typography-base--underlined": "_u-typography-base--underlined_jbvcl_71",
-  "u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_jbvcl_74",
-  select: v,
-  select__popup: x,
-  select__listbox: d,
-  select__listbox__option: j,
-  select__listbox__option__icon: m,
-  "select__listbox__option--disabled": "_select__listbox__option--disabled_jbvcl_106",
-  "select__listbox__option--selected": "_select__listbox__option--selected_jbvcl_115",
-  select__list__option__icon: w,
-  "select-button": "_select-button_jbvcl_128",
-  "base-Select-popup": "_base-Select-popup_jbvcl_146",
-  "select-button__text": "_select-button__text_jbvcl_149",
-  "select-button__icon": "_select-button__icon_jbvcl_158",
-  "select-button--active": "_select-button--active_jbvcl_164"
-}, C = (t) => /* @__PURE__ */ o.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ o.createElement("path", { d: "M2.11104 4.9999C2.36691 4.9999 2.62291 5.09756 2.81791 5.29287L8.11104 10.5843L13.4048 5.29053C13.7954 4.8999 14.4282 4.8999 14.8188 5.29053C15.2095 5.68115 15.2095 6.31396 14.8188 6.70459L8.81885 12.7046C8.42822 13.0952 7.79541 13.0952 7.40479 12.7046L1.40479 6.70459C1.01416 6.31396 1.01416 5.68115 1.40479 5.29053C1.59854 5.09678 1.85479 4.9999 2.11104 4.9999Z", fill: "currentColor" })), f = (t) => /* @__PURE__ */ o.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ o.createElement("path", { d: "M13.8889 11C13.633 11 13.377 10.9023 13.182 10.707L7.8889 5.41563L2.59515 10.7094C2.20453 11.1 1.57172 11.1 1.18109 10.7094C0.790466 10.3188 0.790466 9.68594 1.18109 9.29532L7.18109 3.29532C7.57172 2.90469 8.20453 2.90469 8.59515 3.29532L14.5952 9.29532C14.9858 9.68594 14.9858 10.3188 14.5952 10.7094C14.4014 10.9031 14.1452 11 13.8889 11Z", fill: "#3F3D4B", fillOpacity: 0.88 })), E = y((t, a) => {
-  const { children: i, disabled: b, className: n, "data-testid": r, prefix: l, onClick: h } = t, s = t["aria-expanded"];
-  return /* @__PURE__ */ c(
-    "button",
-    {
-      className: u(n, s ? e["select-button--active"] : "", e["select-button"]),
-      type: "button",
-      onClick: h,
-      disabled: b,
-      "data-testid": r,
-      ref: a,
-      children: [
-        /* @__PURE__ */ c("span", { className: e["select-button__text"], children: [
-          l && /* @__PURE__ */ _(p, { children: l }),
-          /* @__PURE__ */ _(p, { children: i })
-        ] }),
-        /* @__PURE__ */ _("span", { className: e["select-button__icon"], children: s ? /* @__PURE__ */ _(f, {}) : /* @__PURE__ */ _(C, {}) })
-      ]
-    }
-  );
-});
-export {
-  E as S,
-  e as s
-};