@tydavidson/design-system 1.1.9 → 1.1.10
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.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +72 -87
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +71 -81
- package/dist/index.mjs.map +1 -1
- package/dist/themes/index.d.mts +11 -17
- package/dist/themes/index.d.ts +11 -17
- package/dist/themes/index.js +71 -86
- package/dist/themes/index.js.map +1 -1
- package/dist/themes/index.mjs +70 -80
- package/dist/themes/index.mjs.map +1 -1
- package/docs/setup-guide.md +15 -15
- package/docs/troubleshooting.md +7 -7
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
@@ -3,7 +3,7 @@ import * as React from 'react';
|
|
3
3
|
import React__default from 'react';
|
4
4
|
import { VariantProps } from 'class-variance-authority';
|
5
5
|
import { ThemeColor } from './themes/index.mjs';
|
6
|
-
export {
|
6
|
+
export { ClientThemeProvider, ClientThemeToggle, ComponentVariant, ThemeContextProvider, ThemeProvider, ThemeProviderNoSSR, ThemeToggle, getColorVariantClasses, isDarkTheme, mapColorToShadcnVariant, mapVariantToShadcnVariant, useTheme, useThemeServer } from './themes/index.mjs';
|
7
7
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
8
8
|
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
9
9
|
import * as TogglePrimitive from '@radix-ui/react-toggle';
|
package/dist/index.d.ts
CHANGED
@@ -3,7 +3,7 @@ import * as React from 'react';
|
|
3
3
|
import React__default from 'react';
|
4
4
|
import { VariantProps } from 'class-variance-authority';
|
5
5
|
import { ThemeColor } from './themes/index.js';
|
6
|
-
export {
|
6
|
+
export { ClientThemeProvider, ClientThemeToggle, ComponentVariant, ThemeContextProvider, ThemeProvider, ThemeProviderNoSSR, ThemeToggle, getColorVariantClasses, isDarkTheme, mapColorToShadcnVariant, mapVariantToShadcnVariant, useTheme, useThemeServer } from './themes/index.js';
|
7
7
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
8
8
|
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
9
9
|
import * as TogglePrimitive from '@radix-ui/react-toggle';
|
package/dist/index.js
CHANGED
@@ -17,9 +17,6 @@ var SheetPrimitive = require('@radix-ui/react-dialog');
|
|
17
17
|
var cmdk = require('cmdk');
|
18
18
|
var CollapsiblePrimitive = require('@radix-ui/react-collapsible');
|
19
19
|
var ContextMenuPrimitive = require('@radix-ui/react-context-menu');
|
20
|
-
var dynamic = require('next/dynamic');
|
21
|
-
|
22
|
-
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
23
20
|
|
24
21
|
function _interopNamespace(e) {
|
25
22
|
if (e && e.__esModule) return e;
|
@@ -49,10 +46,11 @@ var HoverCardPrimitive__namespace = /*#__PURE__*/_interopNamespace(HoverCardPrim
|
|
49
46
|
var SheetPrimitive__namespace = /*#__PURE__*/_interopNamespace(SheetPrimitive);
|
50
47
|
var CollapsiblePrimitive__namespace = /*#__PURE__*/_interopNamespace(CollapsiblePrimitive);
|
51
48
|
var ContextMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(ContextMenuPrimitive);
|
52
|
-
var dynamic__default = /*#__PURE__*/_interopDefault(dynamic);
|
53
49
|
|
54
50
|
var __defProp = Object.defineProperty;
|
51
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
55
52
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
53
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
56
54
|
var __esm = (fn, res) => function __init() {
|
57
55
|
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
58
56
|
};
|
@@ -60,6 +58,15 @@ var __export = (target, all) => {
|
|
60
58
|
for (var name in all)
|
61
59
|
__defProp(target, name, { get: all[name], enumerable: true });
|
62
60
|
};
|
61
|
+
var __copyProps = (to, from, except, desc) => {
|
62
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
63
|
+
for (let key of __getOwnPropNames(from))
|
64
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
65
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
66
|
+
}
|
67
|
+
return to;
|
68
|
+
};
|
69
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
63
70
|
function cn(...inputs) {
|
64
71
|
return tailwindMerge.twMerge(clsx.clsx(inputs));
|
65
72
|
}
|
@@ -80,58 +87,6 @@ var init_utils = __esm({
|
|
80
87
|
}
|
81
88
|
});
|
82
89
|
|
83
|
-
// src/themes/theme-provider.tsx
|
84
|
-
var theme_provider_exports = {};
|
85
|
-
__export(theme_provider_exports, {
|
86
|
-
ThemeProvider: () => ThemeProvider,
|
87
|
-
ThemeProviderNoSSR: () => ThemeProviderNoSSR
|
88
|
-
});
|
89
|
-
function ThemeProvider({
|
90
|
-
children,
|
91
|
-
...props
|
92
|
-
}) {
|
93
|
-
const [NextThemesProvider, setNextThemesProvider] = React2__namespace.useState(null);
|
94
|
-
const [mounted, setMounted] = React2__namespace.useState(false);
|
95
|
-
React2__namespace.useEffect(() => {
|
96
|
-
import('next-themes').then(({ ThemeProvider: Provider }) => {
|
97
|
-
setNextThemesProvider(() => Provider);
|
98
|
-
setMounted(true);
|
99
|
-
});
|
100
|
-
}, []);
|
101
|
-
if (!mounted || !NextThemesProvider) {
|
102
|
-
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
103
|
-
}
|
104
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
105
|
-
NextThemesProvider,
|
106
|
-
{
|
107
|
-
attribute: "class",
|
108
|
-
defaultTheme: "system",
|
109
|
-
enableSystem: true,
|
110
|
-
disableTransitionOnChange: true,
|
111
|
-
...props,
|
112
|
-
children
|
113
|
-
}
|
114
|
-
);
|
115
|
-
}
|
116
|
-
function ThemeProviderNoSSR({
|
117
|
-
children,
|
118
|
-
...props
|
119
|
-
}) {
|
120
|
-
const [mounted, setMounted] = React2__namespace.useState(false);
|
121
|
-
React2__namespace.useEffect(() => {
|
122
|
-
setMounted(true);
|
123
|
-
}, []);
|
124
|
-
if (!mounted) {
|
125
|
-
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
126
|
-
}
|
127
|
-
return /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider, { ...props, children });
|
128
|
-
}
|
129
|
-
var init_theme_provider = __esm({
|
130
|
-
"src/themes/theme-provider.tsx"() {
|
131
|
-
"use client";
|
132
|
-
}
|
133
|
-
});
|
134
|
-
|
135
90
|
// src/lib/theme-utils.ts
|
136
91
|
exports.mapColorToShadcnVariant = void 0; exports.mapVariantToShadcnVariant = void 0; exports.getColorVariantClasses = void 0; exports.isDarkTheme = void 0;
|
137
92
|
var init_theme_utils = __esm({
|
@@ -1822,47 +1777,81 @@ var tokens = {
|
|
1822
1777
|
radius,
|
1823
1778
|
shadows
|
1824
1779
|
};
|
1780
|
+
function ThemeProvider({
|
1781
|
+
children,
|
1782
|
+
...props
|
1783
|
+
}) {
|
1784
|
+
const [NextThemesProvider, setNextThemesProvider] = React2__namespace.useState(null);
|
1785
|
+
const [mounted, setMounted] = React2__namespace.useState(false);
|
1786
|
+
React2__namespace.useEffect(() => {
|
1787
|
+
import('next-themes').then(({ ThemeProvider: Provider }) => {
|
1788
|
+
setNextThemesProvider(() => Provider);
|
1789
|
+
setMounted(true);
|
1790
|
+
});
|
1791
|
+
}, []);
|
1792
|
+
if (!mounted || !NextThemesProvider) {
|
1793
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
1794
|
+
}
|
1795
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
1796
|
+
NextThemesProvider,
|
1797
|
+
{
|
1798
|
+
attribute: "class",
|
1799
|
+
defaultTheme: "system",
|
1800
|
+
enableSystem: true,
|
1801
|
+
disableTransitionOnChange: true,
|
1802
|
+
...props,
|
1803
|
+
children
|
1804
|
+
}
|
1805
|
+
);
|
1806
|
+
}
|
1807
|
+
function ThemeProviderNoSSR({
|
1808
|
+
children,
|
1809
|
+
...props
|
1810
|
+
}) {
|
1811
|
+
const [mounted, setMounted] = React2__namespace.useState(false);
|
1812
|
+
React2__namespace.useEffect(() => {
|
1813
|
+
setMounted(true);
|
1814
|
+
}, []);
|
1815
|
+
if (!mounted) {
|
1816
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
1817
|
+
}
|
1818
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider, { ...props, children });
|
1819
|
+
}
|
1825
1820
|
|
1826
1821
|
// src/themes/index.ts
|
1827
|
-
init_theme_provider();
|
1828
1822
|
init_theme_context();
|
1829
1823
|
init_theme_toggle2();
|
1830
|
-
|
1831
|
-
() => Promise.resolve().then(() => (init_theme_provider(), theme_provider_exports)).then((mod) => ({ default: mod.ThemeProvider })),
|
1832
|
-
{
|
1833
|
-
ssr: false,
|
1834
|
-
loading: () => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { visibility: "hidden" } })
|
1835
|
-
}
|
1836
|
-
);
|
1837
|
-
var DynamicThemeProviderNoSSR = dynamic__default.default(
|
1838
|
-
() => Promise.resolve().then(() => (init_theme_provider(), theme_provider_exports)).then((mod) => ({ default: mod.ThemeProviderNoSSR })),
|
1839
|
-
{
|
1840
|
-
ssr: false,
|
1841
|
-
loading: () => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { visibility: "hidden" } })
|
1842
|
-
}
|
1843
|
-
);
|
1844
|
-
var DynamicThemeToggle = dynamic__default.default(
|
1845
|
-
() => Promise.resolve().then(() => (init_theme_toggle2(), theme_toggle_exports)).then((mod) => ({ default: mod.ThemeToggle })),
|
1846
|
-
{
|
1847
|
-
ssr: false,
|
1848
|
-
loading: () => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { visibility: "hidden" } })
|
1849
|
-
}
|
1850
|
-
);
|
1851
|
-
function SafeThemeProvider({
|
1824
|
+
function ClientThemeProvider({
|
1852
1825
|
children,
|
1853
|
-
noSSR = false,
|
1854
1826
|
...props
|
1855
1827
|
}) {
|
1856
|
-
|
1857
|
-
|
1828
|
+
const [mounted, setMounted] = React2__namespace.useState(false);
|
1829
|
+
React2__namespace.useEffect(() => {
|
1830
|
+
setMounted(true);
|
1831
|
+
}, []);
|
1832
|
+
if (!mounted) {
|
1833
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
1834
|
+
}
|
1835
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider, { ...props, children });
|
1836
|
+
}
|
1837
|
+
function ClientThemeToggle(props) {
|
1838
|
+
const [mounted, setMounted] = React2__namespace.useState(false);
|
1839
|
+
React2__namespace.useEffect(() => {
|
1840
|
+
setMounted(true);
|
1841
|
+
}, []);
|
1842
|
+
if (!mounted) {
|
1843
|
+
return null;
|
1858
1844
|
}
|
1859
|
-
|
1845
|
+
const { ThemeToggle: ThemeToggle2 } = (init_theme_toggle2(), __toCommonJS(theme_toggle_exports));
|
1846
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ThemeToggle2, { ...props });
|
1860
1847
|
}
|
1861
1848
|
|
1862
1849
|
// src/themes/index.ts
|
1863
1850
|
init_theme_utils();
|
1864
1851
|
|
1865
1852
|
exports.Button = Button;
|
1853
|
+
exports.ClientThemeProvider = ClientThemeProvider;
|
1854
|
+
exports.ClientThemeToggle = ClientThemeToggle;
|
1866
1855
|
exports.Collapsible = Collapsible;
|
1867
1856
|
exports.CollapsibleContent = CollapsibleContent2;
|
1868
1857
|
exports.CollapsibleTrigger = CollapsibleTrigger2;
|
@@ -1891,9 +1880,6 @@ exports.ContextMenuSubContent = ContextMenuSubContent;
|
|
1891
1880
|
exports.ContextMenuSubTrigger = ContextMenuSubTrigger;
|
1892
1881
|
exports.ContextMenuTrigger = ContextMenuTrigger;
|
1893
1882
|
exports.DropdownMenu = DropdownMenu;
|
1894
|
-
exports.DynamicThemeProvider = DynamicThemeProvider;
|
1895
|
-
exports.DynamicThemeProviderNoSSR = DynamicThemeProviderNoSSR;
|
1896
|
-
exports.DynamicThemeToggle = DynamicThemeToggle;
|
1897
1883
|
exports.EmailButton = EmailButton;
|
1898
1884
|
exports.EmailCaption = EmailCaption;
|
1899
1885
|
exports.EmailContainer = EmailContainer;
|
@@ -1911,7 +1897,6 @@ exports.Popover = Popover;
|
|
1911
1897
|
exports.PopoverAnchor = PopoverAnchor;
|
1912
1898
|
exports.PopoverContent = PopoverContent;
|
1913
1899
|
exports.PopoverTrigger = PopoverTrigger;
|
1914
|
-
exports.SafeThemeProvider = SafeThemeProvider;
|
1915
1900
|
exports.Sheet = Sheet;
|
1916
1901
|
exports.SheetClose = SheetClose;
|
1917
1902
|
exports.SheetContent = SheetContent;
|