@react-spectrum/overlays 3.4.2 → 3.4.6

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.
Files changed (10) hide show
  1. package/dist/main.css +1 -2
  2. package/dist/main.js +457 -447
  3. package/dist/main.js.map +1 -1
  4. package/dist/module.js +445 -417
  5. package/dist/module.js.map +1 -1
  6. package/dist/types.d.ts +13 -0
  7. package/dist/types.d.ts.map +1 -1
  8. package/package.json +9 -9
  9. package/src/index.ts +1 -0
  10. package/dist/main.css.map +0 -1
package/dist/module.js CHANGED
@@ -1,129 +1,160 @@
1
- import { useModal, useOverlay, usePreventScroll } from "@react-aria/overlays";
2
- import { mergeProps, useLayoutEffect, useViewportSize } from "@react-aria/utils";
3
- import { classNames, useDOMRef, useStyleProps } from "@react-spectrum/utils";
4
- import _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
5
- import _reactDom from "react-dom";
6
- import { Provider } from "@react-spectrum/provider";
7
- import _reactTransitionGroupTransition from "react-transition-group/Transition";
8
- import _react, { useCallback, useState, forwardRef, useRef, useEffect } from "react";
9
- import _babelRuntimeHelpersEsmExtends from "@babel/runtime/helpers/esm/extends";
10
1
  import "./main.css";
11
-
2
+ import {Provider as $4Qwqh$Provider} from "@react-spectrum/provider";
3
+ import $4Qwqh$react, {useState as $4Qwqh$useState, useCallback as $4Qwqh$useCallback, forwardRef as $4Qwqh$forwardRef, useRef as $4Qwqh$useRef, useEffect as $4Qwqh$useEffect} from "react";
4
+ import $4Qwqh$reactdom from "react-dom";
5
+ import $4Qwqh$reacttransitiongroupTransition from "react-transition-group/Transition";
6
+ import {useDOMRef as $4Qwqh$useDOMRef, useStyleProps as $4Qwqh$useStyleProps, classNames as $4Qwqh$classNames} from "@react-spectrum/utils";
7
+ import {mergeProps as $4Qwqh$mergeProps, useLayoutEffect as $4Qwqh$useLayoutEffect, useViewportSize as $4Qwqh$useViewportSize} from "@react-aria/utils";
8
+ import {useOverlay as $4Qwqh$useOverlay, useModal as $4Qwqh$useModal, usePreventScroll as $4Qwqh$usePreventScroll} from "@react-aria/overlays";
9
+
10
+ function $parcel$export(e, n, v, s) {
11
+ Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
12
+ }
12
13
  function $parcel$interopDefault(a) {
13
14
  return a && a.__esModule ? a.default : a;
14
15
  }
16
+ var $80816efa7007e5bf$exports = {};
17
+
18
+ $parcel$export($80816efa7007e5bf$exports, "Overlay", () => $80816efa7007e5bf$export$c6fdb837b070b4ff);
19
+ var $647de0c873a185d0$exports = {};
20
+
21
+ $parcel$export($647de0c873a185d0$exports, "OpenTransition", () => $647de0c873a185d0$export$b847a40ee92eff38);
15
22
 
