@telefonica/mistica 14.6.0 → 14.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/mistica.css +1 -1
- package/dist/avatar.css-mistica.js +1 -1
- package/dist/badge.css-mistica.js +3 -3
- package/dist/boxed.d.ts +2 -1
- package/dist/boxed.js +17 -18
- package/dist/button-fixed-footer-layout.d.ts +1 -2
- package/dist/button-group.css-mistica.js +3 -3
- package/dist/button-group.d.ts +1 -1
- package/dist/button-layout.css-mistica.js +12 -12
- package/dist/button-layout.d.ts +1 -2
- package/dist/button.css-mistica.js +22 -22
- package/dist/button.d.ts +1 -1
- package/dist/button.js +93 -90
- package/dist/callout.css-mistica.js +1 -1
- package/dist/callout.d.ts +1 -1
- package/dist/callout.js +13 -9
- package/dist/card.css-mistica.js +8 -8
- package/dist/card.d.ts +3 -3
- package/dist/card.js +71 -71
- package/dist/carousel.css-mistica.js +7 -7
- package/dist/checkbox.css-mistica.js +9 -9
- package/dist/chip.css-mistica.js +11 -10
- package/dist/chip.css.d.ts +1 -1
- package/dist/chip.js +21 -20
- package/dist/circle.css-mistica.js +1 -1
- package/dist/credit-card-number-field.css-mistica.js +3 -3
- package/dist/cvv-field.css-mistica.js +3 -3
- package/dist/date-time-picker.js +7 -6
- package/dist/dialog.css-mistica.js +7 -7
- package/dist/dialog.d.ts +1 -1
- package/dist/double-field.css-mistica.js +4 -4
- package/dist/double-field.d.ts +10 -10
- package/dist/empty-state-card.css-mistica.js +2 -2
- package/dist/empty-state-card.d.ts +1 -1
- package/dist/empty-state.css-mistica.js +2 -2
- package/dist/empty-state.d.ts +2 -1
- package/dist/feedback.css-mistica.js +5 -5
- package/dist/feedback.d.ts +1 -0
- package/dist/feedback.js +86 -87
- package/dist/fixed-footer-layout.css-mistica.js +5 -5
- package/dist/header.d.ts +2 -2
- package/dist/hero.css-mistica.js +5 -5
- package/dist/hero.d.ts +4 -4
- package/dist/highlighted-card.css-mistica.js +4 -4
- package/dist/highlighted-card.d.ts +1 -2
- package/dist/icon-button.css-mistica.js +1 -1
- package/dist/image.css-mistica.js +1 -1
- package/dist/image.js +16 -16
- package/dist/index.d.ts +7 -2
- package/dist/index.js +9 -1
- package/dist/list.css-mistica.js +9 -9
- package/dist/loading-bar.css-mistica.js +6 -6
- package/dist/logo.d.ts +34 -0
- package/dist/logo.js +629 -0
- package/dist/maybe-dismissable.css-mistica.js +4 -4
- package/dist/menu.css-mistica.js +1 -1
- package/dist/navigation-bar.css-mistica.js +16 -16
- package/dist/navigation-bar.d.ts +2 -6
- package/dist/navigation-bar.js +99 -266
- package/dist/navigation-breadcrumbs.css-mistica.js +1 -1
- package/dist/package-version.js +1 -1
- package/dist/password-field.css-mistica.js +2 -2
- package/dist/popover.css-mistica.js +10 -10
- package/dist/progress-bar.css-mistica.js +2 -2
- package/dist/radio-button.css-mistica.js +9 -9
- package/dist/responsive-layout.css-mistica.js +8 -5
- package/dist/responsive-layout.css.d.ts +4 -1
- package/dist/responsive-layout.d.ts +2 -0
- package/dist/responsive-layout.js +7 -9
- package/dist/screen-reader-only.css-mistica.js +1 -1
- package/dist/select.css-mistica.js +14 -14
- package/dist/skeleton-base.js +3 -3
- package/dist/skeletons.css-mistica.js +4 -4
- package/dist/skins/blau.js +7 -1
- package/dist/skins/defaults.d.ts +3 -0
- package/dist/skins/defaults.js +48 -0
- package/dist/skins/movistar-legacy.js +7 -1
- package/dist/skins/movistar.js +7 -1
- package/dist/skins/o2-classic.js +6 -0
- package/dist/skins/o2.js +9 -3
- package/dist/skins/skin-contract.css-mistica.js +203 -185
- package/dist/skins/skin-contract.css.d.ts +18 -0
- package/dist/skins/telefonica.js +19 -1
- package/dist/skins/types.d.ts +21 -0
- package/dist/skins/vivo.js +7 -1
- package/dist/snackbar.css-mistica.js +8 -8
- package/dist/spinner.css-mistica.js +1 -1
- package/dist/sprinkles.css-mistica.js +360 -312
- package/dist/sprinkles.css.d.ts +1 -1
- package/dist/stepper.css-mistica.js +9 -9
- package/dist/switch-component.css-mistica.js +23 -23
- package/dist/tabs.css-mistica.js +14 -14
- package/dist/tag.css-mistica.js +2 -2
- package/dist/tag.js +12 -12
- package/dist/text-field-base.css-mistica.js +10 -10
- package/dist/text-field-components.css-mistica.js +10 -10
- package/dist/text-link.css-mistica.js +5 -5
- package/dist/theme-context-provider.js +38 -58
- package/dist/theme-variant-context.d.ts +4 -1
- package/dist/theme-variant-context.js +9 -8
- package/dist/tooltip.css-mistica.js +2 -2
- package/dist/touchable.css-mistica.js +1 -1
- package/dist/utils/aspect-ratio-support.css-mistica.js +4 -4
- package/dist/utils/renders-element.d.ts +1 -1
- package/dist/video.css-mistica.js +1 -1
- package/dist/video.js +16 -15
- package/dist-es/avatar.css-mistica.js +1 -1
- package/dist-es/badge.css-mistica.js +2 -2
- package/dist-es/boxed.js +25 -26
- package/dist-es/button-group.css-mistica.js +2 -2
- package/dist-es/button-layout.css-mistica.js +7 -7
- package/dist-es/button.css-mistica.js +9 -9
- package/dist-es/button.js +128 -125
- package/dist-es/callout.css-mistica.js +1 -1
- package/dist-es/callout.js +28 -24
- package/dist-es/card.css-mistica.js +2 -2
- package/dist-es/card.js +120 -120
- package/dist-es/carousel.css-mistica.js +2 -2
- package/dist-es/checkbox.css-mistica.js +6 -6
- package/dist-es/chip.css-mistica.js +9 -8
- package/dist-es/chip.js +37 -36
- package/dist-es/circle.css-mistica.js +1 -1
- package/dist-es/credit-card-number-field.css-mistica.js +3 -3
- package/dist-es/cvv-field.css-mistica.js +2 -2
- package/dist-es/date-time-picker.js +13 -12
- package/dist-es/dialog.css-mistica.js +5 -5
- package/dist-es/double-field.css-mistica.js +4 -4
- package/dist-es/empty-state-card.css-mistica.js +2 -2
- package/dist-es/empty-state.css-mistica.js +2 -2
- package/dist-es/feedback.css-mistica.js +2 -2
- package/dist-es/feedback.js +109 -110
- package/dist-es/fixed-footer-layout.css-mistica.js +3 -3
- package/dist-es/hero.css-mistica.js +2 -2
- package/dist-es/highlighted-card.css-mistica.js +4 -4
- package/dist-es/icon-button.css-mistica.js +1 -1
- package/dist-es/image.css-mistica.js +1 -1
- package/dist-es/image.js +18 -18
- package/dist-es/index.js +1698 -1697
- package/dist-es/list.css-mistica.js +2 -2
- package/dist-es/loading-bar.css-mistica.js +2 -2
- package/dist-es/logo.js +607 -0
- package/dist-es/maybe-dismissable.css-mistica.js +2 -2
- package/dist-es/menu.css-mistica.js +1 -1
- package/dist-es/navigation-bar.css-mistica.js +11 -11
- package/dist-es/navigation-bar.js +171 -337
- package/dist-es/navigation-breadcrumbs.css-mistica.js +1 -1
- package/dist-es/package-version.js +1 -1
- package/dist-es/password-field.css-mistica.js +2 -2
- package/dist-es/popover.css-mistica.js +2 -2
- package/dist-es/progress-bar.css-mistica.js +2 -2
- package/dist-es/radio-button.css-mistica.js +6 -6
- package/dist-es/responsive-layout.css-mistica.js +5 -2
- package/dist-es/responsive-layout.js +16 -18
- package/dist-es/screen-reader-only.css-mistica.js +1 -1
- package/dist-es/select.css-mistica.js +11 -11
- package/dist-es/skeleton-base.js +7 -7
- package/dist-es/skeletons.css-mistica.js +2 -2
- package/dist-es/skins/blau.js +7 -1
- package/dist-es/skins/defaults.js +35 -0
- package/dist-es/skins/movistar-legacy.js +7 -1
- package/dist-es/skins/movistar.js +7 -1
- package/dist-es/skins/o2-classic.js +6 -0
- package/dist-es/skins/o2.js +9 -3
- package/dist-es/skins/skin-contract.css-mistica.js +203 -185
- package/dist-es/skins/telefonica.js +19 -1
- package/dist-es/skins/vivo.js +7 -1
- package/dist-es/snackbar.css-mistica.js +2 -2
- package/dist-es/spinner.css-mistica.js +1 -1
- package/dist-es/sprinkles.css-mistica.js +360 -312
- package/dist-es/stepper.css-mistica.js +2 -2
- package/dist-es/style.css +1 -1
- package/dist-es/switch-component.css-mistica.js +19 -19
- package/dist-es/tabs.css-mistica.js +10 -10
- package/dist-es/tag.css-mistica.js +2 -2
- package/dist-es/tag.js +27 -27
- package/dist-es/text-field-base.css-mistica.js +2 -2
- package/dist-es/text-field-components.css-mistica.js +2 -2
- package/dist-es/text-link.css-mistica.js +5 -5
- package/dist-es/theme-context-provider.js +72 -92
- package/dist-es/theme-variant-context.js +9 -9
- package/dist-es/tooltip.css-mistica.js +2 -2
- package/dist-es/touchable.css-mistica.js +1 -1
- package/dist-es/utils/aspect-ratio-support.css-mistica.js +3 -3
- package/dist-es/video.css-mistica.js +1 -1
- package/dist-es/video.js +17 -16
- package/package.json +3 -3
package/dist/button.js
CHANGED
|
@@ -9,10 +9,10 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
-
ButtonDanger: ()=>
|
|
13
|
-
ButtonLink: ()=>
|
|
14
|
-
ButtonPrimary: ()=>
|
|
15
|
-
ButtonSecondary: ()=>
|
|
12
|
+
ButtonDanger: ()=>we,
|
|
13
|
+
ButtonLink: ()=>Se,
|
|
14
|
+
ButtonPrimary: ()=>_e,
|
|
15
|
+
ButtonSecondary: ()=>Te
|
|
16
16
|
});
|
|
17
17
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
18
18
|
const _classnames = /*#__PURE__*/ _interopRequireDefault(require("classnames"));
|
|
@@ -152,45 +152,45 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
152
152
|
}
|
|
153
153
|
return target;
|
|
154
154
|
}
|
|
155
|
-
const
|
|
156
|
-
let { content: e , defaultIconSize:
|
|
157
|
-
const u = (0, _utilsJs.flattenChildren)(e),
|
|
155
|
+
const I = (param)=>{
|
|
156
|
+
let { content: e , defaultIconSize: n , renderText: i } = param;
|
|
157
|
+
const u = (0, _utilsJs.flattenChildren)(e), f = u.length, c = [];
|
|
158
158
|
let o = [];
|
|
159
|
-
const
|
|
160
|
-
|
|
159
|
+
const l = ()=>{
|
|
160
|
+
c.push(/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_react.Fragment, {
|
|
161
161
|
children: i(o)
|
|
162
|
-
},
|
|
162
|
+
}, c.length)), o = [];
|
|
163
163
|
};
|
|
164
|
-
return u.forEach((
|
|
165
|
-
var
|
|
166
|
-
const
|
|
167
|
-
if (/*#__PURE__*/ _react.isValidElement(
|
|
168
|
-
o.length &&
|
|
169
|
-
const
|
|
170
|
-
|
|
164
|
+
return u.forEach((s, m)=>{
|
|
165
|
+
var g;
|
|
166
|
+
const b = m === 0, r = m === f - 1;
|
|
167
|
+
if (/*#__PURE__*/ _react.isValidElement(s)) {
|
|
168
|
+
o.length && l();
|
|
169
|
+
const N = (g = s.props.size) != null ? g : n;
|
|
170
|
+
c.push(/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
|
|
171
171
|
style: {
|
|
172
172
|
display: "flex",
|
|
173
173
|
alignItems: "center",
|
|
174
|
-
marginLeft:
|
|
175
|
-
marginRight:
|
|
174
|
+
marginLeft: b ? 0 : _buttonCssMisticaJs.ICON_MARGIN_PX,
|
|
175
|
+
marginRight: r ? 0 : _buttonCssMisticaJs.ICON_MARGIN_PX
|
|
176
176
|
},
|
|
177
|
-
children: /*#__PURE__*/ _react.cloneElement(
|
|
178
|
-
size: (0, _cssJs.pxToRem)(
|
|
177
|
+
children: /*#__PURE__*/ _react.cloneElement(s, {
|
|
178
|
+
size: (0, _cssJs.pxToRem)(N)
|
|
179
179
|
})
|
|
180
|
-
},
|
|
181
|
-
} else o.push(
|
|
182
|
-
}),
|
|
183
|
-
},
|
|
184
|
-
var
|
|
185
|
-
const { eventFormat: i } = (0, _analyticsJs.useTrackingConfig)(), { formStatus: u , formId:
|
|
180
|
+
}, c.length));
|
|
181
|
+
} else o.push(s), r && l();
|
|
182
|
+
}), c;
|
|
183
|
+
}, w = /*#__PURE__*/ _react.forwardRef((e, n)=>{
|
|
184
|
+
var x;
|
|
185
|
+
const { eventFormat: i } = (0, _analyticsJs.useTrackingConfig)(), { formStatus: u , formId: f } = (0, _formContextJs.useForm)(), c = (0, _themeVariantContextJs.useIsInverseVariant)(), { loadingText: o } = e, l = !!e.submit, s = u === "sending", [m, b] = _react.useState(!1), r = e.showSpinner || s && l || m, [h, g] = _react.useState(!!r);
|
|
186
186
|
_react.useEffect(()=>{
|
|
187
|
-
|
|
187
|
+
r && !h && g(!0);
|
|
188
188
|
}, [
|
|
189
|
-
|
|
190
|
-
|
|
189
|
+
r,
|
|
190
|
+
h,
|
|
191
191
|
u
|
|
192
192
|
]);
|
|
193
|
-
const
|
|
193
|
+
const N = ()=>i === "google-analytics-4" ? {
|
|
194
194
|
name: _analyticsJs.eventNames.userInteraction,
|
|
195
195
|
component_type: `${e.type}_button`,
|
|
196
196
|
component_copy: (0, _commonJs.getTextFromChildren)(e.children)
|
|
@@ -198,30 +198,30 @@ const y = (param)=>{
|
|
|
198
198
|
category: _analyticsJs.eventCategories.userInteraction,
|
|
199
199
|
action: `${e.type}_button_tapped`,
|
|
200
200
|
label: (0, _commonJs.getTextFromChildren)(e.children)
|
|
201
|
-
},
|
|
201
|
+
}, S = e.small ? _buttonCssMisticaJs.SMALL_ICON_SIZE : _buttonCssMisticaJs.ICON_SIZE, y = (0, _cssJs.pxToRem)(e.small ? _buttonCssMisticaJs.SMALL_SPINNER_SIZE : _buttonCssMisticaJs.SPINNER_SIZE), _ = (E)=>e.small ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text, {
|
|
202
202
|
size: 14,
|
|
203
203
|
lineHeight: 20,
|
|
204
204
|
weight: "medium",
|
|
205
205
|
truncate: 1,
|
|
206
206
|
color: "inherit",
|
|
207
207
|
as: "div",
|
|
208
|
-
children:
|
|
208
|
+
children: E
|
|
209
209
|
}) : /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text3, {
|
|
210
210
|
medium: !0,
|
|
211
211
|
truncate: 1,
|
|
212
212
|
color: "inherit",
|
|
213
213
|
as: "div",
|
|
214
|
-
children:
|
|
215
|
-
}),
|
|
216
|
-
ref:
|
|
217
|
-
className: (0, _classnames.default)(
|
|
214
|
+
children: E
|
|
215
|
+
}), v = {
|
|
216
|
+
ref: n,
|
|
217
|
+
className: (0, _classnames.default)(c ? _buttonCssMisticaJs.inverseVariants[e.type] : _buttonCssMisticaJs.variants[e.type], e.className, {
|
|
218
218
|
[_buttonCssMisticaJs.small]: e.small,
|
|
219
|
-
[_buttonCssMisticaJs.isLoading]:
|
|
219
|
+
[_buttonCssMisticaJs.isLoading]: r
|
|
220
220
|
}),
|
|
221
221
|
style: _objectSpread({
|
|
222
222
|
cursor: e.fake ? "pointer" : void 0
|
|
223
223
|
}, e.style),
|
|
224
|
-
trackingEvent: (
|
|
224
|
+
trackingEvent: (x = e.trackingEvent) != null ? x : e.trackEvent ? N() : void 0,
|
|
225
225
|
dataAttributes: e.dataAttributes,
|
|
226
226
|
"aria-controls": e["aria-controls"],
|
|
227
227
|
"aria-expanded": e["aria-expanded"],
|
|
@@ -229,90 +229,93 @@ const y = (param)=>{
|
|
|
229
229
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_jsxRuntimeJs.Fragment, {
|
|
230
230
|
children: [
|
|
231
231
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
|
|
232
|
-
"aria-hidden":
|
|
232
|
+
"aria-hidden": r ? !0 : void 0,
|
|
233
233
|
className: _buttonCssMisticaJs.textContent,
|
|
234
|
-
children:
|
|
234
|
+
children: I({
|
|
235
235
|
content: e.children,
|
|
236
|
-
defaultIconSize:
|
|
237
|
-
renderText:
|
|
236
|
+
defaultIconSize: S,
|
|
237
|
+
renderText: _
|
|
238
238
|
})
|
|
239
239
|
}),
|
|
240
240
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
|
|
241
241
|
className: _buttonCssMisticaJs.loadingFiller,
|
|
242
242
|
"aria-hidden": !0,
|
|
243
243
|
style: {
|
|
244
|
-
paddingLeft:
|
|
244
|
+
paddingLeft: y,
|
|
245
245
|
paddingRight: _buttonCssMisticaJs.ICON_MARGIN_PX + 2 * (e.small ? _buttonCssMisticaJs.X_SMALL_PADDING_PX : _buttonCssMisticaJs.X_PADDING_PX)
|
|
246
246
|
},
|
|
247
|
-
children:
|
|
247
|
+
children: I({
|
|
248
248
|
content: o,
|
|
249
|
-
defaultIconSize:
|
|
250
|
-
renderText:
|
|
249
|
+
defaultIconSize: S,
|
|
250
|
+
renderText: _
|
|
251
251
|
})
|
|
252
252
|
}),
|
|
253
253
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", {
|
|
254
|
-
"aria-hidden":
|
|
254
|
+
"aria-hidden": r ? void 0 : !0,
|
|
255
255
|
className: _buttonCssMisticaJs.loadingContent,
|
|
256
256
|
onTransitionEnd: ()=>{
|
|
257
|
-
|
|
257
|
+
r !== h && g(r);
|
|
258
258
|
},
|
|
259
259
|
children: [
|
|
260
|
-
|
|
260
|
+
h ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_spinnerJs.default, {
|
|
261
261
|
rolePresentation: !!o,
|
|
262
262
|
color: "currentcolor",
|
|
263
263
|
delay: "0s",
|
|
264
|
-
size:
|
|
264
|
+
size: y
|
|
265
265
|
}) : /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
|
|
266
266
|
style: {
|
|
267
267
|
display: "inline-block",
|
|
268
|
-
width:
|
|
269
|
-
height:
|
|
268
|
+
width: y,
|
|
269
|
+
height: y
|
|
270
270
|
}
|
|
271
271
|
}),
|
|
272
272
|
o ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_boxJs.default, {
|
|
273
273
|
paddingLeft: 8,
|
|
274
|
-
children:
|
|
274
|
+
children: I({
|
|
275
275
|
content: o,
|
|
276
|
-
defaultIconSize:
|
|
277
|
-
renderText:
|
|
276
|
+
defaultIconSize: S,
|
|
277
|
+
renderText: _
|
|
278
278
|
})
|
|
279
279
|
}) : null
|
|
280
280
|
]
|
|
281
281
|
})
|
|
282
282
|
]
|
|
283
283
|
}),
|
|
284
|
-
disabled: e.disabled ||
|
|
284
|
+
disabled: e.disabled || r || s,
|
|
285
285
|
role: "button"
|
|
286
286
|
};
|
|
287
287
|
if (process.env.NODE_ENV !== "production" && (e.to === "" || e.href === "")) throw Error("to or href props are empty strings");
|
|
288
288
|
if (e.fake) return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({
|
|
289
289
|
maybe: !0
|
|
290
|
-
},
|
|
290
|
+
}, v), {
|
|
291
291
|
role: "presentation",
|
|
292
292
|
"aria-hidden": "true"
|
|
293
293
|
}));
|
|
294
294
|
if (e.submit) return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpread({
|
|
295
295
|
type: "submit",
|
|
296
|
-
formId:
|
|
296
|
+
formId: f,
|
|
297
297
|
onPress: ()=>{}
|
|
298
|
-
},
|
|
299
|
-
if (e.onPress) return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({},
|
|
300
|
-
onPress:
|
|
298
|
+
}, v));
|
|
299
|
+
if (e.onPress) return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({}, v), {
|
|
300
|
+
onPress: (E)=>{
|
|
301
|
+
const k = e.onPress(E);
|
|
302
|
+
k && (b(!0), k.finally(()=>b(!1)));
|
|
303
|
+
}
|
|
301
304
|
}));
|
|
302
|
-
if (e.to || e.to === "") return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({},
|
|
305
|
+
if (e.to || e.to === "") return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({}, v), {
|
|
303
306
|
to: e.to,
|
|
304
307
|
fullPageOnWebView: e.fullPageOnWebView
|
|
305
308
|
}));
|
|
306
|
-
if (e.href || e.href === "") return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({},
|
|
309
|
+
if (e.href || e.href === "") return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({}, v), {
|
|
307
310
|
href: e.href,
|
|
308
311
|
newTab: e.newTab,
|
|
309
312
|
loadOnTop: e.loadOnTop
|
|
310
313
|
}));
|
|
311
314
|
if (process.env.NODE_ENV !== "production") throw Error("Bad button props");
|
|
312
315
|
return null;
|
|
313
|
-
}),
|
|
314
|
-
var
|
|
315
|
-
const { formStatus: i } = (0, _formContextJs.useForm)(), u = (0, _themeVariantContextJs.useIsInverseVariant)(), { analytics:
|
|
316
|
+
}), Se = /*#__PURE__*/ _react.forwardRef((e, n)=>{
|
|
317
|
+
var s;
|
|
318
|
+
const { formStatus: i } = (0, _formContextJs.useForm)(), u = (0, _themeVariantContextJs.useIsInverseVariant)(), { analytics: f } = (0, _hooksJs.useTheme)(), c = ()=>f.eventFormat === "google-analytics-4" ? {
|
|
316
319
|
name: _analyticsJs.eventNames.userInteraction,
|
|
317
320
|
component_type: "link",
|
|
318
321
|
component_copy: (0, _commonJs.getTextFromChildren)(e.children)
|
|
@@ -320,23 +323,23 @@ const y = (param)=>{
|
|
|
320
323
|
category: _analyticsJs.eventCategories.userInteraction,
|
|
321
324
|
action: _analyticsJs.eventActions.linkTapped,
|
|
322
325
|
label: (0, _commonJs.getTextFromChildren)(e.children)
|
|
323
|
-
}, o = (
|
|
326
|
+
}, o = (m)=>/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text2, {
|
|
324
327
|
medium: !0,
|
|
325
328
|
truncate: 1,
|
|
326
329
|
color: "inherit",
|
|
327
|
-
children:
|
|
328
|
-
}),
|
|
330
|
+
children: m
|
|
331
|
+
}), l = {
|
|
329
332
|
className: (0, _classnames.default)(_buttonCssMisticaJs.link, {
|
|
330
333
|
[_buttonCssMisticaJs.inverseLink]: u,
|
|
331
334
|
[_buttonCssMisticaJs.alignedLink]: e.aligned
|
|
332
335
|
}),
|
|
333
|
-
trackingEvent: (
|
|
336
|
+
trackingEvent: (s = e.trackingEvent) != null ? s : e.trackEvent ? c() : void 0,
|
|
334
337
|
dataAttributes: _objectSpread({
|
|
335
338
|
"component-name": "ButtonLink"
|
|
336
339
|
}, e.dataAttributes),
|
|
337
340
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
|
|
338
341
|
className: _buttonCssMisticaJs.textContentLink,
|
|
339
|
-
children:
|
|
342
|
+
children: I({
|
|
340
343
|
content: e.children,
|
|
341
344
|
defaultIconSize: _buttonCssMisticaJs.SMALL_ICON_SIZE,
|
|
342
345
|
renderText: o
|
|
@@ -346,57 +349,57 @@ const y = (param)=>{
|
|
|
346
349
|
};
|
|
347
350
|
if (process.env.NODE_ENV !== "production" && (e.to === "" || e.href === "")) throw Error("to or href props are empty strings");
|
|
348
351
|
if (e.onPress) return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({
|
|
349
|
-
ref:
|
|
350
|
-
},
|
|
352
|
+
ref: n
|
|
353
|
+
}, l), {
|
|
351
354
|
onPress: e.onPress
|
|
352
355
|
}));
|
|
353
356
|
if (e.to || e.to === "") return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({
|
|
354
|
-
ref:
|
|
355
|
-
},
|
|
357
|
+
ref: n
|
|
358
|
+
}, l), {
|
|
356
359
|
to: e.to,
|
|
357
360
|
fullPageOnWebView: e.fullPageOnWebView
|
|
358
361
|
}));
|
|
359
362
|
if (e.href || e.href === "") return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, _objectSpreadProps(_objectSpread({
|
|
360
|
-
ref:
|
|
361
|
-
},
|
|
363
|
+
ref: n
|
|
364
|
+
}, l), {
|
|
362
365
|
href: e.href,
|
|
363
366
|
newTab: e.newTab
|
|
364
367
|
}));
|
|
365
368
|
if (process.env.NODE_ENV !== "production") throw Error("Bad button props");
|
|
366
369
|
return null;
|
|
367
|
-
}),
|
|
368
|
-
var { dataAttributes: e } = _param,
|
|
370
|
+
}), _e = /*#__PURE__*/ _react.forwardRef((_param, i)=>/* @__PURE__ */ {
|
|
371
|
+
var { dataAttributes: e } = _param, n = _objectWithoutProperties(_param, [
|
|
369
372
|
"dataAttributes"
|
|
370
373
|
]);
|
|
371
|
-
return (0, _jsxRuntimeJs.jsx)(
|
|
374
|
+
return (0, _jsxRuntimeJs.jsx)(w, _objectSpreadProps(_objectSpread({
|
|
372
375
|
dataAttributes: _objectSpread({
|
|
373
376
|
"component-name": "ButtonPrimary"
|
|
374
377
|
}, e)
|
|
375
|
-
},
|
|
378
|
+
}, n), {
|
|
376
379
|
ref: i,
|
|
377
380
|
type: "primary"
|
|
378
381
|
}));
|
|
379
|
-
}),
|
|
380
|
-
var { dataAttributes: e } = _param,
|
|
382
|
+
}), Te = /*#__PURE__*/ _react.forwardRef((_param, i)=>/* @__PURE__ */ {
|
|
383
|
+
var { dataAttributes: e } = _param, n = _objectWithoutProperties(_param, [
|
|
381
384
|
"dataAttributes"
|
|
382
385
|
]);
|
|
383
|
-
return (0, _jsxRuntimeJs.jsx)(
|
|
386
|
+
return (0, _jsxRuntimeJs.jsx)(w, _objectSpreadProps(_objectSpread({
|
|
384
387
|
dataAttributes: _objectSpread({
|
|
385
388
|
"component-name": "ButtonSecondary"
|
|
386
389
|
}, e)
|
|
387
|
-
},
|
|
390
|
+
}, n), {
|
|
388
391
|
ref: i,
|
|
389
392
|
type: "secondary"
|
|
390
393
|
}));
|
|
391
|
-
}),
|
|
392
|
-
var { dataAttributes: e } = _param,
|
|
394
|
+
}), we = /*#__PURE__*/ _react.forwardRef((_param, i)=>/* @__PURE__ */ {
|
|
395
|
+
var { dataAttributes: e } = _param, n = _objectWithoutProperties(_param, [
|
|
393
396
|
"dataAttributes"
|
|
394
397
|
]);
|
|
395
|
-
return (0, _jsxRuntimeJs.jsx)(
|
|
398
|
+
return (0, _jsxRuntimeJs.jsx)(w, _objectSpreadProps(_objectSpread({
|
|
396
399
|
dataAttributes: _objectSpread({
|
|
397
400
|
"component-name": "ButtonDanger"
|
|
398
401
|
}, e)
|
|
399
|
-
},
|
|
402
|
+
}, n), {
|
|
400
403
|
ref: i,
|
|
401
404
|
type: "danger"
|
|
402
405
|
}));
|
|
@@ -14,4 +14,4 @@ _export(exports, {
|
|
|
14
14
|
});
|
|
15
15
|
require("./sprinkles.css.ts.vanilla.js");
|
|
16
16
|
require("./callout.css.ts.vanilla.js");
|
|
17
|
-
var y = "_14g0jmy1
|
|
17
|
+
var y = "_14g0jmy1 _1y2v1nf6g _1y2v1nf6u _1y2v1nf78 _1y2v1nf7m _1y2v1nf5o _1y2v1nf9v _1y2v1nfa4", _ = "_14g0jmy3 _1y2v1nf6a";
|
package/dist/callout.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { ButtonLink, ButtonPrimary, ButtonSecondary } from './button';
|
|
2
|
+
import type { ButtonLink, ButtonPrimary, ButtonSecondary } from './button';
|
|
3
3
|
import type { DataAttributes, RendersNullableElement } from './utils/types';
|
|
4
4
|
type Props = {
|
|
5
5
|
title?: string;
|
package/dist/callout.js
CHANGED
|
@@ -79,13 +79,17 @@ function _objectSpreadProps(target, source) {
|
|
|
79
79
|
return target;
|
|
80
80
|
}
|
|
81
81
|
const O = (param)=>{
|
|
82
|
-
let { title:
|
|
83
|
-
const u = (0, _themeVariantContextJs.
|
|
82
|
+
let { title: n , description: p , icon: i , onClose: a , button: l , secondaryButton: s , buttonLink: m , "aria-label": o , dataAttributes: f } = param;
|
|
83
|
+
const u = (0, _themeVariantContextJs.useThemeVariant)(), { texts: d } = (0, _hooksJs.useTheme)();
|
|
84
84
|
return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("section", _objectSpreadProps(_objectSpread({
|
|
85
85
|
className: (0, _classnames.default)(_calloutCssMisticaJs.container, (0, _sprinklesCssMisticaJs.sprinkles)({
|
|
86
|
-
background:
|
|
86
|
+
background: {
|
|
87
|
+
inverse: _skinContractCssMisticaJs.vars.colors.backgroundContainer,
|
|
88
|
+
alternative: _skinContractCssMisticaJs.vars.colors.backgroundContainer,
|
|
89
|
+
default: _skinContractCssMisticaJs.vars.colors.backgroundContainerAlternative
|
|
90
|
+
}[u]
|
|
87
91
|
})),
|
|
88
|
-
"aria-label":
|
|
92
|
+
"aria-label": o != null ? o : n
|
|
89
93
|
}, (0, _domJs.getPrefixedDataAttributes)(f, "Callout")), {
|
|
90
94
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_themeVariantContextJs.ThemeVariant, {
|
|
91
95
|
isInverse: !1,
|
|
@@ -110,7 +114,7 @@ const O = (param)=>{
|
|
|
110
114
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text3, {
|
|
111
115
|
as: "h2",
|
|
112
116
|
regular: !0,
|
|
113
|
-
children:
|
|
117
|
+
children: n
|
|
114
118
|
}),
|
|
115
119
|
/* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text2, {
|
|
116
120
|
as: "p",
|
|
@@ -120,7 +124,7 @@ const O = (param)=>{
|
|
|
120
124
|
})
|
|
121
125
|
]
|
|
122
126
|
}),
|
|
123
|
-
|
|
127
|
+
a && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconButtonJs.default, {
|
|
124
128
|
size: 40,
|
|
125
129
|
style: {
|
|
126
130
|
display: "flex",
|
|
@@ -128,7 +132,7 @@ const O = (param)=>{
|
|
|
128
132
|
alignItems: "center",
|
|
129
133
|
justifyContent: "center"
|
|
130
134
|
},
|
|
131
|
-
onPress:
|
|
135
|
+
onPress: a,
|
|
132
136
|
"aria-label": d.closeButtonLabel,
|
|
133
137
|
children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconCloseRegularJs.default, {
|
|
134
138
|
size: 24,
|
|
@@ -137,9 +141,9 @@ const O = (param)=>{
|
|
|
137
141
|
})
|
|
138
142
|
]
|
|
139
143
|
}),
|
|
140
|
-
(l ||
|
|
144
|
+
(l || s || m) && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_buttonGroupJs.default, {
|
|
141
145
|
primaryButton: l,
|
|
142
|
-
secondaryButton:
|
|
146
|
+
secondaryButton: s,
|
|
143
147
|
link: m
|
|
144
148
|
})
|
|
145
149
|
]
|
package/dist/card.css-mistica.js
CHANGED
|
@@ -14,15 +14,15 @@ _export(exports, {
|
|
|
14
14
|
cardAction: ()=>f,
|
|
15
15
|
cardActionIconButton: ()=>a,
|
|
16
16
|
cardActionInverse: ()=>r,
|
|
17
|
-
dataCard: ()=>
|
|
18
|
-
displayCard: ()=>
|
|
17
|
+
dataCard: ()=>o,
|
|
18
|
+
displayCard: ()=>e,
|
|
19
19
|
displayCardGradient: ()=>d,
|
|
20
|
-
mediaCard: ()=>
|
|
21
|
-
mediaCardContent: ()=>
|
|
22
|
-
snapCard: ()=>
|
|
23
|
-
snapCardTouchableHover: ()=>
|
|
24
|
-
snapCardTouchableHoverTransparent: ()=>
|
|
20
|
+
mediaCard: ()=>s,
|
|
21
|
+
mediaCardContent: ()=>t,
|
|
22
|
+
snapCard: ()=>i,
|
|
23
|
+
snapCardTouchableHover: ()=>c,
|
|
24
|
+
snapCardTouchableHoverTransparent: ()=>p
|
|
25
25
|
});
|
|
26
26
|
require("./sprinkles.css.ts.vanilla.js");
|
|
27
27
|
require("./card.css.ts.vanilla.js");
|
|
28
|
-
var _ = "_15e54s91
|
|
28
|
+
var _ = "_15e54s91 _1y2v1nf5o _1y2v1nf6a _1y2v1nf64", y = "_15e54s93 _1y2v1nf5o", f = "_15e54s9j _1y2v1nf84 _1y2v1nf8j _1y2v1nf5o _1y2v1nf63 _1y2v1nf5x _1y2v1nf9n", a = "_1y2v1nf5o _1y2v1nf86 _1y2v1nf8l _1y2v1nf63 _1y2v1nf5x", r = "_15e54s9k _1y2v1nf84 _1y2v1nf8j _1y2v1nf5o _1y2v1nf63 _1y2v1nf5x _1y2v1nf9n", o = "_15e54s98 _1y2v1nf78 _1y2v1nf7m _1y2v1nf6h _1y2v1nf6v _1y2v1nf5o _1y2v1nf6a _1y2v1nf5u _1y2v1nf7v", e = "_15e54s9f _1y2v1nf5o _1y2v1nf6a _1y2v1nf5u _1y2v1nf60", d = "_15e54s9g", s = "_1y2v1nf5o _1y2v1nf5u _1y2v1nf8b _1y2v1nf7v", t = "_15e54s96 _1y2v1nf78 _1y2v1nf7m _1y2v1nf5o _1y2v1nf6a _1y2v1nf6g _1y2v1nf6v _1y2v1nf5u _1y2v1nf60", i = "_15e54s9a _1y2v1nf6g _1y2v1nf6u _1y2v1nf78 _1y2v1nf7m _1y2v1nf5o _1y2v1nf8b _1y2v1nf5u _1y2v1nf60 _1y2v1nf6a", c = "_15e54s9c _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf5o _1y2v1nf8b _1y2v1nf7v _1y2v1nf9m _1y2v1nf5i", p = "_15e54s9d _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf5o _1y2v1nf8b _1y2v1nf7v _1y2v1nf9m _1y2v1nf5i";
|
package/dist/card.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import Tag from './tag';
|
|
3
|
-
import
|
|
4
|
-
import Video from './video';
|
|
5
|
-
import
|
|
3
|
+
import type Image from './image';
|
|
4
|
+
import type Video from './video';
|
|
5
|
+
import type { ButtonLink, ButtonPrimary, ButtonSecondary } from './button';
|
|
6
6
|
import type { DataAttributes, IconProps, RendersElement, RendersNullableElement, TrackingEvent } from './utils/types';
|
|
7
7
|
type CardAction = {
|
|
8
8
|
label: string;
|