@sth87/shadcn-design-system 0.1.8 → 0.2.0

package/dist/esm/components/QrCode/QrCode.js

@@ -1,127 +1,97 @@
 import { jsx as v } from "react/jsx-runtime";
-import { Slot as y } from "@radix-ui/react-slot";
-import "../../packages/ui/src/components/button.js";
-import "../../packages/ui/src/components/button-group.js";
-import "../../packages/ui/src/components/input.js";
-import "../../packages/ui/src/components/textarea.js";
-import "@radix-ui/react-label";
-import { cn as w } from "../../packages/ui/src/lib/utils.js";
-import "../../packages/ui/src/components/select.js";
-import "../../packages/ui/src/components/combobox.js";
-import "@radix-ui/react-tooltip";
-import * as l from "react";
-import "lucide-react";
-import "react-day-picker";
-import "../../packages/ui/src/components/popover.js";
-import "@radix-ui/react-separator";
-import "../../packages/ui/src/components/switch.js";
-import "vaul";
-import "@radix-ui/react-scroll-area";
-import "../../packages/ui/src/components/tree-view.js";
-import "@radix-ui/react-alert-dialog";
-import "@radix-ui/react-avatar";
-import "../../packages/ui/src/components/badge.js";
-import "../../packages/ui/src/components/checkbox.js";
-import "@radix-ui/react-collapsible";
-import "cmdk";
-import "@radix-ui/react-dialog";
-import "@radix-ui/react-dropdown-menu";
-import "../../packages/ui/src/components/input-otp.js";
-import "../../packages/ui/src/components/radio-group.js";
-import "../../packages/ui/src/components/sidebar.js";
-import "@radix-ui/react-slider";
-import "../../packages/ui/src/components/tabs.js";
-import "../../packages/ui/src/components/toggle.js";
+import { cn as p } from "../../packages/ui/src/lib/utils.js";
+import { Slot as w } from "@radix-ui/react-slot";
 import { useComposedRefs as I } from "../../packages/ui/src/lib/compose-refs.js";
+import * as l from "react";
 const O = "QRCode", G = "QRCodeCanvas", K = "QRCodeSvg", _ = "QRCodeImage", $ = "QRCodeSkeleton";
