@telefonica/mistica 14.18.2 → 14.19.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/button.css-mistica.js +28 -22
- package/dist/button.css.d.ts +3 -1
- package/dist/button.d.ts +6 -0
- package/dist/button.js +67 -65
- package/dist/card.css-mistica.js +17 -17
- package/dist/card.css.d.ts +1 -1
- package/dist/card.d.ts +3 -5
- package/dist/card.js +296 -276
- package/dist/index.d.ts +1 -1
- package/dist/index.js +3 -0
- package/dist/package-version.js +1 -1
- package/dist-es/button.css-mistica.js +9 -9
- package/dist-es/button.js +82 -80
- package/dist-es/card.css-mistica.js +3 -3
- package/dist-es/card.js +403 -386
- package/dist-es/index.js +1710 -1710
- package/dist-es/package-version.js +1 -1
- package/dist-es/style.css +1 -1
- package/package.json +1 -1
package/dist/button.js
CHANGED
|
@@ -10,16 +10,16 @@ function _export(target, all) {
|
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
12
|
ButtonDanger: function() {
|
|
13
|
-
return
|
|
13
|
+
return xe;
|
|
14
14
|
},
|
|
15
15
|
ButtonLink: function() {
|
|
16
|
-
return
|
|
16
|
+
return Ne;
|
|
17
17
|
},
|
|
18
18
|
ButtonPrimary: function() {
|
|
19
|
-
return
|
|
19
|
+
return _e;
|
|
20
20
|
},
|
|
21
21
|
ButtonSecondary: function() {
|
|
22
|
-
return
|
|
22
|
+
return Re;
|
|
23
23
|
}
|
|
24
24
|
});
|
|
25
25
|
const _jsxruntime = require("react/jsx-runtime");
|
|
@@ -161,20 +161,20 @@ function _object_without_properties_loose(source, excluded) {
|
|
|
161
161
|
return target;
|
|
162
162
|
}
|
|
163
163
|
const w = (param)=>{
|
|
164
|
-
let { content: e , defaultIconSize:
|
|
165
|
-
const c = (0, _utils.flattenChildren)(e),
|
|
164
|
+
let { content: e , defaultIconSize: r , renderText: n } = param;
|
|
165
|
+
const c = (0, _utils.flattenChildren)(e), m = c.length, d = [];
|
|
166
166
|
let l = [];
|
|
167
167
|
const g = ()=>{
|
|
168
168
|
d.push(/* @__PURE__ */ (0, _jsxruntime.jsx)(_react.Fragment, {
|
|
169
169
|
children: n(l)
|
|
170
170
|
}, d.length)), l = [];
|
|
171
171
|
};
|
|
172
|
-
return c.forEach((u,
|
|
173
|
-
const a =
|
|
172
|
+
return c.forEach((u, f)=>{
|
|
173
|
+
const a = f === 0, s = f === m - 1;
|
|
174
174
|
if (/*#__PURE__*/ _react.isValidElement(u)) {
|
|
175
175
|
l.length && g();
|
|
176
176
|
var _u_props_size;
|
|
177
|
-
const v = (_u_props_size = u.props.size) !== null && _u_props_size !== void 0 ? _u_props_size :
|
|
177
|
+
const v = (_u_props_size = u.props.size) !== null && _u_props_size !== void 0 ? _u_props_size : r;
|
|
178
178
|
d.push(/* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
|
|
179
179
|
style: {
|
|
180
180
|
display: "flex",
|
|
@@ -188,7 +188,7 @@ const w = (param)=>{
|
|
|
188
188
|
}, d.length));
|
|
189
189
|
} else l.push(u), s && g();
|
|
190
190
|
}), d;
|
|
191
|
-
},
|
|
191
|
+
}, ue = ()=>/* @__PURE__ */ (0, _jsxruntime.jsx)("svg", {
|
|
192
192
|
width: "8",
|
|
193
193
|
height: "20",
|
|
194
194
|
viewBox: "0 0 8 20",
|
|
@@ -196,9 +196,9 @@ const w = (param)=>{
|
|
|
196
196
|
d: "M6.32595 11.0107L3.03801 7.7086L3.03292 7.70375L3.032 7.70291L3.02931 7.70047L3.02848 7.69974L3.02248 7.69436C2.88533 7.57121 2.71386 7.53733 2.56343 7.55395C2.41648 7.57018 2.27272 7.63567 2.16886 7.73711C2.06893 7.83185 2.01209 7.97816 2.00175 8.11707C1.99083 8.26377 2.02925 8.43959 2.16869 8.57393L5.24446 11.5515L2.15859 14.512L2.15375 14.5171L2.1529 14.518L2.15046 14.5207L2.14974 14.5215L2.14435 14.5275C2.02121 14.6647 1.98733 14.8361 2.00394 14.9866C2.02017 15.1335 2.08567 15.2773 2.18711 15.3811C2.28184 15.4811 2.42816 15.5379 2.56706 15.5483C2.71377 15.5592 2.88958 15.5208 3.02392 15.3813L6.32595 12.0922C6.6246 11.7936 6.6246 11.3094 6.32595 11.0107Z",
|
|
197
197
|
fill: "currentColor"
|
|
198
198
|
})
|
|
199
|
-
}),
|
|
200
|
-
let { showSpinner: e , children:
|
|
201
|
-
const s = n ? _buttoncssmistica.SMALL_ICON_SIZE : _buttoncssmistica.ICON_SIZE,
|
|
199
|
+
}), D = (param)=>{
|
|
200
|
+
let { showSpinner: e , children: r , small: n , loadingText: c , shouldRenderSpinner: m , setShouldRenderSpinner: d , renderText: l , textContentStyle: g , StartIcon: u , EndIcon: f , withChevron: a } = param;
|
|
201
|
+
const s = n ? _buttoncssmistica.SMALL_ICON_SIZE : _buttoncssmistica.ICON_SIZE, i = (0, _css.pxToRem)(n ? _buttoncssmistica.SMALL_SPINNER_SIZE : _buttoncssmistica.SPINNER_SIZE);
|
|
202
202
|
return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
|
|
203
203
|
children: [
|
|
204
204
|
/* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
|
|
@@ -217,17 +217,17 @@ const w = (param)=>{
|
|
|
217
217
|
})
|
|
218
218
|
}),
|
|
219
219
|
w({
|
|
220
|
-
content:
|
|
220
|
+
content: r,
|
|
221
221
|
defaultIconSize: s,
|
|
222
222
|
renderText: l
|
|
223
223
|
}),
|
|
224
|
-
|
|
224
|
+
f && !a && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
|
|
225
225
|
style: {
|
|
226
226
|
display: "flex",
|
|
227
227
|
alignItems: "center",
|
|
228
228
|
marginLeft: _buttoncssmistica.ICON_MARGIN_PX
|
|
229
229
|
},
|
|
230
|
-
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(
|
|
230
|
+
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(f, {
|
|
231
231
|
size: s,
|
|
232
232
|
color: "currentColor"
|
|
233
233
|
})
|
|
@@ -238,7 +238,7 @@ const w = (param)=>{
|
|
|
238
238
|
alignItems: "center",
|
|
239
239
|
marginLeft: _buttoncssmistica.CHEVRON_MARGIN_LEFT_LINK
|
|
240
240
|
},
|
|
241
|
-
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(
|
|
241
|
+
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(ue, {})
|
|
242
242
|
})
|
|
243
243
|
]
|
|
244
244
|
}),
|
|
@@ -246,7 +246,7 @@ const w = (param)=>{
|
|
|
246
246
|
className: _buttoncssmistica.loadingFiller,
|
|
247
247
|
"aria-hidden": !0,
|
|
248
248
|
style: c ? {
|
|
249
|
-
paddingLeft:
|
|
249
|
+
paddingLeft: i,
|
|
250
250
|
paddingRight: _buttoncssmistica.ICON_MARGIN_PX + 2 * (n ? _buttoncssmistica.X_SMALL_PADDING_PX : _buttoncssmistica.X_PADDING_PX)
|
|
251
251
|
} : void 0,
|
|
252
252
|
children: w({
|
|
@@ -259,19 +259,19 @@ const w = (param)=>{
|
|
|
259
259
|
"aria-hidden": e ? void 0 : !0,
|
|
260
260
|
className: _buttoncssmistica.loadingContent,
|
|
261
261
|
onTransitionEnd: ()=>{
|
|
262
|
-
e !==
|
|
262
|
+
e !== m && d(e);
|
|
263
263
|
},
|
|
264
264
|
children: [
|
|
265
|
-
|
|
265
|
+
m ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_spinner.default, {
|
|
266
266
|
rolePresentation: !!c,
|
|
267
267
|
color: "currentcolor",
|
|
268
268
|
delay: "0s",
|
|
269
|
-
size:
|
|
269
|
+
size: i
|
|
270
270
|
}) : /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
|
|
271
271
|
style: {
|
|
272
272
|
display: "inline-block",
|
|
273
|
-
width:
|
|
274
|
-
height:
|
|
273
|
+
width: i,
|
|
274
|
+
height: i
|
|
275
275
|
}
|
|
276
276
|
}),
|
|
277
277
|
c ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
|
|
@@ -286,14 +286,14 @@ const w = (param)=>{
|
|
|
286
286
|
})
|
|
287
287
|
]
|
|
288
288
|
});
|
|
289
|
-
}, N = /*#__PURE__*/ _react.forwardRef((e,
|
|
290
|
-
const { textPresets: n } = (0, _hooks.useTheme)(), { eventFormat: c } = (0, _analytics.useTrackingConfig)(), { formStatus:
|
|
289
|
+
}, N = /*#__PURE__*/ _react.forwardRef((e, r)=>{
|
|
290
|
+
const { textPresets: n } = (0, _hooks.useTheme)(), { eventFormat: c } = (0, _analytics.useTrackingConfig)(), { formStatus: m , formId: d } = (0, _formcontext.useForm)(), l = (0, _themevariantcontext.useIsInverseVariant)(), { loadingText: g } = e, u = !!e.submit, f = m === "sending", [a, s] = _react.useState(!1), i = e.showSpinner || f && u || a, [v, L] = _react.useState(!!i);
|
|
291
291
|
_react.useEffect(()=>{
|
|
292
|
-
|
|
292
|
+
i && !v && L(!0);
|
|
293
293
|
}, [
|
|
294
|
-
|
|
294
|
+
i,
|
|
295
295
|
v,
|
|
296
|
-
|
|
296
|
+
m
|
|
297
297
|
]);
|
|
298
298
|
var _e_trackingEvent;
|
|
299
299
|
const S = ()=>c === "google-analytics-4" ? {
|
|
@@ -304,25 +304,25 @@ const w = (param)=>{
|
|
|
304
304
|
category: _analytics.eventCategories.userInteraction,
|
|
305
305
|
action: `${e.type}_button_tapped`,
|
|
306
306
|
label: (0, _common.getTextFromChildren)(e.children)
|
|
307
|
-
},
|
|
307
|
+
}, I = (b)=>e.small ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text, {
|
|
308
308
|
size: 14,
|
|
309
309
|
lineHeight: 20,
|
|
310
310
|
weight: n.button.weight,
|
|
311
311
|
truncate: 1,
|
|
312
312
|
color: "inherit",
|
|
313
313
|
as: "div",
|
|
314
|
-
children:
|
|
314
|
+
children: b
|
|
315
315
|
}) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text3, {
|
|
316
316
|
weight: n.button.weight,
|
|
317
317
|
truncate: 1,
|
|
318
318
|
color: "inherit",
|
|
319
319
|
as: "div",
|
|
320
|
-
children:
|
|
320
|
+
children: b
|
|
321
321
|
}), h = {
|
|
322
|
-
ref:
|
|
322
|
+
ref: r,
|
|
323
323
|
className: (0, _classnames.default)(l ? _buttoncssmistica.inverseVariants[e.type] : _buttoncssmistica.variants[e.type], e.className, {
|
|
324
324
|
[_buttoncssmistica.small]: e.small,
|
|
325
|
-
[_buttoncssmistica.isLoading]:
|
|
325
|
+
[_buttoncssmistica.isLoading]: i
|
|
326
326
|
}),
|
|
327
327
|
style: _object_spread({
|
|
328
328
|
cursor: e.fake ? "pointer" : void 0
|
|
@@ -332,19 +332,19 @@ const w = (param)=>{
|
|
|
332
332
|
"aria-controls": e["aria-controls"],
|
|
333
333
|
"aria-expanded": e["aria-expanded"],
|
|
334
334
|
tabIndex: e.tabIndex,
|
|
335
|
-
children:
|
|
336
|
-
showSpinner:
|
|
335
|
+
children: D({
|
|
336
|
+
showSpinner: i,
|
|
337
337
|
shouldRenderSpinner: v,
|
|
338
338
|
setShouldRenderSpinner: L,
|
|
339
339
|
children: e.children,
|
|
340
340
|
loadingText: g,
|
|
341
341
|
small: e.small,
|
|
342
|
-
renderText:
|
|
342
|
+
renderText: I,
|
|
343
343
|
textContentStyle: _buttoncssmistica.textContent,
|
|
344
344
|
StartIcon: e.StartIcon,
|
|
345
345
|
EndIcon: e.EndIcon
|
|
346
346
|
}),
|
|
347
|
-
disabled: e.disabled ||
|
|
347
|
+
disabled: e.disabled || i || f,
|
|
348
348
|
role: "button"
|
|
349
349
|
};
|
|
350
350
|
if (process.env.NODE_ENV !== "production" && (e.to === "" || e.href === "")) throw Error("to or href props are empty strings");
|
|
@@ -360,8 +360,8 @@ const w = (param)=>{
|
|
|
360
360
|
onPress: ()=>{}
|
|
361
361
|
}, h));
|
|
362
362
|
if (e.onPress) return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({}, h), {
|
|
363
|
-
onPress: (
|
|
364
|
-
const _ = e.onPress(
|
|
363
|
+
onPress: (b)=>{
|
|
364
|
+
const _ = e.onPress(b);
|
|
365
365
|
_ && (s(!0), _.finally(()=>s(!1)));
|
|
366
366
|
}
|
|
367
367
|
}));
|
|
@@ -376,18 +376,18 @@ const w = (param)=>{
|
|
|
376
376
|
}));
|
|
377
377
|
if (process.env.NODE_ENV !== "production") throw Error("Bad button props");
|
|
378
378
|
return null;
|
|
379
|
-
}),
|
|
379
|
+
}), Ne = /*#__PURE__*/ _react.forwardRef((e, r)=>{
|
|
380
380
|
var _e_withChevron;
|
|
381
|
-
const { formStatus: n } = (0, _formcontext.useForm)(), c = (0, _themevariantcontext.useIsInverseVariant)(), { analytics:
|
|
381
|
+
const { formStatus: n } = (0, _formcontext.useForm)(), c = (0, _themevariantcontext.useIsInverseVariant)(), { analytics: m , textPresets: d } = (0, _hooks.useTheme)(), { loadingText: l } = e, g = n === "sending", [u, f] = _react.useState(!1), a = e.showSpinner || u, s = (_e_withChevron = e.withChevron) !== null && _e_withChevron !== void 0 ? _e_withChevron : !!e.href || !!e.to, [i, v] = _react.useState(!!a);
|
|
382
382
|
_react.useEffect(()=>{
|
|
383
|
-
a && !
|
|
383
|
+
a && !i && v(!0);
|
|
384
384
|
}, [
|
|
385
385
|
a,
|
|
386
|
-
|
|
386
|
+
i,
|
|
387
387
|
n
|
|
388
388
|
]);
|
|
389
389
|
var _e_trackingEvent;
|
|
390
|
-
const L = ()=>
|
|
390
|
+
const L = ()=>m.eventFormat === "google-analytics-4" ? {
|
|
391
391
|
name: _analytics.eventNames.userInteraction,
|
|
392
392
|
component_type: "link",
|
|
393
393
|
component_copy: (0, _common.getTextFromChildren)(e.children)
|
|
@@ -400,19 +400,21 @@ const w = (param)=>{
|
|
|
400
400
|
truncate: 1,
|
|
401
401
|
color: "inherit",
|
|
402
402
|
children: h
|
|
403
|
-
}),
|
|
403
|
+
}), I = {
|
|
404
404
|
className: (0, _classnames.default)(_buttoncssmistica.link, {
|
|
405
405
|
[_buttoncssmistica.inverseLink]: c,
|
|
406
|
-
[_buttoncssmistica.
|
|
406
|
+
[_buttoncssmistica.alignedLeftLink]: !!e.bleedLeft,
|
|
407
|
+
[_buttoncssmistica.alignedRightLink]: !!e.bleedRight,
|
|
408
|
+
[_buttoncssmistica.alignedVerticalLink]: !!e.bleedY,
|
|
407
409
|
[_buttoncssmistica.isLoading]: a
|
|
408
410
|
}),
|
|
409
411
|
trackingEvent: (_e_trackingEvent = e.trackingEvent) !== null && _e_trackingEvent !== void 0 ? _e_trackingEvent : e.trackEvent ? L() : void 0,
|
|
410
412
|
dataAttributes: _object_spread({
|
|
411
413
|
"component-name": "ButtonLink"
|
|
412
414
|
}, e.dataAttributes),
|
|
413
|
-
children:
|
|
415
|
+
children: D({
|
|
414
416
|
showSpinner: a,
|
|
415
|
-
shouldRenderSpinner:
|
|
417
|
+
shouldRenderSpinner: i,
|
|
416
418
|
setShouldRenderSpinner: v,
|
|
417
419
|
children: e.children,
|
|
418
420
|
loadingText: l,
|
|
@@ -427,60 +429,60 @@ const w = (param)=>{
|
|
|
427
429
|
};
|
|
428
430
|
if (process.env.NODE_ENV !== "production" && (e.to === "" || e.href === "")) throw Error("to or href props are empty strings");
|
|
429
431
|
if (e.onPress) return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({
|
|
430
|
-
ref:
|
|
431
|
-
},
|
|
432
|
+
ref: r
|
|
433
|
+
}, I), {
|
|
432
434
|
onPress: (h)=>{
|
|
433
|
-
const
|
|
434
|
-
|
|
435
|
+
const b = e.onPress(h);
|
|
436
|
+
b && (f(!0), b.finally(()=>f(!1)));
|
|
435
437
|
}
|
|
436
438
|
}));
|
|
437
439
|
if (e.to || e.to === "") return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({
|
|
438
|
-
ref:
|
|
439
|
-
},
|
|
440
|
+
ref: r
|
|
441
|
+
}, I), {
|
|
440
442
|
to: e.to,
|
|
441
443
|
fullPageOnWebView: e.fullPageOnWebView
|
|
442
444
|
}));
|
|
443
445
|
if (e.href || e.href === "") return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({
|
|
444
|
-
ref:
|
|
445
|
-
},
|
|
446
|
+
ref: r
|
|
447
|
+
}, I), {
|
|
446
448
|
href: e.href,
|
|
447
449
|
newTab: e.newTab
|
|
448
450
|
}));
|
|
449
451
|
if (process.env.NODE_ENV !== "production") throw Error("Bad button props");
|
|
450
452
|
return null;
|
|
451
|
-
}),
|
|
452
|
-
var { dataAttributes: e } = _param,
|
|
453
|
+
}), _e = /*#__PURE__*/ _react.forwardRef((_param, n)=>/* @__PURE__ */ {
|
|
454
|
+
var { dataAttributes: e } = _param, r = _object_without_properties(_param, [
|
|
453
455
|
"dataAttributes"
|
|
454
456
|
]);
|
|
455
457
|
return (0, _jsxruntime.jsx)(N, _object_spread_props(_object_spread({
|
|
456
458
|
dataAttributes: _object_spread({
|
|
457
459
|
"component-name": "ButtonPrimary"
|
|
458
460
|
}, e)
|
|
459
|
-
},
|
|
461
|
+
}, r), {
|
|
460
462
|
ref: n,
|
|
461
463
|
type: "primary"
|
|
462
464
|
}));
|
|
463
|
-
}),
|
|
464
|
-
var { dataAttributes: e } = _param,
|
|
465
|
+
}), Re = /*#__PURE__*/ _react.forwardRef((_param, n)=>/* @__PURE__ */ {
|
|
466
|
+
var { dataAttributes: e } = _param, r = _object_without_properties(_param, [
|
|
465
467
|
"dataAttributes"
|
|
466
468
|
]);
|
|
467
469
|
return (0, _jsxruntime.jsx)(N, _object_spread_props(_object_spread({
|
|
468
470
|
dataAttributes: _object_spread({
|
|
469
471
|
"component-name": "ButtonSecondary"
|
|
470
472
|
}, e)
|
|
471
|
-
},
|
|
473
|
+
}, r), {
|
|
472
474
|
ref: n,
|
|
473
475
|
type: "secondary"
|
|
474
476
|
}));
|
|
475
|
-
}),
|
|
476
|
-
var { dataAttributes: e } = _param,
|
|
477
|
+
}), xe = /*#__PURE__*/ _react.forwardRef((_param, n)=>/* @__PURE__ */ {
|
|
478
|
+
var { dataAttributes: e } = _param, r = _object_without_properties(_param, [
|
|
477
479
|
"dataAttributes"
|
|
478
480
|
]);
|
|
479
481
|
return (0, _jsxruntime.jsx)(N, _object_spread_props(_object_spread({
|
|
480
482
|
dataAttributes: _object_spread({
|
|
481
483
|
"component-name": "ButtonDanger"
|
|
482
484
|
}, e)
|
|
483
|
-
},
|
|
485
|
+
}, r), {
|
|
484
486
|
ref: n,
|
|
485
487
|
type: "danger"
|
|
486
488
|
}));
|
package/dist/card.css-mistica.js
CHANGED
|
@@ -10,10 +10,10 @@ function _export(target, all) {
|
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
12
|
actions: function() {
|
|
13
|
-
return
|
|
13
|
+
return a;
|
|
14
14
|
},
|
|
15
15
|
boxed: function() {
|
|
16
|
-
return
|
|
16
|
+
return _;
|
|
17
17
|
},
|
|
18
18
|
cardAction: function() {
|
|
19
19
|
return y;
|
|
@@ -49,47 +49,47 @@ _export(exports, {
|
|
|
49
49
|
return i;
|
|
50
50
|
},
|
|
51
51
|
mediaCard: function() {
|
|
52
|
-
return
|
|
52
|
+
return C;
|
|
53
53
|
},
|
|
54
54
|
mediaCardContent: function() {
|
|
55
|
-
return
|
|
55
|
+
return l;
|
|
56
56
|
},
|
|
57
|
-
|
|
57
|
+
mediaCardIcon: function() {
|
|
58
58
|
return h;
|
|
59
59
|
},
|
|
60
|
-
|
|
60
|
+
nakedCardContent: function() {
|
|
61
61
|
return u;
|
|
62
62
|
},
|
|
63
|
-
|
|
63
|
+
snapCard: function() {
|
|
64
64
|
return p;
|
|
65
65
|
},
|
|
66
|
+
touchable: function() {
|
|
67
|
+
return z;
|
|
68
|
+
},
|
|
66
69
|
touchableCardOverlay: function() {
|
|
67
|
-
return
|
|
70
|
+
return k;
|
|
68
71
|
},
|
|
69
72
|
touchableCardOverlayInverse: function() {
|
|
70
|
-
return
|
|
73
|
+
return m;
|
|
71
74
|
},
|
|
72
75
|
touchableCardOverlayMedia: function() {
|
|
73
|
-
return
|
|
76
|
+
return q;
|
|
74
77
|
},
|
|
75
78
|
touchableContainer: function() {
|
|
76
79
|
return O;
|
|
77
80
|
},
|
|
78
81
|
touchableMediaCardOverlay: function() {
|
|
79
|
-
return
|
|
82
|
+
return g;
|
|
80
83
|
},
|
|
81
84
|
touchableNakedMediaOverlay: function() {
|
|
82
|
-
return
|
|
85
|
+
return j;
|
|
83
86
|
},
|
|
84
87
|
vars: function() {
|
|
85
88
|
return M;
|
|
86
|
-
},
|
|
87
|
-
videoAction: function() {
|
|
88
|
-
return g;
|
|
89
89
|
}
|
|
90
90
|
});
|
|
91
91
|
require("./sprinkles.css.ts.vanilla.css-mistica.js");
|
|
92
92
|
require("./card.css.ts.vanilla.css-mistica.js");
|
|
93
|
-
var
|
|
93
|
+
var a = "_15e54s91 _1y2v1nfb4 _1y2v1nfbq _1y2v1nfbk", _ = "_15e54s93 _1y2v1nfb4 _1y2v1nfaz", y = "_15e54s9w _1y2v1nfc1 _1y2v1nfch _1y2v1nfb4 _1y2v1nfbj _1y2v1nfbd _1y2v1nfdn", f = "_1y2v1nfb4 _1y2v1nfc3 _1y2v1nfcj _1y2v1nfbj _1y2v1nfbd", r = "_15e54s9x _1y2v1nfc1 _1y2v1nfch _1y2v1nfb4 _1y2v1nfbj _1y2v1nfbd _1y2v1nfdn", e = "_15e54s9y _1y2v1nfc1 _1y2v1nfch _1y2v1nfb4 _1y2v1nfbj _1y2v1nfbd _1y2v1nfdn", b = "_15e54s910", d = "_15e54s98", s = "_15e54s9k _1y2v1nf8w _1y2v1nfa5 _1y2v1nf6k _1y2v1nf7t _1y2v1nfb4 _1y2v1nfbq _1y2v1nfaz _1y2v1nfba _1y2v1nfbr", c = "_15e54s9s", t = "_1y2v1nfbr _1y2v1nfc8 _1y2v1nfb4 _1y2v1nfaz", o = "_15e54s9r", i = "_15e54s9t", C = "_1y2v1nfb4 _1y2v1nfba _1y2v1nfc8 _1y2v1nfbr _1y2v1nfbq", l = "_15e54s9f _1y2v1nf8w _1y2v1nfa5 _1y2v1nfb4 _1y2v1nfbq _1y2v1nfaz _1y2v1nf6e _1y2v1nf7t _1y2v1nfba _1y2v1nfbg", h = "_15e54s9g", u = "_15e54s9i _1y2v1nfb4 _1y2v1nfbq _1y2v1nfaz _1y2v1nfba _1y2v1nfbg _1y2v1nf6e", p = "_15e54s9m _1y2v1nf6e _1y2v1nf7n _1y2v1nf8w _1y2v1nfa5 _1y2v1nfb4 _1y2v1nfaz _1y2v1nfc8 _1y2v1nfba _1y2v1nfbg _1y2v1nfbr _1y2v1nfbq", z = "_15e54s95", k = "_15e54s9a _15e54s96", m = "_15e54s9b _15e54s96", q = "_15e54s9c _15e54s96", O = "_15e54s94", g = "_15e54s97 _15e54s96", j = "_15e54s99 _15e54s96", M = {
|
|
94
94
|
aspectRatio: "var(--_15e54s9z)"
|
|
95
|
-
}
|
|
95
|
+
};
|
package/dist/card.css.d.ts
CHANGED
|
@@ -10,6 +10,7 @@ export declare const touchableCardOverlayInverse: string;
|
|
|
10
10
|
export declare const touchableCardOverlayMedia: string;
|
|
11
11
|
export declare const mediaCard: string;
|
|
12
12
|
export declare const mediaCardContent: string;
|
|
13
|
+
export declare const mediaCardIcon: string;
|
|
13
14
|
export declare const nakedCardContent: string;
|
|
14
15
|
export declare const dataCard: string;
|
|
15
16
|
export declare const snapCard: string;
|
|
@@ -23,7 +24,6 @@ export declare const cardActionIconButton: string;
|
|
|
23
24
|
export declare const cardAction: string;
|
|
24
25
|
export declare const cardActionInverse: string;
|
|
25
26
|
export declare const cardActionMedia: string;
|
|
26
|
-
export declare const videoAction: string;
|
|
27
27
|
export declare const vars: {
|
|
28
28
|
aspectRatio: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
29
29
|
};
|
package/dist/card.d.ts
CHANGED
|
@@ -10,11 +10,7 @@ import type { DataAttributes, IconProps, RendersElement, RendersNullableElement,
|
|
|
10
10
|
export type CardAction = {
|
|
11
11
|
label: string;
|
|
12
12
|
onPress: () => void;
|
|
13
|
-
Icon
|
|
14
|
-
iconSize?: number;
|
|
15
|
-
iconColor?: string;
|
|
16
|
-
iconBackground?: string;
|
|
17
|
-
iconBackgroundInverse?: string;
|
|
13
|
+
Icon: React.FC<IconProps>;
|
|
18
14
|
disabled?: boolean;
|
|
19
15
|
};
|
|
20
16
|
type CardActionsGroupProps = {
|
|
@@ -24,6 +20,7 @@ type CardActionsGroupProps = {
|
|
|
24
20
|
};
|
|
25
21
|
export declare const CardActionsGroup: ({ actions, onClose, type, }: CardActionsGroupProps) => JSX.Element;
|
|
26
22
|
type AspectRatio = '1:1' | '16:9' | '7:10' | '9:10' | 'auto';
|
|
23
|
+
export declare const CardActionSpinner: ({ color }: IconProps) => React.ReactElement;
|
|
27
24
|
type TouchableProps = {
|
|
28
25
|
trackingEvent?: TrackingEvent | ReadonlyArray<TrackingEvent>;
|
|
29
26
|
} & ExclusifyUnion<{
|
|
@@ -47,6 +44,7 @@ interface MediaCardBaseProps {
|
|
|
47
44
|
subtitle?: string;
|
|
48
45
|
subtitleLinesMax?: number;
|
|
49
46
|
description?: string;
|
|
47
|
+
icon?: React.ReactElement;
|
|
50
48
|
descriptionLinesMax?: number;
|
|
51
49
|
extra?: React.ReactNode;
|
|
52
50
|
actions?: Array<CardAction>;
|