@sth87/shadcn-design-system 0.1.8 → 0.2.0

package/dist/esm/lib/TextAnimation/FlipWords.js

@@ -1,71 +1,40 @@
-import { jsx as e, jsxs as k } from "react/jsx-runtime";
+import { jsx as a, jsxs as k } from "react/jsx-runtime";
 import * as t from "react";
-import { AnimatePresence as A, motion as p } from "motion/react";
-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 { AnimatePresence as A, motion as l } from "motion/react";
 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/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";
-function ei({
+function W({
   ref: d,
-  words: r,
-  duration: n = 3e3,
+  words: e,
+  duration: r = 3e3,
   letterDelay: y = 0.05,
-  wordDelay: s = 0.3,
+  wordDelay: c = 0.3,
   className: h,
   ...b
 }) {
-  const l = t.useRef(null);
+  const o = t.useRef(null);
   t.useImperativeHandle(
     d,
-    () => l.current
+    () => o.current
   );
-  const [o, x] = t.useState(r[0]), [m, c] = t.useState(!1), f = t.useCallback(() => {
-    const i = r[r.indexOf(o) + 1] || r[0];
-    x(i), c(!0);
-  }, [o, r]);
+  const [n, x] = t.useState(e[0]), [p, m] = t.useState(!1), f = t.useCallback(() => {
+    const i = e[e.indexOf(n) + 1] || e[0];
+    x(i), m(!0);
+  }, [n, e]);
   return t.useEffect(() => {
-    if (!m) {
+    if (!p) {
       const i = setTimeout(() => {
         f();
-      }, n);
+      }, r);
       return () => clearTimeout(i);
     }
-  }, [m, n, f]), /* @__PURE__ */ e("span", { ref: l, "data-slot": "flip-words", ...b, children: /* @__PURE__ */ e(
+  }, [p, r, f]), /* @__PURE__ */ a("span", { ref: o, "data-slot": "flip-words", ...b, children: /* @__PURE__ */ a(
     A,
     {
       onExitComplete: () => {
-        c(!1);
+        m(!1);
       },
-      children: /* @__PURE__ */ e(
-        p.span,
+      children: /* @__PURE__ */ a(
+        l.span,
         {
           initial: {
             opacity: 0,
@@ -92,24 +61,24 @@ function ei({
             "ds:inline-block ds:relative ds:text-left ds:px-2 ds:will-change-transform ds:will-change-opacity ds:will-change-filter",
             h
           ),
-          children: o.split(" ").map((i, a) => /* @__PURE__ */ k(
-            p.span,
+          children: n.split(" ").map((i, s) => /* @__PURE__ */ k(
+            l.span,
             {
               initial: { opacity: 0, y: 10, filter: "blur(8px)" },
               animate: { opacity: 1, y: 0, filter: "blur(0px)" },
               transition: {
-                delay: a * s,
+                delay: s * c,
                 duration: 0.3
               },
               className: "ds:inline-block ds:whitespace-nowrap",
               children: [
-                i.split("").map((g, u) => /* @__PURE__ */ e(
-                  p.span,
+                i.split("").map((g, u) => /* @__PURE__ */ a(
+                  l.span,
                   {
                     initial: { opacity: 0, y: 10, filter: "blur(8px)" },
                     animate: { opacity: 1, y: 0, filter: "blur(0px)" },
                     transition: {
-                      delay: a * s + u * y,
+                      delay: s * c + u * y,
                       duration: 0.2
                     },
                     className: "ds:inline-block ds:will-change-transform ds:will-change-opacity ds:will-change-filter",
@@ -117,18 +86,17 @@ function ei({
                   },
                   `${i}-${u}`
                 )),
-                /* @__PURE__ */ e("span", { className: "ds:inline-block", children: " " })
+                /* @__PURE__ */ a("span", { className: "ds:inline-block", children: " " })
               ]
             },
-            `${i}-${a}`
+            `${i}-${s}`
           ))
         },
-        o
+        n
       )
     }
   ) });
 }
 export {
-  ei as FlipWords
+  W as FlipWords
 };
-//# sourceMappingURL=FlipWords.js.map

package/dist/esm/lib/TextAnimation/GradientText.js

@@ -1,78 +1,47 @@
-import { jsxs as s, jsx as o } from "react/jsx-runtime";
+import { jsxs as l, jsx as n } from "react/jsx-runtime";
 import "react";
-import { motion as m } from "motion/react";
-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 d } 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/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";
-function R({
-  text: t,
-  className: p,
-  gradient: e = "linear-gradient(90deg, #3b82f6 0%, #a855f7 20%, #ec4899 50%, #a855f7 80%, #3b82f6 100%)",
-  neon: a = !1,
-  transition: r = { duration: 3, repeat: 1 / 0, ease: "linear" },
-  ...n
+import { motion as s } from "motion/react";
+import { cn as c } from "../../packages/ui/src/lib/utils.js";
+function f({
+  text: e,
+  className: r,
+  gradient: i = "linear-gradient(90deg, #3b82f6 0%, #a855f7 20%, #ec4899 50%, #a855f7 80%, #3b82f6 100%)",
+  neon: o = !1,
+  transition: t = { duration: 3, repeat: 1 / 0, ease: "linear" },
+  ...d
 }) {
-  const i = {
-    backgroundImage: e,
+  const a = {
+    backgroundImage: i,
     backgroundClip: "text",
     WebkitBackgroundClip: "text",
     backgroundSize: "200% 100%",
     color: "transparent"
   };
-  return /* @__PURE__ */ s(
+  return /* @__PURE__ */ l(
     "span",
     {
       "data-slot": "gradient-text",
-      className: d("ds:relative ds:inline-block", p),
-      ...n,
+      className: c("ds:relative ds:inline-block", r),
+      ...d,
       children: [
-        /* @__PURE__ */ o(
-          m.span,
+        /* @__PURE__ */ n(
+          s.span,
           {
             className: "ds:m-0 ds:text-transparent",
-            style: i,
+            style: a,
             animate: { backgroundPosition: ["0% 0%", "200% 0%"] },
-            transition: r,
-            children: t
+            transition: t,
+            children: e
           }
         ),
-        a && /* @__PURE__ */ o(
-          m.span,
+        o && /* @__PURE__ */ n(
+          s.span,
           {
             className: "ds:m-0 ds:absolute ds:top-0 ds:left-0 ds:text-transparent ds:blur-sm ds:mix-blend-plus-lighter",
-            style: i,
+            style: a,
             animate: { backgroundPosition: ["0% 0%", "200% 0%"] },
-            transition: r,
-            children: t
+            transition: t,
+            children: e
           }
         )
       ]
@@ -80,6 +49,5 @@ function R({
   );
 }
 export {
-  R as GradientText
+  f as GradientText
 };
-//# sourceMappingURL=GradientText.js.map

package/dist/esm/lib/TextAnimation/RollingText.js

@@ -67,4 +67,3 @@ function k({
 export {
   k as RollingText
 };
-//# sourceMappingURL=RollingText.js.map

package/dist/esm/lib/TextAnimation/RotatingText.js

@@ -1,69 +1,37 @@
-import { jsx as i } from "react/jsx-runtime";
-import * as p from "react";
-import { AnimatePresence as f, motion as y } from "motion/react";
-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 { jsx as r } from "react/jsx-runtime";
+import * as a from "react";
+import { AnimatePresence as p, motion as y } from "motion/react";
 import { cn as u } 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/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";
-function Y({
-  text: r,
-  y: t = -50,
-  duration: o = 2e3,
-  transition: e = { duration: 0.3, ease: "easeOut" },
-  containerClassName: n,
-  ...a
+function I({
+  text: e,
+  y: i = -50,
+  duration: t = 2e3,
+  transition: o = { duration: 0.3, ease: "easeOut" },
+  containerClassName: s,
+  ...c
 }) {
-  const [s, c] = p.useState(0);
-  p.useEffect(() => {
-    if (!Array.isArray(r)) return;
-    const d = setInterval(() => {
-      c((l) => (l + 1) % r.length);
-    }, o);
-    return () => clearInterval(d);
-  }, [r, o]);
-  const m = Array.isArray(r) ? r[s] : r;
-  return /* @__PURE__ */ i("div", { className: u("ds:overflow-hidden ds:py-1", n), children: /* @__PURE__ */ i(f, { mode: "wait", children: /* @__PURE__ */ i(
+  const [m, d] = a.useState(0);
+  a.useEffect(() => {
+    if (!Array.isArray(e)) return;
+    const l = setInterval(() => {
+      d((f) => (f + 1) % e.length);
+    }, t);
+    return () => clearInterval(l);
+  }, [e, t]);
+  const n = Array.isArray(e) ? e[m] : e;
+  return /* @__PURE__ */ r("div", { className: u("ds:overflow-hidden ds:py-1", s), children: /* @__PURE__ */ r(p, { mode: "wait", children: /* @__PURE__ */ r(
     y.div,
     {
-      transition: e,
-      initial: { opacity: 0, y: -t },
+      transition: o,
+      initial: { opacity: 0, y: -i },
       animate: { opacity: 1, y: 0 },
-      exit: { opacity: 0, y: t },
-      ...a,
-      children: m
+      exit: { opacity: 0, y: i },
+      ...c,
+      children: n
     },
-    m
+    n
   ) }) });
 }
 export {
-  Y as RotatingText
+  I as RotatingText
 };
-//# sourceMappingURL=RotatingText.js.map

package/dist/esm/lib/TextAnimation/ShimmeringText.js

@@ -1,71 +1,40 @@
-import { jsx as p } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import "react";
-import { motion as m } from "motion/react";
-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 { motion as i } from "motion/react";
 import { cn as d } 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/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";
-function V({
+function g({
   text: r,
-  duration: o = 1,
-  transition: e,
-  wave: i = !1,
-  className: l,
-  color: a = "var(--color-neutral-500)",
-  shimmeringColor: s = "var(--color-neutral-300)",
-  ...n
+  duration: e = 1,
+  transition: s,
+  wave: o = !1,
+  className: t,
+  color: n = "var(--color-neutral-500)",
+  shimmeringColor: c = "var(--color-neutral-300)",
+  ...p
 }) {
-  return /* @__PURE__ */ p(
-    m.span,
+  return /* @__PURE__ */ a(
+    i.span,
     {
-      className: d("ds:relative ds:inline-block ds:[perspective:500px]", l),
+      className: d("ds:relative ds:inline-block ds:[perspective:500px]", t),
       style: {
-        "--shimmering-color": s,
-        "--color": a,
+        "--shimmering-color": c,
+        "--color": n,
         color: "var(--color)"
       },
-      ...n,
-      children: r?.split("")?.map((c, t) => /* @__PURE__ */ p(
-        m.span,
+      ...p,
+      children: r?.split("")?.map((m, l) => /* @__PURE__ */ a(
+        i.span,
         {
           className: "ds:inline-block ds:whitespace-pre ds:[transform-style:preserve-3d]",
           initial: {
-            ...i ? {
+            ...o ? {
               scale: 1,
               rotateY: 0
             } : {},
             color: "var(--color)"
           },
           animate: {
-            ...i ? {
+            ...o ? {
               x: [0, 5, 0],
               y: [0, -5, 0],
               scale: [1, 1.1, 1],
@@ -74,22 +43,21 @@ function V({
             color: ["var(--color)", "var(--shimmering-color)", "var(--color)"]
           },
           transition: {
-            duration: o,
+            duration: e,
             repeat: 1 / 0,
             repeatType: "loop",
             repeatDelay: r.length * 0.05,
-            delay: t * o / r.length,
+            delay: l * e / r.length,
             ease: "easeInOut",
-            ...e
+            ...s
           },
-          children: c
+          children: m
         },
-        t
+        l
       ))
     }
   );
 }
 export {
-  V as ShimmeringText
+  g as ShimmeringText
 };
-//# sourceMappingURL=ShimmeringText.js.map

package/dist/esm/lib/TextAnimation/SplittingText.js

@@ -83,4 +83,3 @@ const o = {
 export {
   S as SplittingText
 };
-//# sourceMappingURL=SplittingText.js.map

package/dist/esm/lib/TextAnimation/TextGenerateEffect.js

@@ -1,90 +1,58 @@
-import { jsx as a, jsxs as h } from "react/jsx-runtime";
-import * as t from "react";
-import { useAnimate as y, stagger as g, motion as c } from "motion/react";
-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 { jsx as i, jsxs as h } from "react/jsx-runtime";
+import * as e from "react";
+import { useAnimate as y, stagger as g, motion as f } from "motion/react";
 import { cn as b } 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/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";
-function tt({
-  ref: l,
-  words: i,
-  className: f,
-  filter: r = !0,
-  duration: m = 0.5,
-  staggerDelay: p = 0.2,
+function w({
+  ref: m,
+  words: r,
+  className: p,
+  filter: t = !0,
+  duration: s = 0.5,
+  staggerDelay: a = 0.2,
   ...d
 }) {
-  const e = t.useRef(null);
-  t.useImperativeHandle(
-    l,
-    () => e.current
+  const o = e.useRef(null);
+  e.useImperativeHandle(
+    m,
+    () => o.current
   );
-  const [o, n] = y(), u = t.useMemo(() => i.split(" "), [i]);
-  return t.useEffect(() => {
-    o.current && n(
+  const [n, c] = y(), u = e.useMemo(() => r.split(" "), [r]);
+  return e.useEffect(() => {
+    n.current && c(
       "span",
       {
         opacity: 1,
-        filter: r ? "blur(0px)" : "none"
+        filter: t ? "blur(0px)" : "none"
       },
       {
-        duration: m,
-        delay: g(p)
+        duration: s,
+        delay: g(a)
       }
     );
-  }, [n, m, r, o, p]), /* @__PURE__ */ a(
+  }, [c, s, t, n, a]), /* @__PURE__ */ i(
     "div",
     {
-      ref: e,
-      className: b("ds:font-bold", f),
+      ref: o,
+      className: b("ds:font-bold", p),
       "data-slot": "text-generate-effect",
       ...d,
-      children: /* @__PURE__ */ a(c.div, { ref: o, children: u.map((s, x) => /* @__PURE__ */ h(
-        c.span,
+      children: /* @__PURE__ */ i(f.div, { ref: n, children: u.map((l, x) => /* @__PURE__ */ h(
+        f.span,
         {
           className: "ds:opacity-0 ds:will-change-transform ds:will-change-opacity ds:will-change-filter",
           style: {
-            filter: r ? "blur(10px)" : "none"
+            filter: t ? "blur(10px)" : "none"
           },
           children: [
-            s,
+            l,
             " "
           ]
         },
-        `${s}-${x}`
+        `${l}-${x}`
       )) })
     }
   );
 }
 export {
-  tt as TextGenerateEffect
+  w as TextGenerateEffect
 };
-//# sourceMappingURL=TextGenerateEffect.js.map

package/dist/esm/lib/TextAnimation/TextHoverEffect.js

@@ -125,4 +125,3 @@ const C = ({
 export {
   C as TextHoverEffect
 };
-//# sourceMappingURL=TextHoverEffect.js.map

package/dist/esm/lib/TextAnimation/TextPressureEffect.js

@@ -132,4 +132,3 @@ const _ = ({
 export {
   _ as default
 };
-//# sourceMappingURL=TextPressureEffect.js.map

package/dist/esm/lib/TextAnimation/TypingText.js

@@ -115,4 +115,3 @@ const B = ({
 export {
   B as default
 };
-//# sourceMappingURL=TypingText.js.map

package/dist/esm/lib/TextAnimation/WritingText.js

@@ -42,4 +42,3 @@ function I({
 export {
   I as WritingText
 };
-//# sourceMappingURL=WritingText.js.map

package/dist/esm/lib/TextAnimation/index.js

@@ -0,0 +1,28 @@
+import { default as r } from "./BlurText.js";
+import { RotatingText as x } from "./RotatingText.js";
+import { default as p } from "./CircularText.js";
+import { FlipWords as T } from "./FlipWords.js";
+import { GradientText as i } from "./GradientText.js";
+import { RollingText as n } from "./RollingText.js";
+import { ShimmeringText as u } from "./ShimmeringText.js";
+import { SplittingText as g } from "./SplittingText.js";
+import { TextGenerateEffect as E } from "./TextGenerateEffect.js";
+import { TextHoverEffect as R } from "./TextHoverEffect.js";
+import { default as W } from "./TextPressureEffect.js";
+import { default as v } from "./TypingText.js";
+import { WritingText as B } from "./WritingText.js";
+export {
+  r as BlurText,
+  p as CircularText,
+  T as FlipWords,
+  i as GradientText,
+  n as RollingText,
+  x as RotatingText,
+  u as ShimmeringText,
+  g as SplittingText,
+  E as TextGenerateEffect,
+  R as TextHoverEffect,
+  W as TextPressure,
+  v as TypingText,
+  B as WritingText
+};