@sth87/shadcn-design-system 0.0.1

package/dist/esm/hooks/use-script.js

@@ -0,0 +1,46 @@
+import { useState as v, useEffect as f } from "react";
+const s = /* @__PURE__ */ new Map();
+function m(t) {
+  const r = document.querySelector(
+    `script[src="${t}"]`
+  ), u = r?.getAttribute("data-status");
+  return {
+    node: r,
+    status: u
+  };
+}
+function p(t, r) {
+  const [u, i] = v(() => !t || r?.shouldPreventLoad ? "idle" : typeof window > "u" ? "loading" : s.get(t) ?? "loading");
+  return f(() => {
+    if (!t || r?.shouldPreventLoad)
+      return;
+    const n = s.get(t);
+    if (n === "ready" || n === "error") {
+      i(n);
+      return;
+    }
+    const c = m(t);
+    let e = c.node;
+    if (e)
+      i(c.status ?? n ?? "loading");
+    else {
+      e = document.createElement("script"), e.src = t, e.async = !0, r?.id && (e.id = r.id), e.setAttribute("data-status", "loading"), document.body.appendChild(e);
+      const a = (o) => {
+        const l = o.type === "load" ? "ready" : "error";
+        e?.setAttribute("data-status", l);
+      };
+      e.addEventListener("load", a), e.addEventListener("error", a);
+    }
+    const d = (a) => {
+      const o = a.type === "load" ? "ready" : "error";
+      i(o), s.set(t, o);
+    };
+    return e.addEventListener("load", d), e.addEventListener("error", d), () => {
+      e && (e.removeEventListener("load", d), e.removeEventListener("error", d)), e && r?.removeOnUnmount && (e.remove(), s.delete(t));
+    };
+  }, [t, r?.shouldPreventLoad, r?.removeOnUnmount, r?.id]), u;
+}
+export {
+  p as useScript
+};
+//# sourceMappingURL=use-script.js.map

package/dist/esm/hooks/use-script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-script.js","sources":["../../../src/hooks/use-script.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\ntype UseScriptStatus = \"idle\" | \"loading\" | \"ready\" | \"error\";\n\ntype UseScriptOptions = {\n  shouldPreventLoad?: boolean;\n  removeOnUnmount?: boolean;\n  id?: string;\n};\n\nconst cachedScriptStatuses = new Map<string, UseScriptStatus | undefined>();\n\nfunction getScriptNode(src: string) {\n  const node: HTMLScriptElement | null = document.querySelector(\n    `script[src=\"${src}\"]`,\n  );\n  const status = node?.getAttribute(\"data-status\") as\n    | UseScriptStatus\n    | undefined;\n  return {\n    node,\n    status,\n  };\n}\n\nexport function useScript(\n  src: string | null,\n  options?: UseScriptOptions,\n): UseScriptStatus {\n  const [status, setStatus] = useState<UseScriptStatus>(() => {\n    if (!src || options?.shouldPreventLoad) {\n      return \"idle\";\n    }\n    if (typeof window === \"undefined\") {\n      return \"loading\";\n    }\n    return cachedScriptStatuses.get(src) ?? \"loading\";\n  });\n\n  useEffect(() => {\n    if (!src || options?.shouldPreventLoad) {\n      return;\n    }\n    const cachedScriptStatus = cachedScriptStatuses.get(src);\n    if (cachedScriptStatus === \"ready\" || cachedScriptStatus === \"error\") {\n      setStatus(cachedScriptStatus);\n      return;\n    }\n    const script = getScriptNode(src);\n    let scriptNode = script.node;\n    if (!scriptNode) {\n      scriptNode = document.createElement(\"script\");\n      scriptNode.src = src;\n      scriptNode.async = true;\n      if (options?.id) {\n        scriptNode.id = options.id;\n      }\n      scriptNode.setAttribute(\"data-status\", \"loading\");\n      document.body.appendChild(scriptNode);\n      const setAttributeFromEvent = (event: Event) => {\n        const scriptStatus: UseScriptStatus =\n          event.type === \"load\" ? \"ready\" : \"error\";\n        scriptNode?.setAttribute(\"data-status\", scriptStatus);\n      };\n      scriptNode.addEventListener(\"load\", setAttributeFromEvent);\n      scriptNode.addEventListener(\"error\", setAttributeFromEvent);\n    } else {\n      setStatus(script.status ?? cachedScriptStatus ?? \"loading\");\n    }\n    const setStateFromEvent = (event: Event) => {\n      const newStatus = event.type === \"load\" ? \"ready\" : \"error\";\n      setStatus(newStatus);\n      cachedScriptStatuses.set(src, newStatus);\n    };\n    scriptNode.addEventListener(\"load\", setStateFromEvent);\n    scriptNode.addEventListener(\"error\", setStateFromEvent);\n\n    return () => {\n      if (scriptNode) {\n        scriptNode.removeEventListener(\"load\", setStateFromEvent);\n        scriptNode.removeEventListener(\"error\", setStateFromEvent);\n      }\n      if (scriptNode && options?.removeOnUnmount) {\n        scriptNode.remove();\n        cachedScriptStatuses.delete(src);\n      }\n    };\n  }, [src, options?.shouldPreventLoad, options?.removeOnUnmount, options?.id]);\n\n  return status;\n}\nexport type { UseScriptStatus, UseScriptOptions };\n"],"names":["cachedScriptStatuses","getScriptNode","src","node","status","useScript","options","setStatus","useState","useEffect","cachedScriptStatus","script","scriptNode","setAttributeFromEvent","event","scriptStatus","setStateFromEvent","newStatus"],"mappings":";AAUA,MAAMA,wBAA2B,IAAA;AAEjC,SAASC,EAAcC,GAAa;AAClC,QAAMC,IAAiC,SAAS;AAAA,IAC9C,eAAeD,CAAG;AAAA,EAAA,GAEdE,IAASD,GAAM,aAAa,aAAa;AAG/C,SAAO;AAAA,IACL,MAAAA;AAAA,IACA,QAAAC;AAAA,EAAA;AAEJ;AAEO,SAASC,EACdH,GACAI,GACiB;AACjB,QAAM,CAACF,GAAQG,CAAS,IAAIC,EAA0B,MAChD,CAACN,KAAOI,GAAS,oBACZ,SAEL,OAAO,SAAW,MACb,YAEFN,EAAqB,IAAIE,CAAG,KAAK,SACzC;AAED,SAAAO,EAAU,MAAM;AACd,QAAI,CAACP,KAAOI,GAAS;AACnB;AAEF,UAAMI,IAAqBV,EAAqB,IAAIE,CAAG;AACvD,QAAIQ,MAAuB,WAAWA,MAAuB,SAAS;AACpE,MAAAH,EAAUG,CAAkB;AAC5B;AAAA,IACF;AACA,UAAMC,IAASV,EAAcC,CAAG;AAChC,QAAIU,IAAaD,EAAO;AACxB,QAAKC;AAiBH,MAAAL,EAAUI,EAAO,UAAUD,KAAsB,SAAS;AAAA,SAjB3C;AACf,MAAAE,IAAa,SAAS,cAAc,QAAQ,GAC5CA,EAAW,MAAMV,GACjBU,EAAW,QAAQ,IACfN,GAAS,OACXM,EAAW,KAAKN,EAAQ,KAE1BM,EAAW,aAAa,eAAe,SAAS,GAChD,SAAS,KAAK,YAAYA,CAAU;AACpC,YAAMC,IAAwB,CAACC,MAAiB;AAC9C,cAAMC,IACJD,EAAM,SAAS,SAAS,UAAU;AACpC,QAAAF,GAAY,aAAa,eAAeG,CAAY;AAAA,MACtD;AACA,MAAAH,EAAW,iBAAiB,QAAQC,CAAqB,GACzDD,EAAW,iBAAiB,SAASC,CAAqB;AAAA,IAC5D;AAGA,UAAMG,IAAoB,CAACF,MAAiB;AAC1C,YAAMG,IAAYH,EAAM,SAAS,SAAS,UAAU;AACpD,MAAAP,EAAUU,CAAS,GACnBjB,EAAqB,IAAIE,GAAKe,CAAS;AAAA,IACzC;AACA,WAAAL,EAAW,iBAAiB,QAAQI,CAAiB,GACrDJ,EAAW,iBAAiB,SAASI,CAAiB,GAE/C,MAAM;AACX,MAAIJ,MACFA,EAAW,oBAAoB,QAAQI,CAAiB,GACxDJ,EAAW,oBAAoB,SAASI,CAAiB,IAEvDJ,KAAcN,GAAS,oBACzBM,EAAW,OAAA,GACXZ,EAAqB,OAAOE,CAAG;AAAA,IAEnC;AAAA,EACF,GAAG,CAACA,GAAKI,GAAS,mBAAmBA,GAAS,iBAAiBA,GAAS,EAAE,CAAC,GAEpEF;AACT;"}

