@hanzo/ui 5.3.26 → 5.3.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (326) hide show
  1. package/content/index.ts +26 -0
  2. package/docs/_registry/index.ts +426 -0
  3. package/docs/_registry/layout/docs-min.tsx +197 -0
  4. package/docs/_registry/layout/page-min.tsx +128 -0
  5. package/docs/components/accordion.tsx +118 -0
  6. package/docs/components/banner.tsx +144 -0
  7. package/docs/components/callout.tsx +112 -0
  8. package/docs/components/card.tsx +52 -0
  9. package/docs/components/codeblock.tsx +258 -0
  10. package/docs/components/dialog/search-algolia.tsx +132 -0
  11. package/docs/components/dialog/search-default.tsx +131 -0
  12. package/docs/components/dialog/search-orama.tsx +143 -0
  13. package/docs/components/dialog/search.tsx +529 -0
  14. package/docs/components/dynamic-codeblock.tsx +129 -0
  15. package/docs/components/files.tsx +81 -0
  16. package/docs/components/github-info.tsx +107 -0
  17. package/docs/components/heading.tsx +33 -0
  18. package/docs/components/image-zoom.css +77 -0
  19. package/docs/components/image-zoom.tsx +58 -0
  20. package/docs/components/index.ts +7 -0
  21. package/docs/components/inline-toc.tsx +48 -0
  22. package/docs/components/sidebar/base.tsx +451 -0
  23. package/docs/components/sidebar/link-item.tsx +65 -0
  24. package/docs/components/sidebar/page-tree.tsx +113 -0
  25. package/docs/components/sidebar/tabs/dropdown.tsx +109 -0
  26. package/docs/components/sidebar/tabs/index.tsx +89 -0
  27. package/docs/components/steps.tsx +9 -0
  28. package/docs/components/tabs.tsx +203 -0
  29. package/docs/components/toc/clerk.tsx +173 -0
  30. package/docs/components/toc/default.tsx +57 -0
  31. package/docs/components/toc/index.tsx +136 -0
  32. package/docs/components/type-table.tsx +174 -0
  33. package/docs/components/ui/accordion.tsx +88 -0
  34. package/docs/components/ui/button.tsx +28 -0
  35. package/docs/components/ui/collapsible.tsx +42 -0
  36. package/docs/components/ui/navigation-menu.tsx +83 -0
  37. package/docs/components/ui/popover.tsx +32 -0
  38. package/docs/components/ui/scroll-area.tsx +59 -0
  39. package/docs/components/ui/tabs.tsx +145 -0
  40. package/docs/contexts/i18n.tsx +56 -0
  41. package/docs/contexts/search.tsx +165 -0
  42. package/docs/contexts/tree.tsx +65 -0
  43. package/docs/css/black.css +39 -0
  44. package/docs/css/catppuccin.css +49 -0
  45. package/docs/css/colors/index.css +51 -0
  46. package/docs/css/dusk.css +47 -0
  47. package/docs/css/layouts/docs.css +1 -0
  48. package/docs/css/layouts/home.css +1 -0
  49. package/docs/css/layouts/notebook.css +1 -0
  50. package/docs/css/neutral.css +7 -0
  51. package/docs/css/ocean.css +48 -0
  52. package/docs/css/preset.css +305 -0
  53. package/docs/css/purple.css +39 -0
  54. package/docs/css/shadcn.css +36 -0
  55. package/docs/css/shiki.css +90 -0
  56. package/docs/css/solar.css +75 -0
  57. package/docs/css/style.css +9 -0
  58. package/docs/css/vitepress.css +77 -0
  59. package/docs/i18n.tsx +30 -0
  60. package/docs/icons.tsx +354 -0
  61. package/docs/layouts/docs/client.tsx +129 -0
  62. package/docs/layouts/docs/index.tsx +321 -0
  63. package/docs/layouts/docs/page/client.tsx +376 -0
  64. package/docs/layouts/docs/page/index.tsx +251 -0
  65. package/docs/layouts/docs/sidebar.tsx +265 -0
  66. package/docs/layouts/home/client.tsx +375 -0
  67. package/docs/layouts/home/index.tsx +51 -0
  68. package/docs/layouts/home/navbar.tsx +55 -0
  69. package/docs/layouts/notebook/client.tsx +281 -0
  70. package/docs/layouts/notebook/index.tsx +461 -0
  71. package/docs/layouts/notebook/page/client.tsx +375 -0
  72. package/docs/layouts/notebook/page/index.tsx +251 -0
  73. package/docs/layouts/notebook/sidebar.tsx +248 -0
  74. package/docs/layouts/shared/index.tsx +89 -0
  75. package/docs/layouts/shared/language-toggle.tsx +66 -0
  76. package/docs/layouts/shared/link-item.tsx +119 -0
  77. package/docs/layouts/shared/search-toggle.tsx +78 -0
  78. package/docs/layouts/shared/theme-toggle.tsx +86 -0
  79. package/docs/mdx.server.tsx +37 -0
  80. package/docs/mdx.tsx +97 -0
  81. package/docs/og.tsx +101 -0
  82. package/docs/page.tsx +85 -0
  83. package/docs/provider/base.tsx +173 -0
  84. package/docs/provider/next.tsx +23 -0
  85. package/docs/provider/react-router.tsx +23 -0
  86. package/docs/provider/tanstack.tsx +23 -0
  87. package/docs/provider/waku.tsx +23 -0
  88. package/docs/source.ts +3 -0
  89. package/docs/theme/typography/LICENSE +21 -0
  90. package/docs/theme/typography/index.ts +201 -0
  91. package/docs/theme/typography/styles.ts +449 -0
  92. package/docs/utils/cn.ts +1 -0
  93. package/docs/utils/is-active.ts +23 -0
  94. package/docs/utils/merge-refs.ts +15 -0
  95. package/docs/utils/use-copy-button.ts +39 -0
  96. package/docs/utils/use-footer-items.ts +27 -0
  97. package/docs/utils/use-is-scroll-top.ts +21 -0
  98. package/package.json +4 -2
  99. package/dist/3d/button.js +0 -298
  100. package/dist/3d/button.mjs +0 -273
  101. package/dist/3d/card.js +0 -234
  102. package/dist/3d/card.mjs +0 -207
  103. package/dist/3d/carousel.js +0 -371
  104. package/dist/3d/carousel.mjs +0 -344
  105. package/dist/3d/grid.js +0 -362
  106. package/dist/3d/grid.mjs +0 -337
  107. package/dist/3d/index.js +0 -1518
  108. package/dist/3d/index.mjs +0 -1472
  109. package/dist/3d/marquee.js +0 -352
  110. package/dist/3d/marquee.mjs +0 -327
  111. package/dist/3d/pin.js +0 -46
  112. package/dist/3d/pin.mjs +0 -24
  113. package/dist/accordion.js +0 -80
  114. package/dist/accordion.mjs +0 -55
  115. package/dist/alert-dialog.js +0 -220
  116. package/dist/alert-dialog.mjs +0 -187
  117. package/dist/alert.js +0 -68
  118. package/dist/alert.mjs +0 -64
  119. package/dist/animation/animated-background.js +0 -424
  120. package/dist/animation/animated-background.mjs +0 -418
  121. package/dist/animation/animated-beam.js +0 -119
  122. package/dist/animation/animated-beam.mjs +0 -97
  123. package/dist/animation/animated-cursor.js +0 -275
  124. package/dist/animation/animated-cursor.mjs +0 -270
  125. package/dist/animation/animated-icon.js +0 -357
  126. package/dist/animation/animated-icon.mjs +0 -351
  127. package/dist/animation/animated-list.js +0 -339
  128. package/dist/animation/animated-list.mjs +0 -333
  129. package/dist/animation/animated-number.js +0 -283
  130. package/dist/animation/animated-number.mjs +0 -277
  131. package/dist/animation/animated-testimonials.js +0 -97
  132. package/dist/animation/animated-testimonials.mjs +0 -75
  133. package/dist/animation/animated-tooltip.js +0 -67
  134. package/dist/animation/animated-tooltip.mjs +0 -45
  135. package/dist/animation/apple-cards-carousel.js +0 -308
  136. package/dist/animation/apple-cards-carousel.mjs +0 -285
  137. package/dist/animation/apple-hello-effect.js +0 -60
  138. package/dist/animation/apple-hello-effect.mjs +0 -38
  139. package/dist/animation/index.js +0 -1952
  140. package/dist/animation/index.mjs +0 -1921
  141. package/dist/avatar.js +0 -71
  142. package/dist/avatar.mjs +0 -47
  143. package/dist/badge.js +0 -66
  144. package/dist/badge.mjs +0 -40
  145. package/dist/blocks/index.js +0 -1665
  146. package/dist/blocks/index.mjs +0 -1626
  147. package/dist/breadcrumb.js +0 -107
  148. package/dist/breadcrumb.mjs +0 -99
  149. package/dist/calendar.js +0 -189
  150. package/dist/calendar.mjs +0 -164
  151. package/dist/carousel.js +0 -278
  152. package/dist/carousel.mjs +0 -249
  153. package/dist/checkbox.js +0 -60
  154. package/dist/checkbox.mjs +0 -35
  155. package/dist/code/block.js +0 -226
  156. package/dist/code/block.mjs +0 -203
  157. package/dist/code/compare.js +0 -446
  158. package/dist/code/compare.mjs +0 -423
  159. package/dist/code/diff.js +0 -430
  160. package/dist/code/diff.mjs +0 -407
  161. package/dist/code/editor.js +0 -243
  162. package/dist/code/editor.mjs +0 -218
  163. package/dist/code/explorer.js +0 -291
  164. package/dist/code/explorer.mjs +0 -268
  165. package/dist/code/index.js +0 -2551
  166. package/dist/code/index.mjs +0 -2510
  167. package/dist/code/preview.js +0 -400
  168. package/dist/code/preview.mjs +0 -377
  169. package/dist/code/snippet.js +0 -274
  170. package/dist/code/snippet.mjs +0 -250
  171. package/dist/code/tabs.js +0 -75
  172. package/dist/code/tabs.mjs +0 -53
  173. package/dist/code/terminal.js +0 -437
  174. package/dist/code/terminal.mjs +0 -414
  175. package/dist/collapsible.js +0 -33
  176. package/dist/collapsible.mjs +0 -9
  177. package/dist/command.js +0 -262
  178. package/dist/command.mjs +0 -232
  179. package/dist/context-menu.js +0 -207
  180. package/dist/context-menu.mjs +0 -171
  181. package/dist/device/index.js +0 -3
  182. package/dist/device/index.mjs +0 -2
  183. package/dist/dialog.js +0 -151
  184. package/dist/dialog.mjs +0 -121
  185. package/dist/dock/basic.js +0 -174
  186. package/dist/dock/basic.mjs +0 -151
  187. package/dist/dock/index.js +0 -628
  188. package/dist/dock/index.mjs +0 -601
  189. package/dist/dock/limelight-nav.js +0 -295
  190. package/dist/dock/limelight-nav.mjs +0 -274
  191. package/dist/dock/macos.js +0 -141
  192. package/dist/dock/macos.mjs +0 -118
  193. package/dist/dock/menu.js +0 -70
  194. package/dist/dock/menu.mjs +0 -48
  195. package/dist/dock/message.js +0 -144
  196. package/dist/dock/message.mjs +0 -122
  197. package/dist/drawer.js +0 -115
  198. package/dist/drawer.mjs +0 -103
  199. package/dist/dropdown-menu.js +0 -202
  200. package/dist/dropdown-menu.mjs +0 -166
  201. package/dist/finance/AdvancedChart.js +0 -48
  202. package/dist/finance/AdvancedChart.mjs +0 -46
  203. package/dist/finance/CompanyProfile.js +0 -48
  204. package/dist/finance/CompanyProfile.mjs +0 -46
  205. package/dist/finance/CryptoScreener.js +0 -45
  206. package/dist/finance/CryptoScreener.mjs +0 -43
  207. package/dist/finance/Financials.js +0 -52
  208. package/dist/finance/Financials.mjs +0 -50
  209. package/dist/finance/ForexScreener.js +0 -46
  210. package/dist/finance/ForexScreener.mjs +0 -44
  211. package/dist/finance/MarketOverview.js +0 -104
  212. package/dist/finance/MarketOverview.mjs +0 -102
  213. package/dist/finance/NewsTimeline.js +0 -44
  214. package/dist/finance/NewsTimeline.mjs +0 -42
  215. package/dist/finance/OrderEntry.js +0 -131
  216. package/dist/finance/OrderEntry.mjs +0 -129
  217. package/dist/finance/OrdersHistory.js +0 -64
  218. package/dist/finance/OrdersHistory.mjs +0 -62
  219. package/dist/finance/PositionsList.js +0 -80
  220. package/dist/finance/PositionsList.mjs +0 -78
  221. package/dist/finance/StockScreener.js +0 -46
  222. package/dist/finance/StockScreener.mjs +0 -44
  223. package/dist/finance/SymbolInfo.js +0 -46
  224. package/dist/finance/SymbolInfo.mjs +0 -44
  225. package/dist/finance/TechnicalAnalysis.js +0 -54
  226. package/dist/finance/TechnicalAnalysis.mjs +0 -52
  227. package/dist/finance/TickerTape.js +0 -56
  228. package/dist/finance/TickerTape.mjs +0 -54
  229. package/dist/finance/TradingPanel.js +0 -191
  230. package/dist/finance/TradingPanel.mjs +0 -189
  231. package/dist/finance/index.js +0 -930
  232. package/dist/finance/index.mjs +0 -914
  233. package/dist/form/index.js +0 -155
  234. package/dist/form/index.mjs +0 -125
  235. package/dist/form.js +0 -172
  236. package/dist/form.mjs +0 -142
  237. package/dist/hover-card.js +0 -58
  238. package/dist/hover-card.mjs +0 -34
  239. package/dist/index.js +0 -10179
  240. package/dist/index.mjs +0 -9785
  241. package/dist/input-otp.js +0 -79
  242. package/dist/input-otp.mjs +0 -54
  243. package/dist/lib/utils.js +0 -28
  244. package/dist/lib/utils.mjs +0 -24
  245. package/dist/navigation/index.js +0 -98
  246. package/dist/navigation/index.mjs +0 -79
  247. package/dist/navigation-menu.js +0 -149
  248. package/dist/navigation-menu.mjs +0 -116
  249. package/dist/pattern/grid-pattern.js +0 -333
  250. package/dist/pattern/grid-pattern.mjs +0 -310
  251. package/dist/pattern/index.js +0 -333
  252. package/dist/pattern/index.mjs +0 -310
  253. package/dist/popover.js +0 -63
  254. package/dist/popover.mjs +0 -37
  255. package/dist/primitives/index.js +0 -10179
  256. package/dist/primitives/index.mjs +0 -9785
  257. package/dist/primitives-export.js +0 -10179
  258. package/dist/primitives-export.mjs +0 -9785
  259. package/dist/progress.js +0 -62
  260. package/dist/progress.mjs +0 -37
  261. package/dist/project/gantt.js +0 -65
  262. package/dist/project/gantt.mjs +0 -43
  263. package/dist/project/index.js +0 -636
  264. package/dist/project/index.mjs +0 -611
  265. package/dist/project/kanban.js +0 -597
  266. package/dist/project/kanban.mjs +0 -572
  267. package/dist/project/list.js +0 -35
  268. package/dist/project/list.mjs +0 -12
  269. package/dist/radio-group.js +0 -68
  270. package/dist/radio-group.mjs +0 -45
  271. package/dist/resizable.js +0 -72
  272. package/dist/resizable.mjs +0 -48
  273. package/dist/scroll-area.js +0 -89
  274. package/dist/scroll-area.mjs +0 -66
  275. package/dist/select.js +0 -140
  276. package/dist/select.mjs +0 -111
  277. package/dist/separator.js +0 -59
  278. package/dist/separator.mjs +0 -34
  279. package/dist/sheet.js +0 -148
  280. package/dist/sheet.mjs +0 -117
  281. package/dist/skeleton.js +0 -32
  282. package/dist/skeleton.mjs +0 -27
  283. package/dist/slider.js +0 -99
  284. package/dist/slider.mjs +0 -73
  285. package/dist/sonner.js +0 -34
  286. package/dist/sonner.mjs +0 -29
  287. package/dist/switch.js +0 -62
  288. package/dist/switch.mjs +0 -37
  289. package/dist/table.js +0 -110
  290. package/dist/table.mjs +0 -101
  291. package/dist/tabs.js +0 -82
  292. package/dist/tabs.mjs +0 -57
  293. package/dist/tailwind/index.js +0 -2023
  294. package/dist/tailwind/index.mjs +0 -2011
  295. package/dist/textarea.js +0 -78
  296. package/dist/textarea.mjs +0 -56
  297. package/dist/toggle-group.js +0 -118
  298. package/dist/toggle-group.mjs +0 -93
  299. package/dist/toggle.js +0 -71
  300. package/dist/toggle.mjs +0 -48
  301. package/dist/tooltip.js +0 -67
  302. package/dist/tooltip.mjs +0 -40
  303. package/dist/types/index.js +0 -57
  304. package/dist/types/index.mjs +0 -51
  305. package/dist/ui/announcement.js +0 -129
  306. package/dist/ui/announcement.mjs +0 -107
  307. package/dist/ui/avatar-group.js +0 -88
  308. package/dist/ui/avatar-group.mjs +0 -65
  309. package/dist/ui/banner.js +0 -85
  310. package/dist/ui/banner.mjs +0 -62
  311. package/dist/ui/cursor.js +0 -78
  312. package/dist/ui/cursor.mjs +0 -56
  313. package/dist/ui/index.js +0 -475
  314. package/dist/ui/index.mjs +0 -442
  315. package/dist/ui/marquee.js +0 -74
  316. package/dist/ui/marquee.mjs +0 -52
  317. package/dist/ui/pill.js +0 -85
  318. package/dist/ui/pill.mjs +0 -62
  319. package/dist/ui/spinner.js +0 -28
  320. package/dist/ui/spinner.mjs +0 -26
  321. package/dist/ui/tags.js +0 -101
  322. package/dist/ui/tags.mjs +0 -79
  323. package/dist/ui/ticker.js +0 -73
  324. package/dist/ui/ticker.mjs +0 -51
  325. package/dist/util/index.js +0 -457
  326. package/dist/util/index.mjs +0 -399
