@telefonica/mistica 14.12.0 → 14.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/css/mistica.css +1 -1
- package/dist/boxed.css-mistica.js +4 -4
- package/dist/boxed.css.d.ts +1 -1
- package/dist/boxed.js +12 -14
- package/dist/card.css-mistica.js +27 -12
- package/dist/card.css.d.ts +7 -0
- package/dist/card.d.ts +36 -34
- package/dist/card.js +611 -469
- package/dist/fixed-footer-layout.js +8 -7
- package/dist/generated/mistica-icons/icon-alert-filled.js +15 -5
- package/dist/generated/mistica-icons/icon-alert-light.js +24 -8
- package/dist/generated/mistica-icons/icon-alert-regular.js +30 -14
- package/dist/generated/mistica-icons/icon-bell-filled.js +19 -9
- package/dist/generated/mistica-icons/icon-bell-light.js +16 -6
- package/dist/generated/mistica-icons/icon-bell-regular.js +19 -9
- package/dist/generated/mistica-icons/icon-dollar-symbol-circle-light.js +28 -11
- package/dist/generated/mistica-icons/icon-dollar-symbol-circle-regular.js +20 -9
- package/dist/generated/mistica-icons/icon-edit-pencil-light.js +21 -10
- package/dist/generated/mistica-icons/icon-edit-pencil-regular.js +22 -12
- package/dist/generated/mistica-icons/icon-gift-filled.js +19 -9
- package/dist/generated/mistica-icons/icon-gift-light.js +20 -10
- package/dist/generated/mistica-icons/icon-gift-regular.js +19 -9
- package/dist/generated/mistica-icons/icon-heart-filled.js +16 -6
- package/dist/generated/mistica-icons/icon-heart-light.js +18 -8
- package/dist/generated/mistica-icons/icon-heart-regular.js +24 -14
- package/dist/generated/mistica-icons/icon-home-filled.js +23 -13
- package/dist/generated/mistica-icons/icon-home-light.js +24 -14
- package/dist/generated/mistica-icons/icon-home-regular.js +21 -11
- package/dist/generated/mistica-icons/icon-home-wifi-filled.js +24 -7
- package/dist/generated/mistica-icons/icon-home-wifi-light.js +25 -8
- package/dist/generated/mistica-icons/icon-home-wifi-regular.js +24 -7
- package/dist/generated/mistica-icons/icon-pause-regular.js +10 -12
- package/dist/generated/mistica-icons/icon-play-regular.js +14 -16
- package/dist/generated/mistica-icons/icon-reload-light.js +22 -12
- package/dist/generated/mistica-icons/icon-reload-regular.js +24 -14
- package/dist/generated/mistica-icons/icon-share-filled.js +20 -10
- package/dist/generated/mistica-icons/icon-share-light.js +21 -11
- package/dist/generated/mistica-icons/icon-share-regular.js +21 -11
- package/dist/generated/mistica-icons/icon-shopping-bag-filled.d.ts +4 -0
- package/dist/generated/mistica-icons/icon-shopping-bag-filled.js +110 -0
- package/dist/generated/mistica-icons/icon-shopping-bag-light.d.ts +4 -0
- package/dist/generated/mistica-icons/icon-shopping-bag-light.js +110 -0
- package/dist/generated/mistica-icons/icon-shopping-bag-regular.d.ts +4 -0
- package/dist/generated/mistica-icons/icon-shopping-bag-regular.js +110 -0
- package/dist/generated/mistica-icons/icon-tickets-filled.js +17 -7
- package/dist/generated/mistica-icons/icon-tickets-light.js +26 -10
- package/dist/generated/mistica-icons/icon-tickets-regular.js +35 -19
- package/dist/hooks.js +57 -56
- package/dist/index.d.ts +3 -0
- package/dist/index.js +14 -1
- package/dist/package-version.js +1 -1
- package/dist/skins/blau.js +14 -2
- package/dist/skins/defaults.js +12 -0
- package/dist/skins/movistar-legacy.js +15 -3
- package/dist/skins/movistar.js +12 -0
- package/dist/skins/o2.js +13 -1
- package/dist/skins/telefonica.js +12 -0
- package/dist/skins/types/index.d.ts +1 -1
- package/dist/skins/vivo-new.js +12 -0
- package/dist/skins/vivo.js +13 -1
- package/dist/theme-context-provider.js +34 -30
- package/dist/tooltip.js +35 -34
- package/dist/utils/dom.js +10 -10
- package/dist/utils/environment.d.ts +1 -0
- package/dist/utils/environment.js +12 -4
- package/dist-es/boxed.css-mistica.js +3 -3
- package/dist-es/boxed.js +16 -18
- package/dist-es/card.css-mistica.js +2 -2
- package/dist-es/card.js +652 -511
- package/dist-es/fixed-footer-layout.js +18 -17
- package/dist-es/generated/mistica-icons/icon-alert-filled.js +18 -8
- package/dist-es/generated/mistica-icons/icon-alert-light.js +30 -14
- package/dist-es/generated/mistica-icons/icon-alert-regular.js +36 -20
- package/dist-es/generated/mistica-icons/icon-bell-filled.js +26 -16
- package/dist-es/generated/mistica-icons/icon-bell-light.js +20 -10
- package/dist-es/generated/mistica-icons/icon-bell-regular.js +20 -10
- package/dist-es/generated/mistica-icons/icon-dollar-symbol-circle-light.js +33 -16
- package/dist-es/generated/mistica-icons/icon-dollar-symbol-circle-regular.js +25 -14
- package/dist-es/generated/mistica-icons/icon-edit-pencil-light.js +25 -14
- package/dist-es/generated/mistica-icons/icon-edit-pencil-regular.js +30 -20
- package/dist-es/generated/mistica-icons/icon-gift-filled.js +22 -12
- package/dist-es/generated/mistica-icons/icon-gift-light.js +23 -13
- package/dist-es/generated/mistica-icons/icon-gift-regular.js +22 -12
- package/dist-es/generated/mistica-icons/icon-heart-filled.js +18 -8
- package/dist-es/generated/mistica-icons/icon-heart-light.js +24 -14
- package/dist-es/generated/mistica-icons/icon-heart-regular.js +25 -15
- package/dist-es/generated/mistica-icons/icon-home-filled.js +30 -20
- package/dist-es/generated/mistica-icons/icon-home-light.js +27 -17
- package/dist-es/generated/mistica-icons/icon-home-regular.js +27 -17
- package/dist-es/generated/mistica-icons/icon-home-wifi-filled.js +28 -11
- package/dist-es/generated/mistica-icons/icon-home-wifi-light.js +29 -12
- package/dist-es/generated/mistica-icons/icon-home-wifi-regular.js +28 -11
- package/dist-es/generated/mistica-icons/icon-pause-regular.js +12 -14
- package/dist-es/generated/mistica-icons/icon-play-regular.js +19 -21
- package/dist-es/generated/mistica-icons/icon-reload-light.js +27 -17
- package/dist-es/generated/mistica-icons/icon-reload-regular.js +27 -17
- package/dist-es/generated/mistica-icons/icon-share-filled.js +25 -15
- package/dist-es/generated/mistica-icons/icon-share-light.js +28 -18
- package/dist-es/generated/mistica-icons/icon-share-regular.js +28 -18
- package/dist-es/generated/mistica-icons/icon-shopping-bag-filled.js +101 -0
- package/dist-es/generated/mistica-icons/icon-shopping-bag-light.js +101 -0
- package/dist-es/generated/mistica-icons/icon-shopping-bag-regular.js +101 -0
- package/dist-es/generated/mistica-icons/icon-tickets-filled.js +21 -11
- package/dist-es/generated/mistica-icons/icon-tickets-light.js +30 -14
- package/dist-es/generated/mistica-icons/icon-tickets-regular.js +43 -27
- package/dist-es/hooks.js +51 -50
- package/dist-es/index.js +1762 -1758
- package/dist-es/package-version.js +1 -1
- package/dist-es/skins/blau.js +14 -2
- package/dist-es/skins/defaults.js +12 -0
- package/dist-es/skins/movistar-legacy.js +15 -3
- package/dist-es/skins/movistar.js +12 -0
- package/dist-es/skins/o2.js +13 -1
- package/dist-es/skins/telefonica.js +12 -0
- package/dist-es/skins/vivo-new.js +12 -0
- package/dist-es/skins/vivo.js +13 -1
- package/dist-es/style.css +1 -1
- package/dist-es/theme-context-provider.js +72 -68
- package/dist-es/tooltip.js +37 -36
- package/dist-es/utils/dom.js +9 -9
- package/dist-es/utils/environment.js +2 -2
- package/package.json +1 -1
- package/dist/boxed.css.ts.vanilla.css-mistica.js +0 -11
- package/dist-es/boxed.css.ts.vanilla.css-mistica.js +0 -2
package/dist/hooks.js
CHANGED
|
@@ -10,40 +10,40 @@ function _export(target, all) {
|
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
12
|
useAriaId: function() {
|
|
13
|
-
return
|
|
13
|
+
return z;
|
|
14
14
|
},
|
|
15
15
|
useDisableBodyScroll: function() {
|
|
16
|
-
return
|
|
16
|
+
return E;
|
|
17
17
|
},
|
|
18
18
|
useElementDimensions: function() {
|
|
19
|
-
return
|
|
19
|
+
return T;
|
|
20
20
|
},
|
|
21
21
|
useIsInViewport: function() {
|
|
22
|
-
return
|
|
22
|
+
return A;
|
|
23
23
|
},
|
|
24
24
|
useIsWithinIFrame: function() {
|
|
25
|
-
return
|
|
25
|
+
return L;
|
|
26
26
|
},
|
|
27
27
|
useIsomorphicLayoutEffect: function() {
|
|
28
|
-
return
|
|
28
|
+
return M;
|
|
29
29
|
},
|
|
30
30
|
useScreenHeight: function() {
|
|
31
|
-
return
|
|
31
|
+
return B;
|
|
32
32
|
},
|
|
33
33
|
useScreenSize: function() {
|
|
34
|
-
return
|
|
34
|
+
return H;
|
|
35
35
|
},
|
|
36
36
|
useTheme: function() {
|
|
37
37
|
return y;
|
|
38
38
|
},
|
|
39
39
|
useWindowHeight: function() {
|
|
40
|
-
return
|
|
40
|
+
return C;
|
|
41
41
|
},
|
|
42
42
|
useWindowSize: function() {
|
|
43
|
-
return
|
|
43
|
+
return w;
|
|
44
44
|
},
|
|
45
45
|
useWindowWidth: function() {
|
|
46
|
-
return
|
|
46
|
+
return R;
|
|
47
47
|
}
|
|
48
48
|
});
|
|
49
49
|
const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
|
|
@@ -51,6 +51,7 @@ const _themecontext = /*#__PURE__*/ _interop_require_default(require("./theme-co
|
|
|
51
51
|
const _screensizecontext = /*#__PURE__*/ _interop_require_default(require("./screen-size-context.js"));
|
|
52
52
|
const _ariaidgettercontext = /*#__PURE__*/ _interop_require_default(require("./aria-id-getter-context.js"));
|
|
53
53
|
const _dom = require("./utils/dom.js");
|
|
54
|
+
const _environment = require("./utils/environment.js");
|
|
54
55
|
function _interop_require_default(obj) {
|
|
55
56
|
return obj && obj.__esModule ? obj : {
|
|
56
57
|
default: obj
|
|
@@ -99,109 +100,109 @@ const y = ()=>{
|
|
|
99
100
|
const t = _react.useContext(_themecontext.default);
|
|
100
101
|
if (!t) throw Error("To use @telefonica/mistica components you must instantiate <ThemeContextProvider> as their parent.");
|
|
101
102
|
return t;
|
|
102
|
-
},
|
|
103
|
+
}, E = (t)=>{
|
|
103
104
|
_react.useEffect(()=>{
|
|
104
105
|
if (t) {
|
|
105
|
-
let
|
|
106
|
-
const r = document.scrollingElement || document.documentElement,
|
|
106
|
+
let s = "", e = 0, i = 0;
|
|
107
|
+
const r = document.scrollingElement || document.documentElement, c = ()=>{
|
|
107
108
|
var u;
|
|
108
109
|
var _ref, _ref1;
|
|
109
|
-
if (
|
|
110
|
+
if (i++, !(i > 1) && (e = (_ref = r == null ? void 0 : r.scrollTop) !== null && _ref !== void 0 ? _ref : 0, s = (_ref1 = (u = document.body) == null ? void 0 : u.style.cssText) !== null && _ref1 !== void 0 ? _ref1 : "", document.body)) {
|
|
110
111
|
var _ref2;
|
|
111
|
-
const
|
|
112
|
-
document.body.style.cssText = `overflow:hidden;overflow-y:${
|
|
112
|
+
const l = window.innerWidth > ((_ref2 = r == null ? void 0 : r.clientWidth) !== null && _ref2 !== void 0 ? _ref2 : window.innerWidth) ? "scroll" : "hidden";
|
|
113
|
+
document.body.style.cssText = `overflow:hidden;overflow-y:${l};position:fixed;top:${-e}px;left:0px;right:0px;bottom:0px`;
|
|
113
114
|
}
|
|
114
|
-
},
|
|
115
|
-
|
|
115
|
+
}, o = ()=>{
|
|
116
|
+
i--, !(i > 0) && (document.body && (document.body.style.cssText = s), r && (r.scrollTop = e));
|
|
116
117
|
};
|
|
117
|
-
return
|
|
118
|
+
return c(), o;
|
|
118
119
|
}
|
|
119
120
|
return ()=>{};
|
|
120
121
|
}, [
|
|
121
122
|
t
|
|
122
123
|
]);
|
|
123
|
-
},
|
|
124
|
-
const [t,
|
|
125
|
-
if (!
|
|
126
|
-
|
|
124
|
+
}, H = ()=>_react.useContext(_screensizecontext.default), T = ()=>{
|
|
125
|
+
const [t, s] = _react.useState(0), [e, i] = _react.useState(0), [r, c] = _react.useState(null), o = _react.useCallback((d)=>{
|
|
126
|
+
if (!d) {
|
|
127
|
+
s(0), i(0);
|
|
127
128
|
return;
|
|
128
129
|
}
|
|
129
|
-
const { width:
|
|
130
|
-
|
|
131
|
-
}, []), u = _react.useCallback((
|
|
132
|
-
d
|
|
130
|
+
const { width: l , height: a } = d[0].contentRect;
|
|
131
|
+
s(l), i(a);
|
|
132
|
+
}, []), u = _react.useCallback((d)=>{
|
|
133
|
+
c(d);
|
|
133
134
|
}, []);
|
|
134
135
|
return _react.useEffect(()=>{
|
|
135
136
|
if (!r) {
|
|
136
|
-
|
|
137
|
+
s(0), i(0);
|
|
137
138
|
return;
|
|
138
139
|
}
|
|
139
|
-
return (0, _dom.listenResize)(r,
|
|
140
|
+
return (0, _dom.listenResize)(r, o);
|
|
140
141
|
}, [
|
|
141
142
|
r,
|
|
142
|
-
|
|
143
|
+
o
|
|
143
144
|
]), {
|
|
144
145
|
width: t,
|
|
145
146
|
height: e,
|
|
146
147
|
ref: u
|
|
147
148
|
};
|
|
148
|
-
},
|
|
149
|
-
const { useId:
|
|
150
|
-
if (
|
|
151
|
-
const e =
|
|
149
|
+
}, z = (t)=>{
|
|
150
|
+
const { useId: s } = y();
|
|
151
|
+
if (s) {
|
|
152
|
+
const e = s();
|
|
152
153
|
return t || e;
|
|
153
154
|
} else {
|
|
154
155
|
const e = _react.useContext(_ariaidgettercontext.default);
|
|
155
156
|
return _react.useRef(t || e()).current;
|
|
156
157
|
}
|
|
157
|
-
},
|
|
158
|
-
const [t,
|
|
158
|
+
}, w = ()=>{
|
|
159
|
+
const [t, s] = _react.useState((0, _environment.isClientSide)() ? window.innerHeight : 1200), [e, i] = _react.useState((0, _environment.isClientSide)() ? window.innerWidth : 800), [r, c] = _react.useState((0, _environment.isClientSide)() ? window.screen.availHeight : 1200), [o, u] = _react.useState((0, _environment.isClientSide)() ? window.screen.availWidth : 800);
|
|
159
160
|
return _react.useEffect(()=>{
|
|
160
|
-
const
|
|
161
|
-
|
|
161
|
+
const d = ()=>{
|
|
162
|
+
s(window.innerHeight), i(window.innerWidth), c(window.screen.availHeight), u(window.screen.availWidth);
|
|
162
163
|
};
|
|
163
|
-
return window.addEventListener("resize",
|
|
164
|
-
window.removeEventListener("resize",
|
|
164
|
+
return window.addEventListener("resize", d), ()=>{
|
|
165
|
+
window.removeEventListener("resize", d);
|
|
165
166
|
};
|
|
166
167
|
}, []), _react.useMemo(()=>({
|
|
167
168
|
height: t,
|
|
168
169
|
width: e,
|
|
169
170
|
screenHeight: r,
|
|
170
|
-
screenWidth:
|
|
171
|
+
screenWidth: o
|
|
171
172
|
}), [
|
|
172
173
|
t,
|
|
173
174
|
e,
|
|
174
175
|
r,
|
|
175
|
-
|
|
176
|
+
o
|
|
176
177
|
]);
|
|
177
|
-
},
|
|
178
|
-
const { height: t } =
|
|
178
|
+
}, C = ()=>{
|
|
179
|
+
const { height: t } = w();
|
|
179
180
|
return t;
|
|
180
|
-
},
|
|
181
|
-
const { width: t } =
|
|
181
|
+
}, R = ()=>{
|
|
182
|
+
const { width: t } = w();
|
|
182
183
|
return t;
|
|
183
|
-
},
|
|
184
|
-
const { screenHeight: t } =
|
|
184
|
+
}, B = ()=>{
|
|
185
|
+
const { screenHeight: t } = w();
|
|
185
186
|
return t;
|
|
186
|
-
},
|
|
187
|
-
const [
|
|
187
|
+
}, L = ()=>(0, _environment.isClientSide)() && window.top !== window.self, M = (0, _environment.isClientSide)() ? _react.useLayoutEffect : _react.useEffect, A = (t, s, e)=>{
|
|
188
|
+
const [i, r] = _react.useState(s);
|
|
188
189
|
return _react.useEffect(()=>{
|
|
189
190
|
if (!t.current) return;
|
|
190
191
|
if (typeof window.IntersectionObserver > "u") return ()=>{};
|
|
191
|
-
const
|
|
192
|
-
r(
|
|
192
|
+
const c = new IntersectionObserver((o)=>{
|
|
193
|
+
r(o[0].isIntersecting);
|
|
193
194
|
}, {
|
|
194
195
|
root: e == null ? void 0 : e.root,
|
|
195
196
|
rootMargin: e == null ? void 0 : e.rootMargin,
|
|
196
197
|
threshold: e == null ? void 0 : e.threshold
|
|
197
198
|
});
|
|
198
|
-
return
|
|
199
|
-
|
|
199
|
+
return c.observe(t.current), ()=>{
|
|
200
|
+
c.disconnect();
|
|
200
201
|
};
|
|
201
202
|
}, [
|
|
202
203
|
t,
|
|
203
204
|
e == null ? void 0 : e.root,
|
|
204
205
|
e == null ? void 0 : e.rootMargin,
|
|
205
206
|
e == null ? void 0 : e.threshold
|
|
206
|
-
]),
|
|
207
|
+
]), i;
|
|
207
208
|
};
|
package/dist/index.d.ts
CHANGED
|
@@ -1472,6 +1472,9 @@ export { default as IconShieldLight } from './generated/mistica-icons/icon-shiel
|
|
|
1472
1472
|
export { default as IconShieldRegular } from './generated/mistica-icons/icon-shield-regular';
|
|
1473
1473
|
export { default as IconShopFilled } from './generated/mistica-icons/icon-shop-filled';
|
|
1474
1474
|
export { default as IconShopLight } from './generated/mistica-icons/icon-shop-light';
|
|
1475
|
+
export { default as IconShoppingBagFilled } from './generated/mistica-icons/icon-shopping-bag-filled';
|
|
1476
|
+
export { default as IconShoppingBagLight } from './generated/mistica-icons/icon-shopping-bag-light';
|
|
1477
|
+
export { default as IconShoppingBagRegular } from './generated/mistica-icons/icon-shopping-bag-regular';
|
|
1475
1478
|
export { default as IconShoppingCartFilled } from './generated/mistica-icons/icon-shopping-cart-filled';
|
|
1476
1479
|
export { default as IconShoppingCartLight } from './generated/mistica-icons/icon-shopping-cart-light';
|
|
1477
1480
|
export { default as IconShoppingCartRegular } from './generated/mistica-icons/icon-shopping-cart-regular';
|
package/dist/index.js
CHANGED
|
@@ -4215,6 +4215,15 @@ _export(exports, {
|
|
|
4215
4215
|
IconShopRegular: function() {
|
|
4216
4216
|
return _iconshopregular.default;
|
|
4217
4217
|
},
|
|
4218
|
+
IconShoppingBagFilled: function() {
|
|
4219
|
+
return _iconshoppingbagfilled.default;
|
|
4220
|
+
},
|
|
4221
|
+
IconShoppingBagLight: function() {
|
|
4222
|
+
return _iconshoppingbaglight.default;
|
|
4223
|
+
},
|
|
4224
|
+
IconShoppingBagRegular: function() {
|
|
4225
|
+
return _iconshoppingbagregular.default;
|
|
4226
|
+
},
|
|
4218
4227
|
IconShoppingCartFilled: function() {
|
|
4219
4228
|
return _iconshoppingcartfilled.default;
|
|
4220
4229
|
},
|
|
@@ -5504,6 +5513,7 @@ _export(exports, {
|
|
|
5504
5513
|
}
|
|
5505
5514
|
});
|
|
5506
5515
|
const _packageversion = require("./package-version.js");
|
|
5516
|
+
const _environment = require("./utils/environment.js");
|
|
5507
5517
|
const _skincontractcssmistica = require("./skins/skin-contract.css-mistica.js");
|
|
5508
5518
|
const _mediaqueriescssmistica = /*#__PURE__*/ _interop_require_wildcard(require("./media-queries.css-mistica.js"));
|
|
5509
5519
|
const _themecontext = /*#__PURE__*/ _interop_require_default(require("./theme-context.js"));
|
|
@@ -6959,6 +6969,9 @@ const _iconshieldlight = /*#__PURE__*/ _interop_require_default(require("./gener
|
|
|
6959
6969
|
const _iconshieldregular = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shield-regular.js"));
|
|
6960
6970
|
const _iconshopfilled = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shop-filled.js"));
|
|
6961
6971
|
const _iconshoplight = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shop-light.js"));
|
|
6972
|
+
const _iconshoppingbagfilled = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shopping-bag-filled.js"));
|
|
6973
|
+
const _iconshoppingbaglight = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shopping-bag-light.js"));
|
|
6974
|
+
const _iconshoppingbagregular = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shopping-bag-regular.js"));
|
|
6962
6975
|
const _iconshoppingcartfilled = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shopping-cart-filled.js"));
|
|
6963
6976
|
const _iconshoppingcartlight = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shopping-cart-light.js"));
|
|
6964
6977
|
const _iconshoppingcartregular = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-shopping-cart-regular.js"));
|
|
@@ -7304,7 +7317,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
|
|
|
7304
7317
|
}
|
|
7305
7318
|
return newObj;
|
|
7306
7319
|
}
|
|
7307
|
-
if (process.env.NODE_ENV !== "production" &&
|
|
7320
|
+
if (process.env.NODE_ENV !== "production" && (0, _environment.isClientSide)()) {
|
|
7308
7321
|
if (window.__mistica_version__ && window.__mistica_version__ !== _packageversion.PACKAGE_VERSION) throw new Error("There is more than one version of @telefonica/mistica running on the same page");
|
|
7309
7322
|
window.__mistica_version__ = _packageversion.PACKAGE_VERSION;
|
|
7310
7323
|
}
|
package/dist/package-version.js
CHANGED
package/dist/skins/blau.js
CHANGED
|
@@ -133,7 +133,7 @@ const e = {
|
|
|
133
133
|
neutralHigh: e.grey6,
|
|
134
134
|
neutralMedium: e.grey5,
|
|
135
135
|
neutralMediumInverse: e.grey5,
|
|
136
|
-
neutralLow: e.
|
|
136
|
+
neutralLow: e.grey1,
|
|
137
137
|
neutralLowAlternative: e.grey2,
|
|
138
138
|
textPrimary: e.grey6,
|
|
139
139
|
textPrimaryInverse: e.white,
|
|
@@ -286,7 +286,19 @@ const e = {
|
|
|
286
286
|
},
|
|
287
287
|
textPresets: {
|
|
288
288
|
cardTitle: {
|
|
289
|
-
weight: "
|
|
289
|
+
weight: "regular"
|
|
290
|
+
},
|
|
291
|
+
button: {
|
|
292
|
+
weight: "medium"
|
|
293
|
+
},
|
|
294
|
+
link: {
|
|
295
|
+
weight: "medium"
|
|
296
|
+
},
|
|
297
|
+
title1: {
|
|
298
|
+
weight: "medium"
|
|
299
|
+
},
|
|
300
|
+
indicator: {
|
|
301
|
+
weight: "medium"
|
|
290
302
|
},
|
|
291
303
|
text5: {
|
|
292
304
|
weight: "light"
|
package/dist/skins/defaults.js
CHANGED
|
@@ -37,6 +37,18 @@ const t = {
|
|
|
37
37
|
},
|
|
38
38
|
cardTitle: {
|
|
39
39
|
weight: "regular"
|
|
40
|
+
},
|
|
41
|
+
button: {
|
|
42
|
+
weight: "medium"
|
|
43
|
+
},
|
|
44
|
+
link: {
|
|
45
|
+
weight: "medium"
|
|
46
|
+
},
|
|
47
|
+
title1: {
|
|
48
|
+
weight: "medium"
|
|
49
|
+
},
|
|
50
|
+
indicator: {
|
|
51
|
+
weight: "medium"
|
|
40
52
|
}
|
|
41
53
|
}, e = {
|
|
42
54
|
button: "4px",
|
|
@@ -59,8 +59,8 @@ const e = {
|
|
|
59
59
|
movistarProminentBlueLight70: "#546874",
|
|
60
60
|
darkModeBlack: "#191919",
|
|
61
61
|
darkModeGrey: "#242424"
|
|
62
|
-
}, d = (
|
|
63
|
-
const
|
|
62
|
+
}, d = (o)=>{
|
|
63
|
+
const t = {
|
|
64
64
|
name: _constants.MOVISTAR_LEGACY_SKIN,
|
|
65
65
|
colors: {
|
|
66
66
|
background: e.white,
|
|
@@ -292,6 +292,18 @@ const e = {
|
|
|
292
292
|
cardTitle: {
|
|
293
293
|
weight: "bold"
|
|
294
294
|
},
|
|
295
|
+
button: {
|
|
296
|
+
weight: "medium"
|
|
297
|
+
},
|
|
298
|
+
link: {
|
|
299
|
+
weight: "medium"
|
|
300
|
+
},
|
|
301
|
+
title1: {
|
|
302
|
+
weight: "medium"
|
|
303
|
+
},
|
|
304
|
+
indicator: {
|
|
305
|
+
weight: "medium"
|
|
306
|
+
},
|
|
295
307
|
text5: {
|
|
296
308
|
weight: "bold"
|
|
297
309
|
},
|
|
@@ -312,5 +324,5 @@ const e = {
|
|
|
312
324
|
}
|
|
313
325
|
}
|
|
314
326
|
};
|
|
315
|
-
return
|
|
327
|
+
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;
|
|
316
328
|
};
|
package/dist/skins/movistar.js
CHANGED
|
@@ -292,6 +292,18 @@ const e = {
|
|
|
292
292
|
cardTitle: {
|
|
293
293
|
weight: "bold"
|
|
294
294
|
},
|
|
295
|
+
button: {
|
|
296
|
+
weight: "medium"
|
|
297
|
+
},
|
|
298
|
+
link: {
|
|
299
|
+
weight: "medium"
|
|
300
|
+
},
|
|
301
|
+
title1: {
|
|
302
|
+
weight: "medium"
|
|
303
|
+
},
|
|
304
|
+
indicator: {
|
|
305
|
+
weight: "medium"
|
|
306
|
+
},
|
|
295
307
|
text5: {
|
|
296
308
|
weight: "bold"
|
|
297
309
|
},
|
package/dist/skins/o2.js
CHANGED
|
@@ -290,7 +290,19 @@ const e = {
|
|
|
290
290
|
},
|
|
291
291
|
textPresets: {
|
|
292
292
|
cardTitle: {
|
|
293
|
-
weight: "
|
|
293
|
+
weight: "regular"
|
|
294
|
+
},
|
|
295
|
+
button: {
|
|
296
|
+
weight: "medium"
|
|
297
|
+
},
|
|
298
|
+
link: {
|
|
299
|
+
weight: "medium"
|
|
300
|
+
},
|
|
301
|
+
title1: {
|
|
302
|
+
weight: "medium"
|
|
303
|
+
},
|
|
304
|
+
indicator: {
|
|
305
|
+
weight: "medium"
|
|
294
306
|
},
|
|
295
307
|
text5: {
|
|
296
308
|
weight: "light"
|
package/dist/skins/telefonica.js
CHANGED
|
@@ -286,6 +286,18 @@ const e = {
|
|
|
286
286
|
cardTitle: {
|
|
287
287
|
weight: "regular"
|
|
288
288
|
},
|
|
289
|
+
button: {
|
|
290
|
+
weight: "medium"
|
|
291
|
+
},
|
|
292
|
+
link: {
|
|
293
|
+
weight: "medium"
|
|
294
|
+
},
|
|
295
|
+
title1: {
|
|
296
|
+
weight: "medium"
|
|
297
|
+
},
|
|
298
|
+
indicator: {
|
|
299
|
+
weight: "medium"
|
|
300
|
+
},
|
|
289
301
|
text5: {
|
|
290
302
|
weight: "regular"
|
|
291
303
|
},
|
|
@@ -5,7 +5,7 @@ export type KnownSkinName = 'Movistar' | 'O2' | 'O2-classic' | 'Vivo' | 'Vivo-ne
|
|
|
5
5
|
export type SkinName = KnownSkinName | string;
|
|
6
6
|
export type GetKnownSkin = (variant?: SkinVariant) => KnownSkin;
|
|
7
7
|
export type FontWeight = 'light' | 'regular' | 'medium' | 'bold';
|
|
8
|
-
type TextPresetName = 'text5' | 'text6' | 'text7' | 'text8' | 'text9' | 'text10' | 'cardTitle';
|
|
8
|
+
type TextPresetName = 'text5' | 'text6' | 'text7' | 'text8' | 'text9' | 'text10' | 'cardTitle' | 'button' | 'link' | 'title1' | 'indicator';
|
|
9
9
|
export type TextPresetsConfig = {
|
|
10
10
|
[preset in TextPresetName]: {
|
|
11
11
|
weight: FontWeight;
|
package/dist/skins/vivo-new.js
CHANGED
|
@@ -286,6 +286,18 @@ const e = {
|
|
|
286
286
|
cardTitle: {
|
|
287
287
|
weight: "regular"
|
|
288
288
|
},
|
|
289
|
+
button: {
|
|
290
|
+
weight: "regular"
|
|
291
|
+
},
|
|
292
|
+
link: {
|
|
293
|
+
weight: "regular"
|
|
294
|
+
},
|
|
295
|
+
title1: {
|
|
296
|
+
weight: "regular"
|
|
297
|
+
},
|
|
298
|
+
indicator: {
|
|
299
|
+
weight: "regular"
|
|
300
|
+
},
|
|
289
301
|
text5: {
|
|
290
302
|
weight: "regular"
|
|
291
303
|
},
|
package/dist/skins/vivo.js
CHANGED
|
@@ -284,7 +284,19 @@ const e = {
|
|
|
284
284
|
},
|
|
285
285
|
textPresets: {
|
|
286
286
|
cardTitle: {
|
|
287
|
-
weight: "
|
|
287
|
+
weight: "regular"
|
|
288
|
+
},
|
|
289
|
+
button: {
|
|
290
|
+
weight: "medium"
|
|
291
|
+
},
|
|
292
|
+
link: {
|
|
293
|
+
weight: "medium"
|
|
294
|
+
},
|
|
295
|
+
title1: {
|
|
296
|
+
weight: "medium"
|
|
297
|
+
},
|
|
298
|
+
indicator: {
|
|
299
|
+
weight: "medium"
|
|
288
300
|
},
|
|
289
301
|
text5: {
|
|
290
302
|
weight: "light"
|
|
@@ -10,10 +10,10 @@ function _export(target, all) {
|
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
12
|
default: function() {
|
|
13
|
-
return
|
|
13
|
+
return bt;
|
|
14
14
|
},
|
|
15
15
|
useIsOsDarkModeEnabled: function() {
|
|
16
|
-
return
|
|
16
|
+
return Y;
|
|
17
17
|
}
|
|
18
18
|
});
|
|
19
19
|
const _jsxruntime = require("react/jsx-runtime");
|
|
@@ -106,23 +106,23 @@ function _object_spread(target) {
|
|
|
106
106
|
}
|
|
107
107
|
return target;
|
|
108
108
|
}
|
|
109
|
-
const
|
|
109
|
+
const X = "(prefers-color-scheme: dark)", Y = ()=>{
|
|
110
110
|
const [t, c] = _react.useState(!1);
|
|
111
111
|
return (0, _hooks.useIsomorphicLayoutEffect)(()=>{
|
|
112
112
|
if (!window.matchMedia) return;
|
|
113
|
-
const o = window.matchMedia(
|
|
113
|
+
const o = window.matchMedia(X), s = ()=>{
|
|
114
114
|
c(o.matches);
|
|
115
115
|
};
|
|
116
116
|
return o.addListener(s), s(), ()=>o.removeListener(s);
|
|
117
117
|
}, []), t;
|
|
118
|
-
},
|
|
118
|
+
}, Z = ()=>(t)=>t, tt = (t)=>({
|
|
119
119
|
headerMobileHeight: (t == null ? void 0 : t.headerMobileHeight) === "mistica" ? _theme.NAVBAR_HEIGHT_MOBILE : t == null ? void 0 : t.headerMobileHeight
|
|
120
|
-
}),
|
|
120
|
+
}), et = (param)=>{
|
|
121
121
|
let { theme: t , children: c , as: o } = param;
|
|
122
122
|
var _t_colorScheme, _t_skin_borderRadii;
|
|
123
|
-
const s = _react.useRef(1),
|
|
124
|
-
var i, n,
|
|
125
|
-
const
|
|
123
|
+
const s = _react.useRef(1), I = _react.useCallback(()=>`aria-id-hook-${s.current++}`, []), E = Y(), m = (_t_colorScheme = t.colorScheme) !== null && _t_colorScheme !== void 0 ? _t_colorScheme : "auto", R = t.skin.colors, A = _object_spread({}, t.skin.colors, t.skin.darkModeColors), u = m === "auto" && E || m === "dark", k = u ? A : R, p = _react.useMemo(()=>{
|
|
124
|
+
var i, n, d, x, f, P, b, g, M, T, C;
|
|
125
|
+
const l = _object_spread({
|
|
126
126
|
platform: (0, _platform.getPlatform)(),
|
|
127
127
|
insideNovumNativeApp: (0, _platform.isInsideNovumNativeApp)()
|
|
128
128
|
}, t.platformOverrides);
|
|
@@ -130,58 +130,62 @@ const J = "(prefers-color-scheme: dark)", K = ()=>{
|
|
|
130
130
|
return {
|
|
131
131
|
skinName: t.skin.name,
|
|
132
132
|
i18n: t.i18n,
|
|
133
|
-
platformOverrides:
|
|
133
|
+
platformOverrides: l,
|
|
134
134
|
texts: _object_spread({}, (0, _theme.getTexts)(t.i18n.locale), t.texts),
|
|
135
135
|
analytics: _object_spread({
|
|
136
136
|
logEvent: ()=>Promise.resolve(),
|
|
137
137
|
eventFormat: "universal-analytics"
|
|
138
138
|
}, t.analytics),
|
|
139
|
-
dimensions: _object_spread({}, _theme.dimensions,
|
|
139
|
+
dimensions: _object_spread({}, _theme.dimensions, tt(t.dimensions)),
|
|
140
140
|
textPresets: {
|
|
141
141
|
text5: _object_spread({}, _defaults.defaultTextPresetsConfig.text5, (i = t.skin.textPresets) == null ? void 0 : i.text5),
|
|
142
142
|
text6: _object_spread({}, _defaults.defaultTextPresetsConfig.text6, (n = t.skin.textPresets) == null ? void 0 : n.text6),
|
|
143
|
-
text7: _object_spread({}, _defaults.defaultTextPresetsConfig.text7, (
|
|
144
|
-
text8: _object_spread({}, _defaults.defaultTextPresetsConfig.text8, (
|
|
145
|
-
text9: _object_spread({}, _defaults.defaultTextPresetsConfig.text9, (
|
|
143
|
+
text7: _object_spread({}, _defaults.defaultTextPresetsConfig.text7, (d = t.skin.textPresets) == null ? void 0 : d.text7),
|
|
144
|
+
text8: _object_spread({}, _defaults.defaultTextPresetsConfig.text8, (x = t.skin.textPresets) == null ? void 0 : x.text8),
|
|
145
|
+
text9: _object_spread({}, _defaults.defaultTextPresetsConfig.text9, (f = t.skin.textPresets) == null ? void 0 : f.text9),
|
|
146
146
|
text10: _object_spread({}, _defaults.defaultTextPresetsConfig.text10, (P = t.skin.textPresets) == null ? void 0 : P.text10),
|
|
147
|
-
cardTitle: _object_spread({}, _defaults.defaultTextPresetsConfig.cardTitle, (b = t.skin.textPresets) == null ? void 0 : b.cardTitle)
|
|
147
|
+
cardTitle: _object_spread({}, _defaults.defaultTextPresetsConfig.cardTitle, (b = t.skin.textPresets) == null ? void 0 : b.cardTitle),
|
|
148
|
+
button: _object_spread({}, _defaults.defaultTextPresetsConfig.button, (g = t.skin.textPresets) == null ? void 0 : g.button),
|
|
149
|
+
link: _object_spread({}, _defaults.defaultTextPresetsConfig.link, (M = t.skin.textPresets) == null ? void 0 : M.link),
|
|
150
|
+
title1: _object_spread({}, _defaults.defaultTextPresetsConfig.title1, (T = t.skin.textPresets) == null ? void 0 : T.title1),
|
|
151
|
+
indicator: _object_spread({}, _defaults.defaultTextPresetsConfig.indicator, (C = t.skin.textPresets) == null ? void 0 : C.indicator)
|
|
148
152
|
},
|
|
149
153
|
Link: (_t_Link = t.Link) !== null && _t_Link !== void 0 ? _t_Link : _theme.AnchorLink,
|
|
150
|
-
isDarkMode:
|
|
151
|
-
isIos: (0, _platform.getPlatform)(
|
|
152
|
-
useHrefDecorator: (_t_useHrefDecorator = t.useHrefDecorator) !== null && _t_useHrefDecorator !== void 0 ? _t_useHrefDecorator :
|
|
154
|
+
isDarkMode: u,
|
|
155
|
+
isIos: (0, _platform.getPlatform)(l) === "ios",
|
|
156
|
+
useHrefDecorator: (_t_useHrefDecorator = t.useHrefDecorator) !== null && _t_useHrefDecorator !== void 0 ? _t_useHrefDecorator : Z,
|
|
153
157
|
useId: t.useId
|
|
154
158
|
};
|
|
155
159
|
}, [
|
|
156
160
|
t,
|
|
157
|
-
|
|
158
|
-
]),
|
|
159
|
-
let [
|
|
161
|
+
u
|
|
162
|
+
]), H = Object.fromEntries(Object.entries(k).map((param)=>{
|
|
163
|
+
let [l, i] = param;
|
|
160
164
|
let n = "";
|
|
161
165
|
if (i.startsWith("#")) {
|
|
162
|
-
const [
|
|
163
|
-
n = `${
|
|
166
|
+
const [d, x, f] = (0, _color.fromHexToRgb)(i);
|
|
167
|
+
n = `${d}, ${x}, ${f}`;
|
|
164
168
|
}
|
|
165
169
|
return [
|
|
166
|
-
|
|
170
|
+
l,
|
|
167
171
|
n
|
|
168
172
|
];
|
|
169
173
|
})), v = (0, _dynamic.assignInlineVars)(_skincontractcssmistica.vars, {
|
|
170
|
-
colors:
|
|
171
|
-
rawColors:
|
|
174
|
+
colors: k,
|
|
175
|
+
rawColors: H,
|
|
172
176
|
borderRadii: (_t_skin_borderRadii = t.skin.borderRadii) !== null && _t_skin_borderRadii !== void 0 ? _t_skin_borderRadii : _defaults.defaultBorderRadiiConfig
|
|
173
177
|
});
|
|
174
178
|
return /* @__PURE__ */ (0, _jsxruntime.jsx)(_tabfocus.default, {
|
|
175
179
|
disabled: !t.enableTabFocus,
|
|
176
180
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_modalcontextprovider.default, {
|
|
177
181
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_themecontext.default.Provider, {
|
|
178
|
-
value:
|
|
182
|
+
value: p,
|
|
179
183
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_analytics.TrackingConfig, {
|
|
180
|
-
eventFormat:
|
|
184
|
+
eventFormat: p.analytics.eventFormat,
|
|
181
185
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_aspectratiosupport.AspectRatioSupportProvider, {
|
|
182
186
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_documentvisibility.DocumentVisibilityProvider, {
|
|
183
187
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_ariaidgettercontext.default.Provider, {
|
|
184
|
-
value:
|
|
188
|
+
value: I,
|
|
185
189
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_screensizecontextprovider.default, {
|
|
186
190
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_dialog.default, {
|
|
187
191
|
children: o ? /*#__PURE__*/ _react.createElement(o, {
|
|
@@ -203,4 +207,4 @@ const J = "(prefers-color-scheme: dark)", K = ()=>{
|
|
|
203
207
|
})
|
|
204
208
|
})
|
|
205
209
|
});
|
|
206
|
-
},
|
|
210
|
+
}, bt = et;
|