@syntrologie/adapt-faq 2.17.0 → 2.19.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/dist/chunk-5WRI5ZAA.js +31 -0
- package/dist/chunk-5WRI5ZAA.js.map +7 -0
- package/dist/chunk-S6WIENQP.js +578 -0
- package/dist/chunk-S6WIENQP.js.map +7 -0
- package/dist/editor.d.ts +8 -2
- package/dist/editor.d.ts.map +1 -1
- package/dist/editor.js +4695 -59
- package/dist/editor.js.map +4 -4
- package/dist/runtime.js +6 -404
- package/dist/runtime.js.map +3 -3
- package/dist/schema.d.ts +316 -316
- package/dist/schema.d.ts.map +1 -1
- package/dist/schema.js +2 -0
- package/dist/schema.js.map +1 -1
- package/dist/types.d.ts +19 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/editor.js
CHANGED
|
@@ -1,5 +1,4449 @@
|
|
|
1
|
+
import {
|
|
2
|
+
backdropBlur,
|
|
3
|
+
colors,
|
|
4
|
+
colors_default,
|
|
5
|
+
elevationShadows,
|
|
6
|
+
focusRings,
|
|
7
|
+
glowShadows,
|
|
8
|
+
overlay,
|
|
9
|
+
panel_shell_default,
|
|
10
|
+
shadows
|
|
11
|
+
} from "./chunk-S6WIENQP.js";
|
|
12
|
+
import {
|
|
13
|
+
__commonJS,
|
|
14
|
+
__toESM
|
|
15
|
+
} from "./chunk-5WRI5ZAA.js";
|
|
16
|
+
|
|
17
|
+
// ../../../node_modules/react/cjs/react.development.js
|
|
18
|
+
var require_react_development = __commonJS({
|
|
19
|
+
"../../../node_modules/react/cjs/react.development.js"(exports, module) {
|
|
20
|
+
"use strict";
|
|
21
|
+
(function() {
|
|
22
|
+
function defineDeprecationWarning(methodName, info) {
|
|
23
|
+
Object.defineProperty(Component.prototype, methodName, {
|
|
24
|
+
get: function() {
|
|
25
|
+
console.warn(
|
|
26
|
+
"%s(...) is deprecated in plain JavaScript React classes. %s",
|
|
27
|
+
info[0],
|
|
28
|
+
info[1]
|
|
29
|
+
);
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
function getIteratorFn(maybeIterable) {
|
|
34
|
+
if (null === maybeIterable || "object" !== typeof maybeIterable)
|
|
35
|
+
return null;
|
|
36
|
+
maybeIterable = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable["@@iterator"];
|
|
37
|
+
return "function" === typeof maybeIterable ? maybeIterable : null;
|
|
38
|
+
}
|
|
39
|
+
function warnNoop(publicInstance, callerName) {
|
|
40
|
+
publicInstance = (publicInstance = publicInstance.constructor) && (publicInstance.displayName || publicInstance.name) || "ReactClass";
|
|
41
|
+
var warningKey = publicInstance + "." + callerName;
|
|
42
|
+
didWarnStateUpdateForUnmountedComponent[warningKey] || (console.error(
|
|
43
|
+
"Can't call %s on a component that is not yet mounted. This is a no-op, but it might indicate a bug in your application. Instead, assign to `this.state` directly or define a `state = {};` class property with the desired state in the %s component.",
|
|
44
|
+
callerName,
|
|
45
|
+
publicInstance
|
|
46
|
+
), didWarnStateUpdateForUnmountedComponent[warningKey] = true);
|
|
47
|
+
}
|
|
48
|
+
function Component(props, context, updater) {
|
|
49
|
+
this.props = props;
|
|
50
|
+
this.context = context;
|
|
51
|
+
this.refs = emptyObject;
|
|
52
|
+
this.updater = updater || ReactNoopUpdateQueue;
|
|
53
|
+
}
|
|
54
|
+
function ComponentDummy() {
|
|
55
|
+
}
|
|
56
|
+
function PureComponent(props, context, updater) {
|
|
57
|
+
this.props = props;
|
|
58
|
+
this.context = context;
|
|
59
|
+
this.refs = emptyObject;
|
|
60
|
+
this.updater = updater || ReactNoopUpdateQueue;
|
|
61
|
+
}
|
|
62
|
+
function noop() {
|
|
63
|
+
}
|
|
64
|
+
function testStringCoercion(value) {
|
|
65
|
+
return "" + value;
|
|
66
|
+
}
|
|
67
|
+
function checkKeyStringCoercion(value) {
|
|
68
|
+
try {
|
|
69
|
+
testStringCoercion(value);
|
|
70
|
+
var JSCompiler_inline_result = false;
|
|
71
|
+
} catch (e) {
|
|
72
|
+
JSCompiler_inline_result = true;
|
|
73
|
+
}
|
|
74
|
+
if (JSCompiler_inline_result) {
|
|
75
|
+
JSCompiler_inline_result = console;
|
|
76
|
+
var JSCompiler_temp_const = JSCompiler_inline_result.error;
|
|
77
|
+
var JSCompiler_inline_result$jscomp$0 = "function" === typeof Symbol && Symbol.toStringTag && value[Symbol.toStringTag] || value.constructor.name || "Object";
|
|
78
|
+
JSCompiler_temp_const.call(
|
|
79
|
+
JSCompiler_inline_result,
|
|
80
|
+
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
|
|
81
|
+
JSCompiler_inline_result$jscomp$0
|
|
82
|
+
);
|
|
83
|
+
return testStringCoercion(value);
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
function getComponentNameFromType(type) {
|
|
87
|
+
if (null == type) return null;
|
|
88
|
+
if ("function" === typeof type)
|
|
89
|
+
return type.$$typeof === REACT_CLIENT_REFERENCE ? null : type.displayName || type.name || null;
|
|
90
|
+
if ("string" === typeof type) return type;
|
|
91
|
+
switch (type) {
|
|
92
|
+
case REACT_FRAGMENT_TYPE:
|
|
93
|
+
return "Fragment";
|
|
94
|
+
case REACT_PROFILER_TYPE:
|
|
95
|
+
return "Profiler";
|
|
96
|
+
case REACT_STRICT_MODE_TYPE:
|
|
97
|
+
return "StrictMode";
|
|
98
|
+
case REACT_SUSPENSE_TYPE:
|
|
99
|
+
return "Suspense";
|
|
100
|
+
case REACT_SUSPENSE_LIST_TYPE:
|
|
101
|
+
return "SuspenseList";
|
|
102
|
+
case REACT_ACTIVITY_TYPE:
|
|
103
|
+
return "Activity";
|
|
104
|
+
}
|
|
105
|
+
if ("object" === typeof type)
|
|
106
|
+
switch ("number" === typeof type.tag && console.error(
|
|
107
|
+
"Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
|
|
108
|
+
), type.$$typeof) {
|
|
109
|
+
case REACT_PORTAL_TYPE:
|
|
110
|
+
return "Portal";
|
|
111
|
+
case REACT_CONTEXT_TYPE:
|
|
112
|
+
return type.displayName || "Context";
|
|
113
|
+
case REACT_CONSUMER_TYPE:
|
|
114
|
+
return (type._context.displayName || "Context") + ".Consumer";
|
|
115
|
+
case REACT_FORWARD_REF_TYPE:
|
|
116
|
+
var innerType = type.render;
|
|
117
|
+
type = type.displayName;
|
|
118
|
+
type || (type = innerType.displayName || innerType.name || "", type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef");
|
|
119
|
+
return type;
|
|
120
|
+
case REACT_MEMO_TYPE:
|
|
121
|
+
return innerType = type.displayName || null, null !== innerType ? innerType : getComponentNameFromType(type.type) || "Memo";
|
|
122
|
+
case REACT_LAZY_TYPE:
|
|
123
|
+
innerType = type._payload;
|
|
124
|
+
type = type._init;
|
|
125
|
+
try {
|
|
126
|
+
return getComponentNameFromType(type(innerType));
|
|
127
|
+
} catch (x) {
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
return null;
|
|
131
|
+
}
|
|
132
|
+
function getTaskName(type) {
|
|
133
|
+
if (type === REACT_FRAGMENT_TYPE) return "<>";
|
|
134
|
+
if ("object" === typeof type && null !== type && type.$$typeof === REACT_LAZY_TYPE)
|
|
135
|
+
return "<...>";
|
|
136
|
+
try {
|
|
137
|
+
var name = getComponentNameFromType(type);
|
|
138
|
+
return name ? "<" + name + ">" : "<...>";
|
|
139
|
+
} catch (x) {
|
|
140
|
+
return "<...>";
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
function getOwner() {
|
|
144
|
+
var dispatcher = ReactSharedInternals.A;
|
|
145
|
+
return null === dispatcher ? null : dispatcher.getOwner();
|
|
146
|
+
}
|
|
147
|
+
function UnknownOwner() {
|
|
148
|
+
return Error("react-stack-top-frame");
|
|
149
|
+
}
|
|
150
|
+
function hasValidKey(config) {
|
|
151
|
+
if (hasOwnProperty.call(config, "key")) {
|
|
152
|
+
var getter = Object.getOwnPropertyDescriptor(config, "key").get;
|
|
153
|
+
if (getter && getter.isReactWarning) return false;
|
|
154
|
+
}
|
|
155
|
+
return void 0 !== config.key;
|
|
156
|
+
}
|
|
157
|
+
function defineKeyPropWarningGetter(props, displayName) {
|
|
158
|
+
function warnAboutAccessingKey() {
|
|
159
|
+
specialPropKeyWarningShown || (specialPropKeyWarningShown = true, console.error(
|
|
160
|
+
"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
|
|
161
|
+
displayName
|
|
162
|
+
));
|
|
163
|
+
}
|
|
164
|
+
warnAboutAccessingKey.isReactWarning = true;
|
|
165
|
+
Object.defineProperty(props, "key", {
|
|
166
|
+
get: warnAboutAccessingKey,
|
|
167
|
+
configurable: true
|
|
168
|
+
});
|
|
169
|
+
}
|
|
170
|
+
function elementRefGetterWithDeprecationWarning() {
|
|
171
|
+
var componentName = getComponentNameFromType(this.type);
|
|
172
|
+
didWarnAboutElementRef[componentName] || (didWarnAboutElementRef[componentName] = true, console.error(
|
|
173
|
+
"Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
|
|
174
|
+
));
|
|
175
|
+
componentName = this.props.ref;
|
|
176
|
+
return void 0 !== componentName ? componentName : null;
|
|
177
|
+
}
|
|
178
|
+
function ReactElement(type, key, props, owner, debugStack, debugTask) {
|
|
179
|
+
var refProp = props.ref;
|
|
180
|
+
type = {
|
|
181
|
+
$$typeof: REACT_ELEMENT_TYPE,
|
|
182
|
+
type,
|
|
183
|
+
key,
|
|
184
|
+
props,
|
|
185
|
+
_owner: owner
|
|
186
|
+
};
|
|
187
|
+
null !== (void 0 !== refProp ? refProp : null) ? Object.defineProperty(type, "ref", {
|
|
188
|
+
enumerable: false,
|
|
189
|
+
get: elementRefGetterWithDeprecationWarning
|
|
190
|
+
}) : Object.defineProperty(type, "ref", { enumerable: false, value: null });
|
|
191
|
+
type._store = {};
|
|
192
|
+
Object.defineProperty(type._store, "validated", {
|
|
193
|
+
configurable: false,
|
|
194
|
+
enumerable: false,
|
|
195
|
+
writable: true,
|
|
196
|
+
value: 0
|
|
197
|
+
});
|
|
198
|
+
Object.defineProperty(type, "_debugInfo", {
|
|
199
|
+
configurable: false,
|
|
200
|
+
enumerable: false,
|
|
201
|
+
writable: true,
|
|
202
|
+
value: null
|
|
203
|
+
});
|
|
204
|
+
Object.defineProperty(type, "_debugStack", {
|
|
205
|
+
configurable: false,
|
|
206
|
+
enumerable: false,
|
|
207
|
+
writable: true,
|
|
208
|
+
value: debugStack
|
|
209
|
+
});
|
|
210
|
+
Object.defineProperty(type, "_debugTask", {
|
|
211
|
+
configurable: false,
|
|
212
|
+
enumerable: false,
|
|
213
|
+
writable: true,
|
|
214
|
+
value: debugTask
|
|
215
|
+
});
|
|
216
|
+
Object.freeze && (Object.freeze(type.props), Object.freeze(type));
|
|
217
|
+
return type;
|
|
218
|
+
}
|
|
219
|
+
function cloneAndReplaceKey(oldElement, newKey) {
|
|
220
|
+
newKey = ReactElement(
|
|
221
|
+
oldElement.type,
|
|
222
|
+
newKey,
|
|
223
|
+
oldElement.props,
|
|
224
|
+
oldElement._owner,
|
|
225
|
+
oldElement._debugStack,
|
|
226
|
+
oldElement._debugTask
|
|
227
|
+
);
|
|
228
|
+
oldElement._store && (newKey._store.validated = oldElement._store.validated);
|
|
229
|
+
return newKey;
|
|
230
|
+
}
|
|
231
|
+
function validateChildKeys(node) {
|
|
232
|
+
isValidElement(node) ? node._store && (node._store.validated = 1) : "object" === typeof node && null !== node && node.$$typeof === REACT_LAZY_TYPE && ("fulfilled" === node._payload.status ? isValidElement(node._payload.value) && node._payload.value._store && (node._payload.value._store.validated = 1) : node._store && (node._store.validated = 1));
|
|
233
|
+
}
|
|
234
|
+
function isValidElement(object) {
|
|
235
|
+
return "object" === typeof object && null !== object && object.$$typeof === REACT_ELEMENT_TYPE;
|
|
236
|
+
}
|
|
237
|
+
function escape2(key) {
|
|
238
|
+
var escaperLookup = { "=": "=0", ":": "=2" };
|
|
239
|
+
return "$" + key.replace(/[=:]/g, function(match) {
|
|
240
|
+
return escaperLookup[match];
|
|
241
|
+
});
|
|
242
|
+
}
|
|
243
|
+
function getElementKey(element, index) {
|
|
244
|
+
return "object" === typeof element && null !== element && null != element.key ? (checkKeyStringCoercion(element.key), escape2("" + element.key)) : index.toString(36);
|
|
245
|
+
}
|
|
246
|
+
function resolveThenable(thenable) {
|
|
247
|
+
switch (thenable.status) {
|
|
248
|
+
case "fulfilled":
|
|
249
|
+
return thenable.value;
|
|
250
|
+
case "rejected":
|
|
251
|
+
throw thenable.reason;
|
|
252
|
+
default:
|
|
253
|
+
switch ("string" === typeof thenable.status ? thenable.then(noop, noop) : (thenable.status = "pending", thenable.then(
|
|
254
|
+
function(fulfilledValue) {
|
|
255
|
+
"pending" === thenable.status && (thenable.status = "fulfilled", thenable.value = fulfilledValue);
|
|
256
|
+
},
|
|
257
|
+
function(error) {
|
|
258
|
+
"pending" === thenable.status && (thenable.status = "rejected", thenable.reason = error);
|
|
259
|
+
}
|
|
260
|
+
)), thenable.status) {
|
|
261
|
+
case "fulfilled":
|
|
262
|
+
return thenable.value;
|
|
263
|
+
case "rejected":
|
|
264
|
+
throw thenable.reason;
|
|
265
|
+
}
|
|
266
|
+
}
|
|
267
|
+
throw thenable;
|
|
268
|
+
}
|
|
269
|
+
function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
|
|
270
|
+
var type = typeof children;
|
|
271
|
+
if ("undefined" === type || "boolean" === type) children = null;
|
|
272
|
+
var invokeCallback = false;
|
|
273
|
+
if (null === children) invokeCallback = true;
|
|
274
|
+
else
|
|
275
|
+
switch (type) {
|
|
276
|
+
case "bigint":
|
|
277
|
+
case "string":
|
|
278
|
+
case "number":
|
|
279
|
+
invokeCallback = true;
|
|
280
|
+
break;
|
|
281
|
+
case "object":
|
|
282
|
+
switch (children.$$typeof) {
|
|
283
|
+
case REACT_ELEMENT_TYPE:
|
|
284
|
+
case REACT_PORTAL_TYPE:
|
|
285
|
+
invokeCallback = true;
|
|
286
|
+
break;
|
|
287
|
+
case REACT_LAZY_TYPE:
|
|
288
|
+
return invokeCallback = children._init, mapIntoArray(
|
|
289
|
+
invokeCallback(children._payload),
|
|
290
|
+
array,
|
|
291
|
+
escapedPrefix,
|
|
292
|
+
nameSoFar,
|
|
293
|
+
callback
|
|
294
|
+
);
|
|
295
|
+
}
|
|
296
|
+
}
|
|
297
|
+
if (invokeCallback) {
|
|
298
|
+
invokeCallback = children;
|
|
299
|
+
callback = callback(invokeCallback);
|
|
300
|
+
var childKey = "" === nameSoFar ? "." + getElementKey(invokeCallback, 0) : nameSoFar;
|
|
301
|
+
isArrayImpl(callback) ? (escapedPrefix = "", null != childKey && (escapedPrefix = childKey.replace(userProvidedKeyEscapeRegex, "$&/") + "/"), mapIntoArray(callback, array, escapedPrefix, "", function(c) {
|
|
302
|
+
return c;
|
|
303
|
+
})) : null != callback && (isValidElement(callback) && (null != callback.key && (invokeCallback && invokeCallback.key === callback.key || checkKeyStringCoercion(callback.key)), escapedPrefix = cloneAndReplaceKey(
|
|
304
|
+
callback,
|
|
305
|
+
escapedPrefix + (null == callback.key || invokeCallback && invokeCallback.key === callback.key ? "" : ("" + callback.key).replace(
|
|
306
|
+
userProvidedKeyEscapeRegex,
|
|
307
|
+
"$&/"
|
|
308
|
+
) + "/") + childKey
|
|
309
|
+
), "" !== nameSoFar && null != invokeCallback && isValidElement(invokeCallback) && null == invokeCallback.key && invokeCallback._store && !invokeCallback._store.validated && (escapedPrefix._store.validated = 2), callback = escapedPrefix), array.push(callback));
|
|
310
|
+
return 1;
|
|
311
|
+
}
|
|
312
|
+
invokeCallback = 0;
|
|
313
|
+
childKey = "" === nameSoFar ? "." : nameSoFar + ":";
|
|
314
|
+
if (isArrayImpl(children))
|
|
315
|
+
for (var i = 0; i < children.length; i++)
|
|
316
|
+
nameSoFar = children[i], type = childKey + getElementKey(nameSoFar, i), invokeCallback += mapIntoArray(
|
|
317
|
+
nameSoFar,
|
|
318
|
+
array,
|
|
319
|
+
escapedPrefix,
|
|
320
|
+
type,
|
|
321
|
+
callback
|
|
322
|
+
);
|
|
323
|
+
else if (i = getIteratorFn(children), "function" === typeof i)
|
|
324
|
+
for (i === children.entries && (didWarnAboutMaps || console.warn(
|
|
325
|
+
"Using Maps as children is not supported. Use an array of keyed ReactElements instead."
|
|
326
|
+
), didWarnAboutMaps = true), children = i.call(children), i = 0; !(nameSoFar = children.next()).done; )
|
|
327
|
+
nameSoFar = nameSoFar.value, type = childKey + getElementKey(nameSoFar, i++), invokeCallback += mapIntoArray(
|
|
328
|
+
nameSoFar,
|
|
329
|
+
array,
|
|
330
|
+
escapedPrefix,
|
|
331
|
+
type,
|
|
332
|
+
callback
|
|
333
|
+
);
|
|
334
|
+
else if ("object" === type) {
|
|
335
|
+
if ("function" === typeof children.then)
|
|
336
|
+
return mapIntoArray(
|
|
337
|
+
resolveThenable(children),
|
|
338
|
+
array,
|
|
339
|
+
escapedPrefix,
|
|
340
|
+
nameSoFar,
|
|
341
|
+
callback
|
|
342
|
+
);
|
|
343
|
+
array = String(children);
|
|
344
|
+
throw Error(
|
|
345
|
+
"Objects are not valid as a React child (found: " + ("[object Object]" === array ? "object with keys {" + Object.keys(children).join(", ") + "}" : array) + "). If you meant to render a collection of children, use an array instead."
|
|
346
|
+
);
|
|
347
|
+
}
|
|
348
|
+
return invokeCallback;
|
|
349
|
+
}
|
|
350
|
+
function mapChildren(children, func, context) {
|
|
351
|
+
if (null == children) return children;
|
|
352
|
+
var result = [], count = 0;
|
|
353
|
+
mapIntoArray(children, result, "", "", function(child) {
|
|
354
|
+
return func.call(context, child, count++);
|
|
355
|
+
});
|
|
356
|
+
return result;
|
|
357
|
+
}
|
|
358
|
+
function lazyInitializer(payload) {
|
|
359
|
+
if (-1 === payload._status) {
|
|
360
|
+
var ioInfo = payload._ioInfo;
|
|
361
|
+
null != ioInfo && (ioInfo.start = ioInfo.end = performance.now());
|
|
362
|
+
ioInfo = payload._result;
|
|
363
|
+
var thenable = ioInfo();
|
|
364
|
+
thenable.then(
|
|
365
|
+
function(moduleObject) {
|
|
366
|
+
if (0 === payload._status || -1 === payload._status) {
|
|
367
|
+
payload._status = 1;
|
|
368
|
+
payload._result = moduleObject;
|
|
369
|
+
var _ioInfo = payload._ioInfo;
|
|
370
|
+
null != _ioInfo && (_ioInfo.end = performance.now());
|
|
371
|
+
void 0 === thenable.status && (thenable.status = "fulfilled", thenable.value = moduleObject);
|
|
372
|
+
}
|
|
373
|
+
},
|
|
374
|
+
function(error) {
|
|
375
|
+
if (0 === payload._status || -1 === payload._status) {
|
|
376
|
+
payload._status = 2;
|
|
377
|
+
payload._result = error;
|
|
378
|
+
var _ioInfo2 = payload._ioInfo;
|
|
379
|
+
null != _ioInfo2 && (_ioInfo2.end = performance.now());
|
|
380
|
+
void 0 === thenable.status && (thenable.status = "rejected", thenable.reason = error);
|
|
381
|
+
}
|
|
382
|
+
}
|
|
383
|
+
);
|
|
384
|
+
ioInfo = payload._ioInfo;
|
|
385
|
+
if (null != ioInfo) {
|
|
386
|
+
ioInfo.value = thenable;
|
|
387
|
+
var displayName = thenable.displayName;
|
|
388
|
+
"string" === typeof displayName && (ioInfo.name = displayName);
|
|
389
|
+
}
|
|
390
|
+
-1 === payload._status && (payload._status = 0, payload._result = thenable);
|
|
391
|
+
}
|
|
392
|
+
if (1 === payload._status)
|
|
393
|
+
return ioInfo = payload._result, void 0 === ioInfo && console.error(
|
|
394
|
+
"lazy: Expected the result of a dynamic import() call. Instead received: %s\n\nYour code should look like: \n const MyComponent = lazy(() => import('./MyComponent'))\n\nDid you accidentally put curly braces around the import?",
|
|
395
|
+
ioInfo
|
|
396
|
+
), "default" in ioInfo || console.error(
|
|
397
|
+
"lazy: Expected the result of a dynamic import() call. Instead received: %s\n\nYour code should look like: \n const MyComponent = lazy(() => import('./MyComponent'))",
|
|
398
|
+
ioInfo
|
|
399
|
+
), ioInfo.default;
|
|
400
|
+
throw payload._result;
|
|
401
|
+
}
|
|
402
|
+
function resolveDispatcher() {
|
|
403
|
+
var dispatcher = ReactSharedInternals.H;
|
|
404
|
+
null === dispatcher && console.error(
|
|
405
|
+
"Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:\n1. You might have mismatching versions of React and the renderer (such as React DOM)\n2. You might be breaking the Rules of Hooks\n3. You might have more than one copy of React in the same app\nSee https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem."
|
|
406
|
+
);
|
|
407
|
+
return dispatcher;
|
|
408
|
+
}
|
|
409
|
+
function releaseAsyncTransition() {
|
|
410
|
+
ReactSharedInternals.asyncTransitions--;
|
|
411
|
+
}
|
|
412
|
+
function enqueueTask(task) {
|
|
413
|
+
if (null === enqueueTaskImpl)
|
|
414
|
+
try {
|
|
415
|
+
var requireString = ("require" + Math.random()).slice(0, 7);
|
|
416
|
+
enqueueTaskImpl = (module && module[requireString]).call(
|
|
417
|
+
module,
|
|
418
|
+
"timers"
|
|
419
|
+
).setImmediate;
|
|
420
|
+
} catch (_err) {
|
|
421
|
+
enqueueTaskImpl = function(callback) {
|
|
422
|
+
false === didWarnAboutMessageChannel && (didWarnAboutMessageChannel = true, "undefined" === typeof MessageChannel && console.error(
|
|
423
|
+
"This browser does not have a MessageChannel implementation, so enqueuing tasks via await act(async () => ...) will fail. Please file an issue at https://github.com/facebook/react/issues if you encounter this warning."
|
|
424
|
+
));
|
|
425
|
+
var channel = new MessageChannel();
|
|
426
|
+
channel.port1.onmessage = callback;
|
|
427
|
+
channel.port2.postMessage(void 0);
|
|
428
|
+
};
|
|
429
|
+
}
|
|
430
|
+
return enqueueTaskImpl(task);
|
|
431
|
+
}
|
|
432
|
+
function aggregateErrors(errors) {
|
|
433
|
+
return 1 < errors.length && "function" === typeof AggregateError ? new AggregateError(errors) : errors[0];
|
|
434
|
+
}
|
|
435
|
+
function popActScope(prevActQueue, prevActScopeDepth) {
|
|
436
|
+
prevActScopeDepth !== actScopeDepth - 1 && console.error(
|
|
437
|
+
"You seem to have overlapping act() calls, this is not supported. Be sure to await previous act() calls before making a new one. "
|
|
438
|
+
);
|
|
439
|
+
actScopeDepth = prevActScopeDepth;
|
|
440
|
+
}
|
|
441
|
+
function recursivelyFlushAsyncActWork(returnValue, resolve, reject) {
|
|
442
|
+
var queue = ReactSharedInternals.actQueue;
|
|
443
|
+
if (null !== queue)
|
|
444
|
+
if (0 !== queue.length)
|
|
445
|
+
try {
|
|
446
|
+
flushActQueue(queue);
|
|
447
|
+
enqueueTask(function() {
|
|
448
|
+
return recursivelyFlushAsyncActWork(returnValue, resolve, reject);
|
|
449
|
+
});
|
|
450
|
+
return;
|
|
451
|
+
} catch (error) {
|
|
452
|
+
ReactSharedInternals.thrownErrors.push(error);
|
|
453
|
+
}
|
|
454
|
+
else ReactSharedInternals.actQueue = null;
|
|
455
|
+
0 < ReactSharedInternals.thrownErrors.length ? (queue = aggregateErrors(ReactSharedInternals.thrownErrors), ReactSharedInternals.thrownErrors.length = 0, reject(queue)) : resolve(returnValue);
|
|
456
|
+
}
|
|
457
|
+
function flushActQueue(queue) {
|
|
458
|
+
if (!isFlushing) {
|
|
459
|
+
isFlushing = true;
|
|
460
|
+
var i = 0;
|
|
461
|
+
try {
|
|
462
|
+
for (; i < queue.length; i++) {
|
|
463
|
+
var callback = queue[i];
|
|
464
|
+
do {
|
|
465
|
+
ReactSharedInternals.didUsePromise = false;
|
|
466
|
+
var continuation = callback(false);
|
|
467
|
+
if (null !== continuation) {
|
|
468
|
+
if (ReactSharedInternals.didUsePromise) {
|
|
469
|
+
queue[i] = callback;
|
|
470
|
+
queue.splice(0, i);
|
|
471
|
+
return;
|
|
472
|
+
}
|
|
473
|
+
callback = continuation;
|
|
474
|
+
} else break;
|
|
475
|
+
} while (1);
|
|
476
|
+
}
|
|
477
|
+
queue.length = 0;
|
|
478
|
+
} catch (error) {
|
|
479
|
+
queue.splice(0, i + 1), ReactSharedInternals.thrownErrors.push(error);
|
|
480
|
+
} finally {
|
|
481
|
+
isFlushing = false;
|
|
482
|
+
}
|
|
483
|
+
}
|
|
484
|
+
}
|
|
485
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
|
|
486
|
+
var REACT_ELEMENT_TYPE = /* @__PURE__ */ Symbol.for("react.transitional.element"), REACT_PORTAL_TYPE = /* @__PURE__ */ Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = /* @__PURE__ */ Symbol.for("react.fragment"), REACT_STRICT_MODE_TYPE = /* @__PURE__ */ Symbol.for("react.strict_mode"), REACT_PROFILER_TYPE = /* @__PURE__ */ Symbol.for("react.profiler"), REACT_CONSUMER_TYPE = /* @__PURE__ */ Symbol.for("react.consumer"), REACT_CONTEXT_TYPE = /* @__PURE__ */ Symbol.for("react.context"), REACT_FORWARD_REF_TYPE = /* @__PURE__ */ Symbol.for("react.forward_ref"), REACT_SUSPENSE_TYPE = /* @__PURE__ */ Symbol.for("react.suspense"), REACT_SUSPENSE_LIST_TYPE = /* @__PURE__ */ Symbol.for("react.suspense_list"), REACT_MEMO_TYPE = /* @__PURE__ */ Symbol.for("react.memo"), REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy"), REACT_ACTIVITY_TYPE = /* @__PURE__ */ Symbol.for("react.activity"), MAYBE_ITERATOR_SYMBOL = Symbol.iterator, didWarnStateUpdateForUnmountedComponent = {}, ReactNoopUpdateQueue = {
|
|
487
|
+
isMounted: function() {
|
|
488
|
+
return false;
|
|
489
|
+
},
|
|
490
|
+
enqueueForceUpdate: function(publicInstance) {
|
|
491
|
+
warnNoop(publicInstance, "forceUpdate");
|
|
492
|
+
},
|
|
493
|
+
enqueueReplaceState: function(publicInstance) {
|
|
494
|
+
warnNoop(publicInstance, "replaceState");
|
|
495
|
+
},
|
|
496
|
+
enqueueSetState: function(publicInstance) {
|
|
497
|
+
warnNoop(publicInstance, "setState");
|
|
498
|
+
}
|
|
499
|
+
}, assign = Object.assign, emptyObject = {};
|
|
500
|
+
Object.freeze(emptyObject);
|
|
501
|
+
Component.prototype.isReactComponent = {};
|
|
502
|
+
Component.prototype.setState = function(partialState, callback) {
|
|
503
|
+
if ("object" !== typeof partialState && "function" !== typeof partialState && null != partialState)
|
|
504
|
+
throw Error(
|
|
505
|
+
"takes an object of state variables to update or a function which returns an object of state variables."
|
|
506
|
+
);
|
|
507
|
+
this.updater.enqueueSetState(this, partialState, callback, "setState");
|
|
508
|
+
};
|
|
509
|
+
Component.prototype.forceUpdate = function(callback) {
|
|
510
|
+
this.updater.enqueueForceUpdate(this, callback, "forceUpdate");
|
|
511
|
+
};
|
|
512
|
+
var deprecatedAPIs = {
|
|
513
|
+
isMounted: [
|
|
514
|
+
"isMounted",
|
|
515
|
+
"Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks."
|
|
516
|
+
],
|
|
517
|
+
replaceState: [
|
|
518
|
+
"replaceState",
|
|
519
|
+
"Refactor your code to use setState instead (see https://github.com/facebook/react/issues/3236)."
|
|
520
|
+
]
|
|
521
|
+
};
|
|
522
|
+
for (fnName in deprecatedAPIs)
|
|
523
|
+
deprecatedAPIs.hasOwnProperty(fnName) && defineDeprecationWarning(fnName, deprecatedAPIs[fnName]);
|
|
524
|
+
ComponentDummy.prototype = Component.prototype;
|
|
525
|
+
deprecatedAPIs = PureComponent.prototype = new ComponentDummy();
|
|
526
|
+
deprecatedAPIs.constructor = PureComponent;
|
|
527
|
+
assign(deprecatedAPIs, Component.prototype);
|
|
528
|
+
deprecatedAPIs.isPureReactComponent = true;
|
|
529
|
+
var isArrayImpl = Array.isArray, REACT_CLIENT_REFERENCE = /* @__PURE__ */ Symbol.for("react.client.reference"), ReactSharedInternals = {
|
|
530
|
+
H: null,
|
|
531
|
+
A: null,
|
|
532
|
+
T: null,
|
|
533
|
+
S: null,
|
|
534
|
+
actQueue: null,
|
|
535
|
+
asyncTransitions: 0,
|
|
536
|
+
isBatchingLegacy: false,
|
|
537
|
+
didScheduleLegacyUpdate: false,
|
|
538
|
+
didUsePromise: false,
|
|
539
|
+
thrownErrors: [],
|
|
540
|
+
getCurrentStack: null,
|
|
541
|
+
recentlyCreatedOwnerStacks: 0
|
|
542
|
+
}, hasOwnProperty = Object.prototype.hasOwnProperty, createTask = console.createTask ? console.createTask : function() {
|
|
543
|
+
return null;
|
|
544
|
+
};
|
|
545
|
+
deprecatedAPIs = {
|
|
546
|
+
react_stack_bottom_frame: function(callStackForError) {
|
|
547
|
+
return callStackForError();
|
|
548
|
+
}
|
|
549
|
+
};
|
|
550
|
+
var specialPropKeyWarningShown, didWarnAboutOldJSXRuntime;
|
|
551
|
+
var didWarnAboutElementRef = {};
|
|
552
|
+
var unknownOwnerDebugStack = deprecatedAPIs.react_stack_bottom_frame.bind(
|
|
553
|
+
deprecatedAPIs,
|
|
554
|
+
UnknownOwner
|
|
555
|
+
)();
|
|
556
|
+
var unknownOwnerDebugTask = createTask(getTaskName(UnknownOwner));
|
|
557
|
+
var didWarnAboutMaps = false, userProvidedKeyEscapeRegex = /\/+/g, reportGlobalError = "function" === typeof reportError ? reportError : function(error) {
|
|
558
|
+
if ("object" === typeof window && "function" === typeof window.ErrorEvent) {
|
|
559
|
+
var event = new window.ErrorEvent("error", {
|
|
560
|
+
bubbles: true,
|
|
561
|
+
cancelable: true,
|
|
562
|
+
message: "object" === typeof error && null !== error && "string" === typeof error.message ? String(error.message) : String(error),
|
|
563
|
+
error
|
|
564
|
+
});
|
|
565
|
+
if (!window.dispatchEvent(event)) return;
|
|
566
|
+
} else if ("object" === typeof process && "function" === typeof process.emit) {
|
|
567
|
+
process.emit("uncaughtException", error);
|
|
568
|
+
return;
|
|
569
|
+
}
|
|
570
|
+
console.error(error);
|
|
571
|
+
}, didWarnAboutMessageChannel = false, enqueueTaskImpl = null, actScopeDepth = 0, didWarnNoAwaitAct = false, isFlushing = false, queueSeveralMicrotasks = "function" === typeof queueMicrotask ? function(callback) {
|
|
572
|
+
queueMicrotask(function() {
|
|
573
|
+
return queueMicrotask(callback);
|
|
574
|
+
});
|
|
575
|
+
} : enqueueTask;
|
|
576
|
+
deprecatedAPIs = Object.freeze({
|
|
577
|
+
__proto__: null,
|
|
578
|
+
c: function(size) {
|
|
579
|
+
return resolveDispatcher().useMemoCache(size);
|
|
580
|
+
}
|
|
581
|
+
});
|
|
582
|
+
var fnName = {
|
|
583
|
+
map: mapChildren,
|
|
584
|
+
forEach: function(children, forEachFunc, forEachContext) {
|
|
585
|
+
mapChildren(
|
|
586
|
+
children,
|
|
587
|
+
function() {
|
|
588
|
+
forEachFunc.apply(this, arguments);
|
|
589
|
+
},
|
|
590
|
+
forEachContext
|
|
591
|
+
);
|
|
592
|
+
},
|
|
593
|
+
count: function(children) {
|
|
594
|
+
var n = 0;
|
|
595
|
+
mapChildren(children, function() {
|
|
596
|
+
n++;
|
|
597
|
+
});
|
|
598
|
+
return n;
|
|
599
|
+
},
|
|
600
|
+
toArray: function(children) {
|
|
601
|
+
return mapChildren(children, function(child) {
|
|
602
|
+
return child;
|
|
603
|
+
}) || [];
|
|
604
|
+
},
|
|
605
|
+
only: function(children) {
|
|
606
|
+
if (!isValidElement(children))
|
|
607
|
+
throw Error(
|
|
608
|
+
"React.Children.only expected to receive a single React element child."
|
|
609
|
+
);
|
|
610
|
+
return children;
|
|
611
|
+
}
|
|
612
|
+
};
|
|
613
|
+
exports.Activity = REACT_ACTIVITY_TYPE;
|
|
614
|
+
exports.Children = fnName;
|
|
615
|
+
exports.Component = Component;
|
|
616
|
+
exports.Fragment = REACT_FRAGMENT_TYPE;
|
|
617
|
+
exports.Profiler = REACT_PROFILER_TYPE;
|
|
618
|
+
exports.PureComponent = PureComponent;
|
|
619
|
+
exports.StrictMode = REACT_STRICT_MODE_TYPE;
|
|
620
|
+
exports.Suspense = REACT_SUSPENSE_TYPE;
|
|
621
|
+
exports.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE = ReactSharedInternals;
|
|
622
|
+
exports.__COMPILER_RUNTIME = deprecatedAPIs;
|
|
623
|
+
exports.act = function(callback) {
|
|
624
|
+
var prevActQueue = ReactSharedInternals.actQueue, prevActScopeDepth = actScopeDepth;
|
|
625
|
+
actScopeDepth++;
|
|
626
|
+
var queue = ReactSharedInternals.actQueue = null !== prevActQueue ? prevActQueue : [], didAwaitActCall = false;
|
|
627
|
+
try {
|
|
628
|
+
var result = callback();
|
|
629
|
+
} catch (error) {
|
|
630
|
+
ReactSharedInternals.thrownErrors.push(error);
|
|
631
|
+
}
|
|
632
|
+
if (0 < ReactSharedInternals.thrownErrors.length)
|
|
633
|
+
throw popActScope(prevActQueue, prevActScopeDepth), callback = aggregateErrors(ReactSharedInternals.thrownErrors), ReactSharedInternals.thrownErrors.length = 0, callback;
|
|
634
|
+
if (null !== result && "object" === typeof result && "function" === typeof result.then) {
|
|
635
|
+
var thenable = result;
|
|
636
|
+
queueSeveralMicrotasks(function() {
|
|
637
|
+
didAwaitActCall || didWarnNoAwaitAct || (didWarnNoAwaitAct = true, console.error(
|
|
638
|
+
"You called act(async () => ...) without await. This could lead to unexpected testing behaviour, interleaving multiple act calls and mixing their scopes. You should - await act(async () => ...);"
|
|
639
|
+
));
|
|
640
|
+
});
|
|
641
|
+
return {
|
|
642
|
+
then: function(resolve, reject) {
|
|
643
|
+
didAwaitActCall = true;
|
|
644
|
+
thenable.then(
|
|
645
|
+
function(returnValue) {
|
|
646
|
+
popActScope(prevActQueue, prevActScopeDepth);
|
|
647
|
+
if (0 === prevActScopeDepth) {
|
|
648
|
+
try {
|
|
649
|
+
flushActQueue(queue), enqueueTask(function() {
|
|
650
|
+
return recursivelyFlushAsyncActWork(
|
|
651
|
+
returnValue,
|
|
652
|
+
resolve,
|
|
653
|
+
reject
|
|
654
|
+
);
|
|
655
|
+
});
|
|
656
|
+
} catch (error$0) {
|
|
657
|
+
ReactSharedInternals.thrownErrors.push(error$0);
|
|
658
|
+
}
|
|
659
|
+
if (0 < ReactSharedInternals.thrownErrors.length) {
|
|
660
|
+
var _thrownError = aggregateErrors(
|
|
661
|
+
ReactSharedInternals.thrownErrors
|
|
662
|
+
);
|
|
663
|
+
ReactSharedInternals.thrownErrors.length = 0;
|
|
664
|
+
reject(_thrownError);
|
|
665
|
+
}
|
|
666
|
+
} else resolve(returnValue);
|
|
667
|
+
},
|
|
668
|
+
function(error) {
|
|
669
|
+
popActScope(prevActQueue, prevActScopeDepth);
|
|
670
|
+
0 < ReactSharedInternals.thrownErrors.length ? (error = aggregateErrors(
|
|
671
|
+
ReactSharedInternals.thrownErrors
|
|
672
|
+
), ReactSharedInternals.thrownErrors.length = 0, reject(error)) : reject(error);
|
|
673
|
+
}
|
|
674
|
+
);
|
|
675
|
+
}
|
|
676
|
+
};
|
|
677
|
+
}
|
|
678
|
+
var returnValue$jscomp$0 = result;
|
|
679
|
+
popActScope(prevActQueue, prevActScopeDepth);
|
|
680
|
+
0 === prevActScopeDepth && (flushActQueue(queue), 0 !== queue.length && queueSeveralMicrotasks(function() {
|
|
681
|
+
didAwaitActCall || didWarnNoAwaitAct || (didWarnNoAwaitAct = true, console.error(
|
|
682
|
+
"A component suspended inside an `act` scope, but the `act` call was not awaited. When testing React components that depend on asynchronous data, you must await the result:\n\nawait act(() => ...)"
|
|
683
|
+
));
|
|
684
|
+
}), ReactSharedInternals.actQueue = null);
|
|
685
|
+
if (0 < ReactSharedInternals.thrownErrors.length)
|
|
686
|
+
throw callback = aggregateErrors(ReactSharedInternals.thrownErrors), ReactSharedInternals.thrownErrors.length = 0, callback;
|
|
687
|
+
return {
|
|
688
|
+
then: function(resolve, reject) {
|
|
689
|
+
didAwaitActCall = true;
|
|
690
|
+
0 === prevActScopeDepth ? (ReactSharedInternals.actQueue = queue, enqueueTask(function() {
|
|
691
|
+
return recursivelyFlushAsyncActWork(
|
|
692
|
+
returnValue$jscomp$0,
|
|
693
|
+
resolve,
|
|
694
|
+
reject
|
|
695
|
+
);
|
|
696
|
+
})) : resolve(returnValue$jscomp$0);
|
|
697
|
+
}
|
|
698
|
+
};
|
|
699
|
+
};
|
|
700
|
+
exports.cache = function(fn) {
|
|
701
|
+
return function() {
|
|
702
|
+
return fn.apply(null, arguments);
|
|
703
|
+
};
|
|
704
|
+
};
|
|
705
|
+
exports.cacheSignal = function() {
|
|
706
|
+
return null;
|
|
707
|
+
};
|
|
708
|
+
exports.captureOwnerStack = function() {
|
|
709
|
+
var getCurrentStack = ReactSharedInternals.getCurrentStack;
|
|
710
|
+
return null === getCurrentStack ? null : getCurrentStack();
|
|
711
|
+
};
|
|
712
|
+
exports.cloneElement = function(element, config, children) {
|
|
713
|
+
if (null === element || void 0 === element)
|
|
714
|
+
throw Error(
|
|
715
|
+
"The argument must be a React element, but you passed " + element + "."
|
|
716
|
+
);
|
|
717
|
+
var props = assign({}, element.props), key = element.key, owner = element._owner;
|
|
718
|
+
if (null != config) {
|
|
719
|
+
var JSCompiler_inline_result;
|
|
720
|
+
a: {
|
|
721
|
+
if (hasOwnProperty.call(config, "ref") && (JSCompiler_inline_result = Object.getOwnPropertyDescriptor(
|
|
722
|
+
config,
|
|
723
|
+
"ref"
|
|
724
|
+
).get) && JSCompiler_inline_result.isReactWarning) {
|
|
725
|
+
JSCompiler_inline_result = false;
|
|
726
|
+
break a;
|
|
727
|
+
}
|
|
728
|
+
JSCompiler_inline_result = void 0 !== config.ref;
|
|
729
|
+
}
|
|
730
|
+
JSCompiler_inline_result && (owner = getOwner());
|
|
731
|
+
hasValidKey(config) && (checkKeyStringCoercion(config.key), key = "" + config.key);
|
|
732
|
+
for (propName in config)
|
|
733
|
+
!hasOwnProperty.call(config, propName) || "key" === propName || "__self" === propName || "__source" === propName || "ref" === propName && void 0 === config.ref || (props[propName] = config[propName]);
|
|
734
|
+
}
|
|
735
|
+
var propName = arguments.length - 2;
|
|
736
|
+
if (1 === propName) props.children = children;
|
|
737
|
+
else if (1 < propName) {
|
|
738
|
+
JSCompiler_inline_result = Array(propName);
|
|
739
|
+
for (var i = 0; i < propName; i++)
|
|
740
|
+
JSCompiler_inline_result[i] = arguments[i + 2];
|
|
741
|
+
props.children = JSCompiler_inline_result;
|
|
742
|
+
}
|
|
743
|
+
props = ReactElement(
|
|
744
|
+
element.type,
|
|
745
|
+
key,
|
|
746
|
+
props,
|
|
747
|
+
owner,
|
|
748
|
+
element._debugStack,
|
|
749
|
+
element._debugTask
|
|
750
|
+
);
|
|
751
|
+
for (key = 2; key < arguments.length; key++)
|
|
752
|
+
validateChildKeys(arguments[key]);
|
|
753
|
+
return props;
|
|
754
|
+
};
|
|
755
|
+
exports.createContext = function(defaultValue) {
|
|
756
|
+
defaultValue = {
|
|
757
|
+
$$typeof: REACT_CONTEXT_TYPE,
|
|
758
|
+
_currentValue: defaultValue,
|
|
759
|
+
_currentValue2: defaultValue,
|
|
760
|
+
_threadCount: 0,
|
|
761
|
+
Provider: null,
|
|
762
|
+
Consumer: null
|
|
763
|
+
};
|
|
764
|
+
defaultValue.Provider = defaultValue;
|
|
765
|
+
defaultValue.Consumer = {
|
|
766
|
+
$$typeof: REACT_CONSUMER_TYPE,
|
|
767
|
+
_context: defaultValue
|
|
768
|
+
};
|
|
769
|
+
defaultValue._currentRenderer = null;
|
|
770
|
+
defaultValue._currentRenderer2 = null;
|
|
771
|
+
return defaultValue;
|
|
772
|
+
};
|
|
773
|
+
exports.createElement = function(type, config, children) {
|
|
774
|
+
for (var i = 2; i < arguments.length; i++)
|
|
775
|
+
validateChildKeys(arguments[i]);
|
|
776
|
+
i = {};
|
|
777
|
+
var key = null;
|
|
778
|
+
if (null != config)
|
|
779
|
+
for (propName in didWarnAboutOldJSXRuntime || !("__self" in config) || "key" in config || (didWarnAboutOldJSXRuntime = true, console.warn(
|
|
780
|
+
"Your app (or one of its dependencies) is using an outdated JSX transform. Update to the modern JSX transform for faster performance: https://react.dev/link/new-jsx-transform"
|
|
781
|
+
)), hasValidKey(config) && (checkKeyStringCoercion(config.key), key = "" + config.key), config)
|
|
782
|
+
hasOwnProperty.call(config, propName) && "key" !== propName && "__self" !== propName && "__source" !== propName && (i[propName] = config[propName]);
|
|
783
|
+
var childrenLength = arguments.length - 2;
|
|
784
|
+
if (1 === childrenLength) i.children = children;
|
|
785
|
+
else if (1 < childrenLength) {
|
|
786
|
+
for (var childArray = Array(childrenLength), _i = 0; _i < childrenLength; _i++)
|
|
787
|
+
childArray[_i] = arguments[_i + 2];
|
|
788
|
+
Object.freeze && Object.freeze(childArray);
|
|
789
|
+
i.children = childArray;
|
|
790
|
+
}
|
|
791
|
+
if (type && type.defaultProps)
|
|
792
|
+
for (propName in childrenLength = type.defaultProps, childrenLength)
|
|
793
|
+
void 0 === i[propName] && (i[propName] = childrenLength[propName]);
|
|
794
|
+
key && defineKeyPropWarningGetter(
|
|
795
|
+
i,
|
|
796
|
+
"function" === typeof type ? type.displayName || type.name || "Unknown" : type
|
|
797
|
+
);
|
|
798
|
+
var propName = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
|
|
799
|
+
return ReactElement(
|
|
800
|
+
type,
|
|
801
|
+
key,
|
|
802
|
+
i,
|
|
803
|
+
getOwner(),
|
|
804
|
+
propName ? Error("react-stack-top-frame") : unknownOwnerDebugStack,
|
|
805
|
+
propName ? createTask(getTaskName(type)) : unknownOwnerDebugTask
|
|
806
|
+
);
|
|
807
|
+
};
|
|
808
|
+
exports.createRef = function() {
|
|
809
|
+
var refObject = { current: null };
|
|
810
|
+
Object.seal(refObject);
|
|
811
|
+
return refObject;
|
|
812
|
+
};
|
|
813
|
+
exports.forwardRef = function(render) {
|
|
814
|
+
null != render && render.$$typeof === REACT_MEMO_TYPE ? console.error(
|
|
815
|
+
"forwardRef requires a render function but received a `memo` component. Instead of forwardRef(memo(...)), use memo(forwardRef(...))."
|
|
816
|
+
) : "function" !== typeof render ? console.error(
|
|
817
|
+
"forwardRef requires a render function but was given %s.",
|
|
818
|
+
null === render ? "null" : typeof render
|
|
819
|
+
) : 0 !== render.length && 2 !== render.length && console.error(
|
|
820
|
+
"forwardRef render functions accept exactly two parameters: props and ref. %s",
|
|
821
|
+
1 === render.length ? "Did you forget to use the ref parameter?" : "Any additional parameter will be undefined."
|
|
822
|
+
);
|
|
823
|
+
null != render && null != render.defaultProps && console.error(
|
|
824
|
+
"forwardRef render functions do not support defaultProps. Did you accidentally pass a React component?"
|
|
825
|
+
);
|
|
826
|
+
var elementType = { $$typeof: REACT_FORWARD_REF_TYPE, render }, ownName;
|
|
827
|
+
Object.defineProperty(elementType, "displayName", {
|
|
828
|
+
enumerable: false,
|
|
829
|
+
configurable: true,
|
|
830
|
+
get: function() {
|
|
831
|
+
return ownName;
|
|
832
|
+
},
|
|
833
|
+
set: function(name) {
|
|
834
|
+
ownName = name;
|
|
835
|
+
render.name || render.displayName || (Object.defineProperty(render, "name", { value: name }), render.displayName = name);
|
|
836
|
+
}
|
|
837
|
+
});
|
|
838
|
+
return elementType;
|
|
839
|
+
};
|
|
840
|
+
exports.isValidElement = isValidElement;
|
|
841
|
+
exports.lazy = function(ctor) {
|
|
842
|
+
ctor = { _status: -1, _result: ctor };
|
|
843
|
+
var lazyType = {
|
|
844
|
+
$$typeof: REACT_LAZY_TYPE,
|
|
845
|
+
_payload: ctor,
|
|
846
|
+
_init: lazyInitializer
|
|
847
|
+
}, ioInfo = {
|
|
848
|
+
name: "lazy",
|
|
849
|
+
start: -1,
|
|
850
|
+
end: -1,
|
|
851
|
+
value: null,
|
|
852
|
+
owner: null,
|
|
853
|
+
debugStack: Error("react-stack-top-frame"),
|
|
854
|
+
debugTask: console.createTask ? console.createTask("lazy()") : null
|
|
855
|
+
};
|
|
856
|
+
ctor._ioInfo = ioInfo;
|
|
857
|
+
lazyType._debugInfo = [{ awaited: ioInfo }];
|
|
858
|
+
return lazyType;
|
|
859
|
+
};
|
|
860
|
+
exports.memo = function(type, compare) {
|
|
861
|
+
null == type && console.error(
|
|
862
|
+
"memo: The first argument must be a component. Instead received: %s",
|
|
863
|
+
null === type ? "null" : typeof type
|
|
864
|
+
);
|
|
865
|
+
compare = {
|
|
866
|
+
$$typeof: REACT_MEMO_TYPE,
|
|
867
|
+
type,
|
|
868
|
+
compare: void 0 === compare ? null : compare
|
|
869
|
+
};
|
|
870
|
+
var ownName;
|
|
871
|
+
Object.defineProperty(compare, "displayName", {
|
|
872
|
+
enumerable: false,
|
|
873
|
+
configurable: true,
|
|
874
|
+
get: function() {
|
|
875
|
+
return ownName;
|
|
876
|
+
},
|
|
877
|
+
set: function(name) {
|
|
878
|
+
ownName = name;
|
|
879
|
+
type.name || type.displayName || (Object.defineProperty(type, "name", { value: name }), type.displayName = name);
|
|
880
|
+
}
|
|
881
|
+
});
|
|
882
|
+
return compare;
|
|
883
|
+
};
|
|
884
|
+
exports.startTransition = function(scope) {
|
|
885
|
+
var prevTransition = ReactSharedInternals.T, currentTransition = {};
|
|
886
|
+
currentTransition._updatedFibers = /* @__PURE__ */ new Set();
|
|
887
|
+
ReactSharedInternals.T = currentTransition;
|
|
888
|
+
try {
|
|
889
|
+
var returnValue = scope(), onStartTransitionFinish = ReactSharedInternals.S;
|
|
890
|
+
null !== onStartTransitionFinish && onStartTransitionFinish(currentTransition, returnValue);
|
|
891
|
+
"object" === typeof returnValue && null !== returnValue && "function" === typeof returnValue.then && (ReactSharedInternals.asyncTransitions++, returnValue.then(releaseAsyncTransition, releaseAsyncTransition), returnValue.then(noop, reportGlobalError));
|
|
892
|
+
} catch (error) {
|
|
893
|
+
reportGlobalError(error);
|
|
894
|
+
} finally {
|
|
895
|
+
null === prevTransition && currentTransition._updatedFibers && (scope = currentTransition._updatedFibers.size, currentTransition._updatedFibers.clear(), 10 < scope && console.warn(
|
|
896
|
+
"Detected a large number of updates inside startTransition. If this is due to a subscription please re-write it to use React provided hooks. Otherwise concurrent mode guarantees are off the table."
|
|
897
|
+
)), null !== prevTransition && null !== currentTransition.types && (null !== prevTransition.types && prevTransition.types !== currentTransition.types && console.error(
|
|
898
|
+
"We expected inner Transitions to have transferred the outer types set and that you cannot add to the outer Transition while inside the inner.This is a bug in React."
|
|
899
|
+
), prevTransition.types = currentTransition.types), ReactSharedInternals.T = prevTransition;
|
|
900
|
+
}
|
|
901
|
+
};
|
|
902
|
+
exports.unstable_useCacheRefresh = function() {
|
|
903
|
+
return resolveDispatcher().useCacheRefresh();
|
|
904
|
+
};
|
|
905
|
+
exports.use = function(usable) {
|
|
906
|
+
return resolveDispatcher().use(usable);
|
|
907
|
+
};
|
|
908
|
+
exports.useActionState = function(action, initialState, permalink) {
|
|
909
|
+
return resolveDispatcher().useActionState(
|
|
910
|
+
action,
|
|
911
|
+
initialState,
|
|
912
|
+
permalink
|
|
913
|
+
);
|
|
914
|
+
};
|
|
915
|
+
exports.useCallback = function(callback, deps) {
|
|
916
|
+
return resolveDispatcher().useCallback(callback, deps);
|
|
917
|
+
};
|
|
918
|
+
exports.useContext = function(Context) {
|
|
919
|
+
var dispatcher = resolveDispatcher();
|
|
920
|
+
Context.$$typeof === REACT_CONSUMER_TYPE && console.error(
|
|
921
|
+
"Calling useContext(Context.Consumer) is not supported and will cause bugs. Did you mean to call useContext(Context) instead?"
|
|
922
|
+
);
|
|
923
|
+
return dispatcher.useContext(Context);
|
|
924
|
+
};
|
|
925
|
+
exports.useDebugValue = function(value, formatterFn) {
|
|
926
|
+
return resolveDispatcher().useDebugValue(value, formatterFn);
|
|
927
|
+
};
|
|
928
|
+
exports.useDeferredValue = function(value, initialValue) {
|
|
929
|
+
return resolveDispatcher().useDeferredValue(value, initialValue);
|
|
930
|
+
};
|
|
931
|
+
exports.useEffect = function(create, deps) {
|
|
932
|
+
null == create && console.warn(
|
|
933
|
+
"React Hook useEffect requires an effect callback. Did you forget to pass a callback to the hook?"
|
|
934
|
+
);
|
|
935
|
+
return resolveDispatcher().useEffect(create, deps);
|
|
936
|
+
};
|
|
937
|
+
exports.useEffectEvent = function(callback) {
|
|
938
|
+
return resolveDispatcher().useEffectEvent(callback);
|
|
939
|
+
};
|
|
940
|
+
exports.useId = function() {
|
|
941
|
+
return resolveDispatcher().useId();
|
|
942
|
+
};
|
|
943
|
+
exports.useImperativeHandle = function(ref, create, deps) {
|
|
944
|
+
return resolveDispatcher().useImperativeHandle(ref, create, deps);
|
|
945
|
+
};
|
|
946
|
+
exports.useInsertionEffect = function(create, deps) {
|
|
947
|
+
null == create && console.warn(
|
|
948
|
+
"React Hook useInsertionEffect requires an effect callback. Did you forget to pass a callback to the hook?"
|
|
949
|
+
);
|
|
950
|
+
return resolveDispatcher().useInsertionEffect(create, deps);
|
|
951
|
+
};
|
|
952
|
+
exports.useLayoutEffect = function(create, deps) {
|
|
953
|
+
null == create && console.warn(
|
|
954
|
+
"React Hook useLayoutEffect requires an effect callback. Did you forget to pass a callback to the hook?"
|
|
955
|
+
);
|
|
956
|
+
return resolveDispatcher().useLayoutEffect(create, deps);
|
|
957
|
+
};
|
|
958
|
+
exports.useMemo = function(create, deps) {
|
|
959
|
+
return resolveDispatcher().useMemo(create, deps);
|
|
960
|
+
};
|
|
961
|
+
exports.useOptimistic = function(passthrough, reducer) {
|
|
962
|
+
return resolveDispatcher().useOptimistic(passthrough, reducer);
|
|
963
|
+
};
|
|
964
|
+
exports.useReducer = function(reducer, initialArg, init) {
|
|
965
|
+
return resolveDispatcher().useReducer(reducer, initialArg, init);
|
|
966
|
+
};
|
|
967
|
+
exports.useRef = function(initialValue) {
|
|
968
|
+
return resolveDispatcher().useRef(initialValue);
|
|
969
|
+
};
|
|
970
|
+
exports.useState = function(initialState) {
|
|
971
|
+
return resolveDispatcher().useState(initialState);
|
|
972
|
+
};
|
|
973
|
+
exports.useSyncExternalStore = function(subscribe, getSnapshot, getServerSnapshot) {
|
|
974
|
+
return resolveDispatcher().useSyncExternalStore(
|
|
975
|
+
subscribe,
|
|
976
|
+
getSnapshot,
|
|
977
|
+
getServerSnapshot
|
|
978
|
+
);
|
|
979
|
+
};
|
|
980
|
+
exports.useTransition = function() {
|
|
981
|
+
return resolveDispatcher().useTransition();
|
|
982
|
+
};
|
|
983
|
+
exports.version = "19.2.1";
|
|
984
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
|
|
985
|
+
})();
|
|
986
|
+
}
|
|
987
|
+
});
|
|
988
|
+
|
|
989
|
+
// ../../../node_modules/react/index.js
|
|
990
|
+
var require_react = __commonJS({
|
|
991
|
+
"../../../node_modules/react/index.js"(exports, module) {
|
|
992
|
+
"use strict";
|
|
993
|
+
if (false) {
|
|
994
|
+
module.exports = null;
|
|
995
|
+
} else {
|
|
996
|
+
module.exports = require_react_development();
|
|
997
|
+
}
|
|
998
|
+
}
|
|
999
|
+
});
|
|
1000
|
+
|
|
1001
|
+
// ../../../node_modules/react/cjs/react-jsx-runtime.development.js
|
|
1002
|
+
var require_react_jsx_runtime_development = __commonJS({
|
|
1003
|
+
"../../../node_modules/react/cjs/react-jsx-runtime.development.js"(exports) {
|
|
1004
|
+
"use strict";
|
|
1005
|
+
(function() {
|
|
1006
|
+
function getComponentNameFromType(type) {
|
|
1007
|
+
if (null == type) return null;
|
|
1008
|
+
if ("function" === typeof type)
|
|
1009
|
+
return type.$$typeof === REACT_CLIENT_REFERENCE ? null : type.displayName || type.name || null;
|
|
1010
|
+
if ("string" === typeof type) return type;
|
|
1011
|
+
switch (type) {
|
|
1012
|
+
case REACT_FRAGMENT_TYPE:
|
|
1013
|
+
return "Fragment";
|
|
1014
|
+
case REACT_PROFILER_TYPE:
|
|
1015
|
+
return "Profiler";
|
|
1016
|
+
case REACT_STRICT_MODE_TYPE:
|
|
1017
|
+
return "StrictMode";
|
|
1018
|
+
case REACT_SUSPENSE_TYPE:
|
|
1019
|
+
return "Suspense";
|
|
1020
|
+
case REACT_SUSPENSE_LIST_TYPE:
|
|
1021
|
+
return "SuspenseList";
|
|
1022
|
+
case REACT_ACTIVITY_TYPE:
|
|
1023
|
+
return "Activity";
|
|
1024
|
+
}
|
|
1025
|
+
if ("object" === typeof type)
|
|
1026
|
+
switch ("number" === typeof type.tag && console.error(
|
|
1027
|
+
"Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
|
|
1028
|
+
), type.$$typeof) {
|
|
1029
|
+
case REACT_PORTAL_TYPE:
|
|
1030
|
+
return "Portal";
|
|
1031
|
+
case REACT_CONTEXT_TYPE:
|
|
1032
|
+
return type.displayName || "Context";
|
|
1033
|
+
case REACT_CONSUMER_TYPE:
|
|
1034
|
+
return (type._context.displayName || "Context") + ".Consumer";
|
|
1035
|
+
case REACT_FORWARD_REF_TYPE:
|
|
1036
|
+
var innerType = type.render;
|
|
1037
|
+
type = type.displayName;
|
|
1038
|
+
type || (type = innerType.displayName || innerType.name || "", type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef");
|
|
1039
|
+
return type;
|
|
1040
|
+
case REACT_MEMO_TYPE:
|
|
1041
|
+
return innerType = type.displayName || null, null !== innerType ? innerType : getComponentNameFromType(type.type) || "Memo";
|
|
1042
|
+
case REACT_LAZY_TYPE:
|
|
1043
|
+
innerType = type._payload;
|
|
1044
|
+
type = type._init;
|
|
1045
|
+
try {
|
|
1046
|
+
return getComponentNameFromType(type(innerType));
|
|
1047
|
+
} catch (x) {
|
|
1048
|
+
}
|
|
1049
|
+
}
|
|
1050
|
+
return null;
|
|
1051
|
+
}
|
|
1052
|
+
function testStringCoercion(value) {
|
|
1053
|
+
return "" + value;
|
|
1054
|
+
}
|
|
1055
|
+
function checkKeyStringCoercion(value) {
|
|
1056
|
+
try {
|
|
1057
|
+
testStringCoercion(value);
|
|
1058
|
+
var JSCompiler_inline_result = false;
|
|
1059
|
+
} catch (e) {
|
|
1060
|
+
JSCompiler_inline_result = true;
|
|
1061
|
+
}
|
|
1062
|
+
if (JSCompiler_inline_result) {
|
|
1063
|
+
JSCompiler_inline_result = console;
|
|
1064
|
+
var JSCompiler_temp_const = JSCompiler_inline_result.error;
|
|
1065
|
+
var JSCompiler_inline_result$jscomp$0 = "function" === typeof Symbol && Symbol.toStringTag && value[Symbol.toStringTag] || value.constructor.name || "Object";
|
|
1066
|
+
JSCompiler_temp_const.call(
|
|
1067
|
+
JSCompiler_inline_result,
|
|
1068
|
+
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
|
|
1069
|
+
JSCompiler_inline_result$jscomp$0
|
|
1070
|
+
);
|
|
1071
|
+
return testStringCoercion(value);
|
|
1072
|
+
}
|
|
1073
|
+
}
|
|
1074
|
+
function getTaskName(type) {
|
|
1075
|
+
if (type === REACT_FRAGMENT_TYPE) return "<>";
|
|
1076
|
+
if ("object" === typeof type && null !== type && type.$$typeof === REACT_LAZY_TYPE)
|
|
1077
|
+
return "<...>";
|
|
1078
|
+
try {
|
|
1079
|
+
var name = getComponentNameFromType(type);
|
|
1080
|
+
return name ? "<" + name + ">" : "<...>";
|
|
1081
|
+
} catch (x) {
|
|
1082
|
+
return "<...>";
|
|
1083
|
+
}
|
|
1084
|
+
}
|
|
1085
|
+
function getOwner() {
|
|
1086
|
+
var dispatcher = ReactSharedInternals.A;
|
|
1087
|
+
return null === dispatcher ? null : dispatcher.getOwner();
|
|
1088
|
+
}
|
|
1089
|
+
function UnknownOwner() {
|
|
1090
|
+
return Error("react-stack-top-frame");
|
|
1091
|
+
}
|
|
1092
|
+
function hasValidKey(config) {
|
|
1093
|
+
if (hasOwnProperty.call(config, "key")) {
|
|
1094
|
+
var getter = Object.getOwnPropertyDescriptor(config, "key").get;
|
|
1095
|
+
if (getter && getter.isReactWarning) return false;
|
|
1096
|
+
}
|
|
1097
|
+
return void 0 !== config.key;
|
|
1098
|
+
}
|
|
1099
|
+
function defineKeyPropWarningGetter(props, displayName) {
|
|
1100
|
+
function warnAboutAccessingKey() {
|
|
1101
|
+
specialPropKeyWarningShown || (specialPropKeyWarningShown = true, console.error(
|
|
1102
|
+
"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
|
|
1103
|
+
displayName
|
|
1104
|
+
));
|
|
1105
|
+
}
|
|
1106
|
+
warnAboutAccessingKey.isReactWarning = true;
|
|
1107
|
+
Object.defineProperty(props, "key", {
|
|
1108
|
+
get: warnAboutAccessingKey,
|
|
1109
|
+
configurable: true
|
|
1110
|
+
});
|
|
1111
|
+
}
|
|
1112
|
+
function elementRefGetterWithDeprecationWarning() {
|
|
1113
|
+
var componentName = getComponentNameFromType(this.type);
|
|
1114
|
+
didWarnAboutElementRef[componentName] || (didWarnAboutElementRef[componentName] = true, console.error(
|
|
1115
|
+
"Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
|
|
1116
|
+
));
|
|
1117
|
+
componentName = this.props.ref;
|
|
1118
|
+
return void 0 !== componentName ? componentName : null;
|
|
1119
|
+
}
|
|
1120
|
+
function ReactElement(type, key, props, owner, debugStack, debugTask) {
|
|
1121
|
+
var refProp = props.ref;
|
|
1122
|
+
type = {
|
|
1123
|
+
$$typeof: REACT_ELEMENT_TYPE,
|
|
1124
|
+
type,
|
|
1125
|
+
key,
|
|
1126
|
+
props,
|
|
1127
|
+
_owner: owner
|
|
1128
|
+
};
|
|
1129
|
+
null !== (void 0 !== refProp ? refProp : null) ? Object.defineProperty(type, "ref", {
|
|
1130
|
+
enumerable: false,
|
|
1131
|
+
get: elementRefGetterWithDeprecationWarning
|
|
1132
|
+
}) : Object.defineProperty(type, "ref", { enumerable: false, value: null });
|
|
1133
|
+
type._store = {};
|
|
1134
|
+
Object.defineProperty(type._store, "validated", {
|
|
1135
|
+
configurable: false,
|
|
1136
|
+
enumerable: false,
|
|
1137
|
+
writable: true,
|
|
1138
|
+
value: 0
|
|
1139
|
+
});
|
|
1140
|
+
Object.defineProperty(type, "_debugInfo", {
|
|
1141
|
+
configurable: false,
|
|
1142
|
+
enumerable: false,
|
|
1143
|
+
writable: true,
|
|
1144
|
+
value: null
|
|
1145
|
+
});
|
|
1146
|
+
Object.defineProperty(type, "_debugStack", {
|
|
1147
|
+
configurable: false,
|
|
1148
|
+
enumerable: false,
|
|
1149
|
+
writable: true,
|
|
1150
|
+
value: debugStack
|
|
1151
|
+
});
|
|
1152
|
+
Object.defineProperty(type, "_debugTask", {
|
|
1153
|
+
configurable: false,
|
|
1154
|
+
enumerable: false,
|
|
1155
|
+
writable: true,
|
|
1156
|
+
value: debugTask
|
|
1157
|
+
});
|
|
1158
|
+
Object.freeze && (Object.freeze(type.props), Object.freeze(type));
|
|
1159
|
+
return type;
|
|
1160
|
+
}
|
|
1161
|
+
function jsxDEVImpl(type, config, maybeKey, isStaticChildren, debugStack, debugTask) {
|
|
1162
|
+
var children = config.children;
|
|
1163
|
+
if (void 0 !== children)
|
|
1164
|
+
if (isStaticChildren)
|
|
1165
|
+
if (isArrayImpl(children)) {
|
|
1166
|
+
for (isStaticChildren = 0; isStaticChildren < children.length; isStaticChildren++)
|
|
1167
|
+
validateChildKeys(children[isStaticChildren]);
|
|
1168
|
+
Object.freeze && Object.freeze(children);
|
|
1169
|
+
} else
|
|
1170
|
+
console.error(
|
|
1171
|
+
"React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
|
|
1172
|
+
);
|
|
1173
|
+
else validateChildKeys(children);
|
|
1174
|
+
if (hasOwnProperty.call(config, "key")) {
|
|
1175
|
+
children = getComponentNameFromType(type);
|
|
1176
|
+
var keys = Object.keys(config).filter(function(k) {
|
|
1177
|
+
return "key" !== k;
|
|
1178
|
+
});
|
|
1179
|
+
isStaticChildren = 0 < keys.length ? "{key: someKey, " + keys.join(": ..., ") + ": ...}" : "{key: someKey}";
|
|
1180
|
+
didWarnAboutKeySpread[children + isStaticChildren] || (keys = 0 < keys.length ? "{" + keys.join(": ..., ") + ": ...}" : "{}", console.error(
|
|
1181
|
+
'A props object containing a "key" prop is being spread into JSX:\n let props = %s;\n <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n let props = %s;\n <%s key={someKey} {...props} />',
|
|
1182
|
+
isStaticChildren,
|
|
1183
|
+
children,
|
|
1184
|
+
keys,
|
|
1185
|
+
children
|
|
1186
|
+
), didWarnAboutKeySpread[children + isStaticChildren] = true);
|
|
1187
|
+
}
|
|
1188
|
+
children = null;
|
|
1189
|
+
void 0 !== maybeKey && (checkKeyStringCoercion(maybeKey), children = "" + maybeKey);
|
|
1190
|
+
hasValidKey(config) && (checkKeyStringCoercion(config.key), children = "" + config.key);
|
|
1191
|
+
if ("key" in config) {
|
|
1192
|
+
maybeKey = {};
|
|
1193
|
+
for (var propName in config)
|
|
1194
|
+
"key" !== propName && (maybeKey[propName] = config[propName]);
|
|
1195
|
+
} else maybeKey = config;
|
|
1196
|
+
children && defineKeyPropWarningGetter(
|
|
1197
|
+
maybeKey,
|
|
1198
|
+
"function" === typeof type ? type.displayName || type.name || "Unknown" : type
|
|
1199
|
+
);
|
|
1200
|
+
return ReactElement(
|
|
1201
|
+
type,
|
|
1202
|
+
children,
|
|
1203
|
+
maybeKey,
|
|
1204
|
+
getOwner(),
|
|
1205
|
+
debugStack,
|
|
1206
|
+
debugTask
|
|
1207
|
+
);
|
|
1208
|
+
}
|
|
1209
|
+
function validateChildKeys(node) {
|
|
1210
|
+
isValidElement(node) ? node._store && (node._store.validated = 1) : "object" === typeof node && null !== node && node.$$typeof === REACT_LAZY_TYPE && ("fulfilled" === node._payload.status ? isValidElement(node._payload.value) && node._payload.value._store && (node._payload.value._store.validated = 1) : node._store && (node._store.validated = 1));
|
|
1211
|
+
}
|
|
1212
|
+
function isValidElement(object) {
|
|
1213
|
+
return "object" === typeof object && null !== object && object.$$typeof === REACT_ELEMENT_TYPE;
|
|
1214
|
+
}
|
|
1215
|
+
var React = require_react(), REACT_ELEMENT_TYPE = /* @__PURE__ */ Symbol.for("react.transitional.element"), REACT_PORTAL_TYPE = /* @__PURE__ */ Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = /* @__PURE__ */ Symbol.for("react.fragment"), REACT_STRICT_MODE_TYPE = /* @__PURE__ */ Symbol.for("react.strict_mode"), REACT_PROFILER_TYPE = /* @__PURE__ */ Symbol.for("react.profiler"), REACT_CONSUMER_TYPE = /* @__PURE__ */ Symbol.for("react.consumer"), REACT_CONTEXT_TYPE = /* @__PURE__ */ Symbol.for("react.context"), REACT_FORWARD_REF_TYPE = /* @__PURE__ */ Symbol.for("react.forward_ref"), REACT_SUSPENSE_TYPE = /* @__PURE__ */ Symbol.for("react.suspense"), REACT_SUSPENSE_LIST_TYPE = /* @__PURE__ */ Symbol.for("react.suspense_list"), REACT_MEMO_TYPE = /* @__PURE__ */ Symbol.for("react.memo"), REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy"), REACT_ACTIVITY_TYPE = /* @__PURE__ */ Symbol.for("react.activity"), REACT_CLIENT_REFERENCE = /* @__PURE__ */ Symbol.for("react.client.reference"), ReactSharedInternals = React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, hasOwnProperty = Object.prototype.hasOwnProperty, isArrayImpl = Array.isArray, createTask = console.createTask ? console.createTask : function() {
|
|
1216
|
+
return null;
|
|
1217
|
+
};
|
|
1218
|
+
React = {
|
|
1219
|
+
react_stack_bottom_frame: function(callStackForError) {
|
|
1220
|
+
return callStackForError();
|
|
1221
|
+
}
|
|
1222
|
+
};
|
|
1223
|
+
var specialPropKeyWarningShown;
|
|
1224
|
+
var didWarnAboutElementRef = {};
|
|
1225
|
+
var unknownOwnerDebugStack = React.react_stack_bottom_frame.bind(
|
|
1226
|
+
React,
|
|
1227
|
+
UnknownOwner
|
|
1228
|
+
)();
|
|
1229
|
+
var unknownOwnerDebugTask = createTask(getTaskName(UnknownOwner));
|
|
1230
|
+
var didWarnAboutKeySpread = {};
|
|
1231
|
+
exports.Fragment = REACT_FRAGMENT_TYPE;
|
|
1232
|
+
exports.jsx = function(type, config, maybeKey) {
|
|
1233
|
+
var trackActualOwner = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
|
|
1234
|
+
return jsxDEVImpl(
|
|
1235
|
+
type,
|
|
1236
|
+
config,
|
|
1237
|
+
maybeKey,
|
|
1238
|
+
false,
|
|
1239
|
+
trackActualOwner ? Error("react-stack-top-frame") : unknownOwnerDebugStack,
|
|
1240
|
+
trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
|
|
1241
|
+
);
|
|
1242
|
+
};
|
|
1243
|
+
exports.jsxs = function(type, config, maybeKey) {
|
|
1244
|
+
var trackActualOwner = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
|
|
1245
|
+
return jsxDEVImpl(
|
|
1246
|
+
type,
|
|
1247
|
+
config,
|
|
1248
|
+
maybeKey,
|
|
1249
|
+
true,
|
|
1250
|
+
trackActualOwner ? Error("react-stack-top-frame") : unknownOwnerDebugStack,
|
|
1251
|
+
trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
|
|
1252
|
+
);
|
|
1253
|
+
};
|
|
1254
|
+
})();
|
|
1255
|
+
}
|
|
1256
|
+
});
|
|
1257
|
+
|
|
1258
|
+
// ../../../node_modules/react/jsx-runtime.js
|
|
1259
|
+
var require_jsx_runtime = __commonJS({
|
|
1260
|
+
"../../../node_modules/react/jsx-runtime.js"(exports, module) {
|
|
1261
|
+
"use strict";
|
|
1262
|
+
if (false) {
|
|
1263
|
+
module.exports = null;
|
|
1264
|
+
} else {
|
|
1265
|
+
module.exports = require_react_jsx_runtime_development();
|
|
1266
|
+
}
|
|
1267
|
+
}
|
|
1268
|
+
});
|
|
1269
|
+
|
|
1270
|
+
// ../../../node_modules/react-dom/cjs/react-dom.development.js
|
|
1271
|
+
var require_react_dom_development = __commonJS({
|
|
1272
|
+
"../../../node_modules/react-dom/cjs/react-dom.development.js"(exports) {
|
|
1273
|
+
"use strict";
|
|
1274
|
+
(function() {
|
|
1275
|
+
function noop() {
|
|
1276
|
+
}
|
|
1277
|
+
function testStringCoercion(value) {
|
|
1278
|
+
return "" + value;
|
|
1279
|
+
}
|
|
1280
|
+
function createPortal$1(children, containerInfo, implementation) {
|
|
1281
|
+
var key = 3 < arguments.length && void 0 !== arguments[3] ? arguments[3] : null;
|
|
1282
|
+
try {
|
|
1283
|
+
testStringCoercion(key);
|
|
1284
|
+
var JSCompiler_inline_result = false;
|
|
1285
|
+
} catch (e) {
|
|
1286
|
+
JSCompiler_inline_result = true;
|
|
1287
|
+
}
|
|
1288
|
+
JSCompiler_inline_result && (console.error(
|
|
1289
|
+
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
|
|
1290
|
+
"function" === typeof Symbol && Symbol.toStringTag && key[Symbol.toStringTag] || key.constructor.name || "Object"
|
|
1291
|
+
), testStringCoercion(key));
|
|
1292
|
+
return {
|
|
1293
|
+
$$typeof: REACT_PORTAL_TYPE,
|
|
1294
|
+
key: null == key ? null : "" + key,
|
|
1295
|
+
children,
|
|
1296
|
+
containerInfo,
|
|
1297
|
+
implementation
|
|
1298
|
+
};
|
|
1299
|
+
}
|
|
1300
|
+
function getCrossOriginStringAs(as, input) {
|
|
1301
|
+
if ("font" === as) return "";
|
|
1302
|
+
if ("string" === typeof input)
|
|
1303
|
+
return "use-credentials" === input ? input : "";
|
|
1304
|
+
}
|
|
1305
|
+
function getValueDescriptorExpectingObjectForWarning(thing) {
|
|
1306
|
+
return null === thing ? "`null`" : void 0 === thing ? "`undefined`" : "" === thing ? "an empty string" : 'something with type "' + typeof thing + '"';
|
|
1307
|
+
}
|
|
1308
|
+
function getValueDescriptorExpectingEnumForWarning(thing) {
|
|
1309
|
+
return null === thing ? "`null`" : void 0 === thing ? "`undefined`" : "" === thing ? "an empty string" : "string" === typeof thing ? JSON.stringify(thing) : "number" === typeof thing ? "`" + thing + "`" : 'something with type "' + typeof thing + '"';
|
|
1310
|
+
}
|
|
1311
|
+
function resolveDispatcher() {
|
|
1312
|
+
var dispatcher = ReactSharedInternals.H;
|
|
1313
|
+
null === dispatcher && console.error(
|
|
1314
|
+
"Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:\n1. You might have mismatching versions of React and the renderer (such as React DOM)\n2. You might be breaking the Rules of Hooks\n3. You might have more than one copy of React in the same app\nSee https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem."
|
|
1315
|
+
);
|
|
1316
|
+
return dispatcher;
|
|
1317
|
+
}
|
|
1318
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
|
|
1319
|
+
var React = require_react(), Internals = {
|
|
1320
|
+
d: {
|
|
1321
|
+
f: noop,
|
|
1322
|
+
r: function() {
|
|
1323
|
+
throw Error(
|
|
1324
|
+
"Invalid form element. requestFormReset must be passed a form that was rendered by React."
|
|
1325
|
+
);
|
|
1326
|
+
},
|
|
1327
|
+
D: noop,
|
|
1328
|
+
C: noop,
|
|
1329
|
+
L: noop,
|
|
1330
|
+
m: noop,
|
|
1331
|
+
X: noop,
|
|
1332
|
+
S: noop,
|
|
1333
|
+
M: noop
|
|
1334
|
+
},
|
|
1335
|
+
p: 0,
|
|
1336
|
+
findDOMNode: null
|
|
1337
|
+
}, REACT_PORTAL_TYPE = /* @__PURE__ */ Symbol.for("react.portal"), ReactSharedInternals = React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
|
|
1338
|
+
"function" === typeof Map && null != Map.prototype && "function" === typeof Map.prototype.forEach && "function" === typeof Set && null != Set.prototype && "function" === typeof Set.prototype.clear && "function" === typeof Set.prototype.forEach || console.error(
|
|
1339
|
+
"React depends on Map and Set built-in types. Make sure that you load a polyfill in older browsers. https://reactjs.org/link/react-polyfills"
|
|
1340
|
+
);
|
|
1341
|
+
exports.__DOM_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE = Internals;
|
|
1342
|
+
exports.createPortal = function(children, container) {
|
|
1343
|
+
var key = 2 < arguments.length && void 0 !== arguments[2] ? arguments[2] : null;
|
|
1344
|
+
if (!container || 1 !== container.nodeType && 9 !== container.nodeType && 11 !== container.nodeType)
|
|
1345
|
+
throw Error("Target container is not a DOM element.");
|
|
1346
|
+
return createPortal$1(children, container, null, key);
|
|
1347
|
+
};
|
|
1348
|
+
exports.flushSync = function(fn) {
|
|
1349
|
+
var previousTransition = ReactSharedInternals.T, previousUpdatePriority = Internals.p;
|
|
1350
|
+
try {
|
|
1351
|
+
if (ReactSharedInternals.T = null, Internals.p = 2, fn)
|
|
1352
|
+
return fn();
|
|
1353
|
+
} finally {
|
|
1354
|
+
ReactSharedInternals.T = previousTransition, Internals.p = previousUpdatePriority, Internals.d.f() && console.error(
|
|
1355
|
+
"flushSync was called from inside a lifecycle method. React cannot flush when React is already rendering. Consider moving this call to a scheduler task or micro task."
|
|
1356
|
+
);
|
|
1357
|
+
}
|
|
1358
|
+
};
|
|
1359
|
+
exports.preconnect = function(href, options) {
|
|
1360
|
+
"string" === typeof href && href ? null != options && "object" !== typeof options ? console.error(
|
|
1361
|
+
"ReactDOM.preconnect(): Expected the `options` argument (second) to be an object but encountered %s instead. The only supported option at this time is `crossOrigin` which accepts a string.",
|
|
1362
|
+
getValueDescriptorExpectingEnumForWarning(options)
|
|
1363
|
+
) : null != options && "string" !== typeof options.crossOrigin && console.error(
|
|
1364
|
+
"ReactDOM.preconnect(): Expected the `crossOrigin` option (second argument) to be a string but encountered %s instead. Try removing this option or passing a string value instead.",
|
|
1365
|
+
getValueDescriptorExpectingObjectForWarning(options.crossOrigin)
|
|
1366
|
+
) : console.error(
|
|
1367
|
+
"ReactDOM.preconnect(): Expected the `href` argument (first) to be a non-empty string but encountered %s instead.",
|
|
1368
|
+
getValueDescriptorExpectingObjectForWarning(href)
|
|
1369
|
+
);
|
|
1370
|
+
"string" === typeof href && (options ? (options = options.crossOrigin, options = "string" === typeof options ? "use-credentials" === options ? options : "" : void 0) : options = null, Internals.d.C(href, options));
|
|
1371
|
+
};
|
|
1372
|
+
exports.prefetchDNS = function(href) {
|
|
1373
|
+
if ("string" !== typeof href || !href)
|
|
1374
|
+
console.error(
|
|
1375
|
+
"ReactDOM.prefetchDNS(): Expected the `href` argument (first) to be a non-empty string but encountered %s instead.",
|
|
1376
|
+
getValueDescriptorExpectingObjectForWarning(href)
|
|
1377
|
+
);
|
|
1378
|
+
else if (1 < arguments.length) {
|
|
1379
|
+
var options = arguments[1];
|
|
1380
|
+
"object" === typeof options && options.hasOwnProperty("crossOrigin") ? console.error(
|
|
1381
|
+
"ReactDOM.prefetchDNS(): Expected only one argument, `href`, but encountered %s as a second argument instead. This argument is reserved for future options and is currently disallowed. It looks like the you are attempting to set a crossOrigin property for this DNS lookup hint. Browsers do not perform DNS queries using CORS and setting this attribute on the resource hint has no effect. Try calling ReactDOM.prefetchDNS() with just a single string argument, `href`.",
|
|
1382
|
+
getValueDescriptorExpectingEnumForWarning(options)
|
|
1383
|
+
) : console.error(
|
|
1384
|
+
"ReactDOM.prefetchDNS(): Expected only one argument, `href`, but encountered %s as a second argument instead. This argument is reserved for future options and is currently disallowed. Try calling ReactDOM.prefetchDNS() with just a single string argument, `href`.",
|
|
1385
|
+
getValueDescriptorExpectingEnumForWarning(options)
|
|
1386
|
+
);
|
|
1387
|
+
}
|
|
1388
|
+
"string" === typeof href && Internals.d.D(href);
|
|
1389
|
+
};
|
|
1390
|
+
exports.preinit = function(href, options) {
|
|
1391
|
+
"string" === typeof href && href ? null == options || "object" !== typeof options ? console.error(
|
|
1392
|
+
"ReactDOM.preinit(): Expected the `options` argument (second) to be an object with an `as` property describing the type of resource to be preinitialized but encountered %s instead.",
|
|
1393
|
+
getValueDescriptorExpectingEnumForWarning(options)
|
|
1394
|
+
) : "style" !== options.as && "script" !== options.as && console.error(
|
|
1395
|
+
'ReactDOM.preinit(): Expected the `as` property in the `options` argument (second) to contain a valid value describing the type of resource to be preinitialized but encountered %s instead. Valid values for `as` are "style" and "script".',
|
|
1396
|
+
getValueDescriptorExpectingEnumForWarning(options.as)
|
|
1397
|
+
) : console.error(
|
|
1398
|
+
"ReactDOM.preinit(): Expected the `href` argument (first) to be a non-empty string but encountered %s instead.",
|
|
1399
|
+
getValueDescriptorExpectingObjectForWarning(href)
|
|
1400
|
+
);
|
|
1401
|
+
if ("string" === typeof href && options && "string" === typeof options.as) {
|
|
1402
|
+
var as = options.as, crossOrigin = getCrossOriginStringAs(as, options.crossOrigin), integrity = "string" === typeof options.integrity ? options.integrity : void 0, fetchPriority = "string" === typeof options.fetchPriority ? options.fetchPriority : void 0;
|
|
1403
|
+
"style" === as ? Internals.d.S(
|
|
1404
|
+
href,
|
|
1405
|
+
"string" === typeof options.precedence ? options.precedence : void 0,
|
|
1406
|
+
{
|
|
1407
|
+
crossOrigin,
|
|
1408
|
+
integrity,
|
|
1409
|
+
fetchPriority
|
|
1410
|
+
}
|
|
1411
|
+
) : "script" === as && Internals.d.X(href, {
|
|
1412
|
+
crossOrigin,
|
|
1413
|
+
integrity,
|
|
1414
|
+
fetchPriority,
|
|
1415
|
+
nonce: "string" === typeof options.nonce ? options.nonce : void 0
|
|
1416
|
+
});
|
|
1417
|
+
}
|
|
1418
|
+
};
|
|
1419
|
+
exports.preinitModule = function(href, options) {
|
|
1420
|
+
var encountered = "";
|
|
1421
|
+
"string" === typeof href && href || (encountered += " The `href` argument encountered was " + getValueDescriptorExpectingObjectForWarning(href) + ".");
|
|
1422
|
+
void 0 !== options && "object" !== typeof options ? encountered += " The `options` argument encountered was " + getValueDescriptorExpectingObjectForWarning(options) + "." : options && "as" in options && "script" !== options.as && (encountered += " The `as` option encountered was " + getValueDescriptorExpectingEnumForWarning(options.as) + ".");
|
|
1423
|
+
if (encountered)
|
|
1424
|
+
console.error(
|
|
1425
|
+
"ReactDOM.preinitModule(): Expected up to two arguments, a non-empty `href` string and, optionally, an `options` object with a valid `as` property.%s",
|
|
1426
|
+
encountered
|
|
1427
|
+
);
|
|
1428
|
+
else
|
|
1429
|
+
switch (encountered = options && "string" === typeof options.as ? options.as : "script", encountered) {
|
|
1430
|
+
case "script":
|
|
1431
|
+
break;
|
|
1432
|
+
default:
|
|
1433
|
+
encountered = getValueDescriptorExpectingEnumForWarning(encountered), console.error(
|
|
1434
|
+
'ReactDOM.preinitModule(): Currently the only supported "as" type for this function is "script" but received "%s" instead. This warning was generated for `href` "%s". In the future other module types will be supported, aligning with the import-attributes proposal. Learn more here: (https://github.com/tc39/proposal-import-attributes)',
|
|
1435
|
+
encountered,
|
|
1436
|
+
href
|
|
1437
|
+
);
|
|
1438
|
+
}
|
|
1439
|
+
if ("string" === typeof href)
|
|
1440
|
+
if ("object" === typeof options && null !== options) {
|
|
1441
|
+
if (null == options.as || "script" === options.as)
|
|
1442
|
+
encountered = getCrossOriginStringAs(
|
|
1443
|
+
options.as,
|
|
1444
|
+
options.crossOrigin
|
|
1445
|
+
), Internals.d.M(href, {
|
|
1446
|
+
crossOrigin: encountered,
|
|
1447
|
+
integrity: "string" === typeof options.integrity ? options.integrity : void 0,
|
|
1448
|
+
nonce: "string" === typeof options.nonce ? options.nonce : void 0
|
|
1449
|
+
});
|
|
1450
|
+
} else null == options && Internals.d.M(href);
|
|
1451
|
+
};
|
|
1452
|
+
exports.preload = function(href, options) {
|
|
1453
|
+
var encountered = "";
|
|
1454
|
+
"string" === typeof href && href || (encountered += " The `href` argument encountered was " + getValueDescriptorExpectingObjectForWarning(href) + ".");
|
|
1455
|
+
null == options || "object" !== typeof options ? encountered += " The `options` argument encountered was " + getValueDescriptorExpectingObjectForWarning(options) + "." : "string" === typeof options.as && options.as || (encountered += " The `as` option encountered was " + getValueDescriptorExpectingObjectForWarning(options.as) + ".");
|
|
1456
|
+
encountered && console.error(
|
|
1457
|
+
'ReactDOM.preload(): Expected two arguments, a non-empty `href` string and an `options` object with an `as` property valid for a `<link rel="preload" as="..." />` tag.%s',
|
|
1458
|
+
encountered
|
|
1459
|
+
);
|
|
1460
|
+
if ("string" === typeof href && "object" === typeof options && null !== options && "string" === typeof options.as) {
|
|
1461
|
+
encountered = options.as;
|
|
1462
|
+
var crossOrigin = getCrossOriginStringAs(
|
|
1463
|
+
encountered,
|
|
1464
|
+
options.crossOrigin
|
|
1465
|
+
);
|
|
1466
|
+
Internals.d.L(href, encountered, {
|
|
1467
|
+
crossOrigin,
|
|
1468
|
+
integrity: "string" === typeof options.integrity ? options.integrity : void 0,
|
|
1469
|
+
nonce: "string" === typeof options.nonce ? options.nonce : void 0,
|
|
1470
|
+
type: "string" === typeof options.type ? options.type : void 0,
|
|
1471
|
+
fetchPriority: "string" === typeof options.fetchPriority ? options.fetchPriority : void 0,
|
|
1472
|
+
referrerPolicy: "string" === typeof options.referrerPolicy ? options.referrerPolicy : void 0,
|
|
1473
|
+
imageSrcSet: "string" === typeof options.imageSrcSet ? options.imageSrcSet : void 0,
|
|
1474
|
+
imageSizes: "string" === typeof options.imageSizes ? options.imageSizes : void 0,
|
|
1475
|
+
media: "string" === typeof options.media ? options.media : void 0
|
|
1476
|
+
});
|
|
1477
|
+
}
|
|
1478
|
+
};
|
|
1479
|
+
exports.preloadModule = function(href, options) {
|
|
1480
|
+
var encountered = "";
|
|
1481
|
+
"string" === typeof href && href || (encountered += " The `href` argument encountered was " + getValueDescriptorExpectingObjectForWarning(href) + ".");
|
|
1482
|
+
void 0 !== options && "object" !== typeof options ? encountered += " The `options` argument encountered was " + getValueDescriptorExpectingObjectForWarning(options) + "." : options && "as" in options && "string" !== typeof options.as && (encountered += " The `as` option encountered was " + getValueDescriptorExpectingObjectForWarning(options.as) + ".");
|
|
1483
|
+
encountered && console.error(
|
|
1484
|
+
'ReactDOM.preloadModule(): Expected two arguments, a non-empty `href` string and, optionally, an `options` object with an `as` property valid for a `<link rel="modulepreload" as="..." />` tag.%s',
|
|
1485
|
+
encountered
|
|
1486
|
+
);
|
|
1487
|
+
"string" === typeof href && (options ? (encountered = getCrossOriginStringAs(
|
|
1488
|
+
options.as,
|
|
1489
|
+
options.crossOrigin
|
|
1490
|
+
), Internals.d.m(href, {
|
|
1491
|
+
as: "string" === typeof options.as && "script" !== options.as ? options.as : void 0,
|
|
1492
|
+
crossOrigin: encountered,
|
|
1493
|
+
integrity: "string" === typeof options.integrity ? options.integrity : void 0
|
|
1494
|
+
})) : Internals.d.m(href));
|
|
1495
|
+
};
|
|
1496
|
+
exports.requestFormReset = function(form) {
|
|
1497
|
+
Internals.d.r(form);
|
|
1498
|
+
};
|
|
1499
|
+
exports.unstable_batchedUpdates = function(fn, a) {
|
|
1500
|
+
return fn(a);
|
|
1501
|
+
};
|
|
1502
|
+
exports.useFormState = function(action, initialState, permalink) {
|
|
1503
|
+
return resolveDispatcher().useFormState(action, initialState, permalink);
|
|
1504
|
+
};
|
|
1505
|
+
exports.useFormStatus = function() {
|
|
1506
|
+
return resolveDispatcher().useHostTransitionStatus();
|
|
1507
|
+
};
|
|
1508
|
+
exports.version = "19.2.1";
|
|
1509
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
|
|
1510
|
+
})();
|
|
1511
|
+
}
|
|
1512
|
+
});
|
|
1513
|
+
|
|
1514
|
+
// ../../../node_modules/react-dom/index.js
|
|
1515
|
+
var require_react_dom = __commonJS({
|
|
1516
|
+
"../../../node_modules/react-dom/index.js"(exports, module) {
|
|
1517
|
+
"use strict";
|
|
1518
|
+
if (false) {
|
|
1519
|
+
checkDCE();
|
|
1520
|
+
module.exports = null;
|
|
1521
|
+
} else {
|
|
1522
|
+
module.exports = require_react_dom_development();
|
|
1523
|
+
}
|
|
1524
|
+
}
|
|
1525
|
+
});
|
|
1526
|
+
|
|
1527
|
+
// ../../shared-editor-ui/dist/components/AnchorPicker.js
|
|
1528
|
+
var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
|
|
1529
|
+
var import_react = __toESM(require_react(), 1);
|
|
1530
|
+
var import_react_dom = __toESM(require_react_dom(), 1);
|
|
1531
|
+
|
|
1532
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-iselement.js
|
|
1533
|
+
function isElement(input) {
|
|
1534
|
+
return typeof input === "object" && input !== null && input.nodeType === Node.ELEMENT_NODE;
|
|
1535
|
+
}
|
|
1536
|
+
|
|
1537
|
+
// ../../../node_modules/css-selector-generator/esm/types.js
|
|
1538
|
+
var OPERATOR = {
|
|
1539
|
+
NONE: "",
|
|
1540
|
+
DESCENDANT: " ",
|
|
1541
|
+
CHILD: " > "
|
|
1542
|
+
};
|
|
1543
|
+
var CSS_SELECTOR_TYPE = {
|
|
1544
|
+
id: "id",
|
|
1545
|
+
class: "class",
|
|
1546
|
+
tag: "tag",
|
|
1547
|
+
attribute: "attribute",
|
|
1548
|
+
nthchild: "nthchild",
|
|
1549
|
+
nthoftype: "nthoftype"
|
|
1550
|
+
};
|
|
1551
|
+
|
|
1552
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-typescript.js
|
|
1553
|
+
function isEnumValue(haystack, needle) {
|
|
1554
|
+
return Object.values(haystack).includes(needle);
|
|
1555
|
+
}
|
|
1556
|
+
|
|
1557
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-messages.js
|
|
1558
|
+
var libraryName = "CssSelectorGenerator";
|
|
1559
|
+
function showWarning(id = "unknown problem", ...args) {
|
|
1560
|
+
console.warn(`${libraryName}: ${id}`, ...args);
|
|
1561
|
+
}
|
|
1562
|
+
|
|
1563
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-options.js
|
|
1564
|
+
var DEFAULT_OPTIONS = {
|
|
1565
|
+
selectors: [
|
|
1566
|
+
CSS_SELECTOR_TYPE.id,
|
|
1567
|
+
CSS_SELECTOR_TYPE.class,
|
|
1568
|
+
CSS_SELECTOR_TYPE.tag,
|
|
1569
|
+
CSS_SELECTOR_TYPE.attribute
|
|
1570
|
+
],
|
|
1571
|
+
// if set to true, always include tag name
|
|
1572
|
+
includeTag: false,
|
|
1573
|
+
whitelist: [],
|
|
1574
|
+
blacklist: [],
|
|
1575
|
+
combineWithinSelector: true,
|
|
1576
|
+
combineBetweenSelectors: true,
|
|
1577
|
+
root: null,
|
|
1578
|
+
maxCombinations: Number.POSITIVE_INFINITY,
|
|
1579
|
+
maxCandidates: Number.POSITIVE_INFINITY,
|
|
1580
|
+
useScope: false
|
|
1581
|
+
};
|
|
1582
|
+
function sanitizeSelectorTypes(input) {
|
|
1583
|
+
if (!Array.isArray(input)) {
|
|
1584
|
+
return [];
|
|
1585
|
+
}
|
|
1586
|
+
return input.filter((item) => isEnumValue(CSS_SELECTOR_TYPE, item));
|
|
1587
|
+
}
|
|
1588
|
+
function isRegExp(input) {
|
|
1589
|
+
return input instanceof RegExp;
|
|
1590
|
+
}
|
|
1591
|
+
function isCssSelectorMatch(input) {
|
|
1592
|
+
return ["string", "function"].includes(typeof input) || isRegExp(input);
|
|
1593
|
+
}
|
|
1594
|
+
function sanitizeCssSelectorMatchList(input) {
|
|
1595
|
+
if (!Array.isArray(input)) {
|
|
1596
|
+
return [];
|
|
1597
|
+
}
|
|
1598
|
+
return input.filter(isCssSelectorMatch);
|
|
1599
|
+
}
|
|
1600
|
+
function isNode(input) {
|
|
1601
|
+
return input instanceof Node;
|
|
1602
|
+
}
|
|
1603
|
+
function isParentNode(input) {
|
|
1604
|
+
const validParentNodeTypes = [
|
|
1605
|
+
Node.DOCUMENT_NODE,
|
|
1606
|
+
Node.DOCUMENT_FRAGMENT_NODE,
|
|
1607
|
+
// this includes Shadow DOM root
|
|
1608
|
+
Node.ELEMENT_NODE
|
|
1609
|
+
];
|
|
1610
|
+
return isNode(input) && validParentNodeTypes.includes(input.nodeType);
|
|
1611
|
+
}
|
|
1612
|
+
function sanitizeRoot(input, element) {
|
|
1613
|
+
if (isParentNode(input)) {
|
|
1614
|
+
if (!input.contains(element)) {
|
|
1615
|
+
showWarning("element root mismatch", "Provided root does not contain the element. This will most likely result in producing a fallback selector using element's real root node. If you plan to use the selector using provided root (e.g. `root.querySelector`), it will not work as intended.");
|
|
1616
|
+
}
|
|
1617
|
+
return input;
|
|
1618
|
+
}
|
|
1619
|
+
const rootNode = element.getRootNode({ composed: false });
|
|
1620
|
+
if (isParentNode(rootNode)) {
|
|
1621
|
+
if (rootNode !== document) {
|
|
1622
|
+
showWarning("shadow root inferred", "You did not provide a root and the element is a child of Shadow DOM. This will produce a selector using ShadowRoot as a root. If you plan to use the selector using document as a root (e.g. `document.querySelector`), it will not work as intended.");
|
|
1623
|
+
}
|
|
1624
|
+
return rootNode;
|
|
1625
|
+
}
|
|
1626
|
+
return getRootNode(element);
|
|
1627
|
+
}
|
|
1628
|
+
function sanitizeMaxNumber(input) {
|
|
1629
|
+
return typeof input === "number" ? input : Number.POSITIVE_INFINITY;
|
|
1630
|
+
}
|
|
1631
|
+
function sanitizeOptions(element, custom_options = {}) {
|
|
1632
|
+
const options = Object.assign(Object.assign({}, DEFAULT_OPTIONS), custom_options);
|
|
1633
|
+
return {
|
|
1634
|
+
selectors: sanitizeSelectorTypes(options.selectors),
|
|
1635
|
+
whitelist: sanitizeCssSelectorMatchList(options.whitelist),
|
|
1636
|
+
blacklist: sanitizeCssSelectorMatchList(options.blacklist),
|
|
1637
|
+
root: sanitizeRoot(options.root, element),
|
|
1638
|
+
combineWithinSelector: !!options.combineWithinSelector,
|
|
1639
|
+
combineBetweenSelectors: !!options.combineBetweenSelectors,
|
|
1640
|
+
includeTag: !!options.includeTag,
|
|
1641
|
+
maxCombinations: sanitizeMaxNumber(options.maxCombinations),
|
|
1642
|
+
maxCandidates: sanitizeMaxNumber(options.maxCandidates),
|
|
1643
|
+
useScope: !!options.useScope,
|
|
1644
|
+
maxResults: sanitizeMaxNumber(options.maxResults)
|
|
1645
|
+
};
|
|
1646
|
+
}
|
|
1647
|
+
|
|
1648
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-data.js
|
|
1649
|
+
function getIntersection(items = []) {
|
|
1650
|
+
const [firstItem = [], ...otherItems] = items;
|
|
1651
|
+
if (otherItems.length === 0) {
|
|
1652
|
+
return firstItem;
|
|
1653
|
+
}
|
|
1654
|
+
return otherItems.reduce((accumulator, currentValue) => {
|
|
1655
|
+
return accumulator.filter((item) => currentValue.includes(item));
|
|
1656
|
+
}, firstItem);
|
|
1657
|
+
}
|
|
1658
|
+
function flattenArray(input) {
|
|
1659
|
+
return [].concat(...input);
|
|
1660
|
+
}
|
|
1661
|
+
function wildcardToRegExp(input) {
|
|
1662
|
+
return input.replace(/[|\\{}()[\]^$+?.]/g, "\\$&").replace(/\*/g, ".+");
|
|
1663
|
+
}
|
|
1664
|
+
function createPatternMatcher(list) {
|
|
1665
|
+
const matchFunctions = list.map((item) => {
|
|
1666
|
+
if (isRegExp(item)) {
|
|
1667
|
+
return (input) => item.test(input);
|
|
1668
|
+
}
|
|
1669
|
+
if (typeof item === "function") {
|
|
1670
|
+
return (input) => {
|
|
1671
|
+
const result = item(input);
|
|
1672
|
+
if (typeof result !== "boolean") {
|
|
1673
|
+
showWarning("pattern matcher function invalid", "Provided pattern matching function does not return boolean. It's result will be ignored.", item);
|
|
1674
|
+
return false;
|
|
1675
|
+
}
|
|
1676
|
+
return result;
|
|
1677
|
+
};
|
|
1678
|
+
}
|
|
1679
|
+
if (typeof item === "string") {
|
|
1680
|
+
const re = new RegExp("^" + wildcardToRegExp(item) + "$");
|
|
1681
|
+
return (input) => re.test(input);
|
|
1682
|
+
}
|
|
1683
|
+
showWarning("pattern matcher invalid", "Pattern matching only accepts strings, regular expressions and/or functions. This item is invalid and will be ignored.", item);
|
|
1684
|
+
return () => false;
|
|
1685
|
+
});
|
|
1686
|
+
return (input) => matchFunctions.some((matchFunction) => matchFunction(input));
|
|
1687
|
+
}
|
|
1688
|
+
|
|
1689
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-dom.js
|
|
1690
|
+
function testSelector(elements, selector, root) {
|
|
1691
|
+
const result = Array.from(sanitizeRoot(root, elements[0]).querySelectorAll(selector));
|
|
1692
|
+
return result.length === elements.length && elements.every((element) => result.includes(element));
|
|
1693
|
+
}
|
|
1694
|
+
function getElementParents(element, root) {
|
|
1695
|
+
root = root !== null && root !== void 0 ? root : getRootNode(element);
|
|
1696
|
+
const result = [];
|
|
1697
|
+
let parent = element;
|
|
1698
|
+
while (isElement(parent) && parent !== root) {
|
|
1699
|
+
result.push(parent);
|
|
1700
|
+
parent = parent.parentElement;
|
|
1701
|
+
}
|
|
1702
|
+
return result;
|
|
1703
|
+
}
|
|
1704
|
+
function getParents(elements, root) {
|
|
1705
|
+
return getIntersection(elements.map((element) => getElementParents(element, root)));
|
|
1706
|
+
}
|
|
1707
|
+
function getRootNode(element) {
|
|
1708
|
+
return element.ownerDocument.querySelector(":root");
|
|
1709
|
+
}
|
|
1710
|
+
|
|
1711
|
+
// ../../../node_modules/css-selector-generator/esm/constants.js
|
|
1712
|
+
var SELECTOR_SEPARATOR = ", ";
|
|
1713
|
+
var INVALID_ID_RE = new RegExp([
|
|
1714
|
+
"^$",
|
|
1715
|
+
// empty or not set
|
|
1716
|
+
"\\s"
|
|
1717
|
+
// contains whitespace
|
|
1718
|
+
].join("|"));
|
|
1719
|
+
var INVALID_CLASS_RE = new RegExp([
|
|
1720
|
+
"^$"
|
|
1721
|
+
// empty or not set
|
|
1722
|
+
].join("|"));
|
|
1723
|
+
var SELECTOR_PATTERN = [
|
|
1724
|
+
CSS_SELECTOR_TYPE.nthoftype,
|
|
1725
|
+
CSS_SELECTOR_TYPE.tag,
|
|
1726
|
+
CSS_SELECTOR_TYPE.id,
|
|
1727
|
+
CSS_SELECTOR_TYPE.class,
|
|
1728
|
+
CSS_SELECTOR_TYPE.attribute,
|
|
1729
|
+
CSS_SELECTOR_TYPE.nthchild
|
|
1730
|
+
];
|
|
1731
|
+
|
|
1732
|
+
// ../../../node_modules/css-selector-generator/esm/selector-attribute.js
|
|
1733
|
+
var attributeBlacklistMatch = createPatternMatcher([
|
|
1734
|
+
"class",
|
|
1735
|
+
"id",
|
|
1736
|
+
// Angular attributes
|
|
1737
|
+
"ng-*"
|
|
1738
|
+
]);
|
|
1739
|
+
function attributeNodeToSimplifiedSelector({ name }) {
|
|
1740
|
+
return `[${name}]`;
|
|
1741
|
+
}
|
|
1742
|
+
function attributeNodeToSelector({ name, value }) {
|
|
1743
|
+
return `[${name}='${value}']`;
|
|
1744
|
+
}
|
|
1745
|
+
function isValidAttributeNode({ nodeName, nodeValue }, element) {
|
|
1746
|
+
const tagName = element.tagName.toLowerCase();
|
|
1747
|
+
if (["input", "option"].includes(tagName) && nodeName === "value") {
|
|
1748
|
+
return false;
|
|
1749
|
+
}
|
|
1750
|
+
if (nodeName === "src" && (nodeValue === null || nodeValue === void 0 ? void 0 : nodeValue.startsWith("data:"))) {
|
|
1751
|
+
return false;
|
|
1752
|
+
}
|
|
1753
|
+
return !attributeBlacklistMatch(nodeName);
|
|
1754
|
+
}
|
|
1755
|
+
function sanitizeAttributeData({ nodeName, nodeValue }) {
|
|
1756
|
+
return {
|
|
1757
|
+
name: sanitizeSelectorItem(nodeName),
|
|
1758
|
+
value: sanitizeSelectorItem(nodeValue !== null && nodeValue !== void 0 ? nodeValue : void 0)
|
|
1759
|
+
};
|
|
1760
|
+
}
|
|
1761
|
+
function getElementAttributeSelectors(element) {
|
|
1762
|
+
const validAttributes = Array.from(element.attributes).filter((attributeNode) => isValidAttributeNode(attributeNode, element)).map(sanitizeAttributeData);
|
|
1763
|
+
return [
|
|
1764
|
+
...validAttributes.map(attributeNodeToSimplifiedSelector),
|
|
1765
|
+
...validAttributes.map(attributeNodeToSelector)
|
|
1766
|
+
];
|
|
1767
|
+
}
|
|
1768
|
+
function getAttributeSelectors(elements) {
|
|
1769
|
+
const elementSelectors = elements.map(getElementAttributeSelectors);
|
|
1770
|
+
return getIntersection(elementSelectors);
|
|
1771
|
+
}
|
|
1772
|
+
|
|
1773
|
+
// ../../../node_modules/css-selector-generator/esm/selector-class.js
|
|
1774
|
+
function getElementClassSelectors(element) {
|
|
1775
|
+
var _a;
|
|
1776
|
+
return ((_a = element.getAttribute("class")) !== null && _a !== void 0 ? _a : "").trim().split(/\s+/).filter((item) => !INVALID_CLASS_RE.test(item)).map((item) => `.${sanitizeSelectorItem(item)}`);
|
|
1777
|
+
}
|
|
1778
|
+
function getClassSelectors(elements) {
|
|
1779
|
+
const elementSelectors = elements.map(getElementClassSelectors);
|
|
1780
|
+
return getIntersection(elementSelectors);
|
|
1781
|
+
}
|
|
1782
|
+
|
|
1783
|
+
// ../../../node_modules/css-selector-generator/esm/selector-id.js
|
|
1784
|
+
function getElementIdSelectors(element) {
|
|
1785
|
+
var _a;
|
|
1786
|
+
const id = (_a = element.getAttribute("id")) !== null && _a !== void 0 ? _a : "";
|
|
1787
|
+
const selector = `#${sanitizeSelectorItem(id)}`;
|
|
1788
|
+
const rootNode = element.getRootNode({ composed: false });
|
|
1789
|
+
return !INVALID_ID_RE.test(id) && testSelector([element], selector, rootNode) ? [selector] : [];
|
|
1790
|
+
}
|
|
1791
|
+
function getIdSelector(elements) {
|
|
1792
|
+
return elements.length === 0 || elements.length > 1 ? [] : getElementIdSelectors(elements[0]);
|
|
1793
|
+
}
|
|
1794
|
+
|
|
1795
|
+
// ../../../node_modules/css-selector-generator/esm/selector-nth-child.js
|
|
1796
|
+
function getElementNthChildSelector(element) {
|
|
1797
|
+
var _a;
|
|
1798
|
+
const siblings = (_a = element.parentElement) === null || _a === void 0 ? void 0 : _a.children;
|
|
1799
|
+
if (siblings) {
|
|
1800
|
+
for (let i = 0; i < siblings.length; i++) {
|
|
1801
|
+
if (siblings[i] === element) {
|
|
1802
|
+
return [`:nth-child(${String(i + 1)})`];
|
|
1803
|
+
}
|
|
1804
|
+
}
|
|
1805
|
+
}
|
|
1806
|
+
return [];
|
|
1807
|
+
}
|
|
1808
|
+
function getNthChildSelector(elements) {
|
|
1809
|
+
return getIntersection(elements.map(getElementNthChildSelector));
|
|
1810
|
+
}
|
|
1811
|
+
|
|
1812
|
+
// ../../../node_modules/css-selector-generator/esm/selector-tag.js
|
|
1813
|
+
function getElementTagSelectors(element) {
|
|
1814
|
+
return [
|
|
1815
|
+
sanitizeSelectorItem(element.tagName.toLowerCase())
|
|
1816
|
+
];
|
|
1817
|
+
}
|
|
1818
|
+
function getTagSelector(elements) {
|
|
1819
|
+
const selectors = [
|
|
1820
|
+
...new Set(flattenArray(elements.map(getElementTagSelectors)))
|
|
1821
|
+
];
|
|
1822
|
+
return selectors.length === 0 || selectors.length > 1 ? [] : [selectors[0]];
|
|
1823
|
+
}
|
|
1824
|
+
|
|
1825
|
+
// ../../../node_modules/css-selector-generator/esm/selector-nth-of-type.js
|
|
1826
|
+
function getElementNthOfTypeSelector(element) {
|
|
1827
|
+
const tag = getTagSelector([element])[0];
|
|
1828
|
+
const parentElement = element.parentElement;
|
|
1829
|
+
if (parentElement) {
|
|
1830
|
+
const siblings = Array.from(parentElement.children).filter((element2) => element2.tagName.toLowerCase() === tag);
|
|
1831
|
+
const elementIndex = siblings.indexOf(element);
|
|
1832
|
+
if (elementIndex > -1) {
|
|
1833
|
+
return [
|
|
1834
|
+
`${tag}:nth-of-type(${String(elementIndex + 1)})`
|
|
1835
|
+
];
|
|
1836
|
+
}
|
|
1837
|
+
}
|
|
1838
|
+
return [];
|
|
1839
|
+
}
|
|
1840
|
+
function getNthOfTypeSelector(elements) {
|
|
1841
|
+
return getIntersection(elements.map(getElementNthOfTypeSelector));
|
|
1842
|
+
}
|
|
1843
|
+
|
|
1844
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-powerset.js
|
|
1845
|
+
function* powerSetGenerator(input = [], { maxResults = Number.POSITIVE_INFINITY } = {}) {
|
|
1846
|
+
let resultCounter = 0;
|
|
1847
|
+
let offsets = generateOffsets(1);
|
|
1848
|
+
while (offsets.length <= input.length && resultCounter < maxResults) {
|
|
1849
|
+
resultCounter += 1;
|
|
1850
|
+
const result = offsets.map((offset) => input[offset]);
|
|
1851
|
+
yield result;
|
|
1852
|
+
offsets = bumpOffsets(offsets, input.length - 1);
|
|
1853
|
+
}
|
|
1854
|
+
}
|
|
1855
|
+
function getPowerSet(input = [], { maxResults = Number.POSITIVE_INFINITY } = {}) {
|
|
1856
|
+
return Array.from(powerSetGenerator(input, { maxResults }));
|
|
1857
|
+
}
|
|
1858
|
+
function bumpOffsets(offsets = [], maxValue = 0) {
|
|
1859
|
+
const size = offsets.length;
|
|
1860
|
+
if (size === 0) {
|
|
1861
|
+
return [];
|
|
1862
|
+
}
|
|
1863
|
+
const result = [...offsets];
|
|
1864
|
+
result[size - 1] += 1;
|
|
1865
|
+
for (let index = size - 1; index >= 0; index--) {
|
|
1866
|
+
if (result[index] > maxValue) {
|
|
1867
|
+
if (index === 0) {
|
|
1868
|
+
return generateOffsets(size + 1);
|
|
1869
|
+
} else {
|
|
1870
|
+
result[index - 1]++;
|
|
1871
|
+
result[index] = result[index - 1] + 1;
|
|
1872
|
+
}
|
|
1873
|
+
}
|
|
1874
|
+
}
|
|
1875
|
+
if (result[size - 1] > maxValue) {
|
|
1876
|
+
return generateOffsets(size + 1);
|
|
1877
|
+
}
|
|
1878
|
+
return result;
|
|
1879
|
+
}
|
|
1880
|
+
function generateOffsets(size = 1) {
|
|
1881
|
+
return Array.from(Array(size).keys());
|
|
1882
|
+
}
|
|
1883
|
+
|
|
1884
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-cartesian.js
|
|
1885
|
+
function* cartesianProductGenerator(input = {}) {
|
|
1886
|
+
const entries = Object.entries(input);
|
|
1887
|
+
if (entries.length === 0)
|
|
1888
|
+
return;
|
|
1889
|
+
const stack = [
|
|
1890
|
+
{ index: entries.length - 1, partial: {} }
|
|
1891
|
+
];
|
|
1892
|
+
while (stack.length > 0) {
|
|
1893
|
+
const item = stack.pop();
|
|
1894
|
+
if (!item)
|
|
1895
|
+
break;
|
|
1896
|
+
const { index, partial } = item;
|
|
1897
|
+
if (index < 0) {
|
|
1898
|
+
yield partial;
|
|
1899
|
+
continue;
|
|
1900
|
+
}
|
|
1901
|
+
const [key, values] = entries[index];
|
|
1902
|
+
for (let i = values.length - 1; i >= 0; i--) {
|
|
1903
|
+
stack.push({
|
|
1904
|
+
index: index - 1,
|
|
1905
|
+
partial: Object.assign(Object.assign({}, partial), { [key]: values[i] })
|
|
1906
|
+
});
|
|
1907
|
+
}
|
|
1908
|
+
}
|
|
1909
|
+
}
|
|
1910
|
+
|
|
1911
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-selectors.js
|
|
1912
|
+
var ESCAPED_COLON = ":".charCodeAt(0).toString(16).toUpperCase();
|
|
1913
|
+
var SPECIAL_CHARACTERS_RE = /[ !"#$%&'()\[\]{|}<>*+,./;=?@^`~\\]/;
|
|
1914
|
+
function sanitizeSelectorItem(input = "") {
|
|
1915
|
+
return CSS ? CSS.escape(input) : legacySanitizeSelectorItem(input);
|
|
1916
|
+
}
|
|
1917
|
+
function legacySanitizeSelectorItem(input = "") {
|
|
1918
|
+
return input.split("").map((character) => {
|
|
1919
|
+
if (character === ":") {
|
|
1920
|
+
return `\\${ESCAPED_COLON} `;
|
|
1921
|
+
}
|
|
1922
|
+
if (SPECIAL_CHARACTERS_RE.test(character)) {
|
|
1923
|
+
return `\\${character}`;
|
|
1924
|
+
}
|
|
1925
|
+
return escape(character).replace(/%/g, "\\");
|
|
1926
|
+
}).join("");
|
|
1927
|
+
}
|
|
1928
|
+
var SELECTOR_TYPE_GETTERS = {
|
|
1929
|
+
tag: getTagSelector,
|
|
1930
|
+
id: getIdSelector,
|
|
1931
|
+
class: getClassSelectors,
|
|
1932
|
+
attribute: getAttributeSelectors,
|
|
1933
|
+
nthchild: getNthChildSelector,
|
|
1934
|
+
nthoftype: getNthOfTypeSelector
|
|
1935
|
+
};
|
|
1936
|
+
var ELEMENT_SELECTOR_TYPE_GETTERS = {
|
|
1937
|
+
tag: getElementTagSelectors,
|
|
1938
|
+
id: getElementIdSelectors,
|
|
1939
|
+
class: getElementClassSelectors,
|
|
1940
|
+
attribute: getElementAttributeSelectors,
|
|
1941
|
+
nthchild: getElementNthChildSelector,
|
|
1942
|
+
nthoftype: getElementNthOfTypeSelector
|
|
1943
|
+
};
|
|
1944
|
+
function getElementSelectorsByType(element, selectorType) {
|
|
1945
|
+
return ELEMENT_SELECTOR_TYPE_GETTERS[selectorType](element);
|
|
1946
|
+
}
|
|
1947
|
+
function getSelectorsByType(elements, selector_type) {
|
|
1948
|
+
const getter = SELECTOR_TYPE_GETTERS[selector_type];
|
|
1949
|
+
return getter(elements);
|
|
1950
|
+
}
|
|
1951
|
+
function filterSelectors(list = [], matchBlacklist, matchWhitelist) {
|
|
1952
|
+
return list.filter((item) => matchWhitelist(item) || !matchBlacklist(item));
|
|
1953
|
+
}
|
|
1954
|
+
function orderSelectors(list = [], matchWhitelist) {
|
|
1955
|
+
return list.sort((a, b) => {
|
|
1956
|
+
const a_is_whitelisted = matchWhitelist(a);
|
|
1957
|
+
const b_is_whitelisted = matchWhitelist(b);
|
|
1958
|
+
if (a_is_whitelisted && !b_is_whitelisted) {
|
|
1959
|
+
return -1;
|
|
1960
|
+
}
|
|
1961
|
+
if (!a_is_whitelisted && b_is_whitelisted) {
|
|
1962
|
+
return 1;
|
|
1963
|
+
}
|
|
1964
|
+
return 0;
|
|
1965
|
+
});
|
|
1966
|
+
}
|
|
1967
|
+
function* allSelectorsGenerator(elements, options) {
|
|
1968
|
+
const yieldedSelectors = /* @__PURE__ */ new Set();
|
|
1969
|
+
const selectors_list = getSelectorsList(elements, options);
|
|
1970
|
+
for (const selector of selectorTypeCombinationsGenerator(selectors_list, options)) {
|
|
1971
|
+
if (!yieldedSelectors.has(selector)) {
|
|
1972
|
+
yieldedSelectors.add(selector);
|
|
1973
|
+
yield selector;
|
|
1974
|
+
}
|
|
1975
|
+
}
|
|
1976
|
+
}
|
|
1977
|
+
function getSelectorsList(elements, options) {
|
|
1978
|
+
const { blacklist, whitelist, combineWithinSelector, maxCombinations } = options;
|
|
1979
|
+
const matchBlacklist = createPatternMatcher(blacklist);
|
|
1980
|
+
const matchWhitelist = createPatternMatcher(whitelist);
|
|
1981
|
+
const reducer = (data, selector_type) => {
|
|
1982
|
+
const selectors_by_type = getSelectorsByType(elements, selector_type);
|
|
1983
|
+
const filtered_selectors = filterSelectors(selectors_by_type, matchBlacklist, matchWhitelist);
|
|
1984
|
+
const found_selectors = orderSelectors(filtered_selectors, matchWhitelist);
|
|
1985
|
+
data[selector_type] = combineWithinSelector ? Array.from(powerSetGenerator(found_selectors, { maxResults: maxCombinations })) : found_selectors.map((item) => [item]);
|
|
1986
|
+
return data;
|
|
1987
|
+
};
|
|
1988
|
+
return getSelectorsToGet(options).reduce(reducer, {});
|
|
1989
|
+
}
|
|
1990
|
+
function getSelectorsToGet(options) {
|
|
1991
|
+
const { selectors, includeTag } = options;
|
|
1992
|
+
const selectors_to_get = [...selectors];
|
|
1993
|
+
if (includeTag && !selectors_to_get.includes("tag")) {
|
|
1994
|
+
selectors_to_get.push("tag");
|
|
1995
|
+
}
|
|
1996
|
+
return selectors_to_get;
|
|
1997
|
+
}
|
|
1998
|
+
function addTagTypeIfNeeded(list) {
|
|
1999
|
+
return list.includes(CSS_SELECTOR_TYPE.tag) || list.includes(CSS_SELECTOR_TYPE.nthoftype) ? [...list] : [...list, CSS_SELECTOR_TYPE.tag];
|
|
2000
|
+
}
|
|
2001
|
+
function combineSelectorTypes(options) {
|
|
2002
|
+
const { selectors, combineBetweenSelectors, includeTag, maxCandidates } = options;
|
|
2003
|
+
const combinations = combineBetweenSelectors ? getPowerSet(selectors, { maxResults: maxCandidates }) : selectors.map((item) => [item]);
|
|
2004
|
+
return includeTag ? combinations.map(addTagTypeIfNeeded) : combinations;
|
|
2005
|
+
}
|
|
2006
|
+
function* selectorTypeCombinationsGenerator(selectors_list, options) {
|
|
2007
|
+
for (const item of combineSelectorTypes(options)) {
|
|
2008
|
+
yield* constructedSelectorsGenerator(item, selectors_list);
|
|
2009
|
+
}
|
|
2010
|
+
}
|
|
2011
|
+
function* constructedSelectorsGenerator(selector_types, selectors_by_type) {
|
|
2012
|
+
const data = {};
|
|
2013
|
+
for (const selector_type of selector_types) {
|
|
2014
|
+
const selector_variants = selectors_by_type[selector_type];
|
|
2015
|
+
if (selector_variants && selector_variants.length > 0) {
|
|
2016
|
+
data[selector_type] = selector_variants;
|
|
2017
|
+
}
|
|
2018
|
+
}
|
|
2019
|
+
for (const combination of cartesianProductGenerator(data)) {
|
|
2020
|
+
yield constructSelector(combination);
|
|
2021
|
+
}
|
|
2022
|
+
}
|
|
2023
|
+
function constructSelectorType(selector_type, selectors_data) {
|
|
2024
|
+
return selectors_data[selector_type] ? selectors_data[selector_type].join("") : "";
|
|
2025
|
+
}
|
|
2026
|
+
function constructSelector(selectorData = {}) {
|
|
2027
|
+
const pattern = [...SELECTOR_PATTERN];
|
|
2028
|
+
if (selectorData[CSS_SELECTOR_TYPE.tag] && selectorData[CSS_SELECTOR_TYPE.nthoftype]) {
|
|
2029
|
+
pattern.splice(pattern.indexOf(CSS_SELECTOR_TYPE.tag), 1);
|
|
2030
|
+
}
|
|
2031
|
+
return pattern.map((type) => constructSelectorType(type, selectorData)).join("");
|
|
2032
|
+
}
|
|
2033
|
+
function generateCandidateCombinations(selectors, rootSelector) {
|
|
2034
|
+
return [
|
|
2035
|
+
...selectors.map((selector) => rootSelector + OPERATOR.DESCENDANT + selector),
|
|
2036
|
+
...selectors.map((selector) => rootSelector + OPERATOR.CHILD + selector)
|
|
2037
|
+
];
|
|
2038
|
+
}
|
|
2039
|
+
function* candidatesGenerator(selectors, rootSelector) {
|
|
2040
|
+
if (rootSelector === "") {
|
|
2041
|
+
yield* selectors;
|
|
2042
|
+
} else {
|
|
2043
|
+
for (const selector of selectors) {
|
|
2044
|
+
yield* generateCandidateCombinations([selector], rootSelector);
|
|
2045
|
+
}
|
|
2046
|
+
}
|
|
2047
|
+
}
|
|
2048
|
+
function* selectorWithinRootGenerator(elements, root, rootSelector = "", options) {
|
|
2049
|
+
const elementSelectorsIterator = allSelectorsGenerator(elements, options);
|
|
2050
|
+
for (const candidateSelector of candidatesGenerator(elementSelectorsIterator, rootSelector)) {
|
|
2051
|
+
if (testSelector(elements, candidateSelector, root)) {
|
|
2052
|
+
yield candidateSelector;
|
|
2053
|
+
}
|
|
2054
|
+
}
|
|
2055
|
+
return;
|
|
2056
|
+
}
|
|
2057
|
+
function* closestIdentifiableParentGenerator(elements, root, rootSelector = "", options) {
|
|
2058
|
+
if (elements.length === 0) {
|
|
2059
|
+
return null;
|
|
2060
|
+
}
|
|
2061
|
+
const candidatesList = [
|
|
2062
|
+
elements.length > 1 ? elements : [],
|
|
2063
|
+
...getParents(elements, root).map((element) => [element])
|
|
2064
|
+
];
|
|
2065
|
+
for (const currentElements of candidatesList) {
|
|
2066
|
+
for (const selectorWithinRoot of selectorWithinRootGenerator(currentElements, root, rootSelector, options)) {
|
|
2067
|
+
yield {
|
|
2068
|
+
foundElements: currentElements,
|
|
2069
|
+
selector: selectorWithinRoot
|
|
2070
|
+
};
|
|
2071
|
+
}
|
|
2072
|
+
}
|
|
2073
|
+
}
|
|
2074
|
+
function* selectorGenerator({ elements, root, rootSelector = "", options }) {
|
|
2075
|
+
let currentRoot = root;
|
|
2076
|
+
let partialSelector = rootSelector;
|
|
2077
|
+
let shouldContinue = true;
|
|
2078
|
+
while (shouldContinue) {
|
|
2079
|
+
let foundAny = false;
|
|
2080
|
+
for (const item of closestIdentifiableParentGenerator(elements, currentRoot, partialSelector, options)) {
|
|
2081
|
+
const { foundElements, selector } = item;
|
|
2082
|
+
foundAny = true;
|
|
2083
|
+
if (testSelector(elements, selector, root)) {
|
|
2084
|
+
yield selector;
|
|
2085
|
+
} else {
|
|
2086
|
+
currentRoot = foundElements[0];
|
|
2087
|
+
partialSelector = selector;
|
|
2088
|
+
break;
|
|
2089
|
+
}
|
|
2090
|
+
}
|
|
2091
|
+
if (!foundAny) {
|
|
2092
|
+
shouldContinue = false;
|
|
2093
|
+
}
|
|
2094
|
+
}
|
|
2095
|
+
}
|
|
2096
|
+
function sanitizeSelectorNeedle(needle) {
|
|
2097
|
+
if (needle instanceof NodeList || needle instanceof HTMLCollection) {
|
|
2098
|
+
needle = Array.from(needle);
|
|
2099
|
+
}
|
|
2100
|
+
const elements = (Array.isArray(needle) ? needle : [needle]).filter(isElement);
|
|
2101
|
+
return [...new Set(elements)];
|
|
2102
|
+
}
|
|
2103
|
+
|
|
2104
|
+
// ../../../node_modules/css-selector-generator/esm/utilities-element-data.js
|
|
2105
|
+
function createElementSelectorData(selector) {
|
|
2106
|
+
return {
|
|
2107
|
+
value: selector,
|
|
2108
|
+
include: false
|
|
2109
|
+
};
|
|
2110
|
+
}
|
|
2111
|
+
function createElementData(element, selectorTypes, operator = OPERATOR.NONE) {
|
|
2112
|
+
const selectors = {};
|
|
2113
|
+
selectorTypes.forEach((selectorType) => {
|
|
2114
|
+
Reflect.set(selectors, selectorType, getElementSelectorsByType(element, selectorType).map(createElementSelectorData));
|
|
2115
|
+
});
|
|
2116
|
+
return {
|
|
2117
|
+
element,
|
|
2118
|
+
operator,
|
|
2119
|
+
selectors
|
|
2120
|
+
};
|
|
2121
|
+
}
|
|
2122
|
+
function constructElementSelector({ selectors, operator }) {
|
|
2123
|
+
let pattern = [...SELECTOR_PATTERN];
|
|
2124
|
+
if (selectors[CSS_SELECTOR_TYPE.tag] && selectors[CSS_SELECTOR_TYPE.nthoftype]) {
|
|
2125
|
+
pattern = pattern.filter((item) => item !== CSS_SELECTOR_TYPE.tag);
|
|
2126
|
+
}
|
|
2127
|
+
let selector = "";
|
|
2128
|
+
pattern.forEach((selectorType) => {
|
|
2129
|
+
var _a;
|
|
2130
|
+
const selectorsOfType = (_a = selectors[selectorType]) !== null && _a !== void 0 ? _a : [];
|
|
2131
|
+
selectorsOfType.forEach(({ value, include }) => {
|
|
2132
|
+
if (include) {
|
|
2133
|
+
selector += value;
|
|
2134
|
+
}
|
|
2135
|
+
});
|
|
2136
|
+
});
|
|
2137
|
+
return operator + selector;
|
|
2138
|
+
}
|
|
2139
|
+
|
|
2140
|
+
// ../../../node_modules/css-selector-generator/esm/selector-fallback.js
|
|
2141
|
+
function getElementFallbackSelector(element, root) {
|
|
2142
|
+
const parentElements = getElementParents(element, root).reverse();
|
|
2143
|
+
const elementsData = parentElements.map((element2) => {
|
|
2144
|
+
var _a;
|
|
2145
|
+
const elementData = createElementData(element2, [CSS_SELECTOR_TYPE.nthchild], OPERATOR.CHILD);
|
|
2146
|
+
((_a = elementData.selectors.nthchild) !== null && _a !== void 0 ? _a : []).forEach((selectorData) => {
|
|
2147
|
+
selectorData.include = true;
|
|
2148
|
+
});
|
|
2149
|
+
return elementData;
|
|
2150
|
+
});
|
|
2151
|
+
return [
|
|
2152
|
+
root ? ":scope" : ":root",
|
|
2153
|
+
...elementsData.map(constructElementSelector)
|
|
2154
|
+
].join("");
|
|
2155
|
+
}
|
|
2156
|
+
function getFallbackSelector(elements, root) {
|
|
2157
|
+
return elements.map((element) => getElementFallbackSelector(element, root)).join(SELECTOR_SEPARATOR);
|
|
2158
|
+
}
|
|
2159
|
+
|
|
2160
|
+
// ../../../node_modules/css-selector-generator/esm/index.js
|
|
2161
|
+
function getCssSelector(needle, custom_options = {}) {
|
|
2162
|
+
const options = Object.assign(Object.assign({}, custom_options), { maxResults: 1 });
|
|
2163
|
+
const generator = cssSelectorGenerator(needle, options);
|
|
2164
|
+
const firstResult = generator.next();
|
|
2165
|
+
return firstResult.value;
|
|
2166
|
+
}
|
|
2167
|
+
function* cssSelectorGenerator(needle, custom_options = {}) {
|
|
2168
|
+
var _a;
|
|
2169
|
+
const elements = sanitizeSelectorNeedle(needle);
|
|
2170
|
+
const options = sanitizeOptions(elements[0], custom_options);
|
|
2171
|
+
const root = (_a = options.root) !== null && _a !== void 0 ? _a : getRootNode(elements[0]);
|
|
2172
|
+
let foundResults = 0;
|
|
2173
|
+
for (const selector of selectorGenerator({
|
|
2174
|
+
elements,
|
|
2175
|
+
options,
|
|
2176
|
+
root,
|
|
2177
|
+
rootSelector: ""
|
|
2178
|
+
})) {
|
|
2179
|
+
yield selector;
|
|
2180
|
+
foundResults++;
|
|
2181
|
+
if (foundResults >= options.maxResults) {
|
|
2182
|
+
return;
|
|
2183
|
+
}
|
|
2184
|
+
}
|
|
2185
|
+
if (elements.length > 1) {
|
|
2186
|
+
yield elements.map((element) => getCssSelector(element, options)).join(SELECTOR_SEPARATOR);
|
|
2187
|
+
foundResults++;
|
|
2188
|
+
if (foundResults >= options.maxResults) {
|
|
2189
|
+
return;
|
|
2190
|
+
}
|
|
2191
|
+
}
|
|
2192
|
+
yield getFallbackSelector(elements, options.useScope ? root : void 0);
|
|
2193
|
+
}
|
|
2194
|
+
|
|
2195
|
+
// ../../shared-editor-ui/dist/components/BeforeAfterToggle.js
|
|
2196
|
+
var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
|
|
2197
|
+
|
|
2198
|
+
// ../../shared-editor-ui/dist/components/ConditionStatusLine.js
|
|
2199
|
+
var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
|
|
2200
|
+
var import_react2 = __toESM(require_react(), 1);
|
|
2201
|
+
|
|
2202
|
+
// ../../shared-editor-ui/dist/components/DetectionBadge.js
|
|
2203
|
+
var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
|
|
2204
|
+
|
|
2205
|
+
// ../../shared-editor-ui/dist/components/DismissedSection.js
|
|
2206
|
+
var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
|
|
2207
|
+
var import_react3 = __toESM(require_react(), 1);
|
|
2208
|
+
|
|
2209
|
+
// ../../shared-editor-ui/dist/components/EditBackButton.js
|
|
2210
|
+
var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
|
|
2211
|
+
|
|
2212
|
+
// ../../shared-editor-ui/dist/components/EditorBody.js
|
|
2213
|
+
var import_jsx_runtime7 = __toESM(require_jsx_runtime(), 1);
|
|
2214
|
+
|
|
2215
|
+
// ../../shared-editor-ui/dist/components/EditorCard.js
|
|
2216
|
+
var import_jsx_runtime8 = __toESM(require_jsx_runtime(), 1);
|
|
2217
|
+
|
|
2218
|
+
// ../../shared-editor-ui/dist/components/EditorFooter.js
|
|
2219
|
+
var import_jsx_runtime9 = __toESM(require_jsx_runtime(), 1);
|
|
2220
|
+
|
|
2221
|
+
// ../../shared-editor-ui/dist/components/EditorHeader.js
|
|
2222
|
+
var import_jsx_runtime10 = __toESM(require_jsx_runtime(), 1);
|
|
2223
|
+
|
|
2224
|
+
// ../../shared-editor-ui/dist/components/EditorInput.js
|
|
2225
|
+
var import_jsx_runtime11 = __toESM(require_jsx_runtime(), 1);
|
|
2226
|
+
var import_react4 = __toESM(require_react(), 1);
|
|
2227
|
+
|
|
2228
|
+
// ../../shared-editor-ui/dist/components/EditorLayout.js
|
|
2229
|
+
var import_jsx_runtime12 = __toESM(require_jsx_runtime(), 1);
|
|
2230
|
+
|
|
2231
|
+
// ../../shared-editor-ui/dist/components/EditorPanelShell.js
|
|
2232
|
+
var import_jsx_runtime13 = __toESM(require_jsx_runtime(), 1);
|
|
2233
|
+
|
|
2234
|
+
// ../../design-system/dist/tailwind-preset.js
|
|
2235
|
+
var syntroPreset = {
|
|
2236
|
+
darkMode: ["class"],
|
|
2237
|
+
theme: {
|
|
2238
|
+
extend: {
|
|
2239
|
+
colors: {
|
|
2240
|
+
// Base colors
|
|
2241
|
+
white: colors.base.white,
|
|
2242
|
+
black: colors.base.black,
|
|
2243
|
+
// Brand scale
|
|
2244
|
+
brand: {
|
|
2245
|
+
0: colors.brand[0],
|
|
2246
|
+
1: colors.brand[1],
|
|
2247
|
+
2: colors.brand[2],
|
|
2248
|
+
3: colors.brand[3],
|
|
2249
|
+
4: colors.brand[4],
|
|
2250
|
+
5: colors.brand[5],
|
|
2251
|
+
6: colors.brand[6],
|
|
2252
|
+
7: colors.brand[7],
|
|
2253
|
+
8: colors.brand[8],
|
|
2254
|
+
9: colors.brand[9],
|
|
2255
|
+
DEFAULT: colors.brand[3]
|
|
2256
|
+
},
|
|
2257
|
+
// Neutral scale (Slate Grey)
|
|
2258
|
+
"slate-grey": {
|
|
2259
|
+
0: colors.slateGrey[0],
|
|
2260
|
+
1: colors.slateGrey[1],
|
|
2261
|
+
2: colors.slateGrey[2],
|
|
2262
|
+
3: colors.slateGrey[3],
|
|
2263
|
+
4: colors.slateGrey[4],
|
|
2264
|
+
5: colors.slateGrey[5],
|
|
2265
|
+
6: colors.slateGrey[6],
|
|
2266
|
+
7: colors.slateGrey[7],
|
|
2267
|
+
8: colors.slateGrey[8],
|
|
2268
|
+
9: colors.slateGrey[9],
|
|
2269
|
+
10: colors.slateGrey[10],
|
|
2270
|
+
11: colors.slateGrey[11],
|
|
2271
|
+
12: colors.slateGrey[12],
|
|
2272
|
+
DEFAULT: colors.slateGrey[6]
|
|
2273
|
+
},
|
|
2274
|
+
// Semantic color scales
|
|
2275
|
+
green: {
|
|
2276
|
+
0: colors.green[0],
|
|
2277
|
+
1: colors.green[1],
|
|
2278
|
+
2: colors.green[2],
|
|
2279
|
+
3: colors.green[3],
|
|
2280
|
+
4: colors.green[4],
|
|
2281
|
+
5: colors.green[5],
|
|
2282
|
+
6: colors.green[6],
|
|
2283
|
+
7: colors.green[7],
|
|
2284
|
+
8: colors.green[8],
|
|
2285
|
+
9: colors.green[9],
|
|
2286
|
+
DEFAULT: colors.green[4]
|
|
2287
|
+
},
|
|
2288
|
+
yellow: {
|
|
2289
|
+
0: colors.yellow[0],
|
|
2290
|
+
1: colors.yellow[1],
|
|
2291
|
+
2: colors.yellow[2],
|
|
2292
|
+
3: colors.yellow[3],
|
|
2293
|
+
4: colors.yellow[4],
|
|
2294
|
+
5: colors.yellow[5],
|
|
2295
|
+
6: colors.yellow[6],
|
|
2296
|
+
7: colors.yellow[7],
|
|
2297
|
+
8: colors.yellow[8],
|
|
2298
|
+
9: colors.yellow[9],
|
|
2299
|
+
DEFAULT: colors.yellow[4]
|
|
2300
|
+
},
|
|
2301
|
+
red: {
|
|
2302
|
+
0: colors.red[0],
|
|
2303
|
+
1: colors.red[1],
|
|
2304
|
+
2: colors.red[2],
|
|
2305
|
+
3: colors.red[3],
|
|
2306
|
+
4: colors.red[4],
|
|
2307
|
+
5: colors.red[5],
|
|
2308
|
+
6: colors.red[6],
|
|
2309
|
+
7: colors.red[7],
|
|
2310
|
+
8: colors.red[8],
|
|
2311
|
+
9: colors.red[9],
|
|
2312
|
+
DEFAULT: colors.red[4]
|
|
2313
|
+
},
|
|
2314
|
+
blue: {
|
|
2315
|
+
0: colors.blue[0],
|
|
2316
|
+
1: colors.blue[1],
|
|
2317
|
+
2: colors.blue[2],
|
|
2318
|
+
3: colors.blue[3],
|
|
2319
|
+
4: colors.blue[4],
|
|
2320
|
+
5: colors.blue[5],
|
|
2321
|
+
6: colors.blue[6],
|
|
2322
|
+
7: colors.blue[7],
|
|
2323
|
+
8: colors.blue[8],
|
|
2324
|
+
9: colors.blue[9],
|
|
2325
|
+
DEFAULT: colors.blue[4]
|
|
2326
|
+
},
|
|
2327
|
+
orange: {
|
|
2328
|
+
0: colors.orange[0],
|
|
2329
|
+
1: colors.orange[1],
|
|
2330
|
+
2: colors.orange[2],
|
|
2331
|
+
3: colors.orange[3],
|
|
2332
|
+
4: colors.orange[4],
|
|
2333
|
+
5: colors.orange[5],
|
|
2334
|
+
6: colors.orange[6],
|
|
2335
|
+
7: colors.orange[7],
|
|
2336
|
+
8: colors.orange[8],
|
|
2337
|
+
9: colors.orange[9],
|
|
2338
|
+
DEFAULT: colors.orange[3]
|
|
2339
|
+
},
|
|
2340
|
+
purple: {
|
|
2341
|
+
0: colors.purple[0],
|
|
2342
|
+
1: colors.purple[1],
|
|
2343
|
+
2: colors.purple[2],
|
|
2344
|
+
3: colors.purple[3],
|
|
2345
|
+
4: colors.purple[4],
|
|
2346
|
+
5: colors.purple[5],
|
|
2347
|
+
6: colors.purple[6],
|
|
2348
|
+
7: colors.purple[7],
|
|
2349
|
+
8: colors.purple[8],
|
|
2350
|
+
9: colors.purple[9],
|
|
2351
|
+
DEFAULT: colors.purple[4]
|
|
2352
|
+
},
|
|
2353
|
+
pink: {
|
|
2354
|
+
0: colors.pink[0],
|
|
2355
|
+
1: colors.pink[1],
|
|
2356
|
+
2: colors.pink[2],
|
|
2357
|
+
3: colors.pink[3],
|
|
2358
|
+
4: colors.pink[4],
|
|
2359
|
+
5: colors.pink[5],
|
|
2360
|
+
6: colors.pink[6],
|
|
2361
|
+
7: colors.pink[7],
|
|
2362
|
+
8: colors.pink[8],
|
|
2363
|
+
9: colors.pink[9],
|
|
2364
|
+
DEFAULT: colors.pink[4]
|
|
2365
|
+
},
|
|
2366
|
+
// Semantic tokens
|
|
2367
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2368
|
+
text: {
|
|
2369
|
+
primary: colors.text.primary,
|
|
2370
|
+
secondary: colors.text.secondary,
|
|
2371
|
+
tertiary: colors.text.tertiary,
|
|
2372
|
+
DEFAULT: colors.text.primary
|
|
2373
|
+
},
|
|
2374
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2375
|
+
background: {
|
|
2376
|
+
primary: colors.background.primary,
|
|
2377
|
+
secondary: colors.background.secondary,
|
|
2378
|
+
DEFAULT: colors.background.primary
|
|
2379
|
+
},
|
|
2380
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2381
|
+
border: {
|
|
2382
|
+
primary: colors.border.primary,
|
|
2383
|
+
secondary: colors.border.secondary,
|
|
2384
|
+
DEFAULT: colors.border.primary
|
|
2385
|
+
},
|
|
2386
|
+
// Component tokens - Button
|
|
2387
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2388
|
+
"btn-primary": {
|
|
2389
|
+
DEFAULT: colors.button.primary.backgroundDefault,
|
|
2390
|
+
hover: colors.button.primary.backgroundHover,
|
|
2391
|
+
text: colors.button.primary.text,
|
|
2392
|
+
border: colors.button.primary.border
|
|
2393
|
+
},
|
|
2394
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2395
|
+
"btn-neutral": {
|
|
2396
|
+
DEFAULT: colors.button.neutral.background,
|
|
2397
|
+
text: colors.button.neutral.text,
|
|
2398
|
+
"text-hover": colors.button.neutral.textHover,
|
|
2399
|
+
border: colors.button.neutral.border
|
|
2400
|
+
},
|
|
2401
|
+
"btn-link": {
|
|
2402
|
+
text: colors.button.link.text,
|
|
2403
|
+
hover: colors.button.link.hover
|
|
2404
|
+
},
|
|
2405
|
+
"btn-error": {
|
|
2406
|
+
text: colors.button.error.text,
|
|
2407
|
+
hover: colors.button.error.hover
|
|
2408
|
+
},
|
|
2409
|
+
"btn-success": {
|
|
2410
|
+
text: colors.button.success.text,
|
|
2411
|
+
hover: colors.button.success.hover
|
|
2412
|
+
},
|
|
2413
|
+
// Component tokens - Card
|
|
2414
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2415
|
+
card: {
|
|
2416
|
+
bg: colors.card.background,
|
|
2417
|
+
content: colors.card.content,
|
|
2418
|
+
border: colors.card.border
|
|
2419
|
+
},
|
|
2420
|
+
// Component tokens - Modal
|
|
2421
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2422
|
+
modal: {
|
|
2423
|
+
bg: colors.modal.background,
|
|
2424
|
+
content: colors.modal.content,
|
|
2425
|
+
border: colors.modal.border
|
|
2426
|
+
},
|
|
2427
|
+
// Component tokens - Sidebar
|
|
2428
|
+
sidebar: {
|
|
2429
|
+
DEFAULT: colors.sidebar.backgroundDefault,
|
|
2430
|
+
hover: colors.sidebar.backgroundHover,
|
|
2431
|
+
active: colors.sidebar.backgroundActive,
|
|
2432
|
+
border: colors.sidebar.border,
|
|
2433
|
+
"content-primary": colors.sidebar.contentPrimary,
|
|
2434
|
+
"content-secondary": colors.sidebar.contentSecondary,
|
|
2435
|
+
"content-tertiary": colors.sidebar.contentTertiary
|
|
2436
|
+
},
|
|
2437
|
+
// Component tokens - Tab
|
|
2438
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2439
|
+
tab: {
|
|
2440
|
+
"active-bg": colors.tab.activeBackground,
|
|
2441
|
+
"active-content": colors.tab.activeContent,
|
|
2442
|
+
"inactive-content": colors.tab.inactiveContent,
|
|
2443
|
+
border: colors.tab.border
|
|
2444
|
+
},
|
|
2445
|
+
// Component tokens - Table
|
|
2446
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2447
|
+
"table-header": {
|
|
2448
|
+
text: colors.table.header.textDefault,
|
|
2449
|
+
"text-hover": colors.table.header.textHover,
|
|
2450
|
+
bg: colors.table.header.backgroundDefault
|
|
2451
|
+
},
|
|
2452
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2453
|
+
"table-cell": {
|
|
2454
|
+
// biome-ignore lint: Tailwind preset defines semantic token names, not usage of shadcn color classes
|
|
2455
|
+
"text-primary": colors.table.cell.textPrimary,
|
|
2456
|
+
// biome-ignore lint: Tailwind preset defines semantic token names, not usage of shadcn color classes
|
|
2457
|
+
"text-secondary": colors.table.cell.textSecondary,
|
|
2458
|
+
bg: colors.table.cell.backgroundDefault,
|
|
2459
|
+
"bg-hover": colors.table.cell.backgroundHover
|
|
2460
|
+
},
|
|
2461
|
+
"table-border": colors.table.border,
|
|
2462
|
+
// Component tokens - Input
|
|
2463
|
+
"input-field": {
|
|
2464
|
+
bg: colors.inputField.backgroundDefault,
|
|
2465
|
+
"bg-disabled": colors.inputField.backgroundDisabled,
|
|
2466
|
+
"text-label": colors.inputField.textLabel,
|
|
2467
|
+
"text-placeholder": colors.inputField.textPlaceholder,
|
|
2468
|
+
"text-hint": colors.inputField.textHint,
|
|
2469
|
+
"text-error": colors.inputField.textError,
|
|
2470
|
+
border: colors.inputField.borderDefault,
|
|
2471
|
+
"border-selected": colors.inputField.borderSelected,
|
|
2472
|
+
"border-error": colors.inputField.borderError
|
|
2473
|
+
},
|
|
2474
|
+
// Component tokens - Badge (9 variants)
|
|
2475
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2476
|
+
"badge-slate": {
|
|
2477
|
+
content: colors.badge.slateGrey.content,
|
|
2478
|
+
outline: colors.badge.slateGrey.pillOutline,
|
|
2479
|
+
border: colors.badge.slateGrey.borderPrimary,
|
|
2480
|
+
bg: colors.badge.slateGrey.background
|
|
2481
|
+
},
|
|
2482
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2483
|
+
"badge-brand": {
|
|
2484
|
+
content: colors.badge.brand.content,
|
|
2485
|
+
outline: colors.badge.brand.pillOutline,
|
|
2486
|
+
border: colors.badge.brand.borderPrimary,
|
|
2487
|
+
bg: colors.badge.brand.background
|
|
2488
|
+
},
|
|
2489
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2490
|
+
"badge-green": {
|
|
2491
|
+
content: colors.badge.green.content,
|
|
2492
|
+
outline: colors.badge.green.pillOutline,
|
|
2493
|
+
border: colors.badge.green.borderPrimary,
|
|
2494
|
+
bg: colors.badge.green.background
|
|
2495
|
+
},
|
|
2496
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2497
|
+
"badge-yellow": {
|
|
2498
|
+
content: colors.badge.yellow.content,
|
|
2499
|
+
outline: colors.badge.yellow.pillOutline,
|
|
2500
|
+
border: colors.badge.yellow.borderPrimary,
|
|
2501
|
+
bg: colors.badge.yellow.background
|
|
2502
|
+
},
|
|
2503
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2504
|
+
"badge-red": {
|
|
2505
|
+
content: colors.badge.red.content,
|
|
2506
|
+
outline: colors.badge.red.pillOutline,
|
|
2507
|
+
border: colors.badge.red.borderPrimary,
|
|
2508
|
+
bg: colors.badge.red.background
|
|
2509
|
+
},
|
|
2510
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2511
|
+
"badge-blue": {
|
|
2512
|
+
content: colors.badge.blue.content,
|
|
2513
|
+
outline: colors.badge.blue.pillOutline,
|
|
2514
|
+
border: colors.badge.blue.borderPrimary,
|
|
2515
|
+
bg: colors.badge.blue.background
|
|
2516
|
+
},
|
|
2517
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2518
|
+
"badge-purple": {
|
|
2519
|
+
content: colors.badge.purple.content,
|
|
2520
|
+
outline: colors.badge.purple.pillOutline,
|
|
2521
|
+
border: colors.badge.purple.borderPrimary,
|
|
2522
|
+
bg: colors.badge.purple.background
|
|
2523
|
+
},
|
|
2524
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2525
|
+
"badge-orange": {
|
|
2526
|
+
content: colors.badge.orange.content,
|
|
2527
|
+
outline: colors.badge.orange.pillOutline,
|
|
2528
|
+
border: colors.badge.orange.borderPrimary,
|
|
2529
|
+
bg: colors.badge.orange.background
|
|
2530
|
+
},
|
|
2531
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2532
|
+
"badge-pink": {
|
|
2533
|
+
content: colors.badge.pink.content,
|
|
2534
|
+
outline: colors.badge.pink.pillOutline,
|
|
2535
|
+
border: colors.badge.pink.borderPrimary,
|
|
2536
|
+
bg: colors.badge.pink.background
|
|
2537
|
+
},
|
|
2538
|
+
// Component tokens - Toggle
|
|
2539
|
+
toggle: {
|
|
2540
|
+
handle: colors.toggle.handleDefault,
|
|
2541
|
+
"handle-disabled": colors.toggle.handleDisabled,
|
|
2542
|
+
"off-bg": colors.toggle.off.backgroundDefault,
|
|
2543
|
+
"off-bg-hover": colors.toggle.off.backgroundHover,
|
|
2544
|
+
"on-bg": colors.toggle.on.backgroundDefault,
|
|
2545
|
+
"on-bg-hover": colors.toggle.on.backgroundHover
|
|
2546
|
+
},
|
|
2547
|
+
// Component tokens - Menu
|
|
2548
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2549
|
+
menu: {
|
|
2550
|
+
DEFAULT: colors.menu.backgroundDefault,
|
|
2551
|
+
hover: colors.menu.backgroundHover,
|
|
2552
|
+
selected: colors.menu.selected
|
|
2553
|
+
},
|
|
2554
|
+
// Component tokens - Alert
|
|
2555
|
+
"alert-green": {
|
|
2556
|
+
content: colors.alert.green.content,
|
|
2557
|
+
bg: colors.alert.green.background
|
|
2558
|
+
},
|
|
2559
|
+
"alert-yellow": {
|
|
2560
|
+
content: colors.alert.yellow.content,
|
|
2561
|
+
bg: colors.alert.yellow.background
|
|
2562
|
+
},
|
|
2563
|
+
"alert-red": {
|
|
2564
|
+
content: colors.alert.red.content,
|
|
2565
|
+
bg: colors.alert.red.background
|
|
2566
|
+
}
|
|
2567
|
+
},
|
|
2568
|
+
// Typography
|
|
2569
|
+
fontSize: {
|
|
2570
|
+
xs: ["0.75rem", { lineHeight: "1rem" }],
|
|
2571
|
+
sm: ["0.875rem", { lineHeight: "1.25rem" }],
|
|
2572
|
+
base: ["1rem", { lineHeight: "1.5rem" }],
|
|
2573
|
+
lg: ["1.125rem", { lineHeight: "1.75rem" }],
|
|
2574
|
+
xl: ["1.25rem", { lineHeight: "1.75rem" }],
|
|
2575
|
+
"2xl": ["1.5rem", { lineHeight: "2rem" }],
|
|
2576
|
+
"3xl": ["1.875rem", { lineHeight: "2.25rem" }],
|
|
2577
|
+
"4xl": ["2.25rem", { lineHeight: "2.5rem" }],
|
|
2578
|
+
"5xl": ["3rem", { lineHeight: "1" }],
|
|
2579
|
+
"6xl": ["3.75rem", { lineHeight: "1" }]
|
|
2580
|
+
},
|
|
2581
|
+
// Spacing
|
|
2582
|
+
spacing: {
|
|
2583
|
+
0: "0",
|
|
2584
|
+
1: "0.25rem",
|
|
2585
|
+
2: "0.5rem",
|
|
2586
|
+
3: "0.75rem",
|
|
2587
|
+
4: "1rem",
|
|
2588
|
+
5: "1.25rem",
|
|
2589
|
+
6: "1.5rem",
|
|
2590
|
+
8: "2rem",
|
|
2591
|
+
10: "2.5rem",
|
|
2592
|
+
12: "3rem",
|
|
2593
|
+
16: "4rem",
|
|
2594
|
+
20: "5rem",
|
|
2595
|
+
24: "6rem",
|
|
2596
|
+
32: "8rem"
|
|
2597
|
+
},
|
|
2598
|
+
// Border radius
|
|
2599
|
+
borderRadius: {
|
|
2600
|
+
none: "0",
|
|
2601
|
+
sm: "0.125rem",
|
|
2602
|
+
DEFAULT: "0.25rem",
|
|
2603
|
+
md: "0.375rem",
|
|
2604
|
+
lg: "0.5rem",
|
|
2605
|
+
xl: "0.75rem",
|
|
2606
|
+
"2xl": "1rem",
|
|
2607
|
+
"3xl": "1.5rem",
|
|
2608
|
+
full: "9999px"
|
|
2609
|
+
},
|
|
2610
|
+
// Box shadow — Figma shadow scale + product glows + elevation
|
|
2611
|
+
boxShadow: {
|
|
2612
|
+
...shadows,
|
|
2613
|
+
...glowShadows,
|
|
2614
|
+
...elevationShadows,
|
|
2615
|
+
DEFAULT: shadows.sm,
|
|
2616
|
+
// Focus rings (4px spread + xs shadow)
|
|
2617
|
+
"focus-primary": focusRings.primary,
|
|
2618
|
+
"focus-neutral": focusRings.neutral,
|
|
2619
|
+
"focus-error": focusRings.error
|
|
2620
|
+
},
|
|
2621
|
+
// Backdrop blur — Figma scale
|
|
2622
|
+
// biome-ignore lint: Tailwind preset intentionally maps design tokens from source
|
|
2623
|
+
backdropBlur: {
|
|
2624
|
+
sm: backdropBlur.sm,
|
|
2625
|
+
md: backdropBlur.md,
|
|
2626
|
+
lg: backdropBlur.lg,
|
|
2627
|
+
xl: backdropBlur.xl
|
|
2628
|
+
},
|
|
2629
|
+
// Overlay background colors
|
|
2630
|
+
backgroundColor: {
|
|
2631
|
+
"overlay-solid": overlay.solid,
|
|
2632
|
+
"overlay-blur": overlay.blur
|
|
2633
|
+
},
|
|
2634
|
+
// Animation
|
|
2635
|
+
keyframes: {
|
|
2636
|
+
"fade-in": {
|
|
2637
|
+
"0%": { opacity: "0" },
|
|
2638
|
+
"100%": { opacity: "1" }
|
|
2639
|
+
},
|
|
2640
|
+
"fade-out": {
|
|
2641
|
+
"0%": { opacity: "1" },
|
|
2642
|
+
"100%": { opacity: "0" }
|
|
2643
|
+
},
|
|
2644
|
+
"slide-in-from-top": {
|
|
2645
|
+
"0%": { transform: "translateY(-100%)" },
|
|
2646
|
+
"100%": { transform: "translateY(0)" }
|
|
2647
|
+
},
|
|
2648
|
+
"slide-in-from-bottom": {
|
|
2649
|
+
"0%": { transform: "translateY(100%)" },
|
|
2650
|
+
"100%": { transform: "translateY(0)" }
|
|
2651
|
+
},
|
|
2652
|
+
"slide-in-from-left": {
|
|
2653
|
+
"0%": { transform: "translateX(-100%)" },
|
|
2654
|
+
"100%": { transform: "translateX(0)" }
|
|
2655
|
+
},
|
|
2656
|
+
"slide-in-from-right": {
|
|
2657
|
+
"0%": { transform: "translateX(100%)" },
|
|
2658
|
+
"100%": { transform: "translateX(0)" }
|
|
2659
|
+
}
|
|
2660
|
+
},
|
|
2661
|
+
animation: {
|
|
2662
|
+
"fade-in": "fade-in 0.2s ease-out",
|
|
2663
|
+
"fade-out": "fade-out 0.2s ease-out",
|
|
2664
|
+
"slide-in-from-top": "slide-in-from-top 0.3s ease-out",
|
|
2665
|
+
"slide-in-from-bottom": "slide-in-from-bottom 0.3s ease-out",
|
|
2666
|
+
"slide-in-from-left": "slide-in-from-left 0.3s ease-out",
|
|
2667
|
+
"slide-in-from-right": "slide-in-from-right 0.3s ease-out"
|
|
2668
|
+
}
|
|
2669
|
+
}
|
|
2670
|
+
}
|
|
2671
|
+
};
|
|
2672
|
+
|
|
2673
|
+
// ../../shared-editor-ui/dist/components/EditorPanelShell.js
|
|
2674
|
+
var import_react5 = __toESM(require_react(), 1);
|
|
2675
|
+
var MIN_WIDTH = panel_shell_default.behavior.minWidth;
|
|
2676
|
+
var MIN_HEIGHT = panel_shell_default.behavior.minHeight;
|
|
2677
|
+
var FAB_SIZE = panel_shell_default.fab.size;
|
|
2678
|
+
var FAB_INSET = panel_shell_default.fab.inset;
|
|
2679
|
+
var SNAP_THRESHOLD = panel_shell_default.behavior.snapThreshold;
|
|
2680
|
+
var DRAG_THRESHOLD = panel_shell_default.behavior.dragThreshold;
|
|
2681
|
+
var HANDLE_SIZE = panel_shell_default.behavior.handleSize;
|
|
2682
|
+
var RESIZE_HANDLES = [
|
|
2683
|
+
{
|
|
2684
|
+
dir: "n",
|
|
2685
|
+
style: { top: 0, left: HANDLE_SIZE, right: HANDLE_SIZE, height: HANDLE_SIZE },
|
|
2686
|
+
cursor: "ns-resize"
|
|
2687
|
+
},
|
|
2688
|
+
{
|
|
2689
|
+
dir: "s",
|
|
2690
|
+
style: { bottom: 0, left: HANDLE_SIZE, right: HANDLE_SIZE, height: HANDLE_SIZE },
|
|
2691
|
+
cursor: "ns-resize"
|
|
2692
|
+
},
|
|
2693
|
+
{
|
|
2694
|
+
dir: "e",
|
|
2695
|
+
style: { right: 0, top: HANDLE_SIZE, bottom: HANDLE_SIZE, width: HANDLE_SIZE },
|
|
2696
|
+
cursor: "ew-resize"
|
|
2697
|
+
},
|
|
2698
|
+
{
|
|
2699
|
+
dir: "w",
|
|
2700
|
+
style: { left: 0, top: HANDLE_SIZE, bottom: HANDLE_SIZE, width: HANDLE_SIZE },
|
|
2701
|
+
cursor: "ew-resize"
|
|
2702
|
+
},
|
|
2703
|
+
{
|
|
2704
|
+
dir: "ne",
|
|
2705
|
+
style: { top: 0, right: 0, width: HANDLE_SIZE * 2, height: HANDLE_SIZE * 2 },
|
|
2706
|
+
cursor: "nesw-resize"
|
|
2707
|
+
},
|
|
2708
|
+
{
|
|
2709
|
+
dir: "nw",
|
|
2710
|
+
style: { top: 0, left: 0, width: HANDLE_SIZE * 2, height: HANDLE_SIZE * 2 },
|
|
2711
|
+
cursor: "nwse-resize"
|
|
2712
|
+
},
|
|
2713
|
+
{
|
|
2714
|
+
dir: "se",
|
|
2715
|
+
style: { bottom: 0, right: 0, width: HANDLE_SIZE * 2, height: HANDLE_SIZE * 2 },
|
|
2716
|
+
cursor: "nwse-resize"
|
|
2717
|
+
},
|
|
2718
|
+
{
|
|
2719
|
+
dir: "sw",
|
|
2720
|
+
style: { bottom: 0, left: 0, width: HANDLE_SIZE * 2, height: HANDLE_SIZE * 2 },
|
|
2721
|
+
cursor: "nesw-resize"
|
|
2722
|
+
}
|
|
2723
|
+
];
|
|
2724
|
+
|
|
2725
|
+
// ../../shared-editor-ui/dist/components/EditorSelect.js
|
|
2726
|
+
var import_jsx_runtime14 = __toESM(require_jsx_runtime(), 1);
|
|
2727
|
+
var import_react6 = __toESM(require_react(), 1);
|
|
2728
|
+
|
|
2729
|
+
// ../../shared-editor-ui/dist/components/EditorTextarea.js
|
|
2730
|
+
var import_jsx_runtime15 = __toESM(require_jsx_runtime(), 1);
|
|
2731
|
+
var import_react7 = __toESM(require_react(), 1);
|
|
2732
|
+
|
|
2733
|
+
// ../../shared-editor-ui/dist/components/ElementHighlight.js
|
|
2734
|
+
var import_jsx_runtime16 = __toESM(require_jsx_runtime(), 1);
|
|
2735
|
+
var import_react_dom2 = __toESM(require_react_dom(), 1);
|
|
2736
|
+
|
|
2737
|
+
// ../../shared-editor-ui/dist/hooks/useElementRect.js
|
|
2738
|
+
var import_react8 = __toESM(require_react(), 1);
|
|
2739
|
+
|
|
2740
|
+
// ../../shared-editor-ui/dist/components/EmptyState.js
|
|
2741
|
+
var import_jsx_runtime17 = __toESM(require_jsx_runtime(), 1);
|
|
2742
|
+
|
|
2743
|
+
// ../../shared-editor-ui/dist/components/GroupHeader.js
|
|
2744
|
+
var import_jsx_runtime18 = __toESM(require_jsx_runtime(), 1);
|
|
2745
|
+
|
|
2746
|
+
// ../../shared-editor-ui/dist/components/itemCardHeader.js
|
|
2747
|
+
import { html, nothing } from "lit";
|
|
2748
|
+
function itemCardHeader(opts) {
|
|
2749
|
+
const { label, labelClickable = false, onLabelClick, kindShort, statusPill = nothing, onDelete, deleteTestid, deleteLabel = "Delete" } = opts;
|
|
2750
|
+
return html`
|
|
2751
|
+
<div class="se-flex se-items-center se-gap-2">
|
|
2752
|
+
<span
|
|
2753
|
+
role=${labelClickable ? "button" : nothing}
|
|
2754
|
+
tabindex=${labelClickable ? "0" : nothing}
|
|
2755
|
+
@click=${labelClickable && onLabelClick ? onLabelClick : nothing}
|
|
2756
|
+
@keydown=${labelClickable && onLabelClick ? (e) => {
|
|
2757
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
2758
|
+
e.preventDefault();
|
|
2759
|
+
onLabelClick();
|
|
2760
|
+
}
|
|
2761
|
+
} : nothing}
|
|
2762
|
+
class="se-flex-1 se-overflow-hidden se-text-ellipsis se-whitespace-nowrap se-text-sm se-text-text-primary ${labelClickable ? "se-cursor-pointer" : ""}"
|
|
2763
|
+
>
|
|
2764
|
+
${label}
|
|
2765
|
+
</span>
|
|
2766
|
+
${kindShort ? html`<span class="se-text-[10px] se-text-text-tertiary se-uppercase">${kindShort}</span>` : nothing}
|
|
2767
|
+
${statusPill}
|
|
2768
|
+
${onDelete ? html`<button
|
|
2769
|
+
type="button"
|
|
2770
|
+
data-testid=${deleteTestid ?? "delete-item"}
|
|
2771
|
+
aria-label=${deleteLabel}
|
|
2772
|
+
@click=${(e) => {
|
|
2773
|
+
e.stopPropagation();
|
|
2774
|
+
onDelete(e);
|
|
2775
|
+
}}
|
|
2776
|
+
class="se-shrink-0 se-px-1.5 se-py-0.5 se-text-xs se-text-text-tertiary hover:se-text-red-4 se-bg-transparent se-border-none se-cursor-pointer"
|
|
2777
|
+
>✕</button>` : nothing}
|
|
2778
|
+
</div>
|
|
2779
|
+
`;
|
|
2780
|
+
}
|
|
2781
|
+
|
|
2782
|
+
// ../../shared-editor-ui/dist/components/TriggerJourney.js
|
|
2783
|
+
var import_jsx_runtime19 = __toESM(require_jsx_runtime(), 1);
|
|
2784
|
+
|
|
2785
|
+
// ../../shared-editor-ui/dist/controllers/PanelShellController.js
|
|
2786
|
+
var DEFAULTS = {
|
|
2787
|
+
minWidth: panel_shell_default.behavior.minWidth,
|
|
2788
|
+
minHeight: panel_shell_default.behavior.minHeight,
|
|
2789
|
+
dragThreshold: panel_shell_default.behavior.dragThreshold,
|
|
2790
|
+
snapThreshold: panel_shell_default.behavior.snapThreshold,
|
|
2791
|
+
fabSize: panel_shell_default.fab.size,
|
|
2792
|
+
fabInset: panel_shell_default.fab.inset,
|
|
2793
|
+
storageKey: "syntro:editor-panel"
|
|
2794
|
+
};
|
|
2795
|
+
var HANDLE_SIZE2 = panel_shell_default.behavior.handleSize;
|
|
2796
|
+
|
|
2797
|
+
// ../../shared-editor-ui/dist/hooks/useTriggerWhenStatus.js
|
|
2798
|
+
var import_react9 = __toESM(require_react(), 1);
|
|
2799
|
+
|
|
2800
|
+
// ../../../tests/fixtures/action-step-field-mapping.json
|
|
2801
|
+
var action_step_field_mapping_default = {
|
|
2802
|
+
field_mapping: {
|
|
2803
|
+
event: {
|
|
2804
|
+
action_step_key: "event",
|
|
2805
|
+
hogql: "event",
|
|
2806
|
+
athena: "event_category",
|
|
2807
|
+
athena_transform: "category_map",
|
|
2808
|
+
runtime_event_field: "name",
|
|
2809
|
+
runtime_transform: "event_name_map"
|
|
2810
|
+
},
|
|
2811
|
+
text: {
|
|
2812
|
+
action_step_key: "text",
|
|
2813
|
+
hogql: "properties.$el_text",
|
|
2814
|
+
athena: "el_text",
|
|
2815
|
+
runtime_element_field: "$el_text"
|
|
2816
|
+
},
|
|
2817
|
+
tag_name: {
|
|
2818
|
+
action_step_key: "tag_name",
|
|
2819
|
+
hogql: "properties.$el_tag_name",
|
|
2820
|
+
athena: "tag_name",
|
|
2821
|
+
runtime_element_field: "tag_name"
|
|
2822
|
+
},
|
|
2823
|
+
url: {
|
|
2824
|
+
action_step_key: "url",
|
|
2825
|
+
hogql: "properties.$current_url",
|
|
2826
|
+
hogql_match: "like",
|
|
2827
|
+
athena: "pathname",
|
|
2828
|
+
athena_match: "like",
|
|
2829
|
+
athena_transform: "url_to_path",
|
|
2830
|
+
runtime_prop: "url"
|
|
2831
|
+
},
|
|
2832
|
+
selector: {
|
|
2833
|
+
action_step_key: "selector",
|
|
2834
|
+
hogql: "properties.$el_selector",
|
|
2835
|
+
athena: "el_selector",
|
|
2836
|
+
runtime_element_field: null
|
|
2837
|
+
}
|
|
2838
|
+
},
|
|
2839
|
+
event_category_map: {
|
|
2840
|
+
$autocapture: "click",
|
|
2841
|
+
$pageview: "pageview",
|
|
2842
|
+
$pageleave: "pageleave",
|
|
2843
|
+
$feature_flag_called: "feature_flag"
|
|
2844
|
+
},
|
|
2845
|
+
event_name_map: {
|
|
2846
|
+
$autocapture: "ui.click",
|
|
2847
|
+
$pageview: "nav.page_view",
|
|
2848
|
+
$pageleave: "nav.page_leave"
|
|
2849
|
+
},
|
|
2850
|
+
interactive_tags: ["a", "button", "input", "select", "textarea", "form", "summary"],
|
|
2851
|
+
interactive_roles: [
|
|
2852
|
+
"button",
|
|
2853
|
+
"link",
|
|
2854
|
+
"menuitem",
|
|
2855
|
+
"tab",
|
|
2856
|
+
"switch",
|
|
2857
|
+
"checkbox",
|
|
2858
|
+
"radio",
|
|
2859
|
+
"option"
|
|
2860
|
+
],
|
|
2861
|
+
test_cases: [
|
|
2862
|
+
{
|
|
2863
|
+
name: "CTA button click \u2014 span inside anchor",
|
|
2864
|
+
action_step: {
|
|
2865
|
+
event: "$autocapture",
|
|
2866
|
+
tag_name: "a",
|
|
2867
|
+
text: "Start Free Filing"
|
|
2868
|
+
},
|
|
2869
|
+
posthog_event: {
|
|
2870
|
+
event: "$autocapture",
|
|
2871
|
+
properties: {
|
|
2872
|
+
$current_url: "https://taxinator.com/",
|
|
2873
|
+
$el_text: "Start Free Filing",
|
|
2874
|
+
$elements: [
|
|
2875
|
+
{ tag_name: "span", $el_text: "Start Free Filing" },
|
|
2876
|
+
{
|
|
2877
|
+
tag_name: "a",
|
|
2878
|
+
$el_text: "Start Free Filing \u2192",
|
|
2879
|
+
attr__href: "/dashboard",
|
|
2880
|
+
"attr__data-cta": "hero-primary"
|
|
2881
|
+
},
|
|
2882
|
+
{ tag_name: "div", $el_text: "" },
|
|
2883
|
+
{ tag_name: "section", $el_text: "" }
|
|
2884
|
+
]
|
|
2885
|
+
}
|
|
2886
|
+
},
|
|
2887
|
+
should_match_hogql: true,
|
|
2888
|
+
should_match_athena: true,
|
|
2889
|
+
recommended_index: 1,
|
|
2890
|
+
expected_action_step_from_recommended: {
|
|
2891
|
+
event: "$autocapture",
|
|
2892
|
+
tag_name: "a",
|
|
2893
|
+
text: "Start Free Filing \u2192",
|
|
2894
|
+
url: "https://taxinator.com/"
|
|
2895
|
+
}
|
|
2896
|
+
},
|
|
2897
|
+
{
|
|
2898
|
+
name: "Pageview from link href",
|
|
2899
|
+
action_step: {
|
|
2900
|
+
event: "$pageview",
|
|
2901
|
+
url: "/pricing"
|
|
2902
|
+
},
|
|
2903
|
+
posthog_event: {
|
|
2904
|
+
event: "$pageview",
|
|
2905
|
+
properties: {
|
|
2906
|
+
$current_url: "https://taxinator.com/pricing",
|
|
2907
|
+
$elements: [
|
|
2908
|
+
{ tag_name: "a", $el_text: "See Plans & Pricing", attr__href: "/pricing" }
|
|
2909
|
+
]
|
|
2910
|
+
}
|
|
2911
|
+
},
|
|
2912
|
+
should_match_hogql: true,
|
|
2913
|
+
should_match_athena: true,
|
|
2914
|
+
recommended_index: 0,
|
|
2915
|
+
expected_action_step_from_recommended: {
|
|
2916
|
+
event: "$pageview",
|
|
2917
|
+
tag_name: "a",
|
|
2918
|
+
text: "See Plans & Pricing",
|
|
2919
|
+
url: "https://taxinator.com/pricing"
|
|
2920
|
+
}
|
|
2921
|
+
},
|
|
2922
|
+
{
|
|
2923
|
+
name: "Non-matching \u2014 wrong tag and text",
|
|
2924
|
+
action_step: {
|
|
2925
|
+
event: "$autocapture",
|
|
2926
|
+
tag_name: "button",
|
|
2927
|
+
text: "Submit"
|
|
2928
|
+
},
|
|
2929
|
+
posthog_event: {
|
|
2930
|
+
event: "$autocapture",
|
|
2931
|
+
properties: {
|
|
2932
|
+
$current_url: "https://taxinator.com/",
|
|
2933
|
+
$el_text: "Cancel",
|
|
2934
|
+
$elements: [
|
|
2935
|
+
{ tag_name: "span", $el_text: "Cancel" },
|
|
2936
|
+
{ tag_name: "a", $el_text: "Cancel", attr__href: "/home" }
|
|
2937
|
+
]
|
|
2938
|
+
}
|
|
2939
|
+
},
|
|
2940
|
+
should_match_hogql: false,
|
|
2941
|
+
should_match_athena: false,
|
|
2942
|
+
recommended_index: 1,
|
|
2943
|
+
expected_action_step_from_recommended: {
|
|
2944
|
+
event: "$autocapture",
|
|
2945
|
+
tag_name: "a",
|
|
2946
|
+
text: "Cancel",
|
|
2947
|
+
url: "https://taxinator.com/"
|
|
2948
|
+
}
|
|
2949
|
+
},
|
|
2950
|
+
{
|
|
2951
|
+
name: "Selector only \u2014 matches HogQL and Athena",
|
|
2952
|
+
action_step: {
|
|
2953
|
+
event: "$autocapture",
|
|
2954
|
+
selector: "#signup-btn"
|
|
2955
|
+
},
|
|
2956
|
+
posthog_event: {
|
|
2957
|
+
event: "$autocapture",
|
|
2958
|
+
properties: {
|
|
2959
|
+
$current_url: "https://taxinator.com/",
|
|
2960
|
+
$el_selector: "#signup-btn",
|
|
2961
|
+
$elements: [
|
|
2962
|
+
{ tag_name: "button", $el_text: "Sign Up", $el_selector: "#signup-btn" }
|
|
2963
|
+
]
|
|
2964
|
+
}
|
|
2965
|
+
},
|
|
2966
|
+
should_match_hogql: true,
|
|
2967
|
+
should_match_athena: true,
|
|
2968
|
+
recommended_index: 0,
|
|
2969
|
+
expected_action_step_from_recommended: {
|
|
2970
|
+
event: "$autocapture",
|
|
2971
|
+
tag_name: "button",
|
|
2972
|
+
text: "Sign Up",
|
|
2973
|
+
url: "https://taxinator.com/",
|
|
2974
|
+
selector: "#signup-btn"
|
|
2975
|
+
}
|
|
2976
|
+
},
|
|
2977
|
+
{
|
|
2978
|
+
name: "No interactive ancestor \u2014 falls back to elements[0]",
|
|
2979
|
+
action_step: {
|
|
2980
|
+
event: "$autocapture",
|
|
2981
|
+
tag_name: "div",
|
|
2982
|
+
text: "Hero Banner"
|
|
2983
|
+
},
|
|
2984
|
+
posthog_event: {
|
|
2985
|
+
event: "$autocapture",
|
|
2986
|
+
properties: {
|
|
2987
|
+
$current_url: "https://taxinator.com/",
|
|
2988
|
+
$el_text: "Hero Banner",
|
|
2989
|
+
$elements: [
|
|
2990
|
+
{ tag_name: "div", $el_text: "Hero Banner" },
|
|
2991
|
+
{ tag_name: "section", $el_text: "" },
|
|
2992
|
+
{ tag_name: "main", $el_text: "" }
|
|
2993
|
+
]
|
|
2994
|
+
}
|
|
2995
|
+
},
|
|
2996
|
+
should_match_hogql: true,
|
|
2997
|
+
should_match_athena: true,
|
|
2998
|
+
recommended_index: 0,
|
|
2999
|
+
expected_action_step_from_recommended: {
|
|
3000
|
+
event: "$autocapture",
|
|
3001
|
+
tag_name: "div",
|
|
3002
|
+
text: "Hero Banner",
|
|
3003
|
+
url: "https://taxinator.com/"
|
|
3004
|
+
}
|
|
3005
|
+
}
|
|
3006
|
+
]
|
|
3007
|
+
};
|
|
3008
|
+
|
|
3009
|
+
// ../../shared-editor-ui/dist/utils/elementChainRecommender.js
|
|
3010
|
+
var INTERACTIVE_TAGS = new Set(action_step_field_mapping_default.interactive_tags);
|
|
3011
|
+
var INTERACTIVE_ROLES = new Set(action_step_field_mapping_default.interactive_roles);
|
|
3012
|
+
|
|
1
3013
|
// src/editor.ts
|
|
2
|
-
import { html, LitElement, nothing } from "lit";
|
|
3014
|
+
import { html as html10, LitElement as LitElement9, nothing as nothing5 } from "lit";
|
|
3015
|
+
|
|
3016
|
+
// ../../shared-editor-ui/src/components/AnchorPickerLit.ts
|
|
3017
|
+
import { html as html2, LitElement, render as litRender, nothing as nothing2 } from "lit";
|
|
3018
|
+
import { styleMap } from "lit/directives/style-map.js";
|
|
3019
|
+
|
|
3020
|
+
// ../../shared-editor-ui/src/utils/selectorGenerator.ts
|
|
3021
|
+
var DEFAULT_OPTIONS2 = {
|
|
3022
|
+
includeTag: true,
|
|
3023
|
+
preferTestIds: true,
|
|
3024
|
+
maxCombinations: 100
|
|
3025
|
+
};
|
|
3026
|
+
function generateSelector2(element, options = {}) {
|
|
3027
|
+
const opts = { ...DEFAULT_OPTIONS2, ...options };
|
|
3028
|
+
const selectors = [];
|
|
3029
|
+
selectors.push("id");
|
|
3030
|
+
if (opts.preferTestIds) {
|
|
3031
|
+
selectors.push("attribute");
|
|
3032
|
+
}
|
|
3033
|
+
selectors.push("class");
|
|
3034
|
+
selectors.push("tag");
|
|
3035
|
+
selectors.push("nthchild");
|
|
3036
|
+
selectors.push("nthoftype");
|
|
3037
|
+
try {
|
|
3038
|
+
const selector = getCssSelector(element, {
|
|
3039
|
+
selectors,
|
|
3040
|
+
includeTag: opts.includeTag,
|
|
3041
|
+
maxCombinations: opts.maxCombinations,
|
|
3042
|
+
// Blacklist common dynamic class patterns
|
|
3043
|
+
blacklist: [
|
|
3044
|
+
// Dynamic class patterns
|
|
3045
|
+
/^[a-z]+-[a-f0-9]{5,}$/i,
|
|
3046
|
+
// hash-based classes like "css-1abc23"
|
|
3047
|
+
/^_[a-zA-Z0-9]+$/,
|
|
3048
|
+
// CSS module classes like "_1abc23"
|
|
3049
|
+
/^svelte-[a-z0-9]+$/i,
|
|
3050
|
+
// Svelte scoped classes
|
|
3051
|
+
/^vue-[a-z0-9]+$/i,
|
|
3052
|
+
// Vue scoped classes
|
|
3053
|
+
/^emotion-[0-9]+$/,
|
|
3054
|
+
// Emotion CSS-in-JS
|
|
3055
|
+
/^sc-[a-zA-Z]+$/,
|
|
3056
|
+
// styled-components
|
|
3057
|
+
// State classes that may change
|
|
3058
|
+
/^(is-|has-|js-)/,
|
|
3059
|
+
/^(active|selected|focused|disabled|hidden|visible)$/,
|
|
3060
|
+
// Animation/transition classes
|
|
3061
|
+
/^(fade|slide|animate)/,
|
|
3062
|
+
/-(enter|leave|active)(-active|-done)?$/
|
|
3063
|
+
],
|
|
3064
|
+
// Whitelist stable attribute selectors
|
|
3065
|
+
whitelist: [
|
|
3066
|
+
/^data-testid$/,
|
|
3067
|
+
/^data-cy$/,
|
|
3068
|
+
/^data-test$/,
|
|
3069
|
+
/^data-qa$/,
|
|
3070
|
+
/^aria-label$/,
|
|
3071
|
+
/^role$/,
|
|
3072
|
+
/^name$/,
|
|
3073
|
+
/^type$/,
|
|
3074
|
+
/^href$/
|
|
3075
|
+
]
|
|
3076
|
+
});
|
|
3077
|
+
return selector;
|
|
3078
|
+
} catch (error) {
|
|
3079
|
+
console.warn("[SelectorGenerator] Failed to generate selector:", error);
|
|
3080
|
+
return generateFallbackSelector(element);
|
|
3081
|
+
}
|
|
3082
|
+
}
|
|
3083
|
+
function generateFallbackSelector(element) {
|
|
3084
|
+
const path = [];
|
|
3085
|
+
let current = element;
|
|
3086
|
+
while (current && current !== document.body && current !== document.documentElement) {
|
|
3087
|
+
let selector = current.tagName.toLowerCase();
|
|
3088
|
+
if (current.id) {
|
|
3089
|
+
selector = `#${CSS.escape(current.id)}`;
|
|
3090
|
+
path.unshift(selector);
|
|
3091
|
+
break;
|
|
3092
|
+
}
|
|
3093
|
+
const parent = current.parentElement;
|
|
3094
|
+
if (parent) {
|
|
3095
|
+
const siblings = Array.from(parent.children);
|
|
3096
|
+
const index = siblings.indexOf(current) + 1;
|
|
3097
|
+
selector += `:nth-child(${index})`;
|
|
3098
|
+
}
|
|
3099
|
+
path.unshift(selector);
|
|
3100
|
+
current = parent;
|
|
3101
|
+
}
|
|
3102
|
+
return path.join(" > ");
|
|
3103
|
+
}
|
|
3104
|
+
function validateSelector2(selector, expectedElement) {
|
|
3105
|
+
try {
|
|
3106
|
+
const matched = document.querySelector(selector);
|
|
3107
|
+
return matched === expectedElement;
|
|
3108
|
+
} catch {
|
|
3109
|
+
return false;
|
|
3110
|
+
}
|
|
3111
|
+
}
|
|
3112
|
+
function getElementDescription2(element) {
|
|
3113
|
+
const tag = element.tagName.toLowerCase();
|
|
3114
|
+
const id = element.id ? `#${element.id}` : "";
|
|
3115
|
+
const classes = element.className && typeof element.className === "string" ? `.${element.className.split(" ").filter((c) => c && !isDynamicClass(c)).slice(0, 2).join(".")}` : "";
|
|
3116
|
+
const text = element.textContent?.trim().slice(0, 30) || "";
|
|
3117
|
+
const textPreview = text ? ` "${text}${text.length >= 30 ? "..." : ""}"` : "";
|
|
3118
|
+
return `${tag}${id}${classes}${textPreview}`.trim();
|
|
3119
|
+
}
|
|
3120
|
+
function isDynamicClass(className) {
|
|
3121
|
+
const dynamicPatterns = [
|
|
3122
|
+
/^[a-z]+-[a-f0-9]{5,}$/i,
|
|
3123
|
+
/^_[a-zA-Z0-9]+$/,
|
|
3124
|
+
/^svelte-[a-z0-9]+$/i,
|
|
3125
|
+
/^vue-[a-z0-9]+$/i,
|
|
3126
|
+
/^emotion-[0-9]+$/,
|
|
3127
|
+
/^sc-[a-zA-Z]+$/
|
|
3128
|
+
];
|
|
3129
|
+
return dynamicPatterns.some((pattern) => pattern.test(className));
|
|
3130
|
+
}
|
|
3131
|
+
|
|
3132
|
+
// ../../shared-editor-ui/src/components/AnchorPickerLit.ts
|
|
3133
|
+
var HIGHLIGHT_COLOR = colors_default.blue[4];
|
|
3134
|
+
var HIGHLIGHT_BG = "rgba(25, 105, 254, 0.1)";
|
|
3135
|
+
var DEFAULT_EXCLUDE_SELECTOR = "[data-syntro-editor-panel], [data-shadow-canvas-id], .syntro-tooltip, .syntro-modal, .syntro-highlight, [data-syntro-anchor-picker]";
|
|
3136
|
+
var AnchorPickerLit = class extends LitElement {
|
|
3137
|
+
constructor() {
|
|
3138
|
+
super(...arguments);
|
|
3139
|
+
this.isActive = false;
|
|
3140
|
+
this.passthroughClicks = false;
|
|
3141
|
+
this.excludeSelector = DEFAULT_EXCLUDE_SELECTOR;
|
|
3142
|
+
// Internal state
|
|
3143
|
+
this._hoveredElement = null;
|
|
3144
|
+
this._hoveredSelector = "";
|
|
3145
|
+
// DOM ref for the overlay (lives in _portalDiv, not in this element)
|
|
3146
|
+
this._overlayEl = null;
|
|
3147
|
+
// Portal div appended to document.body to escape backdrop-filter containing block
|
|
3148
|
+
this._portalDiv = null;
|
|
3149
|
+
this._handleMouseMove = (e) => {
|
|
3150
|
+
const overlay2 = this._overlayEl;
|
|
3151
|
+
const shadowHost = this._getShadowHost();
|
|
3152
|
+
if (overlay2 && !this.passthroughClicks) {
|
|
3153
|
+
overlay2.style.pointerEvents = "none";
|
|
3154
|
+
}
|
|
3155
|
+
const prevHostVis = shadowHost?.style.visibility;
|
|
3156
|
+
if (shadowHost) shadowHost.style.visibility = "hidden";
|
|
3157
|
+
const elementAtPoint = document.elementFromPoint(e.clientX, e.clientY);
|
|
3158
|
+
if (shadowHost) shadowHost.style.visibility = prevHostVis ?? "";
|
|
3159
|
+
if (overlay2 && !this.passthroughClicks) {
|
|
3160
|
+
overlay2.style.pointerEvents = "auto";
|
|
3161
|
+
}
|
|
3162
|
+
if (!elementAtPoint) {
|
|
3163
|
+
this._hoveredElement = null;
|
|
3164
|
+
this._hoveredSelector = "";
|
|
3165
|
+
return;
|
|
3166
|
+
}
|
|
3167
|
+
if (this.excludeSelector && elementAtPoint.closest(this.excludeSelector)) {
|
|
3168
|
+
this._hoveredElement = null;
|
|
3169
|
+
this._hoveredSelector = "";
|
|
3170
|
+
return;
|
|
3171
|
+
}
|
|
3172
|
+
if (["HTML", "BODY", "HEAD"].includes(elementAtPoint.tagName)) {
|
|
3173
|
+
this._hoveredElement = null;
|
|
3174
|
+
this._hoveredSelector = "";
|
|
3175
|
+
return;
|
|
3176
|
+
}
|
|
3177
|
+
this._hoveredElement = elementAtPoint;
|
|
3178
|
+
this._hoveredSelector = generateSelector2(elementAtPoint);
|
|
3179
|
+
};
|
|
3180
|
+
this._handleClick = (e) => {
|
|
3181
|
+
if (this.passthroughClicks) return;
|
|
3182
|
+
e.preventDefault();
|
|
3183
|
+
e.stopPropagation();
|
|
3184
|
+
if (this._hoveredElement && this._hoveredSelector) {
|
|
3185
|
+
let selector = this._hoveredSelector;
|
|
3186
|
+
if (!validateSelector2(selector, this._hoveredElement)) {
|
|
3187
|
+
selector = generateSelector2(this._hoveredElement);
|
|
3188
|
+
}
|
|
3189
|
+
this.dispatchEvent(
|
|
3190
|
+
new CustomEvent("pick", {
|
|
3191
|
+
detail: {
|
|
3192
|
+
element: this._hoveredElement,
|
|
3193
|
+
selector,
|
|
3194
|
+
description: getElementDescription2(this._hoveredElement)
|
|
3195
|
+
},
|
|
3196
|
+
bubbles: true,
|
|
3197
|
+
composed: true
|
|
3198
|
+
})
|
|
3199
|
+
);
|
|
3200
|
+
}
|
|
3201
|
+
};
|
|
3202
|
+
this._handleKeyDown = (e) => {
|
|
3203
|
+
if (e.key === "Escape") {
|
|
3204
|
+
e.preventDefault();
|
|
3205
|
+
this.dispatchEvent(
|
|
3206
|
+
new CustomEvent("cancel", {
|
|
3207
|
+
bubbles: true,
|
|
3208
|
+
composed: true
|
|
3209
|
+
})
|
|
3210
|
+
);
|
|
3211
|
+
}
|
|
3212
|
+
};
|
|
3213
|
+
}
|
|
3214
|
+
// No _bound* wrappers needed — methods are arrow class fields
|
|
3215
|
+
createRenderRoot() {
|
|
3216
|
+
return this;
|
|
3217
|
+
}
|
|
3218
|
+
connectedCallback() {
|
|
3219
|
+
super.connectedCallback();
|
|
3220
|
+
if (this.isActive) {
|
|
3221
|
+
this._attachDocumentListeners();
|
|
3222
|
+
}
|
|
3223
|
+
}
|
|
3224
|
+
disconnectedCallback() {
|
|
3225
|
+
super.disconnectedCallback();
|
|
3226
|
+
this._detachDocumentListeners();
|
|
3227
|
+
this._destroyPortal();
|
|
3228
|
+
}
|
|
3229
|
+
updated(changed) {
|
|
3230
|
+
if (changed.has("isActive")) {
|
|
3231
|
+
if (this.isActive) {
|
|
3232
|
+
this._attachDocumentListeners();
|
|
3233
|
+
} else {
|
|
3234
|
+
this._detachDocumentListeners();
|
|
3235
|
+
this._hoveredElement = null;
|
|
3236
|
+
this._hoveredSelector = "";
|
|
3237
|
+
}
|
|
3238
|
+
}
|
|
3239
|
+
this._syncPortal();
|
|
3240
|
+
}
|
|
3241
|
+
// ---- PORTAL MANAGEMENT ----
|
|
3242
|
+
/**
|
|
3243
|
+
* Create or update the body-level portal div.
|
|
3244
|
+
* Rendering into document.body ensures position:fixed coordinates are
|
|
3245
|
+
* relative to the viewport, not an ancestor with backdrop-filter.
|
|
3246
|
+
*/
|
|
3247
|
+
_syncPortal() {
|
|
3248
|
+
if (!this.isActive) {
|
|
3249
|
+
this._destroyPortal();
|
|
3250
|
+
return;
|
|
3251
|
+
}
|
|
3252
|
+
if (!this._portalDiv) {
|
|
3253
|
+
this._portalDiv = document.createElement("div");
|
|
3254
|
+
this._portalDiv.setAttribute("data-syntro-anchor-picker-container", "");
|
|
3255
|
+
document.body.appendChild(this._portalDiv);
|
|
3256
|
+
}
|
|
3257
|
+
litRender(this._overlayTemplate(), this._portalDiv);
|
|
3258
|
+
this._overlayEl = this._portalDiv.querySelector("[data-syntro-anchor-picker]");
|
|
3259
|
+
}
|
|
3260
|
+
_destroyPortal() {
|
|
3261
|
+
if (this._portalDiv) {
|
|
3262
|
+
litRender(nothing2, this._portalDiv);
|
|
3263
|
+
this._portalDiv.remove();
|
|
3264
|
+
this._portalDiv = null;
|
|
3265
|
+
this._overlayEl = null;
|
|
3266
|
+
}
|
|
3267
|
+
}
|
|
3268
|
+
// ---- DOCUMENT LISTENERS ----
|
|
3269
|
+
_attachDocumentListeners() {
|
|
3270
|
+
document.addEventListener("mousemove", this._handleMouseMove, true);
|
|
3271
|
+
if (!this.passthroughClicks) {
|
|
3272
|
+
document.addEventListener("click", this._handleClick, true);
|
|
3273
|
+
}
|
|
3274
|
+
document.addEventListener("keydown", this._handleKeyDown, true);
|
|
3275
|
+
}
|
|
3276
|
+
_detachDocumentListeners() {
|
|
3277
|
+
document.removeEventListener("mousemove", this._handleMouseMove, true);
|
|
3278
|
+
document.removeEventListener("click", this._handleClick, true);
|
|
3279
|
+
document.removeEventListener("keydown", this._handleKeyDown, true);
|
|
3280
|
+
}
|
|
3281
|
+
// ---- EVENT HANDLERS ----
|
|
3282
|
+
/**
|
|
3283
|
+
* Resolve the shadow host this picker lives inside, if any. When the picker
|
|
3284
|
+
* is mounted inside a shadow root (e.g. the editor SDK mounts inside
|
|
3285
|
+
* `<smart-canvas>`'s shadow), `document.elementFromPoint` returns the shadow
|
|
3286
|
+
* *host*, not the host page element beneath. Temporarily disabling pointer
|
|
3287
|
+
* events on the host lets hit-testing fall through to the host page.
|
|
3288
|
+
*/
|
|
3289
|
+
_getShadowHost() {
|
|
3290
|
+
const root = this.getRootNode();
|
|
3291
|
+
if (root instanceof ShadowRoot) return root.host;
|
|
3292
|
+
return null;
|
|
3293
|
+
}
|
|
3294
|
+
// ---- RENDER ----
|
|
3295
|
+
// The component itself renders nothing — all overlay HTML lives in _portalDiv
|
|
3296
|
+
// (a div appended to document.body), managed by _syncPortal().
|
|
3297
|
+
render() {
|
|
3298
|
+
return nothing2;
|
|
3299
|
+
}
|
|
3300
|
+
_overlayTemplate() {
|
|
3301
|
+
if (!this.isActive) return nothing2;
|
|
3302
|
+
const hovered = this._hoveredElement;
|
|
3303
|
+
const rect = hovered?.getBoundingClientRect() ?? null;
|
|
3304
|
+
return html2`
|
|
3305
|
+
<div
|
|
3306
|
+
data-syntro-anchor-picker
|
|
3307
|
+
style=${styleMap({
|
|
3308
|
+
position: "fixed",
|
|
3309
|
+
inset: "0",
|
|
3310
|
+
cursor: "crosshair",
|
|
3311
|
+
zIndex: "2147483644",
|
|
3312
|
+
pointerEvents: this.passthroughClicks ? "none" : "auto"
|
|
3313
|
+
})}
|
|
3314
|
+
>
|
|
3315
|
+
<!-- Semi-transparent overlay -->
|
|
3316
|
+
<div
|
|
3317
|
+
style=${styleMap({
|
|
3318
|
+
position: "absolute",
|
|
3319
|
+
inset: "0",
|
|
3320
|
+
background: "rgba(0, 0, 0, 0.08)",
|
|
3321
|
+
pointerEvents: "none"
|
|
3322
|
+
})}
|
|
3323
|
+
></div>
|
|
3324
|
+
|
|
3325
|
+
<!-- Element highlight -->
|
|
3326
|
+
${hovered && rect ? html2`<div
|
|
3327
|
+
style=${styleMap({
|
|
3328
|
+
position: "fixed",
|
|
3329
|
+
left: `${rect.left - 2}px`,
|
|
3330
|
+
top: `${rect.top - 2}px`,
|
|
3331
|
+
width: `${rect.width + 4}px`,
|
|
3332
|
+
height: `${rect.height + 4}px`,
|
|
3333
|
+
border: `2px solid ${HIGHLIGHT_COLOR}`,
|
|
3334
|
+
backgroundColor: HIGHLIGHT_BG,
|
|
3335
|
+
borderRadius: "4px",
|
|
3336
|
+
boxShadow: "0 0 0 9999px rgba(0, 0, 0, 0.2)",
|
|
3337
|
+
pointerEvents: "none",
|
|
3338
|
+
transition: "all 0.1s ease-out"
|
|
3339
|
+
})}
|
|
3340
|
+
></div>` : nothing2}
|
|
3341
|
+
|
|
3342
|
+
<!-- Element info tooltip near hovered element -->
|
|
3343
|
+
${hovered && rect ? html2`<div
|
|
3344
|
+
class="se-text-xs"
|
|
3345
|
+
style=${styleMap({
|
|
3346
|
+
position: "fixed",
|
|
3347
|
+
left: `${Math.max(8, Math.min(rect.left, window.innerWidth - 320))}px`,
|
|
3348
|
+
top: `${Math.max(8, rect.top - 68)}px`,
|
|
3349
|
+
backgroundColor: colors_default.slateGrey[3],
|
|
3350
|
+
color: colors_default.slateGrey[11],
|
|
3351
|
+
padding: "8px 12px",
|
|
3352
|
+
borderRadius: "6px",
|
|
3353
|
+
boxShadow: "0 4px 12px rgba(0, 0, 0, 0.3)",
|
|
3354
|
+
zIndex: "1",
|
|
3355
|
+
fontFamily: "monospace",
|
|
3356
|
+
maxWidth: "300px",
|
|
3357
|
+
pointerEvents: "none"
|
|
3358
|
+
})}
|
|
3359
|
+
>
|
|
3360
|
+
<div
|
|
3361
|
+
class="se-text-xs"
|
|
3362
|
+
style=${styleMap({
|
|
3363
|
+
textTransform: "uppercase",
|
|
3364
|
+
letterSpacing: "0.05em",
|
|
3365
|
+
marginBottom: "4px",
|
|
3366
|
+
color: colors_default.slateGrey[9]
|
|
3367
|
+
})}
|
|
3368
|
+
>
|
|
3369
|
+
Click to select
|
|
3370
|
+
</div>
|
|
3371
|
+
<div
|
|
3372
|
+
style=${styleMap({
|
|
3373
|
+
color: colors_default.blue[5],
|
|
3374
|
+
overflow: "hidden",
|
|
3375
|
+
textOverflow: "ellipsis",
|
|
3376
|
+
whiteSpace: "nowrap"
|
|
3377
|
+
})}
|
|
3378
|
+
>
|
|
3379
|
+
${this._hoveredSelector}
|
|
3380
|
+
</div>
|
|
3381
|
+
<div
|
|
3382
|
+
style=${styleMap({
|
|
3383
|
+
marginTop: "4px",
|
|
3384
|
+
color: colors_default.slateGrey[10],
|
|
3385
|
+
overflow: "hidden",
|
|
3386
|
+
textOverflow: "ellipsis",
|
|
3387
|
+
whiteSpace: "nowrap"
|
|
3388
|
+
})}
|
|
3389
|
+
>
|
|
3390
|
+
${getElementDescription2(hovered)}
|
|
3391
|
+
</div>
|
|
3392
|
+
</div>` : nothing2}
|
|
3393
|
+
</div>
|
|
3394
|
+
`;
|
|
3395
|
+
}
|
|
3396
|
+
};
|
|
3397
|
+
AnchorPickerLit.properties = {
|
|
3398
|
+
isActive: { type: Boolean, attribute: "is-active" },
|
|
3399
|
+
passthroughClicks: { type: Boolean, attribute: "passthrough-clicks" },
|
|
3400
|
+
excludeSelector: { type: String, attribute: "exclude-selector" },
|
|
3401
|
+
// Internal reactive state (not attributes)
|
|
3402
|
+
_hoveredElement: { state: true },
|
|
3403
|
+
_hoveredSelector: { state: true }
|
|
3404
|
+
};
|
|
3405
|
+
if (!customElements.get("se-anchor-picker")) {
|
|
3406
|
+
customElements.define("se-anchor-picker", AnchorPickerLit);
|
|
3407
|
+
}
|
|
3408
|
+
|
|
3409
|
+
// ../../shared-editor-ui/src/components/AnchorPillLit.ts
|
|
3410
|
+
import { html as html3, LitElement as LitElement2 } from "lit";
|
|
3411
|
+
var AnchorPillLit = class extends LitElement2 {
|
|
3412
|
+
constructor() {
|
|
3413
|
+
super(...arguments);
|
|
3414
|
+
this.state = "missing";
|
|
3415
|
+
this.route = void 0;
|
|
3416
|
+
this.selector = void 0;
|
|
3417
|
+
this.testidKey = "no-anchor";
|
|
3418
|
+
this.testidPrefix = "anchor-pill";
|
|
3419
|
+
this._onLocate = (e) => {
|
|
3420
|
+
e.stopPropagation();
|
|
3421
|
+
this.dispatchEvent(
|
|
3422
|
+
new CustomEvent("se-anchor-locate", {
|
|
3423
|
+
detail: { selector: this.selector },
|
|
3424
|
+
bubbles: true,
|
|
3425
|
+
composed: true
|
|
3426
|
+
})
|
|
3427
|
+
);
|
|
3428
|
+
};
|
|
3429
|
+
this._onNavigate = (e) => {
|
|
3430
|
+
e.stopPropagation();
|
|
3431
|
+
if (!this.route) return;
|
|
3432
|
+
this.dispatchEvent(
|
|
3433
|
+
new CustomEvent("se-anchor-navigate", {
|
|
3434
|
+
detail: { route: this.route },
|
|
3435
|
+
bubbles: true,
|
|
3436
|
+
composed: true
|
|
3437
|
+
})
|
|
3438
|
+
);
|
|
3439
|
+
};
|
|
3440
|
+
}
|
|
3441
|
+
createRenderRoot() {
|
|
3442
|
+
return this;
|
|
3443
|
+
}
|
|
3444
|
+
render() {
|
|
3445
|
+
const baseCls = "se-shrink-0 se-inline-flex se-items-center se-justify-center se-gap-1 se-px-3 se-py-1 se-rounded-md se-border se-text-xs se-font-semibold se-leading-5 se-cursor-pointer se-whitespace-nowrap";
|
|
3446
|
+
const greenCls = "se-border-green-4/60 se-bg-green-4/10 se-text-green-5 hover:se-bg-green-4/20";
|
|
3447
|
+
const redCls = "se-border-red-4/60 se-bg-red-4/10 se-text-red-5 se-cursor-not-allowed";
|
|
3448
|
+
const testid = `${this.testidPrefix}-${this.testidKey}`;
|
|
3449
|
+
if (this.state === "locate") {
|
|
3450
|
+
return html3`<button
|
|
3451
|
+
type="button"
|
|
3452
|
+
data-testid=${testid}
|
|
3453
|
+
data-state="locate"
|
|
3454
|
+
title="Scroll to element"
|
|
3455
|
+
@click=${this._onLocate}
|
|
3456
|
+
class="${baseCls} ${greenCls}"
|
|
3457
|
+
>
|
|
3458
|
+
Locate
|
|
3459
|
+
</button>`;
|
|
3460
|
+
}
|
|
3461
|
+
if (this.state === "navigate" && this.route) {
|
|
3462
|
+
return html3`<button
|
|
3463
|
+
type="button"
|
|
3464
|
+
data-testid=${testid}
|
|
3465
|
+
data-state="navigate"
|
|
3466
|
+
title=${`Navigate to ${this.route}`}
|
|
3467
|
+
@click=${this._onNavigate}
|
|
3468
|
+
class="${baseCls} ${greenCls}"
|
|
3469
|
+
>
|
|
3470
|
+
Go to ${this.route}
|
|
3471
|
+
</button>`;
|
|
3472
|
+
}
|
|
3473
|
+
return html3`<span
|
|
3474
|
+
data-testid=${testid}
|
|
3475
|
+
data-state="missing"
|
|
3476
|
+
title="Anchor not available on this page"
|
|
3477
|
+
class="${baseCls} ${redCls}"
|
|
3478
|
+
>
|
|
3479
|
+
Not found
|
|
3480
|
+
</span>`;
|
|
3481
|
+
}
|
|
3482
|
+
};
|
|
3483
|
+
AnchorPillLit.properties = {
|
|
3484
|
+
state: { type: String },
|
|
3485
|
+
route: { type: String },
|
|
3486
|
+
selector: { type: String },
|
|
3487
|
+
/** Stable id used to build a deterministic data-testid. */
|
|
3488
|
+
testidKey: { type: String, attribute: "testid-key" },
|
|
3489
|
+
/** Prefix for the data-testid: e.g. "locate-content", "locate-overlay". */
|
|
3490
|
+
testidPrefix: { type: String, attribute: "testid-prefix" }
|
|
3491
|
+
};
|
|
3492
|
+
if (!customElements.get("se-anchor-pill")) {
|
|
3493
|
+
customElements.define("se-anchor-pill", AnchorPillLit);
|
|
3494
|
+
}
|
|
3495
|
+
|
|
3496
|
+
// ../../shared-editor-ui/src/components/EditorCardLit.ts
|
|
3497
|
+
import { html as html4, LitElement as LitElement3 } from "lit";
|
|
3498
|
+
var EditorCardLit = class extends LitElement3 {
|
|
3499
|
+
constructor() {
|
|
3500
|
+
super(...arguments);
|
|
3501
|
+
this.itemKey = "";
|
|
3502
|
+
this.validated = false;
|
|
3503
|
+
this.clickable = false;
|
|
3504
|
+
this._handleClick = () => {
|
|
3505
|
+
if (!this.clickable) return;
|
|
3506
|
+
this.dispatchEvent(
|
|
3507
|
+
new CustomEvent("card-click", {
|
|
3508
|
+
detail: { itemKey: this.itemKey },
|
|
3509
|
+
bubbles: true,
|
|
3510
|
+
composed: true
|
|
3511
|
+
})
|
|
3512
|
+
);
|
|
3513
|
+
};
|
|
3514
|
+
this._handleKeyDown = (e) => {
|
|
3515
|
+
if (!this.clickable) return;
|
|
3516
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
3517
|
+
e.preventDefault();
|
|
3518
|
+
this._handleClick();
|
|
3519
|
+
}
|
|
3520
|
+
};
|
|
3521
|
+
this._handleMouseEnter = () => {
|
|
3522
|
+
this.dispatchEvent(
|
|
3523
|
+
new CustomEvent("card-mouseenter", {
|
|
3524
|
+
detail: { itemKey: this.itemKey },
|
|
3525
|
+
bubbles: true,
|
|
3526
|
+
composed: true
|
|
3527
|
+
})
|
|
3528
|
+
);
|
|
3529
|
+
};
|
|
3530
|
+
this._handleMouseLeave = () => {
|
|
3531
|
+
this.dispatchEvent(
|
|
3532
|
+
new CustomEvent("card-mouseleave", {
|
|
3533
|
+
detail: { itemKey: this.itemKey },
|
|
3534
|
+
bubbles: true,
|
|
3535
|
+
composed: true
|
|
3536
|
+
})
|
|
3537
|
+
);
|
|
3538
|
+
};
|
|
3539
|
+
}
|
|
3540
|
+
render() {
|
|
3541
|
+
const base = "py-2 px-2.5 rounded-lg border shadow-sm mb-1 text-sm";
|
|
3542
|
+
const borderCls = this.validated ? "border-green-500/50" : "border-white/10";
|
|
3543
|
+
const bgCls = "bg-white/[0.02]";
|
|
3544
|
+
const colorCls = "text-slate-200";
|
|
3545
|
+
const interactiveCls = this.clickable ? "cursor-pointer hover:border-white/20 hover:bg-white/[0.04] transition-colors" : "";
|
|
3546
|
+
return html4`
|
|
3547
|
+
<style>
|
|
3548
|
+
:host { display: block; }
|
|
3549
|
+
.card {
|
|
3550
|
+
padding: 8px 10px;
|
|
3551
|
+
border-radius: 8px;
|
|
3552
|
+
border: 1px solid rgba(255,255,255,0.1);
|
|
3553
|
+
background: rgba(255,255,255,0.02);
|
|
3554
|
+
box-shadow: 0 1px 2px rgba(0,0,0,0.1);
|
|
3555
|
+
margin-bottom: 4px;
|
|
3556
|
+
font-size: 14px;
|
|
3557
|
+
color: #e2e8f0;
|
|
3558
|
+
}
|
|
3559
|
+
.card.validated {
|
|
3560
|
+
border-color: rgba(34,197,94,0.5);
|
|
3561
|
+
box-shadow: 0 0 8px rgba(34,197,94,0.15);
|
|
3562
|
+
}
|
|
3563
|
+
.card.clickable {
|
|
3564
|
+
cursor: pointer;
|
|
3565
|
+
transition: border-color 0.15s, background 0.15s;
|
|
3566
|
+
}
|
|
3567
|
+
.card.clickable:hover {
|
|
3568
|
+
border-color: rgba(255,255,255,0.2);
|
|
3569
|
+
background: rgba(255,255,255,0.04);
|
|
3570
|
+
}
|
|
3571
|
+
</style>
|
|
3572
|
+
<div
|
|
3573
|
+
class="card ${this.validated ? "validated" : ""} ${this.clickable ? "clickable" : ""}"
|
|
3574
|
+
data-item-key=${this.itemKey}
|
|
3575
|
+
role=${this.clickable ? "button" : ""}
|
|
3576
|
+
tabindex=${this.clickable ? "0" : ""}
|
|
3577
|
+
@click=${this._handleClick}
|
|
3578
|
+
@keydown=${this._handleKeyDown}
|
|
3579
|
+
@mouseenter=${this._handleMouseEnter}
|
|
3580
|
+
@mouseleave=${this._handleMouseLeave}
|
|
3581
|
+
>
|
|
3582
|
+
<slot></slot>
|
|
3583
|
+
</div>
|
|
3584
|
+
`;
|
|
3585
|
+
}
|
|
3586
|
+
};
|
|
3587
|
+
EditorCardLit.properties = {
|
|
3588
|
+
itemKey: { type: String, attribute: "item-key" },
|
|
3589
|
+
cardClass: { type: String, attribute: "card-class" },
|
|
3590
|
+
validated: { type: Boolean },
|
|
3591
|
+
clickable: { type: Boolean }
|
|
3592
|
+
};
|
|
3593
|
+
if (!customElements.get("se-editor-card")) {
|
|
3594
|
+
customElements.define("se-editor-card", EditorCardLit);
|
|
3595
|
+
}
|
|
3596
|
+
|
|
3597
|
+
// ../../shared-editor-ui/src/components/EditorPanelShellLit.ts
|
|
3598
|
+
import { html as html5, LitElement as LitElement4, nothing as nothing3 } from "lit";
|
|
3599
|
+
import { styleMap as styleMap2 } from "lit/directives/style-map.js";
|
|
3600
|
+
var STORAGE_KEY = "syntro:editor-panel";
|
|
3601
|
+
var MIN_WIDTH2 = panel_shell_default.behavior.minWidth;
|
|
3602
|
+
var MIN_HEIGHT2 = panel_shell_default.behavior.minHeight;
|
|
3603
|
+
var FAB_SIZE2 = panel_shell_default.fab.size;
|
|
3604
|
+
var FAB_INSET2 = panel_shell_default.fab.inset;
|
|
3605
|
+
var SNAP_THRESHOLD2 = panel_shell_default.behavior.snapThreshold;
|
|
3606
|
+
var DRAG_THRESHOLD2 = panel_shell_default.behavior.dragThreshold;
|
|
3607
|
+
var HANDLE_SIZE3 = panel_shell_default.behavior.handleSize;
|
|
3608
|
+
function getDefaultGeometry() {
|
|
3609
|
+
return {
|
|
3610
|
+
x: 0,
|
|
3611
|
+
y: 0,
|
|
3612
|
+
width: MIN_WIDTH2,
|
|
3613
|
+
height: typeof window !== "undefined" ? window.innerHeight : 800,
|
|
3614
|
+
docked: "left"
|
|
3615
|
+
};
|
|
3616
|
+
}
|
|
3617
|
+
function loadGeometry(storageKey) {
|
|
3618
|
+
if (typeof window === "undefined") return getDefaultGeometry();
|
|
3619
|
+
try {
|
|
3620
|
+
const raw = localStorage.getItem(storageKey);
|
|
3621
|
+
if (raw) {
|
|
3622
|
+
const parsed = JSON.parse(raw);
|
|
3623
|
+
return {
|
|
3624
|
+
x: typeof parsed.x === "number" ? parsed.x : 0,
|
|
3625
|
+
y: typeof parsed.y === "number" ? parsed.y : 0,
|
|
3626
|
+
width: Math.max(MIN_WIDTH2, typeof parsed.width === "number" ? parsed.width : MIN_WIDTH2),
|
|
3627
|
+
height: Math.max(
|
|
3628
|
+
MIN_HEIGHT2,
|
|
3629
|
+
typeof parsed.height === "number" ? parsed.height : window.innerHeight
|
|
3630
|
+
),
|
|
3631
|
+
docked: parsed.docked === "left" || parsed.docked === "right" ? parsed.docked : null
|
|
3632
|
+
};
|
|
3633
|
+
}
|
|
3634
|
+
} catch {
|
|
3635
|
+
}
|
|
3636
|
+
return getDefaultGeometry();
|
|
3637
|
+
}
|
|
3638
|
+
function saveGeometry(storageKey, geo) {
|
|
3639
|
+
try {
|
|
3640
|
+
localStorage.setItem(storageKey, JSON.stringify(geo));
|
|
3641
|
+
} catch {
|
|
3642
|
+
}
|
|
3643
|
+
}
|
|
3644
|
+
function getPanelRect(geo) {
|
|
3645
|
+
if (geo.docked === "left") {
|
|
3646
|
+
return { top: 0, left: 0, width: geo.width, height: window.innerHeight };
|
|
3647
|
+
}
|
|
3648
|
+
if (geo.docked === "right") {
|
|
3649
|
+
return {
|
|
3650
|
+
top: 0,
|
|
3651
|
+
left: window.innerWidth - geo.width,
|
|
3652
|
+
width: geo.width,
|
|
3653
|
+
height: window.innerHeight
|
|
3654
|
+
};
|
|
3655
|
+
}
|
|
3656
|
+
const { x: left, y: top, width, height } = geo;
|
|
3657
|
+
return { top, left, width, height };
|
|
3658
|
+
}
|
|
3659
|
+
function getFabPosition(geo) {
|
|
3660
|
+
const rect = getPanelRect(geo);
|
|
3661
|
+
return {
|
|
3662
|
+
left: rect.left + FAB_INSET2,
|
|
3663
|
+
top: rect.top + FAB_INSET2
|
|
3664
|
+
};
|
|
3665
|
+
}
|
|
3666
|
+
function clampToViewport(geo) {
|
|
3667
|
+
if (geo.docked) return geo;
|
|
3668
|
+
const vw = window.innerWidth;
|
|
3669
|
+
const vh = window.innerHeight;
|
|
3670
|
+
return {
|
|
3671
|
+
...geo,
|
|
3672
|
+
x: Math.max(-(geo.width - FAB_SIZE2), Math.min(geo.x, vw - FAB_SIZE2)),
|
|
3673
|
+
y: Math.max(-FAB_INSET2, Math.min(geo.y, vh - FAB_SIZE2 - FAB_INSET2))
|
|
3674
|
+
};
|
|
3675
|
+
}
|
|
3676
|
+
function undockGeometry(geo) {
|
|
3677
|
+
const rect = getPanelRect(geo);
|
|
3678
|
+
return {
|
|
3679
|
+
x: rect.left,
|
|
3680
|
+
y: rect.top,
|
|
3681
|
+
width: geo.width,
|
|
3682
|
+
height: rect.height,
|
|
3683
|
+
docked: null
|
|
3684
|
+
};
|
|
3685
|
+
}
|
|
3686
|
+
var RESIZE_HANDLES2 = [
|
|
3687
|
+
{
|
|
3688
|
+
dir: "n",
|
|
3689
|
+
style: {
|
|
3690
|
+
top: "0",
|
|
3691
|
+
left: `${HANDLE_SIZE3}px`,
|
|
3692
|
+
right: `${HANDLE_SIZE3}px`,
|
|
3693
|
+
height: `${HANDLE_SIZE3}px`
|
|
3694
|
+
},
|
|
3695
|
+
cursor: "ns-resize"
|
|
3696
|
+
},
|
|
3697
|
+
{
|
|
3698
|
+
dir: "s",
|
|
3699
|
+
style: {
|
|
3700
|
+
bottom: "0",
|
|
3701
|
+
left: `${HANDLE_SIZE3}px`,
|
|
3702
|
+
right: `${HANDLE_SIZE3}px`,
|
|
3703
|
+
height: `${HANDLE_SIZE3}px`
|
|
3704
|
+
},
|
|
3705
|
+
cursor: "ns-resize"
|
|
3706
|
+
},
|
|
3707
|
+
{
|
|
3708
|
+
dir: "e",
|
|
3709
|
+
style: {
|
|
3710
|
+
right: "0",
|
|
3711
|
+
top: `${HANDLE_SIZE3}px`,
|
|
3712
|
+
bottom: `${HANDLE_SIZE3}px`,
|
|
3713
|
+
width: `${HANDLE_SIZE3}px`
|
|
3714
|
+
},
|
|
3715
|
+
cursor: "ew-resize"
|
|
3716
|
+
},
|
|
3717
|
+
{
|
|
3718
|
+
dir: "w",
|
|
3719
|
+
style: {
|
|
3720
|
+
left: "0",
|
|
3721
|
+
top: `${HANDLE_SIZE3}px`,
|
|
3722
|
+
bottom: `${HANDLE_SIZE3}px`,
|
|
3723
|
+
width: `${HANDLE_SIZE3}px`
|
|
3724
|
+
},
|
|
3725
|
+
cursor: "ew-resize"
|
|
3726
|
+
},
|
|
3727
|
+
{
|
|
3728
|
+
dir: "ne",
|
|
3729
|
+
style: { top: "0", right: "0", width: `${HANDLE_SIZE3 * 2}px`, height: `${HANDLE_SIZE3 * 2}px` },
|
|
3730
|
+
cursor: "nesw-resize"
|
|
3731
|
+
},
|
|
3732
|
+
{
|
|
3733
|
+
dir: "nw",
|
|
3734
|
+
style: { top: "0", left: "0", width: `${HANDLE_SIZE3 * 2}px`, height: `${HANDLE_SIZE3 * 2}px` },
|
|
3735
|
+
cursor: "nwse-resize"
|
|
3736
|
+
},
|
|
3737
|
+
{
|
|
3738
|
+
dir: "se",
|
|
3739
|
+
style: {
|
|
3740
|
+
bottom: "0",
|
|
3741
|
+
right: "0",
|
|
3742
|
+
width: `${HANDLE_SIZE3 * 2}px`,
|
|
3743
|
+
height: `${HANDLE_SIZE3 * 2}px`
|
|
3744
|
+
},
|
|
3745
|
+
cursor: "nwse-resize"
|
|
3746
|
+
},
|
|
3747
|
+
{
|
|
3748
|
+
dir: "sw",
|
|
3749
|
+
style: {
|
|
3750
|
+
bottom: "0",
|
|
3751
|
+
left: "0",
|
|
3752
|
+
width: `${HANDLE_SIZE3 * 2}px`,
|
|
3753
|
+
height: `${HANDLE_SIZE3 * 2}px`
|
|
3754
|
+
},
|
|
3755
|
+
cursor: "nesw-resize"
|
|
3756
|
+
}
|
|
3757
|
+
];
|
|
3758
|
+
var syntroLogoSvg = html5`<svg
|
|
3759
|
+
aria-hidden="true"
|
|
3760
|
+
width="28"
|
|
3761
|
+
height="18"
|
|
3762
|
+
viewBox="0 0 101 63"
|
|
3763
|
+
fill="none"
|
|
3764
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
3765
|
+
>
|
|
3766
|
+
<g clip-path="url(#syntro-fab-clip)">
|
|
3767
|
+
<path
|
|
3768
|
+
d="M51.989 0.284C52.386 0.29 52.808 0.341 53.192 0.443C53.769 0.596 54.362 0.983 54.745 1.442C55.895 2.822 56.767 4.782 57.669 6.357C59.947 10.334 62.152 14.372 64.498 18.307C64.671 18.597 65.127 19.343 65.475 19.411C66.654 19.641 79.278 11.523 81.123 10.317C80.704 8.6 80.624 7.21 81.334 5.525C82.014 3.916 83.317 2.651 84.946 2.019C86.593 1.366 88.286 1.42 89.902 2.123C91.486 2.795 92.733 4.076 93.363 5.677C95.111 10.218 91.347 15.013 86.561 14.442C85.392 14.302 84.649 13.927 83.6 13.441C76.542 18.247 69.094 22.597 61.207 25.907C60.153 26.349 59.42 26.6 58.519 27.328C60.583 27.43 87.034 24.236 87.878 23.781C87.926 23.755 88.048 23.697 88.08 23.652C88.244 23.421 88.277 23.007 88.376 22.735C88.819 21.511 89.563 20.379 90.604 19.586C91.887 18.608 93.6 18.093 95.208 18.324C96.992 18.581 98.67 19.55 99.74 21.005C100.733 22.364 101.141 24.064 100.875 25.726C100.607 27.394 99.692 28.888 98.329 29.887C96.02 31.573 92.641 31.613 90.392 29.789C89.579 29.13 89.177 28.535 88.566 27.692C86.692 28.103 83.447 28.463 81.472 28.73C76.577 29.399 71.671 29.99 66.756 30.504C65.752 30.608 59.279 31.013 58.779 31.24L58.781 31.387C59.106 31.577 66.974 33.025 68.328 33.358C72.475 34.405 76.572 35.64 80.606 37.06C82.709 37.818 84.721 38.686 86.814 39.457C88.505 38.051 89.243 36.875 91.925 36.841C93.665 36.833 95.339 37.506 96.589 38.717C97.986 40.087 98.415 41.541 98.429 43.422C98.417 44.842 98.099 45.978 97.229 47.137C96.168 48.531 94.597 49.447 92.86 49.682C91.161 49.922 89.437 49.472 88.073 48.431C86.201 47.02 85.795 45.462 85.488 43.323C85.255 43.193 85.018 43.071 84.776 42.958C83.907 42.553 78.511 40.359 77.911 40.577C77.837 41.147 78.926 42.592 79.243 43.155L84.336 52.073C85.165 53.529 86.027 54.991 86.789 56.483C87.253 57.391 87.414 58.355 87.056 59.343C86.557 60.722 85.014 61.408 83.626 61.438C81.429 61.427 79.228 61.427 77.029 61.427L62.967 61.427L35.549 61.435C33.337 61.436 20.693 61.626 19.579 61.199C18.758 60.889 18.093 60.265 17.732 59.465C17.455 58.844 17.335 57.994 17.577 57.361C18.242 55.623 19.5 53.659 20.438 52.043L28.119 39.028C28.9 37.701 31.213 33.891 31.7 32.634C25.671 32.936 18.736 32.547 12.6 32.721C11.75 34.138 10.992 35.281 9.368 35.935C7.744 36.588 5.704 36.604 4.097 35.922C2.546 35.272 1.319 34.028 0.69 32.468C0.053 30.839 0.086 29.025 0.781 27.42C2.812 22.739 9.259 22.202 12.05 26.464C12.555 27.235 12.774 27.84 13.104 28.703L26.462 28.711C28.926 28.713 31.729 28.779 34.17 28.668C35.279 26.892 36.442 24.733 37.515 22.901L45.376 9.375C46.797 6.902 48.214 4.368 49.685 1.924C50.222 1.032 50.962 0.493 51.989 0.284ZM22.119 57.31C23.512 57.503 26.045 57.431 27.526 57.429L36.661 57.42L68.412 57.422C73.113 57.421 77.994 57.351 82.68 57.438L75.664 45.098C74.562 43.171 73.093 40.773 72.104 38.827C71.245 38.351 70.291 38.109 69.335 37.848C59.189 35.076 48.669 33.421 38.172 32.796C37.642 32.764 36.994 32.766 36.469 32.794L25.855 50.865C24.634 52.935 23.364 55.302 22.119 57.31ZM52.216 5.513C49.384 10.611 46.473 15.665 43.484 20.673C42.193 22.878 40.862 25.071 39.63 27.31C39.46 27.618 39.36 27.782 39.453 28.133C40.522 28.342 45.866 26.973 47.112 26.644C49.169 26.137 60.135 22.684 61.174 21.436C61.248 21.163 61.287 21.069 61.125 20.762C60.279 19.163 59.326 17.527 58.435 15.958L53.592 7.329C53.355 6.915 52.677 5.599 52.216 5.513ZM96.18 26.494C96.963 25.713 97.12 24.502 96.563 23.547C96.005 22.592 94.872 22.133 93.807 22.432C92.972 22.666 92.324 23.327 92.108 24.167C91.892 25.007 92.14 25.899 92.758 26.507C93.396 27.134 94.327 27.361 95.182 27.096C95.558 26.98 95.901 26.773 96.18 26.494ZM87.871 10.399C89.147 10.087 89.941 8.813 89.659 7.529C89.377 6.246 88.122 5.422 86.832 5.673C85.97 5.841 85.266 6.463 84.994 7.298C84.722 8.133 84.923 9.05 85.52 9.694C86.118 10.339 87.017 10.608 87.871 10.399ZM91.505 40.879C90.185 41.122 89.31 42.388 89.55 43.709C89.791 45.03 91.055 45.907 92.377 45.669C93.22 45.517 93.921 44.933 94.223 44.131C94.525 43.329 94.383 42.428 93.85 41.758C93.29 41.055 92.389 40.717 91.505 40.879ZM9.138 29.557C9.005 28.88 8.592 28.292 8.001 27.937C7.409 27.583 6.696 27.495 6.036 27.697C5.665 27.81 5.326 28.011 5.048 28.282C4.24 29.07 4.079 30.31 4.66 31.278C5.241 32.247 6.411 32.688 7.487 32.346C8.666 31.97 9.376 30.771 9.138 29.557Z"
|
|
3769
|
+
fill="currentColor"
|
|
3770
|
+
/>
|
|
3771
|
+
</g>
|
|
3772
|
+
<defs>
|
|
3773
|
+
<clipPath id="syntro-fab-clip">
|
|
3774
|
+
<rect width="101" height="63" fill="white" />
|
|
3775
|
+
</clipPath>
|
|
3776
|
+
</defs>
|
|
3777
|
+
</svg>`;
|
|
3778
|
+
var EditorPanelShellLit = class extends LitElement4 {
|
|
3779
|
+
constructor() {
|
|
3780
|
+
super(...arguments);
|
|
3781
|
+
this.isOpen = false;
|
|
3782
|
+
this.zIndex = 2147483647;
|
|
3783
|
+
// Internal geometry state
|
|
3784
|
+
this._geometry = getDefaultGeometry();
|
|
3785
|
+
// DOM refs (set in render via query after update)
|
|
3786
|
+
this._panelEl = null;
|
|
3787
|
+
this._fabEl = null;
|
|
3788
|
+
// Drag state (imperative refs for performance -- no re-renders during drag)
|
|
3789
|
+
this._isDragging = false;
|
|
3790
|
+
this._hasMoved = false;
|
|
3791
|
+
this._dragOffset = { x: 0, y: 0 };
|
|
3792
|
+
this._startPanelPos = { x: 0, y: 0 };
|
|
3793
|
+
this._pendingGeo = null;
|
|
3794
|
+
// Resize state
|
|
3795
|
+
this._activeResize = null;
|
|
3796
|
+
this._resizeStartMouse = { x: 0, y: 0 };
|
|
3797
|
+
this._resizeStartGeo = getDefaultGeometry();
|
|
3798
|
+
this._handleWindowResize = () => {
|
|
3799
|
+
this._updateGeometry(clampToViewport(this._geometry));
|
|
3800
|
+
};
|
|
3801
|
+
}
|
|
3802
|
+
// No _bound* wrapper needed — method is an arrow class field
|
|
3803
|
+
get _storageKey() {
|
|
3804
|
+
return this.panelId ? `syntro:editor-panel:${this.panelId}` : STORAGE_KEY;
|
|
3805
|
+
}
|
|
3806
|
+
createRenderRoot() {
|
|
3807
|
+
return this;
|
|
3808
|
+
}
|
|
3809
|
+
connectedCallback() {
|
|
3810
|
+
super.connectedCallback();
|
|
3811
|
+
this._geometry = loadGeometry(this._storageKey);
|
|
3812
|
+
window.addEventListener("resize", this._handleWindowResize);
|
|
3813
|
+
}
|
|
3814
|
+
disconnectedCallback() {
|
|
3815
|
+
super.disconnectedCallback();
|
|
3816
|
+
window.removeEventListener("resize", this._handleWindowResize);
|
|
3817
|
+
}
|
|
3818
|
+
updated() {
|
|
3819
|
+
this._panelEl = this.querySelector("[data-syntro-editor-panel]");
|
|
3820
|
+
this._fabEl = this.querySelector("[data-syntro-fab]");
|
|
3821
|
+
}
|
|
3822
|
+
// ---- HELPERS ----
|
|
3823
|
+
_updateGeometry(geo) {
|
|
3824
|
+
this._geometry = geo;
|
|
3825
|
+
saveGeometry(this._storageKey, geo);
|
|
3826
|
+
this.requestUpdate();
|
|
3827
|
+
}
|
|
3828
|
+
_emitToggle() {
|
|
3829
|
+
this.dispatchEvent(
|
|
3830
|
+
new CustomEvent("toggle", {
|
|
3831
|
+
bubbles: true,
|
|
3832
|
+
composed: true
|
|
3833
|
+
})
|
|
3834
|
+
);
|
|
3835
|
+
}
|
|
3836
|
+
// ---- FAB DRAG HANDLERS ----
|
|
3837
|
+
_handleFabPointerDown(e) {
|
|
3838
|
+
this._isDragging = true;
|
|
3839
|
+
this._hasMoved = false;
|
|
3840
|
+
const rect = getPanelRect(this._geometry);
|
|
3841
|
+
this._startPanelPos = { x: rect.left, y: rect.top };
|
|
3842
|
+
this._dragOffset = {
|
|
3843
|
+
x: e.clientX - rect.left,
|
|
3844
|
+
y: e.clientY - rect.top
|
|
3845
|
+
};
|
|
3846
|
+
e.target.setPointerCapture(e.pointerId);
|
|
3847
|
+
e.preventDefault();
|
|
3848
|
+
}
|
|
3849
|
+
_handleFabPointerMove(e) {
|
|
3850
|
+
if (!this._isDragging) return;
|
|
3851
|
+
const newX = e.clientX - this._dragOffset.x;
|
|
3852
|
+
const newY = e.clientY - this._dragOffset.y;
|
|
3853
|
+
if (!this._hasMoved) {
|
|
3854
|
+
const dx = Math.abs(newX - this._startPanelPos.x);
|
|
3855
|
+
const dy = Math.abs(newY - this._startPanelPos.y);
|
|
3856
|
+
if (dx < DRAG_THRESHOLD2 && dy < DRAG_THRESHOLD2) return;
|
|
3857
|
+
this._hasMoved = true;
|
|
3858
|
+
}
|
|
3859
|
+
const geo = this._geometry;
|
|
3860
|
+
const height = geo.docked ? window.innerHeight : geo.height;
|
|
3861
|
+
if (this._panelEl) {
|
|
3862
|
+
this._panelEl.style.left = `${newX}px`;
|
|
3863
|
+
this._panelEl.style.top = `${newY}px`;
|
|
3864
|
+
this._panelEl.style.right = "auto";
|
|
3865
|
+
this._panelEl.style.height = `${height}px`;
|
|
3866
|
+
}
|
|
3867
|
+
if (this._fabEl) {
|
|
3868
|
+
this._fabEl.style.left = `${newX + FAB_INSET2}px`;
|
|
3869
|
+
this._fabEl.style.top = `${newY + FAB_INSET2}px`;
|
|
3870
|
+
}
|
|
3871
|
+
this._pendingGeo = { x: newX, y: newY, width: geo.width, height, docked: null };
|
|
3872
|
+
}
|
|
3873
|
+
_handleFabPointerUp(e) {
|
|
3874
|
+
e.target.releasePointerCapture(e.pointerId);
|
|
3875
|
+
const wasDragging = this._hasMoved;
|
|
3876
|
+
this._isDragging = false;
|
|
3877
|
+
this._hasMoved = false;
|
|
3878
|
+
if (!wasDragging) {
|
|
3879
|
+
this._emitToggle();
|
|
3880
|
+
return;
|
|
3881
|
+
}
|
|
3882
|
+
if (this._pendingGeo) {
|
|
3883
|
+
const geo = this._pendingGeo;
|
|
3884
|
+
if (geo.x <= SNAP_THRESHOLD2) {
|
|
3885
|
+
this._updateGeometry({ ...geo, docked: "left", x: 0, y: 0 });
|
|
3886
|
+
} else if (geo.x + geo.width >= window.innerWidth - SNAP_THRESHOLD2) {
|
|
3887
|
+
this._updateGeometry({ ...geo, docked: "right", x: 0, y: 0 });
|
|
3888
|
+
} else {
|
|
3889
|
+
this._updateGeometry(geo);
|
|
3890
|
+
}
|
|
3891
|
+
this._pendingGeo = null;
|
|
3892
|
+
}
|
|
3893
|
+
}
|
|
3894
|
+
// ---- RESIZE HANDLERS ----
|
|
3895
|
+
_handleResizePointerDown(e) {
|
|
3896
|
+
const dir = e.currentTarget.dataset.resizeDir;
|
|
3897
|
+
if (!dir) return;
|
|
3898
|
+
let geo = this._geometry;
|
|
3899
|
+
if (geo.docked) {
|
|
3900
|
+
geo = undockGeometry(geo);
|
|
3901
|
+
this._updateGeometry(geo);
|
|
3902
|
+
}
|
|
3903
|
+
this._activeResize = dir;
|
|
3904
|
+
this._resizeStartMouse = { x: e.clientX, y: e.clientY };
|
|
3905
|
+
this._resizeStartGeo = { ...geo };
|
|
3906
|
+
e.target.setPointerCapture(e.pointerId);
|
|
3907
|
+
e.preventDefault();
|
|
3908
|
+
}
|
|
3909
|
+
_handleResizePointerMove(e) {
|
|
3910
|
+
if (!this._activeResize) return;
|
|
3911
|
+
const dx = e.clientX - this._resizeStartMouse.x;
|
|
3912
|
+
const dy = e.clientY - this._resizeStartMouse.y;
|
|
3913
|
+
const dir = this._activeResize;
|
|
3914
|
+
const start = this._resizeStartGeo;
|
|
3915
|
+
let { x, y, width, height } = start;
|
|
3916
|
+
if (dir.includes("e")) width = Math.max(MIN_WIDTH2, start.width + dx);
|
|
3917
|
+
if (dir.includes("w")) {
|
|
3918
|
+
const newW = Math.max(MIN_WIDTH2, start.width - dx);
|
|
3919
|
+
x = start.x + start.width - newW;
|
|
3920
|
+
width = newW;
|
|
3921
|
+
}
|
|
3922
|
+
if (dir.includes("s")) height = Math.max(MIN_HEIGHT2, start.height + dy);
|
|
3923
|
+
if (dir.includes("n")) {
|
|
3924
|
+
const newH = Math.max(MIN_HEIGHT2, start.height - dy);
|
|
3925
|
+
y = start.y + start.height - newH;
|
|
3926
|
+
height = newH;
|
|
3927
|
+
}
|
|
3928
|
+
if (this._panelEl) {
|
|
3929
|
+
this._panelEl.style.left = `${x}px`;
|
|
3930
|
+
this._panelEl.style.top = `${y}px`;
|
|
3931
|
+
this._panelEl.style.width = `${width}px`;
|
|
3932
|
+
this._panelEl.style.height = `${height}px`;
|
|
3933
|
+
}
|
|
3934
|
+
if (this._fabEl) {
|
|
3935
|
+
this._fabEl.style.left = `${x + FAB_INSET2}px`;
|
|
3936
|
+
this._fabEl.style.top = `${y + FAB_INSET2}px`;
|
|
3937
|
+
}
|
|
3938
|
+
this._pendingGeo = { x, y, width, height, docked: null };
|
|
3939
|
+
}
|
|
3940
|
+
_handleResizePointerUp(e) {
|
|
3941
|
+
e.target.releasePointerCapture(e.pointerId);
|
|
3942
|
+
this._activeResize = null;
|
|
3943
|
+
if (this._pendingGeo) {
|
|
3944
|
+
this._updateGeometry(this._pendingGeo);
|
|
3945
|
+
this._pendingGeo = null;
|
|
3946
|
+
}
|
|
3947
|
+
}
|
|
3948
|
+
// ---- COMPUTED STYLES ----
|
|
3949
|
+
_getPanelClasses() {
|
|
3950
|
+
const geo = this._geometry;
|
|
3951
|
+
const isDocked = geo.docked !== null;
|
|
3952
|
+
const base = "syntro-editor-scope se-fixed se-flex se-flex-col se-text-text-primary se-backdrop-blur-xl se-font-sans se-antialiased se-overflow-hidden";
|
|
3953
|
+
if (isDocked) {
|
|
3954
|
+
return geo.docked === "right" ? `${base} se-border-l se-border-border-primary` : `${base} se-border-r se-border-border-primary`;
|
|
3955
|
+
}
|
|
3956
|
+
return `${base} se-rounded-lg se-border se-border-border-primary`;
|
|
3957
|
+
}
|
|
3958
|
+
_getPanelStyles() {
|
|
3959
|
+
const geo = this._geometry;
|
|
3960
|
+
const isDocked = geo.docked !== null;
|
|
3961
|
+
const styles = {
|
|
3962
|
+
position: "fixed",
|
|
3963
|
+
zIndex: String(this.zIndex),
|
|
3964
|
+
// Re-enable pointer events — parent editor container uses pointer-events:none
|
|
3965
|
+
// so clicks pass through to elements beneath (e.g., the launcher FAB).
|
|
3966
|
+
pointerEvents: "auto",
|
|
3967
|
+
background: panel_shell_default.background,
|
|
3968
|
+
backdropFilter: `blur(${panel_shell_default.backdropBlur})`,
|
|
3969
|
+
webkitBackdropFilter: `blur(${panel_shell_default.backdropBlur})`,
|
|
3970
|
+
boxShadow: isDocked ? geo.docked === "right" ? panel_shell_default.shadows.dockedRight : panel_shell_default.shadows.dockedLeft : panel_shell_default.shadows.floating,
|
|
3971
|
+
overflowY: "auto",
|
|
3972
|
+
overscrollBehavior: "contain"
|
|
3973
|
+
};
|
|
3974
|
+
if (geo.docked === "left") {
|
|
3975
|
+
styles.top = "0";
|
|
3976
|
+
styles.left = "0";
|
|
3977
|
+
styles.width = `${geo.width}px`;
|
|
3978
|
+
styles.height = "100vh";
|
|
3979
|
+
} else if (geo.docked === "right") {
|
|
3980
|
+
styles.top = "0";
|
|
3981
|
+
styles.right = "0";
|
|
3982
|
+
styles.width = `${geo.width}px`;
|
|
3983
|
+
styles.height = "100vh";
|
|
3984
|
+
} else {
|
|
3985
|
+
styles.top = `${geo.y}px`;
|
|
3986
|
+
styles.left = `${geo.x}px`;
|
|
3987
|
+
styles.width = `${geo.width}px`;
|
|
3988
|
+
styles.height = `${geo.height}px`;
|
|
3989
|
+
}
|
|
3990
|
+
return styles;
|
|
3991
|
+
}
|
|
3992
|
+
_getFabStyles() {
|
|
3993
|
+
const fabPos = getFabPosition(this._geometry);
|
|
3994
|
+
return {
|
|
3995
|
+
position: "fixed",
|
|
3996
|
+
left: `${fabPos.left}px`,
|
|
3997
|
+
top: `${fabPos.top}px`,
|
|
3998
|
+
zIndex: String(this.zIndex),
|
|
3999
|
+
// Re-enable pointer events — parent editor container uses pointer-events:none
|
|
4000
|
+
pointerEvents: "auto",
|
|
4001
|
+
width: `${FAB_SIZE2}px`,
|
|
4002
|
+
height: `${FAB_SIZE2}px`,
|
|
4003
|
+
borderRadius: "50%",
|
|
4004
|
+
border: panel_shell_default.fab.border,
|
|
4005
|
+
cursor: "grab",
|
|
4006
|
+
display: "flex",
|
|
4007
|
+
alignItems: "center",
|
|
4008
|
+
justifyContent: "center",
|
|
4009
|
+
background: panel_shell_default.fab.background,
|
|
4010
|
+
color: panel_shell_default.fab.color,
|
|
4011
|
+
boxShadow: this.isOpen ? panel_shell_default.fab.shadowOpen : panel_shell_default.fab.shadowClosed,
|
|
4012
|
+
transition: "box-shadow 150ms ease",
|
|
4013
|
+
touchAction: "none",
|
|
4014
|
+
userSelect: "none",
|
|
4015
|
+
webkitUserSelect: "none"
|
|
4016
|
+
};
|
|
4017
|
+
}
|
|
4018
|
+
// ---- RENDER ----
|
|
4019
|
+
render() {
|
|
4020
|
+
return html5`
|
|
4021
|
+
${this.isOpen ? html5`<div
|
|
4022
|
+
data-syntro-editor-panel
|
|
4023
|
+
data-syntro-editor-ui="panel"
|
|
4024
|
+
class=${this._getPanelClasses()}
|
|
4025
|
+
style=${styleMap2(this._getPanelStyles())}
|
|
4026
|
+
${this.panelId ? html5`` : nothing3}
|
|
4027
|
+
id=${this.panelId ?? nothing3}
|
|
4028
|
+
>
|
|
4029
|
+
${RESIZE_HANDLES2.map(
|
|
4030
|
+
(h) => html5`<div
|
|
4031
|
+
data-syntro-editor-ui="resize-${h.dir}"
|
|
4032
|
+
data-resize-dir=${h.dir}
|
|
4033
|
+
@pointerdown=${this._handleResizePointerDown}
|
|
4034
|
+
@pointermove=${this._handleResizePointerMove}
|
|
4035
|
+
@pointerup=${this._handleResizePointerUp}
|
|
4036
|
+
style=${styleMap2({
|
|
4037
|
+
position: "absolute",
|
|
4038
|
+
...h.style,
|
|
4039
|
+
cursor: h.cursor,
|
|
4040
|
+
zIndex: "1",
|
|
4041
|
+
touchAction: "none"
|
|
4042
|
+
})}
|
|
4043
|
+
></div>`
|
|
4044
|
+
)}
|
|
4045
|
+
<slot></slot>
|
|
4046
|
+
</div>` : nothing3}
|
|
4047
|
+
|
|
4048
|
+
<div
|
|
4049
|
+
class="syntro-editor-scope"
|
|
4050
|
+
data-syntro-editor-ui="fab-wrapper"
|
|
4051
|
+
style="display: contents"
|
|
4052
|
+
>
|
|
4053
|
+
<button
|
|
4054
|
+
type="button"
|
|
4055
|
+
data-syntro-fab
|
|
4056
|
+
data-syntro-editor-ui="fab"
|
|
4057
|
+
@pointerdown=${this._handleFabPointerDown}
|
|
4058
|
+
@pointermove=${this._handleFabPointerMove}
|
|
4059
|
+
@pointerup=${this._handleFabPointerUp}
|
|
4060
|
+
style=${styleMap2(this._getFabStyles())}
|
|
4061
|
+
title=${this.isOpen ? "Minimize panel" : "Open panel"}
|
|
4062
|
+
>
|
|
4063
|
+
${syntroLogoSvg}
|
|
4064
|
+
</button>
|
|
4065
|
+
</div>
|
|
4066
|
+
`;
|
|
4067
|
+
}
|
|
4068
|
+
};
|
|
4069
|
+
EditorPanelShellLit.properties = {
|
|
4070
|
+
isOpen: { type: Boolean, attribute: "is-open" },
|
|
4071
|
+
panelId: { type: String, attribute: "panel-id" },
|
|
4072
|
+
zIndex: { type: Number, attribute: "z-index" }
|
|
4073
|
+
};
|
|
4074
|
+
if (!customElements.get("se-editor-panel-shell")) {
|
|
4075
|
+
customElements.define("se-editor-panel-shell", EditorPanelShellLit);
|
|
4076
|
+
}
|
|
4077
|
+
|
|
4078
|
+
// ../../shared-editor-ui/src/components/EditorTextareaLit.ts
|
|
4079
|
+
import { html as html6, LitElement as LitElement5 } from "lit";
|
|
4080
|
+
var _textareaIdCounter = 0;
|
|
4081
|
+
var EditorTextareaLit = class extends LitElement5 {
|
|
4082
|
+
constructor() {
|
|
4083
|
+
super();
|
|
4084
|
+
this.disabled = false;
|
|
4085
|
+
this.required = false;
|
|
4086
|
+
this.readonly = false;
|
|
4087
|
+
this._generatedId = `se-textarea-${++_textareaIdCounter}`;
|
|
4088
|
+
}
|
|
4089
|
+
createRenderRoot() {
|
|
4090
|
+
return this;
|
|
4091
|
+
}
|
|
4092
|
+
updated() {
|
|
4093
|
+
const el = this.querySelector("textarea");
|
|
4094
|
+
if (el) {
|
|
4095
|
+
el.style.height = "auto";
|
|
4096
|
+
el.style.height = `${el.scrollHeight}px`;
|
|
4097
|
+
}
|
|
4098
|
+
}
|
|
4099
|
+
_handleChange(e) {
|
|
4100
|
+
const target = e.target;
|
|
4101
|
+
this.value = target.value;
|
|
4102
|
+
target.style.height = "auto";
|
|
4103
|
+
target.style.height = `${target.scrollHeight}px`;
|
|
4104
|
+
this.dispatchEvent(
|
|
4105
|
+
new CustomEvent("change", {
|
|
4106
|
+
detail: { value: target.value },
|
|
4107
|
+
bubbles: true,
|
|
4108
|
+
composed: true
|
|
4109
|
+
})
|
|
4110
|
+
);
|
|
4111
|
+
}
|
|
4112
|
+
_handleInput(e) {
|
|
4113
|
+
const target = e.target;
|
|
4114
|
+
this.value = target.value;
|
|
4115
|
+
target.style.height = "auto";
|
|
4116
|
+
target.style.height = `${target.scrollHeight}px`;
|
|
4117
|
+
this.dispatchEvent(
|
|
4118
|
+
new CustomEvent("input", {
|
|
4119
|
+
detail: { value: target.value },
|
|
4120
|
+
bubbles: true,
|
|
4121
|
+
composed: true
|
|
4122
|
+
})
|
|
4123
|
+
);
|
|
4124
|
+
}
|
|
4125
|
+
render() {
|
|
4126
|
+
const id = this.textareaId || this._generatedId;
|
|
4127
|
+
const classes = [
|
|
4128
|
+
"se-w-full se-py-2 se-px-3 se-rounded-lg se-border se-border-input-field-border se-bg-slate-grey-3 se-text-text-primary se-text-sm se-font-[inherit] se-mb-2 se-resize-y se-min-h-[60px] se-max-h-[50vh] se-overflow-y-auto se-box-border",
|
|
4129
|
+
"placeholder:se-text-input-field-text-placeholder",
|
|
4130
|
+
"focus:se-border-input-field-border-selected focus:se-outline-none focus:se-shadow-focus-primary",
|
|
4131
|
+
"disabled:se-bg-input-field-bg-disabled disabled:se-cursor-not-allowed disabled:se-opacity-50",
|
|
4132
|
+
this.textareaClass || ""
|
|
4133
|
+
].filter(Boolean).join(" ");
|
|
4134
|
+
return html6`
|
|
4135
|
+
<div>
|
|
4136
|
+
${this.label ? html6`<label
|
|
4137
|
+
for=${id}
|
|
4138
|
+
class="se-text-sm se-font-medium se-text-input-field-text-label se-mb-1 se-block"
|
|
4139
|
+
>${this.label}</label>` : ""}
|
|
4140
|
+
<textarea
|
|
4141
|
+
id=${id}
|
|
4142
|
+
class=${classes}
|
|
4143
|
+
name=${this.name ?? ""}
|
|
4144
|
+
placeholder=${this.placeholder ?? ""}
|
|
4145
|
+
?disabled=${this.disabled}
|
|
4146
|
+
?required=${this.required}
|
|
4147
|
+
?readonly=${this.readonly}
|
|
4148
|
+
rows=${this.rows ?? ""}
|
|
4149
|
+
@change=${this._handleChange}
|
|
4150
|
+
@input=${this._handleInput}
|
|
4151
|
+
>${this.value ?? ""}</textarea>
|
|
4152
|
+
</div>
|
|
4153
|
+
`;
|
|
4154
|
+
}
|
|
4155
|
+
};
|
|
4156
|
+
EditorTextareaLit.properties = {
|
|
4157
|
+
label: { type: String },
|
|
4158
|
+
textareaClass: { type: String, attribute: "textarea-class" },
|
|
4159
|
+
textareaId: { type: String, attribute: "textarea-id" },
|
|
4160
|
+
name: { type: String },
|
|
4161
|
+
value: { type: String },
|
|
4162
|
+
placeholder: { type: String },
|
|
4163
|
+
disabled: { type: Boolean },
|
|
4164
|
+
required: { type: Boolean },
|
|
4165
|
+
readonly: { type: Boolean },
|
|
4166
|
+
rows: { type: Number }
|
|
4167
|
+
};
|
|
4168
|
+
if (!customElements.get("se-editor-textarea")) {
|
|
4169
|
+
customElements.define("se-editor-textarea", EditorTextareaLit);
|
|
4170
|
+
}
|
|
4171
|
+
|
|
4172
|
+
// ../../shared-editor-ui/src/components/ElementHighlightLit.ts
|
|
4173
|
+
import { html as html7, LitElement as LitElement6, nothing as nothing4 } from "lit";
|
|
4174
|
+
import { styleMap as styleMap3 } from "lit/directives/style-map.js";
|
|
4175
|
+
var ElementHighlightLit = class extends LitElement6 {
|
|
4176
|
+
constructor() {
|
|
4177
|
+
super(...arguments);
|
|
4178
|
+
this.element = null;
|
|
4179
|
+
this.color = colors_default.blue[4];
|
|
4180
|
+
this.bgColor = "transparent";
|
|
4181
|
+
this.borderStyle = "solid";
|
|
4182
|
+
this.borderWidth = 2;
|
|
4183
|
+
this.showRemove = false;
|
|
4184
|
+
this.showDimensions = false;
|
|
4185
|
+
this.zIndex = 2147483644;
|
|
4186
|
+
this.padding = 2;
|
|
4187
|
+
/** When true, the highlight is clickable and emits 'highlight-click' events. */
|
|
4188
|
+
this.interactive = false;
|
|
4189
|
+
// Internal tracked rect
|
|
4190
|
+
this._rect = null;
|
|
4191
|
+
// Observer/listener cleanup
|
|
4192
|
+
this._resizeObserver = null;
|
|
4193
|
+
this._rafId = null;
|
|
4194
|
+
this._scheduleUpdate = () => {
|
|
4195
|
+
if (this._rafId != null) return;
|
|
4196
|
+
this._rafId = requestAnimationFrame(() => {
|
|
4197
|
+
this._rafId = null;
|
|
4198
|
+
if (this.element) {
|
|
4199
|
+
this._rect = this.element.getBoundingClientRect();
|
|
4200
|
+
}
|
|
4201
|
+
});
|
|
4202
|
+
};
|
|
4203
|
+
}
|
|
4204
|
+
// No _bound* wrapper needed — method is an arrow class field
|
|
4205
|
+
createRenderRoot() {
|
|
4206
|
+
return this;
|
|
4207
|
+
}
|
|
4208
|
+
connectedCallback() {
|
|
4209
|
+
super.connectedCallback();
|
|
4210
|
+
this._attachTracking();
|
|
4211
|
+
}
|
|
4212
|
+
disconnectedCallback() {
|
|
4213
|
+
super.disconnectedCallback();
|
|
4214
|
+
this._detachTracking();
|
|
4215
|
+
}
|
|
4216
|
+
updated(changed) {
|
|
4217
|
+
if (changed.has("element")) {
|
|
4218
|
+
this._detachTracking();
|
|
4219
|
+
this._attachTracking();
|
|
4220
|
+
}
|
|
4221
|
+
}
|
|
4222
|
+
// ---- RECT TRACKING (mirrors useElementRect) ----
|
|
4223
|
+
_attachTracking() {
|
|
4224
|
+
if (!this.element) {
|
|
4225
|
+
this._rect = null;
|
|
4226
|
+
return;
|
|
4227
|
+
}
|
|
4228
|
+
this._rect = this.element.getBoundingClientRect();
|
|
4229
|
+
window.addEventListener("scroll", this._scheduleUpdate, true);
|
|
4230
|
+
window.addEventListener("resize", this._scheduleUpdate);
|
|
4231
|
+
this._resizeObserver = new ResizeObserver(this._scheduleUpdate);
|
|
4232
|
+
this._resizeObserver.observe(this.element);
|
|
4233
|
+
}
|
|
4234
|
+
_detachTracking() {
|
|
4235
|
+
window.removeEventListener("scroll", this._scheduleUpdate, true);
|
|
4236
|
+
window.removeEventListener("resize", this._scheduleUpdate);
|
|
4237
|
+
if (this._resizeObserver) {
|
|
4238
|
+
this._resizeObserver.disconnect();
|
|
4239
|
+
this._resizeObserver = null;
|
|
4240
|
+
}
|
|
4241
|
+
if (this._rafId != null) {
|
|
4242
|
+
cancelAnimationFrame(this._rafId);
|
|
4243
|
+
this._rafId = null;
|
|
4244
|
+
}
|
|
4245
|
+
}
|
|
4246
|
+
// ---- EVENT HANDLERS ----
|
|
4247
|
+
_handleClick(e) {
|
|
4248
|
+
e.stopPropagation();
|
|
4249
|
+
e.preventDefault();
|
|
4250
|
+
this.dispatchEvent(
|
|
4251
|
+
new CustomEvent("highlight-click", {
|
|
4252
|
+
bubbles: true,
|
|
4253
|
+
composed: true
|
|
4254
|
+
})
|
|
4255
|
+
);
|
|
4256
|
+
}
|
|
4257
|
+
_handleKeyDown(e) {
|
|
4258
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
4259
|
+
e.stopPropagation();
|
|
4260
|
+
e.preventDefault();
|
|
4261
|
+
this.dispatchEvent(
|
|
4262
|
+
new CustomEvent("highlight-click", {
|
|
4263
|
+
bubbles: true,
|
|
4264
|
+
composed: true
|
|
4265
|
+
})
|
|
4266
|
+
);
|
|
4267
|
+
}
|
|
4268
|
+
}
|
|
4269
|
+
_handleRemove(e) {
|
|
4270
|
+
e.stopPropagation();
|
|
4271
|
+
e.preventDefault();
|
|
4272
|
+
this.dispatchEvent(
|
|
4273
|
+
new CustomEvent("highlight-remove", {
|
|
4274
|
+
bubbles: true,
|
|
4275
|
+
composed: true
|
|
4276
|
+
})
|
|
4277
|
+
);
|
|
4278
|
+
}
|
|
4279
|
+
// ---- RENDER ----
|
|
4280
|
+
render() {
|
|
4281
|
+
const rect = this._rect;
|
|
4282
|
+
if (!rect) return nothing4;
|
|
4283
|
+
const el = this.element;
|
|
4284
|
+
const hasInteraction = this.interactive || this.showRemove;
|
|
4285
|
+
let dimensionsLabel = null;
|
|
4286
|
+
if (this.showDimensions && el) {
|
|
4287
|
+
const tag = el.tagName.toLowerCase();
|
|
4288
|
+
const id = el.id ? `#${el.id}` : "";
|
|
4289
|
+
const cls = el.className && typeof el.className === "string" ? `.${el.className.split(" ").filter(Boolean).slice(0, 2).join(".")}` : "";
|
|
4290
|
+
dimensionsLabel = `${tag}${id}${cls} \u2014 ${Math.round(rect.width)}\xD7${Math.round(rect.height)}`;
|
|
4291
|
+
}
|
|
4292
|
+
const displayLabel = this.label || dimensionsLabel;
|
|
4293
|
+
const labelBg = this.showDimensions ? `${this.color.replace(")", ",0.85)").replace("rgb(", "rgba(")}` : this.color;
|
|
4294
|
+
return html7`
|
|
4295
|
+
<div
|
|
4296
|
+
data-syntro-highlight
|
|
4297
|
+
data-syntro-editor-ui="highlight"
|
|
4298
|
+
role=${this.interactive ? "button" : nothing4}
|
|
4299
|
+
tabindex=${this.interactive ? "0" : nothing4}
|
|
4300
|
+
@click=${this.interactive ? this._handleClick : nothing4}
|
|
4301
|
+
@keydown=${this.interactive ? this._handleKeyDown : nothing4}
|
|
4302
|
+
style=${styleMap3({
|
|
4303
|
+
position: "fixed",
|
|
4304
|
+
top: `${rect.top - this.padding}px`,
|
|
4305
|
+
left: `${rect.left - this.padding}px`,
|
|
4306
|
+
width: `${rect.width + this.padding * 2}px`,
|
|
4307
|
+
height: `${rect.height + this.padding * 2}px`,
|
|
4308
|
+
border: `${this.borderWidth}px ${this.borderStyle} ${this.color}`,
|
|
4309
|
+
backgroundColor: this.bgColor,
|
|
4310
|
+
borderRadius: "4px",
|
|
4311
|
+
zIndex: String(this.zIndex),
|
|
4312
|
+
pointerEvents: hasInteraction ? "auto" : "none",
|
|
4313
|
+
cursor: this.interactive ? "pointer" : "default",
|
|
4314
|
+
transition: "all 0.05s ease-out",
|
|
4315
|
+
boxSizing: "border-box"
|
|
4316
|
+
})}
|
|
4317
|
+
>
|
|
4318
|
+
${displayLabel ? html7`<div
|
|
4319
|
+
data-syntro-highlight-label
|
|
4320
|
+
data-syntro-editor-ui="highlight-label"
|
|
4321
|
+
class="se-text-xs"
|
|
4322
|
+
style=${styleMap3({
|
|
4323
|
+
position: "absolute",
|
|
4324
|
+
top: "-22px",
|
|
4325
|
+
left: "0",
|
|
4326
|
+
background: labelBg,
|
|
4327
|
+
color: "#fff",
|
|
4328
|
+
fontWeight: "600",
|
|
4329
|
+
fontFamily: this.showDimensions ? "monospace" : "inherit",
|
|
4330
|
+
padding: "1px 6px",
|
|
4331
|
+
borderRadius: "4px",
|
|
4332
|
+
whiteSpace: "nowrap",
|
|
4333
|
+
display: "flex",
|
|
4334
|
+
alignItems: "center",
|
|
4335
|
+
gap: "6px",
|
|
4336
|
+
pointerEvents: "auto"
|
|
4337
|
+
})}
|
|
4338
|
+
>
|
|
4339
|
+
<slot name="label-icon"></slot>
|
|
4340
|
+
${displayLabel}
|
|
4341
|
+
${this.showRemove ? html7`<button
|
|
4342
|
+
type="button"
|
|
4343
|
+
class="se-text-xs"
|
|
4344
|
+
data-syntro-highlight-remove
|
|
4345
|
+
data-syntro-editor-ui="highlight-remove"
|
|
4346
|
+
@click=${this._handleRemove}
|
|
4347
|
+
style=${styleMap3({
|
|
4348
|
+
background: "rgba(0,0,0,0.4)",
|
|
4349
|
+
border: "none",
|
|
4350
|
+
color: "#fff",
|
|
4351
|
+
borderRadius: "50%",
|
|
4352
|
+
width: "16px",
|
|
4353
|
+
height: "16px",
|
|
4354
|
+
cursor: "pointer",
|
|
4355
|
+
display: "flex",
|
|
4356
|
+
alignItems: "center",
|
|
4357
|
+
justifyContent: "center",
|
|
4358
|
+
padding: "0",
|
|
4359
|
+
lineHeight: "1"
|
|
4360
|
+
})}
|
|
4361
|
+
>
|
|
4362
|
+
\u00d7
|
|
4363
|
+
</button>` : nothing4}
|
|
4364
|
+
</div>` : nothing4}
|
|
4365
|
+
</div>
|
|
4366
|
+
`;
|
|
4367
|
+
}
|
|
4368
|
+
};
|
|
4369
|
+
ElementHighlightLit.properties = {
|
|
4370
|
+
element: { attribute: false },
|
|
4371
|
+
color: { type: String },
|
|
4372
|
+
bgColor: { type: String, attribute: "bg-color" },
|
|
4373
|
+
borderStyle: { type: String, attribute: "border-style" },
|
|
4374
|
+
borderWidth: { type: Number, attribute: "border-width" },
|
|
4375
|
+
label: { type: String },
|
|
4376
|
+
showRemove: { type: Boolean, attribute: "show-remove" },
|
|
4377
|
+
showDimensions: { type: Boolean, attribute: "show-dimensions" },
|
|
4378
|
+
zIndex: { type: Number, attribute: "z-index" },
|
|
4379
|
+
padding: { type: Number },
|
|
4380
|
+
interactive: { type: Boolean },
|
|
4381
|
+
// Internal state
|
|
4382
|
+
_rect: { state: true }
|
|
4383
|
+
};
|
|
4384
|
+
if (!customElements.get("se-element-highlight")) {
|
|
4385
|
+
customElements.define("se-element-highlight", ElementHighlightLit);
|
|
4386
|
+
}
|
|
4387
|
+
|
|
4388
|
+
// ../../shared-editor-ui/src/components/EmptyStateLit.ts
|
|
4389
|
+
import { html as html8, LitElement as LitElement7 } from "lit";
|
|
4390
|
+
var EmptyStateLit = class extends LitElement7 {
|
|
4391
|
+
constructor() {
|
|
4392
|
+
super(...arguments);
|
|
4393
|
+
this.message = "";
|
|
4394
|
+
}
|
|
4395
|
+
createRenderRoot() {
|
|
4396
|
+
return this;
|
|
4397
|
+
}
|
|
4398
|
+
render() {
|
|
4399
|
+
return html8`
|
|
4400
|
+
<div class="se-text-center se-py-8 se-px-4 se-text-text-secondary se-text-sm">
|
|
4401
|
+
${this.message}
|
|
4402
|
+
</div>
|
|
4403
|
+
`;
|
|
4404
|
+
}
|
|
4405
|
+
};
|
|
4406
|
+
EmptyStateLit.properties = {
|
|
4407
|
+
message: { type: String }
|
|
4408
|
+
};
|
|
4409
|
+
if (!customElements.get("se-empty-state")) {
|
|
4410
|
+
customElements.define("se-empty-state", EmptyStateLit);
|
|
4411
|
+
}
|
|
4412
|
+
|
|
4413
|
+
// ../../shared-editor-ui/src/components/GroupHeaderLit.ts
|
|
4414
|
+
import { html as html9, LitElement as LitElement8 } from "lit";
|
|
4415
|
+
var GroupHeaderLit = class extends LitElement8 {
|
|
4416
|
+
constructor() {
|
|
4417
|
+
super(...arguments);
|
|
4418
|
+
this.label = "";
|
|
4419
|
+
this.count = 0;
|
|
4420
|
+
}
|
|
4421
|
+
createRenderRoot() {
|
|
4422
|
+
return this;
|
|
4423
|
+
}
|
|
4424
|
+
render() {
|
|
4425
|
+
const classes = [
|
|
4426
|
+
"se-text-xs se-font-bold se-text-text-primary se-uppercase se-tracking-wide se-py-1 se-pb-2 se-flex se-items-center se-justify-between",
|
|
4427
|
+
this.headerClass || ""
|
|
4428
|
+
].filter(Boolean).join(" ");
|
|
4429
|
+
return html9`
|
|
4430
|
+
<div class=${classes}>
|
|
4431
|
+
<span>${this.label}</span>
|
|
4432
|
+
<span class="se-text-xs se-text-text-secondary se-bg-badge-slate-bg se-px-1.5 se-py-0.5 se-rounded-lg">
|
|
4433
|
+
${this.count}
|
|
4434
|
+
</span>
|
|
4435
|
+
</div>
|
|
4436
|
+
`;
|
|
4437
|
+
}
|
|
4438
|
+
};
|
|
4439
|
+
GroupHeaderLit.properties = {
|
|
4440
|
+
label: { type: String },
|
|
4441
|
+
count: { type: Number },
|
|
4442
|
+
headerClass: { type: String, attribute: "header-class" }
|
|
4443
|
+
};
|
|
4444
|
+
if (!customElements.get("se-group-header")) {
|
|
4445
|
+
customElements.define("se-group-header", GroupHeaderLit);
|
|
4446
|
+
}
|
|
3
4447
|
|
|
4
4448
|
// src/summarize.ts
|
|
5
4449
|
var MAX_Q_LEN = 50;
|
|
@@ -8,8 +4452,8 @@ function truncate(text, max) {
|
|
|
8
4452
|
if (text.length <= max) return text;
|
|
9
4453
|
return `${text.slice(0, max).trimEnd()}...`;
|
|
10
4454
|
}
|
|
11
|
-
function stripHtml(
|
|
12
|
-
return
|
|
4455
|
+
function stripHtml(html11) {
|
|
4456
|
+
return html11.replace(/<[^>]*>/g, "").trim();
|
|
13
4457
|
}
|
|
14
4458
|
function getAnswerPreview(answer) {
|
|
15
4459
|
if (typeof answer === "string") return answer;
|
|
@@ -23,6 +4467,9 @@ function summarizeFAQItem(item) {
|
|
|
23
4467
|
}
|
|
24
4468
|
|
|
25
4469
|
// src/types.ts
|
|
4470
|
+
function isGroupedFAQConfig(c) {
|
|
4471
|
+
return !!c && Array.isArray(c.groups);
|
|
4472
|
+
}
|
|
26
4473
|
var ACTION_NAMESPACE = "faq";
|
|
27
4474
|
function isOwnAction(action) {
|
|
28
4475
|
return action.kind.startsWith(`${ACTION_NAMESPACE}:`);
|
|
@@ -34,22 +4481,64 @@ var getAnswerText = (answer) => {
|
|
|
34
4481
|
if (answer.type === "rich") return answer.html;
|
|
35
4482
|
return answer.content;
|
|
36
4483
|
};
|
|
37
|
-
var
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
4484
|
+
var summarizeTriggerWhen = (triggerWhen) => {
|
|
4485
|
+
if (!triggerWhen || typeof triggerWhen !== "object") return "";
|
|
4486
|
+
const t = triggerWhen;
|
|
4487
|
+
if (t.type !== "rules" || !Array.isArray(t.rules)) return "Conditional";
|
|
4488
|
+
const types = /* @__PURE__ */ new Set();
|
|
4489
|
+
for (const rule of t.rules) {
|
|
4490
|
+
for (const cond of rule.conditions || []) {
|
|
4491
|
+
if (cond?.type) types.add(cond.type);
|
|
4492
|
+
}
|
|
4493
|
+
}
|
|
4494
|
+
return types.size > 0 ? [...types].join(", ") : "Conditional";
|
|
45
4495
|
};
|
|
46
|
-
|
|
4496
|
+
function flattenConfig(config) {
|
|
4497
|
+
if (isGroupedFAQConfig(config)) {
|
|
4498
|
+
const sections = [];
|
|
4499
|
+
const items = [];
|
|
4500
|
+
config.groups.forEach((group, gIdx) => {
|
|
4501
|
+
sections.push({
|
|
4502
|
+
groupIdx: gIdx,
|
|
4503
|
+
title: group.title,
|
|
4504
|
+
routes: group.routes,
|
|
4505
|
+
tileId: group.tileId
|
|
4506
|
+
});
|
|
4507
|
+
group.actions.filter(isOwnAction).forEach((q, iIdx) => {
|
|
4508
|
+
items.push(buildFlatItem(`${gIdx}:${iIdx}`, gIdx, iIdx, q));
|
|
4509
|
+
});
|
|
4510
|
+
});
|
|
4511
|
+
return { sections, items };
|
|
4512
|
+
}
|
|
4513
|
+
const flat = config;
|
|
4514
|
+
const own = (flat.actions || []).filter(isOwnAction);
|
|
4515
|
+
return {
|
|
4516
|
+
sections: [{ groupIdx: -1, title: "", routes: [] }],
|
|
4517
|
+
items: own.map((q, i) => buildFlatItem(String(i), -1, i, q))
|
|
4518
|
+
};
|
|
4519
|
+
}
|
|
4520
|
+
function buildFlatItem(key, groupIdx, itemIdx, q) {
|
|
4521
|
+
const raw = q;
|
|
4522
|
+
const topTitle = typeof raw.title === "string" ? raw.title : void 0;
|
|
4523
|
+
const description = typeof raw.description === "string" ? raw.description : void 0;
|
|
4524
|
+
const validation = Array.isArray(raw.validation) ? raw.validation.filter((v) => typeof v === "string") : void 0;
|
|
4525
|
+
return {
|
|
4526
|
+
key,
|
|
4527
|
+
groupIdx,
|
|
4528
|
+
itemIdx,
|
|
4529
|
+
summary: topTitle || summarizeFAQItem(q),
|
|
4530
|
+
triggerSummary: summarizeTriggerWhen(q.triggerWhen),
|
|
4531
|
+
description,
|
|
4532
|
+
validation: validation && validation.length > 0 ? validation : void 0,
|
|
4533
|
+
question: q
|
|
4534
|
+
};
|
|
4535
|
+
}
|
|
4536
|
+
var FAQEditorLit = class extends LitElement9 {
|
|
47
4537
|
constructor() {
|
|
48
4538
|
super(...arguments);
|
|
49
4539
|
this.config = null;
|
|
50
4540
|
this.onChange = null;
|
|
51
4541
|
this._editingKey = null;
|
|
52
|
-
// No auto-dirty on load — only dirty when user makes changes (matching React behavior).
|
|
53
4542
|
// ---- Actions ----
|
|
54
4543
|
this._handleBack = () => {
|
|
55
4544
|
if (this._editingKey !== null) {
|
|
@@ -61,21 +4550,39 @@ var FAQEditorLit = class extends LitElement {
|
|
|
61
4550
|
this._handleItemClick = (key) => {
|
|
62
4551
|
this._editingKey = key;
|
|
63
4552
|
};
|
|
64
|
-
this._handleFieldChange = (
|
|
4553
|
+
this._handleFieldChange = (item, field, value) => {
|
|
4554
|
+
this._emitFieldChange(item, field, value);
|
|
4555
|
+
};
|
|
4556
|
+
this._handleDelete = (item, e) => {
|
|
4557
|
+
e.stopPropagation();
|
|
65
4558
|
if (!this.config || !this.onChange) return;
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
4559
|
+
if (isGroupedFAQConfig(this.config)) {
|
|
4560
|
+
const groups = this.config.groups.map((group, gIdx) => {
|
|
4561
|
+
if (gIdx !== item.groupIdx) return group;
|
|
4562
|
+
const own = group.actions.filter(isOwnAction);
|
|
4563
|
+
const target = own[item.itemIdx];
|
|
4564
|
+
if (!target) return group;
|
|
4565
|
+
const remaining = group.actions.filter((a) => a !== target);
|
|
4566
|
+
return { ...group, actions: remaining };
|
|
4567
|
+
});
|
|
4568
|
+
const updated = { ...this.config, groups };
|
|
4569
|
+
this.onChange(updated);
|
|
4570
|
+
} else {
|
|
4571
|
+
const flat = this.config;
|
|
4572
|
+
const own = (flat.actions || []).filter(isOwnAction);
|
|
4573
|
+
const target = own[item.itemIdx];
|
|
4574
|
+
if (!target) return;
|
|
4575
|
+
const remaining = (flat.actions || []).filter((a) => a !== target);
|
|
4576
|
+
const updated = { ...flat, actions: remaining };
|
|
4577
|
+
this.onChange(updated);
|
|
4578
|
+
}
|
|
4579
|
+
if (this._editingKey === item.key) this._editingKey = null;
|
|
73
4580
|
this.dispatchEvent(new CustomEvent("dirty-change", { detail: { dirty: true }, bubbles: true }));
|
|
74
4581
|
};
|
|
75
4582
|
// ---- Render ----
|
|
76
4583
|
this._renderEditMode = (item) => {
|
|
77
4584
|
const q = item.question;
|
|
78
|
-
return
|
|
4585
|
+
return html10`
|
|
79
4586
|
<div class="se-py-1">
|
|
80
4587
|
<div class="se-flex se-items-center se-gap-2 se-mb-3 se-text-[13px] se-font-semibold se-text-text-primary">
|
|
81
4588
|
<span>❓</span>
|
|
@@ -87,7 +4594,7 @@ var FAQEditorLit = class extends LitElement {
|
|
|
87
4594
|
<input
|
|
88
4595
|
type="text"
|
|
89
4596
|
.value=${q.config.question}
|
|
90
|
-
@input=${(e) => this._handleFieldChange(item
|
|
4597
|
+
@input=${(e) => this._handleFieldChange(item, "question", e.target.value)}
|
|
91
4598
|
class="se-w-full se-p-2 se-rounded se-border se-border-border-primary se-bg-input-field-bg se-text-text-primary se-text-sm"
|
|
92
4599
|
/>
|
|
93
4600
|
</div>
|
|
@@ -96,7 +4603,7 @@ var FAQEditorLit = class extends LitElement {
|
|
|
96
4603
|
<label class="se-text-[11px] se-font-semibold se-text-text-secondary se-mb-1 se-block">Answer</label>
|
|
97
4604
|
<textarea
|
|
98
4605
|
.value=${getAnswerText(q.config.answer)}
|
|
99
|
-
@input=${(e) => this._handleFieldChange(item
|
|
4606
|
+
@input=${(e) => this._handleFieldChange(item, "answer", e.target.value)}
|
|
100
4607
|
rows="4"
|
|
101
4608
|
class="se-w-full se-p-2 se-rounded se-border se-border-border-primary se-bg-input-field-bg se-text-text-primary se-text-sm se-resize-none"
|
|
102
4609
|
></textarea>
|
|
@@ -108,66 +4615,160 @@ var FAQEditorLit = class extends LitElement {
|
|
|
108
4615
|
type="text"
|
|
109
4616
|
.value=${q.config.category || ""}
|
|
110
4617
|
placeholder="e.g., Billing, Account"
|
|
111
|
-
@input=${(e) => this._handleFieldChange(item
|
|
4618
|
+
@input=${(e) => this._handleFieldChange(item, "category", e.target.value)}
|
|
112
4619
|
class="se-w-full se-p-2 se-rounded se-border se-border-border-primary se-bg-input-field-bg se-text-text-primary se-text-sm"
|
|
113
4620
|
/>
|
|
114
4621
|
</div>
|
|
115
4622
|
|
|
116
|
-
${q.rationale ?
|
|
4623
|
+
${q.rationale ? html10`
|
|
117
4624
|
<div>
|
|
118
4625
|
<span class="se-text-[11px] se-font-semibold se-text-text-secondary se-mb-1 se-block">AI Rationale</span>
|
|
119
4626
|
<div class="se-p-2 se-rounded se-border se-border-dashed se-border-border-primary se-bg-card-bg se-text-text-secondary se-text-xs se-mb-2">
|
|
120
4627
|
${q.rationale.why}
|
|
121
4628
|
</div>
|
|
122
4629
|
</div>
|
|
123
|
-
` :
|
|
4630
|
+
` : nothing5}
|
|
4631
|
+
</div>
|
|
4632
|
+
`;
|
|
4633
|
+
};
|
|
4634
|
+
this._renderItemCard = (item) => html10`
|
|
4635
|
+
<div
|
|
4636
|
+
data-item-key=${item.key}
|
|
4637
|
+
data-card-body
|
|
4638
|
+
@click=${() => this._handleItemClick(item.key)}
|
|
4639
|
+
class="se-p-3 se-rounded-lg se-border se-border-border-primary se-bg-card-bg se-cursor-pointer se-mb-2 se-transition-all hover:se-border-pink-4/40 hover:se-bg-pink-4/5"
|
|
4640
|
+
>
|
|
4641
|
+
${itemCardHeader({
|
|
4642
|
+
label: item.summary,
|
|
4643
|
+
onDelete: (e) => this._handleDelete(item, e),
|
|
4644
|
+
deleteTestid: `delete-faq-${item.key}`,
|
|
4645
|
+
deleteLabel: "Delete question"
|
|
4646
|
+
})}
|
|
4647
|
+
${item.description ? html10`<div
|
|
4648
|
+
data-testid=${`faq-description-${item.key}`}
|
|
4649
|
+
class="se-text-[11px] se-text-text-secondary se-mt-1.5 se-line-clamp-2"
|
|
4650
|
+
>${item.description}</div>` : nothing5}
|
|
4651
|
+
${item.triggerSummary ? html10`<div
|
|
4652
|
+
data-testid=${`faq-trigger-${item.key}`}
|
|
4653
|
+
class="se-mt-1 se-inline-flex se-items-center se-gap-1 se-px-1.5 se-py-0.5 se-rounded se-bg-pink-4/10 se-text-pink-5 se-text-[10px] se-font-medium"
|
|
4654
|
+
>
|
|
4655
|
+
<span>📍</span>
|
|
4656
|
+
<span>When: ${item.triggerSummary}</span>
|
|
4657
|
+
</div>` : nothing5}
|
|
4658
|
+
${item.validation && item.validation.length > 0 ? html10`<div
|
|
4659
|
+
data-testid=${`faq-validation-${item.key}`}
|
|
4660
|
+
class="se-mt-1.5 se-flex se-flex-col se-gap-0.5"
|
|
4661
|
+
>
|
|
4662
|
+
${item.validation.map(
|
|
4663
|
+
(line) => html10`<div
|
|
4664
|
+
class="se-text-[10px] se-text-text-tertiary se-flex se-items-start se-gap-1"
|
|
4665
|
+
><span class="se-text-text-tertiary">✓</span><span>${line}</span></div>`
|
|
4666
|
+
)}
|
|
4667
|
+
</div>` : nothing5}
|
|
4668
|
+
${item.question.rationale ? html10`
|
|
4669
|
+
<div class="se-text-[10px] se-text-text-tertiary se-mt-1">
|
|
4670
|
+
WHY: ${item.question.rationale.why}
|
|
4671
|
+
</div>
|
|
4672
|
+
` : nothing5}
|
|
4673
|
+
</div>
|
|
4674
|
+
`;
|
|
4675
|
+
this._handleNavigateFromPill = (e) => {
|
|
4676
|
+
if (!e.detail?.route) return;
|
|
4677
|
+
this.dispatchEvent(
|
|
4678
|
+
new CustomEvent("se-navigate-to-page", {
|
|
4679
|
+
detail: { route: e.detail.route },
|
|
4680
|
+
bubbles: true,
|
|
4681
|
+
composed: true
|
|
4682
|
+
})
|
|
4683
|
+
);
|
|
4684
|
+
};
|
|
4685
|
+
this._renderGroupHeader = (section, count) => {
|
|
4686
|
+
const navRoute = section.routes[0];
|
|
4687
|
+
const testidSuffix = section.tileId ?? String(section.groupIdx);
|
|
4688
|
+
return html10`
|
|
4689
|
+
<div
|
|
4690
|
+
data-faq-group-header
|
|
4691
|
+
data-faq-group-tile-id=${section.tileId ?? ""}
|
|
4692
|
+
class="se-mt-3 se-mb-2 se-px-1 se-flex se-items-center se-justify-between se-gap-2"
|
|
4693
|
+
>
|
|
4694
|
+
<div class="se-flex se-items-center se-gap-2 se-min-w-0">
|
|
4695
|
+
<span
|
|
4696
|
+
class="se-text-[11px] se-font-semibold se-uppercase se-tracking-wider se-text-text-primary se-truncate"
|
|
4697
|
+
>
|
|
4698
|
+
${section.title}
|
|
4699
|
+
</span>
|
|
4700
|
+
${navRoute ? html10`<se-anchor-pill
|
|
4701
|
+
.state=${"navigate"}
|
|
4702
|
+
.route=${navRoute}
|
|
4703
|
+
testid-prefix="goto-faq-group"
|
|
4704
|
+
testid-key=${testidSuffix}
|
|
4705
|
+
@se-anchor-navigate=${this._handleNavigateFromPill}
|
|
4706
|
+
></se-anchor-pill>` : nothing5}
|
|
4707
|
+
</div>
|
|
4708
|
+
<span class="se-text-text-tertiary se-text-[11px] se-font-normal">${count}</span>
|
|
124
4709
|
</div>
|
|
125
4710
|
`;
|
|
126
4711
|
};
|
|
127
|
-
this._renderListMode = (items) => {
|
|
4712
|
+
this._renderListMode = (sections, items) => {
|
|
128
4713
|
if (items.length === 0) {
|
|
129
|
-
return
|
|
4714
|
+
return html10`<div class="se-text-center se-py-8 se-px-4 se-text-text-secondary se-text-sm">
|
|
130
4715
|
No FAQ questions configured.
|
|
131
4716
|
</div>`;
|
|
132
4717
|
}
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
${items.map(
|
|
138
|
-
(item) => html`
|
|
139
|
-
<div
|
|
140
|
-
data-item-key=${item.key}
|
|
141
|
-
data-card-body
|
|
142
|
-
@click=${() => this._handleItemClick(item.key)}
|
|
143
|
-
class="se-p-3 se-rounded-lg se-border se-border-border-primary se-bg-card-bg se-cursor-pointer se-mb-2 se-transition-all hover:se-border-pink-4/40 hover:se-bg-pink-4/5"
|
|
144
|
-
>
|
|
145
|
-
<div class="se-flex se-items-center se-gap-2">
|
|
146
|
-
<span class="se-flex-1 se-overflow-hidden se-text-ellipsis se-whitespace-nowrap se-text-sm se-text-text-primary">
|
|
147
|
-
${item.summary}
|
|
148
|
-
</span>
|
|
149
|
-
</div>
|
|
150
|
-
${item.question.rationale ? html`
|
|
151
|
-
<div class="se-text-[10px] se-text-text-tertiary se-mt-1">
|
|
152
|
-
WHY: ${item.question.rationale.why}
|
|
153
|
-
</div>
|
|
154
|
-
` : nothing}
|
|
4718
|
+
if (sections.length === 1 && sections[0].groupIdx === -1) {
|
|
4719
|
+
return html10`
|
|
4720
|
+
<div class="se-text-[11px] se-font-semibold se-uppercase se-tracking-wider se-text-text-secondary se-mb-2 se-px-1">
|
|
4721
|
+
FAQ <span class="se-text-text-tertiary se-font-normal">${items.length}</span>
|
|
155
4722
|
</div>
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
4723
|
+
${items.map(this._renderItemCard)}
|
|
4724
|
+
`;
|
|
4725
|
+
}
|
|
4726
|
+
return html10`${sections.map((section) => {
|
|
4727
|
+
const sectionItems = items.filter((it) => it.groupIdx === section.groupIdx);
|
|
4728
|
+
return html10`
|
|
4729
|
+
${this._renderGroupHeader(section, sectionItems.length)}
|
|
4730
|
+
${sectionItems.map(this._renderItemCard)}
|
|
4731
|
+
`;
|
|
4732
|
+
})}`;
|
|
159
4733
|
};
|
|
160
4734
|
}
|
|
161
4735
|
createRenderRoot() {
|
|
162
4736
|
return this;
|
|
163
4737
|
}
|
|
4738
|
+
_emitFieldChange(item, field, value) {
|
|
4739
|
+
if (!this.config || !this.onChange) return;
|
|
4740
|
+
const mutateQuestion = (q) => {
|
|
4741
|
+
const next = { ...q, config: { ...q.config } };
|
|
4742
|
+
next.config[field] = value;
|
|
4743
|
+
return next;
|
|
4744
|
+
};
|
|
4745
|
+
if (isGroupedFAQConfig(this.config)) {
|
|
4746
|
+
const groups = this.config.groups.map((group, gIdx) => {
|
|
4747
|
+
if (gIdx !== item.groupIdx) return group;
|
|
4748
|
+
const own = group.actions.filter(isOwnAction).slice();
|
|
4749
|
+
const others = group.actions.filter((a) => !isOwnAction(a));
|
|
4750
|
+
own[item.itemIdx] = mutateQuestion(own[item.itemIdx]);
|
|
4751
|
+
return { ...group, actions: [...others, ...own] };
|
|
4752
|
+
});
|
|
4753
|
+
const updated = { ...this.config, groups };
|
|
4754
|
+
this.onChange(updated);
|
|
4755
|
+
} else {
|
|
4756
|
+
const flat = this.config;
|
|
4757
|
+
const ownActions = (flat.actions || []).filter(isOwnAction).slice();
|
|
4758
|
+
ownActions[item.itemIdx] = mutateQuestion(ownActions[item.itemIdx]);
|
|
4759
|
+
const otherActions = (flat.actions || []).filter((a) => !isOwnAction(a));
|
|
4760
|
+
const updated = { ...flat, actions: [...otherActions, ...ownActions] };
|
|
4761
|
+
this.onChange(updated);
|
|
4762
|
+
}
|
|
4763
|
+
this.dispatchEvent(new CustomEvent("dirty-change", { detail: { dirty: true }, bubbles: true }));
|
|
4764
|
+
}
|
|
164
4765
|
render() {
|
|
165
4766
|
if (!this.config) {
|
|
166
|
-
return
|
|
4767
|
+
return html10`<div class="se-p-8 se-text-center se-text-text-secondary se-text-sm">Loading...</div>`;
|
|
167
4768
|
}
|
|
168
|
-
const items =
|
|
4769
|
+
const { sections, items } = flattenConfig(this.config);
|
|
169
4770
|
const editItem = this._editingKey !== null ? items.find((it) => it.key === this._editingKey) : null;
|
|
170
|
-
return
|
|
4771
|
+
return html10`
|
|
171
4772
|
<div class="se-flex se-flex-col se-h-full">
|
|
172
4773
|
<!-- Header (no Back button — panel provides that) -->
|
|
173
4774
|
<div class="se-px-4 se-pt-3 se-pb-1">
|
|
@@ -178,14 +4779,14 @@ var FAQEditorLit = class extends LitElement {
|
|
|
178
4779
|
</div>
|
|
179
4780
|
|
|
180
4781
|
<div class="se-flex-1 se-overflow-auto se-p-4">
|
|
181
|
-
${editItem ?
|
|
4782
|
+
${editItem ? html10`
|
|
182
4783
|
<button type="button" @click=${() => {
|
|
183
4784
|
this._editingKey = null;
|
|
184
4785
|
}}
|
|
185
4786
|
class="se-mb-3 se-py-1 se-px-2 se-rounded se-border-none se-bg-card-bg se-text-text-secondary se-text-xs se-cursor-pointer"
|
|
186
4787
|
>← Back to list</button>
|
|
187
4788
|
${this._renderEditMode(editItem)}
|
|
188
|
-
` : this._renderListMode(items)}
|
|
4789
|
+
` : this._renderListMode(sections, items)}
|
|
189
4790
|
</div>
|
|
190
4791
|
</div>
|
|
191
4792
|
`;
|
|
@@ -200,4 +4801,39 @@ customElements.define("se-faq-editor", FAQEditorLit);
|
|
|
200
4801
|
export {
|
|
201
4802
|
FAQEditorLit
|
|
202
4803
|
};
|
|
4804
|
+
/*! Bundled license information:
|
|
4805
|
+
|
|
4806
|
+
react/cjs/react.development.js:
|
|
4807
|
+
(**
|
|
4808
|
+
* @license React
|
|
4809
|
+
* react.development.js
|
|
4810
|
+
*
|
|
4811
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
4812
|
+
*
|
|
4813
|
+
* This source code is licensed under the MIT license found in the
|
|
4814
|
+
* LICENSE file in the root directory of this source tree.
|
|
4815
|
+
*)
|
|
4816
|
+
|
|
4817
|
+
react/cjs/react-jsx-runtime.development.js:
|
|
4818
|
+
(**
|
|
4819
|
+
* @license React
|
|
4820
|
+
* react-jsx-runtime.development.js
|
|
4821
|
+
*
|
|
4822
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
4823
|
+
*
|
|
4824
|
+
* This source code is licensed under the MIT license found in the
|
|
4825
|
+
* LICENSE file in the root directory of this source tree.
|
|
4826
|
+
*)
|
|
4827
|
+
|
|
4828
|
+
react-dom/cjs/react-dom.development.js:
|
|
4829
|
+
(**
|
|
4830
|
+
* @license React
|
|
4831
|
+
* react-dom.development.js
|
|
4832
|
+
*
|
|
4833
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
4834
|
+
*
|
|
4835
|
+
* This source code is licensed under the MIT license found in the
|
|
4836
|
+
* LICENSE file in the root directory of this source tree.
|
|
4837
|
+
*)
|
|
4838
|
+
*/
|
|
203
4839
|
//# sourceMappingURL=editor.js.map
|