@telefonica/mistica 14.16.0 → 14.16.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/dist/card.js CHANGED
@@ -10,22 +10,22 @@ function _export(target, all) {
10
10
  }
11
11
  _export(exports, {
12
12
  DataCard: function() {
13
- return Tr;
13
+ return xr;
14
14
  },
15
15
  DisplayDataCard: function() {
16
- return wr;
16
+ return Ir;
17
17
  },
18
18
  DisplayMediaCard: function() {
19
- return xr;
19
+ return Br;
20
20
  },
21
21
  MediaCard: function() {
22
- return Cr;
22
+ return Sr;
23
23
  },
24
24
  PosterCard: function() {
25
- return Br;
25
+ return Ar;
26
26
  },
27
27
  SnapCard: function() {
28
- return Sr;
28
+ return wr;
29
29
  }
30
30
  });
31
31
  const _jsxruntime = require("react/jsx-runtime");
@@ -52,6 +52,7 @@ const _video = /*#__PURE__*/ _interop_require_default(require("./video.js"));
52
52
  const _themevariantcontext = require("./theme-variant-context.js");
53
53
  const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
54
54
  const _dynamic = require("@vanilla-extract/dynamic");
55
+ const _inline = /*#__PURE__*/ _interop_require_default(require("./inline.js"));
55
56
  function _interop_require_default(obj) {
56
57
  return obj && obj.__esModule ? obj : {
57
58
  default: obj
@@ -184,13 +185,13 @@ const ce = (r, a)=>{
184
185
  onPress: a,
185
186
  Icon: _iconcloseregular.default
186
187
  }), s;
187
- }, he = 48, U = (param)=>{
188
+ }, he = 48, k = (param)=>{
188
189
  let { actions: r , onClose: a , type: i = "default" } = param;
189
190
  const s = ce(r, a), h = s.length > 0, o = {
190
191
  default: _skincontractcssmistica.vars.colors.neutralHigh,
191
192
  inverse: _skincontractcssmistica.vars.colors.inverse,
192
193
  media: "#000000"
193
- }, u = {
194
+ }, p = {
194
195
  default: _cardcssmistica.cardAction,
195
196
  inverse: _cardcssmistica.cardActionInverse,
196
197
  media: _cardcssmistica.cardActionMedia
@@ -207,7 +208,7 @@ const ce = (r, a)=>{
207
208
  display: "flex"
208
209
  }),
209
210
  children: s.map((param, m)=>{
210
- let { onPress: l , label: d , Icon: t , iconSize: p = 20 } = param;
211
+ let { onPress: l , label: d , Icon: t , iconSize: u = 20 } = param;
211
212
  return t ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.default, {
212
213
  size: he,
213
214
  onPress: l,
@@ -217,10 +218,10 @@ const ce = (r, a)=>{
217
218
  display: "flex"
218
219
  },
219
220
  children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
220
- className: u[i],
221
+ className: p[i],
221
222
  children: /* @__PURE__ */ (0, _jsxruntime.jsx)(t, {
222
223
  color: o[i],
223
- size: p
224
+ size: u
224
225
  })
225
226
  })
226
227
  }, m) : /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
@@ -229,17 +230,17 @@ const ce = (r, a)=>{
229
230
  })
230
231
  })
231
232
  }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {});
