@jobber/components 8.26.3 → 8.27.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Select.d.ts +1 -0
- package/Select.js +17 -0
- package/dist/BottomSheet-cjs.js +8 -7
- package/dist/BottomSheet-es.js +9 -8
- package/dist/ComboboxChipRemove-cjs.js +2 -1
- package/dist/ComboboxChipRemove-es.js +4 -3
- package/dist/DrawerDescription-cjs.js +4 -97
- package/dist/DrawerDescription-es.js +6 -98
- package/dist/FieldDescription-cjs.js +880 -0
- package/dist/FieldDescription-es.js +856 -0
- package/dist/InputNumberExperimental-cjs.js +5 -875
- package/dist/InputNumberExperimental-es.js +2 -854
- package/dist/MenuSubmenuTrigger-es.js +4 -4
- package/dist/Modal/index.cjs +12 -2
- package/dist/Modal/index.mjs +13 -3
- package/dist/NumberFieldInput-cjs.js +2 -2
- package/dist/NumberFieldInput-es.js +1 -1
- package/dist/ScrollAreaViewport-cjs.js +2122 -12
- package/dist/ScrollAreaViewport-es.js +2118 -13
- package/dist/Select/Select.d.ts +31 -0
- package/dist/Select/Select.types.d.ts +145 -0
- package/dist/Select/SelectBottomSheet.d.ts +4 -0
- package/dist/Select/SelectDropdown.d.ts +4 -0
- package/dist/Select/index.cjs +41 -0
- package/dist/Select/index.d.ts +2 -0
- package/dist/Select/index.mjs +35 -0
- package/dist/Select-cjs.js +231 -0
- package/dist/Select-es.js +229 -0
- package/dist/SelectPrimitive-cjs.js +20 -3
- package/dist/SelectPrimitive-es.js +20 -3
- package/dist/dialogReturnFocus-cjs.js +8 -5
- package/dist/dialogReturnFocus-es.js +9 -6
- package/dist/docs/Dialog/Dialog.md +74 -21
- package/dist/docs/Select/Select.md +428 -0
- package/dist/docs/SelectPrimitive/SelectPrimitive.md +14 -1
- package/dist/docs/index.md +1 -0
- package/dist/floating-ui.react-dom-es.js +1 -1
- package/dist/floating-ui.react-es.js +1 -1
- package/dist/floating-ui.utils.dom-es.js +1 -1
- package/dist/index.cjs +9 -0
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.mjs +8 -0
- package/dist/primitives/ComboboxPrimitive/index.cjs +1 -0
- package/dist/primitives/ComboboxPrimitive/index.mjs +1 -0
- package/dist/primitives/HelperText/HelperText.d.ts +2 -1
- package/dist/primitives/InputNumberExperimental/index.cjs +3 -1
- package/dist/primitives/InputNumberExperimental/index.mjs +3 -1
- package/dist/primitives/SelectPrimitive/SelectPrimitive.d.ts +11 -0
- package/dist/primitives/SelectPrimitive/index.d.ts +1 -1
- package/dist/primitives/SelectPrimitive/types.d.ts +15 -0
- package/dist/primitives/index.cjs +2 -0
- package/dist/primitives/index.mjs +2 -0
- package/dist/stringifyLocale-cjs.js +13 -0
- package/dist/stringifyLocale-es.js +11 -0
- package/dist/styles.css +300 -10
- package/dist/unstyledPrimitives/index.cjs +219 -2230
- package/dist/unstyledPrimitives/index.mjs +225 -2236
- package/dist/useButton-es.js +2 -2
- package/dist/useCompositeListItem-es.js +1 -1
- package/dist/useLabel-cjs.js +0 -11
- package/dist/useLabel-es.js +2 -12
- package/dist/useScrollLock-es.js +3 -3
- package/dist/utils/meta/meta.json +5 -0
- package/package.json +7 -2
package/Select.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./dist/Select";
|
package/Select.js
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true,
|
|
5
|
+
});
|
|
6
|
+
|
|
7
|
+
var Select = require("./dist/Select");
|
|
8
|
+
|
|
9
|
+
Object.keys(Select).forEach(function(key) {
|
|
10
|
+
if (key === "default" || key === "__esModule") return;
|
|
11
|
+
Object.defineProperty(exports, key, {
|
|
12
|
+
enumerable: true,
|
|
13
|
+
get: function get() {
|
|
14
|
+
return Select[key];
|
|
15
|
+
},
|
|
16
|
+
});
|
|
17
|
+
});
|
package/dist/BottomSheet-cjs.js
CHANGED
|
@@ -7,7 +7,7 @@ var buttonRenderAdapter = require('./buttonRenderAdapter-cjs.js');
|
|
|
7
7
|
var Button = require('./Button-cjs.js');
|
|
8
8
|
var ScrollAreaViewport = require('./ScrollAreaViewport-cjs.js');
|
|
9
9
|
|
|
10
|
-
var styles = {"backdrop":"Qf3IFhKJwQ0-","popup":"_868PDAA3U2M-","content":"eKuxReHyju8-","scrollRoot":"V--tRnN-P0I-","scrollArea":"_1I0eaFciaWo-","bottomFade":"BYEzqcZUGls-","spinning":"IJxq5fm5qdw-"};
|
|
10
|
+
var styles = {"backdrop":"Qf3IFhKJwQ0-","viewport":"U069n8h0urk-","popup":"_868PDAA3U2M-","content":"eKuxReHyju8-","scrollRoot":"V--tRnN-P0I-","scrollArea":"_1I0eaFciaWo-","bottomFade":"BYEzqcZUGls-","spinning":"IJxq5fm5qdw-"};
|
|
11
11
|
|
|
12
12
|
// `resolveBottomSheetTriggerRender` so an Atlantis `<Button>` works as a trigger
|
|
13
13
|
// via `children` or `render`. Raw text children are wrapped in a default Button.
|
|
@@ -64,11 +64,12 @@ function BottomSheetPopup(_a) {
|
|
|
64
64
|
const renderScrollArea = React.useContext(BottomSheetScrollAreaContext);
|
|
65
65
|
return (React.createElement(ScrollAreaViewport.DrawerPortal, null,
|
|
66
66
|
React.createElement(ScrollAreaViewport.DrawerBackdrop, { forceRender: true, className: styles.backdrop, "data-testid": "ATL-BottomSheet-Backdrop" }),
|
|
67
|
-
React.createElement(ScrollAreaViewport.
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
67
|
+
React.createElement(ScrollAreaViewport.DrawerViewport, { className: styles.viewport, "data-testid": "ATL-BottomSheet-Viewport" },
|
|
68
|
+
React.createElement(ScrollAreaViewport.DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }), !renderScrollArea ? (
|
|
69
|
+
// The consumer manages its own scroll region (e.g. Dialog pins a
|
|
70
|
+
// header/footer outside a single scroll area) — often by composing
|
|
71
|
+
// `BottomSheet.ScrollArea` itself.
|
|
72
|
+
children) : (React.createElement(BottomSheetScrollArea, null, children))))));
|
|
72
73
|
}
|
|
73
74
|
/**
|
|
74
75
|
* The sheet's scroll region: a styled BaseUI `ScrollArea` (native scrollbar) with
|
|
@@ -78,7 +79,7 @@ function BottomSheetPopup(_a) {
|
|
|
78
79
|
* directly.
|
|
79
80
|
*/
|
|
80
81
|
function BottomSheetScrollArea({ children, className, style, }) {
|
|
81
|
-
return (React.createElement(ScrollAreaViewport.ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style },
|
|
82
|
+
return (React.createElement(ScrollAreaViewport.ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style, "data-testid": "ATL-BottomSheet-ScrollRegion" },
|
|
82
83
|
React.createElement(ScrollAreaViewport.ScrollAreaViewport, { className: styles.scrollArea, "data-testid": "ATL-BottomSheet-ScrollArea",
|
|
83
84
|
// BaseUI sets overflow: scroll in the style prop by default. This is to override that because adding it to the className doesn't work.
|
|
84
85
|
style: { overflow: "auto" } }, children),
|
package/dist/BottomSheet-es.js
CHANGED
|
@@ -3,9 +3,9 @@ import React__default from 'react';
|
|
|
3
3
|
import classnames from 'classnames';
|
|
4
4
|
import { n as normalizeBaseUiButtonProps, i as isAtlantisButtonRenderTarget, s as stripNativeTypeFromButtonRenderTarget, r as renderAtlantisButtonTarget } from './buttonRenderAdapter-es.js';
|
|
5
5
|
import { B as Button } from './Button-es.js';
|
|
6
|
-
import { D as DrawerTrigger, a as DrawerRoot, b as DrawerPortal, c as DrawerBackdrop, d as DrawerPopup, S as ScrollAreaRoot,
|
|
6
|
+
import { D as DrawerTrigger, a as DrawerRoot, b as DrawerPortal, c as DrawerBackdrop, d as DrawerViewport, e as DrawerPopup, S as ScrollAreaRoot, f as ScrollAreaViewport, g as DrawerContent } from './ScrollAreaViewport-es.js';
|
|
7
7
|
|
|
8
|
-
var styles = {"backdrop":"Qf3IFhKJwQ0-","popup":"_868PDAA3U2M-","content":"eKuxReHyju8-","scrollRoot":"V--tRnN-P0I-","scrollArea":"_1I0eaFciaWo-","bottomFade":"BYEzqcZUGls-","spinning":"IJxq5fm5qdw-"};
|
|
8
|
+
var styles = {"backdrop":"Qf3IFhKJwQ0-","viewport":"U069n8h0urk-","popup":"_868PDAA3U2M-","content":"eKuxReHyju8-","scrollRoot":"V--tRnN-P0I-","scrollArea":"_1I0eaFciaWo-","bottomFade":"BYEzqcZUGls-","spinning":"IJxq5fm5qdw-"};
|
|
9
9
|
|
|
10
10
|
// `resolveBottomSheetTriggerRender` so an Atlantis `<Button>` works as a trigger
|
|
11
11
|
// via `children` or `render`. Raw text children are wrapped in a default Button.
|
|
@@ -62,11 +62,12 @@ function BottomSheetPopup(_a) {
|
|
|
62
62
|
const renderScrollArea = React__default.useContext(BottomSheetScrollAreaContext);
|
|
63
63
|
return (React__default.createElement(DrawerPortal, null,
|
|
64
64
|
React__default.createElement(DrawerBackdrop, { forceRender: true, className: styles.backdrop, "data-testid": "ATL-BottomSheet-Backdrop" }),
|
|
65
|
-
React__default.createElement(
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
65
|
+
React__default.createElement(DrawerViewport, { className: styles.viewport, "data-testid": "ATL-BottomSheet-Viewport" },
|
|
66
|
+
React__default.createElement(DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }), !renderScrollArea ? (
|
|
67
|
+
// The consumer manages its own scroll region (e.g. Dialog pins a
|
|
68
|
+
// header/footer outside a single scroll area) — often by composing
|
|
69
|
+
// `BottomSheet.ScrollArea` itself.
|
|
70
|
+
children) : (React__default.createElement(BottomSheetScrollArea, null, children))))));
|
|
70
71
|
}
|
|
71
72
|
/**
|
|
72
73
|
* The sheet's scroll region: a styled BaseUI `ScrollArea` (native scrollbar) with
|
|
@@ -76,7 +77,7 @@ function BottomSheetPopup(_a) {
|
|
|
76
77
|
* directly.
|
|
77
78
|
*/
|
|
78
79
|
function BottomSheetScrollArea({ children, className, style, }) {
|
|
79
|
-
return (React__default.createElement(ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style },
|
|
80
|
+
return (React__default.createElement(ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style, "data-testid": "ATL-BottomSheet-ScrollRegion" },
|
|
80
81
|
React__default.createElement(ScrollAreaViewport, { className: styles.scrollArea, "data-testid": "ATL-BottomSheet-ScrollArea",
|
|
81
82
|
// BaseUI sets overflow: scroll in the style prop by default. This is to override that because adding it to the className doesn't work.
|
|
82
83
|
style: { overflow: "auto" } }, children),
|
|
@@ -9,6 +9,7 @@ var resolveAriaLabelledBy = require('./resolveAriaLabelledBy-cjs.js');
|
|
|
9
9
|
var useScrollLock = require('./useScrollLock-cjs.js');
|
|
10
10
|
var jsxRuntime = require('react/jsx-runtime');
|
|
11
11
|
var ReactDOM = require('react-dom');
|
|
12
|
+
var stringifyLocale = require('./stringifyLocale-cjs.js');
|
|
12
13
|
var useLabel = require('./useLabel-cjs.js');
|
|
13
14
|
var floatingUi_utils_dom = require('./floating-ui.utils.dom-cjs.js');
|
|
14
15
|
|
|
@@ -231,7 +232,7 @@ function getFilter(options = {}) {
|
|
|
231
232
|
ignorePunctuation: true,
|
|
232
233
|
...options
|
|
233
234
|
};
|
|
234
|
-
const cacheKey = `${
|
|
235
|
+
const cacheKey = `${stringifyLocale.stringifyLocale(options.locale)}|${JSON.stringify(mergedOptions)}`;
|
|
235
236
|
const cachedFilter = filterCache.get(cacheKey);
|
|
236
237
|
if (cachedFilter) {
|
|
237
238
|
return cachedFilter;
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { z as useControlled, b as useStableCallback, m as useValueAsRef, k as useTransitionStatus, a as useIsoLayoutEffect, J as createGenericEventDetails, G as inputClear, F as inputChange, d as createChangeEventDetails, v as focusOut, Q as outsidePress, g as getTarget, V as itemPress, f as useOpenChangeComplete, O as useValueChanged, C as none,
|
|
2
|
+
import { z as useControlled, b as useStableCallback, m as useValueAsRef, k as useTransitionStatus, a as useIsoLayoutEffect, J as createGenericEventDetails, G as inputClear, F as inputChange, d as createChangeEventDetails, v as focusOut, Q as outsidePress, g as getTarget, V as itemPress, f as useOpenChangeComplete, O as useValueChanged, C as none, a7 as inputPress, q as contains, D as visuallyHiddenInput, E as visuallyHidden, h as useTimeout, c as useButton, o as ownerDocument, s as stopEvent, r as listNavigation, e as closePress, u as useBaseUiId, a3 as android, _ as escapeKey, a8 as clearPress, t as transitionStatusMapping, A as ios, S as SafeReact, j as error, a9 as chipRemovePress } from './useButton-es.js';
|
|
3
3
|
import { f as formatErrorMessage, b as EMPTY_ARRAY, a as useRefWithInit, E as EMPTY_OBJECT, N as NOOP, m as mergeProps, c as useMergedRefs, u as useRenderElement } from './useRenderElement-es.js';
|
|
4
4
|
import { a as useFormContext, b as useFieldRootContext, c as useLabelableId, d as useRegisterFieldControl, f as fieldValidityMapping, u as useLabelableContext, F as FieldRootContext, e as DEFAULT_FIELD_ROOT_CONTEXT, g as DEFAULT_FIELD_STATE_ATTRIBUTES } from './useLabelableId-es.js';
|
|
5
5
|
import { u as useFloatingRootContext, a as useListNavigation, b as useTypeahead, g as getPseudoElementBounds, C as CompositeList, d as useAnchorPositioning, c as useAnchoredPopupScrollLock, e as usePositioner, f as getDisabledMountTransitionStyles, h as useCompositeListItem, I as IndexGuessBehavior } from './useCompositeListItem-es.js';
|
|
6
6
|
import { h as hasNullItemLabel, c as compareItemEquality, a as stringifyAsLabel, k as isGroupedItems, s as stringifyAsValue, i as selectedValueIncludes, j as removeItem, f as findItemIndex, d as defaultItemEquality, b as areArraysEqual, r as resolveAriaLabelledBy, l as getDefaultLabelId, e as resolveMultipleLabels, g as resolveSelectedLabel } from './resolveAriaLabelledBy-es.js';
|
|
7
|
-
import {
|
|
7
|
+
import { al as getGridNavigatedIndex, e as isIndexOutOfListBounds, t as createSelector, r as useDirection, S as Store, w as useStore, v as useOpenInteractionType, x as useClick, y as useDismiss, F as FOCUSABLE_POPUP_PROPS, z as useOnFirstRender, B as pressableTriggerOpenStateMapping, am as gecko, Q as isInteractiveElement, af as triggerOpenStateMapping, E as FloatingPortal, p as popupStateMapping, I as InternalBackdrop, G as inertValue, H as DROPDOWN_COLLISION_AVOIDANCE, a as FloatingFocusManager } from './useScrollLock-es.js';
|
|
8
8
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
9
9
|
import * as ReactDOM from 'react-dom';
|
|
10
|
-
import { s as stringifyLocale
|
|
10
|
+
import { s as stringifyLocale } from './stringifyLocale-es.js';
|
|
11
|
+
import { u as useLabel } from './useLabel-es.js';
|
|
11
12
|
import { b as isElement } from './floating-ui.utils.dom-es.js';
|
|
12
13
|
|
|
13
14
|
/**
|
|
@@ -27,7 +27,7 @@ function _interopNamespaceDefault(e) {
|
|
|
27
27
|
|
|
28
28
|
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
29
29
|
|
|
30
|
-
const stateAttributesMapping$
|
|
30
|
+
const stateAttributesMapping$1 = {
|
|
31
31
|
...useScrollLock.popupStateMapping,
|
|
32
32
|
...useButton.transitionStatusMapping
|
|
33
33
|
};
|
|
@@ -60,7 +60,7 @@ const DialogBackdrop = /*#__PURE__*/React__namespace.forwardRef(function DialogB
|
|
|
60
60
|
return useRenderElement.useRenderElement('div', componentProps, {
|
|
61
61
|
state,
|
|
62
62
|
ref: [store.context.backdropRef, forwardedRef],
|
|
63
|
-
stateAttributesMapping: stateAttributesMapping$
|
|
63
|
+
stateAttributesMapping: stateAttributesMapping$1,
|
|
64
64
|
props: [{
|
|
65
65
|
role: 'presentation',
|
|
66
66
|
hidden: !mounted,
|
|
@@ -139,7 +139,7 @@ let DialogPopupDataAttributes = function (DialogPopupDataAttributes) {
|
|
|
139
139
|
return DialogPopupDataAttributes;
|
|
140
140
|
}({});
|
|
141
141
|
|
|
142
|
-
const stateAttributesMapping
|
|
142
|
+
const stateAttributesMapping = {
|
|
143
143
|
...useScrollLock.popupStateMapping,
|
|
144
144
|
...useButton.transitionStatusMapping,
|
|
145
145
|
nestedDialogOpen(value) {
|
|
@@ -220,7 +220,7 @@ const DialogPopup = /*#__PURE__*/React__namespace.forwardRef(function DialogPopu
|
|
|
220
220
|
}
|
|
221
221
|
}, elementProps],
|
|
222
222
|
ref: [forwardedRef, store.context.popupRef, setPopupElement],
|
|
223
|
-
stateAttributesMapping
|
|
223
|
+
stateAttributesMapping
|
|
224
224
|
});
|
|
225
225
|
return /*#__PURE__*/jsxRuntime.jsx(useScrollLock.FloatingFocusManager, {
|
|
226
226
|
context: floatingRootContext,
|
|
@@ -236,98 +236,6 @@ const DialogPopup = /*#__PURE__*/React__namespace.forwardRef(function DialogPopu
|
|
|
236
236
|
});
|
|
237
237
|
if (process.env.NODE_ENV !== "production") DialogPopup.displayName = "DialogPopup";
|
|
238
238
|
|
|
239
|
-
let DialogViewportDataAttributes = function (DialogViewportDataAttributes) {
|
|
240
|
-
/**
|
|
241
|
-
* Present when the dialog is open.
|
|
242
|
-
*/
|
|
243
|
-
DialogViewportDataAttributes[DialogViewportDataAttributes["open"] = useScrollLock.CommonPopupDataAttributes.open] = "open";
|
|
244
|
-
/**
|
|
245
|
-
* Present when the dialog is closed.
|
|
246
|
-
*/
|
|
247
|
-
DialogViewportDataAttributes[DialogViewportDataAttributes["closed"] = useScrollLock.CommonPopupDataAttributes.closed] = "closed";
|
|
248
|
-
/**
|
|
249
|
-
* Present when the dialog is animating in.
|
|
250
|
-
*/
|
|
251
|
-
DialogViewportDataAttributes[DialogViewportDataAttributes["startingStyle"] = useScrollLock.CommonPopupDataAttributes.startingStyle] = "startingStyle";
|
|
252
|
-
/**
|
|
253
|
-
* Present when the dialog is animating out.
|
|
254
|
-
*/
|
|
255
|
-
DialogViewportDataAttributes[DialogViewportDataAttributes["endingStyle"] = useScrollLock.CommonPopupDataAttributes.endingStyle] = "endingStyle";
|
|
256
|
-
/**
|
|
257
|
-
* Present when the dialog is nested within another dialog.
|
|
258
|
-
*/
|
|
259
|
-
DialogViewportDataAttributes["nested"] = "data-nested";
|
|
260
|
-
/**
|
|
261
|
-
* Present when the dialog has other open dialogs nested within it.
|
|
262
|
-
*/
|
|
263
|
-
DialogViewportDataAttributes["nestedDialogOpen"] = "data-nested-dialog-open";
|
|
264
|
-
return DialogViewportDataAttributes;
|
|
265
|
-
}({});
|
|
266
|
-
|
|
267
|
-
const stateAttributesMapping = {
|
|
268
|
-
...useScrollLock.popupStateMapping,
|
|
269
|
-
...useButton.transitionStatusMapping,
|
|
270
|
-
nested(value) {
|
|
271
|
-
return value ? {
|
|
272
|
-
[DialogViewportDataAttributes.nested]: ''
|
|
273
|
-
} : null;
|
|
274
|
-
},
|
|
275
|
-
nestedDialogOpen(value) {
|
|
276
|
-
return value ? {
|
|
277
|
-
[DialogViewportDataAttributes.nestedDialogOpen]: ''
|
|
278
|
-
} : null;
|
|
279
|
-
}
|
|
280
|
-
};
|
|
281
|
-
|
|
282
|
-
/**
|
|
283
|
-
* A positioning container for the dialog popup that can be made scrollable.
|
|
284
|
-
* Renders a `<div>` element.
|
|
285
|
-
*
|
|
286
|
-
* Documentation: [Base UI Dialog](https://base-ui.com/react/components/dialog)
|
|
287
|
-
*/
|
|
288
|
-
const DialogViewport = /*#__PURE__*/React__namespace.forwardRef(function DialogViewport(componentProps, forwardedRef) {
|
|
289
|
-
const {
|
|
290
|
-
render,
|
|
291
|
-
className,
|
|
292
|
-
style,
|
|
293
|
-
children,
|
|
294
|
-
...elementProps
|
|
295
|
-
} = componentProps;
|
|
296
|
-
const keepMounted = ScrollAreaViewport.useDialogPortalContext();
|
|
297
|
-
const {
|
|
298
|
-
store
|
|
299
|
-
} = ScrollAreaViewport.useDialogRootContext();
|
|
300
|
-
const open = store.useState('open');
|
|
301
|
-
const nested = store.useState('nested');
|
|
302
|
-
const transitionStatus = store.useState('transitionStatus');
|
|
303
|
-
const nestedOpenDialogCount = store.useState('nestedOpenDialogCount');
|
|
304
|
-
const mounted = store.useState('mounted');
|
|
305
|
-
const setViewportElement = store.useStateSetter('viewportElement');
|
|
306
|
-
const nestedDialogOpen = nestedOpenDialogCount > 0;
|
|
307
|
-
const state = {
|
|
308
|
-
open,
|
|
309
|
-
nested,
|
|
310
|
-
transitionStatus,
|
|
311
|
-
nestedDialogOpen
|
|
312
|
-
};
|
|
313
|
-
const shouldRender = keepMounted || mounted;
|
|
314
|
-
return useRenderElement.useRenderElement('div', componentProps, {
|
|
315
|
-
enabled: shouldRender,
|
|
316
|
-
state,
|
|
317
|
-
ref: [forwardedRef, setViewportElement],
|
|
318
|
-
stateAttributesMapping,
|
|
319
|
-
props: [{
|
|
320
|
-
role: 'presentation',
|
|
321
|
-
hidden: !mounted,
|
|
322
|
-
style: {
|
|
323
|
-
pointerEvents: !open ? 'none' : undefined
|
|
324
|
-
},
|
|
325
|
-
children
|
|
326
|
-
}, elementProps]
|
|
327
|
-
});
|
|
328
|
-
});
|
|
329
|
-
if (process.env.NODE_ENV !== "production") DialogViewport.displayName = "DialogViewport";
|
|
330
|
-
|
|
331
239
|
/**
|
|
332
240
|
* A handle to control a Dialog imperatively and to associate detached triggers with it.
|
|
333
241
|
*/
|
|
@@ -404,6 +312,5 @@ exports.DialogBackdrop = DialogBackdrop;
|
|
|
404
312
|
exports.DialogDescription = DialogDescription;
|
|
405
313
|
exports.DialogHandle = DialogHandle;
|
|
406
314
|
exports.DialogPopup = DialogPopup;
|
|
407
|
-
exports.DialogViewport = DialogViewport;
|
|
408
315
|
exports.DrawerDescription = DrawerDescription;
|
|
409
316
|
exports.createDialogHandle = createDialogHandle;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { u as useDialogRootContext,
|
|
2
|
+
import { u as useDialogRootContext, h as useDialogPortalContext, i as DialogStore } from './ScrollAreaViewport-es.js';
|
|
3
3
|
import { u as useRenderElement } from './useRenderElement-es.js';
|
|
4
4
|
import { p as popupStateMapping, C as CommonPopupDataAttributes, c as createDefaultInitialFocus, F as FOCUSABLE_POPUP_PROPS, a as FloatingFocusManager } from './useScrollLock-es.js';
|
|
5
5
|
import { t as transitionStatusMapping, u as useBaseUiId, f as useOpenChangeComplete, d as createChangeEventDetails, i as imperativeAction } from './useButton-es.js';
|
|
6
6
|
import { C as COMPOSITE_KEYS } from './scrollEdges-es.js';
|
|
7
7
|
import { jsx } from 'react/jsx-runtime';
|
|
8
8
|
|
|
9
|
-
const stateAttributesMapping$
|
|
9
|
+
const stateAttributesMapping$1 = {
|
|
10
10
|
...popupStateMapping,
|
|
11
11
|
...transitionStatusMapping
|
|
12
12
|
};
|
|
@@ -39,7 +39,7 @@ const DialogBackdrop = /*#__PURE__*/React.forwardRef(function DialogBackdrop(com
|
|
|
39
39
|
return useRenderElement('div', componentProps, {
|
|
40
40
|
state,
|
|
41
41
|
ref: [store.context.backdropRef, forwardedRef],
|
|
42
|
-
stateAttributesMapping: stateAttributesMapping$
|
|
42
|
+
stateAttributesMapping: stateAttributesMapping$1,
|
|
43
43
|
props: [{
|
|
44
44
|
role: 'presentation',
|
|
45
45
|
hidden: !mounted,
|
|
@@ -118,7 +118,7 @@ let DialogPopupDataAttributes = function (DialogPopupDataAttributes) {
|
|
|
118
118
|
return DialogPopupDataAttributes;
|
|
119
119
|
}({});
|
|
120
120
|
|
|
121
|
-
const stateAttributesMapping
|
|
121
|
+
const stateAttributesMapping = {
|
|
122
122
|
...popupStateMapping,
|
|
123
123
|
...transitionStatusMapping,
|
|
124
124
|
nestedDialogOpen(value) {
|
|
@@ -199,7 +199,7 @@ const DialogPopup = /*#__PURE__*/React.forwardRef(function DialogPopup(component
|
|
|
199
199
|
}
|
|
200
200
|
}, elementProps],
|
|
201
201
|
ref: [forwardedRef, store.context.popupRef, setPopupElement],
|
|
202
|
-
stateAttributesMapping
|
|
202
|
+
stateAttributesMapping
|
|
203
203
|
});
|
|
204
204
|
return /*#__PURE__*/jsx(FloatingFocusManager, {
|
|
205
205
|
context: floatingRootContext,
|
|
@@ -215,98 +215,6 @@ const DialogPopup = /*#__PURE__*/React.forwardRef(function DialogPopup(component
|
|
|
215
215
|
});
|
|
216
216
|
if (process.env.NODE_ENV !== "production") DialogPopup.displayName = "DialogPopup";
|
|
217
217
|
|
|
218
|
-
let DialogViewportDataAttributes = function (DialogViewportDataAttributes) {
|
|
219
|
-
/**
|
|
220
|
-
* Present when the dialog is open.
|
|
221
|
-
*/
|
|
222
|
-
DialogViewportDataAttributes[DialogViewportDataAttributes["open"] = CommonPopupDataAttributes.open] = "open";
|
|
223
|
-
/**
|
|
224
|
-
* Present when the dialog is closed.
|
|
225
|
-
*/
|
|
226
|
-
DialogViewportDataAttributes[DialogViewportDataAttributes["closed"] = CommonPopupDataAttributes.closed] = "closed";
|
|
227
|
-
/**
|
|
228
|
-
* Present when the dialog is animating in.
|
|
229
|
-
*/
|
|
230
|
-
DialogViewportDataAttributes[DialogViewportDataAttributes["startingStyle"] = CommonPopupDataAttributes.startingStyle] = "startingStyle";
|
|
231
|
-
/**
|
|
232
|
-
* Present when the dialog is animating out.
|
|
233
|
-
*/
|
|
234
|
-
DialogViewportDataAttributes[DialogViewportDataAttributes["endingStyle"] = CommonPopupDataAttributes.endingStyle] = "endingStyle";
|
|
235
|
-
/**
|
|
236
|
-
* Present when the dialog is nested within another dialog.
|
|
237
|
-
*/
|
|
238
|
-
DialogViewportDataAttributes["nested"] = "data-nested";
|
|
239
|
-
/**
|
|
240
|
-
* Present when the dialog has other open dialogs nested within it.
|
|
241
|
-
*/
|
|
242
|
-
DialogViewportDataAttributes["nestedDialogOpen"] = "data-nested-dialog-open";
|
|
243
|
-
return DialogViewportDataAttributes;
|
|
244
|
-
}({});
|
|
245
|
-
|
|
246
|
-
const stateAttributesMapping = {
|
|
247
|
-
...popupStateMapping,
|
|
248
|
-
...transitionStatusMapping,
|
|
249
|
-
nested(value) {
|
|
250
|
-
return value ? {
|
|
251
|
-
[DialogViewportDataAttributes.nested]: ''
|
|
252
|
-
} : null;
|
|
253
|
-
},
|
|
254
|
-
nestedDialogOpen(value) {
|
|
255
|
-
return value ? {
|
|
256
|
-
[DialogViewportDataAttributes.nestedDialogOpen]: ''
|
|
257
|
-
} : null;
|
|
258
|
-
}
|
|
259
|
-
};
|
|
260
|
-
|
|
261
|
-
/**
|
|
262
|
-
* A positioning container for the dialog popup that can be made scrollable.
|
|
263
|
-
* Renders a `<div>` element.
|
|
264
|
-
*
|
|
265
|
-
* Documentation: [Base UI Dialog](https://base-ui.com/react/components/dialog)
|
|
266
|
-
*/
|
|
267
|
-
const DialogViewport = /*#__PURE__*/React.forwardRef(function DialogViewport(componentProps, forwardedRef) {
|
|
268
|
-
const {
|
|
269
|
-
render,
|
|
270
|
-
className,
|
|
271
|
-
style,
|
|
272
|
-
children,
|
|
273
|
-
...elementProps
|
|
274
|
-
} = componentProps;
|
|
275
|
-
const keepMounted = useDialogPortalContext();
|
|
276
|
-
const {
|
|
277
|
-
store
|
|
278
|
-
} = useDialogRootContext();
|
|
279
|
-
const open = store.useState('open');
|
|
280
|
-
const nested = store.useState('nested');
|
|
281
|
-
const transitionStatus = store.useState('transitionStatus');
|
|
282
|
-
const nestedOpenDialogCount = store.useState('nestedOpenDialogCount');
|
|
283
|
-
const mounted = store.useState('mounted');
|
|
284
|
-
const setViewportElement = store.useStateSetter('viewportElement');
|
|
285
|
-
const nestedDialogOpen = nestedOpenDialogCount > 0;
|
|
286
|
-
const state = {
|
|
287
|
-
open,
|
|
288
|
-
nested,
|
|
289
|
-
transitionStatus,
|
|
290
|
-
nestedDialogOpen
|
|
291
|
-
};
|
|
292
|
-
const shouldRender = keepMounted || mounted;
|
|
293
|
-
return useRenderElement('div', componentProps, {
|
|
294
|
-
enabled: shouldRender,
|
|
295
|
-
state,
|
|
296
|
-
ref: [forwardedRef, setViewportElement],
|
|
297
|
-
stateAttributesMapping,
|
|
298
|
-
props: [{
|
|
299
|
-
role: 'presentation',
|
|
300
|
-
hidden: !mounted,
|
|
301
|
-
style: {
|
|
302
|
-
pointerEvents: !open ? 'none' : undefined
|
|
303
|
-
},
|
|
304
|
-
children
|
|
305
|
-
}, elementProps]
|
|
306
|
-
});
|
|
307
|
-
});
|
|
308
|
-
if (process.env.NODE_ENV !== "production") DialogViewport.displayName = "DialogViewport";
|
|
309
|
-
|
|
310
218
|
/**
|
|
311
219
|
* A handle to control a Dialog imperatively and to associate detached triggers with it.
|
|
312
220
|
*/
|
|
@@ -379,4 +287,4 @@ function createDialogHandle() {
|
|
|
379
287
|
*/
|
|
380
288
|
const DrawerDescription = DialogDescription;
|
|
381
289
|
|
|
382
|
-
export { DrawerDescription as D, DialogBackdrop as a,
|
|
290
|
+
export { DrawerDescription as D, DialogBackdrop as a, DialogPopup as b, DialogDescription as c, createDialogHandle as d, DialogHandle as e };
|