package/dist/alert.mjs DELETED
@@ -1,64 +0,0 @@
1
- "use client";
2
- import { cva } from 'class-variance-authority';
3
- import { clsx } from 'clsx';
4
- import { twMerge } from 'tailwind-merge';
5
- import { jsx } from 'react/jsx-runtime';
6
-
7
- var __defProp = Object.defineProperty;
8
- var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
9
- function cn(...inputs) {
10
- return twMerge(clsx(inputs));
11
- }
12
- __name(cn, "cn");
13
- var alertVariants = cva(
14
- "[&>svg]:text-text-default relative w-full rounded-lg border p-4 [&>svg]:absolute [&>svg]:top-4 [&>svg]:left-4 [&>svg+div]:translate-y-[-3px] [&>svg~*]:pl-7",
15
- {
16
- variants: {
17
- variant: {
18
- default: "bg-bg-tertiary text-text-default",
19
- info: "text-text-secondary [&>svg]:text-text-secondary bg-gray-250 border-gray-100 border-gray-200",
20
- destructive: "border-[#4d0408] bg-[#2d0607] text-[#ff9ea1] [&>svg]:text-[#ff9ea1]",
21
- warning: "border-yellow-800 bg-yellow-900 text-yellow-400 [&>svg]:text-yellow-400",
22
- success: "border-green-800 bg-green-900 text-green-400 [&>svg]:text-green-400",
23
- download: "border-gray-800 bg-gray-900 text-cyan-400 [&>svg]:text-cyan-400"
24
- }
25
- },
26
- defaultVariants: {
27
- variant: "default"
28
- }
29
- }
30
- );
31
- var Alert = /* @__PURE__ */ __name(({ className, variant, ref, ...props }) => /* @__PURE__ */ jsx(
32
- "div",
33
- {
34
- className: cn(alertVariants({ variant }), className),
35
- ref,
36
- role: "alert",
37
- ...props
38
- }
39
- ), "Alert");
40
- Alert.displayName = "Alert";
41
- var AlertTitle = /* @__PURE__ */ __name(({ className, ref, ...props }) => /* @__PURE__ */ jsx(
42
- "h5",
43
- {
44
- className: cn("mb-1 leading-none font-medium tracking-tight", className),
45
- ref,
46
- ...props
47
- }
48
- ), "AlertTitle");
49
- AlertTitle.displayName = "AlertTitle";
50
- var AlertDescription = /* @__PURE__ */ __name(({
51
- className,
52
- ref,
53
- ...props
54
- }) => /* @__PURE__ */ jsx(
55
- "div",
56
- {
57
- className: cn("text-sm [&_p]:leading-relaxed", className),
58
- ref,
59
- ...props
60
- }
61
- ), "AlertDescription");
62
- AlertDescription.displayName = "AlertDescription";
63
-
64
- export { Alert, AlertDescription, AlertTitle };
@@ -1,424 +0,0 @@
1
- "use client";
2
- 'use strict';
3
-
4
- Object.defineProperty(exports, '__esModule', { value: true });
5
-
6
- var react = require('react');
7
- var react$1 = require('motion/react');
8
- var utils = require('@/lib/utils');
9
- var jsxRuntime = require('react/jsx-runtime');
10
-
11
- var __defProp = Object.defineProperty;
12
- var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
13
- function usePrefersReducedMotion() {
14
- const [prefersReducedMotion, setPrefersReducedMotion] = react.useState(false);
15
- react.useEffect(() => {
16
- if (typeof window === "undefined") return;
17
- const mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
18
- setPrefersReducedMotion(mediaQuery.matches);
19
- const handleChange = /* @__PURE__ */ __name((event) => {
20
- setPrefersReducedMotion(event.matches);
21
- }, "handleChange");
22
- mediaQuery.addEventListener("change", handleChange);
23
- return () => mediaQuery.removeEventListener("change", handleChange);
24
- }, []);
25
- return prefersReducedMotion;
26
- }
27
- __name(usePrefersReducedMotion, "usePrefersReducedMotion");
28
- function GradientBackground({
29
- colors,
30
- speed,
31
- intensity,
32
- paused
33
- }) {
34
- const gradientColors = colors.length >= 2 ? colors : ["#ff6b6b", "#4ecdc4", "#45b7d1", "#96ceb4"];
35
- return /* @__PURE__ */ jsxRuntime.jsx(
36
- react$1.motion.div,
37
- {
38
- className: "absolute inset-0",
39
- style: {
40
- background: `linear-gradient(-45deg, ${gradientColors.join(", ")})`,
41
- backgroundSize: "400% 400%"
42
- },
43
- animate: paused ? {} : {
44
- x: ["0%", "100%", "0%"]
45
- },
46
- transition: {
47
- duration: 10 / speed,
48
- repeat: Infinity,
49
- ease: "linear"
50
- }
51
- }
52
- );
53
- }
54
- __name(GradientBackground, "GradientBackground");
55
- function BlobBackground({
56
- colors,
57
- speed,
58
- elementCount,
59
- intensity,
60
- paused
61
- }) {
62
- const blobs = react.useMemo(
63
- () => Array.from({ length: elementCount }, (_, i) => ({
64
- id: i,
65
- color: colors[i % colors.length],
66
- size: Math.random() * 200 + 100,
67
- x: Math.random() * 100,
68
- y: Math.random() * 100,
69
- duration: (Math.random() * 10 + 10) / speed
70
- })),
71
- [elementCount, colors, speed]
72
- );
73
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 overflow-hidden", children: blobs.map((blob) => /* @__PURE__ */ jsxRuntime.jsx(
74
- react$1.motion.div,
75
- {
76
- className: "absolute rounded-full",
77
- style: {
78
- background: `radial-gradient(circle, ${blob.color}40, transparent)`,
79
- width: blob.size * intensity,
80
- height: blob.size * intensity,
81
- filter: "blur(40px)"
82
- },
83
- initial: {
84
- x: `${blob.x}%`,
85
- y: `${blob.y}%`
86
- },
87
- animate: paused ? {} : {
88
- x: [`${blob.x}%`, `${(blob.x + 50) % 100}%`, `${blob.x}%`],
89
- y: [`${blob.y}%`, `${(blob.y + 30) % 100}%`, `${blob.y}%`],
90
- scale: [1, 1.2, 1]
91
- },
92
- transition: {
93
- duration: blob.duration,
94
- repeat: Infinity,
95
- ease: "easeInOut"
96
- }
97
- },
98
- blob.id
99
- )) });
100
- }
101
- __name(BlobBackground, "BlobBackground");
102
- function WaveBackground({
103
- colors,
104
- speed,
105
- intensity,
106
- paused
107
- }) {
108
- const waveColor = colors[0] || "#4ecdc4";
109
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 overflow-hidden", children: [0, 1, 2].map((index) => /* @__PURE__ */ jsxRuntime.jsx(
110
- react$1.motion.div,
111
- {
112
- className: "absolute inset-0",
113
- style: {
114
- background: `radial-gradient(ellipse 100% 50% at center ${50 + index * 20}%, ${waveColor}${Math.round(
115
- 30 * intensity
116
- ).toString(16).padStart(2, "0")}, transparent)`
117
- },
118
- animate: paused ? {} : {
119
- y: [index * 10, index * 10 + 20 * intensity, index * 10]
120
- },
121
- transition: {
122
- duration: (3 + index) / speed,
123
- repeat: Infinity,
124
- ease: "easeInOut"
125
- }
126
- },
127
- index
128
- )) });
129
- }
130
- __name(WaveBackground, "WaveBackground");
131
- function MeshBackground({
132
- colors,
133
- speed,
134
- intensity,
135
- paused
136
- }) {
137
- const meshColors = colors.length >= 4 ? colors.slice(0, 4) : ["#ff6b6b", "#4ecdc4", "#45b7d1", "#96ceb4"];
138
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 overflow-hidden", children: meshColors.map((color, index) => /* @__PURE__ */ jsxRuntime.jsx(
139
- react$1.motion.div,
140
- {
141
- className: "absolute rounded-full",
142
- style: {
143
- background: `radial-gradient(circle, ${color}60, transparent)`,
144
- width: `${60 + index * 20}%`,
145
- height: `${60 + index * 20}%`,
146
- filter: "blur(60px)",
147
- mixBlendMode: "multiply"
148
- },
149
- initial: {
150
- x: `${25 + index * 15}%`,
151
- y: `${25 + index * 15}%`
152
- },
153
- animate: paused ? {} : {
154
- x: [
155
- `${25 + index * 15}%`,
156
- `${35 + index * 15}%`,
157
- `${25 + index * 15}%`
158
- ],
159
- y: [
160
- `${25 + index * 15}%`,
161
- `${15 + index * 15}%`,
162
- `${25 + index * 15}%`
163
- ],
164
- rotate: [0, 180, 360]
165
- },
166
- transition: {
167
- duration: (8 + index * 2) / speed,
168
- repeat: Infinity,
169
- ease: "easeInOut"
170
- }
171
- },
172
- index
173
- )) });
174
- }
175
- __name(MeshBackground, "MeshBackground");
176
- function ParallaxBackground({
177
- layers,
178
- speed,
179
- paused
180
- }) {
181
- const mouseX = react$1.useMotionValue(0);
182
- const mouseY = react$1.useMotionValue(0);
183
- react.useEffect(() => {
184
- const handleMouseMove = /* @__PURE__ */ __name((e) => {
185
- const { clientX, clientY } = e;
186
- const { innerWidth, innerHeight } = window;
187
- mouseX.set((clientX / innerWidth - 0.5) * 100);
188
- mouseY.set((clientY / innerHeight - 0.5) * 100);
189
- }, "handleMouseMove");
190
- window.addEventListener("mousemove", handleMouseMove);
191
- return () => window.removeEventListener("mousemove", handleMouseMove);
192
- }, [mouseX, mouseY]);
193
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 overflow-hidden", children: layers.map((layer, index) => {
194
- const x = react$1.useTransform(
195
- mouseX,
196
- [-50, 50],
197
- [-layer.speed * 10, layer.speed * 10]
198
- );
199
- const y = react$1.useTransform(
200
- mouseY,
201
- [-50, 50],
202
- [-layer.speed * 10, layer.speed * 10]
203
- );
204
- return /* @__PURE__ */ jsxRuntime.jsx(
205
- react$1.motion.div,
206
- {
207
- className: "absolute inset-0",
208
- style: {
209
- background: `radial-gradient(circle, ${layer.color}, transparent)`,
210
- opacity: layer.opacity,
211
- x: paused ? 0 : x,
212
- y: paused ? 0 : y
213
- }
214
- },
215
- index
216
- );
217
- }) });
218
- }
219
- __name(ParallaxBackground, "ParallaxBackground");
220
- function ParticlesBackground({
221
- colors,
222
- speed,
223
- elementCount,
224
- intensity,
225
- paused
226
- }) {
227
- const particles = react.useMemo(
228
- () => Array.from({ length: elementCount }, (_, i) => ({
229
- id: i,
230
- color: colors[i % colors.length],
231
- size: Math.random() * 4 + 2,
232
- x: Math.random() * 100,
233
- y: Math.random() * 100,
234
- duration: (Math.random() * 20 + 20) / speed,
235
- delay: Math.random() * 5
236
- })),
237
- [elementCount, colors, speed]
238
- );
239
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 overflow-hidden", children: particles.map((particle) => /* @__PURE__ */ jsxRuntime.jsx(
240
- react$1.motion.div,
241
- {
242
- className: "absolute rounded-full",
243
- style: {
244
- backgroundColor: particle.color,
245
- width: particle.size * intensity,
246
- height: particle.size * intensity,
247
- opacity: 0.6
248
- },
249
- initial: {
250
- x: `${particle.x}%`,
251
- y: `${particle.y}%`
252
- },
253
- animate: paused ? {} : {
254
- y: [`${particle.y}%`, `${particle.y - 100}%`],
255
- opacity: [0, 0.6, 0]
256
- },
257
- transition: {
258
- duration: particle.duration,
259
- repeat: Infinity,
260
- delay: particle.delay,
261
- ease: "linear"
262
- }
263
- },
264
- particle.id
265
- )) });
266
- }
267
- __name(ParticlesBackground, "ParticlesBackground");
268
- function AnimatedBackground({
269
- animation = "gradient",
270
- speed = 1,
271
- colors = ["#ff6b6b", "#4ecdc4", "#45b7d1", "#96ceb4", "#ffeaa7"],
272
- paused = false,
273
- className,
274
- style,
275
- children,
276
- intensity = 1,
277
- blur = false,
278
- blurAmount = 20,
279
- opacity = 1,
280
- elementCount = 5,
281
- width = "100%",
282
- height = "100%",
283
- fullscreen = false,
284
- parallaxLayers = [
285
- { speed: 0.5, color: "#ff6b6b50", opacity: 0.3 },
286
- { speed: 1, color: "#4ecdc450", opacity: 0.4 },
287
- { speed: 1.5, color: "#45b7d150", opacity: 0.3 }
288
- ]
289
- }) {
290
- const prefersReducedMotion = usePrefersReducedMotion();
291
- const isAnimationPaused = paused || prefersReducedMotion;
292
- const containerStyle = react.useMemo(
293
- () => ({
294
- width: fullscreen ? "100vw" : width,
295
- height: fullscreen ? "100vh" : height,
296
- opacity,
297
- filter: blur ? `blur(${blurAmount}px)` : void 0,
298
- ...style
299
- }),
300
- [fullscreen, width, height, opacity, blur, blurAmount, style]
301
- );
302
- const renderAnimation = /* @__PURE__ */ __name(() => {
303
- const props = { colors, speed, intensity, paused: isAnimationPaused };
304
- switch (animation) {
305
- case "blob":
306
- return /* @__PURE__ */ jsxRuntime.jsx(BlobBackground, { ...props, elementCount });
307
- case "wave":
308
- return /* @__PURE__ */ jsxRuntime.jsx(WaveBackground, { ...props });
309
- case "mesh":
310
- return /* @__PURE__ */ jsxRuntime.jsx(MeshBackground, { ...props });
311
- case "parallax":
312
- return /* @__PURE__ */ jsxRuntime.jsx(
313
- ParallaxBackground,
314
- {
315
- layers: parallaxLayers,
316
- speed,
317
- paused: isAnimationPaused
318
- }
319
- );
320
- case "particles":
321
- return /* @__PURE__ */ jsxRuntime.jsx(ParticlesBackground, { ...props, elementCount });
322
- default:
323
- return /* @__PURE__ */ jsxRuntime.jsx(GradientBackground, { ...props });
324
- }
325
- }, "renderAnimation");
326
- return /* @__PURE__ */ jsxRuntime.jsxs(
327
- "div",
328
- {
329
- className: utils.cn(
330
- "relative overflow-hidden",
331
- fullscreen && "fixed inset-0 z-0",
332
- className
333
- ),
334
- style: containerStyle,
335
- children: [
336
- renderAnimation(),
337
- children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-10 h-full w-full", children })
338
- ]
339
- }
340
- );
341
- }
342
- __name(AnimatedBackground, "AnimatedBackground");
343
- var AnimatedBackgroundPresets = {
344
- /**
345
- * Calm gradient flow
346
- */
347
- CalmGradient: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(
348
- AnimatedBackground,
349
- {
350
- animation: "gradient",
351
- colors: ["#667eea", "#764ba2", "#f093fb", "#f5576c"],
352
- speed: 0.5,
353
- ...props
354
- }
355
- ), "CalmGradient"),
356
- /**
357
- * Ocean waves
358
- */
359
- OceanWaves: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(
360
- AnimatedBackground,
361
- {
362
- animation: "wave",
363
- colors: ["#0093E9", "#80D0C7"],
364
- ...props
365
- }
366
- ), "OceanWaves"),
367
- /**
368
- * Floating bubbles
369
- */
370
- FloatingBubbles: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(
371
- AnimatedBackground,
372
- {
373
- animation: "blob",
374
- colors: ["#667eea", "#764ba2", "#f093fb"],
375
- elementCount: 8,
376
- ...props
377
- }
378
- ), "FloatingBubbles"),
379
- /**
380
- * Cosmic mesh
381
- */
382
- CosmicMesh: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(
383
- AnimatedBackground,
384
- {
385
- animation: "mesh",
386
- colors: ["#667eea", "#764ba2", "#f093fb", "#f5576c"],
387
- ...props
388
- }
389
- ), "CosmicMesh"),
390
- /**
391
- * Starfield particles
392
- */
393
- Starfield: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(
394
- AnimatedBackground,
395
- {
396
- animation: "particles",
397
- colors: ["#ffffff", "#f0f0f0", "#e0e0e0"],
398
- elementCount: 50,
399
- intensity: 0.5,
400
- ...props
401
- }
402
- ), "Starfield"),
403
- /**
404
- * Aurora parallax
405
- */
406
- Aurora: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(
407
- AnimatedBackground,
408
- {
409
- animation: "parallax",
410
- parallaxLayers: [
411
- { speed: 0.3, color: "#00ff8850", opacity: 0.4 },
412
- { speed: 0.6, color: "#0080ff50", opacity: 0.3 },
413
- { speed: 0.9, color: "#8000ff50", opacity: 0.3 },
414
- { speed: 1.2, color: "#ff008050", opacity: 0.2 }
415
- ],
416
- ...props
417
- }
418
- ), "Aurora")
419
- };
420
- var background_default = AnimatedBackground;
421
-
422
- exports.AnimatedBackground = AnimatedBackground;
423
- exports.AnimatedBackgroundPresets = AnimatedBackgroundPresets;
424
- exports.default = background_default;