@tydavidson/design-system 1.1.15 → 1.1.16
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 +65 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +65 -2
- package/dist/index.mjs.map +1 -1
- package/dist/themes/index.d.mts +6 -2
- package/dist/themes/index.d.ts +6 -2
- package/dist/themes/index.js +65 -2
- package/dist/themes/index.js.map +1 -1
- package/dist/themes/index.mjs +65 -2
- package/dist/themes/index.mjs.map +1 -1
- package/docs/troubleshooting.md +147 -99
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -118,12 +118,43 @@ function ThemeToggle({
|
|
|
118
118
|
size = "md",
|
|
119
119
|
...props
|
|
120
120
|
}) {
|
|
121
|
+
if (typeof window === "undefined") {
|
|
122
|
+
return /* @__PURE__ */ jsx(
|
|
123
|
+
"button",
|
|
124
|
+
{
|
|
125
|
+
type: "button",
|
|
126
|
+
className: cn(
|
|
127
|
+
"inline-flex items-center justify-center rounded-md border border-input bg-background",
|
|
128
|
+
size === "sm" ? "h-8 w-8" : size === "lg" ? "h-12 w-12" : "h-10 w-10",
|
|
129
|
+
className
|
|
130
|
+
),
|
|
131
|
+
"aria-label": "Toggle theme",
|
|
132
|
+
...props,
|
|
133
|
+
children: /* @__PURE__ */ jsx(IconSun, { size: size === "sm" ? 16 : size === "lg" ? 24 : 20, stroke: 1.5 })
|
|
134
|
+
}
|
|
135
|
+
);
|
|
136
|
+
}
|
|
121
137
|
const { theme, setTheme, resolvedTheme } = useTheme();
|
|
122
138
|
const [mounted, setMounted] = React2.useState(false);
|
|
123
139
|
React2.useEffect(() => {
|
|
124
140
|
setMounted(true);
|
|
125
141
|
}, []);
|
|
126
|
-
if (!mounted)
|
|
142
|
+
if (!mounted) {
|
|
143
|
+
return /* @__PURE__ */ jsx(
|
|
144
|
+
"button",
|
|
145
|
+
{
|
|
146
|
+
type: "button",
|
|
147
|
+
className: cn(
|
|
148
|
+
"inline-flex items-center justify-center rounded-md border border-input bg-background",
|
|
149
|
+
size === "sm" ? "h-8 w-8" : size === "lg" ? "h-12 w-12" : "h-10 w-10",
|
|
150
|
+
className
|
|
151
|
+
),
|
|
152
|
+
"aria-label": "Toggle theme",
|
|
153
|
+
...props,
|
|
154
|
+
children: /* @__PURE__ */ jsx(IconSun, { size: size === "sm" ? 16 : size === "lg" ? 24 : 20, stroke: 1.5 })
|
|
155
|
+
}
|
|
156
|
+
);
|
|
157
|
+
}
|
|
127
158
|
const toggleTheme = () => {
|
|
128
159
|
setTheme(resolvedTheme === "dark" ? "light" : "dark");
|
|
129
160
|
};
|
|
@@ -1895,7 +1926,39 @@ function ClientThemeToggle(props) {
|
|
|
1895
1926
|
});
|
|
1896
1927
|
}, []);
|
|
1897
1928
|
if (!mounted || !ThemeToggleComponent) {
|
|
1898
|
-
return
|
|
1929
|
+
return /* @__PURE__ */ jsx(
|
|
1930
|
+
"button",
|
|
1931
|
+
{
|
|
1932
|
+
type: "button",
|
|
1933
|
+
className: "inline-flex items-center justify-center rounded-md border border-input bg-background h-10 w-10",
|
|
1934
|
+
"aria-label": "Toggle theme",
|
|
1935
|
+
...props,
|
|
1936
|
+
children: /* @__PURE__ */ jsxs(
|
|
1937
|
+
"svg",
|
|
1938
|
+
{
|
|
1939
|
+
width: "20",
|
|
1940
|
+
height: "20",
|
|
1941
|
+
viewBox: "0 0 24 24",
|
|
1942
|
+
fill: "none",
|
|
1943
|
+
stroke: "currentColor",
|
|
1944
|
+
strokeWidth: "2",
|
|
1945
|
+
strokeLinecap: "round",
|
|
1946
|
+
strokeLinejoin: "round",
|
|
1947
|
+
children: [
|
|
1948
|
+
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "4" }),
|
|
1949
|
+
/* @__PURE__ */ jsx("path", { d: "M12 2v2" }),
|
|
1950
|
+
/* @__PURE__ */ jsx("path", { d: "M12 20v2" }),
|
|
1951
|
+
/* @__PURE__ */ jsx("path", { d: "m4.93 4.93 1.41 1.41" }),
|
|
1952
|
+
/* @__PURE__ */ jsx("path", { d: "m17.66 17.66 1.41 1.41" }),
|
|
1953
|
+
/* @__PURE__ */ jsx("path", { d: "M2 12h2" }),
|
|
1954
|
+
/* @__PURE__ */ jsx("path", { d: "M20 12h2" }),
|
|
1955
|
+
/* @__PURE__ */ jsx("path", { d: "m6.34 17.66-1.41 1.41" }),
|
|
1956
|
+
/* @__PURE__ */ jsx("path", { d: "m19.07 4.93-1.41 1.41" })
|
|
1957
|
+
]
|
|
1958
|
+
}
|
|
1959
|
+
)
|
|
1960
|
+
}
|
|
1961
|
+
);
|
|
1899
1962
|
}
|
|
1900
1963
|
return /* @__PURE__ */ jsx(ThemeToggleComponent, { ...props });
|
|
1901
1964
|
}
|