16
- const $c2eed959492fcaa12e5ad56438b32db$var$OPEN_STATES = {
17
- entering: false,
18
- entered: true
23
+
24
+ const $647de0c873a185d0$var$OPEN_STATES = {
25
+ entering: false,
26
+ entered: true
19
27
  };
20
- /**
21
- * Timeout issues adding css animations to enter may be related to
22
- * https://github.com/reactjs/react-transition-group/issues/189 or
23
- * https://github.com/reactjs/react-transition-group/issues/22
24
- * my VM isn't good enough to debug accurately and get a better answer.
25
- *
26
- * As a result, use enter 0 so that is-open is applied once entered
27
- * it doesn't matter if we know when the css-animation is done on entering
28
- * for exiting though, give time for the css-animation to play
29
- * before removing from the DOM
30
- * **note** hitting esc bypasses exit animation for anyone testing.
31
- */
32
-
33
- function $c2eed959492fcaa12e5ad56438b32db$export$OpenTransition(props) {
34
- return /*#__PURE__*/_react.createElement(_reactTransitionGroupTransition, _babelRuntimeHelpersEsmExtends({
35
- timeout: {
36
- enter: 0,
37
- exit: 350
38
- }
39
- }, props), state => _react.Children.map(props.children, child => child && /*#__PURE__*/_react.cloneElement(child, {
40
- isOpen: !!$c2eed959492fcaa12e5ad56438b32db$var$OPEN_STATES[state]
41
- })));
28
+ function $647de0c873a185d0$export$b847a40ee92eff38(props) {
29
+ return(/*#__PURE__*/ $4Qwqh$react.createElement($4Qwqh$reacttransitiongroupTransition, {
30
+ timeout: {
31
+ enter: 0,
32
+ exit: 350
33
+ },
34
+ ...props
35
+ }, (state)=>$4Qwqh$react.Children.map(props.children, (child)=>child && /*#__PURE__*/ $4Qwqh$react.cloneElement(child, {
36
+ isOpen: !!$647de0c873a185d0$var$OPEN_STATES[state]
37
+ })
38
+ )
39
+ ));
42
40
  }
43
41
 
44
- function $efa130a588abe47e4415ae0ba92319d4$var$Overlay(props, ref) {
45
- let {
46
- children,
47
- isOpen,
48
- container,
49
- onEnter,
50
- onEntering,
51
- onEntered,
52
- onExit,
53
- onExiting,
54
- onExited
55
- } = props;
56
- let [exited, setExited] = useState(!isOpen);
57
- let handleEntered = useCallback(() => {
58
- setExited(false);
59
-
60
- if (onEntered) {
61
- onEntered();
62
- }
63
- }, [onEntered]);
64
- let handleExited = useCallback(() => {
65
- setExited(true);
66
-
67
- if (onExited) {
68
- onExited();
69
- }
70
- }, [onExited]); // Don't un-render the overlay while it's transitioning out.
71
-
72
- let mountOverlay = isOpen || !exited;
73
-
74
- if (!mountOverlay) {
75
- // Don't bother showing anything if we don't have to.
42
+
43
+
44
+
45
+
46
+ function $80816efa7007e5bf$var$Overlay(props, ref) {
47
+ let { children: children , isOpen: isOpen , container: container , onEnter: onEnter , onEntering: onEntering , onEntered: onEntered , onExit: onExit , onExiting: onExiting , onExited: onExited } = props;
48
+ let [exited, setExited] = $4Qwqh$useState(!isOpen);
49
+ let handleEntered = $4Qwqh$useCallback(()=>{
50
+ setExited(false);
51
+ if (onEntered) onEntered();
52
+ }, [
53
+ onEntered
54
+ ]);
55
+ let handleExited = $4Qwqh$useCallback(()=>{
56
+ setExited(true);
57
+ if (onExited) onExited();
58
+ }, [
59
+ onExited
60
+ ]);
61
+ // Don't un-render the overlay while it's transitioning out.
62
+ let mountOverlay = isOpen || !exited;
63
+ if (!mountOverlay) // Don't bother showing anything if we don't have to.
76
64
  return null;
77
- }
78
-
79
- let contents = /*#__PURE__*/_react.createElement(Provider, {
80
- ref: ref,
81
- UNSAFE_style: {
82
- background: 'transparent',
83
- isolation: 'isolate'
84
- }
85
- }, /*#__PURE__*/_react.createElement($c2eed959492fcaa12e5ad56438b32db$export$OpenTransition, {
86
- in: isOpen,
87
- appear: true,
88
- onExit: onExit,
89
- onExiting: onExiting,
90
- onExited: handleExited,
91
- onEnter: onEnter,
92
- onEntering: onEntering,
93
- onEntered: handleEntered
94
- }, children));
95
-
96
- return /*#__PURE__*/_reactDom.createPortal(contents, container || document.body);
65
+ let contents = /*#__PURE__*/ $4Qwqh$react.createElement($4Qwqh$Provider, {
66
+ ref: ref,
67
+ UNSAFE_style: {
68
+ background: 'transparent',
69
+ isolation: 'isolate'
70
+ }
71
+ }, /*#__PURE__*/ $4Qwqh$react.createElement($647de0c873a185d0$export$b847a40ee92eff38, {
72
+ in: isOpen,
73
+ appear: true,
74
+ onExit: onExit,
75
+ onExiting: onExiting,
76
+ onExited: handleExited,
77
+ onEnter: onEnter,
78
+ onEntering: onEntering,
79
+ onEntered: handleEntered
80
+ }, children));
81
+ return(/*#__PURE__*/ $4Qwqh$reactdom.createPortal(contents, container || document.body));
97
82
  }
83
+ let $80816efa7007e5bf$export$c6fdb837b070b4ff = /*#__PURE__*/ $4Qwqh$react.forwardRef($80816efa7007e5bf$var$Overlay);
84
+
85
+
86
+ var $5b3c29c81f767e0c$exports = {};
87
+
88
+ $parcel$export($5b3c29c81f767e0c$exports, "Popover", () => $5b3c29c81f767e0c$export$5b6b19405a83ff9d);
89
+
90
+
91
+
92
+ var $9ec42a7475cdf6b0$exports = {};
93
+
94
+ $parcel$export($9ec42a7475cdf6b0$exports, "spectrum-Popover", () => $9ec42a7475cdf6b0$export$a62dc1b6ab23a7bb, (v) => $9ec42a7475cdf6b0$export$a62dc1b6ab23a7bb = v);
95
+ $parcel$export($9ec42a7475cdf6b0$exports, "react-spectrum-Popover", () => $9ec42a7475cdf6b0$export$884f6b5065bdc41a, (v) => $9ec42a7475cdf6b0$export$884f6b5065bdc41a = v);
96
+ $parcel$export($9ec42a7475cdf6b0$exports, "spectrum-Dialog-content", () => $9ec42a7475cdf6b0$export$cb8eccd0f3639238, (v) => $9ec42a7475cdf6b0$export$cb8eccd0f3639238 = v);
97
+ $parcel$export($9ec42a7475cdf6b0$exports, "spectrum-Modal-wrapper", () => $9ec42a7475cdf6b0$export$35bea187ff802494, (v) => $9ec42a7475cdf6b0$export$35bea187ff802494 = v);
98
+ $parcel$export($9ec42a7475cdf6b0$exports, "react-spectrum-Modal-wrapper", () => $9ec42a7475cdf6b0$export$e088717c213c31d7, (v) => $9ec42a7475cdf6b0$export$e088717c213c31d7 = v);
99
+ $parcel$export($9ec42a7475cdf6b0$exports, "spectrum-Modal", () => $9ec42a7475cdf6b0$export$4c0b1e44c3834c85, (v) => $9ec42a7475cdf6b0$export$4c0b1e44c3834c85 = v);
100
+ $parcel$export($9ec42a7475cdf6b0$exports, "react-spectrum-Modal", () => $9ec42a7475cdf6b0$export$f8edeb62d7fed8c1, (v) => $9ec42a7475cdf6b0$export$f8edeb62d7fed8c1 = v);
101
+ $parcel$export($9ec42a7475cdf6b0$exports, "spectrum-Tray", () => $9ec42a7475cdf6b0$export$ce0704cd084c4f0d, (v) => $9ec42a7475cdf6b0$export$ce0704cd084c4f0d = v);
102
+ $parcel$export($9ec42a7475cdf6b0$exports, "react-spectrum-Tray", () => $9ec42a7475cdf6b0$export$69dafa24343974dd, (v) => $9ec42a7475cdf6b0$export$69dafa24343974dd = v);
103
+ var $9ec42a7475cdf6b0$export$a62dc1b6ab23a7bb;
104
+ var $9ec42a7475cdf6b0$export$884f6b5065bdc41a;
105
+ var $9ec42a7475cdf6b0$export$cb8eccd0f3639238;
106
+ var $9ec42a7475cdf6b0$export$35bea187ff802494;
107
+ var $9ec42a7475cdf6b0$export$e088717c213c31d7;
108
+ var $9ec42a7475cdf6b0$export$4c0b1e44c3834c85;
109
+ var $9ec42a7475cdf6b0$export$f8edeb62d7fed8c1;
110
+ var $9ec42a7475cdf6b0$export$ce0704cd084c4f0d;
111
+ var $9ec42a7475cdf6b0$export$69dafa24343974dd;
112
+ $9ec42a7475cdf6b0$export$a62dc1b6ab23a7bb = "spectrum-Popover_38efea";
113
+ $9ec42a7475cdf6b0$export$884f6b5065bdc41a = "react-spectrum-Popover_38efea";
114
+ $9ec42a7475cdf6b0$export$cb8eccd0f3639238 = "spectrum-Dialog-content_38efea";
115
+ $9ec42a7475cdf6b0$export$35bea187ff802494 = "spectrum-Modal-wrapper_38efea";
116
+ $9ec42a7475cdf6b0$export$e088717c213c31d7 = "react-spectrum-Modal-wrapper_38efea";
117
+ $9ec42a7475cdf6b0$export$4c0b1e44c3834c85 = "spectrum-Modal_38efea";
118
+ $9ec42a7475cdf6b0$export$f8edeb62d7fed8c1 = "react-spectrum-Modal_38efea";
119
+ $9ec42a7475cdf6b0$export$ce0704cd084c4f0d = "spectrum-Tray_38efea";
120
+ $9ec42a7475cdf6b0$export$69dafa24343974dd = "react-spectrum-Tray_38efea";
121
+
122
+
123
+
124
+ var $9126ba5fe017d182$exports = {};
125
+
126
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover", () => $9126ba5fe017d182$export$a62dc1b6ab23a7bb, (v) => $9126ba5fe017d182$export$a62dc1b6ab23a7bb = v);
127
+ $parcel$export($9126ba5fe017d182$exports, "is-open", () => $9126ba5fe017d182$export$a9781837241c946d, (v) => $9126ba5fe017d182$export$a9781837241c946d = v);
128
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover--bottom", () => $9126ba5fe017d182$export$6a19b19b14780d4a, (v) => $9126ba5fe017d182$export$6a19b19b14780d4a = v);
129
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover--top", () => $9126ba5fe017d182$export$f30becfb1df0cae4, (v) => $9126ba5fe017d182$export$f30becfb1df0cae4 = v);
130
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover--right", () => $9126ba5fe017d182$export$5fc8b429396c9f58, (v) => $9126ba5fe017d182$export$5fc8b429396c9f58 = v);
131
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover--left", () => $9126ba5fe017d182$export$79cc55906ac5b00, (v) => $9126ba5fe017d182$export$79cc55906ac5b00 = v);
132
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover-tip", () => $9126ba5fe017d182$export$3100ec4dc1668df1, (v) => $9126ba5fe017d182$export$3100ec4dc1668df1 = v);
133
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover-tip-triangle", () => $9126ba5fe017d182$export$ed733fa6cf19ab80, (v) => $9126ba5fe017d182$export$ed733fa6cf19ab80 = v);
134
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover--dialog", () => $9126ba5fe017d182$export$cf634262e726cd19, (v) => $9126ba5fe017d182$export$cf634262e726cd19 = v);
135
+ $parcel$export($9126ba5fe017d182$exports, "spectrum-Popover--withTip", () => $9126ba5fe017d182$export$d8b16c5377728262, (v) => $9126ba5fe017d182$export$d8b16c5377728262 = v);
136
+ var $9126ba5fe017d182$export$a62dc1b6ab23a7bb;
137
+ var $9126ba5fe017d182$export$a9781837241c946d;
138
+ var $9126ba5fe017d182$export$6a19b19b14780d4a;
139
+ var $9126ba5fe017d182$export$f30becfb1df0cae4;
140
+ var $9126ba5fe017d182$export$5fc8b429396c9f58;
141
+ var $9126ba5fe017d182$export$79cc55906ac5b00;
142
+ var $9126ba5fe017d182$export$3100ec4dc1668df1;
143
+ var $9126ba5fe017d182$export$ed733fa6cf19ab80;
144
+ var $9126ba5fe017d182$export$cf634262e726cd19;
145
+ var $9126ba5fe017d182$export$d8b16c5377728262;
146
+ $9126ba5fe017d182$export$a62dc1b6ab23a7bb = "spectrum-Popover_6115b8";
147
+ $9126ba5fe017d182$export$a9781837241c946d = "is-open_6115b8";
148
+ $9126ba5fe017d182$export$6a19b19b14780d4a = "spectrum-Popover--bottom_6115b8";
149
+ $9126ba5fe017d182$export$f30becfb1df0cae4 = "spectrum-Popover--top_6115b8";
150
+ $9126ba5fe017d182$export$5fc8b429396c9f58 = "spectrum-Popover--right_6115b8";
151
+ $9126ba5fe017d182$export$79cc55906ac5b00 = "spectrum-Popover--left_6115b8";
152
+ $9126ba5fe017d182$export$3100ec4dc1668df1 = "spectrum-Popover-tip_6115b8";
153
+ $9126ba5fe017d182$export$ed733fa6cf19ab80 = "spectrum-Popover-tip-triangle_6115b8";
154
+ $9126ba5fe017d182$export$cf634262e726cd19 = "spectrum-Popover--dialog_6115b8";
155
+ $9126ba5fe017d182$export$d8b16c5377728262 = "spectrum-Popover--withTip_6115b8";
156
+
98
157
 
99
- export let Overlay = /*#__PURE__*/_react.forwardRef($efa130a588abe47e4415ae0ba92319d4$var$Overlay);
100
- // ASSET: /Users/govett/dev/react-spectrum-v3/packages/@react-spectrum/overlays/src/overlays.css
101
- var $a5bfb13c9743494ac49cc710f8330$exports = {};
102
- $a5bfb13c9743494ac49cc710f8330$exports = {
103
- "spectrum-Popover": "_spectrum-Popover_1c0dd",
104
- "react-spectrum-Popover": "_react-spectrum-Popover_1c0dd",
105
- "spectrum-Dialog-content": "_spectrum-Dialog-content_1c0dd",
106
- "spectrum-Modal-wrapper": "_spectrum-Modal-wrapper_1c0dd",
107
- "react-spectrum-Modal-wrapper": "_react-spectrum-Modal-wrapper_1c0dd",
108
- "spectrum-Modal": "_spectrum-Modal_1c0dd",
109
- "react-spectrum-Modal": "_react-spectrum-Modal_1c0dd",
110
- "spectrum-Tray": "_spectrum-Tray_1c0dd",
111
- "react-spectrum-Tray": "_react-spectrum-Tray_1c0dd"
112
- };
113
- // ASSET: /Users/govett/dev/react-spectrum-v3/node_modules/@adobe/spectrum-css-temp/components/popover/vars.css
114
- var $f01264bdfc3021a50c5cc4caf66$exports = {};
115
- $f01264bdfc3021a50c5cc4caf66$exports = {
116
- "spectrum-Popover": "_spectrum-Popover_c37f7",
117
- "is-open": "_is-open_c37f7",
118
- "spectrum-Popover--bottom": "_spectrum-Popover--bottom_c37f7",
119
- "spectrum-Popover--top": "_spectrum-Popover--top_c37f7",
120
- "spectrum-Popover--right": "_spectrum-Popover--right_c37f7",
121
- "spectrum-Popover--left": "_spectrum-Popover--left_c37f7",
122
- "spectrum-Popover-tip": "_spectrum-Popover-tip_c37f7",
123
- "spectrum-Popover-tip-triangle": "_spectrum-Popover-tip-triangle_c37f7",
124
- "spectrum-Popover--dialog": "_spectrum-Popover--dialog_c37f7",
125
- "spectrum-Popover--withTip": "_spectrum-Popover--withTip_c37f7"
126
- };
127
158
 
128
159
  /**
129
160
  * Arrow placement can be done pointing right or down because those paths start at 0, x or y. Because the
@@ -131,319 +162,316 @@ $f01264bdfc3021a50c5cc4caf66$exports = {
131
162
  * between display types (retina with subpixels vs not retina). By flipping them with CSS we can ensure that
132
163
  * the path always starts at 0 so that it perfectly overlaps the popover's border.
133
164
  * See bottom of file for more explanation.
134
- */
135
- let $af48fe067ffcbddd851563094a05$var$arrowPlacement = {
136
- left: 'right',
137
- right: 'right',
138
- top: 'bottom',
139
- bottom: 'bottom'
165
+ */ let $5b3c29c81f767e0c$var$arrowPlacement = {
166
+ left: 'right',
167
+ right: 'right',
168
+ top: 'bottom',
169
+ bottom: 'bottom'
140
170
  };
141
-
142
- function $af48fe067ffcbddd851563094a05$var$Popover(props, ref) {
143
- let {
144
- children,
145
- placement,
146
- arrowProps,
147
- onClose,
148
- shouldCloseOnBlur,
149
- hideArrow,
150
- isKeyboardDismissDisabled,
151
- isNonModal,
152
- isDismissable = true
153
- } = props,
154
- otherProps = _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose(props, ["children", "placement", "arrowProps", "onClose", "shouldCloseOnBlur", "hideArrow", "isKeyboardDismissDisabled", "isNonModal", "isDismissable"]);
155
-
156
- let domRef = useDOMRef(ref);
157
- let {
158
- styleProps
159
- } = useStyleProps(props);
160
- return /*#__PURE__*/_react.createElement(Overlay, otherProps, /*#__PURE__*/_react.createElement($af48fe067ffcbddd851563094a05$var$PopoverWrapper, _babelRuntimeHelpersEsmExtends({}, styleProps, {
161
- ref: domRef,
162
- placement: placement,
163
- arrowProps: arrowProps,
164
- onClose: onClose,
165
- shouldCloseOnBlur: shouldCloseOnBlur,
166
- isKeyboardDismissDisabled: isKeyboardDismissDisabled,
167
- hideArrow: hideArrow,
168
- isNonModal: isNonModal,
169
- isDismissable: isDismissable
170
- }), children));
171
+ function $5b3c29c81f767e0c$var$Popover(props, ref) {
172
+ let { children: children , placement: placement , arrowProps: arrowProps , onClose: onClose , shouldCloseOnBlur: shouldCloseOnBlur , hideArrow: hideArrow , isKeyboardDismissDisabled: isKeyboardDismissDisabled , isNonModal: isNonModal , isDismissable: isDismissable = true , ...otherProps } = props;
173
+ let domRef = $4Qwqh$useDOMRef(ref);
174
+ let { styleProps: styleProps } = $4Qwqh$useStyleProps(props);
175
+ return(/*#__PURE__*/ $4Qwqh$react.createElement($80816efa7007e5bf$export$c6fdb837b070b4ff, otherProps, /*#__PURE__*/ $4Qwqh$react.createElement($5b3c29c81f767e0c$var$PopoverWrapper, {
176
+ ...styleProps,
177
+ ref: domRef,
178
+ placement: placement,
179
+ arrowProps: arrowProps,
180
+ onClose: onClose,
181
+ shouldCloseOnBlur: shouldCloseOnBlur,
182
+ isKeyboardDismissDisabled: isKeyboardDismissDisabled,
183
+ hideArrow: hideArrow,
184
+ isNonModal: isNonModal,
185
+ isDismissable: isDismissable
186
+ }, children)));
171
187
  }
172
-
173
- var $f01264bdfc3021a50c5cc4caf66$$interop$default = $parcel$interopDefault($f01264bdfc3021a50c5cc4caf66$exports);
174
- var $a5bfb13c9743494ac49cc710f8330$$interop$default = $parcel$interopDefault($a5bfb13c9743494ac49cc710f8330$exports);
175
- const $af48fe067ffcbddd851563094a05$var$PopoverWrapper = /*#__PURE__*/forwardRef((props, ref) => {
176
- let {
177
- children,
178
- placement = 'bottom',
179
- arrowProps,
180
- isOpen,
181
- hideArrow,
182
- isNonModal,
183
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
184
- isDismissable
185
- } = props,
186
- otherProps = _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose(props, ["children", "placement", "arrowProps", "isOpen", "hideArrow", "shouldCloseOnBlur", "isKeyboardDismissDisabled", "isNonModal", "isDismissable"]);
187
-
188
- let {
189
- overlayProps
190
- } = useOverlay(_babelRuntimeHelpersEsmExtends({}, props, {
191
- isDismissable: isDismissable && isOpen
192
- }), ref);
193
- let {
194
- modalProps
195
- } = useModal({
196
- isDisabled: isNonModal
197
- });
198
- return /*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersEsmExtends({}, mergeProps(otherProps, overlayProps, modalProps), {
199
- ref: ref,
200
- className: classNames($f01264bdfc3021a50c5cc4caf66$$interop$default, 'spectrum-Popover', "spectrum-Popover--" + placement, {
201
- 'spectrum-Popover--withTip': !hideArrow,
202
- 'is-open': isOpen
203
- }, classNames($a5bfb13c9743494ac49cc710f8330$$interop$default, 'spectrum-Popover', 'react-spectrum-Popover'), otherProps.className),
204
- role: "presentation"
205
- }), children, hideArrow ? null : /*#__PURE__*/_react.createElement($af48fe067ffcbddd851563094a05$var$Arrow, {
206
- arrowProps: arrowProps,
207
- direction: $af48fe067ffcbddd851563094a05$var$arrowPlacement[placement]
208
- }));
188
+ const $5b3c29c81f767e0c$var$PopoverWrapper = /*#__PURE__*/ $4Qwqh$forwardRef((props, ref)=>{
189
+ let { children: children , placement: placement = 'bottom' , arrowProps: arrowProps , isOpen: isOpen , hideArrow: hideArrow , shouldCloseOnBlur: // eslint-disable-next-line @typescript-eslint/no-unused-vars
190
+ shouldCloseOnBlur , isKeyboardDismissDisabled: // eslint-disable-next-line @typescript-eslint/no-unused-vars
191
+ isKeyboardDismissDisabled , isNonModal: isNonModal , isDismissable: // eslint-disable-next-line @typescript-eslint/no-unused-vars
192
+ isDismissable , ...otherProps } = props;
193
+ let { overlayProps: overlayProps } = $4Qwqh$useOverlay({
194
+ ...props,
195
+ isDismissable: isDismissable && isOpen
196
+ }, ref);
197
+ let { modalProps: modalProps } = $4Qwqh$useModal({
198
+ isDisabled: isNonModal
199
+ });
200
+ return(/*#__PURE__*/ $4Qwqh$react.createElement("div", {
201
+ ...$4Qwqh$mergeProps(otherProps, overlayProps, modalProps),
202
+ ref: ref,
203
+ className: $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($9126ba5fe017d182$exports)), 'spectrum-Popover', `spectrum-Popover--${placement}`, {
204
+ 'spectrum-Popover--withTip': !hideArrow,
205
+ 'is-open': isOpen
206
+ }, $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($9ec42a7475cdf6b0$exports)), 'spectrum-Popover', 'react-spectrum-Popover'), otherProps.className),
207
+ role: "presentation",
208
+ "data-testid": "popover"
209
+ }, children, hideArrow ? null : /*#__PURE__*/ $4Qwqh$react.createElement($5b3c29c81f767e0c$var$Arrow, {
210
+ arrowProps: arrowProps,
211
+ direction: $5b3c29c81f767e0c$var$arrowPlacement[placement]
212
+ })));
209
213
  });
210
- let $af48fe067ffcbddd851563094a05$var$ROOT_2 = Math.sqrt(2);
211
-
212
- function $af48fe067ffcbddd851563094a05$var$Arrow(props) {
213
- let [size, setSize] = useState(20);
214
- let [borderWidth, setBorderWidth] = useState(1);
215
- let ref = useRef(); // get the css value for the tip size and divide it by 2 for this arrow implementation
216
-
217
- useLayoutEffect(() => {
218
- if (ref.current) {
219
- let spectrumTipWidth = window.getComputedStyle(ref.current).getPropertyValue('--spectrum-popover-tip-size');
220
-
221
- if (spectrumTipWidth !== '') {
222
- setSize(parseInt(spectrumTipWidth, 10) / 2);
223
- }
224
-
225
- let spectrumBorderWidth = window.getComputedStyle(ref.current).getPropertyValue('--spectrum-popover-tip-borderWidth');
226
-
227
- if (spectrumBorderWidth !== '') {
228
- setBorderWidth(parseInt(spectrumBorderWidth, 10));
229
- }
230
- }
231
- }, [ref]);
232
- let landscape = props.direction === 'top' || props.direction === 'bottom';
233
- let mirror = props.direction === 'left' || props.direction === 'top';
234
- let borderDiagonal = borderWidth * $af48fe067ffcbddd851563094a05$var$ROOT_2;
235
- let halfBorderDiagonal = borderDiagonal / 2;
236
- let secondary = 2 * size + 2 * borderDiagonal;
237
- let primary = size + borderDiagonal;
238
- let primaryStart = mirror ? primary : 0;
239
- let primaryEnd = mirror ? halfBorderDiagonal : primary - halfBorderDiagonal;
240
- let secondaryStart = halfBorderDiagonal;
241
- let secondaryMiddle = secondary / 2;
242
- let secondaryEnd = secondary - halfBorderDiagonal;
243
- let pathData = landscape ? ['M', secondaryStart, primaryStart, 'L', secondaryMiddle, primaryEnd, 'L', secondaryEnd, primaryStart] : ['M', primaryStart, secondaryStart, 'L', primaryEnd, secondaryMiddle, 'L', primaryStart, secondaryEnd];
244
- let arrowProps = props.arrowProps;
245
- /* use ceil because the svg needs to always accomodate the path inside it */
246
-
247
- return /*#__PURE__*/_react.createElement("svg", _babelRuntimeHelpersEsmExtends({
248
- xmlns: "http://www.w3.org/svg/2000",
249
- width: Math.ceil(landscape ? secondary : primary),
250
- height: Math.ceil(landscape ? primary : secondary),
251
- style: props.style,
252
- className: classNames($f01264bdfc3021a50c5cc4caf66$$interop$default, 'spectrum-Popover-tip'),
253
- ref: ref
254
- }, arrowProps), /*#__PURE__*/_react.createElement("path", {
255
- className: classNames($f01264bdfc3021a50c5cc4caf66$$interop$default, 'spectrum-Popover-tip-triangle'),
256
- d: pathData.join(' ')
257
- }));
214
+ let $5b3c29c81f767e0c$var$ROOT_2 = Math.sqrt(2);
215
+ function $5b3c29c81f767e0c$var$Arrow(props) {
216
+ let [size, setSize] = $4Qwqh$useState(20);
217
+ let [borderWidth, setBorderWidth] = $4Qwqh$useState(1);
218
+ let ref = $4Qwqh$useRef();
219
+ // get the css value for the tip size and divide it by 2 for this arrow implementation
220
+ $4Qwqh$useLayoutEffect(()=>{
221
+ if (ref.current) {
222
+ let spectrumTipWidth = window.getComputedStyle(ref.current).getPropertyValue('--spectrum-popover-tip-size');
223
+ if (spectrumTipWidth !== '') setSize(parseInt(spectrumTipWidth, 10) / 2);
224
+ let spectrumBorderWidth = window.getComputedStyle(ref.current).getPropertyValue('--spectrum-popover-tip-borderWidth');
225
+ if (spectrumBorderWidth !== '') setBorderWidth(parseInt(spectrumBorderWidth, 10));
226
+ }
227
+ }, [
228
+ ref
229
+ ]);
230
+ let landscape = props.direction === 'top' || props.direction === 'bottom';
231
+ let mirror = props.direction === 'left' || props.direction === 'top';
232
+ let borderDiagonal = borderWidth * $5b3c29c81f767e0c$var$ROOT_2;
233
+ let halfBorderDiagonal = borderDiagonal / 2;
234
+ let secondary = 2 * size + 2 * borderDiagonal;
235
+ let primary = size + borderDiagonal;
236
+ let primaryStart = mirror ? primary : 0;
237
+ let primaryEnd = mirror ? halfBorderDiagonal : primary - halfBorderDiagonal;
238
+ let secondaryStart = halfBorderDiagonal;
239
+ let secondaryMiddle = secondary / 2;
240
+ let secondaryEnd = secondary - halfBorderDiagonal;
241
+ let pathData = landscape ? [
242
+ 'M',
243
+ secondaryStart,
244
+ primaryStart,
245
+ 'L',
246
+ secondaryMiddle,
247
+ primaryEnd,
248
+ 'L',
249
+ secondaryEnd,
250
+ primaryStart
251
+ ] : [
252
+ 'M',
253
+ primaryStart,
254
+ secondaryStart,
255
+ 'L',
256
+ primaryEnd,
257
+ secondaryMiddle,
258
+ 'L',
259
+ primaryStart,
260
+ secondaryEnd
261
+ ];
262
+ let arrowProps = props.arrowProps;
263
+ /* use ceil because the svg needs to always accomodate the path inside it */ return(/*#__PURE__*/ $4Qwqh$react.createElement("svg", {
264
+ xmlns: "http://www.w3.org/svg/2000",
265
+ width: Math.ceil(landscape ? secondary : primary),
266
+ height: Math.ceil(landscape ? primary : secondary),
267
+ style: props.style,
268
+ className: $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($9126ba5fe017d182$exports)), 'spectrum-Popover-tip'),
269
+ ref: ref,
270
+ ...arrowProps
271
+ }, /*#__PURE__*/ $4Qwqh$react.createElement("path", {
272
+ className: $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($9126ba5fe017d182$exports)), 'spectrum-Popover-tip-triangle'),
273
+ d: pathData.join(' ')
274
+ })));
258
275
  }