-function E(o) {
+function E(s) {
   const e = l.useRef(null);
-  return e.current === null && (e.current = o()), e;
+  return e.current === null && (e.current = s()), e;
 }
 const L = l.createContext(null);
-function h(o) {
+function R(s) {
   const e = l.useContext(L);
   if (!e)
     throw new Error(`\`useQRCode\` must be used within \`${O}\``);
   const t = l.useCallback(
-    () => o(e.getState()),
-    [e, o]
+    () => s(e.getState()),
+    [e, s]
   );
   return l.useSyncExternalStore(e.subscribe, t, t);
 }
 const U = l.createContext(null);
-function N(o) {
+function N(s) {
   const e = l.useContext(U);
   if (!e)
-    throw new Error(`\`${o}\` must be used within \`${O}\``);
+    throw new Error(`\`${s}\` must be used within \`${O}\``);
   return e;
 }
-function be(o) {
+function H(s) {
   const {
     value: e,
     size: t = 200,
     level: n = "M",
-    margin: i = 1,
-    quality: s = 0.92,
-    backgroundColor: r = "#ffffff",
-    foregroundColor: a = "#000000",
+    margin: a = 1,
+    quality: r = 0.92,
+    backgroundColor: o = "#ffffff",
+    foregroundColor: i = "#000000",
     onError: d,
-    onGenerated: R,
+    onGenerated: S,
     className: Q,
-    style: m,
-    asChild: u,
+    style: u,
+    asChild: m,
     ...b
-  } = o, k = l.useRef(null), P = E(() => /* @__PURE__ */ new Set()), x = E(() => ({
+  } = s, k = l.useRef(null), P = E(() => /* @__PURE__ */ new Set()), x = E(() => ({
     dataUrl: null,
     svgString: null,
     isGenerating: !1,
     error: null,
     generationKey: ""
-  })), p = l.useMemo(() => ({
+  })), C = l.useMemo(() => ({
     subscribe: (c) => (P.current.add(c), () => P.current.delete(c)),
     getState: () => x.current,
-    setState: (c, C) => {
-      Object.is(x.current[c], C) || (x.current[c] = C, p.notify());
+    setState: (c, h) => {
+      Object.is(x.current[c], h) || (x.current[c] = h, C.notify());
     },
     setStates: (c) => {
-      let C = !1;
+      let h = !1;
       for (const f of Object.keys(c)) {
         const g = c[f];
-        g !== void 0 && !Object.is(x.current[f], g) && (Object.assign(x.current, { [f]: g }), C = !0);
+        g !== void 0 && !Object.is(x.current[f], g) && (Object.assign(x.current, { [f]: g }), h = !0);
       }
-      C && p.notify();
+      h && C.notify();
     },
     notify: () => {
       for (const c of P.current)
         c();
     }
-  }), [P, x]), S = l.useMemo(
+  }), [P, x]), y = l.useMemo(
     () => ({
       errorCorrectionLevel: n,
       type: "image/png",
-      quality: s,
-      margin: i,
+      quality: r,
+      margin: a,
       color: {
-        dark: a,
-        light: r
+        dark: i,
+        light: o
       },
       width: t
     }),
-    [n, i, a, r, t, s]
+    [n, a, i, o, t, r]
   ), q = l.useMemo(() => e ? JSON.stringify({
     value: e,
     size: t,
     level: n,
-    margin: i,
-    quality: s,
-    foregroundColor: a,
-    backgroundColor: r
-  }) : "", [e, n, i, a, r, t, s]), z = l.useCallback(
+    margin: a,
+    quality: r,
+    foregroundColor: i,
+    backgroundColor: o
+  }) : "", [e, n, a, i, o, t, r]), z = l.useCallback(
     async (c) => {
       if (!e || !c) return;
-      const C = p.getState();
-      if (!(C.isGenerating || C.generationKey === c)) {
-        p.setStates({
+      const h = C.getState();
+      if (!(h.isGenerating || h.generationKey === c)) {
+        C.setStates({
           isGenerating: !0,
           error: null
         });
@@ -129,45 +99,45 @@ function be(o) {
           const f = (await import("qrcode")).default;
           let g = null;
           try {
-            g = await f.toDataURL(e, S);
+            g = await f.toDataURL(e, y);
           } catch {
             g = null;
           }
-          k.current && await f.toCanvas(k.current, e, S);
+          k.current && await f.toCanvas(k.current, e, y);
           const j = await f.toString(e, {
-            errorCorrectionLevel: S.errorCorrectionLevel,
-            margin: S.margin,
-            color: S.color,
-            width: S.width,
+            errorCorrectionLevel: y.errorCorrectionLevel,
+            margin: y.margin,
+            color: y.color,
+            width: y.width,
             type: "svg"
           });
-          p.setStates({
+          C.setStates({
             dataUrl: g,
             svgString: j,
             isGenerating: !1,
             generationKey: c
-          }), R?.();
+          }), S?.();
         } catch (f) {
           const g = f instanceof Error ? f : new Error("Failed to generate QR code");
-          p.setStates({
+          C.setStates({
             error: g,
             isGenerating: !1
           }), d?.(g);
         }
       }
     },
-    [e, S, p, d, R]
+    [e, y, C, d, S]
   ), M = l.useMemo(
     () => ({
       value: e,
       size: t,
       level: n,
-      margin: i,
-      backgroundColor: r,
-      foregroundColor: a,
+      margin: a,
+      backgroundColor: o,
+      foregroundColor: i,
       canvasRef: k
     }),
-    [e, t, r, a, n, i]
+    [e, t, o, i, n, a]
   );
   l.useLayoutEffect(() => {
     if (q) {
@@ -177,136 +147,136 @@ function be(o) {
       return () => cancelAnimationFrame(c);
     }
   }, [q, z]);
-  const A = u ? y : "div";
-  return /* @__PURE__ */ v(L.Provider, { value: p, children: /* @__PURE__ */ v(U.Provider, { value: M, children: /* @__PURE__ */ v(
+  const A = m ? w : "div";
+  return /* @__PURE__ */ v(L.Provider, { value: C, children: /* @__PURE__ */ v(U.Provider, { value: M, children: /* @__PURE__ */ v(
     A,
     {
       "data-slot": "qr-code",
       ...b,
-      className: w(Q, "ds:relative ds:flex ds:flex-col ds:items-center ds:gap-2"),
+      className: p(Q, "ds:relative ds:flex ds:flex-col ds:items-center ds:gap-2"),
       style: {
         "--qr-code-size": `${t}px`,
-        ...m
+        ...u
       },
       children: b?.children ? b.children : /* @__PURE__ */ v(D, {})
     }
   ) }) });
 }
-function D(o) {
-  const { asChild: e, className: t, ref: n, ...i } = o, s = N(G), r = h((R) => R.generationKey), a = I(n, s.canvasRef);
+function D(s) {
+  const { asChild: e, className: t, ref: n, ...a } = s, r = N(G), o = R((S) => S.generationKey), i = I(n, r.canvasRef);
   return /* @__PURE__ */ v(
-    e ? y : "canvas",
+    e ? w : "canvas",
     {
       "data-slot": "qr-code-canvas",
-      ...i,
-      ref: a,
-      width: s.size,
-      height: s.size,
-      className: w(
+      ...a,
+      ref: i,
+      width: r.size,
+      height: r.size,
+      className: p(
         "ds:relative ds:max-h-(--qr-code-size) ds:max-w-(--qr-code-size)",
-        !r && "ds:invisible",
+        !o && "ds:invisible",
         t
       )
     }
   );
 }
-function Pe(o) {
-  const { asChild: e, className: t, style: n, ...i } = o, s = N(K), r = h((d) => d.svgString);
-  return r ? /* @__PURE__ */ v(
-    e ? y : "div",
+function J(s) {
+  const { asChild: e, className: t, style: n, ...a } = s, r = N(K), o = R((d) => d.svgString);
+  return o ? /* @__PURE__ */ v(
+    e ? w : "div",
     {
       "data-slot": "qr-code-svg",
-      ...i,
-      className: w(
+      ...a,
+      className: p(
         "ds:relative ds:max-h-(--qr-code-size) ds:max-w-(--qr-code-size)",
         t
       ),
-      style: { width: s.size, height: s.size, ...n },
-      dangerouslySetInnerHTML: { __html: r }
+      style: { width: r.size, height: r.size, ...n },
+      dangerouslySetInnerHTML: { __html: o }
     }
   ) : null;
 }
-function Ne(o) {
-  const { alt: e = "QR Code", asChild: t, className: n, ...i } = o, s = N(_), r = h((d) => d.dataUrl);
-  return r ? /* @__PURE__ */ v(
-    t ? y : "img",
+function W(s) {
+  const { alt: e = "QR Code", asChild: t, className: n, ...a } = s, r = N(_), o = R((d) => d.dataUrl);
+  return o ? /* @__PURE__ */ v(
+    t ? w : "img",
     {
       "data-slot": "qr-code-image",
-      ...i,
-      src: r,
+      ...a,
+      src: o,
       alt: e,
-      width: s.size,
-      height: s.size,
-      className: w(
+      width: r.size,
+      height: r.size,
+      className: p(
         "ds:relative ds:max-h-(--qr-code-size) ds:max-w-(--qr-code-size)",
         n
       )
     }
   ) : null;
 }
-function Qe(o) {
+function X(s) {
   const {
     filename: e = "qrcode",
     format: t = "png",
     asChild: n,
-    className: i,
-    children: s,
-    ...r
-  } = o, a = h((m) => m.dataUrl), d = h((m) => m.svgString), R = l.useCallback(
-    (m) => {
-      if (r.onClick?.(m), m.defaultPrevented) return;
-      const u = document.createElement("a");
-      if (t === "png" && a)
-        u.href = a, u.download = `${e}.png`;
+    className: a,
+    children: r,
+    ...o
+  } = s, i = R((u) => u.dataUrl), d = R((u) => u.svgString), S = l.useCallback(
+    (u) => {
+      if (o.onClick?.(u), u.defaultPrevented) return;
+      const m = document.createElement("a");
+      if (t === "png" && i)
+        m.href = i, m.download = `${e}.png`;
       else if (t === "svg" && d) {
         const b = new Blob([d], { type: "image/svg+xml" });
-        u.href = URL.createObjectURL(b), u.download = `${e}.svg`;
+        m.href = URL.createObjectURL(b), m.download = `${e}.svg`;
       } else
         return;
-      document.body.appendChild(u), u.click(), document.body.removeChild(u), t === "svg" && d && URL.revokeObjectURL(u.href);
+      document.body.appendChild(m), m.click(), document.body.removeChild(m), t === "svg" && d && URL.revokeObjectURL(m.href);
     },
-    [a, d, e, t, r.onClick]
+    [i, d, e, t, o.onClick]
   );
   return /* @__PURE__ */ v(
-    n ? y : "button",
+    n ? w : "button",
     {
       type: "button",
       "data-slot": "qr-code-download",
-      ...r,
-      className: w("ds:max-w-(--qr-code-size)", i),
-      onClick: R,
-      children: s ?? `Download ${t.toUpperCase()}`
+      ...o,
+      className: p("ds:max-w-(--qr-code-size)", a),
+      onClick: S,
+      children: r ?? `Download ${t.toUpperCase()}`
     }
   );
 }
-function ke(o) {
-  const { asChild: e, className: t, ...n } = o;
+function Y(s) {
+  const { asChild: e, className: t, ...n } = s;
   return /* @__PURE__ */ v(
-    e ? y : "div",
+    e ? w : "div",
     {
       "data-slot": "qr-code-overlay",
       ...n,
-      className: w(
+      className: p(
         "ds:-translate-x-1/2 ds:-translate-y-1/2 ds:absolute ds:top-1/2 ds:left-1/2 ds:flex ds:items-center ds:justify-center ds:rounded-sm ds:bg-background",
         t
       )
     }
   );
 }
-function qe(o) {
-  const { asChild: e, className: t, style: n, ...i } = o, s = N($), r = h((m) => m.dataUrl), a = h((m) => m.svgString), d = h((m) => m.generationKey);
-  return r || a || d ? null : /* @__PURE__ */ v(
-    e ? y : "div",
+function Z(s) {
+  const { asChild: e, className: t, style: n, ...a } = s, r = N($), o = R((u) => u.dataUrl), i = R((u) => u.svgString), d = R((u) => u.generationKey);
+  return o || i || d ? null : /* @__PURE__ */ v(
+    e ? w : "div",
     {
       "data-slot": "qr-code-skeleton",
-      ...i,
-      className: w(
+      ...a,
+      className: p(
         "ds:absolute ds:max-h-(--qr-code-size) ds:max-w-(--qr-code-size) ds:animate-pulse ds:bg-accent",
         t
       ),
       style: {
-        width: s.size,
-        height: s.size,
+        width: r.size,
+        height: r.size,
         ...n
       }
     }
@@ -314,19 +284,18 @@ function qe(o) {
 }
 export {
   D as Canvas,
-  Qe as Download,
-  Ne as Image,
-  ke as Overlay,
-  be as QRCode,
+  X as Download,
+  W as Image,
+  Y as Overlay,
+  H as QRCode,
   D as QRCodeCanvas,
-  Qe as QRCodeDownload,
-  Ne as QRCodeImage,
-  ke as QRCodeOverlay,
-  qe as QRCodeSkeleton,
-  Pe as QRCodeSvg,
-  be as Root,
-  qe as Skeleton,
-  Pe as Svg,
-  h as useQRCode
+  X as QRCodeDownload,
+  W as QRCodeImage,
+  Y as QRCodeOverlay,
+  Z as QRCodeSkeleton,
+  J as QRCodeSvg,
+  H as Root,
+  Z as Skeleton,
+  J as Svg,
+  R as useQRCode
 };
-//# sourceMappingURL=QrCode.js.map

package/dist/esm/components/QrCode/index.js

@@ -13,4 +13,3 @@ export {
   t as QrCode,
   r as useQRCode
 };
-//# sourceMappingURL=index.js.map

package/dist/esm/components/Radio/Radio.js

@@ -1,62 +1,32 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import p from "react";
+import { jsxs as m, jsx as a } from "react/jsx-runtime";
+import n from "react";
 import { RadioGroup as f, RadioGroupItem as I } from "../../packages/ui/src/components/radio-group.js";
-import "@radix-ui/react-slot";
-import "../../packages/ui/src/components/button.js";
-import "../../packages/ui/src/components/button-group.js";
-import "../../packages/ui/src/components/input.js";
-import "../../packages/ui/src/components/textarea.js";
-import "@radix-ui/react-label";
-import { cn as n } from "../../packages/ui/src/lib/utils.js";
-import "../../packages/ui/src/components/select.js";
-import "../../packages/ui/src/components/combobox.js";
-import "@radix-ui/react-tooltip";
-import "lucide-react";
-import "react-day-picker";
-import "../../packages/ui/src/components/popover.js";
-import "@radix-ui/react-separator";
-import "../../packages/ui/src/components/switch.js";
-import "vaul";
-import "@radix-ui/react-scroll-area";
-import "../../packages/ui/src/components/tree-view.js";
-import "@radix-ui/react-alert-dialog";
-import "@radix-ui/react-avatar";
-import "../../packages/ui/src/components/badge.js";
-import "../../packages/ui/src/components/checkbox.js";
-import "@radix-ui/react-collapsible";
-import "cmdk";
-import "@radix-ui/react-dialog";
-import "@radix-ui/react-dropdown-menu";
-import "../../packages/ui/src/components/input-otp.js";
-import "../../packages/ui/src/components/sidebar.js";
-import "@radix-ui/react-slider";
-import "../../packages/ui/src/components/tabs.js";
-import "../../packages/ui/src/components/toggle.js";
-const c = p.forwardRef(
-  (s, d) => {
-    const { label: o, variant: r = "option", rootClassName: t, ...i } = s, a = p.useId();
-    return /* @__PURE__ */ l("div", { className: n("ds:flex ds:items-center ds:space-x-2", t), children: [
-      /* @__PURE__ */ e(I, { ref: d, id: a, ...i }),
-      r === "option" && o && /* @__PURE__ */ e(
+import { cn as c } from "../../packages/ui/src/lib/utils.js";
+const p = n.forwardRef(
+  (t, i) => {
+    const { label: e, variant: s = "option", rootClassName: d, ...l } = t, o = n.useId();
+    return /* @__PURE__ */ m("div", { className: c("ds:flex ds:items-center ds:space-x-2", d), children: [
+      /* @__PURE__ */ a(I, { ref: i, id: o, ...l }),
+      s === "option" && e && /* @__PURE__ */ a(
         "label",
         {
-          htmlFor: a,
+          htmlFor: o,
           className: "ds:text-sm ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70",
-          children: o
+          children: e
         }
       ),
-      r === "button-group" && o && /* @__PURE__ */ e("span", { className: "ds:sr-only", children: o })
+      s === "button-group" && e && /* @__PURE__ */ a("span", { className: "ds:sr-only", children: e })
     ] });
   }
 );
-c.displayName = "RadioItem";
-const u = p.forwardRef((s, d) => {
+p.displayName = "RadioItem";
+const u = n.forwardRef((t, i) => {
   const {
-    options: o,
-    label: r,
-    helperText: t,
-    variant: i = "option",
-    size: a = "default",
+    options: e,
+    label: s,
+    helperText: d,
+    variant: l = "option",
+    size: o = "default",
     color: x,
     value: b,
     onValueChange: N,
@@ -64,41 +34,40 @@ const u = p.forwardRef((s, d) => {
     className: R,
     rootClassName: v,
     disabled: g
-  } = s;
-  return /* @__PURE__ */ l("div", { className: n("ds:flex ds:flex-col ds:gap-1.5", v), children: [
-    r && /* @__PURE__ */ e("label", { className: "ds:text-sm ds:font-medium", children: r }),
-    /* @__PURE__ */ l(
+  } = t;
+  return /* @__PURE__ */ m("div", { className: c("ds:flex ds:flex-col ds:gap-1.5", v), children: [
+    s && /* @__PURE__ */ a("label", { className: "ds:text-sm ds:font-medium", children: s }),
+    /* @__PURE__ */ m(
       f,
       {
-        ref: d,
+        ref: i,
         value: b,
         onValueChange: N,
-        variant: i,
-        className: n(R),
+        variant: l,
+        className: c(R),
         children: [
-          o && o.map((m) => /* @__PURE__ */ e(
-            c,
+          e && e.map((r) => /* @__PURE__ */ a(
+            p,
             {
-              value: m.value,
-              label: m.label,
-              disabled: g || m.disabled,
-              variant: i,
-              size: a,
+              value: r.value,
+              label: r.label,
+              disabled: g || r.disabled,
+              variant: l,
+              size: o,
               color: x
             },
-            m.value
+            r.value
           )),
           h
         ]
       }
     ),
-    t && /* @__PURE__ */ e("p", { className: "ds:text-xs ds:text-muted-foreground", children: t })
+    d && /* @__PURE__ */ a("p", { className: "ds:text-xs ds:text-muted-foreground", children: d })
   ] });
 });
 u.displayName = "Radio";
 u.Group = f;
-u.Item = c;
+u.Item = p;
 export {
   u as default
 };
-//# sourceMappingURL=Radio.js.map

package/dist/esm/components/Radio/index.js

@@ -0,0 +1,5 @@
+import { default as e, default as f } from "./Radio.js";
+export {
+  e as Radio,
+  f as default
+};

package/dist/esm/components/Rate/Rate.js

@@ -188,4 +188,3 @@ Z.displayName = "Rate";
 export {
   Z as default
 };
-//# sourceMappingURL=Rate.js.map

package/dist/esm/components/Rate/index.js

@@ -0,0 +1,5 @@
+import { default as t, default as f } from "./Rate.js";
+export {
+  t as Rate,
+  f as default
+};

package/dist/esm/components/Resizable/Resizable.js

@@ -85,4 +85,3 @@ export {
   h as ResizableWrapper,
   E as default
 };
-//# sourceMappingURL=Resizable.js.map

package/dist/esm/components/Resizable/index.js

@@ -0,0 +1,13 @@
+import a from "./Resizable.js";
+import { Handle as o, Panel as p, ResizableWrapper as i } from "./Resizable.js";
+import { ResizableHandle as b, ResizablePanel as n, ResizablePanelGroup as t } from "../../packages/ui/src/components/resizable.js";
+export {
+  o as Handle,
+  p as Panel,
+  a as Resizable,
+  b as ResizableHandle,
+  n as ResizablePanel,
+  t as ResizablePanelGroup,
+  i as ResizableWrapper,
+  a as default
+};

package/dist/esm/components/ScrollArea/ScrollArea.js

@@ -42,4 +42,3 @@ export {
   x as ScrollBar,
   R as default
 };
-//# sourceMappingURL=ScrollArea.js.map

package/dist/esm/components/ScrollArea/index.js

@@ -0,0 +1,5 @@
+import { ScrollArea as a, ScrollArea as e } from "./ScrollArea.js";
+export {
+  a as ScrollArea,
+  e as default
+};

package/dist/esm/components/Select/Select.js

@@ -215,4 +215,3 @@ se.displayName = "Select";
 export {
   se as default
 };
-//# sourceMappingURL=Select.js.map