@tamagui/popper 1.0.1-beta.21 → 1.0.1-beta.210
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Popper.js +159 -125
- package/dist/cjs/Popper.js.map +3 -3
- package/dist/cjs/floating.js +1 -0
- package/dist/cjs/floating.js.map +1 -1
- package/dist/cjs/floating.native.js +1 -0
- package/dist/cjs/floating.native.js.map +1 -1
- package/dist/cjs/index.js +1 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/useFloating.js +7 -4
- package/dist/cjs/useFloating.js.map +2 -2
- package/dist/esm/Popper.js +153 -108
- package/dist/esm/Popper.js.map +3 -3
- package/dist/esm/floating.js +0 -0
- package/dist/esm/floating.js.map +1 -1
- package/dist/esm/floating.native.js +0 -0
- package/dist/esm/floating.native.js.map +1 -1
- package/dist/esm/index.js +0 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/useFloating.js +2 -4
- package/dist/esm/useFloating.js.map +2 -2
- package/dist/jsx/Popper.js +124 -86
- package/dist/jsx/Popper.js.map +7 -0
- package/dist/jsx/floating.js +1 -0
- package/dist/jsx/floating.js.map +7 -0
- package/dist/jsx/floating.native.js +1 -0
- package/dist/jsx/floating.native.js.map +7 -0
- package/dist/jsx/index.js +1 -0
- package/dist/jsx/index.js.map +7 -0
- package/dist/jsx/useFloating.js +4 -6
- package/dist/jsx/useFloating.js.map +7 -0
- package/package.json +17 -12
- package/src/Popper.tsx +351 -0
- package/src/floating.native.tsx +1 -0
- package/src/floating.tsx +1 -0
- package/src/index.tsx +2 -0
- package/src/useFloating.tsx +20 -0
- package/types/Popper.d.ts +73 -61
- package/types/index.d.ts +1 -1
- package/types/useFloating.d.ts +3 -2
- package/types/Popper.d.ts.map +0 -1
- package/types/floating.d.ts.map +0 -1
- package/types/floating.native.d.ts.map +0 -1
- package/types/index.d.ts.map +0 -1
- package/types/useFloating.d.ts.map +0 -1
- package/types/useFloating.native.d.ts +0 -2
- package/types/useFloating.native.d.ts.map +0 -1
- package/types/useFloating.web.d.ts +0 -2
- package/types/useFloating.web.d.ts.map +0 -1
package/dist/cjs/Popper.js
CHANGED
|
@@ -1,39 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
6
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
9
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
-
var __spreadValues = (a, b) => {
|
|
13
|
-
for (var prop in b || (b = {}))
|
|
14
|
-
if (__hasOwnProp.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
if (__getOwnPropSymbols)
|
|
17
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
-
if (__propIsEnum.call(b, prop))
|
|
19
|
-
__defNormalProp(a, prop, b[prop]);
|
|
20
|
-
}
|
|
21
|
-
return a;
|
|
22
|
-
};
|
|
23
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
|
-
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
25
|
-
var __objRest = (source, exclude) => {
|
|
26
|
-
var target = {};
|
|
27
|
-
for (var prop in source)
|
|
28
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
if (source != null && __getOwnPropSymbols)
|
|
31
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
-
target[prop] = source[prop];
|
|
34
|
-
}
|
|
35
|
-
return target;
|
|
36
|
-
};
|
|
37
8
|
var __export = (target, all) => {
|
|
38
9
|
for (var name in all)
|
|
39
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -46,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
46
17
|
}
|
|
47
18
|
return to;
|
|
48
19
|
};
|
|
49
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
50
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
51
25
|
var Popper_exports = {};
|
|
52
26
|
__export(Popper_exports, {
|
|
@@ -54,9 +28,11 @@ __export(Popper_exports, {
|
|
|
54
28
|
PopperAnchor: () => PopperAnchor,
|
|
55
29
|
PopperArrow: () => PopperArrow,
|
|
56
30
|
PopperContent: () => PopperContent,
|
|
57
|
-
createPopperScope: () => createPopperScope
|
|
31
|
+
createPopperScope: () => createPopperScope,
|
|
32
|
+
usePopperContext: () => usePopperContext
|
|
58
33
|
});
|
|
59
34
|
module.exports = __toCommonJS(Popper_exports);
|
|
35
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
60
36
|
var import_compose_refs = require("@tamagui/compose-refs");
|
|
61
37
|
var import_core = require("@tamagui/core");
|
|
62
38
|
var import_create_context = require("@tamagui/create-context");
|
|
@@ -68,8 +44,16 @@ const POPPER_NAME = "Popper";
|
|
|
68
44
|
const [createPopperContext, createScope] = (0, import_create_context.createContextScope)(POPPER_NAME);
|
|
69
45
|
const createPopperScope = createScope;
|
|
70
46
|
const [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
|
|
71
|
-
const Popper =
|
|
72
|
-
const {
|
|
47
|
+
const Popper = (props) => {
|
|
48
|
+
const {
|
|
49
|
+
__scopePopper,
|
|
50
|
+
children,
|
|
51
|
+
size,
|
|
52
|
+
strategy = "absolute",
|
|
53
|
+
placement = "bottom",
|
|
54
|
+
stayInFrame,
|
|
55
|
+
allowFlip
|
|
56
|
+
} = props;
|
|
73
57
|
const [isMounted, setIsMounted] = React.useState(false);
|
|
74
58
|
(0, import_core.useIsomorphicLayoutEffect)(() => {
|
|
75
59
|
setIsMounted(true);
|
|
@@ -79,10 +63,11 @@ const Popper = /* @__PURE__ */ __name((props) => {
|
|
|
79
63
|
const [arrowSize, setArrowSize] = React.useState(0);
|
|
80
64
|
const arrowRef = React.useRef();
|
|
81
65
|
const floating = (0, import_useFloating.useFloating)({
|
|
66
|
+
strategy,
|
|
82
67
|
placement,
|
|
83
68
|
middleware: [
|
|
84
|
-
stayInFrame ? (0, import_floating.shift)(stayInFrame) : null,
|
|
85
|
-
allowFlip ? (0, import_floating.flip)(allowFlip) : null,
|
|
69
|
+
stayInFrame ? (0, import_floating.shift)(typeof stayInFrame === "boolean" ? {} : stayInFrame) : null,
|
|
70
|
+
allowFlip ? (0, import_floating.flip)(typeof allowFlip === "boolean" ? {} : allowFlip) : null,
|
|
86
71
|
arrowEl ? (0, import_floating.arrow)({ element: arrowEl }) : null,
|
|
87
72
|
arrowSize ? (0, import_floating.offset)(arrowSize) : null
|
|
88
73
|
].filter(Boolean)
|
|
@@ -97,77 +82,109 @@ const Popper = /* @__PURE__ */ __name((props) => {
|
|
|
97
82
|
return;
|
|
98
83
|
}
|
|
99
84
|
return (0, import_floating.autoUpdate)(refs.reference.current, refs.floating.current, floating.update);
|
|
100
|
-
}, [refs.floating
|
|
85
|
+
}, [floating.update, refs.floating, refs.reference]);
|
|
101
86
|
const arrowStyle = React.useMemo(() => {
|
|
102
87
|
return middlewareData.arrow;
|
|
103
88
|
}, [JSON.stringify(middlewareData.arrow || {})]);
|
|
104
|
-
return /* @__PURE__ */
|
|
89
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperProvider, {
|
|
105
90
|
scope: __scopePopper,
|
|
106
91
|
anchorRef,
|
|
107
92
|
size,
|
|
108
93
|
arrowRef: composedArrowRefs,
|
|
109
94
|
arrowStyle,
|
|
110
95
|
onArrowSize: setArrowSize,
|
|
111
|
-
isMounted
|
|
112
|
-
|
|
113
|
-
|
|
96
|
+
isMounted,
|
|
97
|
+
...floating,
|
|
98
|
+
children
|
|
99
|
+
});
|
|
100
|
+
};
|
|
114
101
|
Popper.displayName = POPPER_NAME;
|
|
115
102
|
const ANCHOR_NAME = "PopperAnchor";
|
|
116
|
-
const PopperAnchor = React.forwardRef(
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
103
|
+
const PopperAnchor = React.forwardRef(
|
|
104
|
+
(props, forwardedRef) => {
|
|
105
|
+
const { __scopePopper, virtualRef, ...anchorProps } = props;
|
|
106
|
+
const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper);
|
|
107
|
+
const ref = React.useRef(null);
|
|
108
|
+
const composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, ref, anchorRef);
|
|
109
|
+
if (virtualRef) {
|
|
110
|
+
return null;
|
|
111
|
+
}
|
|
112
|
+
const stackProps = {
|
|
113
|
+
ref: composedRefs,
|
|
114
|
+
...anchorProps
|
|
115
|
+
};
|
|
116
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
|
|
117
|
+
...getReferenceProps ? getReferenceProps(stackProps) : stackProps
|
|
118
|
+
});
|
|
123
119
|
}
|
|
124
|
-
|
|
125
|
-
ref: composedRefs
|
|
126
|
-
}, anchorProps);
|
|
127
|
-
return /* @__PURE__ */ React.createElement(import_stacks.YStack, __spreadValues({}, getReferenceProps ? getReferenceProps(stackProps) : stackProps));
|
|
128
|
-
});
|
|
120
|
+
);
|
|
129
121
|
PopperAnchor.displayName = ANCHOR_NAME;
|
|
130
122
|
const CONTENT_NAME = "PopperContent";
|
|
131
|
-
const PopperContentFrame = (0, import_core.styled)(import_stacks.
|
|
123
|
+
const PopperContentFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
|
|
132
124
|
name: "PopperContent",
|
|
133
125
|
backgroundColor: "$background",
|
|
134
126
|
alignItems: "center",
|
|
127
|
+
radiused: true,
|
|
128
|
+
variants: {
|
|
129
|
+
size: {
|
|
130
|
+
"...size": (val, { tokens }) => {
|
|
131
|
+
return {
|
|
132
|
+
padding: tokens.space[val],
|
|
133
|
+
borderRadius: tokens.radius[val]
|
|
134
|
+
};
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
},
|
|
135
138
|
defaultVariants: {
|
|
136
139
|
size: "$4"
|
|
137
140
|
}
|
|
138
141
|
});
|
|
139
|
-
const PopperContent =
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
142
|
+
const PopperContent = PopperContentFrame.extractable(
|
|
143
|
+
React.forwardRef(
|
|
144
|
+
(props, forwardedRef) => {
|
|
145
|
+
const { __scopePopper, ...contentProps } = props;
|
|
146
|
+
const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } = usePopperContext(CONTENT_NAME, __scopePopper);
|
|
147
|
+
const contentRefs = (0, import_compose_refs.useComposedRefs)(floating, forwardedRef);
|
|
148
|
+
const contents = React.useMemo(() => {
|
|
149
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperContentFrame, {
|
|
150
|
+
"data-placement": placement,
|
|
151
|
+
"data-strategy": strategy,
|
|
152
|
+
size: contentProps.size || size,
|
|
153
|
+
...contentProps
|
|
154
|
+
}, "popper-content-frame");
|
|
155
|
+
}, [placement, strategy, props]);
|
|
156
|
+
if (!isMounted) {
|
|
157
|
+
return null;
|
|
158
|
+
}
|
|
159
|
+
const frameProps = {
|
|
160
|
+
ref: contentRefs,
|
|
161
|
+
x: x || 0,
|
|
162
|
+
y: y || 0,
|
|
163
|
+
position: strategy
|
|
164
|
+
};
|
|
165
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
|
|
166
|
+
...getFloatingProps ? getFloatingProps(frameProps) : frameProps,
|
|
167
|
+
children: contents
|
|
168
|
+
});
|
|
169
|
+
}
|
|
170
|
+
)
|
|
171
|
+
);
|
|
163
172
|
PopperContent.displayName = CONTENT_NAME;
|
|
164
173
|
const ARROW_NAME = "PopperArrow";
|
|
165
174
|
const PopperArrowFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
166
175
|
name: "PopperArrow",
|
|
167
176
|
borderColor: "$borderColor",
|
|
168
177
|
backgroundColor: "$background",
|
|
178
|
+
position: "relative"
|
|
179
|
+
});
|
|
180
|
+
const PopperArrowOuterFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
181
|
+
name: "PopperArrowOuter",
|
|
169
182
|
position: "absolute",
|
|
170
|
-
zIndex: 1
|
|
183
|
+
zIndex: -1,
|
|
184
|
+
pointerEvents: "none",
|
|
185
|
+
overflow: "hidden",
|
|
186
|
+
alignItems: "center",
|
|
187
|
+
justifyContent: "center"
|
|
171
188
|
});
|
|
172
189
|
const opposites = {
|
|
173
190
|
top: "bottom",
|
|
@@ -175,52 +192,68 @@ const opposites = {
|
|
|
175
192
|
bottom: "top",
|
|
176
193
|
left: "right"
|
|
177
194
|
};
|
|
178
|
-
const PopperArrow =
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
const
|
|
192
|
-
|
|
193
|
-
|
|
195
|
+
const PopperArrow = PopperArrowFrame.extractable(
|
|
196
|
+
React.forwardRef(function PopperArrow2(props, forwardedRef) {
|
|
197
|
+
const { __scopePopper, offset: offset2, size: sizeProp, borderWidth = 0, ...arrowProps } = props;
|
|
198
|
+
const context = usePopperContext(ARROW_NAME, __scopePopper);
|
|
199
|
+
const tokens = (0, import_core.getTokens)();
|
|
200
|
+
const sizeVal = sizeProp ?? context.size;
|
|
201
|
+
const sizeValResolved = (0, import_core.getVariableValue)((0, import_core.stepTokenUpOrDown)(tokens.space, sizeVal, -2, [2]));
|
|
202
|
+
const size = +sizeValResolved;
|
|
203
|
+
const { placement } = context;
|
|
204
|
+
const { x, y } = context.arrowStyle || { x: 0, y: 0 };
|
|
205
|
+
const refs = (0, import_compose_refs.useComposedRefs)(context.arrowRef, forwardedRef);
|
|
206
|
+
const primaryPlacement = placement ? placement.split("-")[0] : "top";
|
|
207
|
+
const arrowStyle = { x, y, width: size, height: size };
|
|
208
|
+
const innerArrowStyle = {};
|
|
209
|
+
const isVertical = primaryPlacement === "bottom" || primaryPlacement === "top";
|
|
210
|
+
if (primaryPlacement) {
|
|
211
|
+
arrowStyle[isVertical ? "width" : "height"] = size * 2;
|
|
212
|
+
const oppSide = opposites[primaryPlacement];
|
|
213
|
+
if (oppSide) {
|
|
214
|
+
arrowStyle[oppSide] = -size;
|
|
215
|
+
innerArrowStyle[oppSide] = size / 2;
|
|
216
|
+
}
|
|
217
|
+
if (oppSide === "top" || oppSide === "bottom") {
|
|
218
|
+
arrowStyle.left = 0;
|
|
219
|
+
}
|
|
220
|
+
if (oppSide === "left" || oppSide === "right") {
|
|
221
|
+
arrowStyle.top = 0;
|
|
222
|
+
}
|
|
194
223
|
}
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
}
|
|
224
|
+
(0, import_core.useIsomorphicLayoutEffect)(() => {
|
|
225
|
+
var _a;
|
|
226
|
+
(_a = context.onArrowSize) == null ? void 0 : _a.call(context, size);
|
|
227
|
+
}, [size, context.onArrowSize]);
|
|
228
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperArrowOuterFrame, {
|
|
229
|
+
ref: refs,
|
|
230
|
+
...arrowStyle,
|
|
231
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperArrowFrame, {
|
|
232
|
+
width: size,
|
|
233
|
+
height: size,
|
|
234
|
+
...arrowProps,
|
|
235
|
+
...innerArrowStyle,
|
|
236
|
+
rotate: "45deg",
|
|
237
|
+
...primaryPlacement === "bottom" && {
|
|
238
|
+
borderBottomWidth: borderWidth,
|
|
239
|
+
borderRightWidth: borderWidth
|
|
240
|
+
},
|
|
241
|
+
...primaryPlacement === "top" && {
|
|
242
|
+
borderTopWidth: borderWidth,
|
|
243
|
+
borderLeftWidth: borderWidth
|
|
244
|
+
},
|
|
245
|
+
...primaryPlacement === "right" && {
|
|
246
|
+
borderTopWidth: borderWidth,
|
|
247
|
+
borderRightWidth: borderWidth
|
|
248
|
+
},
|
|
249
|
+
...primaryPlacement === "left" && {
|
|
250
|
+
borderBottomWidth: borderWidth,
|
|
251
|
+
borderLeftWidth: borderWidth
|
|
252
|
+
}
|
|
253
|
+
})
|
|
254
|
+
});
|
|
255
|
+
})
|
|
256
|
+
);
|
|
224
257
|
PopperArrow.displayName = ARROW_NAME;
|
|
225
258
|
// Annotate the CommonJS export names for ESM import in node:
|
|
226
259
|
0 && (module.exports = {
|
|
@@ -228,6 +261,7 @@ PopperArrow.displayName = ARROW_NAME;
|
|
|
228
261
|
PopperAnchor,
|
|
229
262
|
PopperArrow,
|
|
230
263
|
PopperContent,
|
|
231
|
-
createPopperScope
|
|
264
|
+
createPopperScope,
|
|
265
|
+
usePopperContext
|
|
232
266
|
});
|
|
233
267
|
//# sourceMappingURL=Popper.js.map
|
package/dist/cjs/Popper.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Popper.tsx"],
|
|
4
|
-
"sourcesContent": ["// adapted from radix-ui popper\n\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n SizeTokens,\n StackProps,\n getTokens,\n getVariableValue,\n styled,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { SizableStack, SizableStackProps, YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { View } from 'react-native'\n\nimport { Coords, Placement, arrow, autoUpdate, flip, offset, shift } from './floating'\nimport { UseFloatingResult, useFloating } from './useFloating'\n\ntype ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never\ntype FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never\n\n/* -------------------------------------------------------------------------------------------------\n * Popper\n * -----------------------------------------------------------------------------------------------*/\n\nconst POPPER_NAME = 'Popper'\n\ntype ScopedProps<P> = P & { __scopePopper?: Scope }\nconst [createPopperContext, createScope] = createContextScope(POPPER_NAME)\n\nexport const createPopperScope = createScope\n\ntype PopperContextValue = UseFloatingResult & {\n isMounted: boolean\n anchorRef: any\n size?: SizeTokens\n placement?: Placement\n arrowRef: any\n onArrowSize?: (val: number) => void\n arrowStyle?: Partial<Coords> & {\n centerOffset: number\n }\n}\nconst [PopperProvider, usePopperContext] = createPopperContext<PopperContextValue>(POPPER_NAME)\n\nexport type PopperProps = {\n size?: SizeTokens\n children?: React.ReactNode\n placement?: Placement\n stayInFrame?: ShiftProps\n allowFlip?: FlipProps\n}\n\nexport const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) => {\n const { __scopePopper, children, size, placement = 'bottom', stayInFrame, allowFlip } = props\n\n const [isMounted, setIsMounted] = React.useState(false)\n useIsomorphicLayoutEffect(() => {\n setIsMounted(true)\n }, [])\n\n const anchorRef = React.useRef<any>()\n const [arrowEl, setArrow] = React.useState<HTMLSpanElement | null>(null)\n const [arrowSize, setArrowSize] = React.useState(0)\n const arrowRef = React.useRef()\n\n const floating = useFloating({\n placement,\n middleware: [\n stayInFrame ? shift(stayInFrame) : (null as any),\n allowFlip ? flip(allowFlip) : (null as any),\n arrowEl ? arrow({ element: arrowEl }) : (null as any),\n arrowSize ? offset(arrowSize) : (null as any),\n ].filter(Boolean),\n })\n\n const { refs, middlewareData } = floating\n\n const composedArrowRefs = useComposedRefs<any>(arrowRef, setArrow)\n\n useIsomorphicLayoutEffect(() => {\n floating.reference(anchorRef.current)\n }, [anchorRef])\n\n React.useEffect(() => {\n if (!refs.reference.current || !refs.floating.current) {\n return\n }\n // Only call this when the floating element is rendered\n return autoUpdate(refs.reference.current, refs.floating.current, floating.update)\n }, [refs.floating.current, refs.reference.current])\n\n const arrowStyle = React.useMemo(() => {\n return middlewareData.arrow\n }, [JSON.stringify(middlewareData.arrow || {})])\n\n return (\n <PopperProvider\n scope={__scopePopper}\n anchorRef={anchorRef}\n size={size}\n arrowRef={composedArrowRefs}\n arrowStyle={arrowStyle}\n onArrowSize={setArrowSize}\n isMounted={isMounted}\n {...floating}\n >\n {children}\n </PopperProvider>\n )\n}\n\nPopper.displayName = POPPER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopperAnchor'\n\ntype PopperAnchorRef = HTMLElement | View\n\nexport type PopperAnchorProps = YStackProps & {\n virtualRef?: React.RefObject<any>\n}\n\nexport const PopperAnchor = React.forwardRef<PopperAnchorRef, PopperAnchorProps>(\n (props: ScopedProps<PopperAnchorProps>, forwardedRef) => {\n const { __scopePopper, virtualRef, ...anchorProps } = props\n const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper)\n const ref = React.useRef<PopperAnchorRef>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, anchorRef)\n if (virtualRef) {\n return null\n }\n const stackProps = {\n ref: composedRefs,\n ...anchorProps,\n }\n return <YStack {...(getReferenceProps ? getReferenceProps(stackProps) : stackProps)} />\n }\n)\n\nPopperAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopperContent'\n\ntype PopperContentElement = HTMLElement | View\n\nexport type PopperContentProps = SizableStackProps\n\nconst PopperContentFrame = styled(SizableStack, {\n name: 'PopperContent',\n backgroundColor: '$background',\n alignItems: 'center',\n\n defaultVariants: {\n size: '$4',\n },\n})\n\nexport const PopperContent = React.forwardRef<PopperContentElement, PopperContentProps>(\n (props: ScopedProps<PopperContentProps>, forwardedRef) => {\n const { __scopePopper, ...contentProps } = props\n const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } =\n usePopperContext(CONTENT_NAME, __scopePopper)\n const contentRefs = useComposedRefs<any>(floating, forwardedRef)\n\n const contents = React.useMemo(() => {\n return (\n <PopperContentFrame\n key=\"popper-content-frame\"\n data-placement={placement}\n data-strategy={strategy}\n {...contentProps}\n size={contentProps.size ?? size}\n />\n )\n }, [placement, strategy, props])\n\n // all poppers hidden on ssr by default\n if (!isMounted) {\n return null\n }\n\n const frameProps = {\n ref: contentRefs,\n x: (x as any) || 0,\n y: (y as any) || 0,\n position: 'absolute',\n }\n\n // outer frame because we explicitly dont want animation to apply to this\n return (\n <YStack {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}>\n {contents}\n </YStack>\n )\n }\n)\n\nPopperContent.displayName = CONTENT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopperArrow'\n\ntype PopperArrowElement = HTMLElement | View\n\nexport type PopperArrowProps = YStackProps & {\n offset?: number\n size?: SizeTokens\n}\n\nconst PopperArrowFrame = styled(YStack, {\n name: 'PopperArrow',\n borderColor: '$borderColor',\n backgroundColor: '$background',\n position: 'absolute',\n zIndex: 1,\n // TODO bug not applying\n // rotate: '45deg',\n})\n\nconst opposites = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n}\n\nexport const PopperArrow = React.forwardRef<PopperArrowElement, PopperArrowProps>(\n function PopperArrow(props: ScopedProps<PopperArrowProps>, forwardedRef) {\n const { __scopePopper, offset, size: sizeProp, borderWidth = 0, ...arrowProps } = props\n const context = usePopperContext(ARROW_NAME, __scopePopper)\n const tokens = getTokens()\n const sizeVal = sizeProp ?? context.size\n const sizeValResolved = getVariableValue(tokens.size[sizeVal as any] ?? sizeVal ?? 12)\n const size = +sizeValResolved\n const { placement } = context\n const { x, y } = context.arrowStyle || { x: 0, y: 0 }\n const refs = useComposedRefs(context.arrowRef, forwardedRef)\n\n const primaryPlacement = placement ? placement.split('-')[0] : 'top'\n\n let arrowStyle: StackProps = { x, y, width: size, height: size }\n if (primaryPlacement) {\n const oppSide = opposites[primaryPlacement]\n if (oppSide) {\n arrowStyle[oppSide] = -size / 2\n }\n if (oppSide === 'top' || oppSide === 'bottom') {\n arrowStyle.left = 0\n }\n if (oppSide === 'left' || oppSide === 'right') {\n arrowStyle.top = 0\n }\n }\n\n // send the Arrow's offset up to Popper\n useIsomorphicLayoutEffect(() => {\n context.onArrowSize?.(size)\n }, [size, context.onArrowSize])\n\n return (\n <PopperArrowFrame\n {...arrowProps}\n ref={refs}\n {...arrowStyle}\n rotate=\"45deg\"\n // left={0}\n // top={0}\n {...(primaryPlacement === 'top' && {\n borderBottomWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'bottom' && {\n borderTopWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n {...(primaryPlacement === 'left' && {\n borderTopWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'right' && {\n borderBottomWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n />\n )\n }\n)\n\nPopperArrow.displayName = ARROW_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["// adapted from radix-ui popper\n\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n SizeTokens,\n StackProps,\n getTokens,\n getVariableValue,\n stepTokenUpOrDown,\n styled,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { View } from 'react-native'\n\nimport { Coords, Placement, Strategy, arrow, autoUpdate, flip, offset, shift } from './floating'\nimport { UseFloatingReturn, useFloating } from './useFloating'\n\ntype ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never\ntype FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never\n\n/* -------------------------------------------------------------------------------------------------\n * Popper\n * -----------------------------------------------------------------------------------------------*/\n\nconst POPPER_NAME = 'Popper'\n\ntype ScopedProps<P> = P & { __scopePopper?: Scope }\nconst [createPopperContext, createScope] = createContextScope(POPPER_NAME)\n\nexport const createPopperScope = createScope\n\ntype PopperContextValue = UseFloatingReturn & {\n isMounted: boolean\n anchorRef: any\n size?: SizeTokens\n placement?: Placement\n arrowRef: any\n onArrowSize?: (val: number) => void\n arrowStyle?: Partial<Coords> & {\n centerOffset: number\n }\n}\nconst [PopperProvider, usePopperContext] = createPopperContext<PopperContextValue>(POPPER_NAME)\n\nexport type PopperProps = {\n size?: SizeTokens\n children?: React.ReactNode\n placement?: Placement\n stayInFrame?: ShiftProps | boolean\n allowFlip?: FlipProps | boolean\n strategy?: Strategy\n}\n\nexport const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) => {\n const {\n __scopePopper,\n children,\n size,\n strategy = 'absolute',\n placement = 'bottom',\n stayInFrame,\n allowFlip,\n } = props\n\n const [isMounted, setIsMounted] = React.useState(false)\n useIsomorphicLayoutEffect(() => {\n setIsMounted(true)\n }, [])\n\n const anchorRef = React.useRef<any>()\n const [arrowEl, setArrow] = React.useState<HTMLSpanElement | null>(null)\n const [arrowSize, setArrowSize] = React.useState(0)\n const arrowRef = React.useRef()\n\n const floating = useFloating({\n strategy,\n placement,\n middleware: [\n stayInFrame ? shift(typeof stayInFrame === 'boolean' ? {} : stayInFrame) : (null as any),\n allowFlip ? flip(typeof allowFlip === 'boolean' ? {} : allowFlip) : (null as any),\n arrowEl ? arrow({ element: arrowEl }) : (null as any),\n arrowSize ? offset(arrowSize) : (null as any),\n ].filter(Boolean),\n })\n\n const { refs, middlewareData } = floating\n\n const composedArrowRefs = useComposedRefs<any>(arrowRef, setArrow)\n\n useIsomorphicLayoutEffect(() => {\n floating.reference(anchorRef.current)\n }, [anchorRef])\n\n React.useEffect(() => {\n if (!refs.reference.current || !refs.floating.current) {\n return\n }\n // Only call this when the floating element is rendered\n return autoUpdate(refs.reference.current, refs.floating.current, floating.update)\n }, [floating.update, refs.floating, refs.reference])\n\n const arrowStyle = React.useMemo(() => {\n return middlewareData.arrow\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(middlewareData.arrow || {})])\n\n return (\n <PopperProvider\n scope={__scopePopper}\n anchorRef={anchorRef}\n size={size}\n arrowRef={composedArrowRefs}\n arrowStyle={arrowStyle}\n onArrowSize={setArrowSize}\n isMounted={isMounted}\n {...floating}\n >\n {children}\n </PopperProvider>\n )\n}\n\nPopper.displayName = POPPER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopperAnchor'\n\ntype PopperAnchorRef = HTMLElement | View\n\nexport type PopperAnchorProps = YStackProps & {\n virtualRef?: React.RefObject<any>\n}\n\nexport const PopperAnchor = React.forwardRef<PopperAnchorRef, PopperAnchorProps>(\n (props: ScopedProps<PopperAnchorProps>, forwardedRef) => {\n const { __scopePopper, virtualRef, ...anchorProps } = props\n const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper)\n const ref = React.useRef<PopperAnchorRef>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, anchorRef)\n if (virtualRef) {\n return null\n }\n const stackProps = {\n ref: composedRefs,\n ...anchorProps,\n }\n return <YStack {...(getReferenceProps ? getReferenceProps(stackProps) : stackProps)} />\n }\n)\n\nPopperAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopperContent'\n\ntype PopperContentElement = HTMLElement | View\n\nexport type PopperContentProps = SizableStackProps\n\nconst PopperContentFrame = styled(ThemeableStack, {\n name: 'PopperContent',\n backgroundColor: '$background',\n alignItems: 'center',\n radiused: true,\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n padding: tokens.space[val],\n borderRadius: tokens.radius[val],\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$4',\n },\n})\n\nexport const PopperContent = PopperContentFrame.extractable(\n React.forwardRef<PopperContentElement, PopperContentProps>(\n (props: ScopedProps<PopperContentProps>, forwardedRef) => {\n const { __scopePopper, ...contentProps } = props\n const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } =\n usePopperContext(CONTENT_NAME, __scopePopper)\n const contentRefs = useComposedRefs<any>(floating, forwardedRef)\n\n const contents = React.useMemo(() => {\n return (\n <PopperContentFrame\n key=\"popper-content-frame\"\n data-placement={placement}\n data-strategy={strategy}\n size={contentProps.size || size}\n {...contentProps}\n />\n )\n }, [placement, strategy, props])\n\n // all poppers hidden on ssr by default\n if (!isMounted) {\n return null\n }\n\n const frameProps = {\n ref: contentRefs,\n x: x || 0,\n y: y || 0,\n position: strategy,\n }\n\n // outer frame because we explicitly dont want animation to apply to this\n return (\n <YStack {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}>\n {contents}\n </YStack>\n )\n }\n )\n)\n\nPopperContent.displayName = CONTENT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopperArrow'\n\ntype PopperArrowElement = HTMLElement | View\n\nexport type PopperArrowProps = YStackProps & {\n offset?: number\n size?: SizeTokens\n}\n\nconst PopperArrowFrame = styled(YStack, {\n name: 'PopperArrow',\n borderColor: '$borderColor',\n backgroundColor: '$background',\n position: 'relative',\n})\n\nconst PopperArrowOuterFrame = styled(YStack, {\n name: 'PopperArrowOuter',\n position: 'absolute',\n zIndex: -1,\n pointerEvents: 'none',\n overflow: 'hidden',\n alignItems: 'center',\n justifyContent: 'center',\n})\n\nconst opposites = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n} as const\n\ntype Sides = keyof typeof opposites\n\nexport const PopperArrow = PopperArrowFrame.extractable(\n React.forwardRef<PopperArrowElement, PopperArrowProps>(function PopperArrow(\n props: ScopedProps<PopperArrowProps>,\n forwardedRef\n ) {\n const { __scopePopper, offset, size: sizeProp, borderWidth = 0, ...arrowProps } = props\n const context = usePopperContext(ARROW_NAME, __scopePopper)\n const tokens = getTokens()\n const sizeVal = sizeProp ?? context.size\n const sizeValResolved = getVariableValue(stepTokenUpOrDown(tokens.space, sizeVal, -2, [2]))\n const size = +sizeValResolved\n const { placement } = context\n const { x, y } = context.arrowStyle || { x: 0, y: 0 }\n const refs = useComposedRefs(context.arrowRef, forwardedRef)\n\n const primaryPlacement = (placement ? placement.split('-')[0] : 'top') as Sides\n\n const arrowStyle: StackProps = { x, y, width: size, height: size }\n const innerArrowStyle: StackProps = {}\n const isVertical = primaryPlacement === 'bottom' || primaryPlacement === 'top'\n\n if (primaryPlacement) {\n // allows for extra diagonal size\n arrowStyle[isVertical ? 'width' : 'height'] = size * 2\n const oppSide = opposites[primaryPlacement]\n if (oppSide) {\n arrowStyle[oppSide] = -size\n innerArrowStyle[oppSide] = size / 2\n }\n if (oppSide === 'top' || oppSide === 'bottom') {\n arrowStyle.left = 0\n }\n if (oppSide === 'left' || oppSide === 'right') {\n arrowStyle.top = 0\n }\n }\n\n // send the Arrow's offset up to Popper\n useIsomorphicLayoutEffect(() => {\n context.onArrowSize?.(size)\n }, [size, context.onArrowSize])\n\n // outer frame to cut off for ability to have nicer shadows/borders\n return (\n <PopperArrowOuterFrame ref={refs} {...arrowStyle}>\n <PopperArrowFrame\n width={size}\n height={size}\n {...arrowProps}\n {...innerArrowStyle}\n rotate=\"45deg\"\n {...(primaryPlacement === 'bottom' && {\n borderBottomWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'top' && {\n borderTopWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n {...(primaryPlacement === 'right' && {\n borderTopWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'left' && {\n borderBottomWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n />\n </PopperArrowOuterFrame>\n )\n })\n)\n\nPopperArrow.displayName = ARROW_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nexport { usePopperContext }\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["PopperArrow", "offset"]
|
|
7
7
|
}
|
package/dist/cjs/floating.js
CHANGED
package/dist/cjs/floating.js.map
CHANGED
package/dist/cjs/index.js
CHANGED
package/dist/cjs/index.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx"],
|
|
4
4
|
"sourcesContent": ["export { FloatingOverrideContext, type UseFloatingFn } from './useFloating'\nexport * from './Popper'\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAA4D;AAC5D,wBAAc,qBADd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/useFloating.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
8
8
|
var __export = (target, all) => {
|
|
9
9
|
for (var name in all)
|
|
10
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var useFloating_exports = {};
|
|
23
26
|
__export(useFloating_exports, {
|
|
@@ -28,11 +31,11 @@ module.exports = __toCommonJS(useFloating_exports);
|
|
|
28
31
|
var import_react = require("react");
|
|
29
32
|
var Floating = __toESM(require("./floating"));
|
|
30
33
|
const FloatingOverrideContext = (0, import_react.createContext)(null);
|
|
31
|
-
const useFloating =
|
|
34
|
+
const useFloating = (props) => {
|
|
32
35
|
var _a;
|
|
33
36
|
const context = (0, import_react.useContext)(FloatingOverrideContext);
|
|
34
37
|
return (_a = context || Floating.useFloating) == null ? void 0 : _a(props);
|
|
35
|
-
}
|
|
38
|
+
};
|
|
36
39
|
// Annotate the CommonJS export names for ESM import in node:
|
|
37
40
|
0 && (module.exports = {
|
|
38
41
|
FloatingOverrideContext,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/useFloating.tsx"],
|
|
4
|
-
"sourcesContent": ["import { createContext, useContext } from 'react'\n\nimport * as Floating from './floating'\n\nexport type UseFloatingFn = typeof Floating.useFloating\n\ntype UseFloatingProps = UseFloatingFn extends (props: infer Props) => any ? Props : never\n\nexport type
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { createContext, useContext } from 'react'\n\nimport * as Floating from './floating'\n\nexport type UseFloatingFn = typeof Floating.useFloating\n\ntype UseFloatingProps = UseFloatingFn extends (props: infer Props) => any ? Props : never\n\nexport type UseFloatingReturn = Floating.UseFloatingReturn & {\n context?: any\n getFloatingProps?: (props: { ref: any; [key: string]: any }) => any\n getReferenceProps?: (props: { ref: any; [key: string]: any }) => any\n}\n\nexport const FloatingOverrideContext = createContext<UseFloatingFn | null>(null)\n\nexport const useFloating = (props: UseFloatingProps): UseFloatingReturn => {\n const context = useContext(FloatingOverrideContext)\n return (context || Floating.useFloating)?.(props)\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA0C;AAE1C,eAA0B;AAYnB,MAAM,8BAA0B,4BAAoC,IAAI;AAExE,MAAM,cAAc,CAAC,UAA+C;AAhB3E;AAiBE,QAAM,cAAU,yBAAW,uBAAuB;AAClD,UAAQ,gBAAW,SAAS,gBAApB,mBAAmC;AAC7C;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|