276
+ let $5b3c29c81f767e0c$export$5b6b19405a83ff9d = /*#__PURE__*/ $4Qwqh$forwardRef($5b3c29c81f767e0c$var$Popover);
277
+
278
+
279
+ var $c6a2ea12be2a8505$exports = {};
280
+
281
+ $parcel$export($c6a2ea12be2a8505$exports, "Modal", () => $c6a2ea12be2a8505$export$2b77a92f1a5ad772);
282
+
283
+
284
+ var $b65929eb65b6e471$exports = {};
285
+
286
+ $parcel$export($b65929eb65b6e471$exports, "spectrum-Modal", () => $b65929eb65b6e471$export$4c0b1e44c3834c85, (v) => $b65929eb65b6e471$export$4c0b1e44c3834c85 = v);
287
+ $parcel$export($b65929eb65b6e471$exports, "is-open", () => $b65929eb65b6e471$export$a9781837241c946d, (v) => $b65929eb65b6e471$export$a9781837241c946d = v);
288
+ $parcel$export($b65929eb65b6e471$exports, "spectrum-Modal-wrapper", () => $b65929eb65b6e471$export$35bea187ff802494, (v) => $b65929eb65b6e471$export$35bea187ff802494 = v);
289
+ $parcel$export($b65929eb65b6e471$exports, "spectrum-Modal--responsive", () => $b65929eb65b6e471$export$fd1e42aa8ea02a1, (v) => $b65929eb65b6e471$export$fd1e42aa8ea02a1 = v);
290
+ $parcel$export($b65929eb65b6e471$exports, "spectrum-Modal--fullscreen", () => $b65929eb65b6e471$export$a4423fa77727431a, (v) => $b65929eb65b6e471$export$a4423fa77727431a = v);
291
+ $parcel$export($b65929eb65b6e471$exports, "spectrum-Modal--fullscreenTakeover", () => $b65929eb65b6e471$export$175dd699720b5fb7, (v) => $b65929eb65b6e471$export$175dd699720b5fb7 = v);
292
+ var $b65929eb65b6e471$export$4c0b1e44c3834c85;
293
+ var $b65929eb65b6e471$export$a9781837241c946d;
294
+ var $b65929eb65b6e471$export$35bea187ff802494;
295
+ var $b65929eb65b6e471$export$fd1e42aa8ea02a1;
296
+ var $b65929eb65b6e471$export$a4423fa77727431a;
297
+ var $b65929eb65b6e471$export$175dd699720b5fb7;
298
+ $b65929eb65b6e471$export$4c0b1e44c3834c85 = "spectrum-Modal_f81956";
299
+ $b65929eb65b6e471$export$a9781837241c946d = "is-open_f81956";
300
+ $b65929eb65b6e471$export$35bea187ff802494 = "spectrum-Modal-wrapper_f81956";
301
+ $b65929eb65b6e471$export$fd1e42aa8ea02a1 = "spectrum-Modal--responsive_f81956";
302
+ $b65929eb65b6e471$export$a4423fa77727431a = "spectrum-Modal--fullscreen_f81956";
303
+ $b65929eb65b6e471$export$175dd699720b5fb7 = "spectrum-Modal--fullscreenTakeover_f81956";
304
+
305
+
306
+
259
307
 