package/dist/esm/hooks/use-scroll-lock.js

@@ -0,0 +1,27 @@
+import { useState as w, useRef as d, useCallback as s } from "react";
+import { useIsomorphicLayoutEffect as R } from "./use-isomorphic-layout-effect.js";
+const m = typeof window > "u";
+function L(l = {}) {
+  const { autoLock: u = !0, lockTarget: e, widthReflow: r = !0 } = l, [f, i] = w(!1), t = d(null), n = d(null), o = s(() => {
+    if (t.current) {
+      const { overflow: a, paddingRight: g } = t.current.style;
+      if (n.current = { overflow: a, paddingRight: g }, r) {
+        const h = t.current === document.body ? window.innerWidth : t.current.offsetWidth, p = parseInt(window.getComputedStyle(t.current).paddingRight, 10) || 0, y = h - t.current.scrollWidth;
+        t.current.style.paddingRight = `${y + p}px`;
+      }
+      t.current.style.overflow = "hidden", i(!0);
+    }
+  }, [r]), c = s(() => {
+    t.current && n.current && (t.current.style.overflow = n.current.overflow, r && (t.current.style.paddingRight = n.current.paddingRight)), i(!1);
+  }, [r]);
+  return R(() => {
+    if (!m)
+      return e && (t.current = typeof e == "string" ? document.querySelector(e) : e), t.current || (t.current = document.body), u && o(), () => {
+        c();
+      };
+  }, [u, e, r, o, c]), { isLocked: f, lock: o, unlock: c };
+}
+export {
+  L as useScrollLock
+};
+//# sourceMappingURL=use-scroll-lock.js.map

