@pismo/marola 0.0.1-alpha.6 → 0.0.1-alpha.7

package/dist/components/Table/Table.js

@@ -3,8 +3,8 @@ import { jsxs as w, jsx as r, Fragment as T } from "react/jsx-runtime";
 import * as c from "react";
 import { useState as u } from "react";
 import { c as h } from "../../clsx-DB4S2d7J.js";
-import { defaultTranslations as b, Pagination as q } from "../Pagination/Pagination.js";
-import { defaultTranslations as f, SortTooltip as g } from "../SortTooltip/SortTooltip.js";
+import { paginationDefaultTranslations as b, Pagination as g } from "../Pagination/Pagination.js";
+import { sortTooltipDefaultTranslations as f, SortTooltip as q } from "../SortTooltip/SortTooltip.js";
 import { TableProvider as N, useTable as C } from "./TableContext.js";
 const L = (l) => /* @__PURE__ */ c.createElement("svg", { width: 7, height: 10, viewBox: "0 0 7 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...l }, /* @__PURE__ */ c.createElement("g", { clipPath: "url(#clip0_2291_2457)" }, /* @__PURE__ */ c.createElement("path", { d: "M6.41658 3.93794C6.26731 3.93794 6.11798 3.88301 6.00423 3.77314L3.49991 1.35923L0.995768 3.77271C0.767904 3.99243 0.398763 3.99243 0.170898 3.77271C-0.0569661 3.55298 -0.0569661 3.19702 0.170898 2.97729L3.08756 0.164795C3.31543 -0.0549316 3.68457 -0.0549316 3.91243 0.164795L6.8291 2.97729C7.05697 3.19702 7.05697 3.55298 6.8291 3.77271C6.71553 3.88345 6.56605 3.93794 6.41658 3.93794Z", fill: "#1897F3" }), /* @__PURE__ */ c.createElement("path", { opacity: 0.4, d: "M6.41663 5.38022C6.26737 5.38022 6.11804 5.43516 6.00429 5.54502L3.49997 7.95894L0.99528 5.5437C0.767415 5.32397 0.398275 5.32397 0.17041 5.5437C-0.0574544 5.76343 -0.0574544 6.11938 0.17041 6.33911L3.08708 9.15161C3.31494 9.37134 3.68408 9.37134 3.91195 9.15161L6.82861 6.33911C7.05648 6.11938 7.05648 5.76343 6.82861 5.5437C6.71559 5.43472 6.56611 5.38022 6.41663 5.38022Z", fill: "#1897F3" })), /* @__PURE__ */ c.createElement("defs", null, /* @__PURE__ */ c.createElement("clipPath", { id: "clip0_2291_2457" }, /* @__PURE__ */ c.createElement("rect", { width: 7, height: 10, fill: "white" })))), E = "_table_xe8qp_1", v = "_th__wrapper_xe8qp_40", y = "_tr_xe8qp_58", P = "_td_xe8qp_62", t = {
   table: E,
@@ -25,7 +25,7 @@ const L = (l) => /* @__PURE__ */ c.createElement("svg", { width: 7, height: 10,
   "td__row-or-cell--clickable": "_td__row-or-cell--clickable_xe8qp_68",
   "td__row-or-cell--disabled": "_td__row-or-cell--disabled_xe8qp_72",
   "td-wrapper": "_td-wrapper_xe8qp_76"
-}, $ = {
+}, B = {
   pt: {
     ...b.pt,
     ...f.pt
@@ -59,19 +59,19 @@ const L = (l) => /* @__PURE__ */ c.createElement("svg", { width: 7, height: 10,
     a ? t["table--full-width"] : "",
     t[`table--${e}-theme`],
     n
-  ), i = s && $[s] || o;
+  ), i = s && B[s] || o;
   return /* @__PURE__ */ w(N, { initialTranslations: i, children: [
     /* @__PURE__ */ r("table", { ...m, className: p, children: l }),
-    _ && /* @__PURE__ */ r(q, { ..._, t: i })
+    _ && /* @__PURE__ */ r(g, { ..._, t: i })
   ] });
-}, B = ({ children: l, ...e }) => /* @__PURE__ */ r("thead", { ...e, children: l }), F = ({ children: l, ...e }) => /* @__PURE__ */ r("tbody", { ...e, children: l }), M = ({ children: l, onClick: e, disabled: a, className: n, ..._ }) => {
+}, F = ({ children: l, ...e }) => /* @__PURE__ */ r("thead", { ...e, children: l }), M = ({ children: l, ...e }) => /* @__PURE__ */ r("tbody", { ...e, children: l }), O = ({ children: l, onClick: e, disabled: a, className: n, ..._ }) => {
   const s = h(
     t.tr,
     e && !a ? t["tr__row-or-cell--clickable"] : a ? t["tr__row-or-cell--disabled"] : "",
     n
   );
   return /* @__PURE__ */ r("tr", { ..._, className: s, onClick: () => !a && (e == null ? void 0 : e()), children: l });
-}, O = ({ children: l, onClick: e, disabled: a, className: n, align: _ = "left", ...s }) => {
+}, $ = ({ children: l, onClick: e, disabled: a, className: n, align: _ = "left", ...s }) => {
   const o = h(
     t.td,
     e && !a ? t["td__row-or-cell--clickable"] : a ? t["td__row-or-cell--disabled"] : "",
@@ -99,7 +99,7 @@ const L = (l) => /* @__PURE__ */ c.createElement("svg", { width: 7, height: 10,
     e && /* @__PURE__ */ w(T, { children: [
       /* @__PURE__ */ r("span", { className: t["th__sort-icon-container"], children: /* @__PURE__ */ r(L, {}) }),
       /* @__PURE__ */ r(
-        g,
+        q,
         {
           onClose: () => i(!1),
           onSort: e,
@@ -112,10 +112,10 @@ const L = (l) => /* @__PURE__ */ c.createElement("svg", { width: 7, height: 10,
     ] })
   ] }) });
 };
-d.THead = B;
-d.TBody = F;
-d.Tr = M;
-d.Td = O;
+d.THead = F;
+d.TBody = M;
+d.Tr = O;
+d.Td = $;
 d.Th = j;
 export {
   d as default

package/dist/components/Tabs/Tab.js

@@ -4,10 +4,10 @@ import { forwardRef as S, useContext as U, useMemo as j } from "react";
 import { c as D } from "../../clsx-DB4S2d7J.js";
 import { u as $, T as A, s as y } from "../../Tabs.module-BA-PC7fA.js";
 import { a as p, _ as B } from "../../objectWithoutPropertiesLoose-D7Cp0Pg_.js";
-import { e as O, g as W, a as q, d as N, u as z, P as o, c as G, b as J } from "../../index-D2P7y2mE.js";
+import { e as O, g as W, a as q, u as N, b as z, P as o, c as G, d as J } from "../../index-CqjC7P5Y.js";
 import { u as K, a as Q } from "../../useCompoundItem-CTYi5M_E.js";
 import { L as X, a as E } from "../../ListContext-Dj2Va7Iv.js";
-import { u as Y } from "../../useButton-JpyBo5M4.js";
+import { u as Y } from "../../useButton-Bc8IAgyk.js";
 function Z(n) {
   const {
     handlePointerOverEvents: t = !1,

package/dist/components/Tabs/TabPanel.js

@@ -3,7 +3,7 @@ import * as P from "react";
 import { forwardRef as v } from "react";
 import { u as y, s as x } from "../../Tabs.module-BA-PC7fA.js";
 import { a as b, _ as C } from "../../objectWithoutPropertiesLoose-D7Cp0Pg_.js";
-import { g as N, a as _, d as w, u as O, P as o, c as E, b as I } from "../../index-D2P7y2mE.js";
+import { g as N, a as _, u as w, b as O, P as o, c as E, d as I } from "../../index-CqjC7P5Y.js";
 import { u as S, a as U } from "../../useCompoundItem-CTYi5M_E.js";
 const h = "TabPanel";
 function j(t) {

package/dist/components/Tabs/Tabs.js

@@ -3,7 +3,7 @@ import * as i from "react";
 import { forwardRef as xe, useState as Ve } from "react";
 import { a as Q, C as Z, T as Te, u as Ie, s as Se } from "../../Tabs.module-BA-PC7fA.js";
 import { a as b, _ as ee } from "../../objectWithoutPropertiesLoose-D7Cp0Pg_.js";
-import { d as Re, e as we, g as te, a as ne, u as oe, P as v, c as le, b as se } from "../../index-D2P7y2mE.js";
+import { u as Re, e as we, g as te, a as ne, b as oe, P as v, c as le, d as se } from "../../index-CqjC7P5Y.js";
 import { u as Pe } from "../../useControlled-CCMYYdCM.js";
 import { a as S, L as ye } from "../../ListContext-Dj2Va7Iv.js";
 function J(t, e, l = (n, o) => n === o) {

package/dist/components/Toggle/Toggle.d.ts

@@ -0,0 +1,14 @@
+import { InputHTMLAttributes } from 'react';
+
+type ToggleProps = InputHTMLAttributes<HTMLInputElement> & {
+    label: string;
+    disabled?: boolean;
+    checked?: boolean;
+    'data-testid'?: string;
+    classNameWrapper?: string;
+    classNameLabel?: string;
+    classNameInput?: string;
+    autoFocus?: boolean;
+};
+export declare const Toggle: ({ onChange, label, disabled, checked, autoFocus, classNameWrapper, classNameLabel, classNameInput, "data-testid": dataTestId, }: ToggleProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Toggle/Toggle.js

@@ -0,0 +1,256 @@
+import '../../assets/Toggle.css';
+import { jsxs as I, jsx as O } from "react/jsx-runtime";
+import { c as N } from "../../clsx-DB4S2d7J.js";
+import { a as y, _ as v } from "../../objectWithoutPropertiesLoose-D7Cp0Pg_.js";
+import * as S from "react";
+import { u as U, g as q, a as H, b as V, P as e, c as M, d as A } from "../../index-CqjC7P5Y.js";
+import { u as D } from "../../useControlled-CCMYYdCM.js";
+import { u as L } from "../../useIsFocusVisible-BH4IAdcw.js";
+function W(l) {
+  const {
+    checked: o,
+    defaultChecked: d,
+    disabled: c,
+    onBlur: r,
+    onChange: p,
+    onFocus: g,
+    onFocusVisible: a,
+    readOnly: n,
+    required: P
+  } = l, [u, x] = D({
+    controlled: o,
+    default: !!d,
+    name: "Switch",
+    state: "checked"
+  }), B = (t) => (s) => {
+    var h;
+    s.nativeEvent.defaultPrevented || (x(s.target.checked), p == null || p(s), (h = t.onChange) == null || h.call(t, s));
+  }, {
+    isFocusVisibleRef: m,
+    onBlur: w,
+    onFocus: f,
+    ref: _
+  } = L(), [b, T] = S.useState(!1);
+  c && b && T(!1), S.useEffect(() => {
+    m.current = b;
+  }, [b, m]);
+  const k = S.useRef(null), R = (t) => (s) => {
+    var h;
+    k.current || (k.current = s.currentTarget), f(s), m.current === !0 && (T(!0), a == null || a(s)), g == null || g(s), (h = t.onFocus) == null || h.call(t, s);
+  }, C = (t) => (s) => {
+    var h;
+    w(s), m.current === !1 && T(!1), r == null || r(s), (h = t.onBlur) == null || h.call(t, s);
+  }, F = U(_, k);
+  return {
+    checked: u,
+    disabled: !!c,
+    focusVisible: b,
+    getInputProps: (t = {}) => y({
+      checked: o,
+      defaultChecked: d,
+      disabled: c,
+      readOnly: n,
+      ref: F,
+      required: P,
+      type: "checkbox",
+      role: "switch",
+      "aria-checked": o
+    }, t, {
+      onChange: B(t),
+      onFocus: R(t),
+      onBlur: C(t)
+    }),
+    inputRef: F,
+    readOnly: !!n
+  };
+}
+const $ = "Switch";
+function z(l) {
+  return q($, l);
+}
+H($, ["root", "input", "track", "thumb", "checked", "disabled", "focusVisible", "readOnly"]);
+const G = ["checked", "defaultChecked", "disabled", "onBlur", "onChange", "onFocus", "onFocusVisible", "readOnly", "required", "slotProps", "slots"], J = (l) => {
+  const {
+    checked: o,
+    disabled: d,
+    focusVisible: c,
+    readOnly: r
+  } = l;
+  return M({
+    root: ["root", o && "checked", d && "disabled", c && "focusVisible", r && "readOnly"],
+    thumb: ["thumb"],
+    input: ["input"],
+    track: ["track"]
+  }, A(z));
+}, E = /* @__PURE__ */ S.forwardRef(function(o, d) {
+  var c, r, p, g;
+  const {
+    slotProps: a = {},
+    slots: n = {}
+  } = o, P = v(o, G), {
+    getInputProps: u,
+    checked: x,
+    disabled: B,
+    focusVisible: m,
+    readOnly: w
+  } = W(o), f = y({}, o, {
+    checked: x,
+    disabled: B,
+    focusVisible: m,
+    readOnly: w
+  }), _ = J(f), b = (c = n.root) != null ? c : "span", T = V({
+    elementType: b,
+    externalSlotProps: a.root,
+    externalForwardedProps: P,
+    additionalProps: {
+      ref: d
+    },
+    ownerState: f,
+    className: _.root
+  }), k = (r = n.thumb) != null ? r : "span", R = V({
+    elementType: k,
+    externalSlotProps: a.thumb,
+    ownerState: f,
+    className: _.thumb
+  }), C = (p = n.input) != null ? p : "input", F = V({
+    elementType: C,
+    getSlotProps: u,
+    externalSlotProps: a.input,
+    ownerState: f,
+    className: _.input
+  }), j = n.track === null ? () => null : (g = n.track) != null ? g : "span", t = V({
+    elementType: j,
+    externalSlotProps: a.track,
+    ownerState: f,
+    className: _.track
+  });
+  return /* @__PURE__ */ I(b, y({}, T, {
+    children: [/* @__PURE__ */ O(j, y({}, t)), /* @__PURE__ */ O(k, y({}, R)), /* @__PURE__ */ O(C, y({}, F))]
+  }));
+});
+process.env.NODE_ENV !== "production" && (E.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: e.bool,
+  /**
+   * Class name applied to the root element.
+   */
+  className: e.string,
+  /**
+   * The default checked state. Use when the component is not controlled.
+   */
+  defaultChecked: e.bool,
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: e.bool,
+  /**
+   * @ignore
+   */
+  onBlur: e.func,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: e.func,
+  /**
+   * @ignore
+   */
+  onFocus: e.func,
+  /**
+   * @ignore
+   */
+  onFocusVisible: e.func,
+  /**
+   * If `true`, the component is read only.
+   */
+  readOnly: e.bool,
+  /**
+   * If `true`, the `input` element is required.
+   */
+  required: e.bool,
+  /**
+   * The props used for each slot inside the Switch.
+   * @default {}
+   */
+  slotProps: e.shape({
+    input: e.oneOfType([e.func, e.object]),
+    root: e.oneOfType([e.func, e.object]),
+    thumb: e.oneOfType([e.func, e.object]),
+    track: e.oneOfType([e.func, e.object])
+  }),
+  /**
+   * The components used for each slot inside the Switch.
+   * Either a string to use a HTML element or a component.
+   * @default {}
+   */
+  slots: e.shape({
+    input: e.elementType,
+    root: e.elementType,
+    thumb: e.elementType,
+    track: e.oneOfType([e.elementType, e.oneOf([null])])
+  })
+});
+const K = "_toggle_r6ihm_1", Q = "_input_r6ihm_15", X = "_thumb_r6ihm_26", Y = "_track_r6ihm_40", Z = "_toggle__label_r6ihm_64", i = {
+  toggle: K,
+  "toggle__toggle-el-wrapper": "_toggle__toggle-el-wrapper_r6ihm_11",
+  input: Q,
+  thumb: X,
+  track: Y,
+  "toggle--focus-visible": "_toggle--focus-visible_r6ihm_50",
+  "toggle--checked": "_toggle--checked_r6ihm_54",
+  toggle__label: Z,
+  "toggle--disabled": "_toggle--disabled_r6ihm_69"
+}, ne = ({
+  onChange: l,
+  label: o,
+  disabled: d,
+  checked: c = !1,
+  autoFocus: r,
+  classNameWrapper: p,
+  classNameLabel: g,
+  classNameInput: a,
+  "data-testid": n
+}) => {
+  const P = (u) => {
+    l == null || l(u);
+  };
+  return /* @__PURE__ */ I("div", { className: N(i.toggle, p), "data-testid": n, children: [
+    /* @__PURE__ */ O(
+      E,
+      {
+        disabled: d,
+        checked: c,
+        autoFocus: r,
+        onChange: P,
+        "aria-label": o,
+        slotProps: {
+          root: (u) => ({
+            className: N(i["toggle__toggle-el-wrapper"], {
+              [i["toggle--disabled"]]: u.disabled,
+              [i["toggle--focus-visible"]]: u.focusVisible,
+              [i["toggle--checked"]]: u.checked
+            })
+          }),
+          input: {
+            className: N(i.input, a)
+          },
+          thumb: { className: i.thumb },
+          track: { className: i.track }
+        }
+      }
+    ),
+    o && /* @__PURE__ */ O("label", { className: N(i.toggle__label, g), children: o })
+  ] });
+};
+export {
+  ne as Toggle
+};