260
- export let Popover = /*#__PURE__*/forwardRef($af48fe067ffcbddd851563094a05$var$Popover);
261
- // ASSET: /Users/govett/dev/react-spectrum-v3/node_modules/@adobe/spectrum-css-temp/components/modal/vars.css
262
- var $e88425c760534ecdce642e453299664b$exports = {};
263
- $e88425c760534ecdce642e453299664b$exports = {
264
- "spectrum-Modal": "_spectrum-Modal_cdccb",
265
- "is-open": "_is-open_cdccb",
266
- "spectrum-Modal-wrapper": "_spectrum-Modal-wrapper_cdccb",
267
- "spectrum-Modal--responsive": "_spectrum-Modal--responsive_cdccb",
268
- "spectrum-Modal--fullscreen": "_spectrum-Modal--fullscreen_cdccb",
269
- "spectrum-Modal--fullscreenTakeover": "_spectrum-Modal--fullscreenTakeover_cdccb"
270
- };
271
- // ASSET: /Users/govett/dev/react-spectrum-v3/node_modules/@adobe/spectrum-css-temp/components/underlay/vars.css
272
- var $a83084f5122c4f2e3cd09943e3dc9d1c$exports = {};
273
- $a83084f5122c4f2e3cd09943e3dc9d1c$exports = {
274
- "spectrum-Underlay": "_spectrum-Underlay_8c345",
275
- "is-open": "_is-open_8c345"
276
- };
277
- var $a83084f5122c4f2e3cd09943e3dc9d1c$$interop$default = $parcel$interopDefault($a83084f5122c4f2e3cd09943e3dc9d1c$exports);
278
-
279
- function $facde3dde95c50b545b1ceb8303a7b3d$export$Underlay(_ref) {
280
- let {
281
- isOpen
282
- } = _ref;
283
- return /*#__PURE__*/_react.createElement("div", {
284
- className: classNames($a83084f5122c4f2e3cd09943e3dc9d1c$$interop$default, 'spectrum-Underlay', {
285
- 'is-open': isOpen
286
- })
287
- });
288
- }
289
308
 
