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

package/dist/main.d.ts

@@ -1,11 +1,20 @@
 
+export * from './components/Advice/Advice';
+export * from './components/Button/Button';
+export * from './components/Checkbox/Checkbox';
 export * from './components/Dialog/Dialog';
-export * from './components/Typography/Typography';
+export * from './components/Icon/Icon';
+export * from './components/IconButton/IconButton';
+export * from './components/Input/Input';
 export * from './components/LoadingSpinner/LoadingSpinner';
-export * from './components/Tabs/Tabs';
-export * from './components/Tabs/Tab';
-export * from './components/Tabs/TabPanel';
-export * from './components/Pagination/Pagination';
 export * from './components/PageHeader/PageHeader';
-export * from './components/Button/Button';
-export * from './components/IconButton/IconButton';
+export * from './components/Pagination/Pagination';
+export * from './components/Skeleton/Skeleton';
+export * from './components/Snackbar/Snackbar';
+export * from './components/SortTooltip/SortTooltip';
+export * from './components/Stepper/Stepper';
+export * from './components/Table/Table';
+export * from './components/Tabs/Tabs';
+export * from './components/Toggle/Toggle';
+export * from './components/Tooltip/Tooltip';
+export * from './components/Typography/Typography';

package/dist/main.js

@@ -1,30 +1,52 @@
-import './assets/main.css';
-import { Dialog as t } from "./components/Dialog/Dialog.js";
-import { Typography as a } from "./components/Typography/Typography.js";
-import { LoadingSpinner as p } from "./components/LoadingSpinner/LoadingSpinner.js";
-import { Tabs as m } from "./components/Tabs/Tabs.js";
-import { Tab as i } from "./components/Tabs/Tab.js";
-import { TabPanel as s } from "./components/Tabs/TabPanel.js";
-import { Pagination as g, defaultTranslations as u } from "./components/Pagination/Pagination.js";
-import { PageHeader as b } from "./components/PageHeader/PageHeader.js";
-import { Button as c } from "./components/Button/Button.js";
-import { IconButton as B } from "./components/IconButton/IconButton.js";
-import { default as h } from "./components/Dialog/Title.js";
-import { default as C } from "./components/Dialog/Content.js";
-import { default as I } from "./components/Dialog/Actions.js";
+import './assets/global.css';
+/* empty css                */
+import { Advice as p } from "./components/Advice/Advice.js";
+import { Button as f } from "./components/Button/Button.js";
+import { Checkbox as m } from "./components/Checkbox/Checkbox.js";
+import { Dialog as i } from "./components/Dialog/Dialog.js";
+import { FamilyAndIcons as s, Icon as T } from "./components/Icon/Icon.js";
+import { IconButton as c } from "./components/IconButton/IconButton.js";
+import { Input as d } from "./components/Input/Input.js";
+import { LoadingSpinner as k } from "./components/LoadingSpinner/LoadingSpinner.js";
+import { PageHeader as D } from "./components/PageHeader/PageHeader.js";
+import { Pagination as y, paginationDefaultTranslations as A } from "./components/Pagination/Pagination.js";
+import { Skeleton as h, SkeletonCircle as B, SkeletonTable as P } from "./components/Skeleton/Skeleton.js";
+import { Snackbar as F } from "./components/Snackbar/Snackbar.js";
+import { SortTooltip as L, sortTooltipDefaultTranslations as j } from "./components/SortTooltip/SortTooltip.js";
+import { Stepper as w } from "./components/Stepper/Stepper.js";
+import "./components/Table/Table.js";
+import { Tabs as E } from "./components/Tabs/Tabs.js";
+import { Toggle as J } from "./components/Toggle/Toggle.js";
+import { Tooltip as M } from "./components/Tooltip/Tooltip.js";
+import { Typography as O } from "./components/Typography/Typography.js";
+import { default as R } from "./components/Dialog/Title.js";
+import { default as V } from "./components/Dialog/Content.js";
+import { default as X } from "./components/Dialog/Actions.js";
 export {
-  I as Actions,
-  c as Button,
-  C as Content,
-  t as Dialog,
-  h as DialogTitle,
-  B as IconButton,
-  p as LoadingSpinner,
-  b as PageHeader,
-  g as Pagination,
-  i as Tab,
-  s as TabPanel,
-  m as Tabs,
-  a as Typography,
-  u as defaultTranslations
+  X as Actions,
+  p as Advice,
+  f as Button,
+  m as Checkbox,
+  V as Content,
+  i as Dialog,
+  R as DialogTitle,
+  s as FamilyAndIcons,
+  T as Icon,
+  c as IconButton,
+  d as Input,
+  k as LoadingSpinner,
+  D as PageHeader,
+  y as Pagination,
+  h as Skeleton,
+  B as SkeletonCircle,
+  P as SkeletonTable,
+  F as Snackbar,
+  L as SortTooltip,
+  w as Stepper,
+  E as Tabs,
+  J as Toggle,
+  M as Tooltip,
+  O as Typography,
+  A as paginationDefaultTranslations,
+  j as sortTooltipDefaultTranslations
 };

