@telefonica/mistica 14.3.0 → 14.4.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/css/mistica.css +1 -1
- package/dist/card.css-mistica.js +3 -3
- package/dist/card.d.ts +8 -6
- package/dist/card.js +204 -178
- package/dist/date-time-picker.js +14 -14
- package/dist/empty-state-card.js +24 -20
- package/dist/highlighted-card.js +16 -11
- package/dist/icon-button.js +8 -6
- package/dist/inline.css-mistica.js +7 -6
- package/dist/inline.css.d.ts +1 -0
- package/dist/inline.d.ts +2 -1
- package/dist/inline.js +8 -8
- package/dist/package-version.js +1 -1
- package/dist/popover.js +11 -11
- package/dist/text-link.js +5 -4
- package/dist/touchable.d.ts +1 -0
- package/dist/touchable.js +31 -27
- package/dist-es/card.css-mistica.js +2 -2
- package/dist-es/card.js +262 -236
- package/dist-es/date-time-picker.js +17 -17
- package/dist-es/empty-state-card.js +42 -38
- package/dist-es/highlighted-card.js +33 -28
- package/dist-es/icon-button.js +24 -22
- package/dist-es/inline.css-mistica.js +6 -6
- package/dist-es/inline.js +16 -16
- package/dist-es/package-version.js +1 -1
- package/dist-es/popover.js +34 -34
- package/dist-es/style.css +1 -1
- package/dist-es/text-link.js +15 -14
- package/dist-es/touchable.js +44 -40
- package/package.json +1 -1
package/dist/date-time-picker.js
CHANGED
|
@@ -141,8 +141,8 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
141
141
|
}
|
|
142
142
|
return target;
|
|
143
143
|
}
|
|
144
|
-
const
|
|
145
|
-
Promise.resolve(/* webpackChunkName: "moment-locale" */ `moment/locale/${
|
|
144
|
+
const g = navigator.language.toLocaleLowerCase().split("-")[0];
|
|
145
|
+
Promise.resolve(/* webpackChunkName: "moment-locale" */ `moment/locale/${g}`).then((p)=>/*#__PURE__*/ _interopRequireWildcard(require(p))).finally(()=>{});
|
|
146
146
|
const Q = (_param)=>{
|
|
147
147
|
var { withTime: s , mode: l , isValidDate: y , optional: u } = _param, t = _objectWithoutProperties(_param, [
|
|
148
148
|
"withTime",
|
|
@@ -150,15 +150,15 @@ const Q = (_param)=>{
|
|
|
150
150
|
"isValidDate",
|
|
151
151
|
"optional"
|
|
152
152
|
]);
|
|
153
|
-
const [m, x] = _react.useState(!1), { texts: b } = (0, _hooksJs.useTheme)(), n = _react.useRef(null), { height: k , ref: v } = (0, _hooksJs.useElementDimensions)(),
|
|
153
|
+
const [m, x] = _react.useState(!1), { texts: b } = (0, _hooksJs.useTheme)(), n = _react.useRef(null), { height: k , ref: v } = (0, _hooksJs.useElementDimensions)(), i = (e)=>{
|
|
154
154
|
t.disabled || x(e);
|
|
155
155
|
}, w = ()=>{
|
|
156
156
|
var p;
|
|
157
|
-
const { top: e = 0 , bottom: o = 0 , left:
|
|
157
|
+
const { top: e = 0 , bottom: o = 0 , left: a = 0 } = ((p = n.current) == null ? void 0 : p.getBoundingClientRect()) || {}, P = 260 + o < window.innerHeight;
|
|
158
158
|
return {
|
|
159
159
|
width: _textFieldComponentsCssMisticaJs.DEFAULT_WIDTH,
|
|
160
160
|
top: P ? o : e - k,
|
|
161
|
-
left:
|
|
161
|
+
left: a,
|
|
162
162
|
position: "absolute",
|
|
163
163
|
borderRadius: 8,
|
|
164
164
|
overflow: "hidden",
|
|
@@ -169,21 +169,21 @@ const Q = (_param)=>{
|
|
|
169
169
|
const e = (o = n.current) == null ? void 0 : o.value;
|
|
170
170
|
return e ? new Date(e) : void 0;
|
|
171
171
|
}, C = (e)=>s ? e.format("yyyy-MM-DD HH:mm") : l === "year-month" ? e.format("yyyy-MM") : e.format("yyyy-MM-DD"), f = (e)=>{
|
|
172
|
-
var
|
|
172
|
+
var a;
|
|
173
173
|
const o = typeof e == "string" ? e : C(e);
|
|
174
|
-
n.current && (n.current.focus(), (
|
|
174
|
+
n.current && (n.current.focus(), (a = t.onChange) == null || a.call(t, (0, _domJs.createChangeEvent)(n.current, o)));
|
|
175
175
|
}, D = ()=>c() && u ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconButtonJs.default, {
|
|
176
176
|
"aria-label": b.clearButton,
|
|
177
177
|
size: 32,
|
|
178
|
-
onPress: (
|
|
179
|
-
|
|
178
|
+
onPress: ()=>{
|
|
179
|
+
f("");
|
|
180
180
|
},
|
|
181
181
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconCloseRegularJs.default, {})
|
|
182
182
|
}) : /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconButtonJs.default, {
|
|
183
183
|
disabled: t.disabled,
|
|
184
184
|
"aria-label": "",
|
|
185
185
|
size: 32,
|
|
186
|
-
onPress: ()=>
|
|
186
|
+
onPress: ()=>i(!m),
|
|
187
187
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconCalendarRegularJs.default, {})
|
|
188
188
|
});
|
|
189
189
|
return /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_jsxRuntimeJs.Fragment, {
|
|
@@ -202,14 +202,14 @@ const Q = (_param)=>{
|
|
|
202
202
|
(o = t == null ? void 0 : t.inputRef) == null || o.call(t, e), n.current = e;
|
|
203
203
|
},
|
|
204
204
|
readOnly: !0,
|
|
205
|
-
onKeyDown: ()=>
|
|
205
|
+
onKeyDown: ()=>i(!0),
|
|
206
206
|
onClick: ()=>{
|
|
207
|
-
|
|
207
|
+
i(!0);
|
|
208
208
|
}
|
|
209
209
|
})),
|
|
210
210
|
m && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_overlayJs.default, {
|
|
211
211
|
onPress: (e)=>{
|
|
212
|
-
(0, _domJs.cancelEvent)(e),
|
|
212
|
+
(0, _domJs.cancelEvent)(e), i(!1);
|
|
213
213
|
},
|
|
214
214
|
disableScroll: !0,
|
|
215
215
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
|
|
@@ -221,7 +221,7 @@ const Q = (_param)=>{
|
|
|
221
221
|
dateFormat: l === "year-month" ? "YYYY-MM" : void 0,
|
|
222
222
|
timeFormat: s ? "HH:mm" : !1,
|
|
223
223
|
initialValue: c(),
|
|
224
|
-
locale:
|
|
224
|
+
locale: g,
|
|
225
225
|
input: !1,
|
|
226
226
|
onChange: f,
|
|
227
227
|
isValidDate: y
|
package/dist/empty-state-card.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "default", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()=>
|
|
7
|
+
get: ()=>V
|
|
8
8
|
});
|
|
9
9
|
const _boxJs = /*#__PURE__*/ _interopRequireDefault(require("./box.js"));
|
|
10
10
|
const _boxedJs = require("./boxed.js");
|
|
@@ -20,50 +20,54 @@ function _interopRequireDefault(obj) {
|
|
|
20
20
|
default: obj
|
|
21
21
|
};
|
|
22
22
|
}
|
|
23
|
-
const
|
|
24
|
-
let { title: n , description:
|
|
25
|
-
var
|
|
26
|
-
const { isTabletOrSmaller:
|
|
27
|
-
let
|
|
28
|
-
return
|
|
23
|
+
const V = (param)=>{
|
|
24
|
+
let { title: n , description: h , button: r , secondaryButton: o , buttonLink: t , icon: a , imageUrl: l , "aria-label": f , dataAttributes: x } = param;
|
|
25
|
+
var m;
|
|
26
|
+
const { isTabletOrSmaller: s } = (0, _hooksJs.useScreenSize)(), { textPresets: S } = (0, _hooksJs.useTheme)();
|
|
27
|
+
let i;
|
|
28
|
+
return l && (i = /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("img", {
|
|
29
29
|
className: _emptyStateCardCssMisticaJs.image,
|
|
30
30
|
alt: "",
|
|
31
|
-
src:
|
|
32
|
-
})), process.env.NODE_ENV !== "production" &&
|
|
31
|
+
src: l
|
|
32
|
+
})), process.env.NODE_ENV !== "production" && r && !((m = r == null ? void 0 : r.props) != null && m.small) && console.error("button property in EmptyStateCard must be a a small Button. Set small prop to true"), /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_boxedJs.Boxed, {
|
|
33
33
|
dataAttributes: x,
|
|
34
34
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_boxJs.default, {
|
|
35
|
-
paddingY:
|
|
36
|
-
paddingX:
|
|
35
|
+
paddingY: s ? 24 : 40,
|
|
36
|
+
paddingX: s ? 16 : 40,
|
|
37
37
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("section", {
|
|
38
38
|
className: _emptyStateCardCssMisticaJs.container,
|
|
39
|
-
"aria-label":
|
|
39
|
+
"aria-label": f,
|
|
40
40
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_stackJs.default, {
|
|
41
41
|
space: 16,
|
|
42
42
|
children: [
|
|
43
|
-
|
|
43
|
+
i != null ? i : a && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
|
|
44
44
|
className: _emptyStateCardCssMisticaJs.iconContainer,
|
|
45
|
-
children:
|
|
45
|
+
children: a
|
|
46
46
|
}),
|
|
47
47
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_boxJs.default, {
|
|
48
48
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_stackJs.default, {
|
|
49
49
|
space: 8,
|
|
50
50
|
children: [
|
|
51
|
-
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.
|
|
52
|
-
|
|
51
|
+
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text, {
|
|
52
|
+
mobileSize: 18,
|
|
53
|
+
mobileLineHeight: "24px",
|
|
54
|
+
desktopSize: 20,
|
|
55
|
+
desktopLineHeight: "28px",
|
|
56
|
+
weight: S.cardTitle.weight,
|
|
53
57
|
children: n
|
|
54
58
|
}),
|
|
55
59
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text2, {
|
|
56
60
|
regular: !0,
|
|
57
61
|
color: _skinContractCssMisticaJs.vars.colors.textSecondary,
|
|
58
|
-
children:
|
|
62
|
+
children: h
|
|
59
63
|
})
|
|
60
64
|
]
|
|
61
65
|
})
|
|
62
66
|
}),
|
|
63
|
-
(
|
|
64
|
-
primaryButton:
|
|
67
|
+
(r || o || t) && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_buttonGroupJs.default, {
|
|
68
|
+
primaryButton: r,
|
|
65
69
|
secondaryButton: o,
|
|
66
|
-
link:
|
|
70
|
+
link: t
|
|
67
71
|
})
|
|
68
72
|
]
|
|
69
73
|
})
|
package/dist/highlighted-card.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "default", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()=>
|
|
7
|
+
get: ()=>W
|
|
8
8
|
});
|
|
9
9
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
10
10
|
const _themeVariantContextJs = require("./theme-variant-context.js");
|
|
@@ -15,6 +15,7 @@ const _boxedJs = require("./boxed.js");
|
|
|
15
15
|
const _maybeDismissableJs = /*#__PURE__*/ _interopRequireWildcard(require("./maybe-dismissable.js"));
|
|
16
16
|
const _highlightedCardCssMisticaJs = require("./highlighted-card.css-mistica.js");
|
|
17
17
|
const _skinContractCssMisticaJs = require("./skins/skin-contract.css-mistica.js");
|
|
18
|
+
const _hooksJs = require("./hooks.js");
|
|
18
19
|
const _jsxRuntimeJs = require("./_virtual/jsx-runtime.js");
|
|
19
20
|
function _interopRequireDefault(obj) {
|
|
20
21
|
return obj && obj.__esModule ? obj : {
|
|
@@ -139,9 +140,9 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
139
140
|
}
|
|
140
141
|
return target;
|
|
141
142
|
}
|
|
142
|
-
const
|
|
143
|
-
var
|
|
144
|
-
const { title: a , description: r , imageUrl: o , imageFit: l } = e,
|
|
143
|
+
const S = /*#__PURE__*/ _react.forwardRef((e, i)=>{
|
|
144
|
+
var h;
|
|
145
|
+
const { title: a , description: r , imageUrl: o , imageFit: l } = e, u = (0, _themeVariantContextJs.useIsInverseVariant)(), f = (h = e.isInverse) != null ? h : u, d = (0, _maybeDismissableJs.useIsDismissable)(), { textPresets: b } = (0, _hooksJs.useTheme)(), n = /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_boxedJs.Boxed, {
|
|
145
146
|
ref: i,
|
|
146
147
|
isInverse: f,
|
|
147
148
|
className: _highlightedCardCssMisticaJs.container,
|
|
@@ -151,14 +152,18 @@ const R = /*#__PURE__*/ _react.forwardRef((e, i)=>{
|
|
|
151
152
|
width: e.width ? `${e.width}px` : "100%",
|
|
152
153
|
children: [
|
|
153
154
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", {
|
|
154
|
-
role:
|
|
155
|
+
role: d ? void 0 : "region",
|
|
155
156
|
className: _highlightedCardCssMisticaJs.textContainerVariant[o ? "withImage" : "withoutImage"],
|
|
156
|
-
"aria-label":
|
|
157
|
+
"aria-label": d ? void 0 : e["aria-label"],
|
|
157
158
|
children: [
|
|
158
|
-
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.
|
|
159
|
-
|
|
160
|
-
|
|
159
|
+
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text, {
|
|
160
|
+
mobileSize: 18,
|
|
161
|
+
mobileLineHeight: "24px",
|
|
162
|
+
desktopSize: 20,
|
|
163
|
+
desktopLineHeight: "28px",
|
|
161
164
|
truncate: e.titleLinesMax,
|
|
165
|
+
weight: b.cardTitle.weight,
|
|
166
|
+
as: "h3",
|
|
162
167
|
children: a
|
|
163
168
|
}),
|
|
164
169
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_boxJs.default, {
|
|
@@ -213,7 +218,7 @@ const R = /*#__PURE__*/ _react.forwardRef((e, i)=>{
|
|
|
213
218
|
className: _highlightedCardCssMisticaJs.touchableContainer,
|
|
214
219
|
children: n
|
|
215
220
|
}) : n;
|
|
216
|
-
}),
|
|
221
|
+
}), W = /*#__PURE__*/ _react.forwardRef((_param, a)=>{
|
|
217
222
|
var { "aria-label": e } = _param, i = _objectWithoutProperties(_param, [
|
|
218
223
|
"aria-label"
|
|
219
224
|
]);
|
|
@@ -222,7 +227,7 @@ const R = /*#__PURE__*/ _react.forwardRef((e, i)=>{
|
|
|
222
227
|
onClose: i.onClose,
|
|
223
228
|
"aria-label": r,
|
|
224
229
|
width: i.width,
|
|
225
|
-
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(
|
|
230
|
+
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(S, _objectSpreadProps(_objectSpread({}, i), {
|
|
226
231
|
"aria-label": r,
|
|
227
232
|
ref: a
|
|
228
233
|
}))
|
package/dist/icon-button.js
CHANGED
|
@@ -113,14 +113,14 @@ function _objectSpreadProps(target, source) {
|
|
|
113
113
|
}
|
|
114
114
|
return target;
|
|
115
115
|
}
|
|
116
|
-
const
|
|
116
|
+
const d = 24, b = (e, a, t, n, l)=>{
|
|
117
117
|
const m = n ? `${n}px ${n}px` : "100% 100%";
|
|
118
118
|
return {
|
|
119
119
|
padding: 0,
|
|
120
120
|
backgroundColor: t,
|
|
121
121
|
backgroundImage: e ? `url(${e})` : "initial",
|
|
122
122
|
backgroundSize: m,
|
|
123
|
-
cursor:
|
|
123
|
+
cursor: l ? "default" : "pointer",
|
|
124
124
|
height: a,
|
|
125
125
|
width: a
|
|
126
126
|
};
|
|
@@ -147,7 +147,9 @@ const s = 24, b = (e, a, t, n, c)=>{
|
|
|
147
147
|
"aria-label": e["aria-label"],
|
|
148
148
|
children: !a && _react.Children.only(t)
|
|
149
149
|
})) : e.onPress ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({}, n), {
|
|
150
|
-
onPress:
|
|
150
|
+
onPress: (l)=>{
|
|
151
|
+
l.stopPropagation(), e.onPress(l);
|
|
152
|
+
},
|
|
151
153
|
"aria-label": e["aria-label"],
|
|
152
154
|
children: !a && _react.Children.only(t)
|
|
153
155
|
})) : /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({}, n), {
|
|
@@ -155,13 +157,13 @@ const s = 24, b = (e, a, t, n, c)=>{
|
|
|
155
157
|
children: !a && _react.Children.only(t)
|
|
156
158
|
}));
|
|
157
159
|
}, I = (e)=>{
|
|
158
|
-
const { icon: a , backgroundColor: t = "transparent" , iconSize: n , size:
|
|
160
|
+
const { icon: a , backgroundColor: t = "transparent" , iconSize: n , size: l = d } = e;
|
|
159
161
|
return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(u, _objectSpreadProps(_objectSpread({}, e), {
|
|
160
162
|
className: (0, _classnames.default)(_iconButtonCssMisticaJs.base, e.className),
|
|
161
|
-
style: _objectSpread({}, b(a,
|
|
163
|
+
style: _objectSpread({}, b(a, l, t, n, e.disabled), e.style)
|
|
162
164
|
}));
|
|
163
165
|
}, w = (e)=>{
|
|
164
|
-
const { size: a =
|
|
166
|
+
const { size: a = d , disabled: t } = e;
|
|
165
167
|
return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(u, _objectSpreadProps(_objectSpread({}, e), {
|
|
166
168
|
className: (0, _classnames.default)(_iconButtonCssMisticaJs.base, e.className),
|
|
167
169
|
style: {
|
|
@@ -12,13 +12,14 @@ _export(exports, {
|
|
|
12
12
|
fullWidth: ()=>v,
|
|
13
13
|
justifyVariants: ()=>n,
|
|
14
14
|
noFullWidth: ()=>a,
|
|
15
|
-
vars: ()=>f
|
|
15
|
+
vars: ()=>f,
|
|
16
|
+
wrap: ()=>r
|
|
16
17
|
});
|
|
17
18
|
require("./inline.css.ts.vanilla.js");
|
|
18
19
|
var v = "kkfbnv2 kkfbnv1", n = {
|
|
19
|
-
between: "
|
|
20
|
-
around: "
|
|
21
|
-
evenly: "
|
|
22
|
-
}, a = "
|
|
20
|
+
between: "kkfbnv5",
|
|
21
|
+
around: "kkfbnv6",
|
|
22
|
+
evenly: "kkfbnv7"
|
|
23
|
+
}, a = "kkfbnv4 kkfbnv1", f = {
|
|
23
24
|
space: "var(--kkfbnv0)"
|
|
24
|
-
};
|
|
25
|
+
}, r = "kkfbnv3 kkfbnv1";
|
package/dist/inline.css.d.ts
CHANGED
|
@@ -3,5 +3,6 @@ export declare const vars: {
|
|
|
3
3
|
};
|
|
4
4
|
export declare const inline: string;
|
|
5
5
|
export declare const fullWidth: string;
|
|
6
|
+
export declare const wrap: string;
|
|
6
7
|
export declare const noFullWidth: string;
|
|
7
8
|
export declare const justifyVariants: Record<"between" | "around" | "evenly", string>;
|
package/dist/inline.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import type { DataAttributes } from './utils/types';
|
|
3
3
|
type Props = {
|
|
4
|
-
space: 0 | 2 | 4 | 8 | 12 | 16 | 24 | 32 | 40 | 48 | 56 | 64 | 'between' | 'around' | 'evenly';
|
|
4
|
+
space: -16 | -12 | -8 | -4 | -2 | 0 | 2 | 4 | 8 | 12 | 16 | 24 | 32 | 40 | 48 | 56 | 64 | 'between' | 'around' | 'evenly';
|
|
5
5
|
alignItems?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
|
|
6
6
|
children: React.ReactNode;
|
|
7
7
|
className?: string;
|
|
@@ -9,6 +9,7 @@ type Props = {
|
|
|
9
9
|
'aria-labelledby'?: string;
|
|
10
10
|
fullWidth?: boolean;
|
|
11
11
|
dataAttributes?: DataAttributes;
|
|
12
|
+
wrap?: boolean;
|
|
12
13
|
};
|
|
13
14
|
declare const Inline: React.FC<Props>;
|
|
14
15
|
export default Inline;
|
package/dist/inline.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "default", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()=>
|
|
7
|
+
get: ()=>A
|
|
8
8
|
});
|
|
9
9
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
10
10
|
const _classnames = /*#__PURE__*/ _interopRequireDefault(require("classnames"));
|
|
@@ -109,19 +109,19 @@ function _objectSpreadProps(target, source) {
|
|
|
109
109
|
}
|
|
110
110
|
return target;
|
|
111
111
|
}
|
|
112
|
-
const
|
|
113
|
-
let { space: r , className: e , children: l , role: o , alignItems:
|
|
114
|
-
const
|
|
112
|
+
const A = (param)=>{
|
|
113
|
+
let { space: r , className: e , children: l , role: o , alignItems: a = "stretch" , "aria-labelledby": s , fullWidth: m , wrap: n , dataAttributes: f } = param;
|
|
114
|
+
const p = m || typeof r == "string";
|
|
115
115
|
return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", _objectSpreadProps(_objectSpread({
|
|
116
116
|
className: (0, _classnames.default)(e, (0, _sprinklesCssMisticaJs.sprinkles)({
|
|
117
|
-
alignItems:
|
|
118
|
-
}),
|
|
117
|
+
alignItems: a
|
|
118
|
+
}), n ? _inlineCssMisticaJs.wrap : p ? _inlineCssMisticaJs.fullWidth : _inlineCssMisticaJs.noFullWidth, typeof r != "number" && _inlineCssMisticaJs.justifyVariants[r]),
|
|
119
119
|
style: typeof r == "number" ? (0, _dynamic.assignInlineVars)({
|
|
120
120
|
[_inlineCssMisticaJs.vars.space]: `${r}px`
|
|
121
121
|
}) : void 0,
|
|
122
122
|
role: o,
|
|
123
|
-
"aria-labelledby":
|
|
124
|
-
}, (0, _domJs.getPrefixedDataAttributes)(
|
|
123
|
+
"aria-labelledby": s
|
|
124
|
+
}, (0, _domJs.getPrefixedDataAttributes)(f)), {
|
|
125
125
|
children: _react.Children.map(l, (t)=>!!t || t === 0 ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
|
|
126
126
|
children: t
|
|
127
127
|
}) : null)
|
package/dist/package-version.js
CHANGED
package/dist/popover.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "default", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()=>
|
|
7
|
+
get: ()=>pt
|
|
8
8
|
});
|
|
9
9
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
10
10
|
const _iconCloseRegularJs = /*#__PURE__*/ _interopRequireDefault(require("./generated/mistica-icons/icon-close-regular.js"));
|
|
@@ -115,10 +115,10 @@ function _objectSpreadProps(target, source) {
|
|
|
115
115
|
}
|
|
116
116
|
return target;
|
|
117
117
|
}
|
|
118
|
-
const { defaultPositionDesktop:
|
|
119
|
-
let t = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] :
|
|
120
|
-
return r && (t === "left" || t === "right") ?
|
|
121
|
-
},
|
|
118
|
+
const { defaultPositionDesktop: K , defaultPositionMobile: Q , distanceToTarget: m , marginLeftRightMobile: d , maxWidthDesktop: U , arrowSize: L } = _popoverCssMisticaJs, Z = (t)=>t || U, V = function() {
|
|
119
|
+
let t = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : K, r = arguments.length > 1 ? arguments[1] : void 0;
|
|
120
|
+
return r && (t === "left" || t === "right") ? Q : t;
|
|
121
|
+
}, tt = (t, r, e)=>t ? (r ? window.screen.width : window.innerWidth) - d * 2 : Z(e), et = (t, r, e, s)=>{
|
|
122
122
|
const a = {
|
|
123
123
|
right: {
|
|
124
124
|
left: e.width + m,
|
|
@@ -176,11 +176,11 @@ const { defaultPositionDesktop: Q , defaultPositionMobile: U , distanceToTarget:
|
|
|
176
176
|
width: t.offsetWidth,
|
|
177
177
|
height: t.offsetHeight,
|
|
178
178
|
parentLeft: t.parentNode.offsetLeft
|
|
179
|
-
} : null,
|
|
179
|
+
} : null, pt = (param)=>{
|
|
180
180
|
let { description: t , title: r , onClose: e , trackingEvent: s , position: n , width: a , target: w , asset: f , isVisible: g = !0 , extra: Y , dataAttributes: B } = param;
|
|
181
181
|
const { texts: R , isIos: z , isDarkMode: D } = (0, _hooksJs.useTheme)(), { isTabletOrSmaller: h } = (0, _hooksJs.useScreenSize)(), [x, b] = _react.useState(null), p = _react.useRef(null);
|
|
182
|
-
n =
|
|
183
|
-
const y =
|
|
182
|
+
n = V(n, h);
|
|
183
|
+
const y = tt(h, z, a), S = D ? 1 : 0.2;
|
|
184
184
|
_react.useEffect(()=>{
|
|
185
185
|
const l = ()=>{
|
|
186
186
|
b(N(p.current));
|
|
@@ -195,7 +195,7 @@ const { defaultPositionDesktop: Q , defaultPositionMobile: U , distanceToTarget:
|
|
|
195
195
|
]);
|
|
196
196
|
let v = null;
|
|
197
197
|
if (g && x) {
|
|
198
|
-
const { containerStyles: l , arrowStyles: I } =
|
|
198
|
+
const { containerStyles: l , arrowStyles: I } = et(n, y, x, h);
|
|
199
199
|
v = /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", _objectSpreadProps(_objectSpread({
|
|
200
200
|
className: _popoverCssMisticaJs.container,
|
|
201
201
|
style: _objectSpread({
|
|
@@ -252,8 +252,8 @@ const { defaultPositionDesktop: Q , defaultPositionMobile: U , distanceToTarget:
|
|
|
252
252
|
}),
|
|
253
253
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconButtonJs.default, {
|
|
254
254
|
className: _popoverCssMisticaJs.closeButtonIcon,
|
|
255
|
-
onPress: (
|
|
256
|
-
e == null || e()
|
|
255
|
+
onPress: ()=>{
|
|
256
|
+
e == null || e();
|
|
257
257
|
},
|
|
258
258
|
trackingEvent: s,
|
|
259
259
|
"aria-label": R.modalClose,
|
package/dist/text-link.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "default", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()=>
|
|
7
|
+
get: ()=>j
|
|
8
8
|
});
|
|
9
9
|
const _touchableJs = require("./touchable.js");
|
|
10
10
|
const _classnames = /*#__PURE__*/ _interopRequireDefault(require("classnames"));
|
|
@@ -99,7 +99,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
99
99
|
}
|
|
100
100
|
return target;
|
|
101
101
|
}
|
|
102
|
-
const
|
|
102
|
+
const j = (_param)=>{
|
|
103
103
|
var { children: t , className: a = "" , disabled: s , style: i } = _param, e = _objectWithoutProperties(_param, [
|
|
104
104
|
"children",
|
|
105
105
|
"className",
|
|
@@ -107,7 +107,7 @@ const A = (_param)=>{
|
|
|
107
107
|
"style"
|
|
108
108
|
]);
|
|
109
109
|
var r;
|
|
110
|
-
const m = (0, _themeVariantContextJs.useIsInverseVariant)(), { isDarkMode: c } = (0, _hooksJs.useTheme)(), { formStatus: f } = (0, _formContextJs.useForm)(), { eventFormat:
|
|
110
|
+
const m = (0, _themeVariantContextJs.useIsInverseVariant)(), { isDarkMode: c } = (0, _hooksJs.useTheme)(), { formStatus: f } = (0, _formContextJs.useForm)(), { eventFormat: u } = (0, _analyticsJs.useTrackingConfig)(), v = ()=>u === "google-analytics-4" ? {
|
|
111
111
|
name: _analyticsJs.eventNames.userInteraction,
|
|
112
112
|
component_type: "link",
|
|
113
113
|
component_copy: (0, _commonJs.getTextFromChildren)(t)
|
|
@@ -117,8 +117,9 @@ const A = (_param)=>{
|
|
|
117
117
|
label: (0, _commonJs.getTextFromChildren)(t)
|
|
118
118
|
};
|
|
119
119
|
return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({}, e), {
|
|
120
|
+
stopPropagation: !0,
|
|
120
121
|
as: e.onPress ? "a" : void 0,
|
|
121
|
-
trackingEvent: (r = e.trackingEvent) != null ? r : e.trackEvent ?
|
|
122
|
+
trackingEvent: (r = e.trackingEvent) != null ? r : e.trackEvent ? v() : void 0,
|
|
122
123
|
disabled: s || f === "sending",
|
|
123
124
|
className: (0, _classnames.default)(m ? c ? _textLinkCssMisticaJs.variants.inverseDark : _textLinkCssMisticaJs.variants.inverseLight : _textLinkCssMisticaJs.variants.default, a),
|
|
124
125
|
style: i,
|
package/dist/touchable.d.ts
CHANGED
package/dist/touchable.js
CHANGED
|
@@ -9,8 +9,8 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
-
BaseTouchable: ()
|
|
13
|
-
default: ()=>
|
|
12
|
+
BaseTouchable: ()=>$,
|
|
13
|
+
default: ()=>Z
|
|
14
14
|
});
|
|
15
15
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
16
16
|
const _classnames = /*#__PURE__*/ _interopRequireDefault(require("classnames"));
|
|
@@ -117,12 +117,12 @@ function _objectSpreadProps(target, source) {
|
|
|
117
117
|
}
|
|
118
118
|
return target;
|
|
119
119
|
}
|
|
120
|
-
const
|
|
120
|
+
const z = function(e) {
|
|
121
121
|
let t = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, d = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
|
|
122
122
|
t ? window.open(e, "_blank") : d ? window.open(e, "_top") : document.location.href = e;
|
|
123
|
-
},
|
|
124
|
-
var
|
|
125
|
-
const { texts: d , analytics:
|
|
123
|
+
}, N = /*#__PURE__*/ _react.forwardRef((e, t)=>{
|
|
124
|
+
var T, v;
|
|
125
|
+
const { texts: d , analytics: P , platformOverrides: E , Link: C , useHrefDecorator: x } = (0, _hooksJs.useTheme)(), R = x(), f = _react.useRef(!1);
|
|
126
126
|
let i = [];
|
|
127
127
|
e.trackingEvent && (Array.isArray(e.trackingEvent) ? i = e.trackingEvent : i = [
|
|
128
128
|
e.trackingEvent
|
|
@@ -140,31 +140,35 @@ const L = function(e) {
|
|
|
140
140
|
"aria-live": e["aria-live"],
|
|
141
141
|
tabIndex: e.tabIndex
|
|
142
142
|
}, (0, _domJs.getPrefixedDataAttributes)(e.dataAttributes, "Touchable")), m = e.type ? e.type : "button", r = !!e.href && !!e.newTab, u = !r && !!e.href && !!e.loadOnTop, s = (a)=>{
|
|
143
|
+
e.stopPropagation && a.stopPropagation();
|
|
144
|
+
}, h = (a)=>{
|
|
143
145
|
e.onPress && e.onPress(a);
|
|
144
|
-
},
|
|
146
|
+
}, k = ()=>{
|
|
145
147
|
var a;
|
|
146
|
-
return e.href ?
|
|
147
|
-
}, y = ()=>Promise.all(i.map((a)=>
|
|
148
|
+
return e.href ? R(e.href) : e.to && e.fullPageOnWebView ? typeof e.to == "string" ? e.to : (a = e.to.pathname) != null ? a : "" : "";
|
|
149
|
+
}, y = ()=>Promise.all(i.map((a)=>P.logEvent(a))), g = (a)=>{
|
|
148
150
|
f.current || (f.current = !0, y().finally(()=>{
|
|
149
151
|
f.current = !1, a();
|
|
150
152
|
}));
|
|
151
|
-
},
|
|
152
|
-
if (!i.length) {
|
|
153
|
-
|
|
153
|
+
}, D = (a)=>{
|
|
154
|
+
if (s(a), !i.length) {
|
|
155
|
+
h(a);
|
|
154
156
|
return;
|
|
155
157
|
}
|
|
156
|
-
|
|
157
|
-
},
|
|
158
|
-
|
|
159
|
-
},
|
|
158
|
+
g(()=>h(a));
|
|
159
|
+
}, O = (a)=>{
|
|
160
|
+
s(a), i.length && (a.preventDefault(), g(()=>z(k(), r, u)));
|
|
161
|
+
}, I = (a)=>{
|
|
162
|
+
s(a), y();
|
|
163
|
+
}, w = (a)=>{
|
|
160
164
|
(a.keyCode === _keyCodesJs.ENTER || a.keyCode === _keyCodesJs.SPACE) && (a.preventDefault(), a.currentTarget.click());
|
|
161
165
|
};
|
|
162
166
|
if (!!e.href || e.to && e.fullPageOnWebView && (0, _platformJs.isInsideNovumNativeApp)(E)) return /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("a", _objectSpreadProps(_objectSpread({}, n), {
|
|
163
167
|
"aria-label": e["aria-label"],
|
|
164
168
|
"aria-labelledby": e["aria-labelledby"],
|
|
165
|
-
onClick:
|
|
166
|
-
onKeyDown:
|
|
167
|
-
href: e.disabled ? void 0 :
|
|
169
|
+
onClick: O,
|
|
170
|
+
onKeyDown: w,
|
|
171
|
+
href: e.disabled ? void 0 : k(),
|
|
168
172
|
target: (()=>{
|
|
169
173
|
if (r) return "_blank";
|
|
170
174
|
if (u) return "_top";
|
|
@@ -180,26 +184,26 @@ const L = function(e) {
|
|
|
180
184
|
})
|
|
181
185
|
]
|
|
182
186
|
}));
|
|
183
|
-
if (e.to) return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(
|
|
187
|
+
if (e.to) return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(C, _objectSpreadProps(_objectSpread({}, n), {
|
|
184
188
|
"aria-label": e["aria-label"],
|
|
185
189
|
"aria-labelledby": e["aria-labelledby"],
|
|
186
190
|
innerRef: t,
|
|
187
191
|
to: e.disabled ? "" : e.to,
|
|
188
192
|
replace: e.replace,
|
|
189
|
-
onClick:
|
|
190
|
-
onKeyDown:
|
|
193
|
+
onClick: I,
|
|
194
|
+
onKeyDown: w,
|
|
191
195
|
children: o
|
|
192
196
|
}));
|
|
193
197
|
if (e.onPress) {
|
|
194
|
-
const a = (
|
|
198
|
+
const a = (T = e.as) != null ? T : "button", A = (v = n.role) != null ? v : e.as === "a" ? "button" : void 0;
|
|
195
199
|
return /*#__PURE__*/ _react.createElement(a, _objectSpreadProps(_objectSpread({}, n), {
|
|
196
|
-
role:
|
|
200
|
+
role: A,
|
|
197
201
|
form: m === "submit" && e.formId ? e.formId : void 0,
|
|
198
202
|
"aria-label": e["aria-label"],
|
|
199
203
|
"aria-labelledby": e["aria-labelledby"],
|
|
200
204
|
type: m,
|
|
201
205
|
ref: t,
|
|
202
|
-
onClick:
|
|
206
|
+
onClick: D,
|
|
203
207
|
children: o
|
|
204
208
|
}));
|
|
205
209
|
}
|
|
@@ -208,10 +212,10 @@ const L = function(e) {
|
|
|
208
212
|
className: (0, _classnames.default)(n.className, _touchableCssMisticaJs.notTouchable),
|
|
209
213
|
children: o
|
|
210
214
|
}));
|
|
211
|
-
}),
|
|
215
|
+
}), Z = /*#__PURE__*/ _react.forwardRef((e, t)=>/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(N, _objectSpreadProps(_objectSpread({}, e), {
|
|
212
216
|
className: (0, _classnames.default)(_touchableCssMisticaJs.touchable, e.className),
|
|
213
217
|
ref: t
|
|
214
|
-
}))),
|
|
218
|
+
}))), $ = /*#__PURE__*/ _react.forwardRef((e, t)=>/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(N, _objectSpreadProps(_objectSpread({}, e), {
|
|
215
219
|
className: (0, _classnames.default)(_touchableCssMisticaJs.base, e.className),
|
|
216
220
|
ref: t
|
|
217
221
|
})));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import "./sprinkles.css.ts.vanilla.js";
|
|
2
2
|
import "./card.css.ts.vanilla.js";
|
|
3
|
-
var _ = "_15e54s91 _1y2v1nf5i _1y2v1nf64 _1y2v1nf5y", y = "_1y2v1nf5i", f = "
|
|
4
|
-
export { _ as actions, y as boxed, f as cardAction, a as cardActionIconButton, r as cardActionInverse, e as dataCard, i as displayCard,
|
|
3
|
+
var _ = "_15e54s91 _1y2v1nf5i _1y2v1nf64 _1y2v1nf5y", y = "_15e54s93 _1y2v1nf5i", f = "_15e54s9j _1y2v1nf7y _1y2v1nf8d _1y2v1nf5i _1y2v1nf5x _1y2v1nf5r _1y2v1nf9h", a = "_1y2v1nf5i _1y2v1nf80 _1y2v1nf8f _1y2v1nf5x _1y2v1nf5r", r = "_15e54s9k _1y2v1nf7y _1y2v1nf8d _1y2v1nf5i _1y2v1nf5x _1y2v1nf5r _1y2v1nf9h", e = "_15e54s98 _1y2v1nf72 _1y2v1nf7g _1y2v1nf6b _1y2v1nf6p _1y2v1nf5i _1y2v1nf64 _1y2v1nf5o _1y2v1nf7p", i = "_15e54s9f _1y2v1nf5i _1y2v1nf64 _1y2v1nf5o _1y2v1nf5u", d = "_15e54s9g", o = "_1y2v1nf5i _1y2v1nf5o _1y2v1nf85 _1y2v1nf7p", s = "_15e54s96 _1y2v1nf72 _1y2v1nf7g _1y2v1nf5i _1y2v1nf64 _1y2v1nf6a _1y2v1nf6p _1y2v1nf5o _1y2v1nf5u", p = "_15e54s9a _1y2v1nf6a _1y2v1nf6o _1y2v1nf72 _1y2v1nf7g _1y2v1nf5i _1y2v1nf85 _1y2v1nf5o _1y2v1nf5u _1y2v1nf64", t = "_15e54s9c _1y2v1nf65 _1y2v1nf6j _1y2v1nf6x _1y2v1nf7b _1y2v1nf5i _1y2v1nf85 _1y2v1nf7p _1y2v1nf9g _1y2v1nf5c", c = "_15e54s9d _1y2v1nf65 _1y2v1nf6j _1y2v1nf6x _1y2v1nf7b _1y2v1nf5i _1y2v1nf85 _1y2v1nf7p _1y2v1nf9g _1y2v1nf5c";
|
|
4
|
+
export { _ as actions, y as boxed, f as cardAction, a as cardActionIconButton, r as cardActionInverse, e as dataCard, i as displayCard, d as displayCardGradient, o as mediaCard, s as mediaCardContent, p as snapCard, t as snapCardTouchableHover, c as snapCardTouchableHoverTransparent };
|