colbrush 1.21.1 → 1.23.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 (9) hide show
  1. package/README.md +37 -1
  2. package/dist/{chunk-DVFOKORW.js → chunk-CJYCYDTL.js} +30 -9
  3. package/dist/cli.cjs +1 -1
  4. package/dist/client.cjs +124 -100
  5. package/dist/client.d.cts +3 -1
  6. package/dist/client.d.ts +3 -1
  7. package/dist/client.js +90 -76
  8. package/dist/devtools.js +1 -1
  9. package/package.json +91 -90
package/dist/client.cjs CHANGED
@@ -23,6 +23,7 @@ var client_exports = {};
23
23
  __export(client_exports, {
24
24
  THEMES: () => THEMES,
25
25
  ThemeProvider: () => ThemeProvider,
26
+ ThemeScript: () => ThemeScript,
26
27
  ThemeSwitcher: () => ThemeSwitcher,
27
28
  useTheme: () => useTheme
28
29
  });
@@ -75,6 +76,7 @@ var ThemeContext = (0, import_react.createContext)({
75
76
  }
76
77
  });
77
78
  var useTheme = () => (0, import_react.useContext)(ThemeContext);
79
+ var useSafeLayoutEffect = typeof window === "undefined" ? import_react.useEffect : import_react.useLayoutEffect;
78
80
  function normalizeToKey(value) {
79
81
  if (!value) return "default";
80
82
  if (THEME_MODES.includes(value))
@@ -89,17 +91,28 @@ function normalizeToKey(value) {
89
91
  });
90
92
  return reverse[value] ?? "default";
91
93
  }
