@once-ui-system/core 1.0.8 → 1.0.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/README.md +103 -31
- package/dist/README.md +103 -31
- package/dist/contexts/ThemeProvider.d.ts.map +1 -1
- package/dist/contexts/ThemeProvider.js +6 -5
- package/dist/contexts/ThemeProvider.js.map +1 -1
- package/dist/package.json +1 -1
- package/dist/tsconfig.build.tsbuildinfo +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
A design system for indie builders who move fast and break limits without neglecting quality. Once UI combines the simplicity of low-code with the power of code: write 70% less compared to shadcn + tailwind.
|
|
4
4
|
|
|
5
|
+
* **Customization**: Manage design config with the ThemeProvider context.
|
|
6
|
+
* **Components**: Access advanced components with simple APIs.
|
|
7
|
+
* **Data-viz**: Add responsive charts with a few lines of code.
|
|
8
|
+
* **SEO**: Use SEO components to simplify meta and schema setup.
|
|
9
|
+
|
|
5
10
|
## Installation
|
|
6
11
|
|
|
7
12
|
```bash
|
|
@@ -12,49 +17,118 @@ yarn add @once-ui-system/core
|
|
|
12
17
|
pnpm add @once-ui-system/core
|
|
13
18
|
```
|
|
14
19
|
|
|
15
|
-
## Features
|
|
16
|
-
|
|
17
|
-
Start building your Next.js app in minutes.
|
|
18
|
-
|
|
19
|
-
* **Customization**: Manage design config in a single file.
|
|
20
|
-
* **Components**: Access advanced components with simple APIs.
|
|
21
|
-
* **Data-viz**: Add responsive charts with a few lines of code.
|
|
22
|
-
* **SEO**: Use our SEO components to simplify meta and schema setup.
|
|
23
|
-
|
|
24
20
|
## Documentation
|
|
25
21
|
|
|
26
22
|
Learn how to build with Once UI at [docs.once-ui.com](https://docs.once-ui.com/once-ui/quick-start).
|
|
27
23
|
|
|
28
|
-
##
|
|
29
|
-
|
|
30
|
-
[Magic Portfolio](https://once-ui.com/products/magic-portfolio): Our free portfolio starter used and loved by thousands of creatives. Simple, customizable, responsive.
|
|
31
|
-
|
|
32
|
-
## Styling
|
|
33
|
-
|
|
34
|
-
Once UI provides two options for styling your components:
|
|
24
|
+
## Setup
|
|
35
25
|
|
|
36
|
-
|
|
26
|
+
Import styles and tokens in your root layout file:
|
|
37
27
|
|
|
38
|
-
```
|
|
28
|
+
```js
|
|
39
29
|
// Import the pre-compiled CSS files
|
|
40
30
|
import '@once-ui-system/core/css/styles.css';
|
|
41
31
|
import '@once-ui-system/core/css/tokens.css';
|
|
42
32
|
```
|
|
43
33
|
|
|
44
|
-
|
|
34
|
+
Create a `Providers.tsx` component:
|
|
35
|
+
|
|
36
|
+
```js
|
|
37
|
+
"use client";
|
|
38
|
+
|
|
39
|
+
import { DataThemeProvider, IconProvider, ThemeProvider, ToastProvider } from "@once-ui-system/core";
|
|
40
|
+
|
|
41
|
+
export function Providers({ children }: { children: React.ReactNode }) {
|
|
42
|
+
return (
|
|
43
|
+
<ThemeProvider>
|
|
44
|
+
<DataThemeProvider>
|
|
45
|
+
<ToastProvider>
|
|
46
|
+
<IconProvider>
|
|
47
|
+
{children}
|
|
48
|
+
</IconProvider>
|
|
49
|
+
</ToastProvider>
|
|
50
|
+
</DataThemeProvider>
|
|
51
|
+
</ThemeProvider>
|
|
52
|
+
);
|
|
53
|
+
}
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
Wrap your app with the `Providers` component in your root layout:
|
|
45
57
|
|
|
46
|
-
|
|
58
|
+
```js
|
|
59
|
+
import { Providers } from "./providers";
|
|
47
60
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
61
|
+
export default function RootLayout({ children }: {
|
|
62
|
+
children: React.ReactNode
|
|
63
|
+
}) {
|
|
64
|
+
return (
|
|
65
|
+
<Providers>
|
|
66
|
+
{children}
|
|
67
|
+
</Providers>
|
|
68
|
+
);
|
|
69
|
+
}
|
|
70
|
+
```
|
|
52
71
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
72
|
+
Prevent flash of unstyled content (FOUC) by adding the following script to the `<head>` of your root layout:
|
|
73
|
+
|
|
74
|
+
```js
|
|
75
|
+
<head>
|
|
76
|
+
<script
|
|
77
|
+
dangerouslySetInnerHTML={{
|
|
78
|
+
__html: `
|
|
79
|
+
(function() {
|
|
80
|
+
try {
|
|
81
|
+
const root = document.documentElement;
|
|
82
|
+
|
|
83
|
+
root.setAttribute('data-theme', 'dark');
|
|
84
|
+
|
|
85
|
+
root.setAttribute('data-neutral', 'gray');
|
|
86
|
+
root.setAttribute('data-brand', 'blue');
|
|
87
|
+
root.setAttribute('data-accent', 'indigo');
|
|
88
|
+
root.setAttribute('data-solid', 'contrast');
|
|
89
|
+
root.setAttribute('data-solid-style', 'flat');
|
|
90
|
+
root.setAttribute('data-border', 'playful');
|
|
91
|
+
root.setAttribute('data-surface', 'filled');
|
|
92
|
+
root.setAttribute('data-transition', 'all');
|
|
93
|
+
root.setAttribute('data-scaling', '100');
|
|
94
|
+
root.setAttribute('data-viz-style', 'categorical');
|
|
95
|
+
|
|
96
|
+
const theme = localStorage.getItem('theme');
|
|
97
|
+
if (theme) {
|
|
98
|
+
if (theme === 'system') {
|
|
99
|
+
const isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
100
|
+
root.setAttribute('data-theme', isDark ? 'dark' : 'light');
|
|
101
|
+
} else {
|
|
102
|
+
root.setAttribute('data-theme', theme);
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
const styleKeys = ['neutral', 'brand', 'accent', 'solid', 'solid-style', 'border', 'surface', 'transition', 'scaling'];
|
|
107
|
+
styleKeys.forEach(key => {
|
|
108
|
+
const value = localStorage.getItem('data-' + key);
|
|
109
|
+
if (value) {
|
|
110
|
+
root.setAttribute('data-' + key, value);
|
|
111
|
+
}
|
|
112
|
+
});
|
|
113
|
+
|
|
114
|
+
const dataViz = localStorage.getItem('data-viz-style');
|
|
115
|
+
if (dataViz) {
|
|
116
|
+
root.setAttribute('data-viz-style', dataViz);
|
|
117
|
+
}
|
|
118
|
+
} catch (e) {
|
|
119
|
+
document.documentElement.setAttribute('data-theme', 'dark');
|
|
120
|
+
}
|
|
121
|
+
})();
|
|
122
|
+
`,
|
|
123
|
+
}}
|
|
124
|
+
/>
|
|
125
|
+
</head>
|
|
56
126
|
```
|
|
57
127
|
|
|
128
|
+
## Quick start
|
|
129
|
+
|
|
130
|
+
[Magic Portfolio](https://once-ui.com/products/magic-portfolio): Our free portfolio starter used and loved by thousands of creatives. Simple, customizable, responsive.
|
|
131
|
+
|
|
58
132
|
[Magic Store](https://once-ui.com/products/magic-store) (PRO): Our premium ecommerce storefront that lets you launch your merch store in minutes. Payment, production and shipping managed by Fourthwall.
|
|
59
133
|
|
|
60
134
|
[Magic Docs](https://once-ui.com/products/magic-docs) (PRO): Our premium documentation generator. Just add your MDX files and let Magic Docs handle the rest.
|
|
@@ -65,15 +139,13 @@ import '@once-ui-system/core/tokens/index.scss';
|
|
|
65
139
|
|
|
66
140
|
[Once UI for Figma](https://once-ui.com/figma) (PRO): Design and prototype entire products from scratch in hours.
|
|
67
141
|
|
|
68
|
-
|
|
69
|
-
|
|
70
142
|
## Creators
|
|
71
143
|
|
|
72
144
|
Connect with us!
|
|
73
145
|
|
|
74
|
-
**Lorant One**: [
|
|
146
|
+
**Lorant One**: [Portfolio](https://lorant.one) / [Threads](https://www.threads.net/@lorant.one) / [LinkedIn](https://www.linkedin.com/in/lorant-one/)
|
|
75
147
|
|
|
76
|
-
**Zsofia Komaromi**: [
|
|
148
|
+
**Zsofia Komaromi**: [Portfolio](https://zsofia.pro) / [Threads](https://www.threads.net/@zsofia_kom) / [LinkedIn](https://www.linkedin.com/in/zsofiakomaromi/)
|
|
77
149
|
|
|
78
150
|
## Become a Oncer
|
|
79
151
|
|
package/dist/README.md
CHANGED
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
A design system for indie builders who move fast and break limits without neglecting quality. Once UI combines the simplicity of low-code with the power of code: write 70% less compared to shadcn + tailwind.
|
|
4
4
|
|
|
5
|
+
* **Customization**: Manage design config with the ThemeProvider context.
|
|
6
|
+
* **Components**: Access advanced components with simple APIs.
|
|
7
|
+
* **Data-viz**: Add responsive charts with a few lines of code.
|
|
8
|
+
* **SEO**: Use SEO components to simplify meta and schema setup.
|
|
9
|
+
|
|
5
10
|
## Installation
|
|
6
11
|
|
|
7
12
|
```bash
|
|
@@ -12,49 +17,118 @@ yarn add @once-ui-system/core
|
|
|
12
17
|
pnpm add @once-ui-system/core
|
|
13
18
|
```
|
|
14
19
|
|
|
15
|
-
## Features
|
|
16
|
-
|
|
17
|
-
Start building your Next.js app in minutes.
|
|
18
|
-
|
|
19
|
-
* **Customization**: Manage design config in a single file.
|
|
20
|
-
* **Components**: Access advanced components with simple APIs.
|
|
21
|
-
* **Data-viz**: Add responsive charts with a few lines of code.
|
|
22
|
-
* **SEO**: Use our SEO components to simplify meta and schema setup.
|
|
23
|
-
|
|
24
20
|
## Documentation
|
|
25
21
|
|
|
26
22
|
Learn how to build with Once UI at [docs.once-ui.com](https://docs.once-ui.com/once-ui/quick-start).
|
|
27
23
|
|
|
28
|
-
##
|
|
29
|
-
|
|
30
|
-
[Magic Portfolio](https://once-ui.com/products/magic-portfolio): Our free portfolio starter used and loved by thousands of creatives. Simple, customizable, responsive.
|
|
31
|
-
|
|
32
|
-
## Styling
|
|
33
|
-
|
|
34
|
-
Once UI provides two options for styling your components:
|
|
24
|
+
## Setup
|
|
35
25
|
|
|
36
|
-
|
|
26
|
+
Import styles and tokens in your root layout file:
|
|
37
27
|
|
|
38
|
-
```
|
|
28
|
+
```js
|
|
39
29
|
// Import the pre-compiled CSS files
|
|
40
30
|
import '@once-ui-system/core/css/styles.css';
|
|
41
31
|
import '@once-ui-system/core/css/tokens.css';
|
|
42
32
|
```
|
|
43
33
|
|
|
44
|
-
|
|
34
|
+
Create a `Providers.tsx` component:
|
|
35
|
+
|
|
36
|
+
```js
|
|
37
|
+
"use client";
|
|
38
|
+
|
|
39
|
+
import { DataThemeProvider, IconProvider, ThemeProvider, ToastProvider } from "@once-ui-system/core";
|
|
40
|
+
|
|
41
|
+
export function Providers({ children }: { children: React.ReactNode }) {
|
|
42
|
+
return (
|
|
43
|
+
<ThemeProvider>
|
|
44
|
+
<DataThemeProvider>
|
|
45
|
+
<ToastProvider>
|
|
46
|
+
<IconProvider>
|
|
47
|
+
{children}
|
|
48
|
+
</IconProvider>
|
|
49
|
+
</ToastProvider>
|
|
50
|
+
</DataThemeProvider>
|
|
51
|
+
</ThemeProvider>
|
|
52
|
+
);
|
|
53
|
+
}
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
Wrap your app with the `Providers` component in your root layout:
|
|
45
57
|
|
|
46
|
-
|
|
58
|
+
```js
|
|
59
|
+
import { Providers } from "./providers";
|
|
47
60
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
61
|
+
export default function RootLayout({ children }: {
|
|
62
|
+
children: React.ReactNode
|
|
63
|
+
}) {
|
|
64
|
+
return (
|
|
65
|
+
<Providers>
|
|
66
|
+
{children}
|
|
67
|
+
</Providers>
|
|
68
|
+
);
|
|
69
|
+
}
|
|
70
|
+
```
|
|
52
71
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
72
|
+
Prevent flash of unstyled content (FOUC) by adding the following script to the `<head>` of your root layout:
|
|
73
|
+
|
|
74
|
+
```js
|
|
75
|
+
<head>
|
|
76
|
+
<script
|
|
77
|
+
dangerouslySetInnerHTML={{
|
|
78
|
+
__html: `
|
|
79
|
+
(function() {
|
|
80
|
+
try {
|
|
81
|
+
const root = document.documentElement;
|
|
82
|
+
|
|
83
|
+
root.setAttribute('data-theme', 'dark');
|
|
84
|
+
|
|
85
|
+
root.setAttribute('data-neutral', 'gray');
|
|
86
|
+
root.setAttribute('data-brand', 'blue');
|
|
87
|
+
root.setAttribute('data-accent', 'indigo');
|
|
88
|
+
root.setAttribute('data-solid', 'contrast');
|
|
89
|
+
root.setAttribute('data-solid-style', 'flat');
|
|
90
|
+
root.setAttribute('data-border', 'playful');
|
|
91
|
+
root.setAttribute('data-surface', 'filled');
|
|
92
|
+
root.setAttribute('data-transition', 'all');
|
|
93
|
+
root.setAttribute('data-scaling', '100');
|
|
94
|
+
root.setAttribute('data-viz-style', 'categorical');
|
|
95
|
+
|
|
96
|
+
const theme = localStorage.getItem('theme');
|
|
97
|
+
if (theme) {
|
|
98
|
+
if (theme === 'system') {
|
|
99
|
+
const isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
100
|
+
root.setAttribute('data-theme', isDark ? 'dark' : 'light');
|
|
101
|
+
} else {
|
|
102
|
+
root.setAttribute('data-theme', theme);
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
const styleKeys = ['neutral', 'brand', 'accent', 'solid', 'solid-style', 'border', 'surface', 'transition', 'scaling'];
|
|
107
|
+
styleKeys.forEach(key => {
|
|
108
|
+
const value = localStorage.getItem('data-' + key);
|
|
109
|
+
if (value) {
|
|
110
|
+
root.setAttribute('data-' + key, value);
|
|
111
|
+
}
|
|
112
|
+
});
|
|
113
|
+
|
|
114
|
+
const dataViz = localStorage.getItem('data-viz-style');
|
|
115
|
+
if (dataViz) {
|
|
116
|
+
root.setAttribute('data-viz-style', dataViz);
|
|
117
|
+
}
|
|
118
|
+
} catch (e) {
|
|
119
|
+
document.documentElement.setAttribute('data-theme', 'dark');
|
|
120
|
+
}
|
|
121
|
+
})();
|
|
122
|
+
`,
|
|
123
|
+
}}
|
|
124
|
+
/>
|
|
125
|
+
</head>
|
|
56
126
|
```
|
|
57
127
|
|
|
128
|
+
## Quick start
|
|
129
|
+
|
|
130
|
+
[Magic Portfolio](https://once-ui.com/products/magic-portfolio): Our free portfolio starter used and loved by thousands of creatives. Simple, customizable, responsive.
|
|
131
|
+
|
|
58
132
|
[Magic Store](https://once-ui.com/products/magic-store) (PRO): Our premium ecommerce storefront that lets you launch your merch store in minutes. Payment, production and shipping managed by Fourthwall.
|
|
59
133
|
|
|
60
134
|
[Magic Docs](https://once-ui.com/products/magic-docs) (PRO): Our premium documentation generator. Just add your MDX files and let Magic Docs handle the rest.
|
|
@@ -65,15 +139,13 @@ import '@once-ui-system/core/tokens/index.scss';
|
|
|
65
139
|
|
|
66
140
|
[Once UI for Figma](https://once-ui.com/figma) (PRO): Design and prototype entire products from scratch in hours.
|
|
67
141
|
|
|
68
|
-
|
|
69
|
-
|
|
70
142
|
## Creators
|
|
71
143
|
|
|
72
144
|
Connect with us!
|
|
73
145
|
|
|
74
|
-
**Lorant One**: [
|
|
146
|
+
**Lorant One**: [Portfolio](https://lorant.one) / [Threads](https://www.threads.net/@lorant.one) / [LinkedIn](https://www.linkedin.com/in/lorant-one/)
|
|
75
147
|
|
|
76
|
-
**Zsofia Komaromi**: [
|
|
148
|
+
**Zsofia Komaromi**: [Portfolio](https://zsofia.pro) / [Threads](https://www.threads.net/@zsofia_kom) / [LinkedIn](https://www.linkedin.com/in/zsofiakomaromi/)
|
|
77
149
|
|
|
78
150
|
## Become a Oncer
|
|
79
151
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/once-ui/contexts/ThemeProvider.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAChD,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AACrD,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAC1J,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC;AACzD,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,SAAS,CAAC;AAC5C,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,CAAC;AACjE,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,aAAa,CAAC;AACpD,MAAM,MAAM,eAAe,GAAG,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AACjE,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAC9D,MAAM,MAAM,SAAS,GAAG,aAAa,GAAG,WAAW,GAAG,YAAY,CAAC;AAEnE,UAAU,YAAY;IACpB,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,EAAE,YAAY,CAAC;IACtB,KAAK,EAAE,UAAU,CAAC;IAClB,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,EAAE,YAAY,CAAC;IACtB,UAAU,EAAE,eAAe,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,KAAK,kBAAkB,GAAG;IACxB,KAAK,EAAE,KAAK,CAAC;IACb,aAAa,EAAE,OAAO,GAAG,MAAM,CAAC;IAChC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAClC,CAAC;AAEF,KAAK,kBAAkB,GAAG,YAAY,GAAG;IACvC,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB,CAAC;AAQF,QAAA,MAAM,mBAAmB,EAAE,YAW1B,CAAC;AAkDF,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,YAAuB,EACvB,OAAO,EACP,KAAK,EACL,MAAM,EACN,KAAK,EACL,UAAU,EACV,MAAM,EACN,OAAO,EACP,UAAU,EACV,OAAO,EACR,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/once-ui/contexts/ThemeProvider.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAChD,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AACrD,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAC1J,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC;AACzD,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,SAAS,CAAC;AAC5C,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,CAAC;AACjE,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,aAAa,CAAC;AACpD,MAAM,MAAM,eAAe,GAAG,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AACjE,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAC9D,MAAM,MAAM,SAAS,GAAG,aAAa,GAAG,WAAW,GAAG,YAAY,CAAC;AAEnE,UAAU,YAAY;IACpB,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,EAAE,YAAY,CAAC;IACtB,KAAK,EAAE,UAAU,CAAC;IAClB,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,EAAE,YAAY,CAAC;IACtB,UAAU,EAAE,eAAe,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,KAAK,kBAAkB,GAAG;IACxB,KAAK,EAAE,KAAK,CAAC;IACb,aAAa,EAAE,OAAO,GAAG,MAAM,CAAC;IAChC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAClC,CAAC;AAEF,KAAK,kBAAkB,GAAG,YAAY,GAAG;IACvC,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB,CAAC;AAQF,QAAA,MAAM,mBAAmB,EAAE,YAW1B,CAAC;AAkDF,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,YAAuB,EACvB,OAAO,EACP,KAAK,EACL,MAAM,EACN,KAAK,EACL,UAAU,EACV,MAAM,EACN,OAAO,EACP,UAAU,EACV,OAAO,EACR,EAAE,kBAAkB,2CA0HpB;AAED,eAAO,MAAM,QAAQ,0BAMpB,CAAC;AAEF,eAAO,MAAM,QAAQ,0BAMpB,CAAC;AAEF,OAAO,EAAE,mBAAmB,EAAE,CAAC"}
|
|
@@ -88,17 +88,18 @@ function ThemeProvider({ children, initialTheme = "system", neutral, brand, acce
|
|
|
88
88
|
if (!mounted)
|
|
89
89
|
return;
|
|
90
90
|
const updateResolvedTheme = () => {
|
|
91
|
+
let resolvedValue;
|
|
91
92
|
if (theme === "system") {
|
|
92
|
-
|
|
93
|
+
resolvedValue = window.matchMedia("(prefers-color-scheme: dark)").matches
|
|
93
94
|
? "dark"
|
|
94
95
|
: "light";
|
|
95
|
-
setResolvedTheme(
|
|
96
|
-
document.documentElement.setAttribute("data-theme", systemTheme);
|
|
96
|
+
setResolvedTheme(resolvedValue);
|
|
97
97
|
}
|
|
98
98
|
else {
|
|
99
|
-
|
|
100
|
-
|
|
99
|
+
resolvedValue = theme;
|
|
100
|
+
setResolvedTheme(resolvedValue);
|
|
101
101
|
}
|
|
102
|
+
document.documentElement.setAttribute("data-theme", resolvedValue);
|
|
102
103
|
};
|
|
103
104
|
updateResolvedTheme();
|
|
104
105
|
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeProvider.js","sourceRoot":"","sources":["../../src/once-ui/contexts/ThemeProvider.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;AAuHb,
|
|
1
|
+
{"version":3,"file":"ThemeProvider.js","sourceRoot":"","sources":["../../src/once-ui/contexts/ThemeProvider.tsx"],"names":[],"mappings":"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"}
|