@telefonica/mistica 15.19.0 → 15.20.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/mistica.css +1 -1
- package/dist/accordion.d.ts +2 -2
- package/dist/avatar.d.ts +2 -2
- package/dist/badge.d.ts +1 -1
- package/dist/button-fixed-footer-layout.d.ts +1 -1
- package/dist/button-group.d.ts +2 -2
- package/dist/button-layout.d.ts +2 -2
- package/dist/button.d.ts +2 -2
- package/dist/callout.d.ts +1 -1
- package/dist/card.d.ts +1 -1
- package/dist/checkbox.d.ts +1 -1
- package/dist/chip.d.ts +3 -3
- package/dist/circle.d.ts +1 -1
- package/dist/community/blocks.d.ts +7 -7
- package/dist/counter.d.ts +2 -2
- package/dist/credit-card-expiration-field.d.ts +2 -2
- package/dist/credit-card-fields.d.ts +2 -2
- package/dist/credit-card-number-field.d.ts +2 -2
- package/dist/cvv-field.d.ts +2 -2
- package/dist/date-field.d.ts +2 -2
- package/dist/date-time-field.d.ts +2 -2
- package/dist/date-time-picker.d.ts +2 -2
- package/dist/decimal-field.d.ts +2 -2
- package/dist/dialog.js +72 -70
- package/dist/divider.d.ts +2 -4
- package/dist/double-field.d.ts +2 -2
- package/dist/email-field.d.ts +2 -2
- package/dist/empty-state-card.d.ts +1 -1
- package/dist/empty-state.d.ts +1 -1
- package/dist/fade-in.d.ts +1 -1
- package/dist/feedback.d.ts +6 -6
- package/dist/fixed-to-top.d.ts +1 -1
- package/dist/focus-trap.d.ts +1 -1
- package/dist/form.d.ts +1 -1
- package/dist/grid-layout.d.ts +1 -1
- package/dist/header.d.ts +4 -4
- package/dist/iban-field.d.ts +2 -2
- package/dist/icon-button.d.ts +2 -2
- package/dist/icons/icon-amex.d.ts +2 -2
- package/dist/icons/icon-chevron.d.ts +1 -1
- package/dist/icons/icon-cvv-amex.d.ts +2 -2
- package/dist/icons/icon-cvv-visa-mc.d.ts +2 -2
- package/dist/icons/icon-mastercard.d.ts +2 -2
- package/dist/icons/icon-visa.d.ts +2 -2
- package/dist/inline.d.ts +1 -1
- package/dist/integer-field.d.ts +1 -1
- package/dist/list.d.ts +3 -3
- package/dist/loading-bar.d.ts +2 -2
- package/dist/master-detail-layout.d.ts +1 -1
- package/dist/menu.d.ts +4 -4
- package/dist/month-field.d.ts +2 -2
- package/dist/mosaic.d.ts +3 -3
- package/dist/navigation-bar.d.ts +5 -5
- package/dist/navigation-breadcrumbs.d.ts +3 -2
- package/dist/navigation-breadcrumbs.js +8 -7
- package/dist/negative-box.d.ts +1 -1
- package/dist/nestable-context.d.ts +5 -5
- package/dist/overlay.d.ts +1 -1
- package/dist/package-version.js +1 -1
- package/dist/password-field.d.ts +2 -2
- package/dist/phone-number-field.d.ts +2 -2
- package/dist/placeholder.d.ts +2 -2
- package/dist/popover.d.ts +1 -1
- package/dist/portal.d.ts +1 -1
- package/dist/progress-bar.d.ts +2 -2
- package/dist/radio-button.d.ts +2 -2
- package/dist/responsive-layout.d.ts +5 -5
- package/dist/screen-reader-only.d.ts +1 -1
- package/dist/screen-size-context-provider.d.ts +1 -1
- package/dist/select.d.ts +1 -1
- package/dist/snackbar.js +18 -20
- package/dist/spinner.d.ts +1 -1
- package/dist/stack.d.ts +1 -1
- package/dist/stacking-group.d.ts +1 -1
- package/dist/stepper.d.ts +2 -2
- package/dist/switch-component.d.ts +1 -1
- package/dist/tab-focus.d.ts +1 -1
- package/dist/tabs.d.ts +1 -1
- package/dist/tag.d.ts +3 -3
- package/dist/text-field-base.d.ts +4 -4
- package/dist/text-field-components.d.ts +3 -3
- package/dist/text-link.d.ts +1 -1
- package/dist/text.d.ts +11 -11
- package/dist/theme-context-provider.d.ts +1 -1
- package/dist/theme-variant-context.d.ts +1 -1
- package/dist/timer.d.ts +3 -3
- package/dist/tooltip.d.ts +2 -2
- package/dist/utils/aspect-ratio-support.d.ts +1 -1
- package/dist/utils/document-visibility.d.ts +1 -1
- package/dist-es/dialog.js +72 -70
- package/dist-es/navigation-breadcrumbs.js +18 -17
- package/dist-es/package-version.js +1 -1
- package/dist-es/snackbar.js +21 -23
- package/dist-es/style.css +1 -1
- package/package.json +3 -3
package/dist/snackbar.js
CHANGED
|
@@ -126,31 +126,31 @@ const ee = [
|
|
|
126
126
|
"CONSECUTIVE",
|
|
127
127
|
"BUTTON"
|
|
128
128
|
], re = 5e3, te = 1e4, ne = /*#__PURE__*/ _react.forwardRef((param, g)=>{
|
|
129
|
-
let { message: m, buttonText: n, buttonAccessibilityLabel: u, closeButtonLabel:
|
|
130
|
-
const { texts: T } = (0, _hooks.useTheme)(), [a, s] = _react.useState(!1), { width:
|
|
129
|
+
let { message: m, buttonText: n, buttonAccessibilityLabel: u, closeButtonLabel: I, duration: t, onClose: o, type: c, withDismiss: d = !1, dataAttributes: R } = param;
|
|
130
|
+
const { texts: T } = (0, _hooks.useTheme)(), [a, s] = _react.useState(!1), { width: p, ref: v } = (0, _hooks.useElementDimensions)(), { isDesktopOrBigger: i } = (0, _hooks.useScreenSize)(), l = p > (i ? 160 : 128), k = _react.useRef(null), E = t === 1 / 0 && !n || d, h = _react.useRef(o);
|
|
131
131
|
_react.useEffect(()=>{
|
|
132
132
|
h.current = o;
|
|
133
133
|
}, [
|
|
134
134
|
o
|
|
135
135
|
]);
|
|
136
|
-
const f = _react.useCallback((
|
|
136
|
+
const f = _react.useCallback((B)=>{
|
|
137
137
|
s(!1), setTimeout(()=>{
|
|
138
138
|
var S;
|
|
139
|
-
(S = h.current) == null || S.call(h,
|
|
139
|
+
(S = h.current) == null || S.call(h, B);
|
|
140
140
|
}, process.env.NODE_ENV === "test" ? 0 : _snackbarcssmistica.TRANSITION_TIME_IN_MS);
|
|
141
141
|
}, []);
|
|
142
|
-
return _react.useImperativeHandle(g, ()=>_object_spread_props(_object_spread({},
|
|
142
|
+
return _react.useImperativeHandle(g, ()=>_object_spread_props(_object_spread({}, k), {
|
|
143
143
|
close: f
|
|
144
144
|
}), [
|
|
145
145
|
f
|
|
146
146
|
]), _react.useEffect(()=>{
|
|
147
|
-
const
|
|
147
|
+
const B = setTimeout(()=>{
|
|
148
148
|
s(!0);
|
|
149
149
|
}, 50), S = t !== 1 / 0 ? setTimeout(()=>f({
|
|
150
150
|
action: "TIMEOUT"
|
|
151
151
|
}), t) : void 0;
|
|
152
152
|
return ()=>{
|
|
153
|
-
clearTimeout(
|
|
153
|
+
clearTimeout(B), clearTimeout(S);
|
|
154
154
|
};
|
|
155
155
|
}, [
|
|
156
156
|
f,
|
|
@@ -158,7 +158,7 @@ const ee = [
|
|
|
158
158
|
]), /* @__PURE__ */ (0, _jsxruntime.jsx)(_portal.Portal, {
|
|
159
159
|
className: _snackbarcssmistica.snackbarContainer,
|
|
160
160
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
|
|
161
|
-
ref:
|
|
161
|
+
ref: k,
|
|
162
162
|
className: (0, _classnames.default)(_snackbarcssmistica.snackbar, {
|
|
163
163
|
[_snackbarcssmistica.snackbarOpen]: a
|
|
164
164
|
}),
|
|
@@ -224,7 +224,7 @@ const ee = [
|
|
|
224
224
|
action: "DISMISS"
|
|
225
225
|
});
|
|
226
226
|
},
|
|
227
|
-
"aria-label":
|
|
227
|
+
"aria-label": I !== null && I !== void 0 ? I : T.closeButtonLabel,
|
|
228
228
|
className: _snackbarcssmistica.dismissButton[l ? "topRight" : "centered"],
|
|
229
229
|
style: {
|
|
230
230
|
display: "flex",
|
|
@@ -244,24 +244,22 @@ const ee = [
|
|
|
244
244
|
})
|
|
245
245
|
});
|
|
246
246
|
}), oe = /*#__PURE__*/ _react.forwardRef((param, g)=>{
|
|
247
|
-
let { message: m, buttonText: n, buttonAccessibilityLabel: u, closeButtonLabel:
|
|
247
|
+
let { message: m, buttonText: n, buttonAccessibilityLabel: u, closeButtonLabel: I, duration: t, onClose: o = ()=>{}, type: c = "INFORMATIVE", withDismiss: d, dataAttributes: R } = param;
|
|
248
248
|
const T = n ? te : re;
|
|
249
249
|
t = Math.max(t !== null && t !== void 0 ? t : T, T);
|
|
250
|
-
const a = (0, _webviewbridge.isWebViewBridgeAvailable)(), s = _react.useRef(o),
|
|
250
|
+
const a = (0, _webviewbridge.isWebViewBridgeAvailable)(), s = _react.useRef(o), p = _react.useRef(!1);
|
|
251
251
|
return _react.useEffect(()=>{
|
|
252
252
|
s.current = o;
|
|
253
253
|
}, [
|
|
254
254
|
o
|
|
255
255
|
]), _react.useEffect(()=>{
|
|
256
|
-
a && !
|
|
256
|
+
a && !p.current && (p.current = !0, (0, _webviewbridge.nativeMessage)({
|
|
257
257
|
message: m,
|
|
258
|
-
// @ts-expect-error duration can be 'PERSISTENT' in new webview-bridge lib versions, and old apps will ignore it
|
|
259
258
|
duration: t === 1 / 0 ? "PERSISTENT" : void 0,
|
|
260
259
|
buttonText: n,
|
|
261
260
|
buttonAccessibilityLabel: u,
|
|
262
|
-
closeButtonLabel: d,
|
|
263
261
|
type: c,
|
|
264
|
-
withDismiss:
|
|
262
|
+
withDismiss: d
|
|
265
263
|
}).then((v)=>{
|
|
266
264
|
const i = v;
|
|
267
265
|
i != null && i.action && ee.includes(i.action) ? s.current({
|
|
@@ -270,27 +268,27 @@ const ee = [
|
|
|
270
268
|
action: "DISMISS"
|
|
271
269
|
});
|
|
272
270
|
}).finally(()=>{
|
|
273
|
-
|
|
271
|
+
p.current = !1;
|
|
274
272
|
}));
|
|
275
273
|
}, [
|
|
276
274
|
u,
|
|
277
|
-
|
|
275
|
+
I,
|
|
278
276
|
n,
|
|
279
277
|
t,
|
|
280
278
|
m,
|
|
281
279
|
a,
|
|
282
280
|
c,
|
|
283
|
-
|
|
281
|
+
d
|
|
284
282
|
]), a ? null : /* @__PURE__ */ (0, _jsxruntime.jsx)(ne, {
|
|
285
283
|
ref: g,
|
|
286
284
|
message: m,
|
|
287
285
|
duration: t,
|
|
288
286
|
buttonText: n,
|
|
289
287
|
buttonAccessibilityLabel: u,
|
|
290
|
-
closeButtonLabel:
|
|
288
|
+
closeButtonLabel: I,
|
|
291
289
|
type: c,
|
|
292
290
|
onClose: s.current,
|
|
293
|
-
withDismiss:
|
|
291
|
+
withDismiss: d,
|
|
294
292
|
dataAttributes: R
|
|
295
293
|
});
|
|
296
294
|
}), Se = oe;
|
package/dist/spinner.d.ts
CHANGED
package/dist/stack.d.ts
CHANGED
|
@@ -10,5 +10,5 @@ type Props = {
|
|
|
10
10
|
'aria-labelledby'?: string;
|
|
11
11
|
dataAttributes?: DataAttributes;
|
|
12
12
|
};
|
|
13
|
-
declare const Stack:
|
|
13
|
+
declare const Stack: ({ space, className, children, role, "aria-labelledby": ariaLabelledby, dataAttributes, }: Props) => JSX.Element;
|
|
14
14
|
export default Stack;
|
package/dist/stacking-group.d.ts
CHANGED
package/dist/stepper.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
import type { DataAttributes } from './utils/types';
|
|
3
3
|
type StepperProps = {
|
|
4
4
|
steps: ReadonlyArray<string>;
|
|
@@ -7,5 +7,5 @@ type StepperProps = {
|
|
|
7
7
|
children?: void;
|
|
8
8
|
dataAttributes?: DataAttributes;
|
|
9
9
|
};
|
|
10
|
-
declare const Stepper:
|
|
10
|
+
declare const Stepper: ({ steps, currentIndex, "aria-label": ariaLabel, dataAttributes, }: StepperProps) => JSX.Element;
|
|
11
11
|
export default Stepper;
|
package/dist/tab-focus.d.ts
CHANGED
package/dist/tabs.d.ts
CHANGED
package/dist/tag.d.ts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
import type { DataAttributes, IconProps } from './utils/types';
|
|
3
3
|
export type TagType = 'promo' | 'active' | 'inactive' | 'success' | 'warning' | 'error';
|
|
4
4
|
export type TagProps = {
|
|
5
5
|
type?: 'promo' | 'active' | 'inactive' | 'success' | 'warning' | 'error';
|
|
6
6
|
children: string;
|
|
7
|
-
Icon?:
|
|
7
|
+
Icon?: (props: IconProps) => JSX.Element;
|
|
8
8
|
dataAttributes?: DataAttributes;
|
|
9
9
|
badge?: boolean | number;
|
|
10
10
|
};
|
|
11
|
-
declare const Tag:
|
|
11
|
+
declare const Tag: ({ Icon, children, dataAttributes, type, badge }: TagProps) => JSX.Element | null;
|
|
12
12
|
export default Tag;
|
|
@@ -7,22 +7,22 @@ type FieldEndIconProps = {
|
|
|
7
7
|
hasBackgroundColor?: boolean;
|
|
8
8
|
disabled?: boolean;
|
|
9
9
|
} & ExclusifyUnion<{
|
|
10
|
-
Icon:
|
|
10
|
+
Icon: (props: IconProps) => JSX.Element;
|
|
11
11
|
'aria-label'?: string;
|
|
12
12
|
onPress: (event: React.MouseEvent<HTMLElement>) => void;
|
|
13
13
|
} | {
|
|
14
14
|
checkedProps: {
|
|
15
|
-
Icon:
|
|
15
|
+
Icon: (props: IconProps) => JSX.Element;
|
|
16
16
|
'aria-label'?: string;
|
|
17
17
|
};
|
|
18
18
|
uncheckedProps: {
|
|
19
|
-
Icon:
|
|
19
|
+
Icon: (props: IconProps) => JSX.Element;
|
|
20
20
|
'aria-label'?: string;
|
|
21
21
|
};
|
|
22
22
|
onChange?: (checked: boolean) => void | undefined | Promise<void>;
|
|
23
23
|
checked?: boolean;
|
|
24
24
|
}>;
|
|
25
|
-
export declare const FieldEndIcon:
|
|
25
|
+
export declare const FieldEndIcon: ({ hasBackgroundColor, onPress, onChange, disabled, Icon, checkedProps, uncheckedProps, "aria-label": ariaLabel, }: FieldEndIconProps) => JSX.Element;
|
|
26
26
|
/**
|
|
27
27
|
* Incomplete list, add more if needed
|
|
28
28
|
* https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
|
|
@@ -10,7 +10,7 @@ type LabelProps = {
|
|
|
10
10
|
style?: React.CSSProperties;
|
|
11
11
|
optional?: boolean;
|
|
12
12
|
};
|
|
13
|
-
export declare const Label:
|
|
13
|
+
export declare const Label: ({ shrinkLabel, forId, inputState, error, children, style, optional, }: LabelProps) => JSX.Element;
|
|
14
14
|
type HelperTextProps = {
|
|
15
15
|
leftText?: string;
|
|
16
16
|
rightText?: string;
|
|
@@ -18,7 +18,7 @@ type HelperTextProps = {
|
|
|
18
18
|
id?: string;
|
|
19
19
|
children?: void;
|
|
20
20
|
};
|
|
21
|
-
export declare const HelperText:
|
|
21
|
+
export declare const HelperText: ({ leftText, rightText, error, id }: HelperTextProps) => JSX.Element;
|
|
22
22
|
type FieldContainerProps = {
|
|
23
23
|
multiline?: boolean;
|
|
24
24
|
disabled?: boolean;
|
|
@@ -30,5 +30,5 @@ type FieldContainerProps = {
|
|
|
30
30
|
readOnly?: boolean;
|
|
31
31
|
dataAttributes?: DataAttributes;
|
|
32
32
|
};
|
|
33
|
-
export declare const FieldContainer:
|
|
33
|
+
export declare const FieldContainer: ({ multiline, disabled, children, helperText, className, fieldRef, fullWidth, readOnly, dataAttributes, }: FieldContainerProps) => JSX.Element;
|
|
34
34
|
export {};
|
package/dist/text-link.d.ts
CHANGED
|
@@ -18,5 +18,5 @@ interface CommonProps {
|
|
|
18
18
|
role?: string;
|
|
19
19
|
}
|
|
20
20
|
export type TextLinkProps = AlwaysTouchableComponentProps & CommonProps;
|
|
21
|
-
declare const TextLink:
|
|
21
|
+
declare const TextLink: ({ children, className, disabled, style, trackEvent, ...props }: TextLinkProps) => JSX.Element;
|
|
22
22
|
export default TextLink;
|
package/dist/text.d.ts
CHANGED
|
@@ -43,7 +43,7 @@ interface TextProps extends TextPresetProps {
|
|
|
43
43
|
letterSpacing?: number;
|
|
44
44
|
forzeMobileSize?: never;
|
|
45
45
|
}
|
|
46
|
-
export declare const Text:
|
|
46
|
+
export declare const Text: ({ weight, color, decoration, truncate, transform, wordBreak, hyphens, as, children, size, mobileSize, desktopSize, lineHeight, mobileLineHeight, desktopLineHeight, letterSpacing, textAlign, textShadow, id, role, "aria-level": ariaLevel, "aria-label": ariaLabel, dataAttributes, }: TextProps) => JSX.Element | null;
|
|
47
47
|
interface LightProps extends TextPresetProps {
|
|
48
48
|
light: boolean;
|
|
49
49
|
}
|
|
@@ -120,14 +120,14 @@ export declare const textProps: {
|
|
|
120
120
|
desktopLineHeight: string;
|
|
121
121
|
};
|
|
122
122
|
};
|
|
123
|
-
export declare const Text10:
|
|
124
|
-
export declare const Text9:
|
|
125
|
-
export declare const Text8:
|
|
126
|
-
export declare const Text7:
|
|
127
|
-
export declare const Text6:
|
|
128
|
-
export declare const Text5:
|
|
129
|
-
export declare const Text4:
|
|
130
|
-
export declare const Text3:
|
|
131
|
-
export declare const Text2:
|
|
132
|
-
export declare const Text1:
|
|
123
|
+
export declare const Text10: ({ dataAttributes, forceMobileSizes, ...props }: TextPresetProps) => JSX.Element;
|
|
124
|
+
export declare const Text9: ({ dataAttributes, forceMobileSizes, ...props }: TextPresetProps) => JSX.Element;
|
|
125
|
+
export declare const Text8: ({ dataAttributes, forceMobileSizes, ...props }: TextPresetProps) => JSX.Element;
|
|
126
|
+
export declare const Text7: ({ dataAttributes, forceMobileSizes, ...props }: TextPresetProps) => JSX.Element;
|
|
127
|
+
export declare const Text6: ({ dataAttributes, forceMobileSizes, ...props }: TextPresetProps) => JSX.Element;
|
|
128
|
+
export declare const Text5: ({ dataAttributes, forceMobileSizes, ...props }: TextPresetProps) => JSX.Element;
|
|
129
|
+
export declare const Text4: ({ dataAttributes, forceMobileSizes, ...props }: LightRegularMediumProps) => JSX.Element;
|
|
130
|
+
export declare const Text3: ({ dataAttributes, forceMobileSizes, ...props }: LightRegularMediumProps) => JSX.Element;
|
|
131
|
+
export declare const Text2: ({ dataAttributes, forceMobileSizes, ...props }: RegularMediumProps) => JSX.Element;
|
|
132
|
+
export declare const Text1: ({ dataAttributes, forceMobileSizes, ...props }: RegularMediumProps) => JSX.Element;
|
|
133
133
|
export default Text;
|
|
@@ -7,5 +7,5 @@ type Props = {
|
|
|
7
7
|
withoutStyles?: boolean;
|
|
8
8
|
children?: React.ReactNode;
|
|
9
9
|
};
|
|
10
|
-
declare const ThemeContextProvider:
|
|
10
|
+
declare const ThemeContextProvider: ({ theme, children, as, withoutStyles }: Props) => JSX.Element;
|
|
11
11
|
export default ThemeContextProvider;
|
|
@@ -5,7 +5,7 @@ type ThemeVariantProps = {
|
|
|
5
5
|
variant?: Variant;
|
|
6
6
|
children: React.ReactNode;
|
|
7
7
|
};
|
|
8
|
-
export declare const ThemeVariant:
|
|
8
|
+
export declare const ThemeVariant: ({ isInverse, variant, children }: ThemeVariantProps) => JSX.Element;
|
|
9
9
|
export declare const useThemeVariant: () => Variant;
|
|
10
10
|
export declare const useIsInverseVariant: () => boolean;
|
|
11
11
|
export {};
|
package/dist/timer.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
import type { DataAttributes } from './utils/types';
|
|
3
3
|
export type TimeUnit = 'days' | 'hours' | 'minutes' | 'seconds';
|
|
4
4
|
type Label = 'none' | 'short' | 'long';
|
|
@@ -22,6 +22,6 @@ interface TextTimerProps extends BaseProps {
|
|
|
22
22
|
interface TimerProps extends BaseProps {
|
|
23
23
|
boxed?: boolean;
|
|
24
24
|
}
|
|
25
|
-
export declare const TextTimer:
|
|
26
|
-
export declare const Timer:
|
|
25
|
+
export declare const TextTimer: ({ endTimestamp, labelType, minTimeUnit, maxTimeUnit, onProgress, dataAttributes, "aria-label": ariaLabel, }: TextTimerProps) => JSX.Element;
|
|
26
|
+
export declare const Timer: ({ boxed, endTimestamp, minTimeUnit, maxTimeUnit, onProgress, dataAttributes, "aria-label": ariaLabel, }: TimerProps) => JSX.Element;
|
|
27
27
|
export {};
|
package/dist/tooltip.d.ts
CHANGED
|
@@ -28,6 +28,6 @@ type BaseTooltipProps = {
|
|
|
28
28
|
closeButtonLabel?: string;
|
|
29
29
|
trackingEvent?: TrackingEvent | ReadonlyArray<TrackingEvent>;
|
|
30
30
|
};
|
|
31
|
-
export declare const BaseTooltip:
|
|
32
|
-
declare const Tooltip:
|
|
31
|
+
export declare const BaseTooltip: ({ content, target, width, position, dataAttributes, delay, centerContent, open, onClose, closeButtonLabel, hasPointerInteractionOnly, trackingEvent, }: BaseTooltipProps) => JSX.Element;
|
|
32
|
+
declare const Tooltip: ({ centerContent, extra, children, dataAttributes, title, description, ...props }: Props) => JSX.Element;
|
|
33
33
|
export default Tooltip;
|
|
@@ -3,7 +3,7 @@ import type { DataAttributes } from './types';
|
|
|
3
3
|
type Props = {
|
|
4
4
|
children: React.ReactNode;
|
|
5
5
|
};
|
|
6
|
-
export declare const AspectRatioSupportProvider:
|
|
6
|
+
export declare const AspectRatioSupportProvider: ({ children }: Props) => JSX.Element;
|
|
7
7
|
export declare const useSupportsAspectRatio: () => boolean;
|
|
8
8
|
type AspectRatioContainerProps = {
|
|
9
9
|
width?: number | string;
|
|
@@ -3,6 +3,6 @@ type Props = {
|
|
|
3
3
|
hidden?: boolean;
|
|
4
4
|
children: React.ReactNode;
|
|
5
5
|
};
|
|
6
|
-
export declare const DocumentVisibilityProvider:
|
|
6
|
+
export declare const DocumentVisibilityProvider: ({ hidden, children }: Props) => JSX.Element;
|
|
7
7
|
export declare const useDocumentVisibility: () => boolean;
|
|
8
8
|
export {};
|
package/dist-es/dialog.js
CHANGED
|
@@ -98,35 +98,35 @@ import Q from "./stack.js";
|
|
|
98
98
|
import { ANIMATION_DURATION_MS as X, wrapper as Z, modalOpacityLayer as $, closedOpactityLayer as ee, modalContent as te, closedModalContent as ne, modalCloseButtonContainer as oe, variants as ae, iconContainer as re, dialogContent as ie, dialogActions as se } from "./dialog.css-mistica.js";
|
|
99
99
|
import { vars as le } from "./skins/skin-contract.css-mistica.js";
|
|
100
100
|
const ce = ()=>process.env.NODE_ENV !== "test" && !H(), ue = (t)=>{
|
|
101
|
-
const { texts:
|
|
101
|
+
const { texts: l } = D(), { className: m, title: i, message: g, icon: a, extra: r, showCancelButton: s, showAcceptButton: c, cancelText: d = l.dialogCancelButton, acceptText: h = l.dialogAcceptButton, onCancel: u, onAccept: C, destructive: B = !1 } = t, f = t.type === "dialog", p = f && !!t.link || c || s, y = {
|
|
102
102
|
onPress: C || (()=>{}),
|
|
103
|
-
children:
|
|
103
|
+
children: h,
|
|
104
104
|
// @deprecated - testid should be removed but many webapp tests depend on this
|
|
105
105
|
dataAttributes: {
|
|
106
106
|
testid: "dialog-accept-button"
|
|
107
107
|
}
|
|
108
108
|
};
|
|
109
109
|
return /* @__PURE__ */ w("div", {
|
|
110
|
-
className: E(ae[
|
|
110
|
+
className: E(ae[f ? "dialog" : "default"], m),
|
|
111
111
|
children: [
|
|
112
|
-
|
|
112
|
+
a && /* @__PURE__ */ e(k, {
|
|
113
113
|
paddingBottom: 24,
|
|
114
114
|
children: /* @__PURE__ */ e("div", {
|
|
115
115
|
className: re,
|
|
116
|
-
children: /*#__PURE__*/ n.cloneElement(
|
|
116
|
+
children: /*#__PURE__*/ n.cloneElement(a, {
|
|
117
117
|
size: "100%"
|
|
118
118
|
})
|
|
119
119
|
})
|
|
120
120
|
}),
|
|
121
|
-
|
|
121
|
+
i && /* @__PURE__ */ e(k, {
|
|
122
122
|
paddingBottom: 16,
|
|
123
|
-
children:
|
|
123
|
+
children: f ? /* @__PURE__ */ e(Y, {
|
|
124
124
|
as: "h2",
|
|
125
|
-
children:
|
|
125
|
+
children: i
|
|
126
126
|
}) : /* @__PURE__ */ e(A, {
|
|
127
127
|
regular: !0,
|
|
128
128
|
as: "h2",
|
|
129
|
-
children:
|
|
129
|
+
children: i
|
|
130
130
|
})
|
|
131
131
|
}),
|
|
132
132
|
t.subtitle && /* @__PURE__ */ e(k, {
|
|
@@ -145,167 +145,169 @@ const ce = ()=>process.env.NODE_ENV !== "test" && !H(), ue = (t)=>{
|
|
|
145
145
|
/* @__PURE__ */ e(q, {
|
|
146
146
|
color: le.colors.textSecondary,
|
|
147
147
|
regular: !0,
|
|
148
|
-
children:
|
|
148
|
+
children: g
|
|
149
149
|
}),
|
|
150
|
-
|
|
150
|
+
r
|
|
151
151
|
]
|
|
152
152
|
})
|
|
153
153
|
}),
|
|
154
154
|
p && /* @__PURE__ */ e("div", {
|
|
155
155
|
className: se,
|
|
156
156
|
children: /* @__PURE__ */ e(U, {
|
|
157
|
-
link:
|
|
158
|
-
primaryButton:
|
|
157
|
+
link: f ? t.link : void 0,
|
|
158
|
+
primaryButton: c ? B ? /* @__PURE__ */ e(O, _object_spread({
|
|
159
159
|
tabIndex: 1
|
|
160
160
|
}, y)) : /* @__PURE__ */ e(S, _object_spread({
|
|
161
161
|
tabIndex: 1
|
|
162
162
|
}, y)) : void 0,
|
|
163
163
|
secondaryButton: s ? /* @__PURE__ */ e(M, {
|
|
164
164
|
tabIndex: 2,
|
|
165
|
-
onPress:
|
|
165
|
+
onPress: u || (()=>{}),
|
|
166
166
|
dataAttributes: {
|
|
167
167
|
testid: "dialog-cancel-button"
|
|
168
168
|
},
|
|
169
|
-
children:
|
|
169
|
+
children: d
|
|
170
170
|
}) : void 0
|
|
171
171
|
})
|
|
172
172
|
})
|
|
173
173
|
]
|
|
174
174
|
});
|
|
175
175
|
}, de = (param)=>{
|
|
176
|
-
let { type: t, message:
|
|
176
|
+
let { type: t, message: l, title: m, acceptText: i, cancelText: g, destructive: a, onAccept: r, onCancel: s, onDestroy: c } = param;
|
|
177
177
|
return t === "confirm" ? z({
|
|
178
|
-
message:
|
|
179
|
-
title:
|
|
180
|
-
cancelText:
|
|
181
|
-
acceptText:
|
|
182
|
-
|
|
183
|
-
|
|
178
|
+
message: l,
|
|
179
|
+
title: m,
|
|
180
|
+
cancelText: g,
|
|
181
|
+
acceptText: i,
|
|
182
|
+
destructive: a
|
|
183
|
+
}).then((d)=>{
|
|
184
|
+
d ? r == null || r() : s == null || s(), c();
|
|
184
185
|
}) : K({
|
|
185
|
-
message:
|
|
186
|
-
title:
|
|
187
|
-
buttonText:
|
|
186
|
+
message: l,
|
|
187
|
+
title: m,
|
|
188
|
+
buttonText: i
|
|
188
189
|
}).then(()=>{
|
|
189
|
-
|
|
190
|
+
r == null || r(), c();
|
|
190
191
|
});
|
|
191
192
|
}, me = (param)=>{
|
|
192
|
-
let { type: t, onAccept:
|
|
193
|
-
const { texts:
|
|
193
|
+
let { type: t, onAccept: l, onCancel: m, onDestroy: i, acceptText: g, cancelText: a, message: r, title: s, destructive: c } = param;
|
|
194
|
+
const { texts: d } = D(), h = n.useRef({
|
|
194
195
|
type: t,
|
|
195
|
-
onAccept:
|
|
196
|
-
onCancel:
|
|
197
|
-
onDestroy:
|
|
198
|
-
acceptText:
|
|
199
|
-
cancelText:
|
|
200
|
-
message:
|
|
201
|
-
title: s
|
|
202
|
-
|
|
196
|
+
onAccept: l,
|
|
197
|
+
onCancel: m,
|
|
198
|
+
onDestroy: i,
|
|
199
|
+
acceptText: g || d.dialogAcceptButton,
|
|
200
|
+
cancelText: a || d.dialogCancelButton,
|
|
201
|
+
message: r,
|
|
202
|
+
title: s,
|
|
203
|
+
destructive: c
|
|
204
|
+
}), u = n.useRef(!1);
|
|
203
205
|
return n.useEffect(()=>{
|
|
204
|
-
|
|
205
|
-
|
|
206
|
+
u.current || (u.current = !0, de(h.current).finally(()=>{
|
|
207
|
+
u.current = !1;
|
|
206
208
|
}));
|
|
207
209
|
}, []), /* @__PURE__ */ e(L, {});
|
|
208
210
|
}, Ie = (t)=>{
|
|
209
211
|
J();
|
|
210
|
-
const
|
|
212
|
+
const l = n.useRef(null), { texts: m } = D(), [i, g] = n.useState(!1), a = n.useRef(!1), r = n.useRef(!1), [s, c] = n.useState(!1), d = n.useRef(!1), h = n.useRef(ce() ? X : 0), u = t.type !== "dialog" && W(), C = t.type === "dialog", B = t.type === "alert", { onAccept: f, onCancel: p, onDestroy: y } = t, I = _object_without_properties(t, [
|
|
211
213
|
"onAccept",
|
|
212
214
|
"onCancel",
|
|
213
215
|
"onDestroy"
|
|
214
216
|
]);
|
|
215
217
|
n.useEffect(()=>{
|
|
216
|
-
const
|
|
217
|
-
|
|
218
|
-
},
|
|
218
|
+
const o = setTimeout(()=>{
|
|
219
|
+
a.current || c(!0);
|
|
220
|
+
}, h.current);
|
|
219
221
|
return ()=>{
|
|
220
|
-
clearTimeout(
|
|
222
|
+
clearTimeout(o);
|
|
221
223
|
};
|
|
222
224
|
}, []);
|
|
223
225
|
const x = n.useCallback(()=>{
|
|
224
|
-
|
|
226
|
+
r.current || (r.current = !0, d.current ? f == null || f() : p == null || p(), y());
|
|
225
227
|
}, [
|
|
226
|
-
|
|
228
|
+
f,
|
|
227
229
|
p,
|
|
228
230
|
y
|
|
229
231
|
]), R = n.useCallback(()=>{
|
|
230
|
-
let
|
|
231
|
-
return !
|
|
232
|
-
|
|
232
|
+
let o;
|
|
233
|
+
return !a.current && s && (a.current = !0, c(!1), g(!0), o = setTimeout(x, h.current)), ()=>{
|
|
234
|
+
o && clearTimeout(o);
|
|
233
235
|
};
|
|
234
236
|
}, [
|
|
235
237
|
x,
|
|
236
238
|
s
|
|
237
239
|
]), N = n.useCallback(()=>{
|
|
238
|
-
|
|
240
|
+
d.current = !0, R();
|
|
239
241
|
}, [
|
|
240
242
|
R
|
|
241
243
|
]), b = n.useCallback(()=>{
|
|
242
|
-
|
|
244
|
+
d.current = !1, R();
|
|
243
245
|
}, [
|
|
244
246
|
R
|
|
245
247
|
]), v = n.useCallback(()=>{
|
|
246
|
-
|
|
248
|
+
a.current || (B ? N() : b());
|
|
247
249
|
}, [
|
|
248
250
|
N,
|
|
249
251
|
b,
|
|
250
252
|
B
|
|
251
|
-
]), T = n.useCallback((
|
|
252
|
-
|
|
253
|
+
]), T = n.useCallback((o)=>{
|
|
254
|
+
o.key === G && (o.stopPropagation(), o.preventDefault(), v());
|
|
253
255
|
}, [
|
|
254
256
|
v
|
|
255
257
|
]);
|
|
256
258
|
n.useEffect(()=>{
|
|
257
|
-
if (!
|
|
259
|
+
if (!u) return document.addEventListener("keydown", T), ()=>{
|
|
258
260
|
document.removeEventListener("keydown", T);
|
|
259
261
|
};
|
|
260
262
|
}, [
|
|
261
263
|
T,
|
|
262
|
-
|
|
264
|
+
u
|
|
263
265
|
]), n.useEffect(()=>{
|
|
264
|
-
if (!
|
|
266
|
+
if (!u) return window.addEventListener("popstate", v), ()=>{
|
|
265
267
|
window.removeEventListener("popstate", v);
|
|
266
268
|
};
|
|
267
269
|
}, [
|
|
268
270
|
v,
|
|
269
|
-
|
|
271
|
+
u
|
|
270
272
|
]);
|
|
271
|
-
const P = n.useCallback((
|
|
272
|
-
|
|
273
|
+
const P = n.useCallback((o)=>{
|
|
274
|
+
o.stopPropagation(), C && b();
|
|
273
275
|
}, [
|
|
274
276
|
C,
|
|
275
277
|
b
|
|
276
278
|
]);
|
|
277
279
|
var _t_closeButtonLabel;
|
|
278
|
-
return
|
|
280
|
+
return u ? /* @__PURE__ */ e(me, _object_spread({}, t)) : /* @__PURE__ */ e(_, {
|
|
279
281
|
className: Z,
|
|
280
282
|
children: /* @__PURE__ */ e(j, {
|
|
281
283
|
children: /* @__PURE__ */ e("div", {
|
|
282
284
|
onClick: P,
|
|
283
285
|
className: E($, {
|
|
284
|
-
[ee]:
|
|
286
|
+
[ee]: i
|
|
285
287
|
}),
|
|
286
288
|
"data-testid": "dialog-overlay",
|
|
287
|
-
"aria-hidden":
|
|
289
|
+
"aria-hidden": i || !s,
|
|
288
290
|
children: /* @__PURE__ */ e("div", {
|
|
289
291
|
role: "dialog",
|
|
290
|
-
onClick: (
|
|
292
|
+
onClick: (o)=>o.stopPropagation(),
|
|
291
293
|
"data-component-name": "Dialog",
|
|
292
294
|
children: /* @__PURE__ */ w("div", {
|
|
293
|
-
ref:
|
|
294
|
-
onAnimationEnd: (
|
|
295
|
-
|
|
295
|
+
ref: l,
|
|
296
|
+
onAnimationEnd: (o)=>{
|
|
297
|
+
o.target === l.current && (a.current || c(!0));
|
|
296
298
|
},
|
|
297
|
-
onTransitionEnd: (
|
|
298
|
-
|
|
299
|
+
onTransitionEnd: (o)=>{
|
|
300
|
+
o.target === l.current && a.current && x();
|
|
299
301
|
},
|
|
300
302
|
className: E(te, {
|
|
301
|
-
[ne]:
|
|
303
|
+
[ne]: i
|
|
302
304
|
}),
|
|
303
305
|
children: [
|
|
304
306
|
C && /* @__PURE__ */ e("div", {
|
|
305
307
|
className: oe,
|
|
306
308
|
children: /* @__PURE__ */ e(V, {
|
|
307
309
|
onPress: v,
|
|
308
|
-
"aria-label": (_t_closeButtonLabel = t.closeButtonLabel) !== null && _t_closeButtonLabel !== void 0 ? _t_closeButtonLabel :
|
|
310
|
+
"aria-label": (_t_closeButtonLabel = t.closeButtonLabel) !== null && _t_closeButtonLabel !== void 0 ? _t_closeButtonLabel : m.modalClose || m.closeButtonLabel,
|
|
309
311
|
bleedLeft: !0,
|
|
310
312
|
bleedRight: !0,
|
|
311
313
|
bleedY: !0,
|