@tydavidson/design-system 1.1.13 → 1.1.15
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 +105 -94
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +101 -94
- package/dist/index.mjs.map +1 -1
- package/dist/themes/index.d.mts +10 -15
- package/dist/themes/index.d.ts +10 -15
- package/dist/themes/index.js +105 -94
- package/dist/themes/index.js.map +1 -1
- package/dist/themes/index.mjs +101 -94
- package/dist/themes/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
@@ -75,68 +75,20 @@ var init_utils = __esm({
|
|
75
75
|
"src/lib/utils.ts"() {
|
76
76
|
}
|
77
77
|
});
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
// Will need additional classes
|
93
|
-
default:
|
94
|
-
return "default";
|
95
|
-
}
|
96
|
-
};
|
97
|
-
exports.mapVariantToShadcnVariant = (variant) => {
|
98
|
-
switch (variant) {
|
99
|
-
case "primary":
|
100
|
-
return "default";
|
101
|
-
case "secondary":
|
102
|
-
return "outline";
|
103
|
-
case "tertiary":
|
104
|
-
return "ghost";
|
105
|
-
default:
|
106
|
-
return "default";
|
107
|
-
}
|
108
|
-
};
|
109
|
-
exports.getColorVariantClasses = (color, variant) => {
|
110
|
-
const colorVariantMap = {
|
111
|
-
primary: {
|
112
|
-
brand: "bg-brand-600 hover:bg-brand-700 text-white focus-visible:ring-brand-500",
|
113
|
-
error: "bg-error-600 hover:bg-error-700 text-white focus-visible:ring-error-500",
|
114
|
-
warning: "bg-warning-600 hover:bg-warning-700 text-white focus-visible:ring-warning-500",
|
115
|
-
success: "bg-success-600 hover:bg-success-700 text-white focus-visible:ring-success-500"
|
116
|
-
},
|
117
|
-
secondary: {
|
118
|
-
brand: "border-brand-300 text-brand-700 hover:bg-brand-50 focus-visible:ring-brand-500",
|
119
|
-
error: "border-error-300 text-error-700 hover:bg-error-50 focus-visible:ring-error-500",
|
120
|
-
warning: "border-warning-300 text-warning-700 hover:bg-warning-50 focus-visible:ring-warning-500",
|
121
|
-
success: "border-success-300 text-success-700 hover:bg-success-50 focus-visible:ring-success-500"
|
122
|
-
},
|
123
|
-
tertiary: {
|
124
|
-
brand: "text-brand-700 hover:bg-brand-50 focus-visible:ring-brand-500",
|
125
|
-
error: "text-error-700 hover:bg-error-50 focus-visible:ring-error-500",
|
126
|
-
warning: "text-warning-700 hover:bg-warning-50 focus-visible:ring-warning-500",
|
127
|
-
success: "text-success-700 hover:bg-success-50 focus-visible:ring-success-500"
|
128
|
-
}
|
129
|
-
};
|
130
|
-
return colorVariantMap[variant]?.[color] || "";
|
131
|
-
};
|
132
|
-
exports.isDarkTheme = (theme, systemTheme) => {
|
133
|
-
if (theme === "system") {
|
134
|
-
return systemTheme === "dark";
|
135
|
-
}
|
136
|
-
return theme === "dark";
|
137
|
-
};
|
138
|
-
}
|
139
|
-
});
|
78
|
+
function useThemeServer() {
|
79
|
+
return {
|
80
|
+
theme: "system",
|
81
|
+
setTheme: (theme) => {
|
82
|
+
},
|
83
|
+
resolvedTheme: "light",
|
84
|
+
isDark: false
|
85
|
+
};
|
86
|
+
}
|
87
|
+
function ThemeContextProvider({
|
88
|
+
children
|
89
|
+
}) {
|
90
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
91
|
+
}
|
140
92
|
function useTheme() {
|
141
93
|
const [themeData, setThemeData] = React2__namespace.useState({
|
142
94
|
theme: "system",
|
@@ -147,47 +99,48 @@ function useTheme() {
|
|
147
99
|
});
|
148
100
|
const [mounted, setMounted] = React2__namespace.useState(false);
|
149
101
|
React2__namespace.useEffect(() => {
|
150
|
-
|
151
|
-
|
152
|
-
const
|
102
|
+
if (typeof window === "undefined") return;
|
103
|
+
import('next-themes').then((nextThemes) => {
|
104
|
+
const themeManager = {
|
105
|
+
getTheme: () => {
|
106
|
+
if (typeof window !== "undefined") {
|
107
|
+
const savedTheme = localStorage.getItem("theme");
|
108
|
+
if (savedTheme) return savedTheme;
|
109
|
+
if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
|
110
|
+
return "dark";
|
111
|
+
}
|
112
|
+
}
|
113
|
+
return "light";
|
114
|
+
},
|
115
|
+
setTheme: (theme) => {
|
116
|
+
if (typeof window !== "undefined") {
|
117
|
+
localStorage.setItem("theme", theme);
|
118
|
+
document.documentElement.classList.toggle("dark", theme === "dark");
|
119
|
+
setThemeData((prev) => ({
|
120
|
+
...prev,
|
121
|
+
theme,
|
122
|
+
resolvedTheme: theme,
|
123
|
+
isDark: theme === "dark"
|
124
|
+
}));
|
125
|
+
}
|
126
|
+
}
|
127
|
+
};
|
128
|
+
const currentTheme = themeManager.getTheme();
|
129
|
+
const isDark = currentTheme === "dark";
|
153
130
|
setThemeData({
|
154
|
-
theme:
|
155
|
-
setTheme,
|
156
|
-
resolvedTheme:
|
131
|
+
theme: currentTheme,
|
132
|
+
setTheme: themeManager.setTheme,
|
133
|
+
resolvedTheme: currentTheme,
|
157
134
|
isDark
|
158
135
|
});
|
159
136
|
setMounted(true);
|
160
137
|
});
|
161
138
|
}, []);
|
162
|
-
if (!mounted) {
|
163
|
-
return {
|
164
|
-
theme: "system",
|
165
|
-
setTheme: (theme) => {
|
166
|
-
},
|
167
|
-
resolvedTheme: "light",
|
168
|
-
isDark: false
|
169
|
-
};
|
170
|
-
}
|
171
139
|
return themeData;
|
172
140
|
}
|
173
|
-
function useThemeServer() {
|
174
|
-
return {
|
175
|
-
theme: "system",
|
176
|
-
setTheme: (theme) => {
|
177
|
-
},
|
178
|
-
resolvedTheme: "light",
|
179
|
-
isDark: false
|
180
|
-
};
|
181
|
-
}
|
182
|
-
function ThemeContextProvider({
|
183
|
-
children
|
184
|
-
}) {
|
185
|
-
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
186
|
-
}
|
187
141
|
var init_theme_context = __esm({
|
188
142
|
"src/themes/theme-context.tsx"() {
|
189
143
|
"use client";
|
190
|
-
init_theme_utils();
|
191
144
|
}
|
192
145
|
});
|
193
146
|
function ThemeToggle({
|
@@ -1978,8 +1931,62 @@ function ClientThemeToggle(props) {
|
|
1978
1931
|
return /* @__PURE__ */ jsxRuntime.jsx(ThemeToggleComponent, { ...props });
|
1979
1932
|
}
|
1980
1933
|
|
1981
|
-
// src/
|
1982
|
-
|
1934
|
+
// src/lib/theme-utils.ts
|
1935
|
+
var mapColorToShadcnVariant = (color) => {
|
1936
|
+
switch (color) {
|
1937
|
+
case "brand":
|
1938
|
+
return "default";
|
1939
|
+
case "error":
|
1940
|
+
return "destructive";
|
1941
|
+
case "warning":
|
1942
|
+
case "success":
|
1943
|
+
return "secondary";
|
1944
|
+
// Will need additional classes
|
1945
|
+
default:
|
1946
|
+
return "default";
|
1947
|
+
}
|
1948
|
+
};
|
1949
|
+
var mapVariantToShadcnVariant = (variant) => {
|
1950
|
+
switch (variant) {
|
1951
|
+
case "primary":
|
1952
|
+
return "default";
|
1953
|
+
case "secondary":
|
1954
|
+
return "outline";
|
1955
|
+
case "tertiary":
|
1956
|
+
return "ghost";
|
1957
|
+
default:
|
1958
|
+
return "default";
|
1959
|
+
}
|
1960
|
+
};
|
1961
|
+
var getColorVariantClasses = (color, variant) => {
|
1962
|
+
const colorVariantMap = {
|
1963
|
+
primary: {
|
1964
|
+
brand: "bg-brand-600 hover:bg-brand-700 text-white focus-visible:ring-brand-500",
|
1965
|
+
error: "bg-error-600 hover:bg-error-700 text-white focus-visible:ring-error-500",
|
1966
|
+
warning: "bg-warning-600 hover:bg-warning-700 text-white focus-visible:ring-warning-500",
|
1967
|
+
success: "bg-success-600 hover:bg-success-700 text-white focus-visible:ring-success-500"
|
1968
|
+
},
|
1969
|
+
secondary: {
|
1970
|
+
brand: "border-brand-300 text-brand-700 hover:bg-brand-50 focus-visible:ring-brand-500",
|
1971
|
+
error: "border-error-300 text-error-700 hover:bg-error-50 focus-visible:ring-error-500",
|
1972
|
+
warning: "border-warning-300 text-warning-700 hover:bg-warning-50 focus-visible:ring-warning-500",
|
1973
|
+
success: "border-success-300 text-success-700 hover:bg-success-50 focus-visible:ring-success-500"
|
1974
|
+
},
|
1975
|
+
tertiary: {
|
1976
|
+
brand: "text-brand-700 hover:bg-brand-50 focus-visible:ring-brand-500",
|
1977
|
+
error: "text-error-700 hover:bg-error-50 focus-visible:ring-error-500",
|
1978
|
+
warning: "text-warning-700 hover:bg-warning-50 focus-visible:ring-warning-500",
|
1979
|
+
success: "text-success-700 hover:bg-success-50 focus-visible:ring-success-500"
|
1980
|
+
}
|
1981
|
+
};
|
1982
|
+
return colorVariantMap[variant]?.[color] || "";
|
1983
|
+
};
|
1984
|
+
var isDarkTheme = (theme, systemTheme) => {
|
1985
|
+
if (theme === "system") {
|
1986
|
+
return systemTheme === "dark";
|
1987
|
+
}
|
1988
|
+
return theme === "dark";
|
1989
|
+
};
|
1983
1990
|
|
1984
1991
|
exports.Button = Button;
|
1985
1992
|
exports.Card = Card;
|
@@ -2070,7 +2077,11 @@ exports.cn = cn;
|
|
2070
2077
|
exports.colors = colors;
|
2071
2078
|
exports.filterDOMProps = filterDOMProps;
|
2072
2079
|
exports.generateId = generateId;
|
2080
|
+
exports.getColorVariantClasses = getColorVariantClasses;
|
2081
|
+
exports.isDarkTheme = isDarkTheme;
|
2073
2082
|
exports.isNotNullOrUndefined = isNotNullOrUndefined;
|
2083
|
+
exports.mapColorToShadcnVariant = mapColorToShadcnVariant;
|
2084
|
+
exports.mapVariantToShadcnVariant = mapVariantToShadcnVariant;
|
2074
2085
|
exports.radius = radius;
|
2075
2086
|
exports.shadows = shadows;
|
2076
2087
|
exports.spacing = spacing;
|