@sth87/shadcn-design-system 0.1.8 → 0.2.0

package/dist/esm/components/Cropper/CropperTool.js

@@ -154,4 +154,3 @@ export {
   k as CropperTool,
   z as useCropperTool
 };
-//# sourceMappingURL=CropperTool.js.map

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

@@ -0,0 +1,17 @@
+import { Root as r, Area as p, Image as a, Video as s, useCropper as C } from "./Cropper.js";
+import { CropperTool as t, useCropperTool as d } from "./CropperTool.js";
+import { base64ToBlob as l, base64ToFile as i, downloadImage as I, getCroppedImg as T, rotateSize as b } from "./utils.js";
+export {
+  r as Cropper,
+  p as CropperArea,
+  a as CropperImage,
+  t as CropperTool,
+  s as CropperVideo,
+  l as base64ToBlob,
+  i as base64ToFile,
+  I as downloadImage,
+  T as getCroppedImg,
+  b as rotateSize,
+  C as useCropper,
+  d as useCropperTool
+};

package/dist/esm/components/Cropper/utils.js

@@ -105,4 +105,3 @@ export {
   A as getCroppedImg,
   D as rotateSize
 };
-//# sourceMappingURL=utils.js.map

package/dist/esm/components/DatePicker/DatePicker.js

@@ -1,78 +1,51 @@
-import { jsxs as h, jsx as n } from "react/jsx-runtime";
-import * as f from "react";
+import { jsxs as h, jsx as a } from "react/jsx-runtime";
+import * as p from "react";
 import { Calendar as ge } from "../../packages/ui/src/components/calendar.js";
 import { Popover as ve, PopoverTrigger as we, PopoverContent as he } from "../../packages/ui/src/components/popover.js";
 import { Drawer as ye, DrawerTrigger as be, DrawerContent as De, DrawerHeader as Me, DrawerTitle as xe, DrawerDescription as ze } from "../../packages/ui/src/components/drawer.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 M } 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 "@radix-ui/react-separator";
-import "../../packages/ui/src/components/switch.js";
-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 { CalendarIcon as Ce } from "lucide-react";
-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 { TimePicker as He } from "./TimePicker.js";
+import Ce from "../Input/Input.js";
+import He from "../Button/Button.js";
+import { TimePicker as Ne } from "./TimePicker.js";
+import { CalendarIcon as Pe } from "lucide-react";
 import { isMobile as x } from "react-device-detect";
-import { format as B, parse as Ne, isValid as Pe } from "date-fns";
-import { enUS as ke, vi as Se } from "date-fns/locale";
+import { format as B, parse as ke, isValid as Se } from "date-fns";
+import { enUS as Re, vi as Oe } from "date-fns/locale";
 import { DATE_FORMAT as _ } from "../../constants/common.js";
