@tydavidson/design-system 1.1.7 → 1.1.8

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.
package/dist/index.js CHANGED
@@ -1,13 +1,14 @@
1
1
  'use strict';
2
2
 
3
- var React2 = require('react');
4
- var reactSlot = require('@radix-ui/react-slot');
5
- var classVarianceAuthority = require('class-variance-authority');
6
3
  var clsx = require('clsx');
7
4
  var tailwindMerge = require('tailwind-merge');
5
+ var React2 = require('react');
6
+ var nextThemes = require('next-themes');
8
7
  var jsxRuntime = require('react/jsx-runtime');
9
- var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
10
8
  var iconsReact = require('@tabler/icons-react');
9
+ var reactSlot = require('@radix-ui/react-slot');
10
+ var classVarianceAuthority = require('class-variance-authority');
11
+ var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
11
12
  var TogglePrimitive = require('@radix-ui/react-toggle');
12
13
  var ToggleGroupPrimitive = require('@radix-ui/react-toggle-group');
13
14
  var SliderPrimitive = require('@radix-ui/react-slider');
@@ -17,7 +18,9 @@ var SheetPrimitive = require('@radix-ui/react-dialog');
17
18
  var cmdk = require('cmdk');
18
19
  var CollapsiblePrimitive = require('@radix-ui/react-collapsible');
19
20
  var ContextMenuPrimitive = require('@radix-ui/react-context-menu');
20
- var nextThemes = require('next-themes');
21
+ var dynamic = require('next/dynamic');
22
+
23
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
21
24
 