package/dist/esm/hooks/use-scroll-lock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-scroll-lock.js","sources":["../../../src/hooks/use-scroll-lock.ts"],"sourcesContent":["\"use client\";\nimport { useRef, useState, useCallback } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"./use-isomorphic-layout-effect\";\n\ntype UseScrollLockOptions = {\n  autoLock?: boolean;\n  lockTarget?: HTMLElement | string | null;\n  widthReflow?: boolean;\n};\n\ntype UseScrollLockReturn = {\n  isLocked: boolean;\n  lock: () => void;\n  unlock: () => void;\n};\n\ntype OriginalStyle = {\n  overflow: CSSStyleDeclaration[\"overflow\"];\n  paddingRight: CSSStyleDeclaration[\"paddingRight\"];\n};\n\nconst IS_SERVER = typeof window === \"undefined\";\n\nexport function useScrollLock(\n  options: UseScrollLockOptions = {},\n): UseScrollLockReturn {\n  const { autoLock = true, lockTarget, widthReflow = true } = options;\n  const [isLocked, setIsLocked] = useState(false);\n  const target = useRef<HTMLElement | null>(null);\n  const originalStyle = useRef<OriginalStyle | null>(null);\n\n  const lock = useCallback(() => {\n    if (target.current) {\n      const { overflow, paddingRight } = target.current.style;\n      // Save the original styles\n      originalStyle.current = { overflow, paddingRight };\n      // Prevent width reflow\n      if (widthReflow) {\n        // Use window inner width if body is the target as global scrollbar isn't part of the document\n        const offsetWidth =\n          target.current === document.body\n            ? window.innerWidth\n            : target.current.offsetWidth;\n        // Get current computed padding right in pixels\n        const currentPaddingRight =\n          parseInt(window.getComputedStyle(target.current).paddingRight, 10) ||\n          0;\n        const scrollbarWidth = offsetWidth - target.current.scrollWidth;\n        target.current.style.paddingRight = `${scrollbarWidth + currentPaddingRight}px`;\n      }\n      // Lock the scroll\n      target.current.style.overflow = \"hidden\";\n      setIsLocked(true);\n    }\n  }, [widthReflow]);\n\n  const unlock = useCallback(() => {\n    if (target.current && originalStyle.current) {\n      target.current.style.overflow = originalStyle.current.overflow;\n      // Only reset padding right if we changed it\n      if (widthReflow) {\n        target.current.style.paddingRight = originalStyle.current.paddingRight;\n      }\n    }\n    setIsLocked(false);\n  }, [widthReflow]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (IS_SERVER) return;\n    // Re-find the target element each time\n    if (lockTarget) {\n      target.current =\n        typeof lockTarget === \"string\"\n          ? document.querySelector(lockTarget)\n          : lockTarget;\n    }\n    if (!target.current) {\n      target.current = document.body;\n    }\n    if (autoLock) {\n      lock();\n    }\n    return () => {\n      unlock();\n    };\n  }, [autoLock, lockTarget, widthReflow, lock, unlock]);\n\n  return { isLocked, lock, unlock };\n}\nexport type { UseScrollLockOptions, UseScrollLockReturn };\n"],"names":["IS_SERVER","useScrollLock","options","autoLock","lockTarget","widthReflow","isLocked","setIsLocked","useState","target","useRef","originalStyle","lock","useCallback","overflow","paddingRight","offsetWidth","currentPaddingRight","scrollbarWidth","unlock","useIsomorphicLayoutEffect"],"mappings":";;AAqBA,MAAMA,IAAY,OAAO,SAAW;AAE7B,SAASC,EACdC,IAAgC,IACX;AACrB,QAAM,EAAE,UAAAC,IAAW,IAAM,YAAAC,GAAY,aAAAC,IAAc,OAASH,GACtD,CAACI,GAAUC,CAAW,IAAIC,EAAS,EAAK,GACxCC,IAASC,EAA2B,IAAI,GACxCC,IAAgBD,EAA6B,IAAI,GAEjDE,IAAOC,EAAY,MAAM;AAC7B,QAAIJ,EAAO,SAAS;AAClB,YAAM,EAAE,UAAAK,GAAU,cAAAC,EAAA,IAAiBN,EAAO,QAAQ;AAIlD,UAFAE,EAAc,UAAU,EAAE,UAAAG,GAAU,cAAAC,EAAA,GAEhCV,GAAa;AAEf,cAAMW,IACJP,EAAO,YAAY,SAAS,OACxB,OAAO,aACPA,EAAO,QAAQ,aAEfQ,IACJ,SAAS,OAAO,iBAAiBR,EAAO,OAAO,EAAE,cAAc,EAAE,KACjE,GACIS,IAAiBF,IAAcP,EAAO,QAAQ;AACpD,QAAAA,EAAO,QAAQ,MAAM,eAAe,GAAGS,IAAiBD,CAAmB;AAAA,MAC7E;AAEA,MAAAR,EAAO,QAAQ,MAAM,WAAW,UAChCF,EAAY,EAAI;AAAA,IAClB;AAAA,EACF,GAAG,CAACF,CAAW,CAAC,GAEVc,IAASN,EAAY,MAAM;AAC/B,IAAIJ,EAAO,WAAWE,EAAc,YAClCF,EAAO,QAAQ,MAAM,WAAWE,EAAc,QAAQ,UAElDN,MACFI,EAAO,QAAQ,MAAM,eAAeE,EAAc,QAAQ,gBAG9DJ,EAAY,EAAK;AAAA,EACnB,GAAG,CAACF,CAAW,CAAC;AAEhB,SAAAe,EAA0B,MAAM;AAC9B,QAAI,CAAApB;AAEJ,aAAII,MACFK,EAAO,UACL,OAAOL,KAAe,WAClB,SAAS,cAAcA,CAAU,IACjCA,IAEHK,EAAO,YACVA,EAAO,UAAU,SAAS,OAExBN,KACFS,EAAA,GAEK,MAAM;AACX,QAAAO,EAAA;AAAA,MACF;AAAA,EACF,GAAG,CAAChB,GAAUC,GAAYC,GAAaO,GAAMO,CAAM,CAAC,GAE7C,EAAE,UAAAb,GAAU,MAAAM,GAAM,QAAAO,EAAA;AAC3B;"}

package/dist/esm/index.js

