@rayvelez/findash-ui 1.1.1 → 2.0.0

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 (10) hide show
  1. package/README.md +72 -169
  2. package/dist/index.d.mts +12 -1
  3. package/dist/index.d.ts +12 -1
  4. package/dist/index.js +89 -37
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +90 -39
  7. package/dist/index.mjs.map +1 -1
  8. package/dist/theme.css +2 -188
  9. package/package.json +5 -3
  10. package/tailwind.preset.js +20 -2
package/dist/index.mjs CHANGED
@@ -1,11 +1,61 @@
1
1
  import { clsx } from 'clsx';
2
2
  import { twMerge } from 'tailwind-merge';
3
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
3
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
4
4
  import { useState } from 'react';
5
5
 
6
6
  function cn(...inputs) {
7
7
  return twMerge(clsx(inputs));
8
8
  }
9
+ var icons = {
10
+ add_circle: /* @__PURE__ */ jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z" }),
11
+ remove_circle: /* @__PURE__ */ jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11H7v-2h10v2z" }),
12
+ swap_horiz: /* @__PURE__ */ jsx("path", { d: "M6.99 11L3 15l3.99 4v-3H14v-2H6.99v-3zM21 9l-3.99-4v3H10v2h7.01v3L21 9z" }),
13
+ send: /* @__PURE__ */ jsx("path", { d: "M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" }),
14
+ account_balance_wallet: /* @__PURE__ */ jsx("path", { d: "M21 18v1c0 1.1-.9 2-2 2H5c-1.11 0-2-.9-2-2V5c0-1.1.89-2 2-2h14c1.1 0 2 .9 2 2v1h-9c-1.11 0-2 .9-2 2v8c0 1.1.89 2 2 2h9zm-9-2h10V8H12v8zm4-2.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5z" }),
15
+ bar_chart: /* @__PURE__ */ jsx("path", { d: "M4 9h4v11H4V9zm6-5h4v16h-4V4zm6 8h4v8h-4v-8z" }),
16
+ arrow_back: /* @__PURE__ */ jsx("path", { d: "M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z" }),
17
+ arrow_forward: /* @__PURE__ */ jsx("path", { d: "M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z" }),
18
+ show_chart: /* @__PURE__ */ jsx("path", { d: "M3.5 18.49l6-6.01 4 4L22 6.92l-1.41-1.41-7.09 7.97-4-4L2 16.99z" }),
19
+ trending_up: /* @__PURE__ */ jsx("path", { d: "M16 6l2.29 2.29-4.88 4.88-4-4L2 16.59 3.41 18l6-6 4 4 6.3-6.29L22 12V6z" }),
20
+ dark_mode: /* @__PURE__ */ jsx("path", { d: "M12 3c-4.97 0-9 4.03-9 9s4.03 9 9 9 9-4.03 9-9c0-.46-.04-.92-.1-1.36-.98 1.37-2.58 2.26-4.4 2.26-2.98 0-5.4-2.42-5.4-5.4 0-1.81.89-3.42 2.26-4.4-.44-.06-.9-.1-1.36-.1z" }),
21
+ menu: /* @__PURE__ */ jsx("path", { d: "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" }),
22
+ grid_view: /* @__PURE__ */ jsx("path", { d: "M3 3v8h8V3H3zm6 6H5V5h4v4zm-6 4v8h8v-8H3zm6 6H5v-4h4v4zm4-16v8h8V3h-8zm6 6h-4V5h4v4zm-6 4v8h8v-8h-8zm6 6h-4v-4h4v4z" }),
23
+ close: /* @__PURE__ */ jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }),
24
+ more_horiz: /* @__PURE__ */ jsx("path", { d: "M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" }),
25
+ more_vert: /* @__PURE__ */ jsx("path", { d: "M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" }),
26
+ bolt: /* @__PURE__ */ jsx("path", { d: "M11 21h-1l1-7H7.5c-.58 0-.57-.32-.38-.66.19-.34.05-.08.07-.12C8.48 10.94 10.42 7.54 13 3h1l-1 7h3.5c.49 0 .56.33.47.51l-.07.15C12.96 17.55 11 21 11 21z" }),
27
+ schedule: /* @__PURE__ */ jsx("path", { d: "M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z" }),
28
+ bubble_chart: /* @__PURE__ */ jsxs(Fragment, { children: [
29
+ /* @__PURE__ */ jsx("circle", { cx: "7.2", cy: "14.4", r: "3.2" }),
30
+ /* @__PURE__ */ jsx("circle", { cx: "14.8", cy: "18", r: "2" }),
31
+ /* @__PURE__ */ jsx("circle", { cx: "15.2", cy: "8.8", r: "4.8" })
32
+ ] }),
33
+ expand_more: /* @__PURE__ */ jsx("path", { d: "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" }),
34
+ dashboard: /* @__PURE__ */ jsx("path", { d: "M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z" }),
35
+ analytics: /* @__PURE__ */ jsx("path", { d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM9 17H7v-7h2v7zm4 0h-2V7h2v10zm4 0h-2v-4h2v4z" }),
36
+ chevron_right: /* @__PURE__ */ jsx("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }),
37
+ arrow_outward: /* @__PURE__ */ jsx("path", { d: "M6 6v2h8.59L5 17.59 6.41 19 16 9.41V18h2V6z" }),
38
+ north_east: /* @__PURE__ */ jsx("path", { d: "M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5z" }),
39
+ arrow_upward: /* @__PURE__ */ jsx("path", { d: "M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z" }),
40
+ timeline: /* @__PURE__ */ jsx("path", { d: "M23 8c0 1.1-.9 2-2 2-.18 0-.35-.02-.51-.07l-3.56 3.55c.05.16.07.34.07.52 0 1.1-.9 2-2 2s-2-.9-2-2c0-.18.02-.36.07-.52l-2.55-2.55c-.16.05-.34.07-.52.07s-.36-.02-.52-.07l-4.55 4.56c.05.16.07.33.07.51 0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2c.18 0 .35.02.51.07l4.56-4.55C8.02 9.36 8 9.18 8 9c0-1.1.9-2 2-2s2 .9 2 2c0 .18-.02.36-.07.52l2.55 2.55c.16-.05.34-.07.52-.07s.36.02.52.07l3.55-3.56C19.02 8.35 19 8.18 19 8c0-1.1.9-2 2-2s2 .9 2 2z" }),
41
+ pie_chart: /* @__PURE__ */ jsx("path", { d: "M11 2v20c-5.07-.5-9-4.79-9-10s3.93-9.5 9-10zm2.03 0v8.99H22c-.47-4.74-4.24-8.52-8.97-8.99zm0 11.01V22c4.74-.47 8.5-4.25 8.97-8.99h-8.97z" }),
42
+ visibility: /* @__PURE__ */ jsx("path", { d: "M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z" }),
43
+ chevron_left: /* @__PURE__ */ jsx("path", { d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" })
44
+ };
45
+ function Icon({ name, className, size = 24 }) {
46
+ return /* @__PURE__ */ jsx(
47
+ "svg",
48
+ {
49
+ xmlns: "http://www.w3.org/2000/svg",
50
+ viewBox: "0 0 24 24",
51
+ fill: "currentColor",
52
+ width: size,
53
+ height: size,
54
+ className: cn("inline-block shrink-0", className),
55
+ children: icons[name]
56
+ }
57
+ );
58
+ }
9
59
  function SalesStatisticsCard({
10
60
  visitors = 2025,
11
61
  updatedDaysAgo = 1,
@@ -37,7 +87,7 @@ function SalesStatisticsCard({
37
87
  className: "flex items-center gap-2 bg-white/5 hover:bg-white/10 px-3 py-1.5 rounded-full text-xs transition-colors border border-white/10",
38
88
  children: [
39
89
  "Monthly",
40
- /* @__PURE__ */ jsx("span", { className: "material-icons-round text-sm", children: "expand_more" })
90
+ /* @__PURE__ */ jsx(Icon, { name: "expand_more", size: 14 })
41
91
  ]
42
92
  }
43
93
  )
@@ -45,7 +95,7 @@ function SalesStatisticsCard({
45
95
  /* @__PURE__ */ jsxs("div", { className: "mt-8 z-10 relative", children: [
46
96
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-1", children: [
47
97
  /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: "Visitors" }),
48
- /* @__PURE__ */ jsx("div", { className: "w-5 h-5 rounded-full bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-primary-foreground text-xs transform rotate-45", children: "arrow_upward" }) })
98
+ /* @__PURE__ */ jsx("div", { className: "w-5 h-5 rounded-full bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx(Icon, { name: "arrow_upward", size: 12, className: "text-primary-foreground rotate-45" }) })
49
99
  ] }),
50
100
  /* @__PURE__ */ jsx("p", { className: "text-5xl font-medium tracking-tight", children: visitors.toLocaleString() })
51
101
  ] }),
@@ -87,7 +137,7 @@ function CurrentBalanceCard({
87
137
  {
88
138
  onClick: onPrevious,
89
139
  className: "w-8 h-8 rounded-full border border-border flex items-center justify-center hover:bg-muted transition-colors",
90
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-sm", children: "arrow_back" })
140
+ children: /* @__PURE__ */ jsx(Icon, { name: "arrow_back", size: 14 })
91
141
  }
92
142
  ),
93
143
  /* @__PURE__ */ jsx(
@@ -95,13 +145,13 @@ function CurrentBalanceCard({
95
145
  {
96
146
  onClick: onNext,
97
147
  className: "w-8 h-8 rounded-full border border-border flex items-center justify-center hover:bg-muted transition-colors",
98
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-sm", children: "arrow_forward" })
148
+ children: /* @__PURE__ */ jsx(Icon, { name: "arrow_forward", size: 14 })
99
149
  }
100
150
  )
101
151
  ] })
102
152
  ] }),