22
25
  function _interopNamespace(e) {
23
26
  if (e && e.__esModule) return e;
@@ -47,8 +50,17 @@ var HoverCardPrimitive__namespace = /*#__PURE__*/_interopNamespace(HoverCardPrim
47
50
  var SheetPrimitive__namespace = /*#__PURE__*/_interopNamespace(SheetPrimitive);
48
51
  var CollapsiblePrimitive__namespace = /*#__PURE__*/_interopNamespace(CollapsiblePrimitive);
49
52
  var ContextMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(ContextMenuPrimitive);
53
+ var dynamic__default = /*#__PURE__*/_interopDefault(dynamic);
50
54
 
51
- // src/components/ui/button.tsx
55
+ var __defProp = Object.defineProperty;
56
+ var __getOwnPropNames = Object.getOwnPropertyNames;
57
+ var __esm = (fn, res) => function __init() {
58
+ return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
59
+ };
60
+ var __export = (target, all) => {
61
+ for (var name in all)
62
+ __defProp(target, name, { get: all[name], enumerable: true });
63
+ };
52
64
  function cn(...inputs) {
53
65
  return tailwindMerge.twMerge(clsx.clsx(inputs));
54
66
  }
@@ -64,6 +76,263 @@ function filterDOMProps(props, propNames) {
64
76
  propNames.forEach((name) => delete result[name]);
65
77
  return result;
66
78
  }
79
+ var init_utils = __esm({
80
+ "src/lib/utils.ts"() {
81
+ }
82
+ });
83
+
84
+ // src/themes/theme-provider.tsx
85
+ var theme_provider_exports = {};
86
+ __export(theme_provider_exports, {
87
+ ThemeProvider: () => ThemeProvider,
88
+ ThemeProviderNoSSR: () => ThemeProviderNoSSR
89
+ });
90
+ function ThemeProvider({
91
+ children,
92
+ ...props
93
+ }) {
94
+ if (typeof window === "undefined") {
95
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
96
+ }
97
+ return /* @__PURE__ */ jsxRuntime.jsx(
98
+ nextThemes.ThemeProvider,
99
+ {
100
+ attribute: "class",
101
+ defaultTheme: "system",
102
+ enableSystem: true,
103
+ disableTransitionOnChange: true,
104
+ ...props,
105
+ children
106
+ }
107
+ );
108
+ }
109
+ function ThemeProviderNoSSR({
110
+ children,
111
+ ...props
112
+ }) {
113
+ const [mounted, setMounted] = React2__namespace.useState(false);
114
+ React2__namespace.useEffect(() => {
115
+ setMounted(true);
116
+ }, []);
117
+ if (!mounted) {
118
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
119
+ }
120
+ return /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider, { ...props, children });
121
+ }
122
+ var init_theme_provider = __esm({
123
+ "src/themes/theme-provider.tsx"() {
124
+ "use client";
125
+ }
126
+ });
127
+
128
+ // src/lib/theme-utils.ts
129
+ exports.mapColorToShadcnVariant = void 0; exports.mapVariantToShadcnVariant = void 0; exports.getColorVariantClasses = void 0; exports.isDarkTheme = void 0;
130
+ var init_theme_utils = __esm({
131
+ "src/lib/theme-utils.ts"() {
132
+ exports.mapColorToShadcnVariant = (color) => {
133
+ switch (color) {
134
+ case "brand":
135
+ return "default";
136
+ case "error":
137
+ return "destructive";
138
+ case "warning":
139
+ case "success":
140
+ return "secondary";
141
+ // Will need additional classes
142
+ default:
143
+ return "default";
144
+ }
145
+ };
146
+ exports.mapVariantToShadcnVariant = (variant) => {
147
+ switch (variant) {
148
+ case "primary":
149
+ return "default";
150
+ case "secondary":
151
+ return "outline";
152
+ case "tertiary":
153
+ return "ghost";
154
+ default:
155
+ return "default";
156
+ }
157
+ };
158
+ exports.getColorVariantClasses = (color, variant) => {
159
+ const colorVariantMap = {
160
+ primary: {
161
+ brand: "bg-brand-600 hover:bg-brand-700 text-white focus-visible:ring-brand-500",
162
+ error: "bg-error-600 hover:bg-error-700 text-white focus-visible:ring-error-500",
163
+ warning: "bg-warning-600 hover:bg-warning-700 text-white focus-visible:ring-warning-500",
164
+ success: "bg-success-600 hover:bg-success-700 text-white focus-visible:ring-success-500"
165
+ },
166
+ secondary: {
167
+ brand: "border-brand-300 text-brand-700 hover:bg-brand-50 focus-visible:ring-brand-500",
168
+ error: "border-error-300 text-error-700 hover:bg-error-50 focus-visible:ring-error-500",
169
+ warning: "border-warning-300 text-warning-700 hover:bg-warning-50 focus-visible:ring-warning-500",
170
+ success: "border-success-300 text-success-700 hover:bg-success-50 focus-visible:ring-success-500"
171
+ },
172
+ tertiary: {
173
+ brand: "text-brand-700 hover:bg-brand-50 focus-visible:ring-brand-500",
174
+ error: "text-error-700 hover:bg-error-50 focus-visible:ring-error-500",
175
+ warning: "text-warning-700 hover:bg-warning-50 focus-visible:ring-warning-500",
176
+ success: "text-success-700 hover:bg-success-50 focus-visible:ring-success-500"
177
+ }
178
+ };
179
+ return colorVariantMap[variant]?.[color] || "";
180
+ };
181
+ exports.isDarkTheme = (theme, systemTheme) => {
182
+ if (theme === "system") {
183
+ return systemTheme === "dark";
184
+ }
185
+ return theme === "dark";
186
+ };
187
+ }
188
+ });
189
+ function useTheme() {
190
+ if (typeof window === "undefined") {
191
+ return {
192
+ theme: "system",
193
+ setTheme: () => {
194
+ },
195
+ resolvedTheme: "light",
196
+ isDark: false
197
+ };
198
+ }
199
+ const { theme, setTheme, resolvedTheme, systemTheme } = nextThemes.useTheme();
200
+ const isDark = exports.isDarkTheme(theme, systemTheme);
201
+ return {
202
+ theme: theme || "system",
203
+ setTheme,
204
+ resolvedTheme: resolvedTheme || "light",
205
+ isDark
206
+ };
207
+ }
208
+ function useThemeServer() {
209
+ return {
210
+ theme: "system",
211
+ setTheme: () => {
212
+ },
213
+ resolvedTheme: "light",
214
+ isDark: false
215
+ };
216
+ }
217
+ function ThemeContextProvider({
218
+ children
219
+ }) {
220
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
221
+ }
222
+ var init_theme_context = __esm({
223
+ "src/themes/theme-context.tsx"() {
224
+ "use client";
225
+ init_theme_utils();
226
+ }
227
+ });
228
+ function ThemeToggle({
229
+ className,
230
+ variant = "icon",
231
+ size = "md",
232
+ ...props
233
+ }) {
234
+ const { theme, setTheme, resolvedTheme } = useTheme();
235
+ const [mounted, setMounted] = React2__namespace.useState(false);
236
+ React2__namespace.useEffect(() => {
237
+ setMounted(true);
238
+ }, []);
239
+ if (!mounted) return null;
240
+ const toggleTheme = () => {
241
+ setTheme(resolvedTheme === "dark" ? "light" : "dark");
242
+ };
243
+ const iconSize = {
244
+ sm: 16,
245
+ md: 20,
246
+ lg: 24
247
+ };
248
+ const sizeClasses = {
249
+ sm: "h-8 w-8",
250
+ md: "h-10 w-10",
251
+ lg: "h-12 w-12"
252
+ };
253
+ const textSizeClasses = {
254
+ sm: "text-xs",
255
+ md: "text-sm",
256
+ lg: "text-base"
257
+ };
258
+ if (variant === "icon") {
259
+ return /* @__PURE__ */ jsxRuntime.jsx(
260
+ "button",
261
+ {
262
+ type: "button",
263
+ onClick: toggleTheme,
264
+ className: cn(
265
+ "inline-flex items-center justify-center rounded-md border border-input bg-background hover:bg-accent hover:text-accent-foreground",
266
+ sizeClasses[size],
267
+ className
268
+ ),
269
+ "aria-label": resolvedTheme === "dark" ? "Switch to light theme" : "Switch to dark theme",
270
+ ...props,
271
+ children: resolvedTheme === "dark" ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconSun, { size: iconSize[size], stroke: 1.5 }) : /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconMoon, { size: iconSize[size], stroke: 1.5 })
272
+ }
273
+ );
274
+ }
275
+ if (variant === "button") {
276
+ return /* @__PURE__ */ jsxRuntime.jsx(
277
+ "button",
278
+ {
279
+ type: "button",
280
+ onClick: toggleTheme,
281
+ className: cn(
282
+ "inline-flex items-center justify-center rounded-md border border-input bg-background px-4 py-2",
283
+ textSizeClasses[size],
284
+ "hover:bg-accent hover:text-accent-foreground",
285
+ className
286
+ ),
287
+ ...props,
288
+ children: resolvedTheme === "dark" ? "Light Mode" : "Dark Mode"
289
+ }
290
+ );
291
+ }
292
+ return /* @__PURE__ */ jsxRuntime.jsx(
293
+ "button",
294
+ {
295
+ type: "button",
296
+ onClick: toggleTheme,
297
+ className: cn(
298
+ "inline-flex items-center justify-center rounded-md px-3 py-2 font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
299
+ textSizeClasses[size],
300
+ resolvedTheme === "dark" ? "bg-accent text-accent-foreground hover:bg-accent/80" : "bg-muted text-muted-foreground hover:bg-muted/80",
301
+ className
302
+ ),
303
+ "aria-label": resolvedTheme === "dark" ? "Switch to light theme" : "Switch to dark theme",
304
+ ...props,
305
+ children: resolvedTheme === "dark" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center", children: [
306
+ /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconSun, { size: iconSize[size], stroke: 1.5, className: "mr-2" }),
307
+ "Light"
308
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center", children: [
309
+ /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconMoon, { size: iconSize[size], stroke: 1.5, className: "mr-2" }),
310
+ "Dark"
311
+ ] })
312
+ }
313
+ );
314
+ }
315
+ var init_theme_toggle = __esm({
316
+ "src/components/ui/theme-toggle/theme-toggle.tsx"() {
317
+ "use client";
318
+ init_theme_context();
319
+ init_utils();
320
+ }
321
+ });
322
+
323
+ // src/components/ui/theme-toggle/index.ts
324
+ var theme_toggle_exports = {};
325
+ __export(theme_toggle_exports, {
326
+ ThemeToggle: () => ThemeToggle
327
+ });
328
+ var init_theme_toggle2 = __esm({
329
+ "src/components/ui/theme-toggle/index.ts"() {
330
+ init_theme_toggle();
331
+ }
332
+ });
333
+
334
+ // src/components/ui/button.tsx
335
+ init_utils();
67
336
  var buttonVariants = classVarianceAuthority.cva(
68
337
  "float-button inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-[4px] text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
69
338
  {
@@ -168,6 +437,9 @@ var Button = React2__namespace.forwardRef(
168
437
  }
169
438
  );
170
439
  Button.displayName = "Button";
440
+
441
+ // src/components/ui/dropdown-menu/dropdown-menu.tsx
442
+ init_utils();
171
443
  var DropdownMenuRoot = DropdownMenuPrimitive__namespace.Root;
172
444
  var DropdownMenuTrigger = React2__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
173
445
  DropdownMenuPrimitive__namespace.Trigger,
@@ -349,6 +621,9 @@ var DropdownMenu = {
349
621
  SubContent: DropdownMenuSubContent,
350
622
  SubTrigger: DropdownMenuSubTrigger
351
623
  };
624
+
625
+ // src/components/typography/heading/heading.tsx
626
+ init_utils();
352
627
  var Heading = React2__namespace.forwardRef(
353
628
  ({
354
629
  level = 1,
@@ -417,6 +692,9 @@ var Heading = React2__namespace.forwardRef(
417
692
  }
418
693
  );
419
694
  Heading.displayName = "Heading";
695
+
696
+ // src/components/typography/text/text.tsx
697
+ init_utils();
420
698
  var Text = React2__namespace.forwardRef(
421
699
  ({
422
700
  size = "md",
@@ -469,6 +747,9 @@ var Text = React2__namespace.forwardRef(
469
747
  }
470
748
  );
471
749
  Text.displayName = "Text";
750
+
751
+ // src/components/ui/toggle.tsx
752
+ init_utils();
472
753
  var Toggle = React2__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
473
754
  TogglePrimitive__namespace.Root,
474
755
  {
@@ -481,6 +762,9 @@ var Toggle = React2__namespace.forwardRef(({ className, ...props }, ref) => /* @
481
762
  }
482
763
  ));
483
764
  Toggle.displayName = TogglePrimitive__namespace.Root.displayName;
765
+
766
+ // src/components/ui/toggle-group.tsx
767
+ init_utils();
484
768
  var ToggleGroup = React2__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
485
769
  ToggleGroupPrimitive__namespace.Root,
486
770
  {
@@ -503,6 +787,9 @@ var ToggleGroupItem = React2__namespace.forwardRef(({ className, ...props }, ref
503
787
  }
504
788
  ));
505
789
  ToggleGroupItem.displayName = ToggleGroupPrimitive__namespace.Item.displayName;
790
+
791
+ // src/components/ui/slider.tsx
792
+ init_utils();
506
793
  var Slider = React2__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
507
794
  SliderPrimitive__namespace.Root,
508
795
  {
@@ -519,6 +806,9 @@ var Slider = React2__namespace.forwardRef(({ className, ...props }, ref) => /* @
519
806
  }
520
807
  ));
521
808
  Slider.displayName = SliderPrimitive__namespace.Root.displayName;
809
+
810
+ // src/components/ui/popover.tsx
811
+ init_utils();
522
812
  var Popover = PopoverPrimitive__namespace.Root;
523
813
  var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
524
814
  var PopoverAnchor = PopoverPrimitive__namespace.Anchor;
@@ -536,6 +826,9 @@ var PopoverContent = React2__namespace.forwardRef(({ className, align = "center"
536
826
  }
537
827
  ) }));
538
828
  PopoverContent.displayName = PopoverPrimitive__namespace.Content.displayName;
829
+
830
+ // src/components/ui/hover-card.tsx
831
+ init_utils();
539
832
  var HoverCard = HoverCardPrimitive__namespace.Root;
540
833
  var HoverCardTrigger = HoverCardPrimitive__namespace.Trigger;
541
834
  var HoverCardContent = React2__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -552,6 +845,9 @@ var HoverCardContent = React2__namespace.forwardRef(({ className, align = "cente
552
845
  }
553
846
  ));
554
847
  HoverCardContent.displayName = HoverCardPrimitive__namespace.Content.displayName;
848
+
849
+ // src/components/ui/sheet.tsx
850
+ init_utils();
555
851
  var Sheet = SheetPrimitive__namespace.Root;
556
852
  var SheetTrigger = SheetPrimitive__namespace.Trigger;
557
853
  var SheetClose = SheetPrimitive__namespace.Close;
@@ -645,6 +941,12 @@ var SheetDescription = React2__namespace.forwardRef(({ className, ...props }, re
645
941
  }
646
942
  ));
647
943
  SheetDescription.displayName = SheetPrimitive__namespace.Description.displayName;
944
+
945
+ // src/components/ui/command.tsx
946
+ init_utils();
947
+
948
+ // src/components/ui/dialog.tsx
949
+ init_utils();
648
950
  var Dialog = SheetPrimitive__namespace.Root;
649
951
  var DialogPortal = SheetPrimitive__namespace.Portal;
650
952
  var DialogOverlay = React2__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -802,6 +1104,9 @@ CommandShortcut.displayName = "CommandShortcut";
802
1104
  var Collapsible = CollapsiblePrimitive__namespace.Root;
803
1105
  var CollapsibleTrigger2 = CollapsiblePrimitive__namespace.CollapsibleTrigger;
804
1106
  var CollapsibleContent2 = CollapsiblePrimitive__namespace.CollapsibleContent;
1107
+
1108
+ // src/components/ui/context-menu.tsx
1109
+ init_utils();
805
1110
  var ContextMenu = ContextMenuPrimitive__namespace.Root;
806
1111
  var ContextMenuTrigger = ContextMenuPrimitive__namespace.Trigger;
807
1112
  var ContextMenuGroup = ContextMenuPrimitive__namespace.Group;
@@ -1222,6 +1527,9 @@ var EmailFooter = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx("div", { styl
1222
1527
  ] })
1223
1528
  ] }) });
1224
1529
 
1530
+ // src/index.ts
1531
+ init_utils();
1532
+
1225
1533
  // src/tokens/colors.ts
1226
1534
  var colors = {
1227
1535
  // Base colors
@@ -1493,182 +1801,46 @@ var tokens = {
1493
1801
  radius,
1494
1802
  shadows
1495
1803
  };
1496
- function ThemeProvider({
1497
- children,
1498
- ...props
1499
- }) {
1500
- return /* @__PURE__ */ jsxRuntime.jsx(
1501
- nextThemes.ThemeProvider,
1502
- {
1503
- attribute: "class",
1504
- defaultTheme: "system",
1505
- enableSystem: true,
1506
- disableTransitionOnChange: true,
1507
- ...props,
1508
- children
1509
- }
1510
- );
1511
- }
1512
1804
 
1513
- // src/lib/theme-utils.ts
1514
- var mapColorToShadcnVariant = (color) => {
1515
- switch (color) {
1516
- case "brand":
1517
- return "default";
1518
- case "error":
1519
- return "destructive";
1520
- case "warning":
1521
- case "success":
1522
- return "secondary";
1523
- // Will need additional classes
1524
- default:
1525
- return "default";
1805
+ // src/themes/index.ts
1806
+ init_theme_provider();
1807
+ init_theme_context();
1808
+ init_theme_toggle2();
1809
+ var DynamicThemeProvider = dynamic__default.default(
1810
+ () => Promise.resolve().then(() => (init_theme_provider(), theme_provider_exports)).then((mod) => ({ default: mod.ThemeProvider })),
1811
+ {
1812
+ ssr: false,
1813
+ loading: () => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { visibility: "hidden" } })
1526
1814
  }
1527
- };
1528
- var mapVariantToShadcnVariant = (variant) => {
1529
- switch (variant) {
1530
- case "primary":
1531
- return "default";
1532
- case "secondary":
1533
- return "outline";
1534
- case "tertiary":
1535
- return "ghost";
1536
- default:
1537
- return "default";
1815
+ );
1816
+ var DynamicThemeProviderNoSSR = dynamic__default.default(
1817
+ () => Promise.resolve().then(() => (init_theme_provider(), theme_provider_exports)).then((mod) => ({ default: mod.ThemeProviderNoSSR })),
1818
+ {
1819
+ ssr: false,
1820
+ loading: () => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { visibility: "hidden" } })
1538
1821
  }
1539
- };
1540
- var getColorVariantClasses = (color, variant) => {
1541
- const colorVariantMap = {
1542
- primary: {
1543
- brand: "bg-brand-600 hover:bg-brand-700 text-white focus-visible:ring-brand-500",
1544
- error: "bg-error-600 hover:bg-error-700 text-white focus-visible:ring-error-500",
1545
- warning: "bg-warning-600 hover:bg-warning-700 text-white focus-visible:ring-warning-500",
1546
- success: "bg-success-600 hover:bg-success-700 text-white focus-visible:ring-success-500"
1547
- },
1548
- secondary: {
1549
- brand: "border-brand-300 text-brand-700 hover:bg-brand-50 focus-visible:ring-brand-500",
1550
- error: "border-error-300 text-error-700 hover:bg-error-50 focus-visible:ring-error-500",
1551
- warning: "border-warning-300 text-warning-700 hover:bg-warning-50 focus-visible:ring-warning-500",
1552
- success: "border-success-300 text-success-700 hover:bg-success-50 focus-visible:ring-success-500"
1553
- },
1554
- tertiary: {
1555
- brand: "text-brand-700 hover:bg-brand-50 focus-visible:ring-brand-500",
1556
- error: "text-error-700 hover:bg-error-50 focus-visible:ring-error-500",
1557
- warning: "text-warning-700 hover:bg-warning-50 focus-visible:ring-warning-500",
1558
- success: "text-success-700 hover:bg-success-50 focus-visible:ring-success-500"
1559
- }
1560
- };
1561
- return colorVariantMap[variant]?.[color] || "";
1562
- };
1563
- var isDarkTheme = (theme, systemTheme) => {
1564
- if (theme === "system") {
1565
- return systemTheme === "dark";
1822
+ );
1823
+ var DynamicThemeToggle = dynamic__default.default(
1824
+ () => Promise.resolve().then(() => (init_theme_toggle2(), theme_toggle_exports)).then((mod) => ({ default: mod.ThemeToggle })),
1825
+ {
1826
+ ssr: false,
1827
+ loading: () => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { visibility: "hidden" } })
1566
1828
  }
1567
- return theme === "dark";
1568
- };
1569
- function useTheme() {
1570
- const { theme, setTheme, resolvedTheme, systemTheme } = nextThemes.useTheme();
1571
- const isDark = isDarkTheme(theme, systemTheme);
1572
- return {
1573
- theme: theme || "system",
1574
- setTheme,
1575
- resolvedTheme: resolvedTheme || "light",
1576
- isDark
1577
- };
1578
- }
1579
- function ThemeContextProvider({
1580
- children
1581
- }) {
1582
- return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
1583
- }
1584
- function ThemeToggle({
1585
- className,
1586
- variant = "icon",
1587
- size = "md",
1829
+ );
1830
+ function SafeThemeProvider({
1831
+ children,
1832
+ noSSR = false,
1588
1833
  ...props
1589
1834
  }) {
1590
- const { theme, setTheme, resolvedTheme } = useTheme();
1591
- const [mounted, setMounted] = React2__namespace.useState(false);
1592
- React2__namespace.useEffect(() => {
1593
- setMounted(true);
1594
- }, []);
1595
- if (!mounted) return null;
1596
- const toggleTheme = () => {
1597
- setTheme(resolvedTheme === "dark" ? "light" : "dark");
1598
- };
1599
- const iconSize = {
1600
- sm: 16,
1601
- md: 20,
1602
- lg: 24
1603
- };
1604
- const sizeClasses = {
1605
- sm: "h-8 w-8",
1606
- md: "h-10 w-10",
1607
- lg: "h-12 w-12"
1608
- };
1609
- const textSizeClasses = {
1610
- sm: "text-xs",
1611
- md: "text-sm",
1612
- lg: "text-base"
1613
- };
1614
- if (variant === "icon") {
1615
- return /* @__PURE__ */ jsxRuntime.jsx(
1616
- "button",
1617
- {
1618
- type: "button",
1619
- onClick: toggleTheme,
1620
- className: cn(
1621
- "inline-flex items-center justify-center rounded-md border border-input bg-background hover:bg-accent hover:text-accent-foreground",
1622
- sizeClasses[size],
1623
- className
1624
- ),
1625
- "aria-label": resolvedTheme === "dark" ? "Switch to light theme" : "Switch to dark theme",
1626
- ...props,
1627
- children: resolvedTheme === "dark" ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconSun, { size: iconSize[size], stroke: 1.5 }) : /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconMoon, { size: iconSize[size], stroke: 1.5 })
1628
- }
1629
- );
1835
+ if (noSSR) {
1836
+ return /* @__PURE__ */ jsxRuntime.jsx(DynamicThemeProviderNoSSR, { ...props, children });
1630
1837
  }
1631
- if (variant === "button") {
1632
- return /* @__PURE__ */ jsxRuntime.jsx(
1633
- "button",
1634
- {
1635
- type: "button",
1636
- onClick: toggleTheme,
1637
- className: cn(
1638
- "inline-flex items-center justify-center rounded-md border border-input bg-background px-4 py-2",
1639
- textSizeClasses[size],
1640
- "hover:bg-accent hover:text-accent-foreground",
1641
- className
1642
- ),
1643
- ...props,
1644
- children: resolvedTheme === "dark" ? "Light Mode" : "Dark Mode"
1645
- }
1646
- );
1647
- }
1648
- return /* @__PURE__ */ jsxRuntime.jsx(
1649
- "button",
1650
- {
1651
- type: "button",
1652
- onClick: toggleTheme,
1653
- className: cn(
1654
- "inline-flex items-center justify-center rounded-md px-3 py-2 font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
1655
- textSizeClasses[size],
1656
- resolvedTheme === "dark" ? "bg-accent text-accent-foreground hover:bg-accent/80" : "bg-muted text-muted-foreground hover:bg-muted/80",
1657
- className
1658
- ),
1659
- "aria-label": resolvedTheme === "dark" ? "Switch to light theme" : "Switch to dark theme",
1660
- ...props,
1661
- children: resolvedTheme === "dark" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center", children: [
1662
- /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconSun, { size: iconSize[size], stroke: 1.5, className: "mr-2" }),
1663
- "Light"
1664
- ] }) : /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center", children: [
1665
- /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconMoon, { size: iconSize[size], stroke: 1.5, className: "mr-2" }),
1666
- "Dark"
1667
- ] })
1668
- }
1669
- );
1838
+ return /* @__PURE__ */ jsxRuntime.jsx(DynamicThemeProvider, { ...props, children });
1670
1839
  }