@@ -0,0 +1,223 @@
+import { Command as o } from "./components/Command/index.js";
+import { Popover as a } from "./components/Popover/index.js";
+import { Tour as f } from "./components/Tour/index.js";
+import { QRCode as x, QRCode as u } from "./components/QrCode/index.js";
+import { Stepper as s } from "./components/Stepper/index.js";
+import { Pagination as i } from "./components/Pagination/index.js";
+import { DropdownMenu as b } from "./components/DropdownMenu/index.js";
+import { ContextMenu as T } from "./components/ContextMenu/index.js";
+import { FloatingLabel as c } from "./components/FloatLabel.js";
+import { TimeGridView as I } from "./components/TimeGridView.js";
+import { TimeColumnwheel as M } from "./components/WheelColumn.js";
+import { Marquee as w } from "./components/Marquee/index.js";
+import { cn as G } from "@dsui/ui";
+import { useCallbackRef as B } from "./hooks/use-callback-ref.js";
+import { useDebouncedCallback as v } from "./hooks/use-debounced-callback.js";
+import { useDebounceValue as y } from "./hooks/use-debounced-value.js";
+import { useIntersectionObserver as D } from "./hooks/use-intersection-observer.js";
+import { useScript as E } from "./hooks/use-script.js";
+import { useScrollLock as O } from "./hooks/use-scroll-lock.js";
+import { useOnClickOutside as H } from "./hooks/use-on-click-outside.js";
+import { useEventListener as N } from "./hooks/use-event-listener.js";
+import { useMediaQuery as U } from "./hooks/use-media-query.js";
+import { default as j } from "./components/Badge/Badge.js";
+import { default as K } from "./components/Breadcrumb/Breadcrumb.js";
+import { default as Y } from "./components/Button/Button.js";
+import { default as $ } from "./components/Button/ButtonGroup.js";
+import { default as re } from "./components/Checkbox/Checkbox.js";
+import { default as te } from "./components/Collapsible/Collapsible.js";
+import { default as pe } from "./components/Dialog/Dialog.js";
+import { default as me } from "./components/Glass/Glass.js";
+import { default as ue } from "./components/Input/Input.js";
+import { default as se } from "./components/InputOTP/InputOTP.js";
+import { default as ie } from "./components/Radio/Radio.js";
+import { ScrollArea as be } from "./components/ScrollArea/ScrollArea.js";
+import { default as Te } from "./components/Select/Select.js";
+import { default as ce } from "./components/Separator/Separator.js";
+import { default as Ie } from "./components/Sheet/Sheet.js";
+import { default as Me } from "./components/Skeleton/Skeleton.js";
+import { default as we } from "./components/Slider/Slider.js";
+import { default as Ge } from "./components/Switch/Switch.js";
+import { default as Be } from "./components/Tabs/Tabs.js";
+import { default as ve } from "./components/Textarea/Textarea.js";
+import { default as ye } from "./components/Toggle/Toggle.js";
+import { default as De } from "./components/Rate/Rate.js";
+import { Handle as Ee, Panel as Le, default as Oe, ResizableWrapper as Qe } from "./components/Resizable/Resizable.js";
+import { default as We } from "./components/Accordion/Accordion.js";
+import { default as qe } from "./lib/TextAnimation/BlurText.js";
+import { default as _e } from "./lib/TextAnimation/CircularText.js";
+import { default as Je } from "./lib/TextAnimation/TextPressureEffect.js";
+import { default as Xe } from "./lib/TextAnimation/TypingText.js";
+import { DataTable as Ze } from "./components/Table/data-table.js";
+import { Avatar as er } from "./components/Avatar/Avatar.js";
+import { Calendar as or } from "./components/Calendar/Calendar.js";
+import { DatePicker as ar } from "./components/DatePicker/DatePicker.js";
+import { RangePicker as fr } from "./components/DatePicker/RangePicker.js";
+import { TimePicker as xr } from "./components/DatePicker/TimePicker.js";
+import { Label as lr, TreeView as sr } from "@dsui/ui/index";
+import { useSidebar as ir } from "@dsui/ui/components/sidebar";
+import { Sidebar as br, SidebarContent as Sr, SidebarFooter as Tr, SidebarGroup as Cr, SidebarGroupAction as cr, SidebarGroupContent as gr, SidebarGroupLabel as Ir, SidebarHeader as Rr, SidebarInput as Mr, SidebarInset as Pr, SidebarMenu as wr, SidebarMenuAction as Ar, SidebarMenuBadge as Gr, SidebarMenuButton as kr, SidebarMenuItem as Br, SidebarMenuSkeleton as Vr, SidebarMenuSub as vr, SidebarMenuSubButton as hr, SidebarMenuSubItem as yr, SidebarProvider as zr, SidebarRail as Dr, SidebarSeparator as Fr, SidebarTrigger as Er } from "./components/Sidebar/Sidebar.js";
+import { toast as Or, Toaster as Qr, toast as Hr } from "./components/Toast/Toast.js";
+import { Tooltip as Nr } from "./components/Tooltip/Tooltip.js";
+import { Upload as Ur } from "./components/Upload/Upload.js";
+import { useQRCode as jr } from "./components/QrCode/QrCode.js";
+import { useStepper as Kr } from "./components/Stepper/Stepper.js";
+import { ResizableHandle as Yr, ResizablePanel as Zr, ResizablePanelGroup as $r } from "@dsui/ui/components/resizable";
+import { AccordionContent as ro, AccordionItem as oo, AccordionTrigger as to } from "@dsui/ui/components/accordion";
+import { ImageViewer as po, ImageViewerGroup as fo, ImageViewerImage as mo } from "./components/ImageViewer/ImageViewer.js";
+import { Carousel as uo, CarouselSlide as lo } from "./components/Carousel/Carousel.js";
+import { Root as io, Area as no, Image as bo, Video as So, useCropper as To } from "./components/Cropper/Cropper.js";
+import { CropperTool as co, useCropperTool as go } from "./components/Cropper/CropperTool.js";
+import { base64ToBlob as Ro, base64ToFile as Mo, downloadImage as Po, getCroppedImg as wo, rotateSize as Ao } from "./components/Cropper/utils.js";
+import { Cursor as ko, CursorFollow as Bo, CursorProvider as Vo, TRANSITION_PRESETS as vo, useCursor as ho, useCursorFollow as yo } from "./components/Interactive/CursorFollow.js";
+import { Item as Do, MasonryItem as Fo, MasonryRoot as Eo, Root as Lo } from "./components/Masonry/Masonry.js";
+import { Masonry as Qo, MasonryComponent as Ho } from "./components/Masonry/MasonryWrapper.js";
+import { RotatingText as No } from "./lib/TextAnimation/RotatingText.js";
+import { FlipWords as Uo } from "./lib/TextAnimation/FlipWords.js";
+import { GradientText as jo } from "./lib/TextAnimation/GradientText.js";
+import { RollingText as Ko } from "./lib/TextAnimation/RollingText.js";
+import { ShimmeringText as Yo } from "./lib/TextAnimation/ShimmeringText.js";
+import { SplittingText as $o } from "./lib/TextAnimation/SplittingText.js";
+import { TextGenerateEffect as rt } from "./lib/TextAnimation/TextGenerateEffect.js";
+import { TextHoverEffect as tt } from "./lib/TextAnimation/TextHoverEffect.js";
+import { WritingText as pt } from "./lib/TextAnimation/WritingText.js";
+export {
+  We as Accordion,
+  ro as AccordionContent,
+  oo as AccordionItem,
+  to as AccordionTrigger,
+  er as Avatar,
+  j as Badge,
+  qe as BlurText,
+  K as Breadcrumb,
+  Y as Button,
+  $ as ButtonGroup,
+  or as Calendar,
+  uo as Carousel,
+  lo as CarouselSlide,
+  re as Checkbox,
+  _e as CircularText,
+  te as Collapsible,
+  o as Command,
+  T as ContextMenu,
+  io as Cropper,
+  no as CropperArea,
+  bo as CropperImage,
+  co as CropperTool,
+  So as CropperVideo,
+  ko as Cursor,
+  Bo as CursorFollow,
+  Vo as CursorProvider,
+  ar as DatePicker,
+  pe as Dialog,
+  b as DropdownMenu,
+  Uo as FlipWords,
+  c as FloatingLabel,
+  me as Glass,
+  jo as GradientText,
+  Ee as Handle,
+  po as ImageViewer,
+  fo as ImageViewerGroup,
+  mo as ImageViewerImage,
+  ue as Input,
+  se as InputOTP,
+  Do as Item,
+  lr as Label,
+  w as Marquee,
+  Qo as Masonry,
+  Ho as MasonryComponent,
+  Fo as MasonryItem,
+  Eo as MasonryRoot,
+  i as Pagination,
+  Le as Panel,
+  a as Popover,
+  x as QRCode,
+  u as QrCode,
+  ie as Radio,
+  fr as RangePicker,
+  De as Rate,
+  Oe as Resizable,
+  Yr as ResizableHandle,
+  Zr as ResizablePanel,
+  $r as ResizablePanelGroup,
+  Qe as ResizableWrapper,
+  Ko as RollingText,
+  Lo as Root,
+  No as RotatingText,
+  be as ScrollArea,
+  Te as Select,
+  ce as Separator,
+  Ie as Sheet,
+  Yo as ShimmeringText,
+  br as Sidebar,
+  Sr as SidebarContent,
+  Tr as SidebarFooter,
+  Cr as SidebarGroup,
+  cr as SidebarGroupAction,
+  gr as SidebarGroupContent,
+  Ir as SidebarGroupLabel,
+  Rr as SidebarHeader,
+  Mr as SidebarInput,
+  Pr as SidebarInset,
+  wr as SidebarMenu,
+  Ar as SidebarMenuAction,
+  Gr as SidebarMenuBadge,
+  kr as SidebarMenuButton,
+  Br as SidebarMenuItem,
+  Vr as SidebarMenuSkeleton,
+  vr as SidebarMenuSub,
+  hr as SidebarMenuSubButton,
+  yr as SidebarMenuSubItem,
+  zr as SidebarProvider,
+  Dr as SidebarRail,
+  Fr as SidebarSeparator,
+  Er as SidebarTrigger,
+  Me as Skeleton,
+  we as Slider,
+  $o as SplittingText,
+  s as Stepper,
+  Ge as Switch,
+  vo as TRANSITION_PRESETS,
+  Ze as Table,
+  Be as Tabs,
+  rt as TextGenerateEffect,
+  tt as TextHoverEffect,
+  Je as TextPressure,
+  ve as Textarea,
+  I as TimeGridView,
+  xr as TimePicker,
+  Or as Toast,
+  Qr as Toaster,
+  ye as Toggle,
+  Nr as Tooltip,
+  f as Tour,
+  sr as TreeSelect,
+  Xe as TypingText,
+  Ur as Upload,
+  M as WheelColumn,
+  pt as WritingText,
+  Ro as base64ToBlob,
+  Mo as base64ToFile,
+  G as cn,
+  Po as downloadImage,
+  wo as getCroppedImg,
+  Ao as rotateSize,
+  Hr as toast,
+  B as useCallbackRef,
+  To as useCropper,
+  go as useCropperTool,
+  ho as useCursor,
+  yo as useCursorFollow,
+  y as useDebounceValue,
+  v as useDebouncedCallback,
+  N as useEventListener,
+  D as useIntersectionObserver,
+  U as useMediaQuery,
+  H as useOnClickOutside,
+  jr as useQRCode,
+  E as useScript,
+  O as useScrollLock,
+  ir as useSidebar,
+  Kr as useStepper
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -0,0 +1,84 @@
+import { jsx as T, jsxs as A } from "react/jsx-runtime";
+import { motion as E } from "motion/react";
+import { useState as K, useRef as V, useEffect as D, useMemo as y } from "react";
+const F = (s, a) => {
+  const p = /* @__PURE__ */ new Set([
+    ...Object.keys(s),
+    ...a.flatMap((t) => Object.keys(t))
+  ]), n = {};
+  return p.forEach((t) => {
+    n[t] = [s[t], ...a.map((l) => l[t])];
+  }), n;
+}, _ = ({
+  text: s = "",
+  delay: a = 200,
+  className: p = "",
+  animateBy: n = "words",
+  direction: t = "top",
+  threshold: l = 0.1,
+  rootMargin: f = "0px",
+  animationFrom: b,
+  animationTo: w,
+  easing: h = (o) => o,
+  onAnimationComplete: x,
+  stepDuration: d = 0.35
+}) => {
+  const o = n === "words" ? s.split(" ") : s.split(""), [v, g] = K(!1), i = V(null);
+  D(() => {
+    if (!i.current) return;
+    const r = new IntersectionObserver(
+      ([e]) => {
+        e.isIntersecting && (g(!0), r.unobserve(i.current));
+      },
+      { threshold: l, rootMargin: f }
+    );
+    return r.observe(i.current), () => r.disconnect();
+  }, [l, f]);
+  const j = y(
+    () => t === "top" ? { filter: "blur(10px)", opacity: 0, y: -50 } : { filter: "blur(10px)", opacity: 0, y: 50 },
+    [t]
+  ), S = y(
+    () => [
+      {
+        filter: "blur(5px)",
+        opacity: 0.5,
+        y: t === "top" ? 5 : -5
+      },
+      { filter: "blur(0px)", opacity: 1, y: 0 }
+    ],
+    [t]
+  ), u = b ?? j, m = w ?? S, c = m.length + 1, k = d * (c - 1), C = Array.from(
+    { length: c },
+    (r, e) => c === 1 ? 0 : e / (c - 1)
+  );
+  return /* @__PURE__ */ T("p", { ref: i, className: `blur-text ${p} flex flex-wrap`, children: o.map((r, e) => {
+    const I = F(u, m), O = {
+      duration: k,
+      times: C,
+      delay: e * a / 1e3,
+      ease: h
+    };
+    return /* @__PURE__ */ A(
+      E.span,
+      {
+        initial: u,
+        animate: v ? I : u,
+        transition: O,
+        onAnimationComplete: e === o.length - 1 ? x : void 0,
+        style: {
+          display: "inline-block",
+          willChange: "transform, filter, opacity"
+        },
+        children: [
+          r === " " ? " " : r,
+          n === "words" && e < o.length - 1 && " "
+        ]
+      },
+      e
+    );
+  }) });
+};
+export {
+  _ as default
+};
+//# sourceMappingURL=BlurText.js.map

package/dist/esm/lib/TextAnimation/BlurText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlurText.js","sources":["../../../../src/lib/TextAnimation/BlurText.tsx"],"sourcesContent":["\"use client\";\nimport { motion, type Transition, type Easing } from \"motion/react\";\nimport { useEffect, useRef, useState, useMemo } from \"react\";\ntype BlurTextProps = {\n  text?: string;\n  delay?: number;\n  className?: string;\n  animateBy?: \"words\" | \"letters\";\n  direction?: \"top\" | \"bottom\";\n  threshold?: number;\n  rootMargin?: string;\n  animationFrom?: Record<string, string | number>;\n  animationTo?: Array<Record<string, string | number>>;\n  easing?: Easing | Easing[];\n  onAnimationComplete?: () => void;\n  stepDuration?: number;\n};\nconst buildKeyframes = (\n  from: Record<string, string | number>,\n  steps: Array<Record<string, string | number>>,\n): Record<string, Array<string | number>> => {\n  const keys = new Set<string>([\n    ...Object.keys(from),\n    ...steps.flatMap((s) => Object.keys(s)),\n  ]);\n  const keyframes: Record<string, Array<string | number>> = {};\n  keys.forEach((k) => {\n    keyframes[k] = [from[k], ...steps.map((s) => s[k])];\n  });\n  return keyframes;\n};\nconst BlurText: React.FC<BlurTextProps> = ({\n  text = \"\",\n  delay = 200,\n  className = \"\",\n  animateBy = \"words\",\n  direction = \"top\",\n  threshold = 0.1,\n  rootMargin = \"0px\",\n  animationFrom,\n  animationTo,\n  easing = (t: number) => t,\n  onAnimationComplete,\n  stepDuration = 0.35,\n}) => {\n  const elements = animateBy === \"words\" ? text.split(\" \") : text.split(\"\");\n  const [inView, setInView] = useState(false);\n  const ref = useRef<HTMLParagraphElement>(null);\n  useEffect(() => {\n    if (!ref.current) return;\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry.isIntersecting) {\n          setInView(true);\n          observer.unobserve(ref.current as Element);\n        }\n      },\n      { threshold, rootMargin },\n    );\n    observer.observe(ref.current);\n    return () => observer.disconnect();\n  }, [threshold, rootMargin]);\n  const defaultFrom = useMemo(\n    () =>\n      direction === \"top\"\n        ? { filter: \"blur(10px)\", opacity: 0, y: -50 }\n        : { filter: \"blur(10px)\", opacity: 0, y: 50 },\n    [direction],\n  );\n  const defaultTo = useMemo(\n    () => [\n      {\n        filter: \"blur(5px)\",\n        opacity: 0.5,\n        y: direction === \"top\" ? 5 : -5,\n      },\n      { filter: \"blur(0px)\", opacity: 1, y: 0 },\n    ],\n    [direction],\n  );\n  const fromSnapshot = animationFrom ?? defaultFrom;\n  const toSnapshots = animationTo ?? defaultTo;\n  const stepCount = toSnapshots.length + 1;\n  const totalDuration = stepDuration * (stepCount - 1);\n  const times = Array.from({ length: stepCount }, (_, i) =>\n    stepCount === 1 ? 0 : i / (stepCount - 1),\n  );\n  return (\n    <p ref={ref} className={`blur-text ${className} flex flex-wrap`}>\n      {elements.map((segment, index) => {\n        const animateKeyframes = buildKeyframes(fromSnapshot, toSnapshots);\n        const spanTransition: Transition = {\n          duration: totalDuration,\n          times,\n          delay: (index * delay) / 1000,\n          ease: easing,\n        };\n        return (\n          <motion.span\n            key={index}\n            initial={fromSnapshot}\n            animate={inView ? animateKeyframes : fromSnapshot}\n            transition={spanTransition}\n            onAnimationComplete={\n              index === elements.length - 1 ? onAnimationComplete : undefined\n            }\n            style={{\n              display: \"inline-block\",\n              willChange: \"transform, filter, opacity\",\n            }}\n          >\n            {segment === \" \" ? \"\\u00A0\" : segment}\n            {animateBy === \"words\" && index < elements.length - 1 && \"\\u00A0\"}\n          </motion.span>\n        );\n      })}\n    </p>\n  );\n};\nexport default BlurText;\n"],"names":["buildKeyframes","from","steps","keys","s","keyframes","k","BlurText","text","delay","className","animateBy","direction","threshold","rootMargin","animationFrom","animationTo","easing","t","onAnimationComplete","stepDuration","elements","inView","setInView","useState","ref","useRef","useEffect","observer","entry","defaultFrom","useMemo","defaultTo","fromSnapshot","toSnapshots","stepCount","totalDuration","times","_","i","jsx","segment","index","animateKeyframes","spanTransition","jsxs","motion"],"mappings":"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"}

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