290
- function $e95c536af9708d8f08fc5947c704fa3$var$Modal(props, ref) {
291
- let {
292
- children,
293
- onClose,
294
- type
295
- } = props,
296
- otherProps = _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose(props, ["children", "onClose", "type"]);
297
-
298
- let domRef = useDOMRef(ref);
299
- let {
300
- styleProps
301
- } = useStyleProps(props);
302
- let {
303
- overlayProps,
304
- underlayProps
305
- } = useOverlay(props, domRef);
306
- return /*#__PURE__*/_react.createElement(Overlay, otherProps, /*#__PURE__*/_react.createElement($facde3dde95c50b545b1ceb8303a7b3d$export$Underlay, underlayProps), /*#__PURE__*/_react.createElement($e95c536af9708d8f08fc5947c704fa3$var$ModalWrapper, _babelRuntimeHelpersEsmExtends({}, styleProps, {
307
- onClose: onClose,
308
- type: type,
309
- ref: domRef,
310
- overlayProps: overlayProps
311
- }), children));
309
+
310
+
311
+ var $b4c2aa75f00572f6$exports = {};
312
+
313
+ $parcel$export($b4c2aa75f00572f6$exports, "spectrum-Underlay", () => $b4c2aa75f00572f6$export$74470528f463af97, (v) => $b4c2aa75f00572f6$export$74470528f463af97 = v);
314
+ $parcel$export($b4c2aa75f00572f6$exports, "is-open", () => $b4c2aa75f00572f6$export$a9781837241c946d, (v) => $b4c2aa75f00572f6$export$a9781837241c946d = v);
315
+ var $b4c2aa75f00572f6$export$74470528f463af97;
316
+ var $b4c2aa75f00572f6$export$a9781837241c946d;
317
+ $b4c2aa75f00572f6$export$74470528f463af97 = "spectrum-Underlay_eb7615";
318
+ $b4c2aa75f00572f6$export$a9781837241c946d = "is-open_eb7615";
319
+
320
+
321
+ function $6856e8fa42ff7496$export$f360afc887607b02({ isOpen: isOpen }) {
322
+ return(/*#__PURE__*/ $4Qwqh$react.createElement("div", {
323
+ className: $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($b4c2aa75f00572f6$exports)), 'spectrum-Underlay', {
324
+ 'is-open': isOpen
325
+ })
326
+ }));
312
327
  }
