@telefonica/mistica 13.6.1 → 14.0.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/css/mistica.css +1 -1
- package/dist/card.js +84 -80
- package/dist/index.d.ts +1 -0
- package/dist/index.js +2 -0
- package/dist/package-version.js +1 -1
- package/dist/skins/blau.js +2 -2
- package/dist/skins/movistar-legacy.d.ts +45 -0
- package/dist/skins/movistar-legacy.js +260 -0
- package/dist/skins/movistar.d.ts +8 -2
- package/dist/skins/movistar.js +49 -43
- package/dist/skins/o2-classic.js +1 -1
- package/dist/skins/o2.js +1 -1
- package/dist/skins/telefonica.js +1 -1
- package/dist/skins/types.d.ts +1 -1
- package/dist/skins/utils.js +2 -2
- package/dist/skins/vivo.js +1 -1
- package/dist/theme-context-provider.js +28 -24
- package/dist/video.d.ts +1 -2
- package/dist/video.js +0 -1
- package/dist-es/card.js +151 -147
- package/dist-es/index.js +1651 -1650
- package/dist-es/package-version.js +1 -1
- package/dist-es/skins/blau.js +2 -2
- package/dist-es/skins/movistar-legacy.js +247 -0
- package/dist-es/skins/movistar.js +51 -45
- package/dist-es/skins/o2-classic.js +1 -1
- package/dist-es/skins/o2.js +1 -1
- package/dist-es/skins/telefonica.js +1 -1
- package/dist-es/skins/utils.js +4 -4
- package/dist-es/skins/vivo.js +1 -1
- package/dist-es/style.css +1 -1
- package/dist-es/theme-context-provider.js +61 -57
- package/dist-es/video.js +0 -1
- package/package.json +1 -1
|
@@ -0,0 +1,260 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
function _export(target, all) {
|
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: all[name]
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
_export(exports, {
|
|
12
|
+
getMovistarLegacySkin: ()=>d,
|
|
13
|
+
palette: ()=>e
|
|
14
|
+
});
|
|
15
|
+
const _colorJs = require("../utils/color.js");
|
|
16
|
+
const _constantsJs = require("./constants.js");
|
|
17
|
+
const e = {
|
|
18
|
+
movistarBlue: "#019DF4",
|
|
19
|
+
movistarBlue10: "#E6F5FD",
|
|
20
|
+
movistarBlue20: "#B3E1FB",
|
|
21
|
+
movistarBlue30: "#80CEF9",
|
|
22
|
+
movistarBlue40: "#4DBAF7",
|
|
23
|
+
movistarBlue55: "#008EDD",
|
|
24
|
+
movistarGreen: "#5CB615",
|
|
25
|
+
movistarGreen10: "#EFF8E8",
|
|
26
|
+
movistarGreen30: "#ADDA8A",
|
|
27
|
+
movistarGreen40: "#8DCC5B",
|
|
28
|
+
movistarGreen60: "#499110",
|
|
29
|
+
movistarGreen70: "#407F0F",
|
|
30
|
+
pepper: "#FF374A",
|
|
31
|
+
pepper10: "#FFEBED",
|
|
32
|
+
pepper20: "#FFC3C8",
|
|
33
|
+
pepper40: "#FF7380",
|
|
34
|
+
pepper55: "#D73241",
|
|
35
|
+
pepper70: "#B22634",
|
|
36
|
+
egg: "#F28D15",
|
|
37
|
+
egg10: "#FEF4E8",
|
|
38
|
+
egg40: "#F6AF5B",
|
|
39
|
+
egg80: "#6D3F09",
|
|
40
|
+
pink: "#E63780",
|
|
41
|
+
purple: "#A13EA1",
|
|
42
|
+
purple10: "#F6ECF6",
|
|
43
|
+
purple40: "#BD78BD",
|
|
44
|
+
purple70: "#712B71",
|
|
45
|
+
grey1: "#F6F6F6",
|
|
46
|
+
grey2: "#EEEEEE",
|
|
47
|
+
grey3: "#DDDDDD",
|
|
48
|
+
grey4: "#999999",
|
|
49
|
+
grey5: "#86888C",
|
|
50
|
+
grey6: "#313235",
|
|
51
|
+
white: "#FFFFFF",
|
|
52
|
+
movistarProminentBlue: "#0B2739",
|
|
53
|
+
movistarProminentBlueDark: "#081F2D",
|
|
54
|
+
movistarProminentBlueLight20: "#CED3D7",
|
|
55
|
+
movistarProminentBlueLight50: "#85939C",
|
|
56
|
+
movistarProminentBlueLight70: "#546874",
|
|
57
|
+
darkModeBlack: "#191919",
|
|
58
|
+
darkModeGrey: "#242424"
|
|
59
|
+
}, d = (o)=>{
|
|
60
|
+
const t = {
|
|
61
|
+
name: _constantsJs.MOVISTAR_SKIN,
|
|
62
|
+
colors: {
|
|
63
|
+
appBarBackground: e.white,
|
|
64
|
+
background: e.white,
|
|
65
|
+
backgroundContainer: e.white,
|
|
66
|
+
backgroundBrand: e.movistarBlue,
|
|
67
|
+
backgroundBrandSecondary: e.movistarBlue,
|
|
68
|
+
backgroundOverlay: (0, _colorJs.applyAlpha)(e.grey6, 0.6),
|
|
69
|
+
backgroundSkeleton: e.grey2,
|
|
70
|
+
backgroundSkeletonInverse: e.movistarBlue55,
|
|
71
|
+
navigationBarBackground: e.movistarBlue,
|
|
72
|
+
backgroundAlternative: e.grey1,
|
|
73
|
+
backgroundFeedbackBottom: e.movistarBlue,
|
|
74
|
+
skeletonWave: e.grey2,
|
|
75
|
+
borderLow: e.grey1,
|
|
76
|
+
border: e.grey3,
|
|
77
|
+
borderHigh: e.grey5,
|
|
78
|
+
borderSelected: e.movistarBlue,
|
|
79
|
+
buttonDangerBackground: e.pepper,
|
|
80
|
+
buttonDangerBackgroundSelected: e.pepper55,
|
|
81
|
+
buttonDangerBackgroundHover: e.pepper55,
|
|
82
|
+
buttonLinkBackgroundSelected: e.movistarBlue10,
|
|
83
|
+
buttonLinkBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.2),
|
|
84
|
+
buttonPrimaryBackground: e.movistarBlue,
|
|
85
|
+
buttonPrimaryBackgroundInverse: e.white,
|
|
86
|
+
buttonPrimaryBackgroundSelected: e.movistarBlue55,
|
|
87
|
+
buttonPrimaryBackgroundHover: e.movistarBlue55,
|
|
88
|
+
buttonPrimaryBackgroundInverseSelected: e.movistarBlue30,
|
|
89
|
+
buttonSecondaryBorder: e.movistarBlue,
|
|
90
|
+
buttonSecondaryBorderSelected: e.movistarBlue55,
|
|
91
|
+
buttonSecondaryBorderInverse: e.white,
|
|
92
|
+
buttonSecondaryBorderInverseSelected: e.white,
|
|
93
|
+
buttonSecondaryBackgroundHover: e.movistarBlue10,
|
|
94
|
+
buttonSecondaryBackgroundSelected: e.movistarBlue10,
|
|
95
|
+
buttonSecondaryBackgroundInverseHover: (0, _colorJs.applyAlpha)(e.white, 0.2),
|
|
96
|
+
buttonSecondaryBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.2),
|
|
97
|
+
textButtonPrimary: e.white,
|
|
98
|
+
textButtonPrimaryInverse: e.movistarBlue,
|
|
99
|
+
textButtonPrimaryInverseSelected: e.movistarBlue,
|
|
100
|
+
textButtonSecondary: e.movistarBlue,
|
|
101
|
+
textButtonSecondarySelected: e.movistarBlue55,
|
|
102
|
+
textButtonSecondaryInverse: e.white,
|
|
103
|
+
textButtonSecondaryInverseSelected: e.white,
|
|
104
|
+
textLink: e.movistarBlue,
|
|
105
|
+
textLinkInverse: e.white,
|
|
106
|
+
textLinkDanger: e.pepper,
|
|
107
|
+
textLinkSnackbar: e.movistarBlue30,
|
|
108
|
+
control: e.grey3,
|
|
109
|
+
controlActivated: e.movistarBlue,
|
|
110
|
+
controlError: e.pepper,
|
|
111
|
+
loadingBar: e.movistarBlue30,
|
|
112
|
+
loadingBarBackground: e.movistarBlue55,
|
|
113
|
+
toggleAndroidInactive: e.grey2,
|
|
114
|
+
toggleAndroidBackgroundActive: e.movistarBlue20,
|
|
115
|
+
iosControlKnob: e.white,
|
|
116
|
+
divider: e.grey2,
|
|
117
|
+
dividerInverse: e.movistarBlue55,
|
|
118
|
+
navigationBarDivider: e.movistarBlue,
|
|
119
|
+
badge: e.pepper55,
|
|
120
|
+
feedbackErrorBackground: e.pepper,
|
|
121
|
+
feedbackInfoBackground: e.grey6,
|
|
122
|
+
brand: e.movistarBlue,
|
|
123
|
+
brandHigh: e.movistarBlue55,
|
|
124
|
+
inverse: e.white,
|
|
125
|
+
neutralHigh: e.grey6,
|
|
126
|
+
neutralMedium: e.grey5,
|
|
127
|
+
neutralLow: e.grey1,
|
|
128
|
+
promo: e.purple,
|
|
129
|
+
highlight: e.pink,
|
|
130
|
+
textPrimary: e.grey6,
|
|
131
|
+
textPrimaryInverse: e.white,
|
|
132
|
+
textSecondary: e.grey5,
|
|
133
|
+
textSecondaryInverse: e.white,
|
|
134
|
+
error: e.pepper,
|
|
135
|
+
success: e.movistarGreen,
|
|
136
|
+
warning: e.egg,
|
|
137
|
+
textNavigationBarPrimary: e.white,
|
|
138
|
+
textNavigationBarSecondary: e.movistarBlue20,
|
|
139
|
+
textNavigationSearchBarHint: e.movistarBlue20,
|
|
140
|
+
textNavigationSearchBarText: e.white,
|
|
141
|
+
textAppBar: e.grey4,
|
|
142
|
+
textAppBarSelected: e.movistarBlue,
|
|
143
|
+
successLow: e.movistarGreen10,
|
|
144
|
+
warningLow: e.egg10,
|
|
145
|
+
errorLow: e.pepper10,
|
|
146
|
+
promoLow: e.purple10,
|
|
147
|
+
brandLow: e.movistarBlue10,
|
|
148
|
+
successHigh: e.movistarGreen70,
|
|
149
|
+
warningHigh: e.egg80,
|
|
150
|
+
errorHigh: e.pepper70,
|
|
151
|
+
promoHigh: e.purple70,
|
|
152
|
+
successHighInverse: e.movistarGreen70,
|
|
153
|
+
warningHighInverse: e.egg80,
|
|
154
|
+
errorHighInverse: e.pepper70,
|
|
155
|
+
promoHighInverse: e.purple70,
|
|
156
|
+
neutralMediumInverse: e.grey5
|
|
157
|
+
},
|
|
158
|
+
darkModeColors: {
|
|
159
|
+
brand: e.movistarBlue,
|
|
160
|
+
appBarBackground: e.darkModeGrey,
|
|
161
|
+
background: e.darkModeBlack,
|
|
162
|
+
backgroundContainer: e.darkModeGrey,
|
|
163
|
+
backgroundBrand: e.darkModeBlack,
|
|
164
|
+
backgroundBrandSecondary: e.darkModeBlack,
|
|
165
|
+
backgroundOverlay: (0, _colorJs.applyAlpha)(e.darkModeGrey, 0.8),
|
|
166
|
+
backgroundSkeleton: e.grey6,
|
|
167
|
+
backgroundSkeletonInverse: e.grey6,
|
|
168
|
+
navigationBarBackground: e.darkModeBlack,
|
|
169
|
+
backgroundAlternative: e.darkModeGrey,
|
|
170
|
+
backgroundFeedbackBottom: e.darkModeBlack,
|
|
171
|
+
skeletonWave: e.grey5,
|
|
172
|
+
borderLow: e.darkModeBlack,
|
|
173
|
+
border: e.darkModeGrey,
|
|
174
|
+
buttonLinkBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
175
|
+
buttonLinkBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
176
|
+
buttonPrimaryBackground: e.movistarBlue,
|
|
177
|
+
buttonPrimaryBackgroundInverse: e.movistarBlue,
|
|
178
|
+
buttonPrimaryBackgroundSelected: e.movistarBlue55,
|
|
179
|
+
buttonPrimaryBackgroundHover: e.movistarBlue55,
|
|
180
|
+
buttonPrimaryBackgroundInverseSelected: e.movistarBlue55,
|
|
181
|
+
buttonSecondaryBorder: e.white,
|
|
182
|
+
buttonSecondaryBorderSelected: e.white,
|
|
183
|
+
buttonSecondaryBorderInverse: e.white,
|
|
184
|
+
buttonSecondaryBorderInverseSelected: e.white,
|
|
185
|
+
buttonSecondaryBackgroundHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
|
|
186
|
+
buttonSecondaryBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
|
|
187
|
+
buttonSecondaryBackgroundInverseHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
|
|
188
|
+
buttonSecondaryBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
|
|
189
|
+
textButtonPrimary: e.grey2,
|
|
190
|
+
textButtonPrimaryInverse: e.grey2,
|
|
191
|
+
textButtonPrimaryInverseSelected: e.grey2,
|
|
192
|
+
textButtonSecondary: e.grey2,
|
|
193
|
+
textButtonSecondarySelected: e.grey2,
|
|
194
|
+
textButtonSecondaryInverse: e.grey2,
|
|
195
|
+
textButtonSecondaryInverseSelected: e.grey2,
|
|
196
|
+
textLink: e.movistarBlue,
|
|
197
|
+
textLinkInverse: e.movistarBlue,
|
|
198
|
+
control: e.grey6,
|
|
199
|
+
controlActivated: e.movistarBlue,
|
|
200
|
+
loadingBar: e.movistarBlue,
|
|
201
|
+
loadingBarBackground: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
202
|
+
toggleAndroidInactive: e.grey4,
|
|
203
|
+
toggleAndroidBackgroundActive: e.movistarBlue20,
|
|
204
|
+
iosControlKnob: e.grey2,
|
|
205
|
+
divider: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
206
|
+
dividerInverse: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
207
|
+
navigationBarDivider: e.darkModeBlack,
|
|
208
|
+
brandHigh: e.grey6,
|
|
209
|
+
inverse: e.grey2,
|
|
210
|
+
neutralHigh: e.grey2,
|
|
211
|
+
neutralMedium: e.grey5,
|
|
212
|
+
neutralLow: e.grey6,
|
|
213
|
+
textPrimary: e.grey2,
|
|
214
|
+
textPrimaryInverse: e.grey2,
|
|
215
|
+
textSecondary: e.grey4,
|
|
216
|
+
textSecondaryInverse: e.grey4,
|
|
217
|
+
textNavigationBarPrimary: e.grey2,
|
|
218
|
+
textNavigationBarSecondary: e.grey4,
|
|
219
|
+
textNavigationSearchBarHint: e.grey4,
|
|
220
|
+
textNavigationSearchBarText: e.grey2,
|
|
221
|
+
textAppBar: e.grey5,
|
|
222
|
+
textAppBarSelected: e.grey2,
|
|
223
|
+
successLow: e.grey6,
|
|
224
|
+
warningLow: e.grey6,
|
|
225
|
+
errorLow: e.grey6,
|
|
226
|
+
promoLow: e.grey6,
|
|
227
|
+
brandLow: e.grey6,
|
|
228
|
+
successHigh: e.movistarGreen40,
|
|
229
|
+
warningHigh: e.egg40,
|
|
230
|
+
errorHigh: e.pepper40,
|
|
231
|
+
promoHigh: e.purple40,
|
|
232
|
+
successHighInverse: e.movistarGreen70,
|
|
233
|
+
warningHighInverse: e.egg80,
|
|
234
|
+
errorHighInverse: e.pepper70,
|
|
235
|
+
promoHighInverse: e.purple70,
|
|
236
|
+
neutralMediumInverse: e.grey5
|
|
237
|
+
},
|
|
238
|
+
textPresets: {
|
|
239
|
+
text5: {
|
|
240
|
+
weight: "bold"
|
|
241
|
+
},
|
|
242
|
+
text6: {
|
|
243
|
+
weight: "bold"
|
|
244
|
+
},
|
|
245
|
+
text7: {
|
|
246
|
+
weight: "bold"
|
|
247
|
+
},
|
|
248
|
+
text8: {
|
|
249
|
+
weight: "bold"
|
|
250
|
+
},
|
|
251
|
+
text9: {
|
|
252
|
+
weight: "bold"
|
|
253
|
+
},
|
|
254
|
+
text10: {
|
|
255
|
+
weight: "bold"
|
|
256
|
+
}
|
|
257
|
+
}
|
|
258
|
+
};
|
|
259
|
+
return o === "prominent" && (t.colors.brand = e.movistarProminentBlue, t.colors.brandHigh = e.movistarProminentBlueDark, t.colors.backgroundBrand = e.movistarProminentBlue, t.colors.navigationBarBackground = e.movistarProminentBlue, t.colors.backgroundFeedbackBottom = e.movistarProminentBlue, t.colors.controlActivated = e.movistarProminentBlue, t.colors.dividerInverse = e.movistarProminentBlueDark), t;
|
|
260
|
+
};
|
package/dist/skins/movistar.d.ts
CHANGED
|
@@ -6,6 +6,7 @@ export declare const palette: {
|
|
|
6
6
|
readonly movistarBlue30: "#80CEF9";
|
|
7
7
|
readonly movistarBlue40: "#4DBAF7";
|
|
8
8
|
readonly movistarBlue55: "#008EDD";
|
|
9
|
+
readonly movistarBlueDark: "#0B2739";
|
|
9
10
|
readonly movistarGreen: "#5CB615";
|
|
10
11
|
readonly movistarGreen10: "#EFF8E8";
|
|
11
12
|
readonly movistarGreen30: "#ADDA8A";
|
|
@@ -39,7 +40,12 @@ export declare const palette: {
|
|
|
39
40
|
readonly movistarProminentBlueLight20: "#CED3D7";
|
|
40
41
|
readonly movistarProminentBlueLight50: "#85939C";
|
|
41
42
|
readonly movistarProminentBlueLight70: "#546874";
|
|
42
|
-
readonly darkModeBlack: "#
|
|
43
|
-
readonly darkModeGrey: "#
|
|
43
|
+
readonly darkModeBlack: "#061824";
|
|
44
|
+
readonly darkModeGrey: "#092130";
|
|
45
|
+
readonly darkModeGrey2: "#EAEBEE";
|
|
46
|
+
readonly darkModeGrey3: "#CED4D7";
|
|
47
|
+
readonly darkModeGrey4: "#85939C";
|
|
48
|
+
readonly darkModeGrey5: "#6D7D88";
|
|
49
|
+
readonly darkModeGrey6: "#3C5261";
|
|
44
50
|
};
|
|
45
51
|
export declare const getMovistarSkin: GetKnownSkin;
|
package/dist/skins/movistar.js
CHANGED
|
@@ -21,6 +21,7 @@ const e = {
|
|
|
21
21
|
movistarBlue30: "#80CEF9",
|
|
22
22
|
movistarBlue40: "#4DBAF7",
|
|
23
23
|
movistarBlue55: "#008EDD",
|
|
24
|
+
movistarBlueDark: "#0B2739",
|
|
24
25
|
movistarGreen: "#5CB615",
|
|
25
26
|
movistarGreen10: "#EFF8E8",
|
|
26
27
|
movistarGreen30: "#ADDA8A",
|
|
@@ -54,20 +55,24 @@ const e = {
|
|
|
54
55
|
movistarProminentBlueLight20: "#CED3D7",
|
|
55
56
|
movistarProminentBlueLight50: "#85939C",
|
|
56
57
|
movistarProminentBlueLight70: "#546874",
|
|
57
|
-
darkModeBlack: "#
|
|
58
|
-
darkModeGrey: "#
|
|
59
|
-
|
|
60
|
-
|
|
58
|
+
darkModeBlack: "#061824",
|
|
59
|
+
darkModeGrey: "#092130",
|
|
60
|
+
darkModeGrey2: "#EAEBEE",
|
|
61
|
+
darkModeGrey3: "#CED4D7",
|
|
62
|
+
darkModeGrey4: "#85939C",
|
|
63
|
+
darkModeGrey5: "#6D7D88",
|
|
64
|
+
darkModeGrey6: "#3C5261"
|
|
65
|
+
}, d = ()=>({
|
|
61
66
|
name: _constantsJs.MOVISTAR_SKIN,
|
|
62
67
|
colors: {
|
|
63
68
|
appBarBackground: e.white,
|
|
64
69
|
background: e.white,
|
|
65
70
|
backgroundContainer: e.white,
|
|
66
71
|
backgroundBrand: e.movistarBlue,
|
|
67
|
-
backgroundBrandSecondary: e.
|
|
68
|
-
backgroundOverlay: (0, _colorJs.applyAlpha)(e.
|
|
72
|
+
backgroundBrandSecondary: e.movistarBlueDark,
|
|
73
|
+
backgroundOverlay: (0, _colorJs.applyAlpha)(e.movistarBlueDark, 0.6),
|
|
69
74
|
backgroundSkeleton: e.grey2,
|
|
70
|
-
backgroundSkeletonInverse: e.
|
|
75
|
+
backgroundSkeletonInverse: (0, _colorJs.applyAlpha)(e.white, 0.2),
|
|
71
76
|
navigationBarBackground: e.movistarBlue,
|
|
72
77
|
backgroundAlternative: e.grey1,
|
|
73
78
|
backgroundFeedbackBottom: e.movistarBlue,
|
|
@@ -118,19 +123,19 @@ const e = {
|
|
|
118
123
|
navigationBarDivider: e.movistarBlue,
|
|
119
124
|
badge: e.pepper55,
|
|
120
125
|
feedbackErrorBackground: e.pepper,
|
|
121
|
-
feedbackInfoBackground: e.
|
|
126
|
+
feedbackInfoBackground: e.movistarBlueDark,
|
|
122
127
|
brand: e.movistarBlue,
|
|
123
128
|
brandHigh: e.movistarBlue55,
|
|
124
129
|
inverse: e.white,
|
|
125
|
-
neutralHigh: e.
|
|
130
|
+
neutralHigh: e.movistarBlueDark,
|
|
126
131
|
neutralMedium: e.grey5,
|
|
127
132
|
neutralLow: e.grey1,
|
|
128
133
|
promo: e.purple,
|
|
129
134
|
highlight: e.pink,
|
|
130
|
-
textPrimary: e.
|
|
135
|
+
textPrimary: e.movistarBlueDark,
|
|
131
136
|
textPrimaryInverse: e.white,
|
|
132
137
|
textSecondary: e.grey5,
|
|
133
|
-
textSecondaryInverse: e.
|
|
138
|
+
textSecondaryInverse: e.movistarBlue10,
|
|
134
139
|
error: e.pepper,
|
|
135
140
|
success: e.movistarGreen,
|
|
136
141
|
warning: e.egg,
|
|
@@ -156,19 +161,19 @@ const e = {
|
|
|
156
161
|
neutralMediumInverse: e.grey5
|
|
157
162
|
},
|
|
158
163
|
darkModeColors: {
|
|
159
|
-
brand: e.movistarBlue,
|
|
160
164
|
appBarBackground: e.darkModeGrey,
|
|
161
165
|
background: e.darkModeBlack,
|
|
162
166
|
backgroundContainer: e.darkModeGrey,
|
|
163
167
|
backgroundBrand: e.darkModeBlack,
|
|
164
168
|
backgroundBrandSecondary: e.darkModeBlack,
|
|
165
169
|
backgroundOverlay: (0, _colorJs.applyAlpha)(e.darkModeGrey, 0.8),
|
|
166
|
-
backgroundSkeleton: e.
|
|
167
|
-
backgroundSkeletonInverse: e.
|
|
170
|
+
backgroundSkeleton: e.darkModeGrey6,
|
|
171
|
+
backgroundSkeletonInverse: e.darkModeGrey6,
|
|
168
172
|
navigationBarBackground: e.darkModeBlack,
|
|
169
173
|
backgroundAlternative: e.darkModeGrey,
|
|
170
174
|
backgroundFeedbackBottom: e.darkModeBlack,
|
|
171
|
-
skeletonWave: e.
|
|
175
|
+
skeletonWave: e.darkModeGrey5,
|
|
176
|
+
borderHigh: e.darkModeGrey4,
|
|
172
177
|
borderLow: e.darkModeBlack,
|
|
173
178
|
border: e.darkModeGrey,
|
|
174
179
|
buttonLinkBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
@@ -186,40 +191,40 @@ const e = {
|
|
|
186
191
|
buttonSecondaryBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
|
|
187
192
|
buttonSecondaryBackgroundInverseHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
|
|
188
193
|
buttonSecondaryBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
|
|
189
|
-
textButtonPrimary: e.
|
|
190
|
-
textButtonPrimaryInverse: e.
|
|
191
|
-
textButtonPrimaryInverseSelected: e.
|
|
192
|
-
textButtonSecondary: e.
|
|
193
|
-
textButtonSecondarySelected: e.
|
|
194
|
-
textButtonSecondaryInverse: e.
|
|
195
|
-
textButtonSecondaryInverseSelected: e.
|
|
194
|
+
textButtonPrimary: e.darkModeGrey2,
|
|
195
|
+
textButtonPrimaryInverse: e.darkModeGrey2,
|
|
196
|
+
textButtonPrimaryInverseSelected: e.darkModeGrey2,
|
|
197
|
+
textButtonSecondary: e.darkModeGrey2,
|
|
198
|
+
textButtonSecondarySelected: e.darkModeGrey2,
|
|
199
|
+
textButtonSecondaryInverse: e.darkModeGrey2,
|
|
200
|
+
textButtonSecondaryInverseSelected: e.darkModeGrey2,
|
|
196
201
|
textLink: e.movistarBlue,
|
|
197
202
|
textLinkInverse: e.movistarBlue,
|
|
198
|
-
control: e.
|
|
203
|
+
control: e.darkModeGrey6,
|
|
199
204
|
controlActivated: e.movistarBlue,
|
|
200
205
|
loadingBar: e.movistarBlue,
|
|
201
206
|
loadingBarBackground: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
202
|
-
toggleAndroidInactive: e.
|
|
207
|
+
toggleAndroidInactive: e.darkModeGrey4,
|
|
203
208
|
toggleAndroidBackgroundActive: e.movistarBlue20,
|
|
204
|
-
iosControlKnob: e.
|
|
209
|
+
iosControlKnob: e.darkModeGrey2,
|
|
205
210
|
divider: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
206
211
|
dividerInverse: (0, _colorJs.applyAlpha)(e.white, 0.05),
|
|
207
212
|
navigationBarDivider: e.darkModeBlack,
|
|
208
|
-
brandHigh: e.
|
|
209
|
-
inverse: e.
|
|
210
|
-
neutralHigh: e.
|
|
211
|
-
neutralMedium: e.
|
|
212
|
-
neutralLow: e.
|
|
213
|
-
textPrimary: e.
|
|
214
|
-
textPrimaryInverse: e.
|
|
215
|
-
textSecondary: e.
|
|
216
|
-
textSecondaryInverse: e.
|
|
217
|
-
textNavigationBarPrimary: e.
|
|
218
|
-
textNavigationBarSecondary: e.
|
|
219
|
-
textNavigationSearchBarHint: e.
|
|
220
|
-
textNavigationSearchBarText: e.
|
|
221
|
-
textAppBar: e.
|
|
222
|
-
textAppBarSelected: e.
|
|
213
|
+
brandHigh: e.darkModeGrey6,
|
|
214
|
+
inverse: e.darkModeGrey2,
|
|
215
|
+
neutralHigh: e.darkModeGrey2,
|
|
216
|
+
neutralMedium: e.darkModeGrey5,
|
|
217
|
+
neutralLow: e.darkModeGrey6,
|
|
218
|
+
textPrimary: e.darkModeGrey2,
|
|
219
|
+
textPrimaryInverse: e.darkModeGrey2,
|
|
220
|
+
textSecondary: e.darkModeGrey4,
|
|
221
|
+
textSecondaryInverse: e.darkModeGrey4,
|
|
222
|
+
textNavigationBarPrimary: e.darkModeGrey2,
|
|
223
|
+
textNavigationBarSecondary: e.darkModeGrey4,
|
|
224
|
+
textNavigationSearchBarHint: e.darkModeGrey4,
|
|
225
|
+
textNavigationSearchBarText: e.darkModeGrey2,
|
|
226
|
+
textAppBar: e.darkModeGrey5,
|
|
227
|
+
textAppBarSelected: e.darkModeGrey2,
|
|
223
228
|
successLow: e.grey6,
|
|
224
229
|
warningLow: e.grey6,
|
|
225
230
|
errorLow: e.grey6,
|
|
@@ -253,8 +258,9 @@ const e = {
|
|
|
253
258
|
},
|
|
254
259
|
text10: {
|
|
255
260
|
weight: "bold"
|
|
261
|
+
},
|
|
262
|
+
cardTitle: {
|
|
263
|
+
weight: "bold"
|
|
256
264
|
}
|
|
257
265
|
}
|
|
258
|
-
};
|
|
259
|
-
return o === "prominent" && (t.colors.brand = e.movistarProminentBlue, t.colors.brandHigh = e.movistarProminentBlueDark, t.colors.backgroundBrand = e.movistarProminentBlue, t.colors.navigationBarBackground = e.movistarProminentBlue, t.colors.backgroundFeedbackBottom = e.movistarProminentBlue, t.colors.controlActivated = e.movistarProminentBlue, t.colors.dividerInverse = e.movistarProminentBlueDark), t;
|
|
260
|
-
};
|
|
266
|
+
});
|
package/dist/skins/o2-classic.js
CHANGED
package/dist/skins/o2.js
CHANGED
package/dist/skins/telefonica.js
CHANGED
package/dist/skins/types.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ export type KnownSkinName = 'Movistar' | 'O2' | 'O2-classic' | 'Vivo' | 'Telefon
|
|
|
3
3
|
export type SkinName = KnownSkinName | string;
|
|
4
4
|
export type GetKnownSkin = (variant?: SkinVariant) => KnownSkin;
|
|
5
5
|
export type FontWeight = 'light' | 'regular' | 'medium' | 'bold';
|
|
6
|
-
type TextPresetName = 'text5' | 'text6' | 'text7' | 'text8' | 'text9' | 'text10';
|
|
6
|
+
type TextPresetName = 'text5' | 'text6' | 'text7' | 'text8' | 'text9' | 'text10' | 'cardTitle';
|
|
7
7
|
export type TextPresetsConfig = {
|
|
8
8
|
[preset in TextPresetName]: {
|
|
9
9
|
weight: FontWeight;
|
package/dist/skins/utils.js
CHANGED
|
@@ -59,7 +59,7 @@ function _interopRequireWildcard(obj, nodeInterop) {
|
|
|
59
59
|
}
|
|
60
60
|
return newObj;
|
|
61
61
|
}
|
|
62
|
-
const C = (r,
|
|
62
|
+
const C = (r, o)=>{
|
|
63
63
|
switch(r){
|
|
64
64
|
case _constantsJs.BLAU_SKIN:
|
|
65
65
|
return (0, _blauJs.getBlauSkin)();
|
|
@@ -72,7 +72,7 @@ const C = (r, n)=>{
|
|
|
72
72
|
case _constantsJs.O2_CLASSIC_SKIN:
|
|
73
73
|
return (0, _o2ClassicJs.getO2ClassicSkin)();
|
|
74
74
|
case _constantsJs.MOVISTAR_SKIN:
|
|
75
|
-
return (0, _movistarJs.getMovistarSkin)(
|
|
75
|
+
return (0, _movistarJs.getMovistarSkin)();
|
|
76
76
|
default:
|
|
77
77
|
throw Error("Unknown skin name: " + r);
|
|
78
78
|
}
|
package/dist/skins/vivo.js
CHANGED
|
@@ -9,8 +9,8 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
-
default: ()=>
|
|
13
|
-
useIsOsDarkModeEnabled: ()=>
|
|
12
|
+
default: ()=>pt,
|
|
13
|
+
useIsOsDarkModeEnabled: ()=>U
|
|
14
14
|
});
|
|
15
15
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
16
16
|
const _dynamic = require("@vanilla-extract/dynamic");
|
|
@@ -101,16 +101,16 @@ function _objectSpread(target) {
|
|
|
101
101
|
}
|
|
102
102
|
return target;
|
|
103
103
|
}
|
|
104
|
-
const
|
|
104
|
+
const Q = "(prefers-color-scheme: dark)", U = ()=>{
|
|
105
105
|
const [t, c] = _react.useState(!1);
|
|
106
106
|
return (0, _hooksJs.useIsomorphicLayoutEffect)(()=>{
|
|
107
107
|
if (!window.matchMedia) return;
|
|
108
|
-
const
|
|
109
|
-
c(
|
|
108
|
+
const o = window.matchMedia(Q), i = ()=>{
|
|
109
|
+
c(o.matches);
|
|
110
110
|
};
|
|
111
|
-
return
|
|
111
|
+
return o.addListener(i), i(), ()=>o.removeListener(i);
|
|
112
112
|
}, []), t;
|
|
113
|
-
},
|
|
113
|
+
}, X = ()=>(t)=>t, r = {
|
|
114
114
|
text5: {
|
|
115
115
|
weight: "light"
|
|
116
116
|
},
|
|
@@ -128,14 +128,17 @@ const K = "(prefers-color-scheme: dark)", Q = ()=>{
|
|
|
128
128
|
},
|
|
129
129
|
text10: {
|
|
130
130
|
weight: "light"
|
|
131
|
+
},
|
|
132
|
+
cardTitle: {
|
|
133
|
+
weight: "regular"
|
|
131
134
|
}
|
|
132
|
-
},
|
|
135
|
+
}, Y = (t)=>({
|
|
133
136
|
headerMobileHeight: (t == null ? void 0 : t.headerMobileHeight) === "mistica" ? _themeJs.NAVBAR_HEIGHT_MOBILE : t == null ? void 0 : t.headerMobileHeight
|
|
134
|
-
}),
|
|
135
|
-
let { theme: t , children: c , as:
|
|
137
|
+
}), pt = (param)=>{
|
|
138
|
+
let { theme: t , children: c , as: o } = param;
|
|
136
139
|
var v;
|
|
137
|
-
const
|
|
138
|
-
var
|
|
140
|
+
const i = _react.useRef(1), D = _react.useCallback(()=>`aria-id-hook-${i.current++}`, []), w = U(), u = (v = t.colorScheme) != null ? v : "auto", C = t.skin.colors, I = _objectSpread({}, t.skin.colors, t.skin.darkModeColors), f = u === "auto" && w || u === "dark", p = f ? I : C, g = _react.useMemo(()=>{
|
|
141
|
+
var s, n, d, x, m, h, P, M, b;
|
|
139
142
|
const l = _objectSpread({
|
|
140
143
|
platform: (0, _platformJs.getPlatform)(),
|
|
141
144
|
insideNovumNativeApp: (0, _platformJs.isInsideNovumNativeApp)()
|
|
@@ -149,29 +152,30 @@ const K = "(prefers-color-scheme: dark)", Q = ()=>{
|
|
|
149
152
|
logEvent: ()=>Promise.resolve(),
|
|
150
153
|
eventFormat: "universal-analytics"
|
|
151
154
|
}, t.analytics),
|
|
152
|
-
dimensions: _objectSpread({}, _themeJs.dimensions,
|
|
155
|
+
dimensions: _objectSpread({}, _themeJs.dimensions, Y(t.dimensions)),
|
|
153
156
|
textPresets: {
|
|
154
|
-
text5: _objectSpread({},
|
|
155
|
-
text6: _objectSpread({},
|
|
156
|
-
text7: _objectSpread({},
|
|
157
|
-
text8: _objectSpread({},
|
|
158
|
-
text9: _objectSpread({},
|
|
159
|
-
text10: _objectSpread({},
|
|
157
|
+
text5: _objectSpread({}, r.text5, (s = t.skin.textPresets) == null ? void 0 : s.text5),
|
|
158
|
+
text6: _objectSpread({}, r.text6, (n = t.skin.textPresets) == null ? void 0 : n.text6),
|
|
159
|
+
text7: _objectSpread({}, r.text7, (d = t.skin.textPresets) == null ? void 0 : d.text7),
|
|
160
|
+
text8: _objectSpread({}, r.text8, (x = t.skin.textPresets) == null ? void 0 : x.text8),
|
|
161
|
+
text9: _objectSpread({}, r.text9, (m = t.skin.textPresets) == null ? void 0 : m.text9),
|
|
162
|
+
text10: _objectSpread({}, r.text10, (h = t.skin.textPresets) == null ? void 0 : h.text10),
|
|
163
|
+
cardTitle: _objectSpread({}, r.cardTitle, (P = t.skin.textPresets) == null ? void 0 : P.cardTitle)
|
|
160
164
|
},
|
|
161
165
|
Link: (M = t.Link) != null ? M : _themeJs.AnchorLink,
|
|
162
166
|
isDarkMode: f,
|
|
163
167
|
isIos: (0, _platformJs.getPlatform)(l) === "ios",
|
|
164
|
-
useHrefDecorator: (
|
|
168
|
+
useHrefDecorator: (b = t.useHrefDecorator) != null ? b : X,
|
|
165
169
|
useId: t.useId
|
|
166
170
|
};
|
|
167
171
|
}, [
|
|
168
172
|
t,
|
|
169
173
|
f
|
|
170
174
|
]), E = Object.fromEntries(Object.entries(p).map((param)=>{
|
|
171
|
-
let [l,
|
|
175
|
+
let [l, s] = param;
|
|
172
176
|
let n = "";
|
|
173
|
-
if (
|
|
174
|
-
const [d, x, m] = (0, _colorJs.fromHexToRgb)(
|
|
177
|
+
if (s.startsWith("#")) {
|
|
178
|
+
const [d, x, m] = (0, _colorJs.fromHexToRgb)(s);
|
|
175
179
|
n = `${d}, ${x}, ${m}`;
|
|
176
180
|
}
|
|
177
181
|
return [
|
|
@@ -195,7 +199,7 @@ const K = "(prefers-color-scheme: dark)", Q = ()=>{
|
|
|
195
199
|
value: D,
|
|
196
200
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_screenSizeContextProviderJs.default, {
|
|
197
201
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_dialogJs.default, {
|
|
198
|
-
children:
|
|
202
|
+
children: o ? /*#__PURE__*/ _react.createElement(o, {
|
|
199
203
|
style: k
|
|
200
204
|
}, c) : /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_jsxRuntimeJs.Fragment, {
|
|
201
205
|
children: [
|
package/dist/video.d.ts
CHANGED
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import type { DataAttributes } from './utils/types';
|
|
3
|
-
export type AspectRatio = '1:1' | '16:9' | '
|
|
3
|
+
export type AspectRatio = '1:1' | '16:9' | '4:3';
|
|
4
4
|
export declare const RATIO: {
|
|
5
5
|
'1:1': number;
|
|
6
6
|
'16:9': number;
|
|
7
|
-
'12:5': number;
|
|
8
7
|
'4:3': number;
|
|
9
8
|
};
|
|
10
9
|
type VideoSource = {
|
package/dist/video.js
CHANGED
|
@@ -141,7 +141,6 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
141
141
|
const C = {
|
|
142
142
|
"1:1": 1,
|
|
143
143
|
"16:9": 16 / 9,
|
|
144
|
-
"12:5": 12 / 5,
|
|
145
144
|
"4:3": 4 / 3
|
|
146
145
|
}, F = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAAtJREFUGFdjYAACAAAFAAGq1chRAAAAAElFTkSuQmCC", j = /*#__PURE__*/ _react.forwardRef((_param, l)=>{
|
|
147
146
|
var { src: t , poster: i , autoPlay: o = !(0, _platformJs.isRunningAcceptanceTest)() , muted: c = !0 , loop: m = !0 , preload: u = "none" , aspectRatio: A = "1:1" , dataAttributes: f } = _param, n = _objectWithoutProperties(_param, [
|