@arcadeai/design-system 0.0.0

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

@@ -0,0 +1,4 @@
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+import type * as React from 'react';
+declare function Switch({ className, ...props }: React.ComponentProps<typeof SwitchPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+export { Switch };

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

@@ -0,0 +1,155 @@
+import { jsxs as I, jsx as i } from "react/jsx-runtime";
+import * as a from "react";
+import { c as M } from "../../../index-DLeNytVF.js";
+import { u as x } from "../../../index-CB1Wkg0G.js";
+import { c as H } from "../../../index-UFb2E87s.js";
+import { u as j } from "../../../index-DYfkNB0n.js";
+import { u as z } from "../../../index-BZPx6jYI.js";
+import { u as A } from "../../../index-CHDs-SiB.js";
+import { P as y } from "../../../index-C9KW2H79.js";
+import { c as C } from "../../../utils-Dy2WjYNJ.js";
+var m = "Switch", [U, Z] = H(m), [q, L] = U(m), P = a.forwardRef(
+  (e, r) => {
+    const {
+      __scopeSwitch: t,
+      name: s,
+      checked: o,
+      defaultChecked: b,
+      required: d,
+      disabled: n,
+      value: u = "on",
+      onCheckedChange: w,
+      form: c,
+      ...k
+    } = e, [l, p] = a.useState(null), v = x(r, (h) => p(h)), S = a.useRef(!1), g = l ? c || !!l.closest("form") : !0, [f, B] = j({
+      prop: o,
+      defaultProp: b ?? !1,
+      onChange: w,
+      caller: m
+    });
+    return /* @__PURE__ */ I(q, { scope: t, checked: f, disabled: n, children: [
+      /* @__PURE__ */ i(
+        y.button,
+        {
+          type: "button",
+          role: "switch",
+          "aria-checked": f,
+          "aria-required": d,
+          "data-state": N(f),
+          "data-disabled": n ? "" : void 0,
+          disabled: n,
+          value: u,
+          ...k,
+          ref: v,
+          onClick: M(e.onClick, (h) => {
+            B((T) => !T), g && (S.current = h.isPropagationStopped(), S.current || h.stopPropagation());
+          })
+        }
+      ),
+      g && /* @__PURE__ */ i(
+        _,
+        {
+          control: l,
+          bubbles: !S.current,
+          name: s,
+          value: u,
+          checked: f,
+          required: d,
+          disabled: n,
+          form: c,
+          style: { transform: "translateX(-100%)" }
+        }
+      )
+    ] });
+  }
+);
+P.displayName = m;
+var R = "SwitchThumb", E = a.forwardRef(
+  (e, r) => {
+    const { __scopeSwitch: t, ...s } = e, o = L(R, t);
+    return /* @__PURE__ */ i(
+      y.span,
+      {
+        "data-state": N(o.checked),
+        "data-disabled": o.disabled ? "" : void 0,
+        ...s,
+        ref: r
+      }
+    );
+  }
+);
+E.displayName = R;
+var O = "SwitchBubbleInput", _ = a.forwardRef(
+  ({
+    __scopeSwitch: e,
+    control: r,
+    checked: t,
+    bubbles: s = !0,
+    ...o
+  }, b) => {
+    const d = a.useRef(null), n = x(d, b), u = z(t), w = A(r);
+    return a.useEffect(() => {
+      const c = d.current;
+      if (!c) return;
+      const k = window.HTMLInputElement.prototype, p = Object.getOwnPropertyDescriptor(
+        k,
+        "checked"
+      ).set;
+      if (u !== t && p) {
+        const v = new Event("click", { bubbles: s });
+        p.call(c, t), c.dispatchEvent(v);
+      }
+    }, [u, t, s]), /* @__PURE__ */ i(
+      "input",
+      {
+        type: "checkbox",
+        "aria-hidden": !0,
+        defaultChecked: t,
+        ...o,
+        tabIndex: -1,
+        ref: n,
+        style: {
+          ...o.style,
+          ...w,
+          position: "absolute",
+          pointerEvents: "none",
+          opacity: 0,
+          margin: 0
+        }
+      }
+    );
+  }
+);
+_.displayName = O;
+function N(e) {
+  return e ? "checked" : "unchecked";
+}
+var D = P, F = E;
+function ee({
+  className: e,
+  ...r
+}) {
+  return /* @__PURE__ */ i(
+    D,
+    {
+      className: C(
+        "peer inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs outline-none transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input dark:data-[state=unchecked]:bg-input/80",
+        e
+      ),
+      "data-slot": "switch",
+      ...r,
+      children: /* @__PURE__ */ i(
+        F,
+        {
+          className: C(
+            "pointer-events-none block size-4 rounded-full bg-background ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0 dark:data-[state=checked]:bg-primary-foreground dark:data-[state=unchecked]:bg-foreground"
+          ),
+          "data-slot": "switch-thumb"
+        }
+      )
+    }
+  );
+}
+export {
+  ee as Switch
+};

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

@@ -0,0 +1,10 @@
+import type * as React from 'react';
+declare function Table({ className, ...props }: React.ComponentProps<'table'>): import("react/jsx-runtime").JSX.Element;
+declare function TableHeader({ className, ...props }: React.ComponentProps<'thead'>): import("react/jsx-runtime").JSX.Element;
+declare function TableBody({ className, ...props }: React.ComponentProps<'tbody'>): import("react/jsx-runtime").JSX.Element;
+declare function TableFooter({ className, ...props }: React.ComponentProps<'tfoot'>): import("react/jsx-runtime").JSX.Element;
+declare function TableRow({ className, ...props }: React.ComponentProps<'tr'>): import("react/jsx-runtime").JSX.Element;
+declare function TableHead({ className, ...props }: React.ComponentProps<'th'>): import("react/jsx-runtime").JSX.Element;
+declare function TableCell({ className, ...props }: React.ComponentProps<'td'>): import("react/jsx-runtime").JSX.Element;
+declare function TableCaption({ className, ...props }: React.ComponentProps<'caption'>): import("react/jsx-runtime").JSX.Element;
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, };

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

