erp-pro-ui 0.1.8 → 0.1.9

package/README.md

@@ -215,6 +215,86 @@ import { DropdownMenu } from "erp-pro-ui";
 </DropdownMenu>;
 ```
 
+## Dashboard Sidebar Shell
+
+Use `DashboardSidebarShell` when you want the exact dashboard behavior: a top header connected to a responsive sidebar, mobile hamburger control, RTL support, and customization slots.
+
+```tsx
+import {
+  BellIcon,
+  Button,
+  DashboardSidebarShell,
+  FullScreenIcon,
+  HamburgerIcon,
+  type SidebarItem,
+} from "erp-pro-ui";
+
+const items: SidebarItem[] = [
+  { id: "dashboard", label: "داشبورد", href: "/dashboard", active: true },
+  { id: "inventory", label: "انبار", href: "/inventory" },
+  { id: "settings", label: "تنظیمات", href: "/settings" },
+];
+
+export function DashboardLayout({ children }: { children: React.ReactNode }) {
+  return (
+    <DashboardSidebarShell
+      items={items}
+      direction="rtl"
+      breadcrumb="صفحات / داشبورد"
+      title="داشبورد"
+      brand={<strong>ERPPRO</strong>}
+      sidebarFooter={<Button className="w-full">ارتقای پلن</Button>}
+      sidebarClassName="border-ds-border-2/60"
+      headerActions={({ isSidebarOpen, toggleSidebar, isRtl }) => (
+        <>
+          <Button
+            variant="tertiary"
+            size="small"
+            className="h-9 w-9 rounded-full p-0! xl:hidden"
+            onClick={toggleSidebar}
+            aria-label="Toggle sidebar"
+          >
+            <HamburgerIcon isOpen={isSidebarOpen} />
+          </Button>
+          <Button
+            variant="tertiary"
+            size="small"
+            className="relative h-9 w-9 rounded-full p-0!"
+            aria-label="Open notifications"
+          >
+            <BellIcon className="h-5 w-5" />
+            <span
+              className={
+                isRtl
+                  ? "absolute -left-0.5 -top-0.5"
+                  : "absolute -right-0.5 -top-0.5"
+              }
+            >
+              3
+            </span>
+          </Button>
+          <Button
+            variant="tertiary"
+            size="small"
+            className="h-9 w-9 rounded-full p-0!"
+          >
+            <FullScreenIcon className="h-5 w-5" />
+          </Button>
+        </>
+      )}
+    >
+      {children}
+    </DashboardSidebarShell>
+  );
+}
+```
+
+Customization props:
+
+- Header: `header`, `headerLeading`, `headerActions`, `headerClassName`, `headerTitleClassName`, `headerActionsClassName`
+- Sidebar: `brand`, `sidebarNavbar`, `sidebarFooter`, `sidebarClassName`, `sidebarLinksClassName`, `sidebarItemClassName`, `sidebarActiveItemClassName`, `sidebarOverlayClassName`
+- Behavior: `open`, `defaultOpen`, `onOpenChange`, `direction`, `activePath`, `onItemSelect`
+
 ## Colors And Fonts In Another Project
 
 The library now ships a two-layer theme contract so another project can use the same tokens without copying theme config:

package/dist/ascii-text.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_ascii_text = require("./chunks/ascii-text-OnPOTd2I.cjs");
+const require_ascii_text = require("./chunks/ascii-text-BFnpVur6.cjs");
 exports.ASCIIText = require_ascii_text.ASCIIText;

package/dist/ascii-text.mjs

@@ -1,2 +1,2 @@
-import { t as ASCIIText } from "./chunks/ascii-text-OBwVLFDC.mjs";
+import { t as ASCIIText } from "./chunks/ascii-text-Bdy4C5rU.mjs";
 export { ASCIIText };

package/dist/background-gradient-animation.cjs

@@ -1,4 +1,4 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_background_gradient_animation = require("./chunks/background-gradient-animation-II9hdrgB.cjs");
+const require_background_gradient_animation = require("./chunks/background-gradient-animation-CiNdmA61.cjs");
 exports.BackgroundGradientAnimation = require_background_gradient_animation.BackgroundGradientAnimation;
 exports.BackgroundGradientAnimationDemo = require_background_gradient_animation.BackgroundGradientAnimationDemo;

package/dist/background-gradient-animation.mjs

@@ -1,2 +1,2 @@
-import { n as BackgroundGradientAnimation, t as BackgroundGradientAnimationDemo } from "./chunks/background-gradient-animation-DpKJ3ecq.mjs";
+import { n as BackgroundGradientAnimation, t as BackgroundGradientAnimationDemo } from "./chunks/background-gradient-animation-BR9wx6Z8.mjs";
 export { BackgroundGradientAnimation, BackgroundGradientAnimationDemo };

package/dist/button-hover-border-gradient.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_button_hover_border_gradient = require("./chunks/button-hover-border-gradient-DX2lBG5C.cjs");
+const require_button_hover_border_gradient = require("./chunks/button-hover-border-gradient-ssmwU5-U.cjs");
 exports.ButtonHoverBorderGradient = require_button_hover_border_gradient.ButtonHoverBorderGradient;

package/dist/button-hover-border-gradient.mjs

@@ -1,2 +1,2 @@
-import { t as ButtonHoverBorderGradient } from "./chunks/button-hover-border-gradient-DFppVRI4.mjs";
+import { t as ButtonHoverBorderGradient } from "./chunks/button-hover-border-gradient-DnFvjNNw.mjs";
 export { ButtonHoverBorderGradient };

package/dist/calendar.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_calendar = require("./chunks/calendar-DJkfDhQA.cjs");
+const require_calendar = require("./chunks/calendar-CYxkfvDv.cjs");
 exports.Calendar = require_calendar.Calendar;

package/dist/calendar.mjs

@@ -1,2 +1,2 @@
-import { t as Calendar } from "./chunks/calendar-BOBm3dFA.mjs";
+import { t as Calendar } from "./chunks/calendar-BVuDnWUc.mjs";
 export { Calendar };

package/dist/carousel.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_carousel = require("./chunks/carousel-F4drTOr6.cjs");
+const require_carousel = require("./chunks/carousel-Cv0m1Pp5.cjs");
 exports.Carousel = require_carousel.Carousel;

package/dist/carousel.mjs

@@ -1,2 +1,2 @@
-import { t as Carousel } from "./chunks/carousel-DUqOaYvs.mjs";
+import { t as Carousel } from "./chunks/carousel-Dd4rp-jr.mjs";
 export { Carousel };

package/dist/charts.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_charts = require("./chunks/charts-CZEYcr6X.cjs");
+const require_charts = require("./chunks/charts-DuVZD7el.cjs");
 exports.AreaChart = require_charts.AreaChart;
 exports.BarChart = require_charts.BarChart;
 exports.MiniNeonSparkline = require_charts.MiniNeonSparkline;

package/dist/charts.mjs

@@ -1,2 +1,2 @@
-import { a as ThinBreakdownBar, c as NeonLineChart, d as getChartPalette, i as AreaChart, l as chartColorTokens, n as PositiveNegativeBarChart, o as StackedBarChart, r as BarChart, s as MiniNeonSparkline, t as PieChart, u as getChartColorVar } from "./chunks/charts-C-Qee_JY.mjs";
+import { a as ThinBreakdownBar, c as NeonLineChart, d as getChartPalette, i as AreaChart, l as chartColorTokens, n as PositiveNegativeBarChart, o as StackedBarChart, r as BarChart, s as MiniNeonSparkline, t as PieChart, u as getChartColorVar } from "./chunks/charts-mfevxJSU.mjs";
 export { AreaChart, BarChart, MiniNeonSparkline, NeonLineChart, PieChart, PositiveNegativeBarChart, StackedBarChart, ThinBreakdownBar, chartColorTokens, getChartColorVar, getChartPalette };

package/dist/chip.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_chip = require("./chunks/chip-CMs73sc5.cjs");
+const require_chip = require("./chunks/chip-BDrpg5Ux.cjs");
 exports.Chip = require_chip.Chip;
 exports.SplitChip = require_chip.SplitChip;
 exports.StatusDotChip = require_chip.StatusDotChip;

package/dist/chip.mjs

@@ -1,2 +1,2 @@
-import { n as StatusDotChip, r as Chip, t as SplitChip } from "./chunks/chip-BFg3DJx6.mjs";
+import { n as StatusDotChip, r as Chip, t as SplitChip } from "./chunks/chip-Dt0p0_zd.mjs";
 export { Chip, SplitChip, StatusDotChip };

package/dist/chroma-grid.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_chroma_grid = require("./chunks/chroma-grid-tJX7CzCS.cjs");
+const require_chroma_grid = require("./chunks/chroma-grid-DcZ9f4Ui.cjs");
 exports.ChromaGrid = require_chroma_grid.ChromaGrid;

package/dist/chroma-grid.mjs

@@ -1,2 +1,2 @@
-import { t as ChromaGrid } from "./chunks/chroma-grid-DlY9hIRI.mjs";
+import { t as ChromaGrid } from "./chunks/chroma-grid-opB2DBtS.mjs";
 export { ChromaGrid };

package/dist/chunks/{DropdownMenu-C17Zqu_E.mjs → DropdownMenu-CBdZoVQs.mjs}

@@ -1,4 +1,4 @@
-import { n as mergeClassNames } from "./utils-ati1KkDb.mjs";
+import { n as mergeClassNames } from "./utils-7S0u48mU.mjs";
 import { useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/overlays/dropdown-menu/DropdownMenu.tsx
@@ -48,4 +48,4 @@ function DropdownMenu({ trigger, children, open, onOpenChange, className, panelC
 //#endregion
 export { DropdownMenu as t };
 
-//# sourceMappingURL=DropdownMenu-C17Zqu_E.mjs.map
+//# sourceMappingURL=DropdownMenu-CBdZoVQs.mjs.map

package/dist/chunks/{DropdownMenu-C17Zqu_E.mjs.map → DropdownMenu-CBdZoVQs.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu-C17Zqu_E.mjs","names":[],"sources":["../../src/components/overlays/dropdown-menu/DropdownMenu.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { mergeClassNames } from \"../../../utils\";\nimport type { DropdownMenuProps } from \"./types\";\n\nexport function DropdownMenu({\n  trigger,\n  children,\n  open,\n  onOpenChange,\n  className,\n  panelClassName,\n  animationClassName,\n  closeOnItemClick = false,\n}: DropdownMenuProps) {\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const [internalOpen, setInternalOpen] = useState(false);\n  const isControlled = open !== undefined;\n  const resolvedOpen = isControlled ? open : internalOpen;\n\n  const setOpen = (nextOpen: boolean | ((current: boolean) => boolean)) => {\n    const finalValue =\n      typeof nextOpen === \"function\"\n        ? nextOpen(resolvedOpen)\n        : nextOpen;\n\n    if (!isControlled) {\n      setInternalOpen(finalValue);\n    }\n\n    onOpenChange?.(finalValue);\n  };\n\n  useEffect(() => {\n    function handleClickOutside(event: MouseEvent) {\n      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n        setOpen(false);\n      }\n    }\n\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === \"Escape\") {\n        setOpen(false);\n      }\n    }\n\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    document.addEventListener(\"keydown\", handleKeyDown);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n      document.removeEventListener(\"keydown\", handleKeyDown);\n    };\n  }, []);\n\n  return (\n    <div ref={wrapperRef} className={mergeClassNames(\"relative inline-flex\", className)}>\n      <div\n        className=\"inline-flex\"\n        onMouseDown={(event) => {\n          event.preventDefault();\n          setOpen((current) => !current);\n        }}\n      >\n        {trigger}\n      </div>\n\n      <div\n        className={mergeClassNames(\n          \"absolute z-[1200] transition-all duration-300 ease-in-out\",\n          animationClassName ?? \"origin-top-right\",\n          resolvedOpen ? \"scale-100\" : \"scale-0\",\n          panelClassName,\n        )}\n        onClick={() => {\n          if (closeOnItemClick) {\n            setOpen(false);\n          }\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;AAKA,SAAgB,aAAa,EAC3B,SACA,UACA,MACA,cACA,WACA,gBACA,oBACA,mBAAmB,SACC;CACpB,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,CAAC,cAAc,mBAAmB,SAAS,MAAM;CACvD,MAAM,eAAe,SAAS,KAAA;CAC9B,MAAM,eAAe,eAAe,OAAO;CAE3C,MAAM,WAAW,aAAwD;EACvE,MAAM,aACJ,OAAO,aAAa,aAChB,SAAS,aAAa,GACtB;AAEN,MAAI,CAAC,aACH,iBAAgB,WAAW;AAG7B,iBAAe,WAAW;;AAG5B,iBAAgB;EACd,SAAS,mBAAmB,OAAmB;AAC7C,OAAI,WAAW,WAAW,CAAC,WAAW,QAAQ,SAAS,MAAM,OAAe,CAC1E,SAAQ,MAAM;;EAIlB,SAAS,cAAc,OAAsB;AAC3C,OAAI,MAAM,QAAQ,SAChB,SAAQ,MAAM;;AAIlB,WAAS,iBAAiB,aAAa,mBAAmB;AAC1D,WAAS,iBAAiB,WAAW,cAAc;AAEnD,eAAa;AACX,YAAS,oBAAoB,aAAa,mBAAmB;AAC7D,YAAS,oBAAoB,WAAW,cAAc;;IAEvD,EAAE,CAAC;AAEN,QACE,qBAAC,OAAD;EAAK,KAAK;EAAY,WAAW,gBAAgB,wBAAwB,UAAU;YAAnF,CACE,oBAAC,OAAD;GACE,WAAU;GACV,cAAc,UAAU;AACtB,UAAM,gBAAgB;AACtB,aAAS,YAAY,CAAC,QAAQ;;aAG/B;GACG,CAAA,EAEN,oBAAC,OAAD;GACE,WAAW,gBACT,6DACA,sBAAsB,oBACtB,eAAe,cAAc,WAC7B,eACD;GACD,eAAe;AACb,QAAI,iBACF,SAAQ,MAAM;;GAIjB;GACG,CAAA,CACF"}
+{"version":3,"file":"DropdownMenu-CBdZoVQs.mjs","names":[],"sources":["../../src/components/overlays/dropdown-menu/DropdownMenu.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { mergeClassNames } from \"../../../utils\";\nimport type { DropdownMenuProps } from \"./types\";\n\nexport function DropdownMenu({\n  trigger,\n  children,\n  open,\n  onOpenChange,\n  className,\n  panelClassName,\n  animationClassName,\n  closeOnItemClick = false,\n}: DropdownMenuProps) {\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const [internalOpen, setInternalOpen] = useState(false);\n  const isControlled = open !== undefined;\n  const resolvedOpen = isControlled ? open : internalOpen;\n\n  const setOpen = (nextOpen: boolean | ((current: boolean) => boolean)) => {\n    const finalValue =\n      typeof nextOpen === \"function\"\n        ? nextOpen(resolvedOpen)\n        : nextOpen;\n\n    if (!isControlled) {\n      setInternalOpen(finalValue);\n    }\n\n    onOpenChange?.(finalValue);\n  };\n\n  useEffect(() => {\n    function handleClickOutside(event: MouseEvent) {\n      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n        setOpen(false);\n      }\n    }\n\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === \"Escape\") {\n        setOpen(false);\n      }\n    }\n\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    document.addEventListener(\"keydown\", handleKeyDown);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n      document.removeEventListener(\"keydown\", handleKeyDown);\n    };\n  }, []);\n\n  return (\n    <div ref={wrapperRef} className={mergeClassNames(\"relative inline-flex\", className)}>\n      <div\n        className=\"inline-flex\"\n        onMouseDown={(event) => {\n          event.preventDefault();\n          setOpen((current) => !current);\n        }}\n      >\n        {trigger}\n      </div>\n\n      <div\n        className={mergeClassNames(\n          \"absolute z-[1200] transition-all duration-300 ease-in-out\",\n          animationClassName ?? \"origin-top-right\",\n          resolvedOpen ? \"scale-100\" : \"scale-0\",\n          panelClassName,\n        )}\n        onClick={() => {\n          if (closeOnItemClick) {\n            setOpen(false);\n          }\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;AAKA,SAAgB,aAAa,EAC3B,SACA,UACA,MACA,cACA,WACA,gBACA,oBACA,mBAAmB,SACC;CACpB,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,CAAC,cAAc,mBAAmB,SAAS,MAAM;CACvD,MAAM,eAAe,SAAS,KAAA;CAC9B,MAAM,eAAe,eAAe,OAAO;CAE3C,MAAM,WAAW,aAAwD;EACvE,MAAM,aACJ,OAAO,aAAa,aAChB,SAAS,aAAa,GACtB;AAEN,MAAI,CAAC,aACH,iBAAgB,WAAW;AAG7B,iBAAe,WAAW;;AAG5B,iBAAgB;EACd,SAAS,mBAAmB,OAAmB;AAC7C,OAAI,WAAW,WAAW,CAAC,WAAW,QAAQ,SAAS,MAAM,OAAe,CAC1E,SAAQ,MAAM;;EAIlB,SAAS,cAAc,OAAsB;AAC3C,OAAI,MAAM,QAAQ,SAChB,SAAQ,MAAM;;AAIlB,WAAS,iBAAiB,aAAa,mBAAmB;AAC1D,WAAS,iBAAiB,WAAW,cAAc;AAEnD,eAAa;AACX,YAAS,oBAAoB,aAAa,mBAAmB;AAC7D,YAAS,oBAAoB,WAAW,cAAc;;IAEvD,EAAE,CAAC;AAEN,QACE,qBAAC,OAAD;EAAK,KAAK;EAAY,WAAW,gBAAgB,wBAAwB,UAAU;YAAnF,CACE,oBAAC,OAAD;GACE,WAAU;GACV,cAAc,UAAU;AACtB,UAAM,gBAAgB;AACtB,aAAS,YAAY,CAAC,QAAQ;;aAG/B;GACG,CAAA,EAEN,oBAAC,OAAD;GACE,WAAW,gBACT,6DACA,sBAAsB,oBACtB,eAAe,cAAc,WAC7B,eACD;GACD,eAAe;AACb,QAAI,iBACF,SAAQ,MAAM;;GAIjB;GACG,CAAA,CACF"}

package/dist/chunks/{DropdownMenu-DOvo5pV_.cjs → DropdownMenu-CeD9kl_N.cjs}

@@ -1,5 +1,5 @@
 require("./chunk-B_GkZjkl.cjs");
-const require_utils = require("./utils-B4SmmY4J.cjs");
+const require_utils = require("./utils-LRbEQHYs.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/overlays/dropdown-menu/DropdownMenu.tsx
@@ -54,4 +54,4 @@ Object.defineProperty(exports, "DropdownMenu", {
 	}
 });
 
-//# sourceMappingURL=DropdownMenu-DOvo5pV_.cjs.map
+//# sourceMappingURL=DropdownMenu-CeD9kl_N.cjs.map

package/dist/chunks/{DropdownMenu-DOvo5pV_.cjs.map → DropdownMenu-CeD9kl_N.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu-DOvo5pV_.cjs","names":[],"sources":["../../src/components/overlays/dropdown-menu/DropdownMenu.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { mergeClassNames } from \"../../../utils\";\nimport type { DropdownMenuProps } from \"./types\";\n\nexport function DropdownMenu({\n  trigger,\n  children,\n  open,\n  onOpenChange,\n  className,\n  panelClassName,\n  animationClassName,\n  closeOnItemClick = false,\n}: DropdownMenuProps) {\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const [internalOpen, setInternalOpen] = useState(false);\n  const isControlled = open !== undefined;\n  const resolvedOpen = isControlled ? open : internalOpen;\n\n  const setOpen = (nextOpen: boolean | ((current: boolean) => boolean)) => {\n    const finalValue =\n      typeof nextOpen === \"function\"\n        ? nextOpen(resolvedOpen)\n        : nextOpen;\n\n    if (!isControlled) {\n      setInternalOpen(finalValue);\n    }\n\n    onOpenChange?.(finalValue);\n  };\n\n  useEffect(() => {\n    function handleClickOutside(event: MouseEvent) {\n      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n        setOpen(false);\n      }\n    }\n\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === \"Escape\") {\n        setOpen(false);\n      }\n    }\n\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    document.addEventListener(\"keydown\", handleKeyDown);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n      document.removeEventListener(\"keydown\", handleKeyDown);\n    };\n  }, []);\n\n  return (\n    <div ref={wrapperRef} className={mergeClassNames(\"relative inline-flex\", className)}>\n      <div\n        className=\"inline-flex\"\n        onMouseDown={(event) => {\n          event.preventDefault();\n          setOpen((current) => !current);\n        }}\n      >\n        {trigger}\n      </div>\n\n      <div\n        className={mergeClassNames(\n          \"absolute z-[1200] transition-all duration-300 ease-in-out\",\n          animationClassName ?? \"origin-top-right\",\n          resolvedOpen ? \"scale-100\" : \"scale-0\",\n          panelClassName,\n        )}\n        onClick={() => {\n          if (closeOnItemClick) {\n            setOpen(false);\n          }\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,aAAa,EAC3B,SACA,UACA,MACA,cACA,WACA,gBACA,oBACA,mBAAmB,SACC;CACpB,MAAM,cAAA,GAAA,MAAA,QAAoC,KAAK;CAC/C,MAAM,CAAC,cAAc,oBAAA,GAAA,MAAA,UAA4B,MAAM;CACvD,MAAM,eAAe,SAAS,KAAA;CAC9B,MAAM,eAAe,eAAe,OAAO;CAE3C,MAAM,WAAW,aAAwD;EACvE,MAAM,aACJ,OAAO,aAAa,aAChB,SAAS,aAAa,GACtB;AAEN,MAAI,CAAC,aACH,iBAAgB,WAAW;AAG7B,iBAAe,WAAW;;AAG5B,EAAA,GAAA,MAAA,iBAAgB;EACd,SAAS,mBAAmB,OAAmB;AAC7C,OAAI,WAAW,WAAW,CAAC,WAAW,QAAQ,SAAS,MAAM,OAAe,CAC1E,SAAQ,MAAM;;EAIlB,SAAS,cAAc,OAAsB;AAC3C,OAAI,MAAM,QAAQ,SAChB,SAAQ,MAAM;;AAIlB,WAAS,iBAAiB,aAAa,mBAAmB;AAC1D,WAAS,iBAAiB,WAAW,cAAc;AAEnD,eAAa;AACX,YAAS,oBAAoB,aAAa,mBAAmB;AAC7D,YAAS,oBAAoB,WAAW,cAAc;;IAEvD,EAAE,CAAC;AAEN,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,KAAK;EAAY,WAAW,cAAA,gBAAgB,wBAAwB,UAAU;YAAnF,CACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAU;GACV,cAAc,UAAU;AACtB,UAAM,gBAAgB;AACtB,aAAS,YAAY,CAAC,QAAQ;;aAG/B;GACG,CAAA,EAEN,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAW,cAAA,gBACT,6DACA,sBAAsB,oBACtB,eAAe,cAAc,WAC7B,eACD;GACD,eAAe;AACb,QAAI,iBACF,SAAQ,MAAM;;GAIjB;GACG,CAAA,CACF"}
+{"version":3,"file":"DropdownMenu-CeD9kl_N.cjs","names":[],"sources":["../../src/components/overlays/dropdown-menu/DropdownMenu.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { mergeClassNames } from \"../../../utils\";\nimport type { DropdownMenuProps } from \"./types\";\n\nexport function DropdownMenu({\n  trigger,\n  children,\n  open,\n  onOpenChange,\n  className,\n  panelClassName,\n  animationClassName,\n  closeOnItemClick = false,\n}: DropdownMenuProps) {\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const [internalOpen, setInternalOpen] = useState(false);\n  const isControlled = open !== undefined;\n  const resolvedOpen = isControlled ? open : internalOpen;\n\n  const setOpen = (nextOpen: boolean | ((current: boolean) => boolean)) => {\n    const finalValue =\n      typeof nextOpen === \"function\"\n        ? nextOpen(resolvedOpen)\n        : nextOpen;\n\n    if (!isControlled) {\n      setInternalOpen(finalValue);\n    }\n\n    onOpenChange?.(finalValue);\n  };\n\n  useEffect(() => {\n    function handleClickOutside(event: MouseEvent) {\n      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n        setOpen(false);\n      }\n    }\n\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === \"Escape\") {\n        setOpen(false);\n      }\n    }\n\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    document.addEventListener(\"keydown\", handleKeyDown);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n      document.removeEventListener(\"keydown\", handleKeyDown);\n    };\n  }, []);\n\n  return (\n    <div ref={wrapperRef} className={mergeClassNames(\"relative inline-flex\", className)}>\n      <div\n        className=\"inline-flex\"\n        onMouseDown={(event) => {\n          event.preventDefault();\n          setOpen((current) => !current);\n        }}\n      >\n        {trigger}\n      </div>\n\n      <div\n        className={mergeClassNames(\n          \"absolute z-[1200] transition-all duration-300 ease-in-out\",\n          animationClassName ?? \"origin-top-right\",\n          resolvedOpen ? \"scale-100\" : \"scale-0\",\n          panelClassName,\n        )}\n        onClick={() => {\n          if (closeOnItemClick) {\n            setOpen(false);\n          }\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,aAAa,EAC3B,SACA,UACA,MACA,cACA,WACA,gBACA,oBACA,mBAAmB,SACC;CACpB,MAAM,cAAA,GAAA,MAAA,QAAoC,KAAK;CAC/C,MAAM,CAAC,cAAc,oBAAA,GAAA,MAAA,UAA4B,MAAM;CACvD,MAAM,eAAe,SAAS,KAAA;CAC9B,MAAM,eAAe,eAAe,OAAO;CAE3C,MAAM,WAAW,aAAwD;EACvE,MAAM,aACJ,OAAO,aAAa,aAChB,SAAS,aAAa,GACtB;AAEN,MAAI,CAAC,aACH,iBAAgB,WAAW;AAG7B,iBAAe,WAAW;;AAG5B,EAAA,GAAA,MAAA,iBAAgB;EACd,SAAS,mBAAmB,OAAmB;AAC7C,OAAI,WAAW,WAAW,CAAC,WAAW,QAAQ,SAAS,MAAM,OAAe,CAC1E,SAAQ,MAAM;;EAIlB,SAAS,cAAc,OAAsB;AAC3C,OAAI,MAAM,QAAQ,SAChB,SAAQ,MAAM;;AAIlB,WAAS,iBAAiB,aAAa,mBAAmB;AAC1D,WAAS,iBAAiB,WAAW,cAAc;AAEnD,eAAa;AACX,YAAS,oBAAoB,aAAa,mBAAmB;AAC7D,YAAS,oBAAoB,WAAW,cAAc;;IAEvD,EAAE,CAAC;AAEN,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,KAAK;EAAY,WAAW,cAAA,gBAAgB,wBAAwB,UAAU;YAAnF,CACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAU;GACV,cAAc,UAAU;AACtB,UAAM,gBAAgB;AACtB,aAAS,YAAY,CAAC,QAAQ;;aAG/B;GACG,CAAA,EAEN,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAW,cAAA,gBACT,6DACA,sBAAsB,oBACtB,eAAe,cAAc,WAC7B,eACD;GACD,eAAe;AACb,QAAI,iBACF,SAAQ,MAAM;;GAIjB;GACG,CAAA,CACF"}

package/dist/chunks/{HoverBorderGradient-C5D6lGg0.cjs → HoverBorderGradient-9pfvBoHR.cjs}

@@ -1,5 +1,5 @@
 require("./chunk-B_GkZjkl.cjs");
-const require_utils = require("./utils-B4SmmY4J.cjs");
+const require_utils = require("./utils-LRbEQHYs.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let framer_motion = require("framer-motion");
@@ -72,4 +72,4 @@ Object.defineProperty(exports, "HoverBorderGradient", {
 	}
 });
 
-//# sourceMappingURL=HoverBorderGradient-C5D6lGg0.cjs.map
+//# sourceMappingURL=HoverBorderGradient-9pfvBoHR.cjs.map

package/dist/chunks/{HoverBorderGradient-C5D6lGg0.cjs.map → HoverBorderGradient-9pfvBoHR.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"HoverBorderGradient-C5D6lGg0.cjs","names":[],"sources":["../../src/components/effects/hover-border-gradient/HoverBorderGradient.tsx"],"sourcesContent":["import { mergeClassNames } from \"../../../utils\";\nimport { motion } from \"framer-motion\";\nimport { useCallback, useEffect, useState } from \"react\";\n\ntype Direction = \"TOP\" | \"LEFT\" | \"BOTTOM\" | \"RIGHT\";\n\ntype HoverBorderGradientProps =\n  React.ButtonHTMLAttributes<HTMLButtonElement> & {\n    containerClassName?: string;\n    className?: string;\n    duration?: number;\n    clockwise?: boolean;\n    children?: React.ReactNode;\n  };\n\nconst movingMap: Record<Direction, string> = {\n  TOP: \"radial-gradient(50.7% 50% at 50% 0%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  LEFT: \"radial-gradient(25.6% 43.1% at 0% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  BOTTOM:\n    \"radial-gradient(50.7% 50% at 50% 100%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  RIGHT:\n    \"radial-gradient(25.2% 41% at 100% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n};\n\nconst highlight = `radial-gradient(85% 181% at 50% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)`;\n\nexport function HoverBorderGradient({\n  containerClassName,\n  className,\n  duration = 1,\n  clockwise = true,\n  children,\n  ...props\n}: HoverBorderGradientProps) {\n  const [hovered, setHovered] = useState(false);\n  const [direction, setDirection] = useState<Direction>(\"TOP\");\n\n  const rotateDirection = useCallback(\n    (current: Direction): Direction => {\n      const directions: Direction[] = [\"TOP\", \"LEFT\", \"BOTTOM\", \"RIGHT\"];\n      const index = directions.indexOf(current);\n      const nextIndex = clockwise\n        ? (index - 1 + directions.length) % directions.length\n        : (index + 1) % directions.length;\n      return directions[nextIndex];\n    },\n    [clockwise],\n  );\n\n  useEffect(() => {\n    if (!hovered) {\n      const interval = setInterval(() => {\n        setDirection((prevState) => rotateDirection(prevState));\n      }, duration * 1000);\n      return () => clearInterval(interval);\n    }\n  }, [hovered, duration, rotateDirection]);\n\n  const handleMouseEnter = () => setHovered(true);\n  const handleMouseLeave = () => setHovered(false);\n\n  return (\n    <button\n      type=\"button\"\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={mergeClassNames(\n        \"relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-ds-border-2 p-px transition duration-500\",\n        containerClassName,\n      )}\n      {...props}\n    >\n      <div\n        className={mergeClassNames(\n          \"bg-ds-surface-1 text-ds-1 z-10 w-auto rounded-[inherit] px-4 py-2\",\n          className,\n        )}\n      >\n        {children}\n      </div>\n      <motion.div\n        className={mergeClassNames(\n          \"absolute inset-0 z-0 flex-none overflow-hidden rounded-[inherit]\",\n        )}\n        style={{\n          filter: \"blur(2px)\",\n          position: \"absolute\",\n          width: \"100%\",\n          height: \"100%\",\n        }}\n        initial={{ background: movingMap[direction] }}\n        animate={{\n          background: hovered\n            ? [movingMap[direction], highlight]\n            : movingMap[direction],\n        }}\n        transition={{ ease: \"linear\", duration: duration ?? 1 }}\n      />\n    </button>\n  );\n}\n"],"mappings":";;;;;;AAeA,IAAM,YAAuC;CAC3C,KAAK;CACL,MAAM;CACN,QACE;CACF,OACE;CACH;AAED,IAAM,YAAY;AAElB,SAAgB,oBAAoB,EAClC,oBACA,WACA,WAAW,GACX,YAAY,MACZ,UACA,GAAG,SACwB;CAC3B,MAAM,CAAC,SAAS,eAAA,GAAA,MAAA,UAAuB,MAAM;CAC7C,MAAM,CAAC,WAAW,iBAAA,GAAA,MAAA,UAAoC,MAAM;CAE5D,MAAM,mBAAA,GAAA,MAAA,cACH,YAAkC;EACjC,MAAM,aAA0B;GAAC;GAAO;GAAQ;GAAU;GAAQ;EAClE,MAAM,QAAQ,WAAW,QAAQ,QAAQ;AAIzC,SAAO,WAHW,aACb,QAAQ,IAAI,WAAW,UAAU,WAAW,UAC5C,QAAQ,KAAK,WAAW;IAG/B,CAAC,UAAU,CACZ;AAED,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,SAAS;GACZ,MAAM,WAAW,kBAAkB;AACjC,kBAAc,cAAc,gBAAgB,UAAU,CAAC;MACtD,WAAW,IAAK;AACnB,gBAAa,cAAc,SAAS;;IAErC;EAAC;EAAS;EAAU;EAAgB,CAAC;CAExC,MAAM,yBAAyB,WAAW,KAAK;CAC/C,MAAM,yBAAyB,WAAW,MAAM;AAEhD,QACE,iBAAA,GAAA,kBAAA,MAAC,UAAD;EACE,MAAK;EACL,cAAc;EACd,cAAc;EACd,WAAW,cAAA,gBACT,uLACA,mBACD;EACD,GAAI;YARN,CAUE,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAW,cAAA,gBACT,qEACA,UACD;GAEA;GACG,CAAA,EACN,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;GACE,WAAW,cAAA,gBACT,mEACD;GACD,OAAO;IACL,QAAQ;IACR,UAAU;IACV,OAAO;IACP,QAAQ;IACT;GACD,SAAS,EAAE,YAAY,UAAU,YAAY;GAC7C,SAAS,EACP,YAAY,UACR,CAAC,UAAU,YAAY,UAAU,GACjC,UAAU,YACf;GACD,YAAY;IAAE,MAAM;IAAU,UAAU,YAAY;IAAG;GACvD,CAAA,CACK"}
+{"version":3,"file":"HoverBorderGradient-9pfvBoHR.cjs","names":[],"sources":["../../src/components/effects/hover-border-gradient/HoverBorderGradient.tsx"],"sourcesContent":["import { mergeClassNames } from \"../../../utils\";\nimport { motion } from \"framer-motion\";\nimport { useCallback, useEffect, useState } from \"react\";\n\ntype Direction = \"TOP\" | \"LEFT\" | \"BOTTOM\" | \"RIGHT\";\n\ntype HoverBorderGradientProps =\n  React.ButtonHTMLAttributes<HTMLButtonElement> & {\n    containerClassName?: string;\n    className?: string;\n    duration?: number;\n    clockwise?: boolean;\n    children?: React.ReactNode;\n  };\n\nconst movingMap: Record<Direction, string> = {\n  TOP: \"radial-gradient(50.7% 50% at 50% 0%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  LEFT: \"radial-gradient(25.6% 43.1% at 0% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  BOTTOM:\n    \"radial-gradient(50.7% 50% at 50% 100%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  RIGHT:\n    \"radial-gradient(25.2% 41% at 100% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n};\n\nconst highlight = `radial-gradient(85% 181% at 50% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)`;\n\nexport function HoverBorderGradient({\n  containerClassName,\n  className,\n  duration = 1,\n  clockwise = true,\n  children,\n  ...props\n}: HoverBorderGradientProps) {\n  const [hovered, setHovered] = useState(false);\n  const [direction, setDirection] = useState<Direction>(\"TOP\");\n\n  const rotateDirection = useCallback(\n    (current: Direction): Direction => {\n      const directions: Direction[] = [\"TOP\", \"LEFT\", \"BOTTOM\", \"RIGHT\"];\n      const index = directions.indexOf(current);\n      const nextIndex = clockwise\n        ? (index - 1 + directions.length) % directions.length\n        : (index + 1) % directions.length;\n      return directions[nextIndex];\n    },\n    [clockwise],\n  );\n\n  useEffect(() => {\n    if (!hovered) {\n      const interval = setInterval(() => {\n        setDirection((prevState) => rotateDirection(prevState));\n      }, duration * 1000);\n      return () => clearInterval(interval);\n    }\n  }, [hovered, duration, rotateDirection]);\n\n  const handleMouseEnter = () => setHovered(true);\n  const handleMouseLeave = () => setHovered(false);\n\n  return (\n    <button\n      type=\"button\"\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={mergeClassNames(\n        \"relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-ds-border-2 p-px transition duration-500\",\n        containerClassName,\n      )}\n      {...props}\n    >\n      <div\n        className={mergeClassNames(\n          \"bg-ds-surface-1 text-ds-1 z-10 w-auto rounded-[inherit] px-4 py-2\",\n          className,\n        )}\n      >\n        {children}\n      </div>\n      <motion.div\n        className={mergeClassNames(\n          \"absolute inset-0 z-0 flex-none overflow-hidden rounded-[inherit]\",\n        )}\n        style={{\n          filter: \"blur(2px)\",\n          position: \"absolute\",\n          width: \"100%\",\n          height: \"100%\",\n        }}\n        initial={{ background: movingMap[direction] }}\n        animate={{\n          background: hovered\n            ? [movingMap[direction], highlight]\n            : movingMap[direction],\n        }}\n        transition={{ ease: \"linear\", duration: duration ?? 1 }}\n      />\n    </button>\n  );\n}\n"],"mappings":";;;;;;AAeA,IAAM,YAAuC;CAC3C,KAAK;CACL,MAAM;CACN,QACE;CACF,OACE;CACH;AAED,IAAM,YAAY;AAElB,SAAgB,oBAAoB,EAClC,oBACA,WACA,WAAW,GACX,YAAY,MACZ,UACA,GAAG,SACwB;CAC3B,MAAM,CAAC,SAAS,eAAA,GAAA,MAAA,UAAuB,MAAM;CAC7C,MAAM,CAAC,WAAW,iBAAA,GAAA,MAAA,UAAoC,MAAM;CAE5D,MAAM,mBAAA,GAAA,MAAA,cACH,YAAkC;EACjC,MAAM,aAA0B;GAAC;GAAO;GAAQ;GAAU;GAAQ;EAClE,MAAM,QAAQ,WAAW,QAAQ,QAAQ;AAIzC,SAAO,WAHW,aACb,QAAQ,IAAI,WAAW,UAAU,WAAW,UAC5C,QAAQ,KAAK,WAAW;IAG/B,CAAC,UAAU,CACZ;AAED,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,SAAS;GACZ,MAAM,WAAW,kBAAkB;AACjC,kBAAc,cAAc,gBAAgB,UAAU,CAAC;MACtD,WAAW,IAAK;AACnB,gBAAa,cAAc,SAAS;;IAErC;EAAC;EAAS;EAAU;EAAgB,CAAC;CAExC,MAAM,yBAAyB,WAAW,KAAK;CAC/C,MAAM,yBAAyB,WAAW,MAAM;AAEhD,QACE,iBAAA,GAAA,kBAAA,MAAC,UAAD;EACE,MAAK;EACL,cAAc;EACd,cAAc;EACd,WAAW,cAAA,gBACT,uLACA,mBACD;EACD,GAAI;YARN,CAUE,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAW,cAAA,gBACT,qEACA,UACD;GAEA;GACG,CAAA,EACN,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;GACE,WAAW,cAAA,gBACT,mEACD;GACD,OAAO;IACL,QAAQ;IACR,UAAU;IACV,OAAO;IACP,QAAQ;IACT;GACD,SAAS,EAAE,YAAY,UAAU,YAAY;GAC7C,SAAS,EACP,YAAY,UACR,CAAC,UAAU,YAAY,UAAU,GACjC,UAAU,YACf;GACD,YAAY;IAAE,MAAM;IAAU,UAAU,YAAY;IAAG;GACvD,CAAA,CACK"}

package/dist/chunks/{HoverBorderGradient-CduqqQgX.mjs → HoverBorderGradient-NbdXeLgC.mjs}

@@ -1,4 +1,4 @@
-import { n as mergeClassNames } from "./utils-ati1KkDb.mjs";
+import { n as mergeClassNames } from "./utils-7S0u48mU.mjs";
 import { useCallback, useEffect, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { motion } from "framer-motion";
@@ -66,4 +66,4 @@ function HoverBorderGradient({ containerClassName, className, duration = 1, cloc
 //#endregion
 export { HoverBorderGradient as t };
 
-//# sourceMappingURL=HoverBorderGradient-CduqqQgX.mjs.map
+//# sourceMappingURL=HoverBorderGradient-NbdXeLgC.mjs.map

package/dist/chunks/{HoverBorderGradient-CduqqQgX.mjs.map → HoverBorderGradient-NbdXeLgC.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"HoverBorderGradient-CduqqQgX.mjs","names":[],"sources":["../../src/components/effects/hover-border-gradient/HoverBorderGradient.tsx"],"sourcesContent":["import { mergeClassNames } from \"../../../utils\";\nimport { motion } from \"framer-motion\";\nimport { useCallback, useEffect, useState } from \"react\";\n\ntype Direction = \"TOP\" | \"LEFT\" | \"BOTTOM\" | \"RIGHT\";\n\ntype HoverBorderGradientProps =\n  React.ButtonHTMLAttributes<HTMLButtonElement> & {\n    containerClassName?: string;\n    className?: string;\n    duration?: number;\n    clockwise?: boolean;\n    children?: React.ReactNode;\n  };\n\nconst movingMap: Record<Direction, string> = {\n  TOP: \"radial-gradient(50.7% 50% at 50% 0%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  LEFT: \"radial-gradient(25.6% 43.1% at 0% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  BOTTOM:\n    \"radial-gradient(50.7% 50% at 50% 100%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  RIGHT:\n    \"radial-gradient(25.2% 41% at 100% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n};\n\nconst highlight = `radial-gradient(85% 181% at 50% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)`;\n\nexport function HoverBorderGradient({\n  containerClassName,\n  className,\n  duration = 1,\n  clockwise = true,\n  children,\n  ...props\n}: HoverBorderGradientProps) {\n  const [hovered, setHovered] = useState(false);\n  const [direction, setDirection] = useState<Direction>(\"TOP\");\n\n  const rotateDirection = useCallback(\n    (current: Direction): Direction => {\n      const directions: Direction[] = [\"TOP\", \"LEFT\", \"BOTTOM\", \"RIGHT\"];\n      const index = directions.indexOf(current);\n      const nextIndex = clockwise\n        ? (index - 1 + directions.length) % directions.length\n        : (index + 1) % directions.length;\n      return directions[nextIndex];\n    },\n    [clockwise],\n  );\n\n  useEffect(() => {\n    if (!hovered) {\n      const interval = setInterval(() => {\n        setDirection((prevState) => rotateDirection(prevState));\n      }, duration * 1000);\n      return () => clearInterval(interval);\n    }\n  }, [hovered, duration, rotateDirection]);\n\n  const handleMouseEnter = () => setHovered(true);\n  const handleMouseLeave = () => setHovered(false);\n\n  return (\n    <button\n      type=\"button\"\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={mergeClassNames(\n        \"relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-ds-border-2 p-px transition duration-500\",\n        containerClassName,\n      )}\n      {...props}\n    >\n      <div\n        className={mergeClassNames(\n          \"bg-ds-surface-1 text-ds-1 z-10 w-auto rounded-[inherit] px-4 py-2\",\n          className,\n        )}\n      >\n        {children}\n      </div>\n      <motion.div\n        className={mergeClassNames(\n          \"absolute inset-0 z-0 flex-none overflow-hidden rounded-[inherit]\",\n        )}\n        style={{\n          filter: \"blur(2px)\",\n          position: \"absolute\",\n          width: \"100%\",\n          height: \"100%\",\n        }}\n        initial={{ background: movingMap[direction] }}\n        animate={{\n          background: hovered\n            ? [movingMap[direction], highlight]\n            : movingMap[direction],\n        }}\n        transition={{ ease: \"linear\", duration: duration ?? 1 }}\n      />\n    </button>\n  );\n}\n"],"mappings":";;;;;AAeA,IAAM,YAAuC;CAC3C,KAAK;CACL,MAAM;CACN,QACE;CACF,OACE;CACH;AAED,IAAM,YAAY;AAElB,SAAgB,oBAAoB,EAClC,oBACA,WACA,WAAW,GACX,YAAY,MACZ,UACA,GAAG,SACwB;CAC3B,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAC7C,MAAM,CAAC,WAAW,gBAAgB,SAAoB,MAAM;CAE5D,MAAM,kBAAkB,aACrB,YAAkC;EACjC,MAAM,aAA0B;GAAC;GAAO;GAAQ;GAAU;GAAQ;EAClE,MAAM,QAAQ,WAAW,QAAQ,QAAQ;AAIzC,SAAO,WAHW,aACb,QAAQ,IAAI,WAAW,UAAU,WAAW,UAC5C,QAAQ,KAAK,WAAW;IAG/B,CAAC,UAAU,CACZ;AAED,iBAAgB;AACd,MAAI,CAAC,SAAS;GACZ,MAAM,WAAW,kBAAkB;AACjC,kBAAc,cAAc,gBAAgB,UAAU,CAAC;MACtD,WAAW,IAAK;AACnB,gBAAa,cAAc,SAAS;;IAErC;EAAC;EAAS;EAAU;EAAgB,CAAC;CAExC,MAAM,yBAAyB,WAAW,KAAK;CAC/C,MAAM,yBAAyB,WAAW,MAAM;AAEhD,QACE,qBAAC,UAAD;EACE,MAAK;EACL,cAAc;EACd,cAAc;EACd,WAAW,gBACT,uLACA,mBACD;EACD,GAAI;YARN,CAUE,oBAAC,OAAD;GACE,WAAW,gBACT,qEACA,UACD;GAEA;GACG,CAAA,EACN,oBAAC,OAAO,KAAR;GACE,WAAW,gBACT,mEACD;GACD,OAAO;IACL,QAAQ;IACR,UAAU;IACV,OAAO;IACP,QAAQ;IACT;GACD,SAAS,EAAE,YAAY,UAAU,YAAY;GAC7C,SAAS,EACP,YAAY,UACR,CAAC,UAAU,YAAY,UAAU,GACjC,UAAU,YACf;GACD,YAAY;IAAE,MAAM;IAAU,UAAU,YAAY;IAAG;GACvD,CAAA,CACK"}
+{"version":3,"file":"HoverBorderGradient-NbdXeLgC.mjs","names":[],"sources":["../../src/components/effects/hover-border-gradient/HoverBorderGradient.tsx"],"sourcesContent":["import { mergeClassNames } from \"../../../utils\";\nimport { motion } from \"framer-motion\";\nimport { useCallback, useEffect, useState } from \"react\";\n\ntype Direction = \"TOP\" | \"LEFT\" | \"BOTTOM\" | \"RIGHT\";\n\ntype HoverBorderGradientProps =\n  React.ButtonHTMLAttributes<HTMLButtonElement> & {\n    containerClassName?: string;\n    className?: string;\n    duration?: number;\n    clockwise?: boolean;\n    children?: React.ReactNode;\n  };\n\nconst movingMap: Record<Direction, string> = {\n  TOP: \"radial-gradient(50.7% 50% at 50% 0%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  LEFT: \"radial-gradient(25.6% 43.1% at 0% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  BOTTOM:\n    \"radial-gradient(50.7% 50% at 50% 100%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n  RIGHT:\n    \"radial-gradient(25.2% 41% at 100% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n};\n\nconst highlight = `radial-gradient(85% 181% at 50% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)`;\n\nexport function HoverBorderGradient({\n  containerClassName,\n  className,\n  duration = 1,\n  clockwise = true,\n  children,\n  ...props\n}: HoverBorderGradientProps) {\n  const [hovered, setHovered] = useState(false);\n  const [direction, setDirection] = useState<Direction>(\"TOP\");\n\n  const rotateDirection = useCallback(\n    (current: Direction): Direction => {\n      const directions: Direction[] = [\"TOP\", \"LEFT\", \"BOTTOM\", \"RIGHT\"];\n      const index = directions.indexOf(current);\n      const nextIndex = clockwise\n        ? (index - 1 + directions.length) % directions.length\n        : (index + 1) % directions.length;\n      return directions[nextIndex];\n    },\n    [clockwise],\n  );\n\n  useEffect(() => {\n    if (!hovered) {\n      const interval = setInterval(() => {\n        setDirection((prevState) => rotateDirection(prevState));\n      }, duration * 1000);\n      return () => clearInterval(interval);\n    }\n  }, [hovered, duration, rotateDirection]);\n\n  const handleMouseEnter = () => setHovered(true);\n  const handleMouseLeave = () => setHovered(false);\n\n  return (\n    <button\n      type=\"button\"\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={mergeClassNames(\n        \"relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-ds-border-2 p-px transition duration-500\",\n        containerClassName,\n      )}\n      {...props}\n    >\n      <div\n        className={mergeClassNames(\n          \"bg-ds-surface-1 text-ds-1 z-10 w-auto rounded-[inherit] px-4 py-2\",\n          className,\n        )}\n      >\n        {children}\n      </div>\n      <motion.div\n        className={mergeClassNames(\n          \"absolute inset-0 z-0 flex-none overflow-hidden rounded-[inherit]\",\n        )}\n        style={{\n          filter: \"blur(2px)\",\n          position: \"absolute\",\n          width: \"100%\",\n          height: \"100%\",\n        }}\n        initial={{ background: movingMap[direction] }}\n        animate={{\n          background: hovered\n            ? [movingMap[direction], highlight]\n            : movingMap[direction],\n        }}\n        transition={{ ease: \"linear\", duration: duration ?? 1 }}\n      />\n    </button>\n  );\n}\n"],"mappings":";;;;;AAeA,IAAM,YAAuC;CAC3C,KAAK;CACL,MAAM;CACN,QACE;CACF,OACE;CACH;AAED,IAAM,YAAY;AAElB,SAAgB,oBAAoB,EAClC,oBACA,WACA,WAAW,GACX,YAAY,MACZ,UACA,GAAG,SACwB;CAC3B,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAC7C,MAAM,CAAC,WAAW,gBAAgB,SAAoB,MAAM;CAE5D,MAAM,kBAAkB,aACrB,YAAkC;EACjC,MAAM,aAA0B;GAAC;GAAO;GAAQ;GAAU;GAAQ;EAClE,MAAM,QAAQ,WAAW,QAAQ,QAAQ;AAIzC,SAAO,WAHW,aACb,QAAQ,IAAI,WAAW,UAAU,WAAW,UAC5C,QAAQ,KAAK,WAAW;IAG/B,CAAC,UAAU,CACZ;AAED,iBAAgB;AACd,MAAI,CAAC,SAAS;GACZ,MAAM,WAAW,kBAAkB;AACjC,kBAAc,cAAc,gBAAgB,UAAU,CAAC;MACtD,WAAW,IAAK;AACnB,gBAAa,cAAc,SAAS;;IAErC;EAAC;EAAS;EAAU;EAAgB,CAAC;CAExC,MAAM,yBAAyB,WAAW,KAAK;CAC/C,MAAM,yBAAyB,WAAW,MAAM;AAEhD,QACE,qBAAC,UAAD;EACE,MAAK;EACL,cAAc;EACd,cAAc;EACd,WAAW,gBACT,uLACA,mBACD;EACD,GAAI;YARN,CAUE,oBAAC,OAAD;GACE,WAAW,gBACT,qEACA,UACD;GAEA;GACG,CAAA,EACN,oBAAC,OAAO,KAAR;GACE,WAAW,gBACT,mEACD;GACD,OAAO;IACL,QAAQ;IACR,UAAU;IACV,OAAO;IACP,QAAQ;IACT;GACD,SAAS,EAAE,YAAY,UAAU,YAAY;GAC7C,SAAS,EACP,YAAY,UACR,CAAC,UAAU,YAAY,UAAU,GACjC,UAAU,YACf;GACD,YAAY;IAAE,MAAM;IAAU,UAAU,YAAY;IAAG;GACvD,CAAA,CACK"}

package/dist/chunks/SunToMoonButton-BkEfkElJ.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SunToMoonButton-BkEfkElJ.mjs","names":[],"sources":["../../src/components/effects/sun-to-moon-button/SunToMoonButton.tsx"],"sourcesContent":["import { useThemeContext } from \"../../../foundations/theme\";\nimport { motion } from \"framer-motion\";\n\nexport interface SunToMoonButtonProps {\n  showLabelAndImage?: boolean;\n}\n\nexport default function SunToMoonButton({\n  showLabelAndImage = true,\n}: SunToMoonButtonProps) {\n  const { mode, toggleMode } = useThemeContext();\n\n  const raysVariants = {\n    hidden: {\n      strokeOpacity: 0,\n      transition: {\n        staggerChildren: 0.05,\n        staggerDirection: -1,\n      },\n    },\n    visible: {\n      strokeOpacity: 1,\n      transition: {\n        staggerChildren: 0.05,\n      },\n    },\n  };\n\n  const rayVariant = {\n    hidden: {\n      pathLength: 0,\n      opacity: 0,\n      // Start from center of the circle\n      scale: 0,\n    },\n    visible: {\n      pathLength: 1,\n      opacity: 1,\n      scale: 1,\n      transition: {\n        duration: 0.5,\n        pathLength: { duration: 0.3 },\n        opacity: { duration: 0.2 },\n        scale: { duration: 0.3 },\n      },\n    },\n  };\n\n  const shineVariant = {\n    hidden: {\n      opacity: 0,\n      scale: 2,\n      strokeDasharray: \"20, 1000\",\n      strokeDashoffset: 0,\n      filter: \"blur(0px)\",\n    },\n    visible: {\n      opacity: [0, 1, 0],\n      strokeDashoffset: [0, -50, -100],\n      filter: [\"blur(2px)\", \"blur(2px)\", \"blur(0px)\"],\n      transition: {\n        duration: 0.75,\n      },\n    },\n  };\n\n  const sunPath =\n    \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C60 29 69.5 38 70 49.5Z\";\n  const moonPath =\n    \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C39 45 49.5 59.5 70 49.5Z\";\n  const fallbackPath = sunPath;\n\n  // Ensure we have valid paths at all times\n  // Light mode = sun, Dark mode = moon\n  const currentPath = mode === \"light\" ? sunPath : moonPath;\n  const safeCurrentPath = currentPath || fallbackPath;\n\n  return (\n    <button\n      type=\"button\"\n      className=\"flex w-full cursor-pointer flex-col items-center justify-center rounded-xl py-3 text-base font-medium transition duration-200\"\n      onClick={() => toggleMode()}\n    >\n      <span className=\"flex items-center\">\n        {showLabelAndImage && (\n          <span className=\"mr-2 text-ds-1\">\n            {mode === \"light\" ? \"Light\" : \"Dark\"}\n          </span>\n        )}\n\n        <motion.svg\n          strokeWidth=\"4\"\n          strokeLinecap=\"round\"\n          width={20}\n          height={20}\n          viewBox=\"0 0 100 100\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          className=\"relative\"\n        >\n          {/* Shine effect for moon in dark mode */}\n          {moonPath && (\n            <motion.path\n              variants={shineVariant}\n              d={moonPath}\n              className=\"absolute top-0 left-0 stroke-blue-100\"\n              initial=\"hidden\"\n              animate={mode === \"light\" ? \"hidden\" : \"visible\"}\n            />\n          )}\n\n          {/* Sun rays - visible in light mode */}\n          <motion.g\n            variants={raysVariants}\n            initial=\"hidden\"\n            animate={mode === \"dark\" ? \"hidden\" : \"visible\"}\n            style={{\n              strokeLinecap: \"round\",\n              strokeWidth: 6,\n              stroke: \"var(--ds-color-warning)\",\n            }}\n          >\n            <motion.path\n              className=\"origin-center\"\n              variants={rayVariant}\n              d=\"M50 2V11\"\n            />\n            <motion.path variants={rayVariant} d=\"M85 15L78 22\" />\n            <motion.path variants={rayVariant} d=\"M98 50H89\" />\n            <motion.path variants={rayVariant} d=\"M85 85L78 78\" />\n            <motion.path variants={rayVariant} d=\"M50 98V89\" />\n            <motion.path variants={rayVariant} d=\"M23 78L16 84\" />\n            <motion.path variants={rayVariant} d=\"M11 50H2\" />\n            <motion.path variants={rayVariant} d=\"M23 23L16 16\" />\n          </motion.g>\n\n          {/* Main path - Light=Sun(yellow), Dark=Moon(blue) */}\n          <motion.path\n            d={safeCurrentPath}\n            fill=\"transparent\"\n            transition={{ duration: 1, type: \"spring\" }}\n            initial={false}\n            animate={\n              mode === \"light\"\n                ? {\n                    d: sunPath || fallbackPath,\n                    rotate: 0,\n                    scale: 1,\n                    stroke: \"var(--ds-color-warning)\",\n                    fill: \"var(--ds-color-warning)\",\n                    fillOpacity: 0.5,\n                    strokeOpacity: 1,\n                  }\n                : {\n                    d: moonPath || fallbackPath,\n                    rotate: -360,\n                    scale: 2,\n                    stroke: \"var(--ds-color-info)\",\n                    fill: \"var(--ds-color-info)\",\n                    fillOpacity: 0.35,\n                    strokeOpacity: 1,\n                  }\n            }\n          />\n        </motion.svg>\n      </span>\n      {showLabelAndImage && (\n        <span className=\"mt-2 flex h-[90px] w-[180px] flex-col items-center justify-center rounded-md bg-ds-surface-2\">\n          <span className=\"my-4 flex w-[150px] flex-col rounded-md\">\n            <span className=\"mb-1 w-[80px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"mb-1 w-[100px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"w-[150px] rounded-full bg-ds-surface-3 p-1\"></span>\n          </span>\n          <span className=\"my-1 flex w-[150px] justify-between\">\n            <span className=\"mb-1 w-[80px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"mb-1 w-[30px] rounded-full bg-ds-accent p-1\"></span>\n          </span>\n        </span>\n      )}\n    </button>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"SunToMoonButton-BkEfkElJ.mjs","names":[],"sources":["../../src/components/effects/sun-to-moon-button/SunToMoonButton.tsx"],"sourcesContent":["import { useThemeContext } from \"../../../foundations/theme\";\nimport { motion } from \"framer-motion\";\n\nexport interface SunToMoonButtonProps {\n  showLabelAndImage?: boolean;\n}\n\nexport default function SunToMoonButton({\n  showLabelAndImage = true,\n}: SunToMoonButtonProps) {\n  const { mode, toggleMode } = useThemeContext();\n\n  const raysVariants = {\n    hidden: {\n      strokeOpacity: 0,\n      transition: {\n        staggerChildren: 0.05,\n        staggerDirection: -1,\n      },\n    },\n    visible: {\n      strokeOpacity: 1,\n      transition: {\n        staggerChildren: 0.05,\n      },\n    },\n  };\n\n  const rayVariant = {\n    hidden: {\n      pathLength: 0,\n      opacity: 0,\n      // Start from center of the circle\n      scale: 0,\n    },\n    visible: {\n      pathLength: 1,\n      opacity: 1,\n      scale: 1,\n      transition: {\n        duration: 0.5,\n        pathLength: { duration: 0.3 },\n        opacity: { duration: 0.2 },\n        scale: { duration: 0.3 },\n      },\n    },\n  };\n\n  const shineVariant = {\n    hidden: {\n      opacity: 0,\n      scale: 2,\n      strokeDasharray: \"20, 1000\",\n      strokeDashoffset: 0,\n      filter: \"blur(0px)\",\n    },\n    visible: {\n      opacity: [0, 1, 0],\n      strokeDashoffset: [0, -50, -100],\n      filter: [\"blur(2px)\", \"blur(2px)\", \"blur(0px)\"],\n      transition: {\n        duration: 0.75,\n      },\n    },\n  };\n\n  const sunPath =\n    \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C60 29 69.5 38 70 49.5Z\";\n  const moonPath =\n    \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C39 45 49.5 59.5 70 49.5Z\";\n  const fallbackPath = sunPath;\n\n  // Ensure we have valid paths at all times\n  // Light mode = sun, Dark mode = moon\n  const currentPath = mode === \"light\" ? sunPath : moonPath;\n  const safeCurrentPath = currentPath || fallbackPath;\n\n  return (\n    <button\n      type=\"button\"\n      className=\"flex w-full cursor-pointer flex-col items-center justify-center rounded-xl py-3 text-base font-medium transition duration-200\"\n      onClick={() => toggleMode()}\n    >\n      <span className=\"flex items-center\">\n        {showLabelAndImage && (\n          <span className=\"mr-2 text-ds-1\">\n            {mode === \"light\" ? \"Light\" : \"Dark\"}\n          </span>\n        )}\n\n        <motion.svg\n          strokeWidth=\"4\"\n          strokeLinecap=\"round\"\n          width={20}\n          height={20}\n          viewBox=\"0 0 100 100\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          className=\"relative\"\n        >\n          {/* Shine effect for moon in dark mode */}\n          {moonPath && (\n            <motion.path\n              variants={shineVariant}\n              d={moonPath}\n              className=\"absolute top-0 left-0 stroke-blue-100\"\n              initial=\"hidden\"\n              animate={mode === \"light\" ? \"hidden\" : \"visible\"}\n            />\n          )}\n\n          {/* Sun rays - visible in light mode */}\n          <motion.g\n            variants={raysVariants}\n            initial=\"hidden\"\n            animate={mode === \"dark\" ? \"hidden\" : \"visible\"}\n            style={{\n              strokeLinecap: \"round\",\n              strokeWidth: 6,\n              stroke: \"var(--ds-color-warning)\",\n            }}\n          >\n            <motion.path\n              className=\"origin-center\"\n              variants={rayVariant}\n              d=\"M50 2V11\"\n            />\n            <motion.path variants={rayVariant} d=\"M85 15L78 22\" />\n            <motion.path variants={rayVariant} d=\"M98 50H89\" />\n            <motion.path variants={rayVariant} d=\"M85 85L78 78\" />\n            <motion.path variants={rayVariant} d=\"M50 98V89\" />\n            <motion.path variants={rayVariant} d=\"M23 78L16 84\" />\n            <motion.path variants={rayVariant} d=\"M11 50H2\" />\n            <motion.path variants={rayVariant} d=\"M23 23L16 16\" />\n          </motion.g>\n\n          {/* Main path - Light=Sun(yellow), Dark=Moon(blue) */}\n          <motion.path\n            d={safeCurrentPath}\n            fill=\"transparent\"\n            transition={{ duration: 1, type: \"spring\" }}\n            initial={false}\n            animate={\n              mode === \"light\"\n                ? {\n                    d: sunPath || fallbackPath,\n                    rotate: 0,\n                    scale: 1,\n                    stroke: \"var(--ds-color-warning)\",\n                    fill: \"var(--ds-color-warning)\",\n                    fillOpacity: 0.5,\n                    strokeOpacity: 1,\n                  }\n                : {\n                    d: moonPath || fallbackPath,\n                    rotate: -360,\n                    scale: 2,\n                    stroke: \"var(--ds-color-info)\",\n                    fill: \"var(--ds-color-info)\",\n                    fillOpacity: 0.35,\n                    strokeOpacity: 1,\n                  }\n            }\n          />\n        </motion.svg>\n      </span>\n      {showLabelAndImage && (\n        <span className=\"mt-2 flex h-[90px] w-[180px] flex-col items-center justify-center rounded-md bg-ds-surface-2\">\n          <span className=\"my-4 flex w-[150px] flex-col rounded-md\">\n            <span className=\"mb-1 w-[80px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"mb-1 w-[100px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"w-[150px] rounded-full bg-ds-surface-3 p-1\"></span>\n          </span>\n          <span className=\"my-1 flex w-[150px] justify-between\">\n            <span className=\"mb-1 w-[80px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"mb-1 w-[30px] rounded-full bg-ds-accent p-1\"></span>\n          </span>\n        </span>\n      )}\n    </button>\n  );\n}\n"],"mappings":"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"}

package/dist/chunks/SunToMoonButton-jS4BJD9q.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SunToMoonButton-jS4BJD9q.cjs","names":[],"sources":["../../src/components/effects/sun-to-moon-button/SunToMoonButton.tsx"],"sourcesContent":["import { useThemeContext } from \"../../../foundations/theme\";\nimport { motion } from \"framer-motion\";\n\nexport interface SunToMoonButtonProps {\n  showLabelAndImage?: boolean;\n}\n\nexport default function SunToMoonButton({\n  showLabelAndImage = true,\n}: SunToMoonButtonProps) {\n  const { mode, toggleMode } = useThemeContext();\n\n  const raysVariants = {\n    hidden: {\n      strokeOpacity: 0,\n      transition: {\n        staggerChildren: 0.05,\n        staggerDirection: -1,\n      },\n    },\n    visible: {\n      strokeOpacity: 1,\n      transition: {\n        staggerChildren: 0.05,\n      },\n    },\n  };\n\n  const rayVariant = {\n    hidden: {\n      pathLength: 0,\n      opacity: 0,\n      // Start from center of the circle\n      scale: 0,\n    },\n    visible: {\n      pathLength: 1,\n      opacity: 1,\n      scale: 1,\n      transition: {\n        duration: 0.5,\n        pathLength: { duration: 0.3 },\n        opacity: { duration: 0.2 },\n        scale: { duration: 0.3 },\n      },\n    },\n  };\n\n  const shineVariant = {\n    hidden: {\n      opacity: 0,\n      scale: 2,\n      strokeDasharray: \"20, 1000\",\n      strokeDashoffset: 0,\n      filter: \"blur(0px)\",\n    },\n    visible: {\n      opacity: [0, 1, 0],\n      strokeDashoffset: [0, -50, -100],\n      filter: [\"blur(2px)\", \"blur(2px)\", \"blur(0px)\"],\n      transition: {\n        duration: 0.75,\n      },\n    },\n  };\n\n  const sunPath =\n    \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C60 29 69.5 38 70 49.5Z\";\n  const moonPath =\n    \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C39 45 49.5 59.5 70 49.5Z\";\n  const fallbackPath = sunPath;\n\n  // Ensure we have valid paths at all times\n  // Light mode = sun, Dark mode = moon\n  const currentPath = mode === \"light\" ? sunPath : moonPath;\n  const safeCurrentPath = currentPath || fallbackPath;\n\n  return (\n    <button\n      type=\"button\"\n      className=\"flex w-full cursor-pointer flex-col items-center justify-center rounded-xl py-3 text-base font-medium transition duration-200\"\n      onClick={() => toggleMode()}\n    >\n      <span className=\"flex items-center\">\n        {showLabelAndImage && (\n          <span className=\"mr-2 text-ds-1\">\n            {mode === \"light\" ? \"Light\" : \"Dark\"}\n          </span>\n        )}\n\n        <motion.svg\n          strokeWidth=\"4\"\n          strokeLinecap=\"round\"\n          width={20}\n          height={20}\n          viewBox=\"0 0 100 100\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          className=\"relative\"\n        >\n          {/* Shine effect for moon in dark mode */}\n          {moonPath && (\n            <motion.path\n              variants={shineVariant}\n              d={moonPath}\n              className=\"absolute top-0 left-0 stroke-blue-100\"\n              initial=\"hidden\"\n              animate={mode === \"light\" ? \"hidden\" : \"visible\"}\n            />\n          )}\n\n          {/* Sun rays - visible in light mode */}\n          <motion.g\n            variants={raysVariants}\n            initial=\"hidden\"\n            animate={mode === \"dark\" ? \"hidden\" : \"visible\"}\n            style={{\n              strokeLinecap: \"round\",\n              strokeWidth: 6,\n              stroke: \"var(--ds-color-warning)\",\n            }}\n          >\n            <motion.path\n              className=\"origin-center\"\n              variants={rayVariant}\n              d=\"M50 2V11\"\n            />\n            <motion.path variants={rayVariant} d=\"M85 15L78 22\" />\n            <motion.path variants={rayVariant} d=\"M98 50H89\" />\n            <motion.path variants={rayVariant} d=\"M85 85L78 78\" />\n            <motion.path variants={rayVariant} d=\"M50 98V89\" />\n            <motion.path variants={rayVariant} d=\"M23 78L16 84\" />\n            <motion.path variants={rayVariant} d=\"M11 50H2\" />\n            <motion.path variants={rayVariant} d=\"M23 23L16 16\" />\n          </motion.g>\n\n          {/* Main path - Light=Sun(yellow), Dark=Moon(blue) */}\n          <motion.path\n            d={safeCurrentPath}\n            fill=\"transparent\"\n            transition={{ duration: 1, type: \"spring\" }}\n            initial={false}\n            animate={\n              mode === \"light\"\n                ? {\n                    d: sunPath || fallbackPath,\n                    rotate: 0,\n                    scale: 1,\n                    stroke: \"var(--ds-color-warning)\",\n                    fill: \"var(--ds-color-warning)\",\n                    fillOpacity: 0.5,\n                    strokeOpacity: 1,\n                  }\n                : {\n                    d: moonPath || fallbackPath,\n                    rotate: -360,\n                    scale: 2,\n                    stroke: \"var(--ds-color-info)\",\n                    fill: \"var(--ds-color-info)\",\n                    fillOpacity: 0.35,\n                    strokeOpacity: 1,\n                  }\n            }\n          />\n        </motion.svg>\n      </span>\n      {showLabelAndImage && (\n        <span className=\"mt-2 flex h-[90px] w-[180px] flex-col items-center justify-center rounded-md bg-ds-surface-2\">\n          <span className=\"my-4 flex w-[150px] flex-col rounded-md\">\n            <span className=\"mb-1 w-[80px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"mb-1 w-[100px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"w-[150px] rounded-full bg-ds-surface-3 p-1\"></span>\n          </span>\n          <span className=\"my-1 flex w-[150px] justify-between\">\n            <span className=\"mb-1 w-[80px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"mb-1 w-[30px] rounded-full bg-ds-accent p-1\"></span>\n          </span>\n        </span>\n      )}\n    </button>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"SunToMoonButton-jS4BJD9q.cjs","names":[],"sources":["../../src/components/effects/sun-to-moon-button/SunToMoonButton.tsx"],"sourcesContent":["import { useThemeContext } from \"../../../foundations/theme\";\nimport { motion } from \"framer-motion\";\n\nexport interface SunToMoonButtonProps {\n  showLabelAndImage?: boolean;\n}\n\nexport default function SunToMoonButton({\n  showLabelAndImage = true,\n}: SunToMoonButtonProps) {\n  const { mode, toggleMode } = useThemeContext();\n\n  const raysVariants = {\n    hidden: {\n      strokeOpacity: 0,\n      transition: {\n        staggerChildren: 0.05,\n        staggerDirection: -1,\n      },\n    },\n    visible: {\n      strokeOpacity: 1,\n      transition: {\n        staggerChildren: 0.05,\n      },\n    },\n  };\n\n  const rayVariant = {\n    hidden: {\n      pathLength: 0,\n      opacity: 0,\n      // Start from center of the circle\n      scale: 0,\n    },\n    visible: {\n      pathLength: 1,\n      opacity: 1,\n      scale: 1,\n      transition: {\n        duration: 0.5,\n        pathLength: { duration: 0.3 },\n        opacity: { duration: 0.2 },\n        scale: { duration: 0.3 },\n      },\n    },\n  };\n\n  const shineVariant = {\n    hidden: {\n      opacity: 0,\n      scale: 2,\n      strokeDasharray: \"20, 1000\",\n      strokeDashoffset: 0,\n      filter: \"blur(0px)\",\n    },\n    visible: {\n      opacity: [0, 1, 0],\n      strokeDashoffset: [0, -50, -100],\n      filter: [\"blur(2px)\", \"blur(2px)\", \"blur(0px)\"],\n      transition: {\n        duration: 0.75,\n      },\n    },\n  };\n\n  const sunPath =\n    \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C60 29 69.5 38 70 49.5Z\";\n  const moonPath =\n    \"M70 49.5C70 60.8218 60.8218 70 49.5 70C38.1782 70 29 60.8218 29 49.5C29 38.1782 38.1782 29 49.5 29C39 45 49.5 59.5 70 49.5Z\";\n  const fallbackPath = sunPath;\n\n  // Ensure we have valid paths at all times\n  // Light mode = sun, Dark mode = moon\n  const currentPath = mode === \"light\" ? sunPath : moonPath;\n  const safeCurrentPath = currentPath || fallbackPath;\n\n  return (\n    <button\n      type=\"button\"\n      className=\"flex w-full cursor-pointer flex-col items-center justify-center rounded-xl py-3 text-base font-medium transition duration-200\"\n      onClick={() => toggleMode()}\n    >\n      <span className=\"flex items-center\">\n        {showLabelAndImage && (\n          <span className=\"mr-2 text-ds-1\">\n            {mode === \"light\" ? \"Light\" : \"Dark\"}\n          </span>\n        )}\n\n        <motion.svg\n          strokeWidth=\"4\"\n          strokeLinecap=\"round\"\n          width={20}\n          height={20}\n          viewBox=\"0 0 100 100\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          className=\"relative\"\n        >\n          {/* Shine effect for moon in dark mode */}\n          {moonPath && (\n            <motion.path\n              variants={shineVariant}\n              d={moonPath}\n              className=\"absolute top-0 left-0 stroke-blue-100\"\n              initial=\"hidden\"\n              animate={mode === \"light\" ? \"hidden\" : \"visible\"}\n            />\n          )}\n\n          {/* Sun rays - visible in light mode */}\n          <motion.g\n            variants={raysVariants}\n            initial=\"hidden\"\n            animate={mode === \"dark\" ? \"hidden\" : \"visible\"}\n            style={{\n              strokeLinecap: \"round\",\n              strokeWidth: 6,\n              stroke: \"var(--ds-color-warning)\",\n            }}\n          >\n            <motion.path\n              className=\"origin-center\"\n              variants={rayVariant}\n              d=\"M50 2V11\"\n            />\n            <motion.path variants={rayVariant} d=\"M85 15L78 22\" />\n            <motion.path variants={rayVariant} d=\"M98 50H89\" />\n            <motion.path variants={rayVariant} d=\"M85 85L78 78\" />\n            <motion.path variants={rayVariant} d=\"M50 98V89\" />\n            <motion.path variants={rayVariant} d=\"M23 78L16 84\" />\n            <motion.path variants={rayVariant} d=\"M11 50H2\" />\n            <motion.path variants={rayVariant} d=\"M23 23L16 16\" />\n          </motion.g>\n\n          {/* Main path - Light=Sun(yellow), Dark=Moon(blue) */}\n          <motion.path\n            d={safeCurrentPath}\n            fill=\"transparent\"\n            transition={{ duration: 1, type: \"spring\" }}\n            initial={false}\n            animate={\n              mode === \"light\"\n                ? {\n                    d: sunPath || fallbackPath,\n                    rotate: 0,\n                    scale: 1,\n                    stroke: \"var(--ds-color-warning)\",\n                    fill: \"var(--ds-color-warning)\",\n                    fillOpacity: 0.5,\n                    strokeOpacity: 1,\n                  }\n                : {\n                    d: moonPath || fallbackPath,\n                    rotate: -360,\n                    scale: 2,\n                    stroke: \"var(--ds-color-info)\",\n                    fill: \"var(--ds-color-info)\",\n                    fillOpacity: 0.35,\n                    strokeOpacity: 1,\n                  }\n            }\n          />\n        </motion.svg>\n      </span>\n      {showLabelAndImage && (\n        <span className=\"mt-2 flex h-[90px] w-[180px] flex-col items-center justify-center rounded-md bg-ds-surface-2\">\n          <span className=\"my-4 flex w-[150px] flex-col rounded-md\">\n            <span className=\"mb-1 w-[80px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"mb-1 w-[100px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"w-[150px] rounded-full bg-ds-surface-3 p-1\"></span>\n          </span>\n          <span className=\"my-1 flex w-[150px] justify-between\">\n            <span className=\"mb-1 w-[80px] rounded-full bg-ds-surface-3 p-1\"></span>\n            <span className=\"mb-1 w-[30px] rounded-full bg-ds-accent p-1\"></span>\n          </span>\n        </span>\n      )}\n    </button>\n  );\n}\n"],"mappings":"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"}

package/dist/chunks/animated-content-CLsFnjgr.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"animated-content-CLsFnjgr.cjs","names":[],"sources":["../../src/components/effects/animated-content/AnimatedContent.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { motion, useInView, type TargetAndTransition } from \"framer-motion\";\nimport type {\n  AnimatedContentProps,\n  AnimationPreset,\n  AnimationEase,\n} from \"./types\";\n\n// Easing function mappings\nconst easingMap: Record<AnimationEase, number[] | string> = {\n  linear: [0, 0, 1, 1],\n  easeIn: [0.4, 0, 1, 1],\n  easeOut: [0, 0, 0.2, 1],\n  easeInOut: [0.4, 0, 0.2, 1],\n  circIn: [0.55, 0, 1, 0.45],\n  circOut: [0, 0.55, 0.45, 1],\n  circInOut: [0.85, 0, 0.15, 1],\n  backIn: [0.36, 0, 0.66, -0.56],\n  backOut: [0.34, 1.56, 0.64, 1],\n  backInOut: [0.68, -0.6, 0.32, 1.6],\n  anticipate: \"anticipate\",\n  bounce: \"easeOut\",\n  elastic: \"easeOut\",\n};\n\n// Get spring config for bouncy/elastic animations\nconst getSpringConfig = (ease: AnimationEase) => {\n  switch (ease) {\n    case \"bounce\":\n      return {\n        type: \"spring\" as const,\n        damping: 8,\n        stiffness: 200,\n        bounce: 0.5,\n      };\n    case \"elastic\":\n      return { type: \"spring\" as const, damping: 10, stiffness: 100 };\n    default:\n      return null;\n  }\n};\n\n// Preset animation configurations\nconst getPresetAnimation = (\n  preset: AnimationPreset,\n  distance: number,\n  initialOpacity: number,\n  initialScale: number,\n  reverse: boolean,\n): {\n  initial: TargetAndTransition;\n  animate: TargetAndTransition;\n  exit: TargetAndTransition;\n} => {\n  const dir = reverse ? -1 : 1;\n\n  const presets: Record<\n    AnimationPreset,\n    {\n      initial: TargetAndTransition;\n      animate: TargetAndTransition;\n      exit: TargetAndTransition;\n    }\n  > = {\n    fade: {\n      initial: { opacity: initialOpacity },\n      animate: { opacity: 1 },\n      exit: { opacity: 0 },\n    },\n    scale: {\n      initial: { opacity: initialOpacity, scale: initialScale },\n      animate: { opacity: 1, scale: 1 },\n      exit: { opacity: 0, scale: initialScale },\n    },\n    slideUp: {\n      initial: { opacity: initialOpacity, y: distance * dir },\n      animate: { opacity: 1, y: 0 },\n      exit: { opacity: 0, y: (distance / 2) * dir },\n    },\n    slideDown: {\n      initial: { opacity: initialOpacity, y: -distance * dir },\n      animate: { opacity: 1, y: 0 },\n      exit: { opacity: 0, y: (-distance / 2) * dir },\n    },\n    slideLeft: {\n      initial: { opacity: initialOpacity, x: distance * dir },\n      animate: { opacity: 1, x: 0 },\n      exit: { opacity: 0, x: (distance / 2) * dir },\n    },\n    slideRight: {\n      initial: { opacity: initialOpacity, x: -distance * dir },\n      animate: { opacity: 1, x: 0 },\n      exit: { opacity: 0, x: (-distance / 2) * dir },\n    },\n    elastic: {\n      initial: {\n        opacity: initialOpacity,\n        scale: initialScale,\n        y: distance / 2,\n      },\n      animate: { opacity: 1, scale: 1, y: 0 },\n      exit: { opacity: 0, scale: 0.8, y: distance / 4 },\n    },\n    bounce: {\n      initial: { opacity: initialOpacity, scale: initialScale, y: -distance },\n      animate: { opacity: 1, scale: 1, y: 0 },\n      exit: { opacity: 0, scale: 0.5, y: -distance / 2 },\n    },\n    flip: {\n      initial: { opacity: initialOpacity, rotateX: -90 * dir, scale: 0.9 },\n      animate: { opacity: 1, rotateX: 0, scale: 1 },\n      exit: { opacity: 0, rotateX: 90 * dir, scale: 0.9 },\n    },\n    zoom: {\n      initial: { opacity: initialOpacity, scale: 0, rotate: -10 * dir },\n      animate: { opacity: 1, scale: 1, rotate: 0 },\n      exit: { opacity: 0, scale: 0.5, rotate: 5 * dir },\n    },\n    custom: {\n      initial: { opacity: initialOpacity },\n      animate: { opacity: 1 },\n      exit: { opacity: 0 },\n    },\n  };\n\n  return presets[preset];\n};\n\nexport const AnimatedContent = ({\n  children,\n  preset = \"fade\",\n  direction = \"vertical\",\n  ease = \"easeOut\",\n  exitEase,\n  reverse = false,\n  animateOpacity = true,\n  distance = 50,\n  duration = 0.5,\n  delay = 0,\n  initialOpacity = 0,\n  initialScale = 0.9,\n  threshold = 0.1,\n  disappearAfter = 0,\n  disappearDuration = 0.3,\n  triggerOnView = false,\n  triggerOnce = true,\n  className = \"\",\n  as = \"div\",\n}: AnimatedContentProps) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const isInView = useInView(ref, {\n    once: triggerOnce,\n    amount: threshold,\n  });\n  const [isVisible, setIsVisible] = useState(!triggerOnView);\n  const [hasDisappeared, setHasDisappeared] = useState(false);\n\n  // Handle view-triggered animation\n  useEffect(() => {\n    if (triggerOnView && isInView && !isVisible) {\n      setIsVisible(true);\n    }\n  }, [isInView, triggerOnView, isVisible]);\n\n  // Handle disappear after timeout\n  useEffect(() => {\n    if (disappearAfter > 0 && isVisible && !hasDisappeared) {\n      const timer = setTimeout(() => {\n        setHasDisappeared(true);\n      }, disappearAfter * 1000);\n      return () => clearTimeout(timer);\n    }\n  }, [disappearAfter, isVisible, hasDisappeared]);\n\n  // Get animation config\n  const opacity = animateOpacity ? initialOpacity : 1;\n  const animation = getPresetAnimation(\n    preset,\n    distance,\n    opacity,\n    initialScale,\n    reverse,\n  );\n\n  // Get transition config\n  const springConfig = getSpringConfig(ease);\n  const easingValue = easingMap[ease];\n\n  const transition = springConfig || {\n    duration,\n    delay,\n    ease: (typeof easingValue === \"string\" ? easingValue : easingValue) as any,\n  };\n\n  const exitTransition = exitEase\n    ? { duration: disappearDuration, ease: easingMap[exitEase] }\n    : { duration: disappearDuration };\n\n  // Determine current animation state\n  const shouldAnimate = triggerOnView ? isVisible : true;\n  const currentState = hasDisappeared\n    ? \"exit\"\n    : shouldAnimate\n      ? \"animate\"\n      : \"initial\";\n\n  const MotionComponent = (motion as any)[as] || motion.div;\n\n  return (\n    <MotionComponent\n      ref={ref as any}\n      className={className}\n      initial={animation.initial}\n      animate={\n        currentState === \"animate\"\n          ? animation.animate\n          : currentState === \"exit\"\n            ? animation.exit\n            : animation.initial\n      }\n      transition={\n        (currentState === \"exit\" ? exitTransition : transition) as any\n      }\n      style={{ perspective: preset === \"flip\" ? 1000 : undefined }}\n    >\n      {children}\n    </MotionComponent>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"animated-content-CLsFnjgr.cjs","names":[],"sources":["../../src/components/effects/animated-content/AnimatedContent.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { motion, useInView, type TargetAndTransition } from \"framer-motion\";\nimport type {\n  AnimatedContentProps,\n  AnimationPreset,\n  AnimationEase,\n} from \"./types\";\n\n// Easing function mappings\nconst easingMap: Record<AnimationEase, number[] | string> = {\n  linear: [0, 0, 1, 1],\n  easeIn: [0.4, 0, 1, 1],\n  easeOut: [0, 0, 0.2, 1],\n  easeInOut: [0.4, 0, 0.2, 1],\n  circIn: [0.55, 0, 1, 0.45],\n  circOut: [0, 0.55, 0.45, 1],\n  circInOut: [0.85, 0, 0.15, 1],\n  backIn: [0.36, 0, 0.66, -0.56],\n  backOut: [0.34, 1.56, 0.64, 1],\n  backInOut: [0.68, -0.6, 0.32, 1.6],\n  anticipate: \"anticipate\",\n  bounce: \"easeOut\",\n  elastic: \"easeOut\",\n};\n\n// Get spring config for bouncy/elastic animations\nconst getSpringConfig = (ease: AnimationEase) => {\n  switch (ease) {\n    case \"bounce\":\n      return {\n        type: \"spring\" as const,\n        damping: 8,\n        stiffness: 200,\n        bounce: 0.5,\n      };\n    case \"elastic\":\n      return { type: \"spring\" as const, damping: 10, stiffness: 100 };\n    default:\n      return null;\n  }\n};\n\n// Preset animation configurations\nconst getPresetAnimation = (\n  preset: AnimationPreset,\n  distance: number,\n  initialOpacity: number,\n  initialScale: number,\n  reverse: boolean,\n): {\n  initial: TargetAndTransition;\n  animate: TargetAndTransition;\n  exit: TargetAndTransition;\n} => {\n  const dir = reverse ? -1 : 1;\n\n  const presets: Record<\n    AnimationPreset,\n    {\n      initial: TargetAndTransition;\n      animate: TargetAndTransition;\n      exit: TargetAndTransition;\n    }\n  > = {\n    fade: {\n      initial: { opacity: initialOpacity },\n      animate: { opacity: 1 },\n      exit: { opacity: 0 },\n    },\n    scale: {\n      initial: { opacity: initialOpacity, scale: initialScale },\n      animate: { opacity: 1, scale: 1 },\n      exit: { opacity: 0, scale: initialScale },\n    },\n    slideUp: {\n      initial: { opacity: initialOpacity, y: distance * dir },\n      animate: { opacity: 1, y: 0 },\n      exit: { opacity: 0, y: (distance / 2) * dir },\n    },\n    slideDown: {\n      initial: { opacity: initialOpacity, y: -distance * dir },\n      animate: { opacity: 1, y: 0 },\n      exit: { opacity: 0, y: (-distance / 2) * dir },\n    },\n    slideLeft: {\n      initial: { opacity: initialOpacity, x: distance * dir },\n      animate: { opacity: 1, x: 0 },\n      exit: { opacity: 0, x: (distance / 2) * dir },\n    },\n    slideRight: {\n      initial: { opacity: initialOpacity, x: -distance * dir },\n      animate: { opacity: 1, x: 0 },\n      exit: { opacity: 0, x: (-distance / 2) * dir },\n    },\n    elastic: {\n      initial: {\n        opacity: initialOpacity,\n        scale: initialScale,\n        y: distance / 2,\n      },\n      animate: { opacity: 1, scale: 1, y: 0 },\n      exit: { opacity: 0, scale: 0.8, y: distance / 4 },\n    },\n    bounce: {\n      initial: { opacity: initialOpacity, scale: initialScale, y: -distance },\n      animate: { opacity: 1, scale: 1, y: 0 },\n      exit: { opacity: 0, scale: 0.5, y: -distance / 2 },\n    },\n    flip: {\n      initial: { opacity: initialOpacity, rotateX: -90 * dir, scale: 0.9 },\n      animate: { opacity: 1, rotateX: 0, scale: 1 },\n      exit: { opacity: 0, rotateX: 90 * dir, scale: 0.9 },\n    },\n    zoom: {\n      initial: { opacity: initialOpacity, scale: 0, rotate: -10 * dir },\n      animate: { opacity: 1, scale: 1, rotate: 0 },\n      exit: { opacity: 0, scale: 0.5, rotate: 5 * dir },\n    },\n    custom: {\n      initial: { opacity: initialOpacity },\n      animate: { opacity: 1 },\n      exit: { opacity: 0 },\n    },\n  };\n\n  return presets[preset];\n};\n\nexport const AnimatedContent = ({\n  children,\n  preset = \"fade\",\n  direction = \"vertical\",\n  ease = \"easeOut\",\n  exitEase,\n  reverse = false,\n  animateOpacity = true,\n  distance = 50,\n  duration = 0.5,\n  delay = 0,\n  initialOpacity = 0,\n  initialScale = 0.9,\n  threshold = 0.1,\n  disappearAfter = 0,\n  disappearDuration = 0.3,\n  triggerOnView = false,\n  triggerOnce = true,\n  className = \"\",\n  as = \"div\",\n}: AnimatedContentProps) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const isInView = useInView(ref, {\n    once: triggerOnce,\n    amount: threshold,\n  });\n  const [isVisible, setIsVisible] = useState(!triggerOnView);\n  const [hasDisappeared, setHasDisappeared] = useState(false);\n\n  // Handle view-triggered animation\n  useEffect(() => {\n    if (triggerOnView && isInView && !isVisible) {\n      setIsVisible(true);\n    }\n  }, [isInView, triggerOnView, isVisible]);\n\n  // Handle disappear after timeout\n  useEffect(() => {\n    if (disappearAfter > 0 && isVisible && !hasDisappeared) {\n      const timer = setTimeout(() => {\n        setHasDisappeared(true);\n      }, disappearAfter * 1000);\n      return () => clearTimeout(timer);\n    }\n  }, [disappearAfter, isVisible, hasDisappeared]);\n\n  // Get animation config\n  const opacity = animateOpacity ? initialOpacity : 1;\n  const animation = getPresetAnimation(\n    preset,\n    distance,\n    opacity,\n    initialScale,\n    reverse,\n  );\n\n  // Get transition config\n  const springConfig = getSpringConfig(ease);\n  const easingValue = easingMap[ease];\n\n  const transition = springConfig || {\n    duration,\n    delay,\n    ease: (typeof easingValue === \"string\" ? easingValue : easingValue) as any,\n  };\n\n  const exitTransition = exitEase\n    ? { duration: disappearDuration, ease: easingMap[exitEase] }\n    : { duration: disappearDuration };\n\n  // Determine current animation state\n  const shouldAnimate = triggerOnView ? isVisible : true;\n  const currentState = hasDisappeared\n    ? \"exit\"\n    : shouldAnimate\n      ? \"animate\"\n      : \"initial\";\n\n  const MotionComponent = (motion as any)[as] || motion.div;\n\n  return (\n    <MotionComponent\n      ref={ref as any}\n      className={className}\n      initial={animation.initial}\n      animate={\n        currentState === \"animate\"\n          ? animation.animate\n          : currentState === \"exit\"\n            ? animation.exit\n            : animation.initial\n      }\n      transition={\n        (currentState === \"exit\" ? exitTransition : transition) as any\n      }\n      style={{ perspective: preset === \"flip\" ? 1000 : undefined }}\n    >\n      {children}\n    </MotionComponent>\n  );\n};\n"],"mappings":"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"}

package/dist/chunks/animated-content-bK6xp-vc.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"animated-content-bK6xp-vc.mjs","names":[],"sources":["../../src/components/effects/animated-content/AnimatedContent.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { motion, useInView, type TargetAndTransition } from \"framer-motion\";\nimport type {\n  AnimatedContentProps,\n  AnimationPreset,\n  AnimationEase,\n} from \"./types\";\n\n// Easing function mappings\nconst easingMap: Record<AnimationEase, number[] | string> = {\n  linear: [0, 0, 1, 1],\n  easeIn: [0.4, 0, 1, 1],\n  easeOut: [0, 0, 0.2, 1],\n  easeInOut: [0.4, 0, 0.2, 1],\n  circIn: [0.55, 0, 1, 0.45],\n  circOut: [0, 0.55, 0.45, 1],\n  circInOut: [0.85, 0, 0.15, 1],\n  backIn: [0.36, 0, 0.66, -0.56],\n  backOut: [0.34, 1.56, 0.64, 1],\n  backInOut: [0.68, -0.6, 0.32, 1.6],\n  anticipate: \"anticipate\",\n  bounce: \"easeOut\",\n  elastic: \"easeOut\",\n};\n\n// Get spring config for bouncy/elastic animations\nconst getSpringConfig = (ease: AnimationEase) => {\n  switch (ease) {\n    case \"bounce\":\n      return {\n        type: \"spring\" as const,\n        damping: 8,\n        stiffness: 200,\n        bounce: 0.5,\n      };\n    case \"elastic\":\n      return { type: \"spring\" as const, damping: 10, stiffness: 100 };\n    default:\n      return null;\n  }\n};\n\n// Preset animation configurations\nconst getPresetAnimation = (\n  preset: AnimationPreset,\n  distance: number,\n  initialOpacity: number,\n  initialScale: number,\n  reverse: boolean,\n): {\n  initial: TargetAndTransition;\n  animate: TargetAndTransition;\n  exit: TargetAndTransition;\n} => {\n  const dir = reverse ? -1 : 1;\n\n  const presets: Record<\n    AnimationPreset,\n    {\n      initial: TargetAndTransition;\n      animate: TargetAndTransition;\n      exit: TargetAndTransition;\n    }\n  > = {\n    fade: {\n      initial: { opacity: initialOpacity },\n      animate: { opacity: 1 },\n      exit: { opacity: 0 },\n    },\n    scale: {\n      initial: { opacity: initialOpacity, scale: initialScale },\n      animate: { opacity: 1, scale: 1 },\n      exit: { opacity: 0, scale: initialScale },\n    },\n    slideUp: {\n      initial: { opacity: initialOpacity, y: distance * dir },\n      animate: { opacity: 1, y: 0 },\n      exit: { opacity: 0, y: (distance / 2) * dir },\n    },\n    slideDown: {\n      initial: { opacity: initialOpacity, y: -distance * dir },\n      animate: { opacity: 1, y: 0 },\n      exit: { opacity: 0, y: (-distance / 2) * dir },\n    },\n    slideLeft: {\n      initial: { opacity: initialOpacity, x: distance * dir },\n      animate: { opacity: 1, x: 0 },\n      exit: { opacity: 0, x: (distance / 2) * dir },\n    },\n    slideRight: {\n      initial: { opacity: initialOpacity, x: -distance * dir },\n      animate: { opacity: 1, x: 0 },\n      exit: { opacity: 0, x: (-distance / 2) * dir },\n    },\n    elastic: {\n      initial: {\n        opacity: initialOpacity,\n        scale: initialScale,\n        y: distance / 2,\n      },\n      animate: { opacity: 1, scale: 1, y: 0 },\n      exit: { opacity: 0, scale: 0.8, y: distance / 4 },\n    },\n    bounce: {\n      initial: { opacity: initialOpacity, scale: initialScale, y: -distance },\n      animate: { opacity: 1, scale: 1, y: 0 },\n      exit: { opacity: 0, scale: 0.5, y: -distance / 2 },\n    },\n    flip: {\n      initial: { opacity: initialOpacity, rotateX: -90 * dir, scale: 0.9 },\n      animate: { opacity: 1, rotateX: 0, scale: 1 },\n      exit: { opacity: 0, rotateX: 90 * dir, scale: 0.9 },\n    },\n    zoom: {\n      initial: { opacity: initialOpacity, scale: 0, rotate: -10 * dir },\n      animate: { opacity: 1, scale: 1, rotate: 0 },\n      exit: { opacity: 0, scale: 0.5, rotate: 5 * dir },\n    },\n    custom: {\n      initial: { opacity: initialOpacity },\n      animate: { opacity: 1 },\n      exit: { opacity: 0 },\n    },\n  };\n\n  return presets[preset];\n};\n\nexport const AnimatedContent = ({\n  children,\n  preset = \"fade\",\n  direction = \"vertical\",\n  ease = \"easeOut\",\n  exitEase,\n  reverse = false,\n  animateOpacity = true,\n  distance = 50,\n  duration = 0.5,\n  delay = 0,\n  initialOpacity = 0,\n  initialScale = 0.9,\n  threshold = 0.1,\n  disappearAfter = 0,\n  disappearDuration = 0.3,\n  triggerOnView = false,\n  triggerOnce = true,\n  className = \"\",\n  as = \"div\",\n}: AnimatedContentProps) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const isInView = useInView(ref, {\n    once: triggerOnce,\n    amount: threshold,\n  });\n  const [isVisible, setIsVisible] = useState(!triggerOnView);\n  const [hasDisappeared, setHasDisappeared] = useState(false);\n\n  // Handle view-triggered animation\n  useEffect(() => {\n    if (triggerOnView && isInView && !isVisible) {\n      setIsVisible(true);\n    }\n  }, [isInView, triggerOnView, isVisible]);\n\n  // Handle disappear after timeout\n  useEffect(() => {\n    if (disappearAfter > 0 && isVisible && !hasDisappeared) {\n      const timer = setTimeout(() => {\n        setHasDisappeared(true);\n      }, disappearAfter * 1000);\n      return () => clearTimeout(timer);\n    }\n  }, [disappearAfter, isVisible, hasDisappeared]);\n\n  // Get animation config\n  const opacity = animateOpacity ? initialOpacity : 1;\n  const animation = getPresetAnimation(\n    preset,\n    distance,\n    opacity,\n    initialScale,\n    reverse,\n  );\n\n  // Get transition config\n  const springConfig = getSpringConfig(ease);\n  const easingValue = easingMap[ease];\n\n  const transition = springConfig || {\n    duration,\n    delay,\n    ease: (typeof easingValue === \"string\" ? easingValue : easingValue) as any,\n  };\n\n  const exitTransition = exitEase\n    ? { duration: disappearDuration, ease: easingMap[exitEase] }\n    : { duration: disappearDuration };\n\n  // Determine current animation state\n  const shouldAnimate = triggerOnView ? isVisible : true;\n  const currentState = hasDisappeared\n    ? \"exit\"\n    : shouldAnimate\n      ? \"animate\"\n      : \"initial\";\n\n  const MotionComponent = (motion as any)[as] || motion.div;\n\n  return (\n    <MotionComponent\n      ref={ref as any}\n      className={className}\n      initial={animation.initial}\n      animate={\n        currentState === \"animate\"\n          ? animation.animate\n          : currentState === \"exit\"\n            ? animation.exit\n            : animation.initial\n      }\n      transition={\n        (currentState === \"exit\" ? exitTransition : transition) as any\n      }\n      style={{ perspective: preset === \"flip\" ? 1000 : undefined }}\n    >\n      {children}\n    </MotionComponent>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"animated-content-bK6xp-vc.mjs","names":[],"sources":["../../src/components/effects/animated-content/AnimatedContent.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { motion, useInView, type TargetAndTransition } from \"framer-motion\";\nimport type {\n  AnimatedContentProps,\n  AnimationPreset,\n  AnimationEase,\n} from \"./types\";\n\n// Easing function mappings\nconst easingMap: Record<AnimationEase, number[] | string> = {\n  linear: [0, 0, 1, 1],\n  easeIn: [0.4, 0, 1, 1],\n  easeOut: [0, 0, 0.2, 1],\n  easeInOut: [0.4, 0, 0.2, 1],\n  circIn: [0.55, 0, 1, 0.45],\n  circOut: [0, 0.55, 0.45, 1],\n  circInOut: [0.85, 0, 0.15, 1],\n  backIn: [0.36, 0, 0.66, -0.56],\n  backOut: [0.34, 1.56, 0.64, 1],\n  backInOut: [0.68, -0.6, 0.32, 1.6],\n  anticipate: \"anticipate\",\n  bounce: \"easeOut\",\n  elastic: \"easeOut\",\n};\n\n// Get spring config for bouncy/elastic animations\nconst getSpringConfig = (ease: AnimationEase) => {\n  switch (ease) {\n    case \"bounce\":\n      return {\n        type: \"spring\" as const,\n        damping: 8,\n        stiffness: 200,\n        bounce: 0.5,\n      };\n    case \"elastic\":\n      return { type: \"spring\" as const, damping: 10, stiffness: 100 };\n    default:\n      return null;\n  }\n};\n\n// Preset animation configurations\nconst getPresetAnimation = (\n  preset: AnimationPreset,\n  distance: number,\n  initialOpacity: number,\n  initialScale: number,\n  reverse: boolean,\n): {\n  initial: TargetAndTransition;\n  animate: TargetAndTransition;\n  exit: TargetAndTransition;\n} => {\n  const dir = reverse ? -1 : 1;\n\n  const presets: Record<\n    AnimationPreset,\n    {\n      initial: TargetAndTransition;\n      animate: TargetAndTransition;\n      exit: TargetAndTransition;\n    }\n  > = {\n    fade: {\n      initial: { opacity: initialOpacity },\n      animate: { opacity: 1 },\n      exit: { opacity: 0 },\n    },\n    scale: {\n      initial: { opacity: initialOpacity, scale: initialScale },\n      animate: { opacity: 1, scale: 1 },\n      exit: { opacity: 0, scale: initialScale },\n    },\n    slideUp: {\n      initial: { opacity: initialOpacity, y: distance * dir },\n      animate: { opacity: 1, y: 0 },\n      exit: { opacity: 0, y: (distance / 2) * dir },\n    },\n    slideDown: {\n      initial: { opacity: initialOpacity, y: -distance * dir },\n      animate: { opacity: 1, y: 0 },\n      exit: { opacity: 0, y: (-distance / 2) * dir },\n    },\n    slideLeft: {\n      initial: { opacity: initialOpacity, x: distance * dir },\n      animate: { opacity: 1, x: 0 },\n      exit: { opacity: 0, x: (distance / 2) * dir },\n    },\n    slideRight: {\n      initial: { opacity: initialOpacity, x: -distance * dir },\n      animate: { opacity: 1, x: 0 },\n      exit: { opacity: 0, x: (-distance / 2) * dir },\n    },\n    elastic: {\n      initial: {\n        opacity: initialOpacity,\n        scale: initialScale,\n        y: distance / 2,\n      },\n      animate: { opacity: 1, scale: 1, y: 0 },\n      exit: { opacity: 0, scale: 0.8, y: distance / 4 },\n    },\n    bounce: {\n      initial: { opacity: initialOpacity, scale: initialScale, y: -distance },\n      animate: { opacity: 1, scale: 1, y: 0 },\n      exit: { opacity: 0, scale: 0.5, y: -distance / 2 },\n    },\n    flip: {\n      initial: { opacity: initialOpacity, rotateX: -90 * dir, scale: 0.9 },\n      animate: { opacity: 1, rotateX: 0, scale: 1 },\n      exit: { opacity: 0, rotateX: 90 * dir, scale: 0.9 },\n    },\n    zoom: {\n      initial: { opacity: initialOpacity, scale: 0, rotate: -10 * dir },\n      animate: { opacity: 1, scale: 1, rotate: 0 },\n      exit: { opacity: 0, scale: 0.5, rotate: 5 * dir },\n    },\n    custom: {\n      initial: { opacity: initialOpacity },\n      animate: { opacity: 1 },\n      exit: { opacity: 0 },\n    },\n  };\n\n  return presets[preset];\n};\n\nexport const AnimatedContent = ({\n  children,\n  preset = \"fade\",\n  direction = \"vertical\",\n  ease = \"easeOut\",\n  exitEase,\n  reverse = false,\n  animateOpacity = true,\n  distance = 50,\n  duration = 0.5,\n  delay = 0,\n  initialOpacity = 0,\n  initialScale = 0.9,\n  threshold = 0.1,\n  disappearAfter = 0,\n  disappearDuration = 0.3,\n  triggerOnView = false,\n  triggerOnce = true,\n  className = \"\",\n  as = \"div\",\n}: AnimatedContentProps) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const isInView = useInView(ref, {\n    once: triggerOnce,\n    amount: threshold,\n  });\n  const [isVisible, setIsVisible] = useState(!triggerOnView);\n  const [hasDisappeared, setHasDisappeared] = useState(false);\n\n  // Handle view-triggered animation\n  useEffect(() => {\n    if (triggerOnView && isInView && !isVisible) {\n      setIsVisible(true);\n    }\n  }, [isInView, triggerOnView, isVisible]);\n\n  // Handle disappear after timeout\n  useEffect(() => {\n    if (disappearAfter > 0 && isVisible && !hasDisappeared) {\n      const timer = setTimeout(() => {\n        setHasDisappeared(true);\n      }, disappearAfter * 1000);\n      return () => clearTimeout(timer);\n    }\n  }, [disappearAfter, isVisible, hasDisappeared]);\n\n  // Get animation config\n  const opacity = animateOpacity ? initialOpacity : 1;\n  const animation = getPresetAnimation(\n    preset,\n    distance,\n    opacity,\n    initialScale,\n    reverse,\n  );\n\n  // Get transition config\n  const springConfig = getSpringConfig(ease);\n  const easingValue = easingMap[ease];\n\n  const transition = springConfig || {\n    duration,\n    delay,\n    ease: (typeof easingValue === \"string\" ? easingValue : easingValue) as any,\n  };\n\n  const exitTransition = exitEase\n    ? { duration: disappearDuration, ease: easingMap[exitEase] }\n    : { duration: disappearDuration };\n\n  // Determine current animation state\n  const shouldAnimate = triggerOnView ? isVisible : true;\n  const currentState = hasDisappeared\n    ? \"exit\"\n    : shouldAnimate\n      ? \"animate\"\n      : \"initial\";\n\n  const MotionComponent = (motion as any)[as] || motion.div;\n\n  return (\n    <MotionComponent\n      ref={ref as any}\n      className={className}\n      initial={animation.initial}\n      animate={\n        currentState === \"animate\"\n          ? animation.animate\n          : currentState === \"exit\"\n            ? animation.exit\n            : animation.initial\n      }\n      transition={\n        (currentState === \"exit\" ? exitTransition : transition) as any\n      }\n      style={{ perspective: preset === \"flip\" ? 1000 : undefined }}\n    >\n      {children}\n    </MotionComponent>\n  );\n};\n"],"mappings":";;;;AASA,IAAM,YAAsD;CAC1D,QAAQ;EAAC;EAAG;EAAG;EAAG;EAAE;CACpB,QAAQ;EAAC;EAAK;EAAG;EAAG;EAAE;CACtB,SAAS;EAAC;EAAG;EAAG;EAAK;EAAE;CACvB,WAAW;EAAC;EAAK;EAAG;EAAK;EAAE;CAC3B,QAAQ;EAAC;EAAM;EAAG;EAAG;EAAK;CAC1B,SAAS;EAAC;EAAG;EAAM;EAAM;EAAE;CAC3B,WAAW;EAAC;EAAM;EAAG;EAAM;EAAE;CAC7B,QAAQ;EAAC;EAAM;EAAG;EAAM;EAAM;CAC9B,SAAS;EAAC;EAAM;EAAM;EAAM;EAAE;CAC9B,WAAW;EAAC;EAAM;EAAM;EAAM;EAAI;CAClC,YAAY;CACZ,QAAQ;CACR,SAAS;CACV;AAGD,IAAM,mBAAmB,SAAwB;AAC/C,SAAQ,MAAR;EACE,KAAK,SACH,QAAO;GACL,MAAM;GACN,SAAS;GACT,WAAW;GACX,QAAQ;GACT;EACH,KAAK,UACH,QAAO;GAAE,MAAM;GAAmB,SAAS;GAAI,WAAW;GAAK;EACjE,QACE,QAAO;;;AAKb,IAAM,sBACJ,QACA,UACA,gBACA,cACA,YAKG;CACH,MAAM,MAAM,UAAU,KAAK;AAuE3B,QAAO;EA7DL,MAAM;GACJ,SAAS,EAAE,SAAS,gBAAgB;GACpC,SAAS,EAAE,SAAS,GAAG;GACvB,MAAM,EAAE,SAAS,GAAG;GACrB;EACD,OAAO;GACL,SAAS;IAAE,SAAS;IAAgB,OAAO;IAAc;GACzD,SAAS;IAAE,SAAS;IAAG,OAAO;IAAG;GACjC,MAAM;IAAE,SAAS;IAAG,OAAO;IAAc;GAC1C;EACD,SAAS;GACP,SAAS;IAAE,SAAS;IAAgB,GAAG,WAAW;IAAK;GACvD,SAAS;IAAE,SAAS;IAAG,GAAG;IAAG;GAC7B,MAAM;IAAE,SAAS;IAAG,GAAI,WAAW,IAAK;IAAK;GAC9C;EACD,WAAW;GACT,SAAS;IAAE,SAAS;IAAgB,GAAG,CAAC,WAAW;IAAK;GACxD,SAAS;IAAE,SAAS;IAAG,GAAG;IAAG;GAC7B,MAAM;IAAE,SAAS;IAAG,GAAI,CAAC,WAAW,IAAK;IAAK;GAC/C;EACD,WAAW;GACT,SAAS;IAAE,SAAS;IAAgB,GAAG,WAAW;IAAK;GACvD,SAAS;IAAE,SAAS;IAAG,GAAG;IAAG;GAC7B,MAAM;IAAE,SAAS;IAAG,GAAI,WAAW,IAAK;IAAK;GAC9C;EACD,YAAY;GACV,SAAS;IAAE,SAAS;IAAgB,GAAG,CAAC,WAAW;IAAK;GACxD,SAAS;IAAE,SAAS;IAAG,GAAG;IAAG;GAC7B,MAAM;IAAE,SAAS;IAAG,GAAI,CAAC,WAAW,IAAK;IAAK;GAC/C;EACD,SAAS;GACP,SAAS;IACP,SAAS;IACT,OAAO;IACP,GAAG,WAAW;IACf;GACD,SAAS;IAAE,SAAS;IAAG,OAAO;IAAG,GAAG;IAAG;GACvC,MAAM;IAAE,SAAS;IAAG,OAAO;IAAK,GAAG,WAAW;IAAG;GAClD;EACD,QAAQ;GACN,SAAS;IAAE,SAAS;IAAgB,OAAO;IAAc,GAAG,CAAC;IAAU;GACvE,SAAS;IAAE,SAAS;IAAG,OAAO;IAAG,GAAG;IAAG;GACvC,MAAM;IAAE,SAAS;IAAG,OAAO;IAAK,GAAG,CAAC,WAAW;IAAG;GACnD;EACD,MAAM;GACJ,SAAS;IAAE,SAAS;IAAgB,SAAS,MAAM;IAAK,OAAO;IAAK;GACpE,SAAS;IAAE,SAAS;IAAG,SAAS;IAAG,OAAO;IAAG;GAC7C,MAAM;IAAE,SAAS;IAAG,SAAS,KAAK;IAAK,OAAO;IAAK;GACpD;EACD,MAAM;GACJ,SAAS;IAAE,SAAS;IAAgB,OAAO;IAAG,QAAQ,MAAM;IAAK;GACjE,SAAS;IAAE,SAAS;IAAG,OAAO;IAAG,QAAQ;IAAG;GAC5C,MAAM;IAAE,SAAS;IAAG,OAAO;IAAK,QAAQ,IAAI;IAAK;GAClD;EACD,QAAQ;GACN,SAAS,EAAE,SAAS,gBAAgB;GACpC,SAAS,EAAE,SAAS,GAAG;GACvB,MAAM,EAAE,SAAS,GAAG;GACrB;EAGI,CAAQ;;AAGjB,IAAa,mBAAmB,EAC9B,UACA,SAAS,QACT,YAAY,YACZ,OAAO,WACP,UACA,UAAU,OACV,iBAAiB,MACjB,WAAW,IACX,WAAW,IACX,QAAQ,GACR,iBAAiB,GACjB,eAAe,IACf,YAAY,IACZ,iBAAiB,GACjB,oBAAoB,IACpB,gBAAgB,OAChB,cAAc,MACd,YAAY,IACZ,KAAK,YACqB;CAC1B,MAAM,MAAM,OAAuB,KAAK;CACxC,MAAM,WAAW,UAAU,KAAK;EAC9B,MAAM;EACN,QAAQ;EACT,CAAC;CACF,MAAM,CAAC,WAAW,gBAAgB,SAAS,CAAC,cAAc;CAC1D,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,MAAM;AAG3D,iBAAgB;AACd,MAAI,iBAAiB,YAAY,CAAC,UAChC,cAAa,KAAK;IAEnB;EAAC;EAAU;EAAe;EAAU,CAAC;AAGxC,iBAAgB;AACd,MAAI,iBAAiB,KAAK,aAAa,CAAC,gBAAgB;GACtD,MAAM,QAAQ,iBAAiB;AAC7B,sBAAkB,KAAK;MACtB,iBAAiB,IAAK;AACzB,gBAAa,aAAa,MAAM;;IAEjC;EAAC;EAAgB;EAAW;EAAe,CAAC;CAI/C,MAAM,YAAY,mBAChB,QACA,UAHc,iBAAiB,iBAAiB,GAKhD,cACA,QACD;CAGD,MAAM,eAAe,gBAAgB,KAAK;CAC1C,MAAM,cAAc,UAAU;CAE9B,MAAM,aAAa,gBAAgB;EACjC;EACA;EACA,MAAO,OAAO,gBAAgB,WAAW,cAAc;EACxD;CAED,MAAM,iBAAiB,WACnB;EAAE,UAAU;EAAmB,MAAM,UAAU;EAAW,GAC1D,EAAE,UAAU,mBAAmB;CAInC,MAAM,eAAe,iBACjB,UAFkB,gBAAgB,YAAY,QAI5C,YACA;AAIN,QACE,oBAHuB,OAAe,OAAO,OAAO,KAGpD;EACO;EACM;EACX,SAAS,UAAU;EACnB,SACE,iBAAiB,YACb,UAAU,UACV,iBAAiB,SACf,UAAU,OACV,UAAU;EAElB,YACG,iBAAiB,SAAS,iBAAiB;EAE9C,OAAO,EAAE,aAAa,WAAW,SAAS,MAAO,KAAA,GAAW;EAE3D;EACe,CAAA"}

package/dist/chunks/{ascii-text-OnPOTd2I.cjs → ascii-text-BFnpVur6.cjs}

@@ -362,9 +362,11 @@ var CanvAscii = class {
 	onMouseMove(evt) {
 		const e = evt.touches ? evt.touches[0] : evt;
 		const bounds = this.container.getBoundingClientRect();
+		const x = e.clientX - bounds.left;
+		const y = e.clientY - bounds.top;
 		this.mouse = {
-			x: e.clientX - bounds.left,
-			y: e.clientY - bounds.top
+			x,
+			y
 		};
 	}
 	animate() {
@@ -516,4 +518,4 @@ Object.defineProperty(exports, "ASCIIText", {
 	}
 });
 
-//# sourceMappingURL=ascii-text-OnPOTd2I.cjs.map
+//# sourceMappingURL=ascii-text-BFnpVur6.cjs.map