@telefonica/mistica 14.17.1 → 14.18.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.
Files changed (176) hide show
  1. package/css/mistica.css +1 -1
  2. package/dist/avatar.css-mistica.js +3 -3
  3. package/dist/badge.css-mistica.js +3 -3
  4. package/dist/box.d.ts +8 -8
  5. package/dist/box.js +28 -21
  6. package/dist/boxed.css-mistica.js +1 -1
  7. package/dist/button-group.css-mistica.js +1 -1
  8. package/dist/button-layout.css-mistica.js +8 -8
  9. package/dist/button.css-mistica.js +19 -19
  10. package/dist/callout.css-mistica.js +1 -1
  11. package/dist/card.css-mistica.js +27 -18
  12. package/dist/card.css.d.ts +3 -0
  13. package/dist/card.d.ts +37 -14
  14. package/dist/card.js +442 -268
  15. package/dist/carousel.css-mistica.js +16 -16
  16. package/dist/checkbox.css-mistica.js +10 -10
  17. package/dist/chip.css-mistica.js +4 -4
  18. package/dist/circle.css-mistica.js +2 -2
  19. package/dist/circle.d.ts +2 -0
  20. package/dist/circle.js +61 -7
  21. package/dist/community/advanced-data-card.css-mistica.js +69 -0
  22. package/dist/community/advanced-data-card.css.d.ts +20 -0
  23. package/dist/community/advanced-data-card.css.ts.vanilla.css-mistica.js +11 -0
  24. package/dist/community/advanced-data-card.d.ts +39 -0
  25. package/dist/community/advanced-data-card.js +317 -0
  26. package/dist/community/blocks.css-mistica.js +21 -0
  27. package/dist/community/blocks.css.d.ts +2 -0
  28. package/dist/community/blocks.css.ts.vanilla.css-mistica.js +11 -0
  29. package/dist/community/blocks.d.ts +73 -0
  30. package/dist/community/blocks.js +258 -0
  31. package/dist/community/index.d.ts +2 -0
  32. package/dist/community/index.js +31 -3
  33. package/dist/credit-card-number-field.css-mistica.js +3 -3
  34. package/dist/dialog.css-mistica.js +9 -9
  35. package/dist/double-field.css-mistica.js +2 -2
  36. package/dist/empty-state-card.css-mistica.js +1 -1
  37. package/dist/empty-state.css-mistica.js +4 -4
  38. package/dist/empty-state.js +4 -4
  39. package/dist/feedback.css-mistica.js +3 -3
  40. package/dist/fixed-footer-layout.css-mistica.js +2 -2
  41. package/dist/grid.css.d.ts +6 -6
  42. package/dist/header.css-mistica.js +24 -0
  43. package/dist/header.css.d.ts +3 -0
  44. package/dist/header.css.ts.vanilla.css-mistica.js +11 -0
  45. package/dist/header.d.ts +3 -0
  46. package/dist/header.js +121 -101
  47. package/dist/hero.css-mistica.js +4 -4
  48. package/dist/highlighted-card.css-mistica.js +5 -5
  49. package/dist/horizontal-scroll.css-mistica.js +1 -1
  50. package/dist/icon-button.css-mistica.js +1 -1
  51. package/dist/image.css-mistica.js +1 -1
  52. package/dist/image.d.ts +19 -6
  53. package/dist/image.js +64 -61
  54. package/dist/index.d.ts +1 -1
  55. package/dist/index.js +6 -0
  56. package/dist/list.css-mistica.js +14 -14
  57. package/dist/list.js +11 -10
  58. package/dist/loading-bar.css-mistica.js +5 -5
  59. package/dist/maybe-dismissable.css-mistica.js +1 -1
  60. package/dist/menu.css-mistica.js +2 -2
  61. package/dist/navigation-bar.css-mistica.js +16 -16
  62. package/dist/navigation-breadcrumbs.css-mistica.js +1 -1
  63. package/dist/package-version.js +1 -1
  64. package/dist/password-field.css-mistica.js +2 -2
  65. package/dist/popover.css-mistica.js +11 -11
  66. package/dist/progress-bar.css-mistica.js +3 -3
  67. package/dist/radio-button.css-mistica.js +12 -12
  68. package/dist/responsive-layout.css-mistica.js +2 -2
  69. package/dist/screen-reader-only.css-mistica.js +1 -1
  70. package/dist/select.css-mistica.js +12 -12
  71. package/dist/skeletons.css-mistica.js +3 -3
  72. package/dist/snackbar.css-mistica.js +5 -5
  73. package/dist/spinner.css-mistica.js +1 -1
  74. package/dist/sprinkles.css-mistica.js +648 -336
  75. package/dist/sprinkles.css.d.ts +36 -7
  76. package/dist/stack.css-mistica.js +7 -4
  77. package/dist/stack.css.d.ts +3 -0
  78. package/dist/stack.d.ts +4 -2
  79. package/dist/stack.js +20 -13
  80. package/dist/stacking-group.css-mistica.js +1 -1
  81. package/dist/stepper.css-mistica.js +9 -9
  82. package/dist/switch-component.css-mistica.js +21 -21
  83. package/dist/tabs.css-mistica.js +11 -11
  84. package/dist/tag.css-mistica.js +1 -1
  85. package/dist/text-field-base.css-mistica.js +11 -11
  86. package/dist/text-field-components.css-mistica.js +15 -15
  87. package/dist/text-link.css-mistica.js +5 -5
  88. package/dist/theme.d.ts +2 -0
  89. package/dist/theme.js +49 -41
  90. package/dist/tooltip.css-mistica.js +9 -9
  91. package/dist/touchable.css-mistica.js +3 -3
  92. package/dist/utils/aspect-ratio-support.css-mistica.js +4 -4
  93. package/dist/utils/aspect-ratio-support.d.ts +4 -2
  94. package/dist/utils/aspect-ratio-support.js +17 -16
  95. package/dist/utils/types.d.ts +5 -0
  96. package/dist/utils/utility-types.d.ts +7 -0
  97. package/dist/video.css-mistica.js +2 -2
  98. package/dist/video.js +26 -78
  99. package/dist-es/avatar.css-mistica.js +2 -2
  100. package/dist-es/badge.css-mistica.js +2 -2
  101. package/dist-es/box.js +32 -25
  102. package/dist-es/boxed.css-mistica.js +1 -1
  103. package/dist-es/button-group.css-mistica.js +1 -1
  104. package/dist-es/button-layout.css-mistica.js +7 -7
  105. package/dist-es/button.css-mistica.js +9 -9
  106. package/dist-es/callout.css-mistica.js +1 -1
  107. package/dist-es/card.css-mistica.js +4 -4
  108. package/dist-es/card.js +549 -384
  109. package/dist-es/carousel.css-mistica.js +2 -2
  110. package/dist-es/checkbox.css-mistica.js +6 -6
  111. package/dist-es/chip.css-mistica.js +4 -4
  112. package/dist-es/circle.css-mistica.js +2 -2
  113. package/dist-es/circle.js +66 -12
  114. package/dist-es/community/advanced-data-card.css-mistica.js +7 -0
  115. package/dist-es/community/advanced-data-card.css.ts.vanilla.css-mistica.js +2 -0
  116. package/dist-es/community/advanced-data-card.js +256 -0
  117. package/dist-es/community/blocks.css-mistica.js +4 -0
  118. package/dist-es/community/blocks.css.ts.vanilla.css-mistica.js +2 -0
  119. package/dist-es/community/blocks.js +224 -0
  120. package/dist-es/community/index.js +4 -2
  121. package/dist-es/credit-card-number-field.css-mistica.js +3 -3
  122. package/dist-es/dialog.css-mistica.js +5 -5
  123. package/dist-es/double-field.css-mistica.js +2 -2
  124. package/dist-es/empty-state-card.css-mistica.js +1 -1
  125. package/dist-es/empty-state.css-mistica.js +3 -3
  126. package/dist-es/empty-state.js +11 -11
  127. package/dist-es/feedback.css-mistica.js +2 -2
  128. package/dist-es/fixed-footer-layout.css-mistica.js +2 -2
  129. package/dist-es/header.css-mistica.js +4 -0
  130. package/dist-es/header.css.ts.vanilla.css-mistica.js +2 -0
  131. package/dist-es/header.js +141 -121
  132. package/dist-es/hero.css-mistica.js +2 -2
  133. package/dist-es/highlighted-card.css-mistica.js +5 -5
  134. package/dist-es/horizontal-scroll.css-mistica.js +1 -1
  135. package/dist-es/icon-button.css-mistica.js +1 -1
  136. package/dist-es/image.css-mistica.js +1 -1
  137. package/dist-es/image.js +76 -73
  138. package/dist-es/index.js +1710 -1710
  139. package/dist-es/list.css-mistica.js +2 -2
  140. package/dist-es/list.js +22 -21
  141. package/dist-es/loading-bar.css-mistica.js +2 -2
  142. package/dist-es/maybe-dismissable.css-mistica.js +1 -1
  143. package/dist-es/menu.css-mistica.js +2 -2
  144. package/dist-es/navigation-bar.css-mistica.js +9 -9
  145. package/dist-es/navigation-breadcrumbs.css-mistica.js +1 -1
  146. package/dist-es/package-version.js +1 -1
  147. package/dist-es/password-field.css-mistica.js +2 -2
  148. package/dist-es/popover.css-mistica.js +2 -2
  149. package/dist-es/progress-bar.css-mistica.js +2 -2
  150. package/dist-es/radio-button.css-mistica.js +6 -6
  151. package/dist-es/responsive-layout.css-mistica.js +2 -2
  152. package/dist-es/screen-reader-only.css-mistica.js +1 -1
  153. package/dist-es/select.css-mistica.js +10 -10
  154. package/dist-es/skeletons.css-mistica.js +2 -2
  155. package/dist-es/snackbar.css-mistica.js +2 -2
  156. package/dist-es/spinner.css-mistica.js +1 -1
  157. package/dist-es/sprinkles.css-mistica.js +648 -336
  158. package/dist-es/stack.css-mistica.js +6 -3
  159. package/dist-es/stack.js +27 -20
  160. package/dist-es/stacking-group.css-mistica.js +1 -1
  161. package/dist-es/stepper.css-mistica.js +2 -2
  162. package/dist-es/style.css +1 -1
  163. package/dist-es/switch-component.css-mistica.js +18 -18
  164. package/dist-es/tabs.css-mistica.js +7 -7
  165. package/dist-es/tag.css-mistica.js +1 -1
  166. package/dist-es/text-field-base.css-mistica.js +2 -2
  167. package/dist-es/text-field-components.css-mistica.js +2 -2
  168. package/dist-es/text-link.css-mistica.js +5 -5
  169. package/dist-es/theme.js +52 -44
  170. package/dist-es/tooltip.css-mistica.js +3 -3
  171. package/dist-es/touchable.css-mistica.js +2 -2
  172. package/dist-es/utils/aspect-ratio-support.css-mistica.js +3 -3
  173. package/dist-es/utils/aspect-ratio-support.js +17 -16
  174. package/dist-es/video.css-mistica.js +2 -2
  175. package/dist-es/video.js +36 -88
  176. package/package.json +2 -2