@@ -0,0 +1,114 @@
+import { jsx as a } from "react/jsx-runtime";
+import { c as o } from "../../../utils-Dy2WjYNJ.js";
+function n({ className: t, ...e }) {
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      className: "relative w-full overflow-x-auto",
+      "data-slot": "table-container",
+      children: /* @__PURE__ */ a(
+        "table",
+        {
+          className: o("w-full caption-bottom text-sm", t),
+          "data-slot": "table",
+          ...e
+        }
+      )
+    }
+  );
+}
+function s({ className: t, ...e }) {
+  return /* @__PURE__ */ a(
+    "thead",
+    {
+      className: o("[&_tr]:border-b", t),
+      "data-slot": "table-header",
+      ...e
+    }
+  );
+}
+function d({ className: t, ...e }) {
+  return /* @__PURE__ */ a(
+    "tbody",
+    {
+      className: o("[&_tr:last-child]:border-0", t),
+      "data-slot": "table-body",
+      ...e
+    }
+  );
+}
+function c({ className: t, ...e }) {
+  return /* @__PURE__ */ a(
+    "tfoot",
+    {
+      className: o(
+        "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
+        t
+      ),
+      "data-slot": "table-footer",
+      ...e
+    }
+  );
+}
+function b({ className: t, ...e }) {
+  return /* @__PURE__ */ a(
+    "tr",
+    {
+      className: o(
+        "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
+        t
+      ),
+      "data-slot": "table-row",
+      ...e
+    }
+  );
+}
+function i({ className: t, ...e }) {
+  return /* @__PURE__ */ a(
+    "th",
+    {
+      className: o(
+        "h-10 whitespace-nowrap px-2 text-left align-middle font-medium text-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        t
+      ),
+      "data-slot": "table-head",
+      ...e
+    }
+  );
+}
+function m({ className: t, ...e }) {
+  return /* @__PURE__ */ a(
+    "td",
+    {
+      className: o(
+        "whitespace-nowrap p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        t
+      ),
+      "data-slot": "table-cell",
+      ...e
+    }
+  );
+}
+function u({
+  className: t,
+  ...e
+}) {
+  return /* @__PURE__ */ a(
+    "caption",
+    {
+      className: o("mt-4 text-muted-foreground text-sm", t),
+      "data-slot": "table-caption",
+      ...e
+    }
+  );
+}
+export {
+  n as Table,
+  d as TableBody,
+  u as TableCaption,
+  m as TableCell,
+  c as TableFooter,
+  i as TableHead,
+  s as TableHeader,
+  b as TableRow
+};

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