package/dist/objectWithoutPropertiesLoose-D7Cp0Pg_.js

@@ -0,0 +1,26 @@
+function e() {
+  return e = Object.assign ? Object.assign.bind() : function(n) {
+    for (var a = 1; a < arguments.length; a++) {
+      var r = arguments[a];
+      for (var t in r)
+        Object.prototype.hasOwnProperty.call(r, t) && (n[t] = r[t]);
+    }
+    return n;
+  }, e.apply(this, arguments);
+}
+function i(n, a) {
+  if (n == null)
+    return {};
+  var r = {};
+  for (var t in n)
+    if (Object.prototype.hasOwnProperty.call(n, t)) {
+      if (a.indexOf(t) >= 0)
+        continue;
+      r[t] = n[t];
+    }
+  return r;
+}
+export {
+  i as _,
+  e as a
+};

package/dist/test-utils/assertStyles.d.ts

@@ -0,0 +1 @@
+export declare const assertClassesApplied: (expectedClasses: string[] | null, component: HTMLElement) => void;

package/dist/test-utils/assertStyles.js

@@ -0,0 +1,11 @@
+const i = (h, r) => {
+  h == null || h.forEach((a) => {
+    if (!r.className.split(" ").some((t) => t.startsWith(`_${a}_`)))
+      throw new Error(`
+Received: ${r.className}
+Expected: _${a}_{x}, (where {x} = random hash)`);
+  });
+};
+export {
+  i as assertClassesApplied
+};

package/dist/types/helpers.d.ts

@@ -17,3 +17,11 @@ type RequireAllOrNone<T, U extends keyof T = never> = (
   | Partial<Record<U, never>> // Require none
 ) &
   Omit<T, U>; // remaining keys not listed in U
+
+// S = string, D = delimiter to split by. Then split S by D and return array of strings. "foo-bar-baz" = ["foo","bar","baz"]
+// Fallback if no '-' return [s] which is an array of the input string e.g. foo = [foo]
+type Split<S extends string, D extends string> = string extends S
+  ? string[]
+  : S extends `${infer T}${D}${infer Rest}`
+    ? [T, ...Split<Rest, D>]
+    : [S];

package/dist/useButton-Bc8IAgyk.js