-import Re from "../Button/Button.js";
-import Oe from "../Input/Input.js";
-function Fe(t, s = _, o) {
-  return t ? B(t, s, o ? { locale: o } : void 0) : "";
+function Fe(t, o = _, s) {
+  return t ? B(t, o, s ? { locale: s } : void 0) : "";
 }
-const z = (t, s = _) => {
-  const o = Ne(t, s, /* @__PURE__ */ new Date());
-  return Pe(o) ? o : void 0;
+const z = (t, o = _) => {
+  const s = ke(t, o, /* @__PURE__ */ new Date());
+  return Se(s) ? s : void 0;
 };
 function Ie(t) {
-  return t.replace(/dd|MM|yyyy/g, (s) => {
-    switch (s) {
+  return t.replace(/dd|MM|yyyy/g, (o) => {
+    switch (o) {
       case "dd":
       case "MM":
         return "99";
       case "yyyy":
         return "9999";
       default:
-        return s;
+        return o;
     }
-  }).replace(/d|M|y/g, (s) => {
-    switch (s) {
+  }).replace(/d|M|y/g, (o) => {
+    switch (o) {
       case "d":
       case "M":
         return "9";
       case "y":
         return "9";
       default:
-        return s;
+        return o;
     }
   });
 }
-function Dr({
+function Qe({
   value: t,
-  onChange: s,
-  onSelect: o,
+  onChange: o,
+  onSelect: s,
   calendarClassName: q,
   side: G = "bottom",
   align: J = "end",
@@ -95,76 +68,76 @@ function Dr({
   timePickerMode: ee = "wheel",
   hourInterval: re = 1,
   minuteInterval: te = 1,
-  secondInterval: oe = 1,
-  disabledTimes: se,
-  disabledTimeRanges: ie,
-  showNowButton: ne = !1,
-  nowButtonLabel: ae = "Now",
-  timePickerLabel: de,
+  secondInterval: se = 1,
+  disabledTimes: oe,
+  disabledTimeRanges: ne,
+  showNowButton: ae = !1,
+  nowButtonLabel: de = "Now",
+  timePickerLabel: ie,
   openOnFocus: le = !0,
-  ...i
+  ...n
 }) {
-  let m, O;
-  typeof y == "string" ? (m = y, O = y) : (m = y.input, O = y.output);
+  let u, O;
+  typeof y == "string" ? (u = y, O = y) : (u = y.input, O = y.output);
   let C;
-  N === !0 ? C = Ie(m) : typeof N == "string" && (C = N);
-  const F = R && c ? g : c ? `${m} ${g}` : m, T = t ? z(t, F) : void 0, [b, D] = f.useState(!1), [a, d] = f.useState(T), [ce, v] = f.useState(T), [w, u] = f.useState(t || ""), me = f.useRef(null), I = f.useRef(!1), V = P?.locale ? P?.locale : Q === "en" ? ke : Se, A = x ? X : k;
-  f.useEffect(() => {
+  N === !0 ? C = Ie(u) : typeof N == "string" && (C = N);
+  const F = R && c ? g : c ? `${u} ${g}` : u, T = t ? z(t, F) : void 0, [b, D] = p.useState(!1), [d, i] = p.useState(T), [ce, v] = p.useState(T), [w, f] = p.useState(t || ""), ue = p.useRef(null), I = p.useRef(!1), V = P?.locale ? P?.locale : Q === "en" ? Re : Oe, A = x ? X : k;
+  p.useEffect(() => {
     if (t !== w && !I.current) {
-      u(t || "");
+      f(t || "");
       const e = t ? z(t, F) : void 0;
-      e ? (d(e), v(e)) : t || (d(void 0), v(void 0));
+      e ? (i(e), v(e)) : t || (i(void 0), v(void 0));
     }
   }, [t, w, F]);
   const l = (e) => {
     if (!e) return "";
     let r = Fe(e, O, V);
     return c && (r += ` ${B(e, g)}`), r;
-  }, ue = (e) => {
-    d(e), u(l(e)), o?.(e, l(e));
-  }, pe = (e) => {
+  }, fe = (e) => {
+    i(e), f(l(e)), s?.(e, l(e));
+  }, me = (e) => {
     if (!e) {
-      u(""), d(void 0), o?.(void 0, void 0);
+      f(""), i(void 0), s?.(void 0, void 0);
       return;
     }
-    u(e);
-    const r = z(e, m);
-    r ? (d(r), v(r), o?.(r, l(r))) : (d(void 0), o?.(void 0, void 0));
-  }, fe = (e, r, H) => {
+    f(e);
+    const r = z(e, u);
+    r ? (i(r), v(r), s?.(r, l(r))) : (i(void 0), s?.(void 0, void 0));
+  }, pe = (e, r, H) => {
     if (!H) {
-      s?.(e, r, void 0);
+      o?.(e, r, void 0);
       return;
     }
-    const p = new Date(a || /* @__PURE__ */ new Date());
-    p.setHours(
+    const m = new Date(d || /* @__PURE__ */ new Date());
+    m.setHours(
       H.getHours(),
       H.getMinutes(),
       H.getSeconds(),
       0
-    ), d(p), u(l(p)), o?.(p, l(p)), s?.(e, l(p), p);
+    ), i(m), f(l(m)), s?.(m, l(m)), o?.(e, l(m), m);
   }, U = S ? S({
     value: w,
-    date: a,
-    onSelect: ue,
-    onChange: pe
+    date: d,
+    onSelect: fe,
+    onChange: me
   }) : /* @__PURE__ */ h(
-    Re,
+    He,
     {
       variant: "ghost",
       className: "ds:!p-1 ds:!leading-0 ds:h-auto ds:rounded ds:hover:bg-accent ds:transition-colors",
-      size: i.size,
+      size: n.size,
       children: [
-        /* @__PURE__ */ n(
-          Ce,
+        /* @__PURE__ */ a(
+          Pe,
           {
             className: M({
-              "ds:size-3": i.size === "xs" || i.size === "sm",
-              "ds:size-3.5": !i.size || i.size === "normal",
-              "ds:size-4": i.size === "lg" || i.size === "xl"
+              "ds:size-3": n.size === "xs" || n.size === "sm",
+              "ds:size-3.5": !n.size || n.size === "normal",
+              "ds:size-4": n.size === "lg" || n.size === "xl"
             })
           }
         ),
-        /* @__PURE__ */ n("span", { className: "ds:sr-only", children: "Select date" })
+        /* @__PURE__ */ a("span", { className: "ds:sr-only", children: "Select date" })
       ]
     }
   ), j = /* @__PURE__ */ h(
@@ -177,12 +150,12 @@ function Dr({
         x ? "ds:max-w-md ds:md:max-w-md ds:lg:max-w-lg" : ""
       ),
       children: [
-        !R && /* @__PURE__ */ n(
+        !R && /* @__PURE__ */ a(
           ge,
           {
             ...P,
             mode: "single",
-            selected: a,
+            selected: d,
             captionLayout: "dropdown",
             month: ce,
             onMonthChange: v,
@@ -191,12 +164,12 @@ function Dr({
             color: L,
             onSelect: (e) => {
               let r = e;
-              e && a && c && (r = new Date(e), r.setHours(
-                a.getHours(),
-                a.getMinutes(),
-                a.getSeconds(),
-                a.getMilliseconds()
-              )), d(r), u(l(r)), o?.(r, l(r)), W && !c && D(!1);
+              e && d && c && (r = new Date(e), r.setHours(
+                d.getHours(),
+                d.getMinutes(),
+                d.getSeconds(),
+                d.getMilliseconds()
+              )), i(r), f(l(r)), s?.(r, l(r)), W && !c && D(!1);
             },
             locale: V,
             formatters: {
@@ -214,24 +187,24 @@ function Dr({
             )
           }
         ),
-        c && /* @__PURE__ */ n("div", { className: "ds:border-l ds:border-border", children: /* @__PURE__ */ n(
-          He,
+        c && /* @__PURE__ */ a("div", { className: "ds:border-l ds:border-border", children: /* @__PURE__ */ a(
+          Ne,
           {
-            value: a ? B(a, g) : void 0,
+            value: d ? B(d, g) : void 0,
             format: g,
-            onChange: fe,
+            onChange: pe,
             showHours: !0,
             showMinutes: !0,
             showSeconds: g === "HH:mm:ss",
             mode: ee,
             hourInterval: re,
             minuteInterval: te,
-            secondInterval: oe,
-            disabledTimes: se,
-            disabledTimeRanges: ie,
-            showNowButton: ne,
-            nowButtonLabel: ae,
-            timeLabel: de,
+            secondInterval: se,
+            disabledTimes: oe,
+            disabledTimeRanges: ne,
+            showNowButton: ae,
+            nowButtonLabel: de,
+            timeLabel: ie,
             standalone: !1,
             color: L,
             isOpen: b
@@ -240,8 +213,8 @@ function Dr({
       ]
     }
   ), E = /* @__PURE__ */ h(ve, { open: b, onOpenChange: D, children: [
-    /* @__PURE__ */ n(we, { asChild: !0, disabled: i.disabled, children: U }),
-    /* @__PURE__ */ n(
+    /* @__PURE__ */ a(we, { asChild: !0, disabled: n.disabled, children: U }),
+    /* @__PURE__ */ a(
       he,
       {
         className: M(
@@ -254,7 +227,7 @@ function Dr({
       }
     )
   ] }), K = /* @__PURE__ */ h(ye, { open: b, onOpenChange: D, children: [
-    /* @__PURE__ */ n(be, { asChild: !0, children: U }),
+    /* @__PURE__ */ a(be, { asChild: !0, children: U }),
     /* @__PURE__ */ h(
       De,
       {
@@ -264,44 +237,43 @@ function Dr({
         ),
         children: [
           /* @__PURE__ */ h(Me, { className: "ds:sr-only", children: [
-            /* @__PURE__ */ n(xe, { children: "Select date" }),
-            /* @__PURE__ */ n(ze, { children: "Set date" })
+            /* @__PURE__ */ a(xe, { children: "Select date" }),
+            /* @__PURE__ */ a(ze, { children: "Set date" })
           ] }),
           j
         ]
       }
     )
   ] });
-  return S ? A === "drawer" ? K : E : /* @__PURE__ */ n(
-    Oe,
+  return S ? A === "drawer" ? K : E : /* @__PURE__ */ a(
+    Ce,
     {
-      ...i,
-      ref: me,
+      ...n,
+      ref: ue,
       type: "text",
       clearable: !0,
       value: w,
       mask: C,
       onChange: (e) => {
-        I.current = !0, u(e.target.value);
-        const r = z(e.target.value, m);
-        r ? (d(r), v(r), o?.(r, l(r)), s?.(e, l(r), r)) : (o?.(void 0, void 0), s?.(e, void 0, void 0));
+        I.current = !0, f(e.target.value);
+        const r = z(e.target.value, u);
+        r ? (i(r), v(r), s?.(r, l(r)), o?.(e, l(r), r)) : (s?.(void 0, void 0), o?.(e, void 0, void 0));
       },
       onFocus: (e) => {
-        le && !b && !C && D(!0), i.onFocus?.(e);
+        le && !b && !C && D(!0), n.onFocus?.(e);
       },
       onBlur: (e) => {
         setTimeout(() => {
-          I.current = !1, b || !z(w, m) && w && (u(""), d(void 0), v(void 0), o?.(void 0, void 0));
-        }, 150), i.onBlur?.(e);
+          I.current = !1, b || !z(w, u) && w && (f(""), i(void 0), v(void 0), s?.(void 0, void 0));
+        }, 150), n.onBlur?.(e);
       },
       onKeyDown: (e) => {
-        e.key === "ArrowDown" && (e.preventDefault(), D(!0)), i.onKeyDown?.(e);
+        e.key === "ArrowDown" && (e.preventDefault(), D(!0)), n.onKeyDown?.(e);
       },
       suffixIcon: A === "drawer" ? K : E
     }
   );
 }
 export {
-  Dr as DatePicker
+  Qe as DatePicker
 };
-//# sourceMappingURL=DatePicker.js.map