94
+ function getStorageItem(key) {
95
+ try {
96
+ return typeof window === "undefined" ? null : localStorage.getItem(key);
97
+ } catch {
98
+ return null;
99
+ }
100
+ }
101
+ function setStorageItem(key, value) {
102
+ try {
103
+ localStorage.setItem(key, value);
104
+ } catch {
105
+ }
106
+ }
92
107
  function ThemeProvider({ children }) {
93
108
  const [theme, setTheme] = (0, import_react.useState)("default");
94
109
  const [simulationFilter, setSimulationFilter] = (0, import_react.useState)("none");
95
110
  const [language, setLanguage] = (0, import_react.useState)("English");
96
- (0, import_react.useEffect)(() => {
111
+ useSafeLayoutEffect(() => {
97
112
  if (typeof window === "undefined") return;
98
- const storedTheme = normalizeToKey(
99
- localStorage.getItem(ThemeStorageKey)
100
- );
101
- const storedLang = localStorage.getItem(LanguageStorageKey) || "English";
102
- const storedFilter = localStorage.getItem(SimulationStorageKey) || "none";
113
+ const storedTheme = normalizeToKey(getStorageItem(ThemeStorageKey));
114
+ const storedLang = getStorageItem(LanguageStorageKey) || "English";
115
+ const storedFilter = getStorageItem(SimulationStorageKey) || "none";
103
116
  setSimulationFilter(storedFilter);
104
117
  setTheme(storedTheme);
105
118
  setLanguage(storedLang);
@@ -108,14 +121,14 @@ function ThemeProvider({ children }) {
108
121
  const updateTheme = (k) => {
109
122
  setTheme(k);
110
123
  if (typeof window !== "undefined") {
111
- localStorage.setItem(ThemeStorageKey, k);
124
+ setStorageItem(ThemeStorageKey, k);
112
125
  document.documentElement.setAttribute("data-theme", k);
113
126
  }
114
127
  };
115
128
  const updateLanguage = (t) => {
116
129
  setLanguage(t);
117
130
  if (typeof window !== "undefined") {
118
- localStorage.setItem(LanguageStorageKey, t);
131
+ setStorageItem(LanguageStorageKey, t);
119
132
  }
120
133
  };
121
134
  const value = (0, import_react.useMemo)(
@@ -133,12 +146,23 @@ function ThemeProvider({ children }) {
133
146
  }
134
147
  var THEMES = THEME_LABEL;
135
148
 
149
+ // src/react/ThemeScript.tsx
150
+ var import_jsx_runtime2 = require("react/jsx-runtime");
151
+ var script = `try{var t=localStorage.getItem(${JSON.stringify(
152
+ ThemeStorageKey
153
+ )});if(${JSON.stringify(
154
+ THEME_MODES
155
+ )}.indexOf(t)>-1)document.documentElement.setAttribute("data-theme",t)}catch(e){}`;
156
+ function ThemeScript() {
157
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("script", { dangerouslySetInnerHTML: { __html: script } });
158
+ }
159
+
136
160
  // src/react/ThemeSwitcher.tsx
137
161
  var import_react3 = require("react");
138
162
 
139
163
  // src/icons/Logo.tsx
140
- var import_jsx_runtime2 = require("react/jsx-runtime");
141
- var SvgLogo = (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
164
+ var import_jsx_runtime3 = require("react/jsx-runtime");
165
+ var SvgLogo = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
142
166
  "svg",
143
167
  {
144
168
  xmlns: "http://www.w3.org/2000/svg",
@@ -146,50 +170,50 @@ var SvgLogo = (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
146
170
  viewBox: "0 0 91 91",
147
171
  ...props,
148
172
  children: [
149
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { fill: "#CE78A9", d: "m0 40.298 3.56-8.254 39.49-18.612-3.075 7.768z" }),
150
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
173
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { fill: "#CE78A9", d: "m0 40.298 3.56-8.254 39.49-18.612-3.075 7.768z" }),
174
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
151
175
  "path",
152
176
  {
153
177
  fill: "#D55D00",
154
178
  d: "M6.314 55.35 1.297 43.86l33.016-16.67-3.237 7.93L9.389 46.125l5.826 13.433z"
155
179
  }
156
180
  ),
157
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
181
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
158
182
  "path",
159
183
  {
160
184
  fill: "#E59F01",
161
185
  d: "m51.144.22 8.213 3.654 18.161 39.699-7.733-3.163z"
162
186
  }
163
187
  ),
164
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
188
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
165
189
  "path",
166
190
  {
167
191
  fill: "#fff",
168
192
  d: "m36.02 6.362 11.548-4.886L63.86 34.68l-7.893-3.327L45.21 9.543l-13.498 5.672z"
169
193
  }
170
194
  ),
171
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
195
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
172
196
  "path",
173
197
  {
174
198
  fill: "#0072B1",
175
199
  d: "m38.84 90.671-8.206-3.67-18.083-39.735 7.727 3.179z"
176
200
  }
177
201
  ),
178
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
202
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
179
203
  "path",
180
204
  {
181
205
  fill: "#F0E442",
182
206
  d: "m53.975 84.56-11.557 4.864-16.227-33.236 7.886 3.343 10.715 21.832 13.51-5.647z"
183
207
  }
184
208
  ),
185
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
209
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
186
210
  "path",
187
211
  {
188
212
  fill: "#009F73",
189
213
  d: "m90.17 50.665-3.48 8.288-39.306 18.995 2.999-7.798z"
190
214
  }
191
215
  ),
192
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
216
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
193
217
  "path",
194
218
  {
195
219
  fill: "#56B4E8",
@@ -202,8 +226,8 @@ var SvgLogo = (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
202
226
  var Logo_default = SvgLogo;
203
227
 
204
228
  // src/icons/Us.tsx
205
- var import_jsx_runtime3 = require("react/jsx-runtime");
206
- var SvgUs = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
229
+ var import_jsx_runtime4 = require("react/jsx-runtime");
230
+ var SvgUs = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
207
231
  "svg",
208
232
  {
209
233
  xmlns: "http://www.w3.org/2000/svg",
@@ -211,17 +235,17 @@ var SvgUs = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
211
235
  viewBox: "0 0 28 21",
212
236
  ...props,
213
237
  children: [
214
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("g", { clipPath: "url(#a)", filter: "url(#b)", children: [
215
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { fill: "#fff", d: "M3.996 4.166h20v13.333h-20z" }),
216
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
238
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("g", { clipPath: "url(#a)", filter: "url(#b)", children: [
239
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { fill: "#fff", d: "M3.996 4.166h20v13.333h-20z" }),
240
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
217
241
  "path",
218
242
  {
219
243
  fill: "#D80027",
220
244
  d: "M3.996 4.166h20v1.025h-20zm0 2.05h20v1.026h-20zm0 2.051h20v1.026h-20zm0 2.051h20v1.025h-20zm0 2.055h20v1.025h-20zm0 2.05h20v1.026h-20zm0 2.051h20v1.025h-20z"
221
245
  }
222
246
  ),
223
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { fill: "#2E52B2", d: "M3.996 4.166h10v7.177h-10z" }),
224
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
247
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { fill: "#2E52B2", d: "M3.996 4.166h10v7.177h-10z" }),
248
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
225
249
  "path",
226
250
  {
227
251
  fill: "#fff",
@@ -229,9 +253,9 @@ var SvgUs = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
229
253
  }
230
254
  )
231
255
  ] }),
232
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("defs", { children: [
233
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("clipPath", { id: "a", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { fill: "#fff", d: "M3.996 4.166h20v13.333h-20z" }) }),
234
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
256
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("defs", { children: [
257
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("clipPath", { id: "a", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { fill: "#fff", d: "M3.996 4.166h20v13.333h-20z" }) }),
258
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
235
259
  "filter",
236
260
  {
237
261
  id: "b",
@@ -242,8 +266,8 @@ var SvgUs = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
242
266
  colorInterpolationFilters: "sRGB",
243
267
  filterUnits: "userSpaceOnUse",
244
268
  children: [
245
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("feFlood", { floodOpacity: 0, result: "BackgroundImageFix" }),
246
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
269
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feFlood", { floodOpacity: 0, result: "BackgroundImageFix" }),
270
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
247
271
  "feColorMatrix",
248
272
  {
249
273
  in: "SourceAlpha",
@@ -251,18 +275,18 @@ var SvgUs = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
251
275
  values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
252
276
  }
253
277
  ),
254
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("feOffset", {}),
255
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("feGaussianBlur", { stdDeviation: 1.743 }),
256
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("feComposite", { in2: "hardAlpha", operator: "out" }),
257
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("feColorMatrix", { values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0" }),
258
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
278
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feOffset", {}),
279
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feGaussianBlur", { stdDeviation: 1.743 }),
280
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feComposite", { in2: "hardAlpha", operator: "out" }),
281
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feColorMatrix", { values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0" }),
282
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
259
283
  "feBlend",
260
284
  {
261
285
  in2: "BackgroundImageFix",
262
286
  result: "effect1_dropShadow_306_3300"
263
287
  }
264
288
  ),
265
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
289
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
266
290
  "feBlend",
267
291
  {
268
292
  in: "SourceGraphic",
@@ -280,8 +304,8 @@ var SvgUs = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
280
304
  var Us_default = SvgUs;
281
305
 
282
306
  // src/icons/Kr.tsx
283
- var import_jsx_runtime4 = require("react/jsx-runtime");
284
- var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
307
+ var import_jsx_runtime5 = require("react/jsx-runtime");
308
+ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
285
309
  "svg",
286
310
  {
287
311
  xmlns: "http://www.w3.org/2000/svg",
@@ -289,9 +313,9 @@ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
289
313
  viewBox: "0 0 24 17",
290
314
  ...props,
291
315
  children: [
292
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("g", { clipPath: "url(#a)", filter: "url(#b)", children: [
293
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { fill: "#fff", d: "M1.906 2h20v13.333h-20z" }),
294
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
316
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("g", { clipPath: "url(#a)", filter: "url(#b)", children: [
317
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { fill: "#fff", d: "M1.906 2h20v13.333h-20z" }),
318
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
295
319
  "path",
296
320
  {
297
321
  fill: "#000",
@@ -300,7 +324,7 @@ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
300
324
  clipRule: "evenodd"
301
325
  }
302
326
  ),
303
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
327
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
304
328
  "path",
305
329
  {
306
330
  fill: "#fff",
@@ -309,21 +333,21 @@ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
309
333
  clipRule: "evenodd"
310
334
  }
311
335
  ),
312
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
336
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
313
337
  "path",
314
338
  {
315
339
  fill: "#CA163A",
316
340
  d: "M14.68 10.514a3.333 3.333 0 1 0-5.548-3.698 3.333 3.333 0 0 0 5.547 3.698"
317
341
  }
318
342
  ),
319
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
343
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
320
344
  "path",
321
345
  {
322
346
  fill: "#0E4896",
323
347
  d: "M9.132 6.816a1.667 1.667 0 0 0 2.774 1.85 1.667 1.667 0 0 1 2.773 1.848 3.334 3.334 0 0 1-5.547-3.698"
324
348
  }
325
349
  ),
326
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
350
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
327
351
  "path",
328
352
  {
329
353
  fill: "#000",
@@ -332,14 +356,14 @@ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
332
356
  clipRule: "evenodd"
333
357
  }
334
358
  ),
335
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
359
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
336
360
  "path",
337
361
  {
338
362
  fill: "#000",
339
363
  d: "m6.475 12.286.693-.462zm9.36-6.24.81-.54zm1.502-1.002.694-.462z"
340
364
  }
341
365
  ),
342
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
366
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
343
367
  "path",
344
368
  {
345
369
  fill: "#fff",
@@ -349,9 +373,9 @@ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
349
373
  }
350
374
  )
351
375
  ] }),
352
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("defs", { children: [
353
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("clipPath", { id: "a", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { fill: "#fff", d: "M1.906 2h20v13.333h-20z" }) }),
354
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
376
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("defs", { children: [
377
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("clipPath", { id: "a", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { fill: "#fff", d: "M1.906 2h20v13.333h-20z" }) }),
378
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
355
379
  "filter",
356
380
  {
357
381
  id: "b",
@@ -362,8 +386,8 @@ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
362
386
  colorInterpolationFilters: "sRGB",
363
387
  filterUnits: "userSpaceOnUse",
364
388
  children: [
365
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feFlood", { floodOpacity: 0, result: "BackgroundImageFix" }),
366
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
389
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("feFlood", { floodOpacity: 0, result: "BackgroundImageFix" }),
390
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
367
391
  "feColorMatrix",
368
392
  {
369
393
  in: "SourceAlpha",
@@ -371,18 +395,18 @@ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
371
395
  values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
372
396
  }
373
397
  ),
374
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feOffset", {}),
375
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feGaussianBlur", { stdDeviation: 0.65 }),
376
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feComposite", { in2: "hardAlpha", operator: "out" }),
377
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feColorMatrix", { values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0" }),
378
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
398
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("feOffset", {}),
399
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("feGaussianBlur", { stdDeviation: 0.65 }),
400
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("feComposite", { in2: "hardAlpha", operator: "out" }),
401
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("feColorMatrix", { values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0" }),
402
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
379
403
  "feBlend",
380
404
  {
381
405
  in2: "BackgroundImageFix",
382
406
  result: "effect1_dropShadow_306_2477"
383
407
  }
384
408
  ),
385
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
409
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
386
410
  "feBlend",
387
411
  {
388
412
  in: "SourceGraphic",
@@ -400,8 +424,8 @@ var SvgKr = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
400
424
  var Kr_default = SvgKr;
401
425
 
402
426
  // src/icons/X.tsx
403
- var import_jsx_runtime5 = require("react/jsx-runtime");
404
- var SvgX = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
427
+ var import_jsx_runtime6 = require("react/jsx-runtime");
428
+ var SvgX = (props) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
405
429
  "svg",
406
430
  {
407
431
  xmlns: "http://www.w3.org/2000/svg",
@@ -409,7 +433,7 @@ var SvgX = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
409
433
  viewBox: "0 0 30 30",
410
434
  ...props,
411
435
  children: [
412
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
436
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
413
437
  "path",
414
438
  {
415
439
  fill: "#fff",
@@ -418,7 +442,7 @@ var SvgX = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
418
442
  clipRule: "evenodd"
419
443
  }
420
444
  ),
421
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
445
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
422
446
  "path",
423
447
  {
424
448
  fill: "#fff",
@@ -433,8 +457,8 @@ var SvgX = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
433
457
  var X_default = SvgX;
434
458
 
435
459
  // src/icons/theme/Tritanopia.tsx
436
- var import_jsx_runtime6 = require("react/jsx-runtime");
437
- var SvgTritanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
460
+ var import_jsx_runtime7 = require("react/jsx-runtime");
461
+ var SvgTritanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
438
462
  "svg",
439
463
  {
440
464
  xmlns: "http://www.w3.org/2000/svg",
@@ -442,7 +466,7 @@ var SvgTritanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
442
466
  viewBox: "0 0 28 29",
443
467
  ...props,
444
468
  children: [
445
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
469
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
446
470
  "rect",
447
471
  {
448
472
  width: 26.18,
@@ -454,14 +478,14 @@ var SvgTritanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
454
478
  rx: 13.09
455
479
  }
456
480
  ),
457
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
481
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
458
482
  "path",
459
483
  {
460
484
  fill: "currentColor",
461
485
  d: "M8.64 7.152h5.21q1.508 0 2.532.513 1.026.513 1.528 1.405.513.892.513 2.02 0 1.333-.667 2.081-.666.74-1.753 1.036v.144q.717.04 1.415.492.698.45 1.148 1.282.452.819.452 1.938 0 1.158-.534 2.04-.522.882-1.64 1.395-1.118.502-2.81.502H8.641zm5.374 13.207q1.65 0 2.43-.635.79-.636.79-1.682 0-.758-.39-1.395a2.63 2.63 0 0 0-1.097-1.015q-.709-.38-1.63-.38h-3.63v5.107zm-.226-6.706q.8 0 1.456-.307.657-.319 1.036-.892.38-.585.38-1.344 0-1.024-.708-1.671-.708-.646-2.102-.646h-3.364v4.86z"
462
486
  }
463
487
  ),
464
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
488
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
465
489
  "path",
466
490
  {
467
491
  stroke: "currentColor",
@@ -475,8 +499,8 @@ var SvgTritanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
475
499
  var Tritanopia_default = SvgTritanopia;
476
500
 
477
501
  // src/icons/theme/Default.tsx
478
- var import_jsx_runtime7 = require("react/jsx-runtime");
479
- var SvgDefault = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
502
+ var import_jsx_runtime8 = require("react/jsx-runtime");
503
+ var SvgDefault = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
480
504
  "svg",
481
505
  {
482
506
  xmlns: "http://www.w3.org/2000/svg",
@@ -484,14 +508,14 @@ var SvgDefault = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
484
508
  viewBox: "0 0 31 31",
485
509
  ...props,
486
510
  children: [
487
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
511
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
488
512
  "path",
489
513
  {
490
514
  fill: "currentColor",
491
515
  d: "M30.5 15.5s-5.625-10.312-15-10.312S.5 15.5.5 15.5s5.625 10.313 15 10.313 15-10.313 15-10.313m-27.801 0q.16-.245.365-.54c.628-.9 1.554-2.098 2.746-3.29 2.417-2.417 5.716-4.607 9.69-4.607s7.273 2.19 9.69 4.607A24.6 24.6 0 0 1 28.3 15.5q-.16.245-.365.54c-.628.9-1.554 2.098-2.746 3.29-2.417 2.417-5.716 4.608-9.69 4.608s-7.273-2.19-9.69-4.608A24.6 24.6 0 0 1 2.7 15.5"
492
516
  }
493
517
  ),
494
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
518
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
495
519
  "path",
496
520
  {
497
521
  fill: "currentColor",
@@ -504,8 +528,8 @@ var SvgDefault = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
504
528
  var Default_default = SvgDefault;
505
529
 
506
530
  // src/icons/theme/Protanopia.tsx
507
- var import_jsx_runtime8 = require("react/jsx-runtime");
508
- var SvgProtanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
531
+ var import_jsx_runtime9 = require("react/jsx-runtime");
532
+ var SvgProtanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
509
533
  "svg",
510
534
  {
511
535
  xmlns: "http://www.w3.org/2000/svg",
@@ -513,7 +537,7 @@ var SvgProtanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
513
537
  viewBox: "0 0 28 29",
514
538
  ...props,
515
539
  children: [
516
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
540
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
517
541
  "rect",
518
542
  {
519
543
  width: 26.18,
@@ -525,14 +549,14 @@ var SvgProtanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
525
549
  rx: 13.09
526
550
  }
527
551
  ),
528
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
552
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
529
553
  "path",
530
554
  {
531
555
  fill: "currentColor",
532
556
  d: "M9.252 7.152h5.045q1.692 0 2.83.585 1.14.575 1.682 1.61.554 1.024.554 2.379 0 1.507-.697 2.594-.688 1.086-2.072 1.569L19.937 22h-2.153l-3.107-5.773-.36.01h-3.219V22H9.252zm4.984 7.404q1.711 0 2.502-.728.8-.729.8-2.102 0-1.395-.8-2.164t-2.523-.769h-3.117v5.763z"
533
557
  }
534
558
  ),
535
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
559
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
536
560
  "path",
537
561
  {
538
562
  stroke: "currentColor",
@@ -546,8 +570,8 @@ var SvgProtanopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
546
570
  var Protanopia_default = SvgProtanopia;
547
571
 
548
572
  // src/icons/theme/Deuteranopia.tsx
549
- var import_jsx_runtime9 = require("react/jsx-runtime");
550
- var SvgDeuteranopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
573
+ var import_jsx_runtime10 = require("react/jsx-runtime");
574
+ var SvgDeuteranopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
551
575
  "svg",
552
576
  {
553
577
  xmlns: "http://www.w3.org/2000/svg",
@@ -555,7 +579,7 @@ var SvgDeuteranopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
555
579
  viewBox: "0 0 15 15",
556
580
  ...props,
557
581
  children: [
558
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
582
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
559
583
  "rect",
560
584
  {
561
585
  width: 13.09,
@@ -567,14 +591,14 @@ var SvgDeuteranopia = (props) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
567
591
  rx: 6.545
568
592
  }
569
593
  ),
570
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
594
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
571
595
  "path",
572
596
  {
573
597
  fill: "currentColor",
574
598
  d: "M9.51 5.894q-.245-.734-.789-1.144-.538-.415-1.312-.415-.667 0-1.205.343-.534.345-.846 1.01-.308.667-.308 1.6t.313 1.6q.313.665.861 1.01.549.343 1.246.343.626 0 1.103-.261a1.87 1.87 0 0 0 .748-.754q.271-.492.282-1.138H7.665v-.81h2.84v.8q0 .907-.39 1.594-.389.687-1.081 1.061-.687.37-1.564.37-.984 0-1.738-.462-.748-.466-1.164-1.328-.41-.866-.41-2.025 0-1.153.41-2.015.416-.866 1.154-1.333.738-.465 1.687-.466.774 0 1.42.307.646.303 1.071.851.426.548.564 1.262z"
575
599
  }
576
600
  ),
577
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
601
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
578
602
  "path",
579
603
  {
580
604
  stroke: "currentColor",
@@ -639,7 +663,7 @@ var SWITCHER_MENU_POSITION = {
639
663
  };
640
664
 
641
665
  // src/react/ThemeSwitcher.tsx
642
- var import_jsx_runtime10 = require("react/jsx-runtime");
666
+ var import_jsx_runtime11 = require("react/jsx-runtime");
643
667
  var THEME_ICON = {
644
668
  default: Default_default,
645
669
  protanopia: Protanopia_default,
@@ -672,8 +696,8 @@ function ThemeSwitcher({ options, position }) {
672
696
  setIsOpen((prev) => !prev);
673
697
  };
674
698
  const toggleAriaLabel = language === "Korean" ? isOpen ? "\uD14C\uB9C8 \uC804\uD658 \uBA54\uB274 \uB2EB\uAE30" : "\uD14C\uB9C8 \uC804\uD658 \uBA54\uB274 \uC5F4\uAE30" : isOpen ? "Close theme switcher menu" : "Open theme switcher menu";
675
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ThemeSwitcherPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { ref: wrapperRef, className: "z-[10000]", children: [
676
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
699
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ThemeSwitcherPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { ref: wrapperRef, className: "z-[10000]", children: [
700
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
677
701
  "button",
678
702
  {
679
703
  type: "button",
@@ -685,28 +709,28 @@ function ThemeSwitcher({ options, position }) {
685
709
  className: `fixed w-[60px] h-[60px] p-[10px] ${isOpen ? "bg-[#252525] border-[1px] border-[#8144FF]" : "bg-[rgba(129,68,255,0.2)]"} rounded-full flex justify-center items-center shadow-[0_0_3px_0_rgba(0,0,0,0.17)]
686
710
  ${switcherClass}
687
711
  `,
688
- children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "absolute flex justify-center items-center inset-0 w-full h-full", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
712
+ children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute flex justify-center items-center inset-0 w-full h-full", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
689
713
  X_default,
690
714
  {
691
715
  "aria-hidden": "true",
692
716
  className: "self-center",
693
717
  width: 30
694
718
  }
695
- ) }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
719
+ ) }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
696
720
  "div",
697
721
  {
698
722
  className: "rounded-full bg-white/2\n backdrop-blur-[3px]\n min-w-[60px] min-h-[60px]\n [filter:drop-shadow(0_18px_calc(60px_*_0.20)_rgba(0,0,0,calc(.55_*_0.20)))]\n shadow-[inset_0.5px_0.5px_0_rgba(255,255,255,calc(.35_+_.25_*_0.70)),inset_-0.5px_-0.5px_0_rgba(255,255,255,calc(.35_+_.25_*_0.70))]\n absolute isolate overflow-hidden\n ",
699
723
  children: [
700
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "[mask:linear-gradient(-45deg),white,transparent_40%)] pointer-events-none absolute inset-0 mix-blend-screen opacity-[calc(.50_*_0.80)]" }),
701
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "pointer-events-none absolute inset-0 mix-blend-screen opacity-20" }),
702
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "absolute flex justify-center items-center inset-0 w-full h-full", children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
724
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "[mask:linear-gradient(-45deg),white,transparent_40%)] pointer-events-none absolute inset-0 mix-blend-screen opacity-[calc(.50_*_0.80)]" }),
725
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "pointer-events-none absolute inset-0 mix-blend-screen opacity-20" }),
726
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute flex justify-center items-center inset-0 w-full h-full", children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
703
727
  X_default,
704
728
  {
705
729
  "aria-hidden": "true",
706
730
  className: "self-center",
707
731
  width: 30
708
732
  }
709
- ) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
733
+ ) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
710
734
  Logo_default,
711
735
  {
712
736
  "aria-hidden": "true",
@@ -719,7 +743,7 @@ function ThemeSwitcher({ options, position }) {
719
743
  )
720
744
  }
721
745
  ),
722
- isOpen && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
746
+ isOpen && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
723
747
  "div",
724
748
  {
725
749
  role: "menu",
@@ -730,9 +754,9 @@ function ThemeSwitcher({ options, position }) {
730
754
  ${switcherMenuClass}
731
755
  `,
732
756
  children: [
733
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { children: list.map((opt) => {
757
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: list.map((opt) => {
734
758
  const Icon = THEME_ICON[opt.key];
735
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
759
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
736
760
  "button",
737
761
  {
738
762
  type: "button",
@@ -749,7 +773,7 @@ function ThemeSwitcher({ options, position }) {
749
773
  theme === opt.key ? "bg-[#884DFF] text-[#ffffff]" : ""
750
774
  ].join(" "),
751
775
  children: [
752
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
776
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
753
777
  Icon,
754
778
  {
755
779
  width: 24,
@@ -757,32 +781,32 @@ function ThemeSwitcher({ options, position }) {
757
781
  className: `inline-block ${theme === opt.key || hovered === opt.key ? "text-white" : "text-[#909090]"}`
758
782
  }
759
783
  ),
760
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "group-hover:text-[#ffffff]", children: opt.label })
784
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "group-hover:text-[#ffffff]", children: opt.label })
761
785
  ]
762
786
  },
763
787
  opt.key
764
788
  ) }, opt.key);
765
789
  }) }),
766
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "w-full border-[0.5px] border-[#B8B8B8] mt-[8px]" }),
767
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex justify-evenly items-center gap-[10px] px-[10px] mt-[15px]", children: language === "English" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
790
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "w-full border-[0.5px] border-[#B8B8B8] mt-[8px]" }),
791
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex justify-evenly items-center gap-[10px] px-[10px] mt-[15px]", children: language === "English" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
768
792
  "button",
769
793
  {
770
794
  type: "button",
771
795
  className: "hover:cursor-pointer flex text-[18px] text-[#909090] gap-[8px] items-center justify-center",
772
796
  onClick: () => updateLanguage("Korean"),
773
797
  children: [
774
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Us_default, { width: 24 }),
798
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Us_default, { width: 24 }),
775
799
  "English"
776
800
  ]
777
801
  }
778
- ) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
802
+ ) : /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
779
803
  "button",
780
804
  {
781
805
  type: "button",
782
806
  className: "hover:cursor-pointer flex text-[18px] text-[#909090] gap-[8px] items-center justify-center ",
783
807
  onClick: () => updateLanguage("English"),
784
808
  children: [
785
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Kr_default, { width: 24 }),
809
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Kr_default, { width: 24 }),
786
810
  "\uD55C\uAD6D\uC5B4"
787
811
  ]
788
812
  }
package/dist/client.d.cts CHANGED
@@ -21,6 +21,8 @@ declare function ThemeProvider({ children }: ThemeProviderProps): react_jsx_runt
21
21
  type ThemeType = ThemeKey;
22
22
  declare const THEMES: Record<TLanguage, Record<TThemeKey, string>>;
23
23
 
24
+ declare function ThemeScript(): react_jsx_runtime.JSX.Element;
25
+
24
26
  type TThemeSwitcherProps = {
25
27
  options?: {
26
28
  key: ThemeKey;
@@ -30,4 +32,4 @@ type TThemeSwitcherProps = {
30
32
  };
31
33
  declare function ThemeSwitcher({ options, position }: TThemeSwitcherProps): react_jsx_runtime.JSX.Element;
32
34
 
33
- export { THEMES, type TLanguage, ThemeProvider, ThemeSwitcher, type ThemeType, useTheme };
35
+ export { THEMES, type TLanguage, ThemeProvider, ThemeScript, ThemeSwitcher, type ThemeType, useTheme };