@@ -0,0 +1,106 @@
+import { a as D } from "./objectWithoutPropertiesLoose-D7Cp0Pg_.js";
+import * as i from "react";
+import { u as S, e as k } from "./index-CqjC7P5Y.js";
+import { u as _ } from "./useIsFocusVisible-BH4IAdcw.js";
+function v(p) {
+  const {
+    rootElementName: n = "",
+    componentName: l
+  } = p, [c, y] = i.useState(n.toUpperCase());
+  process.env.NODE_ENV !== "production" && i.useEffect(() => {
+    n && c !== n.toUpperCase() && console.error(`useRootElementName: the \`rootElementName\` prop of ${l ? `the ${l} component` : "a component"} expected the '${n}' element, but a '${c.toLowerCase()}' was rendered instead`, "This may cause hydration issues in an SSR context, for example in a Next.js app");
+  }, [n, c, l]);
+  const u = i.useCallback((m) => {
+    var s;
+    y((s = m == null ? void 0 : m.tagName) != null ? s : "");
+  }, []);
+  return [c, u];
+}
+function h(p = {}) {
+  const {
+    disabled: n = !1,
+    focusableWhenDisabled: l,
+    href: c,
+    rootRef: y,
+    tabIndex: u,
+    to: m,
+    type: s,
+    rootElementName: T
+  } = p, b = i.useRef(), [B, N] = i.useState(!1), {
+    isFocusVisibleRef: E,
+    onFocus: F,
+    onBlur: M,
+    ref: U
+  } = _(), [d, R] = i.useState(!1);
+  n && !l && d && R(!1), i.useEffect(() => {
+    E.current = d;
+  }, [d, E]);
+  const [f, V] = v({
+    rootElementName: T ?? (c || m ? "a" : void 0),
+    componentName: "Button"
+  }), w = (t) => (e) => {
+    var o;
+    d && e.preventDefault(), (o = t.onMouseLeave) == null || o.call(t, e);
+  }, K = (t) => (e) => {
+    var o;
+    M(e), E.current === !1 && R(!1), (o = t.onBlur) == null || o.call(t, e);
+  }, P = (t) => (e) => {
+    var o;
+    if (b.current || (b.current = e.currentTarget), F(e), E.current === !0) {
+      var r;
+      R(!0), (r = t.onFocusVisible) == null || r.call(t, e);
+    }
+    (o = t.onFocus) == null || o.call(t, e);
+  }, g = () => {
+    const t = b.current;
+    return f === "BUTTON" || f === "INPUT" && ["button", "submit", "reset"].includes(t == null ? void 0 : t.type) || f === "A" && (t == null ? void 0 : t.href);
+  }, I = (t) => (e) => {
+    if (!n) {
+      var o;
+      (o = t.onClick) == null || o.call(t, e);
+    }
+  }, $ = (t) => (e) => {
+    var o;
+    n || (N(!0), document.addEventListener("mouseup", () => {
+      N(!1);
+    }, {
+      once: !0
+    })), (o = t.onMouseDown) == null || o.call(t, e);
+  }, C = (t) => (e) => {
+    var o;
+    if ((o = t.onKeyDown) == null || o.call(t, e), !e.defaultMuiPrevented && (e.target === e.currentTarget && !g() && e.key === " " && e.preventDefault(), e.target === e.currentTarget && e.key === " " && !n && N(!0), e.target === e.currentTarget && !g() && e.key === "Enter" && !n)) {
+      var r;
+      (r = t.onClick) == null || r.call(t, e), e.preventDefault();
+    }
+  }, L = (t) => (e) => {
+    var o;
+    if (e.target === e.currentTarget && N(!1), (o = t.onKeyUp) == null || o.call(t, e), e.target === e.currentTarget && !g() && !n && e.key === " " && !e.defaultMuiPrevented) {
+      var r;
+      (r = t.onClick) == null || r.call(t, e);
+    }
+  }, x = S(V, y, U, b), a = {};
+  return u !== void 0 && (a.tabIndex = u), f === "BUTTON" ? (a.type = s ?? "button", l ? a["aria-disabled"] = n : a.disabled = n) : f === "INPUT" ? s && ["button", "submit", "reset"].includes(s) && (l ? a["aria-disabled"] = n : a.disabled = n) : f !== "" && (!c && !m && (a.role = "button", a.tabIndex = u ?? 0), n && (a["aria-disabled"] = n, a.tabIndex = l ? u ?? 0 : -1)), {
+    getRootProps: (t = {}) => {
+      const e = D({}, k(p), k(t)), o = D({
+        type: s
+      }, e, a, t, {
+        onBlur: K(e),
+        onClick: I(e),
+        onFocus: P(e),
+        onKeyDown: C(e),
+        onKeyUp: L(e),
+        onMouseDown: $(e),
+        onMouseLeave: w(e),
+        ref: x
+      });
+      return delete o.onFocusVisible, o;
+    },
+    focusVisible: d,
+    setFocusVisible: R,
+    active: B,
+    rootRef: x
+  };
+}
+export {
+  h as u
+};

package/dist/{useCompoundItem-wTwXbURC.js → useCompoundItem-CTYi5M_E.js}

@@ -1,5 +1,5 @@
 import * as o from "react";
