@hjmds/react-native 1.18.0 → 1.20.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/README.md +8 -8
- package/dist/actions.d.ts +3 -23
- package/dist/actions.d.ts.map +1 -1
- package/dist/actions.js +7 -10
- package/dist/actions.js.map +1 -1
- package/dist/agreement.d.ts +1 -7
- package/dist/agreement.d.ts.map +1 -1
- package/dist/agreement.js +21 -15
- package/dist/agreement.js.map +1 -1
- package/dist/asset.d.ts +2 -13
- package/dist/asset.d.ts.map +1 -1
- package/dist/asset.js +4 -7
- package/dist/asset.js.map +1 -1
- package/dist/bottom-info.d.ts +1 -7
- package/dist/bottom-info.d.ts.map +1 -1
- package/dist/bottom-info.js +2 -4
- package/dist/bottom-info.js.map +1 -1
- package/dist/carousel-motion.d.ts +1 -0
- package/dist/carousel-motion.d.ts.map +1 -1
- package/dist/carousel-motion.js +5 -3
- package/dist/carousel-motion.js.map +1 -1
- package/dist/carousel.d.ts +1 -7
- package/dist/carousel.d.ts.map +1 -1
- package/dist/carousel.js +14 -6
- package/dist/carousel.js.map +1 -1
- package/dist/collapsible.d.ts +1 -7
- package/dist/collapsible.d.ts.map +1 -1
- package/dist/collapsible.js +4 -4
- package/dist/collapsible.js.map +1 -1
- package/dist/data-display.d.ts +19 -153
- package/dist/data-display.d.ts.map +1 -1
- package/dist/data-display.js +73 -90
- package/dist/data-display.js.map +1 -1
- package/dist/date-entry.d.ts +1 -0
- package/dist/date-entry.d.ts.map +1 -1
- package/dist/date-entry.js +22 -20
- package/dist/date-entry.js.map +1 -1
- package/dist/date-picker.d.ts +1 -7
- package/dist/date-picker.d.ts.map +1 -1
- package/dist/date-picker.js +19 -11
- package/dist/date-picker.js.map +1 -1
- package/dist/duration-field.d.ts +1 -1
- package/dist/duration-field.d.ts.map +1 -1
- package/dist/duration-field.js +11 -9
- package/dist/duration-field.js.map +1 -1
- package/dist/evidence.d.ts +1 -1
- package/dist/evidence.js +1 -1
- package/dist/feedback.d.ts +8 -88
- package/dist/feedback.d.ts.map +1 -1
- package/dist/feedback.js +72 -62
- package/dist/feedback.js.map +1 -1
- package/dist/field-group.d.ts +3 -2
- package/dist/field-group.d.ts.map +1 -1
- package/dist/field-group.js +7 -4
- package/dist/field-group.js.map +1 -1
- package/dist/file-picker.d.ts +1 -7
- package/dist/file-picker.d.ts.map +1 -1
- package/dist/file-picker.js +21 -11
- package/dist/file-picker.js.map +1 -1
- package/dist/forms.d.ts +6 -21
- package/dist/forms.d.ts.map +1 -1
- package/dist/forms.js +29 -35
- package/dist/forms.js.map +1 -1
- package/dist/gravity-letters.d.ts.map +1 -1
- package/dist/gravity-letters.js +13 -5
- package/dist/gravity-letters.js.map +1 -1
- package/dist/grid-reveal.d.ts.map +1 -1
- package/dist/grid-reveal.js +10 -2
- package/dist/grid-reveal.js.map +1 -1
- package/dist/heading.d.ts +1 -7
- package/dist/heading.d.ts.map +1 -1
- package/dist/heading.js +1 -4
- package/dist/heading.js.map +1 -1
- package/dist/image-viewer.d.ts.map +1 -1
- package/dist/image-viewer.js +2 -1
- package/dist/image-viewer.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/inline-confirm.d.ts.map +1 -1
- package/dist/inline-confirm.js +5 -1
- package/dist/inline-confirm.js.map +1 -1
- package/dist/inputs.d.ts +4 -71
- package/dist/inputs.d.ts.map +1 -1
- package/dist/inputs.js +25 -50
- package/dist/inputs.js.map +1 -1
- package/dist/internal/accessible-focus.d.ts +3 -0
- package/dist/internal/accessible-focus.d.ts.map +1 -0
- package/dist/internal/accessible-focus.js +15 -0
- package/dist/internal/accessible-focus.js.map +1 -0
- package/dist/internal/diagnostics.d.ts +7 -0
- package/dist/internal/diagnostics.d.ts.map +1 -0
- package/dist/internal/diagnostics.js +20 -0
- package/dist/internal/diagnostics.js.map +1 -0
- package/dist/internal/document-resource.d.ts.map +1 -1
- package/dist/internal/document-resource.js +2 -2
- package/dist/internal/document-resource.js.map +1 -1
- package/dist/internal/spinner.d.ts +1 -7
- package/dist/internal/spinner.d.ts.map +1 -1
- package/dist/internal/spinner.js +2 -4
- package/dist/internal/spinner.js.map +1 -1
- package/dist/masonry.d.ts.map +1 -1
- package/dist/masonry.js +2 -1
- package/dist/masonry.js.map +1 -1
- package/dist/mentions.d.ts +1 -7
- package/dist/mentions.d.ts.map +1 -1
- package/dist/mentions.js +11 -7
- package/dist/mentions.js.map +1 -1
- package/dist/navigation.d.ts +4 -74
- package/dist/navigation.d.ts.map +1 -1
- package/dist/navigation.js +97 -45
- package/dist/navigation.js.map +1 -1
- package/dist/number-field.d.ts +1 -21
- package/dist/number-field.d.ts.map +1 -1
- package/dist/number-field.js +6 -5
- package/dist/number-field.js.map +1 -1
- package/dist/overlays.d.ts +7 -16
- package/dist/overlays.d.ts.map +1 -1
- package/dist/overlays.js +220 -213
- package/dist/overlays.js.map +1 -1
- package/dist/primitives.d.ts +3 -18
- package/dist/primitives.d.ts.map +1 -1
- package/dist/primitives.js +8 -10
- package/dist/primitives.js.map +1 -1
- package/dist/provider-button.d.ts +1 -7
- package/dist/provider-button.d.ts.map +1 -1
- package/dist/provider-button.js +1 -4
- package/dist/provider-button.js.map +1 -1
- package/dist/provider.d.ts.map +1 -1
- package/dist/provider.js +9 -1
- package/dist/provider.js.map +1 -1
- package/dist/saved-items.d.ts.map +1 -1
- package/dist/saved-items.js +6 -1
- package/dist/saved-items.js.map +1 -1
- package/dist/screen-flows.d.ts +1 -2
- package/dist/screen-flows.d.ts.map +1 -1
- package/dist/screen-flows.js +60 -16
- package/dist/screen-flows.js.map +1 -1
- package/dist/screens.d.ts.map +1 -1
- package/dist/screens.js +21 -10
- package/dist/screens.js.map +1 -1
- package/dist/sheet-gesture.d.ts.map +1 -1
- package/dist/sheet-gesture.js +6 -3
- package/dist/sheet-gesture.js.map +1 -1
- package/dist/slider.d.ts +1 -21
- package/dist/slider.d.ts.map +1 -1
- package/dist/slider.js +3 -5
- package/dist/slider.js.map +1 -1
- package/dist/sortable.d.ts.map +1 -1
- package/dist/sortable.js +2 -1
- package/dist/sortable.js.map +1 -1
- package/dist/status-text.d.ts +17 -0
- package/dist/status-text.d.ts.map +1 -0
- package/dist/status-text.js +18 -0
- package/dist/status-text.js.map +1 -0
- package/dist/steps.d.ts +1 -7
- package/dist/steps.d.ts.map +1 -1
- package/dist/steps.js +2 -4
- package/dist/steps.js.map +1 -1
- package/dist/swipe-actions.d.ts.map +1 -1
- package/dist/swipe-actions.js +13 -2
- package/dist/swipe-actions.js.map +1 -1
- package/dist/tags-input.d.ts +1 -7
- package/dist/tags-input.d.ts.map +1 -1
- package/dist/tags-input.js +2 -4
- package/dist/tags-input.js.map +1 -1
- package/dist/toggle-group.d.ts +1 -7
- package/dist/toggle-group.d.ts.map +1 -1
- package/dist/toggle-group.js +10 -5
- package/dist/toggle-group.js.map +1 -1
- package/dist/top.d.ts +1 -7
- package/dist/top.d.ts.map +1 -1
- package/dist/top.js +1 -4
- package/dist/top.js.map +1 -1
- package/dist/transfer-list.d.ts +2 -8
- package/dist/transfer-list.d.ts.map +1 -1
- package/dist/transfer-list.js +30 -11
- package/dist/transfer-list.js.map +1 -1
- package/dist/upload-item.d.ts +1 -7
- package/dist/upload-item.d.ts.map +1 -1
- package/dist/upload-item.js +2 -4
- package/dist/upload-item.js.map +1 -1
- package/dist/virtual-list.d.ts.map +1 -1
- package/dist/virtual-list.js +2 -1
- package/dist/virtual-list.js.map +1 -1
- package/docs/liquid-toast.md +9 -0
- package/package.json +9 -3
- package/dist/internal/deprecated-style.d.ts +0 -8
- package/dist/internal/deprecated-style.d.ts.map +0 -1
- package/dist/internal/deprecated-style.js +0 -34
- package/dist/internal/deprecated-style.js.map +0 -1
package/dist/feedback.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import { emptyStateRecipe, skeletonRecipe, type NoticeTone as ContractNoticeTone
|
|
|
2
2
|
import { type ResultDescriptor, type ResultStatus } from "@hjmds/design-contracts/components/result";
|
|
3
3
|
import { type ToastDescriptor, type ToastDismissReason, type ToastDuplicatePolicy, type ToastOverflowPolicy, type ToastPauseReason, type ToastPublishResult, type ToastTimerUpdatePolicy } from "@hjmds/design-contracts/components/toast";
|
|
4
4
|
import { type ReactNode } from "react";
|
|
5
|
-
import { type ViewProps, type
|
|
5
|
+
import { type ViewProps, type ViewStyle } from "react-native";
|
|
6
6
|
import type { ToastPresentationAdapter } from "./internal/toast-presentation.js";
|
|
7
7
|
export type { ToastPresentationAdapter } from "./internal/toast-presentation.js";
|
|
8
8
|
import type { HjmCompositionStyleProp } from "./composition-style.js";
|
|
@@ -21,15 +21,10 @@ export type NoticeProps = Omit<ViewProps, "children" | "style"> & Readonly<{
|
|
|
21
21
|
icon?: ReactNode;
|
|
22
22
|
renderIcon?: (props: NoticeIconRenderProps) => ReactNode;
|
|
23
23
|
action?: ReactNode;
|
|
24
|
-
/**
|
|
25
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `layoutStyle` for placement and `tone` for appearance.
|
|
26
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
27
|
-
*/
|
|
28
|
-
style?: StyleProp<ViewStyle>;
|
|
29
24
|
/** Canonical layout-only placement. Controlled visual keys are excluded. */
|
|
30
25
|
layoutStyle?: HjmCompositionStyleProp;
|
|
31
26
|
}>;
|
|
32
|
-
export declare function Notice({ title, description, tone, announcement, icon, renderIcon, action,
|
|
27
|
+
export declare function Notice({ title, description, tone, announcement, icon, renderIcon, action, layoutStyle, ...props }: NoticeProps): import("react").JSX.Element;
|
|
33
28
|
export type EmptyStateAlign = "center" | "upper";
|
|
34
29
|
export type EmptyStateProps = Omit<ViewProps, "children" | "style"> & Readonly<{
|
|
35
30
|
title?: string;
|
|
@@ -41,35 +36,10 @@ export type EmptyStateProps = Omit<ViewProps, "children" | "style"> & Readonly<{
|
|
|
41
36
|
announcement?: AnnouncementMode;
|
|
42
37
|
accessibilityLabel?: string;
|
|
43
38
|
titleRole?: "header";
|
|
44
|
-
/**
|
|
45
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `layoutStyle` for placement and `density`/`align` for appearance.
|
|
46
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
47
|
-
*/
|
|
48
|
-
style?: StyleProp<ViewStyle>;
|
|
49
|
-
/**
|
|
50
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `illustration` content and `density` for appearance.
|
|
51
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
52
|
-
*/
|
|
53
|
-
illustrationStyle?: StyleProp<ViewStyle>;
|
|
54
|
-
/**
|
|
55
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use the empty-state typography recipe for appearance.
|
|
56
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
57
|
-
*/
|
|
58
|
-
titleStyle?: StyleProp<TextStyle>;
|
|
59
|
-
/**
|
|
60
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use the empty-state typography recipe for appearance.
|
|
61
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
62
|
-
*/
|
|
63
|
-
descriptionStyle?: StyleProp<TextStyle>;
|
|
64
|
-
/**
|
|
65
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use the `action` node's own semantic props for appearance.
|
|
66
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
67
|
-
*/
|
|
68
|
-
actionStyle?: StyleProp<ViewStyle>;
|
|
69
39
|
/** Canonical layout-only placement. Controlled visual keys are excluded. */
|
|
70
40
|
layoutStyle?: HjmCompositionStyleProp;
|
|
71
41
|
}>;
|
|
72
|
-
export declare function EmptyState({ title, description, illustration, action, density, align, announcement, accessibilityLabel, titleRole,
|
|
42
|
+
export declare function EmptyState({ title, description, illustration, action, density, align, announcement, accessibilityLabel, titleRole, layoutStyle, ...props }: EmptyStateProps): import("react").JSX.Element;
|
|
73
43
|
export type ResultIconRenderProps = Readonly<{
|
|
74
44
|
status: ResultStatus;
|
|
75
45
|
color: string;
|
|
@@ -77,16 +47,11 @@ export type ResultIconRenderProps = Readonly<{
|
|
|
77
47
|
}>;
|
|
78
48
|
export type ResultProps = Omit<ViewProps, "children" | "style"> & ResultDescriptor & Readonly<{
|
|
79
49
|
renderIcon?: (props: ResultIconRenderProps) => ReactNode;
|
|
80
|
-
/**
|
|
81
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `layoutStyle` for placement and `status` for appearance.
|
|
82
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
83
|
-
*/
|
|
84
|
-
style?: StyleProp<ViewStyle>;
|
|
85
50
|
/** Canonical layout-only placement. Controlled visual keys are excluded. */
|
|
86
51
|
layoutStyle?: HjmCompositionStyleProp;
|
|
87
52
|
}>;
|
|
88
53
|
/** Terminal flow outcome with platform announcement and canonical actions. */
|
|
89
|
-
export declare function Result({ status, title, description, actions, renderIcon,
|
|
54
|
+
export declare function Result({ status, title, description, actions, renderIcon, layoutStyle, ...props }: ResultProps): import("react").JSX.Element;
|
|
90
55
|
type ProgressName = Readonly<{
|
|
91
56
|
label: string;
|
|
92
57
|
accessibilityLabel?: string;
|
|
@@ -109,36 +74,11 @@ export type ProgressProps = ProgressName & Readonly<{
|
|
|
109
74
|
/** Content inside the ring. Ignored when linear. */
|
|
110
75
|
children?: ReactNode;
|
|
111
76
|
tone?: ProgressTone;
|
|
112
|
-
/**
|
|
113
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `layoutStyle` for placement and `tone`/`size`/`shape` for appearance.
|
|
114
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
115
|
-
*/
|
|
116
|
-
style?: StyleProp<ViewStyle>;
|
|
117
|
-
/**
|
|
118
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use the progress label typography recipe for appearance.
|
|
119
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
120
|
-
*/
|
|
121
|
-
labelStyle?: StyleProp<TextStyle>;
|
|
122
|
-
/**
|
|
123
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `valueText` and the progress typography recipe for appearance.
|
|
124
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
125
|
-
*/
|
|
126
|
-
valueStyle?: StyleProp<TextStyle>;
|
|
127
|
-
/**
|
|
128
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `size`/`shape` for appearance.
|
|
129
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
130
|
-
*/
|
|
131
|
-
trackStyle?: StyleProp<ViewStyle>;
|
|
132
|
-
/**
|
|
133
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `tone` for appearance.
|
|
134
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
135
|
-
*/
|
|
136
|
-
indicatorStyle?: StyleProp<ViewStyle>;
|
|
137
77
|
/** Canonical layout-only placement. Controlled visual keys are excluded. */
|
|
138
78
|
layoutStyle?: HjmCompositionStyleProp;
|
|
139
79
|
testID?: string;
|
|
140
80
|
}>;
|
|
141
|
-
export declare function Progress({ value, max, label, accessibilityLabel, valueText, accessibilityHint, size, tone, shape, children,
|
|
81
|
+
export declare function Progress({ value, max, label, accessibilityLabel, valueText, accessibilityHint, size, tone, shape, children, layoutStyle, testID, }: ProgressProps): import("react").JSX.Element;
|
|
142
82
|
export { Spinner, type SpinnerProps } from "./internal/spinner.js";
|
|
143
83
|
export type SkeletonShape = keyof typeof skeletonRecipe.shapes;
|
|
144
84
|
export type SkeletonProps = Readonly<{
|
|
@@ -148,11 +88,6 @@ export type SkeletonProps = Readonly<{
|
|
|
148
88
|
height?: number;
|
|
149
89
|
radius?: number;
|
|
150
90
|
accessibilityLabel?: string;
|
|
151
|
-
/**
|
|
152
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `layoutStyle` for placement and `shape`/`width`/`height` for appearance.
|
|
153
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
154
|
-
*/
|
|
155
|
-
style?: StyleProp<ViewStyle>;
|
|
156
91
|
/** Canonical layout-only placement. Controlled visual keys are excluded. */
|
|
157
92
|
layoutStyle?: HjmCompositionStyleProp;
|
|
158
93
|
}>;
|
|
@@ -164,17 +99,12 @@ export type SkeletonProps = Readonly<{
|
|
|
164
99
|
* width/height/radius stay for callers already on the 0.9 train and win over
|
|
165
100
|
* `shape`. Migration: .changeset/skeleton-pulse-by-default.md
|
|
166
101
|
*/
|
|
167
|
-
export declare function Skeleton({ shape, animated, width, height, radius: radiusValue, accessibilityLabel,
|
|
102
|
+
export declare function Skeleton({ shape, animated, width, height, radius: radiusValue, accessibilityLabel, layoutStyle, }: SkeletonProps): import("react").JSX.Element;
|
|
168
103
|
export type ToastProps = Readonly<{
|
|
169
104
|
descriptor: ToastDescriptor;
|
|
170
105
|
onDismiss?: (reason: ToastDismissReason) => void;
|
|
171
106
|
placement?: ToastPlacement;
|
|
172
107
|
renderToneIcon?: (props: ToastToneIconRenderProps) => ReactNode;
|
|
173
|
-
/**
|
|
174
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `layoutStyle` for placement and the descriptor `tone`/`placement` for appearance.
|
|
175
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
176
|
-
*/
|
|
177
|
-
style?: StyleProp<ViewStyle>;
|
|
178
108
|
/** Canonical layout-only placement. Controlled visual keys are excluded. */
|
|
179
109
|
layoutStyle?: HjmCompositionStyleProp;
|
|
180
110
|
}>;
|
|
@@ -185,7 +115,7 @@ export type ToastToneIconRenderProps = Readonly<{
|
|
|
185
115
|
tone: ToastTone;
|
|
186
116
|
}>;
|
|
187
117
|
/** One Native toast driven by the same exactly-once session as a queued region. */
|
|
188
|
-
export declare function Toast({ descriptor, onDismiss, placement, renderToneIcon,
|
|
118
|
+
export declare function Toast({ descriptor, onDismiss, placement, renderToneIcon, layoutStyle, }: ToastProps): import("react").JSX.Element;
|
|
189
119
|
export type ToastRegionController = Readonly<{
|
|
190
120
|
/** Queues a toast; the same name as the Web `useToast().publish` and the contract store. */
|
|
191
121
|
publish: (descriptor: ToastDescriptor) => ToastPublishResult;
|
|
@@ -227,21 +157,11 @@ export type ToastRegionProps = Readonly<{
|
|
|
227
157
|
/** Additional product-owned offset, for example a persistent bottom bar. */
|
|
228
158
|
keyboardOffset?: number;
|
|
229
159
|
renderToneIcon?: (props: ToastToneIconRenderProps) => ReactNode;
|
|
230
|
-
/**
|
|
231
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use `layoutStyle` for placement and `placement`/`safeAreaInsets` for appearance.
|
|
232
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
233
|
-
*/
|
|
234
|
-
style?: StyleProp<ViewStyle>;
|
|
235
|
-
/**
|
|
236
|
-
* @deprecated Raw visual style bypasses the HJM recipe. Use each descriptor's `tone` for appearance.
|
|
237
|
-
* Removed in the next major (consumer-policy.md §3.1).
|
|
238
|
-
*/
|
|
239
|
-
toastStyle?: StyleProp<ViewStyle>;
|
|
240
160
|
/** Canonical layout-only placement. Controlled visual keys are excluded. */
|
|
241
161
|
layoutStyle?: HjmCompositionStyleProp;
|
|
242
162
|
}>;
|
|
243
163
|
/** Bounded FIFO region with one clock, app-state pause and teardown interruption. */
|
|
244
|
-
export declare function ToastRegion({ presentationAdapter, occluded, children, accessibilityLabel, toasts, defaultToasts, onToastsChange, maxVisible, maxQueued, duplicatePolicy, timerUpdatePolicy, overflowPolicy, placement, safeAreaInsets, avoidKeyboard, keyboardOffset, renderToneIcon,
|
|
164
|
+
export declare function ToastRegion({ presentationAdapter, occluded, children, accessibilityLabel, toasts, defaultToasts, onToastsChange, maxVisible, maxQueued, duplicatePolicy, timerUpdatePolicy, overflowPolicy, placement, safeAreaInsets, avoidKeyboard, keyboardOffset, renderToneIcon, layoutStyle, }: ToastRegionProps): import("react").JSX.Element;
|
|
245
165
|
export declare function useToastRegion(): ToastRegionController;
|
|
246
166
|
export { ActivityChip, type ActivityChipProps } from "./activity-chip.js";
|
|
247
167
|
//# sourceMappingURL=feedback.d.ts.map
|
package/dist/feedback.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"feedback.d.ts","sourceRoot":"","sources":["../src/feedback.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"feedback.d.ts","sourceRoot":"","sources":["../src/feedback.tsx"],"names":[],"mappings":"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"}
|
package/dist/feedback.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { assertNoRemovedStyleProps } from "./internal/diagnostics.js";
|
|
2
3
|
import { resolveColorReference } from "@hjmds/design-contracts/color-references";
|
|
3
4
|
import { easing, fontWeight, glyph, spacing } from "@hjmds/design-contracts/foundations";
|
|
4
5
|
import { resolveControlAccessibleName, } from "@hjmds/design-contracts/behaviors";
|
|
@@ -8,11 +9,10 @@ import { liquidToastRecipe, createToastSession, createToastStore, resolveToastDe
|
|
|
8
9
|
import { createContext, useCallback, useContext, useEffect, useLayoutEffect, useRef, useState, useSyncExternalStore, } from "react";
|
|
9
10
|
import { Text as NativeText, AccessibilityInfo, Animated, AppState, Easing, Keyboard, Platform, Pressable, View, useWindowDimensions, } from "react-native";
|
|
10
11
|
import { Button, IconButton } from "./actions.js";
|
|
11
|
-
import { warnDeprecatedStyleProps } from "./internal/deprecated-style.js";
|
|
12
12
|
import { Text } from "./primitives.js";
|
|
13
13
|
import { useHjmNativeTheme } from "./provider.js";
|
|
14
|
-
export function Notice({ title, description, tone = noticeRecipe.defaults.tone, announcement = "none", icon, renderIcon, action,
|
|
15
|
-
|
|
14
|
+
export function Notice({ title, description, tone = noticeRecipe.defaults.tone, announcement = "none", icon, renderIcon, action, layoutStyle, ...props }) {
|
|
15
|
+
assertNoRemovedStyleProps("Notice", props, ["style"]);
|
|
16
16
|
const theme = useHjmNativeTheme();
|
|
17
17
|
const toneContract = noticeRecipe.tones[tone];
|
|
18
18
|
const foreground = resolveColorReference(toneContract.foreground, theme.palette);
|
|
@@ -38,7 +38,6 @@ export function Notice({ title, description, tone = noticeRecipe.defaults.tone,
|
|
|
38
38
|
gap: noticeRecipe.gap,
|
|
39
39
|
padding: noticeRecipe.padding,
|
|
40
40
|
},
|
|
41
|
-
style,
|
|
42
41
|
layoutStyle,
|
|
43
42
|
], children: [_jsxs(View, { style: {
|
|
44
43
|
alignItems: "flex-start",
|
|
@@ -52,8 +51,8 @@ export function Notice({ title, description, tone = noticeRecipe.defaults.tone,
|
|
|
52
51
|
width: glyph[noticeRecipe.iconSize],
|
|
53
52
|
}, children: resolvedIcon })), _jsxs(View, { style: { flex: 1, gap: noticeRecipe.contentGap, minWidth: 0 }, children: [_jsx(Text, { style: { color: foreground, fontWeight: noticeRecipe.title.fontWeight }, variant: noticeRecipe.title.textVariant, children: title }), description ? (_jsx(Text, { style: { color: resolveColorReference(noticeRecipe.description.color, theme.palette) }, variant: noticeRecipe.description.textVariant, children: description })) : null] })] }), action] }));
|
|
54
53
|
}
|
|
55
|
-
export function EmptyState({ title, description, illustration, action, density = emptyStateRecipe.defaults.density, align = "center", announcement = "none", accessibilityLabel, titleRole = "header",
|
|
56
|
-
|
|
54
|
+
export function EmptyState({ title, description, illustration, action, density = emptyStateRecipe.defaults.density, align = "center", announcement = "none", accessibilityLabel, titleRole = "header", layoutStyle, ...props }) {
|
|
55
|
+
assertNoRemovedStyleProps("EmptyState", props, ["style", "illustrationStyle", "titleStyle", "descriptionStyle", "actionStyle"]);
|
|
57
56
|
const theme = useHjmNativeTheme();
|
|
58
57
|
const contentLabel = [title, description].filter(Boolean).join(", ");
|
|
59
58
|
const announcementText = accessibilityLabel ?? [title, description].filter(Boolean).join(". ");
|
|
@@ -77,32 +76,29 @@ export function EmptyState({ title, description, illustration, action, density =
|
|
|
77
76
|
paddingHorizontal: emptyStateRecipe.paddingHorizontal,
|
|
78
77
|
paddingVertical: emptyStateRecipe.density[density].paddingVertical,
|
|
79
78
|
},
|
|
80
|
-
style,
|
|
81
79
|
layoutStyle,
|
|
82
80
|
], children: [announcement === "none" || Platform.OS === "ios" ? null : (_jsx(Text, { accessibilityLabel: announcementText, accessibilityLiveRegion: announcement, accessibilityRole: announcement === "assertive" ? "alert" : undefined, accessible: true, style: { height: 1, opacity: 0, position: "absolute", width: 1 }, children: announcementText })), usesUpperSpacers ? _jsx(View, { accessible: false, style: { flexGrow: 1 } }) : null, illustration ? (_jsx(View, { accessibilityElementsHidden: true, accessible: false, importantForAccessibility: "no-hide-descendants", style: [
|
|
83
81
|
{
|
|
84
82
|
alignItems: "center",
|
|
85
|
-
|
|
83
|
+
// Larger illustrations own their intrinsic size; icons retain a minimum frame.
|
|
84
|
+
minHeight: glyph[emptyStateRecipe.icon.size],
|
|
86
85
|
justifyContent: "center",
|
|
87
|
-
|
|
86
|
+
minWidth: glyph[emptyStateRecipe.icon.size],
|
|
88
87
|
},
|
|
89
|
-
illustrationStyle,
|
|
90
88
|
], children: illustration })) : null, title === undefined ? null : _jsx(Text, { align: "center", accessibilityRole: titleRole, style: [
|
|
91
89
|
{
|
|
92
90
|
color: resolveColorReference(emptyStateRecipe.title.color, theme.palette),
|
|
93
91
|
fontWeight: emptyStateRecipe.title.fontWeight,
|
|
94
92
|
},
|
|
95
|
-
titleStyle,
|
|
96
93
|
], variant: emptyStateRecipe.title.textVariant, children: title }), description ? (_jsx(Text, { align: "center", style: [
|
|
97
94
|
{
|
|
98
95
|
color: resolveColorReference(emptyStateRecipe.description.color, theme.palette),
|
|
99
96
|
},
|
|
100
|
-
|
|
101
|
-
], variant: emptyStateRecipe.description.textVariant, children: description })) : null, action ? _jsx(View, { style: actionStyle, children: action }) : null, usesUpperSpacers ? _jsx(View, { accessible: false, style: { flexGrow: 3 } }) : null] }));
|
|
97
|
+
], variant: emptyStateRecipe.description.textVariant, children: description })) : null, action ? _jsx(View, { children: action }) : null, usesUpperSpacers ? _jsx(View, { accessible: false, style: { flexGrow: 3 } }) : null] }));
|
|
102
98
|
}
|
|
103
99
|
/** Terminal flow outcome with platform announcement and canonical actions. */
|
|
104
|
-
export function Result({ status, title, description, actions, renderIcon,
|
|
105
|
-
|
|
100
|
+
export function Result({ status, title, description, actions, renderIcon, layoutStyle, ...props }) {
|
|
101
|
+
assertNoRemovedStyleProps("Result", props, ["style"]);
|
|
106
102
|
const theme = useHjmNativeTheme();
|
|
107
103
|
const result = resolveResultDescriptor({
|
|
108
104
|
status,
|
|
@@ -134,7 +130,6 @@ export function Result({ status, title, description, actions, renderIcon, style,
|
|
|
134
130
|
paddingHorizontal: resultRecipe.paddingHorizontal,
|
|
135
131
|
paddingVertical: resultRecipe.paddingVertical,
|
|
136
132
|
},
|
|
137
|
-
style,
|
|
138
133
|
layoutStyle,
|
|
139
134
|
], children: [_jsx(View, { accessible: false, style: {
|
|
140
135
|
alignItems: "center",
|
|
@@ -161,8 +156,7 @@ export function Result({ status, title, description, actions, renderIcon, style,
|
|
|
161
156
|
marginTop: spacing.xs,
|
|
162
157
|
}, children: [result.secondaryAction ? (_jsx(Button, { accessibilityLabel: result.secondaryAction.accessibilityLabel, onPress: result.secondaryAction.onAction, tone: "secondary", children: result.secondaryAction.label })) : null, result.primaryAction ? (_jsx(Button, { accessibilityLabel: result.primaryAction.accessibilityLabel, onPress: result.primaryAction.onAction, children: result.primaryAction.label })) : null] })) : null] }));
|
|
163
158
|
}
|
|
164
|
-
export function Progress({ value, max = progressRecipe.defaults.max, label, accessibilityLabel, valueText, accessibilityHint, size = progressRecipe.defaults.size, tone = progressRecipe.defaults.tone, shape = progressRecipe.defaults.shape, children,
|
|
165
|
-
warnDeprecatedStyleProps("Progress", { style, labelStyle, valueStyle, trackStyle, indicatorStyle }, "layoutStyle for placement and tone/size/shape for appearance");
|
|
159
|
+
export function Progress({ value, max = progressRecipe.defaults.max, label, accessibilityLabel, valueText, accessibilityHint, size = progressRecipe.defaults.size, tone = progressRecipe.defaults.tone, shape = progressRecipe.defaults.shape, children, layoutStyle, testID, }) {
|
|
166
160
|
if (!Number.isFinite(max) || max <= 0) {
|
|
167
161
|
throw new RangeError("Progress max must be a positive finite number");
|
|
168
162
|
}
|
|
@@ -178,12 +172,12 @@ export function Progress({ value, max = progressRecipe.defaults.max, label, acce
|
|
|
178
172
|
max: 100,
|
|
179
173
|
...(percentage === undefined ? {} : { now: percentage }),
|
|
180
174
|
...(resolvedValueText === undefined ? {} : { text: resolvedValueText }),
|
|
181
|
-
}, testID: testID, style: [{ gap: spacing.xs },
|
|
175
|
+
}, testID: testID, style: [{ gap: spacing.xs }, layoutStyle], children: [label === undefined ? null : (_jsxs(View, { accessible: false, style: {
|
|
182
176
|
alignItems: "center",
|
|
183
177
|
direction: theme.environment.direction,
|
|
184
178
|
flexDirection: "row",
|
|
185
179
|
justifyContent: "space-between",
|
|
186
|
-
}, children: [_jsx(Text, {
|
|
180
|
+
}, children: [_jsx(Text, { variant: "label", children: label }), resolvedValueText ? (_jsx(Text, { tone: "muted", variant: "caption", children: resolvedValueText })) : null] })), shape === "circular" ? (_jsxs(View, { accessible: false, style: [
|
|
187
181
|
{
|
|
188
182
|
alignItems: "center",
|
|
189
183
|
borderColor: resolveColorReference(progressRecipe.track, theme.palette),
|
|
@@ -193,34 +187,27 @@ export function Progress({ value, max = progressRecipe.defaults.max, label, acce
|
|
|
193
187
|
justifyContent: "center",
|
|
194
188
|
width: progressRecipe.circular.sizes[size],
|
|
195
189
|
},
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
transform: [{ rotate: `${((percentage ?? 25) / 100) * 360}deg` }],
|
|
206
|
-
width: progressRecipe.circular.sizes[size],
|
|
207
|
-
},
|
|
208
|
-
indicatorStyle,
|
|
209
|
-
] }), children] })) : (_jsx(View, { accessible: false, style: [
|
|
190
|
+
], children: [[0, 1].map(half => {
|
|
191
|
+
const diameter = progressRecipe.circular.sizes[size];
|
|
192
|
+
const fraction = (percentage ?? 25) / 100;
|
|
193
|
+
const sweep = Math.max(0, Math.min(1, fraction * 2 - half));
|
|
194
|
+
if (sweep === 0)
|
|
195
|
+
return null;
|
|
196
|
+
const left = half === 0 ? diameter / 2 : 0;
|
|
197
|
+
return _jsx(View, { pointerEvents: "none", style: { position: "absolute", top: -progressRecipe.circular.strokeWidth[size], left: left - progressRecipe.circular.strokeWidth[size], width: diameter / 2, height: diameter, overflow: "hidden" }, children: _jsx(View, { style: { position: "absolute", left: -left, width: diameter, height: diameter, transform: [{ rotate: `${(sweep - 1) * 180}deg` }] }, children: _jsx(View, { style: { position: "absolute", left, width: diameter / 2, height: diameter, overflow: "hidden" }, children: _jsx(View, { style: [{ position: "absolute", left: -left, width: diameter, height: diameter, borderRadius: diameter / 2, borderWidth: progressRecipe.circular.strokeWidth[size], borderColor: resolveColorReference(progressRecipe.tones[tone], theme.palette) }] }) }) }) }, half);
|
|
198
|
+
}), children] })) : (_jsx(View, { accessible: false, style: [
|
|
210
199
|
{
|
|
211
200
|
backgroundColor: resolveColorReference(progressRecipe.track, theme.palette),
|
|
212
201
|
borderRadius: theme.tokens.radius[progressRecipe.radius],
|
|
213
202
|
height: progressRecipe.sizes[size],
|
|
214
203
|
overflow: "hidden",
|
|
215
204
|
},
|
|
216
|
-
trackStyle,
|
|
217
205
|
], children: _jsx(View, { style: [
|
|
218
206
|
{
|
|
219
207
|
backgroundColor: resolveColorReference(progressRecipe.tones[tone], theme.palette),
|
|
220
208
|
height: "100%",
|
|
221
209
|
width: `${percentage ?? 30}%`,
|
|
222
210
|
},
|
|
223
|
-
indicatorStyle,
|
|
224
211
|
] }) }))] }));
|
|
225
212
|
}
|
|
226
213
|
export { Spinner } from "./internal/spinner.js";
|
|
@@ -232,8 +219,7 @@ export { Spinner } from "./internal/spinner.js";
|
|
|
232
219
|
* width/height/radius stay for callers already on the 0.9 train and win over
|
|
233
220
|
* `shape`. Migration: .changeset/skeleton-pulse-by-default.md
|
|
234
221
|
*/
|
|
235
|
-
export function Skeleton({ shape = skeletonRecipe.defaults.shape, animated = skeletonRecipe.defaults.animated, width, height, radius: radiusValue, accessibilityLabel,
|
|
236
|
-
warnDeprecatedStyleProps("Skeleton", { style }, "layoutStyle for placement and shape/width/height for appearance");
|
|
222
|
+
export function Skeleton({ shape = skeletonRecipe.defaults.shape, animated = skeletonRecipe.defaults.animated, width, height, radius: radiusValue, accessibilityLabel, layoutStyle, }) {
|
|
237
223
|
const { environment, palette, tokens } = useHjmNativeTheme();
|
|
238
224
|
const shapeSpec = skeletonRecipe.shapes[shape];
|
|
239
225
|
const { duration, easing: easingName, fromOpacity, toOpacity } = skeletonRecipe.animation;
|
|
@@ -282,7 +268,6 @@ export function Skeleton({ shape = skeletonRecipe.defaults.shape, animated = ske
|
|
|
282
268
|
: toOpacity,
|
|
283
269
|
width: resolvedWidth,
|
|
284
270
|
},
|
|
285
|
-
style,
|
|
286
271
|
layoutStyle,
|
|
287
272
|
] }));
|
|
288
273
|
}
|
|
@@ -307,8 +292,9 @@ function ToastProgressRow({ progress }) {
|
|
|
307
292
|
}) }));
|
|
308
293
|
}
|
|
309
294
|
// UI control labels keep the ui font even when their metric variant is body; content still uses reading.
|
|
310
|
-
function ToastSurface({ snapshot, managedMotion = false, announces = true, suspended = false, onDismiss, onAction, onExitComplete, onPause, onResume, placement, renderToneIcon, style, }) {
|
|
295
|
+
function ToastSurface({ snapshot, managedMotion = false, announces = true, suspended = false, onDismiss, onAction, onPress, onExitComplete, onPause, onResume, placement, renderToneIcon, style, }) {
|
|
311
296
|
const resolved = snapshot.descriptor;
|
|
297
|
+
const [pressFocused, setPressFocused] = useState(false);
|
|
312
298
|
const theme = useHjmNativeTheme();
|
|
313
299
|
// Managed liquid presentation owns its shadow; ordinary toast chrome follows
|
|
314
300
|
// the profile floating role, preserving the recipe for consumers without one.
|
|
@@ -396,7 +382,16 @@ function ToastSurface({ snapshot, managedMotion = false, announces = true, suspe
|
|
|
396
382
|
width: "100%",
|
|
397
383
|
},
|
|
398
384
|
style,
|
|
399
|
-
], children: [
|
|
385
|
+
], children: [resolved.press ? (
|
|
386
|
+
// A sibling hit surface lets text/media/padding activate the card while the
|
|
387
|
+
// explicit controls stay separate accessibility targets. Liquid's parent
|
|
388
|
+
// PanResponder can cancel this Pressable when it claims an upward swipe.
|
|
389
|
+
_jsx(Pressable, { accessibilityRole: "button", accessibilityLabel: resolved.press.accessibilityLabel, accessibilityHint: resolved.announcement, disabled: snapshot.phase !== "visible" || suspended, onPress: onPress, onFocus: () => { setPressFocused(true); pauseFocus(); }, onBlur: () => { setPressFocused(false); resumeFocus(); }, style: ({ pressed }) => ({
|
|
390
|
+
position: "absolute", top: 0, bottom: 0, start: 0, end: 0,
|
|
391
|
+
borderRadius: surfaceRadius,
|
|
392
|
+
borderWidth: pressFocused || pressed ? toastRecipe.states.focus.width : 0,
|
|
393
|
+
borderColor: resolveColorReference(toastRecipe.states.focus.color, theme.palette),
|
|
394
|
+
}) })) : null, toastRecipe.toneMark.width > 0 ? (_jsx(View, { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: {
|
|
400
395
|
backgroundColor: accent,
|
|
401
396
|
borderRadius: theme.tokens.radius[toastRecipe.toneMark.radius],
|
|
402
397
|
bottom: 0,
|
|
@@ -404,7 +399,7 @@ function ToastSurface({ snapshot, managedMotion = false, announces = true, suspe
|
|
|
404
399
|
position: "absolute",
|
|
405
400
|
top: 0,
|
|
406
401
|
width: toastRecipe.toneMark.width,
|
|
407
|
-
} })) : null, !announces || Platform.OS === "ios" ? null : (_jsx(Text, { accessibilityLabel: resolved.announcement, accessibilityLiveRegion: resolved.priority === "high" ? "assertive" : "polite", accessibilityRole: resolved.priority === "high" ? "alert" : undefined, accessible: true, style: { height: 1, opacity: 0, position: "absolute", width: 1 }, children: resolved.announcement })), _jsxs(View, { style: {
|
|
402
|
+
} })) : null, !announces || Platform.OS === "ios" ? null : (_jsx(Text, { accessibilityLabel: resolved.announcement, accessibilityLiveRegion: resolved.priority === "high" ? "assertive" : "polite", accessibilityRole: resolved.priority === "high" ? "alert" : undefined, accessible: true, style: { height: 1, opacity: 0, position: "absolute", width: 1 }, children: resolved.announcement })), _jsxs(View, { pointerEvents: resolved.press ? "box-none" : "auto", style: {
|
|
408
403
|
// Start-aligned so a multi-line or large-text toast keeps its badge beside the title (Web does the same).
|
|
409
404
|
alignItems: "flex-start",
|
|
410
405
|
direction: theme.environment.direction,
|
|
@@ -412,7 +407,7 @@ function ToastSurface({ snapshot, managedMotion = false, announces = true, suspe
|
|
|
412
407
|
gap: toastRecipe.surface.gap,
|
|
413
408
|
}, children: [resolved.media !== null ? (
|
|
414
409
|
// Product media replaces the tone badge in the same column; it is decorative, the copy carries meaning.
|
|
415
|
-
_jsx(View, { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: {
|
|
410
|
+
_jsx(View, { pointerEvents: resolved.press ? "none" : "auto", accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: {
|
|
416
411
|
alignItems: "center",
|
|
417
412
|
borderRadius: theme.tokens.radius.full,
|
|
418
413
|
flexShrink: 0,
|
|
@@ -420,7 +415,7 @@ function ToastSurface({ snapshot, managedMotion = false, announces = true, suspe
|
|
|
420
415
|
justifyContent: "center",
|
|
421
416
|
overflow: "hidden",
|
|
422
417
|
width: toastRecipe.media.size,
|
|
423
|
-
}, children: resolved.media })) : renderedToneIcon === undefined ? null : (_jsx(View, { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: {
|
|
418
|
+
}, children: resolved.media })) : renderedToneIcon === undefined ? null : (_jsx(View, { pointerEvents: resolved.press ? "none" : "auto", accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: {
|
|
424
419
|
alignItems: "center",
|
|
425
420
|
backgroundColor: badge,
|
|
426
421
|
borderRadius: theme.tokens.radius[toastRecipe.icon.badgeRadius],
|
|
@@ -428,10 +423,10 @@ function ToastSurface({ snapshot, managedMotion = false, announces = true, suspe
|
|
|
428
423
|
height: toastRecipe.icon.badgeDiameter,
|
|
429
424
|
justifyContent: "center",
|
|
430
425
|
width: toastRecipe.icon.badgeDiameter,
|
|
431
|
-
}, children: renderedToneIcon })), _jsxs(View, { style: { alignSelf: "center", flex: 1, gap: toastRecipe.content.gap, minWidth: 0 }, children: [resolved.title ? (_jsx(Text, { style: {
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
426
|
+
}, children: renderedToneIcon })), _jsxs(View, { pointerEvents: resolved.press ? "box-none" : "auto", style: { alignSelf: "center", flex: 1, gap: toastRecipe.content.gap, minWidth: 0 }, children: [_jsxs(View, { pointerEvents: resolved.press ? "none" : "auto", style: { gap: toastRecipe.content.gap }, children: [resolved.title ? (_jsx(Text, { style: {
|
|
427
|
+
color: resolveColorReference(toastRecipe.title.color, theme.palette),
|
|
428
|
+
fontWeight: toastRecipe.title.fontWeight,
|
|
429
|
+
}, variant: toastRecipe.title.textVariant, children: resolved.title })) : null, _jsx(Text, { style: { color: resolveColorReference(toastRecipe.description.color, theme.palette) }, variant: toastRecipe.description.textVariant, children: resolved.description }), resolved.progress ? _jsx(ToastProgressRow, { progress: resolved.progress }) : null] }), resolved.action ? (
|
|
435
430
|
// 1.10.0 tinted pill; 1.20 panel: under the copy at the start edge (toastRecipe.action.align).
|
|
436
431
|
_jsx(Pressable, { accessibilityLabel: resolved.action.accessibilityLabel, accessibilityRole: "button", onBlur: resumeFocus, onFocus: pauseFocus, onPress: onAction, style: ({ pressed }) => ({
|
|
437
432
|
alignItems: "center",
|
|
@@ -449,8 +444,7 @@ function ToastSurface({ snapshot, managedMotion = false, announces = true, suspe
|
|
|
449
444
|
}, variant: toastRecipe.action.textVariant, children: resolved.action.label }) })) : null] }), closeControl] })] }));
|
|
450
445
|
}
|
|
451
446
|
/** One Native toast driven by the same exactly-once session as a queued region. */
|
|
452
|
-
export function Toast({ descriptor, onDismiss, placement = toastRecipe.defaults.placement, renderToneIcon,
|
|
453
|
-
warnDeprecatedStyleProps("Toast", { style }, "layoutStyle for placement and the descriptor tone for appearance");
|
|
447
|
+
export function Toast({ descriptor, onDismiss, placement = toastRecipe.defaults.placement, renderToneIcon, layoutStyle, }) {
|
|
454
448
|
const descriptorRef = useRef(descriptor);
|
|
455
449
|
const additionalDismissRef = useRef(onDismiss);
|
|
456
450
|
descriptorRef.current = descriptor;
|
|
@@ -469,29 +463,41 @@ export function Toast({ descriptor, onDismiss, placement = toastRecipe.defaults.
|
|
|
469
463
|
});
|
|
470
464
|
const snapshot = useSyncExternalStore(session.subscribe, session.getSnapshot, session.getSnapshot);
|
|
471
465
|
const previousDescriptor = useRef(descriptor);
|
|
466
|
+
const lastTime = useRef(performance.now());
|
|
467
|
+
const flushTime = useCallback(() => {
|
|
468
|
+
const now = performance.now();
|
|
469
|
+
const elapsed = Math.max(0, now - lastTime.current);
|
|
470
|
+
lastTime.current = now;
|
|
471
|
+
session.advanceTime(elapsed);
|
|
472
|
+
}, [session]);
|
|
472
473
|
useEffect(() => {
|
|
473
474
|
if (previousDescriptor.current !== descriptor) {
|
|
475
|
+
flushTime();
|
|
474
476
|
session.update(decorate(descriptor));
|
|
475
477
|
previousDescriptor.current = descriptor;
|
|
476
478
|
}
|
|
477
|
-
}, [decorate, descriptor, session]);
|
|
478
|
-
|
|
479
|
-
|
|
479
|
+
}, [decorate, descriptor, session, flushTime]);
|
|
480
|
+
const mountGeneration = useRef(0);
|
|
481
|
+
useEffect(() => {
|
|
482
|
+
const generation = ++mountGeneration.current;
|
|
483
|
+
// StrictMode replays cleanup before reattaching the same session. Interrupt
|
|
484
|
+
// only a real unmount, like ToastRegion's store disposal lifecycle.
|
|
485
|
+
return () => { queueMicrotask(() => { if (mountGeneration.current === generation)
|
|
486
|
+
session.interrupt(); }); };
|
|
480
487
|
}, [session]);
|
|
481
488
|
useEffect(() => {
|
|
482
489
|
if (snapshot.timer.status !== "running" || snapshot.timer.remainingMs === null)
|
|
483
490
|
return;
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
}, snapshot.timer.remainingMs);
|
|
491
|
+
lastTime.current = performance.now();
|
|
492
|
+
const timeout = setTimeout(flushTime, snapshot.timer.remainingMs);
|
|
487
493
|
return () => clearTimeout(timeout);
|
|
488
|
-
}, [
|
|
494
|
+
}, [flushTime, snapshot.timer.remainingMs, snapshot.timer.status]);
|
|
489
495
|
const completeDismiss = (reason) => {
|
|
490
496
|
session.dismiss(reason);
|
|
491
497
|
};
|
|
492
498
|
return (_jsx(ToastSurface, { onAction: () => {
|
|
493
499
|
session.invokeAction();
|
|
494
|
-
}, onDismiss: completeDismiss, onExitComplete: () => session.completeExit(), onPause: (reason) => session.pause(reason), onResume: (reason) => session.resume(reason), placement: placement, ...(renderToneIcon === undefined ? {} : { renderToneIcon }), snapshot: snapshot, style: [
|
|
500
|
+
}, onPress: () => { session.invokePress(); }, onDismiss: completeDismiss, onExitComplete: () => session.completeExit(), onPause: (reason) => { flushTime(); session.pause(reason); }, onResume: (reason) => { flushTime(); session.resume(reason); }, placement: placement, ...(renderToneIcon === undefined ? {} : { renderToneIcon }), snapshot: snapshot, style: [layoutStyle] }));
|
|
495
501
|
}
|
|
496
502
|
const ToastRegionContext = createContext(null);
|
|
497
503
|
function useToastKeyboardHeight(enabled) {
|
|
@@ -538,6 +544,7 @@ function snapshotDescriptor(snapshot) {
|
|
|
538
544
|
dismissOnAction: descriptor.action.dismissOnAction,
|
|
539
545
|
},
|
|
540
546
|
}),
|
|
547
|
+
...(descriptor.press === null ? {} : { press: descriptor.press }),
|
|
541
548
|
// Panel fields must survive the controlled-collection round trip, or `onToastsChange` would drop them.
|
|
542
549
|
...(descriptor.media === null ? {} : { media: descriptor.media }),
|
|
543
550
|
...(descriptor.progress === null ? {} : { progress: descriptor.progress }),
|
|
@@ -580,8 +587,7 @@ function PresentedToast({ adapter, width, availableHeight, windowOrigin, ...prop
|
|
|
580
587
|
return _jsxs(_Fragment, { children: [announcer, _jsx(Surface, { anchor: selected.anchor, snapshot: props.snapshot, width: width, availableHeight: availableHeight, ...(windowOrigin === undefined ? {} : { windowOrigin }), suspended: props.suspended ?? false, body: _jsx(ToastSurface, { ...props, announces: false, managedMotion: true }), fallback: fallback, onPause: props.onPause, onResume: props.onResume, onDismiss: props.onDismiss, onExitComplete: props.onExitComplete })] });
|
|
581
588
|
}
|
|
582
589
|
/** Bounded FIFO region with one clock, app-state pause and teardown interruption. */
|
|
583
|
-
export function ToastRegion({ presentationAdapter, occluded = false, children, accessibilityLabel, toasts, defaultToasts = [], onToastsChange, maxVisible = toastBehaviorDefaults.maxVisible, maxQueued = toastBehaviorDefaults.maxQueued, duplicatePolicy = toastBehaviorDefaults.duplicatePolicy, timerUpdatePolicy = toastBehaviorDefaults.timerUpdatePolicy, overflowPolicy = toastBehaviorDefaults.overflowPolicy, placement = toastRecipe.defaults.placement, safeAreaInsets = {}, avoidKeyboard = true, keyboardOffset = 0, renderToneIcon,
|
|
584
|
-
warnDeprecatedStyleProps("ToastRegion", { style, toastStyle }, "layoutStyle for placement and placement/safeAreaInsets/descriptor tone for appearance");
|
|
590
|
+
export function ToastRegion({ presentationAdapter, occluded = false, children, accessibilityLabel, toasts, defaultToasts = [], onToastsChange, maxVisible = toastBehaviorDefaults.maxVisible, maxQueued = toastBehaviorDefaults.maxQueued, duplicatePolicy = toastBehaviorDefaults.duplicatePolicy, timerUpdatePolicy = toastBehaviorDefaults.timerUpdatePolicy, overflowPolicy = toastBehaviorDefaults.overflowPolicy, placement = toastRecipe.defaults.placement, safeAreaInsets = {}, avoidKeyboard = true, keyboardOffset = 0, renderToneIcon, layoutStyle, }) {
|
|
585
591
|
if (presentationAdapter && (presentationAdapter.kind !== "liquid" || placement !== "top" || maxVisible !== 1)) {
|
|
586
592
|
throw new TypeError("Liquid Toast requires top placement and maxVisible=1");
|
|
587
593
|
}
|
|
@@ -747,6 +753,10 @@ export function ToastRegion({ presentationAdapter, occluded = false, children, a
|
|
|
747
753
|
}
|
|
748
754
|
return changed;
|
|
749
755
|
}, [emitChange, pruneRaw, store]);
|
|
756
|
+
const invokePress = useCallback((id) => {
|
|
757
|
+
flushTime();
|
|
758
|
+
return store.invokePress(id);
|
|
759
|
+
}, [store]);
|
|
750
760
|
const invokeAction = useCallback((id) => {
|
|
751
761
|
flushTime();
|
|
752
762
|
return store.invokeAction(id);
|
|
@@ -768,7 +778,7 @@ export function ToastRegion({ presentationAdapter, occluded = false, children, a
|
|
|
768
778
|
: "center";
|
|
769
779
|
const blockOffset = toastRecipe.viewport.inset
|
|
770
780
|
+ (bottomPlacement ? safeBottom + keyboardHeight + keyboardOffset : safeTop);
|
|
771
|
-
return (_jsx(ToastRegionContext.Provider, { value: controller, children: _jsxs(View, { style: [{ flex: hasChildren ? 1 : undefined },
|
|
781
|
+
return (_jsx(ToastRegionContext.Provider, { value: controller, children: _jsxs(View, { style: [{ flex: hasChildren ? 1 : undefined }, layoutStyle], children: [children, _jsx(View, { ref: viewportRef, onLayout: event => {
|
|
772
782
|
setViewportWidth(event.nativeEvent.layout.width);
|
|
773
783
|
viewportRef.current?.measureInWindow?.((x, y) => setWindowOrigin(previous => previous?.x === x && previous?.y === y ? previous : { x, y }));
|
|
774
784
|
}, accessibilityLabel: accessibilityLabel, accessibilityElementsHidden: suspended, importantForAccessibility: suspended ? "no-hide-descendants" : "auto", pointerEvents: suspended ? "none" : "box-none", style: {
|
|
@@ -783,7 +793,7 @@ export function ToastRegion({ presentationAdapter, occluded = false, children, a
|
|
|
783
793
|
start: toastRecipe.viewport.inset + safeStart,
|
|
784
794
|
zIndex: toastRecipe.viewport.layer,
|
|
785
795
|
...(bottomPlacement ? { bottom: blockOffset } : { top: blockOffset }),
|
|
786
|
-
}, children: snapshot.visible.map((entry) => (_jsx(PresentedToast, { adapter: presentationAdapter, width: width, availableHeight: availableHeight, windowOrigin: windowOrigin, suspended: suspended, onAction: () => invokeAction(entry.descriptor.id), onDismiss: (reason) => dismiss(entry.descriptor.id, reason), onExitComplete: () => completeExit(entry.descriptor.id), onPause: (reason) => { controller.pause(entry.descriptor.id, reason); }, onResume: (reason) => { controller.resume(entry.descriptor.id, reason); }, placement: placement, ...(renderToneIcon === undefined ? {} : { renderToneIcon }), snapshot: entry
|
|
796
|
+
}, children: snapshot.visible.map((entry) => (_jsx(PresentedToast, { adapter: presentationAdapter, width: width, availableHeight: availableHeight, windowOrigin: windowOrigin, suspended: suspended, onAction: () => invokeAction(entry.descriptor.id), onPress: () => invokePress(entry.descriptor.id), onDismiss: (reason) => dismiss(entry.descriptor.id, reason), onExitComplete: () => completeExit(entry.descriptor.id), onPause: (reason) => { controller.pause(entry.descriptor.id, reason); }, onResume: (reason) => { controller.resume(entry.descriptor.id, reason); }, placement: placement, ...(renderToneIcon === undefined ? {} : { renderToneIcon }), snapshot: entry }, entry.descriptor.id))) })] }) }));
|
|
787
797
|
}
|
|
788
798
|
export function useToastRegion() {
|
|
789
799
|
const controller = useContext(ToastRegionContext);
|