103
153
  /* @__PURE__ */ jsxs("div", { className: "bg-primary rounded-3xl p-5 relative overflow-hidden h-36 flex flex-col justify-between", children: [
104
- /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-card rounded-xl flex items-center justify-center shadow-sm", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-foreground", children: "show_chart" }) }),
154
+ /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-card rounded-xl flex items-center justify-center shadow-sm", children: /* @__PURE__ */ jsx(Icon, { name: "show_chart", size: 24, className: "text-foreground" }) }),
105
155
  /* @__PURE__ */ jsxs("div", { className: "absolute right-4 bottom-4 w-40 h-40", children: [
106
156
  /* @__PURE__ */ jsxs("svg", { className: "w-full h-full overflow-visible", viewBox: "0 0 100 50", children: [
107
157
  /* @__PURE__ */ jsx(
@@ -155,7 +205,7 @@ function CurrentBalanceCard({
155
205
  percentageChange,
156
206
  "%"
157
207
  ] }),
158
- /* @__PURE__ */ jsx("div", { className: "w-4 h-4 rounded-full bg-card flex items-center justify-center", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-[10px] text-foreground", children: "north_east" }) })
208
+ /* @__PURE__ */ jsx("div", { className: "w-4 h-4 rounded-full bg-card flex items-center justify-center", children: /* @__PURE__ */ jsx(Icon, { name: "north_east", size: 10, className: "text-foreground" }) })
159
209
  ] }),
160
210
  /* @__PURE__ */ jsxs("p", { className: "text-xs text-primary-foreground/70 font-medium", children: [
161
211
  "Avg score: ",
@@ -195,7 +245,7 @@ function InvestmentGrowthCard({
195
245
  {
196
246
  onClick: onPrevious,
197
247
  className: "w-8 h-8 rounded-full border border-border flex items-center justify-center hover:bg-muted transition-colors",
198
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-sm", children: "arrow_back" })
248
+ children: /* @__PURE__ */ jsx(Icon, { name: "arrow_back", size: 14 })
199
249
  }
200
250
  ),
201
251
  /* @__PURE__ */ jsx(
@@ -203,13 +253,13 @@ function InvestmentGrowthCard({
203
253
  {
204
254
  onClick: onNext,
205
255
  className: "w-8 h-8 rounded-full border border-border flex items-center justify-center hover:bg-muted transition-colors",
206
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-sm", children: "arrow_forward" })
256
+ children: /* @__PURE__ */ jsx(Icon, { name: "arrow_forward", size: 14 })
207
257
  }
208
258
  )
209
259
  ] })
210
260
  ] }),
211
261
  /* @__PURE__ */ jsxs("div", { className: "bg-[hsl(25,100%,65%)] rounded-3xl p-5 relative overflow-hidden h-36 flex flex-col justify-between", children: [
212
- /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-card rounded-xl flex items-center justify-center shadow-sm", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-foreground", children: "trending_up" }) }),
262
+ /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-card rounded-xl flex items-center justify-center shadow-sm", children: /* @__PURE__ */ jsx(Icon, { name: "trending_up", size: 24, className: "text-foreground" }) }),
213
263
  /* @__PURE__ */ jsxs("div", { className: "absolute right-4 bottom-4 w-40 h-40", children: [
214
264
  /* @__PURE__ */ jsxs("svg", { className: "w-full h-full overflow-visible", viewBox: "0 0 100 50", children: [
215
265
  /* @__PURE__ */ jsx(
@@ -263,7 +313,7 @@ function InvestmentGrowthCard({
263
313
  percentage,
264
314
  "%"
265
315
  ] }),
266
- /* @__PURE__ */ jsx("div", { className: "w-4 h-4 rounded-full bg-card flex items-center justify-center", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-[10px] text-foreground", children: "north_east" }) })
316
+ /* @__PURE__ */ jsx("div", { className: "w-4 h-4 rounded-full bg-card flex items-center justify-center", children: /* @__PURE__ */ jsx(Icon, { name: "north_east", size: 10, className: "text-foreground" }) })
267
317
  ] }),
268
318
  /* @__PURE__ */ jsxs("p", { className: "text-xs text-primary-foreground/70 font-medium", children: [
269
319
  "Monthly avg: ",
@@ -300,7 +350,7 @@ function BtcPriceCard({
300
350
  currency
301
351
  ] })
302
352
  ] }),
303
- /* @__PURE__ */ jsx("span", { className: "material-icons-round text-primary-foreground/70 text-sm", children: "north_east" })
353
+ /* @__PURE__ */ jsx(Icon, { name: "north_east", size: 14, className: "text-primary-foreground/70" })
304
354
  ] }),
305
355
  /* @__PURE__ */ jsxs("div", { className: "relative", children: [
306
356
  /* @__PURE__ */ jsxs("span", { className: "text-xs font-bold text-primary-foreground mb-1 block", children: [
@@ -331,7 +381,7 @@ function MarketCapCard({
331
381
  /* @__PURE__ */ jsx("p", { className: "text-secondary-foreground/70 text-xs font-medium", children: "Market cap forecast" }),
332
382
  /* @__PURE__ */ jsx("h3", { className: "text-3xl font-bold text-secondary-foreground mt-1", children: value })
333
383
  ] }),
334
- /* @__PURE__ */ jsx("span", { className: "material-icons-round text-secondary-foreground/70 text-sm", children: "north_east" })
384
+ /* @__PURE__ */ jsx(Icon, { name: "north_east", size: 14, className: "text-secondary-foreground/70" })
335
385
  ] }),
336
386
  /* @__PURE__ */ jsxs("div", { className: "relative h-16 w-full flex items-end", children: [
337
387
  /* @__PURE__ */ jsxs(
@@ -402,7 +452,7 @@ function MarketForecastCard({
402
452
  }
403
453
  return /* @__PURE__ */ jsxs("div", { className: "bg-card p-6 rounded-3xl shadow-soft flex flex-col", children: [
404
454
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 mb-8", children: [
405
- /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full bg-primary flex items-center justify-center shadow-sm", children: /* @__PURE__ */ jsx("span", { className: "material-icons-outlined text-primary-foreground text-lg", children: "timeline" }) }),
455
+ /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full bg-primary flex items-center justify-center shadow-sm", children: /* @__PURE__ */ jsx(Icon, { name: "timeline", size: 18, className: "text-primary-foreground" }) }),
406
456
  /* @__PURE__ */ jsx("h2", { className: "text-xl font-bold w-24 leading-tight", children: "Market forecast" })
407
457
  ] }),
408
458
  /* @__PURE__ */ jsxs("div", { className: "relative pl-2", children: [
@@ -449,7 +499,7 @@ function PortfolioAllocationCard({
449
499
  return /* @__PURE__ */ jsxs("div", { className: "bg-card p-6 rounded-3xl shadow-soft", children: [
450
500
  /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center mb-6", children: [
451
501
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
452
- /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full bg-secondary flex items-center justify-center", children: /* @__PURE__ */ jsx("span", { className: "material-icons-outlined text-secondary-foreground text-lg", children: "pie_chart" }) }),
502
+ /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full bg-secondary flex items-center justify-center", children: /* @__PURE__ */ jsx(Icon, { name: "pie_chart", size: 18, className: "text-secondary-foreground" }) }),
453
503
  /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold", children: "Portfolio" })
454
504
  ] }),
455
505
  /* @__PURE__ */ jsx(
@@ -457,7 +507,7 @@ function PortfolioAllocationCard({
457
507
  {
458
508
  onClick: onOptionsClick,
459
509
  className: "text-muted-foreground hover:text-foreground transition-colors",
460
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-xl", children: "more_horiz" })
510
+ children: /* @__PURE__ */ jsx(Icon, { name: "more_horiz", size: 20 })
461
511
  }
462
512
  )
463
513
  ] }),
@@ -504,7 +554,7 @@ function WatchlistCard({
504
554
  return /* @__PURE__ */ jsxs("div", { className: "bg-card p-6 rounded-3xl shadow-soft", children: [
505
555
  /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center mb-6", children: [
506
556
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
507
- /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx("span", { className: "material-icons-outlined text-primary-foreground text-lg", children: "visibility" }) }),
557
+ /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx(Icon, { name: "visibility", size: 18, className: "text-primary-foreground" }) }),
508
558
  /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold", children: "Watchlist" })
509
559
  ] }),
510
560
  /* @__PURE__ */ jsxs(
@@ -514,7 +564,7 @@ function WatchlistCard({
514
564
  className: "text-xs text-muted-foreground hover:text-foreground transition-colors flex items-center gap-1",
515
565
  children: [
516
566
  "View all",
517
- /* @__PURE__ */ jsx("span", { className: "material-icons-round text-sm", children: "chevron_right" })
567
+ /* @__PURE__ */ jsx(Icon, { name: "chevron_right", size: 14 })
518
568
  ]
519
569
  }
520
570
  )
@@ -581,7 +631,7 @@ function RecentTransactionsCard({
581
631
  return /* @__PURE__ */ jsxs("div", { className: "xl:col-span-2 bg-card p-6 rounded-3xl shadow-soft h-fit", children: [
582
632
  /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-start mb-6", children: [
583
633
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
584
- /* @__PURE__ */ jsx("div", { className: "w-12 h-12 rounded-full bg-foreground text-background flex items-center justify-center", children: /* @__PURE__ */ jsx("span", { className: "material-icons-outlined", children: "bubble_chart" }) }),
634
+ /* @__PURE__ */ jsx("div", { className: "w-12 h-12 rounded-full bg-foreground text-background flex items-center justify-center", children: /* @__PURE__ */ jsx(Icon, { name: "bubble_chart", size: 24 }) }),
585
635
  /* @__PURE__ */ jsxs("div", { children: [
586
636
  /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold", children: "Recent Transactions" }),
587
637
  /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: "Sell currency" })
@@ -599,7 +649,7 @@ function RecentTransactionsCard({
599
649
  ] }),
600
650
  /* @__PURE__ */ jsxs("div", { className: "bg-muted p-4 rounded-2xl flex justify-between items-center", children: [
601
651
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
602
- /* @__PURE__ */ jsx("span", { className: "material-icons-outlined text-muted-foreground", children: "account_balance_wallet" }),
652
+ /* @__PURE__ */ jsx(Icon, { name: "account_balance_wallet", size: 24, className: "text-muted-foreground" }),
603
653
  /* @__PURE__ */ jsx("span", { className: "font-medium text-sm", children: summary })
604
654
  ] }),
605
655
  /* @__PURE__ */ jsx(
@@ -607,7 +657,7 @@ function RecentTransactionsCard({
607
657
  {
608
658
  onClick: onOptionsClick,
609
659
  className: "text-muted-foreground hover:text-foreground",
610
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round", children: "more_vert" })
660
+ children: /* @__PURE__ */ jsx(Icon, { name: "more_vert", size: 24 })
611
661
  }
612
662
  )
613
663
  ] })
@@ -645,7 +695,7 @@ function QuickActionsCard({
645
695
  return /* @__PURE__ */ jsxs("div", { className: "bg-accent-dark dark:bg-black text-accent-dark-foreground p-6 rounded-3xl shadow-soft", children: [
646
696
  /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center mb-6", children: [
647
697
  /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold", children: "Quick Actions" }),
648
- /* @__PURE__ */ jsx("div", { className: "w-8 h-8 rounded-full bg-white/10 flex items-center justify-center", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-sm", children: "bolt" }) })
698
+ /* @__PURE__ */ jsx("div", { className: "w-8 h-8 rounded-full bg-white/10 flex items-center justify-center", children: /* @__PURE__ */ jsx(Icon, { name: "bolt", size: 14 }) })
649
699
  ] }),
650
700
  /* @__PURE__ */ jsx("div", { className: "grid grid-cols-4 gap-3", children: actions.map((action) => /* @__PURE__ */ jsxs(
651
701
  "button",
@@ -657,7 +707,7 @@ function QuickActionsCard({
657
707
  "div",
658
708
  {
659
709
  className: `w-12 h-12 rounded-2xl ${action.color} flex items-center justify-center transition-transform group-hover:scale-110 shadow-lg`,
660
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round", children: action.icon })
710
+ children: /* @__PURE__ */ jsx(Icon, { name: action.icon, size: 24 })
661
711
  }
662
712
  ),
663
713
  /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-muted-foreground group-hover:text-accent-dark-foreground transition-colors", children: action.label })
@@ -667,7 +717,7 @@ function QuickActionsCard({
667
717
  )) }),
668
718
  scheduledTransfer && /* @__PURE__ */ jsx("div", { className: "mt-6 p-4 bg-white/5 rounded-2xl border border-white/10", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
669
719
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
670
- /* @__PURE__ */ jsx("span", { className: "material-icons-outlined text-primary", children: "schedule" }),
720
+ /* @__PURE__ */ jsx(Icon, { name: "schedule", size: 24, className: "text-primary" }),
671
721
  /* @__PURE__ */ jsxs("div", { children: [
672
722
  /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "Scheduled transfer" }),
673
723
  /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: scheduledTransfer.description })
@@ -724,7 +774,7 @@ function FloatingNavBar({
724
774
  index < 4 ? "flex" : "hidden sm:flex"
725
775
  ),
726
776
  title: action.label,
727
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-2xl sm:text-3xl group-hover:text-primary-foreground transition-colors", children: action.icon })
777
+ children: /* @__PURE__ */ jsx(Icon, { name: action.icon, size: 28, className: "group-hover:text-primary-foreground transition-colors" })
728
778
  },
729
779
  action.label
730
780
  )) })
@@ -760,7 +810,7 @@ function Sidebar({
760
810
  children: [
761
811
  /* @__PURE__ */ jsxs("div", { children: [
762
812
  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center lg:justify-start lg:px-4 mb-12", children: [
763
- /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-primary rounded-xl flex items-center justify-center text-primary-foreground font-bold text-xl", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round", children: "grid_view" }) }),
813
+ /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-primary rounded-xl flex items-center justify-center text-primary-foreground font-bold text-xl", children: /* @__PURE__ */ jsx(Icon, { name: "grid_view", size: 24 }) }),
764
814
  /* @__PURE__ */ jsx(
765
815
  "span",
766
816
  {
@@ -786,7 +836,7 @@ function Sidebar({
786
836
  isCollapsed && "lg:justify-center lg:px-0"
787
837
  ),
788
838
  children: [
789
- /* @__PURE__ */ jsx("span", { className: "material-icons-round text-2xl", children: item.icon }),
839
+ /* @__PURE__ */ jsx(Icon, { name: item.icon, size: 24 }),
790
840
  /* @__PURE__ */ jsx(
791
841
  "span",
792
842
  {
@@ -826,7 +876,7 @@ function Sidebar({
826
876
  isCollapsed && "lg:justify-center lg:px-0"
827
877
  ),
828
878
  children: [
829
- /* @__PURE__ */ jsx("span", { className: "material-icons-round text-2xl", children: "dark_mode" }),
879
+ /* @__PURE__ */ jsx(Icon, { name: "dark_mode", size: 24 }),
830
880
  /* @__PURE__ */ jsx(
831
881
  "span",
832
882
  {
@@ -850,13 +900,14 @@ function Sidebar({
850
900
  ),
851
901
  children: [
852
902
  /* @__PURE__ */ jsx(
853
- "span",
903
+ Icon,
854
904
  {
905
+ name: "chevron_left",
906
+ size: 24,
855
907
  className: cn(
856
- "material-icons-round text-2xl transition-transform duration-300",
908
+ "transition-transform duration-300",
857
909
  isCollapsed ? "rotate-180" : ""
858
- ),
859
- children: "chevron_left"
910
+ )
860
911
  }
861
912
  ),
862
913
  /* @__PURE__ */ jsx(
@@ -898,7 +949,7 @@ function MobileNav({
898
949
  return /* @__PURE__ */ jsxs(Fragment, { children: [
899
950
  /* @__PURE__ */ jsxs("header", { className: "lg:hidden fixed top-0 left-0 right-0 h-16 bg-card border-b border-border flex items-center justify-between px-4 z-50", children: [
900
951
  /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
901
- /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-primary rounded-xl flex items-center justify-center text-primary-foreground font-bold text-xl", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round", children: "grid_view" }) }),
952
+ /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-primary rounded-xl flex items-center justify-center text-primary-foreground font-bold text-xl", children: /* @__PURE__ */ jsx(Icon, { name: "grid_view", size: 24 }) }),
902
953
  /* @__PURE__ */ jsx("span", { className: "ml-3 font-bold text-xl tracking-tight", children: "FinDash" })
903
954
  ] }),
904
955
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
@@ -907,7 +958,7 @@ function MobileNav({
907
958
  {
908
959
  onClick: onToggleTheme,
909
960
  className: "w-10 h-10 flex items-center justify-center rounded-xl hover:bg-muted transition-colors",
910
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-2xl", children: "dark_mode" })
961
+ children: /* @__PURE__ */ jsx(Icon, { name: "dark_mode", size: 24 })
911
962
  }
912
963
  ),
913
964
  /* @__PURE__ */ jsx(
@@ -915,7 +966,7 @@ function MobileNav({
915
966
  {
916
967
  onClick: () => setIsMenuOpen(true),
917
968
  className: "w-10 h-10 flex items-center justify-center rounded-xl hover:bg-muted transition-colors",
918
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-2xl", children: "menu" })
969
+ children: /* @__PURE__ */ jsx(Icon, { name: "menu", size: 24 })
919
970
  }
920
971
  )
921
972
  ] })
@@ -940,7 +991,7 @@ function MobileNav({
940
991
  children: [
941
992
  /* @__PURE__ */ jsxs("div", { className: "h-16 flex items-center justify-between px-4 border-b border-border", children: [
942
993
  /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
943
- /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-primary rounded-xl flex items-center justify-center text-primary-foreground font-bold text-xl", children: /* @__PURE__ */ jsx("span", { className: "material-icons-round", children: "grid_view" }) }),
994
+ /* @__PURE__ */ jsx("div", { className: "w-10 h-10 bg-primary rounded-xl flex items-center justify-center text-primary-foreground font-bold text-xl", children: /* @__PURE__ */ jsx(Icon, { name: "grid_view", size: 24 }) }),
944
995
  /* @__PURE__ */ jsx("span", { className: "ml-3 font-bold text-xl tracking-tight", children: "FinDash" })
945
996
  ] }),
946
997
  /* @__PURE__ */ jsx(
@@ -948,7 +999,7 @@ function MobileNav({
948
999
  {
949
1000
  onClick: () => setIsMenuOpen(false),
950
1001
  className: "w-10 h-10 flex items-center justify-center rounded-xl hover:bg-muted transition-colors",
951
- children: /* @__PURE__ */ jsx("span", { className: "material-icons-round text-2xl", children: "close" })
1002
+ children: /* @__PURE__ */ jsx(Icon, { name: "close", size: 24 })
952
1003
  }
953
1004
  )
954
1005
  ] }),
@@ -966,7 +1017,7 @@ function MobileNav({
966
1017
  item.active ? "bg-muted text-foreground" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
967
1018
  ),
968
1019
  children: [
969
- /* @__PURE__ */ jsx("span", { className: "material-icons-round text-3xl", children: item.icon }),
1020
+ /* @__PURE__ */ jsx(Icon, { name: item.icon, size: 30 }),
970
1021
  /* @__PURE__ */ jsx("span", { className: "font-medium", children: item.label })
971
1022
  ]
972
1023
  },
@@ -1037,6 +1088,6 @@ function DashboardTemplate({
1037
1088
  ] });
1038
1089
  }
1039
1090
 
1040
- export { BtcPriceCard, CurrentBalanceCard, DashboardTemplate, FloatingNavBar, InvestmentGrowthCard, MarketCapCard, MarketForecastCard, MobileNav, PortfolioAllocationCard, QuickActionsCard, RecentTransactionsCard, SalesStatisticsCard, Sidebar, WatchlistCard, cn };
1091
+ export { BtcPriceCard, CurrentBalanceCard, DashboardTemplate, FloatingNavBar, Icon, InvestmentGrowthCard, MarketCapCard, MarketForecastCard, MobileNav, PortfolioAllocationCard, QuickActionsCard, RecentTransactionsCard, SalesStatisticsCard, Sidebar, WatchlistCard, cn };
1041
1092
  //# sourceMappingURL=index.mjs.map
1042
1093
  //# sourceMappingURL=index.mjs.map