@mezo-org/mezo-clay 0.1.0-dev.9 → 0.2.0-dev.1

package/dist/components/slider/slider.d.ts

@@ -0,0 +1,6 @@
+import { SliderProps as BaseSliderProps } from 'baseui/slider';
+export type SliderProps = BaseSliderProps & {
+    id?: string;
+    showValueToLabel?: boolean;
+};
+export declare function Slider({ overrides, showValueToLabel, value, onChange, ...props }: SliderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/slider/slider.js

@@ -0,0 +1,39 @@
+import { jsx as s } from "react/jsx-runtime";
+import { Slider as d } from "baseui/slider";
+import { mergeOverrides as m } from "baseui";
+function a({
+  overrides: r,
+  showValueToLabel: e = !1,
+  value: i,
+  onChange: l,
+  ...t
+}) {
+  return /* @__PURE__ */ s(
+    d,
+    {
+      ...t,
+      valueToLabel: (o) => e ? o : null,
+      value: i,
+      onChange: l,
+      overrides: m(
+        {
+          Thumb: {
+            style: () => ({
+              width: "28px",
+              height: "28px"
+            })
+          },
+          Track: { style: () => ({ borderRadius: "8px" }) },
+          ...e ? {} : {
+            ThumbValue: { style: () => ({ display: "none" }) },
+            InnerThumb: { style: () => ({ display: "none" }) }
+          }
+        },
+        r
+      )
+    }
+  );
+}
+export {
+  a as Slider
+};

package/dist/components/snackbar/index.js

@@ -0,0 +1,7 @@
+import { useSnackbar as e } from "baseui/snackbar";
+import { SnackbarElement as n, SnackbarProvider as b } from "./snackbar.js";
+export {
+  n as SnackbarElement,
+  b as SnackbarProvider,
+  e as useSnackbar
+};

package/dist/components/snackbar/snackbar.js

@@ -0,0 +1,51 @@
+import { jsx as o } from "react/jsx-runtime";
+import { useStyletron as t, mergeOverrides as i } from "baseui";
+import { SnackbarElement as c, SnackbarProvider as s } from "baseui/snackbar";
+import { Spinner as m } from "../spinner/spinner.js";
+function a(e) {
+  return {
+    Root: {
+      style: ({ $theme: r }) => ({
+        backgroundColor: r.colors.backgroundInversePrimary
+      })
+    },
+    ActionButtonContainer: {
+      style: ({ $theme: r }) => ({
+        paddingRight: r.sizing.scale100
+      })
+    },
+    Spinner: {
+      component: () => /* @__PURE__ */ o(m, { $size: e.sizing.scale600 })
+    }
+  };
+}
+function b({
+  overrides: e,
+  ...r
+}) {
+  const [, n] = t();
+  return /* @__PURE__ */ o(
+    c,
+    {
+      overrides: i(a(n), e),
+      ...r
+    }
+  );
+}
+function k({
+  overrides: e,
+  ...r
+}) {
+  const [, n] = t();
+  return /* @__PURE__ */ o(
+    s,
+    {
+      overrides: i(a(n), e),
+      ...r
+    }
+  );
+}
+export {
+  b as SnackbarElement,
+  k as SnackbarProvider
+};

package/dist/components/spinner/index.js

@@ -0,0 +1,4 @@
+import { Spinner as n } from "./spinner.js";
+export {
+  n as Spinner
+};

package/dist/components/spinner/spinner.js

@@ -0,0 +1,55 @@
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { Block as c } from "baseui/block";
+import { Spinner as g } from "baseui/spinner";
+import { useStyletron as m } from "baseui";
+import { LabelMedium as o, LabelSmall as u, LabelLarge as f, HeadingXSmall as p } from "baseui/typography";
+function d(r, n) {
+  return r === "small" ? n.sizing.scale800 : r === "medium" ? n.sizing.scale950 : r === "large" ? n.sizing.scale1200 : r === "xlarge" ? n.sizing.scale1600 : r;
+}
+function x(r, n, i) {
+  return r === "medium" ? "5px" : r === "large" || r === "xlarge" ? i.sizing.scale200 : n || i.sizing.scale100;
+}
+function L(r, n, i) {
+  if (typeof r == "string") {
+    const e = {
+      small: u,
+      medium: o,
+      large: f,
+      xlarge: p
+    }[n] || o, a = {
+      small: "11px",
+      medium: i.sizing.scale500,
+      large: i.sizing.scale400,
+      xlarge: i.sizing.scale600
+    };
+    return /* @__PURE__ */ t(e, { marginTop: a[n] || i.size.scale500, children: r });
+  }
+  return r;
+}
+function z({ $color: r, $size: n, $borderWidth: i, label: l }) {
+  const [, e] = m();
+  return /* @__PURE__ */ s(
+    c,
+    {
+      $style: {
+        display: "inline-flex",
+        flexDirection: "column",
+        alignItems: "center"
+      },
+      children: [
+        /* @__PURE__ */ t(
+          g,
+          {
+            $color: r || e.colors.borderAccent,
+            $size: d(n, e),
+            $borderWidth: x(n, i, e)
+          }
+        ),
+        l && L(l, n, e)
+      ]
+    }
+  );
+}
+export {
+  z as Spinner
+};

package/dist/components/stepper/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Stepper } from './stepper';
+export type { StepperProps } from './stepper';