@@ -0,0 +1,96 @@
+import { jsx as d } from "react/jsx-runtime";
+import { useEffect as h } from "react";
+import { useAnimation as y, useMotionValue as k, motion as w } from "motion/react";
+const M = (a, e, r = !0) => ({
+  from: e,
+  to: e + 360,
+  ease: "linear",
+  duration: a,
+  type: "tween",
+  repeat: r ? 1 / 0 : 0
+}), n = (a, e) => ({
+  rotate: M(a, e),
+  scale: {
+    type: "spring",
+    damping: 20,
+    stiffness: 300
+  }
+}), E = ({
+  text: a,
+  spinDuration: e = 20,
+  onHover: r = "speedUp",
+  className: g = ""
+}) => {
+  const l = Array.from(a), o = y(), i = k(0);
+  h(() => {
+    const t = i.get();
+    o.start({
+      rotate: t + 360,
+      scale: 1,
+      transition: n(e, t)
+    });
+  }, [e, a, r, o, i]);
+  const m = () => {
+    const t = i.get();
+    if (!r) return;
+    let s, c = 1;
+    switch (r) {
+      case "slowDown":
+        s = n(e * 2, t);
+        break;
+      case "speedUp":
+        s = n(e / 4, t);
+        break;
+      case "pause":
+        s = {
+          rotate: { type: "spring", damping: 20, stiffness: 300 },
+          scale: { type: "spring", damping: 20, stiffness: 300 }
+        };
+        break;
+      case "goBonkers":
+        s = n(e / 20, t), c = 0.8;
+        break;
+      default:
+        s = n(e, t);
+    }
+    o.start({
+      rotate: t + 360,
+      scale: c,
+      transition: s
+    });
+  }, u = () => {
+    const t = i.get();
+    o.start({
+      rotate: t + 360,
+      scale: 1,
+      transition: n(e, t)
+    });
+  };
+  return /* @__PURE__ */ d(
+    w.div,
+    {
+      className: `m-0 mx-auto rounded-full w-[200px] h-[200px] relative font-black text-foreground text-center cursor-pointer origin-center ${g}`,
+      style: { rotate: i },
+      initial: { rotate: 0 },
+      animate: o,
+      onMouseEnter: m,
+      onMouseLeave: u,
+      children: l.map((t, s) => {
+        const c = 360 / l.length * s, f = Math.PI / l.length, x = f * s, b = f * s, p = `rotateZ(${c}deg) translate3d(${x}px, ${b}px, 0)`;
+        return /* @__PURE__ */ d(
+          "span",
+          {
+            className: "absolute inline-block inset-0 text-2xl transition-all duration-500 ease-[cubic-bezier(0,0,0,1)]",
+            style: { transform: p, WebkitTransform: p },
+            children: t
+          },
+          s
+        );
+      })
+    }
+  );
+};
+export {
+  E as default
+};
+//# sourceMappingURL=CircularText.js.map

