@supersoniks/concorde 5.0.5 → 5.1.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.
- package/.github/workflows/ci.yml +21 -0
- package/.github-export-ignore +30 -0
- package/.tmp-cem/custom-elements.json +13705 -0
- package/CONTRIBUTING.md +59 -0
- package/DEV.md +54 -0
- package/LICENSE +21 -0
- package/OPEN_SOURCE_CHECKPOINT.md +133 -0
- package/build-infos.json +1 -1
- package/concorde-3d.bundle.js +3960 -0
- package/concorde-3d.es.js +33433 -0
- package/concorde-core.bundle.js +196 -196
- package/concorde-core.es.js +3685 -3405
- package/concorde-hugging-face-infer.bundle.js +32 -0
- package/concorde-hugging-face-infer.es.js +2952 -0
- package/concorde-interactive.bundle.js +1157 -0
- package/concorde-interactive.es.js +10734 -0
- package/concorde-shader.bundle.js +116 -0
- package/concorde-shader.es.js +8353 -0
- package/concorde-webgpu.bundle.js +307 -0
- package/concorde-webgpu.es.js +8627 -0
- package/custom-elements-manifest.config.mjs +14 -0
- package/dist/concorde-core.bundle.js +196 -196
- package/dist/concorde-core.es.js +3685 -3405
- package/docs/assets/{index-wVZpLVYW.js → index-D8MVWqY6.js} +1351 -1222
- package/docs/assets/index-DiD0qYvE.css +1 -0
- package/docs/crawl/core/components/ui/alert/alert.html +71 -172
- package/docs/crawl/core/components/ui/alert-messages/alert-messages.html +5 -113
- package/docs/crawl/core/components/ui/badge/badge.html +79 -157
- package/docs/crawl/core/components/ui/button/button.html +0 -1
- package/docs/crawl/core/components/ui/captcha/captcha.html +8 -90
- package/docs/crawl/core/components/ui/card/card.html +68 -222
- package/docs/crawl/core/components/ui/divider/divider.html +31 -117
- package/docs/crawl/core/components/ui/form/fieldset/fieldset.html +101 -232
- package/docs/crawl/core/components/ui/form/form-actions/form-actions.html +52 -95
- package/docs/crawl/core/components/ui/form/form-layout/form-layout.html +38 -97
- package/docs/crawl/core/components/ui/form/input/input.html +3 -3
- package/docs/crawl/core/components/ui/form/textarea/textarea.html +3 -3
- package/docs/crawl/core/components/ui/group/group.html +38 -60
- package/docs/crawl/core/components/ui/icon/icon.html +47 -136
- package/docs/crawl/core/components/ui/image/image.html +56 -244
- package/docs/crawl/core/components/ui/link/link.html +9 -67
- package/docs/crawl/core/components/ui/loader/loader.html +23 -97
- package/docs/crawl/core/components/ui/menu/menu.html +90 -162
- package/docs/crawl/core/components/ui/modal/modal.html +50 -275
- package/docs/crawl/core/components/ui/pop/pop.html +66 -260
- package/docs/crawl/core/components/ui/progress/progress.html +30 -103
- package/docs/crawl/core/components/ui/table/table.html +171 -303
- package/docs/crawl/core/components/ui/toast/toast.html +59 -170
- package/docs/crawl/core/components/ui/tooltip/tooltip.html +29 -90
- package/docs/crawl/docs/_decorators/ancestor-attribute.html +2 -3
- package/docs/crawl/docs/_getting-started/concorde-outside.html +3 -3
- package/docs/crawl/docs/_getting-started/start.html +1 -1
- package/docs/crawl/docs/_getting-started/theming.html +63 -311
- package/docs/crawl/hubs/form-components.html +53 -75
- package/docs/crawl/index.html +6 -7
- package/docs/docs-mock-api-sw.js +0 -2
- package/docs/docs-mock-api-sw.js.map +2 -2
- package/docs/index.html +7 -9
- package/docs/llms-full.txt +456 -1703
- package/docs/llms.txt +32 -25
- package/docs/sitemap.xml +0 -3
- package/docs/src/core/components/functional/fetch/fetch.md +0 -0
- package/docs/src/core/components/functional/if/if.md +0 -0
- package/docs/src/core/components/functional/list/list.md +0 -0
- package/docs/src/core/components/functional/router/router.md +0 -0
- package/docs/src/core/components/functional/sdui/sdui.md +0 -0
- package/docs/src/core/components/functional/states/states.md +0 -0
- package/docs/src/core/components/functional/submit/submit.md +0 -0
- package/docs/src/core/components/ui/alert/alert.md +72 -147
- package/docs/src/core/components/ui/alert-messages/alert-messages.md +0 -85
- package/docs/src/core/components/ui/badge/badge.md +80 -141
- package/docs/src/core/components/ui/button/button.md +0 -1
- package/docs/src/core/components/ui/captcha/captcha.md +6 -65
- package/docs/src/core/components/ui/card/card.md +65 -183
- package/docs/src/core/components/ui/divider/divider.md +13 -107
- package/docs/src/core/components/ui/form/fieldset/fieldset.md +99 -175
- package/docs/src/core/components/ui/form/form-actions/form-actions.md +52 -75
- package/docs/src/core/components/ui/form/form-layout/form-layout.md +34 -109
- package/docs/src/core/components/ui/form/input/input.md +1 -1
- package/docs/src/core/components/ui/form/radio/radio.md +0 -0
- package/docs/src/core/components/ui/form/select/select.md +0 -0
- package/docs/src/core/components/ui/form/switch/switch.md +0 -0
- package/docs/src/core/components/ui/form/textarea/textarea.md +1 -1
- package/docs/src/core/components/ui/group/group.md +36 -36
- package/docs/src/core/components/ui/icon/icon.md +43 -132
- package/docs/src/core/components/ui/image/image.md +53 -179
- package/docs/src/core/components/ui/link/link.md +7 -45
- package/docs/src/core/components/ui/loader/loader.md +22 -79
- package/docs/src/core/components/ui/menu/menu.md +92 -133
- package/docs/src/core/components/ui/modal/modal.md +47 -163
- package/docs/src/core/components/ui/pop/pop.md +64 -262
- package/docs/src/core/components/ui/progress/progress.md +30 -76
- package/docs/src/core/components/ui/table/table.md +171 -147
- package/docs/src/core/components/ui/toast/toast.md +58 -108
- package/docs/src/core/components/ui/tooltip/tooltip.md +26 -68
- package/docs/src/docs/_core-concept/subscriber.md +0 -0
- package/docs/src/docs/_decorators/ancestor-attribute.md +2 -3
- package/docs/src/docs/_getting-started/concorde-outside.md +3 -3
- package/docs/src/docs/_getting-started/my-first-subscriber.md +0 -0
- package/docs/src/docs/_getting-started/pubsub.md +0 -0
- package/docs/src/docs/_getting-started/start.md +1 -1
- package/docs/src/docs/_getting-started/theming.md +61 -223
- package/docs/src/docs/search/docs-search.json +348 -3083
- package/docs/src/tsconfig.declarations.json +22 -0
- package/docs/src/tsconfig.emit.json +23 -0
- package/docs/src/tsconfig.json +3 -63
- package/gitlab/job_github_mirror.sh +39 -0
- package/package.json +36 -2
- package/scripts/generate-sdui-catalog.mjs +250 -0
- package/scripts/generate-sdui-catalog.spec.ts +91 -0
- package/scripts/github-export.mjs +150 -0
- package/scripts/post-build-docs.js +0 -0
- package/scripts/post-build.mjs +0 -0
- package/scripts/pre-build.mjs +15 -0
- package/src/core/components/functional/fetch/fetch.md +0 -0
- package/src/core/components/functional/if/if.md +0 -0
- package/src/core/components/functional/if/if.ts +0 -0
- package/src/core/components/functional/list/list.demo.ts +0 -0
- package/src/core/components/functional/list/list.md +0 -0
- package/src/core/components/functional/router/router.md +0 -0
- package/src/core/components/functional/router/router.ts +0 -0
- package/src/core/components/functional/sdui/SDUIDescriptorTransformer.ts +5 -5
- package/src/core/components/functional/sdui/__fixtures__/descriptors.ts +251 -0
- package/src/core/components/functional/sdui/__snapshots__/sdui-action.spec.ts.snap +73 -0
- package/src/core/components/functional/sdui/__snapshots__/sdui-incremental.spec.ts.snap +50 -0
- package/src/core/components/functional/sdui/__snapshots__/sdui-partial.spec.ts.snap +50 -0
- package/src/core/components/functional/sdui/__snapshots__/sdui.regression.spec.ts.snap +461 -0
- package/src/core/components/functional/sdui/component-catalog.gaps.json +511 -0
- package/src/core/components/functional/sdui/component-catalog.json +3103 -0
- package/src/core/components/functional/sdui/component-catalog.spec.ts +23 -0
- package/src/core/components/functional/sdui/sdui-action.spec.ts +99 -0
- package/src/core/components/functional/sdui/sdui-dom-snapshot.ts +61 -0
- package/src/core/components/functional/sdui/sdui-extension-points.md +94 -0
- package/src/core/components/functional/sdui/sdui-incremental.spec.ts +137 -0
- package/src/core/components/functional/sdui/sdui-partial.spec.ts +83 -0
- package/src/core/components/functional/sdui/sdui-partial.ts +19 -0
- package/src/core/components/functional/sdui/sdui-safe.spec.ts +188 -0
- package/src/core/components/functional/sdui/sdui-safe.ts +100 -0
- package/src/core/components/functional/sdui/sdui.md +122 -0
- package/src/core/components/functional/sdui/sdui.regression.spec.ts +64 -0
- package/src/core/components/functional/sdui/sdui.ts +442 -34
- package/src/core/components/functional/sdui/types.ts +49 -0
- package/src/core/components/functional/states/states.md +0 -0
- package/src/core/components/functional/submit/submit.md +0 -0
- package/src/core/components/functional/subscriber/subscriber.ts +0 -0
- package/src/core/components/functional/value/value.ts +0 -0
- package/src/core/components/ui/_css/size.ts +0 -0
- package/src/core/components/ui/captcha/altchaStyles.ts +0 -0
- package/src/core/components/ui/form/radio/radio.md +0 -0
- package/src/core/components/ui/form/select/select.md +0 -0
- package/src/core/components/ui/form/switch/switch.md +0 -0
- package/src/core/mixins/Subscriber.ts +0 -0
- package/src/core/utils/DataBindObserver.ts +0 -0
- package/src/core/utils/Objects.ts +0 -0
- package/src/core/utils/route.ts +0 -0
- package/src/css.d.ts +19 -0
- package/src/docs/_core-concept/subscriber.md +0 -0
- package/src/docs/_getting-started/my-first-subscriber.md +0 -0
- package/src/docs/_getting-started/pubsub.md +0 -0
- package/src/docs/example/users.ts +0 -0
- package/src/docs/search/page.ts +0 -0
- package/src/tsconfig.declarations.json +22 -0
- package/src/tsconfig.emit.json +23 -0
- package/src/tsconfig.json +90 -0
- package/src/tsconfig.tsbuildinfo +1 -1
- package/docs/assets/index-CD4WyL6o.css +0 -1
- package/docs/crawl/core/components/ui/theme/theme.html +0 -131
- package/docs/src/core/components/ui/theme/theme.md +0 -122
package/src/css.d.ts
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
declare module "*.css" {
|
|
2
|
+
const css: import("lit").CSSResult;
|
|
3
|
+
export default css;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
declare module "*.css?inline" {
|
|
7
|
+
const css: string;
|
|
8
|
+
export default css;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
declare module "*.scss" {
|
|
12
|
+
const css: import("lit").CSSResult;
|
|
13
|
+
export default css;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
declare module "*.scss?inline" {
|
|
17
|
+
const css: string;
|
|
18
|
+
export default css;
|
|
19
|
+
}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
package/src/docs/search/page.ts
CHANGED
|
File without changes
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "./tsconfig-model.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"noEmit": false,
|
|
5
|
+
"emitDeclarationOnly": true,
|
|
6
|
+
"declaration": true,
|
|
7
|
+
"declarationMap": true,
|
|
8
|
+
"outDir": "../dist/types",
|
|
9
|
+
"rootDir": "."
|
|
10
|
+
},
|
|
11
|
+
"include": ["**/*.ts"],
|
|
12
|
+
"exclude": [
|
|
13
|
+
"node_modules/**/*",
|
|
14
|
+
"**/*.spec.ts",
|
|
15
|
+
"**/*.test.ts",
|
|
16
|
+
"**/*.demo.ts",
|
|
17
|
+
"**/*.stories.ts",
|
|
18
|
+
"**/*.type-test.ts",
|
|
19
|
+
"docs.ts",
|
|
20
|
+
"docs/**/*"
|
|
21
|
+
]
|
|
22
|
+
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "./tsconfig-model.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"noEmit": false,
|
|
5
|
+
"emitDeclarationOnly": false,
|
|
6
|
+
"declaration": false,
|
|
7
|
+
"sourceMap": true,
|
|
8
|
+
"outDir": "../dist/js",
|
|
9
|
+
"rootDir": ".",
|
|
10
|
+
"lib": ["ES2021", "DOM", "DOM.Iterable"]
|
|
11
|
+
},
|
|
12
|
+
"include": ["**/*.ts"],
|
|
13
|
+
"exclude": [
|
|
14
|
+
"node_modules/**/*",
|
|
15
|
+
"**/*.spec.ts",
|
|
16
|
+
"**/*.test.ts",
|
|
17
|
+
"**/*.demo.ts",
|
|
18
|
+
"**/*.stories.ts",
|
|
19
|
+
"**/*.type-test.ts",
|
|
20
|
+
"docs.ts",
|
|
21
|
+
"docs/**/*"
|
|
22
|
+
]
|
|
23
|
+
}
|
package/src/tsconfig.json
CHANGED
|
@@ -165,6 +165,87 @@
|
|
|
165
165
|
"./functional/sdui/SDUIDescriptorTransformer": [
|
|
166
166
|
"/sites/concorde/src/core/components/functional/sdui/SDUIDescriptorTransformer.ts"
|
|
167
167
|
],
|
|
168
|
+
"./descriptors": [
|
|
169
|
+
"/sites/concorde/src/core/components/functional/sdui/__fixtures__/descriptors.ts"
|
|
170
|
+
],
|
|
171
|
+
"./functional/descriptors": [
|
|
172
|
+
"/sites/concorde/src/core/components/functional/sdui/__fixtures__/descriptors.ts"
|
|
173
|
+
],
|
|
174
|
+
"./functional/sdui/descriptors": [
|
|
175
|
+
"/sites/concorde/src/core/components/functional/sdui/__fixtures__/descriptors.ts"
|
|
176
|
+
],
|
|
177
|
+
"./component-catalog.spec": [
|
|
178
|
+
"/sites/concorde/src/core/components/functional/sdui/component-catalog.spec.ts"
|
|
179
|
+
],
|
|
180
|
+
"./functional/component-catalog.spec": [
|
|
181
|
+
"/sites/concorde/src/core/components/functional/sdui/component-catalog.spec.ts"
|
|
182
|
+
],
|
|
183
|
+
"./functional/sdui/component-catalog.spec": [
|
|
184
|
+
"/sites/concorde/src/core/components/functional/sdui/component-catalog.spec.ts"
|
|
185
|
+
],
|
|
186
|
+
"./sdui-action.spec": [
|
|
187
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-action.spec.ts"
|
|
188
|
+
],
|
|
189
|
+
"./functional/sdui-action.spec": [
|
|
190
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-action.spec.ts"
|
|
191
|
+
],
|
|
192
|
+
"./functional/sdui/sdui-action.spec": [
|
|
193
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-action.spec.ts"
|
|
194
|
+
],
|
|
195
|
+
"./sdui-dom-snapshot": [
|
|
196
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-dom-snapshot.ts"
|
|
197
|
+
],
|
|
198
|
+
"./functional/sdui-dom-snapshot": [
|
|
199
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-dom-snapshot.ts"
|
|
200
|
+
],
|
|
201
|
+
"./functional/sdui/sdui-dom-snapshot": [
|
|
202
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-dom-snapshot.ts"
|
|
203
|
+
],
|
|
204
|
+
"./sdui-incremental.spec": [
|
|
205
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-incremental.spec.ts"
|
|
206
|
+
],
|
|
207
|
+
"./functional/sdui-incremental.spec": [
|
|
208
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-incremental.spec.ts"
|
|
209
|
+
],
|
|
210
|
+
"./functional/sdui/sdui-incremental.spec": [
|
|
211
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-incremental.spec.ts"
|
|
212
|
+
],
|
|
213
|
+
"./sdui-partial.spec": [
|
|
214
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-partial.spec.ts"
|
|
215
|
+
],
|
|
216
|
+
"./functional/sdui-partial.spec": [
|
|
217
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-partial.spec.ts"
|
|
218
|
+
],
|
|
219
|
+
"./functional/sdui/sdui-partial.spec": [
|
|
220
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-partial.spec.ts"
|
|
221
|
+
],
|
|
222
|
+
"./sdui-partial": [
|
|
223
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-partial.ts"
|
|
224
|
+
],
|
|
225
|
+
"./functional/sdui-partial": [
|
|
226
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-partial.ts"
|
|
227
|
+
],
|
|
228
|
+
"./functional/sdui/sdui-partial": [
|
|
229
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-partial.ts"
|
|
230
|
+
],
|
|
231
|
+
"./sdui-safe.spec": [
|
|
232
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-safe.spec.ts"
|
|
233
|
+
],
|
|
234
|
+
"./functional/sdui-safe.spec": [
|
|
235
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-safe.spec.ts"
|
|
236
|
+
],
|
|
237
|
+
"./functional/sdui/sdui-safe.spec": [
|
|
238
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-safe.spec.ts"
|
|
239
|
+
],
|
|
240
|
+
"./sdui-safe": [
|
|
241
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-safe.ts"
|
|
242
|
+
],
|
|
243
|
+
"./functional/sdui-safe": [
|
|
244
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-safe.ts"
|
|
245
|
+
],
|
|
246
|
+
"./functional/sdui/sdui-safe": [
|
|
247
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui-safe.ts"
|
|
248
|
+
],
|
|
168
249
|
"./sdui-utils": [
|
|
169
250
|
"/sites/concorde/src/core/components/functional/sdui/sdui-utils.ts"
|
|
170
251
|
],
|
|
@@ -174,6 +255,15 @@
|
|
|
174
255
|
"./functional/sdui/sdui-utils": [
|
|
175
256
|
"/sites/concorde/src/core/components/functional/sdui/sdui-utils.ts"
|
|
176
257
|
],
|
|
258
|
+
"./sdui.regression.spec": [
|
|
259
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui.regression.spec.ts"
|
|
260
|
+
],
|
|
261
|
+
"./functional/sdui.regression.spec": [
|
|
262
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui.regression.spec.ts"
|
|
263
|
+
],
|
|
264
|
+
"./functional/sdui/sdui.regression.spec": [
|
|
265
|
+
"/sites/concorde/src/core/components/functional/sdui/sdui.regression.spec.ts"
|
|
266
|
+
],
|
|
177
267
|
"./sdui": [
|
|
178
268
|
"/sites/concorde/src/core/components/functional/sdui/sdui.ts"
|
|
179
269
|
],
|
package/src/tsconfig.tsbuildinfo
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"root":["./components.ts","./concorde-loaded.ts","./dataprovider.ts","./decorators.ts","./directives.ts","./index.ts","./mixins.ts","./utils.ts","./core/core.ts","./core/_types/endpoint.ts","./core/_types/key.ts","./core/_types/types.ts","./core/components/functional/functional.ts","./core/components/functional/date/date.ts","./core/components/functional/example/example.ts","./core/components/functional/fetch/fetch.ts","./core/components/functional/if/if.test.ts","./core/components/functional/if/if.ts","./core/components/functional/jsonata/jsonata.spec.ts","./core/components/functional/jsonata/jsonata.ts","./core/components/functional/list/list.demo.ts","./core/components/functional/list/list.spec.ts","./core/components/functional/list/list.ts","./core/components/functional/mix/mix.ts","./core/components/functional/queue/queue.demo.ts","./core/components/functional/queue/queue.ts","./core/components/functional/router/redirect.ts","./core/components/functional/router/router.demo.ts","./core/components/functional/router/router.spec.ts","./core/components/functional/router/router.ts","./core/components/functional/sdui/SDUIDescriptorTransformer.ts","./core/components/functional/sdui/sdui-utils.ts","./core/components/functional/sdui/sdui.ts","./core/components/functional/sdui/types.ts","./core/components/functional/sonic-scope/sonic-scope.ts","./core/components/functional/states/states.demo.ts","./core/components/functional/states/states.spec.ts","./core/components/functional/states/states.ts","./core/components/functional/submit/submit.ts","./core/components/functional/subscriber/subscriber.ts","./core/components/functional/translation/translation.ts","./core/components/functional/value/value.ts","./core/components/ui/ui.ts","./core/components/ui/_css/align.ts","./core/components/ui/_css/rounded.ts","./core/components/ui/_css/scroll.ts","./core/components/ui/_css/shadow.ts","./core/components/ui/_css/size.ts","./core/components/ui/_css/type.ts","./core/components/ui/_i18n/ui-aria-labels.ts","./core/components/ui/alert/alert.spec.ts","./core/components/ui/alert/alert.ts","./core/components/ui/alert-messages/alert-messages.ts","./core/components/ui/badge/badge.ts","./core/components/ui/button/button.ts","./core/components/ui/captcha/altchaStyles.ts","./core/components/ui/captcha/captcha.ts","./core/components/ui/card/card-footer.ts","./core/components/ui/card/card-header-descripton.ts","./core/components/ui/card/card-header.ts","./core/components/ui/card/card-main.ts","./core/components/ui/card/card.ts","./core/components/ui/divider/divider.ts","./core/components/ui/form/checkbox/checkbox.ts","./core/components/ui/form/css/form-control.ts","./core/components/ui/form/fieldset/fieldset.ts","./core/components/ui/form/fieldset/legend-description.ts","./core/components/ui/form/fieldset/legend.ts","./core/components/ui/form/form-actions/form-actions.ts","./core/components/ui/form/form-layout/form-layout.ts","./core/components/ui/form/input/input.ts","./core/components/ui/form/input/password-helper.ts","./core/components/ui/form/input/same-value-helper.ts","./core/components/ui/form/input-autocomplete/input-autocomplete.ts","./core/components/ui/form/radio/radio.ts","./core/components/ui/form/select/select.ts","./core/components/ui/form/switch/switch.ts","./core/components/ui/form/textarea/textarea.ts","./core/components/ui/group/group.ts","./core/components/ui/icon/icon.stories.ts","./core/components/ui/icon/icon.ts","./core/components/ui/icon/icons.ts","./core/components/ui/image/image.ts","./core/components/ui/link/link.ts","./core/components/ui/loader/loader.stories.ts","./core/components/ui/loader/loader.ts","./core/components/ui/loader/styles/fixed.ts","./core/components/ui/loader/styles/inline.ts","./core/components/ui/menu/menu-item.ts","./core/components/ui/menu/menu.ts","./core/components/ui/modal/modal-actions.ts","./core/components/ui/modal/modal-close.ts","./core/components/ui/modal/modal-content.ts","./core/components/ui/modal/modal-subtitle.ts","./core/components/ui/modal/modal-title.ts","./core/components/ui/modal/modal-utils.ts","./core/components/ui/modal/modal.ts","./core/components/ui/pop/pop.ts","./core/components/ui/progress/progress.ts","./core/components/ui/table/table-caption.ts","./core/components/ui/table/table-tbody.ts","./core/components/ui/table/table-td.ts","./core/components/ui/table/table-tfoot.ts","./core/components/ui/table/table-th.ts","./core/components/ui/table/table-thead.ts","./core/components/ui/table/table-tr.ts","./core/components/ui/table/table.ts","./core/components/ui/theme/theme.ts","./core/components/ui/theme/theme-collection/auto.ts","./core/components/ui/theme/theme-collection/core-variables.ts","./core/components/ui/theme/theme-collection/dark.ts","./core/components/ui/theme/theme-collection/light.ts","./core/components/ui/toast/dismissed.ts","./core/components/ui/toast/message-subscriber.ts","./core/components/ui/toast/render-content.ts","./core/components/ui/toast/toast-item.ts","./core/components/ui/toast/toast.ts","./core/components/ui/toast/types.ts","./core/components/ui/tooltip/tooltip.ts","./core/decorators/Subscriber.ts","./core/decorators/api.post.spec.ts","./core/decorators/api.spec.ts","./core/decorators/api.ts","./core/decorators/lifecycle.ts","./core/decorators/subscriber/ancestorAttribute.spec.ts","./core/decorators/subscriber/ancestorAttribute.ts","./core/decorators/subscriber/autoFill.ts","./core/decorators/subscriber/autoSubscribe.ts","./core/decorators/subscriber/bind.ts","./core/decorators/subscriber/common.ts","./core/decorators/subscriber/derive.ts","./core/decorators/subscriber/dynamicPath.spec.ts","./core/decorators/subscriber/dynamicPath.ts","./core/decorators/subscriber/dynamicPropertyWatch.spec.ts","./core/decorators/subscriber/dynamicPropertyWatch.ts","./core/decorators/subscriber/handle.disambig.spec.ts","./core/decorators/subscriber/handle.skip.spec.ts","./core/decorators/subscriber/handle.ts","./core/decorators/subscriber/onAssign.ts","./core/decorators/subscriber/publish.spec.ts","./core/decorators/subscriber/publish.ts","./core/decorators/subscriber/publisherPath.ts","./core/decorators/subscriber/subscribe.spec.ts","./core/decorators/subscriber/subscribe.ts","./core/directives/DataProvider.sub.spec.ts","./core/directives/DataProvider.ts","./core/directives/Wording.ts","./core/mixins/Fetcher.ts","./core/mixins/FormCheckable.ts","./core/mixins/FormElement.ts","./core/mixins/FormInput.ts","./core/mixins/Subscriber.ts","./core/mixins/TemplatesContainer.ts","./core/mixins/mixins.ts","./core/utils/AncestorAttributeObserver.ts","./core/utils/Arrays.ts","./core/utils/DataBindObserver.ts","./core/utils/Electron.ts","./core/utils/Format.ts","./core/utils/HTML.ts","./core/utils/LocationHandler.ts","./core/utils/Objects.ts","./core/utils/PublisherProxy.ts","./core/utils/SafariScrollGuard.ts","./core/utils/Utils.ts","./core/utils/aesCrypto.ts","./core/utils/api.spec.ts","./core/utils/api.ts","./core/utils/dataProviderKey.spec.ts","./core/utils/dataProviderKey.ts","./core/utils/derive.spec.ts","./core/utils/derive.ts","./core/utils/dismissed.ts","./core/utils/dpOptions.spec.ts","./core/utils/endpoint.spec.ts","./core/utils/endpoint.ts","./core/utils/jsonataHelpers.ts","./core/utils/jsonataRuntime.ts","./core/utils/positioning.spec.ts","./core/utils/positioning.ts","./core/utils/publisherPathKey.spec.ts","./core/utils/route.spec.ts","./core/utils/route.ts","./core/utils/url-pattern.ts","./test-utils/TestUtils.ts"],"version":"5.9.2"}
|
|
1
|
+
{"root":["./components.ts","./concorde-loaded.ts","./css.d.ts","./dataprovider.ts","./decorators.ts","./directives.ts","./index.ts","./mixins.ts","./utils.ts","./core/core.ts","./core/_types/endpoint.ts","./core/_types/key.ts","./core/_types/types.ts","./core/components/functional/functional.ts","./core/components/functional/date/date.ts","./core/components/functional/example/example.ts","./core/components/functional/fetch/fetch.ts","./core/components/functional/if/if.test.ts","./core/components/functional/if/if.ts","./core/components/functional/jsonata/jsonata.spec.ts","./core/components/functional/jsonata/jsonata.ts","./core/components/functional/list/list.demo.ts","./core/components/functional/list/list.spec.ts","./core/components/functional/list/list.ts","./core/components/functional/mix/mix.ts","./core/components/functional/queue/queue.demo.ts","./core/components/functional/queue/queue.ts","./core/components/functional/router/redirect.ts","./core/components/functional/router/router.demo.ts","./core/components/functional/router/router.spec.ts","./core/components/functional/router/router.ts","./core/components/functional/sdui/SDUIDescriptorTransformer.ts","./core/components/functional/sdui/component-catalog.spec.ts","./core/components/functional/sdui/sdui-action.spec.ts","./core/components/functional/sdui/sdui-dom-snapshot.ts","./core/components/functional/sdui/sdui-incremental.spec.ts","./core/components/functional/sdui/sdui-partial.spec.ts","./core/components/functional/sdui/sdui-partial.ts","./core/components/functional/sdui/sdui-safe.spec.ts","./core/components/functional/sdui/sdui-safe.ts","./core/components/functional/sdui/sdui-utils.ts","./core/components/functional/sdui/sdui.regression.spec.ts","./core/components/functional/sdui/sdui.ts","./core/components/functional/sdui/types.ts","./core/components/functional/sdui/__fixtures__/descriptors.ts","./core/components/functional/sonic-scope/sonic-scope.ts","./core/components/functional/states/states.demo.ts","./core/components/functional/states/states.spec.ts","./core/components/functional/states/states.ts","./core/components/functional/submit/submit.ts","./core/components/functional/subscriber/subscriber.ts","./core/components/functional/translation/translation.ts","./core/components/functional/value/value.ts","./core/components/ui/ui.ts","./core/components/ui/_css/align.ts","./core/components/ui/_css/rounded.ts","./core/components/ui/_css/scroll.ts","./core/components/ui/_css/shadow.ts","./core/components/ui/_css/size.ts","./core/components/ui/_css/type.ts","./core/components/ui/_i18n/ui-aria-labels.ts","./core/components/ui/alert/alert.spec.ts","./core/components/ui/alert/alert.ts","./core/components/ui/alert-messages/alert-messages.ts","./core/components/ui/badge/badge.ts","./core/components/ui/button/button.ts","./core/components/ui/captcha/altchaStyles.ts","./core/components/ui/captcha/captcha.ts","./core/components/ui/card/card-footer.ts","./core/components/ui/card/card-header-descripton.ts","./core/components/ui/card/card-header.ts","./core/components/ui/card/card-main.ts","./core/components/ui/card/card.ts","./core/components/ui/divider/divider.ts","./core/components/ui/form/checkbox/checkbox.ts","./core/components/ui/form/css/form-control.ts","./core/components/ui/form/fieldset/fieldset.ts","./core/components/ui/form/fieldset/legend-description.ts","./core/components/ui/form/fieldset/legend.ts","./core/components/ui/form/form-actions/form-actions.ts","./core/components/ui/form/form-layout/form-layout.ts","./core/components/ui/form/input/input.ts","./core/components/ui/form/input/password-helper.ts","./core/components/ui/form/input/same-value-helper.ts","./core/components/ui/form/input-autocomplete/input-autocomplete.ts","./core/components/ui/form/radio/radio.ts","./core/components/ui/form/select/select.ts","./core/components/ui/form/switch/switch.ts","./core/components/ui/form/textarea/textarea.ts","./core/components/ui/group/group.ts","./core/components/ui/icon/icon.stories.ts","./core/components/ui/icon/icon.ts","./core/components/ui/icon/icons.ts","./core/components/ui/image/image.ts","./core/components/ui/link/link.ts","./core/components/ui/loader/loader.stories.ts","./core/components/ui/loader/loader.ts","./core/components/ui/loader/styles/fixed.ts","./core/components/ui/loader/styles/inline.ts","./core/components/ui/menu/menu-item.ts","./core/components/ui/menu/menu.ts","./core/components/ui/modal/modal-actions.ts","./core/components/ui/modal/modal-close.ts","./core/components/ui/modal/modal-content.ts","./core/components/ui/modal/modal-subtitle.ts","./core/components/ui/modal/modal-title.ts","./core/components/ui/modal/modal-utils.ts","./core/components/ui/modal/modal.ts","./core/components/ui/pop/pop.ts","./core/components/ui/progress/progress.ts","./core/components/ui/table/table-caption.ts","./core/components/ui/table/table-tbody.ts","./core/components/ui/table/table-td.ts","./core/components/ui/table/table-tfoot.ts","./core/components/ui/table/table-th.ts","./core/components/ui/table/table-thead.ts","./core/components/ui/table/table-tr.ts","./core/components/ui/table/table.ts","./core/components/ui/theme/theme.ts","./core/components/ui/theme/theme-collection/auto.ts","./core/components/ui/theme/theme-collection/core-variables.ts","./core/components/ui/theme/theme-collection/dark.ts","./core/components/ui/theme/theme-collection/light.ts","./core/components/ui/toast/dismissed.ts","./core/components/ui/toast/message-subscriber.ts","./core/components/ui/toast/render-content.ts","./core/components/ui/toast/toast-item.ts","./core/components/ui/toast/toast.ts","./core/components/ui/toast/types.ts","./core/components/ui/tooltip/tooltip.ts","./core/decorators/Subscriber.ts","./core/decorators/api.post.spec.ts","./core/decorators/api.spec.ts","./core/decorators/api.ts","./core/decorators/lifecycle.ts","./core/decorators/subscriber/ancestorAttribute.spec.ts","./core/decorators/subscriber/ancestorAttribute.ts","./core/decorators/subscriber/autoFill.ts","./core/decorators/subscriber/autoSubscribe.ts","./core/decorators/subscriber/bind.ts","./core/decorators/subscriber/common.ts","./core/decorators/subscriber/derive.ts","./core/decorators/subscriber/dynamicPath.spec.ts","./core/decorators/subscriber/dynamicPath.ts","./core/decorators/subscriber/dynamicPropertyWatch.spec.ts","./core/decorators/subscriber/dynamicPropertyWatch.ts","./core/decorators/subscriber/handle.disambig.spec.ts","./core/decorators/subscriber/handle.skip.spec.ts","./core/decorators/subscriber/handle.ts","./core/decorators/subscriber/onAssign.ts","./core/decorators/subscriber/publish.spec.ts","./core/decorators/subscriber/publish.ts","./core/decorators/subscriber/publisherPath.ts","./core/decorators/subscriber/subscribe.spec.ts","./core/decorators/subscriber/subscribe.ts","./core/directives/DataProvider.sub.spec.ts","./core/directives/DataProvider.ts","./core/directives/Wording.ts","./core/mixins/Fetcher.ts","./core/mixins/FormCheckable.ts","./core/mixins/FormElement.ts","./core/mixins/FormInput.ts","./core/mixins/Subscriber.ts","./core/mixins/TemplatesContainer.ts","./core/mixins/mixins.ts","./core/utils/AncestorAttributeObserver.ts","./core/utils/Arrays.ts","./core/utils/DataBindObserver.ts","./core/utils/Electron.ts","./core/utils/Format.ts","./core/utils/HTML.ts","./core/utils/LocationHandler.ts","./core/utils/Objects.ts","./core/utils/PublisherProxy.ts","./core/utils/SafariScrollGuard.ts","./core/utils/Utils.ts","./core/utils/aesCrypto.ts","./core/utils/api.spec.ts","./core/utils/api.ts","./core/utils/dataProviderKey.spec.ts","./core/utils/dataProviderKey.ts","./core/utils/derive.spec.ts","./core/utils/derive.ts","./core/utils/dismissed.ts","./core/utils/dpOptions.spec.ts","./core/utils/endpoint.spec.ts","./core/utils/endpoint.ts","./core/utils/jsonataHelpers.ts","./core/utils/jsonataRuntime.ts","./core/utils/positioning.spec.ts","./core/utils/positioning.ts","./core/utils/publisherPathKey.spec.ts","./core/utils/route.spec.ts","./core/utils/route.ts","./core/utils/url-pattern.ts","./test-utils/TestUtils.ts"],"version":"5.9.2"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.\!container{width:100%!important}.container{width:100%}@media (min-width: 640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media (min-width: 768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media (min-width: 1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media (min-width: 1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media (min-width: 1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}.prose{color:var(--tw-prose-body);max-width:65ch}.prose :where(p):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1em;margin-bottom:1em}.prose :where([class~=lead]):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-lead);font-size:1.25em;line-height:1.6;margin-top:1.2em;margin-bottom:1.2em}.prose :where(a):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.prose :where(strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-bold);font-weight:600}.prose :where(a strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(blockquote strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(thead th strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(ol):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:decimal;padding-inline-start:1.625em;margin-top:1em;margin-bottom:1em}.prose :where(ol[type=A]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=A s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=I]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type=I s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type="1"]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:decimal}.prose :where(ul):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:disc;padding-inline-start:1.625em;margin-top:1em;margin-bottom:1em}.prose :where(ol>li):not(:where([class~=not-prose],[class~=not-prose] *))::marker{font-weight:400;color:var(--tw-prose-counters)}.prose :where(ul>li):not(:where([class~=not-prose],[class~=not-prose] *))::marker{color:var(--tw-prose-bullets)}.prose :where(dt):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.25em}.prose :where(hr):not(:where([class~=not-prose],[class~=not-prose] *)){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.prose :where(blockquote):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:500;font-style:italic;color:var(--tw-prose-quotes);border-inline-start-width:.25rem;border-inline-start-color:var(--tw-prose-quote-borders);quotes:"“""”""‘""’";margin-top:1.6em;margin-bottom:1.6em;padding-inline-start:1em}.prose :where(blockquote p:first-of-type):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:open-quote}.prose :where(blockquote p:last-of-type):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:close-quote}.prose :where(h1):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:500;font-size:2.25em;margin-top:0;margin-bottom:1rem;line-height:1.1111111}.prose :where(h1 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:900;color:inherit}.prose :where(h2):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:500;font-size:1.5em;margin-top:2em;margin-bottom:1em;line-height:1.3333333;border-bottom:var(--sc-border-width) solid;padding-bottom:.1em}.prose :where(h2 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:800;color:inherit}.prose :where(h3):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:500;font-size:1.25em;margin-top:1.6em;margin-bottom:.6em;line-height:1.6}.prose :where(h3 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(h4):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:500;margin-top:1.5em;margin-bottom:.5em;line-height:1.5}.prose :where(h4 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(img):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(picture):not(:where([class~=not-prose],[class~=not-prose] *)){display:block;margin-top:2em;margin-bottom:2em}.prose :where(video):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(kbd):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:500;font-family:inherit;color:var(--tw-prose-kbd);box-shadow:0 0 0 1px rgb(var(--tw-prose-kbd-shadows) / 10%),0 3px rgb(var(--tw-prose-kbd-shadows) / 10%);font-size:.875em;border-radius:.3125rem;padding-top:.1875em;padding-inline-end:.375em;padding-bottom:.1875em;padding-inline-start:.375em}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--sc-base-content);font-weight:600;font-size:.875em;background-color:var(--sc-base-100);border-radius:calc(var(--sc-rounded) * .75);border-width:1px;border-color:var(--sc-base-200);padding:.15em .4em;font-family:var(--sc-font-family-monospace, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace)}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:none}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:none}.prose :where(a code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(h1 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(h2 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit;font-size:.875em}.prose :where(h3 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit;font-size:.9em}.prose :where(h4 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(blockquote code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(thead th code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(pre):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--sc-base-content);background-color:var(--sc-base-100);overflow-x:auto;font-weight:400;font-size:.8125rem;line-height:1.6;margin-top:1.7142857em;margin-bottom:1.7142857em;border-radius:var(--sc-rounded);padding-top:.8571429em;padding-inline-end:1.1428571em;padding-bottom:.8571429em;padding-inline-start:1.1428571em;border-width:1px;border-style:solid;border-color:var(--sc-base-200);padding:1rem 1.25rem;font-family:var(--sc-font-family-monospace, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace)}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)){background-color:transparent;border-width:0;border-radius:0;padding:0;font-weight:400;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:none}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:none}.prose :where(table):not(:where([class~=not-prose],[class~=not-prose] *)){width:100%;table-layout:auto;margin-top:2em;margin-bottom:2em;font-size:.875em;line-height:1.7142857}.prose :where(thead):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.prose :where(thead th):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;vertical-align:bottom;padding-inline-end:.5714286em;padding-bottom:.5714286em;padding-inline-start:.5714286em}.prose :where(tbody tr):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.prose :where(tbody tr:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:0}.prose :where(tbody td):not(:where([class~=not-prose],[class~=not-prose] *)){vertical-align:baseline}.prose :where(tfoot):not(:where([class~=not-prose],[class~=not-prose] *)){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.prose :where(tfoot td):not(:where([class~=not-prose],[class~=not-prose] *)){vertical-align:top}.prose :where(th,td):not(:where([class~=not-prose],[class~=not-prose] *)){text-align:start}.prose :where(figure>*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(figcaption):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-captions);font-size:.875em;line-height:1.4285714;margin-top:.8571429em}.prose{--tw-prose-body: var(--sc-base-content);--tw-prose-headings: var(--sc-base-900);--tw-prose-lead: var(--sc-base-content);--tw-prose-links: var(--sc-base-900);--tw-prose-bold: var(--sc-base-content);--tw-prose-counters: var(--sc-base-500);--tw-prose-bullets: var(--sc-base-300);--tw-prose-hr: var(--sc-base-200);--tw-prose-quotes: var(--sc-base-content);--tw-prose-quote-borders: var(--sc-base-200);--tw-prose-captions: var(--sc-base-500);--tw-prose-kbd: #111827;--tw-prose-kbd-shadows: 17 24 39;--tw-prose-code: var(--sc-base-content);--tw-prose-pre-code: var(--sc-base-content);--tw-prose-pre-bg: var(--sc-base-100);--tw-prose-th-borders: var(--sc-base-300);--tw-prose-td-borders: var(--sc-base-200);--tw-prose-invert-body: var(--sc-base-300);--tw-prose-invert-headings: var(--sc-base);--tw-prose-invert-lead: var(--sc-base-400);--tw-prose-invert-links: var(--sc-base);--tw-prose-invert-bold: var(--sc-base);--tw-prose-invert-counters: var(--sc-base-400);--tw-prose-invert-bullets: var(--sc-base-600);--tw-prose-invert-hr: var(--sc-base-700);--tw-prose-invert-quotes: var(--sc-base-100);--tw-prose-invert-quote-borders: var(--sc-base-700);--tw-prose-invert-captions: var(--sc-base-400);--tw-prose-invert-kbd: #fff;--tw-prose-invert-kbd-shadows: 255 255 255;--tw-prose-invert-code: var(--sc-base);--tw-prose-invert-pre-code: var(--sc-base-300);--tw-prose-invert-pre-bg: var(--sc-base-900);--tw-prose-invert-th-borders: var(--sc-base-600);--tw-prose-invert-td-borders: var(--sc-base-700);font-size:1rem;line-height:1.75}.prose :where(picture>img):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(li):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.5em;margin-bottom:.5em;list-style-type:disc}.prose :where(ol>li):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-start:.375em}.prose :where(ul>li):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-start:.375em}.prose :where(.prose>ul>li p):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(.prose>ul>li>p:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ul>li>p:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:1.25em}.prose :where(.prose>ol>li>p:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ol>li>p:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:1.25em}.prose :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(dl):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em;margin-bottom:1.25em}.prose :where(dd):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.5em;padding-inline-start:1.625em}.prose :where(hr+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h2+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h3+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h4+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(thead th:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-start:0}.prose :where(thead th:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-end:0}.prose :where(tbody td,tfoot td):not(:where([class~=not-prose],[class~=not-prose] *)){padding-top:.5714286em;padding-inline-end:.5714286em;padding-bottom:.5714286em;padding-inline-start:.5714286em}.prose :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-start:0}.prose :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-end:0}.prose :where(figure):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(.prose>:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(.prose>:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:0}.prose{line-height:1.5}.prose :where(strong a):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:bolder}.prose :where(iframe[src*=youtu]):not(:where([class~=not-prose],[class~=not-prose] *)){border-radius:var(--sc-rounded-md)}.prose :where(h5):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:500}.visible{visibility:visible}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.\!relative{position:relative!important}.relative{position:relative}.sticky{position:sticky}.\!left-0{left:0!important}.\!top-0{top:0!important}.-top-1{top:-.25rem}.bottom-1{bottom:.25rem}.bottom-2{bottom:.5rem}.left-0{left:0}.right-1{right:.25rem}.right-2{right:.5rem}.top-0{top:0}.top-16{top:4rem}.top-\[4\.2rem\]{top:4.2rem}.z-10{z-index:10}.z-20{z-index:20}.z-40{z-index:40}.z-\[3000\]{z-index:3000}.col-span-2{grid-column:span 2 / span 2}.col-span-full{grid-column:1 / -1}.m-0{margin:0}.-mx-2{margin-left:-.5rem;margin-right:-.5rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.my-3{margin-top:.75rem;margin-bottom:.75rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-40{margin-bottom:10rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-3{margin-left:.75rem}.ml-5{margin-left:1.25rem}.ml-auto{margin-left:auto}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mr-4{margin-right:1rem}.mt-0{margin-top:0}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-9{margin-top:2.25rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.table-caption{display:table-caption}.grid{display:grid}.contents{display:contents}.hidden{display:none}.size-40{width:10rem;height:10rem}.size-\[2\.4rem\]{width:2.4rem;height:2.4rem}.h-1\/2{height:50%}.h-10{height:2.5rem}.h-12{height:3rem}.h-24{height:6rem}.h-3{height:.75rem}.h-4{height:1rem}.h-96{height:24rem}.h-full{height:100%}.max-h-96{max-height:24rem}.max-h-\[50svh\]{max-height:50svh}.max-h-\[calc\(100vh_-_4\.2rem\)\]{max-height:calc(100vh - 4.2rem)}.min-h-\[100vh\]{min-height:100vh}.min-h-\[5rem\]{min-height:5rem}.min-h-\[8rem\]{min-height:8rem}.min-h-screen{min-height:100vh}.w-1\/2{width:50%}.w-1\/3{width:33.333333%}.w-12{width:3rem}.w-16{width:4rem}.w-20{width:5rem}.w-24{width:6rem}.w-3{width:.75rem}.w-64{width:16rem}.w-\[5rem\]{width:5rem}.w-full{width:100%}.min-w-\[8rem\]{min-width:8rem}.max-w-2xl{max-width:42rem}.max-w-\[29ch\]{max-width:29ch}.max-w-\[30rem\]{max-width:30rem}.max-w-full{max-width:100%}.max-w-lg{max-width:32rem}.max-w-md{max-width:28rem}.max-w-prose{max-width:70ch}.max-w-sm{max-width:24rem}.max-w-xl{max-width:36rem}.max-w-xs{max-width:20rem}.flex-1{flex:1 1 0%}.flex-shrink,.shrink{flex-shrink:1}.flex-grow{flex-grow:1}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\/2{--tw-translate-x: 50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-1\/2{--tw-translate-y: 50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-90{--tw-rotate: 90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-\[55deg\]{--tw-rotate: 55deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.resize{resize:both}.list-disc{list-style-type:disc}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-\[minmax\(10rem\,15rem\)_minmax\(0\,1fr\)\]{grid-template-columns:minmax(10rem,15rem) minmax(0,1fr)}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.gap-x-3{-moz-column-gap:.75rem;column-gap:.75rem}.gap-x-6{-moz-column-gap:1.5rem;column-gap:1.5rem}.gap-y-1{row-gap:.25rem}.gap-y-2{row-gap:.5rem}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.self-center{align-self:center}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.break-all{word-break:break-all}.rounded{border-radius:var(--sc-rounded)}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:var(--sc-rounded-lg)}.rounded-md{border-radius:var(--sc-rounded-md)}.border{border-width:var(--sc-border-width)}.border-0{border-width:0px}.border-b{border-bottom-width:var(--sc-border-width)}.border-b-\[\.18rem\]{border-bottom-width:.18rem}.border-t{border-top-width:var(--sc-border-width)}.border-dashed{border-style:dashed}.border-dotted{border-style:dotted}.border-current{border-color:currentColor}.border-danger{border-color:var(--sc-danger)}.border-info{border-color:var(--sc-info)}.border-neutral-200{border-color:var(--sc-base-200)}.border-neutral-300{border-color:var(--sc-base-300)}.border-success{border-color:var(--sc-success)}.bg-base{background-color:var(--sc-base)}.bg-info{background-color:var(--sc-info)}.bg-neutral-0{background-color:var(--sc-base)}.bg-neutral-100{background-color:var(--sc-base-100)}.bg-neutral-200{background-color:var(--sc-base-200)}.bg-neutral-50{background-color:var(--sc-base-50)}.bg-success{background-color:var(--sc-success)}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.from-\[rgba\(0\,0\,10\,\.2\)\]{--tw-gradient-from: rgba(0,0,10,.2) var(--tw-gradient-from-position);--tw-gradient-to: rgba(0, 0, 10, 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pb-3{padding-bottom:.75rem}.pl-5{padding-left:1.25rem}.pl-\[\.75rem\]{padding-left:.75rem}.pt-3{padding-top:.75rem}.pt-\[20vh\]{padding-top:20vh}.text-center{text-align:center}.font-headings{font-family:var(--sc-headings-font-family, var(--sc-font-family-base, sans-serif))}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-sm{font-size:.875rem}.text-xl{font-size:1.25rem}.text-xs{font-size:.75rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.italic{font-style:italic}.tabular-nums{--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.leading-\[1\.5\]{line-height:1.5}.leading-none{line-height:1}.leading-tight{line-height:1.25}.tracking-wide{letter-spacing:.025em}.text-base{color:var(--sc-base)}.text-content{color:var(--sc-base-content)}.text-contrast-content{color:var(--sc-contrast-content)}.text-danger{color:var(--sc-danger)}.text-info{color:var(--sc-info)}.text-neutral-0{color:var(--sc-base)}.text-neutral-300{color:var(--sc-base-300)}.text-neutral-400{color:var(--sc-base-400)}.text-neutral-500{color:var(--sc-base-500)}.text-neutral-600{color:var(--sc-base-600)}.text-neutral-700{color:var(--sc-base-700)}.text-neutral-900{color:var(--sc-base-900)}.text-success{color:var(--sc-success)}.underline{text-decoration-line:underline}.opacity-40{opacity:.4}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-80{opacity:.8}.opacity-90{opacity:.9}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.outline{outline-style:solid}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow{--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / .1)) drop-shadow(0 1px 1px rgb(0 0 0 / .06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-lg{--tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / .04)) drop-shadow(0 4px 3px rgb(0 0 0 / .1));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.invert{--tw-invert: invert(100%);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}@font-face{font-family:ClashGrotesk-Variable;src:url(../fonts/ClashGrotesk-Variable.woff2) format("woff2"),url(../fonts/ClashGrotesk-Variable.woff) format("woff"),url(../fonts/ClashGrotesk-Variable.ttf) format("truetype");font-weight:200 700;font-display:swap;font-style:normal}:root{--sc-headings-font-family: "ClashGrotesk-Variable", sans-serif;--sc-font-family-base: "ClashGrotesk-Variable", sans-serif;--sc-headings-font-weight: 400;--sc-rounded: .5rem;--sc-border-width: max(2px, .18rem)}[data-concorde-theme=light]{--sc-base: #fffcf0;--sc-base-content: #111111;--sc-primary: #111111;--sc-primary-content: #fffcf0;--sc-base-50: #f4f1e6;--sc-base-100: #e9e6dc;--sc-base-200: #ceccc3;--sc-base-300: #bcbab1;--sc-base-400: #96948e;--sc-base-500: #7d7c77;--sc-base-600: #5a5956;--sc-base-700: #393937;--sc-base-800: #252524;--sc-base-900: #111111;--sc-info: #3b82f6;--sc-info-content: #ffffff;--sc-success: #10b981;--sc-success-content: #ffffff;--sc-warning: #fb923c;--sc-warning-content: #111827;--sc-danger: #dc2626;--sc-danger-content: #ffffff}[data-concorde-theme=dark]{--sc-base: #0a0a0a;--sc-base-content: #dadad9;--sc-primary: #ffef8a;--sc-primary-content: #111827;--sc-base-50: #141414;--sc-base-100: #1c1c1c;--sc-base-200: #2f2f2f;--sc-base-300: #3e3e3e;--sc-base-400: #5f5f5f;--sc-base-500: #767676;--sc-base-600: #9a9a9a;--sc-base-700: #c0c0bf;--sc-base-800: #dadad9;--sc-base-900: #f5f5f4;--sc-info: #3a85f7;--sc-info-content: #ffffff;--sc-success: #0fba7f;--sc-success-content: #ffffff;--sc-warning: #fc8f3b;--sc-warning-content: #111827;--sc-danger: #dd2528;--sc-danger-content: #ffffff}[data-concorde-theme=light],[data-concorde-theme=dark]{--sc-input-bg: var(--sc-base-100);--sc-input-border-color: var(--sc-base-100)}html{font-family:var(--sc-font-family-base, sans-serif)}p,ul,ol{font-family:Arial,Helvetica,sans-serif}body{background:var(--sc-base);color:var(--sc-base-content)}html{scroll-behavior:smooth}.animated-text{display:block;position:relative;overflow:hidden}.animated-text span{display:block;position:absolute;width:100%;height:100%;top:0;left:0;transform:translateY(108%);animation:slideUp 4.5s cubic-bezier(.17,.67,.61,1.13) infinite}.animated-text span:nth-child(2){animation-delay:1.5s}.animated-text span:nth-child(3){animation-delay:3s}@keyframes slideUp{0%{transform:translateY(108%)}7%{transform:translateY(0)}33%{transform:translateY(0)}40%{transform:translateY(-108%)}to{transform:translateY(-108%)}}.custom-scroll{overflow:auto!important}.custom-scroll:hover::-webkit-scrollbar-thumb{box-shadow:inset 0 0 2rem 2rem var(--sc-base-900)}.custom-scroll::-webkit-scrollbar{width:.5rem;height:.5rem;border:solid .15rem transparent;border-radius:var(--sc-rounded);background:transparent}.custom-scroll::-webkit-scrollbar-thumb{opacity:0;-webkit-transition:box-shadow .2s;transition:box-shadow .2s;border:solid .15rem transparent}p{text-wrap:pretty}.prose :where(code):not(:where(pre *)){box-decoration-break:clone;white-space:nowrap;display:inline-block;padding:0 .25rem;font-size:.75em;margin-inline:2px;font-weight:400!important;-webkit-box-decoration-break:clone}.hover\:bg-neutral-50:hover{background-color:var(--sc-base-50)}.prose-h1\:text-\[3\.25em\] :is(:where(h1):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:3.25em}.prose-h1\:font-normal :is(:where(h1):not(:where([class~=not-prose],[class~=not-prose] *))){font-weight:400}.prose-code\:before\:content-none :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))):before{--tw-content: none;content:var(--tw-content)}.prose-code\:after\:content-none :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))):after{--tw-content: none;content:var(--tw-content)}.prose-pre\:font-mono :is(:where(pre):not(:where([class~=not-prose],[class~=not-prose] *))){font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.prose-li\:my-\[\.2em\] :is(:where(li):not(:where([class~=not-prose],[class~=not-prose] *))){margin-top:.2em;margin-bottom:.2em}@media (min-width: 640px){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width: 768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:text-5xl{font-size:3rem}}@media (min-width: 1024px){.lg\:block{display:block}.lg\:hidden{display:none}.lg\:w-\[19rem\]{width:19rem}.lg\:max-w-\[19ch\]{max-width:19ch}.lg\:max-w-\[35rem\]{max-width:35rem}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:flex-row{flex-direction:row}.lg\:items-center{align-items:center}.lg\:px-20{padding-left:5rem;padding-right:5rem}.lg\:text-7xl{font-size:4.5rem}.lg\:leading-\[1\.5\]{line-height:1.5}}@media (min-width: 1280px){.xl\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xl\:text-8xl{font-size:6rem}}.dark\:block:where(.dark,.dark *){display:block}.dark\:hidden:where(.dark,.dark *){display:none}.dark\:border-neutral-600:where(.dark,.dark *){border-color:var(--sc-base-600)}.dark\:border-neutral-700:where(.dark,.dark *){border-color:var(--sc-base-700)}.dark\:bg-neutral-300:where(.dark,.dark *){background-color:var(--sc-base-300)}.dark\:text-neutral-400:where(.dark,.dark *){color:var(--sc-base-400)}.dark\:text-neutral-600:where(.dark,.dark *){color:var(--sc-base-600)}.dark\:opacity-60:where(.dark,.dark *){opacity:.6}.\[\&\[active\]\]\:min-w-\[13rem\][active]{min-width:13rem}.\[\&\[active\]\]\:rounded-full[active]{border-radius:9999px}.\[\&\[active\]\]\:bg-danger[active]{background-color:var(--sc-danger)}.\[\&\[active\]\]\:font-black[active]{font-weight:900}.\[\&\[active\]\]\:text-danger-content[active]{color:var(--sc-danger-content)}.\[\&\[active\]\]\:text-success[active]{color:var(--sc-success)}[data-home] .\[\[data-home\]_\&\]\:hidden{display:none}
|
|
@@ -1,131 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/theme/theme.html" data-doc-id="core/components/ui/theme/theme">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<title>Theme — Concorde</title>
|
|
7
|
-
<meta name="description" content="sonic-theme wraps a Concorde UI: it registers --sc-* design tokens and provides the default slot for your app. With no theme attribute (or theme="custom"), only shared primitives and your overrides ap">
|
|
8
|
-
<meta name="keywords" content="Concorde, supersoniks, core/components/ui/theme/theme, theme, Theme, UI component, sonic-theme, web component, --sc-*, theme="custom", light, dark, auto, color, font, bg-base">
|
|
9
|
-
<meta name="concorde-doc-id" content="core/components/ui/theme/theme">
|
|
10
|
-
<link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/theme/theme.html">
|
|
11
|
-
</head>
|
|
12
|
-
<body>
|
|
13
|
-
<header>
|
|
14
|
-
<p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/theme/theme.md/theme" rel="nofollow">interactive version</a></p>
|
|
15
|
-
</header>
|
|
16
|
-
<main>
|
|
17
|
-
<article>
|
|
18
|
-
<p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Theme</strong>. sonic-theme wraps a Concorde UI: it registers --sc-* design tokens and provides the default slot for your app. With no theme attribute (or theme="custom"), only shared primitives and your overrides ap <span>Doc ID: <code>core/components/ui/theme/theme</code>. Keywords: Concorde, supersoniks, core/components/ui/theme/theme, theme, Theme, UI component, sonic-theme, web component, --sc-*, theme="custom", light, dark, auto, color, font, bg-base. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/theme/theme.html">https://concorde.supersoniks.org/crawl/core/components/ui/theme/theme.html</a>.</span></p>
|
|
19
|
-
<h1 id="theme">Theme</h1>
|
|
20
|
-
<p><strong><code>sonic-theme</code></strong> wraps a Concorde UI: it registers <strong><code>--sc-*</code></strong> design tokens and provides the default slot for your app. With no <strong><code>theme</code></strong> attribute (or <strong><code>theme="custom"</code></strong>), only shared primitives and your overrides apply—built-in <strong><code>light</code></strong> / <strong><code>dark</code></strong> / <strong><code>auto</code></strong> palettes are opt-in. Set <strong><code>color</code></strong> and <strong><code>font</code></strong> when the host should carry base text and typography; add Tailwind <strong><code>bg-base</code></strong> and <strong><code>block</code></strong> (or <strong><code>min-h-screen</code></strong>) on the tag for a full surface fill. <strong>Popovers</strong>, <strong>modals</strong>, and <strong>toasts</strong> mount under the nearest connected theme (see <a href="#pop-container">Pop container</a>). Import <strong><code>@supersoniks/concorde/theme</code></strong> once at the app entry. For the full public token list and brand overrides, see <a href="../../../../docs/_getting-started/theming.html#theming">Customization</a>.</p>
|
|
21
|
-
<h2 id="basic-example">Basic example</h2>
|
|
22
|
-
<p>Wrap interactive components so tokens and overlays resolve from one root.</p>
|
|
23
|
-
<pre><code><sonic-theme color font class="block bg-base p-6 rounded-lg">
|
|
24
|
-
<sonic-button type="primary">Save changes</sonic-button>
|
|
25
|
-
</sonic-theme>
|
|
26
|
-
</code></pre>
|
|
27
|
-
<h2 id="theme-mode">Theme mode</h2>
|
|
28
|
-
<p><strong>Default:</strong> omit <strong><code>theme</code></strong> or set <strong><code>theme="custom"</code></strong>. The host loads core tokens (<code>--sc-rounded</code>, shadows, form defaults, …) and any <strong><code>--sc-*</code></strong> you set; it does <strong>not</strong> apply the built-in light or dark palette.</p>
|
|
29
|
-
<p>Set <strong><code>theme</code></strong> to <strong><code>light</code></strong> or <strong><code>dark</code></strong> for Concorde’s preset palettes. Set <strong><code>theme="auto"</code></strong> to follow <strong><code>prefers-color-scheme</code></strong> (light palette until the OS prefers dark).</p>
|
|
30
|
-
<pre><code><div class="grid gap-4 md:grid-cols-2">
|
|
31
|
-
<sonic-theme theme="light" color font class="block bg-base p-4 rounded-md border border-neutral-200">
|
|
32
|
-
<p class="text-sm mb-3 opacity-80">theme="light"</p>
|
|
33
|
-
<div class="flex flex-wrap gap-2">
|
|
34
|
-
<sonic-badge type="primary">Primary</sonic-badge>
|
|
35
|
-
<sonic-badge type="success">Success</sonic-badge>
|
|
36
|
-
<sonic-badge type="danger">Danger</sonic-badge>
|
|
37
|
-
</div>
|
|
38
|
-
</sonic-theme>
|
|
39
|
-
<sonic-theme theme="dark" color font class="block bg-base p-4 rounded-md">
|
|
40
|
-
<p class="text-sm mb-3 opacity-80">theme="dark"</p>
|
|
41
|
-
<div class="flex flex-wrap gap-2">
|
|
42
|
-
<sonic-badge type="primary">Primary</sonic-badge>
|
|
43
|
-
<sonic-badge type="success">Success</sonic-badge>
|
|
44
|
-
<sonic-badge type="danger">Danger</sonic-badge>
|
|
45
|
-
</div>
|
|
46
|
-
</sonic-theme>
|
|
47
|
-
</div>
|
|
48
|
-
</code></pre>
|
|
49
|
-
<h2 id="presentation">Presentation</h2>
|
|
50
|
-
<p><strong><code>color</code></strong> sets text from <strong><code>--sc-base-content</code></strong>. <strong><code>font</code></strong> applies <strong><code>--sc-font-family-base</code></strong>, <strong><code>--sc-font-weight-base</code></strong>, and <strong><code>--sc-font-style-base</code></strong>. For the page or shell background, use <strong><code>bg-base</code></strong> on <strong><code>sonic-theme</code></strong> (maps to <strong><code>--sc-base</code></strong> in Tailwind) with <strong><code>block</code></strong> so the host paints the surface. Components keep their own fallbacks when <strong><code>color</code></strong> / <strong><code>font</code></strong> are omitted.</p>
|
|
51
|
-
<pre><code><sonic-theme theme="light" color font class="block bg-base p-6 min-h-[8rem] rounded-lg">
|
|
52
|
-
<p>Body copy inherits base content color and font from the theme host.</p>
|
|
53
|
-
</sonic-theme>
|
|
54
|
-
</code></pre>
|
|
55
|
-
<h2 id="custom-tokens">Custom tokens</h2>
|
|
56
|
-
<p>Override <strong>primitives</strong> on <strong><code>sonic-theme</code></strong> (or <strong><code>:root</code></strong> / a project stylesheet). Derived radii, shadows, and control rounding are computed from tokens such as <strong><code>--sc-rounded</code></strong>—avoid copying long lists of internal variables unless you have a specific need.</p>
|
|
57
|
-
<pre><code><sonic-theme
|
|
58
|
-
theme="custom"
|
|
59
|
-
color
|
|
60
|
-
font
|
|
61
|
-
class="block bg-base p-6 rounded-lg"
|
|
62
|
-
style="--sc-primary: #353429; --sc-rounded: 0.25rem;"
|
|
63
|
-
>
|
|
64
|
-
<sonic-button type="primary">Brand primary</sonic-button>
|
|
65
|
-
</sonic-theme>
|
|
66
|
-
</code></pre>
|
|
67
|
-
<h2 id="pop-container">Pop container</h2>
|
|
68
|
-
<p><strong><code>Theme.getPopContainer()</code></strong> returns the last connected <strong><code>sonic-theme</code></strong>, or <strong><code>document.body</code></strong> if none is connected. When a theme disconnects, the previous connected instance is adopted. Imperative <strong><code>Modal.create()</code></strong> and declarative <strong><code>sonic-modal</code></strong> use the same container.</p>
|
|
69
|
-
<pre><code><sonic-theme theme="light" color font class="block bg-base p-4 rounded-lg">
|
|
70
|
-
<sonic-button onclick="document.getElementById('themePopModal').show()">
|
|
71
|
-
Open modal
|
|
72
|
-
</sonic-button>
|
|
73
|
-
<sonic-modal id="themePopModal">
|
|
74
|
-
<sonic-modal-title>Mounted on theme</sonic-modal-title>
|
|
75
|
-
<sonic-modal-content>
|
|
76
|
-
This dialog is appended under the nearest sonic-theme pop container.
|
|
77
|
-
</sonic-modal-content>
|
|
78
|
-
<sonic-modal-actions>
|
|
79
|
-
<sonic-button hideModal>Close</sonic-button>
|
|
80
|
-
</sonic-modal-actions>
|
|
81
|
-
</sonic-modal>
|
|
82
|
-
</sonic-theme>
|
|
83
|
-
</code></pre>
|
|
84
|
-
<h2 id="embedded-iframes">Embedded iframes</h2>
|
|
85
|
-
<p>On connect, the theme publishes resolved <strong><code>--sc-*</code></strong> values and linked font stylesheet URLs (Google Fonts / Adobe Fonts) to the <strong><code>sonic-theme</code></strong> data channel and **<code>postMessage</code>**s them to same-page iframes. Iframes can request a refresh by posting <strong><code>{ type: "GetSonicTheme" }</code></strong>.</p>
|
|
86
|
-
<pre><code class="language-javascript">// Inside the iframe — ask the parent theme to rebroadcast tokens
|
|
87
|
-
window.parent.postMessage({ type: "GetSonicTheme" }, "*");
|
|
88
|
-
</code></pre>
|
|
89
|
-
<h2 id="api-reference">API reference</h2>
|
|
90
|
-
<table>
|
|
91
|
-
<thead>
|
|
92
|
-
<tr>
|
|
93
|
-
<th>Attribute</th>
|
|
94
|
-
<th>Values</th>
|
|
95
|
-
<th>Description</th>
|
|
96
|
-
</tr>
|
|
97
|
-
</thead>
|
|
98
|
-
<tbody><tr>
|
|
99
|
-
<td><code>theme</code></td>
|
|
100
|
-
<td>omitted · <code>custom</code> (default) · <code>light</code> · <code>dark</code> · <code>auto</code></td>
|
|
101
|
-
<td>Omitted or <code>custom</code>: core tokens and your <code>--sc-*</code> only. <code>light</code> / <code>dark</code>: fixed presets. <code>auto</code>: presets follow <code>prefers-color-scheme</code></td>
|
|
102
|
-
</tr>
|
|
103
|
-
<tr>
|
|
104
|
-
<td><code>color</code></td>
|
|
105
|
-
<td>boolean</td>
|
|
106
|
-
<td>Host text color uses <code>--sc-base-content</code></td>
|
|
107
|
-
</tr>
|
|
108
|
-
<tr>
|
|
109
|
-
<td><code>font</code></td>
|
|
110
|
-
<td>boolean</td>
|
|
111
|
-
<td>Host font uses <code>--sc-font-family-base</code> and related base weight/style tokens</td>
|
|
112
|
-
</tr>
|
|
113
|
-
</tbody></table>
|
|
114
|
-
<table>
|
|
115
|
-
<thead>
|
|
116
|
-
<tr>
|
|
117
|
-
<th>Slot</th>
|
|
118
|
-
<th>Description</th>
|
|
119
|
-
</tr>
|
|
120
|
-
</thead>
|
|
121
|
-
<tbody><tr>
|
|
122
|
-
<td><em>(default)</em></td>
|
|
123
|
-
<td>Application markup and Concorde components</td>
|
|
124
|
-
</tr>
|
|
125
|
-
</tbody></table>
|
|
126
|
-
<p>Surface background: Tailwind <strong><code>bg-base</code></strong> on <strong><code>sonic-theme</code></strong> (requires Concorde Tailwind color <strong><code>base</code></strong> → <strong><code>--sc-base</code></strong>).</p>
|
|
127
|
-
|
|
128
|
-
</article>
|
|
129
|
-
</main>
|
|
130
|
-
</body>
|
|
131
|
-
</html>
|
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
# Theme
|
|
2
|
-
|
|
3
|
-
**`sonic-theme`** wraps a Concorde UI: it registers **`--sc-*`** design tokens and provides the default slot for your app. With no **`theme`** attribute (or **`theme="custom"`**), only shared primitives and your overrides apply—built-in **`light`** / **`dark`** / **`auto`** palettes are opt-in. Set **`color`** and **`font`** when the host should carry base text and typography; add Tailwind **`bg-base`** and **`block`** (or **`min-h-screen`**) on the tag for a full surface fill. **Popovers**, **modals**, and **toasts** mount under the nearest connected theme (see [Pop container](#pop-container)). Import **`@supersoniks/concorde/theme`** once at the app entry. For the full public token list and brand overrides, see [Customization](#docs/_getting-started/theming.md/theming).
|
|
4
|
-
|
|
5
|
-
## Basic example
|
|
6
|
-
|
|
7
|
-
Wrap interactive components so tokens and overlays resolve from one root.
|
|
8
|
-
|
|
9
|
-
<sonic-code>
|
|
10
|
-
<template>
|
|
11
|
-
<sonic-theme color font class="block bg-base p-6 rounded-lg">
|
|
12
|
-
<sonic-button type="primary">Save changes</sonic-button>
|
|
13
|
-
</sonic-theme>
|
|
14
|
-
</template>
|
|
15
|
-
</sonic-code>
|
|
16
|
-
|
|
17
|
-
## Theme mode
|
|
18
|
-
|
|
19
|
-
**Default:** omit **`theme`** or set **`theme="custom"`**. The host loads core tokens (`--sc-rounded`, shadows, form defaults, …) and any **`--sc-*`** you set; it does **not** apply the built-in light or dark palette.
|
|
20
|
-
|
|
21
|
-
Set **`theme`** to **`light`** or **`dark`** for Concorde’s preset palettes. Set **`theme="auto"`** to follow **`prefers-color-scheme`** (light palette until the OS prefers dark).
|
|
22
|
-
|
|
23
|
-
<sonic-code>
|
|
24
|
-
<template>
|
|
25
|
-
<div class="grid gap-4 md:grid-cols-2">
|
|
26
|
-
<sonic-theme theme="light" color font class="block bg-base p-4 rounded-md border border-neutral-200">
|
|
27
|
-
<p class="text-sm mb-3 opacity-80">theme="light"</p>
|
|
28
|
-
<div class="flex flex-wrap gap-2">
|
|
29
|
-
<sonic-badge type="primary">Primary</sonic-badge>
|
|
30
|
-
<sonic-badge type="success">Success</sonic-badge>
|
|
31
|
-
<sonic-badge type="danger">Danger</sonic-badge>
|
|
32
|
-
</div>
|
|
33
|
-
</sonic-theme>
|
|
34
|
-
<sonic-theme theme="dark" color font class="block bg-base p-4 rounded-md">
|
|
35
|
-
<p class="text-sm mb-3 opacity-80">theme="dark"</p>
|
|
36
|
-
<div class="flex flex-wrap gap-2">
|
|
37
|
-
<sonic-badge type="primary">Primary</sonic-badge>
|
|
38
|
-
<sonic-badge type="success">Success</sonic-badge>
|
|
39
|
-
<sonic-badge type="danger">Danger</sonic-badge>
|
|
40
|
-
</div>
|
|
41
|
-
</sonic-theme>
|
|
42
|
-
</div>
|
|
43
|
-
</template>
|
|
44
|
-
</sonic-code>
|
|
45
|
-
|
|
46
|
-
## Presentation
|
|
47
|
-
|
|
48
|
-
**`color`** sets text from **`--sc-base-content`**. **`font`** applies **`--sc-font-family-base`**, **`--sc-font-weight-base`**, and **`--sc-font-style-base`**. For the page or shell background, use **`bg-base`** on **`sonic-theme`** (maps to **`--sc-base`** in Tailwind) with **`block`** so the host paints the surface. Components keep their own fallbacks when **`color`** / **`font`** are omitted.
|
|
49
|
-
|
|
50
|
-
<sonic-code>
|
|
51
|
-
<template>
|
|
52
|
-
<sonic-theme theme="light" color font class="block bg-base p-6 min-h-[8rem] rounded-lg">
|
|
53
|
-
<p>Body copy inherits base content color and font from the theme host.</p>
|
|
54
|
-
</sonic-theme>
|
|
55
|
-
</template>
|
|
56
|
-
</sonic-code>
|
|
57
|
-
|
|
58
|
-
## Custom tokens
|
|
59
|
-
|
|
60
|
-
Override **primitives** on **`sonic-theme`** (or **`:root`** / a project stylesheet). Derived radii, shadows, and control rounding are computed from tokens such as **`--sc-rounded`**—avoid copying long lists of internal variables unless you have a specific need.
|
|
61
|
-
|
|
62
|
-
<sonic-code>
|
|
63
|
-
<template>
|
|
64
|
-
<sonic-theme
|
|
65
|
-
theme="custom"
|
|
66
|
-
color
|
|
67
|
-
font
|
|
68
|
-
class="block bg-base p-6 rounded-lg"
|
|
69
|
-
style="--sc-primary: #353429; --sc-rounded: 0.25rem;"
|
|
70
|
-
>
|
|
71
|
-
<sonic-button type="primary">Brand primary</sonic-button>
|
|
72
|
-
</sonic-theme>
|
|
73
|
-
</template>
|
|
74
|
-
</sonic-code>
|
|
75
|
-
|
|
76
|
-
## Pop container
|
|
77
|
-
|
|
78
|
-
**`Theme.getPopContainer()`** returns the last connected **`sonic-theme`**, or **`document.body`** if none is connected. When a theme disconnects, the previous connected instance is adopted. Imperative **`Modal.create()`** and declarative **`sonic-modal`** use the same container.
|
|
79
|
-
|
|
80
|
-
<sonic-code>
|
|
81
|
-
<template>
|
|
82
|
-
<sonic-theme theme="light" color font class="block bg-base p-4 rounded-lg">
|
|
83
|
-
<sonic-button onclick="document.getElementById('themePopModal').show()">
|
|
84
|
-
Open modal
|
|
85
|
-
</sonic-button>
|
|
86
|
-
<sonic-modal id="themePopModal">
|
|
87
|
-
<sonic-modal-title>Mounted on theme</sonic-modal-title>
|
|
88
|
-
<sonic-modal-content>
|
|
89
|
-
This dialog is appended under the nearest sonic-theme pop container.
|
|
90
|
-
</sonic-modal-content>
|
|
91
|
-
<sonic-modal-actions>
|
|
92
|
-
<sonic-button hideModal>Close</sonic-button>
|
|
93
|
-
</sonic-modal-actions>
|
|
94
|
-
</sonic-modal>
|
|
95
|
-
</sonic-theme>
|
|
96
|
-
</template>
|
|
97
|
-
</sonic-code>
|
|
98
|
-
|
|
99
|
-
## Embedded iframes
|
|
100
|
-
|
|
101
|
-
On connect, the theme publishes resolved **`--sc-*`** values and linked font stylesheet URLs (Google Fonts / Adobe Fonts) to the **`sonic-theme`** data channel and **`postMessage`**s them to same-page iframes. Iframes can request a refresh by posting **`{ type: "GetSonicTheme" }`**.
|
|
102
|
-
|
|
103
|
-
<sonic-code language="javascript">
|
|
104
|
-
<template>
|
|
105
|
-
// Inside the iframe — ask the parent theme to rebroadcast tokens
|
|
106
|
-
window.parent.postMessage({ type: "GetSonicTheme" }, "*");
|
|
107
|
-
</template>
|
|
108
|
-
</sonic-code>
|
|
109
|
-
|
|
110
|
-
## API reference
|
|
111
|
-
|
|
112
|
-
| Attribute | Values | Description |
|
|
113
|
-
|----------|---------|-------------|
|
|
114
|
-
| `theme` | omitted · `custom` (default) · `light` · `dark` · `auto` | Omitted or `custom`: core tokens and your `--sc-*` only. `light` / `dark`: fixed presets. `auto`: presets follow `prefers-color-scheme` |
|
|
115
|
-
| `color` | boolean | Host text color uses `--sc-base-content` |
|
|
116
|
-
| `font` | boolean | Host font uses `--sc-font-family-base` and related base weight/style tokens |
|
|
117
|
-
|
|
118
|
-
| Slot | Description |
|
|
119
|
-
|------|-------------|
|
|
120
|
-
| *(default)* | Application markup and Concorde components |
|
|
121
|
-
|
|
122
|
-
Surface background: Tailwind **`bg-base`** on **`sonic-theme`** (requires Concorde Tailwind color **`base`** → **`--sc-base`**).
|