@telefonica/mistica 16.4.0 → 16.6.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/css/vivo-new.css +11 -11
- package/dist/accordion.css-mistica.js +16 -13
- package/dist/accordion.css.d.ts +1 -0
- package/dist/accordion.d.ts +4 -0
- package/dist/accordion.js +110 -93
- package/dist/callout.js +27 -15
- package/dist/card.css-mistica.js +5 -5
- package/dist/card.d.ts +9 -1
- package/dist/card.js +611 -475
- package/dist/community/advanced-data-card.css-mistica.js +14 -11
- package/dist/community/advanced-data-card.css.d.ts +1 -0
- package/dist/community/advanced-data-card.d.ts +1 -1
- package/dist/community/advanced-data-card.js +172 -85
- package/dist/cover-hero.css-mistica.js +14 -11
- package/dist/cover-hero.css.d.ts +1 -0
- package/dist/cover-hero.d.ts +1 -0
- package/dist/cover-hero.js +101 -59
- package/dist/empty-state.js +24 -15
- package/dist/header.css-mistica.js +6 -3
- package/dist/header.css.d.ts +1 -0
- package/dist/header.d.ts +3 -2
- package/dist/header.js +148 -79
- package/dist/hero.css-mistica.js +11 -8
- package/dist/hero.css.d.ts +1 -0
- package/dist/hero.d.ts +2 -1
- package/dist/hero.js +102 -68
- package/dist/highlighted-card.js +32 -23
- package/dist/index.d.ts +1 -0
- package/dist/index.js +4 -0
- package/dist/maybe-dismissable.js +8 -5
- package/dist/meter.d.ts +23 -0
- package/dist/meter.js +400 -0
- package/dist/mosaic.d.ts +6 -2
- package/dist/mosaic.js +50 -48
- package/dist/navigation-bar.css-mistica.js +96 -37
- package/dist/navigation-bar.css.d.ts +27 -1
- package/dist/navigation-bar.d.ts +65 -30
- package/dist/navigation-bar.js +818 -193
- package/dist/package-version.js +1 -1
- package/dist/sheet-common.css-mistica.js +16 -10
- package/dist/sheet-common.css.d.ts +3 -1
- package/dist/sheet-common.js +78 -70
- package/dist/sheet-info.css-mistica.js +15 -4
- package/dist/sheet-info.css.d.ts +2 -0
- package/dist/sheet-info.d.ts +3 -0
- package/dist/sheet-info.js +61 -43
- package/dist/sheet-native.js +59 -48
- package/dist/sheet-types.d.ts +6 -1
- package/dist/sheet-web.js +6 -4
- package/dist/skins/blau.js +94 -94
- package/dist/skins/movistar.js +94 -94
- package/dist/skins/o2-new.js +94 -94
- package/dist/skins/o2.js +94 -94
- package/dist/skins/telefonica.js +94 -94
- package/dist/skins/tu.js +94 -94
- package/dist/skins/vivo-new.js +98 -98
- package/dist/skins/vivo.js +94 -94
- package/dist/text-tokens.d.ts +14 -0
- package/dist/text-tokens.js +134 -102
- package/dist/theme-context-provider.js +60 -50
- package/dist/theme.d.ts +3 -2
- package/dist/theme.js +20 -17
- package/dist/utils/headings.d.ts +2 -0
- package/dist/utils/headings.js +11 -0
- package/dist/utils/types.d.ts +1 -0
- package/dist-es/accordion.css-mistica.js +7 -7
- package/dist-es/accordion.js +140 -123
- package/dist-es/callout.js +55 -43
- package/dist-es/card.css-mistica.js +2 -2
- package/dist-es/card.js +721 -588
- package/dist-es/community/advanced-data-card.css-mistica.js +3 -3
- package/dist-es/community/advanced-data-card.js +217 -130
- package/dist-es/cover-hero.css-mistica.js +3 -3
- package/dist-es/cover-hero.js +132 -90
- package/dist-es/empty-state.js +40 -31
- package/dist-es/header.css-mistica.js +2 -2
- package/dist-es/header.js +174 -104
- package/dist-es/hero.css-mistica.js +2 -2
- package/dist-es/hero.js +150 -115
- package/dist-es/highlighted-card.js +36 -27
- package/dist-es/index.js +1839 -1838
- package/dist-es/maybe-dismissable.js +17 -14
- package/dist-es/meter.js +346 -0
- package/dist-es/mosaic.js +73 -71
- package/dist-es/navigation-bar.css-mistica.js +14 -15
- package/dist-es/navigation-bar.js +864 -240
- package/dist-es/package-version.js +1 -1
- package/dist-es/sheet-common.css-mistica.js +2 -2
- package/dist-es/sheet-common.js +124 -116
- package/dist-es/sheet-info.css-mistica.js +2 -2
- package/dist-es/sheet-info.js +74 -56
- package/dist-es/sheet-native.js +59 -48
- package/dist-es/sheet-web.js +10 -8
- package/dist-es/skins/blau.js +94 -94
- package/dist-es/skins/movistar.js +94 -94
- package/dist-es/skins/o2-new.js +94 -94
- package/dist-es/skins/o2.js +94 -94
- package/dist-es/skins/telefonica.js +94 -94
- package/dist-es/skins/tu.js +94 -94
- package/dist-es/skins/vivo-new.js +98 -98
- package/dist-es/skins/vivo.js +94 -94
- package/dist-es/style.css +1 -1
- package/dist-es/text-tokens.js +72 -52
- package/dist-es/theme-context-provider.js +88 -78
- package/dist-es/theme.js +20 -20
- package/dist-es/utils/headings.js +2 -0
- package/package.json +2 -1
package/dist-es/accordion.js
CHANGED
|
@@ -78,213 +78,230 @@ function _object_without_properties_loose(source, excluded) {
|
|
|
78
78
|
}
|
|
79
79
|
return target;
|
|
80
80
|
}
|
|
81
|
-
import { jsxs as
|
|
82
|
-
import * as
|
|
83
|
-
import { Content as
|
|
84
|
-
import
|
|
85
|
-
import
|
|
86
|
-
import { itemContent as
|
|
87
|
-
import
|
|
88
|
-
import { BaseTouchable as
|
|
89
|
-
import
|
|
90
|
-
import { vars as
|
|
91
|
-
import { getPrefixedDataAttributes as
|
|
92
|
-
import
|
|
93
|
-
import { Boxed as
|
|
94
|
-
import { useIsInverseOrMediaVariant as
|
|
95
|
-
import { CSSTransition as
|
|
96
|
-
import { isRunningAcceptanceTest as
|
|
97
|
-
|
|
81
|
+
import { jsxs as A, jsx as o } from "react/jsx-runtime";
|
|
82
|
+
import * as i from "react";
|
|
83
|
+
import { Content as T } from "./list.js";
|
|
84
|
+
import w from "./icons/icon-chevron.js";
|
|
85
|
+
import v from "./box.js";
|
|
86
|
+
import { itemContent as D, touchableBackgroundInverse as P, touchableBackground as V, rightContentContainer as E, chevronContainer as _, panelTransitionClasses as k, panelContainer as L, panel as M, accordionItem as X } from "./accordion.css-mistica.js";
|
|
87
|
+
import j from "./stack.js";
|
|
88
|
+
import { BaseTouchable as q } from "./touchable.js";
|
|
89
|
+
import z from "classnames";
|
|
90
|
+
import { vars as g } from "./skins/skin-contract.css-mistica.js";
|
|
91
|
+
import { getPrefixedDataAttributes as B } from "./utils/dom.js";
|
|
92
|
+
import F from "./divider.js";
|
|
93
|
+
import { Boxed as H } from "./boxed.js";
|
|
94
|
+
import { useIsInverseOrMediaVariant as U } from "./theme-variant-context.js";
|
|
95
|
+
import { CSSTransition as G } from "react-transition-group";
|
|
96
|
+
import { isRunningAcceptanceTest as J } from "./utils/platform.js";
|
|
97
|
+
import K from "./inline.js";
|
|
98
|
+
const R = 400, C = /*#__PURE__*/ i.createContext({
|
|
98
99
|
index: [],
|
|
99
100
|
toggle: ()=>{}
|
|
100
|
-
}),
|
|
101
|
-
let { value:
|
|
102
|
-
const
|
|
101
|
+
}), Q = ()=>i.useContext(C), N = (param)=>{
|
|
102
|
+
let { value: n, defaultValue: r, onChange: t, singleOpen: c } = param;
|
|
103
|
+
const d = n !== void 0, s = (e)=>e === void 0 ? [] : typeof e == "number" ? [
|
|
103
104
|
e
|
|
104
|
-
] : e, [
|
|
105
|
-
|
|
106
|
-
if (
|
|
105
|
+
] : e, [a, u] = i.useState(s(r));
|
|
106
|
+
i.useEffect(()=>{
|
|
107
|
+
if (a.length > 1 && c) {
|
|
107
108
|
const e = [
|
|
108
|
-
...
|
|
109
|
+
...a
|
|
109
110
|
];
|
|
110
|
-
e.splice(1),
|
|
111
|
+
e.splice(1), u(e);
|
|
111
112
|
}
|
|
112
113
|
}, [
|
|
113
|
-
|
|
114
|
-
|
|
114
|
+
c,
|
|
115
|
+
a
|
|
115
116
|
]);
|
|
116
|
-
const
|
|
117
|
+
const m = (e, l)=>{
|
|
117
118
|
if (!l) return [
|
|
118
119
|
e
|
|
119
120
|
];
|
|
120
|
-
const
|
|
121
|
+
const p = l.indexOf(e);
|
|
121
122
|
let I = [
|
|
122
123
|
...l
|
|
123
124
|
];
|
|
124
|
-
return
|
|
125
|
+
return p === -1 ? c ? I = [
|
|
125
126
|
e
|
|
126
|
-
] : I.push(e) : I.splice(
|
|
127
|
+
] : I.push(e) : I.splice(p, 1), I;
|
|
127
128
|
}, f = (e)=>{
|
|
128
|
-
if (
|
|
129
|
-
const l = (
|
|
130
|
-
|
|
129
|
+
if (d || u(m(e, a)), t) {
|
|
130
|
+
const l = (d ? s(n) : a).includes(e);
|
|
131
|
+
t(e, !l);
|
|
131
132
|
}
|
|
132
133
|
};
|
|
133
|
-
return
|
|
134
|
-
s(
|
|
134
|
+
return d ? [
|
|
135
|
+
s(n),
|
|
135
136
|
f
|
|
136
137
|
] : [
|
|
137
|
-
|
|
138
|
+
a,
|
|
138
139
|
f
|
|
139
140
|
];
|
|
140
|
-
},
|
|
141
|
-
const r =
|
|
142
|
-
if (r) return Array.from(r.querySelectorAll("[data-accordion-item]")).filter((
|
|
143
|
-
},
|
|
144
|
-
var { content:
|
|
141
|
+
}, W = (n)=>{
|
|
142
|
+
const r = n == null ? void 0 : n.closest("[data-accordion]");
|
|
143
|
+
if (r) return Array.from(r.querySelectorAll("[data-accordion-item]")).filter((t)=>t.closest("[data-accordion]") === r).findIndex((t)=>t === n);
|
|
144
|
+
}, S = /*#__PURE__*/ i.forwardRef((_param, u)=>{
|
|
145
|
+
var { content: n, dataAttributes: r, trackingEvent: t, right: c, "aria-label": d, "aria-labelledby": s } = _param, a = _object_without_properties(_param, [
|
|
145
146
|
"content",
|
|
146
147
|
"dataAttributes",
|
|
147
|
-
"trackingEvent"
|
|
148
|
+
"trackingEvent",
|
|
149
|
+
"right",
|
|
150
|
+
"aria-label",
|
|
151
|
+
"aria-labelledby"
|
|
148
152
|
]);
|
|
149
|
-
const
|
|
150
|
-
return
|
|
151
|
-
|
|
152
|
-
}, []), /* @__PURE__ */
|
|
153
|
-
ref:
|
|
154
|
-
},
|
|
153
|
+
const m = i.useRef(null), f = i.useRef(null), { index: e, toggle: l } = Q(), p = U(), I = i.useId(), b = i.useId(), [x, y] = i.useState(), h = x !== void 0 && (e == null ? void 0 : e.includes(x));
|
|
154
|
+
return i.useEffect(()=>{
|
|
155
|
+
y(W(f.current));
|
|
156
|
+
}, []), /* @__PURE__ */ A("div", _object_spread_props(_object_spread({
|
|
157
|
+
ref: f
|
|
158
|
+
}, B(_object_spread_props(_object_spread({}, r), {
|
|
155
159
|
"accordion-item": !0
|
|
156
160
|
}))), {
|
|
157
161
|
children: [
|
|
158
|
-
/* @__PURE__ */ o(
|
|
159
|
-
ref:
|
|
160
|
-
className:
|
|
162
|
+
/* @__PURE__ */ o(q, {
|
|
163
|
+
ref: u,
|
|
164
|
+
className: z(D, p ? P : V),
|
|
161
165
|
onPress: ()=>{
|
|
162
|
-
|
|
166
|
+
x !== void 0 && l(x);
|
|
163
167
|
},
|
|
164
|
-
trackingEvent:
|
|
165
|
-
"aria-expanded":
|
|
166
|
-
"aria-controls":
|
|
167
|
-
|
|
168
|
+
trackingEvent: t,
|
|
169
|
+
"aria-expanded": h,
|
|
170
|
+
"aria-controls": b,
|
|
171
|
+
"aria-label": d,
|
|
172
|
+
"aria-labelledby": s,
|
|
173
|
+
children: /* @__PURE__ */ o(v, {
|
|
168
174
|
paddingX: 16,
|
|
169
|
-
children: /* @__PURE__ */ o(
|
|
170
|
-
labelId:
|
|
171
|
-
},
|
|
172
|
-
right:
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
175
|
+
children: /* @__PURE__ */ o(T, _object_spread_props(_object_spread({
|
|
176
|
+
labelId: I
|
|
177
|
+
}, a), {
|
|
178
|
+
right: (param)=>{
|
|
179
|
+
let { centerY: O } = param;
|
|
180
|
+
return /* @__PURE__ */ A(K, {
|
|
181
|
+
space: 4,
|
|
182
|
+
alignItems: O ? "center" : void 0,
|
|
183
|
+
className: E,
|
|
184
|
+
children: [
|
|
185
|
+
c,
|
|
186
|
+
/* @__PURE__ */ o("div", {
|
|
187
|
+
className: _,
|
|
188
|
+
children: /* @__PURE__ */ o(w, {
|
|
189
|
+
size: 24,
|
|
190
|
+
transitionDuration: R,
|
|
191
|
+
direction: h ? "up" : "down",
|
|
192
|
+
color: p ? g.colors.inverse : h ? g.colors.neutralHigh : g.colors.neutralMedium
|
|
193
|
+
})
|
|
194
|
+
})
|
|
195
|
+
]
|
|
196
|
+
});
|
|
197
|
+
}
|
|
181
198
|
}))
|
|
182
199
|
})
|
|
183
200
|
}),
|
|
184
|
-
/* @__PURE__ */ o(
|
|
185
|
-
in:
|
|
186
|
-
timeout:
|
|
187
|
-
nodeRef:
|
|
188
|
-
classNames:
|
|
201
|
+
/* @__PURE__ */ o(G, {
|
|
202
|
+
in: h,
|
|
203
|
+
timeout: J() ? 0 : R,
|
|
204
|
+
nodeRef: m,
|
|
205
|
+
classNames: k,
|
|
189
206
|
mountOnEnter: !0,
|
|
190
207
|
unmountOnExit: !0,
|
|
191
208
|
children: /* @__PURE__ */ o("div", {
|
|
192
|
-
className:
|
|
193
|
-
ref:
|
|
209
|
+
className: L,
|
|
210
|
+
ref: m,
|
|
194
211
|
children: /* @__PURE__ */ o("div", {
|
|
195
|
-
className:
|
|
212
|
+
className: M,
|
|
196
213
|
role: "region",
|
|
197
|
-
"aria-labelledby":
|
|
198
|
-
id:
|
|
199
|
-
children: /* @__PURE__ */ o(
|
|
214
|
+
"aria-labelledby": I,
|
|
215
|
+
id: b,
|
|
216
|
+
children: /* @__PURE__ */ o(v, {
|
|
200
217
|
paddingX: 16,
|
|
201
218
|
paddingBottom: 16,
|
|
202
|
-
children:
|
|
219
|
+
children: n
|
|
203
220
|
})
|
|
204
221
|
})
|
|
205
222
|
})
|
|
206
223
|
})
|
|
207
224
|
]
|
|
208
225
|
}));
|
|
209
|
-
}),
|
|
210
|
-
var { dataAttributes:
|
|
226
|
+
}), fe = /*#__PURE__*/ i.forwardRef((_param, c)=>{
|
|
227
|
+
var { dataAttributes: n, role: r } = _param, t = _object_without_properties(_param, [
|
|
211
228
|
"dataAttributes",
|
|
212
229
|
"role"
|
|
213
230
|
]);
|
|
214
231
|
return /* @__PURE__ */ o("div", {
|
|
215
232
|
role: r,
|
|
216
|
-
className:
|
|
217
|
-
children: /* @__PURE__ */ o(
|
|
218
|
-
ref:
|
|
233
|
+
className: X,
|
|
234
|
+
children: /* @__PURE__ */ o(S, _object_spread_props(_object_spread({}, t), {
|
|
235
|
+
ref: c,
|
|
219
236
|
dataAttributes: _object_spread({
|
|
220
237
|
"component-name": "AccordionItem"
|
|
221
|
-
},
|
|
238
|
+
}, n)
|
|
222
239
|
}))
|
|
223
240
|
});
|
|
224
|
-
}),
|
|
225
|
-
let { children:
|
|
226
|
-
const [
|
|
227
|
-
value:
|
|
228
|
-
defaultValue:
|
|
229
|
-
onChange:
|
|
241
|
+
}), pe = (param)=>{
|
|
242
|
+
let { children: n, dataAttributes: r, index: t, defaultIndex: c, onChange: d, singleOpen: s, role: a } = param;
|
|
243
|
+
const [u, m] = N({
|
|
244
|
+
value: t,
|
|
245
|
+
defaultValue: c,
|
|
246
|
+
onChange: d,
|
|
230
247
|
singleOpen: s
|
|
231
|
-
}), f =
|
|
232
|
-
return /* @__PURE__ */ o(
|
|
248
|
+
}), f = i.Children.toArray(n).filter(Boolean), e = f.length - 1;
|
|
249
|
+
return /* @__PURE__ */ o(C.Provider, {
|
|
233
250
|
value: {
|
|
234
|
-
index:
|
|
235
|
-
toggle:
|
|
251
|
+
index: u,
|
|
252
|
+
toggle: m
|
|
236
253
|
},
|
|
237
254
|
children: /* @__PURE__ */ o("div", _object_spread_props(_object_spread({
|
|
238
|
-
role:
|
|
239
|
-
},
|
|
255
|
+
role: a
|
|
256
|
+
}, B(_object_spread_props(_object_spread({}, r), {
|
|
240
257
|
accordion: !0
|
|
241
258
|
}), "Accordion")), {
|
|
242
|
-
children: f.map((l,
|
|
259
|
+
children: f.map((l, p)=>/* @__PURE__ */ A(i.Fragment, {
|
|
243
260
|
children: [
|
|
244
261
|
l,
|
|
245
|
-
|
|
262
|
+
p < e && /* @__PURE__ */ o(v, {
|
|
246
263
|
paddingX: 16,
|
|
247
|
-
children: /* @__PURE__ */ o(
|
|
264
|
+
children: /* @__PURE__ */ o(F, {})
|
|
248
265
|
})
|
|
249
266
|
]
|
|
250
|
-
},
|
|
267
|
+
}, p))
|
|
251
268
|
}))
|
|
252
269
|
});
|
|
253
|
-
},
|
|
254
|
-
var { dataAttributes:
|
|
270
|
+
}, Ie = /*#__PURE__*/ i.forwardRef((_param, c)=>{
|
|
271
|
+
var { dataAttributes: n, isInverse: r } = _param, t = _object_without_properties(_param, [
|
|
255
272
|
"dataAttributes",
|
|
256
273
|
"isInverse"
|
|
257
274
|
]);
|
|
258
|
-
return /* @__PURE__ */ o(
|
|
259
|
-
|
|
260
|
-
ref:
|
|
275
|
+
return /* @__PURE__ */ o(H, {
|
|
276
|
+
variant: r ? "inverse" : "default",
|
|
277
|
+
ref: c,
|
|
261
278
|
dataAttributes: _object_spread({
|
|
262
279
|
"component-name": "BoxedAccordionItem"
|
|
263
|
-
},
|
|
264
|
-
children: /* @__PURE__ */ o(
|
|
280
|
+
}, n),
|
|
281
|
+
children: /* @__PURE__ */ o(S, _object_spread({}, t))
|
|
265
282
|
});
|
|
266
|
-
}),
|
|
267
|
-
let { children:
|
|
268
|
-
const [
|
|
269
|
-
value:
|
|
270
|
-
defaultValue:
|
|
271
|
-
onChange:
|
|
283
|
+
}), xe = (param)=>{
|
|
284
|
+
let { children: n, dataAttributes: r, index: t, defaultIndex: c, onChange: d, singleOpen: s, role: a } = param;
|
|
285
|
+
const [u, m] = N({
|
|
286
|
+
value: t,
|
|
287
|
+
defaultValue: c,
|
|
288
|
+
onChange: d,
|
|
272
289
|
singleOpen: s
|
|
273
290
|
});
|
|
274
|
-
return /* @__PURE__ */ o(
|
|
291
|
+
return /* @__PURE__ */ o(C.Provider, {
|
|
275
292
|
value: {
|
|
276
|
-
index:
|
|
277
|
-
toggle:
|
|
293
|
+
index: u,
|
|
294
|
+
toggle: m
|
|
278
295
|
},
|
|
279
|
-
children: /* @__PURE__ */ o(
|
|
296
|
+
children: /* @__PURE__ */ o(j, {
|
|
280
297
|
space: 16,
|
|
281
|
-
role:
|
|
298
|
+
role: a,
|
|
282
299
|
dataAttributes: _object_spread({
|
|
283
300
|
"component-name": "BoxedAccordion",
|
|
284
301
|
accordion: !0
|
|
285
302
|
}, r),
|
|
286
|
-
children:
|
|
303
|
+
children: n
|
|
287
304
|
})
|
|
288
305
|
});
|
|
289
306
|
};
|
|
290
|
-
export {
|
|
307
|
+
export { pe as Accordion, fe as AccordionItem, xe as BoxedAccordion, Ie as BoxedAccordionItem };
|
package/dist-es/callout.js
CHANGED
|
@@ -51,91 +51,103 @@ function _object_spread_props(target, source) {
|
|
|
51
51
|
}
|
|
52
52
|
return target;
|
|
53
53
|
}
|
|
54
|
-
import { jsx as
|
|
55
|
-
import
|
|
56
|
-
import
|
|
54
|
+
import { jsx as t, jsxs as e } from "react/jsx-runtime";
|
|
55
|
+
import m from "./stack.js";
|
|
56
|
+
import g from "./inline.js";
|
|
57
57
|
import v from "./box.js";
|
|
58
58
|
import { useTheme as I } from "./hooks.js";
|
|
59
|
-
import { useThemeVariant as
|
|
60
|
-
import { Text3 as
|
|
61
|
-
import
|
|
62
|
-
import { IconButton as
|
|
63
|
-
import
|
|
64
|
-
import
|
|
65
|
-
import { container as
|
|
66
|
-
import { vars as
|
|
59
|
+
import { useThemeVariant as A, ThemeVariant as C } from "./theme-variant-context.js";
|
|
60
|
+
import { Text3 as R, Text2 as T } from "./text.js";
|
|
61
|
+
import N from "./generated/mistica-icons/icon-close-regular.js";
|
|
62
|
+
import { IconButton as S } from "./icon-button.js";
|
|
63
|
+
import y from "classnames";
|
|
64
|
+
import V from "./button-group.js";
|
|
65
|
+
import { container as j, background as k, content as L, closeButtonContainerSize as P, closeButtonContainer as $ } from "./callout.css-mistica.js";
|
|
66
|
+
import { vars as w } from "./image.css-mistica.js";
|
|
67
67
|
import { vars as n } from "./skins/skin-contract.css-mistica.js";
|
|
68
|
-
import { getPrefixedDataAttributes as
|
|
68
|
+
import { getPrefixedDataAttributes as z } from "./utils/dom.js";
|
|
69
69
|
import { applyCssVars as D } from "./utils/css.js";
|
|
70
70
|
import { closeButtonLabel as G } from "./text-tokens.js";
|
|
71
71
|
const W = (param)=>{
|
|
72
|
-
let { title:
|
|
73
|
-
const b =
|
|
74
|
-
return /* @__PURE__ */
|
|
75
|
-
className:
|
|
72
|
+
let { title: a, titleAs: c = "h2", description: d, asset: o, onClose: r, closeButtonLabel: u, button: i, secondaryButton: s, buttonLink: l, "aria-label": p, dataAttributes: f, role: h } = param;
|
|
73
|
+
const b = A(), { texts: x, t: B } = I();
|
|
74
|
+
return /* @__PURE__ */ t("section", _object_spread_props(_object_spread({
|
|
75
|
+
className: y(j, k[b]),
|
|
76
76
|
style: D({
|
|
77
|
-
[
|
|
77
|
+
[w.mediaBorderRadius]: n.borderRadii.mediaSmall
|
|
78
78
|
}),
|
|
79
|
-
"aria-label":
|
|
79
|
+
"aria-label": p !== null && p !== void 0 ? p : a,
|
|
80
80
|
role: h
|
|
81
|
-
},
|
|
82
|
-
children: /* @__PURE__ */ e(
|
|
81
|
+
}, z(f, "Callout")), {
|
|
82
|
+
children: /* @__PURE__ */ e(C, {
|
|
83
83
|
isInverse: !1,
|
|
84
84
|
children: [
|
|
85
|
-
|
|
85
|
+
o && /* @__PURE__ */ t(v, {
|
|
86
86
|
paddingRight: 16,
|
|
87
|
-
|
|
87
|
+
dataAttributes: {
|
|
88
|
+
testid: "asset"
|
|
89
|
+
},
|
|
90
|
+
children: o
|
|
88
91
|
}),
|
|
89
92
|
/* @__PURE__ */ e("div", {
|
|
90
|
-
className:
|
|
93
|
+
className: L,
|
|
91
94
|
children: [
|
|
92
|
-
/* @__PURE__ */ e(
|
|
95
|
+
/* @__PURE__ */ e(m, {
|
|
93
96
|
space: 16,
|
|
94
97
|
children: [
|
|
95
|
-
/* @__PURE__ */ e(
|
|
98
|
+
/* @__PURE__ */ e(g, {
|
|
96
99
|
fullWidth: !0,
|
|
97
100
|
alignItems: "flex-start",
|
|
98
101
|
space: "between",
|
|
99
102
|
children: [
|
|
100
|
-
/* @__PURE__ */ e(
|
|
103
|
+
/* @__PURE__ */ e(m, {
|
|
101
104
|
space: 4,
|
|
102
105
|
children: [
|
|
103
|
-
/* @__PURE__ */
|
|
106
|
+
/* @__PURE__ */ t(R, {
|
|
104
107
|
as: c,
|
|
105
108
|
regular: !0,
|
|
106
|
-
|
|
109
|
+
dataAttributes: {
|
|
110
|
+
testid: "title"
|
|
111
|
+
},
|
|
112
|
+
children: a
|
|
107
113
|
}),
|
|
108
|
-
/* @__PURE__ */
|
|
114
|
+
/* @__PURE__ */ t(T, {
|
|
109
115
|
as: "p",
|
|
110
116
|
regular: !0,
|
|
111
117
|
color: n.colors.textSecondary,
|
|
118
|
+
dataAttributes: {
|
|
119
|
+
testid: "description"
|
|
120
|
+
},
|
|
112
121
|
children: d
|
|
113
122
|
})
|
|
114
123
|
]
|
|
115
124
|
}),
|
|
116
|
-
|
|
125
|
+
r && // Create empty div in order to fill space that iconButton occupies.
|
|
117
126
|
// Without this, the content's vertical alignment can be affected
|
|
118
|
-
/* @__PURE__ */
|
|
119
|
-
className:
|
|
127
|
+
/* @__PURE__ */ t("div", {
|
|
128
|
+
className: P
|
|
120
129
|
})
|
|
121
130
|
]
|
|
122
131
|
}),
|
|
123
|
-
(i ||
|
|
132
|
+
(i || s || l) && /* @__PURE__ */ t(V, {
|
|
124
133
|
primaryButton: i,
|
|
125
|
-
secondaryButton:
|
|
126
|
-
link:
|
|
134
|
+
secondaryButton: s,
|
|
135
|
+
link: l
|
|
127
136
|
})
|
|
128
137
|
]
|
|
129
138
|
}),
|
|
130
|
-
|
|
131
|
-
className:
|
|
132
|
-
children: /* @__PURE__ */
|
|
139
|
+
r && /* @__PURE__ */ t("div", {
|
|
140
|
+
className: $,
|
|
141
|
+
children: /* @__PURE__ */ t(S, {
|
|
142
|
+
dataAttributes: {
|
|
143
|
+
testid: "closeButton"
|
|
144
|
+
},
|
|
133
145
|
small: !0,
|
|
134
146
|
bleedY: !0,
|
|
135
147
|
bleedRight: !0,
|
|
136
|
-
Icon:
|
|
137
|
-
onPress:
|
|
138
|
-
"aria-label":
|
|
148
|
+
Icon: N,
|
|
149
|
+
onPress: r,
|
|
150
|
+
"aria-label": u || x.closeButtonLabel || B(G)
|
|
139
151
|
})
|
|
140
152
|
})
|
|
141
153
|
]
|
|
@@ -143,5 +155,5 @@ const W = (param)=>{
|
|
|
143
155
|
]
|
|
144
156
|
})
|
|
145
157
|
}));
|
|
146
|
-
},
|
|
147
|
-
export {
|
|
158
|
+
}, at = W;
|
|
159
|
+
export { at as default };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import "./sprinkles.css.ts.vanilla.css-mistica.js";
|
|
2
2
|
import "./icon-button.css.ts.vanilla.css-mistica.js";
|
|
3
3
|
import "./card.css.ts.vanilla.css-mistica.js";
|
|
4
|
-
var _ = "_15e54s91 _1y2v1nfho _1y2v1nfia _1y2v1nfi4", y = "_15e54s93 _1y2v1nfho _1y2v1nfhi", e = "_15e54s912", r = "_1y2v1nfho _1y2v1nfia _1y2v1nfi0 _1y2v1nfhu", f = "_15e54s99", i = "_15e54s9m _1y2v1nfae _1y2v1nfbn _1y2v1nf82 _1y2v1nf9b _1y2v1nfho _1y2v1nfia _1y2v1nfhi _1y2v1nfhu _1y2v1nfib",
|
|
4
|
+
var _ = "_15e54s91 _1y2v1nfho _1y2v1nfia _1y2v1nfi4", y = "_15e54s93 _1y2v1nfho _1y2v1nfhi", e = "_15e54s912", r = "_1y2v1nfho _1y2v1nfia _1y2v1nfi0 _1y2v1nfhu", f = "_15e54s99", i = "_15e54s9m _1y2v1nfae _1y2v1nfbn _1y2v1nf82 _1y2v1nf9b _1y2v1nfho _1y2v1nfia _1y2v1nfhi _1y2v1nfhu _1y2v1nfib", t = "_15e54s913", s = "_15e54s9v", o = "_1y2v1nfib _1y2v1nfis _1y2v1nfho _1y2v1nfhi", d = "_15e54s9s", C = "_1y2v1nf7w _1y2v1nf84", h = "_1y2v1nf82", b = "_1y2v1nfak _1y2v1nfbt _1y2v1nf9b", l = "_15e54s9y _1y2v1nf88", p = "_1y2v1nfho _1y2v1nfhu", u = "_1y2v1nfho _1y2v1nfhu _1y2v1nfis _1y2v1nfib _1y2v1nfia", c = "_15e54s9i _1y2v1nfae _1y2v1nfam _1y2v1nf7w _1y2v1nf84", m = "_15e54s9g _1y2v1nfae _1y2v1nfbn _1y2v1nfho _1y2v1nfia _1y2v1nfhi _1y2v1nf7w _1y2v1nf9b _1y2v1nfhu _1y2v1nfi0", O = "_15e54s9k _1y2v1nfho _1y2v1nfia _1y2v1nfhi _1y2v1nfhu _1y2v1nfi0 _1y2v1nf7w _1y2v1nfbn", k = "_1y2v1nfae _1y2v1nfam _1y2v1nfbn _1y2v1nfbv _1y2v1nf9b", w = "_15e54s9o _1y2v1nf7w _1y2v1nf95 _1y2v1nfae _1y2v1nfbn _1y2v1nfho _1y2v1nfhi _1y2v1nfis _1y2v1nfhu _1y2v1nfi0 _1y2v1nfib _1y2v1nfia", W = "_15e54s96", A = "_15e54s9b _15e54s97", M = "_15e54s9c _15e54s97", x = "_15e54s9d _15e54s97", g = "_15e54s95", I = "_15e54s98 _15e54s97", T = "_15e54s9a _15e54s97", B = {
|
|
5
5
|
aspectRatio: "var(--_15e54s910)",
|
|
6
6
|
topActionsCount: "var(--_15e54s911)"
|
|
7
7
|
};
|
|
8
|
-
export { _ as actions, y as boxed, e as cardContainer, r as cardContentContainer, f as circularMediaOverlay, i as dataCard,
|
|
8
|
+
export { _ as actions, y as boxed, e as cardContainer, r as cardContentContainer, f as circularMediaOverlay, i as dataCard, t as dataCardTopActionsWithoutIcon, s as displayCardBackground, o as displayCardContainer, d as displayCardContent, C as displayCardContentWithAsset, h as displayCardContentWithTopContent, b as displayCardContentWrapper, l as displayCardGradient, p as flexColumn, u as mediaCard, c as mediaCardAsset, m as mediaCardContent, O as nakedCardContent, k as posterCardContentWrapper, w as snapCard, W as touchable, A as touchableCardOverlay, M as touchableCardOverlayInverse, x as touchableCardOverlayMedia, g as touchableContainer, I as touchableMediaCardOverlay, T as touchableNakedMediaOverlay, B as vars };
|