package/dist/esm/lib/TextAnimation/CircularText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CircularText.js","sources":["../../../../src/lib/TextAnimation/CircularText.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect } from \"react\";\nimport {\n  motion,\n  useAnimation,\n  useMotionValue,\n  MotionValue,\n  type Transition,\n} from \"motion/react\";\n\ninterface CircularTextProps {\n  text: string;\n  spinDuration?: number;\n  onHover?: \"slowDown\" | \"speedUp\" | \"pause\" | \"goBonkers\";\n  className?: string;\n}\n\nconst getRotationTransition = (\n  duration: number,\n  from: number,\n  loop: boolean = true,\n) => ({\n  from,\n  to: from + 360,\n  ease: \"linear\" as const,\n  duration,\n  type: \"tween\" as const,\n  repeat: loop ? Infinity : 0,\n});\n\nconst getTransition = (duration: number, from: number) => ({\n  rotate: getRotationTransition(duration, from),\n  scale: {\n    type: \"spring\" as const,\n    damping: 20,\n    stiffness: 300,\n  },\n});\n\nconst CircularText: React.FC<CircularTextProps> = ({\n  text,\n  spinDuration = 20,\n  onHover = \"speedUp\",\n  className = \"\",\n}) => {\n  const letters = Array.from(text);\n  const controls = useAnimation();\n  const rotation: MotionValue<number> = useMotionValue(0);\n  useEffect(() => {\n    const start = rotation.get();\n    controls.start({\n      rotate: start + 360,\n      scale: 1,\n      transition: getTransition(spinDuration, start),\n    });\n  }, [spinDuration, text, onHover, controls, rotation]);\n  const handleHoverStart = () => {\n    const start = rotation.get();\n    if (!onHover) return;\n    let transitionConfig: ReturnType<typeof getTransition> | Transition;\n    let scaleVal = 1;\n    switch (onHover) {\n      case \"slowDown\":\n        transitionConfig = getTransition(spinDuration * 2, start);\n        break;\n      case \"speedUp\":\n        transitionConfig = getTransition(spinDuration / 4, start);\n        break;\n      case \"pause\":\n        transitionConfig = {\n          rotate: { type: \"spring\", damping: 20, stiffness: 300 },\n          scale: { type: \"spring\", damping: 20, stiffness: 300 },\n        };\n        break;\n      case \"goBonkers\":\n        transitionConfig = getTransition(spinDuration / 20, start);\n        scaleVal = 0.8;\n        break;\n      default:\n        transitionConfig = getTransition(spinDuration, start);\n    }\n    controls.start({\n      rotate: start + 360,\n      scale: scaleVal,\n      transition: transitionConfig,\n    });\n  };\n  const handleHoverEnd = () => {\n    const start = rotation.get();\n    controls.start({\n      rotate: start + 360,\n      scale: 1,\n      transition: getTransition(spinDuration, start),\n    });\n  };\n  return (\n    <motion.div\n      className={`m-0 mx-auto rounded-full w-[200px] h-[200px] relative font-black text-foreground text-center cursor-pointer origin-center ${className}`}\n      style={{ rotate: rotation }}\n      initial={{ rotate: 0 }}\n      animate={controls}\n      onMouseEnter={handleHoverStart}\n      onMouseLeave={handleHoverEnd}\n    >\n      {letters.map((letter, i) => {\n        const rotationDeg = (360 / letters.length) * i;\n        const factor = Math.PI / letters.length;\n        const x = factor * i;\n        const y = factor * i;\n        const transform = `rotateZ(${rotationDeg}deg) translate3d(${x}px, ${y}px, 0)`;\n        return (\n          <span\n            key={i}\n            className=\"absolute inline-block inset-0 text-2xl transition-all duration-500 ease-[cubic-bezier(0,0,0,1)]\"\n            style={{ transform, WebkitTransform: transform }}\n          >\n            {letter}\n          </span>\n        );\n      })}\n    </motion.div>\n  );\n};\n\nexport default CircularText;\n"],"names":["getRotationTransition","duration","from","loop","getTransition","CircularText","text","spinDuration","onHover","className","letters","controls","useAnimation","rotation","useMotionValue","useEffect","start","handleHoverStart","transitionConfig","scaleVal","handleHoverEnd","jsx","motion","letter","i","rotationDeg","factor","y","transform"],"mappings":"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"}

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

