@hanzogui/popper 3.0.1 → 7.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +15 -15
- package/src/Popper.tsx +24 -24
- package/types/Popper.d.ts +27 -27
- package/dist/cjs/Popper.cjs +0 -593
- package/dist/cjs/Popper.native.js +0 -632
- package/dist/cjs/Popper.native.js.map +0 -1
- package/dist/cjs/index.cjs +0 -18
- package/dist/cjs/index.native.js +0 -21
- package/dist/cjs/index.native.js.map +0 -1
- package/dist/esm/Popper.mjs +0 -544
- package/dist/esm/Popper.mjs.map +0 -1
- package/dist/esm/Popper.native.js +0 -581
- package/dist/esm/Popper.native.js.map +0 -1
- package/dist/esm/index.js +0 -2
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/index.mjs +0 -2
- package/dist/esm/index.mjs.map +0 -1
- package/dist/esm/index.native.js +0 -2
- package/dist/esm/index.native.js.map +0 -1
- package/dist/jsx/Popper.mjs +0 -544
- package/dist/jsx/Popper.mjs.map +0 -1
- package/dist/jsx/Popper.native.js +0 -632
- package/dist/jsx/Popper.native.js.map +0 -1
- package/dist/jsx/index.js +0 -2
- package/dist/jsx/index.js.map +0 -1
- package/dist/jsx/index.mjs +0 -2
- package/dist/jsx/index.mjs.map +0 -1
- package/dist/jsx/index.native.js +0 -21
- package/dist/jsx/index.native.js.map +0 -1
|
@@ -1,632 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var __create = Object.create;
|
|
4
|
-
var __defProp = Object.defineProperty;
|
|
5
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
-
var __getProtoOf = Object.getPrototypeOf,
|
|
8
|
-
__hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __export = (target, all) => {
|
|
10
|
-
for (var name in all) __defProp(target, name, {
|
|
11
|
-
get: all[name],
|
|
12
|
-
enumerable: !0
|
|
13
|
-
});
|
|
14
|
-
},
|
|
15
|
-
__copyProps = (to, from, except, desc) => {
|
|
16
|
-
if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, {
|
|
17
|
-
get: () => from[key],
|
|
18
|
-
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
19
|
-
});
|
|
20
|
-
return to;
|
|
21
|
-
};
|
|
22
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
23
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
24
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
25
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
26
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
27
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
|
|
28
|
-
value: mod,
|
|
29
|
-
enumerable: !0
|
|
30
|
-
}) : target, mod)),
|
|
31
|
-
__toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
|
|
32
|
-
value: !0
|
|
33
|
-
}), mod);
|
|
34
|
-
var Popper_exports = {};
|
|
35
|
-
__export(Popper_exports, {
|
|
36
|
-
Popper: () => Popper,
|
|
37
|
-
PopperAnchor: () => PopperAnchor,
|
|
38
|
-
PopperArrow: () => PopperArrow,
|
|
39
|
-
PopperArrowFrame: () => PopperArrowFrame,
|
|
40
|
-
PopperContent: () => PopperContent,
|
|
41
|
-
PopperContentFrame: () => PopperContentFrame,
|
|
42
|
-
PopperContextFast: () => PopperContextFast,
|
|
43
|
-
PopperContextSlow: () => PopperContextSlow,
|
|
44
|
-
PopperPositionContext: () => PopperPositionContext,
|
|
45
|
-
PopperProvider: () => PopperProvider,
|
|
46
|
-
PopperProviderFast: () => PopperProviderFast,
|
|
47
|
-
PopperProviderSlow: () => PopperProviderSlow,
|
|
48
|
-
setupPopper: () => setupPopper,
|
|
49
|
-
usePopperContext: () => usePopperContext,
|
|
50
|
-
usePopperContextSlow: () => usePopperContextSlow
|
|
51
|
-
});
|
|
52
|
-
module.exports = __toCommonJS(Popper_exports);
|
|
53
|
-
var import_jsx_runtime = require("react/jsx-runtime"),
|
|
54
|
-
import_react_dom = require("react-dom"),
|
|
55
|
-
import_gui_compose_refs = require("@hanzogui/compose-refs"),
|
|
56
|
-
import_gui_constants = require("@hanzogui/constants"),
|
|
57
|
-
import_gui_core = require("@hanzogui/core"),
|
|
58
|
-
import_gui_floating = require("@hanzogui/floating"),
|
|
59
|
-
import_gui_floating2 = require("@hanzogui/floating"),
|
|
60
|
-
import_gui_get_token = require("@hanzogui/get-token"),
|
|
61
|
-
import_gui_stacks = require("@hanzogui/stacks"),
|
|
62
|
-
import_gui_start_transition = require("@hanzogui/start-transition"),
|
|
63
|
-
React = __toESM(require("react"), 1),
|
|
64
|
-
import_react_native = require("react-native");
|
|
65
|
-
function _instanceof(left, right) {
|
|
66
|
-
return right != null && typeof Symbol < "u" && right[Symbol.hasInstance] ? !!right[Symbol.hasInstance](left) : left instanceof right;
|
|
67
|
-
}
|
|
68
|
-
function _type_of(obj) {
|
|
69
|
-
"@swc/helpers - typeof";
|
|
70
|
-
|
|
71
|
-
return obj && typeof Symbol < "u" && obj.constructor === Symbol ? "symbol" : typeof obj;
|
|
72
|
-
}
|
|
73
|
-
var PopperContextFast = (0, import_gui_core.createStyledContext)(
|
|
74
|
-
// since we always provide this we can avoid setting here
|
|
75
|
-
{}, "Popper__"),
|
|
76
|
-
PopperPositionContext = import_gui_core.createStyledContext,
|
|
77
|
-
{
|
|
78
|
-
useStyledContext: usePopperContext,
|
|
79
|
-
Provider: PopperProviderFast
|
|
80
|
-
} = PopperContextFast,
|
|
81
|
-
PopperContextSlow = (0, import_gui_core.createStyledContext)(
|
|
82
|
-
// since we always provide this we can avoid setting here
|
|
83
|
-
{}, "PopperSlow__"),
|
|
84
|
-
{
|
|
85
|
-
useStyledContext: usePopperContextSlow,
|
|
86
|
-
Provider: PopperProviderSlow
|
|
87
|
-
} = PopperContextSlow,
|
|
88
|
-
PopperProvider = function (param) {
|
|
89
|
-
var {
|
|
90
|
-
scope,
|
|
91
|
-
children,
|
|
92
|
-
...context
|
|
93
|
-
} = param,
|
|
94
|
-
fns = React.useRef(context);
|
|
95
|
-
fns.current = context;
|
|
96
|
-
var [slowContext] = React.useState(function () {
|
|
97
|
-
return {
|
|
98
|
-
refs: context.refs,
|
|
99
|
-
triggerElements: context.triggerElements,
|
|
100
|
-
update() {
|
|
101
|
-
for (var _len = arguments.length, a = new Array(_len), _key = 0; _key < _len; _key++) a[_key] = arguments[_key];
|
|
102
|
-
fns.current.update(...a);
|
|
103
|
-
},
|
|
104
|
-
getReferenceProps(p) {
|
|
105
|
-
var _fns_current_getReferenceProps, _fns_current;
|
|
106
|
-
return (_fns_current_getReferenceProps = (_fns_current = fns.current).getReferenceProps) === null || _fns_current_getReferenceProps === void 0 ? void 0 : _fns_current_getReferenceProps.call(_fns_current, p);
|
|
107
|
-
},
|
|
108
|
-
onHoverReference(e) {
|
|
109
|
-
var _fns_current_onHoverReference, _fns_current;
|
|
110
|
-
(_fns_current_onHoverReference = (_fns_current = fns.current).onHoverReference) === null || _fns_current_onHoverReference === void 0 || _fns_current_onHoverReference.call(_fns_current, e);
|
|
111
|
-
},
|
|
112
|
-
onLeaveReference() {
|
|
113
|
-
var _fns_current_onLeaveReference, _fns_current;
|
|
114
|
-
(_fns_current_onLeaveReference = (_fns_current = fns.current).onLeaveReference) === null || _fns_current_onLeaveReference === void 0 || _fns_current_onLeaveReference.call(_fns_current);
|
|
115
|
-
}
|
|
116
|
-
};
|
|
117
|
-
});
|
|
118
|
-
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperProviderFast, {
|
|
119
|
-
scope,
|
|
120
|
-
...context,
|
|
121
|
-
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperProviderSlow, {
|
|
122
|
-
scope,
|
|
123
|
-
...slowContext,
|
|
124
|
-
children
|
|
125
|
-
})
|
|
126
|
-
});
|
|
127
|
-
},
|
|
128
|
-
checkFloating = {
|
|
129
|
-
name: "checkFloating",
|
|
130
|
-
fn(data) {
|
|
131
|
-
return {
|
|
132
|
-
data: {
|
|
133
|
-
hasFloating: !!data.rects.floating.width
|
|
134
|
-
}
|
|
135
|
-
};
|
|
136
|
-
}
|
|
137
|
-
},
|
|
138
|
-
setupOptions = {};
|
|
139
|
-
function setupPopper(options) {
|
|
140
|
-
Object.assign(setupOptions, options);
|
|
141
|
-
}
|
|
142
|
-
function tamaguiAutoUpdate(reference, floating, update) {
|
|
143
|
-
update();
|
|
144
|
-
var rafId = requestAnimationFrame(function () {
|
|
145
|
-
update(), rafId = 0;
|
|
146
|
-
}),
|
|
147
|
-
cleanups = [function () {
|
|
148
|
-
rafId && cancelAnimationFrame(rafId);
|
|
149
|
-
}];
|
|
150
|
-
_instanceof(reference, HTMLElement) && cleanups.push((0, import_gui_core.registerLayoutNode)(reference, update));
|
|
151
|
-
var refAncestors = _instanceof(reference, Element) ? (0, import_gui_floating2.getOverflowAncestors)(reference) : [],
|
|
152
|
-
ancestors = [...refAncestors, ...(0, import_gui_floating2.getOverflowAncestors)(floating)],
|
|
153
|
-
uniqueAncestors = [...new Set(ancestors)],
|
|
154
|
-
_iteratorNormalCompletion = !0,
|
|
155
|
-
_didIteratorError = !1,
|
|
156
|
-
_iteratorError = void 0;
|
|
157
|
-
try {
|
|
158
|
-
for (var _iterator = uniqueAncestors[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
|
|
159
|
-
var ancestor = _step.value;
|
|
160
|
-
ancestor.addEventListener("scroll", update, {
|
|
161
|
-
passive: !0
|
|
162
|
-
});
|
|
163
|
-
}
|
|
164
|
-
} catch (err) {
|
|
165
|
-
_didIteratorError = !0, _iteratorError = err;
|
|
166
|
-
} finally {
|
|
167
|
-
try {
|
|
168
|
-
!_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
|
|
169
|
-
} finally {
|
|
170
|
-
if (_didIteratorError) throw _iteratorError;
|
|
171
|
-
}
|
|
172
|
-
}
|
|
173
|
-
return window.addEventListener("resize", update), cleanups.push(function () {
|
|
174
|
-
var _iteratorNormalCompletion2 = !0,
|
|
175
|
-
_didIteratorError2 = !1,
|
|
176
|
-
_iteratorError2 = void 0;
|
|
177
|
-
try {
|
|
178
|
-
for (var _iterator2 = uniqueAncestors[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = !0) {
|
|
179
|
-
var ancestor2 = _step2.value;
|
|
180
|
-
ancestor2.removeEventListener("scroll", update);
|
|
181
|
-
}
|
|
182
|
-
} catch (err) {
|
|
183
|
-
_didIteratorError2 = !0, _iteratorError2 = err;
|
|
184
|
-
} finally {
|
|
185
|
-
try {
|
|
186
|
-
!_iteratorNormalCompletion2 && _iterator2.return != null && _iterator2.return();
|
|
187
|
-
} finally {
|
|
188
|
-
if (_didIteratorError2) throw _iteratorError2;
|
|
189
|
-
}
|
|
190
|
-
}
|
|
191
|
-
window.removeEventListener("resize", update);
|
|
192
|
-
}), function () {
|
|
193
|
-
return cleanups.forEach(function (fn) {
|
|
194
|
-
return fn();
|
|
195
|
-
});
|
|
196
|
-
};
|
|
197
|
-
}
|
|
198
|
-
function Popper(props) {
|
|
199
|
-
var {
|
|
200
|
-
children,
|
|
201
|
-
size,
|
|
202
|
-
strategy = "absolute",
|
|
203
|
-
placement = "bottom",
|
|
204
|
-
stayInFrame,
|
|
205
|
-
allowFlip,
|
|
206
|
-
offset,
|
|
207
|
-
disableRTL,
|
|
208
|
-
resize,
|
|
209
|
-
passThrough,
|
|
210
|
-
open,
|
|
211
|
-
scope
|
|
212
|
-
} = props,
|
|
213
|
-
[arrowEl, setArrow] = React.useState(null),
|
|
214
|
-
[arrowSize, setArrowSize] = React.useState(0),
|
|
215
|
-
offsetOptions = offset ?? arrowSize,
|
|
216
|
-
floatingStyle = React.useRef({}),
|
|
217
|
-
isOpen = passThrough ? !1 : open ?? !0,
|
|
218
|
-
middlewareRef = React.useRef([]);
|
|
219
|
-
isOpen && (middlewareRef.current = [
|
|
220
|
-
// order matters: offset first, then flip, then shift, then arrow
|
|
221
|
-
typeof offsetOptions < "u" ? (0, import_gui_floating2.offset)(offsetOptions) : null, allowFlip ? (0, import_gui_floating2.flip)(typeof allowFlip == "boolean" ? {} : allowFlip) : null,
|
|
222
|
-
// NOTE: shift's axis terminology is reversed vs flip/offset:
|
|
223
|
-
// for top/bottom placements: mainAxis = horizontal, crossAxis = vertical
|
|
224
|
-
// for left/right placements: mainAxis = vertical, crossAxis = horizontal
|
|
225
|
-
// default to horizontal shift only (mainAxis: true, crossAxis: false)
|
|
226
|
-
stayInFrame ? (0, import_gui_floating2.shift)({
|
|
227
|
-
padding: 10,
|
|
228
|
-
mainAxis: !0,
|
|
229
|
-
crossAxis: !1,
|
|
230
|
-
...((typeof stayInFrame > "u" ? "undefined" : _type_of(stayInFrame)) === "object" ? stayInFrame : null)
|
|
231
|
-
}) : null, arrowEl ? (0, import_gui_floating2.arrow)({
|
|
232
|
-
element: arrowEl
|
|
233
|
-
}) : null, checkFloating, null, null, null].filter(Boolean));
|
|
234
|
-
var floating = (0, import_gui_floating2.useFloating)({
|
|
235
|
-
open: isOpen,
|
|
236
|
-
strategy,
|
|
237
|
-
placement,
|
|
238
|
-
sameScrollView: !1,
|
|
239
|
-
// this only takes effect on native
|
|
240
|
-
whileElementsMounted: isOpen ? tamaguiAutoUpdate : void 0,
|
|
241
|
-
platform: disableRTL ?? setupOptions.disableRTL ? {
|
|
242
|
-
...import_gui_floating2.platform,
|
|
243
|
-
isRTL(element) {
|
|
244
|
-
return !1;
|
|
245
|
-
}
|
|
246
|
-
} : import_gui_floating2.platform,
|
|
247
|
-
middleware: middlewareRef.current
|
|
248
|
-
}),
|
|
249
|
-
{
|
|
250
|
-
middlewareData
|
|
251
|
-
} = floating,
|
|
252
|
-
dimensions = (0, import_react_native.useWindowDimensions)(),
|
|
253
|
-
[keyboardOpen, setKeyboardOpen] = React.useState(!1);
|
|
254
|
-
React.useEffect(function () {
|
|
255
|
-
var showSubscription = import_react_native.Keyboard.addListener("keyboardDidShow", function () {
|
|
256
|
-
(0, import_gui_start_transition.startTransition)(function () {
|
|
257
|
-
setKeyboardOpen(!0);
|
|
258
|
-
});
|
|
259
|
-
}),
|
|
260
|
-
hideSubscription = import_react_native.Keyboard.addListener("keyboardDidHide", function () {
|
|
261
|
-
(0, import_gui_start_transition.startTransition)(function () {
|
|
262
|
-
setKeyboardOpen(!1);
|
|
263
|
-
});
|
|
264
|
-
});
|
|
265
|
-
return function () {
|
|
266
|
-
showSubscription.remove(), hideSubscription.remove();
|
|
267
|
-
};
|
|
268
|
-
}, []), (0, import_gui_constants.useIsomorphicLayoutEffect)(function () {
|
|
269
|
-
passThrough || floating.update();
|
|
270
|
-
}, [passThrough, dimensions, keyboardOpen]);
|
|
271
|
-
var popperContext = React.useMemo(function () {
|
|
272
|
-
var _middlewareData_checkFloating;
|
|
273
|
-
return {
|
|
274
|
-
size,
|
|
275
|
-
arrowRef: setArrow,
|
|
276
|
-
arrowStyle: middlewareData.arrow,
|
|
277
|
-
onArrowSize: setArrowSize,
|
|
278
|
-
hasFloating: (_middlewareData_checkFloating = middlewareData.checkFloating) === null || _middlewareData_checkFloating === void 0 ? void 0 : _middlewareData_checkFloating.hasFloating,
|
|
279
|
-
transformOrigin: middlewareData.transformOrigin,
|
|
280
|
-
open: !!open,
|
|
281
|
-
...floating
|
|
282
|
-
};
|
|
283
|
-
}, [open, size, floating, JSON.stringify(middlewareData.arrow || null), JSON.stringify(middlewareData.transformOrigin || null)]);
|
|
284
|
-
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperProvider, {
|
|
285
|
-
scope,
|
|
286
|
-
...popperContext,
|
|
287
|
-
children: (
|
|
288
|
-
/* reset FloatingOverrideContext so it doesn't leak into nested Poppers —
|
|
289
|
-
each Popper consumes the override for its own useFloating, children
|
|
290
|
-
should not inherit it (e.g. a Menu inside a Tooltip's tree) */
|
|
291
|
-
/* @__PURE__ */
|
|
292
|
-
(0, import_jsx_runtime.jsx)(import_gui_floating.FloatingOverrideContext.Provider, {
|
|
293
|
-
value: null,
|
|
294
|
-
children
|
|
295
|
-
}))
|
|
296
|
-
});
|
|
297
|
-
}
|
|
298
|
-
var PopperAnchor = import_gui_stacks.YStack.styleable(function (props, forwardedRef) {
|
|
299
|
-
var {
|
|
300
|
-
virtualRef,
|
|
301
|
-
scope,
|
|
302
|
-
...rest
|
|
303
|
-
} = props,
|
|
304
|
-
context = usePopperContextSlow(scope),
|
|
305
|
-
{
|
|
306
|
-
getReferenceProps,
|
|
307
|
-
refs,
|
|
308
|
-
update
|
|
309
|
-
} = context,
|
|
310
|
-
ref = React.useRef(null),
|
|
311
|
-
triggerId = React.useId();
|
|
312
|
-
React.useEffect(function () {
|
|
313
|
-
if (!(!scope || !context.triggerElements || !ref.current) && _instanceof(ref.current, Element)) {
|
|
314
|
-
var el = ref.current;
|
|
315
|
-
return context.triggerElements.add(triggerId, el), function () {
|
|
316
|
-
var _context_triggerElements;
|
|
317
|
-
(_context_triggerElements = context.triggerElements) === null || _context_triggerElements === void 0 || _context_triggerElements.delete(triggerId);
|
|
318
|
-
};
|
|
319
|
-
}
|
|
320
|
-
}, [scope, triggerId, context.triggerElements]), React.useEffect(function () {
|
|
321
|
-
virtualRef && (refs.setReference(virtualRef.current), update());
|
|
322
|
-
}, [virtualRef]);
|
|
323
|
-
var refProps = getReferenceProps?.({
|
|
324
|
-
...rest,
|
|
325
|
-
ref
|
|
326
|
-
}) || null,
|
|
327
|
-
safeSetReference = React.useCallback(function (node) {
|
|
328
|
-
(0, import_gui_start_transition.startTransition)(function () {
|
|
329
|
-
refs.setReference(node);
|
|
330
|
-
});
|
|
331
|
-
},
|
|
332
|
-
// it was refs.setRefernce but its stable and refs is undefined on server
|
|
333
|
-
[refs]),
|
|
334
|
-
shouldHandleInHover = import_gui_constants.isWeb && scope,
|
|
335
|
-
composedRefs = (0, import_gui_compose_refs.useComposedRefs)(forwardedRef, ref,
|
|
336
|
-
// web handles this onMouseEnter below so it can support multiple targets + hovering
|
|
337
|
-
shouldHandleInHover ? void 0 : safeSetReference);
|
|
338
|
-
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui_core.View, {
|
|
339
|
-
...rest,
|
|
340
|
-
...refProps,
|
|
341
|
-
ref: composedRefs,
|
|
342
|
-
...(shouldHandleInHover && {
|
|
343
|
-
// scoped poppers with multiple triggers: set the reference on
|
|
344
|
-
// mouseEnter so floating-ui positions relative to the hovered
|
|
345
|
-
// trigger, not the last one rendered.
|
|
346
|
-
//
|
|
347
|
-
// flushSync is critical here: without it, setReference batches
|
|
348
|
-
// with React's async state updates and the arrow/content position
|
|
349
|
-
// computes against the OLD reference element. this causes the
|
|
350
|
-
// arrow to flash at x=0 (top-left) during trigger switches.
|
|
351
|
-
// flushSync forces synchronous commit so update() below reads
|
|
352
|
-
// the correct reference element immediately.
|
|
353
|
-
onMouseEnter: function (e) {
|
|
354
|
-
var _e_currentTarget,
|
|
355
|
-
el = (_e_currentTarget = e.currentTarget) !== null && _e_currentTarget !== void 0 ? _e_currentTarget : ref.current;
|
|
356
|
-
if (_instanceof(el, HTMLElement)) {
|
|
357
|
-
var _refProps_onPointerEnter, _context_onHoverReference;
|
|
358
|
-
if ((0, import_react_dom.flushSync)(function () {
|
|
359
|
-
return refs.setReference(el);
|
|
360
|
-
}), update(), !refProps) return;
|
|
361
|
-
(_refProps_onPointerEnter = refProps.onPointerEnter) === null || _refProps_onPointerEnter === void 0 || _refProps_onPointerEnter.call(refProps, e), (_context_onHoverReference = context.onHoverReference) === null || _context_onHoverReference === void 0 || _context_onHoverReference.call(context, e.nativeEvent);
|
|
362
|
-
}
|
|
363
|
-
},
|
|
364
|
-
onMouseLeave: function (e) {
|
|
365
|
-
var _context_onLeaveReference, _refProps_onMouseLeave;
|
|
366
|
-
(_context_onLeaveReference = context.onLeaveReference) === null || _context_onLeaveReference === void 0 || _context_onLeaveReference.call(context), refProps == null || (_refProps_onMouseLeave = refProps.onMouseLeave) === null || _refProps_onMouseLeave === void 0 || _refProps_onMouseLeave.call(refProps, e);
|
|
367
|
-
}
|
|
368
|
-
})
|
|
369
|
-
});
|
|
370
|
-
}),
|
|
371
|
-
PopperContentFrame = (0, import_gui_core.styled)(import_gui_stacks.YStack, {
|
|
372
|
-
name: "PopperContent",
|
|
373
|
-
variants: {
|
|
374
|
-
unstyled: {
|
|
375
|
-
true: {}
|
|
376
|
-
},
|
|
377
|
-
size: {
|
|
378
|
-
"...size": function (val, param) {
|
|
379
|
-
var {
|
|
380
|
-
tokens
|
|
381
|
-
} = param;
|
|
382
|
-
return {
|
|
383
|
-
padding: tokens.space[val],
|
|
384
|
-
borderRadius: tokens.radius[val]
|
|
385
|
-
};
|
|
386
|
-
}
|
|
387
|
-
}
|
|
388
|
-
}
|
|
389
|
-
}),
|
|
390
|
-
PopperContent = /* @__PURE__ */React.forwardRef(function (props, forwardedRef) {
|
|
391
|
-
var {
|
|
392
|
-
scope,
|
|
393
|
-
animatePosition,
|
|
394
|
-
enableAnimationForPositionChange,
|
|
395
|
-
children,
|
|
396
|
-
passThrough,
|
|
397
|
-
unstyled,
|
|
398
|
-
...rest
|
|
399
|
-
} = props,
|
|
400
|
-
animatePos = animatePosition ?? enableAnimationForPositionChange,
|
|
401
|
-
context = usePopperContext(scope),
|
|
402
|
-
{
|
|
403
|
-
strategy,
|
|
404
|
-
placement,
|
|
405
|
-
refs,
|
|
406
|
-
x,
|
|
407
|
-
y,
|
|
408
|
-
getFloatingProps,
|
|
409
|
-
size,
|
|
410
|
-
isPositioned,
|
|
411
|
-
transformOrigin,
|
|
412
|
-
update
|
|
413
|
-
} = context,
|
|
414
|
-
updateRef = React.useRef(update);
|
|
415
|
-
updateRef.current = update;
|
|
416
|
-
var lastNodeRef = React.useRef(null),
|
|
417
|
-
safeSetFloating = React.useCallback(function (node) {
|
|
418
|
-
var isNewNode = node !== lastNodeRef.current;
|
|
419
|
-
if (node && (lastNodeRef.current = node, refs.setFloating(node), !isNewNode)) {
|
|
420
|
-
var _updateRef_current;
|
|
421
|
-
(_updateRef_current = updateRef.current) === null || _updateRef_current === void 0 || _updateRef_current.call(updateRef);
|
|
422
|
-
}
|
|
423
|
-
},
|
|
424
|
-
// null calls are blocked: cycling nulls are transient, genuine unmount
|
|
425
|
-
// is handled by the useEffect cleanup below
|
|
426
|
-
[refs.setFloating]);
|
|
427
|
-
React.useEffect(function () {
|
|
428
|
-
return function () {
|
|
429
|
-
var ourNode = lastNodeRef.current;
|
|
430
|
-
ourNode && refs.floating.current === ourNode && refs.setFloating(null), lastNodeRef.current = null;
|
|
431
|
-
};
|
|
432
|
-
}, []);
|
|
433
|
-
var contentRefs = (0, import_gui_compose_refs.useComposedRefs)(safeSetFloating, forwardedRef),
|
|
434
|
-
[needsMeasure, setNeedsMeasure] = React.useState(animatePos);
|
|
435
|
-
(0, import_gui_constants.useIsomorphicLayoutEffect)(function () {
|
|
436
|
-
needsMeasure && x && y && setNeedsMeasure(!1);
|
|
437
|
-
}, [needsMeasure, animatePos, x, y]);
|
|
438
|
-
var hasBeenPositioned = React.useRef(!1),
|
|
439
|
-
lastGoodPosition = React.useRef({
|
|
440
|
-
x: 0,
|
|
441
|
-
y: 0
|
|
442
|
-
});
|
|
443
|
-
(x !== 0 || y !== 0) && (lastGoodPosition.current = {
|
|
444
|
-
x,
|
|
445
|
-
y
|
|
446
|
-
}, isPositioned && (hasBeenPositioned.current = !0));
|
|
447
|
-
var brieflyZero = hasBeenPositioned.current && x === 0 && y === 0,
|
|
448
|
-
effectiveX = brieflyZero ? lastGoodPosition.current.x : x,
|
|
449
|
-
effectiveY = brieflyZero ? lastGoodPosition.current.y : y,
|
|
450
|
-
hide = !hasBeenPositioned.current && effectiveX === 0 && effectiveY === 0,
|
|
451
|
-
disableAnimationProp =
|
|
452
|
-
// if they want to animate also when re-positioning allow it
|
|
453
|
-
animatePos === "even-when-repositioning" ? needsMeasure : !hasBeenPositioned.current && !isPositioned || needsMeasure,
|
|
454
|
-
[disableAnimation, setDisableAnimation] = React.useState(disableAnimationProp);
|
|
455
|
-
React.useEffect(function () {
|
|
456
|
-
setDisableAnimation(disableAnimationProp);
|
|
457
|
-
}, [disableAnimationProp]);
|
|
458
|
-
var positionProps = hide ? {} :
|
|
459
|
-
// omit x/y when hiding - prevents motion driver from animating from origin
|
|
460
|
-
{
|
|
461
|
-
x: effectiveX || 0,
|
|
462
|
-
y: effectiveY || 0
|
|
463
|
-
},
|
|
464
|
-
frameProps = {
|
|
465
|
-
ref: contentRefs,
|
|
466
|
-
...positionProps,
|
|
467
|
-
top: 0,
|
|
468
|
-
left: 0,
|
|
469
|
-
position: strategy,
|
|
470
|
-
opacity: hide ? 0 : 1,
|
|
471
|
-
...(animatePos && {
|
|
472
|
-
transition: rest.transition,
|
|
473
|
-
// animateOnly: [] turns off transitions while keeping styles applied,
|
|
474
|
-
// letting the element move to its position silently before animations start
|
|
475
|
-
animateOnly: disableAnimation ? [] : rest.animateOnly,
|
|
476
|
-
animatePresence: !1
|
|
477
|
-
})
|
|
478
|
-
},
|
|
479
|
-
{
|
|
480
|
-
style,
|
|
481
|
-
...floatingProps
|
|
482
|
-
} = getFloatingProps ? getFloatingProps(frameProps) : frameProps,
|
|
483
|
-
transformOriginStyle = import_gui_constants.isWeb && transformOrigin ? {
|
|
484
|
-
transformOrigin: `${transformOrigin.x} ${transformOrigin.y}`
|
|
485
|
-
} : void 0;
|
|
486
|
-
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui_core.LayoutMeasurementController, {
|
|
487
|
-
disable: !context.open,
|
|
488
|
-
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui_core.View, {
|
|
489
|
-
passThrough,
|
|
490
|
-
ref: contentRefs,
|
|
491
|
-
direction: rest.direction,
|
|
492
|
-
...(passThrough ? null : floatingProps),
|
|
493
|
-
...(!passThrough && animatePos && {
|
|
494
|
-
"data-popper-animate-position": "true"
|
|
495
|
-
}),
|
|
496
|
-
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperContentFrame, {
|
|
497
|
-
passThrough,
|
|
498
|
-
unstyled,
|
|
499
|
-
...(!passThrough && {
|
|
500
|
-
"data-placement": placement,
|
|
501
|
-
"data-strategy": strategy,
|
|
502
|
-
size,
|
|
503
|
-
...style,
|
|
504
|
-
...transformOriginStyle,
|
|
505
|
-
...rest
|
|
506
|
-
}),
|
|
507
|
-
children
|
|
508
|
-
}, "popper-content-frame")
|
|
509
|
-
})
|
|
510
|
-
});
|
|
511
|
-
}),
|
|
512
|
-
PopperArrowFrame = (0, import_gui_core.styled)(import_gui_stacks.YStack, {
|
|
513
|
-
name: "PopperArrow",
|
|
514
|
-
variants: {
|
|
515
|
-
unstyled: {
|
|
516
|
-
false: {
|
|
517
|
-
borderColor: "$borderColor",
|
|
518
|
-
backgroundColor: "$background",
|
|
519
|
-
position: "relative"
|
|
520
|
-
}
|
|
521
|
-
}
|
|
522
|
-
},
|
|
523
|
-
defaultVariants: {
|
|
524
|
-
unstyled: process.env.HANZO_GUI_HEADLESS === "1"
|
|
525
|
-
}
|
|
526
|
-
}),
|
|
527
|
-
PopperArrowOuterFrame = (0, import_gui_core.styled)(import_gui_stacks.YStack, {
|
|
528
|
-
name: "PopperArrowOuter",
|
|
529
|
-
variants: {
|
|
530
|
-
unstyled: {
|
|
531
|
-
false: {
|
|
532
|
-
position: "absolute",
|
|
533
|
-
zIndex: 1e6,
|
|
534
|
-
pointerEvents: "none",
|
|
535
|
-
overflow: "hidden",
|
|
536
|
-
alignItems: "center",
|
|
537
|
-
justifyContent: "center"
|
|
538
|
-
}
|
|
539
|
-
}
|
|
540
|
-
},
|
|
541
|
-
defaultVariants: {
|
|
542
|
-
unstyled: process.env.HANZO_GUI_HEADLESS === "1"
|
|
543
|
-
}
|
|
544
|
-
}),
|
|
545
|
-
opposites = {
|
|
546
|
-
top: "bottom",
|
|
547
|
-
right: "left",
|
|
548
|
-
bottom: "top",
|
|
549
|
-
left: "right"
|
|
550
|
-
},
|
|
551
|
-
PopperArrow = /* @__PURE__ */React.forwardRef(function (propsIn, forwardedRef) {
|
|
552
|
-
var _context_arrowStyle,
|
|
553
|
-
_context_arrowStyle1,
|
|
554
|
-
{
|
|
555
|
-
scope,
|
|
556
|
-
animatePosition,
|
|
557
|
-
transition,
|
|
558
|
-
...rest
|
|
559
|
-
} = propsIn,
|
|
560
|
-
{
|
|
561
|
-
offset,
|
|
562
|
-
size: sizeProp,
|
|
563
|
-
borderWidth = 0,
|
|
564
|
-
...arrowProps
|
|
565
|
-
} = rest,
|
|
566
|
-
context = usePopperContext(scope),
|
|
567
|
-
sizeVal = typeof sizeProp == "number" ? sizeProp : (0, import_gui_core.getVariableValue)((0, import_gui_get_token.getSpace)(sizeProp ?? context.size, {
|
|
568
|
-
shift: -2,
|
|
569
|
-
bounds: [2]
|
|
570
|
-
})),
|
|
571
|
-
size = Math.max(0, +sizeVal),
|
|
572
|
-
{
|
|
573
|
-
placement
|
|
574
|
-
} = context,
|
|
575
|
-
refs = (0, import_gui_compose_refs.useComposedRefs)(context.arrowRef, forwardedRef),
|
|
576
|
-
x = ((_context_arrowStyle = context.arrowStyle) === null || _context_arrowStyle === void 0 ? void 0 : _context_arrowStyle.x) || 0,
|
|
577
|
-
y = ((_context_arrowStyle1 = context.arrowStyle) === null || _context_arrowStyle1 === void 0 ? void 0 : _context_arrowStyle1.y) || 0,
|
|
578
|
-
arrowPositioned = context.arrowStyle != null,
|
|
579
|
-
primaryPlacement = placement ? placement.split("-")[0] : "top",
|
|
580
|
-
arrowStyle = {
|
|
581
|
-
x,
|
|
582
|
-
y,
|
|
583
|
-
width: size,
|
|
584
|
-
height: size
|
|
585
|
-
},
|
|
586
|
-
innerArrowStyle = {},
|
|
587
|
-
isVertical = primaryPlacement === "bottom" || primaryPlacement === "top";
|
|
588
|
-
if (primaryPlacement) {
|
|
589
|
-
arrowStyle[isVertical ? "width" : "height"] = size * 2;
|
|
590
|
-
var oppSide = opposites[primaryPlacement];
|
|
591
|
-
oppSide && (arrowStyle[oppSide] = -size, innerArrowStyle[oppSide] = size / 2), (oppSide === "top" || oppSide === "bottom") && (arrowStyle.left = 0), (oppSide === "left" || oppSide === "right") && (arrowStyle.top = 0), (0, import_gui_constants.useIsomorphicLayoutEffect)(function () {
|
|
592
|
-
var _context_onArrowSize;
|
|
593
|
-
(_context_onArrowSize = context.onArrowSize) === null || _context_onArrowSize === void 0 || _context_onArrowSize.call(context, size);
|
|
594
|
-
}, [size, context.onArrowSize]);
|
|
595
|
-
}
|
|
596
|
-
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperArrowOuterFrame, {
|
|
597
|
-
ref: refs,
|
|
598
|
-
...arrowStyle,
|
|
599
|
-
...(!arrowPositioned && {
|
|
600
|
-
opacity: 0
|
|
601
|
-
}),
|
|
602
|
-
...(animatePosition && {
|
|
603
|
-
transition,
|
|
604
|
-
animateOnly: ["transform"],
|
|
605
|
-
animatePresence: !1
|
|
606
|
-
}),
|
|
607
|
-
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperArrowFrame, {
|
|
608
|
-
width: size,
|
|
609
|
-
height: size,
|
|
610
|
-
...arrowProps,
|
|
611
|
-
...innerArrowStyle,
|
|
612
|
-
rotate: "45deg",
|
|
613
|
-
...(primaryPlacement === "bottom" && {
|
|
614
|
-
borderLeftWidth: borderWidth,
|
|
615
|
-
borderTopWidth: borderWidth
|
|
616
|
-
}),
|
|
617
|
-
...(primaryPlacement === "top" && {
|
|
618
|
-
borderBottomWidth: borderWidth,
|
|
619
|
-
borderRightWidth: borderWidth
|
|
620
|
-
}),
|
|
621
|
-
...(primaryPlacement === "right" && {
|
|
622
|
-
borderLeftWidth: borderWidth,
|
|
623
|
-
borderBottomWidth: borderWidth
|
|
624
|
-
}),
|
|
625
|
-
...(primaryPlacement === "left" && {
|
|
626
|
-
borderTopWidth: borderWidth,
|
|
627
|
-
borderRightWidth: borderWidth
|
|
628
|
-
})
|
|
629
|
-
})
|
|
630
|
-
});
|
|
631
|
-
});
|
|
632
|
-
//# sourceMappingURL=Popper.native.js.map
|