@apple-pie/slice 0.1.10 → 0.1.12
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 +96 -176
- package/dist/cjs/chunks/{Avatar-Czt-12Ih.js → Avatar-CUaQ3kN1.js} +5 -5
- package/dist/cjs/chunks/{AvatarGroup-CGH2zY7a.js → AvatarGroup-B3M7o4Hh.js} +23 -20
- package/dist/cjs/chunks/{Button-mVVfNCqC.js → Button-DXvjvGtY.js} +12 -11
- package/dist/cjs/chunks/{ButtonBar-CFAb4bfQ.js → ButtonBar-BZ6sme27.js} +7 -7
- package/dist/cjs/chunks/{Camera-BGV_tNUP.js → Camera-rVC4KI4v.js} +1 -1
- package/dist/cjs/chunks/{CheckBox-DyOgP15i.js → CheckBox-DQRLqTAK.js} +1 -1
- package/dist/cjs/chunks/{Chip-Z8erRdWG.js → Chip-Pv9-KTnh.js} +11 -10
- package/dist/cjs/chunks/{DivInput-DdZA8S1k.js → DivInput-DO3Dgbjp.js} +4 -4
- package/dist/cjs/chunks/{DropDown-Ce8aU2va.js → DropDown-C3AZ5b_b.js} +49 -50
- package/dist/cjs/chunks/{ErrorSummary-By4CjJ9a.js → ErrorSummary-BTgAd3sK.js} +47 -25
- package/dist/cjs/chunks/{FileList-CCAtVNDo.js → FileList-BHwBIics.js} +4 -4
- package/dist/cjs/chunks/{Grouper-BbovOSYw.js → Grouper-D4yyHHkM.js} +1 -1
- package/dist/cjs/chunks/{Icon-N0YJuKQf.js → Icon-D1EB8S5r.js} +6 -5
- package/dist/cjs/chunks/{IconButton-BXotgG2u.js → IconButton-B07Ttxbr.js} +11 -11
- package/dist/cjs/chunks/Label-CTzvGcds.js +102 -0
- package/dist/cjs/chunks/{Pager-Da9AqSFN.js → Pager-BN37VYEC.js} +1 -1
- package/dist/cjs/chunks/{ProgressIndicator-CyFcr6Dk.js → ProgressIndicator-BGqIwycX.js} +1 -1
- package/dist/cjs/chunks/{PromptInput-D317oh1e.js → PromptInput-z6TuhHsG.js} +1 -1
- package/dist/cjs/chunks/{RadioButton-B8GIKGm-.js → RadioButton-DuIsM4lu.js} +21 -17
- package/dist/cjs/chunks/{RadioButtonList-3o1IvhdC.js → RadioButtonList-bu11ILyw.js} +20 -13
- package/dist/cjs/chunks/{Switch-BiTshVLM.js → Switch-Cbn0ql3B.js} +15 -11
- package/dist/cjs/chunks/{TabBar-DZ2y7owf.js → TabBar-Bcq_n4Mk.js} +8 -8
- package/dist/cjs/chunks/{TextArea-2w4E6d2H.js → TextArea-BSKbDOEt.js} +17 -24
- package/dist/cjs/chunks/{TextField-BAcYBHb1.js → TextField-BNacOZVx.js} +50 -70
- package/dist/cjs/chunks/{Tip-59T3TUN4.js → Tip-DAxoyMyA.js} +7 -6
- package/dist/cjs/chunks/{Toast-skIBuJ3b.js → Toast-CZzAWG0S.js} +1 -1
- package/dist/cjs/chunks/{UploadArea-CxYAAs7Q.js → UploadArea-CKuE4rtg.js} +6 -6
- package/dist/cjs/chunks/{localDBStore-BHEk_9fJ.js → localDBStore-zyDhaEiP.js} +42 -10
- package/dist/cjs/components/Avatar/index.js +1 -1
- package/dist/cjs/components/AvatarGroup/index.js +2 -2
- package/dist/cjs/components/Button/index.js +3 -3
- package/dist/cjs/components/ButtonBar/index.js +2 -2
- package/dist/cjs/components/Camera/index.js +3 -3
- package/dist/cjs/components/CheckBox/index.js +2 -2
- package/dist/cjs/components/Chip/index.js +2 -2
- package/dist/cjs/components/DivInput/index.js +1 -1
- package/dist/cjs/components/DropDown/index.js +2 -2
- package/dist/cjs/components/ErrorSummary/index.js +6 -2
- package/dist/cjs/components/FileList/index.js +3 -3
- package/dist/cjs/components/Grouper/index.js +2 -2
- package/dist/cjs/components/Icon/index.js +1 -1
- package/dist/cjs/components/IconButton/index.js +2 -2
- package/dist/cjs/components/Label/index.js +7 -5
- package/dist/cjs/components/Pager/index.js +1 -1
- package/dist/cjs/components/Progress/index.js +2 -2
- package/dist/cjs/components/PromptInput/index.js +5 -5
- package/dist/cjs/components/RadioButton/index.js +2 -2
- package/dist/cjs/components/RadioButtonList/index.js +3 -3
- package/dist/cjs/components/Switch/index.js +1 -1
- package/dist/cjs/components/TabBar/index.js +3 -3
- package/dist/cjs/components/TextArea/index.js +4 -4
- package/dist/cjs/components/Textfield/index.js +5 -6
- package/dist/cjs/components/Tip/index.js +1 -1
- package/dist/cjs/components/Toast/index.js +2 -2
- package/dist/cjs/components/UploadArea/index.js +8 -7
- package/dist/cjs/hooks/useObserveTheme.js +5 -5
- package/dist/cjs/hooks/useTheme.js +2 -2
- package/dist/cjs/index.js +8 -3
- package/dist/cjs/providers/ThemeProvider.js +12 -9
- package/dist/cjs/providers.js +4 -3
- package/dist/cjs/stores/LocalDB.js +1 -1
- package/dist/cjs/stores.js +1 -1
- package/dist/esm/chunks/{Avatar-DCCbj2eA.mjs → Avatar-CSLVUF_y.mjs} +5 -5
- package/dist/esm/chunks/{AvatarGroup-BaD2Xmda.mjs → AvatarGroup--ELW-bO1.mjs} +23 -20
- package/dist/esm/chunks/{Button-m0XAJsq5.mjs → Button-daLv0i7S.mjs} +13 -12
- package/dist/esm/chunks/{ButtonBar-CNQHRn77.mjs → ButtonBar-DXK8meQq.mjs} +7 -7
- package/dist/esm/chunks/{Camera-7TuowjX_.mjs → Camera-BqmVsVKy.mjs} +2 -2
- package/dist/esm/chunks/{CheckBox-DO9hTdv8.mjs → CheckBox-BsaYFNC6.mjs} +1 -1
- package/dist/esm/chunks/{Chip-BqneFUOR.mjs → Chip-BRZeD1OX.mjs} +11 -10
- package/dist/esm/chunks/{DivInput-Ch9XjfWd.mjs → DivInput-DeSpC8Wm.mjs} +4 -4
- package/dist/esm/chunks/{DropDown-Cvf2d_3u.mjs → DropDown-DOJvg96J.mjs} +48 -51
- package/dist/esm/chunks/{ErrorSummary-S0shes-m.mjs → ErrorSummary-CHLkvdHk.mjs} +52 -27
- package/dist/esm/chunks/{FileList-Ckix8gUY.mjs → FileList-5LElsgoE.mjs} +5 -5
- package/dist/esm/chunks/{Grouper-B_FutfjV.mjs → Grouper-DR14qDXP.mjs} +1 -1
- package/dist/esm/chunks/{Icon-C92f63Ib.mjs → Icon-CUSQtytG.mjs} +6 -5
- package/dist/esm/chunks/{IconButton-4O5S9S9G.mjs → IconButton-DG69Vlhj.mjs} +11 -11
- package/dist/esm/chunks/Label-CRsE7o3D.mjs +115 -0
- package/dist/esm/chunks/{Pager-BlLYeA2F.mjs → Pager-BYT7_mCb.mjs} +1 -1
- package/dist/esm/chunks/{ProgressIndicator-CfM2c4ty.mjs → ProgressIndicator-D7paCpgY.mjs} +1 -1
- package/dist/esm/chunks/{PromptInput-C6liKbFf.mjs → PromptInput-CpxUcInZ.mjs} +3 -3
- package/dist/esm/chunks/{RadioButton-COEnChNW.mjs → RadioButton-B5ZF5oJ_.mjs} +22 -18
- package/dist/esm/chunks/{RadioButtonList-De3rbLQb.mjs → RadioButtonList-D9ZAZgkK.mjs} +22 -13
- package/dist/esm/chunks/{Switch-Cv6LABsW.mjs → Switch-BhCOo5Lu.mjs} +15 -11
- package/dist/esm/chunks/{TabBar-qiozE5zA.mjs → TabBar-BK7OcjPl.mjs} +9 -9
- package/dist/esm/chunks/{TextArea-DKRF4Irr.mjs → TextArea-BmsEj6IA.mjs} +18 -25
- package/dist/esm/chunks/{TextField-CGOR6507.mjs → TextField-DWPpevsj.mjs} +54 -72
- package/dist/esm/chunks/{Tip-CroDIKO4.mjs → Tip-BnKB9qMi.mjs} +7 -6
- package/dist/esm/chunks/{Toast-CM493gMR.mjs → Toast-DPHLwDES.mjs} +1 -1
- package/dist/esm/chunks/{UploadArea-DNAH-Bu5.mjs → UploadArea-DPiOaNpc.mjs} +9 -9
- package/dist/esm/chunks/{localDBStore-C-Ch2MFq.mjs → localDBStore-B4jkR5Jx.mjs} +42 -10
- package/dist/esm/components/Avatar/index.mjs +1 -1
- package/dist/esm/components/AvatarGroup/index.mjs +2 -2
- package/dist/esm/components/Button/index.mjs +3 -3
- package/dist/esm/components/ButtonBar/index.mjs +2 -2
- package/dist/esm/components/Camera/index.mjs +3 -3
- package/dist/esm/components/CheckBox/index.mjs +2 -2
- package/dist/esm/components/Chip/index.mjs +2 -2
- package/dist/esm/components/DivInput/index.mjs +1 -1
- package/dist/esm/components/DropDown/index.mjs +5 -5
- package/dist/esm/components/ErrorSummary/index.mjs +21 -1
- package/dist/esm/components/FileList/index.mjs +3 -3
- package/dist/esm/components/Grouper/index.mjs +2 -2
- package/dist/esm/components/Icon/index.mjs +1 -1
- package/dist/esm/components/IconButton/index.mjs +2 -2
- package/dist/esm/components/Label/index.mjs +1 -19
- package/dist/esm/components/Pager/index.mjs +1 -1
- package/dist/esm/components/Progress/index.mjs +2 -2
- package/dist/esm/components/PromptInput/index.mjs +5 -5
- package/dist/esm/components/RadioButton/index.mjs +2 -2
- package/dist/esm/components/RadioButtonList/index.mjs +4 -4
- package/dist/esm/components/Switch/index.mjs +1 -1
- package/dist/esm/components/TabBar/index.mjs +3 -3
- package/dist/esm/components/TextArea/index.mjs +4 -4
- package/dist/esm/components/Textfield/index.mjs +7 -7
- package/dist/esm/components/Tip/index.mjs +1 -1
- package/dist/esm/components/Toast/index.mjs +2 -2
- package/dist/esm/components/UploadArea/index.mjs +7 -7
- package/dist/esm/hooks/useObserveTheme.mjs +5 -5
- package/dist/esm/hooks/useTheme.mjs +2 -2
- package/dist/esm/index.mjs +27 -27
- package/dist/esm/providers/ThemeProvider.mjs +13 -8
- package/dist/esm/providers.mjs +2 -0
- package/dist/esm/stores/LocalDB.mjs +1 -1
- package/dist/esm/stores.mjs +1 -1
- package/dist/types/components/Avatar/_types.d.ts +3 -0
- package/dist/types/components/AvatarGroup/_types.d.ts +3 -0
- package/dist/types/components/Button/Button.d.ts +6 -2
- package/dist/types/components/Button/_types.d.ts +3 -1
- package/dist/types/components/ButtonBar/_types.d.ts +4 -0
- package/dist/types/components/Chip/_types.d.ts +5 -1
- package/dist/types/components/DivInput/_types.d.ts +2 -0
- package/dist/types/components/DropDown/DropDown.d.ts +2 -3
- package/dist/types/components/DropDown/_types.d.ts +20 -14
- package/dist/types/components/ErrorSummary/ErrorSummary.d.ts +1 -2
- package/dist/types/components/ErrorSummary/_types.d.ts +7 -4
- package/dist/types/components/FileList/_types.d.ts +1 -0
- package/dist/types/components/IconButton/_types.d.ts +3 -0
- package/dist/types/components/Label/Label.d.ts +1 -1
- package/dist/types/components/Label/_types.d.ts +18 -8
- package/dist/types/components/Label/index.d.ts +1 -0
- package/dist/types/components/RadioButton/RadioButton.d.ts +1 -1
- package/dist/types/components/RadioButton/_types.d.ts +12 -11
- package/dist/types/components/RadioButtonList/RadioButtonList.d.ts +1 -1
- package/dist/types/components/RadioButtonList/_types.d.ts +8 -6
- package/dist/types/components/Switch/Switch.d.ts +1 -1
- package/dist/types/components/Switch/_types.d.ts +7 -3
- package/dist/types/components/TabBar/_types.d.ts +2 -2
- package/dist/types/components/TextArea/_types.d.ts +5 -6
- package/dist/types/components/Textfield/_types.d.ts +14 -20
- package/dist/types/components/Tip/_types.d.ts +4 -1
- package/dist/types/components/UploadArea/UploadArea.d.ts +10 -2
- package/dist/types/components/UploadArea/_types.d.ts +5 -1
- package/dist/types/components/playHelpers.d.ts +1 -1
- package/dist/types/index.d.ts +1 -0
- package/dist/types/providers/ThemeProvider.d.ts +1 -1
- package/dist/types/utils/functions/files.d.ts +1 -1
- package/package.json +1 -1
- package/dist/cjs/chunks/Label-CZvJbATa.js +0 -118
- package/dist/esm/chunks/Label-7ezP3eHw.mjs +0 -131
- package/dist/types/components/Switch/Switch.stories.d.ts +0 -5
|
@@ -22,7 +22,7 @@ import "../theme/motion.mjs";
|
|
|
22
22
|
if ("string" == typeof newTheme) if ("system" === newTheme) {
|
|
23
23
|
theme = globalThis.matchMedia("(prefers-color-scheme: dark)").matches ? darkTheme : lightTheme;
|
|
24
24
|
} else theme = newTheme === darkTheme.name ? darkTheme : lightTheme; else theme = newTheme;
|
|
25
|
-
document.documentElement.dataset.
|
|
25
|
+
document.documentElement.dataset.sliceTheme = theme.name;
|
|
26
26
|
}, []), isDark = useMemo(() => current.name === darkTheme.name, [ current ]);
|
|
27
27
|
return {
|
|
28
28
|
/**
|
|
@@ -63,7 +63,7 @@ import "../theme/motion.mjs";
|
|
|
63
63
|
*/
|
|
64
64
|
toggle: () => {
|
|
65
65
|
const newTheme = current.name === lightTheme.name ? darkTheme : lightTheme;
|
|
66
|
-
document.documentElement.dataset.
|
|
66
|
+
document.documentElement.dataset.sliceTheme = newTheme.name;
|
|
67
67
|
},
|
|
68
68
|
/**
|
|
69
69
|
* If the currently active theme is the Slice's default dark theme'
|
package/dist/esm/index.mjs
CHANGED
|
@@ -26,77 +26,77 @@ export { useWindow } from "./hooks/useWindow.mjs";
|
|
|
26
26
|
|
|
27
27
|
export { useObserveResize } from "./hooks/useObserveResize.mjs";
|
|
28
28
|
|
|
29
|
-
export { A as Avatar } from "./chunks/Avatar-
|
|
29
|
+
export { A as Avatar } from "./chunks/Avatar-CSLVUF_y.mjs";
|
|
30
30
|
|
|
31
|
-
export { A as AvatarGroup } from "./chunks/AvatarGroup-
|
|
31
|
+
export { A as AvatarGroup } from "./chunks/AvatarGroup--ELW-bO1.mjs";
|
|
32
32
|
|
|
33
33
|
export { B as Badge } from "./chunks/Badge-DyICxZP2.mjs";
|
|
34
34
|
|
|
35
|
-
export { I as IconButton } from "./chunks/IconButton-
|
|
35
|
+
export { I as IconButton } from "./chunks/IconButton-DG69Vlhj.mjs";
|
|
36
36
|
|
|
37
|
-
export { C as Camera } from "./chunks/Camera-
|
|
37
|
+
export { C as Camera } from "./chunks/Camera-BqmVsVKy.mjs";
|
|
38
38
|
|
|
39
|
-
export { C as CheckBox } from "./chunks/CheckBox-
|
|
39
|
+
export { C as CheckBox } from "./chunks/CheckBox-BsaYFNC6.mjs";
|
|
40
40
|
|
|
41
|
-
export { D as DivInput } from "./chunks/DivInput-
|
|
41
|
+
export { D as DivInput } from "./chunks/DivInput-DeSpC8Wm.mjs";
|
|
42
42
|
|
|
43
43
|
export { D as Dot } from "./chunks/Dot-CLGwQu-i.mjs";
|
|
44
44
|
|
|
45
45
|
export { D as DraggablePanel } from "./chunks/DrggablePanel-Ddi0vPRp.mjs";
|
|
46
46
|
|
|
47
|
-
export { D as DropDown } from "./chunks/DropDown-
|
|
47
|
+
export { D as DropDown } from "./chunks/DropDown-DOJvg96J.mjs";
|
|
48
48
|
|
|
49
|
-
export { E as ErrorSummary } from "./chunks/ErrorSummary-
|
|
49
|
+
export { E as ErrorSummary } from "./chunks/ErrorSummary-CHLkvdHk.mjs";
|
|
50
50
|
|
|
51
|
-
export { G as Grouper } from "./chunks/Grouper-
|
|
51
|
+
export { G as Grouper } from "./chunks/Grouper-DR14qDXP.mjs";
|
|
52
52
|
|
|
53
53
|
export { O as Overlay } from "./chunks/Overlay-TOzZXnwF.mjs";
|
|
54
54
|
|
|
55
55
|
export { F as FlexDiv } from "./chunks/FlexDiv-LGEGGrT0.mjs";
|
|
56
56
|
|
|
57
|
-
export { P as Pager } from "./chunks/Pager-
|
|
57
|
+
export { P as Pager } from "./chunks/Pager-BYT7_mCb.mjs";
|
|
58
58
|
|
|
59
|
-
export { P as PromptInput } from "./chunks/PromptInput-
|
|
59
|
+
export { P as PromptInput } from "./chunks/PromptInput-CpxUcInZ.mjs";
|
|
60
60
|
|
|
61
|
-
export { D as DoneCheck, P as ProgressIndicator } from "./chunks/ProgressIndicator-
|
|
61
|
+
export { D as DoneCheck, P as ProgressIndicator } from "./chunks/ProgressIndicator-D7paCpgY.mjs";
|
|
62
62
|
|
|
63
|
-
export { R as RadioButton } from "./chunks/RadioButton-
|
|
63
|
+
export { R as RadioButton } from "./chunks/RadioButton-B5ZF5oJ_.mjs";
|
|
64
64
|
|
|
65
|
-
export { R as RadioButtonList } from "./chunks/RadioButtonList-
|
|
65
|
+
export { R as RadioButtonList } from "./chunks/RadioButtonList-D9ZAZgkK.mjs";
|
|
66
66
|
|
|
67
67
|
export { S as Slider } from "./chunks/Slider-DL2iuNlh.mjs";
|
|
68
68
|
|
|
69
69
|
export { S as Spacer } from "./chunks/Spacer-BlgEdKEM.mjs";
|
|
70
70
|
|
|
71
|
-
export { S as Switch } from "./chunks/Switch-
|
|
71
|
+
export { S as Switch } from "./chunks/Switch-BhCOo5Lu.mjs";
|
|
72
72
|
|
|
73
|
-
export { T as TabBar } from "./chunks/TabBar-
|
|
73
|
+
export { T as TabBar } from "./chunks/TabBar-BK7OcjPl.mjs";
|
|
74
74
|
|
|
75
|
-
export { T as TextArea } from "./chunks/TextArea-
|
|
75
|
+
export { T as TextArea } from "./chunks/TextArea-BmsEj6IA.mjs";
|
|
76
76
|
|
|
77
|
-
export { T as TextField } from "./chunks/TextField-
|
|
77
|
+
export { T as TextField } from "./chunks/TextField-DWPpevsj.mjs";
|
|
78
78
|
|
|
79
79
|
export { ThemeProvider } from "./providers/ThemeProvider.mjs";
|
|
80
80
|
|
|
81
|
-
export { T as Tip } from "./chunks/Tip-
|
|
81
|
+
export { T as Tip } from "./chunks/Tip-BnKB9qMi.mjs";
|
|
82
82
|
|
|
83
|
-
export { T as Toast, a as ToastType } from "./chunks/Toast-
|
|
83
|
+
export { T as Toast, a as ToastType } from "./chunks/Toast-DPHLwDES.mjs";
|
|
84
84
|
|
|
85
|
-
export { B as Button } from "./chunks/Button-
|
|
85
|
+
export { B as Button } from "./chunks/Button-daLv0i7S.mjs";
|
|
86
86
|
|
|
87
|
-
export { C as Chip } from "./chunks/Chip-
|
|
87
|
+
export { C as Chip } from "./chunks/Chip-BRZeD1OX.mjs";
|
|
88
88
|
|
|
89
89
|
export { F as FileIcon, a as FileIconNames } from "./chunks/FileIcon-ePouoJpT.mjs";
|
|
90
90
|
|
|
91
|
-
export { I as Icon } from "./chunks/Icon-
|
|
91
|
+
export { I as Icon } from "./chunks/Icon-CUSQtytG.mjs";
|
|
92
92
|
|
|
93
93
|
export { S as SliceIcons } from "./chunks/_types-C2C2Zwd0.mjs";
|
|
94
94
|
|
|
95
|
-
export { B as ButtonBar } from "./chunks/ButtonBar-
|
|
95
|
+
export { B as ButtonBar } from "./chunks/ButtonBar-DXK8meQq.mjs";
|
|
96
96
|
|
|
97
|
-
export { L as Label } from "./chunks/Label-
|
|
97
|
+
export { L as Label, a as LabelBackground } from "./chunks/Label-CRsE7o3D.mjs";
|
|
98
98
|
|
|
99
|
-
export { U as UploadArea, a as allTypes, b as audioTypes, d as documentTypes, i as imageTypes, t as textTypes, v as videoTypes } from "./chunks/UploadArea-
|
|
99
|
+
export { U as UploadArea, a as allTypes, b as audioTypes, d as documentTypes, i as imageTypes, t as textTypes, v as videoTypes } from "./chunks/UploadArea-DPiOaNpc.mjs";
|
|
100
100
|
|
|
101
101
|
import "./theme/corners.mjs";
|
|
102
102
|
|
|
@@ -116,6 +116,6 @@ import "motion/react";
|
|
|
116
116
|
|
|
117
117
|
import "./chunks/colors-FQ0uNQcW.mjs";
|
|
118
118
|
|
|
119
|
-
import "./chunks/FileList-
|
|
119
|
+
import "./chunks/FileList-5LElsgoE.mjs";
|
|
120
120
|
|
|
121
121
|
import "./chunks/debounce-Bst1jxMS.mjs";
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
|
|
1
3
|
import { useEffect } from "react";
|
|
2
4
|
|
|
3
5
|
import { s as styleInject } from "../chunks/style-inject.es-D0BjEaN8.mjs";
|
|
@@ -14,15 +16,15 @@ import "../theme/motion.mjs";
|
|
|
14
16
|
|
|
15
17
|
import "../theme/type.mjs";
|
|
16
18
|
|
|
17
|
-
styleInject('/* Core brand colors (un-themed) */\n:root {\n\t--brand-grey-50: #f4f7fa;\n\t--brand-grey-100: #e5ecf3;\n\t--brand-grey-200: #d5e0ea;\n\t--brand-grey-300: #98acbf;\n\t--brand-grey-400: #7f96a9;\n\t--brand-grey-500: #657d91;\n\t--brand-grey-600: #4c6273;\n\t--brand-grey-700: #405261;\n\t--brand-grey-800: #37434e;\n\t--brand-grey-900: #2d353d;\n\t--brand-grey-950: #1f262d;\n\t--brand-sea-50: #e8f1ff;\n\t--brand-sea-100: #c7defe;\n\t--brand-sea-200: #a5c9ff;\n\t--brand-sea-300: #7ab3ff;\n\t--brand-sea-400: #4084ff;\n\t--brand-sea-500: #2f45ff;\n\t--brand-sea-600: #2d2fff;\n\t--brand-sea-700: #0000ff;\n\t--brand-sea-800: #0609cd;\n\t--brand-sea-900: #001699;\n\t--brand-sea-950: #0a0b5c;\n\t--brand-sky-50: #eafffe;\n\t--brand-sky-100: #cdfffb;\n\t--brand-sky-200: #a3f8ff;\n\t--brand-sky-300: #6af5ff;\n\t--brand-sky-400: #00edff;\n\t--brand-sky-500: #00c8e0;\n\t--brand-sky-600: #00a6c0;\n\t--brand-sky-700: #03839b;\n\t--brand-sky-800: #0d697d;\n\t--brand-sky-900: #105669;\n\t--brand-sky-950: #033949;\n\t--brand-land-50: #f4ffe5;\n\t--brand-land-100: #e0ffb7;\n\t--brand-land-200: #caff95;\n\t--brand-land-300: #b7fe59;\n\t--brand-land-400: #9cf820;\n\t--brand-land-500: #71e618;\n\t--brand-land-600: #56c900;\n\t--brand-land-700: #2d8c00;\n\t--brand-land-800: #31690b;\n\t--brand-land-900: #2a580f;\n\t--brand-land-950: #123201;\n\t--brand-orange-50: #fff8ec;\n\t--brand-orange-100: #ffebd7;\n\t--brand-orange-200: #ffe3c6;\n\t--brand-orange-300: #ffc182;\n\t--brand-orange-400: #ff972e;\n\t--brand-orange-500: #ff800a;\n\t--brand-orange-600: #ff6700;\n\t--brand-orange-700: #ff3700;\n\t--brand-orange-800: #a02b0b;\n\t--brand-orange-900: #80250b;\n\t--brand-orange-950: #461604;\n\t--brand-yellow-50: #ffffea;\n\t--brand-yellow-100: #fffdca;\n\t--brand-yellow-200: #fff2a0;\n\t--brand-yellow-300: #ffeb72;\n\t--brand-yellow-400: #ffd333;\n\t--brand-yellow-500: #ffc200;\n\t--brand-yellow-600: #ffad00;\n\t--brand-yellow-700: #c68601;\n\t--brand-yellow-800: #8f6307;\n\t--brand-yellow-900: #5f430a;\n\t--brand-yellow-950: #442e00;\n\t--brand-purple-50: #faf0ff;\n\t--brand-purple-100: #f4ddff;\n\t--brand-purple-200: #e5cdff;\n\t--brand-purple-300: #ccafff;\n\t--brand-purple-400: #b891ff;\n\t--brand-purple-500: #7d48ff;\n\t--brand-purple-600: #6a14ff;\n\t--brand-purple-700: #5600f1;\n\t--brand-purple-800: #4d01d6;\n\t--brand-purple-900: #4003af;\n\t--brand-purple-950: #1e007c;\n\t--brand-magenta-50: #fef1fc;\n\t--brand-magenta-100: #ffdcef;\n\t--brand-magenta-200: #ffcae6;\n\t--brand-magenta-300: #ff90cb;\n\t--brand-magenta-400: #ff61ca;\n\t--brand-magenta-500: #ff3ac2;\n\t--brand-magenta-600: #f012aa;\n\t--brand-magenta-700: #df059b;\n\t--brand-magenta-800: #9b0069;\n\t--brand-magenta-900: #790a55;\n\t--brand-magenta-950: #58003a;\n\t--brand-white-0: #ffffff;\n\t--product-red-400: #ff474a;\n\t--product-red-500: #df0529;\n\n\t/* Non-brand semantic aliases */\n\t--core-drop-shadow-light: #0339491a;\n\t--core-drop-shadow-dark: #0000007a;\n\t--core-surface-coverup-translucent-light: #1f262d52;\n\t--core-surface-coverup-translucent-dark: #0000007a;\n\t--core-surface-overlay-translucent-light: #ffffffcc;\n\t--core-surface-overlay-translucent-dark: #1f262dcc;\n\t--scroll-bar-light: #e3e8ef;\n\t--scroll-bar-dark: rgba(255, 255, 255, 0.1);\n\t--scroll-bar-hover-light: #cdd5df;\n\t--scroll-bar-hover-dark: rgba(255, 255, 255, 0.15);\n\t--surface-shadow-soft-light: 0px 4px 24px #0339491a;\n\t--surface-shadow-soft-dark: 0px 4px 24px #0000007a;\n\t--surface-shadow-strong-light: 0px 4px 64px #0339491a;\n\t--surface-shadow-strong-dark: 0px 4px 64px #0000007a;\n}\n\n/* Light theme tokens */\n[data-theme="lightMode"] {\n\t--array-land: var(--brand-land-100);\n\t--array-land-label: var(--brand-land-600);\n\t--array-magenta: var(--brand-magenta-100);\n\t--array-magenta-label: var(--brand-magenta-600);\n\t--array-orange: var(--brand-orange-100);\n\t--array-orange-label: var(--brand-orange-600);\n\t--array-purple: var(--brand-purple-100);\n\t--array-purple-label: var(--brand-purple-600);\n\t--array-sea: var(--brand-sea-100);\n\t--array-sea-label: var(--brand-sea-600);\n\t--array-sky: var(--brand-sky-100);\n\t--array-sky-label: var(--brand-sky-600);\n\t--array-yellow: var(--brand-yellow-100);\n\t--array-yellow-label: var(--brand-yellow-600);\n\t--core-badge-primary: var(--brand-sea-500);\n\t--core-badge-secondary: var(--brand-grey-100);\n\t--core-button-disabled: var(--brand-grey-50);\n\t--core-button-primary: var(--brand-sea-500);\n\t--core-drop-shadow: var(--core-drop-shadow-light);\n\t--core-gp-logo-primary: var(--brand-sea-700);\n\t--core-gp-logo-secondary: var(--brand-grey-950);\n\t--core-icon-dark: var(--brand-grey-950);\n\t--core-icon-disabled: var(--brand-grey-300);\n\t--core-icon-error: var(--product-red-500);\n\t--core-icon-light: var(--brand-white-0);\n\t--core-icon-primary: var(--brand-grey-950);\n\t--core-icon-secondary: var(--brand-grey-700);\n\t--core-icon-tertiary: var(--brand-sea-500);\n\t--core-outline-secondary: var(--brand-grey-700);\n\t--core-outline-primary: var(--brand-grey-100);\n\t--core-outline-special: var(--brand-sea-100);\n\t--core-outline-tertiary: var(--brand-sea-500);\n\t--core-surface-coverup-translucent: var(\n\t\t--core-surface-coverup-translucent-light\n\t);\n\t--core-surface-overlay-translucent: var(\n\t\t--core-surface-overlay-translucent-light\n\t);\n\t--core-surface-primary: var(--brand-white-0);\n\t--core-surface-secondary: var(--brand-grey-50);\n\t--core-surface-special: var(--brand-sea-50);\n\t--core-text-dark: var(--brand-grey-950);\n\t--core-text-disabled: var(--brand-grey-300);\n\t--core-text-error: var(--product-red-500);\n\t--core-text-light: var(--brand-white-0);\n\t--core-text-primary: var(--brand-grey-950);\n\t--core-text-secondary: var(--brand-grey-700);\n\t--core-text-tertiary: var(--brand-grey-600);\n\t--core-text-special: var(--brand-sea-500);\n\t--core-link-primary: var(--brand-sea-700);\n\t--eor-tag-employee: var(--brand-sky-700);\n\t--eor-tag-overdue: var(--product-red-500);\n\t--eor-tag-paid: var(--brand-land-700);\n\t--eor-tag-pending: var(--brand-orange-500);\n\t--eor-tag-professional: var(--brand-sea-500);\n\t--feedback-attention: var(--brand-yellow-500);\n\t--feedback-informative: var(--brand-sky-700);\n\t--feedback-positive: var(--brand-land-700);\n\t--feedback-urgency: var(--brand-orange-500);\n\t--feedback-warning: var(--product-red-500);\n\t--gia-tag-risk-high: var(--product-red-500);\n\t--gia-tag-risk-low: var(--brand-sky-700);\n\t--gia-tag-risk-moderate: var(--brand-orange-500);\n\t--gia-text-excerpt-highlight: var(--brand-orange-100);\n\t--gia-text-selection: var(--brand-sea-100);\n\t--scroll-bar: var(--scroll-bar-light);\n\t--scroll-bar-hover: var(--scroll-bar-hover-light);\n\t--surface-shadow-soft: var(--surface-shadow-soft-light);\n\t--surface-shadow-strong: var(--surface-shadow-strong-light);\n}\n\n/* Dark theme tokens */\n[data-theme="darkMode"] {\n\t--array-land: var(--brand-land-100);\n\t--array-land-label: var(--brand-land-600);\n\t--array-magenta: var(--brand-magenta-100);\n\t--array-magenta-label: var(--brand-magenta-600);\n\t--array-orange: var(--brand-orange-100);\n\t--array-orange-label: var(--brand-orange-600);\n\t--array-purple: var(--brand-purple-100);\n\t--array-purple-label: var(--brand-purple-600);\n\t--array-sea: var(--brand-sea-100);\n\t--array-sea-label: var(--brand-sea-600);\n\t--array-sky: var(--brand-sky-100);\n\t--array-sky-label: var(--brand-sky-600);\n\t--array-yellow: var(--brand-yellow-100);\n\t--array-yellow-label: var(--brand-yellow-600);\n\t--core-badge-primary: var(--brand-sea-500);\n\t--core-badge-secondary: var(--brand-grey-700);\n\t--core-button-disabled: var(--brand-grey-900);\n\t--core-button-primary: var(--brand-sea-500);\n\t--core-drop-shadow: var(--core-drop-shadow-dark);\n\t--core-gp-logo-primary: var(--brand-sea-500);\n\t--core-gp-logo-secondary: var(--brand-white-0);\n\t--core-icon-dark: var(--brand-grey-950);\n\t--core-icon-disabled: var(--brand-grey-500);\n\t--core-icon-error: var(--product-red-400);\n\t--core-icon-light: var(--brand-white-0);\n\t--core-icon-primary: var(--brand-white-0);\n\t--core-icon-secondary: var(--brand-grey-200);\n\t--core-icon-tertiary: var(--brand-sky-300);\n\t--core-outline-secondary: var(--brand-grey-100);\n\t--core-outline-primary: var(--brand-grey-700);\n\t--core-outline-special: var(--brand-sky-300);\n\t--core-outline-tertiary: var(--brand-sky-300);\n\t--core-surface-coverup-translucent: var(\n\t\t--core-surface-coverup-translucent-dark\n\t);\n\t--core-surface-overlay-translucent: var(\n\t\t--core-surface-overlay-translucent-dark\n\t);\n\t--core-surface-primary: var(--brand-grey-950);\n\t--core-surface-secondary: var(--brand-grey-900);\n\t--core-surface-special: var(--brand-sky-950);\n\t--core-text-dark: var(--brand-grey-950);\n\t--core-text-disabled: var(--brand-grey-500);\n\t--core-text-error: var(--product-red-400);\n\t--core-text-light: var(--brand-white-0);\n\t--core-text-primary: var(--brand-white-0);\n\t--core-text-secondary: var(--brand-grey-200);\n\t--core-text-tertiary: var(--brand-grey-400);\n\t--core-text-special: var(--brand-sky-300);\n\t--core-link-primary: var(--brand-sky-300);\n\t--eor-tag-employee: var(--brand-sky-700);\n\t--eor-tag-overdue: var(--product-red-400);\n\t--eor-tag-paid: var(--brand-land-700);\n\t--eor-tag-pending: var(--brand-orange-500);\n\t--eor-tag-professional: var(--brand-sea-500);\n\t--feedback-attention: var(--brand-yellow-400);\n\t--feedback-informative: var(--brand-sky-600);\n\t--feedback-positive: var(--brand-land-700);\n\t--feedback-urgency: var(--brand-orange-500);\n\t--feedback-warning: var(--product-red-400);\n\t--gia-tag-risk-high: var(--product-red-400);\n\t--gia-tag-risk-low: var(--brand-sky-600);\n\t--gia-tag-risk-moderate: var(--brand-orange-500);\n\t--gia-text-excerpt-highlight: var(--brand-orange-100);\n\t--gia-text-selection: var(--brand-sea-900);\n\t--scroll-bar: var(--scroll-bar-dark);\n\t--scroll-bar-hover: var(--scroll-bar-hover-dark);\n\t--surface-shadow-soft: var(--surface-shadow-soft-dark);\n\t--surface-shadow-strong: var(--surface-shadow-strong-dark);\n}\n\n/* Theme token text-color utility classes */\n.array-land {\n\tbackground: var(--array-land);\n}\n.array-land-label {\n\tcolor: var(--array-land-label);\n}\n.array-magenta {\n\tbackground: var(--array-magenta);\n}\n.array-magenta-label {\n\tcolor: var(--array-magenta-label);\n}\n.array-orange {\n\tbackground: var(--array-orange);\n}\n.array-orange-label {\n\tcolor: var(--array-orange-label);\n}\n.array-purple {\n\tbackground: var(--array-purple);\n}\n.array-purple-label {\n\tcolor: var(--array-purple-label);\n}\n.array-sea {\n\tbackground: var(--array-sea);\n}\n.array-sea-label {\n\tcolor: var(--array-sea-label);\n}\n.array-sky {\n\tbackground: var(--array-sky);\n}\n.array-sky-label {\n\tcolor: var(--array-sky-label);\n}\n.array-yellow {\n\tbackground: var(--array-yellow);\n}\n.array-yellow-label {\n\tcolor: var(--array-yellow-label);\n}\n.core-badge-primary {\n\tbackground: var(--core-badge-primary);\n}\n.core-badge-secondary {\n\tbackground: var(--core-badge-secondary);\n}\n.core-button-disabled {\n\tbackground: var(--core-button-disabled);\n}\n.core-button-primary {\n\tbackground: var(--core-button-primary);\n}\n.core-drop-shadow {\n\tbox-shadow: var(--core-drop-shadow);\n}\n.core-gp-logo-primary {\n\tcolor: var(--core-gp-logo-primary);\n}\n.core-gp-logo-secondary {\n\tcolor: var(--core-gp-logo-secondary);\n}\n.core-icon-dark {\n\tcolor: var(--core-icon-dark);\n}\n.core-icon-disabled {\n\tcolor: var(--core-icon-disabled);\n}\n.core-icon-error {\n\tcolor: var(--core-icon-error);\n}\n.core-icon-light {\n\tcolor: var(--core-icon-light);\n}\n.core-icon-primary {\n\tcolor: var(--core-icon-primary);\n}\n.core-icon-secondary {\n\tcolor: var(--core-icon-secondary);\n}\n.core-icon-tertiary {\n\tcolor: var(--core-icon-tertiary);\n}\n.core-link-primary {\n\tcolor: var(--core-link-primary);\n}\n.core-outline-primary {\n\tborder-color: var(--core-outline-primary);\n}\n.core-outline-secondary {\n\tborder-color: var(--core-outline-secondary);\n}\n.core-outline-special {\n\tborder-color: var(--core-outline-special);\n}\n.core-outline-tertiary {\n\tborder-color: var(--core-outline-tertiary);\n}\n.core-surface-coverup-translucent {\n\tbackground: var(--core-surface-coverup-translucent);\n}\n.core-surface-overlay-translucent {\n\tbackground: var(--core-surface-overlay-translucent);\n}\n.core-surface-primary {\n\tbackground: var(--core-surface-primary);\n}\n.core-surface-secondary {\n\tbackground: var(--core-surface-secondary);\n}\n.core-surface-special {\n\tbackground: var(--core-surface-special);\n}\n.core-text-dark {\n\tcolor: var(--core-text-dark);\n}\n.core-text-disabled {\n\tcolor: var(--core-text-disabled);\n}\n.core-text-error {\n\tcolor: var(--core-text-error);\n}\n.core-text-light {\n\tcolor: var(--core-text-light);\n}\n.core-text-primary {\n\tcolor: var(--core-text-primary);\n}\n.core-text-secondary {\n\tcolor: var(--core-text-secondary);\n}\n.core-text-special {\n\tcolor: var(--core-text-special);\n}\n.core-text-tertiary {\n\tcolor: var(--core-text-tertiary);\n}\n.eor-tag-employee {\n\tcolor: var(--eor-tag-employee);\n}\n.eor-tag-overdue {\n\tcolor: var(--eor-tag-overdue);\n}\n.eor-tag-paid {\n\tcolor: var(--eor-tag-paid);\n}\n.eor-tag-pending {\n\tcolor: var(--eor-tag-pending);\n}\n.eor-tag-professional {\n\tcolor: var(--eor-tag-professional);\n}\n.feedback-attention {\n\tcolor: var(--feedback-attention);\n}\n.feedback-informative {\n\tcolor: var(--feedback-informative);\n}\n.feedback-positive {\n\tcolor: var(--feedback-positive);\n}\n.feedback-urgency {\n\tcolor: var(--feedback-urgency);\n}\n.feedback-warning {\n\tcolor: var(--feedback-warning);\n}\n.gia-tag-risk-high {\n\tcolor: var(--gia-tag-risk-high);\n}\n.gia-tag-risk-low {\n\tcolor: var(--gia-tag-risk-low);\n}\n.gia-tag-risk-moderate {\n\tcolor: var(--gia-tag-risk-moderate);\n}\n.gia-text-excerpt-highlight {\n\tcolor: var(--gia-text-excerpt-highlight);\n}\n.gia-text-selection {\n\tcolor: var(--gia-text-selection);\n}\n.scroll-bar {\n\tcolor: var(--scroll-bar);\n}\n.scroll-bar-hover {\n\tcolor: var(--scroll-bar-hover);\n}\n.surface-shadow-soft {\n\tcolor: var(--surface-shadow-soft);\n}\n.surface-shadow-strong {\n\tcolor: var(--surface-shadow-strong);\n}\n\nbody {\n\tbackground: var(--core-surface-primary);\n}\n\na {\n\tcolor: var(--core-text-special);\n\ttext-decoration: underline;\n}\n\na:visited {\n\tcolor: var(--core-text-special);\n\ttext-decoration: underline;\n}\n\na:hover {\n\ttext-decoration: none;\n}\n\ncode {\n\tborder: 1px solid var(--core-outline-primary);\n\tbackground: var(--core-surface-secondary);\n\tcolor: var(--core-text-primary);\n}\n');
|
|
19
|
+
styleInject('/* Core brand colors (un-themed) */\n[data-slice-theme-scope] {\n\t--brand-grey-50: #f4f7fa;\n\t--brand-grey-100: #e5ecf3;\n\t--brand-grey-200: #d5e0ea;\n\t--brand-grey-300: #98acbf;\n\t--brand-grey-400: #7f96a9;\n\t--brand-grey-500: #657d91;\n\t--brand-grey-600: #4c6273;\n\t--brand-grey-700: #405261;\n\t--brand-grey-800: #37434e;\n\t--brand-grey-900: #2d353d;\n\t--brand-grey-950: #1f262d;\n\t--brand-sea-50: #e8f1ff;\n\t--brand-sea-100: #c7defe;\n\t--brand-sea-200: #a5c9ff;\n\t--brand-sea-300: #7ab3ff;\n\t--brand-sea-400: #4084ff;\n\t--brand-sea-500: #2f45ff;\n\t--brand-sea-600: #2d2fff;\n\t--brand-sea-700: #0000ff;\n\t--brand-sea-800: #0609cd;\n\t--brand-sea-900: #001699;\n\t--brand-sea-950: #0a0b5c;\n\t--brand-sky-50: #eafffe;\n\t--brand-sky-100: #cdfffb;\n\t--brand-sky-200: #a3f8ff;\n\t--brand-sky-300: #6af5ff;\n\t--brand-sky-400: #00edff;\n\t--brand-sky-500: #00c8e0;\n\t--brand-sky-600: #00a6c0;\n\t--brand-sky-700: #03839b;\n\t--brand-sky-800: #0d697d;\n\t--brand-sky-900: #105669;\n\t--brand-sky-950: #033949;\n\t--brand-land-50: #f4ffe5;\n\t--brand-land-100: #e0ffb7;\n\t--brand-land-200: #caff95;\n\t--brand-land-300: #b7fe59;\n\t--brand-land-400: #9cf820;\n\t--brand-land-500: #71e618;\n\t--brand-land-600: #56c900;\n\t--brand-land-700: #2d8c00;\n\t--brand-land-800: #31690b;\n\t--brand-land-900: #2a580f;\n\t--brand-land-950: #123201;\n\t--brand-orange-50: #fff8ec;\n\t--brand-orange-100: #ffebd7;\n\t--brand-orange-200: #ffe3c6;\n\t--brand-orange-300: #ffc182;\n\t--brand-orange-400: #ff972e;\n\t--brand-orange-500: #ff800a;\n\t--brand-orange-600: #ff6700;\n\t--brand-orange-700: #ff3700;\n\t--brand-orange-800: #a02b0b;\n\t--brand-orange-900: #80250b;\n\t--brand-orange-950: #461604;\n\t--brand-yellow-50: #ffffea;\n\t--brand-yellow-100: #fffdca;\n\t--brand-yellow-200: #fff2a0;\n\t--brand-yellow-300: #ffeb72;\n\t--brand-yellow-400: #ffd333;\n\t--brand-yellow-500: #ffc200;\n\t--brand-yellow-600: #ffad00;\n\t--brand-yellow-700: #c68601;\n\t--brand-yellow-800: #8f6307;\n\t--brand-yellow-900: #5f430a;\n\t--brand-yellow-950: #442e00;\n\t--brand-purple-50: #faf0ff;\n\t--brand-purple-100: #f4ddff;\n\t--brand-purple-200: #e5cdff;\n\t--brand-purple-300: #ccafff;\n\t--brand-purple-400: #b891ff;\n\t--brand-purple-500: #7d48ff;\n\t--brand-purple-600: #6a14ff;\n\t--brand-purple-700: #5600f1;\n\t--brand-purple-800: #4d01d6;\n\t--brand-purple-900: #4003af;\n\t--brand-purple-950: #1e007c;\n\t--brand-magenta-50: #fef1fc;\n\t--brand-magenta-100: #ffdcef;\n\t--brand-magenta-200: #ffcae6;\n\t--brand-magenta-300: #ff90cb;\n\t--brand-magenta-400: #ff61ca;\n\t--brand-magenta-500: #ff3ac2;\n\t--brand-magenta-600: #f012aa;\n\t--brand-magenta-700: #df059b;\n\t--brand-magenta-800: #9b0069;\n\t--brand-magenta-900: #790a55;\n\t--brand-magenta-950: #58003a;\n\t--brand-white-0: #ffffff;\n\t--product-red-400: #ff474a;\n\t--product-red-500: #df0529;\n\n\t/* Non-brand semantic aliases */\n\t--core-drop-shadow-light: #0339491a;\n\t--core-drop-shadow-dark: #0000007a;\n\t--core-surface-coverup-translucent-light: #1f262d52;\n\t--core-surface-coverup-translucent-dark: #0000007a;\n\t--core-surface-overlay-translucent-light: #ffffffcc;\n\t--core-surface-overlay-translucent-dark: #1f262dcc;\n\t--scroll-bar-light: #e3e8ef;\n\t--scroll-bar-dark: rgba(255, 255, 255, 0.1);\n\t--scroll-bar-hover-light: #cdd5df;\n\t--scroll-bar-hover-dark: rgba(255, 255, 255, 0.15);\n\t--surface-shadow-soft-light: 0px 4px 24px #0339491a;\n\t--surface-shadow-soft-dark: 0px 4px 24px #0000007a;\n\t--surface-shadow-strong-light: 0px 4px 64px #0339491a;\n\t--surface-shadow-strong-dark: 0px 4px 64px #0000007a;\n}\n\n/* Light theme tokens */\n:root[data-slice-theme="lightMode"] [data-slice-theme-scope] {\n\t--array-land: var(--brand-land-100);\n\t--array-land-label: var(--brand-land-600);\n\t--array-magenta: var(--brand-magenta-100);\n\t--array-magenta-label: var(--brand-magenta-600);\n\t--array-orange: var(--brand-orange-100);\n\t--array-orange-label: var(--brand-orange-600);\n\t--array-purple: var(--brand-purple-100);\n\t--array-purple-label: var(--brand-purple-600);\n\t--array-sea: var(--brand-sea-100);\n\t--array-sea-label: var(--brand-sea-600);\n\t--array-sky: var(--brand-sky-100);\n\t--array-sky-label: var(--brand-sky-600);\n\t--array-yellow: var(--brand-yellow-100);\n\t--array-yellow-label: var(--brand-yellow-600);\n\t--core-badge-primary: var(--brand-sea-500);\n\t--core-badge-secondary: var(--brand-grey-100);\n\t--core-button-disabled: var(--brand-grey-50);\n\t--core-button-primary: var(--brand-sea-500);\n\t--core-drop-shadow: var(--core-drop-shadow-light);\n\t--core-gp-logo-primary: var(--brand-sea-700);\n\t--core-gp-logo-secondary: var(--brand-grey-950);\n\t--core-icon-dark: var(--brand-grey-950);\n\t--core-icon-disabled: var(--brand-grey-300);\n\t--core-icon-error: var(--product-red-500);\n\t--core-icon-light: var(--brand-white-0);\n\t--core-icon-primary: var(--brand-grey-950);\n\t--core-icon-secondary: var(--brand-grey-700);\n\t--core-icon-tertiary: var(--brand-sea-500);\n\t--core-outline-secondary: var(--brand-grey-700);\n\t--core-outline-primary: var(--brand-grey-100);\n\t--core-outline-special: var(--brand-sea-100);\n\t--core-outline-tertiary: var(--brand-sea-500);\n\t--core-surface-coverup-translucent: var(\n\t\t--core-surface-coverup-translucent-light\n\t);\n\t--core-surface-overlay-translucent: var(\n\t\t--core-surface-overlay-translucent-light\n\t);\n\t--core-surface-primary: var(--brand-white-0);\n\t--core-surface-secondary: var(--brand-grey-50);\n\t--core-surface-special: var(--brand-sea-50);\n\t--core-text-dark: var(--brand-grey-950);\n\t--core-text-disabled: var(--brand-grey-300);\n\t--core-text-error: var(--product-red-500);\n\t--core-text-light: var(--brand-white-0);\n\t--core-text-primary: var(--brand-grey-950);\n\t--core-text-secondary: var(--brand-grey-700);\n\t--core-text-tertiary: var(--brand-grey-600);\n\t--core-text-special: var(--brand-sea-500);\n\t--core-link-primary: var(--brand-sea-700);\n\t--eor-tag-employee: var(--brand-sky-700);\n\t--eor-tag-overdue: var(--product-red-500);\n\t--eor-tag-paid: var(--brand-land-700);\n\t--eor-tag-pending: var(--brand-orange-500);\n\t--eor-tag-professional: var(--brand-sea-500);\n\t--feedback-attention: var(--brand-yellow-500);\n\t--feedback-informative: var(--brand-sky-700);\n\t--feedback-positive: var(--brand-land-700);\n\t--feedback-urgency: var(--brand-orange-500);\n\t--feedback-warning: var(--product-red-500);\n\t--gia-tag-risk-high: var(--product-red-500);\n\t--gia-tag-risk-low: var(--brand-sky-700);\n\t--gia-tag-risk-moderate: var(--brand-orange-500);\n\t--gia-text-excerpt-highlight: var(--brand-orange-100);\n\t--gia-text-selection: var(--brand-sea-100);\n\t--scroll-bar: var(--scroll-bar-light);\n\t--scroll-bar-hover: var(--scroll-bar-hover-light);\n\t--surface-shadow-soft: var(--surface-shadow-soft-light);\n\t--surface-shadow-strong: var(--surface-shadow-strong-light);\n}\n\n/* Dark theme tokens */\n:root[data-slice-theme="darkMode"] [data-slice-theme-scope] {\n\t--array-land: var(--brand-land-100);\n\t--array-land-label: var(--brand-land-600);\n\t--array-magenta: var(--brand-magenta-100);\n\t--array-magenta-label: var(--brand-magenta-600);\n\t--array-orange: var(--brand-orange-100);\n\t--array-orange-label: var(--brand-orange-600);\n\t--array-purple: var(--brand-purple-100);\n\t--array-purple-label: var(--brand-purple-600);\n\t--array-sea: var(--brand-sea-100);\n\t--array-sea-label: var(--brand-sea-600);\n\t--array-sky: var(--brand-sky-100);\n\t--array-sky-label: var(--brand-sky-600);\n\t--array-yellow: var(--brand-yellow-100);\n\t--array-yellow-label: var(--brand-yellow-600);\n\t--core-badge-primary: var(--brand-sea-500);\n\t--core-badge-secondary: var(--brand-grey-700);\n\t--core-button-disabled: var(--brand-grey-900);\n\t--core-button-primary: var(--brand-sea-500);\n\t--core-drop-shadow: var(--core-drop-shadow-dark);\n\t--core-gp-logo-primary: var(--brand-sea-500);\n\t--core-gp-logo-secondary: var(--brand-white-0);\n\t--core-icon-dark: var(--brand-grey-950);\n\t--core-icon-disabled: var(--brand-grey-500);\n\t--core-icon-error: var(--product-red-400);\n\t--core-icon-light: var(--brand-white-0);\n\t--core-icon-primary: var(--brand-white-0);\n\t--core-icon-secondary: var(--brand-grey-200);\n\t--core-icon-tertiary: var(--brand-sky-300);\n\t--core-outline-secondary: var(--brand-grey-100);\n\t--core-outline-primary: var(--brand-grey-700);\n\t--core-outline-special: var(--brand-sky-300);\n\t--core-outline-tertiary: var(--brand-sky-300);\n\t--core-surface-coverup-translucent: var(\n\t\t--core-surface-coverup-translucent-dark\n\t);\n\t--core-surface-overlay-translucent: var(\n\t\t--core-surface-overlay-translucent-dark\n\t);\n\t--core-surface-primary: var(--brand-grey-950);\n\t--core-surface-secondary: var(--brand-grey-900);\n\t--core-surface-special: var(--brand-sky-950);\n\t--core-text-dark: var(--brand-grey-950);\n\t--core-text-disabled: var(--brand-grey-500);\n\t--core-text-error: var(--product-red-400);\n\t--core-text-light: var(--brand-white-0);\n\t--core-text-primary: var(--brand-white-0);\n\t--core-text-secondary: var(--brand-grey-200);\n\t--core-text-tertiary: var(--brand-grey-400);\n\t--core-text-special: var(--brand-sky-300);\n\t--core-link-primary: var(--brand-sky-300);\n\t--eor-tag-employee: var(--brand-sky-700);\n\t--eor-tag-overdue: var(--product-red-400);\n\t--eor-tag-paid: var(--brand-land-700);\n\t--eor-tag-pending: var(--brand-orange-500);\n\t--eor-tag-professional: var(--brand-sea-500);\n\t--feedback-attention: var(--brand-yellow-400);\n\t--feedback-informative: var(--brand-sky-600);\n\t--feedback-positive: var(--brand-land-700);\n\t--feedback-urgency: var(--brand-orange-500);\n\t--feedback-warning: var(--product-red-400);\n\t--gia-tag-risk-high: var(--product-red-400);\n\t--gia-tag-risk-low: var(--brand-sky-600);\n\t--gia-tag-risk-moderate: var(--brand-orange-500);\n\t--gia-text-excerpt-highlight: var(--brand-orange-100);\n\t--gia-text-selection: var(--brand-sea-900);\n\t--scroll-bar: var(--scroll-bar-dark);\n\t--scroll-bar-hover: var(--scroll-bar-hover-dark);\n\t--surface-shadow-soft: var(--surface-shadow-soft-dark);\n\t--surface-shadow-strong: var(--surface-shadow-strong-dark);\n}\n\n/* Theme token text-color utility classes */\n[data-slice-theme-scope] .array-land {\n\tbackground: var(--array-land);\n}\n[data-slice-theme-scope] .array-land-label {\n\tcolor: var(--array-land-label);\n}\n[data-slice-theme-scope] .array-magenta {\n\tbackground: var(--array-magenta);\n}\n[data-slice-theme-scope] .array-magenta-label {\n\tcolor: var(--array-magenta-label);\n}\n[data-slice-theme-scope] .array-orange {\n\tbackground: var(--array-orange);\n}\n[data-slice-theme-scope] .array-orange-label {\n\tcolor: var(--array-orange-label);\n}\n[data-slice-theme-scope] .array-purple {\n\tbackground: var(--array-purple);\n}\n[data-slice-theme-scope] .array-purple-label {\n\tcolor: var(--array-purple-label);\n}\n[data-slice-theme-scope] .array-sea {\n\tbackground: var(--array-sea);\n}\n[data-slice-theme-scope] .array-sea-label {\n\tcolor: var(--array-sea-label);\n}\n[data-slice-theme-scope] .array-sky {\n\tbackground: var(--array-sky);\n}\n[data-slice-theme-scope] .array-sky-label {\n\tcolor: var(--array-sky-label);\n}\n[data-slice-theme-scope] .array-yellow {\n\tbackground: var(--array-yellow);\n}\n[data-slice-theme-scope] .array-yellow-label {\n\tcolor: var(--array-yellow-label);\n}\n[data-slice-theme-scope] .core-badge-primary {\n\tbackground: var(--core-badge-primary);\n}\n[data-slice-theme-scope] .core-badge-secondary {\n\tbackground: var(--core-badge-secondary);\n}\n[data-slice-theme-scope] .core-button-disabled {\n\tbackground: var(--core-button-disabled);\n}\n[data-slice-theme-scope] .core-button-primary {\n\tbackground: var(--core-button-primary);\n}\n[data-slice-theme-scope] .core-drop-shadow {\n\tbox-shadow: var(--core-drop-shadow);\n}\n[data-slice-theme-scope] .core-gp-logo-primary {\n\tcolor: var(--core-gp-logo-primary);\n}\n[data-slice-theme-scope] .core-gp-logo-secondary {\n\tcolor: var(--core-gp-logo-secondary);\n}\n[data-slice-theme-scope] .core-icon-dark {\n\tcolor: var(--core-icon-dark);\n}\n[data-slice-theme-scope] .core-icon-disabled {\n\tcolor: var(--core-icon-disabled);\n}\n[data-slice-theme-scope] .core-icon-error {\n\tcolor: var(--core-icon-error);\n}\n[data-slice-theme-scope] .core-icon-light {\n\tcolor: var(--core-icon-light);\n}\n[data-slice-theme-scope] .core-icon-primary {\n\tcolor: var(--core-icon-primary);\n}\n[data-slice-theme-scope] .core-icon-secondary {\n\tcolor: var(--core-icon-secondary);\n}\n[data-slice-theme-scope] .core-icon-tertiary {\n\tcolor: var(--core-icon-tertiary);\n}\n[data-slice-theme-scope] .core-link-primary {\n\tcolor: var(--core-link-primary);\n}\n[data-slice-theme-scope] .core-outline-primary {\n\tborder-color: var(--core-outline-primary);\n}\n[data-slice-theme-scope] .core-outline-secondary {\n\tborder-color: var(--core-outline-secondary);\n}\n[data-slice-theme-scope] .core-outline-special {\n\tborder-color: var(--core-outline-special);\n}\n[data-slice-theme-scope] .core-outline-tertiary {\n\tborder-color: var(--core-outline-tertiary);\n}\n[data-slice-theme-scope] .core-surface-coverup-translucent {\n\tbackground: var(--core-surface-coverup-translucent);\n}\n[data-slice-theme-scope] .core-surface-overlay-translucent {\n\tbackground: var(--core-surface-overlay-translucent);\n}\n[data-slice-theme-scope] .core-surface-primary {\n\tbackground: var(--core-surface-primary);\n}\n[data-slice-theme-scope] .core-surface-secondary {\n\tbackground: var(--core-surface-secondary);\n}\n[data-slice-theme-scope] .core-surface-special {\n\tbackground: var(--core-surface-special);\n}\n[data-slice-theme-scope] .core-text-dark {\n\tcolor: var(--core-text-dark);\n}\n[data-slice-theme-scope] .core-text-disabled {\n\tcolor: var(--core-text-disabled);\n}\n[data-slice-theme-scope] .core-text-error {\n\tcolor: var(--core-text-error);\n}\n[data-slice-theme-scope] .core-text-light {\n\tcolor: var(--core-text-light);\n}\n[data-slice-theme-scope] .core-text-primary {\n\tcolor: var(--core-text-primary);\n}\n[data-slice-theme-scope] .core-text-secondary {\n\tcolor: var(--core-text-secondary);\n}\n[data-slice-theme-scope] .core-text-special {\n\tcolor: var(--core-text-special);\n}\n[data-slice-theme-scope] .core-text-tertiary {\n\tcolor: var(--core-text-tertiary);\n}\n[data-slice-theme-scope] .eor-tag-employee {\n\tcolor: var(--eor-tag-employee);\n}\n[data-slice-theme-scope] .eor-tag-overdue {\n\tcolor: var(--eor-tag-overdue);\n}\n[data-slice-theme-scope] .eor-tag-paid {\n\tcolor: var(--eor-tag-paid);\n}\n[data-slice-theme-scope] .eor-tag-pending {\n\tcolor: var(--eor-tag-pending);\n}\n[data-slice-theme-scope] .eor-tag-professional {\n\tcolor: var(--eor-tag-professional);\n}\n[data-slice-theme-scope] .feedback-attention {\n\tcolor: var(--feedback-attention);\n}\n[data-slice-theme-scope] .feedback-informative {\n\tcolor: var(--feedback-informative);\n}\n[data-slice-theme-scope] .feedback-positive {\n\tcolor: var(--feedback-positive);\n}\n[data-slice-theme-scope] .feedback-urgency {\n\tcolor: var(--feedback-urgency);\n}\n[data-slice-theme-scope] .feedback-warning {\n\tcolor: var(--feedback-warning);\n}\n[data-slice-theme-scope] .gia-tag-risk-high {\n\tcolor: var(--gia-tag-risk-high);\n}\n[data-slice-theme-scope] .gia-tag-risk-low {\n\tcolor: var(--gia-tag-risk-low);\n}\n[data-slice-theme-scope] .gia-tag-risk-moderate {\n\tcolor: var(--gia-tag-risk-moderate);\n}\n[data-slice-theme-scope] .gia-text-excerpt-highlight {\n\tcolor: var(--gia-text-excerpt-highlight);\n}\n[data-slice-theme-scope] .gia-text-selection {\n\tcolor: var(--gia-text-selection);\n}\n[data-slice-theme-scope] .scroll-bar {\n\tcolor: var(--scroll-bar);\n}\n[data-slice-theme-scope] .scroll-bar-hover {\n\tcolor: var(--scroll-bar-hover);\n}\n[data-slice-theme-scope] .surface-shadow-soft {\n\tcolor: var(--surface-shadow-soft);\n}\n[data-slice-theme-scope] .surface-shadow-strong {\n\tcolor: var(--surface-shadow-strong);\n}\n\n[data-slice-theme-scope] {\n\tbackground: var(--core-surface-primary);\n}\n\n[data-slice-theme-scope] a {\n\tcolor: var(--core-text-special);\n\ttext-decoration: underline;\n}\n\n[data-slice-theme-scope] a:visited {\n\tcolor: var(--core-text-special);\n\ttext-decoration: underline;\n}\n\n[data-slice-theme-scope] a:hover {\n\ttext-decoration: none;\n}\n\n[data-slice-theme-scope] code {\n\tborder: 1px solid var(--core-outline-primary);\n\tbackground: var(--core-surface-secondary);\n\tcolor: var(--core-text-primary);\n}\n');
|
|
18
20
|
|
|
19
|
-
styleInject("
|
|
21
|
+
styleInject("[data-slice-theme-scope] {\n\t--elevation-below-surface: -100;\n\t--elevation-surface: 0;\n\t--elevation-float: 100;\n\t--elevation-describe: 200;\n\t--elevation-status: 300;\n\t--elevation-notify: 400;\n\t--elevation-overlay: 500;\n\t--elevation-confirm: 600;\n}\n");
|
|
20
22
|
|
|
21
|
-
styleInject('@import url("https://fonts.googleapis.com/css2?family=Funnel+Sans:ital,wght@0,300..800;1,300..800&display=swap");\n\n
|
|
23
|
+
styleInject('@import url("https://fonts.googleapis.com/css2?family=Funnel+Sans:ital,wght@0,300..800;1,300..800&display=swap");\n\n[data-slice-theme-scope] {\n\t--font-family: "Funnel Sans";\n\t--font-weight-regular: 360;\n\t--font-weight-medium: 420;\n\t--font-weight-bold: 480;\n\t--font-size-xs: 12px;\n\t--font-size-s: 14px;\n\t--font-size-m: 15px;\n\t--font-size-l: 16px;\n\t--font-size-xl: 17px;\n}\n\n[data-slice-theme-scope] .body-xs-regular {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .body-xs-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .body-xs-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}\n\n[data-slice-theme-scope] .body-s-regular {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}\n\n[data-slice-theme-scope] .body-s-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}\n\n[data-slice-theme-scope] .body-s-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .body-m-regular {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}\n\n[data-slice-theme-scope] .body-m-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}\n\n[data-slice-theme-scope] .body-m-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .body-l-regular {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}\n\n[data-slice-theme-scope] .body-l-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}\n\n[data-slice-theme-scope] .body-l-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}\n\n[data-slice-theme-scope] .body-xl-regular {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}\n\n[data-slice-theme-scope] .body-xl-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}\n\n[data-slice-theme-scope] .body-xl-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}\n\n[data-slice-theme-scope] .heading-s-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .heading-s-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .heading-m-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .heading-m-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .heading-l-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .heading-l-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .heading-xl-medium {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] .heading-xl-bold {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}\n\n[data-slice-theme-scope] h1 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] h2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] h3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] h4 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n[data-slice-theme-scope] h1,\n[data-slice-theme-scope] h2,\n[data-slice-theme-scope] h3,\n[data-slice-theme-scope] h4 {\n\tmargin: 1.5em 0 0.6em 0;\n}\n\n[data-slice-theme-scope] h1:first-child {\n\tmargin: 0 0 0.6em 0;\n}\n\n[data-slice-theme-scope] p {\n\tmargin: 0 0 1.5em 0;\n}\n\n[data-slice-theme-scope] b,\n[data-slice-theme-scope] strong {\n\tfont-weight: var(--font-weight-bold);\n}\n');
|
|
22
24
|
|
|
23
25
|
styleInject("/* Keep these values in sync with src/hooks/useWindow/useWindow.ts */\n");
|
|
24
26
|
|
|
25
|
-
styleInject("
|
|
27
|
+
styleInject("[data-slice-theme-scope] {\n\t--motion-magnet: cubic-bezier(0.352, 0.003, 0.993, -0.052);\n\t--motion-water: cubic-bezier(0.36, 0, 0.64, 1);\n\t--motion-spring: linear(\n\t\t0,\n\t\t0.002 0.2%,\n\t\t0.011 0.5%,\n\t\t0.041 1%,\n\t\t0.1 1.6%,\n\t\t0.18 2.2%,\n\t\t0.365 3.3%,\n\t\t0.925 6.2%,\n\t\t1.058 7%,\n\t\t1.17 7.8%,\n\t\t1.26 8.6%,\n\t\t1.318 9.3%,\n\t\t1.342 9.7%,\n\t\t1.36 10.1%,\n\t\t1.372 10.5%,\n\t\t1.378 10.9%,\n\t\t1.378 11.4%,\n\t\t1.374 11.7%,\n\t\t1.368 12%,\n\t\t1.348 12.6%,\n\t\t1.314 13.3%,\n\t\t1.237 14.5%,\n\t\t1.026 17.4%,\n\t\t0.975 18.2%,\n\t\t0.933 19%,\n\t\t0.9 19.8%,\n\t\t0.878 20.5%,\n\t\t0.864 21.2%,\n\t\t0.859 21.6%,\n\t\t0.857 22%,\n\t\t0.856 22.5%,\n\t\t0.86 23.1%,\n\t\t0.867 23.7%,\n\t\t0.88 24.4%,\n\t\t0.909 25.6%,\n\t\t0.991 28.6%,\n\t\t1.01 29.4%,\n\t\t1.026 30.2%,\n\t\t1.037 30.9%,\n\t\t1.046 31.6%,\n\t\t1.051 32.3%,\n\t\t1.054 33.1%,\n\t\t1.053 34.2%,\n\t\t1.046 35.5%,\n\t\t1.035 36.7%,\n\t\t1.003 39.8%,\n\t\t0.99 41.4%,\n\t\t0.983 42.8%,\n\t\t0.979 44.2%,\n\t\t0.982 46.3%,\n\t\t1.002 52%,\n\t\t1.006 53.6%,\n\t\t1.008 55.2%,\n\t\t1.007 57.5%,\n\t\t0.999 63.1%,\n\t\t0.997 66.3%,\n\t\t1.001 77.2%,\n\t\t1 88.2%,\n\t\t1\n\t);\n\t--motion-magnet-duration: 0.5s;\n\t--motion-water-duration: 0.25s;\n\t--motion-spring-duration: 1s;\n}\n");
|
|
26
28
|
|
|
27
29
|
const darkModeMediaQuery = globalThis.matchMedia("(prefers-color-scheme: dark)");
|
|
28
30
|
|
|
@@ -31,23 +33,26 @@ function ThemeProvider(props) {
|
|
|
31
33
|
return useEffect(() => {
|
|
32
34
|
if (theme) {
|
|
33
35
|
const newTheme = theme.includes("dark") ? darkTheme : lightTheme;
|
|
34
|
-
document.documentElement.dataset.
|
|
36
|
+
document.documentElement.dataset.sliceTheme = newTheme.name;
|
|
35
37
|
}
|
|
36
38
|
}, [ theme ]), useEffect(() => {
|
|
37
39
|
const handleSystemThemeChange = e => {
|
|
38
40
|
if (system) {
|
|
39
41
|
const autoTheme = e.matches ? darkTheme : lightTheme;
|
|
40
|
-
document.documentElement.dataset.
|
|
42
|
+
document.documentElement.dataset.sliceTheme = autoTheme.name;
|
|
41
43
|
}
|
|
42
44
|
};
|
|
43
45
|
if (system) {
|
|
44
46
|
const autoTheme = darkModeMediaQuery.matches ? darkTheme : lightTheme;
|
|
45
|
-
document.documentElement.dataset.
|
|
47
|
+
document.documentElement.dataset.sliceTheme = autoTheme.name;
|
|
46
48
|
}
|
|
47
49
|
return darkModeMediaQuery.addEventListener("change", handleSystemThemeChange), () => {
|
|
48
50
|
darkModeMediaQuery.removeEventListener("change", handleSystemThemeChange);
|
|
49
51
|
};
|
|
50
|
-
}, [ system ]),
|
|
52
|
+
}, [ system ]), jsx("div", {
|
|
53
|
+
"data-slice-theme-scope": !0,
|
|
54
|
+
children: children
|
|
55
|
+
});
|
|
51
56
|
}
|
|
52
57
|
|
|
53
58
|
export { ThemeProvider };
|
package/dist/esm/providers.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { l as localDBActions, u as useLocalDB, a as useLocalDBError, b as useLocalDBStore, c as useLocalDBValues, d as useManageLocalDB } from "../chunks/localDBStore-
|
|
1
|
+
export { l as localDBActions, u as useLocalDB, a as useLocalDBError, b as useLocalDBStore, c as useLocalDBValues, d as useManageLocalDB } from "../chunks/localDBStore-B4jkR5Jx.mjs";
|
|
2
2
|
|
|
3
3
|
import "../chunks/tslib.es6-c-7TIv71.mjs";
|
|
4
4
|
|
package/dist/esm/stores.mjs
CHANGED
|
@@ -6,7 +6,7 @@ export { g as getTip, t as tipActions, u as useTip, a as useTipActions, b as use
|
|
|
6
6
|
|
|
7
7
|
export { g as getToast, t as toastActions, u as useToast, a as useToastActions, b as useToastStore } from "./chunks/toastStore-D2PEIqCo.mjs";
|
|
8
8
|
|
|
9
|
-
export { l as localDBActions, u as useLocalDB, a as useLocalDBError, b as useLocalDBStore, c as useLocalDBValues, d as useManageLocalDB } from "./chunks/localDBStore-
|
|
9
|
+
export { l as localDBActions, u as useLocalDB, a as useLocalDBError, b as useLocalDBStore, c as useLocalDBValues, d as useManageLocalDB } from "./chunks/localDBStore-B4jkR5Jx.mjs";
|
|
10
10
|
|
|
11
11
|
export { u as useConnectionClose, a as useConnectionMessage, b as useIsConnected, c as useLastSSEMessage, d as useMessage, e as useSSE, f as useSSEActions, g as useSSEStore } from "./chunks/sseStore-2JIpEKfz.mjs";
|
|
12
12
|
|
|
@@ -5,11 +5,14 @@ export type AvatarBaseProps = {
|
|
|
5
5
|
frame?: number | string;
|
|
6
6
|
name?: string;
|
|
7
7
|
email?: string;
|
|
8
|
+
textColor?: string;
|
|
8
9
|
image?: string;
|
|
9
10
|
color?: string;
|
|
11
|
+
borderWidth?: number;
|
|
10
12
|
borderSize?: number;
|
|
11
13
|
borderColor?: string;
|
|
12
14
|
borderColorHover?: string;
|
|
15
|
+
backgroundColor?: string;
|
|
13
16
|
bgColor?: string;
|
|
14
17
|
fontSize?: number | string;
|
|
15
18
|
onToolTip?: (tip: ToolTip | null) => void;
|
|
@@ -6,13 +6,16 @@ export type AvatarInfo = {
|
|
|
6
6
|
image?: any;
|
|
7
7
|
avatar?: string;
|
|
8
8
|
email?: string;
|
|
9
|
+
textColor?: string;
|
|
9
10
|
color?: string;
|
|
11
|
+
backgroundColor?: string;
|
|
10
12
|
bgColor?: string;
|
|
11
13
|
};
|
|
12
14
|
export type AvatarGroupBaseProps = {
|
|
13
15
|
avatars?: AvatarInfo[] | null;
|
|
14
16
|
size?: number;
|
|
15
17
|
overlap?: number;
|
|
18
|
+
borderWidth?: number;
|
|
16
19
|
borderSize?: number;
|
|
17
20
|
borderColor?: string;
|
|
18
21
|
borderColorHover?: string;
|
|
@@ -18,10 +18,12 @@ export declare const Button: React.NamedExoticComponent<Omit<React.ButtonHTMLAtt
|
|
|
18
18
|
iconSize?: number;
|
|
19
19
|
borderRadius?: number;
|
|
20
20
|
iconColor?: string;
|
|
21
|
+
backgroundColor?: string;
|
|
22
|
+
backgroundColorDisabled?: string;
|
|
21
23
|
bgColor?: string;
|
|
22
24
|
bgColorDisabled?: string;
|
|
23
25
|
labelColor?: string;
|
|
24
|
-
labelSize?: "s" | "m" | "l";
|
|
26
|
+
labelSize?: "xs" | "s" | "m" | "l";
|
|
25
27
|
transition?: import("framer-motion").Transition;
|
|
26
28
|
variants?: import("framer-motion").Variants;
|
|
27
29
|
initial?: string;
|
|
@@ -54,10 +56,12 @@ export declare const Button: React.NamedExoticComponent<Omit<React.ButtonHTMLAtt
|
|
|
54
56
|
iconSize?: number;
|
|
55
57
|
borderRadius?: number;
|
|
56
58
|
iconColor?: string;
|
|
59
|
+
backgroundColor?: string;
|
|
60
|
+
backgroundColorDisabled?: string;
|
|
57
61
|
bgColor?: string;
|
|
58
62
|
bgColorDisabled?: string;
|
|
59
63
|
labelColor?: string;
|
|
60
|
-
labelSize?: "s" | "m" | "l";
|
|
64
|
+
labelSize?: "xs" | "s" | "m" | "l";
|
|
61
65
|
transition?: import("framer-motion").Transition;
|
|
62
66
|
variants?: import("framer-motion").Variants;
|
|
63
67
|
initial?: string;
|
|
@@ -18,10 +18,12 @@ type ButtonBaseProps = {
|
|
|
18
18
|
iconSize?: number;
|
|
19
19
|
borderRadius?: number;
|
|
20
20
|
iconColor?: string;
|
|
21
|
+
backgroundColor?: string;
|
|
22
|
+
backgroundColorDisabled?: string;
|
|
21
23
|
bgColor?: string;
|
|
22
24
|
bgColorDisabled?: string;
|
|
23
25
|
labelColor?: string;
|
|
24
|
-
labelSize?: 's' | 'm' | 'l';
|
|
26
|
+
labelSize?: 'xs' | 's' | 'm' | 'l';
|
|
25
27
|
transition?: Transition;
|
|
26
28
|
variants?: Variants;
|
|
27
29
|
initial?: string;
|
|
@@ -13,8 +13,12 @@ type ButtonBarBaseProps = {
|
|
|
13
13
|
toggle?: boolean;
|
|
14
14
|
selected?: number;
|
|
15
15
|
borderRadius?: number | string;
|
|
16
|
+
borderWidth?: number;
|
|
16
17
|
borderSize?: number;
|
|
17
18
|
borderColor?: string;
|
|
19
|
+
backgroundColor?: string;
|
|
20
|
+
backgroundColorHover?: string;
|
|
21
|
+
backgroundColorActive?: string;
|
|
18
22
|
bgColor?: string;
|
|
19
23
|
bgColorHover?: string;
|
|
20
24
|
bgColorActive?: string;
|
|
@@ -3,7 +3,7 @@ import type { ToolTip } from '../sharedTypes';
|
|
|
3
3
|
type ChipBaseProps = {
|
|
4
4
|
children?: React.ReactNode;
|
|
5
5
|
label?: string;
|
|
6
|
-
labelSize?: 's' | 'm' | 'l';
|
|
6
|
+
labelSize?: 'xs' | 's' | 'm' | 'l';
|
|
7
7
|
labelColor?: string;
|
|
8
8
|
labelColorHover?: string;
|
|
9
9
|
icon?: string;
|
|
@@ -11,17 +11,21 @@ type ChipBaseProps = {
|
|
|
11
11
|
iconPosition?: 'left' | 'right';
|
|
12
12
|
iconColor?: string;
|
|
13
13
|
iconColorHover?: string;
|
|
14
|
+
backgroundColor?: string;
|
|
15
|
+
backgroundColorHover?: string;
|
|
14
16
|
bgColor?: string;
|
|
15
17
|
bgColorHover?: string;
|
|
16
18
|
disabled?: boolean;
|
|
17
19
|
focused?: boolean;
|
|
18
20
|
tooltip?: string;
|
|
21
|
+
borderWidth?: number;
|
|
19
22
|
borderSize?: number;
|
|
20
23
|
borderColor?: string;
|
|
21
24
|
borderColorHover?: string;
|
|
22
25
|
borderColorDisabled?: string;
|
|
23
26
|
borderRadius?: number;
|
|
24
27
|
gap?: number;
|
|
28
|
+
paddingTop?: number;
|
|
25
29
|
paddingTops?: number;
|
|
26
30
|
paddingSides?: number;
|
|
27
31
|
onToolTip?: (tip: ToolTip | null) => void;
|
|
@@ -16,7 +16,9 @@ type DivInputBaseProps = {
|
|
|
16
16
|
textAlign?: 'left' | 'center' | 'right';
|
|
17
17
|
clamp?: number;
|
|
18
18
|
padding?: string;
|
|
19
|
+
borderRadius?: number;
|
|
19
20
|
radius?: number;
|
|
21
|
+
backgroundColor?: string;
|
|
20
22
|
bgColor?: string;
|
|
21
23
|
};
|
|
22
24
|
export type DivInputProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof DivInputBaseProps> & DivInputBaseProps;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type {
|
|
3
|
-
export
|
|
4
|
-
export declare const DropDown: React.MemoExoticComponent<(props: DropDownProps) => import("react/jsx-runtime").JSX.Element>;
|
|
2
|
+
import type { DropDownProps } from './_types';
|
|
3
|
+
export declare const DropDown: <T = string>(props: DropDownProps<T>) => React.JSX.Element;
|
|
@@ -1,34 +1,40 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
|
-
export type DropDownOption = {
|
|
2
|
+
export type DropDownOption<T = string> = {
|
|
3
3
|
label?: string;
|
|
4
|
-
value?:
|
|
4
|
+
value?: T;
|
|
5
5
|
alt?: string;
|
|
6
6
|
};
|
|
7
|
-
type DropDownBaseProps = {
|
|
7
|
+
type DropDownBaseProps<T = string> = {
|
|
8
8
|
name?: string;
|
|
9
|
-
|
|
9
|
+
label?: string;
|
|
10
|
+
labelColor?: string;
|
|
11
|
+
options?: DropDownOption<T>[];
|
|
10
12
|
selectedIndex?: number;
|
|
11
|
-
selectedValue?:
|
|
13
|
+
selectedValue?: T;
|
|
14
|
+
valueKey?: string;
|
|
12
15
|
placeholder?: boolean;
|
|
13
16
|
borderRadius?: number;
|
|
17
|
+
borderStyle?: 'bottom' | 'box' | 'none';
|
|
14
18
|
validate?: boolean;
|
|
15
19
|
iconColor?: string;
|
|
20
|
+
backgroundColor?: string;
|
|
16
21
|
bgColor?: string;
|
|
22
|
+
textColor?: string;
|
|
23
|
+
borderColor?: string;
|
|
24
|
+
borderWidth?: number;
|
|
25
|
+
borderSize?: number;
|
|
17
26
|
width?: string;
|
|
18
27
|
height?: string;
|
|
19
28
|
paddingLeft?: number | string;
|
|
20
29
|
paddingRight?: number | string;
|
|
21
|
-
|
|
30
|
+
paddingTop?: number | string;
|
|
31
|
+
paddingBottom?: number | string;
|
|
22
32
|
iconSize?: number;
|
|
23
33
|
disabled?: boolean;
|
|
24
|
-
|
|
25
|
-
focused?: boolean;
|
|
34
|
+
error?: boolean;
|
|
26
35
|
gap?: number;
|
|
27
|
-
size?: '
|
|
28
|
-
onChange?: (index: number, option: DropDownOption) => void;
|
|
29
|
-
onBlur?: (value: string) => void;
|
|
30
|
-
onValidate?: (state: boolean) => void;
|
|
31
|
-
onFocus?: () => void;
|
|
36
|
+
size?: 'xs' | 's' | 'm' | 'l';
|
|
37
|
+
onChange?: (index: number, option: DropDownOption<T>) => void;
|
|
32
38
|
};
|
|
33
|
-
export type DropDownProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof DropDownBaseProps
|
|
39
|
+
export type DropDownProps<T = string> = Omit<React.HTMLAttributes<HTMLDivElement>, keyof DropDownBaseProps<T>> & DropDownBaseProps<T>;
|
|
34
40
|
export {};
|
|
@@ -1,4 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type {
|
|
3
|
-
export type { ErrorMessage };
|
|
2
|
+
import type { ErrorSummaryProps } from './_types';
|
|
4
3
|
export declare const ErrorSummary: React.MemoExoticComponent<(props: ErrorSummaryProps) => import("react/jsx-runtime").JSX.Element>;
|
|
@@ -1,12 +1,15 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
2
|
export type ErrorMessage = {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
bullets?: string[];
|
|
3
|
+
title: string;
|
|
4
|
+
message?: string | string[];
|
|
6
5
|
};
|
|
7
6
|
type ErrorSummaryBaseProps = {
|
|
8
7
|
entries?: ErrorMessage[];
|
|
9
|
-
|
|
8
|
+
textColor?: string;
|
|
9
|
+
autoNumber?: boolean;
|
|
10
|
+
backgroundColor?: string;
|
|
11
|
+
bgColor?: string;
|
|
12
|
+
textSize?: 'xs' | 's' | 'm' | 'l';
|
|
10
13
|
};
|
|
11
14
|
export type ErrorSummaryProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof ErrorSummaryBaseProps> & ErrorSummaryBaseProps;
|
|
12
15
|
export {};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import type
|
|
1
|
+
import { type LabelProps } from './_types';
|
|
2
2
|
export declare function Label(props: Readonly<LabelProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,15 +1,25 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
|
+
export declare enum LabelBackground {
|
|
3
|
+
red = "red",
|
|
4
|
+
yellow = "yellow",
|
|
5
|
+
green = "green",
|
|
6
|
+
blue = "blue",
|
|
7
|
+
grey = "grey",
|
|
8
|
+
lightGrey = "lightGrey",
|
|
9
|
+
white = "white"
|
|
10
|
+
}
|
|
2
11
|
type LabelBaseProps = {
|
|
3
12
|
children?: React.ReactNode;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
13
|
+
label?: string;
|
|
14
|
+
backgroundColor?: LabelBackground | string;
|
|
15
|
+
bgColor?: LabelBackground | string;
|
|
16
|
+
borderWidth?: number;
|
|
17
|
+
borderSize?: number;
|
|
18
|
+
borderColor?: string;
|
|
19
|
+
borderRadius?: number;
|
|
9
20
|
padding?: number | string;
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
size?: 's' | 'm' | 'l';
|
|
21
|
+
textColor?: string;
|
|
22
|
+
textSize?: 'xs' | 's' | 'm' | 'l';
|
|
13
23
|
onClick?: (e: React.MouseEvent<any>) => void;
|
|
14
24
|
};
|
|
15
25
|
export type LabelProps = Omit<React.HTMLAttributes<HTMLElement>, keyof LabelBaseProps> & LabelBaseProps;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { RadioButtonProps } from './_types';
|
|
3
|
-
export declare const RadioButton:
|
|
3
|
+
export declare const RadioButton: <T = string>(props: RadioButtonProps<T>) => React.JSX.Element;
|