package/dist-es/card.js CHANGED
@@ -77,52 +77,53 @@ function _object_without_properties_loose(source, excluded) {
77
77
  }
78
78
  return target;
79
79
  }
80
- import { jsxs as n, jsx as e, Fragment as Ne } from "react/jsx-runtime";
81
- import * as T from "react";
82
- import Te from "./tag.js";
83
- import y from "./stack.js";
84
- import D from "./box.js";
85
- import { Text2 as A, Text6 as Se, Text3 as xe, Text as $ } from "./text.js";
86
- import { Boxed as Z, InternalBoxed as L } from "./boxed.js";
87
- import q from "./button-group.js";
88
- import we, { MediaBorderRadiusProvider as Be } from "./image.js";
89
- import { BaseTouchable as O } from "./touchable.js";
90
- import { vars as f } from "./skins/skin-contract.css-mistica.js";
91
- import { touchableContainer as P, boxed as _, touchable as E, mediaCard as Ie, mediaCardContent as Ae, dataCard as be, actions as ee, snapCard as Re, videoAction as V, displayCardContainer as re, displayCardBackground as ae, displayCardContent as ie, displayCardGradient as ne, cardActionIconButton as Q, cardContainer as De, vars as Me, touchableMediaCardOverlay as ze, touchableCardOverlay as J, touchableCardOverlayInverse as te, touchableCardOverlayMedia as se, cardAction as He, cardActionInverse as Oe, cardActionMedia as Pe } from "./card.css-mistica.js";
92
- import { useTheme as K } from "./hooks.js";
93
- import { sprinkles as oe } from "./sprinkles.css-mistica.js";
94
- import _e from "./icon-button.js";
95
- import Ee from "./generated/mistica-icons/icon-close-regular.js";
96
- import We from "./generated/mistica-icons/icon-pause-filled.js";
97
- import Ge from "./generated/mistica-icons/icon-play-filled.js";
98
- import { combineRefs as Xe } from "./utils/common.js";
99
- import je from "./spinner.js";
100
- import Fe from "./video.js";
101
- import { useIsInverseVariant as le, ThemeVariant as de } from "./theme-variant-context.js";
102
- import Ve from "classnames";
103
- import { assignInlineVars as ke } from "@vanilla-extract/dynamic";
104
- import Ue from "./inline.js";
105
- const ce = (r, a)=>{
106
- const { texts: i } = K(), s = r ? [
80
+ import { jsx as e, jsxs as i, Fragment as Se } from "react/jsx-runtime";
81
+ import * as C from "react";
82
+ import we from "./tag.js";
83
+ import T from "./stack.js";
84
+ import M from "./box.js";
85
+ import { Text2 as x, Text6 as Be, Text3 as Ie, Text as ae } from "./text.js";
86
+ import { Boxed as Z, InternalBoxed as ie } from "./boxed.js";
87
+ import $ from "./button-group.js";
88
+ import q, { MediaBorderRadiusProvider as Re } from "./image.js";
89
+ import { BaseTouchable as D } from "./touchable.js";
90
+ import { vars as N } from "./skins/skin-contract.css-mistica.js";
91
+ import { cardContainer as Me, vars as De, touchableContainer as z, boxed as W, touchable as O, touchableMediaCardOverlay as ze, mediaCard as J, mediaCardContent as Oe, touchableNakedMediaOverlay as ne, circularMediaOverlay as te, nakedCardContent as se, touchableCardOverlay as K, dataCard as He, actions as le, snapCard as _e, displayCardContainer as de, displayCardBackground as oe, displayCardContent as ce, displayCardGradient as he, touchableCardOverlayMedia as me, cardActionIconButton as V, videoAction as ee, touchableCardOverlayInverse as ue, cardAction as Ee, cardActionInverse as We, cardActionMedia as ke } from "./card.css-mistica.js";
92
+ import { useTheme as F } from "./hooks.js";
93
+ import { sprinkles as pe } from "./sprinkles.css-mistica.js";
94
+ import Ge from "./icon-button.js";
95
+ import Xe from "./generated/mistica-icons/icon-close-regular.js";
96
+ import re from "./generated/mistica-icons/icon-pause-filled.js";
97
+ import je from "./generated/mistica-icons/icon-play-filled.js";
98
+ import { combineRefs as Fe } from "./utils/common.js";
99
+ import Pe from "./spinner.js";
100
+ import Ue from "./video.js";
101
+ import { useIsInverseVariant as fe, ThemeVariant as ve } from "./theme-variant-context.js";
102
+ import L from "classnames";
103
+ import { assignInlineVars as Ye } from "@vanilla-extract/dynamic";
104
+ import Ze from "./inline.js";
105
+ import { getPrefixedDataAttributes as $e } from "./utils/dom.js";
106
+ const ye = (r, a)=>{
107
+ const { texts: n } = F(), l = r ? [
107
108
  ...r
108
109
  ] : [];
109
- return a && s.push({
110
- label: i.closeButtonLabel,
110
+ return a && l.push({
111
+ label: n.closeButtonLabel,
111
112
  onPress: a,
112
- Icon: Ee
113
- }), s;
114
- }, he = 48, k = (param)=>{
115
- let { actions: r , onClose: a , type: i = "default" } = param;
116
- const s = ce(r, a), h = s.length > 0, o = {
117
- default: f.colors.neutralHigh,
118
- inverse: f.colors.inverse,
113
+ Icon: Xe
114
+ }), l;
115
+ }, ge = 48, k = (param)=>{
116
+ let { actions: r , onClose: a , type: n = "default" } = param;
117
+ const l = ye(r, a), u = l.length > 0, s = {
118
+ default: N.colors.neutralHigh,
119
+ inverse: N.colors.inverse,
119
120
  media: "#000000"
120
- }, p = {
121
- default: He,
122
- inverse: Oe,
123
- media: Pe
121
+ }, o = {
122
+ default: Ee,
123
+ inverse: We,
124
+ media: ke
124
125
  };
125
- return h ? /* @__PURE__ */ e("div", {
126
+ return u ? /* @__PURE__ */ e("div", {
126
127
  style: {
127
128
  position: "absolute",
128
129
  right: 8,
@@ -130,58 +131,60 @@ const ce = (r, a)=>{
130
131
  zIndex: 3
131
132
  },
132
133
  children: /* @__PURE__ */ e("div", {
133
- className: oe({
134
+ className: pe({
134
135
  display: "flex"
135
136
  }),
136
- children: s.map((param, m)=>{
137
- let { onPress: l , label: d , Icon: t , iconSize: u = 20 } = param;
138
- return t ? /* @__PURE__ */ e(_e, {
139
- size: he,
140
- onPress: l,
141
- "aria-label": d,
142
- className: Q,
137
+ children: l.map((param, f)=>{
138
+ let { onPress: c , label: p , Icon: t , iconSize: d = 20 , disabled: m = !1 } = param;
139
+ return t ? /* @__PURE__ */ e(Ge, {
140
+ disabled: m,
141
+ size: ge,
142
+ onPress: c,
143
+ "aria-label": p,
144
+ className: V,
143
145
  style: {
144
146
  display: "flex"
145
147
  },
146
148
  children: /* @__PURE__ */ e("div", {
147
- className: p[i],
149
+ className: o[n],
148
150
  children: /* @__PURE__ */ e(t, {
149
- color: o[i],
150
- size: u
151
+ color: s[n],
152
+ size: d
151
153
  })
152
154
  })
153
- }, m) : /* @__PURE__ */ e("div", {
154
- className: Q
155
- }, m);
155
+ }, f) : /* @__PURE__ */ e("div", {
156
+ className: V
157
+ }, f);
156
158
  })
157
159
  })
158
- }) : /* @__PURE__ */ e(Ne, {});
159
- }, Ye = (r)=>r ? typeof r == "number" ? r : ({
160
+ }) : /* @__PURE__ */ e(Se, {});
161
+ }, qe = (r)=>r ? typeof r == "number" ? r : ({
160
162
  "1:1": 1,
161
163
  "16:9": 16 / 9,
162
164
  "7:10": 7 / 10,
163
165
  "9:10": 9 / 10,
164
166
  auto: 0
165
- })[r] : 0, W = (param)=>{
166
- let { children: r , width: a = "100%" , height: i = "100%" , minWidth: s , aspectRatio: h , className: o , "aria-label": p } = param;
167
- const l = Ye(h);
168
- return /* @__PURE__ */ e("section", {
169
- "aria-label": p,
170
- className: Ve(o, De),
167
+ })[r] : 0, H = /*#__PURE__*/ C.forwardRef((param, p)=>{
168
+ let { children: r , width: a = "100%" , height: n = "100%" , minWidth: l , aspectRatio: u , dataAttributes: s , className: o , "aria-label": c } = param;
169
+ const t = qe(u);
170
+ return /* @__PURE__ */ e("section", _object_spread_props(_object_spread({}, $e(s)), {
171
+ ref: p,
172
+ "aria-label": c,
173
+ className: L(o, Me),
171
174
  style: _object_spread({
172
175
  width: a,
173
- height: i,
174
- minWidth: s
175
- }, l ? ke({
176
- [Me.aspectRatio]: String(l)
176
+ height: n,
177
+ minWidth: l
178
+ }, t ? Ye({
179
+ [De.aspectRatio]: String(t)
177
180
  }) : {}),
178
181
  children: r
179
- });
180
- }, me = (r)=>/* @__PURE__ */ e(we, {
182
+ }));
183
+ }), Ne = (r)=>/* @__PURE__ */ e(q, {
181
184
  width: "100%",
182
185
  height: "100%",
183
186
  src: r !== null && r !== void 0 ? r : "//:0"
184
- }), Ze = {
187
+ }), Je = {
185
188
  loading: {
186
189
  showSpinner: "loadingTimeout",
187
190
  play: "playing",
@@ -205,120 +208,134 @@ const ce = (r, a)=>{
205
208
  error: {
206
209
  reset: "loading"
207
210
  }
208
- }, qe = (r, a)=>Ze[r][a] || r, Je = (param)=>/* @__PURE__ */ {
211
+ }, Ke = (r, a)=>Je[r][a] || r, Le = (param)=>/* @__PURE__ */ {
209
212
  let { size: r , color: a } = param;
210
- return e(je, {
213
+ return e(Pe, {
211
214
  size: r,
212
215
  color: a,
213
216
  delay: "0"
214
217
  });
215
- }, pe = (r)=>{
216
- switch(r){
217
- case "playing":
218
- case "loading":
219
- return We;
220
- case "paused":
221
- return Ge;
222
- case "loadingTimeout":
223
- return Je;
224
- default:
225
- return;
226
- }
227
- }, ue = (r, a, i)=>{
228
- const s = T.useRef(null), [h, o] = T.useReducer(qe, "loading");
229
- return T.useEffect(()=>{
230
- var t;
218
+ }, Ce = (r, a, n)=>{
219
+ const { texts: l } = F(), u = C.useRef(null), [s, o] = C.useReducer(Ke, "loading");
220
+ C.useEffect(()=>{
221
+ var m;
231
222
  const d = setTimeout(()=>o("showSpinner"), 2e3);
232
- return (t = s.current) == null || t.load(), ()=>{
223
+ return (m = u.current) == null || m.load(), ()=>{
233
224
  clearTimeout(d), o("reset");
234
225
  };
235
226
  }, [
236
227
  r
237
- ]), {
238
- video: T.useMemo(()=>r ? /* @__PURE__ */ e(Fe, {
239
- ref: Xe(s, i),
240
- src: r,
241
- width: "100%",
242
- height: "100%",
243
- poster: a,
244
- onError: ()=>o("fail"),
245
- onPause: ()=>o("pause"),
246
- onPlay: ()=>o("play")
247
- }) : void 0, [
248
- i,
249
- r,
250
- a
251
- ]),
252
- videoStatus: h,
253
- onVideoControlPress: ()=>{
254
- const d = s.current;
255
- d && (h === "loading" ? o("showSpinner") : h === "paused" ? d.play() : h === "playing" && d.pause());
256
- }
228
+ ]);
229
+ const c = C.useMemo(()=>r ? /* @__PURE__ */ e(Ue, {
230
+ ref: Fe(u, n),
231
+ src: r,
232
+ width: "100%",
233
+ height: "100%",
234
+ poster: a,
235
+ onError: ()=>o("fail"),
236
+ onPause: ()=>o("pause"),
237
+ onPlay: ()=>o("play")
238
+ }) : void 0, [
239
+ n,
240
+ r,
241
+ a
242
+ ]), p = ()=>{
243
+ const d = u.current;
244
+ d && (s === "loading" ? o("showSpinner") : s === "paused" ? d.play() : s === "playing" && d.pause());
245
+ }, t = {
246
+ Icon: {
247
+ playing: re,
248
+ loading: re,
249
+ paused: je,
250
+ loadingTimeout: Le,
251
+ error: void 0
252
+ }[s],
253
+ onPress: p,
254
+ label: {
255
+ playing: l.pauseIconButtonLabel,
256
+ loading: l.pauseIconButtonLabel,
257
+ paused: l.playIconButtonLabel,
258
+ loadingTimeout: "",
259
+ error: ""
260
+ }[s],
261
+ disabled: ![
262
+ "loading",
263
+ "playing",
264
+ "paused"
265
+ ].includes(s),
266
+ iconSize: s === "loadingTimeout" ? 16 : 12,
267
+ iconColor: N.colors.inverse,
268
+ iconBackground: ee,
269
+ iconBackgroundInverse: ee
257
270
  };
258
- }, fe = (param)=>{
259
- 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;
260
- const { textPresets: v } = K(), g = ()=>r ? typeof r == "string" ? /* @__PURE__ */ e(Te, {
271
+ return {
272
+ video: c,
273
+ videoAction: t
274
+ };
275
+ }, Q = (param)=>{
276
+ let { headline: r , pretitle: a , pretitleLinesMax: n , title: l , titleLinesMax: u , subtitle: s , subtitleLinesMax: o , description: c , descriptionLinesMax: p , extra: t , button: d , buttonLink: m } = param;
277
+ const { textPresets: f } = F(), v = ()=>r ? typeof r == "string" ? /* @__PURE__ */ e(we, {
261
278
  type: "promo",
262
279
  children: r
263
280
  }) : r : null;
264
- return /* @__PURE__ */ n("div", {
265
- className: oe({
281
+ return /* @__PURE__ */ i("div", {
282
+ className: pe({
266
283
  display: "flex",
267
284
  flex: 1,
268
285
  justifyContent: "space-between",
269
286
  flexDirection: "column"
270
287
  }),
271
288
  children: [
272
- /* @__PURE__ */ n("div", {
289
+ /* @__PURE__ */ i("div", {
273
290
  children: [
274
- /* @__PURE__ */ n(y, {
291
+ /* @__PURE__ */ i(T, {
275
292
  space: 8,
276
293
  children: [
277
- (r || a || s || o) && /* @__PURE__ */ e("header", {
278
- children: /* @__PURE__ */ n(y, {
294
+ (r || a || l || s) && /* @__PURE__ */ e("header", {
295
+ children: /* @__PURE__ */ i(T, {
279
296
  space: 8,
280
297
  children: [
281
- g(),
282
- /* @__PURE__ */ n(y, {
298
+ v(),
299
+ /* @__PURE__ */ i(T, {
283
300
  space: 4,
284
301
  children: [
285
- a && /* @__PURE__ */ e(A, {
286
- truncate: i,
302
+ a && /* @__PURE__ */ e(x, {
303
+ truncate: n,
287
304
  as: "div",
288
305
  regular: !0,
289
306
  hyphens: "auto",
290
307
  children: a
291
308
  }),
292
- /* @__PURE__ */ e($, {
309
+ /* @__PURE__ */ e(ae, {
293
310
  mobileSize: 18,
294
311
  mobileLineHeight: "24px",
295
312
  desktopSize: 20,
296
313
  desktopLineHeight: "28px",
297
- truncate: h,
298
- weight: v.cardTitle.weight,
314
+ truncate: u,
315
+ weight: f.cardTitle.weight,
299
316
  as: "h3",
300
317
  hyphens: "auto",
301
- children: s
318
+ children: l
302
319
  }),
303
- /* @__PURE__ */ e(A, {
304
- truncate: p,
320
+ /* @__PURE__ */ e(x, {
321
+ truncate: o,
305
322
  as: "div",
306
323
  regular: !0,
307
324
  hyphens: "auto",
308
- children: o
325
+ children: s
309
326
  })
310
327
  ]
311
328
  })
312
329
  ]
313
330
  })
314
331
  }),
315
- l && /* @__PURE__ */ e(A, {
316
- truncate: d,
332
+ c && /* @__PURE__ */ e(x, {
333
+ truncate: p,
317
334
  as: "p",
318
335
  regular: !0,
319
- color: f.colors.textSecondary,
336
+ color: N.colors.textSecondary,
320
337
  hyphens: "auto",
321
- children: l
338
+ children: c
322
339
  })
323
340
  ]
324
341
  }),
@@ -327,17 +344,17 @@ const ce = (r, a)=>{
327
344
  })
328
345
  ]
329
346
  }),
330
- (u || m) && /* @__PURE__ */ e("div", {
331
- className: ee,
332
- children: /* @__PURE__ */ e(q, {
333
- primaryButton: u,
347
+ (d || m) && /* @__PURE__ */ e("div", {
348
+ className: le,
349
+ children: /* @__PURE__ */ e($, {
350
+ primaryButton: d,
334
351
  link: m
335
352
  })
336
353
  })
337
354
  ]
338
355
  });
339
- }, Sr = /*#__PURE__*/ T.forwardRef((_param, B)=>{
340
- 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: v , buttonLink: g , dataAttributes: w , "aria-label": C , onClose: S } = _param, c = _object_without_properties(_param, [
356
+ }, Sr = /*#__PURE__*/ C.forwardRef((_param, S)=>{
357
+ var { media: r , headline: a , pretitle: n , pretitleLinesMax: l , subtitle: u , subtitleLinesMax: s , title: o , titleLinesMax: c , description: p , descriptionLinesMax: t , extra: d , actions: m , button: f , buttonLink: v , dataAttributes: A , "aria-label": y , onClose: b } = _param, h = _object_without_properties(_param, [
341
358
  "media",
342
359
  "headline",
343
360
  "pretitle",
@@ -356,50 +373,50 @@ const ce = (r, a)=>{
356
373
  "aria-label",
357
374
  "onClose"
358
375
  ]);
359
- const N = c.href || c.to || c.onPress, b = ze;
360
- return /* @__PURE__ */ n(W, {
361
- "aria-label": C,
362
- className: P,
376
+ const g = h.href || h.to || h.onPress;
377
+ return /* @__PURE__ */ i(H, {
378
+ dataAttributes: _object_spread({
379
+ "component-name": "MediaCard"
380
+ }, A),
381
+ ref: S,
382
+ "aria-label": y,
383
+ className: z,
363
384
  children: [
364
385
  /* @__PURE__ */ e(Z, {
365
- className: _,
366
- dataAttributes: _object_spread({
367
- "component-name": "MediaCard"
368
- }, w),
369
- ref: B,
386
+ className: W,
370
387
  width: "100%",
371
388
  height: "100%",
372
- children: /* @__PURE__ */ n(O, _object_spread_props(_object_spread({
389
+ children: /* @__PURE__ */ i(D, _object_spread_props(_object_spread({
373
390
  maybe: !0
374
- }, c), {
375
- className: E,
376
- "aria-label": C,
391
+ }, h), {
392
+ className: O,
393
+ "aria-label": y,
377
394
  children: [
378
- N && /* @__PURE__ */ e("div", {
379
- className: b
395
+ g && /* @__PURE__ */ e("div", {
396
+ className: ze
380
397
  }),
381
- /* @__PURE__ */ n("div", {
382
- className: Ie,
398
+ /* @__PURE__ */ i("div", {
399
+ className: J,
383
400
  children: [
384
- /* @__PURE__ */ e(Be, {
401
+ /* @__PURE__ */ e(Re, {
385
402
  value: !1,
386
403
  children: r
387
404
  }),
388
405
  /* @__PURE__ */ e("div", {
389
- className: Ae,
390
- children: /* @__PURE__ */ e(fe, {
406
+ className: Oe,
407
+ children: /* @__PURE__ */ e(Q, {
391
408
  headline: a,
392
- pretitle: i,
393
- pretitleLinesMax: s,
394
- title: p,
395
- titleLinesMax: l,
396
- subtitle: h,
397
- subtitleLinesMax: o,
398
- description: d,
409
+ pretitle: n,
410
+ pretitleLinesMax: l,
411
+ title: o,
412
+ titleLinesMax: c,
413
+ subtitle: u,
414
+ subtitleLinesMax: s,
415
+ description: p,
399
416
  descriptionLinesMax: t,
400
- extra: u,
401
- button: v,
402
- buttonLink: g
417
+ extra: d,
418
+ button: f,
419
+ buttonLink: v
403
420
  })
404
421
  })
405
422
  ]
@@ -408,14 +425,176 @@ const ce = (r, a)=>{
408
425
  }))
409
426
  }),
410
427
  /* @__PURE__ */ e(k, {
411
- onClose: S,
428
+ onClose: b,
429
+ actions: m,
430
+ type: "media"
431
+ })
432
+ ]
433
+ });
434
+ }), wr = /*#__PURE__*/ C.forwardRef((_param, S)=>{
435
+ var { media: r , headline: a , pretitle: n , pretitleLinesMax: l , subtitle: u , subtitleLinesMax: s , title: o , titleLinesMax: c , description: p , descriptionLinesMax: t , extra: d , actions: m , button: f , buttonLink: v , dataAttributes: A , "aria-label": y , onClose: b } = _param, h = _object_without_properties(_param, [
436
+ "media",
437
+ "headline",
438
+ "pretitle",
439
+ "pretitleLinesMax",
440
+ "subtitle",
441
+ "subtitleLinesMax",
442
+ "title",
443
+ "titleLinesMax",
444
+ "description",
445
+ "descriptionLinesMax",
446
+ "extra",
447
+ "actions",
448
+ "button",
449
+ "buttonLink",
450
+ "dataAttributes",
451
+ "aria-label",
452
+ "onClose"
453
+ ]);
454
+ const g = h.href || h.to || h.onPress, B = r && r.type === q && r.props.circular;
455
+ return /* @__PURE__ */ i(H, {
456
+ ref: S,
457
+ dataAttributes: _object_spread({
458
+ "component-name": "NakedCard"
459
+ }, A),
460
+ "aria-label": y,
461
+ className: g ? z : void 0,
462
+ children: [
463
+ /* @__PURE__ */ e(D, _object_spread_props(_object_spread({
464
+ maybe: !0
465
+ }, h), {
466
+ className: O,
467
+ "aria-label": y,
468
+ children: /* @__PURE__ */ i("div", {
469
+ className: J,
470
+ children: [
471
+ /* @__PURE__ */ i("div", {
472
+ style: {
473
+ position: "relative"
474
+ },
475
+ children: [
476
+ g && /* @__PURE__ */ e("div", {
477
+ className: L(ne, {
478
+ [te]: B
479
+ })
480
+ }),
481
+ r
482
+ ]
483
+ }),
484
+ /* @__PURE__ */ e("div", {
485
+ className: se,
486
+ children: /* @__PURE__ */ e(Q, {
487
+ headline: a,
488
+ pretitle: n,
489
+ pretitleLinesMax: l,
490
+ title: o,
491
+ titleLinesMax: c,
492
+ subtitle: u,
493
+ subtitleLinesMax: s,
494
+ description: p,
495
+ descriptionLinesMax: t,
496
+ extra: d,
497
+ button: f,
498
+ buttonLink: v
499
+ })
500
+ })
501
+ ]
502
+ })
503
+ })),
504
+ /* @__PURE__ */ e(k, {
505
+ onClose: b,
412
506
  actions: m,
413
507
  type: "media"
414
508
  })
415
509
  ]
416
510
  });
417
- }), xr = /*#__PURE__*/ T.forwardRef((_param, B)=>{
418
- 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: v , buttonLink: g , dataAttributes: w , "aria-label": C , onClose: S } = _param, c = _object_without_properties(_param, [
511
+ }), Br = /*#__PURE__*/ C.forwardRef((_param, m)=>{
512
+ var { media: r , title: a , titleLinesMax: n , subtitle: l , subtitleLinesMax: u , description: s , descriptionLinesMax: o , extra: c , dataAttributes: p , "aria-label": t } = _param, d = _object_without_properties(_param, [
513
+ "media",
514
+ "title",
515
+ "titleLinesMax",
516
+ "subtitle",
517
+ "subtitleLinesMax",
518
+ "description",
519
+ "descriptionLinesMax",
520
+ "extra",
521
+ "dataAttributes",
522
+ "aria-label"
523
+ ]);
524
+ const f = d.href || d.to || d.onPress, v = r && r.type === q && r.props.circular;
525
+ return /* @__PURE__ */ e(H, {
526
+ ref: m,
527
+ dataAttributes: _object_spread({
528
+ "component-name": "SmallNakedCard"
529
+ }, p),
530
+ "aria-label": t,
531
+ className: f ? z : void 0,
532
+ children: /* @__PURE__ */ e(D, _object_spread_props(_object_spread({
533
+ maybe: !0
534
+ }, d), {
535
+ className: O,
536
+ "aria-label": t,
537
+ children: /* @__PURE__ */ i("div", {
538
+ className: J,
539
+ children: [
540
+ /* @__PURE__ */ i("div", {
541
+ style: {
542
+ position: "relative"
543
+ },
544
+ children: [
545
+ f && /* @__PURE__ */ e("div", {
546
+ className: L(ne, {
547
+ [te]: v
548
+ })
549
+ }),
550
+ r
551
+ ]
552
+ }),
553
+ /* @__PURE__ */ i("div", {
554
+ className: se,
555
+ children: [
556
+ /* @__PURE__ */ i("div", {
557
+ children: [
558
+ /* @__PURE__ */ i(T, {
559
+ space: 8,
560
+ children: [
561
+ a && /* @__PURE__ */ e(x, {
562
+ truncate: n,
563
+ as: "h3",
564
+ regular: !0,
565
+ hyphens: "auto",
566
+ children: a
567
+ }),
568
+ l && /* @__PURE__ */ e(x, {
569
+ truncate: u,
570
+ regular: !0,
571
+ as: "p",
572
+ hyphens: "auto",
573
+ children: l
574
+ })
575
+ ]
576
+ }),
577
+ s && /* @__PURE__ */ e(x, {
578
+ truncate: o,
579
+ regular: !0,
580
+ as: "p",
581
+ color: N.colors.textSecondary,
582
+ hyphens: "auto",
583
+ children: s
584
+ })
585
+ ]
586
+ }),
587
+ c && /* @__PURE__ */ e("div", {
588
+ children: c
589
+ })
590
+ ]
591
+ })
592
+ ]
593
+ })
594
+ }))
595
+ });
596
+ }), Ir = /*#__PURE__*/ C.forwardRef((_param, S)=>{
597
+ var { icon: r , headline: a , pretitle: n , pretitleLinesMax: l , title: u , titleLinesMax: s , subtitle: o , subtitleLinesMax: c , description: p , descriptionLinesMax: t , extra: d , actions: m , button: f , buttonLink: v , dataAttributes: A , "aria-label": y , onClose: b } = _param, h = _object_without_properties(_param, [
419
598
  "icon",
420
599
  "headline",
421
600
  "pretitle",
@@ -434,68 +613,68 @@ const ce = (r, a)=>{
434
613
  "aria-label",
435
614
  "onClose"
436
615
  ]);
437
- const N = !!r, b = c.href || c.to || c.onPress, z = J, H = ce(m, S), R = {
616
+ const g = !!r, B = h.href || h.to || h.onPress, _ = ye(m, b), E = {
438
617
  marginRight: -16,
439
618
  marginTop: -24,
440
- width: he * H.length
619
+ width: ge * _.length
441
620
  };
442
- return /* @__PURE__ */ n(W, {
443
- "aria-label": C,
444
- className: P,
621
+ return /* @__PURE__ */ i(H, {
622
+ dataAttributes: _object_spread({
623
+ "component-name": "DataCard"
624
+ }, A),
625
+ ref: S,
626
+ "aria-label": y,
627
+ className: z,
445
628
  children: [
446
629
  /* @__PURE__ */ e(Z, {
447
- className: _,
448
- dataAttributes: _object_spread({
449
- "component-name": "DataCard"
450
- }, w),
451
- ref: B,
630
+ className: W,
452
631
  width: "100%",
453
632
  height: "100%",
454
- children: /* @__PURE__ */ n(O, _object_spread_props(_object_spread({
633
+ children: /* @__PURE__ */ i(D, _object_spread_props(_object_spread({
455
634
  maybe: !0
456
- }, c), {
457
- className: E,
458
- "aria-label": C,
635
+ }, h), {
636
+ className: O,
637
+ "aria-label": y,
459
638
  children: [
460
- b && /* @__PURE__ */ e("div", {
461
- className: z
639
+ B && /* @__PURE__ */ e("div", {
640
+ className: K
462
641
  }),
463
- /* @__PURE__ */ n("div", {
464
- className: be,
642
+ /* @__PURE__ */ i("div", {
643
+ className: He,
465
644
  children: [
466
- /* @__PURE__ */ n(Ue, {
645
+ /* @__PURE__ */ i(Ze, {
467
646
  space: 0,
468
647
  children: [
469
- /* @__PURE__ */ n(y, {
648
+ /* @__PURE__ */ i(T, {
470
649
  space: 16,
471
650
  children: [
472
- N ? r : null,
473
- /* @__PURE__ */ e(fe, {
651
+ g ? r : null,
652
+ /* @__PURE__ */ e(Q, {
474
653
  headline: a,
475
- pretitle: i,
476
- pretitleLinesMax: s,
477
- title: h,
478
- titleLinesMax: o,
479
- subtitle: p,
480
- subtitleLinesMax: l,
481
- description: d,
654
+ pretitle: n,
655
+ pretitleLinesMax: l,
656
+ title: u,
657
+ titleLinesMax: s,
658
+ subtitle: o,
659
+ subtitleLinesMax: c,
660
+ description: p,
482
661
  descriptionLinesMax: t
483
662
  })
484
663
  ]
485
664
  }),
486
- !N && /* @__PURE__ */ e("div", {
487
- style: R
665
+ !g && /* @__PURE__ */ e("div", {
666
+ style: E
488
667
  })
489
668
  ]
490
669
  }),
491
- u && /* @__PURE__ */ e("div", {
492
- children: u
670
+ d && /* @__PURE__ */ e("div", {
671
+ children: d
493
672
  }),
494
- (v || g) && /* @__PURE__ */ e("div", {
495
- className: ee,
496
- children: /* @__PURE__ */ e(q, {
497
- primaryButton: v,
498
- link: g
673
+ (f || v) && /* @__PURE__ */ e("div", {
674
+ className: le,
675
+ children: /* @__PURE__ */ e($, {
676
+ primaryButton: f,
677
+ link: v
499
678
  })
500
679
  })
501
680
  ]
@@ -504,14 +683,14 @@ const ce = (r, a)=>{
504
683
  }))
505
684
  }),
506
685
  /* @__PURE__ */ e(k, {
507
- onClose: S,
686
+ onClose: b,
508
687
  actions: m,
509
688
  type: "default"
510
689
  })
511
690
  ]
512
691
  });
513
- }), wr = /*#__PURE__*/ T.forwardRef((_param, u)=>{
514
- 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, [
692
+ }), Rr = /*#__PURE__*/ C.forwardRef((_param, d)=>{
693
+ var { icon: r , title: a , titleLinesMax: n , subtitle: l , subtitleLinesMax: u , dataAttributes: s , "aria-label": o , extra: c , isInverse: p = !1 } = _param, t = _object_without_properties(_param, [
515
694
  "icon",
516
695
  "title",
517
696
  "titleLinesMax",
@@ -522,60 +701,60 @@ const ce = (r, a)=>{
522
701
  "extra",
523
702
  "isInverse"
524
703
  ]);
525
- const m = t.href || t.to || t.onPress, v = d ? te : J;
526
- return /* @__PURE__ */ e(W, {
527
- className: P,
704
+ const m = t.href || t.to || t.onPress, f = p ? ue : K;
705
+ return /* @__PURE__ */ e(H, {
706
+ dataAttributes: _object_spread({
707
+ "component-name": "SnapCard"
708
+ }, s),
709
+ ref: d,
710
+ className: z,
528
711
  children: /* @__PURE__ */ e(Z, {
529
- className: _,
530
- dataAttributes: _object_spread({
531
- "component-name": "SnapCard"
532
- }, o),
533
- ref: u,
534
- isInverse: d,
712
+ className: W,
713
+ isInverse: p,
535
714
  width: "100%",
536
715
  height: "100%",
537
- children: /* @__PURE__ */ n(O, _object_spread_props(_object_spread({
716
+ children: /* @__PURE__ */ i(D, _object_spread_props(_object_spread({
538
717
  maybe: !0
539
718
  }, t), {
540
- className: E,
541
- "aria-label": p,
719
+ className: O,
720
+ "aria-label": o,
542
721
  children: [
543
722
  m && /* @__PURE__ */ e("div", {
544
- className: v
723
+ className: f
545
724
  }),
546
- /* @__PURE__ */ n("section", {
547
- className: Re,
725
+ /* @__PURE__ */ i("section", {
726
+ className: _e,
548
727
  children: [
549
- /* @__PURE__ */ n("div", {
728
+ /* @__PURE__ */ i("div", {
550
729
  children: [
551
- r && /* @__PURE__ */ e(D, {
730
+ r && /* @__PURE__ */ e(M, {
552
731
  paddingBottom: 16,
553
732
  children: r
554
733
  }),
555
- /* @__PURE__ */ n(y, {
734
+ /* @__PURE__ */ i(T, {
556
735
  space: 4,
557
736
  children: [
558
- a && /* @__PURE__ */ e(A, {
559
- truncate: i,
737
+ a && /* @__PURE__ */ e(x, {
738
+ truncate: n,
560
739
  as: "h3",
561
740
  regular: !0,
562
741
  hyphens: "auto",
563
742
  children: a
564
743
  }),
565
- s && /* @__PURE__ */ e(A, {
566
- truncate: h,
744
+ l && /* @__PURE__ */ e(x, {
745
+ truncate: u,
567
746
  regular: !0,
568
- color: f.colors.textSecondary,
747
+ color: N.colors.textSecondary,
569
748
  as: "p",
570
749
  hyphens: "auto",
571
- children: s
750
+ children: l
572
751
  })
573
752
  ]
574
753
  })
575
754
  ]
576
755
  }),
577
- l && /* @__PURE__ */ e("div", {
578
- children: l
756
+ c && /* @__PURE__ */ e("div", {
757
+ children: c
579
758
  })
580
759
  ]
581
760
  })
@@ -583,8 +762,8 @@ const ce = (r, a)=>{
583
762
  }))
584
763
  })
585
764
  });
586
- }), Ke = 264, ve = /*#__PURE__*/ T.forwardRef((_param, G)=>{
587
- 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: v , extra: g , button: w , secondaryButton: C , onClose: S , actions: c , buttonLink: B , dataAttributes: N , width: b , height: z , aspectRatio: H , "aria-label": R } = _param, M = _object_without_properties(_param, [
765
+ }), Qe = 264, Te = /*#__PURE__*/ C.forwardRef((_param, w)=>{
766
+ var { isInverse: r , backgroundImage: a , backgroundVideo: n , backgroundVideoRef: l , poster: u , icon: s , headline: o , pretitle: c , pretitleLinesMax: p , title: t , titleLinesMax: d , description: m , descriptionLinesMax: f , extra: v , button: A , secondaryButton: y , onClose: b , actions: h , buttonLink: S , dataAttributes: g , width: B , height: _ , aspectRatio: E , "aria-label": G } = _param, I = _object_without_properties(_param, [
588
767
  "isInverse",
589
768
  "backgroundImage",
590
769
  "backgroundVideo",
@@ -610,100 +789,92 @@ const ce = (r, a)=>{
610
789
  "aspectRatio",
611
790
  "aria-label"
612
791
  ]);
613
- const I = me(a), { video: X , videoStatus: j , onVideoControlPress: U } = ue(i, h, s);
614
- i && (c = [
615
- {
616
- Icon: pe(j),
617
- onPress: U,
618
- label: "Video controls",
619
- iconSize: j === "loadingTimeout" ? 16 : 12,
620
- iconColor: f.colors.inverse,
621
- iconBackground: V,
622
- iconBackgroundInverse: V
623
- }
792
+ const X = Ne(a), { video: P , videoAction: U } = Ce(n, u, l);
793
+ n && (h = [
794
+ U
624
795
  ]);
625
- const F = le(), x = !!a || !!i, Y = x ? "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 ? se : r ? te : J;
626
- return /* @__PURE__ */ n(W, {
627
- width: b,
628
- height: z,
629
- aspectRatio: H,
630
- "aria-label": R,
631
- minWidth: Ke,
632
- className: P,
796
+ const j = fe(), R = !!a || !!n, Y = R ? "0 0 16px rgba(0,0,0,0.4)" : void 0, be = (h == null ? void 0 : h.length) || b, xe = I.href || I.to || I.onPress, Ae = a || n ? me : r ? ue : K;
797
+ return /* @__PURE__ */ i(H, {
798
+ dataAttributes: g,
799
+ ref: w,
800
+ width: B,
801
+ height: _,
802
+ aspectRatio: E,
803
+ "aria-label": G,
804
+ minWidth: Qe,
805
+ className: z,
633
806
  children: [
634
- /* @__PURE__ */ e(L, {
635
- borderRadius: f.borderRadii.legacyDisplay,
636
- className: _,
637
- dataAttributes: N,
638
- ref: G,
807
+ /* @__PURE__ */ e(ie, {
808
+ borderRadius: N.borderRadii.legacyDisplay,
809
+ className: W,
639
810
  width: "100%",
640
811
  minHeight: "100%",
641
812
  isInverse: r,
642
- background: a || i ? F ? f.colors.backgroundContainerBrandOverInverse : f.colors.backgroundContainer : void 0,
643
- children: /* @__PURE__ */ n(O, _object_spread_props(_object_spread({
813
+ background: a || n ? j ? N.colors.backgroundContainerBrandOverInverse : N.colors.backgroundContainer : void 0,
814
+ children: /* @__PURE__ */ i(D, _object_spread_props(_object_spread({
644
815
  maybe: !0
645
- }, M), {
646
- className: E,
647
- "aria-label": R,
816
+ }, I), {
817
+ className: O,
818
+ "aria-label": G,
648
819
  children: [
649
- ge && /* @__PURE__ */ e("div", {
650
- className: Ce
820
+ xe && /* @__PURE__ */ e("div", {
821
+ className: Ae
651
822
  }),
652
- /* @__PURE__ */ n("div", {
653
- className: re,
823
+ /* @__PURE__ */ i("div", {
824
+ className: de,
654
825
  children: [
655
- /* @__PURE__ */ e(de, {
656
- isInverse: F,
826
+ /* @__PURE__ */ e(ve, {
827
+ isInverse: j,
657
828
  children: /* @__PURE__ */ e("div", {
658
- className: ae,
659
- children: i ? X : a ? I : void 0
829
+ className: oe,
830
+ children: n ? P : a ? X : void 0
660
831
  })
661
832
  }),
662
- /* @__PURE__ */ n("div", {
663
- className: ie,
833
+ /* @__PURE__ */ i("div", {
834
+ className: ce,
664
835
  style: {
665
- paddingTop: x && !o && !ye ? 0 : 24
836
+ paddingTop: R && !s && !be ? 0 : 24
666
837
  },
667
838
  children: [
668
- o ? /* @__PURE__ */ e(D, {
669
- paddingBottom: x ? 0 : 40,
839
+ s ? /* @__PURE__ */ e(M, {
840
+ paddingBottom: R ? 0 : 40,
670
841
  paddingX: 24,
671
- children: o
672
- }) : /* @__PURE__ */ e(D, {
673
- paddingBottom: c != null && c.length || S ? x ? 24 : 64 : 0
842
+ children: s
843
+ }) : /* @__PURE__ */ e(M, {
844
+ paddingBottom: h != null && h.length || b ? R ? 24 : 64 : 0
674
845
  }),
675
- /* @__PURE__ */ e(D, {
846
+ /* @__PURE__ */ e(M, {
676
847
  paddingX: 24,
677
- paddingTop: x ? 40 : 0,
848
+ paddingTop: R ? 40 : 0,
678
849
  paddingBottom: 24,
679
- className: x ? ne : void 0,
680
- children: /* @__PURE__ */ n(y, {
850
+ className: R ? he : void 0,
851
+ children: /* @__PURE__ */ i(T, {
681
852
  space: 24,
682
853
  children: [
683
- /* @__PURE__ */ n("div", {
854
+ /* @__PURE__ */ i("div", {
684
855
  children: [
685
- /* @__PURE__ */ n(y, {
856
+ /* @__PURE__ */ i(T, {
686
857
  space: 8,
687
858
  children: [
688
- (p || l || t) && /* @__PURE__ */ e("header", {
689
- children: /* @__PURE__ */ n(y, {
859
+ (o || c || t) && /* @__PURE__ */ e("header", {
860
+ children: /* @__PURE__ */ i(T, {
690
861
  space: 16,
691
862
  children: [
692
- p,
693
- /* @__PURE__ */ n(y, {
863
+ o,
864
+ /* @__PURE__ */ i(T, {
694
865
  space: 4,
695
866
  children: [
696
- l && /* @__PURE__ */ e(A, {
867
+ c && /* @__PURE__ */ e(x, {
697
868
  forceMobileSizes: !0,
698
- truncate: d,
869
+ truncate: p,
699
870
  as: "div",
700
871
  regular: !0,
701
872
  textShadow: Y,
702
- children: l
873
+ children: c
703
874
  }),
704
- /* @__PURE__ */ e(Se, {
875
+ /* @__PURE__ */ e(Be, {
705
876
  forceMobileSizes: !0,
706
- truncate: u,
877
+ truncate: d,
707
878
  as: "h3",
708
879
  textShadow: Y,
709
880
  hyphens: "auto",
@@ -714,25 +885,25 @@ const ce = (r, a)=>{
714
885
  ]
715
886
  })
716
887
  }),
717
- m && /* @__PURE__ */ e(xe, {
888
+ m && /* @__PURE__ */ e(Ie, {
718
889
  forceMobileSizes: !0,
719
- truncate: v,
890
+ truncate: f,
720
891
  as: "p",
721
892
  regular: !0,
722
- color: x ? f.colors.textPrimary : f.colors.textSecondary,
893
+ color: R ? N.colors.textPrimary : N.colors.textSecondary,
723
894
  textShadow: Y,
724
895
  hyphens: "auto",
725
896
  children: m
726
897
  })
727
898
  ]
728
899
  }),
729
- g
900
+ v
730
901
  ]
731
902
  }),
732
- (w || C || B) && /* @__PURE__ */ e(q, {
733
- primaryButton: w,
734
- secondaryButton: C,
735
- link: B
903
+ (A || y || S) && /* @__PURE__ */ e($, {
904
+ primaryButton: A,
905
+ secondaryButton: y,
906
+ link: S
736
907
  })
737
908
  ]
738
909
  })
@@ -745,35 +916,35 @@ const ce = (r, a)=>{
745
916
  }))
746
917
  }),
747
918
  /* @__PURE__ */ e(k, {
748
- onClose: S,
749
- actions: c,
750
- type: a || i ? "media" : r ? "inverse" : "default"
919
+ onClose: b,
920
+ actions: h,
921
+ type: a || n ? "media" : r ? "inverse" : "default"
751
922
  })
752
923
  ]
753
924
  });
754
- }), Br = /*#__PURE__*/ T.forwardRef((_param, i)=>/* @__PURE__ */ {
925
+ }), Mr = /*#__PURE__*/ C.forwardRef((_param, n)=>/* @__PURE__ */ {
755
926
  var { dataAttributes: r } = _param, a = _object_without_properties(_param, [
756
927
  "dataAttributes"
757
928
  ]);
758
- return e(ve, _object_spread_props(_object_spread({}, a), {
759
- ref: i,
929
+ return e(Te, _object_spread_props(_object_spread({}, a), {
930
+ ref: n,
760
931
  isInverse: !0,
761
932
  dataAttributes: _object_spread_props(_object_spread({}, r), {
762
933
  "component-name": "DisplayMediaCard"
763
934
  })
764
935
  }));
765
- }), Ir = /*#__PURE__*/ T.forwardRef((_param, i)=>/* @__PURE__ */ {
936
+ }), Dr = /*#__PURE__*/ C.forwardRef((_param, n)=>/* @__PURE__ */ {
766
937
  var { dataAttributes: r } = _param, a = _object_without_properties(_param, [
767
938
  "dataAttributes"
768
939
  ]);
769
- return e(ve, _object_spread_props(_object_spread({}, a), {
770
- ref: i,
940
+ return e(Te, _object_spread_props(_object_spread({}, a), {
941
+ ref: n,
771
942
  dataAttributes: _object_spread_props(_object_spread({}, r), {
772
943
  "component-name": "DisplayDataCard"
773
944
  })
774
945
  }));
775
- }), Qe = 140, Ar = /*#__PURE__*/ T.forwardRef((_param, b)=>{
776
- 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: v , pretitle: g , pretitleLinesMax: w , title: C , titleLinesMax: S , description: c , descriptionLinesMax: B } = _param, N = _object_without_properties(_param, [
946
+ }), Ve = 140, zr = /*#__PURE__*/ C.forwardRef((_param, B)=>{
947
+ var { dataAttributes: r , backgroundImage: a , backgroundVideo: n , poster: l , backgroundVideoRef: u , width: s , height: o , aspectRatio: c = "7:10" , ariaLabel: p , actions: t , onClose: d , icon: m , headline: f , pretitle: v , pretitleLinesMax: A , title: y , titleLinesMax: b , description: h , descriptionLinesMax: S } = _param, g = _object_without_properties(_param, [
777
948
  "dataAttributes",
778
949
  "backgroundImage",
779
950
  "backgroundVideo",
@@ -794,120 +965,114 @@ const ce = (r, a)=>{
794
965
  "description",
795
966
  "descriptionLinesMax"
796
967
  ]);
797
- const z = me(a), { video: H , videoStatus: R , onVideoControlPress: M } = ue(i, s, h);
798
- i && (t = [
799
- {
800
- Icon: pe(R),
801
- onPress: M,
802
- label: "Video controls",
803
- iconSize: R === "loadingTimeout" ? 16 : 12,
804
- iconColor: f.colors.inverse,
805
- iconBackground: V,
806
- iconBackgroundInverse: V
807
- }
968
+ const _ = Ne(a), { video: E , videoAction: G } = Ce(n, l, u);
969
+ n && (t = [
970
+ G
808
971
  ]);
809
- const G = le(), I = !!a || !!i, X = I ? "0 0 16px rgba(0,0,0,0.4)" : void 0, j = (t == null ? void 0 : t.length) || u, { textPresets: U } = K(), F = N.href || N.to || N.onPress, x = se;
810
- return /* @__PURE__ */ n(W, {
811
- width: o,
812
- height: p,
813
- minWidth: Qe,
814
- aspectRatio: l,
815
- "aria-label": d,
816
- className: P,
972
+ const I = fe(), w = !!a || !!n, X = w ? "0 0 16px rgba(0,0,0,0.4)" : void 0, P = (t == null ? void 0 : t.length) || d, { textPresets: U } = F(), j = g.href || g.to || g.onPress;
973
+ return /* @__PURE__ */ i(H, {
974
+ width: s,
975
+ height: o,
976
+ dataAttributes: _object_spread_props(_object_spread({}, r), {
977
+ "component-name": "PosterCard"
978
+ }),
979
+ ref: B,
980
+ minWidth: Ve,
981
+ aspectRatio: c,
982
+ "aria-label": p,
983
+ className: z,
817
984
  children: [
818
- /* @__PURE__ */ e(L, {
819
- borderRadius: f.borderRadii.legacyDisplay,
820
- className: _,
821
- dataAttributes: r,
822
- ref: b,
985
+ /* @__PURE__ */ e(ie, {
986
+ borderRadius: N.borderRadii.legacyDisplay,
987
+ className: W,
823
988
  width: "100%",
824
989
  minHeight: "100%",
825
990
  isInverse: !0,
826
- background: a || i ? G ? f.colors.backgroundContainerBrandOverInverse : f.colors.backgroundContainer : void 0,
827
- children: /* @__PURE__ */ n(O, _object_spread_props(_object_spread({
991
+ background: a || n ? I ? N.colors.backgroundContainerBrandOverInverse : N.colors.backgroundContainer : void 0,
992
+ children: /* @__PURE__ */ i(D, _object_spread_props(_object_spread({
828
993
  maybe: !0
829
- }, N), {
830
- className: E,
831
- "aria-label": d,
994
+ }, g), {
995
+ className: O,
996
+ "aria-label": p,
832
997
  children: [
833
- F && /* @__PURE__ */ e("div", {
834
- className: x
998
+ j && /* @__PURE__ */ e("div", {
999
+ className: me
835
1000
  }),
836
- /* @__PURE__ */ n("div", {
837
- className: re,
1001
+ /* @__PURE__ */ i("div", {
1002
+ className: de,
838
1003
  children: [
839
- /* @__PURE__ */ e(de, {
840
- isInverse: G,
1004
+ /* @__PURE__ */ e(ve, {
1005
+ isInverse: I,
841
1006
  children: /* @__PURE__ */ e("div", {
842
- className: ae,
843
- children: i ? H : a ? z : void 0
1007
+ className: oe,
1008
+ children: n ? E : a ? _ : void 0
844
1009
  })
845
1010
  }),
846
- /* @__PURE__ */ n("div", {
847
- className: ie,
1011
+ /* @__PURE__ */ i("div", {
1012
+ className: ce,
848
1013
  style: {
849
- paddingTop: I && !m && !j ? 0 : 24
1014
+ paddingTop: w && !m && !P ? 0 : 24
850
1015
  },
851
1016
  children: [
852
- m ? /* @__PURE__ */ e(D, {
853
- paddingBottom: I ? 0 : 40,
1017
+ m ? /* @__PURE__ */ e(M, {
1018
+ paddingBottom: w ? 0 : 40,
854
1019
  paddingX: 24,
855
1020
  children: m
856
- }) : /* @__PURE__ */ e(D, {
857
- paddingBottom: t != null && t.length || u ? I ? 24 : 64 : 0
1021
+ }) : /* @__PURE__ */ e(M, {
1022
+ paddingBottom: t != null && t.length || d ? w ? 24 : 64 : 0
858
1023
  }),
859
- /* @__PURE__ */ e(D, {
1024
+ /* @__PURE__ */ e(M, {
860
1025
  paddingX: 16,
861
- paddingTop: I ? 40 : 0,
1026
+ paddingTop: w ? 40 : 0,
862
1027
  paddingBottom: 24,
863
- className: I ? ne : void 0,
864
- children: /* @__PURE__ */ e(y, {
1028
+ className: w ? he : void 0,
1029
+ children: /* @__PURE__ */ e(T, {
865
1030
  space: 24,
866
1031
  children: /* @__PURE__ */ e("div", {
867
- children: /* @__PURE__ */ n(y, {
1032
+ children: /* @__PURE__ */ i(T, {
868
1033
  space: 8,
869
1034
  children: [
870
- (v || g || C) && /* @__PURE__ */ e("header", {
871
- children: /* @__PURE__ */ n(y, {
1035
+ (f || v || y) && /* @__PURE__ */ e("header", {
1036
+ children: /* @__PURE__ */ i(T, {
872
1037
  space: 16,
873
1038
  children: [
874
- v,
875
- /* @__PURE__ */ n(y, {
1039
+ f,
1040
+ /* @__PURE__ */ i(T, {
876
1041
  space: 4,
877
1042
  children: [
878
- g && /* @__PURE__ */ e(A, {
1043
+ v && /* @__PURE__ */ e(x, {
879
1044
  forceMobileSizes: !0,
880
- truncate: w,
1045
+ truncate: A,
881
1046
  as: "div",
882
1047
  regular: !0,
883
1048
  textShadow: X,
884
1049
  hyphens: "auto",
885
- children: g
1050
+ children: v
886
1051
  }),
887
- /* @__PURE__ */ e($, {
1052
+ /* @__PURE__ */ e(ae, {
888
1053
  desktopSize: 20,
889
1054
  mobileSize: 18,
890
1055
  mobileLineHeight: "24px",
891
1056
  desktopLineHeight: "28px",
892
- truncate: S,
1057
+ truncate: b,
893
1058
  weight: U.cardTitle.weight,
894
1059
  as: "h3",
895
1060
  hyphens: "auto",
896
- children: C
1061
+ children: y
897
1062
  })
898
1063
  ]
899
1064
  })
900
1065
  ]
901
1066
  })
902
1067
  }),
903
- c && /* @__PURE__ */ e(A, {
1068
+ h && /* @__PURE__ */ e(x, {
904
1069
  forceMobileSizes: !0,
905
- truncate: B,
1070
+ truncate: S,
906
1071
  as: "p",
907
1072
  regular: !0,
908
1073
  textShadow: X,
909
1074
  hyphens: "auto",
910
- children: c
1075
+ children: h
911
1076
  })
912
1077
  ]
913
1078
  })
@@ -922,11 +1087,11 @@ const ce = (r, a)=>{
922
1087
  }))
923
1088
  }),
924
1089
  /* @__PURE__ */ e(k, {
925
- onClose: u,
1090
+ onClose: d,
926
1091
  actions: t,
927
1092
  type: "media"
928
1093
  })
929
1094
  ]
930
1095
  });
931
1096
  });
932
- export { xr as DataCard, Ir as DisplayDataCard, Br as DisplayMediaCard, Sr as MediaCard, Ar as PosterCard, wr as SnapCard };
1097
+ export { k as CardActionsGroup, Ir as DataCard, Dr as DisplayDataCard, Mr as DisplayMediaCard, Sr as MediaCard, wr as NakedCard, zr as PosterCard, Br as SmallNakedCard, Rr as SnapCard };