313
328
 
314
- let $e95c536af9708d8f08fc5947c704fa3$var$typeMap = {
315
- fullscreen: 'fullscreen',
316
- fullscreenTakeover: 'fullscreenTakeover'
329
+
330
+
331
+ function $c6a2ea12be2a8505$var$Modal(props, ref) {
332
+ let { children: children , onClose: onClose , type: type , ...otherProps } = props;
333
+ let domRef = $4Qwqh$useDOMRef(ref);
334
+ let { styleProps: styleProps } = $4Qwqh$useStyleProps(props);
335
+ let { overlayProps: overlayProps , underlayProps: underlayProps } = $4Qwqh$useOverlay(props, domRef);
336
+ return(/*#__PURE__*/ $4Qwqh$react.createElement($80816efa7007e5bf$export$c6fdb837b070b4ff, otherProps, /*#__PURE__*/ $4Qwqh$react.createElement($6856e8fa42ff7496$export$f360afc887607b02, underlayProps), /*#__PURE__*/ $4Qwqh$react.createElement($c6a2ea12be2a8505$var$ModalWrapper, {
337
+ ...styleProps,
338
+ onClose: onClose,
339
+ type: type,
340
+ ref: domRef,
341
+ overlayProps: overlayProps
342
+ }, children)));
343
+ }
344
+ let $c6a2ea12be2a8505$var$typeMap = {
345
+ fullscreen: 'fullscreen',
346
+ fullscreenTakeover: 'fullscreenTakeover'
317
347
  };
318
- var $e88425c760534ecdce642e453299664b$$interop$default = $parcel$interopDefault($e88425c760534ecdce642e453299664b$exports);
319
- let $e95c536af9708d8f08fc5947c704fa3$var$ModalWrapper = /*#__PURE__*/forwardRef(function (props, ref) {
320
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
321
- let {
322
- children,
323
- isOpen,
324
- type,
325
- overlayProps
326
- } = props,
327
- otherProps = _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose(props, ["children", "isOpen", "type", "overlayProps"]);
328
-
329
- let typeVariant = $e95c536af9708d8f08fc5947c704fa3$var$typeMap[type];
330
- usePreventScroll();
331
- let {
332
- modalProps
333
- } = useModal();
334
- let wrapperClassName = classNames($e88425c760534ecdce642e453299664b$$interop$default, 'spectrum-Modal-wrapper', classNames($a5bfb13c9743494ac49cc710f8330$$interop$default, 'spectrum-Modal-wrapper', 'react-spectrum-Modal-wrapper'));
335
- let modalClassName = classNames($e88425c760534ecdce642e453299664b$$interop$default, 'spectrum-Modal', {
336
- 'is-open': isOpen
337
- }, classNames($a5bfb13c9743494ac49cc710f8330$$interop$default, 'spectrum-Modal', 'react-spectrum-Modal'), {
338
- ["spectrum-Modal--" + typeVariant]: typeVariant
339
- }, otherProps.className);
340
- let viewport = useViewportSize();
341
- let style = {
342
- '--spectrum-visual-viewport-height': viewport.height + 'px'
343
- };
344
- return /*#__PURE__*/_react.createElement("div", {
345
- className: wrapperClassName,
346
- style: style
347
- }, /*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersEsmExtends({}, mergeProps(otherProps, overlayProps, modalProps), {
348
- ref: ref,
349
- className: modalClassName
350
- }), children));
348
+ let $c6a2ea12be2a8505$var$ModalWrapper = /*#__PURE__*/ $4Qwqh$forwardRef(function(props, ref) {
349
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
350
+ let { children: children , isOpen: isOpen , type: type , overlayProps: overlayProps , ...otherProps } = props;
351
+ let typeVariant = $c6a2ea12be2a8505$var$typeMap[type];
352
+ $4Qwqh$usePreventScroll();
353
+ let { modalProps: modalProps } = $4Qwqh$useModal();
354
+ let wrapperClassName = $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($b65929eb65b6e471$exports)), 'spectrum-Modal-wrapper', $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($9ec42a7475cdf6b0$exports)), 'spectrum-Modal-wrapper', 'react-spectrum-Modal-wrapper'));
355
+ let modalClassName = $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($b65929eb65b6e471$exports)), 'spectrum-Modal', {
356
+ 'is-open': isOpen
357
+ }, $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($9ec42a7475cdf6b0$exports)), 'spectrum-Modal', 'react-spectrum-Modal'), {
358
+ [`spectrum-Modal--${typeVariant}`]: typeVariant
359
+ }, otherProps.className);
360
+ let viewport = $4Qwqh$useViewportSize();
361
+ let style = {
362
+ '--spectrum-visual-viewport-height': viewport.height + 'px'
363
+ };
364
+ return(/*#__PURE__*/ $4Qwqh$react.createElement("div", {
365
+ className: wrapperClassName,
366
+ style: style
367
+ }, /*#__PURE__*/ $4Qwqh$react.createElement("div", {
368
+ ...$4Qwqh$mergeProps(otherProps, overlayProps, modalProps),
369
+ ref: ref,
370
+ className: modalClassName,
371
+ "data-testid": "modal"
372
+ }, children)));
351
373
  });
