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

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

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+import { StatefulPopoverProps } from 'baseui/popover';
+import { ContentStepperOverrides } from '../content-stepper';
+export type PopoverStep = {
+    title?: ReactNode;
+    body: ReactNode;
+    withCloseButton?: boolean;
+};
+export type StepperPopoverProps = Omit<StatefulPopoverProps, "content"> & {
+    steps: PopoverStep[];
+    contentStepperOverrides: ContentStepperOverrides;
+    withStepCount?: boolean;
+};
+export declare function StepperPopover({ children, contentStepperOverrides, steps, withStepCount, ...restProps }: StepperPopoverProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/popover/stepper-popover.js

@@ -0,0 +1,31 @@
+import { jsx as e } from "react/jsx-runtime";
+import { ContentStepper as f } from "../content-stepper/content-stepper.js";
+import { StatefulPopover as i } from "./popover.js";
+function v({
+  children: t,
+  contentStepperOverrides: r,
+  steps: p,
+  withStepCount: n = !0,
+  ...m
+}) {
+  return /* @__PURE__ */ e(
+    i,
+    {
+      content: ({ close: o }) => /* @__PURE__ */ e(
+        f,
+        {
+          steps: p,
+          withStepCount: n,
+          onClose: o,
+          overrides: r,
+          onStepsCompleted: o
+        }
+      ),
+      ...m,
+      children: t
+    }
+  );
+}
+export {
+  v as StepperPopover
+};

package/dist/components/progress-bar/index.d.ts

@@ -1,2 +1,2 @@
-export type { ProgressBarProps, ProgressBarRoundedProps, } from 'baseui/progress-bar';
+export type { ProgressBarRoundedProps } from 'baseui/progress-bar';
 export * from './progress-bar';

package/dist/components/progress-bar/index.js

@@ -0,0 +1,6 @@
+import { ProgressBar as e } from "./progress-bar.js";
+import { ProgressBarRounded as a } from "baseui/progress-bar";
+export {
+  e as ProgressBar,
+  a as ProgressBarRounded
+};

package/dist/components/progress-bar/progress-bar.d.ts

@@ -1,3 +1,6 @@
 import { ProgressBarProps as BaseProgressBarProps } from 'baseui/progress-bar';
-export declare function ProgressBar({ overrides, ...restProps }: BaseProgressBarProps): import("react/jsx-runtime").JSX.Element;
+export type ProgressBarProps = BaseProgressBarProps & {
+    stepAnimationIterationCount?: number | string;
+};
+export declare function ProgressBar({ overrides, stepAnimationIterationCount, ...restProps }: ProgressBarProps): import("react/jsx-runtime").JSX.Element;
 export { ProgressBarRounded } from 'baseui/progress-bar';

package/dist/components/progress-bar/progress-bar.js

@@ -0,0 +1,91 @@
+import { jsx as g } from "react/jsx-runtime";
+import { mergeOverrides as p } from "baseui";
+import { ProgressBar as b } from "baseui/progress-bar";
+import { ProgressBarRounded as M } from "baseui/progress-bar";
+import s from "../../themes/typography.js";
+function y(e) {
+  return e === "small" ? s.LabelSmall : e === "large" ? s.LabelLarge : s.LabelMedium;
+}
+function h({
+  overrides: e,
+  stepAnimationIterationCount: i = 1,
+  ...l
+}) {
+  return /* @__PURE__ */ g(
+    b,
+    {
+      overrides: p(
+        {
+          Bar: {
+            style: ({ $theme: r }) => ({
+              borderRadius: r.sizing.scale600
+            })
+          },
+          BarProgress: {
+            style: ({
+              $value: r,
+              $successValue: o,
+              $steps: t,
+              $index: m,
+              $maxValue: u,
+              $minValue: a = 0
+            }) => {
+              if (t > 1) {
+                const n = u || o, c = (n - a) / t, d = (r - a) / (n - a) * 100, f = Math.floor(d / c);
+                if (m === f)
+                  return {
+                    animationIterationCount: i,
+                    animationFillMode: "both",
+                    animationName: {
+                      "0%": {
+                        transform: "translateX(-102%)",
+                        opacity: 1
+                      },
+                      "50%": {
+                        transform: "translateX(0%)",
+                        opacity: 1
+                      },
+                      "100%": {
+                        transform: "translateX(0%)",
+                        opacity: typeof i == "number" ? 1 : 0
+                      }
+                    }
+                  };
+              }
+              return {};
+            }
+          },
+          BarContainer: {
+            style: ({ $theme: r, $size: o }) => ({
+              marginBottom: o === "small" ? r.sizing.scale500 : r.sizing.scale550
+            })
+          },
+          InfiniteBar: {
+            style: ({ $theme: r, $isLeft: o }) => {
+              const t = r.sizing.scale600;
+              return o ? {
+                borderTopLeftRadius: t,
+                borderBottomLeftRadius: t
+              } : {
+                borderTopRightRadius: t,
+                borderBottomRightRadius: t
+              };
+            }
+          },
+          Label: {
+            style: ({ $theme: r, $size: o }) => ({
+              color: r.colors.contentPrimary,
+              ...y(o)
+            })
+          }
+        },
+        e
+      ),
+      ...l
+    }
+  );
+}
+export {
+  h as ProgressBar,
+  M as ProgressBarRounded
+};

package/dist/components/progress-steps/index.d.ts

@@ -0,0 +1,7 @@
+export type { Orientation, ProgressStepsOverrides, StepOverrides, NumberedStepOverrides, StyleProps as ProgressStepsStyleProps, } from 'baseui/progress-steps';
+export { StyledProgressSteps, StyledStep, StyledIconContainer, StyledIcon, StyledInnerIcon, StyledContent, StyledContentTitle, StyledContentTail, StyledContentDescription, StyledNumberStep, StyledNumberIcon, StyledNumberContentTail, ORIENTATION as PROGRESS_STEPS_ORIENTATION, } from 'baseui//progress-steps';
+export * from './progress-steps';
+export * from './step';
+export { NumberedStep as ClayNumberedStep } from './numbered-step';
+export type { NumberedStepProps as ClayNumberedStepProps } from './numbered-step';
+export * from './numbered-step-title';

package/dist/components/progress-steps/index.js

@@ -0,0 +1,25 @@
+import { ORIENTATION as S, StyledContent as r, StyledContentDescription as o, StyledContentTail as n, StyledContentTitle as l, StyledIcon as d, StyledIconContainer as p, StyledInnerIcon as y, StyledNumberContentTail as m, StyledNumberIcon as N, StyledNumberStep as s, StyledProgressSteps as I, StyledStep as T } from "baseui//progress-steps";
+import { ProgressSteps as i } from "./progress-steps.js";
+import { Step as C } from "./step.js";
+import { NumberedStep as c } from "./numbered-step.js";
+import { NumberedStepSubtitle as x, NumberedStepTitle as O } from "./numbered-step-title.js";
+export {
+  c as ClayNumberedStep,
+  x as NumberedStepSubtitle,
+  O as NumberedStepTitle,
+  S as PROGRESS_STEPS_ORIENTATION,
+  i as ProgressSteps,
+  C as Step,
+  r as StyledContent,
+  o as StyledContentDescription,
+  n as StyledContentTail,
+  l as StyledContentTitle,
+  d as StyledIcon,
+  p as StyledIconContainer,
+  y as StyledInnerIcon,
+  m as StyledNumberContentTail,
+  N as StyledNumberIcon,
+  s as StyledNumberStep,
+  I as StyledProgressSteps,
+  T as StyledStep
+};

package/dist/components/progress-steps/numbered-step-title.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode, ComponentType } from 'react';
+import { BlockProps } from 'baseui/block';
+import { Override } from 'baseui/helpers/overrides';
+export type NumberedStepTitleOverrides = {
+    Root?: Override;
+    ContentContainer?: Override;
+    EndEnhancerContainer?: Override;
+};
+export type NumberedStepTitleProps = {
+    children: ReactNode;
+    endEnhancer?: ReactNode | ComponentType<any>;
+    overrides?: NumberedStepTitleOverrides;
+};
+export declare function NumberedStepTitle({ children, endEnhancer, overrides, }: NumberedStepTitleProps): import("react/jsx-runtime").JSX.Element;
+export declare function NumberedStepSubtitle({ children, ...restProps }: BlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/progress-steps/numbered-step-title.js

@@ -0,0 +1,41 @@
+import { jsxs as f, jsx as i } from "react/jsx-runtime";
+import u from "react";
+import { getOverrides as o } from "baseui/helpers/overrides";
+import { styled as r } from "baseui";
+import { ParagraphSmall as d } from "baseui/typography";
+function j({
+  children: e,
+  endEnhancer: t,
+  overrides: n = {}
+}) {
+  const [a, m] = o(
+    n.Root,
+    r("div", {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between"
+    })
+  ), [p, s] = o(
+    n.ContentContainer,
+    r("div", {})
+  ), [l, c] = o(
+    n.EndEnhancerContainer,
+    r("div", {
+      display: "flex",
+      alignItems: "center",
+      minWidth: "70px",
+      justifyContent: "center"
+    })
+  );
+  return /* @__PURE__ */ f(a, { ...m, children: [
+    /* @__PURE__ */ i(p, { ...s, children: e }),
+    t && t !== 0 && /* @__PURE__ */ i(l, { ...c, children: typeof t == "function" ? u.createElement(t) : t })
+  ] });
+}
+function P({ children: e, ...t }) {
+  return /* @__PURE__ */ i(d, { marginTop: "scale200", marginBottom: "0", ...t, children: e });
+}
+export {
+  P as NumberedStepSubtitle,
+  j as NumberedStepTitle
+};

package/dist/components/progress-steps/numbered-step.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode, ComponentType } from 'react';
+import { NumberedStepProps as BaseNumberedStepProps } from 'baseui/progress-steps';
+import { NumberedStepTitleOverrides } from './numbered-step-title';
+export declare function NumberedStepIcon(props: {
+    $isActive: boolean;
+    $isCompleted: boolean;
+    isPending: boolean;
+    hasError?: boolean;
+    $isCurrent: boolean;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export type NumberedStepProps = BaseNumberedStepProps & {
+    id?: string;
+    subtitle?: ReactNode;
+    isPending?: boolean;
+    pendingText?: ReactNode;
+    hasError?: boolean;
+    errorText?: ReactNode;
+    endEnhancer?: ReactNode | ComponentType<any>;
+    titleOverrides?: NumberedStepTitleOverrides;
+};
+export declare function NumberedStep({ id, title, subtitle, isPending, hasError, pendingText, errorText, endEnhancer, children, overrides, titleOverrides, ...restProps }: NumberedStepProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/progress-steps/numbered-step.js

@@ -0,0 +1,108 @@
+import { jsx as r, jsxs as z } from "react/jsx-runtime";
+import { mergeOverrides as v } from "baseui";
+import { NumberedStep as y, StyledNumberIcon as C } from "baseui/progress-steps";
+import { Spinner as N } from "../spinner/spinner.js";
+import { LabelMedium as $ } from "baseui/typography";
+import { NumberedStepTitle as k, NumberedStepSubtitle as f } from "./numbered-step-title.js";
+import x from "../icons/line/check/index.js";
+import I from "../icons/line/close/index.js";
+function L(l) {
+  const {
+    $isActive: e,
+    $isCompleted: i,
+    isPending: n,
+    hasError: t,
+    $isCurrent: s,
+    children: c,
+    ...p
+  } = l;
+  return /* @__PURE__ */ r(
+    C,
+    {
+      ...p,
+      $isActive: e,
+      $isCompleted: i,
+      $isCurrent: s,
+      children: i ? /* @__PURE__ */ r(x, { size: 16, stroke: "currentColor" }) : e && n ? /* @__PURE__ */ r(N, { $size: 16, ...p }) : e && t ? /* @__PURE__ */ r(I, { $size: 16, ...p, stroke: "currentColor" }) : c
+    }
+  );
+}
+function T({
+  id: l,
+  title: e,
+  subtitle: i,
+  isPending: n = !1,
+  hasError: t = !1,
+  pendingText: s = "Pending...",
+  errorText: c = "Error",
+  endEnhancer: p,
+  children: a,
+  overrides: g,
+  titleOverrides: b,
+  ...h
+}) {
+  const u = i || n || t ? "25px" : "15px", d = "42px", S = v(
+    {
+      Root: {
+        props: {
+          id: l
+        }
+      },
+      Icon: {
+        component: L,
+        props: {
+          isPending: n,
+          hasError: t
+        },
+        style: ({ $theme: o, $orientation: m }) => ({
+          width: o.sizing.scale950,
+          height: o.sizing.scale950,
+          borderRadius: o.sizing.scale950,
+          border: "none",
+          ":before": { border: "none" },
+          ...m === "vertical" ? {
+            marginTop: u
+          } : {
+            marginLeft: d
+          }
+        })
+      },
+      Description: {
+        style: ({ $theme: o }) => ({
+          marginBottom: o.sizing.scale200
+        })
+      },
+      Tail: {
+        style: ({ $orientation: o, $theme: m }) => ({
+          ...o === "vertical" ? {
+            height: "100%",
+            left: "25px",
+            top: 0,
+            marginTop: `calc(${m.sizing.scale950}  + ${u})`
+          } : {
+            top: m.sizing.scale600,
+            marginLeft: `-${d}`,
+            marginRight: `-${d}`
+          }
+        })
+      }
+    },
+    g
+  );
+  return /* @__PURE__ */ r(
+    y,
+    {
+      ...h,
+      overrides: S,
+      title: /* @__PURE__ */ z(k, { endEnhancer: p, overrides: b, children: [
+        typeof e == "string" ? /* @__PURE__ */ r($, { children: e }) : e,
+        n ? typeof s == "string" ? /* @__PURE__ */ r(f, { children: s }) : s : t ? typeof c == "string" ? /* @__PURE__ */ r(f, { color: "negative", children: c }) : c : typeof i == "string" ? /* @__PURE__ */ r(f, { children: i }) : i
+      ] }),
+      children: a
+    }
+  );
+}
+export {
+  T as NumberedStep,
+  L as NumberedStepIcon
+};

package/dist/components/progress-steps/progress-steps.d.ts

@@ -0,0 +1,5 @@
+import { ProgressStepsProps as BaseProgressStepsProps } from 'baseui/progress-steps';
+export type ProgressStepsProps = BaseProgressStepsProps & {
+    id?: string;
+};
+export declare function ProgressSteps({ id, overrides, ...restProps }: ProgressStepsProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/progress-steps/progress-steps.js

@@ -0,0 +1,28 @@
+import { jsx as s } from "react/jsx-runtime";
+import { mergeOverrides as t } from "baseui";
+import { ProgressSteps as p } from "baseui/progress-steps";
+function g({
+  id: r,
+  overrides: o,
+  ...e
+}) {
+  return /* @__PURE__ */ s(
+    p,
+    {
+      overrides: t(
+        {
+          Root: {
+            props: {
+              id: r
+            }
+          }
+        },
+        o
+      ),
+      ...e
+    }
+  );
+}
+export {
+  g as ProgressSteps
+};

package/dist/components/progress-steps/step.d.ts

@@ -0,0 +1,6 @@
+import { StepProps as BaseStepProps } from 'baseui/progress-steps';
+export type StepProps = BaseStepProps & {
+    id?: string;
+};
+export declare function Step({ id, overrides, ...restProps }: StepProps): import("react/jsx-runtime").JSX.Element;
+export default Step;

package/dist/components/progress-steps/step.js

@@ -0,0 +1,54 @@
+import { jsx as n } from "react/jsx-runtime";
+import { mergeOverrides as l } from "baseui";
+import { Step as a } from "baseui/progress-steps";
+function d({ id: s, overrides: r, ...t }) {
+  return /* @__PURE__ */ n(
+    a,
+    {
+      overrides: l(
+        {
+          Root: {
+            props: {
+              id: s
+            }
+          },
+          Icon: {
+            style: ({ $theme: i, $isActive: o }) => {
+              const e = i.sizing[o ? "scale600" : "scale400"];
+              return {
+                width: e,
+                height: e,
+                lineHeight: e,
+                borderRadius: e
+              };
+            }
+          },
+          InnerIcon: {
+            style: ({ $theme: i }) => ({
+              width: i.sizing.scale100,
+              height: i.sizing.scale100,
+              lineHeight: i.sizing.scale100,
+              borderRadius: i.sizing.scale100
+            })
+          },
+          Description: {
+            style: ({ $theme: i }) => ({
+              marginBottom: i.sizing.scale200
+            })
+          },
+          Tail: {
+            style: ({ $orientation: i }) => ({
+              ...i === "vertical" && { height: "100%" }
+            })
+          }
+        },
+        r
+      ),
+      ...t
+    }
+  );
+}
+export {
+  d as Step,
+  d as default
+};

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

@@ -1,3 +1,3 @@
-export type { RadioProps, RadioGroupProps } from 'baseui/radio';
+export type { RadioGroupProps } from 'baseui/radio';
 export { RadioGroup } from 'baseui/radio';
 export * from './radio';

package/dist/components/radio/index.js

@@ -0,0 +1,6 @@
+import { RadioGroup as p } from "baseui/radio";
+import { Radio as d } from "./radio.js";
+export {
+  d as Radio,
+  p as RadioGroup
+};

package/dist/components/radio/overrides.d.ts

@@ -0,0 +1,17 @@
+export declare const radioMarkOverrides: {
+    RadioMarkOuter: {
+        style: ({ $theme }: {
+            $theme: any;
+        }) => {
+            height: any;
+            width: any;
+        };
+    };
+    RadioMarkInner: {
+        style: ({ $checked }: {
+            $checked: any;
+        }) => {
+            transform: string;
+        };
+    };
+};

package/dist/components/radio/overrides.js

@@ -0,0 +1,16 @@
+const r = {
+  RadioMarkOuter: {
+    style: ({ $theme: a }) => ({
+      height: a.sizing.scale800,
+      width: a.sizing.scale800
+    })
+  },
+  RadioMarkInner: {
+    style: ({ $checked: a }) => ({
+      transform: a ? "scale(.3)" : "scale(.8)"
+    })
+  }
+};
+export {
+  r as radioMarkOverrides
+};

package/dist/components/radio/radio.d.ts

@@ -1,2 +1,5 @@
 import { RadioProps as BaseRadioProps } from 'baseui/radio';
-export declare function Radio({ overrides, ...restProps }: BaseRadioProps): import("react/jsx-runtime").JSX.Element;
+export type RadioProps = BaseRadioProps & {
+    id?: string;
+};
+export declare function Radio({ id, overrides, ...restProps }: RadioProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/radio/radio.js

@@ -0,0 +1,31 @@
+import { jsx as n } from "react/jsx-runtime";
+import { mergeOverrides as a } from "baseui";
+import { Radio as m } from "baseui/radio";
+import { radioMarkOverrides as s } from "./overrides.js";
+function c({ id: i, overrides: o, ...e }) {
+  return /* @__PURE__ */ n(
+    m,
+    {
+      overrides: a(
+        {
+          Input: {
+            props: {
+              id: i
+            }
+          },
+          ...s,
+          Description: {
+            style: ({ $theme: r, $align: t }) => ({
+              [`margin${r.direction === "rtl" ? "Right" : "Left"}`]: t === "horizontal" ? null : r.sizing.scale950
+            })
+          }
+        },
+        o
+      ),
+      ...e
+    }
+  );
+}
+export {
+  c as Radio
+};

package/dist/components/section-heading/index.d.ts

@@ -0,0 +1 @@
+export * from './section-heading';

package/dist/components/section-heading/index.js

@@ -0,0 +1,4 @@
+import { SectionHeading as i } from "./section-heading.js";
+export {
+  i as SectionHeading
+};

package/dist/components/section-heading/section-heading.d.ts

@@ -0,0 +1,5 @@
+import { ListHeadingProps } from '../list';
+export type SectionHeadingProps = ListHeadingProps & {
+    headingLevel?: 1 | 2 | 3;
+};
+export declare function SectionHeading({ headingLevel, overrides, ...restProps }: SectionHeadingProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/section-heading/section-heading.js

@@ -0,0 +1,75 @@
+import { jsx as t } from "react/jsx-runtime";
+import { mergeOverrides as i } from "baseui";
+import a from "../../themes/typography.js";
+import p from "../list/list-heading.js";
+import "baseui/list";
+const s = {
+  1: "HeadingLarge",
+  2: "HeadingMedium",
+  3: "HeadingSmall"
+}, m = {
+  1: "ParagraphLarge",
+  2: "ParagraphMedium",
+  3: "ParagraphSmall"
+}, g = {
+  1: "LabelLarge",
+  2: "LabelLarge",
+  3: "LabelMedium"
+}, d = {
+  1: "ParagraphMedium",
+  2: "ParagraphMedium",
+  3: "ParagraphSmall"
+};
+function N({
+  headingLevel: r = 1,
+  overrides: e,
+  ...n
+}) {
+  return /* @__PURE__ */ t(
+    p,
+    {
+      overrides: i(
+        {
+          Root: {
+            props: {
+              $as: "header"
+            }
+          },
+          Content: {
+            style: ({ $theme: o }) => ({
+              paddingTop: o.sizing.scale800
+            })
+          },
+          HeadingContainer: {
+            props: {
+              $as: `h${r}`
+            },
+            style: () => ({
+              ...a[s[r]]
+            })
+          },
+          SubHeadingContainer: {
+            style: () => ({
+              ...a[m[r]]
+            })
+          },
+          EndEnhancerContainer: {
+            style: () => ({
+              ...a[g[r]]
+            })
+          },
+          EndEnhancerDescriptionContainer: {
+            style: () => ({
+              ...a[d[r]]
+            })
+          }
+        },
+        e
+      ),
+      ...n
+    }
+  );
+}
+export {
+  N as SectionHeading
+};

package/dist/components/segmented-control/index.d.ts

@@ -1,3 +1 @@
-export { Segment } from 'baseui/segmented-control';
-export type { SegmentProps, SegmentedControlProps, } from 'baseui/segmented-control';
 export * from './segmented-control';

package/dist/components/segmented-control/index.js

@@ -0,0 +1,5 @@
+import { Segment as t, SegmentedControl as m } from "./segmented-control.js";
+export {
+  t as Segment,
+  m as SegmentedControl
+};