@pismo/marola 0.0.1-alpha.32 → 0.0.1-alpha.4

package/dist/components/Dialog/{DialogTitle.d.ts → Title.d.ts}

@@ -1,11 +1,11 @@
 import { ReactNode } from 'react';
 
-export interface DialogTitleProps {
+export interface TitleProps {
     /** title to be displayed */
     title?: ReactNode;
     /** subtitle to be displayed */
     subTitle?: ReactNode;
 }
 /** internal component only - used by the dialog */
-declare const DialogTitle: ({ title, subTitle }: DialogTitleProps) => import("react/jsx-runtime").JSX.Element;
-export default DialogTitle;
+declare const Title: ({ title, subTitle }: TitleProps) => import("react/jsx-runtime").JSX.Element;
+export default Title;

package/dist/components/Dialog/Title.js

@@ -0,0 +1,14 @@
+import { jsxs as l, Fragment as s, jsx as e } from "react/jsx-runtime";
+import { s as r } from "../../Dialog.module-BO0mdB7d.js";
+import { Typography as a } from "../Typography/Typography.js";
+const n = ({
+  title: i,
+  subTitle: t
+}) => /* @__PURE__ */ l(s, { children: [
+  /* @__PURE__ */ e(a, { element: "h1", elementProps: { id: "alert-dialog-title" }, variant: "h4", className: r.dialog__title, children: i }),
+  /* @__PURE__ */ e("hr", { className: r.dialog__divider, "aria-hidden": !0 }),
+  t && /* @__PURE__ */ e(a, { element: "h2", elementProps: { id: "alert-dialog-description" }, variant: "h4", className: r.dialog__subtitle, children: t })
+] });
+export {
+  n as default
+};

package/dist/components/LoadingSpinner/LoadingSpinner.d.ts

@@ -1,7 +1,5 @@
 export interface LoadingSpinnerProps {
-    /** Whether to invert colours or not */
     invert?: boolean;
-    /** Space separated list of CSS classes to apply */
     classNames?: string;
 }
 export declare const LoadingSpinner: ({ invert, classNames }: LoadingSpinnerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/LoadingSpinner/LoadingSpinner.js

@@ -1,16 +1,17 @@
 import '../../assets/LoadingSpinner.css';
-import { jsxs as e, jsx as s } from "react/jsx-runtime";
-import { useMemo as o } from "react";
+import { jsxs as o, jsx as s } from "react/jsx-runtime";
+import { useMemo as e } from "react";
 import { c as t } from "../../clsx-DB4S2d7J.js";
 const n = {
-  "ls-ring": "_ls-ring_elvjz_1",
-  "ls-ring--invert": "_ls-ring--invert_elvjz_34"
-}, a = ({ invert: i = !1, classNames: r }) => {
-  const l = o(
-    () => t([n["ls-ring"]], { [n["ls-ring--invert"]]: i }, r),
-    [r, i]
-  );
-  return /* @__PURE__ */ e("div", { className: l, children: [
+  "ls-ring": "_ls-ring_19dsy_1",
+  "ls-ring--invert": "_ls-ring--invert_19dsy_34"
+}, c = ({ invert: i = !1, classNames: r }) => {
+  const l = e(() => t(
+    [n["ls-ring"]],
+    { [n["ls-ring--invert"]]: i },
+    r
+  ), [r, i]);
+  return /* @__PURE__ */ o("div", { className: l, children: [
     /* @__PURE__ */ s("div", {}),
     /* @__PURE__ */ s("div", {}),
     /* @__PURE__ */ s("div", {}),
@@ -18,6 +19,6 @@ const n = {
   ] });
 };
 export {
-  a as LoadingSpinner,
-  a as default
+  c as LoadingSpinner,
+  c as default
 };

package/dist/components/Tabs/Tab.d.ts

@@ -1,14 +1,9 @@
 import { ReactNode } from 'react';
 
 export interface TabProps {
-    /** The value to be showing in the tab */
     children: ReactNode;
-    /** The value that corresponds to the panel to show.
-     * e.g. value="1" when this tab is clicked it will show the panel which also has value="1! */
     value: string | number;
-    /** Disable clicking the tab */
     disabled?: boolean;
-    /** data test id */
     dataTestId?: string;
 }
-export declare const Tab: import('react').ForwardRefExoticComponent<TabProps & import('react').RefAttributes<HTMLButtonElement>>;
+export declare const Tab: import('react').ForwardRefExoticComponent<TabProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/components/Tabs/Tab.js

@@ -1,123 +1,182 @@
-import { jsx as N } from "react/jsx-runtime";
-import * as b from "react";
-import { forwardRef as H, useContext as U, useMemo as j } from "react";
-import { c as k } from "../../clsx-DB4S2d7J.js";
-import { u as B, T as D, s as y } from "../../Tabs.module-jkH1Qjn7.js";
-import { g as L, a as W, u as O, f as $, b as d, _ as q, c as z, P as e, d as A, e as G } from "../../index-CH45lKw7.js";
-import { u as J, c as K } from "../../combineHooksSlotProps-DVjg9PRh.js";
-import { u as Q, a as X } from "../../useCompoundItem-D1iRfg8D.js";
-import { u as Y } from "../../useButton-DNk3wrQp.js";
-const E = "Tab";
-function Z(o) {
-  return L(E, o);
+import { jsx as I } from "react/jsx-runtime";
+import { a as S, T as U, s as y } from "../../Tabs.module-_kSbSyth.js";
+import * as f from "react";
+import { forwardRef as j, useContext as D, useMemo as $ } from "react";
+import { c as A } from "../../clsx-DB4S2d7J.js";
+import { e as O, _ as p, g as B, a as W, u as N, b as q, c as z, P as o, d as G, f as J } from "../../index-BZ1lkM_M.js";
+import { u as K, a as Q } from "../../useCompoundItem-B7wfGDHQ.js";
+import { a as X, L as E } from "../../ListContext-D6-YwtZn.js";
+import { u as Y } from "../../useButton-CbmjmH5z.js";
+function Z(n) {
+  const {
+    handlePointerOverEvents: t = !1,
+    item: e
+  } = n, s = f.useContext(X);
+  if (!s)
+    throw new Error("useListItem must be used within a ListProvider");
+  const {
+    dispatch: a,
+    getItemState: i
+  } = s, {
+    highlighted: c,
+    selected: b,
+    focusable: m
+  } = i(e), h = f.useCallback((l) => (r) => {
+    var u;
+    if ((u = l.onClick) == null || u.call(l, r), !r.defaultPrevented) {
+      if (process.env.NODE_ENV !== "production" && e === void 0)
+        throw new Error(["MUI: The `item` provided to useListItem() is undefined.", "This should happen only during server-side rendering under React 17."].join(`
+`));
+      a({
+        type: E.itemClick,
+        item: e,
+        event: r
+      });
+    }
+  }, [a, e]), P = f.useCallback((l) => (r) => {
+    var u;
+    if ((u = l.onMouseOver) == null || u.call(l, r), !r.defaultPrevented) {
+      if (process.env.NODE_ENV !== "production" && e === void 0)
+        throw new Error(["MUI: The `item` provided to useListItem() is undefined.", "This should happen only during server-side rendering under React 17."].join(`
+`));
+      a({
+        type: E.itemHover,
+        item: e,
+        event: r
+      });
+    }
+  }, [a, e]);
+  let d;
+  return m && (d = c ? 0 : -1), {
+    getRootProps: (l = {}) => {
+      const r = O(l);
+      return p({}, l, {
+        onClick: h(r),
+        onPointerOver: t ? P(r) : void 0,
+        tabIndex: d
+      });
+    },
+    highlighted: c,
+    selected: b
+  };
+}
+function ee(n, t) {
+  return function(s = {}) {
+    const a = p({}, s, n(s));
+    return p({}, a, t(a));
+  };
 }
-W(E, ["root", "selected", "disabled"]);
-function ee(o) {
-  return o.size;
+const w = "Tab";
+function te(n) {
+  return B(w, n);
 }
-function te(o) {
+W(w, ["root", "selected", "disabled"]);
+function oe(n) {
+  return n.size;
+}
+function se(n) {
   const {
     value: t,
-    rootRef: s,
-    disabled: n = !1,
+    rootRef: e,
+    disabled: s = !1,
+    id: a
+  } = n, i = f.useRef(null), c = K(a), {
+    value: b,
+    selectionFollowsFocus: m,
+    getTabPanelId: h
+  } = S(), P = f.useMemo(() => ({
+    disabled: s,
+    ref: i,
     id: c
-  } = o, a = b.useRef(null), r = Q(c), {
-    value: f,
-    selectionFollowsFocus: p,
-    getTabPanelId: m
-  } = B(), P = b.useMemo(() => ({
-    disabled: n,
-    ref: a,
-    id: r
-  }), [n, a, r]), {
-    id: l,
-    index: R,
-    totalItemCount: g
-  } = X(t ?? ee, P), {
-    getRootProps: h,
-    highlighted: T,
-    selected: i
-  } = J({
-    item: l
+  }), [s, i, c]), {
+    id: d,
+    index: C,
+    totalItemCount: l
+  } = Q(t ?? oe, P), {
+    getRootProps: r,
+    highlighted: u,
+    selected: g
+  } = Z({
+    item: d
   }), {
-    getRootProps: C,
-    rootRef: u,
-    active: v,
-    focusVisible: I,
-    setFocusVisible: V
+    getRootProps: v,
+    rootRef: R,
+    active: T,
+    focusVisible: L,
+    setFocusVisible: M
   } = Y({
-    disabled: n,
-    focusableWhenDisabled: !p,
+    disabled: s,
+    focusableWhenDisabled: !m,
     type: "button"
-  }), _ = O(a, s, u), M = l !== void 0 ? m(l) : void 0;
+  }), _ = N(i, e, R), H = d !== void 0 ? h(d) : void 0;
   return {
     getRootProps: (x = {}) => {
-      const S = $(x), w = K(h, C);
-      return d({}, x, w(S), {
+      const V = O(x), F = ee(r, v);
+      return p({}, x, F(V), {
         role: "tab",
-        "aria-controls": M,
-        "aria-selected": i,
-        id: r,
+        "aria-controls": H,
+        "aria-selected": g,
+        id: c,
         ref: _
       });
     },
-    active: v,
-    focusVisible: I,
-    highlighted: T,
-    index: R,
+    active: T,
+    focusVisible: L,
+    highlighted: u,
+    index: C,
     rootRef: _,
     // the `selected` state isn't set on the server (it relies on effects to be calculated),
     // so we fall back to checking the `value` prop with the selectedValue from the TabsContext
-    selected: i || l === f,
-    setFocusVisible: V,
-    totalTabsCount: g
+    selected: g || d === b,
+    setFocusVisible: M,
+    totalTabsCount: l
   };
 }
-const oe = ["action", "children", "disabled", "onChange", "onClick", "onFocus", "slotProps", "slots", "value"], se = (o) => {
+const ne = ["action", "children", "disabled", "onChange", "onClick", "onFocus", "slotProps", "slots", "value"], re = (n) => {
   const {
     selected: t,
-    disabled: s
-  } = o;
-  return A({
-    root: ["root", t && "selected", s && "disabled"]
-  }, G(Z));
-}, F = /* @__PURE__ */ b.forwardRef(function(t, s) {
-  var n;
+    disabled: e
+  } = n;
+  return G({
+    root: ["root", t && "selected", e && "disabled"]
+  }, J(te));
+}, k = /* @__PURE__ */ f.forwardRef(function(t, e) {
+  var s;
   const {
-    children: c,
-    disabled: a = !1,
-    slotProps: r = {},
-    slots: f = {},
-    value: p
-  } = t, m = q(t, oe), P = b.useRef(), l = O(P, s), {
-    active: R,
-    highlighted: g,
-    selected: h,
-    getRootProps: T
-  } = te(d({}, t, {
-    rootRef: l,
-    value: p
-  })), i = d({}, t, {
-    active: R,
-    disabled: a,
-    highlighted: g,
-    selected: h
-  }), C = se(i), u = (n = f.root) != null ? n : "button", v = z({
-    elementType: u,
-    getSlotProps: T,
-    externalSlotProps: r.root,
-    externalForwardedProps: m,
+    children: a,
+    disabled: i = !1,
+    slotProps: c = {},
+    slots: b = {},
+    value: m
+  } = t, h = q(t, ne), P = f.useRef(), d = N(P, e), {
+    active: C,
+    highlighted: l,
+    selected: r,
+    getRootProps: u
+  } = se(p({}, t, {
+    rootRef: d,
+    value: m
+  })), g = p({}, t, {
+    active: C,
+    disabled: i,
+    highlighted: l,
+    selected: r
+  }), v = re(g), R = (s = b.root) != null ? s : "button", T = z({
+    elementType: R,
+    getSlotProps: u,
+    externalSlotProps: c.root,
+    externalForwardedProps: h,
     additionalProps: {
-      ref: s
+      ref: e
     },
-    ownerState: i,
-    className: C.root
+    ownerState: g,
+    className: v.root
   });
-  return /* @__PURE__ */ N(u, d({}, v, {
-    children: c
+  return /* @__PURE__ */ I(R, p({}, T, {
+    children: a
   }));
 });
-process.env.NODE_ENV !== "production" && (F.propTypes = {
+process.env.NODE_ENV !== "production" && (k.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
@@ -125,57 +184,53 @@ process.env.NODE_ENV !== "production" && (F.propTypes = {
   /**
    * A ref for imperative actions. It currently only supports `focusVisible()` action.
    */
-  action: e.oneOfType([e.func, e.shape({
-    current: e.shape({
-      focusVisible: e.func.isRequired
+  action: o.oneOfType([o.func, o.shape({
+    current: o.shape({
+      focusVisible: o.func.isRequired
     })
   })]),
   /**
    * @ignore
    */
-  children: e.node,
+  children: o.node,
   /**
    * If `true`, the component is disabled.
    * @default false
    */
-  disabled: e.bool,
+  disabled: o.bool,
   /**
    * Callback invoked when new value is being set.
    */
-  onChange: e.func,
+  onChange: o.func,
   /**
    * The props used for each slot inside the Tab.
    * @default {}
    */
-  slotProps: e.shape({
-    root: e.oneOfType([e.func, e.object])
+  slotProps: o.shape({
+    root: o.oneOfType([o.func, o.object])
   }),
   /**
    * The components used for each slot inside the Tab.
    * Either a string to use a HTML element or a component.
    * @default {}
    */
-  slots: e.shape({
-    root: e.elementType
+  slots: o.shape({
+    root: o.elementType
   }),
   /**
    * You can provide your own value. Otherwise, it falls back to the child position index.
    */
-  value: e.oneOfType([e.number, e.string])
+  value: o.oneOfType([o.number, o.string])
+});
+const me = j(({
+  children: n,
+  value: t,
+  disabled: e,
+  dataTestId: s
+}, a) => {
+  const i = D(U), c = $(() => A(y.tabs__tab, t === (i == null ? void 0 : i.value) && y["tabs__tab--selected"], e && y["tabs__tab--disabled"]), [t, i, e]);
+  return /* @__PURE__ */ I(k, { className: c, disabled: e, value: t, "data-testid": s, ref: a, children: n });
 });
-const fe = H(
-  ({ children: o, value: t, disabled: s, dataTestId: n }, c) => {
-    const a = U(D), r = j(
-      () => k(
-        y.tabs__tab,
-        t === (a == null ? void 0 : a.value) && y["tabs__tab--selected"],
-        s && y["tabs__tab--disabled"]
-      ),
-      [t, a, s]
-    );
-    return /* @__PURE__ */ N(F, { className: r, disabled: s, value: t, "data-testid": n, ref: c, children: o });
-  }
-);
 export {
-  fe as Tab
+  me as Tab
 };

package/dist/components/Tabs/TabPanel.d.ts

@@ -1,12 +1,8 @@
 import { ReactNode } from 'react';
 
 export interface TabPanelProps {
-    /** The content to be displayed when the corresponding tab is selected */
     children: ReactNode;
-    /** The value that identifies which tab is selected.
-     * e.g. value="1" when the tab button with the value="1" is selected this content will show */
     value: string | number;
-    /** Test id */
     dataTestId?: string;
 }
-export declare const TabPanel: import('react').ForwardRefExoticComponent<TabPanelProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const TabPanel: import('react').ForwardRefExoticComponent<TabPanelProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Tabs/TabPanel.js

@@ -1,9 +1,9 @@
 import { jsx as T } from "react/jsx-runtime";
+import { a as v, s as y } from "../../Tabs.module-_kSbSyth.js";
 import * as m from "react";
-import { forwardRef as v } from "react";
-import { u as y, s as x } from "../../Tabs.module-jkH1Qjn7.js";
-import { g as C, a as N, u as _, b, _ as w, c as O, P as o, d as E, e as I } from "../../index-CH45lKw7.js";
-import { u as S, a as U } from "../../useCompoundItem-D1iRfg8D.js";
+import { forwardRef as x } from "react";
+import { g as C, a as N, u as _, _ as b, b as w, c as O, P as o, d as E, f as I } from "../../index-BZ1lkM_M.js";
+import { u as S, a as U } from "../../useCompoundItem-B7wfGDHQ.js";
 const h = "TabPanel";
 function j(t) {
   return C(h, t);
@@ -17,7 +17,7 @@ function V(t) {
     value: e,
     id: s,
     rootRef: n
-  } = t, i = y();
+  } = t, i = v();
   if (i === null)
     throw new Error("No TabContext provided");
   const {
@@ -110,9 +110,11 @@ process.env.NODE_ENV !== "production" && (R.propTypes = {
    */
   value: o.oneOfType([o.number, o.string])
 });
-const W = v(
-  ({ children: t, value: e, dataTestId: s }, n) => /* @__PURE__ */ T(R, { className: x["tabs__tab-panel"], value: e, "data-testid": s, ref: n, children: t })
-);
+const W = x(({
+  children: t,
+  value: e,
+  dataTestId: s
+}, n) => /* @__PURE__ */ T(R, { className: y["tabs__tab-panel"], value: e, "data-testid": s, ref: n, children: t }));
 export {
   W as TabPanel
 };

package/dist/components/Tabs/Tabs.d.ts

@@ -1,15 +1,9 @@
 import { ReactNode } from 'react';
 
 export interface TabsProps {
-    /** Should contain `Tab` and `TabPanel` components to be rendered  */
     children?: ReactNode;
-    /** Selected tab */
     value?: number | string;
-    /** Callback triggered when the user has selected a tab */
-    onChange?: (tabValue: number | string | null, event?: React.SyntheticEvent<Element, Event> | null) => void;
-    /** Test id */
     dataTestId?: string;
+    onChange?: (tabValue: number | string | null, event?: React.SyntheticEvent<Element, Event> | null) => void;
 }
-export declare const Tabs: import('react').ForwardRefExoticComponent<TabsProps & import('react').RefAttributes<HTMLDivElement>>;
-export * from './Tab';
-export * from './TabPanel';
+export declare const Tabs: import('react').ForwardRefExoticComponent<TabsProps & import("react").RefAttributes<HTMLDivElement>>;