352
- export let Modal = /*#__PURE__*/forwardRef($e95c536af9708d8f08fc5947c704fa3$var$Modal);
353
- // ASSET: /Users/govett/dev/react-spectrum-v3/node_modules/@adobe/spectrum-css-temp/components/tray/vars.css
354
- var $ac11f5461729b20d6ef4577bcba724$exports = {};
355
- $ac11f5461729b20d6ef4577bcba724$exports = {
356
- "spectrum-Tray": "_spectrum-Tray_8bca2",
357
- "is-open": "_is-open_8bca2",
358
- "spectrum-Tray-wrapper": "_spectrum-Tray-wrapper_8bca2",
359
- "spectrum-Tray--fixedHeight": "_spectrum-Tray--fixedHeight_8bca2"
360
- };
374
+ let $c6a2ea12be2a8505$export$2b77a92f1a5ad772 = /*#__PURE__*/ $4Qwqh$forwardRef($c6a2ea12be2a8505$var$Modal);
375
+
376
+
377
+ var $115ab8a5c0552804$exports = {};
378
+
379
+ $parcel$export($115ab8a5c0552804$exports, "Tray", () => $115ab8a5c0552804$export$4589ed81930b555c);
361
380
 
362
- function $beb29a978949a31ec0bff450b4dc$var$Tray(props, ref) {
363
- let {
364
- children,
365
- onClose,
366
- isFixedHeight,
367
- isNonModal
368
- } = props,
369
- otherProps = _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose(props, ["children", "onClose", "isFixedHeight", "isNonModal"]);
370
-
371
- let domRef = useDOMRef(ref);
372
- let {
373
- styleProps
374
- } = useStyleProps(props);
375
- let {
376
- overlayProps,
377
- underlayProps
378
- } = useOverlay(_babelRuntimeHelpersEsmExtends({}, props, {
379
- isDismissable: true
380
- }), domRef);
381
- return /*#__PURE__*/_react.createElement(Overlay, otherProps, /*#__PURE__*/_react.createElement($facde3dde95c50b545b1ceb8303a7b3d$export$Underlay, underlayProps), /*#__PURE__*/_react.createElement($beb29a978949a31ec0bff450b4dc$var$TrayWrapper, _babelRuntimeHelpersEsmExtends({}, styleProps, {
382
- onClose: onClose,
383
- ref: domRef,
384
- overlayProps: overlayProps,
385
- isFixedHeight: isFixedHeight,
386
- isNonModal: isNonModal
387
- }), children));
388
- }
389
381
 