@@ -0,0 +1,7 @@
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import type * as React from 'react';
+declare function Tabs({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function TabsList({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.List>): import("react/jsx-runtime").JSX.Element;
+declare function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+export { Tabs, TabsList, TabsTrigger, TabsContent };

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

@@ -0,0 +1,218 @@
+import { jsx as n } from "react/jsx-runtime";
+import * as f from "react";
+import { c as T } from "../../../index-DLeNytVF.js";
+import { c as M } from "../../../index-UFb2E87s.js";
+import { c as h, R as k, I as E } from "../../../index-D2uXV4lz.js";
+import { P as F } from "../../../index-p7nYL7BU.js";
+import { P as m } from "../../../index-C9KW2H79.js";
+import { u as $ } from "../../../index-ByaXH_ih.js";
+import { u as D } from "../../../index-DYfkNB0n.js";
+import { u as V } from "../../../index-umR1UobZ.js";
+import { c as p } from "../../../utils-Dy2WjYNJ.js";
+var g = "Tabs", [G, ee] = M(g, [
+  h
+]), C = h(), [L, x] = G(g), I = f.forwardRef(
+  (e, t) => {
+    const {
+      __scopeTabs: c,
+      value: a,
+      onValueChange: i,
+      defaultValue: d,
+      orientation: o = "horizontal",
+      dir: u,
+      activationMode: b = "automatic",
+      ...v
+    } = e, s = $(u), [r, l] = D({
+      prop: a,
+      onChange: i,
+      defaultProp: d ?? "",
+      caller: g
+    });
+    return /* @__PURE__ */ n(
+      L,
+      {
+        scope: c,
+        baseId: V(),
+        value: r,
+        onValueChange: l,
+        orientation: o,
+        dir: s,
+        activationMode: b,
+        children: /* @__PURE__ */ n(
+          m.div,
+          {
+            dir: s,
+            "data-orientation": o,
+            ...v,
+            ref: t
+          }
+        )
+      }
+    );
+  }
+);
+I.displayName = g;
+var y = "TabsList", _ = f.forwardRef(
+  (e, t) => {
+    const { __scopeTabs: c, loop: a = !0, ...i } = e, d = x(y, c), o = C(c);
+    return /* @__PURE__ */ n(
+      k,
+      {
+        asChild: !0,
+        ...o,
+        orientation: d.orientation,
+        dir: d.dir,
+        loop: a,
+        children: /* @__PURE__ */ n(
+          m.div,
+          {
+            role: "tablist",
+            "aria-orientation": d.orientation,
+            ...i,
+            ref: t
+          }
+        )
+      }
+    );
+  }
+);
+_.displayName = y;
+var N = "TabsTrigger", R = f.forwardRef(
+  (e, t) => {
+    const { __scopeTabs: c, value: a, disabled: i = !1, ...d } = e, o = x(N, c), u = C(c), b = P(o.baseId, a), v = S(o.baseId, a), s = a === o.value;
+    return /* @__PURE__ */ n(
+      E,
+      {
+        asChild: !0,
+        ...u,
+        focusable: !i,
+        active: s,
+        children: /* @__PURE__ */ n(
+          m.button,
+          {
+            type: "button",
+            role: "tab",
+            "aria-selected": s,
+            "aria-controls": v,
+            "data-state": s ? "active" : "inactive",
+            "data-disabled": i ? "" : void 0,
+            disabled: i,
+            id: b,
+            ...d,
+            ref: t,
+            onMouseDown: T(e.onMouseDown, (r) => {
+              !i && r.button === 0 && r.ctrlKey === !1 ? o.onValueChange(a) : r.preventDefault();
+            }),
+            onKeyDown: T(e.onKeyDown, (r) => {
+              [" ", "Enter"].includes(r.key) && o.onValueChange(a);
+            }),
+            onFocus: T(e.onFocus, () => {
+              const r = o.activationMode !== "manual";
+              !s && !i && r && o.onValueChange(a);
+            })
+          }
+        )
+      }
+    );
+  }
+);
+R.displayName = N;
+var w = "TabsContent", A = f.forwardRef(
+  (e, t) => {
+    const { __scopeTabs: c, value: a, forceMount: i, children: d, ...o } = e, u = x(w, c), b = P(u.baseId, a), v = S(u.baseId, a), s = a === u.value, r = f.useRef(s);
+    return f.useEffect(() => {
+      const l = requestAnimationFrame(() => r.current = !1);
+      return () => cancelAnimationFrame(l);
+    }, []), /* @__PURE__ */ n(F, { present: i || s, children: ({ present: l }) => /* @__PURE__ */ n(
+      m.div,
+      {
+        "data-state": s ? "active" : "inactive",
+        "data-orientation": u.orientation,
+        role: "tabpanel",
+        "aria-labelledby": b,
+        hidden: !l,
+        id: v,
+        tabIndex: 0,
+        ...o,
+        ref: t,
+        style: {
+          ...e.style,
+          animationDuration: r.current ? "0s" : void 0
+        },
+        children: l && d
+      }
+    ) });
+  }
+);
+A.displayName = w;
+function P(e, t) {
+  return `${e}-trigger-${t}`;
+}
+function S(e, t) {
+  return `${e}-content-${t}`;
+}
+var j = I, z = _, K = R, B = A;
+function te({
+  className: e,
+  ...t
+}) {
+  return /* @__PURE__ */ n(
+    j,
+    {
+      className: p("flex flex-col gap-2", e),
+      "data-slot": "tabs",
+      ...t
+    }
+  );
+}
+function ae({
+  className: e,
+  ...t
+}) {
+  return /* @__PURE__ */ n(
+    z,
+    {
+      className: p(
+        "inline-flex h-9 w-fit items-center justify-center rounded-lg bg-muted p-[3px] text-muted-foreground",
+        e
+      ),
+      "data-slot": "tabs-list",
+      ...t
+    }
+  );
+}
+function oe({
+  className: e,
+  ...t
+}) {
+  return /* @__PURE__ */ n(
+    K,
+    {
+      className: p(
+        "inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 whitespace-nowrap rounded-md border border-transparent px-2 py-1 font-medium text-foreground text-sm transition-[color,box-shadow] focus-visible:border-ring focus-visible:outline-1 focus-visible:outline-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:shadow-sm dark:text-muted-foreground dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 dark:data-[state=active]:text-foreground [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+        e
+      ),
+      "data-slot": "tabs-trigger",
+      ...t
+    }
+  );
+}
+function re({
+  className: e,
+  ...t
+}) {
+  return /* @__PURE__ */ n(
+    B,
+    {
+      className: p("flex-1 outline-none", e),
+      "data-slot": "tabs-content",
+      ...t
+    }
+  );
+}
+export {
+  te as Tabs,
+  re as TabsContent,
+  ae as TabsList,
+  oe as TabsTrigger
+};

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

@@ -0,0 +1,3 @@
+import type * as React from 'react';
+declare function Textarea({ className, ...props }: React.ComponentProps<'textarea'>): import("react/jsx-runtime").JSX.Element;
+export { Textarea };

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

@@ -0,0 +1,18 @@
+import { jsx as i } from "react/jsx-runtime";
+import { c as t } from "../../../utils-Dy2WjYNJ.js";
+function n({ className: r, ...e }) {
+  return /* @__PURE__ */ i(
+    "textarea",
+    {
+      className: t(
+        "field-sizing-content flex min-h-16 w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-xs outline-none transition-[color,box-shadow] placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:aria-invalid:ring-destructive/40",
+        r
+      ),
+      "data-slot": "textarea",
+      ...e
+    }
+  );
+}
+export {
+  n as Textarea
+};

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

@@ -0,0 +1,9 @@
+import { VariantProps } from 'class-variance-authority';
+import * as TogglePrimitive from '@radix-ui/react-toggle';
+import type * as React from 'react';
+declare const toggleVariants: (props?: ({
+    variant?: "default" | "outline" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare function Toggle({ className, variant, size, ...props }: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>): import("react/jsx-runtime").JSX.Element;
+export { Toggle, toggleVariants };

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

@@ -0,0 +1,70 @@
+import { jsx as n } from "react/jsx-runtime";
+import * as u from "react";
+import { c as f } from "../../../index-DLeNytVF.js";
+import { u as g } from "../../../index-DYfkNB0n.js";
+import { P as m } from "../../../index-C9KW2H79.js";
+import { c as v } from "../../../index-DdnpnyX2.js";
+import { c as p } from "../../../utils-Dy2WjYNJ.js";
+var s = "Toggle", i = u.forwardRef((e, t) => {
+  const { pressed: r, defaultPressed: a, onPressedChange: d, ...l } = e, [o, c] = g({
+    prop: r,
+    onChange: d,
+    defaultProp: a ?? !1,
+    caller: s
+  });
+  return /* @__PURE__ */ n(
+    m.button,
+    {
+      type: "button",
+      "aria-pressed": o,
+      "data-state": o ? "on" : "off",
+      "data-disabled": e.disabled ? "" : void 0,
+      ...l,
+      ref: t,
+      onClick: f(e.onClick, () => {
+        e.disabled || c(!o);
+      })
+    }
+  );
+});
+i.displayName = s;
+var b = i;
+const h = v(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md font-medium text-sm outline-none transition-[color,box-shadow] hover:bg-muted hover:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        outline: "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground"
+      },
+      size: {
+        default: "h-9 min-w-9 px-2",
+        sm: "h-8 min-w-8 px-1.5",
+        lg: "h-10 min-w-10 px-2.5"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function z({
+  className: e,
+  variant: t,
+  size: r,
+  ...a
+}) {
+  return /* @__PURE__ */ n(
+    b,
+    {
+      className: p(h({ variant: t, size: r, className: e })),
+      "data-slot": "toggle",
+      ...a
+    }
+  );
+}
+export {
+  z as Toggle,
+  h as toggleVariants
+};

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

@@ -0,0 +1,7 @@
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import type * as React from 'react';
+declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof TooltipPrimitive.Provider>): import("react/jsx-runtime").JSX.Element;
+declare function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function TooltipContent({ className, sideOffset, children, ...props }: React.ComponentProps<typeof TooltipPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };