@telus-uds/theme-koodo 3.12.0 → 3.14.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/build/android/schema.json +509 -380
- package/build/android/theme.json +311 -33
- package/build/ios/schema.json +509 -380
- package/build/ios/theme.json +311 -33
- package/build/rn/schema.json +509 -380
- package/build/rn/theme.js +171 -29
- package/package.json +4 -4
- package/theme.json +267 -32
package/build/ios/theme.json
CHANGED
|
@@ -34,6 +34,7 @@
|
|
|
34
34
|
"appearances": {
|
|
35
35
|
"background": {
|
|
36
36
|
"description": "Background colour of box. White if not specified.",
|
|
37
|
+
"type": "variant",
|
|
37
38
|
"values": [
|
|
38
39
|
"lightest",
|
|
39
40
|
"lighter",
|
|
@@ -917,13 +918,75 @@
|
|
|
917
918
|
}
|
|
918
919
|
},
|
|
919
920
|
"Card": {
|
|
920
|
-
"appearances": {
|
|
921
|
-
|
|
921
|
+
"appearances": {
|
|
922
|
+
"background": {
|
|
923
|
+
"description": "Defines background related attributes of Card",
|
|
924
|
+
"type": "variant",
|
|
925
|
+
"values": ["alternative", "subtle", "grid", "feature"]
|
|
926
|
+
}
|
|
927
|
+
},
|
|
928
|
+
"rules": [
|
|
929
|
+
{
|
|
930
|
+
"if": {
|
|
931
|
+
"background": "alternative"
|
|
932
|
+
},
|
|
933
|
+
"tokens": {
|
|
934
|
+
"backgroundColor": {
|
|
935
|
+
"red": 0.89804,
|
|
936
|
+
"green": 0.96863,
|
|
937
|
+
"blue": 0.98431,
|
|
938
|
+
"alpha": 1
|
|
939
|
+
}
|
|
940
|
+
}
|
|
941
|
+
},
|
|
942
|
+
{
|
|
943
|
+
"if": {
|
|
944
|
+
"background": "subtle"
|
|
945
|
+
},
|
|
946
|
+
"tokens": {
|
|
947
|
+
"backgroundColor": {
|
|
948
|
+
"red": 0.98039,
|
|
949
|
+
"green": 0.90196,
|
|
950
|
+
"blue": 0.95686,
|
|
951
|
+
"alpha": 1
|
|
952
|
+
},
|
|
953
|
+
"borderRadius": 8
|
|
954
|
+
}
|
|
955
|
+
},
|
|
956
|
+
{
|
|
957
|
+
"if": {
|
|
958
|
+
"background": "grid"
|
|
959
|
+
},
|
|
960
|
+
"tokens": {
|
|
961
|
+
"borderColor": {
|
|
962
|
+
"red": 0.00392,
|
|
963
|
+
"green": 0.41961,
|
|
964
|
+
"blue": 0.41569,
|
|
965
|
+
"alpha": 1
|
|
966
|
+
},
|
|
967
|
+
"borderRadius": 8,
|
|
968
|
+
"borderWidth": 1
|
|
969
|
+
}
|
|
970
|
+
},
|
|
971
|
+
{
|
|
972
|
+
"if": {
|
|
973
|
+
"background": "feature"
|
|
974
|
+
},
|
|
975
|
+
"tokens": {
|
|
976
|
+
"backgroundColor": {
|
|
977
|
+
"red": 0.97647,
|
|
978
|
+
"green": 0.96471,
|
|
979
|
+
"blue": 0.64706,
|
|
980
|
+
"alpha": 1
|
|
981
|
+
}
|
|
982
|
+
}
|
|
983
|
+
}
|
|
984
|
+
],
|
|
922
985
|
"tokens": {
|
|
923
986
|
"backgroundColor": {
|
|
924
|
-
"red":
|
|
925
|
-
"green":
|
|
926
|
-
"blue":
|
|
987
|
+
"red": 1,
|
|
988
|
+
"green": 1,
|
|
989
|
+
"blue": 1,
|
|
927
990
|
"alpha": 1
|
|
928
991
|
},
|
|
929
992
|
"borderColor": {
|
|
@@ -1127,7 +1190,47 @@
|
|
|
1127
1190
|
"type": "state"
|
|
1128
1191
|
}
|
|
1129
1192
|
},
|
|
1130
|
-
"rules": [
|
|
1193
|
+
"rules": [
|
|
1194
|
+
{
|
|
1195
|
+
"if": {
|
|
1196
|
+
"inactive": true
|
|
1197
|
+
},
|
|
1198
|
+
"tokens": {
|
|
1199
|
+
"inputBackgroundColor": {
|
|
1200
|
+
"red": 0.78824,
|
|
1201
|
+
"green": 0.78431,
|
|
1202
|
+
"blue": 0.78431,
|
|
1203
|
+
"alpha": 1
|
|
1204
|
+
},
|
|
1205
|
+
"inputBorderColor": {
|
|
1206
|
+
"red": 0,
|
|
1207
|
+
"green": 0,
|
|
1208
|
+
"blue": 0,
|
|
1209
|
+
"alpha": 0
|
|
1210
|
+
}
|
|
1211
|
+
}
|
|
1212
|
+
},
|
|
1213
|
+
{
|
|
1214
|
+
"if": {
|
|
1215
|
+
"checked": true,
|
|
1216
|
+
"inactive": true
|
|
1217
|
+
},
|
|
1218
|
+
"tokens": {
|
|
1219
|
+
"iconBackgroundColor": {
|
|
1220
|
+
"red": 0.78824,
|
|
1221
|
+
"green": 0.78431,
|
|
1222
|
+
"blue": 0.78431,
|
|
1223
|
+
"alpha": 1
|
|
1224
|
+
},
|
|
1225
|
+
"iconColor": {
|
|
1226
|
+
"red": 1,
|
|
1227
|
+
"green": 1,
|
|
1228
|
+
"blue": 1,
|
|
1229
|
+
"alpha": 1
|
|
1230
|
+
}
|
|
1231
|
+
}
|
|
1232
|
+
}
|
|
1233
|
+
],
|
|
1131
1234
|
"tokens": {
|
|
1132
1235
|
"containerBackgroundColor": {
|
|
1133
1236
|
"red": 0,
|
|
@@ -1879,6 +1982,11 @@
|
|
|
1879
1982
|
"values": [true],
|
|
1880
1983
|
"type": "state"
|
|
1881
1984
|
},
|
|
1985
|
+
"password": {
|
|
1986
|
+
"description": "Password masked or not",
|
|
1987
|
+
"type": "variant",
|
|
1988
|
+
"values": [true]
|
|
1989
|
+
},
|
|
1882
1990
|
"pressed": {
|
|
1883
1991
|
"description": "Applies while an interactive component is being physically pressed. Most visible on touchscreen taps; in React Native Web, this is visible on web mouse clicks only if the pressable is held down.",
|
|
1884
1992
|
"values": [true],
|
|
@@ -1893,6 +2001,73 @@
|
|
|
1893
2001
|
"tokens": {
|
|
1894
2002
|
"outerBorderGap": 0
|
|
1895
2003
|
}
|
|
2004
|
+
},
|
|
2005
|
+
{
|
|
2006
|
+
"if": {
|
|
2007
|
+
"password": true
|
|
2008
|
+
},
|
|
2009
|
+
"tokens": {
|
|
2010
|
+
"borderColor": {
|
|
2011
|
+
"red": 0,
|
|
2012
|
+
"green": 0,
|
|
2013
|
+
"blue": 0,
|
|
2014
|
+
"alpha": 0
|
|
2015
|
+
}
|
|
2016
|
+
}
|
|
2017
|
+
},
|
|
2018
|
+
{
|
|
2019
|
+
"if": {
|
|
2020
|
+
"password": true,
|
|
2021
|
+
"pressed": true
|
|
2022
|
+
},
|
|
2023
|
+
"tokens": {
|
|
2024
|
+
"backgroundColor": {
|
|
2025
|
+
"red": 0.00392,
|
|
2026
|
+
"green": 0.28235,
|
|
2027
|
+
"blue": 0.27843,
|
|
2028
|
+
"alpha": 1
|
|
2029
|
+
},
|
|
2030
|
+
"iconColor": {
|
|
2031
|
+
"red": 1,
|
|
2032
|
+
"green": 1,
|
|
2033
|
+
"blue": 1,
|
|
2034
|
+
"alpha": 1
|
|
2035
|
+
}
|
|
2036
|
+
}
|
|
2037
|
+
},
|
|
2038
|
+
{
|
|
2039
|
+
"if": {
|
|
2040
|
+
"inactive": true
|
|
2041
|
+
},
|
|
2042
|
+
"tokens": {
|
|
2043
|
+
"backgroundColor": {
|
|
2044
|
+
"red": 0,
|
|
2045
|
+
"green": 0,
|
|
2046
|
+
"blue": 0,
|
|
2047
|
+
"alpha": 0
|
|
2048
|
+
},
|
|
2049
|
+
"borderWidth": 0,
|
|
2050
|
+
"iconColor": {
|
|
2051
|
+
"red": 1,
|
|
2052
|
+
"green": 1,
|
|
2053
|
+
"blue": 1,
|
|
2054
|
+
"alpha": 1
|
|
2055
|
+
}
|
|
2056
|
+
}
|
|
2057
|
+
},
|
|
2058
|
+
{
|
|
2059
|
+
"if": {
|
|
2060
|
+
"inactive": true,
|
|
2061
|
+
"password": true
|
|
2062
|
+
},
|
|
2063
|
+
"tokens": {
|
|
2064
|
+
"iconColor": {
|
|
2065
|
+
"red": 0.78824,
|
|
2066
|
+
"green": 0.78431,
|
|
2067
|
+
"blue": 0.78431,
|
|
2068
|
+
"alpha": 1
|
|
2069
|
+
}
|
|
2070
|
+
}
|
|
1896
2071
|
}
|
|
1897
2072
|
],
|
|
1898
2073
|
"tokens": {
|
|
@@ -4493,6 +4668,11 @@
|
|
|
4493
4668
|
"values": [true],
|
|
4494
4669
|
"type": "state"
|
|
4495
4670
|
},
|
|
4671
|
+
"password": {
|
|
4672
|
+
"description": "capability that helps masking and unmasking text",
|
|
4673
|
+
"type": "variant",
|
|
4674
|
+
"values": [true]
|
|
4675
|
+
},
|
|
4496
4676
|
"validation": {
|
|
4497
4677
|
"description": "Validation states for form inputs",
|
|
4498
4678
|
"values": ["error", "success"],
|
|
@@ -4629,7 +4809,9 @@
|
|
|
4629
4809
|
"paddingBottom": 10,
|
|
4630
4810
|
"paddingLeft": 16,
|
|
4631
4811
|
"paddingRight": 16,
|
|
4632
|
-
"paddingTop": 10
|
|
4812
|
+
"paddingTop": 10,
|
|
4813
|
+
"passwordHideButtonIcon": "PaletteIconEyeMasked",
|
|
4814
|
+
"passwordShowButtonIcon": "PaletteIconEyeUnmasked"
|
|
4633
4815
|
}
|
|
4634
4816
|
},
|
|
4635
4817
|
"Timeline": {
|
|
@@ -4975,6 +5157,11 @@
|
|
|
4975
5157
|
"type": "variant",
|
|
4976
5158
|
"values": ["red"]
|
|
4977
5159
|
},
|
|
5160
|
+
"compact": {
|
|
5161
|
+
"description": "Reduces line height on some body text styles. For data-rich content, not for flow content",
|
|
5162
|
+
"type": "variant",
|
|
5163
|
+
"values": [true]
|
|
5164
|
+
},
|
|
4978
5165
|
"inverse": {
|
|
4979
5166
|
"description": "Styles the link white for use on dark backgrounds.",
|
|
4980
5167
|
"type": "variant",
|
|
@@ -4982,7 +5169,20 @@
|
|
|
4982
5169
|
},
|
|
4983
5170
|
"size": {
|
|
4984
5171
|
"type": "variant",
|
|
4985
|
-
"values": [
|
|
5172
|
+
"values": [
|
|
5173
|
+
"micro",
|
|
5174
|
+
"small",
|
|
5175
|
+
"medium",
|
|
5176
|
+
"large",
|
|
5177
|
+
"h1",
|
|
5178
|
+
"h2",
|
|
5179
|
+
"h3",
|
|
5180
|
+
"h4",
|
|
5181
|
+
"h5",
|
|
5182
|
+
"h6",
|
|
5183
|
+
"display1",
|
|
5184
|
+
"display2"
|
|
5185
|
+
]
|
|
4986
5186
|
},
|
|
4987
5187
|
"viewport": {
|
|
4988
5188
|
"description": "The size label for the current screen viewport based on the current screen width",
|
|
@@ -5020,7 +5220,34 @@
|
|
|
5020
5220
|
},
|
|
5021
5221
|
"tokens": {
|
|
5022
5222
|
"fontSize": 20,
|
|
5023
|
-
"lineHeight": 1.
|
|
5223
|
+
"lineHeight": 1.4
|
|
5224
|
+
}
|
|
5225
|
+
},
|
|
5226
|
+
{
|
|
5227
|
+
"if": {
|
|
5228
|
+
"compact": true,
|
|
5229
|
+
"size": "large"
|
|
5230
|
+
},
|
|
5231
|
+
"tokens": {
|
|
5232
|
+
"lineHeight": 1.2
|
|
5233
|
+
}
|
|
5234
|
+
},
|
|
5235
|
+
{
|
|
5236
|
+
"if": {
|
|
5237
|
+
"size": "medium"
|
|
5238
|
+
},
|
|
5239
|
+
"tokens": {
|
|
5240
|
+
"fontSize": 16,
|
|
5241
|
+
"lineHeight": 1.5
|
|
5242
|
+
}
|
|
5243
|
+
},
|
|
5244
|
+
{
|
|
5245
|
+
"if": {
|
|
5246
|
+
"compact": true,
|
|
5247
|
+
"size": "medium"
|
|
5248
|
+
},
|
|
5249
|
+
"tokens": {
|
|
5250
|
+
"lineHeight": 1.25
|
|
5024
5251
|
}
|
|
5025
5252
|
},
|
|
5026
5253
|
{
|
|
@@ -5029,28 +5256,76 @@
|
|
|
5029
5256
|
},
|
|
5030
5257
|
"tokens": {
|
|
5031
5258
|
"fontSize": 14,
|
|
5032
|
-
"lineHeight": 1.
|
|
5259
|
+
"lineHeight": 1.42857142857
|
|
5260
|
+
}
|
|
5261
|
+
},
|
|
5262
|
+
{
|
|
5263
|
+
"if": {
|
|
5264
|
+
"compact": true,
|
|
5265
|
+
"size": "small"
|
|
5266
|
+
},
|
|
5267
|
+
"tokens": {
|
|
5268
|
+
"lineHeight": 1.14285714286
|
|
5269
|
+
}
|
|
5270
|
+
},
|
|
5271
|
+
{
|
|
5272
|
+
"if": {
|
|
5273
|
+
"size": "micro"
|
|
5274
|
+
},
|
|
5275
|
+
"tokens": {
|
|
5276
|
+
"fontSize": 12,
|
|
5277
|
+
"lineHeight": 1.33333333333
|
|
5278
|
+
}
|
|
5279
|
+
},
|
|
5280
|
+
{
|
|
5281
|
+
"if": {
|
|
5282
|
+
"compact": true,
|
|
5283
|
+
"size": "micro"
|
|
5284
|
+
},
|
|
5285
|
+
"tokens": {
|
|
5286
|
+
"lineHeight": 1.33333333333
|
|
5033
5287
|
}
|
|
5034
5288
|
},
|
|
5035
5289
|
{
|
|
5036
5290
|
"if": {
|
|
5037
|
-
"size": "
|
|
5291
|
+
"size": "display1"
|
|
5038
5292
|
},
|
|
5039
5293
|
"tokens": {
|
|
5040
5294
|
"fontName": "StagSans",
|
|
5041
|
-
"fontSize":
|
|
5295
|
+
"fontSize": 44,
|
|
5042
5296
|
"fontWeight": 700,
|
|
5297
|
+
"lineHeight": 1.22222222222
|
|
5298
|
+
}
|
|
5299
|
+
},
|
|
5300
|
+
{
|
|
5301
|
+
"if": {
|
|
5302
|
+
"size": "display1",
|
|
5303
|
+
"viewport": ["lg", "xl"]
|
|
5304
|
+
},
|
|
5305
|
+
"tokens": {
|
|
5306
|
+
"fontSize": 70,
|
|
5043
5307
|
"lineHeight": 1.2
|
|
5044
5308
|
}
|
|
5045
5309
|
},
|
|
5046
5310
|
{
|
|
5047
5311
|
"if": {
|
|
5048
|
-
"size": "
|
|
5312
|
+
"size": "display2"
|
|
5313
|
+
},
|
|
5314
|
+
"tokens": {
|
|
5315
|
+
"fontName": "StagSans",
|
|
5316
|
+
"fontSize": 36,
|
|
5317
|
+
"fontWeight": 700,
|
|
5318
|
+
"lineHeight": 1.22222222222
|
|
5319
|
+
}
|
|
5320
|
+
},
|
|
5321
|
+
{
|
|
5322
|
+
"if": {
|
|
5323
|
+
"size": "display2",
|
|
5049
5324
|
"viewport": ["lg", "xl"]
|
|
5050
5325
|
},
|
|
5051
5326
|
"tokens": {
|
|
5052
|
-
"fontSize":
|
|
5053
|
-
"lineHeight": 1.
|
|
5327
|
+
"fontSize": 54,
|
|
5328
|
+
"lineHeight": 1.14285714286
|
|
5054
5329
|
}
|
|
5055
5330
|
},
|
|
5056
5331
|
{
|
|
@@ -5059,9 +5334,9 @@
|
|
|
5059
5334
|
},
|
|
5060
5335
|
"tokens": {
|
|
5061
5336
|
"fontName": "StagSans",
|
|
5062
|
-
"fontSize":
|
|
5337
|
+
"fontSize": 34,
|
|
5063
5338
|
"fontWeight": 700,
|
|
5064
|
-
"lineHeight": 1.
|
|
5339
|
+
"lineHeight": 1.22222222222
|
|
5065
5340
|
}
|
|
5066
5341
|
},
|
|
5067
5342
|
{
|
|
@@ -5070,8 +5345,8 @@
|
|
|
5070
5345
|
"viewport": ["lg", "xl"]
|
|
5071
5346
|
},
|
|
5072
5347
|
"tokens": {
|
|
5073
|
-
"fontSize":
|
|
5074
|
-
"lineHeight": 1.
|
|
5348
|
+
"fontSize": 44,
|
|
5349
|
+
"lineHeight": 1.22222222222
|
|
5075
5350
|
}
|
|
5076
5351
|
},
|
|
5077
5352
|
{
|
|
@@ -5086,50 +5361,53 @@
|
|
|
5086
5361
|
"alpha": 1
|
|
5087
5362
|
},
|
|
5088
5363
|
"fontName": "StagSans",
|
|
5089
|
-
"fontSize":
|
|
5364
|
+
"fontSize": 32,
|
|
5090
5365
|
"fontWeight": 700,
|
|
5091
|
-
"lineHeight": 1.
|
|
5366
|
+
"lineHeight": 1.25
|
|
5092
5367
|
}
|
|
5093
5368
|
},
|
|
5094
5369
|
{
|
|
5095
5370
|
"if": {
|
|
5096
|
-
"size": "
|
|
5097
|
-
"viewport": ["lg", "xl"]
|
|
5371
|
+
"size": "h3"
|
|
5098
5372
|
},
|
|
5099
5373
|
"tokens": {
|
|
5100
|
-
"
|
|
5374
|
+
"fontName": "StagSans",
|
|
5375
|
+
"fontSize": 24,
|
|
5376
|
+
"fontWeight": 700,
|
|
5377
|
+
"lineHeight": 1.33333333333
|
|
5101
5378
|
}
|
|
5102
5379
|
},
|
|
5103
5380
|
{
|
|
5104
5381
|
"if": {
|
|
5105
|
-
"size": "
|
|
5382
|
+
"size": "h4"
|
|
5106
5383
|
},
|
|
5107
5384
|
"tokens": {
|
|
5108
5385
|
"fontName": "StagSans",
|
|
5109
5386
|
"fontSize": 20,
|
|
5110
5387
|
"fontWeight": 700,
|
|
5111
|
-
"lineHeight": 1.
|
|
5388
|
+
"lineHeight": 1.2
|
|
5112
5389
|
}
|
|
5113
5390
|
},
|
|
5114
5391
|
{
|
|
5115
5392
|
"if": {
|
|
5116
|
-
"size": "
|
|
5117
|
-
"viewport": ["lg", "xl"]
|
|
5393
|
+
"size": "h5"
|
|
5118
5394
|
},
|
|
5119
5395
|
"tokens": {
|
|
5120
|
-
"
|
|
5121
|
-
"
|
|
5396
|
+
"fontName": "StagSans",
|
|
5397
|
+
"fontSize": 18,
|
|
5398
|
+
"fontWeight": 700,
|
|
5399
|
+
"lineHeight": 1.22222222222
|
|
5122
5400
|
}
|
|
5123
5401
|
},
|
|
5124
5402
|
{
|
|
5125
5403
|
"if": {
|
|
5126
|
-
"size": "
|
|
5404
|
+
"size": "h6"
|
|
5127
5405
|
},
|
|
5128
5406
|
"tokens": {
|
|
5129
5407
|
"fontName": "StagSans",
|
|
5130
5408
|
"fontSize": 16,
|
|
5131
5409
|
"fontWeight": 700,
|
|
5132
|
-
"lineHeight": 1.
|
|
5410
|
+
"lineHeight": 1.25
|
|
5133
5411
|
}
|
|
5134
5412
|
},
|
|
5135
5413
|
{
|
|
@@ -5362,7 +5640,7 @@
|
|
|
5362
5640
|
}
|
|
5363
5641
|
},
|
|
5364
5642
|
"metadata": {
|
|
5365
|
-
"themeTokensVersion": "2.
|
|
5643
|
+
"themeTokensVersion": "2.13.0",
|
|
5366
5644
|
"name": "theme-koodo"
|
|
5367
5645
|
}
|
|
5368
5646
|
}
|