390
- var $ac11f5461729b20d6ef4577bcba724$$interop$default = $parcel$interopDefault($ac11f5461729b20d6ef4577bcba724$exports);
391
- let $beb29a978949a31ec0bff450b4dc$var$TrayWrapper = /*#__PURE__*/forwardRef(function (props, ref) {
392
- let {
393
- children,
394
- isOpen,
395
- isFixedHeight,
396
- isNonModal,
397
- overlayProps
398
- } = props,
399
- otherProps = _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose(props, ["children", "isOpen", "isFixedHeight", "isNonModal", "overlayProps"]);
400
-
401
- usePreventScroll();
402
- let {
403
- modalProps
404
- } = useModal({
405
- isDisabled: isNonModal
406
- }); // We need to measure the window's height in JS rather than using percentages in CSS
407
- // so that contents (e.g. menu) can inherit the max-height properly. Using percentages
408
- // does not work properly because there is nothing to base the percentage on.
409
- // We cannot use vh units because mobile browsers adjust the window height dynamically
410
- // when the address bar/bottom toolbars show and hide on scroll and vh units are fixed.
411
- // Also, the visual viewport is smaller than the layout viewport when the virtual keyboard
412
- // is up, so use the VisualViewport API to ensure the tray is displayed above the keyboard.
413
-
414
- let viewport = useViewportSize();
415
- let [height, setHeight] = useState(viewport.height);
416
- let timeoutRef = useRef();
417
- useEffect(() => {
418
- clearTimeout(timeoutRef.current); // When the height is decreasing, and the keyboard is visible
419
- // (visual viewport smaller than layout viewport), delay setting
420
- // the new max height until after the animation is complete
421
- // so that there isn't an empty space under the tray briefly.
422
-
423
- if (viewport.height < height && viewport.height < window.innerHeight) {
424
- timeoutRef.current = setTimeout(() => {
425
- setHeight(viewport.height);
426
- }, 500);
427
- } else {
428
- setHeight(viewport.height);
429
- }
430
- }, [height, viewport.height]);
431
- let wrapperStyle = {
432
- '--spectrum-visual-viewport-height': height + 'px'
433
- };
434
- let wrapperClassName = classNames($ac11f5461729b20d6ef4577bcba724$$interop$default, 'spectrum-Tray-wrapper');
435
- let className = classNames($ac11f5461729b20d6ef4577bcba724$$interop$default, 'spectrum-Tray', {
436
- 'is-open': isOpen,
437
- 'spectrum-Tray--fixedHeight': isFixedHeight
438
- }, classNames($a5bfb13c9743494ac49cc710f8330$$interop$default, 'spectrum-Tray', 'react-spectrum-Tray'), otherProps.className);
439
- let domProps = mergeProps(otherProps, overlayProps);
440
- return /*#__PURE__*/_react.createElement("div", {
441
- className: wrapperClassName,
442
- style: wrapperStyle
443
- }, /*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersEsmExtends({}, domProps, modalProps, {
444
- className: className,
445
- ref: ref
446
- }), children));
382
+
383
+
384
+
385
+ var $02af7fbcfbd0696e$exports = {};
386
+
387
+ $parcel$export($02af7fbcfbd0696e$exports, "spectrum-Tray", () => $02af7fbcfbd0696e$export$ce0704cd084c4f0d, (v) => $02af7fbcfbd0696e$export$ce0704cd084c4f0d = v);
388
+ $parcel$export($02af7fbcfbd0696e$exports, "is-open", () => $02af7fbcfbd0696e$export$a9781837241c946d, (v) => $02af7fbcfbd0696e$export$a9781837241c946d = v);
389
+ $parcel$export($02af7fbcfbd0696e$exports, "spectrum-Tray-wrapper", () => $02af7fbcfbd0696e$export$641b9b70c23dce66, (v) => $02af7fbcfbd0696e$export$641b9b70c23dce66 = v);
390
+ $parcel$export($02af7fbcfbd0696e$exports, "spectrum-Tray--fixedHeight", () => $02af7fbcfbd0696e$export$79bfb05e59a300b, (v) => $02af7fbcfbd0696e$export$79bfb05e59a300b = v);
391
+ var $02af7fbcfbd0696e$export$ce0704cd084c4f0d;
392
+ var $02af7fbcfbd0696e$export$a9781837241c946d;
393
+ var $02af7fbcfbd0696e$export$641b9b70c23dce66;
394
+ var $02af7fbcfbd0696e$export$79bfb05e59a300b;
395
+ $02af7fbcfbd0696e$export$ce0704cd084c4f0d = "spectrum-Tray_23bf66";
396
+ $02af7fbcfbd0696e$export$a9781837241c946d = "is-open_23bf66";
397
+ $02af7fbcfbd0696e$export$641b9b70c23dce66 = "spectrum-Tray-wrapper_23bf66";
398
+ $02af7fbcfbd0696e$export$79bfb05e59a300b = "spectrum-Tray--fixedHeight_23bf66";
399
+
400
+
401
+
402
+
403
+ function $115ab8a5c0552804$var$Tray(props, ref) {
404
+ let { children: children , onClose: onClose , isFixedHeight: isFixedHeight , isNonModal: isNonModal , ...otherProps } = props;
405
+ let domRef = $4Qwqh$useDOMRef(ref);
406
+ let { styleProps: styleProps } = $4Qwqh$useStyleProps(props);
407
+ let { overlayProps: overlayProps , underlayProps: underlayProps } = $4Qwqh$useOverlay({
408
+ ...props,
409
+ isDismissable: true
410
+ }, domRef);
411
+ return(/*#__PURE__*/ $4Qwqh$react.createElement($80816efa7007e5bf$export$c6fdb837b070b4ff, otherProps, /*#__PURE__*/ $4Qwqh$react.createElement($6856e8fa42ff7496$export$f360afc887607b02, underlayProps), /*#__PURE__*/ $4Qwqh$react.createElement($115ab8a5c0552804$var$TrayWrapper, {
412
+ ...styleProps,
413
+ onClose: onClose,
414
+ ref: domRef,
415
+ overlayProps: overlayProps,
416
+ isFixedHeight: isFixedHeight,
417
+ isNonModal: isNonModal
418
+ }, children)));
419
+ }
420
+ let $115ab8a5c0552804$var$TrayWrapper = /*#__PURE__*/ $4Qwqh$forwardRef(function(props, ref) {
421
+ let { children: children , isOpen: isOpen , isFixedHeight: isFixedHeight , isNonModal: isNonModal , overlayProps: overlayProps , ...otherProps } = props;
422
+ $4Qwqh$usePreventScroll();
423
+ let { modalProps: modalProps } = $4Qwqh$useModal({
424
+ isDisabled: isNonModal
425
+ });
426
+ // We need to measure the window's height in JS rather than using percentages in CSS
427
+ // so that contents (e.g. menu) can inherit the max-height properly. Using percentages
428
+ // does not work properly because there is nothing to base the percentage on.
429
+ // We cannot use vh units because mobile browsers adjust the window height dynamically
430
+ // when the address bar/bottom toolbars show and hide on scroll and vh units are fixed.
431
+ // Also, the visual viewport is smaller than the layout viewport when the virtual keyboard
432
+ // is up, so use the VisualViewport API to ensure the tray is displayed above the keyboard.
433
+ let viewport = $4Qwqh$useViewportSize();
434
+ let [height, setHeight] = $4Qwqh$useState(viewport.height);
435
+ let timeoutRef = $4Qwqh$useRef();
436
+ $4Qwqh$useEffect(()=>{
437
+ clearTimeout(timeoutRef.current);
438
+ // When the height is decreasing, and the keyboard is visible
439
+ // (visual viewport smaller than layout viewport), delay setting
440
+ // the new max height until after the animation is complete
441
+ // so that there isn't an empty space under the tray briefly.
442
+ if (viewport.height < height && viewport.height < window.innerHeight) timeoutRef.current = setTimeout(()=>{
443
+ setHeight(viewport.height);
444
+ }, 500);
445
+ else setHeight(viewport.height);
446
+ }, [
447
+ height,
448
+ viewport.height
449
+ ]);
450
+ let wrapperStyle = {
451
+ '--spectrum-visual-viewport-height': height + 'px'
452
+ };
453
+ let wrapperClassName = $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($02af7fbcfbd0696e$exports)), 'spectrum-Tray-wrapper');
454
+ let className = $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($02af7fbcfbd0696e$exports)), 'spectrum-Tray', {
455
+ 'is-open': isOpen,
456
+ 'spectrum-Tray--fixedHeight': isFixedHeight
457
+ }, $4Qwqh$classNames((/*@__PURE__*/$parcel$interopDefault($9ec42a7475cdf6b0$exports)), 'spectrum-Tray', 'react-spectrum-Tray'), otherProps.className);
458
+ let domProps = $4Qwqh$mergeProps(otherProps, overlayProps);
459
+ return(/*#__PURE__*/ $4Qwqh$react.createElement("div", {
460
+ className: wrapperClassName,
461
+ style: wrapperStyle
462
+ }, /*#__PURE__*/ $4Qwqh$react.createElement("div", {
463
+ ...domProps,
464
+ ...modalProps,
465
+ className: className,
466
+ ref: ref,
467
+ "data-testid": "tray"
468
+ }, children)));
447
469
  });
448
- export let Tray = /*#__PURE__*/forwardRef($beb29a978949a31ec0bff450b4dc$var$Tray);
470
+ let $115ab8a5c0552804$export$4589ed81930b555c = /*#__PURE__*/ $4Qwqh$forwardRef($115ab8a5c0552804$var$Tray);
471
+
472
+
473
+
474
+
475
+
476
+ export {$80816efa7007e5bf$export$c6fdb837b070b4ff as Overlay, $5b3c29c81f767e0c$export$5b6b19405a83ff9d as Popover, $c6a2ea12be2a8505$export$2b77a92f1a5ad772 as Modal, $115ab8a5c0552804$export$4589ed81930b555c as Tray, $647de0c873a185d0$export$b847a40ee92eff38 as OpenTransition};
449
477
  //# sourceMappingURL=module.js.map