1671
1840
 
1841
+ // src/themes/index.ts
1842
+ init_theme_utils();
1843
+
1672
1844
  exports.Button = Button;
1673
1845
  exports.Collapsible = Collapsible;
1674
1846
  exports.CollapsibleContent = CollapsibleContent2;
@@ -1698,6 +1870,9 @@ exports.ContextMenuSubContent = ContextMenuSubContent;
1698
1870
  exports.ContextMenuSubTrigger = ContextMenuSubTrigger;
1699
1871
  exports.ContextMenuTrigger = ContextMenuTrigger;
1700
1872
  exports.DropdownMenu = DropdownMenu;
1873
+ exports.DynamicThemeProvider = DynamicThemeProvider;
1874
+ exports.DynamicThemeProviderNoSSR = DynamicThemeProviderNoSSR;
1875
+ exports.DynamicThemeToggle = DynamicThemeToggle;
1701
1876
  exports.EmailButton = EmailButton;
1702
1877
  exports.EmailCaption = EmailCaption;
1703
1878
  exports.EmailContainer = EmailContainer;
@@ -1715,6 +1890,7 @@ exports.Popover = Popover;
1715
1890
  exports.PopoverAnchor = PopoverAnchor;
1716
1891
  exports.PopoverContent = PopoverContent;