232
- }, Ue = (r)=>r ? typeof r == "number" ? r : ({
233
+ }, Ye = (r)=>r ? typeof r == "number" ? r : ({
233
234
  "1:1": 1,
234
235
  "16:9": 16 / 9,
235
236
  "7:10": 7 / 10,
236
237
  "9:10": 9 / 10,
237
238
  auto: 0
238
239
  })[r] : 0, W = (param)=>{
239
- let { children: r , width: a = "100%" , height: i = "100%" , minWidth: s , aspectRatio: h , className: o , "aria-label": u } = param;
240
- const l = Ue(h);
240
+ let { children: r , width: a = "100%" , height: i = "100%" , minWidth: s , aspectRatio: h , className: o , "aria-label": p } = param;
241
+ const l = Ye(h);
241
242
  return /* @__PURE__ */ (0, _jsxruntime.jsx)("section", {
242
- "aria-label": u,
243
+ "aria-label": p,
243
244
  className: (0, _classnames.default)(o, _cardcssmistica.cardContainer),
244
245
  style: _object_spread({
245
246
  width: a,
@@ -254,7 +255,7 @@ const ce = (r, a)=>{
254
255
  width: "100%",
255
256
  height: "100%",
256
257
  src: r !== null && r !== void 0 ? r : "//:0"
257
- }), Ye = {
258
+ }), Ze = {
258
259
  loading: {
259
260
  showSpinner: "loadingTimeout",
260
261
  play: "playing",
@@ -278,14 +279,14 @@ const ce = (r, a)=>{
278
279
  error: {
279
280
  reset: "loading"
280
281
  }
281
- }, Ze = (r, a)=>Ye[r][a] || r, qe = (param)=>/* @__PURE__ */ {
282
+ }, qe = (r, a)=>Ze[r][a] || r, Je = (param)=>/* @__PURE__ */ {
282
283
  let { size: r , color: a } = param;
283
284
  return (0, _jsxruntime.jsx)(_spinner.default, {
284
285
  size: r,
285
286
  color: a,
286
287
  delay: "0"
287
288
  });
288
- }, ue = (r)=>{
289
+ }, pe = (r)=>{
289
290
  switch(r){
290
291
  case "playing":
291
292
  case "loading":
@@ -293,12 +294,12 @@ const ce = (r, a)=>{
293
294
  case "paused":
294
295
  return _iconplayfilled.default;
295
296
  case "loadingTimeout":
296
- return qe;
297
+ return Je;
297
298
  default:
298
299
  return;
299
300
  }
300
- }, pe = (r, a, i)=>{
301
- const s = _react.useRef(null), [h, o] = _react.useReducer(Ze, "loading");
301
+ }, ue = (r, a, i)=>{
302
+ const s = _react.useRef(null), [h, o] = _react.useReducer(qe, "loading");
302
303
  return _react.useEffect(()=>{
303
304
  var t;
304
305
  const d = setTimeout(()=>o("showSpinner"), 2e3);
@@ -329,7 +330,7 @@ const ce = (r, a)=>{
329
330
  }
330
331
  };
331
332
  }, fe = (param)=>{
332
- let { headline: r , pretitle: a , pretitleLinesMax: i , title: s , titleLinesMax: h , subtitle: o , subtitleLinesMax: u , description: l , descriptionLinesMax: d , extra: t , button: p , buttonLink: m } = param;
333
+ let { headline: r , pretitle: a , pretitleLinesMax: i , title: s , titleLinesMax: h , subtitle: o , subtitleLinesMax: p , description: l , descriptionLinesMax: d , extra: t , button: u , buttonLink: m } = param;
333
334
  const { textPresets: f } = (0, _hooks.useTheme)(), g = ()=>r ? typeof r == "string" ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_tag.default, {
334
335
  type: "promo",
335
336
  children: r
@@ -374,7 +375,7 @@ const ce = (r, a)=>{
374
375
  children: s
375
376
  }),
376
377
  /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
377
- truncate: u,
378
+ truncate: p,
378
379
  as: "div",
379
380
  regular: !0,
380
381
  hyphens: "auto",
@@ -400,17 +401,17 @@ const ce = (r, a)=>{
400
401
  })
401
402
  ]
402
403
  }),
403
- (p || m) && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
404
+ (u || m) && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
404
405
  className: _cardcssmistica.actions,
405
406
  children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_buttongroup.default, {
406
- primaryButton: p,
407
+ primaryButton: u,
407
408
  link: m
408
409
  })
409
410
  })
410
411
  ]
411
412
  });
