@levo-so/react 0.0.2-alpha → 0.1.0

package/dist/StepsFormVariant-NSTSIoVV.js

@@ -0,0 +1,137 @@
+"use client";
+import { j as t } from "./jsx-runtime-B6kdoens.js";
+import { useState as A, useMemo as v } from "react";
+import { FormProvider as I } from "react-hook-form";
+import { m as N, F as T } from "./CollectionFormBuilder-a0pzMkWL.js";
+import { u as H, S as M } from "./useLevoForm-CR3q-L5Z.js";
+import { c as g } from "./cn-C9QoOYNG.js";
+import { B as y } from "./Spinner-CuUosd-S.js";
+const X = () => {
+  const [n, l] = A(0), { containerStyles: m } = N(), a = () => {
+    l((o) => o - 1);
+  }, s = () => {
+    l((o) => o + 1);
+  }, d = (o) => {
+    l(o);
+  };
+  return /* @__PURE__ */ t.jsx("div", { className: g("w-full", m), children: /* @__PURE__ */ t.jsx(
+    q,
+    {
+      currentSectionIndex: n,
+      handleNext: s,
+      handlePrev: a,
+      goToIndex: d
+    }
+  ) });
+}, q = ({ currentSectionIndex: n, handleNext: l, handlePrev: m, goToIndex: a }) => {
+  var f, j, h;
+  const { schema: s, isInternal: d, isDisabled: o, submitButtonConfig: i, uiConfig: c } = N(), r = v(
+    () => {
+      var e;
+      return (e = s == null ? void 0 : s.sections) == null ? void 0 : e[n];
+    },
+    [n]
+  ), F = v(() => {
+    if (s) {
+      const e = { ...s };
+      return r && e && (e.sections = [r]), e;
+    }
+    return null;
+  }, [r]), u = n === Number((f = s == null ? void 0 : s.sections) == null ? void 0 : f.length) - 1, {
+    methods: p,
+    handleSubmit: w,
+    isLoading: E,
+    handleContentId: L,
+    isError: P,
+    allFormValues: k
+  } = H({
+    schema: F,
+    saveToRemote: u,
+    onSubmit: () => {
+      l();
+    },
+    onSubmitSuccess: () => {
+      a(0);
+    },
+    onSubmitError: (e) => {
+      var S;
+      if (Array.isArray(e) && (e != null && e[0])) {
+        const R = e == null ? void 0 : e[0];
+        (S = s == null ? void 0 : s.sections) == null || S.forEach((x, V) => {
+          var b;
+          ((b = x == null ? void 0 : x.fields) == null ? void 0 : b.find((z) => z.key === R.param)) && a(V);
+        });
+      }
+    }
+  }), {
+    formState: { isSubmitting: D }
+  } = p;
+  return /* @__PURE__ */ t.jsxs(I, { ...p, children: [
+    /* @__PURE__ */ t.jsx(
+      M,
+      {
+        getContentId: (e) => L(e),
+        isError: P,
+        currentValues: k
+      }
+    ),
+    /* @__PURE__ */ t.jsxs(
+      "form",
+      {
+        className: g(
+          "w-full bg-white rounded-md border border-[rgb(229, 231, 235)] min-h-12 px-4 md:px-8 py-6",
+          E && "opacity-50 pointer-events-none"
+        ),
+        id: "collection-form",
+        onSubmit: w,
+        children: [
+          !(c != null && c.hideSectionHeadings) && /* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between mb-6", children: [
+            /* @__PURE__ */ t.jsx("p", { className: "text-xl font-medium", children: (r == null ? void 0 : r.label) || "Details" }),
+            /* @__PURE__ */ t.jsxs("p", { children: [
+              "Step ",
+              n + 1,
+              "/",
+              ((j = s == null ? void 0 : s.sections) == null ? void 0 : j.length) || 1
+            ] })
+          ] }),
+          /* @__PURE__ */ t.jsx("div", { className: "w-full flex flex-col gap-6", children: (h = r == null ? void 0 : r.fields) == null ? void 0 : h.map((e) => e && !e.hidden ? /* @__PURE__ */ t.jsx(
+            T,
+            {
+              field: e,
+              isInternal: d
+            },
+            e == null ? void 0 : e.key
+          ) : null) }),
+          /* @__PURE__ */ t.jsxs("div", { className: "flex mt-8 justify-between", children: [
+            n !== 0 ? /* @__PURE__ */ t.jsx(
+              y,
+              {
+                type: "button",
+                size: "sm",
+                onClick: () => {
+                  m();
+                },
+                children: "Prev"
+              }
+            ) : /* @__PURE__ */ t.jsx("div", {}),
+            /* @__PURE__ */ t.jsx(
+              y,
+              {
+                type: "submit",
+                loadingText: "Saving",
+                size: "sm",
+                isLoading: D,
+                disabled: o,
+                className: i == null ? void 0 : i.styles,
+                children: u ? (i == null ? void 0 : i.text) ?? "Save" : "Next"
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+};
+export {
+  X as default
+};

package/dist/SwitchWidget-C-p7lICr.js

@@ -0,0 +1,53 @@
+"use client";
+import { j as r } from "./jsx-runtime-B6kdoens.js";
+import { useController as k } from "react-hook-form";
+import { h as w, j, k as v } from "./CollectionFormBuilder-a0pzMkWL.js";
+import * as c from "@radix-ui/react-switch";
+import * as y from "react";
+import { c as d } from "./cn-C9QoOYNG.js";
+const m = y.forwardRef(({ className: e, ...t }, s) => /* @__PURE__ */ r.jsx(
+  c.Root,
+  {
+    className: d(
+      "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
+      e
+    ),
+    ...t,
+    ref: s,
+    children: /* @__PURE__ */ r.jsx(
+      c.Thumb,
+      {
+        className: d(
+          "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
+        )
+      }
+    )
+  }
+));
+m.displayName = c.Root.displayName;
+const C = ({ field: e }) => {
+  var l;
+  const { key: t = "", label: s = "", helper_text: u = "", readonly: h = !1 } = e, o = t, {
+    field: { value: p, onBlur: a, onChange: i, ...b },
+    fieldState: n
+  } = k({
+    name: o,
+    rules: w(e)
+  }), f = !!(e != null && e.required), x = (l = n == null ? void 0 : n.error) == null ? void 0 : l.message;
+  return /* @__PURE__ */ r.jsx(j, { error: x, helperText: u, readOnly: h, children: /* @__PURE__ */ r.jsxs("div", { className: "w-full flex items-center justify-between max-w-[300px]", children: [
+    s && /* @__PURE__ */ r.jsx(v, { htmlFor: o, isRequired: f, className: "!mb-0", children: s }),
+    /* @__PURE__ */ r.jsx(
+      m,
+      {
+        id: o,
+        checked: p,
+        onCheckedChange: (g) => i == null ? void 0 : i(g),
+        onBlur: () => a == null ? void 0 : a(),
+        ...b
+      }
+    )
+  ] }) });
+};
+export {
+  C as default
+};

package/dist/TextWidget-BtZp3DRk.js

@@ -0,0 +1,34 @@
+import { j as t } from "./jsx-runtime-B6kdoens.js";
+import * as g from "react";
+import { useFormContext as j, get as h } from "react-hook-form";
+import { j as F, k as b, l as f } from "./CollectionFormBuilder-a0pzMkWL.js";
+import { I as y } from "./Input-2CvZ90f8.js";
+import { c as R } from "./cn-C9QoOYNG.js";
+const T = ({
+  field: e,
+  inputStyles: a,
+  ...m
+}) => {
+  var o;
+  const {
+    register: n,
+    formState: { errors: i, disabled: c }
+  } = j(), { key: p = "", label: s = "", helper_text: l = "", readonly: x = !1 } = e, r = p, d = !!(e != null && e.required), u = (o = h(i, r)) == null ? void 0 : o.message;
+  return /* @__PURE__ */ t.jsxs(F, { error: u, helperText: l, children: [
+    s && /* @__PURE__ */ t.jsx(b, { htmlFor: r, isRequired: d, children: s }),
+    /* @__PURE__ */ t.jsx(
+      y,
+      {
+        id: r,
+        className: R(a),
+        readOnly: x,
+        disabled: c,
+        ...n(r, { ...f(e) }),
+        ...m
+      }
+    )
+  ] });
+}, E = g.memo(T);
+export {
+  E as default
+};

package/dist/TextareaWidget-D0TbFUjX.js

@@ -0,0 +1,30 @@
+import { j as s } from "./jsx-runtime-B6kdoens.js";
+import { useFormContext as u, get as x } from "react-hook-form";
+import { j as b, k as g, h } from "./CollectionFormBuilder-a0pzMkWL.js";
+import { c as f } from "./cn-C9QoOYNG.js";
+const w = ({ field: e }) => {
+  var a;
+  const {
+    register: i,
+    formState: { errors: n, disabled: l }
+  } = u(), { key: d = "", label: o = "", helper_text: m = "", readonly: t = !1 } = e, r = d, c = !!(e != null && e.required), p = (a = x(n, r)) == null ? void 0 : a.message;
+  return /* @__PURE__ */ s.jsxs(b, { error: p, helperText: m, children: [
+    o && /* @__PURE__ */ s.jsx(g, { htmlFor: r, isRequired: c, children: o }),
+    /* @__PURE__ */ s.jsx(
+      "textarea",
+      {
+        id: r,
+        className: f(
+          "flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+          t && "focus-visible:ring-0"
+        ),
+        readOnly: t,
+        disabled: l,
+        ...i(r, h(e))
+      }
+    )
+  ] });
+};
+export {
+  w as default
+};

package/dist/ToggleCheckboxWidget-BbVq_dAC.js

@@ -0,0 +1,44 @@
+"use client";
+import { j as r } from "./jsx-runtime-B6kdoens.js";
+import { useController as p } from "react-hook-form";
+import { h as u, j as g, k as j } from "./CollectionFormBuilder-a0pzMkWL.js";
+import { C } from "./Checbox-sq-atGlJ.js";
+const y = ({
+  field: e
+}) => {
+  const { key: l = "", label: o = "", helper_text: t = "", readonly: n = !1 } = e, {
+    field: { name: s, onBlur: i, onChange: m, ref: d, value: c, disabled: h },
+    fieldState: { error: a }
+  } = p({
+    name: l,
+    rules: u(e)
+  });
+  return /* @__PURE__ */ r.jsx(
+    g,
+    {
+      error: a == null ? void 0 : a.message,
+      helperText: t,
+      readOnly: n,
+      children: /* @__PURE__ */ r.jsxs("div", { className: "w-full flex gap-2 items-start flex-nowrap", ref: d, children: [
+        /* @__PURE__ */ r.jsx(
+          C,
+          {
+            id: s,
+            name: s,
+            checked: c,
+            onCheckedChange: (x) => m(x),
+            onBlur: () => {
+              i();
+            },
+            disabled: h
+          }
+        ),
+        o && /* @__PURE__ */ r.jsx(j, { htmlFor: s, isRequired: e == null ? void 0 : e.required, children: o })
+      ] })
+    }
+  );
+};
+export {
+  y as ToggleCheckboxWidget,
+  y as default
+};

package/dist/Tooltip-CI4i4mYr.js

@@ -0,0 +1,144 @@
+"use client";
+import { j as a } from "./jsx-runtime-B6kdoens.js";
+import * as s from "@radix-ui/react-dialog";
+import { X as N } from "lucide-react";
+import * as n from "react";
+import { c as l } from "./cn-C9QoOYNG.js";
+import * as d from "@radix-ui/react-tooltip";
+const j = s.Root, C = s.Trigger, y = s.Portal, m = n.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ a.jsx(
+  s.Overlay,
+  {
+    ref: o,
+    className: l(
+      "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      t
+    ),
+    ...e
+  }
+));
+m.displayName = s.Overlay.displayName;
+const c = n.forwardRef(({ className: t, children: e, hideCloseButton: o, ...i }, r) => /* @__PURE__ */ a.jsxs(y, { children: [
+  /* @__PURE__ */ a.jsx(m, {}),
+  /* @__PURE__ */ a.jsxs(
+    s.Content,
+    {
+      ref: r,
+      className: l(
+        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full",
+        t
+      ),
+      ...i,
+      children: [
+        e,
+        !o && /* @__PURE__ */ a.jsxs(s.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
+          /* @__PURE__ */ a.jsx(N, { className: "h-4 w-4" }),
+          /* @__PURE__ */ a.jsx("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+c.displayName = s.Content.displayName;
+const p = ({
+  className: t,
+  ...e
+}) => /* @__PURE__ */ a.jsx(
+  "div",
+  {
+    className: l(
+      "flex flex-col space-y-1.5 text-center sm:text-left",
+      t
+    ),
+    ...e
+  }
+);
+p.displayName = "DialogHeader";
+const h = ({
+  className: t,
+  ...e
+}) => /* @__PURE__ */ a.jsx(
+  "div",
+  {
+    className: l(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      t
+    ),
+    ...e
+  }
+);
+h.displayName = "DialogFooter";
+const f = n.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ a.jsx(
+  s.Title,
+  {
+    ref: o,
+    className: l(
+      "text-lg font-semibold leading-none tracking-tight",
+      t
+    ),
+    ...e
+  }
+));
+f.displayName = s.Title.displayName;
+const g = n.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ a.jsx(
+  s.Description,
+  {
+    ref: o,
+    className: l("text-sm text-muted-foreground", t),
+    ...e
+  }
+));
+g.displayName = s.Description.displayName;
+const R = ({
+  isOpen: t,
+  onClose: e,
+  children: o,
+  title: i,
+  contentClassName: r,
+  modal: u = !0
+}) => /* @__PURE__ */ a.jsx(j, { open: t, onOpenChange: e, modal: u, children: /* @__PURE__ */ a.jsxs(c, { className: r, children: [
+  i && /* @__PURE__ */ a.jsxs(p, { className: "flex-1 font-medium", children: [
+    /* @__PURE__ */ a.jsx(f, { children: i }),
+    /* @__PURE__ */ a.jsx(g, {})
+  ] }),
+  /* @__PURE__ */ a.jsx("div", { className: "w-full", children: o })
+] }) }), P = d.Provider, D = d.Root, b = d.Trigger, z = d.Portal, x = n.forwardRef(({ className: t, sideOffset: e = 4, ...o }, i) => /* @__PURE__ */ a.jsx(
+  d.Content,
+  {
+    ref: i,
+    sideOffset: e,
+    className: l(
+      "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      t
+    ),
+    ...o
+  }
+));
+x.displayName = d.Content.displayName;
+const k = ({
+  children: t,
+  label: e,
+  labelClassName: o,
+  contentClassName: i,
+  asChild: r = !0
+}) => /* @__PURE__ */ a.jsxs(D, { children: [
+  e && /* @__PURE__ */ a.jsx(x, { className: o, children: /* @__PURE__ */ a.jsx("p", { className: i, children: e }) }),
+  /* @__PURE__ */ a.jsx(b, { asChild: r, children: t })
+] });
+export {
+  j as D,
+  k as S,
+  D as T,
+  y as a,
+  m as b,
+  C as c,
+  c as d,
+  p as e,
+  h as f,
+  f as g,
+  g as h,
+  R as i,
+  b as j,
+  x as k,
+  P as l,
+  z as m
+};

package/dist/URLWidget-00u8Svwt.js

@@ -0,0 +1,14 @@
+import { j as e } from "./jsx-runtime-B6kdoens.js";
+import { H as s } from "./CollectionFormBuilder-a0pzMkWL.js";
+import r from "./TextWidget-BtZp3DRk.js";
+const a = (t) => /* @__PURE__ */ e.jsx(
+  r,
+  {
+    leftIcon: /* @__PURE__ */ e.jsx("div", { className: "w-full h-full flex items-center justify-center bg-muted", children: /* @__PURE__ */ e.jsx(s, { size: "20px", className: "text-muted-foreground" }) }),
+    ...t
+  }
+);
+export {
+  a as URLWidget,
+  a as default
+};