@common-origin/design-system 2.15.0 → 2.17.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/README.md +1 -1
- package/dist/client.esm.js +949 -649
- package/dist/client.esm.js.map +1 -1
- package/dist/client.js +951 -647
- package/dist/client.js.map +1 -1
- package/dist/components/atoms/Button/Button.d.ts +13 -1
- package/dist/components/atoms/CategoryBadge/CategoryBadge.d.ts +12 -52
- package/dist/components/atoms/CategoryBadge/index.d.ts +1 -1
- package/dist/components/atoms/CategoryLabel/CategoryLabel.d.ts +69 -0
- package/dist/components/atoms/CategoryLabel/index.d.ts +2 -0
- package/dist/components/atoms/Chip/BooleanChip.d.ts +6 -1
- package/dist/components/atoms/Chip/Chip.d.ts +17 -12
- package/dist/components/atoms/Chip/FilterChip.d.ts +10 -24
- package/dist/components/atoms/Chip/InputChip.d.ts +27 -0
- package/dist/components/atoms/Chip/index.d.ts +1 -0
- package/dist/components/atoms/Chip/shared/types.d.ts +15 -1
- package/dist/components/atoms/Chip/shared/utils.d.ts +1 -85
- package/dist/components/atoms/DateFormatter/DateFormatter.d.ts +11 -1
- package/dist/components/atoms/Icon/Icon.d.ts +11 -0
- package/dist/components/atoms/StatusBadge/StatusBadge.d.ts +9 -55
- package/dist/components/atoms/StatusBadge/index.d.ts +1 -1
- package/dist/components/atoms/StatusLabel/StatusLabel.d.ts +17 -0
- package/dist/components/atoms/StatusLabel/StatusLabelBase.d.ts +49 -0
- package/dist/components/atoms/StatusLabel/index.d.ts +2 -0
- package/dist/components/atoms/Tag/Tag.d.ts +5 -0
- package/dist/components/atoms/index.d.ts +2 -0
- package/dist/components/molecules/Alert/Alert.d.ts +15 -2
- package/dist/components/molecules/DateGroup/DateGroup.d.ts +4 -1
- package/dist/components/molecules/InlineAlert/InlineAlert.d.ts +54 -0
- package/dist/components/molecules/InlineAlert/index.d.ts +2 -0
- package/dist/components/molecules/List/List.d.ts +3 -2
- package/dist/components/molecules/List/ListContext.d.ts +6 -0
- package/dist/components/molecules/List/ListItem.d.ts +5 -4
- package/dist/components/molecules/Modal/Modal.d.ts +6 -2
- package/dist/components/molecules/TabBar/TabBar.d.ts +8 -5
- package/dist/components/molecules/index.d.ts +1 -0
- package/dist/data.esm.js +89 -11
- package/dist/data.esm.js.map +1 -1
- package/dist/data.js +89 -11
- package/dist/data.js.map +1 -1
- package/dist/index.esm.js +1 -1
- package/dist/index.js +4 -0
- package/dist/index.js.map +1 -1
- package/dist/styles/tokens.json +89 -11
- package/dist/tokens/index.esm.js +89 -11
- package/dist/tokens/index.esm.js.map +1 -1
- package/dist/tokens/index.js +89 -11
- package/dist/tokens/index.js.map +1 -1
- package/dist/tokens/types/tokens.d.ts +81 -3
- package/dist/tokens.css +769 -0
- package/dist/tokens.css.d.ts +4 -0
- package/dist/types/tokens.d.ts +81 -3
- package/package.json +18 -6
package/dist/tokens/index.esm.js
CHANGED
|
@@ -106,6 +106,7 @@ var base = {
|
|
|
106
106
|
fit: "fit-content"
|
|
107
107
|
},
|
|
108
108
|
color: {
|
|
109
|
+
transparent: "transparent",
|
|
109
110
|
neutral: {
|
|
110
111
|
"100": "#f8f9fa",
|
|
111
112
|
"200": "#e9ecef",
|
|
@@ -326,8 +327,7 @@ var base = {
|
|
|
326
327
|
easeInBack: "cubic-bezier(0.36, 0, 0.66, -0.56)",
|
|
327
328
|
easeOutBack: "cubic-bezier(0.34, 1.56, 0.64, 1)",
|
|
328
329
|
easeInOutBack: "cubic-bezier(0.68, -0.6, 0.32, 1.6)"
|
|
329
|
-
}
|
|
330
|
-
$ref: "./base/index.json"
|
|
330
|
+
}
|
|
331
331
|
};
|
|
332
332
|
var component = {
|
|
333
333
|
button: {
|
|
@@ -381,6 +381,20 @@ var component = {
|
|
|
381
381
|
textColor: "#adb5bd"
|
|
382
382
|
}
|
|
383
383
|
},
|
|
384
|
+
accent: {
|
|
385
|
+
backgroundColor: "#0265DC",
|
|
386
|
+
textColor: "#ffffff",
|
|
387
|
+
hover: {
|
|
388
|
+
backgroundColor: "#0054B6"
|
|
389
|
+
},
|
|
390
|
+
active: {
|
|
391
|
+
backgroundColor: "#004491"
|
|
392
|
+
},
|
|
393
|
+
disabled: {
|
|
394
|
+
backgroundColor: "#dee2e6",
|
|
395
|
+
textColor: "#adb5bd"
|
|
396
|
+
}
|
|
397
|
+
},
|
|
384
398
|
emphasis: {
|
|
385
399
|
backgroundColor: "#0265DC",
|
|
386
400
|
textColor: "#ffffff",
|
|
@@ -630,7 +644,7 @@ var component = {
|
|
|
630
644
|
"default": {
|
|
631
645
|
backgroundColor: "#ffffff",
|
|
632
646
|
textColor: "#212529",
|
|
633
|
-
borderColor: "#
|
|
647
|
+
borderColor: "#6c757d",
|
|
634
648
|
borderRadius: "0.25rem",
|
|
635
649
|
borderWidth: "0.0625rem",
|
|
636
650
|
paddingY: "11px",
|
|
@@ -638,7 +652,7 @@ var component = {
|
|
|
638
652
|
font: "400 1rem/1.5rem 'Inter', sans-serif"
|
|
639
653
|
},
|
|
640
654
|
placeholder: {
|
|
641
|
-
textColor: "#
|
|
655
|
+
textColor: "#495057"
|
|
642
656
|
},
|
|
643
657
|
hover: {
|
|
644
658
|
borderColor: "#343a40"
|
|
@@ -710,6 +724,42 @@ var component = {
|
|
|
710
724
|
}
|
|
711
725
|
},
|
|
712
726
|
alert: {
|
|
727
|
+
severity: {
|
|
728
|
+
error: {
|
|
729
|
+
background: "#FFEBE7",
|
|
730
|
+
text: "#D31510"
|
|
731
|
+
},
|
|
732
|
+
warning: {
|
|
733
|
+
background: "#FFECCC",
|
|
734
|
+
text: "#B14C00"
|
|
735
|
+
},
|
|
736
|
+
info: {
|
|
737
|
+
background: "#E0F2FF",
|
|
738
|
+
text: "#0265DC"
|
|
739
|
+
},
|
|
740
|
+
success: {
|
|
741
|
+
background: "#CEF8E0",
|
|
742
|
+
text: "#007A4D"
|
|
743
|
+
}
|
|
744
|
+
},
|
|
745
|
+
appearance: {
|
|
746
|
+
outlined: {
|
|
747
|
+
borderColor: {
|
|
748
|
+
error: "#D31510",
|
|
749
|
+
warning: "#B14C00",
|
|
750
|
+
info: "#0265DC",
|
|
751
|
+
success: "#007A4D"
|
|
752
|
+
}
|
|
753
|
+
},
|
|
754
|
+
borderless: {
|
|
755
|
+
borderColor: {
|
|
756
|
+
error: "transparent",
|
|
757
|
+
warning: "transparent",
|
|
758
|
+
info: "transparent",
|
|
759
|
+
success: "transparent"
|
|
760
|
+
}
|
|
761
|
+
}
|
|
762
|
+
},
|
|
713
763
|
title: {
|
|
714
764
|
typography: "500 1.125rem/1.5rem 'Inter', sans-serif",
|
|
715
765
|
fontWeight: "600",
|
|
@@ -808,8 +858,7 @@ var component = {
|
|
|
808
858
|
},
|
|
809
859
|
transactionListItem: {
|
|
810
860
|
minHeight: "4.5rem"
|
|
811
|
-
}
|
|
812
|
-
$ref: "./component/index.json"
|
|
861
|
+
}
|
|
813
862
|
};
|
|
814
863
|
var semantic = {
|
|
815
864
|
elevation: {
|
|
@@ -896,12 +945,20 @@ var semantic = {
|
|
|
896
945
|
md: "35rem",
|
|
897
946
|
lg: "45rem"
|
|
898
947
|
},
|
|
948
|
+
label: {
|
|
949
|
+
small: "1.25rem",
|
|
950
|
+
medium: "1.5rem",
|
|
951
|
+
large: "2rem"
|
|
952
|
+
},
|
|
899
953
|
menu: {
|
|
900
954
|
maxHeight: "18.75rem"
|
|
901
955
|
},
|
|
902
956
|
dimension: {
|
|
903
957
|
"1": "0.25rem",
|
|
958
|
+
"2": "0.5rem",
|
|
959
|
+
"4": "1rem",
|
|
904
960
|
"5": "1.25rem",
|
|
961
|
+
"6": "1.5rem",
|
|
905
962
|
"8": "2rem",
|
|
906
963
|
"12": "3rem",
|
|
907
964
|
"15": "3.75rem",
|
|
@@ -974,6 +1031,8 @@ var semantic = {
|
|
|
974
1031
|
inverse: "#ffffff",
|
|
975
1032
|
disabled: "#adb5bd",
|
|
976
1033
|
interactive: "#0265DC",
|
|
1034
|
+
"interactive-hover": "#0054B6",
|
|
1035
|
+
"interactive-active": "#004491",
|
|
977
1036
|
error: "#D31510",
|
|
978
1037
|
success: "#007A4D",
|
|
979
1038
|
warning: "#B14C00"
|
|
@@ -982,19 +1041,29 @@ var semantic = {
|
|
|
982
1041
|
"default": "#f8f9fa",
|
|
983
1042
|
subtle: "#ffffff",
|
|
984
1043
|
emphasis: "#212529",
|
|
1044
|
+
"emphasis-hover": "#343a40",
|
|
1045
|
+
"emphasis-active": "#16191C",
|
|
985
1046
|
surface: "#e9ecef",
|
|
986
1047
|
inverse: "#343a40",
|
|
987
1048
|
interactive: "#0265DC",
|
|
988
1049
|
"interactive-subtle": "#E0F2FF",
|
|
1050
|
+
"interactive-subtle-hover": "#CAE8FF",
|
|
1051
|
+
"interactive-subtle-active": "#B5DEFF",
|
|
989
1052
|
"interactive-hover": "#0054B6",
|
|
990
1053
|
"interactive-active": "#004491",
|
|
991
1054
|
error: "#D31510",
|
|
1055
|
+
"error-hover": "#B40000",
|
|
1056
|
+
"error-active": "#930000",
|
|
992
1057
|
"error-subtle": "#FFEBE7",
|
|
993
1058
|
success: "#007A4D",
|
|
994
1059
|
"success-subtle": "#CEF8E0",
|
|
995
1060
|
warning: "#B14C00",
|
|
996
1061
|
"warning-subtle": "#FFECCC",
|
|
997
1062
|
disabled: "#dee2e6",
|
|
1063
|
+
neutral: "#dee2e6",
|
|
1064
|
+
"neutral-hover": "#ced4da",
|
|
1065
|
+
"neutral-active": "#adb5bd",
|
|
1066
|
+
transparent: "transparent",
|
|
998
1067
|
progressTrack: "#dee2e6",
|
|
999
1068
|
page: "#f8f9fa",
|
|
1000
1069
|
overlay: "rgba(33, 37, 41, 0.5)",
|
|
@@ -1005,11 +1074,13 @@ var semantic = {
|
|
|
1005
1074
|
border: {
|
|
1006
1075
|
"default": "#e9ecef",
|
|
1007
1076
|
subtle: "#dee2e6",
|
|
1077
|
+
control: "#6c757d",
|
|
1008
1078
|
strong: "#343a40",
|
|
1009
1079
|
interactive: "#0265DC",
|
|
1010
1080
|
error: "#D31510",
|
|
1011
1081
|
success: "#007A4D",
|
|
1012
|
-
warning: "#B14C00"
|
|
1082
|
+
warning: "#B14C00",
|
|
1083
|
+
none: "transparent"
|
|
1013
1084
|
},
|
|
1014
1085
|
icon: {
|
|
1015
1086
|
"default": "#212529",
|
|
@@ -1056,10 +1127,18 @@ var semantic = {
|
|
|
1056
1127
|
"orange-subtle": "#FFECCC",
|
|
1057
1128
|
gray: "#495057",
|
|
1058
1129
|
"gray-emphasis": "#212529",
|
|
1059
|
-
"gray-subtle": "#e9ecef"
|
|
1130
|
+
"gray-subtle": "#e9ecef",
|
|
1131
|
+
"blue-text": "#0265DC",
|
|
1132
|
+
"purple-text": "#7E2EBD",
|
|
1133
|
+
"pink-text": "#B90064",
|
|
1134
|
+
"yellow-text": "#825800",
|
|
1135
|
+
"green-text": "#007A4D",
|
|
1136
|
+
"red-text": "#D31510",
|
|
1137
|
+
"orange-text": "#B14C00",
|
|
1138
|
+
"gray-text": "#212529"
|
|
1060
1139
|
},
|
|
1061
1140
|
status: {
|
|
1062
|
-
pending: "#
|
|
1141
|
+
pending: "#825800",
|
|
1063
1142
|
"pending-bg": "#FFF3D6",
|
|
1064
1143
|
completed: "#007A4D",
|
|
1065
1144
|
"completed-bg": "#CEF8E0",
|
|
@@ -1110,8 +1189,7 @@ var semantic = {
|
|
|
1110
1189
|
hover: "background-color 150ms ease-out, color 150ms ease-out",
|
|
1111
1190
|
focus: "outline 150ms ease-out, outline-offset 150ms ease-out",
|
|
1112
1191
|
interactive: "transform 150ms ease-out, opacity 150ms ease-out"
|
|
1113
|
-
}
|
|
1114
|
-
$ref: "./semantic/index.json"
|
|
1192
|
+
}
|
|
1115
1193
|
};
|
|
1116
1194
|
var tokensJson = {
|
|
1117
1195
|
base: base,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":["../../src/types/tokens.ts","../../src/tokens.ts"],"sourcesContent":["import tokensJson from '../styles/tokens.json'\n\n// Re-declared as a const so emitted .d.ts files inline the token shape instead of importing JSON,\n// which consumers can only resolve with `resolveJsonModule`.\nexport const tokens = tokensJson\n\nexport type Tokens = typeof tokens\nexport type TokensBase = Tokens['base']\nexport type TokensSemantic = Tokens['semantic']\nexport type TokensComponent = Tokens['component']\n","// Tokens-only export for standalone usage\nimport { tokens } from './types/tokens'\n\nexport { tokens }\nexport default tokens\n\nexport type {\n Tokens,\n TokensBase,\n TokensSemantic,\n TokensComponent\n} from './types/tokens'\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../../src/types/tokens.ts","../../src/tokens.ts"],"sourcesContent":["import tokensJson from '../styles/tokens.json'\n\n// Re-declared as a const so emitted .d.ts files inline the token shape instead of importing JSON,\n// which consumers can only resolve with `resolveJsonModule`.\nexport const tokens = tokensJson\n\nexport type Tokens = typeof tokens\nexport type TokensBase = Tokens['base']\nexport type TokensSemantic = Tokens['semantic']\nexport type TokensComponent = Tokens['component']\n","// Tokens-only export for standalone usage\nimport { tokens } from './types/tokens'\n\nexport { tokens }\nexport default tokens\n\nexport type {\n Tokens,\n TokensBase,\n TokensSemantic,\n TokensComponent\n} from './types/tokens'\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACO,IAAM,MAAM,GAAG;;ACJtB;;;;"}
|
package/dist/tokens/index.js
CHANGED
|
@@ -110,6 +110,7 @@ var base = {
|
|
|
110
110
|
fit: "fit-content"
|
|
111
111
|
},
|
|
112
112
|
color: {
|
|
113
|
+
transparent: "transparent",
|
|
113
114
|
neutral: {
|
|
114
115
|
"100": "#f8f9fa",
|
|
115
116
|
"200": "#e9ecef",
|
|
@@ -330,8 +331,7 @@ var base = {
|
|
|
330
331
|
easeInBack: "cubic-bezier(0.36, 0, 0.66, -0.56)",
|
|
331
332
|
easeOutBack: "cubic-bezier(0.34, 1.56, 0.64, 1)",
|
|
332
333
|
easeInOutBack: "cubic-bezier(0.68, -0.6, 0.32, 1.6)"
|
|
333
|
-
}
|
|
334
|
-
$ref: "./base/index.json"
|
|
334
|
+
}
|
|
335
335
|
};
|
|
336
336
|
var component = {
|
|
337
337
|
button: {
|
|
@@ -385,6 +385,20 @@ var component = {
|
|
|
385
385
|
textColor: "#adb5bd"
|
|
386
386
|
}
|
|
387
387
|
},
|
|
388
|
+
accent: {
|
|
389
|
+
backgroundColor: "#0265DC",
|
|
390
|
+
textColor: "#ffffff",
|
|
391
|
+
hover: {
|
|
392
|
+
backgroundColor: "#0054B6"
|
|
393
|
+
},
|
|
394
|
+
active: {
|
|
395
|
+
backgroundColor: "#004491"
|
|
396
|
+
},
|
|
397
|
+
disabled: {
|
|
398
|
+
backgroundColor: "#dee2e6",
|
|
399
|
+
textColor: "#adb5bd"
|
|
400
|
+
}
|
|
401
|
+
},
|
|
388
402
|
emphasis: {
|
|
389
403
|
backgroundColor: "#0265DC",
|
|
390
404
|
textColor: "#ffffff",
|
|
@@ -634,7 +648,7 @@ var component = {
|
|
|
634
648
|
"default": {
|
|
635
649
|
backgroundColor: "#ffffff",
|
|
636
650
|
textColor: "#212529",
|
|
637
|
-
borderColor: "#
|
|
651
|
+
borderColor: "#6c757d",
|
|
638
652
|
borderRadius: "0.25rem",
|
|
639
653
|
borderWidth: "0.0625rem",
|
|
640
654
|
paddingY: "11px",
|
|
@@ -642,7 +656,7 @@ var component = {
|
|
|
642
656
|
font: "400 1rem/1.5rem 'Inter', sans-serif"
|
|
643
657
|
},
|
|
644
658
|
placeholder: {
|
|
645
|
-
textColor: "#
|
|
659
|
+
textColor: "#495057"
|
|
646
660
|
},
|
|
647
661
|
hover: {
|
|
648
662
|
borderColor: "#343a40"
|
|
@@ -714,6 +728,42 @@ var component = {
|
|
|
714
728
|
}
|
|
715
729
|
},
|
|
716
730
|
alert: {
|
|
731
|
+
severity: {
|
|
732
|
+
error: {
|
|
733
|
+
background: "#FFEBE7",
|
|
734
|
+
text: "#D31510"
|
|
735
|
+
},
|
|
736
|
+
warning: {
|
|
737
|
+
background: "#FFECCC",
|
|
738
|
+
text: "#B14C00"
|
|
739
|
+
},
|
|
740
|
+
info: {
|
|
741
|
+
background: "#E0F2FF",
|
|
742
|
+
text: "#0265DC"
|
|
743
|
+
},
|
|
744
|
+
success: {
|
|
745
|
+
background: "#CEF8E0",
|
|
746
|
+
text: "#007A4D"
|
|
747
|
+
}
|
|
748
|
+
},
|
|
749
|
+
appearance: {
|
|
750
|
+
outlined: {
|
|
751
|
+
borderColor: {
|
|
752
|
+
error: "#D31510",
|
|
753
|
+
warning: "#B14C00",
|
|
754
|
+
info: "#0265DC",
|
|
755
|
+
success: "#007A4D"
|
|
756
|
+
}
|
|
757
|
+
},
|
|
758
|
+
borderless: {
|
|
759
|
+
borderColor: {
|
|
760
|
+
error: "transparent",
|
|
761
|
+
warning: "transparent",
|
|
762
|
+
info: "transparent",
|
|
763
|
+
success: "transparent"
|
|
764
|
+
}
|
|
765
|
+
}
|
|
766
|
+
},
|
|
717
767
|
title: {
|
|
718
768
|
typography: "500 1.125rem/1.5rem 'Inter', sans-serif",
|
|
719
769
|
fontWeight: "600",
|
|
@@ -812,8 +862,7 @@ var component = {
|
|
|
812
862
|
},
|
|
813
863
|
transactionListItem: {
|
|
814
864
|
minHeight: "4.5rem"
|
|
815
|
-
}
|
|
816
|
-
$ref: "./component/index.json"
|
|
865
|
+
}
|
|
817
866
|
};
|
|
818
867
|
var semantic = {
|
|
819
868
|
elevation: {
|
|
@@ -900,12 +949,20 @@ var semantic = {
|
|
|
900
949
|
md: "35rem",
|
|
901
950
|
lg: "45rem"
|
|
902
951
|
},
|
|
952
|
+
label: {
|
|
953
|
+
small: "1.25rem",
|
|
954
|
+
medium: "1.5rem",
|
|
955
|
+
large: "2rem"
|
|
956
|
+
},
|
|
903
957
|
menu: {
|
|
904
958
|
maxHeight: "18.75rem"
|
|
905
959
|
},
|
|
906
960
|
dimension: {
|
|
907
961
|
"1": "0.25rem",
|
|
962
|
+
"2": "0.5rem",
|
|
963
|
+
"4": "1rem",
|
|
908
964
|
"5": "1.25rem",
|
|
965
|
+
"6": "1.5rem",
|
|
909
966
|
"8": "2rem",
|
|
910
967
|
"12": "3rem",
|
|
911
968
|
"15": "3.75rem",
|
|
@@ -978,6 +1035,8 @@ var semantic = {
|
|
|
978
1035
|
inverse: "#ffffff",
|
|
979
1036
|
disabled: "#adb5bd",
|
|
980
1037
|
interactive: "#0265DC",
|
|
1038
|
+
"interactive-hover": "#0054B6",
|
|
1039
|
+
"interactive-active": "#004491",
|
|
981
1040
|
error: "#D31510",
|
|
982
1041
|
success: "#007A4D",
|
|
983
1042
|
warning: "#B14C00"
|
|
@@ -986,19 +1045,29 @@ var semantic = {
|
|
|
986
1045
|
"default": "#f8f9fa",
|
|
987
1046
|
subtle: "#ffffff",
|
|
988
1047
|
emphasis: "#212529",
|
|
1048
|
+
"emphasis-hover": "#343a40",
|
|
1049
|
+
"emphasis-active": "#16191C",
|
|
989
1050
|
surface: "#e9ecef",
|
|
990
1051
|
inverse: "#343a40",
|
|
991
1052
|
interactive: "#0265DC",
|
|
992
1053
|
"interactive-subtle": "#E0F2FF",
|
|
1054
|
+
"interactive-subtle-hover": "#CAE8FF",
|
|
1055
|
+
"interactive-subtle-active": "#B5DEFF",
|
|
993
1056
|
"interactive-hover": "#0054B6",
|
|
994
1057
|
"interactive-active": "#004491",
|
|
995
1058
|
error: "#D31510",
|
|
1059
|
+
"error-hover": "#B40000",
|
|
1060
|
+
"error-active": "#930000",
|
|
996
1061
|
"error-subtle": "#FFEBE7",
|
|
997
1062
|
success: "#007A4D",
|
|
998
1063
|
"success-subtle": "#CEF8E0",
|
|
999
1064
|
warning: "#B14C00",
|
|
1000
1065
|
"warning-subtle": "#FFECCC",
|
|
1001
1066
|
disabled: "#dee2e6",
|
|
1067
|
+
neutral: "#dee2e6",
|
|
1068
|
+
"neutral-hover": "#ced4da",
|
|
1069
|
+
"neutral-active": "#adb5bd",
|
|
1070
|
+
transparent: "transparent",
|
|
1002
1071
|
progressTrack: "#dee2e6",
|
|
1003
1072
|
page: "#f8f9fa",
|
|
1004
1073
|
overlay: "rgba(33, 37, 41, 0.5)",
|
|
@@ -1009,11 +1078,13 @@ var semantic = {
|
|
|
1009
1078
|
border: {
|
|
1010
1079
|
"default": "#e9ecef",
|
|
1011
1080
|
subtle: "#dee2e6",
|
|
1081
|
+
control: "#6c757d",
|
|
1012
1082
|
strong: "#343a40",
|
|
1013
1083
|
interactive: "#0265DC",
|
|
1014
1084
|
error: "#D31510",
|
|
1015
1085
|
success: "#007A4D",
|
|
1016
|
-
warning: "#B14C00"
|
|
1086
|
+
warning: "#B14C00",
|
|
1087
|
+
none: "transparent"
|
|
1017
1088
|
},
|
|
1018
1089
|
icon: {
|
|
1019
1090
|
"default": "#212529",
|
|
@@ -1060,10 +1131,18 @@ var semantic = {
|
|
|
1060
1131
|
"orange-subtle": "#FFECCC",
|
|
1061
1132
|
gray: "#495057",
|
|
1062
1133
|
"gray-emphasis": "#212529",
|
|
1063
|
-
"gray-subtle": "#e9ecef"
|
|
1134
|
+
"gray-subtle": "#e9ecef",
|
|
1135
|
+
"blue-text": "#0265DC",
|
|
1136
|
+
"purple-text": "#7E2EBD",
|
|
1137
|
+
"pink-text": "#B90064",
|
|
1138
|
+
"yellow-text": "#825800",
|
|
1139
|
+
"green-text": "#007A4D",
|
|
1140
|
+
"red-text": "#D31510",
|
|
1141
|
+
"orange-text": "#B14C00",
|
|
1142
|
+
"gray-text": "#212529"
|
|
1064
1143
|
},
|
|
1065
1144
|
status: {
|
|
1066
|
-
pending: "#
|
|
1145
|
+
pending: "#825800",
|
|
1067
1146
|
"pending-bg": "#FFF3D6",
|
|
1068
1147
|
completed: "#007A4D",
|
|
1069
1148
|
"completed-bg": "#CEF8E0",
|
|
@@ -1114,8 +1193,7 @@ var semantic = {
|
|
|
1114
1193
|
hover: "background-color 150ms ease-out, color 150ms ease-out",
|
|
1115
1194
|
focus: "outline 150ms ease-out, outline-offset 150ms ease-out",
|
|
1116
1195
|
interactive: "transform 150ms ease-out, opacity 150ms ease-out"
|
|
1117
|
-
}
|
|
1118
|
-
$ref: "./semantic/index.json"
|
|
1196
|
+
}
|
|
1119
1197
|
};
|
|
1120
1198
|
var tokensJson = {
|
|
1121
1199
|
base: base,
|
package/dist/tokens/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/types/tokens.ts","../../src/tokens.ts"],"sourcesContent":["import tokensJson from '../styles/tokens.json'\n\n// Re-declared as a const so emitted .d.ts files inline the token shape instead of importing JSON,\n// which consumers can only resolve with `resolveJsonModule`.\nexport const tokens = tokensJson\n\nexport type Tokens = typeof tokens\nexport type TokensBase = Tokens['base']\nexport type TokensSemantic = Tokens['semantic']\nexport type TokensComponent = Tokens['component']\n","// Tokens-only export for standalone usage\nimport { tokens } from './types/tokens'\n\nexport { tokens }\nexport default tokens\n\nexport type {\n Tokens,\n TokensBase,\n TokensSemantic,\n TokensComponent\n} from './types/tokens'\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/types/tokens.ts","../../src/tokens.ts"],"sourcesContent":["import tokensJson from '../styles/tokens.json'\n\n// Re-declared as a const so emitted .d.ts files inline the token shape instead of importing JSON,\n// which consumers can only resolve with `resolveJsonModule`.\nexport const tokens = tokensJson\n\nexport type Tokens = typeof tokens\nexport type TokensBase = Tokens['base']\nexport type TokensSemantic = Tokens['semantic']\nexport type TokensComponent = Tokens['component']\n","// Tokens-only export for standalone usage\nimport { tokens } from './types/tokens'\n\nexport { tokens }\nexport default tokens\n\nexport type {\n Tokens,\n TokensBase,\n TokensSemantic,\n TokensComponent\n} from './types/tokens'\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACO,IAAM,MAAM,GAAG;;ACJtB;;;;;"}
|
|
@@ -107,6 +107,7 @@ export declare const tokens: {
|
|
|
107
107
|
fit: string;
|
|
108
108
|
};
|
|
109
109
|
color: {
|
|
110
|
+
transparent: string;
|
|
110
111
|
neutral: {
|
|
111
112
|
"100": string;
|
|
112
113
|
"200": string;
|
|
@@ -328,7 +329,6 @@ export declare const tokens: {
|
|
|
328
329
|
easeOutBack: string;
|
|
329
330
|
easeInOutBack: string;
|
|
330
331
|
};
|
|
331
|
-
$ref: string;
|
|
332
332
|
};
|
|
333
333
|
component: {
|
|
334
334
|
button: {
|
|
@@ -382,6 +382,20 @@ export declare const tokens: {
|
|
|
382
382
|
textColor: string;
|
|
383
383
|
};
|
|
384
384
|
};
|
|
385
|
+
accent: {
|
|
386
|
+
backgroundColor: string;
|
|
387
|
+
textColor: string;
|
|
388
|
+
hover: {
|
|
389
|
+
backgroundColor: string;
|
|
390
|
+
};
|
|
391
|
+
active: {
|
|
392
|
+
backgroundColor: string;
|
|
393
|
+
};
|
|
394
|
+
disabled: {
|
|
395
|
+
backgroundColor: string;
|
|
396
|
+
textColor: string;
|
|
397
|
+
};
|
|
398
|
+
};
|
|
385
399
|
emphasis: {
|
|
386
400
|
backgroundColor: string;
|
|
387
401
|
textColor: string;
|
|
@@ -711,6 +725,42 @@ export declare const tokens: {
|
|
|
711
725
|
};
|
|
712
726
|
};
|
|
713
727
|
alert: {
|
|
728
|
+
severity: {
|
|
729
|
+
error: {
|
|
730
|
+
background: string;
|
|
731
|
+
text: string;
|
|
732
|
+
};
|
|
733
|
+
warning: {
|
|
734
|
+
background: string;
|
|
735
|
+
text: string;
|
|
736
|
+
};
|
|
737
|
+
info: {
|
|
738
|
+
background: string;
|
|
739
|
+
text: string;
|
|
740
|
+
};
|
|
741
|
+
success: {
|
|
742
|
+
background: string;
|
|
743
|
+
text: string;
|
|
744
|
+
};
|
|
745
|
+
};
|
|
746
|
+
appearance: {
|
|
747
|
+
outlined: {
|
|
748
|
+
borderColor: {
|
|
749
|
+
error: string;
|
|
750
|
+
warning: string;
|
|
751
|
+
info: string;
|
|
752
|
+
success: string;
|
|
753
|
+
};
|
|
754
|
+
};
|
|
755
|
+
borderless: {
|
|
756
|
+
borderColor: {
|
|
757
|
+
error: string;
|
|
758
|
+
warning: string;
|
|
759
|
+
info: string;
|
|
760
|
+
success: string;
|
|
761
|
+
};
|
|
762
|
+
};
|
|
763
|
+
};
|
|
714
764
|
title: {
|
|
715
765
|
typography: string;
|
|
716
766
|
fontWeight: string;
|
|
@@ -810,7 +860,6 @@ export declare const tokens: {
|
|
|
810
860
|
transactionListItem: {
|
|
811
861
|
minHeight: string;
|
|
812
862
|
};
|
|
813
|
-
$ref: string;
|
|
814
863
|
};
|
|
815
864
|
semantic: {
|
|
816
865
|
elevation: {
|
|
@@ -897,12 +946,20 @@ export declare const tokens: {
|
|
|
897
946
|
md: string;
|
|
898
947
|
lg: string;
|
|
899
948
|
};
|
|
949
|
+
label: {
|
|
950
|
+
small: string;
|
|
951
|
+
medium: string;
|
|
952
|
+
large: string;
|
|
953
|
+
};
|
|
900
954
|
menu: {
|
|
901
955
|
maxHeight: string;
|
|
902
956
|
};
|
|
903
957
|
dimension: {
|
|
904
958
|
"1": string;
|
|
959
|
+
"2": string;
|
|
960
|
+
"4": string;
|
|
905
961
|
"5": string;
|
|
962
|
+
"6": string;
|
|
906
963
|
"8": string;
|
|
907
964
|
"12": string;
|
|
908
965
|
"15": string;
|
|
@@ -975,6 +1032,8 @@ export declare const tokens: {
|
|
|
975
1032
|
inverse: string;
|
|
976
1033
|
disabled: string;
|
|
977
1034
|
interactive: string;
|
|
1035
|
+
"interactive-hover": string;
|
|
1036
|
+
"interactive-active": string;
|
|
978
1037
|
error: string;
|
|
979
1038
|
success: string;
|
|
980
1039
|
warning: string;
|
|
@@ -983,19 +1042,29 @@ export declare const tokens: {
|
|
|
983
1042
|
default: string;
|
|
984
1043
|
subtle: string;
|
|
985
1044
|
emphasis: string;
|
|
1045
|
+
"emphasis-hover": string;
|
|
1046
|
+
"emphasis-active": string;
|
|
986
1047
|
surface: string;
|
|
987
1048
|
inverse: string;
|
|
988
1049
|
interactive: string;
|
|
989
1050
|
"interactive-subtle": string;
|
|
1051
|
+
"interactive-subtle-hover": string;
|
|
1052
|
+
"interactive-subtle-active": string;
|
|
990
1053
|
"interactive-hover": string;
|
|
991
1054
|
"interactive-active": string;
|
|
992
1055
|
error: string;
|
|
1056
|
+
"error-hover": string;
|
|
1057
|
+
"error-active": string;
|
|
993
1058
|
"error-subtle": string;
|
|
994
1059
|
success: string;
|
|
995
1060
|
"success-subtle": string;
|
|
996
1061
|
warning: string;
|
|
997
1062
|
"warning-subtle": string;
|
|
998
1063
|
disabled: string;
|
|
1064
|
+
neutral: string;
|
|
1065
|
+
"neutral-hover": string;
|
|
1066
|
+
"neutral-active": string;
|
|
1067
|
+
transparent: string;
|
|
999
1068
|
progressTrack: string;
|
|
1000
1069
|
page: string;
|
|
1001
1070
|
overlay: string;
|
|
@@ -1006,11 +1075,13 @@ export declare const tokens: {
|
|
|
1006
1075
|
border: {
|
|
1007
1076
|
default: string;
|
|
1008
1077
|
subtle: string;
|
|
1078
|
+
control: string;
|
|
1009
1079
|
strong: string;
|
|
1010
1080
|
interactive: string;
|
|
1011
1081
|
error: string;
|
|
1012
1082
|
success: string;
|
|
1013
1083
|
warning: string;
|
|
1084
|
+
none: string;
|
|
1014
1085
|
};
|
|
1015
1086
|
icon: {
|
|
1016
1087
|
default: string;
|
|
@@ -1058,6 +1129,14 @@ export declare const tokens: {
|
|
|
1058
1129
|
gray: string;
|
|
1059
1130
|
"gray-emphasis": string;
|
|
1060
1131
|
"gray-subtle": string;
|
|
1132
|
+
"blue-text": string;
|
|
1133
|
+
"purple-text": string;
|
|
1134
|
+
"pink-text": string;
|
|
1135
|
+
"yellow-text": string;
|
|
1136
|
+
"green-text": string;
|
|
1137
|
+
"red-text": string;
|
|
1138
|
+
"orange-text": string;
|
|
1139
|
+
"gray-text": string;
|
|
1061
1140
|
};
|
|
1062
1141
|
status: {
|
|
1063
1142
|
pending: string;
|
|
@@ -1112,7 +1191,6 @@ export declare const tokens: {
|
|
|
1112
1191
|
focus: string;
|
|
1113
1192
|
interactive: string;
|
|
1114
1193
|
};
|
|
1115
|
-
$ref: string;
|
|
1116
1194
|
};
|
|
1117
1195
|
};
|
|
1118
1196
|
export type Tokens = typeof tokens;
|