1717
1892
  exports.PopoverTrigger = PopoverTrigger;
1893
+ exports.SafeThemeProvider = SafeThemeProvider;
1718
1894
  exports.Sheet = Sheet;
1719
1895
  exports.SheetClose = SheetClose;
1720
1896
  exports.SheetContent = SheetContent;
@@ -1729,6 +1905,7 @@ exports.Slider = Slider;
1729
1905
  exports.Text = Text;
1730
1906
  exports.ThemeContextProvider = ThemeContextProvider;
1731
1907
  exports.ThemeProvider = ThemeProvider;
1908
+ exports.ThemeProviderNoSSR = ThemeProviderNoSSR;
1732
1909
  exports.ThemeToggle = ThemeToggle;
1733
1910
  exports.Toggle = Toggle;
1734
1911
  exports.ToggleGroup = ToggleGroup;
@@ -1738,16 +1915,13 @@ exports.cn = cn;
1738
1915
  exports.colors = colors;
1739
1916
  exports.filterDOMProps = filterDOMProps;
1740
1917
  exports.generateId = generateId;
1741
- exports.getColorVariantClasses = getColorVariantClasses;
1742
- exports.isDarkTheme = isDarkTheme;
1743
1918
  exports.isNotNullOrUndefined = isNotNullOrUndefined;
1744
- exports.mapColorToShadcnVariant = mapColorToShadcnVariant;
1745
- exports.mapVariantToShadcnVariant = mapVariantToShadcnVariant;
1746
1919
  exports.radius = radius;
1747
1920
  exports.shadows = shadows;
1748
1921
  exports.spacing = spacing;
1749
1922
  exports.tokens = tokens;
1750
1923
  exports.typography = typography;
1751
1924
  exports.useTheme = useTheme;
1925
+ exports.useThemeServer = useThemeServer;
1752
1926
  //# sourceMappingURL=index.js.map
1753
1927
  //# sourceMappingURL=index.js.map