@@ -0,0 +1,103 @@
+import { jsx as a, jsxs as k } from "react/jsx-runtime";
+import * as t from "react";
+import { AnimatePresence as A, motion as s } from "motion/react";
+import { cn as N } from "@dsui/ui/index";
+function W({
+  ref: y,
+  words: e,
+  duration: r = 3e3,
+  letterDelay: h = 0.05,
+  wordDelay: c = 0.3,
+  className: b,
+  ...x
+}) {
+  const o = t.useRef(null);
+  t.useImperativeHandle(
+    y,
+    () => o.current
+  );
+  const [n, g] = t.useState(e[0]), [p, m] = t.useState(!1), f = t.useCallback(() => {
+    const i = e[e.indexOf(n) + 1] || e[0];
+    g(i), m(!0);
+  }, [n, e]);
+  return t.useEffect(() => {
+    if (!p) {
+      const i = setTimeout(() => {
+        f();
+      }, r);
+      return () => clearTimeout(i);
+    }
+  }, [p, r, f]), /* @__PURE__ */ a("span", { ref: o, "data-slot": "flip-words", ...x, children: /* @__PURE__ */ a(
+    A,
+    {
+      onExitComplete: () => {
+        m(!1);
+      },
+      children: /* @__PURE__ */ a(
+        s.span,
+        {
+          initial: {
+            opacity: 0,
+            y: 10
+          },
+          animate: {
+            opacity: 1,
+            y: 0
+          },
+          transition: {
+            type: "spring",
+            stiffness: 100,
+            damping: 10
+          },
+          exit: {
+            opacity: 0,
+            y: -40,
+            x: 40,
+            filter: "blur(8px)",
+            scale: 2,
+            position: "absolute"
+          },
+          className: N(
+            "inline-block relative text-left px-2 will-change-transform will-change-opacity will-change-filter",
+            b
+          ),
+          children: n.split(" ").map((i, l) => /* @__PURE__ */ k(
+            s.span,
+            {
+              initial: { opacity: 0, y: 10, filter: "blur(8px)" },
+              animate: { opacity: 1, y: 0, filter: "blur(0px)" },
+              transition: {
+                delay: l * c,
+                duration: 0.3
+              },
+              className: "inline-block whitespace-nowrap",
+              children: [
+                i.split("").map((d, u) => /* @__PURE__ */ a(
+                  s.span,
+                  {
+                    initial: { opacity: 0, y: 10, filter: "blur(8px)" },
+                    animate: { opacity: 1, y: 0, filter: "blur(0px)" },
+                    transition: {
+                      delay: l * c + u * h,
+                      duration: 0.2
+                    },
+                    className: "inline-block will-change-transform will-change-opacity will-change-filter",
+                    children: d
+                  },
+                  `${i}-${u}`
+                )),
+                /* @__PURE__ */ a("span", { className: "inline-block", children: " " })
+              ]
+            },
+            `${i}-${l}`
+          ))
+        },
+        n
+      )
+    }
+  ) });
+}
+export {
+  W as FlipWords
+};
+//# sourceMappingURL=FlipWords.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FlipWords.js","sources":["../../../../src/lib/TextAnimation/FlipWords.tsx"],"sourcesContent":["\"use client\";\nimport * as React from \"react\";\nimport { AnimatePresence, motion } from \"motion/react\";\nimport { cn } from \"@dsui/ui/index\";\n\ntype FlipWordsProps = Omit<React.ComponentProps<\"span\">, \"children\"> & {\n  words: string[];\n  duration?: number;\n  letterDelay?: number;\n  wordDelay?: number;\n};\n\nfunction FlipWords({\n  ref,\n  words,\n  duration = 3000,\n  letterDelay = 0.05,\n  wordDelay = 0.3,\n  className,\n  ...props\n}: FlipWordsProps) {\n  const localRef = React.useRef<HTMLSpanElement>(null);\n  React.useImperativeHandle(\n    ref as any,\n    () => localRef.current as HTMLSpanElement,\n  );\n  const [currentWord, setCurrentWord] = React.useState(words[0]);\n  const [isAnimating, setIsAnimating] = React.useState<boolean>(false);\n\n  const startAnimation = React.useCallback(() => {\n    const word = words[words.indexOf(currentWord) + 1] || words[0];\n    setCurrentWord(word);\n    setIsAnimating(true);\n  }, [currentWord, words]);\n\n  React.useEffect(() => {\n    if (!isAnimating) {\n      const timeoutId = setTimeout(() => {\n        startAnimation();\n      }, duration);\n      return () => clearTimeout(timeoutId);\n    }\n  }, [isAnimating, duration, startAnimation]);\n\n  return (\n    <span ref={localRef} data-slot=\"flip-words\" {...(props as any)}>\n      <AnimatePresence\n        onExitComplete={() => {\n          setIsAnimating(false);\n        }}\n      >\n        <motion.span\n          initial={{\n            opacity: 0,\n            y: 10,\n          }}\n          animate={{\n            opacity: 1,\n            y: 0,\n          }}\n          transition={{\n            type: \"spring\",\n            stiffness: 100,\n            damping: 10,\n          }}\n          exit={{\n            opacity: 0,\n            y: -40,\n            x: 40,\n            filter: \"blur(8px)\",\n            scale: 2,\n            position: \"absolute\",\n          }}\n          className={cn(\n            \"inline-block relative text-left px-2 will-change-transform will-change-opacity will-change-filter\",\n            className,\n          )}\n          key={currentWord}\n        >\n          {currentWord.split(\" \").map((word, wordIndex) => (\n            <motion.span\n              key={`${word}-${wordIndex}`}\n              initial={{ opacity: 0, y: 10, filter: \"blur(8px)\" }}\n              animate={{ opacity: 1, y: 0, filter: \"blur(0px)\" }}\n              transition={{\n                delay: wordIndex * wordDelay,\n                duration: 0.3,\n              }}\n              className=\"inline-block whitespace-nowrap\"\n            >\n              {word.split(\"\").map((letter, letterIndex) => (\n                <motion.span\n                  key={`${word}-${letterIndex}`}\n                  initial={{ opacity: 0, y: 10, filter: \"blur(8px)\" }}\n                  animate={{ opacity: 1, y: 0, filter: \"blur(0px)\" }}\n                  transition={{\n                    delay: wordIndex * wordDelay + letterIndex * letterDelay,\n                    duration: 0.2,\n                  }}\n                  className=\"inline-block will-change-transform will-change-opacity will-change-filter\"\n                >\n                  {letter}\n                </motion.span>\n              ))}\n              <span className=\"inline-block\">&nbsp;</span>\n            </motion.span>\n          ))}\n        </motion.span>\n      </AnimatePresence>\n    </span>\n  );\n}\n\nexport { FlipWords, type FlipWordsProps };\n"],"names":["FlipWords","ref","words","duration","letterDelay","wordDelay","className","props","localRef","React","currentWord","setCurrentWord","isAnimating","setIsAnimating","startAnimation","word","timeoutId","jsx","AnimatePresence","motion","cn","wordIndex","jsxs","letter","letterIndex"],"mappings":"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"}