-import { C as a } from "./Tabs.module-BKlNuSPH.js";
+import { C as a } from "./Tabs.module-BA-PC7fA.js";
 import { u as I } from "./useEnhancedEffect-CJGo-L3B.js";
 let r = 0;
 function i(t) {

package/dist/useIsFocusVisible-BH4IAdcw.js

@@ -0,0 +1,69 @@
+import * as a from "react";
+import { T as o } from "./useTimeout-DxF9kiZL.js";
+let n = !0, s = !1;
+const c = new o(), f = {
+  text: !0,
+  search: !0,
+  url: !0,
+  tel: !0,
+  email: !0,
+  password: !0,
+  number: !0,
+  date: !0,
+  month: !0,
+  week: !0,
+  time: !0,
+  datetime: !0,
+  "datetime-local": !0
+};
+function d(e) {
+  const {
+    type: t,
+    tagName: r
+  } = e;
+  return !!(r === "INPUT" && f[t] && !e.readOnly || r === "TEXTAREA" && !e.readOnly || e.isContentEditable);
+}
+function h(e) {
+  e.metaKey || e.altKey || e.ctrlKey || (n = !0);
+}
+function i() {
+  n = !1;
+}
+function y() {
+  this.visibilityState === "hidden" && s && (n = !0);
+}
+function m(e) {
+  e.addEventListener("keydown", h, !0), e.addEventListener("mousedown", i, !0), e.addEventListener("pointerdown", i, !0), e.addEventListener("touchstart", i, !0), e.addEventListener("visibilitychange", y, !0);
+}
+function b(e) {
+  const {
+    target: t
+  } = e;
+  try {
+    return t.matches(":focus-visible");
+  } catch {
+  }
+  return n || d(t);
+}
+function w() {
+  const e = a.useCallback((u) => {
+    u != null && m(u.ownerDocument);
+  }, []), t = a.useRef(!1);
+  function r() {
+    return t.current ? (s = !0, c.start(100, () => {
+      s = !1;
+    }), t.current = !1, !0) : !1;
+  }
+  function l(u) {
+    return b(u) ? (t.current = !0, !0) : !1;
+  }
+  return {
+    isFocusVisibleRef: t,
+    onFocus: l,
+    onBlur: r,
+    ref: e
+  };
+}
+export {
+  w as u
+};

package/dist/useTimeout-DxF9kiZL.js

@@ -0,0 +1,36 @@
+import * as n from "react";
+const u = {};
+function c(t, r) {
+  const e = n.useRef(u);
+  return e.current === u && (e.current = t(r)), e;
+}
+const i = [];
+function o(t) {
+  n.useEffect(t, i);
+}
+class s {
+  constructor() {
+    this.currentId = null, this.clear = () => {
+      this.currentId !== null && (clearTimeout(this.currentId), this.currentId = null);
+    }, this.disposeEffect = () => this.clear;
+  }
+  static create() {
+    return new s();
+  }
+  /**
+   * Executes `fn` after `delay`, clearing any previously scheduled call.
+   */
+  start(r, e) {
+    this.clear(), this.currentId = setTimeout(() => {
+      this.currentId = null, e();
+    }, r);
+  }
+}
+function f() {
+  const t = c(s.create).current;
+  return o(t.disposeEffect), t;
+}
+export {
+  s as T,
+  f as u
+};

package/dist/utils/styleStrings.d.ts

@@ -0,0 +1,6 @@
+import { Split } from '../types/helpers';
+
+export type BlockType<T extends string> = Split<T, '-'>[0];
+export declare const bemify: <T extends string>(variant: T, blocksWithElements: BlockType<T>[]) => string;
+export declare const getBEMBase: (variant: string) => string;
+export declare const getBEMBlock: (variant: string) => string;

package/dist/utils/styleStrings.js

@@ -0,0 +1,10 @@
+const s = (e, n) => {
+  const r = new RegExp(`^([${n.join("|")}]*)-`);
+  let t = e.replace(r, "$1__");
+  return t = t.replace(new RegExp("(?<!-)-(?!-)", "g"), "--"), t;
+}, c = (e) => e.split("--")[0], l = (e) => e.split(/--|__/)[0];
+export {
+  s as bemify,
+  c as getBEMBase,
+  l as getBEMBlock
+};

package/dist/utils/styleStrings.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/styleStrings.test.js

@@ -0,0 +1,41 @@
+import { bemify as a, getBEMBase as e, getBEMBlock as r } from "./styleStrings.js";
+import { d as s, i as o, g as t } from "../vi.Y_w82WR8-Df0JUamG.js";
+s("styleStrings", () => {
+  s("bemify", () => {
+    o("returns just a block if a block was only given", () => {
+      t(a("foo", ["bar"])).toEqual("foo");
+    }), o("returns just a block and modifier if no elements for that block", () => {
+      t(a("foo-baz", ["bar"])).toEqual("foo--baz");
+    }), o("returns just block and element if it is a block with elements", () => {
+      t(a("bar-baz", ["bar"])).toEqual("bar__baz");
+    }), o("returns block, element and modifier if it has all three parts", () => {
+      t(a("bar-baz-qux", ["bar"])).toEqual("bar__baz--qux");
+    }), o("accepts alternative types for the generic variants type", () => {
+      t(a("abc-def", ["abc"])).toEqual("abc__def");
+    });
+  }), s("getBEMBase", () => {
+    o("returns the base BEM of a Block with no elements or modifiers", () => {
+      t(e("foo")).toEqual("foo");
+    }), o("returns the base BEM of a Block with an element but no modifiers", () => {
+      t(e("foo__bar")).toEqual("foo__bar");
+    }), o("returns the base BEM of a Block with no elements but a modifier", () => {
+      t(e("foo--baz")).toEqual("foo");
+    }), o("returns the base BEM of a Block with an element and a modifier", () => {
+      t(e("foo__bar--baz")).toEqual("foo__bar");
+    }), o("returns empty if given nothing", () => {
+      t(e("")).toEqual("");
+    });
+  }), s("getBEMBlock", () => {
+    o("returns the block part of a full BEM style string", () => {
+      t(r("foo__bar--baz")).toEqual("foo");
+    }), o("returns the block part of a BEM style string that has just block and element", () => {
+      t(r("foo__bar")).toEqual("foo");
+    }), o("returns the block part of a BEM style string that has just block and modifier", () => {
+      t(r("foo--baz")).toEqual("foo");
+    }), o("returns the block part of a BEM style string that has just a block", () => {
+      t(r("foo")).toEqual("foo");
+    }), o("returns nothing if nothing passed in", () => {
+      t(r("")).toEqual("");
+    });
+  });
+});