@arcadeai/design-system 0.0.0

package/dist/components/ui/atoms/form.d.ts

@@ -0,0 +1,24 @@
+import { Slot } from '@radix-ui/react-slot';
+import { ControllerProps, FieldPath, FieldValues } from 'react-hook-form';
+import type * as LabelPrimitive from '@radix-ui/react-label';
+import * as React from 'react';
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: import('react-hook-form').FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
+declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => import("react/jsx-runtime").JSX.Element;
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: import('react-hook-form').FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+declare function FormItem({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function FormLabel({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function FormControl({ ...props }: React.ComponentProps<typeof Slot>): import("react/jsx-runtime").JSX.Element;
+declare function FormDescription({ className, ...props }: React.ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element;
+declare function FormMessage({ className, ...props }: React.ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element | null;
+export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, };

package/dist/components/ui/atoms/form.js

@@ -0,0 +1,297 @@
+import { jsx as m } from "react/jsx-runtime";
+import { S as W } from "../../../index-CB1Wkg0G.js";
+import * as y from "react";
+import i from "react";
+import { Label as G } from "./label.js";
+import { c as p } from "../../../utils-Dy2WjYNJ.js";
+var j = (e) => e.type === "checkbox", K = (e) => e instanceof Date, O = (e) => e == null;
+const q = (e) => typeof e == "object";
+var b = (e) => !O(e) && !Array.isArray(e) && q(e) && !K(e), z = (e) => b(e) && e.target ? j(e.target) ? e.target.checked : e.target.value : e, J = (e) => e.substring(0, e.search(/\.\d+(\.|$)/)) || e, Q = (e, o) => e.has(J(o)), X = (e) => {
+  const o = e.constructor && e.constructor.prototype;
+  return b(o) && o.hasOwnProperty("isPrototypeOf");
+}, Y = typeof window < "u" && typeof window.HTMLElement < "u" && typeof document < "u";
+function L(e) {
+  let o;
+  const t = Array.isArray(e), s = typeof FileList < "u" ? e instanceof FileList : !1;
+  if (e instanceof Date)
+    o = new Date(e);
+  else if (e instanceof Set)
+    o = new Set(e);
+  else if (!(Y && (e instanceof Blob || s)) && (t || b(e)))
+    if (o = t ? [] : {}, !t && !X(e))
+      o = e;
+    else
+      for (const r in e)
+        e.hasOwnProperty(r) && (o[r] = L(e[r]));
+  else
+    return e;
+  return o;
+}
+var M = (e) => /^\w*$/.test(e), V = (e) => e === void 0, Z = (e) => Array.isArray(e) ? e.filter(Boolean) : [], B = (e) => Z(e.replace(/["|']|\]/g, "").split(/\.|\[/)), c = (e, o, t) => {
+  if (!o || !b(e))
+    return t;
+  const s = (M(o) ? [o] : B(o)).reduce((r, n) => O(r) ? r : r[n], e);
+  return V(s) || s === e ? V(e[o]) ? t : e[o] : s;
+}, C = (e) => typeof e == "boolean", P = (e, o, t) => {
+  let s = -1;
+  const r = M(o) ? [o] : B(o), n = r.length, l = n - 1;
+  for (; ++s < n; ) {
+    const u = r[s];
+    let a = t;
+    if (s !== l) {
+      const f = e[u];
+      a = b(f) || Array.isArray(f) ? f : isNaN(+r[s + 1]) ? {} : [];
+    }
+    if (u === "__proto__" || u === "constructor" || u === "prototype")
+      return;
+    e[u] = a, e = e[u];
+  }
+};
+const k = {
+  BLUR: "blur",
+  CHANGE: "change"
+}, D = {
+  all: "all"
+}, S = i.createContext(null);
+S.displayName = "HookFormContext";
+const v = () => i.useContext(S), ee = (e) => {
+  const { children: o, ...t } = e;
+  return i.createElement(S.Provider, { value: t }, o);
+};
+var te = (e, o, t, s = !0) => {
+  const r = {
+    defaultValues: o._defaultValues
+  };
+  for (const n in e)
+    Object.defineProperty(r, n, {
+      get: () => {
+        const l = n;
+        return o._proxyFormState[l] !== D.all && (o._proxyFormState[l] = !s || D.all), t && (t[l] = !0), e[l];
+      }
+    });
+  return r;
+};
+const R = typeof window < "u" ? y.useLayoutEffect : y.useEffect;
+function U(e) {
+  const o = v(), { control: t = o.control, disabled: s, name: r, exact: n } = e || {}, [l, u] = i.useState(t._formState), a = i.useRef({
+    isDirty: !1,
+    isLoading: !1,
+    dirtyFields: !1,
+    touchedFields: !1,
+    validatingFields: !1,
+    isValidating: !1,
+    isValid: !1,
+    errors: !1
+  });
+  return R(() => t._subscribe({
+    name: r,
+    formState: a.current,
+    exact: n,
+    callback: (f) => {
+      !s && u({
+        ...t._formState,
+        ...f
+      });
+    }
+  }), [r, s, n]), i.useEffect(() => {
+    a.current.isValid && t._setValid(!0);
+  }, [t]), i.useMemo(() => te(l, t, a.current, !1), [l, t]);
+}
+var re = (e) => typeof e == "string", oe = (e, o, t, s, r) => re(e) ? c(t, e, r) : Array.isArray(e) ? e.map((n) => c(t, n)) : t;
+function se(e) {
+  const o = v(), { control: t = o.control, name: s, defaultValue: r, disabled: n, exact: l } = e || {}, u = i.useRef(r), [a, f] = i.useState(t._getWatch(s, u.current));
+  return R(() => t._subscribe({
+    name: s,
+    formState: {
+      values: !0
+    },
+    exact: l,
+    callback: (F) => !n && f(oe(s, t._names, F.values || t._formValues, !1, u.current))
+  }), [s, t, n, l]), i.useEffect(() => t._removeUnmounted()), a;
+}
+function ne(e) {
+  const o = v(), { name: t, disabled: s, control: r = o.control, shouldUnregister: n } = e, l = Q(r._names.array, t), u = se({
+    control: r,
+    name: t,
+    defaultValue: c(r._formValues, t, c(r._defaultValues, t, e.defaultValue)),
+    exact: !0
+  }), a = U({
+    control: r,
+    name: t,
+    exact: !0
+  }), f = i.useRef(e), F = i.useRef(r.register(t, {
+    ...e.rules,
+    value: u,
+    ...C(e.disabled) ? { disabled: e.disabled } : {}
+  })), I = i.useMemo(() => Object.defineProperties({}, {
+    invalid: {
+      enumerable: !0,
+      get: () => !!c(a.errors, t)
+    },
+    isDirty: {
+      enumerable: !0,
+      get: () => !!c(a.dirtyFields, t)
+    },
+    isTouched: {
+      enumerable: !0,
+      get: () => !!c(a.touchedFields, t)
+    },
+    isValidating: {
+      enumerable: !0,
+      get: () => !!c(a.validatingFields, t)
+    },
+    error: {
+      enumerable: !0,
+      get: () => c(a.errors, t)
+    }
+  }), [a, t]), A = i.useCallback((d) => F.current.onChange({
+    target: {
+      value: z(d),
+      name: t
+    },
+    type: k.CHANGE
+  }), [t]), w = i.useCallback(() => F.current.onBlur({
+    target: {
+      value: c(r._formValues, t),
+      name: t
+    },
+    type: k.BLUR
+  }), [t, r._formValues]), E = i.useCallback((d) => {
+    const _ = c(r._fields, t);
+    _ && d && (_._f.ref = {
+      focus: () => d.focus && d.focus(),
+      select: () => d.select && d.select(),
+      setCustomValidity: (g) => d.setCustomValidity(g),
+      reportValidity: () => d.reportValidity()
+    });
+  }, [r._fields, t]), N = i.useMemo(() => ({
+    name: t,
+    value: u,
+    ...C(s) || a.disabled ? { disabled: a.disabled || s } : {},
+    onChange: A,
+    onBlur: w,
+    ref: E
+  }), [t, s, a.disabled, A, w, E, u]);
+  return i.useEffect(() => {
+    const d = r._options.shouldUnregister || n;
+    r.register(t, {
+      ...f.current.rules,
+      ...C(f.current.disabled) ? { disabled: f.current.disabled } : {}
+    });
+    const _ = (g, H) => {
+      const h = c(r._fields, g);
+      h && h._f && (h._f.mount = H);
+    };
+    if (_(t, !0), d) {
+      const g = L(c(r._options.defaultValues, t));
+      P(r._defaultValues, t, g), V(c(r._formValues, t)) && P(r._formValues, t, g);
+    }
+    return !l && r.register(t), () => {
+      (l ? d && !r._state.action : d) ? r.unregister(t) : _(t, !1);
+    };
+  }, [t, r, l, n]), i.useEffect(() => {
+    r._setDisabledField({
+      disabled: s,
+      name: t
+    });
+  }, [s, t, r]), i.useMemo(() => ({
+    field: N,
+    formState: a,
+    fieldState: I
+  }), [N, a, I]);
+}
+const ae = (e) => e.render(ne(e)), fe = ee, $ = y.createContext(
+  {}
+), me = ({
+  ...e
+}) => /* @__PURE__ */ m($.Provider, { value: { name: e.name }, children: /* @__PURE__ */ m(ae, { ...e }) }), x = () => {
+  const e = y.useContext($), o = y.useContext(T), { getFieldState: t } = v(), s = U({ name: e.name }), r = t(e.name, s);
+  if (!e)
+    throw new Error("useFormField should be used within <FormField>");
+  const { id: n } = o;
+  return {
+    id: n,
+    name: e.name,
+    formItemId: `${n}-form-item`,
+    formDescriptionId: `${n}-form-item-description`,
+    formMessageId: `${n}-form-item-message`,
+    ...r
+  };
+}, T = y.createContext(
+  {}
+);
+function ye({ className: e, ...o }) {
+  const t = y.useId();
+  return /* @__PURE__ */ m(T.Provider, { value: { id: t }, children: /* @__PURE__ */ m(
+    "div",
+    {
+      className: p("grid gap-2", e),
+      "data-slot": "form-item",
+      ...o
+    }
+  ) });
+}
+function ge({
+  className: e,
+  ...o
+}) {
+  const { error: t, formItemId: s } = x();
+  return /* @__PURE__ */ m(
+    G,
+    {
+      className: p("data-[error=true]:text-destructive", e),
+      "data-error": !!t,
+      "data-slot": "form-label",
+      htmlFor: s,
+      ...o
+    }
+  );
+}
+function _e({ ...e }) {
+  const { error: o, formItemId: t, formDescriptionId: s, formMessageId: r } = x();
+  return /* @__PURE__ */ m(
+    W,
+    {
+      "aria-describedby": o ? `${s} ${r}` : `${s}`,
+      "aria-invalid": !!o,
+      "data-slot": "form-control",
+      id: t,
+      ...e
+    }
+  );
+}
+function be({ className: e, ...o }) {
+  const { formDescriptionId: t } = x();
+  return /* @__PURE__ */ m(
+    "p",
+    {
+      className: p("text-muted-foreground text-sm", e),
+      "data-slot": "form-description",
+      id: t,
+      ...o
+    }
+  );
+}
+function Fe({ className: e, ...o }) {
+  const { error: t, formMessageId: s } = x(), r = t ? String((t == null ? void 0 : t.message) ?? "") : o.children;
+  return r ? /* @__PURE__ */ m(
+    "p",
+    {
+      className: p("text-destructive text-sm", e),
+      "data-slot": "form-message",
+      id: s,
+      ...o,
+      children: r
+    }
+  ) : null;
+}
+export {
+  fe as Form,
+  _e as FormControl,
+  be as FormDescription,
+  me as FormField,
+  ye as FormItem,
+  ge as FormLabel,
+  Fe as FormMessage,
+  x as useFormField
+};

package/dist/components/ui/atoms/hover-card.d.ts

@@ -0,0 +1,6 @@
+import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
+import type * as React from 'react';
+declare function HoverCard({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function HoverCardTrigger({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function HoverCardContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof HoverCardPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+export { HoverCard, HoverCardTrigger, HoverCardContent };

package/dist/components/ui/atoms/hover-card.js

@@ -0,0 +1,211 @@
+import { jsx as a } from "react/jsx-runtime";
+import * as n from "react";
+import { c as l } from "../../../index-DLeNytVF.js";
+import { c as k } from "../../../index-UFb2E87s.js";
+import { u as F } from "../../../index-DYfkNB0n.js";
+import { u as I } from "../../../index-CB1Wkg0G.js";
+import { c as T, R as U, A as $, C as W, a as z } from "../../../index-Dy7YuPrV.js";
+import { P as B, D as G } from "../../../index-QMp1pYFl.js";
+import { P as O } from "../../../index-p7nYL7BU.js";
+import { P as K } from "../../../index-C9KW2H79.js";
+import { c as j } from "../../../utils-Dy2WjYNJ.js";
+var E, b = "HoverCard", [_, ve] = k(b, [
+  T
+]), w = T(), [V, x] = _(b), y = (e) => {
+  const {
+    __scopeHoverCard: o,
+    children: t,
+    open: s,
+    defaultOpen: i,
+    onOpenChange: c,
+    openDelay: f = 700,
+    closeDelay: v = 300
+  } = e, d = w(o), m = n.useRef(0), u = n.useRef(0), C = n.useRef(!1), p = n.useRef(!1), [h, r] = F({
+    prop: s,
+    defaultProp: i ?? !1,
+    onChange: c,
+    caller: b
+  }), P = n.useCallback(() => {
+    clearTimeout(u.current), m.current = window.setTimeout(() => r(!0), f);
+  }, [f, r]), g = n.useCallback(() => {
+    clearTimeout(m.current), !C.current && !p.current && (u.current = window.setTimeout(() => r(!1), v));
+  }, [v, r]), M = n.useCallback(() => r(!1), [r]);
+  return n.useEffect(() => () => {
+    clearTimeout(m.current), clearTimeout(u.current);
+  }, []), /* @__PURE__ */ a(
+    V,
+    {
+      scope: o,
+      open: h,
+      onOpenChange: r,
+      onOpen: P,
+      onClose: g,
+      onDismiss: M,
+      hasSelectionRef: C,
+      isPointerDownOnContentRef: p,
+      children: /* @__PURE__ */ a(U, { ...d, children: t })
+    }
+  );
+};
+y.displayName = b;
+var N = "HoverCardTrigger", D = n.forwardRef(
+  (e, o) => {
+    const { __scopeHoverCard: t, ...s } = e, i = x(N, t), c = w(t);
+    return /* @__PURE__ */ a($, { asChild: !0, ...c, children: /* @__PURE__ */ a(
+      K.a,
+      {
+        "data-state": i.open ? "open" : "closed",
+        ...s,
+        ref: o,
+        onPointerEnter: l(e.onPointerEnter, S(i.onOpen)),
+        onPointerLeave: l(e.onPointerLeave, S(i.onClose)),
+        onFocus: l(e.onFocus, i.onOpen),
+        onBlur: l(e.onBlur, i.onClose),
+        onTouchStart: l(e.onTouchStart, (f) => f.preventDefault())
+      }
+    ) });
+  }
+);
+D.displayName = N;
+var H = "HoverCardPortal", [q, J] = _(H, {
+  forceMount: void 0
+}), A = (e) => {
+  const { __scopeHoverCard: o, forceMount: t, children: s, container: i } = e, c = x(H, o);
+  return /* @__PURE__ */ a(q, { scope: o, forceMount: t, children: /* @__PURE__ */ a(O, { present: t || c.open, children: /* @__PURE__ */ a(B, { asChild: !0, container: i, children: s }) }) });
+};
+A.displayName = H;
+var R = "HoverCardContent", L = n.forwardRef(
+  (e, o) => {
+    const t = J(R, e.__scopeHoverCard), { forceMount: s = t.forceMount, ...i } = e, c = x(R, e.__scopeHoverCard);
+    return /* @__PURE__ */ a(O, { present: s || c.open, children: /* @__PURE__ */ a(
+      Q,
+      {
+        "data-state": c.open ? "open" : "closed",
+        ...i,
+        onPointerEnter: l(e.onPointerEnter, S(c.onOpen)),
+        onPointerLeave: l(e.onPointerLeave, S(c.onClose)),
+        ref: o
+      }
+    ) });
+  }
+);
+L.displayName = R;
+var Q = n.forwardRef((e, o) => {
+  const {
+    __scopeHoverCard: t,
+    onEscapeKeyDown: s,
+    onPointerDownOutside: i,
+    onFocusOutside: c,
+    onInteractOutside: f,
+    ...v
+  } = e, d = x(R, t), m = w(t), u = n.useRef(null), C = I(o, u), [p, h] = n.useState(!1);
+  return n.useEffect(() => {
+    if (p) {
+      const r = document.body;
+      return E = r.style.userSelect || r.style.webkitUserSelect, r.style.userSelect = "none", r.style.webkitUserSelect = "none", () => {
+        r.style.userSelect = E, r.style.webkitUserSelect = E;
+      };
+    }
+  }, [p]), n.useEffect(() => {
+    if (u.current) {
+      const r = () => {
+        h(!1), d.isPointerDownOnContentRef.current = !1, setTimeout(() => {
+          var g;
+          ((g = document.getSelection()) == null ? void 0 : g.toString()) !== "" && (d.hasSelectionRef.current = !0);
+        });
+      };
+      return document.addEventListener("pointerup", r), () => {
+        document.removeEventListener("pointerup", r), d.hasSelectionRef.current = !1, d.isPointerDownOnContentRef.current = !1;
+      };
+    }
+  }, [d.isPointerDownOnContentRef, d.hasSelectionRef]), n.useEffect(() => {
+    u.current && Z(u.current).forEach((P) => P.setAttribute("tabindex", "-1"));
+  }), /* @__PURE__ */ a(
+    G,
+    {
+      asChild: !0,
+      disableOutsidePointerEvents: !1,
+      onInteractOutside: f,
+      onEscapeKeyDown: s,
+      onPointerDownOutside: i,
+      onFocusOutside: l(c, (r) => {
+        r.preventDefault();
+      }),
+      onDismiss: d.onDismiss,
+      children: /* @__PURE__ */ a(
+        W,
+        {
+          ...m,
+          ...v,
+          onPointerDown: l(v.onPointerDown, (r) => {
+            r.currentTarget.contains(r.target) && h(!0), d.hasSelectionRef.current = !1, d.isPointerDownOnContentRef.current = !0;
+          }),
+          ref: C,
+          style: {
+            ...v.style,
+            userSelect: p ? "text" : void 0,
+            // Safari requires prefix
+            WebkitUserSelect: p ? "text" : void 0,
+            "--radix-hover-card-content-transform-origin": "var(--radix-popper-transform-origin)",
+            "--radix-hover-card-content-available-width": "var(--radix-popper-available-width)",
+            "--radix-hover-card-content-available-height": "var(--radix-popper-available-height)",
+            "--radix-hover-card-trigger-width": "var(--radix-popper-anchor-width)",
+            "--radix-hover-card-trigger-height": "var(--radix-popper-anchor-height)"
+          }
+        }
+      )
+    }
+  );
+}), X = "HoverCardArrow", Y = n.forwardRef(
+  (e, o) => {
+    const { __scopeHoverCard: t, ...s } = e, i = w(t);
+    return /* @__PURE__ */ a(z, { ...i, ...s, ref: o });
+  }
+);
+Y.displayName = X;
+function S(e) {
+  return (o) => o.pointerType === "touch" ? void 0 : e();
+}
+function Z(e) {
+  const o = [], t = document.createTreeWalker(e, NodeFilter.SHOW_ELEMENT, {
+    acceptNode: (s) => s.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP
+  });
+  for (; t.nextNode(); ) o.push(t.currentNode);
+  return o;
+}
+var ee = y, re = D, oe = A, te = L;
+function me({
+  ...e
+}) {
+  return /* @__PURE__ */ a(ee, { "data-slot": "hover-card", ...e });
+}
+function Ce({
+  ...e
+}) {
+  return /* @__PURE__ */ a(re, { "data-slot": "hover-card-trigger", ...e });
+}
+function he({
+  className: e,
+  align: o = "center",
+  sideOffset: t = 4,
+  ...s
+}) {
+  return /* @__PURE__ */ a(oe, { "data-slot": "hover-card-portal", children: /* @__PURE__ */ a(
+    te,
+    {
+      align: o,
+      className: j(
+        "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-[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 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[state=closed]:animate-out data-[state=open]:animate-in",
+        e
+      ),
+      "data-slot": "hover-card-content",
+      sideOffset: t,
+      ...s
+    }
+  ) });
+}
+export {
+  me as HoverCard,
+  he as HoverCardContent,
+  Ce as HoverCardTrigger
+};

package/dist/components/ui/atoms/index.d.ts

@@ -0,0 +1,33 @@
+export * from './accordion';
+export * from './alert';
+export * from './avatar';
+export * from './badge';
+export * from './breadcrumb';
+export * from './button';
+export * from './card';
+export * from './chart';
+export * from './collapsible';
+export * from './command';
+export * from './dialog';
+export * from './dropdown-menu';
+export * from './form';
+export * from './hover-card';
+export * from './input';
+export * from './label';
+export * from './popover';
+export * from './progress';
+export * from './resizable';
+export * from './scroll-area';
+export * from './select';
+export * from './separator';
+export * from './sheet';
+export * from './sidebar';
+export * from './skeleton';
+export * from './slider';
+export * from './sonner';
+export * from './switch';
+export * from './table';
+export * from './tabs';
+export * from './textarea';
+export * from './toggle';
+export * from './tooltip';