@telus-uds/themes-community.theme-allium 0.2.3 → 0.3.1
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/StickyNavigationBarTabs.json +133 -0
- package/build/android/schema.json +1305 -978
- package/build/android/theme.json +133 -5
- package/build/ios/StickyNavigationBarTabs.json +133 -0
- package/build/ios/schema.json +1305 -978
- package/build/ios/theme.json +133 -5
- package/build/rn/ContentCard.js +1 -1
- package/build/rn/StickyNavigationBarTabs.js +80 -0
- package/build/rn/schema.json +1305 -978
- package/build/rn/theme.js +74 -4
- package/build/web/ContentCard.js +1 -1
- package/build/web/StickyNavigationBarTabs.js +80 -0
- package/build/web/index.js +2 -2
- package/build/web/schema.json +1305 -978
- package/build/web/theme.js +74 -4
- package/package.json +2 -2
- package/theme.json +92 -4
- package/build/android/StickyNavigationBar.json +0 -5
- package/build/ios/StickyNavigationBar.json +0 -5
- package/build/rn/StickyNavigationBar.js +0 -10
- package/build/web/StickyNavigationBar.js +0 -10
package/build/ios/theme.json
CHANGED
|
@@ -87,14 +87,142 @@
|
|
|
87
87
|
"shadow": null
|
|
88
88
|
}
|
|
89
89
|
},
|
|
90
|
-
"
|
|
91
|
-
"appearances": {
|
|
92
|
-
|
|
93
|
-
|
|
90
|
+
"StickyNavigationBarTabs": {
|
|
91
|
+
"appearances": {
|
|
92
|
+
"focus": {
|
|
93
|
+
"description": "Currently only web has good support for this. Applies when an interactive component's focus handler is triggered, such as keyboard tabbing or selection.",
|
|
94
|
+
"type": "state",
|
|
95
|
+
"values": [true, false]
|
|
96
|
+
},
|
|
97
|
+
"hover": {
|
|
98
|
+
"description": "Currently web only. Applies when an interactive component's hover handler is triggered, such as on mouseover.",
|
|
99
|
+
"type": "state",
|
|
100
|
+
"values": [true, false]
|
|
101
|
+
},
|
|
102
|
+
"pressed": {
|
|
103
|
+
"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.",
|
|
104
|
+
"type": "state",
|
|
105
|
+
"values": [true, false]
|
|
106
|
+
},
|
|
107
|
+
"selected": {
|
|
108
|
+
"description": "Applies while an interactive component is the currently selected one in a set of states or components, for example a button in a `ButtonGroup`.",
|
|
109
|
+
"type": "state",
|
|
110
|
+
"values": [true]
|
|
111
|
+
}
|
|
112
|
+
},
|
|
113
|
+
"rules": [
|
|
114
|
+
{
|
|
115
|
+
"if": {
|
|
116
|
+
"focus": true
|
|
117
|
+
},
|
|
118
|
+
"tokens": {
|
|
119
|
+
"color": {
|
|
120
|
+
"red": 0.2549,
|
|
121
|
+
"green": 0.27059,
|
|
122
|
+
"blue": 0.27843,
|
|
123
|
+
"alpha": 1
|
|
124
|
+
},
|
|
125
|
+
"outerBorderColor": {
|
|
126
|
+
"red": 0.2549,
|
|
127
|
+
"green": 0.27059,
|
|
128
|
+
"blue": 0.27843,
|
|
129
|
+
"alpha": 1
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
},
|
|
133
|
+
{
|
|
134
|
+
"if": {
|
|
135
|
+
"hover": true
|
|
136
|
+
},
|
|
137
|
+
"tokens": {
|
|
138
|
+
"color": {
|
|
139
|
+
"red": 0.17255,
|
|
140
|
+
"green": 0.18039,
|
|
141
|
+
"blue": 0.18824,
|
|
142
|
+
"alpha": 1
|
|
143
|
+
},
|
|
144
|
+
"textLine": "underline"
|
|
145
|
+
}
|
|
146
|
+
},
|
|
147
|
+
{
|
|
148
|
+
"if": {
|
|
149
|
+
"pressed": true
|
|
150
|
+
},
|
|
151
|
+
"tokens": {
|
|
152
|
+
"color": {
|
|
153
|
+
"red": 0.17255,
|
|
154
|
+
"green": 0.18039,
|
|
155
|
+
"blue": 0.18824,
|
|
156
|
+
"alpha": 1
|
|
157
|
+
},
|
|
158
|
+
"textLine": "none"
|
|
159
|
+
}
|
|
160
|
+
},
|
|
161
|
+
{
|
|
162
|
+
"if": {
|
|
163
|
+
"focus": true,
|
|
164
|
+
"pressed": true
|
|
165
|
+
},
|
|
166
|
+
"tokens": {
|
|
167
|
+
"outerBorderColor": {
|
|
168
|
+
"red": 0.08627,
|
|
169
|
+
"green": 0.24314,
|
|
170
|
+
"blue": 0.02353,
|
|
171
|
+
"alpha": 1
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
},
|
|
175
|
+
{
|
|
176
|
+
"if": {
|
|
177
|
+
"selected": true
|
|
178
|
+
},
|
|
179
|
+
"tokens": {
|
|
180
|
+
"blockFontName": "HelveticaNow",
|
|
181
|
+
"blockFontWeight": 700,
|
|
182
|
+
"color": {
|
|
183
|
+
"red": 0.17255,
|
|
184
|
+
"green": 0.18039,
|
|
185
|
+
"blue": 0.18824,
|
|
186
|
+
"alpha": 1
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
],
|
|
191
|
+
"tokens": {
|
|
192
|
+
"alignSelf": "flex-start",
|
|
193
|
+
"blockFontName": "HelveticaNow",
|
|
194
|
+
"blockFontSize": 14,
|
|
195
|
+
"blockFontWeight": 400,
|
|
196
|
+
"blockLineHeight": 1.5,
|
|
197
|
+
"borderRadius": 4,
|
|
198
|
+
"color": {
|
|
199
|
+
"red": 0.17255,
|
|
200
|
+
"green": 0.18039,
|
|
201
|
+
"blue": 0.18824,
|
|
202
|
+
"alpha": 1
|
|
203
|
+
},
|
|
204
|
+
"externalLinkIcon": "PaletteIconLinkExternal",
|
|
205
|
+
"icon": null,
|
|
206
|
+
"iconSize": 20,
|
|
207
|
+
"iconSpace": 1,
|
|
208
|
+
"iconTranslateX": 0,
|
|
209
|
+
"iconTranslateY": 0,
|
|
210
|
+
"outerBorderColor": {
|
|
211
|
+
"red": 0,
|
|
212
|
+
"green": 0,
|
|
213
|
+
"blue": 0,
|
|
214
|
+
"alpha": 0
|
|
215
|
+
},
|
|
216
|
+
"outerBorderGap": 2,
|
|
217
|
+
"outerBorderOutline": "none",
|
|
218
|
+
"outerBorderWidth": 2,
|
|
219
|
+
"textLine": "none",
|
|
220
|
+
"textLineStyle": "solid"
|
|
221
|
+
}
|
|
94
222
|
}
|
|
95
223
|
},
|
|
96
224
|
"metadata": {
|
|
97
|
-
"themeTokensVersion": "2.
|
|
225
|
+
"themeTokensVersion": "2.59.0",
|
|
98
226
|
"name": "themes-community.theme-allium"
|
|
99
227
|
}
|
|
100
228
|
}
|
package/build/rn/ContentCard.js
CHANGED
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
/*
|
|
2
|
+
*
|
|
3
|
+
* Do not edit directly
|
|
4
|
+
* Generated on Thu, 04 Jul 2024 19:27:16 GMT
|
|
5
|
+
*
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
const PaletteIconLinkExternal = require('@telus-uds/palette-allium/build/rn/icons/LinkExternal')
|
|
9
|
+
|
|
10
|
+
module.exports = {
|
|
11
|
+
appearances: {
|
|
12
|
+
focus: {
|
|
13
|
+
description: "Currently only web has good support for this. Applies when an interactive component's focus handler is triggered, such as keyboard tabbing or selection.",
|
|
14
|
+
type: 'state',
|
|
15
|
+
values: [ true, false ]
|
|
16
|
+
},
|
|
17
|
+
hover: {
|
|
18
|
+
description: "Currently web only. Applies when an interactive component's hover handler is triggered, such as on mouseover.",
|
|
19
|
+
type: 'state',
|
|
20
|
+
values: [ true, false ]
|
|
21
|
+
},
|
|
22
|
+
pressed: {
|
|
23
|
+
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.',
|
|
24
|
+
type: 'state',
|
|
25
|
+
values: [ true, false ]
|
|
26
|
+
},
|
|
27
|
+
selected: {
|
|
28
|
+
description: 'Applies while an interactive component is the currently selected one in a set of states or components, for example a button in a `ButtonGroup`.',
|
|
29
|
+
type: 'state',
|
|
30
|
+
values: [ true ]
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
rules: [
|
|
34
|
+
{
|
|
35
|
+
if: { focus: true },
|
|
36
|
+
tokens: { color: '#414547', outerBorderColor: '#414547' }
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
if: { hover: true },
|
|
40
|
+
tokens: { color: '#2c2e30', textLine: 'underline' }
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
if: { pressed: true },
|
|
44
|
+
tokens: { color: '#2c2e30', textLine: 'none' }
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
if: { focus: true, pressed: true },
|
|
48
|
+
tokens: { outerBorderColor: '#163e06' }
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
if: { selected: true },
|
|
52
|
+
tokens: {
|
|
53
|
+
blockFontName: 'HelveticaNow',
|
|
54
|
+
blockFontWeight: '700',
|
|
55
|
+
color: '#2c2e30'
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
],
|
|
59
|
+
tokens: {
|
|
60
|
+
alignSelf: 'flex-start',
|
|
61
|
+
blockFontName: 'HelveticaNow',
|
|
62
|
+
blockFontSize: 14,
|
|
63
|
+
blockFontWeight: '400',
|
|
64
|
+
blockLineHeight: 1.5,
|
|
65
|
+
borderRadius: 4,
|
|
66
|
+
color: '#2c2e30',
|
|
67
|
+
externalLinkIcon: PaletteIconLinkExternal,
|
|
68
|
+
icon: null,
|
|
69
|
+
iconSize: 20,
|
|
70
|
+
iconSpace: 1,
|
|
71
|
+
iconTranslateX: 0,
|
|
72
|
+
iconTranslateY: 0,
|
|
73
|
+
outerBorderColor: 'rgba(0, 0, 0, 0)',
|
|
74
|
+
outerBorderGap: 2,
|
|
75
|
+
outerBorderOutline: 'none',
|
|
76
|
+
outerBorderWidth: 2,
|
|
77
|
+
textLine: 'none',
|
|
78
|
+
textLineStyle: 'solid'
|
|
79
|
+
}
|
|
80
|
+
}
|