412
- }, Cr = /*#__PURE__*/ _react.forwardRef((_param, w)=>{
413
- var { media: r , headline: a , pretitle: i , pretitleLinesMax: s , subtitle: h , subtitleLinesMax: o , title: u , titleLinesMax: l , description: d , descriptionLinesMax: t , extra: p , actions: m , button: f , buttonLink: g , dataAttributes: x , "aria-label": N , onClose: S } = _param, c = _object_without_properties(_param, [
413
+ }, Sr = /*#__PURE__*/ _react.forwardRef((_param, w)=>{
414
+ var { media: r , headline: a , pretitle: i , pretitleLinesMax: s , subtitle: h , subtitleLinesMax: o , title: p , titleLinesMax: l , description: d , descriptionLinesMax: t , extra: u , actions: m , button: f , buttonLink: g , dataAttributes: x , "aria-label": C , onClose: S } = _param, c = _object_without_properties(_param, [
414
415
  "media",
415
416
  "headline",
416
417
  "pretitle",
@@ -429,9 +430,9 @@ const ce = (r, a)=>{
429
430
  "aria-label",
430
431
  "onClose"
431
432
  ]);
432
- const C = c.href || c.to || c.onPress, b = _cardcssmistica.touchableMediaCardOverlay;
433
+ const N = c.href || c.to || c.onPress, b = _cardcssmistica.touchableMediaCardOverlay;
433
434
  return /* @__PURE__ */ (0, _jsxruntime.jsxs)(W, {
434
- "aria-label": N,
435
+ "aria-label": C,
435
436
  className: _cardcssmistica.touchableContainer,
436
437
  children: [
437
438
  /* @__PURE__ */ (0, _jsxruntime.jsx)(_boxed.Boxed, {
@@ -446,9 +447,9 @@ const ce = (r, a)=>{
446
447
  maybe: !0
447
448
  }, c), {
448
449
  className: _cardcssmistica.touchable,
449
- "aria-label": N,
450
+ "aria-label": C,
450
451
  children: [
451
- C && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
452
+ N && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
452
453
  className: b
453
454
  }),
454
455
  /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
@@ -464,13 +465,13 @@ const ce = (r, a)=>{
464
465
  headline: a,
465
466
  pretitle: i,
466
467
  pretitleLinesMax: s,
467
- title: u,
468
+ title: p,
468
469
  titleLinesMax: l,
469
470
  subtitle: h,
470
471
  subtitleLinesMax: o,
471
472
  description: d,
472
473
  descriptionLinesMax: t,
473
- extra: p,
474
+ extra: u,
474
475
  button: f,
475
476
  buttonLink: g
476
477
  })
@@ -480,15 +481,15 @@ const ce = (r, a)=>{
480
481
  ]
481
482
  }))
482
483
  }),
483
- /* @__PURE__ */ (0, _jsxruntime.jsx)(U, {
484
+ /* @__PURE__ */ (0, _jsxruntime.jsx)(k, {
484
485
  onClose: S,
485
486
  actions: m,
486
487
  type: "media"
487
488
  })
488
489
  ]
489
490
  });
490
- }), Tr = /*#__PURE__*/ _react.forwardRef((_param, w)=>{
491
- var { icon: r , headline: a , pretitle: i , pretitleLinesMax: s , title: h , titleLinesMax: o , subtitle: u , subtitleLinesMax: l , description: d , descriptionLinesMax: t , extra: p , actions: m , button: f , buttonLink: g , dataAttributes: x , "aria-label": N , onClose: S } = _param, c = _object_without_properties(_param, [
491
+ }), xr = /*#__PURE__*/ _react.forwardRef((_param, w)=>{
492
+ var { icon: r , headline: a , pretitle: i , pretitleLinesMax: s , title: h , titleLinesMax: o , subtitle: p , subtitleLinesMax: l , description: d , descriptionLinesMax: t , extra: u , actions: m , button: f , buttonLink: g , dataAttributes: x , "aria-label": C , onClose: S } = _param, c = _object_without_properties(_param, [
492
493
  "icon",
493
494
  "headline",
494
495
  "pretitle",
@@ -507,13 +508,13 @@ const ce = (r, a)=>{
507
508
  "aria-label",
508
509
  "onClose"
509
510
  ]);
510
- const C = !!r, b = c.href || c.to || c.onPress, z = _cardcssmistica.touchableCardOverlay, H = ce(m, S), R = {
511
+ const N = !!r, b = c.href || c.to || c.onPress, z = _cardcssmistica.touchableCardOverlay, H = ce(m, S), R = {
511
512
  marginRight: -16,
512
513
  marginTop: -24,
513
514
  width: he * H.length
514
515
  };
515
516
  return /* @__PURE__ */ (0, _jsxruntime.jsxs)(W, {
516
- "aria-label": N,
517
+ "aria-label": C,
517
518
  className: _cardcssmistica.touchableContainer,
518
519
  children: [
519
520
  /* @__PURE__ */ (0, _jsxruntime.jsx)(_boxed.Boxed, {
@@ -528,7 +529,7 @@ const ce = (r, a)=>{
528
529
  maybe: !0
529
530
  }, c), {
530
531
  className: _cardcssmistica.touchable,
531
- "aria-label": N,
532
+ "aria-label": C,
532
533
  children: [
533
534
  b && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
534
535
  className: z
@@ -536,38 +537,33 @@ const ce = (r, a)=>{
536
537
  /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
537
538
  className: _cardcssmistica.dataCard,
538
539
  children: [
539
- /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
540
- className: (0, _sprinklescssmistica.sprinkles)({
541
- display: "flex"
542
- }),
540
+ /* @__PURE__ */ (0, _jsxruntime.jsxs)(_inline.default, {
541
+ space: 0,
543
542
  children: [
544
543
  /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
545
544
  space: 16,
546
- className: (0, _sprinklescssmistica.sprinkles)({
547
- flex: 1
548
- }),
549
545
  children: [
550
- C ? r : null,
546
+ N ? r : null,
551
547
  /* @__PURE__ */ (0, _jsxruntime.jsx)(fe, {
552
548
  headline: a,
553
549
  pretitle: i,
554
550
  pretitleLinesMax: s,
555
551
  title: h,
556
552
  titleLinesMax: o,
557
- subtitle: u,
553
+ subtitle: p,
558
554
  subtitleLinesMax: l,
559
555
  description: d,
560
556
  descriptionLinesMax: t
561
557
  })
562
558
  ]
563
559
  }),
564
- !C && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
560
+ !N && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
565
561
  style: R
566
562
  })
567
563
  ]
568
564
  }),
569
- p && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
570
- children: p
565
+ u && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
566
+ children: u
571
567
  }),
572
568
  (f || g) && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
573
569
  className: _cardcssmistica.actions,
@@ -581,15 +577,15 @@ const ce = (r, a)=>{
581
577
  ]
582
578
  }))
583
579
  }),
584
- /* @__PURE__ */ (0, _jsxruntime.jsx)(U, {
580
+ /* @__PURE__ */ (0, _jsxruntime.jsx)(k, {
585
581
  onClose: S,
586
582
  actions: m,
587
583
  type: "default"
588
584
  })
589
585
  ]
590
586
  });
591
- }), Sr = /*#__PURE__*/ _react.forwardRef((_param, p)=>{
592
- var { icon: r , title: a , titleLinesMax: i , subtitle: s , subtitleLinesMax: h , dataAttributes: o , "aria-label": u , extra: l , isInverse: d = !1 } = _param, t = _object_without_properties(_param, [
587
+ }), wr = /*#__PURE__*/ _react.forwardRef((_param, u)=>{
588
+ var { icon: r , title: a , titleLinesMax: i , subtitle: s , subtitleLinesMax: h , dataAttributes: o , "aria-label": p , extra: l , isInverse: d = !1 } = _param, t = _object_without_properties(_param, [
593
589
  "icon",
594
590
  "title",
595
591
  "titleLinesMax",
@@ -608,7 +604,7 @@ const ce = (r, a)=>{
608
604
  dataAttributes: _object_spread({
609
605
  "component-name": "SnapCard"
610
606
  }, o),
611
- ref: p,
607
+ ref: u,
612
608
  isInverse: d,
613
609
  width: "100%",
614
610
  height: "100%",
@@ -616,7 +612,7 @@ const ce = (r, a)=>{
616
612
  maybe: !0
617
613
  }, t), {
618
614
  className: _cardcssmistica.touchable,
619
- "aria-label": u,
615
+ "aria-label": p,
620
616
  children: [
621
617
  m && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
622
618
  className: f
@@ -661,8 +657,8 @@ const ce = (r, a)=>{
661
657
  }))
662
658
  })
663
659
  });
664
- }), Je = 264, ve = /*#__PURE__*/ _react.forwardRef((_param, G)=>{
665
- var { isInverse: r , backgroundImage: a , backgroundVideo: i , backgroundVideoRef: s , poster: h , icon: o , headline: u , pretitle: l , pretitleLinesMax: d , title: t , titleLinesMax: p , description: m , descriptionLinesMax: f , extra: g , button: x , secondaryButton: N , onClose: S , actions: c , buttonLink: w , dataAttributes: C , width: b , height: z , aspectRatio: H , "aria-label": R } = _param, M = _object_without_properties(_param, [
660
+ }), Ke = 264, ve = /*#__PURE__*/ _react.forwardRef((_param, G)=>{
661
+ var { isInverse: r , backgroundImage: a , backgroundVideo: i , backgroundVideoRef: s , poster: h , icon: o , headline: p , pretitle: l , pretitleLinesMax: d , title: t , titleLinesMax: u , description: m , descriptionLinesMax: f , extra: g , button: x , secondaryButton: C , onClose: S , actions: c , buttonLink: w , dataAttributes: N , width: b , height: z , aspectRatio: H , "aria-label": R } = _param, M = _object_without_properties(_param, [
666
662
  "isInverse",
667
663
  "backgroundImage",
668
664
  "backgroundVideo",
@@ -688,11 +684,11 @@ const ce = (r, a)=>{
688
684
  "aspectRatio",
689
685
  "aria-label"
690
686
  ]);
691
- const B = me(a), { video: X , videoStatus: j , onVideoControlPress: Y } = pe(i, h, s);
687
+ const B = me(a), { video: X , videoStatus: j , onVideoControlPress: U } = ue(i, h, s);
692
688
  i && (c = [
693
689
  {
694
- Icon: ue(j),
695
- onPress: Y,
690
+ Icon: pe(j),
691
+ onPress: U,
696
692
  label: "Video controls",
697
693
  iconSize: j === "loadingTimeout" ? 16 : 12,
698
694
  iconColor: _skincontractcssmistica.vars.colors.inverse,
@@ -700,19 +696,19 @@ const ce = (r, a)=>{
700
696
  iconBackgroundInverse: _cardcssmistica.videoAction
701
697
  }
702
698
  ]);
703
- const F = (0, _themevariantcontext.useIsInverseVariant)(), I = !!a || !!i, Z = I ? "0 0 16px rgba(0,0,0,0.4)" : void 0, ye = (c == null ? void 0 : c.length) || S, ge = M.href || M.to || M.onPress, Ne = a || i ? _cardcssmistica.touchableCardOverlayMedia : r ? _cardcssmistica.touchableCardOverlayInverse : _cardcssmistica.touchableCardOverlay;
699
+ const F = (0, _themevariantcontext.useIsInverseVariant)(), I = !!a || !!i, Y = I ? "0 0 16px rgba(0,0,0,0.4)" : void 0, ye = (c == null ? void 0 : c.length) || S, ge = M.href || M.to || M.onPress, Ce = a || i ? _cardcssmistica.touchableCardOverlayMedia : r ? _cardcssmistica.touchableCardOverlayInverse : _cardcssmistica.touchableCardOverlay;
704
700
  return /* @__PURE__ */ (0, _jsxruntime.jsxs)(W, {
705
701
  width: b,
706
702
  height: z,
707
703
  aspectRatio: H,
708
704
  "aria-label": R,
709
- minWidth: Je,
705
+ minWidth: Ke,
710
706
  className: _cardcssmistica.touchableContainer,
711
707
  children: [
712
708
  /* @__PURE__ */ (0, _jsxruntime.jsx)(_boxed.InternalBoxed, {
713
709
  borderRadius: _skincontractcssmistica.vars.borderRadii.legacyDisplay,
714
710
  className: _cardcssmistica.boxed,
715
- dataAttributes: C,
711
+ dataAttributes: N,
716
712
  ref: G,
717
713
  width: "100%",
718
714
  minHeight: "100%",
@@ -725,7 +721,7 @@ const ce = (r, a)=>{
725
721
  "aria-label": R,
726
722
  children: [
727
723
  ge && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
728
- className: Ne
724
+ className: Ce
729
725
  }),
730
726
  /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
731
727
  className: _cardcssmistica.displayCardContainer,
@@ -763,11 +759,11 @@ const ce = (r, a)=>{
763
759
  /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
764
760
  space: 8,
765
761
  children: [
766
- (u || l || t) && /* @__PURE__ */ (0, _jsxruntime.jsx)("header", {
762
+ (p || l || t) && /* @__PURE__ */ (0, _jsxruntime.jsx)("header", {
767
763
  children: /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
768
764
  space: 16,
769
765
  children: [
770
- u,
766
+ p,
771
767
  /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
772
768
  space: 4,
773
769
  children: [
@@ -776,14 +772,14 @@ const ce = (r, a)=>{
776
772
  truncate: d,
777
773
  as: "div",
778
774
  regular: !0,
779
- textShadow: Z,
775
+ textShadow: Y,
780
776
  children: l
781
777
  }),
782
778
  /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text6, {
783
779
  forceMobileSizes: !0,
784
- truncate: p,
780
+ truncate: u,
785
781
  as: "h3",
786
- textShadow: Z,
782
+ textShadow: Y,
787
783
  hyphens: "auto",
788
784
  children: t
789
785
  })
@@ -798,7 +794,7 @@ const ce = (r, a)=>{
798
794
  as: "p",
799
795
  regular: !0,
800
796
  color: _skincontractcssmistica.vars.colors.textSecondary,
801
- textShadow: Z,
797
+ textShadow: Y,
802
798
  hyphens: "auto",
803
799
  children: m
804
800
  })
@@ -807,9 +803,9 @@ const ce = (r, a)=>{
807
803
  g
808
804
  ]
809
805
  }),
810
- (x || N || w) && /* @__PURE__ */ (0, _jsxruntime.jsx)(_buttongroup.default, {
806
+ (x || C || w) && /* @__PURE__ */ (0, _jsxruntime.jsx)(_buttongroup.default, {
811
807
  primaryButton: x,
812
- secondaryButton: N,
808
+ secondaryButton: C,
813
809
  link: w
814
810
  })
815
811
  ]
@@ -822,14 +818,14 @@ const ce = (r, a)=>{
822
818
  ]
823
819
  }))
824
820
  }),
825
- /* @__PURE__ */ (0, _jsxruntime.jsx)(U, {
821
+ /* @__PURE__ */ (0, _jsxruntime.jsx)(k, {
826
822
  onClose: S,
827
823
  actions: c,
828
824
  type: a || i ? "media" : r ? "inverse" : "default"
829
825
  })
830
826
  ]
831
827
  });
832
- }), xr = /*#__PURE__*/ _react.forwardRef((_param, i)=>/* @__PURE__ */ {
828
+ }), Br = /*#__PURE__*/ _react.forwardRef((_param, i)=>/* @__PURE__ */ {
833
829
  var { dataAttributes: r } = _param, a = _object_without_properties(_param, [
834
830
  "dataAttributes"
835
831
  ]);
@@ -840,7 +836,7 @@ const ce = (r, a)=>{
840
836
  "component-name": "DisplayMediaCard"
841
837
  })
842
838
  }));
843
- }), wr = /*#__PURE__*/ _react.forwardRef((_param, i)=>/* @__PURE__ */ {
839
+ }), Ir = /*#__PURE__*/ _react.forwardRef((_param, i)=>/* @__PURE__ */ {
844
840
  var { dataAttributes: r } = _param, a = _object_without_properties(_param, [
845
841
  "dataAttributes"
846
842
  ]);
@@ -850,8 +846,8 @@ const ce = (r, a)=>{
850
846
  "component-name": "DisplayDataCard"
851
847
  })
852
848
  }));
853
- }), Ke = 140, Br = /*#__PURE__*/ _react.forwardRef((_param, b)=>{
854
- var { dataAttributes: r , backgroundImage: a , backgroundVideo: i , poster: s , backgroundVideoRef: h , width: o , height: u , aspectRatio: l = "7:10" , ariaLabel: d , actions: t , onClose: p , icon: m , headline: f , pretitle: g , pretitleLinesMax: x , title: N , titleLinesMax: S , description: c , descriptionLinesMax: w } = _param, C = _object_without_properties(_param, [
849
+ }), Qe = 140, Ar = /*#__PURE__*/ _react.forwardRef((_param, b)=>{
850
+ var { dataAttributes: r , backgroundImage: a , backgroundVideo: i , poster: s , backgroundVideoRef: h , width: o , height: p , aspectRatio: l = "7:10" , ariaLabel: d , actions: t , onClose: u , icon: m , headline: f , pretitle: g , pretitleLinesMax: x , title: C , titleLinesMax: S , description: c , descriptionLinesMax: w } = _param, N = _object_without_properties(_param, [
855
851
  "dataAttributes",
856
852
  "backgroundImage",
857
853
  "backgroundVideo",
@@ -872,10 +868,10 @@ const ce = (r, a)=>{
872
868
  "description",
873
869
  "descriptionLinesMax"
874
870
  ]);
875
- const z = me(a), { video: H , videoStatus: R , onVideoControlPress: M } = pe(i, s, h);
871
+ const z = me(a), { video: H , videoStatus: R , onVideoControlPress: M } = ue(i, s, h);
876
872
  i && (t = [
877
873
  {
878
- Icon: ue(R),
874
+ Icon: pe(R),
879
875
  onPress: M,
880
876
  label: "Video controls",
881
877
  iconSize: R === "loadingTimeout" ? 16 : 12,
@@ -884,11 +880,11 @@ const ce = (r, a)=>{
884
880
  iconBackgroundInverse: _cardcssmistica.videoAction
885
881
  }
886
882
  ]);
887
- const G = (0, _themevariantcontext.useIsInverseVariant)(), B = !!a || !!i, X = B ? "0 0 16px rgba(0,0,0,0.4)" : void 0, j = (t == null ? void 0 : t.length) || p, { textPresets: Y } = (0, _hooks.useTheme)(), F = C.href || C.to || C.onPress, I = _cardcssmistica.touchableCardOverlayMedia;
883
+ const G = (0, _themevariantcontext.useIsInverseVariant)(), B = !!a || !!i, X = B ? "0 0 16px rgba(0,0,0,0.4)" : void 0, j = (t == null ? void 0 : t.length) || u, { textPresets: U } = (0, _hooks.useTheme)(), F = N.href || N.to || N.onPress, I = _cardcssmistica.touchableCardOverlayMedia;
888
884
  return /* @__PURE__ */ (0, _jsxruntime.jsxs)(W, {
889
885
  width: o,
890
- height: u,
891
- minWidth: Ke,
886
+ height: p,
887
+ minWidth: Qe,
892
888
  aspectRatio: l,
893
889
  "aria-label": d,
894
890
  className: _cardcssmistica.touchableContainer,
@@ -904,7 +900,7 @@ const ce = (r, a)=>{
904
900
  background: a || i ? G ? _skincontractcssmistica.vars.colors.backgroundContainerBrandOverInverse : _skincontractcssmistica.vars.colors.backgroundContainer : void 0,
905
901
  children: /* @__PURE__ */ (0, _jsxruntime.jsxs)(_touchable.BaseTouchable, _object_spread_props(_object_spread({
906
902
  maybe: !0
907
- }, C), {
903
+ }, N), {
908
904
  className: _cardcssmistica.touchable,
909
905
  "aria-label": d,
910
906
  children: [
@@ -932,7 +928,7 @@ const ce = (r, a)=>{
932
928
  paddingX: 24,
933
929
  children: m
934
930
  }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
935
- paddingBottom: t != null && t.length || p ? B ? 24 : 64 : 0
931
+ paddingBottom: t != null && t.length || u ? B ? 24 : 64 : 0
936
932
  }),
937
933
  /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
938
934
  paddingX: 16,
@@ -945,7 +941,7 @@ const ce = (r, a)=>{
945
941
  children: /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
946
942
  space: 8,
947
943
  children: [
948
- (f || g || N) && /* @__PURE__ */ (0, _jsxruntime.jsx)("header", {
944
+ (f || g || C) && /* @__PURE__ */ (0, _jsxruntime.jsx)("header", {
949
945
  children: /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
950
946
  space: 16,
951
947
  children: [
@@ -968,10 +964,10 @@ const ce = (r, a)=>{
968
964
  mobileLineHeight: "24px",
969
965
  desktopLineHeight: "28px",
970
966
  truncate: S,
971
- weight: Y.cardTitle.weight,
967
+ weight: U.cardTitle.weight,
972
968
  as: "h3",
973
969
  hyphens: "auto",
974
- children: N
970
+ children: C
975
971
  })
976
972
  ]
977
973
  })
@@ -999,8 +995,8 @@ const ce = (r, a)=>{
999
995
  ]
1000
996
  }))
1001
997
  }),
1002
- /* @__PURE__ */ (0, _jsxruntime.jsx)(U, {
1003
- onClose: p,
998
+ /* @__PURE__ */ (0, _jsxruntime.jsx)(k, {
999
+ onClose: u,
1004
1000
  actions: t,
1005
1001
  type: "media"
1006
1002
  })
@@ -8,4 +8,4 @@ Object.defineProperty(exports, "PACKAGE_VERSION", {
8
8
  return o;
9
9
  }
10
10
  });
11
- const o = "14.16.0";
11
+ const o = "14.16.1";