package/dist/components/stepper/index.js

@@ -0,0 +1,4 @@
+import { default as r } from "./stepper.js";
+export {
+  r as Stepper
+};

package/dist/components/stepper/stepper.d.ts

@@ -0,0 +1,5 @@
+import { StepperProps as BaseStepperProps } from 'baseui/stepper';
+export type StepperProps = BaseStepperProps & {
+    id?: string;
+};
+export default function Stepper({ id, overrides, ...restProps }: StepperProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/stepper.js

@@ -0,0 +1,62 @@
+import { jsx as p } from "react/jsx-runtime";
+import { mergeOverrides as s } from "baseui";
+import { Stepper as i } from "baseui/stepper";
+function d({ id: e, overrides: t, ...o }) {
+  return /* @__PURE__ */ p(
+    i,
+    {
+      overrides: s(
+        {
+          Root: {
+            props: {
+              id: `${e}_root`
+            },
+            style: () => ({
+              maxWidth: "156px"
+            })
+          },
+          Input: {
+            props: {
+              id: e,
+              overrides: {
+                Root: {
+                  style: ({ $theme: r }) => ({
+                    marginLeft: r.sizing.scale400,
+                    marginRight: r.sizing.scale400
+                  })
+                }
+              }
+            }
+          },
+          DecrementButton: {
+            props: {
+              overrides: {
+                BaseButton: {
+                  props: {
+                    id: `${e}_decrement`
+                  }
+                }
+              }
+            }
+          },
+          IncrementButton: {
+            props: {
+              overrides: {
+                BaseButton: {
+                  props: {
+                    id: `${e}_increment`
+                  }
+                }
+              }
+            }
+          }
+        },
+        t
+      ),
+      ...o
+    }
+  );
+}
+export {
+  d as default
+};

package/dist/components/table/index.d.ts

@@ -1,5 +1,6 @@
-export * from 'baseui/table';
-export * from 'baseui/data-table';
 export { StyledTable as StyledTableGrid, StyledBodyCell as StyleBodyCellGrid, StyledHeadCell as StyledHeadCellGrid, SortableHeadCell, SORT_DIRECTION, } from 'baseui/table-grid';
-export type { TableProps as SemanticTableProps, Size, Divider as SemanticTableDivider, TableOverrides, BuilderOverrides, TableBuilderProps, ColumnOverrides, TableBuilderColumnProps, } from 'baseui/table-semantic';
-export { StyledTable as SemanticStyledTable, Table as SemanticTable, TableBuilder, TableBuilderColumn, DIVIDER, SIZE, StyledRoot, StyledTableHead, StyledTableHeadRow, StyledTableHeadCell, StyledTableHeadCellSortable, StyledTableBody, StyledTableBodyRow, StyledTableBodyCell, StyledTableLoadingMessage, StyledTableEmptyMessage, StyledSortAscIcon, StyledSortDescIcon, StyledSortNoneIcon, } from 'baseui/table-semantic';
+export type { Row } from 'baseui/data-table';
+export type { TableProps as SemanticTableProps, Size, Divider as SemanticTableDivider, TableOverrides, BuilderOverrides, ColumnOverrides, TableBuilderColumnProps, } from 'baseui/table-semantic';
+export { StyledTable as SemanticStyledTable, Table as SemanticTable, TableBuilderColumn, DIVIDER, SIZE, StyledRoot, StyledTableHead, StyledTableHeadRow, StyledTableHeadCell, StyledTableHeadCellSortable, StyledTableBody, StyledTableBodyRow, StyledTableBodyCell, StyledTableLoadingMessage, StyledTableEmptyMessage, StyledSortAscIcon, StyledSortDescIcon, StyledSortNoneIcon, } from 'baseui/table-semantic';
+export * from './table-builder';
+export * from './table-cells';

package/dist/components/table/index.js

@@ -0,0 +1,39 @@
+import { SORT_DIRECTION as a, SortableHeadCell as d, StyledBodyCell as t, StyledHeadCell as o, StyledTable as S } from "baseui/table-grid";
+import { DIVIDER as T, SIZE as y, StyledTable as r, Table as C, StyledRoot as i, StyledSortAscIcon as s, StyledSortDescIcon as n, StyledSortNoneIcon as I, StyledTableBody as m, StyledTableBodyCell as c, StyledTableBodyRow as B, StyledTableEmptyMessage as H, StyledTableHead as R, StyledTableHeadCell as g, StyledTableHeadCellSortable as x, StyledTableHeadRow as p, StyledTableLoadingMessage as u, TableBuilderColumn as f } from "baseui/table-semantic";
+import { TableBuilder as E, useTableBuilderContext as G } from "./table-builder.js";
+import { TableCellBadge as k, TableCellCheckbox as w, TableCellIcon as M, TableCellImage as N, TableCellLink as O, TableCellListItem as h, TableCellRadio as A, TableHeading as V } from "./table-cells/index.js";
+export {
+  T as DIVIDER,
+  y as SIZE,
+  a as SORT_DIRECTION,
+  r as SemanticStyledTable,
+  C as SemanticTable,
+  d as SortableHeadCell,
+  t as StyleBodyCellGrid,
+  o as StyledHeadCellGrid,
+  i as StyledRoot,
+  s as StyledSortAscIcon,
+  n as StyledSortDescIcon,
+  I as StyledSortNoneIcon,
+  m as StyledTableBody,
+  c as StyledTableBodyCell,
+  B as StyledTableBodyRow,
+  H as StyledTableEmptyMessage,
+  S as StyledTableGrid,
+  R as StyledTableHead,
+  g as StyledTableHeadCell,
+  x as StyledTableHeadCellSortable,
+  p as StyledTableHeadRow,
+  u as StyledTableLoadingMessage,
+  E as TableBuilder,
+  f as TableBuilderColumn,
+  k as TableCellBadge,
+  w as TableCellCheckbox,
+  M as TableCellIcon,
+  N as TableCellImage,
+  O as TableCellLink,
+  h as TableCellListItem,
+  A as TableCellRadio,
+  V as TableHeading,
+  G as useTableBuilderContext
+};

package/dist/components/table/table-builder.d.ts

@@ -0,0 +1,9 @@
+import { TableBuilderProps as BaseTableBuilderProps, Size as BaseTableSize } from 'baseui/table-semantic';
+export type TableBuilderSize = "small" | "medium" | "large" | BaseTableSize;
+export type TableBuilderProps = Omit<BaseTableBuilderProps<any>, "size"> & {
+    size?: TableBuilderSize;
+};
+export declare const useTableBuilderContext: () => {
+    size: TableBuilderSize;
+};
+export declare function TableBuilder({ size, overrides, ...restProps }: TableBuilderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/table/table-builder.js

@@ -0,0 +1,93 @@
+import { jsx as t } from "react/jsx-runtime";
+import { createContext as n, useContext as c, useMemo as s } from "react";
+import { mergeOverrides as u } from "baseui";
+import { TableBuilder as p } from "baseui/table-semantic";
+import g from "../../themes/typography.js";
+import { checkForContextError as m } from "../../utils/index.js";
+const i = n({
+  size: "default"
+}), y = () => {
+  const e = c(i);
+  return m(e, "TableBuilder"), e;
+};
+function b(e) {
+  switch (e) {
+    case "small":
+      return "compact";
+    case "medium":
+      return "default";
+    case "large":
+      return "spacious";
+    default:
+      return e;
+  }
+}
+const a = {
+  compact: "31px",
+  // Total cell height with line height is 32px
+  default: "51px",
+  // Total cell height with line height is 52px
+  spacious: "63px"
+  // Total cell height with line height is 64px
+};
+function v({
+  size: e,
+  overrides: l,
+  ...d
+}) {
+  const o = b(e || "default");
+  return /* @__PURE__ */ t(
+    i.Provider,
+    {
+      value: s(() => ({ size: o }), [o]),
+      children: /* @__PURE__ */ t(
+        p,
+        {
+          size: o,
+          overrides: u(
+            {
+              TableHeadCell: {
+                style: ({ $theme: r }) => ({
+                  padding: r.sizing.scale300,
+                  borderLeft: 0,
+                  borderTop: 0,
+                  borderRight: 0
+                })
+              },
+              TableBodyCell: {
+                style: ({ $theme: r }) => ({
+                  ...g.ParagraphSmall,
+                  lineHeight: 1,
+                  // So the total cell height is even
+                  paddingTop: 0,
+                  paddingBottom: 0,
+                  paddingLeft: r.sizing.scale300,
+                  paddingRight: r.sizing.scale300,
+                  whiteSpace: "nowrap",
+                  verticalAlign: "middle",
+                  height: a[o] || a.default
+                })
+              },
+              TableBodyRow: {
+                style: ({ $theme: r }) => ({
+                  ":hover": {
+                    backgroundColor: r.colors.backgroundTertiary
+                  },
+                  ":active": {
+                    backgroundColor: r.colors.backgroundSecondary
+                  }
+                })
+              }
+            },
+            l
+          ),
+          ...d
+        }
+      )
+    }
+  );
+}
+export {
+  v as TableBuilder,
+  y as useTableBuilderContext
+};

package/dist/components/table/table-cells/index.d.ts

@@ -0,0 +1,40 @@
+import { ReactNode } from 'react';
+import { StyleObject } from 'styletron-react';
+import { BadgeProps } from 'baseui/badge';
+import { BlockProps } from 'baseui/block';
+import { CheckboxProps } from '../../checkbox';
+import { ListItemProps } from '../../list';
+import { RadioProps } from '../../radio';
+export type TableCellProps = BlockProps & {
+    $style?: StyleObject;
+};
+export declare function TableHeading({ children, ...restProps }: TableCellProps): import("react/jsx-runtime").JSX.Element;
+export type TableCellLinkProps = TableCellProps & {
+    href: string;
+};
+export declare function TableCellLink({ children, href, ...restProps }: TableCellLinkProps): import("react/jsx-runtime").JSX.Element;
+export type TableCellCheckboxProps = CheckboxProps & {
+    blockProps?: BlockProps;
+};
+export declare function TableCellCheckbox({ overrides, blockProps, ...restProps }: TableCellCheckboxProps): import("react/jsx-runtime").JSX.Element;
+export type TableCellRadioProps = RadioProps & {
+    blockProps?: BlockProps;
+};
+export declare function TableCellRadio({ overrides, blockProps, ...restProps }: TableCellRadioProps): import("react/jsx-runtime").JSX.Element;
+export declare function TableCellIcon({ children, ...restProps }: TableCellProps): import("react/jsx-runtime").JSX.Element;
+export type TableCellListItemProps = {
+    children: ReactNode;
+    description?: ReactNode;
+    artwork?: ListItemProps["artwork"];
+    overrides?: ListItemProps["overrides"];
+};
+export declare function TableCellListItem({ children, description, overrides, artwork, }: TableCellListItemProps): import("react/jsx-runtime").JSX.Element;
+export type TableCellImageProps = TableCellProps & {
+    imgSrc: string;
+    imgAlt: string;
+};
+export declare function TableCellImage({ imgSrc, imgAlt, children, ...restProps }: TableCellImageProps): import("react/jsx-runtime").JSX.Element;
+export type TableCellBadgeProps = TableCellProps & {
+    badgeProps?: BadgeProps;
+};
+export declare function TableCellBadge({ children, badgeProps, ...restProps }: TableCellBadgeProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/table/table-cells/index.js

@@ -0,0 +1,228 @@
+import { jsx as n, jsxs as g } from "react/jsx-runtime";
+import m, { Children as d } from "react";
+import { useStyletron as a, mergeOverrides as s } from "baseui";
+import { Badge as p } from "baseui/badge";
+import { Block as l } from "baseui/block";
+import f from "../../../themes/typography.js";
+import { Checkbox as h } from "../../checkbox/checkbox.js";
+import { Link as u } from "../../link/index.js";
+import y from "../../list/list.js";
+import z from "../../list/list-item-label.js";
+import "baseui/list";
+import "baseui/radio";
+import { Radio as b } from "../../radio/radio.js";
+import { LabelXSmall as C, ParagraphSmall as L } from "baseui/typography";
+function _({ children: r, ...e }) {
+  return /* @__PURE__ */ n(C, { color: "contentSecondary", ...e, children: r });
+}
+function D({
+  children: r,
+  href: e,
+  ...t
+}) {
+  return /* @__PURE__ */ n(u, { href: e, size: "xsmall", ...t, children: r });
+}
+function F({
+  overrides: r,
+  blockProps: e,
+  ...t
+}) {
+  const [, i] = a();
+  return /* @__PURE__ */ n(
+    l,
+    {
+      marginLeft: i.sizing.scale500,
+      marginRight: i.sizing.scale300,
+      ...e,
+      children: /* @__PURE__ */ n(
+        h,
+        {
+          overrides: s(
+            {
+              Checkmark: {
+                style: ({ $theme: o }) => ({
+                  width: o.sizing.scale600,
+                  height: o.sizing.scale600,
+                  margin: 0
+                })
+              }
+            },
+            r
+          ),
+          ...t
+        }
+      )
+    }
+  );
+}
+function M({
+  overrides: r,
+  blockProps: e,
+  ...t
+}) {
+  const [, i] = a();
+  return /* @__PURE__ */ n(
+    l,
+    {
+      marginLeft: i.sizing.scale500,
+      marginRight: i.sizing.scale300,
+      ...e,
+      children: /* @__PURE__ */ n(
+        b,
+        {
+          overrides: s(
+            {
+              Root: {
+                style: () => ({
+                  margin: 0
+                })
+              },
+              RadioMarkOuter: {
+                style: ({ $theme: o }) => ({
+                  width: o.sizing.scale600,
+                  height: o.sizing.scale600,
+                  margin: 0
+                })
+              }
+            },
+            r
+          ),
+          ...t
+        }
+      )
+    }
+  );
+}
+function N({ children: r, ...e }) {
+  const [, t] = a();
+  return /* @__PURE__ */ n(l, { display: "flex", alignItems: "center", ...e, children: d.map(r, (i) => m.isValidElement(i) ? m.cloneElement(i, {
+    size: t.sizing.scale600,
+    ...i.props
+  }) : i) });
+}
+function V({
+  children: r,
+  description: e,
+  overrides: t,
+  artwork: i
+}) {
+  return /* @__PURE__ */ n(
+    y,
+    {
+      overrides: s(
+        {
+          Root: {
+            props: {
+              $as: "div"
+            },
+            style: {
+              backgroundColor: "transparent"
+            }
+          },
+          Content: {
+            style: () => ({
+              borderBottom: 0,
+              paddingRight: 0,
+              minHeight: "none"
+            })
+          }
+        },
+        t
+      ),
+      artwork: i,
+      children: /* @__PURE__ */ n(
+        z,
+        {
+          description: e,
+          overrides: {
+            LabelRoot: {
+              style: () => ({
+                padding: 0
+              })
+            },
+            LabelDescription: {
+              style: ({ $theme: o }) => ({
+                color: o.colors.contentSecondary
+              })
+            }
+          },
+          children: r
+        }
+      )
+    }
+  );
+}
+function q({
+  imgSrc: r,
+  imgAlt: e,
+  children: t,
+  ...i
+}) {
+  const [o, c] = a();
+  return /* @__PURE__ */ g(
+    l,
+    {
+      className: o({
+        display: "flex",
+        alignItems: "center"
+      }),
+      ...i,
+      children: [
+        /* @__PURE__ */ n(
+          l,
+          {
+            as: "img",
+            src: r,
+            alt: e,
+            width: c.sizing.scale1000,
+            height: c.sizing.scale1000,
+            style: {
+              maxHeight: "100%",
+              objectFit: "contain"
+            }
+          }
+        ),
+        !!t && /* @__PURE__ */ n(L, { margin: `0 0 0 ${c.sizing.scale500}`, children: t })
+      ]
+    }
+  );
+}
+function A({
+  children: r,
+  badgeProps: e,
+  ...t
+}) {
+  return /* @__PURE__ */ n(l, { ...t, children: /* @__PURE__ */ n(
+    p,
+    {
+      content: r,
+      color: "primary",
+      hierarchy: "secondary",
+      ...e,
+      overrides: s(
+        {
+          Badge: {
+            style: ({ $theme: i }) => ({
+              borderRadius: "9999px",
+              ...f.LabelXSmall,
+              paddingLeft: i.sizing.scale300,
+              paddingRight: i.sizing.scale300,
+              color: i.colors.contentTertiary
+            })
+          }
+        },
+        e == null ? void 0 : e.overrides
+      )
+    }
+  ) });
+}
+export {
+  A as TableCellBadge,
+  F as TableCellCheckbox,
+  N as TableCellIcon,
+  q as TableCellImage,
+  D as TableCellLink,
+  V as TableCellListItem,
+  M as TableCellRadio,
+  _ as TableHeading
+};

package/dist/components/tabs/index.d.ts

@@ -1,3 +1,2 @@
-export type { TabProps, TabsProps } from 'baseui/tabs-motion';
-export { Tab, Tabs } from 'baseui/tabs-motion';
+export * from './tabs';
 export { default as TabTitle } from './tab-title';

package/dist/components/tabs/index.js

@@ -0,0 +1,7 @@
+import { Tab as o, Tabs as r } from "./tabs.js";
+import { default as T } from "./tab-title.js";
+export {
+  o as Tab,
+  T as TabTitle,
+  r as Tabs
+};