@tamagui/dialog 1.89.26 → 1.89.27-1708112217600
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/dist/cjs/Dialog.native.js +495 -379
- package/dist/cjs/Dialog.native.js.map +3 -3
- package/dist/cjs/index.native.js.map +2 -2
- package/dist/esm/Dialog.native.js +495 -388
- package/dist/esm/Dialog.native.js.map +3 -3
- package/dist/esm/index.native.js.map +1 -1
- package/dist/jsx/Dialog.native.js +495 -388
- package/dist/jsx/Dialog.native.js.map +3 -3
- package/dist/jsx/index.native.js.map +1 -1
- package/package.json +21 -21
|
@@ -38,133 +38,251 @@ __export(Dialog_exports, {
|
|
|
38
38
|
createDialogScope: () => createDialogScope
|
|
39
39
|
});
|
|
40
40
|
module.exports = __toCommonJS(Dialog_exports);
|
|
41
|
-
var import_adapt = require("@tamagui/adapt"), import_animate_presence = require("@tamagui/animate-presence"), import_aria_hidden = require("@tamagui/aria-hidden"), import_compose_refs = require("@tamagui/compose-refs"), import_constants = require("@tamagui/constants"), import_core = require("@tamagui/core"), import_create_context = require("@tamagui/create-context"), import_dismissable = require("@tamagui/dismissable"), import_focus_scope = require("@tamagui/focus-scope"), import_helpers = require("@tamagui/helpers"), import_portal = require("@tamagui/portal"), import_remove_scroll = require("@tamagui/remove-scroll"), import_sheet = require("@tamagui/sheet"), import_stacks = require("@tamagui/stacks"), import_text = require("@tamagui/text"), import_use_controllable_state = require("@tamagui/use-controllable-state"), React = __toESM(require("react"))
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
41
|
+
var import_adapt = require("@tamagui/adapt"), import_animate_presence = require("@tamagui/animate-presence"), import_aria_hidden = require("@tamagui/aria-hidden"), import_compose_refs = require("@tamagui/compose-refs"), import_constants = require("@tamagui/constants"), import_core = require("@tamagui/core"), import_create_context = require("@tamagui/create-context"), import_dismissable = require("@tamagui/dismissable"), import_focus_scope = require("@tamagui/focus-scope"), import_helpers = require("@tamagui/helpers"), import_portal = require("@tamagui/portal"), import_remove_scroll = require("@tamagui/remove-scroll"), import_sheet = require("@tamagui/sheet"), import_stacks = require("@tamagui/stacks"), import_text = require("@tamagui/text"), import_use_controllable_state = require("@tamagui/use-controllable-state"), React = __toESM(require("react"));
|
|
42
|
+
function _array_like_to_array(arr, len) {
|
|
43
|
+
(len == null || len > arr.length) && (len = arr.length);
|
|
44
|
+
for (var i = 0, arr2 = new Array(len); i < len; i++)
|
|
45
|
+
arr2[i] = arr[i];
|
|
46
|
+
return arr2;
|
|
47
|
+
}
|
|
48
|
+
function _array_with_holes(arr) {
|
|
49
|
+
if (Array.isArray(arr))
|
|
50
|
+
return arr;
|
|
51
|
+
}
|
|
52
|
+
function _define_property(obj, key, value) {
|
|
53
|
+
return key in obj ? Object.defineProperty(obj, key, {
|
|
54
|
+
value,
|
|
55
|
+
enumerable: !0,
|
|
56
|
+
configurable: !0,
|
|
57
|
+
writable: !0
|
|
58
|
+
}) : obj[key] = value, obj;
|
|
59
|
+
}
|
|
60
|
+
function _instanceof(left, right) {
|
|
61
|
+
return right != null && typeof Symbol < "u" && right[Symbol.hasInstance] ? !!right[Symbol.hasInstance](left) : left instanceof right;
|
|
62
|
+
}
|
|
63
|
+
function _iterable_to_array_limit(arr, i) {
|
|
64
|
+
var _i = arr == null ? null : typeof Symbol < "u" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
65
|
+
if (_i != null) {
|
|
66
|
+
var _arr = [], _n = !0, _d = !1, _s, _e;
|
|
67
|
+
try {
|
|
68
|
+
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done) && (_arr.push(_s.value), !(i && _arr.length === i)); _n = !0)
|
|
69
|
+
;
|
|
70
|
+
} catch (err) {
|
|
71
|
+
_d = !0, _e = err;
|
|
72
|
+
} finally {
|
|
73
|
+
try {
|
|
74
|
+
!_n && _i.return != null && _i.return();
|
|
75
|
+
} finally {
|
|
76
|
+
if (_d)
|
|
77
|
+
throw _e;
|
|
58
78
|
}
|
|
59
|
-
|
|
79
|
+
}
|
|
80
|
+
return _arr;
|
|
60
81
|
}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
82
|
+
}
|
|
83
|
+
function _non_iterable_rest() {
|
|
84
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
85
|
+
}
|
|
86
|
+
function _object_spread(target) {
|
|
87
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
88
|
+
var source = arguments[i] != null ? arguments[i] : {}, ownKeys2 = Object.keys(source);
|
|
89
|
+
typeof Object.getOwnPropertySymbols == "function" && (ownKeys2 = ownKeys2.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
90
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
91
|
+
}))), ownKeys2.forEach(function(key) {
|
|
92
|
+
_define_property(target, key, source[key]);
|
|
93
|
+
});
|
|
94
|
+
}
|
|
95
|
+
return target;
|
|
96
|
+
}
|
|
97
|
+
function ownKeys(object, enumerableOnly) {
|
|
98
|
+
var keys = Object.keys(object);
|
|
99
|
+
if (Object.getOwnPropertySymbols) {
|
|
100
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
101
|
+
enumerableOnly && (symbols = symbols.filter(function(sym) {
|
|
102
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
103
|
+
})), keys.push.apply(keys, symbols);
|
|
104
|
+
}
|
|
105
|
+
return keys;
|
|
106
|
+
}
|
|
107
|
+
function _object_spread_props(target, source) {
|
|
108
|
+
return source = source ?? {}, Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
|
|
109
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
110
|
+
}), target;
|
|
111
|
+
}
|
|
112
|
+
function _object_without_properties(source, excluded) {
|
|
113
|
+
if (source == null)
|
|
114
|
+
return {};
|
|
115
|
+
var target = _object_without_properties_loose(source, excluded), key, i;
|
|
116
|
+
if (Object.getOwnPropertySymbols) {
|
|
117
|
+
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
118
|
+
for (i = 0; i < sourceSymbolKeys.length; i++)
|
|
119
|
+
key = sourceSymbolKeys[i], !(excluded.indexOf(key) >= 0) && Object.prototype.propertyIsEnumerable.call(source, key) && (target[key] = source[key]);
|
|
120
|
+
}
|
|
121
|
+
return target;
|
|
122
|
+
}
|
|
123
|
+
function _object_without_properties_loose(source, excluded) {
|
|
124
|
+
if (source == null)
|
|
125
|
+
return {};
|
|
126
|
+
var target = {}, sourceKeys = Object.keys(source), key, i;
|
|
127
|
+
for (i = 0; i < sourceKeys.length; i++)
|
|
128
|
+
key = sourceKeys[i], !(excluded.indexOf(key) >= 0) && (target[key] = source[key]);
|
|
129
|
+
return target;
|
|
130
|
+
}
|
|
131
|
+
function _sliced_to_array(arr, i) {
|
|
132
|
+
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
133
|
+
}
|
|
134
|
+
function _unsupported_iterable_to_array(o, minLen) {
|
|
135
|
+
if (o) {
|
|
136
|
+
if (typeof o == "string")
|
|
137
|
+
return _array_like_to_array(o, minLen);
|
|
138
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
139
|
+
if (n === "Object" && o.constructor && (n = o.constructor.name), n === "Map" || n === "Set")
|
|
140
|
+
return Array.from(n);
|
|
141
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))
|
|
142
|
+
return _array_like_to_array(o, minLen);
|
|
67
143
|
}
|
|
68
|
-
|
|
144
|
+
}
|
|
145
|
+
var DIALOG_NAME = "Dialog", _createContextScope = _sliced_to_array((0, import_create_context.createContextScope)(DIALOG_NAME), 2), createDialogContext = _createContextScope[0], createDialogScope = _createContextScope[1], _createDialogContext = _sliced_to_array(createDialogContext(DIALOG_NAME), 2), DialogProvider = _createDialogContext[0], useDialogContext = _createDialogContext[1], TRIGGER_NAME = "DialogTrigger", DialogTriggerFrame = (0, import_core.styled)(import_core.View, {
|
|
146
|
+
name: TRIGGER_NAME
|
|
147
|
+
}), DialogTrigger = DialogTriggerFrame.styleable(function(props, forwardedRef) {
|
|
148
|
+
var __scopeDialog = props.__scopeDialog, triggerProps = _object_without_properties(props, [
|
|
149
|
+
"__scopeDialog"
|
|
150
|
+
]), isInsideButton = React.useContext(import_stacks.ButtonNestingContext), context = useDialogContext(TRIGGER_NAME, __scopeDialog), composedTriggerRef = (0, import_compose_refs.useComposedRefs)(forwardedRef, context.triggerRef);
|
|
151
|
+
return /* @__PURE__ */ React.createElement(import_stacks.ButtonNestingContext.Provider, {
|
|
152
|
+
value: !0
|
|
153
|
+
}, /* @__PURE__ */ React.createElement(DialogTriggerFrame, _object_spread_props(_object_spread({
|
|
154
|
+
tag: isInsideButton ? "span" : "button",
|
|
155
|
+
"aria-haspopup": "dialog",
|
|
156
|
+
"aria-expanded": context.open,
|
|
157
|
+
"aria-controls": context.contentId,
|
|
158
|
+
"data-state": getState(context.open)
|
|
159
|
+
}, triggerProps), {
|
|
160
|
+
ref: composedTriggerRef,
|
|
161
|
+
onPress: (0, import_helpers.composeEventHandlers)(props.onPress, context.onOpenToggle)
|
|
162
|
+
})));
|
|
163
|
+
});
|
|
164
|
+
DialogTrigger.displayName = TRIGGER_NAME;
|
|
165
|
+
var PORTAL_NAME = "DialogPortal", _createDialogContext1 = _sliced_to_array(createDialogContext(PORTAL_NAME, {
|
|
166
|
+
forceMount: void 0
|
|
167
|
+
}), 2), PortalProvider = _createDialogContext1[0], usePortalContext = _createDialogContext1[1], DialogPortalFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
69
168
|
variants: {
|
|
70
169
|
unstyled: {
|
|
71
|
-
false: {
|
|
170
|
+
false: _object_spread({
|
|
72
171
|
alignItems: "center",
|
|
73
172
|
justifyContent: "center",
|
|
74
173
|
fullscreen: !0,
|
|
75
|
-
zIndex: 1e5
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
}
|
|
174
|
+
zIndex: 1e5
|
|
175
|
+
}, import_constants.isWeb && {
|
|
176
|
+
maxHeight: "100vh",
|
|
177
|
+
position: "fixed"
|
|
178
|
+
})
|
|
81
179
|
}
|
|
82
180
|
},
|
|
83
181
|
defaultVariants: {
|
|
84
182
|
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
85
183
|
}
|
|
86
|
-
}), DialogPortalItem = (props)
|
|
87
|
-
|
|
88
|
-
return /* @__PURE__ */
|
|
184
|
+
}), DialogPortalItem = function(props) {
|
|
185
|
+
var themeName = (0, import_core.useThemeName)(), context = useDialogContext(PORTAL_NAME, props.__scopeDialog);
|
|
186
|
+
return /* @__PURE__ */ React.createElement(import_portal.PortalItem, {
|
|
187
|
+
hostName: props.hostName
|
|
188
|
+
}, /* @__PURE__ */ React.createElement(DialogPortalItemContent, _object_spread_props(_object_spread({}, props), {
|
|
189
|
+
themeName,
|
|
190
|
+
context
|
|
191
|
+
})));
|
|
89
192
|
};
|
|
90
193
|
function DialogPortalItemContent(props) {
|
|
91
|
-
|
|
92
|
-
__scopeDialog,
|
|
93
|
-
children,
|
|
94
|
-
context,
|
|
95
|
-
themeName,
|
|
96
|
-
space,
|
|
97
|
-
spaceDirection,
|
|
98
|
-
separator
|
|
99
|
-
} = props;
|
|
100
|
-
let childrenSpaced = children;
|
|
194
|
+
var __scopeDialog = props.__scopeDialog, children = props.children, context = props.context, themeName = props.themeName, space = props.space, spaceDirection = props.spaceDirection, separator = props.separator, childrenSpaced = children;
|
|
101
195
|
return (space || separator) && (childrenSpaced = (0, import_core.spacedChildren)({
|
|
102
196
|
children,
|
|
103
197
|
separator,
|
|
104
198
|
space,
|
|
105
199
|
direction: spaceDirection
|
|
106
|
-
})), /* @__PURE__ */
|
|
200
|
+
})), /* @__PURE__ */ React.createElement(DialogProvider, _object_spread({
|
|
201
|
+
scope: __scopeDialog
|
|
202
|
+
}, context), /* @__PURE__ */ React.createElement(import_core.Theme, {
|
|
203
|
+
name: themeName
|
|
204
|
+
}, childrenSpaced));
|
|
107
205
|
}
|
|
108
|
-
|
|
109
|
-
|
|
206
|
+
var DialogPortal = function(props) {
|
|
207
|
+
var __scopeDialog = props.__scopeDialog, forceMount = props.forceMount, children = props.children, frameProps = _object_without_properties(props, [
|
|
208
|
+
"__scopeDialog",
|
|
209
|
+
"forceMount",
|
|
210
|
+
"children"
|
|
211
|
+
]), context = useDialogContext(PORTAL_NAME, __scopeDialog), isShowing = forceMount || context.open, _React_useState = _sliced_to_array(React.useState(!isShowing), 2), isFullyHidden = _React_useState[0], setIsFullyHidden = _React_useState[1];
|
|
110
212
|
isShowing && isFullyHidden && setIsFullyHidden(!1);
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
onExitComplete: () => {
|
|
115
|
-
setIsFullyHidden(!0);
|
|
116
|
-
},
|
|
117
|
-
children: isShowing ? children : null
|
|
213
|
+
var contents = /* @__PURE__ */ React.createElement(import_animate_presence.AnimatePresence, {
|
|
214
|
+
onExitComplete: function() {
|
|
215
|
+
setIsFullyHidden(!0);
|
|
118
216
|
}
|
|
119
|
-
);
|
|
120
|
-
if (
|
|
217
|
+
}, isShowing ? children : null), isSheet = useShowDialogSheet(context);
|
|
218
|
+
if (isSheet)
|
|
121
219
|
return children;
|
|
122
220
|
if (context.modal) {
|
|
123
221
|
if (isFullyHidden)
|
|
124
222
|
return null;
|
|
125
|
-
|
|
126
|
-
|
|
223
|
+
var framedContents = /* @__PURE__ */ React.createElement(PortalProvider, {
|
|
224
|
+
scope: __scopeDialog,
|
|
225
|
+
forceMount
|
|
226
|
+
}, /* @__PURE__ */ React.createElement(DialogPortalFrame, _object_spread({
|
|
227
|
+
pointerEvents: isShowing ? "auto" : "none"
|
|
228
|
+
}, frameProps), contents));
|
|
229
|
+
if (import_constants.isWeb) {
|
|
230
|
+
var _props_zIndex;
|
|
231
|
+
return /* @__PURE__ */ React.createElement(import_portal.Portal, {
|
|
232
|
+
zIndex: (_props_zIndex = props.zIndex) !== null && _props_zIndex !== void 0 ? _props_zIndex : 1e5
|
|
233
|
+
}, /* @__PURE__ */ React.createElement(PassthroughTheme, null, framedContents));
|
|
234
|
+
}
|
|
235
|
+
return /* @__PURE__ */ React.createElement(DialogPortalItem, {
|
|
236
|
+
__scopeDialog
|
|
237
|
+
}, framedContents);
|
|
127
238
|
}
|
|
128
239
|
return contents;
|
|
129
240
|
};
|
|
130
241
|
DialogPortal.displayName = PORTAL_NAME;
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
return /* @__PURE__ */
|
|
242
|
+
var PassthroughTheme = function(param) {
|
|
243
|
+
var children = param.children, themeName = (0, import_core.useThemeName)();
|
|
244
|
+
return /* @__PURE__ */ React.createElement(import_core.Theme, {
|
|
245
|
+
name: themeName,
|
|
246
|
+
forceClassName: !0
|
|
247
|
+
}, children);
|
|
134
248
|
}, OVERLAY_NAME = "DialogOverlay", DialogOverlayFrame = (0, import_core.styled)(import_sheet.Overlay, {
|
|
135
249
|
name: OVERLAY_NAME
|
|
136
|
-
}), DialogOverlay = DialogOverlayFrame.extractable(
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
)
|
|
143
|
-
|
|
250
|
+
}), DialogOverlay = DialogOverlayFrame.extractable(/* @__PURE__ */ React.forwardRef(function(_param, forwardedRef) {
|
|
251
|
+
var __scopeDialog = _param.__scopeDialog, props = _object_without_properties(_param, [
|
|
252
|
+
"__scopeDialog"
|
|
253
|
+
]), portalContext = usePortalContext(OVERLAY_NAME, __scopeDialog), _props_forceMount = props.forceMount, forceMount = _props_forceMount === void 0 ? portalContext.forceMount : _props_forceMount, overlayProps = _object_without_properties(props, [
|
|
254
|
+
"forceMount"
|
|
255
|
+
]), context = useDialogContext(OVERLAY_NAME, __scopeDialog), showSheet = useShowDialogSheet(context);
|
|
256
|
+
return !forceMount && (!context.modal || showSheet) ? null : /* @__PURE__ */ React.createElement(DialogOverlayImpl, _object_spread_props(_object_spread({
|
|
257
|
+
context
|
|
258
|
+
}, overlayProps), {
|
|
259
|
+
ref: forwardedRef
|
|
260
|
+
}));
|
|
261
|
+
}));
|
|
144
262
|
DialogOverlay.displayName = OVERLAY_NAME;
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
}
|
|
162
|
-
), CONTENT_NAME = "DialogContent", DialogContentFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
|
|
263
|
+
var DialogOverlayImpl = /* @__PURE__ */ React.forwardRef(function(props, forwardedRef) {
|
|
264
|
+
var context = props.context, overlayProps = _object_without_properties(props, [
|
|
265
|
+
"context"
|
|
266
|
+
]);
|
|
267
|
+
return (
|
|
268
|
+
// Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`
|
|
269
|
+
// ie. when `Overlay` and `Content` are siblings
|
|
270
|
+
/* @__PURE__ */ React.createElement(DialogOverlayFrame, _object_spread_props(_object_spread({
|
|
271
|
+
"data-state": getState(context.open),
|
|
272
|
+
// We re-enable pointer-events prevented by `Dialog.Content` to allow scrolling the overlay.
|
|
273
|
+
pointerEvents: context.open ? "auto" : "none"
|
|
274
|
+
}, overlayProps), {
|
|
275
|
+
ref: forwardedRef
|
|
276
|
+
}))
|
|
277
|
+
);
|
|
278
|
+
}), CONTENT_NAME = "DialogContent", DialogContentFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
|
|
163
279
|
name: CONTENT_NAME,
|
|
164
280
|
tag: "dialog",
|
|
165
281
|
variants: {
|
|
166
282
|
size: {
|
|
167
|
-
"...size": (val, extras)
|
|
283
|
+
"...size": function(val, extras) {
|
|
284
|
+
return {};
|
|
285
|
+
}
|
|
168
286
|
},
|
|
169
287
|
unstyled: {
|
|
170
288
|
false: {
|
|
@@ -181,323 +299,321 @@ const DialogOverlayImpl = React.forwardRef(
|
|
|
181
299
|
size: "$true",
|
|
182
300
|
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
183
301
|
}
|
|
184
|
-
}), DialogContent = DialogContentFrame.extractable(
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
302
|
+
}), DialogContent = DialogContentFrame.extractable(/* @__PURE__ */ React.forwardRef(function(_param, forwardedRef) {
|
|
303
|
+
var __scopeDialog = _param.__scopeDialog, props = _object_without_properties(_param, [
|
|
304
|
+
"__scopeDialog"
|
|
305
|
+
]), portalContext = usePortalContext(CONTENT_NAME, __scopeDialog), _props_forceMount = props.forceMount, forceMount = _props_forceMount === void 0 ? portalContext.forceMount : _props_forceMount, contentProps = _object_without_properties(props, [
|
|
306
|
+
"forceMount"
|
|
307
|
+
]), context = useDialogContext(CONTENT_NAME, __scopeDialog), contents = context.modal ? /* @__PURE__ */ React.createElement(DialogContentModal, _object_spread_props(_object_spread({
|
|
308
|
+
context
|
|
309
|
+
}, contentProps), {
|
|
310
|
+
ref: forwardedRef
|
|
311
|
+
})) : /* @__PURE__ */ React.createElement(DialogContentNonModal, _object_spread_props(_object_spread({
|
|
312
|
+
context
|
|
313
|
+
}, contentProps), {
|
|
314
|
+
ref: forwardedRef
|
|
315
|
+
}));
|
|
316
|
+
return !import_constants.isWeb || context.disableRemoveScroll ? contents : /* @__PURE__ */ React.createElement(import_remove_scroll.RemoveScroll, {
|
|
317
|
+
forwardProps: !0,
|
|
318
|
+
enabled: context.open,
|
|
319
|
+
allowPinchZoom: context.allowPinchZoom,
|
|
320
|
+
shards: [
|
|
321
|
+
context.contentRef
|
|
322
|
+
],
|
|
323
|
+
// causes lots of bugs on touch web on site
|
|
324
|
+
removeScrollBar: !1
|
|
325
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
326
|
+
"data-remove-scroll-container": !0,
|
|
327
|
+
className: "_dsp_contents"
|
|
328
|
+
}, contents));
|
|
329
|
+
}));
|
|
202
330
|
DialogContent.displayName = CONTENT_NAME;
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
331
|
+
var DialogContentModal = /* @__PURE__ */ React.forwardRef(function(_param, forwardedRef) {
|
|
332
|
+
var children = _param.children, context = _param.context, props = _object_without_properties(_param, [
|
|
333
|
+
"children",
|
|
334
|
+
"context"
|
|
335
|
+
]), contentRef = React.useRef(null), composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, context.contentRef, contentRef);
|
|
336
|
+
return import_constants.isWeb && React.useEffect(function() {
|
|
337
|
+
if (context.open) {
|
|
338
|
+
var content = contentRef.current;
|
|
210
339
|
if (content)
|
|
211
340
|
return (0, import_aria_hidden.hideOthers)(content);
|
|
212
|
-
}
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
trapFocus: !1,
|
|
251
|
-
disableOutsidePointerEvents: !1,
|
|
252
|
-
onCloseAutoFocus: (event) => {
|
|
253
|
-
var _a, _b;
|
|
254
|
-
(_a = props.onCloseAutoFocus) == null || _a.call(props, event), event.defaultPrevented || (hasInteractedOutsideRef.current || (_b = props.context.triggerRef.current) == null || _b.focus(), event.preventDefault()), hasInteractedOutsideRef.current = !1;
|
|
255
|
-
},
|
|
256
|
-
onInteractOutside: (event) => {
|
|
257
|
-
var _a;
|
|
258
|
-
(_a = props.onInteractOutside) == null || _a.call(props, event), event.defaultPrevented || (hasInteractedOutsideRef.current = !0);
|
|
259
|
-
const target = event.target, trigger = props.context.triggerRef.current;
|
|
260
|
-
if (!(trigger instanceof HTMLElement))
|
|
261
|
-
return;
|
|
262
|
-
trigger.contains(target) && event.preventDefault();
|
|
341
|
+
}
|
|
342
|
+
}, [
|
|
343
|
+
context.open
|
|
344
|
+
]), /* @__PURE__ */ React.createElement(DialogContentImpl, _object_spread(_object_spread_props(_object_spread({}, props), {
|
|
345
|
+
context,
|
|
346
|
+
ref: composedRefs,
|
|
347
|
+
// we make sure focus isn't trapped once `DialogContent` has been closed
|
|
348
|
+
// (closed !== unmounted when animating out)
|
|
349
|
+
trapFocus: context.open,
|
|
350
|
+
disableOutsidePointerEvents: !0,
|
|
351
|
+
onCloseAutoFocus: (0, import_helpers.composeEventHandlers)(props.onCloseAutoFocus, function(event) {
|
|
352
|
+
var _context_triggerRef_current;
|
|
353
|
+
event.preventDefault(), (_context_triggerRef_current = context.triggerRef.current) === null || _context_triggerRef_current === void 0 || _context_triggerRef_current.focus();
|
|
354
|
+
}),
|
|
355
|
+
onPointerDownOutside: (0, import_helpers.composeEventHandlers)(props.onPointerDownOutside, function(event) {
|
|
356
|
+
var originalEvent = event.detail.originalEvent, ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === !0, isRightClick = originalEvent.button === 2 || ctrlLeftClick;
|
|
357
|
+
isRightClick && event.preventDefault();
|
|
358
|
+
}),
|
|
359
|
+
// When focus is trapped, a `focusout` event may still happen.
|
|
360
|
+
// We make sure we don't trigger our `onDismiss` in such case.
|
|
361
|
+
onFocusOutside: (0, import_helpers.composeEventHandlers)(props.onFocusOutside, function(event) {
|
|
362
|
+
return event.preventDefault();
|
|
363
|
+
})
|
|
364
|
+
}), !props.unstyled && {
|
|
365
|
+
outlineStyle: "none"
|
|
366
|
+
}), children);
|
|
367
|
+
}), DialogContentNonModal = /* @__PURE__ */ React.forwardRef(function(props, forwardedRef) {
|
|
368
|
+
var hasInteractedOutsideRef = React.useRef(!1);
|
|
369
|
+
return /* @__PURE__ */ React.createElement(DialogContentImpl, _object_spread_props(_object_spread({}, props), {
|
|
370
|
+
ref: forwardedRef,
|
|
371
|
+
trapFocus: !1,
|
|
372
|
+
disableOutsidePointerEvents: !1,
|
|
373
|
+
onCloseAutoFocus: function(event) {
|
|
374
|
+
var _props_onCloseAutoFocus;
|
|
375
|
+
if ((_props_onCloseAutoFocus = props.onCloseAutoFocus) === null || _props_onCloseAutoFocus === void 0 || _props_onCloseAutoFocus.call(props, event), !event.defaultPrevented) {
|
|
376
|
+
if (!hasInteractedOutsideRef.current) {
|
|
377
|
+
var _props_context_triggerRef_current;
|
|
378
|
+
(_props_context_triggerRef_current = props.context.triggerRef.current) === null || _props_context_triggerRef_current === void 0 || _props_context_triggerRef_current.focus();
|
|
263
379
|
}
|
|
380
|
+
event.preventDefault();
|
|
264
381
|
}
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
)
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
disableOutsidePointerEvents,
|
|
275
|
-
onEscapeKeyDown,
|
|
276
|
-
onPointerDownOutside,
|
|
277
|
-
onFocusOutside,
|
|
278
|
-
onInteractOutside,
|
|
279
|
-
context,
|
|
280
|
-
...contentProps
|
|
281
|
-
} = props, contentRef = React.useRef(null), composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, contentRef), showSheet = useShowDialogSheet(context), contents = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
282
|
-
DialogContentFrame,
|
|
283
|
-
{
|
|
284
|
-
id: context.contentId,
|
|
285
|
-
"aria-describedby": context.descriptionId,
|
|
286
|
-
"aria-labelledby": context.titleId,
|
|
287
|
-
"data-state": getState(context.open),
|
|
288
|
-
...contentProps
|
|
382
|
+
hasInteractedOutsideRef.current = !1;
|
|
383
|
+
},
|
|
384
|
+
onInteractOutside: function(event) {
|
|
385
|
+
var _props_onInteractOutside;
|
|
386
|
+
(_props_onInteractOutside = props.onInteractOutside) === null || _props_onInteractOutside === void 0 || _props_onInteractOutside.call(props, event), event.defaultPrevented || (hasInteractedOutsideRef.current = !0);
|
|
387
|
+
var target = event.target, trigger = props.context.triggerRef.current;
|
|
388
|
+
if (_instanceof(trigger, HTMLElement)) {
|
|
389
|
+
var targetIsTrigger = trigger.contains(target);
|
|
390
|
+
targetIsTrigger && event.preventDefault();
|
|
289
391
|
}
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
392
|
+
}
|
|
393
|
+
}));
|
|
394
|
+
}), DialogContentImpl = /* @__PURE__ */ React.forwardRef(function(props, forwardedRef) {
|
|
395
|
+
var __scopeDialog = props.__scopeDialog, trapFocus = props.trapFocus, onOpenAutoFocus = props.onOpenAutoFocus, onCloseAutoFocus = props.onCloseAutoFocus, disableOutsidePointerEvents = props.disableOutsidePointerEvents, onEscapeKeyDown = props.onEscapeKeyDown, onPointerDownOutside = props.onPointerDownOutside, onFocusOutside = props.onFocusOutside, onInteractOutside = props.onInteractOutside, context = props.context, contentProps = _object_without_properties(props, [
|
|
396
|
+
"__scopeDialog",
|
|
397
|
+
"trapFocus",
|
|
398
|
+
"onOpenAutoFocus",
|
|
399
|
+
"onCloseAutoFocus",
|
|
400
|
+
"disableOutsidePointerEvents",
|
|
401
|
+
"onEscapeKeyDown",
|
|
402
|
+
"onPointerDownOutside",
|
|
403
|
+
"onFocusOutside",
|
|
404
|
+
"onInteractOutside",
|
|
405
|
+
"context"
|
|
406
|
+
]), contentRef = React.useRef(null), composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, contentRef), showSheet = useShowDialogSheet(context), contents = /* @__PURE__ */ React.createElement(DialogContentFrame, _object_spread({
|
|
407
|
+
id: context.contentId,
|
|
408
|
+
"aria-describedby": context.descriptionId,
|
|
409
|
+
"aria-labelledby": context.titleId,
|
|
410
|
+
"data-state": getState(context.open)
|
|
411
|
+
}, contentProps));
|
|
412
|
+
return showSheet ? /* @__PURE__ */ React.createElement(DialogPortalItem, {
|
|
413
|
+
hostName: getSheetContentsName(context)
|
|
414
|
+
}, contentProps.children) : import_constants.isWeb ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(import_dismissable.Dismissable, {
|
|
415
|
+
disableOutsidePointerEvents: context.open && disableOutsidePointerEvents,
|
|
416
|
+
forceUnmount: !context.open,
|
|
417
|
+
onEscapeKeyDown,
|
|
418
|
+
onPointerDownOutside,
|
|
419
|
+
onFocusOutside,
|
|
420
|
+
onInteractOutside,
|
|
421
|
+
// @ts-ignore
|
|
422
|
+
ref: composedRefs,
|
|
423
|
+
onDismiss: function() {
|
|
424
|
+
return context.onOpenChange(!1);
|
|
425
|
+
}
|
|
426
|
+
}, /* @__PURE__ */ React.createElement(import_focus_scope.FocusScope, {
|
|
427
|
+
loop: !0,
|
|
428
|
+
enabled: context.open,
|
|
429
|
+
trapped: trapFocus,
|
|
430
|
+
onMountAutoFocus: onOpenAutoFocus,
|
|
431
|
+
forceUnmount: !context.open,
|
|
432
|
+
onUnmountAutoFocus: onCloseAutoFocus
|
|
433
|
+
}, contents)), process.env.NODE_ENV === "development" && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TitleWarning, {
|
|
434
|
+
titleId: context.titleId
|
|
435
|
+
}), /* @__PURE__ */ React.createElement(DescriptionWarning, {
|
|
436
|
+
contentRef,
|
|
437
|
+
descriptionId: context.descriptionId
|
|
438
|
+
}))) : contents;
|
|
439
|
+
}), TITLE_NAME = "DialogTitle", DialogTitleFrame = (0, import_core.styled)(import_text.H2, {
|
|
330
440
|
name: TITLE_NAME
|
|
331
|
-
}), DialogTitle = DialogTitleFrame.styleable(
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
441
|
+
}), DialogTitle = DialogTitleFrame.styleable(function(props, forwardedRef) {
|
|
442
|
+
var __scopeDialog = props.__scopeDialog, titleProps = _object_without_properties(props, [
|
|
443
|
+
"__scopeDialog"
|
|
444
|
+
]), context = useDialogContext(TITLE_NAME, __scopeDialog);
|
|
445
|
+
return /* @__PURE__ */ React.createElement(DialogTitleFrame, _object_spread_props(_object_spread({
|
|
446
|
+
id: context.titleId
|
|
447
|
+
}, titleProps), {
|
|
448
|
+
ref: forwardedRef
|
|
449
|
+
}));
|
|
450
|
+
});
|
|
337
451
|
DialogTitle.displayName = TITLE_NAME;
|
|
338
|
-
|
|
452
|
+
var DialogDescriptionFrame = (0, import_core.styled)(import_text.Paragraph, {
|
|
339
453
|
name: "DialogDescription"
|
|
340
|
-
}), DESCRIPTION_NAME = "DialogDescription", DialogDescription = DialogDescriptionFrame.styleable(
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
);
|
|
351
|
-
}
|
|
352
|
-
);
|
|
454
|
+
}), DESCRIPTION_NAME = "DialogDescription", DialogDescription = DialogDescriptionFrame.styleable(function(props, forwardedRef) {
|
|
455
|
+
var __scopeDialog = props.__scopeDialog, descriptionProps = _object_without_properties(props, [
|
|
456
|
+
"__scopeDialog"
|
|
457
|
+
]), context = useDialogContext(DESCRIPTION_NAME, __scopeDialog);
|
|
458
|
+
return /* @__PURE__ */ React.createElement(DialogDescriptionFrame, _object_spread_props(_object_spread({
|
|
459
|
+
id: context.descriptionId
|
|
460
|
+
}, descriptionProps), {
|
|
461
|
+
ref: forwardedRef
|
|
462
|
+
}));
|
|
463
|
+
});
|
|
353
464
|
DialogDescription.displayName = DESCRIPTION_NAME;
|
|
354
|
-
|
|
465
|
+
var CLOSE_NAME = "DialogClose", DialogCloseFrame = (0, import_core.styled)(import_core.View, {
|
|
355
466
|
name: CLOSE_NAME,
|
|
356
467
|
tag: "button"
|
|
357
|
-
}), DialogClose = DialogCloseFrame.styleable(
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
);
|
|
376
|
-
}
|
|
377
|
-
);
|
|
468
|
+
}), DialogClose = DialogCloseFrame.styleable(function(props, forwardedRef) {
|
|
469
|
+
var __scopeDialog = props.__scopeDialog, displayWhenAdapted = props.displayWhenAdapted, closeProps = _object_without_properties(props, [
|
|
470
|
+
"__scopeDialog",
|
|
471
|
+
"displayWhenAdapted"
|
|
472
|
+
]), context = useDialogContext(CLOSE_NAME, __scopeDialog, {
|
|
473
|
+
warn: !1,
|
|
474
|
+
fallback: {}
|
|
475
|
+
}), isSheet = useShowDialogSheet(context), isInsideButton = React.useContext(import_stacks.ButtonNestingContext);
|
|
476
|
+
return isSheet && !displayWhenAdapted ? null : /* @__PURE__ */ React.createElement(DialogCloseFrame, _object_spread_props(_object_spread({
|
|
477
|
+
accessibilityLabel: "Dialog Close",
|
|
478
|
+
tag: isInsideButton ? "span" : "button"
|
|
479
|
+
}, closeProps), {
|
|
480
|
+
ref: forwardedRef,
|
|
481
|
+
onPress: (0, import_helpers.composeEventHandlers)(props.onPress, function() {
|
|
482
|
+
return context.onOpenChange(!1);
|
|
483
|
+
})
|
|
484
|
+
}));
|
|
485
|
+
});
|
|
378
486
|
function getState(open) {
|
|
379
487
|
return open ? "open" : "closed";
|
|
380
488
|
}
|
|
381
|
-
|
|
489
|
+
var TITLE_WARNING_NAME = "DialogTitleWarning", _createContext = _sliced_to_array((0, import_create_context.createContext)(TITLE_WARNING_NAME, {
|
|
382
490
|
contentName: CONTENT_NAME,
|
|
383
491
|
titleName: TITLE_NAME,
|
|
384
492
|
docsSlug: "dialog"
|
|
385
|
-
}), TitleWarning = (
|
|
493
|
+
}), 2), DialogWarningProvider = _createContext[0], useWarningContext = _createContext[1], TitleWarning = function(param) {
|
|
494
|
+
var titleId = param.titleId;
|
|
386
495
|
if (process.env.NODE_ENV === "development") {
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
496
|
+
var titleWarningContext = useWarningContext(TITLE_WARNING_NAME), MESSAGE = "`".concat(titleWarningContext.contentName, "` requires a `").concat(titleWarningContext.titleName, "` for the component to be accessible for screen reader users.\n\nIf you want to hide the `").concat(titleWarningContext.titleName, "`, you can wrap it with our VisuallyHidden component.");
|
|
497
|
+
React.useEffect(function() {
|
|
498
|
+
if (import_constants.isWeb && titleId) {
|
|
499
|
+
var hasTitle = document.getElementById(titleId);
|
|
500
|
+
hasTitle || console.warn(MESSAGE);
|
|
501
|
+
}
|
|
502
|
+
}, [
|
|
503
|
+
MESSAGE,
|
|
504
|
+
titleId
|
|
505
|
+
]);
|
|
393
506
|
}
|
|
394
507
|
return null;
|
|
395
|
-
}, DESCRIPTION_WARNING_NAME = "DialogDescriptionWarning", DescriptionWarning = ({
|
|
396
|
-
contentRef,
|
|
397
|
-
descriptionId
|
|
398
|
-
}) => {
|
|
508
|
+
}, DESCRIPTION_WARNING_NAME = "DialogDescriptionWarning", DescriptionWarning = function(param) {
|
|
509
|
+
var contentRef = param.contentRef, descriptionId = param.descriptionId;
|
|
399
510
|
if (process.env.NODE_ENV === "development") {
|
|
400
|
-
|
|
401
|
-
React.useEffect(()
|
|
402
|
-
if (
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
511
|
+
var descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME), MESSAGE = "Warning: Missing `Description` or `aria-describedby={undefined}` for {".concat(descriptionWarningContext.contentName, "}.");
|
|
512
|
+
React.useEffect(function() {
|
|
513
|
+
if (import_constants.isWeb) {
|
|
514
|
+
var contentNode = contentRef.current;
|
|
515
|
+
if (_instanceof(contentNode, HTMLElement)) {
|
|
516
|
+
var describedById = contentNode.getAttribute("aria-describedby");
|
|
517
|
+
if (descriptionId && describedById) {
|
|
518
|
+
var hasDescription = document.getElementById(descriptionId);
|
|
519
|
+
hasDescription || console.warn(MESSAGE);
|
|
520
|
+
}
|
|
521
|
+
}
|
|
522
|
+
}
|
|
523
|
+
}, [
|
|
524
|
+
MESSAGE,
|
|
525
|
+
contentRef,
|
|
526
|
+
descriptionId
|
|
527
|
+
]);
|
|
410
528
|
}
|
|
411
529
|
return null;
|
|
412
|
-
}, Dialog = (0, import_helpers.withStaticProperties)(
|
|
413
|
-
React.
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
} = props, baseId = React.useId(), scopeId = `scope-${baseId}`, contentId = `content-${baseId}`, titleId = `title-${baseId}`, descriptionId = `description-${baseId}`, scopeKey = __scopeDialog ? Object.keys(__scopeDialog)[0] : scopeId, sheetContentsName = getSheetContentsName({ scopeKey, contentId }), triggerRef = React.useRef(null), contentRef = React.useRef(null), [open, setOpen] = (0, import_use_controllable_state.useControllableState)({
|
|
424
|
-
prop: openProp,
|
|
425
|
-
defaultProp: defaultOpen,
|
|
426
|
-
onChange: onOpenChange
|
|
427
|
-
}), onOpenToggle = React.useCallback(() => {
|
|
428
|
-
setOpen((prevOpen) => !prevOpen);
|
|
429
|
-
}, [setOpen]), context = {
|
|
430
|
-
scope: __scopeDialog,
|
|
431
|
-
scopeKey,
|
|
432
|
-
triggerRef,
|
|
433
|
-
contentRef,
|
|
434
|
-
contentId,
|
|
435
|
-
titleId,
|
|
436
|
-
descriptionId,
|
|
437
|
-
open,
|
|
438
|
-
onOpenChange: setOpen,
|
|
439
|
-
onOpenToggle,
|
|
440
|
-
modal,
|
|
441
|
-
allowPinchZoom
|
|
442
|
-
}, { when, AdaptProvider } = (0, import_adapt.useAdaptParent)({
|
|
443
|
-
Contents: React.useCallback(
|
|
444
|
-
(props2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_portal.PortalHost, { forwardProps: props2, name: sheetContentsName }),
|
|
445
|
-
[sheetContentsName]
|
|
446
|
-
)
|
|
530
|
+
}, Dialog = (0, import_helpers.withStaticProperties)(/* @__PURE__ */ React.forwardRef(function(props, ref) {
|
|
531
|
+
var __scopeDialog = props.__scopeDialog, children = props.children, openProp = props.open, _props_defaultOpen = props.defaultOpen, defaultOpen = _props_defaultOpen === void 0 ? !1 : _props_defaultOpen, onOpenChange = props.onOpenChange, _props_modal = props.modal, modal = _props_modal === void 0 ? !0 : _props_modal, _props_allowPinchZoom = props.allowPinchZoom, allowPinchZoom = _props_allowPinchZoom === void 0 ? !1 : _props_allowPinchZoom, _props_disableRemoveScroll = props.disableRemoveScroll, disableRemoveScroll = _props_disableRemoveScroll === void 0 ? !1 : _props_disableRemoveScroll, baseId = React.useId(), scopeId = "scope-".concat(baseId), contentId = "content-".concat(baseId), titleId = "title-".concat(baseId), descriptionId = "description-".concat(baseId), scopeKey = __scopeDialog ? Object.keys(__scopeDialog)[0] : scopeId, sheetContentsName = getSheetContentsName({
|
|
532
|
+
scopeKey,
|
|
533
|
+
contentId
|
|
534
|
+
}), triggerRef = React.useRef(null), contentRef = React.useRef(null), _useControllableState = _sliced_to_array((0, import_use_controllable_state.useControllableState)({
|
|
535
|
+
prop: openProp,
|
|
536
|
+
defaultProp: defaultOpen,
|
|
537
|
+
onChange: onOpenChange
|
|
538
|
+
}), 2), open = _useControllableState[0], setOpen = _useControllableState[1], onOpenToggle = React.useCallback(function() {
|
|
539
|
+
setOpen(function(prevOpen) {
|
|
540
|
+
return !prevOpen;
|
|
447
541
|
});
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
})
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
542
|
+
}, [
|
|
543
|
+
setOpen
|
|
544
|
+
]), context = {
|
|
545
|
+
scope: __scopeDialog,
|
|
546
|
+
scopeKey,
|
|
547
|
+
triggerRef,
|
|
548
|
+
contentRef,
|
|
549
|
+
contentId,
|
|
550
|
+
titleId,
|
|
551
|
+
descriptionId,
|
|
552
|
+
open,
|
|
553
|
+
onOpenChange: setOpen,
|
|
554
|
+
onOpenToggle,
|
|
555
|
+
modal,
|
|
556
|
+
allowPinchZoom
|
|
557
|
+
}, _useAdaptParent = (0, import_adapt.useAdaptParent)({
|
|
558
|
+
Contents: React.useCallback(function(props2) {
|
|
559
|
+
return /* @__PURE__ */ React.createElement(import_portal.PortalHost, {
|
|
560
|
+
forwardProps: props2,
|
|
561
|
+
name: sheetContentsName
|
|
562
|
+
});
|
|
563
|
+
}, [
|
|
564
|
+
sheetContentsName
|
|
565
|
+
])
|
|
566
|
+
}), when = _useAdaptParent.when, AdaptProvider = _useAdaptParent.AdaptProvider;
|
|
567
|
+
return React.useImperativeHandle(ref, function() {
|
|
568
|
+
return {
|
|
569
|
+
open: setOpen
|
|
570
|
+
};
|
|
571
|
+
}, [
|
|
572
|
+
setOpen
|
|
573
|
+
]), /* @__PURE__ */ React.createElement(AdaptProvider, null, /* @__PURE__ */ React.createElement(DialogProvider, _object_spread_props(_object_spread({}, context), {
|
|
574
|
+
sheetBreakpoint: when,
|
|
575
|
+
disableRemoveScroll
|
|
576
|
+
}), /* @__PURE__ */ React.createElement(DialogSheetController, {
|
|
577
|
+
onOpenChange: setOpen,
|
|
578
|
+
__scopeDialog
|
|
579
|
+
}, children)));
|
|
580
|
+
}), {
|
|
581
|
+
Trigger: DialogTrigger,
|
|
582
|
+
Portal: DialogPortal,
|
|
583
|
+
Overlay: DialogOverlay,
|
|
584
|
+
Content: DialogContent,
|
|
585
|
+
Title: DialogTitle,
|
|
586
|
+
Description: DialogDescription,
|
|
587
|
+
Close: DialogClose,
|
|
588
|
+
Sheet: import_sheet.Sheet.Controlled,
|
|
589
|
+
Adapt: import_adapt.Adapt
|
|
590
|
+
}), SHEET_CONTENTS_NAME = "DialogSheetContents", DialogSheetContents = function(_param) {
|
|
591
|
+
var name = _param.name, props = _object_without_properties(_param, [
|
|
592
|
+
"name"
|
|
593
|
+
]);
|
|
594
|
+
return /* @__PURE__ */ React.createElement(import_portal.PortalHost, {
|
|
595
|
+
forwardProps: props,
|
|
596
|
+
name
|
|
597
|
+
});
|
|
598
|
+
};
|
|
479
599
|
DialogSheetContents.displayName = SHEET_CONTENTS_NAME;
|
|
480
|
-
|
|
481
|
-
scopeKey,
|
|
482
|
-
contentId
|
|
483
|
-
}
|
|
484
|
-
|
|
485
|
-
return /* @__PURE__ */ (
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
}
|
|
495
|
-
);
|
|
496
|
-
}, useSheetBreakpointActive = (context) => {
|
|
497
|
-
const media = (0, import_core.useMedia)();
|
|
600
|
+
var getSheetContentsName = function(param) {
|
|
601
|
+
var scopeKey = param.scopeKey, contentId = param.contentId;
|
|
602
|
+
return "".concat(scopeKey || contentId, "SheetContents");
|
|
603
|
+
}, DialogSheetController = function(props) {
|
|
604
|
+
var context = useDialogContext("DialogSheetController", props.__scopeDialog), showSheet = useShowDialogSheet(context), breakpointActive = useSheetBreakpointActive(context), getShowSheet = (0, import_core.useGet)(showSheet);
|
|
605
|
+
return /* @__PURE__ */ React.createElement(import_sheet.SheetController, {
|
|
606
|
+
onOpenChange: function(val) {
|
|
607
|
+
getShowSheet() && props.onOpenChange(val);
|
|
608
|
+
},
|
|
609
|
+
open: context.open,
|
|
610
|
+
hidden: breakpointActive === !1
|
|
611
|
+
}, props.children);
|
|
612
|
+
}, useSheetBreakpointActive = function(context) {
|
|
613
|
+
var media = (0, import_core.useMedia)();
|
|
498
614
|
return context.sheetBreakpoint ? context.sheetBreakpoint === !0 ? !0 : media[context.sheetBreakpoint] : !1;
|
|
499
|
-
}, useShowDialogSheet = (context)
|
|
500
|
-
|
|
615
|
+
}, useShowDialogSheet = function(context) {
|
|
616
|
+
var breakpointActive = useSheetBreakpointActive(context);
|
|
501
617
|
return context.open === !1 ? !1 : breakpointActive;
|
|
502
618
|
};
|
|
503
619
|
// Annotate the CommonJS export names for ESM import in node:
|