@vobs/layout 1.2.1 → 1.3.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/breadcrumb.cjs +62 -577
- package/dist/breadcrumb.cjs.map +1 -1
- package/dist/breadcrumb.js +42 -562
- package/dist/breadcrumb.js.map +1 -1
- package/dist/context.cjs +30 -163
- package/dist/context.cjs.map +1 -1
- package/dist/context.js +8 -160
- package/dist/context.js.map +1 -1
- package/dist/header.cjs +69 -583
- package/dist/header.cjs.map +1 -1
- package/dist/header.js +40 -562
- package/dist/header.js.map +1 -1
- package/dist/index.cjs +281 -1018
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +282 -981
- package/dist/index.js.map +1 -1
- package/dist/layout.cjs +201 -937
- package/dist/layout.cjs.map +1 -1
- package/dist/layout.js +196 -910
- package/dist/layout.js.map +1 -1
- package/dist/menu.cjs +81 -645
- package/dist/menu.cjs.map +1 -1
- package/dist/menu.js +55 -624
- package/dist/menu.js.map +1 -1
- package/dist/sidebar.cjs +105 -759
- package/dist/sidebar.cjs.map +1 -1
- package/dist/sidebar.js +82 -733
- package/dist/sidebar.js.map +1 -1
- package/dist/tabs.cjs +70 -634
- package/dist/tabs.cjs.map +1 -1
- package/dist/tabs.js +48 -617
- package/dist/tabs.js.map +1 -1
- package/dist/types.cjs +18 -2
- package/dist/types.cjs.map +1 -1
- package/dist/types.js +0 -2
- package/dist/types.js.map +1 -1
- package/dist/utils.cjs +61 -532
- package/dist/utils.cjs.map +1 -1
- package/dist/utils.js +23 -508
- package/dist/utils.js.map +1 -1
- package/dist/viewport.cjs +34 -261
- package/dist/viewport.cjs.map +1 -1
- package/dist/viewport.js +7 -256
- package/dist/viewport.js.map +1 -1
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -1,799 +1,25 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
2
|
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
3
|
|
|
4
|
-
// packages/
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
return;
|
|
18
|
-
}
|
|
19
|
-
__name(invokeDebug, "invokeDebug");
|
|
20
|
-
|
|
21
|
-
// packages/reactivity/src/owner.ts
|
|
22
|
-
var currentOwner = null;
|
|
23
|
-
var nextOwnerId = 1;
|
|
24
|
-
var ownerNames = /* @__PURE__ */ new WeakMap();
|
|
25
|
-
function createOwner() {
|
|
26
|
-
const parent = currentOwner;
|
|
27
|
-
let disposed = parent?.disposed ?? false;
|
|
28
|
-
const children = [];
|
|
29
|
-
const cleanups = [];
|
|
30
|
-
const errorHandlers = /* @__PURE__ */ new Set();
|
|
31
|
-
const owner = {
|
|
32
|
-
id: `owner-${nextOwnerId++}`,
|
|
33
|
-
parent,
|
|
34
|
-
children,
|
|
35
|
-
depth: (parent?.depth ?? -1) + 1,
|
|
36
|
-
get disposed() {
|
|
37
|
-
return disposed;
|
|
38
|
-
},
|
|
39
|
-
run(fn) {
|
|
40
|
-
if (disposed) throw new Error("Vobs: \u5DF2\u9500\u6BC1\u7684 Owner \u4E0D\u80FD\u7EE7\u7EED\u8FD0\u884C");
|
|
41
|
-
const previous = currentOwner;
|
|
42
|
-
currentOwner = owner;
|
|
43
|
-
try {
|
|
44
|
-
return fn();
|
|
45
|
-
} finally {
|
|
46
|
-
currentOwner = previous;
|
|
47
|
-
}
|
|
48
|
-
},
|
|
49
|
-
addCleanup(cleanup) {
|
|
50
|
-
if (disposed) {
|
|
51
|
-
cleanup();
|
|
52
|
-
return;
|
|
53
|
-
}
|
|
54
|
-
cleanups.push(cleanup);
|
|
55
|
-
},
|
|
56
|
-
onDispose(cleanup) {
|
|
57
|
-
owner.addCleanup(cleanup);
|
|
58
|
-
},
|
|
59
|
-
onError(handler) {
|
|
60
|
-
errorHandlers.add(handler);
|
|
61
|
-
const remove = /* @__PURE__ */ __name(() => errorHandlers.delete(handler), "remove");
|
|
62
|
-
owner.addCleanup(remove);
|
|
63
|
-
return remove;
|
|
64
|
-
},
|
|
65
|
-
handleError(error) {
|
|
66
|
-
for (const handler of [...errorHandlers].reverse()) {
|
|
67
|
-
try {
|
|
68
|
-
handler(error);
|
|
69
|
-
return true;
|
|
70
|
-
} catch (handlerError) {
|
|
71
|
-
return parent?.handleError(handlerError) ?? false;
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
return parent?.handleError(error) ?? false;
|
|
75
|
-
},
|
|
76
|
-
dispose() {
|
|
77
|
-
if (disposed) return;
|
|
78
|
-
disposed = true;
|
|
79
|
-
for (const child of [...children]) child.dispose();
|
|
80
|
-
children.length = 0;
|
|
81
|
-
let firstError;
|
|
82
|
-
for (let index = cleanups.length - 1; index >= 0; index--) {
|
|
83
|
-
try {
|
|
84
|
-
cleanups[index]();
|
|
85
|
-
} catch (error) {
|
|
86
|
-
firstError ?? (firstError = error);
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
cleanups.length = 0;
|
|
90
|
-
if (parent) {
|
|
91
|
-
const index = parent.children.indexOf(owner);
|
|
92
|
-
if (index >= 0) parent.children.splice(index, 1);
|
|
93
|
-
}
|
|
94
|
-
if (firstError) throw firstError;
|
|
95
|
-
}
|
|
96
|
-
};
|
|
97
|
-
if (parent && !parent.disposed) parent.children.push(owner);
|
|
98
|
-
return owner;
|
|
99
|
-
}
|
|
100
|
-
__name(createOwner, "createOwner");
|
|
101
|
-
function setOwnerDebugName(owner, name) {
|
|
102
|
-
ownerNames.set(owner, name);
|
|
103
|
-
}
|
|
104
|
-
__name(setOwnerDebugName, "setOwnerDebugName");
|
|
105
|
-
function getCurrentOwner() {
|
|
106
|
-
return currentOwner;
|
|
107
|
-
}
|
|
108
|
-
__name(getCurrentOwner, "getCurrentOwner");
|
|
109
|
-
function onDispose(cleanup) {
|
|
110
|
-
const owner = getCurrentOwner();
|
|
111
|
-
if (!owner) throw new Error("Vobs: onDispose \u5FC5\u987B\u5728 Owner \u4F5C\u7528\u57DF\u5185\u8C03\u7528");
|
|
112
|
-
owner.onDispose(cleanup);
|
|
113
|
-
}
|
|
114
|
-
__name(onDispose, "onDispose");
|
|
115
|
-
|
|
116
|
-
// packages/reactivity/src/signal.ts
|
|
117
|
-
var currentSubscriber = null;
|
|
118
|
-
function getCurrentSubscriber() {
|
|
119
|
-
return currentSubscriber;
|
|
120
|
-
}
|
|
121
|
-
__name(getCurrentSubscriber, "getCurrentSubscriber");
|
|
122
|
-
function setCurrentSubscriber(subscriber) {
|
|
123
|
-
currentSubscriber = subscriber;
|
|
124
|
-
}
|
|
125
|
-
__name(setCurrentSubscriber, "setCurrentSubscriber");
|
|
126
|
-
function trackDependency(dependency) {
|
|
127
|
-
if (!currentSubscriber || currentSubscriber.disposed) return;
|
|
128
|
-
!currentSubscriber.dependencies.has(dependency);
|
|
129
|
-
currentSubscriber.dependencies.add(dependency);
|
|
130
|
-
}
|
|
131
|
-
__name(trackDependency, "trackDependency");
|
|
132
|
-
function state(initialValue, debugName) {
|
|
133
|
-
let value = initialValue;
|
|
134
|
-
let disposed = false;
|
|
135
|
-
const subscribers = /* @__PURE__ */ new Set();
|
|
136
|
-
const signalInstance = {
|
|
137
|
-
get value() {
|
|
138
|
-
const subscriber = getCurrentSubscriber();
|
|
139
|
-
if (subscriber && !subscriber.disposed) {
|
|
140
|
-
subscribers.add(subscriber);
|
|
141
|
-
trackDependency(signalInstance);
|
|
142
|
-
}
|
|
143
|
-
return value;
|
|
144
|
-
},
|
|
145
|
-
set value(nextValue) {
|
|
146
|
-
if (disposed || Object.is(value, nextValue)) return;
|
|
147
|
-
value = nextValue;
|
|
148
|
-
for (const subscriber of [...subscribers]) subscriber.notify();
|
|
149
|
-
},
|
|
150
|
-
unsubscribe(subscriber) {
|
|
151
|
-
subscribers.delete(subscriber);
|
|
152
|
-
},
|
|
153
|
-
// 与 `.value =` 赋值同一条路径:判等短路、debug hook、notify 全部一致。
|
|
154
|
-
// 以闭包实现,可安全地作为回调直接传递(无 this 绑定问题)。
|
|
155
|
-
set(next) {
|
|
156
|
-
signalInstance.value = next;
|
|
157
|
-
},
|
|
158
|
-
dispose() {
|
|
159
|
-
if (disposed) return;
|
|
160
|
-
disposed = true;
|
|
161
|
-
subscribers.clear();
|
|
162
|
-
}
|
|
163
|
-
};
|
|
164
|
-
const owner = getCurrentOwner();
|
|
165
|
-
owner?.addCleanup(signalInstance.dispose);
|
|
166
|
-
if (debugName?.trim()) setSignalDebugName(signalInstance, debugName.trim());
|
|
167
|
-
return signalInstance;
|
|
168
|
-
}
|
|
169
|
-
__name(state, "state");
|
|
170
|
-
|
|
171
|
-
// packages/reactivity/src/scheduler.ts
|
|
172
|
-
var _Scheduler = class _Scheduler {
|
|
173
|
-
constructor() {
|
|
174
|
-
this.dirtyEffects = /* @__PURE__ */ new Set();
|
|
175
|
-
this.lowPriorityEffects = /* @__PURE__ */ new Set();
|
|
176
|
-
// flush 不可重入(flushing 标志保证),缓冲数组可在轮次间安全复用,避免每轮分配。
|
|
177
|
-
this.normalBuffer = [];
|
|
178
|
-
this.lowBuffer = [];
|
|
179
|
-
this.flushing = false;
|
|
180
|
-
this.scheduled = false;
|
|
181
|
-
this.batchDepth = 0;
|
|
182
|
-
}
|
|
183
|
-
schedule(effect2) {
|
|
184
|
-
if (effect2.disposed) return;
|
|
185
|
-
this.dirtyEffects.add(effect2);
|
|
186
|
-
this.lowPriorityEffects.delete(effect2);
|
|
187
|
-
this.ensureScheduled();
|
|
188
|
-
}
|
|
189
|
-
/** Queue an effect behind normal updates while preserving deterministic order. */
|
|
190
|
-
scheduleLow(effect2) {
|
|
191
|
-
if (effect2.disposed) return;
|
|
192
|
-
if (!this.dirtyEffects.has(effect2)) this.lowPriorityEffects.add(effect2);
|
|
193
|
-
this.ensureScheduled();
|
|
194
|
-
}
|
|
195
|
-
ensureScheduled() {
|
|
196
|
-
if (this.batchDepth === 0 && !this.flushing && !this.scheduled) {
|
|
197
|
-
this.scheduled = true;
|
|
198
|
-
queueMicrotask(() => {
|
|
199
|
-
this.scheduled = false;
|
|
200
|
-
this.flush();
|
|
201
|
-
});
|
|
202
|
-
}
|
|
203
|
-
}
|
|
204
|
-
remove(effect2) {
|
|
205
|
-
this.dirtyEffects.delete(effect2);
|
|
206
|
-
this.lowPriorityEffects.delete(effect2);
|
|
207
|
-
}
|
|
208
|
-
batch(fn) {
|
|
209
|
-
this.batchDepth++;
|
|
210
|
-
try {
|
|
211
|
-
return fn();
|
|
212
|
-
} finally {
|
|
213
|
-
this.batchDepth--;
|
|
214
|
-
if (this.batchDepth === 0) this.flush();
|
|
215
|
-
}
|
|
216
|
-
}
|
|
217
|
-
flush() {
|
|
218
|
-
if (this.flushing || this.batchDepth > 0) return;
|
|
219
|
-
this.flushing = true;
|
|
220
|
-
let rounds = 0;
|
|
221
|
-
let firstError;
|
|
222
|
-
let hasError = false;
|
|
223
|
-
try {
|
|
224
|
-
while (this.dirtyEffects.size > 0 || this.lowPriorityEffects.size > 0) {
|
|
225
|
-
if (++rounds > 100) {
|
|
226
|
-
this.dirtyEffects.clear();
|
|
227
|
-
this.lowPriorityEffects.clear();
|
|
228
|
-
throw new Error("Vobs: \u54CD\u5E94\u5F0F\u66F4\u65B0\u8D85\u8FC7 100 \u8F6E\uFF0C\u53EF\u80FD\u5B58\u5728\u5FAA\u73AF\u4F9D\u8D56");
|
|
229
|
-
}
|
|
230
|
-
this.collectRunnable(this.dirtyEffects, this.normalBuffer);
|
|
231
|
-
this.collectRunnable(this.lowPriorityEffects, this.lowBuffer);
|
|
232
|
-
sortEffects(this.normalBuffer);
|
|
233
|
-
sortEffects(this.lowBuffer);
|
|
234
|
-
for (const effect2 of this.normalBuffer) {
|
|
235
|
-
try {
|
|
236
|
-
effect2.run();
|
|
237
|
-
} catch (error) {
|
|
238
|
-
if (!hasError) {
|
|
239
|
-
firstError = error;
|
|
240
|
-
hasError = true;
|
|
241
|
-
}
|
|
242
|
-
}
|
|
243
|
-
}
|
|
244
|
-
for (const effect2 of this.lowBuffer) {
|
|
245
|
-
try {
|
|
246
|
-
effect2.run();
|
|
247
|
-
} catch (error) {
|
|
248
|
-
if (!hasError) {
|
|
249
|
-
firstError = error;
|
|
250
|
-
hasError = true;
|
|
251
|
-
}
|
|
252
|
-
}
|
|
253
|
-
}
|
|
254
|
-
this.normalBuffer.length = 0;
|
|
255
|
-
this.lowBuffer.length = 0;
|
|
256
|
-
}
|
|
257
|
-
} finally {
|
|
258
|
-
this.normalBuffer.length = 0;
|
|
259
|
-
this.lowBuffer.length = 0;
|
|
260
|
-
this.flushing = false;
|
|
261
|
-
}
|
|
262
|
-
if (hasError) throw firstError;
|
|
263
|
-
}
|
|
264
|
-
/** 收集未 disposed 的 effect 并清空源集合;run() 期间新调度的 effect 留给下一轮。 */
|
|
265
|
-
collectRunnable(source, target) {
|
|
266
|
-
for (const effect2 of source) {
|
|
267
|
-
if (!effect2.disposed) target.push(effect2);
|
|
268
|
-
}
|
|
269
|
-
source.clear();
|
|
270
|
-
}
|
|
271
|
-
};
|
|
272
|
-
__name(_Scheduler, "Scheduler");
|
|
273
|
-
var Scheduler = _Scheduler;
|
|
274
|
-
function sortEffects(effects) {
|
|
275
|
-
if (effects.length > 1) {
|
|
276
|
-
effects.sort((a, b) => b.depth - a.depth || a.order - b.order);
|
|
277
|
-
}
|
|
278
|
-
}
|
|
279
|
-
__name(sortEffects, "sortEffects");
|
|
280
|
-
var scheduler = new Scheduler();
|
|
281
|
-
|
|
282
|
-
// packages/reactivity/src/effect.ts
|
|
283
|
-
var nextEffectOrder = 1;
|
|
284
|
-
function cleanupDependencies(subscriber) {
|
|
285
|
-
for (const dependency of subscriber.dependencies) {
|
|
286
|
-
dependency.unsubscribe(subscriber);
|
|
287
|
-
}
|
|
288
|
-
subscriber.dependencies.clear();
|
|
289
|
-
}
|
|
290
|
-
__name(cleanupDependencies, "cleanupDependencies");
|
|
291
|
-
function effect(callback) {
|
|
292
|
-
const owner = getCurrentOwner();
|
|
293
|
-
let cleanup;
|
|
294
|
-
let dirty = true;
|
|
295
|
-
let disposed = false;
|
|
296
|
-
const eff = {
|
|
297
|
-
order: nextEffectOrder++,
|
|
298
|
-
depth: owner?.depth ?? 0,
|
|
299
|
-
dependencies: /* @__PURE__ */ new Set(),
|
|
300
|
-
get disposed() {
|
|
301
|
-
return disposed;
|
|
302
|
-
},
|
|
303
|
-
notify() {
|
|
304
|
-
if (disposed || dirty) return;
|
|
305
|
-
dirty = true;
|
|
306
|
-
scheduler.schedule(eff);
|
|
307
|
-
},
|
|
308
|
-
run() {
|
|
309
|
-
if (disposed || !dirty) return;
|
|
310
|
-
dirty = false;
|
|
311
|
-
const previousCleanup = cleanup;
|
|
312
|
-
cleanup = void 0;
|
|
313
|
-
let cleanupError;
|
|
314
|
-
if (previousCleanup) {
|
|
315
|
-
try {
|
|
316
|
-
previousCleanup();
|
|
317
|
-
} catch (error) {
|
|
318
|
-
const handled2 = owner?.handleError(error) ?? false;
|
|
319
|
-
if (!handled2) cleanupError = error;
|
|
320
|
-
}
|
|
321
|
-
}
|
|
322
|
-
cleanupDependencies(eff);
|
|
323
|
-
const previous = getCurrentSubscriber();
|
|
324
|
-
setCurrentSubscriber(eff);
|
|
325
|
-
let thrown;
|
|
326
|
-
let handled = false;
|
|
327
|
-
try {
|
|
328
|
-
const result = owner ? owner.run(callback) : callback();
|
|
329
|
-
cleanup = typeof result === "function" ? result : void 0;
|
|
330
|
-
} catch (error) {
|
|
331
|
-
thrown = error;
|
|
332
|
-
handled = owner?.handleError(error) ?? false;
|
|
333
|
-
if (!handled) throw error;
|
|
334
|
-
} finally {
|
|
335
|
-
setCurrentSubscriber(previous);
|
|
336
|
-
}
|
|
337
|
-
if (cleanupError && !thrown) throw cleanupError;
|
|
338
|
-
},
|
|
339
|
-
scheduleLow() {
|
|
340
|
-
if (disposed || dirty) return;
|
|
341
|
-
dirty = true;
|
|
342
|
-
scheduler.scheduleLow(eff);
|
|
343
|
-
},
|
|
344
|
-
dispose() {
|
|
345
|
-
if (disposed) return;
|
|
346
|
-
disposed = true;
|
|
347
|
-
dirty = false;
|
|
348
|
-
scheduler.remove(eff);
|
|
349
|
-
const previousCleanup = cleanup;
|
|
350
|
-
cleanup = void 0;
|
|
351
|
-
let cleanupError;
|
|
352
|
-
if (previousCleanup) {
|
|
353
|
-
try {
|
|
354
|
-
previousCleanup();
|
|
355
|
-
} catch (error) {
|
|
356
|
-
const handled = owner?.handleError(error) ?? false;
|
|
357
|
-
if (!handled) cleanupError = error;
|
|
358
|
-
}
|
|
359
|
-
}
|
|
360
|
-
cleanupDependencies(eff);
|
|
361
|
-
if (cleanupError) throw cleanupError;
|
|
362
|
-
}
|
|
363
|
-
};
|
|
364
|
-
owner?.addCleanup(eff.dispose);
|
|
365
|
-
eff.run();
|
|
366
|
-
return eff;
|
|
367
|
-
}
|
|
368
|
-
__name(effect, "effect");
|
|
369
|
-
|
|
370
|
-
// packages/reactivity/src/memo.ts
|
|
371
|
-
function memo(compute) {
|
|
372
|
-
let cached;
|
|
373
|
-
let dirty = true;
|
|
374
|
-
let disposed = false;
|
|
375
|
-
const subscribers = /* @__PURE__ */ new Set();
|
|
376
|
-
const memoSubscriber = {
|
|
377
|
-
dependencies: /* @__PURE__ */ new Set(),
|
|
378
|
-
get disposed() {
|
|
379
|
-
return disposed;
|
|
380
|
-
},
|
|
381
|
-
notify() {
|
|
382
|
-
if (disposed || dirty) return;
|
|
383
|
-
dirty = true;
|
|
384
|
-
for (const subscriber of [...subscribers]) subscriber.notify();
|
|
385
|
-
}
|
|
386
|
-
};
|
|
387
|
-
const memoSignal = {
|
|
388
|
-
get value() {
|
|
389
|
-
const subscriber = getCurrentSubscriber();
|
|
390
|
-
if (subscriber && !subscriber.disposed) {
|
|
391
|
-
subscribers.add(subscriber);
|
|
392
|
-
trackDependency(memoSignal);
|
|
393
|
-
}
|
|
394
|
-
if (dirty) {
|
|
395
|
-
cleanupDependencies(memoSubscriber);
|
|
396
|
-
const previous = getCurrentSubscriber();
|
|
397
|
-
setCurrentSubscriber(memoSubscriber);
|
|
398
|
-
try {
|
|
399
|
-
cached = compute();
|
|
400
|
-
dirty = false;
|
|
401
|
-
} finally {
|
|
402
|
-
setCurrentSubscriber(previous);
|
|
403
|
-
}
|
|
404
|
-
}
|
|
405
|
-
return cached;
|
|
406
|
-
},
|
|
407
|
-
set value(_) {
|
|
408
|
-
throw new Error("memo: \u6D3E\u751F\u503C\u4E0D\u80FD\u76F4\u63A5\u8D4B\u503C");
|
|
409
|
-
},
|
|
410
|
-
unsubscribe(subscriber) {
|
|
411
|
-
subscribers.delete(subscriber);
|
|
412
|
-
},
|
|
413
|
-
dispose() {
|
|
414
|
-
if (disposed) return;
|
|
415
|
-
disposed = true;
|
|
416
|
-
subscribers.clear();
|
|
417
|
-
cleanupDependencies(memoSubscriber);
|
|
418
|
-
}
|
|
419
|
-
};
|
|
420
|
-
const owner = getCurrentOwner();
|
|
421
|
-
owner?.addCleanup(memoSignal.dispose);
|
|
422
|
-
return memoSignal;
|
|
423
|
-
}
|
|
424
|
-
__name(memo, "memo");
|
|
425
|
-
|
|
426
|
-
// packages/runtime/src/debug.ts
|
|
427
|
-
var activeRuntimeDebugHooks = null;
|
|
428
|
-
function getRuntimeDebugHooks() {
|
|
429
|
-
return activeRuntimeDebugHooks;
|
|
430
|
-
}
|
|
431
|
-
__name(getRuntimeDebugHooks, "getRuntimeDebugHooks");
|
|
432
|
-
function invokeRuntimeDebug(name, ...args) {
|
|
433
|
-
return;
|
|
434
|
-
}
|
|
435
|
-
__name(invokeRuntimeDebug, "invokeRuntimeDebug");
|
|
436
|
-
function readDebugValue(read) {
|
|
437
|
-
try {
|
|
438
|
-
return read();
|
|
439
|
-
} catch {
|
|
440
|
-
return "[Uninspectable]";
|
|
441
|
-
}
|
|
442
|
-
}
|
|
443
|
-
__name(readDebugValue, "readDebugValue");
|
|
444
|
-
function describeDebugNode(node) {
|
|
445
|
-
if (!node || typeof node !== "object") return "node";
|
|
446
|
-
const value = node;
|
|
447
|
-
const name = typeof value.tagName === "string" ? value.tagName.toLowerCase() : typeof value.nodeName === "string" ? value.nodeName.toLowerCase() : "node";
|
|
448
|
-
const id = typeof value.id === "string" && value.id ? `#${value.id}` : "";
|
|
449
|
-
const className = typeof value.className === "string" && value.className ? `.${value.className.trim().split(/\s+/).filter(Boolean).join(".")}` : "";
|
|
450
|
-
return `${name}${id}${className}`;
|
|
451
|
-
}
|
|
452
|
-
__name(describeDebugNode, "describeDebugNode");
|
|
453
|
-
|
|
454
|
-
// packages/runtime/src/hmr.ts
|
|
455
|
-
var globalTarget = globalThis;
|
|
456
|
-
var hmrGlobal = globalTarget.__VOBS_HMR__ ?? { modules: /* @__PURE__ */ new Map() };
|
|
457
|
-
globalTarget.__VOBS_HMR__ = hmrGlobal;
|
|
458
|
-
function registerHmrInstance(moduleId, instance) {
|
|
459
|
-
const instances = getModule(moduleId).instances;
|
|
460
|
-
instances.add(instance);
|
|
461
|
-
return () => instances.delete(instance);
|
|
462
|
-
}
|
|
463
|
-
__name(registerHmrInstance, "registerHmrInstance");
|
|
464
|
-
function markHmrInstanceMounted(node, parent) {
|
|
465
|
-
const instance = hmrInstances.get(node);
|
|
466
|
-
if (instance) instance.parent = parent;
|
|
467
|
-
}
|
|
468
|
-
__name(markHmrInstanceMounted, "markHmrInstanceMounted");
|
|
469
|
-
function getModule(moduleId) {
|
|
470
|
-
let module = hmrGlobal.modules.get(moduleId);
|
|
471
|
-
if (!module) {
|
|
472
|
-
module = { components: /* @__PURE__ */ new Map(), state: /* @__PURE__ */ new Map(), instances: /* @__PURE__ */ new Set() };
|
|
473
|
-
hmrGlobal.modules.set(moduleId, module);
|
|
474
|
-
}
|
|
475
|
-
return module;
|
|
476
|
-
}
|
|
477
|
-
__name(getModule, "getModule");
|
|
478
|
-
var hmrInstances = /* @__PURE__ */ new WeakMap();
|
|
479
|
-
function associateHmrInstance(node, instance) {
|
|
480
|
-
hmrInstances.set(node, instance);
|
|
481
|
-
}
|
|
482
|
-
__name(associateHmrInstance, "associateHmrInstance");
|
|
483
|
-
var nodeOwners = /* @__PURE__ */ new WeakMap();
|
|
484
|
-
var eventBindings = /* @__PURE__ */ new WeakMap();
|
|
485
|
-
function getRenderer() {
|
|
486
|
-
{
|
|
487
|
-
throw new Error("\u6E32\u67D3\u5668\u672A\u521D\u59CB\u5316");
|
|
488
|
-
}
|
|
489
|
-
}
|
|
490
|
-
__name(getRenderer, "getRenderer");
|
|
491
|
-
function createText(content) {
|
|
492
|
-
return getRenderer().createText(content);
|
|
493
|
-
}
|
|
494
|
-
__name(createText, "createText");
|
|
495
|
-
function createElement(tag) {
|
|
496
|
-
return getRenderer().createElement(tag);
|
|
497
|
-
}
|
|
498
|
-
__name(createElement, "createElement");
|
|
499
|
-
function createComment(content) {
|
|
500
|
-
return getRenderer().createComment(content);
|
|
501
|
-
}
|
|
502
|
-
__name(createComment, "createComment");
|
|
503
|
-
function insertBefore(parent, child, anchor) {
|
|
504
|
-
if (isVobsFragment(child)) {
|
|
505
|
-
child.mount(parent, isVobsFragment(anchor) ? anchor.start : anchor);
|
|
506
|
-
return;
|
|
507
|
-
}
|
|
508
|
-
getRenderer().insertBefore(parent, child, isVobsFragment(anchor) ? anchor.start : anchor);
|
|
509
|
-
markHmrInstanceMounted(child, parent);
|
|
510
|
-
}
|
|
511
|
-
__name(insertBefore, "insertBefore");
|
|
512
|
-
function removeChild(parent, child) {
|
|
513
|
-
disposeNodeOwner(child);
|
|
514
|
-
if (isVobsFragment(child)) {
|
|
515
|
-
child.unmount(parent);
|
|
516
|
-
return;
|
|
517
|
-
}
|
|
518
|
-
getRenderer().removeChild(parent, child);
|
|
519
|
-
}
|
|
520
|
-
__name(removeChild, "removeChild");
|
|
521
|
-
function setTextContent(node, content) {
|
|
522
|
-
getRenderer().setTextContent(node, content);
|
|
523
|
-
}
|
|
524
|
-
__name(setTextContent, "setTextContent");
|
|
525
|
-
function setProperty(node, key, value) {
|
|
526
|
-
getRenderer().setProperty(node, key, value);
|
|
527
|
-
}
|
|
528
|
-
__name(setProperty, "setProperty");
|
|
529
|
-
function setAttribute(node, key, value) {
|
|
530
|
-
getRenderer().setAttribute(node, key, value);
|
|
531
|
-
}
|
|
532
|
-
__name(setAttribute, "setAttribute");
|
|
533
|
-
function addEventListener(node, event, handler) {
|
|
534
|
-
const renderer = getRenderer();
|
|
535
|
-
const owner = getCurrentOwner();
|
|
536
|
-
let bindings = eventBindings.get(node);
|
|
537
|
-
if (!bindings) {
|
|
538
|
-
bindings = /* @__PURE__ */ new Map();
|
|
539
|
-
eventBindings.set(node, bindings);
|
|
540
|
-
}
|
|
541
|
-
const previous = bindings.get(event);
|
|
542
|
-
if (previous && previous.original === handler && previous.owner === owner) return;
|
|
543
|
-
if (previous) renderer.removeEventListener(node, event, previous.handler);
|
|
544
|
-
const listener = owner ? (reason) => {
|
|
545
|
-
try {
|
|
546
|
-
owner.run(() => handler(reason));
|
|
547
|
-
} catch (error) {
|
|
548
|
-
const handled = owner.handleError(error);
|
|
549
|
-
invokeRuntimeDebug("error", {
|
|
550
|
-
error,
|
|
551
|
-
owner,
|
|
552
|
-
phase: "event",
|
|
553
|
-
handled,
|
|
554
|
-
recovery: handled ? "handled" : "propagated"
|
|
555
|
-
});
|
|
556
|
-
if (!handled) throw error;
|
|
557
|
-
}
|
|
558
|
-
} : handler;
|
|
559
|
-
const binding = { handler: listener, owner, original: handler };
|
|
560
|
-
bindings.set(event, binding);
|
|
561
|
-
renderer.addEventListener(node, event, listener);
|
|
562
|
-
owner?.onDispose(() => {
|
|
563
|
-
if (bindings?.get(event) !== binding) return;
|
|
564
|
-
bindings.delete(event);
|
|
565
|
-
renderer.removeEventListener(node, event, listener);
|
|
566
|
-
});
|
|
567
|
-
}
|
|
568
|
-
__name(addEventListener, "addEventListener");
|
|
569
|
-
function createComponent(component, props, source) {
|
|
570
|
-
const owner = createOwner();
|
|
571
|
-
const componentName = component.displayName || component.name || "anonymous";
|
|
572
|
-
setOwnerDebugName(owner, source ? `${componentName} (${source.file}:${source.line}:${source.column})` : componentName);
|
|
573
|
-
owner.onError((reason) => {
|
|
574
|
-
attachSourceLocation(reason, source);
|
|
575
|
-
attachComponentContext(reason, componentName, owner.id);
|
|
576
|
-
throw reason;
|
|
577
|
-
});
|
|
578
|
-
let node;
|
|
579
|
-
try {
|
|
580
|
-
node = owner.run(() => component(props));
|
|
581
|
-
} catch (error) {
|
|
582
|
-
owner.dispose();
|
|
583
|
-
attachSourceLocation(error, source);
|
|
584
|
-
attachComponentContext(error, componentName, owner.id);
|
|
585
|
-
throw error;
|
|
586
|
-
}
|
|
587
|
-
associateNodeOwner(node, owner);
|
|
588
|
-
const hmrKey = component.hmrKey;
|
|
589
|
-
if (hmrKey) {
|
|
590
|
-
const instance = {
|
|
591
|
-
node,
|
|
592
|
-
parent: null,
|
|
593
|
-
refresh() {
|
|
594
|
-
const previous = instance.node;
|
|
595
|
-
const next = owner.run(() => component(props));
|
|
596
|
-
if (instance.parent && !isVobsFragment(previous) && !isVobsFragment(next)) {
|
|
597
|
-
getRenderer().insertBefore(instance.parent, next, previous);
|
|
598
|
-
getRenderer().removeChild(instance.parent, previous);
|
|
599
|
-
}
|
|
600
|
-
nodeOwners.delete(previous);
|
|
601
|
-
nodeOwners.set(next, owner);
|
|
602
|
-
associateHmrInstance(next, instance);
|
|
603
|
-
instance.node = next;
|
|
604
|
-
}
|
|
605
|
-
};
|
|
606
|
-
associateHmrInstance(node, instance);
|
|
607
|
-
const separator = hmrKey.lastIndexOf(":");
|
|
608
|
-
const moduleId = separator < 0 ? hmrKey : hmrKey.slice(0, separator);
|
|
609
|
-
const cleanup = registerHmrInstance(moduleId, instance);
|
|
610
|
-
owner.onDispose(cleanup);
|
|
611
|
-
}
|
|
612
|
-
return node;
|
|
613
|
-
}
|
|
614
|
-
__name(createComponent, "createComponent");
|
|
615
|
-
function attachSourceLocation(reason, source) {
|
|
616
|
-
if (!source || (!reason || typeof reason !== "object" && typeof reason !== "function")) return;
|
|
617
|
-
const error = reason;
|
|
618
|
-
if (error.vobsSource) return;
|
|
619
|
-
try {
|
|
620
|
-
Object.defineProperty(error, "vobsSource", {
|
|
621
|
-
configurable: true,
|
|
622
|
-
enumerable: false,
|
|
623
|
-
value: source,
|
|
624
|
-
writable: false
|
|
625
|
-
});
|
|
626
|
-
} catch {
|
|
627
|
-
}
|
|
628
|
-
}
|
|
629
|
-
__name(attachSourceLocation, "attachSourceLocation");
|
|
630
|
-
function attachComponentContext(reason, component, ownerId) {
|
|
631
|
-
if (!reason || typeof reason !== "object" && typeof reason !== "function") return;
|
|
632
|
-
const error = reason;
|
|
633
|
-
try {
|
|
634
|
-
if (!error.vobsComponent) Object.defineProperty(error, "vobsComponent", { configurable: true, enumerable: false, value: component, writable: false });
|
|
635
|
-
if (!error.vobsOwnerId) Object.defineProperty(error, "vobsOwnerId", { configurable: true, enumerable: false, value: ownerId, writable: false });
|
|
636
|
-
} catch {
|
|
637
|
-
}
|
|
638
|
-
}
|
|
639
|
-
__name(attachComponentContext, "attachComponentContext");
|
|
640
|
-
function createBlock(factory) {
|
|
641
|
-
const owner = createOwner();
|
|
642
|
-
setOwnerDebugName(owner, "dynamic");
|
|
643
|
-
let node;
|
|
644
|
-
try {
|
|
645
|
-
node = owner.run(factory);
|
|
646
|
-
} catch (error) {
|
|
647
|
-
owner.dispose();
|
|
648
|
-
throw error;
|
|
649
|
-
}
|
|
650
|
-
if (!node) {
|
|
651
|
-
owner.dispose();
|
|
652
|
-
return null;
|
|
653
|
-
}
|
|
654
|
-
associateNodeOwner(node, owner);
|
|
655
|
-
return node;
|
|
656
|
-
}
|
|
657
|
-
__name(createBlock, "createBlock");
|
|
658
|
-
function associateNodeOwner(node, owner) {
|
|
659
|
-
nodeOwners.set(node, owner);
|
|
660
|
-
}
|
|
661
|
-
__name(associateNodeOwner, "associateNodeOwner");
|
|
662
|
-
function disposeNodeOwner(node) {
|
|
663
|
-
const owner = nodeOwners.get(node);
|
|
664
|
-
if (!owner) return;
|
|
665
|
-
nodeOwners.delete(node);
|
|
666
|
-
owner.dispose();
|
|
667
|
-
}
|
|
668
|
-
__name(disposeNodeOwner, "disposeNodeOwner");
|
|
669
|
-
|
|
670
|
-
// packages/runtime/src/fragment.ts
|
|
671
|
-
function createFragment(factory) {
|
|
672
|
-
const start = createComment("vobs:fragment:start");
|
|
673
|
-
const end = createComment("vobs:fragment:end");
|
|
674
|
-
let parent = null;
|
|
675
|
-
let initialized = false;
|
|
676
|
-
const owner = getCurrentOwner();
|
|
677
|
-
const fragment = {
|
|
678
|
-
kind: "vobs-fragment",
|
|
679
|
-
start,
|
|
680
|
-
end,
|
|
681
|
-
mount(nextParent, anchor) {
|
|
682
|
-
if (parent && parent !== nextParent) {
|
|
683
|
-
throw new Error("Vobs Fragment: \u4E0D\u80FD\u8DE8\u7236\u8282\u70B9\u79FB\u52A8 Fragment");
|
|
684
|
-
}
|
|
685
|
-
if (initialized) {
|
|
686
|
-
moveRange(nextParent, start, end, anchor);
|
|
687
|
-
return;
|
|
688
|
-
}
|
|
689
|
-
const renderer = getRenderer();
|
|
690
|
-
renderer.insertBefore(nextParent, start, anchor);
|
|
691
|
-
renderer.insertBefore(nextParent, end, anchor);
|
|
692
|
-
parent = nextParent;
|
|
693
|
-
initialized = true;
|
|
694
|
-
if (owner) owner.run(() => factory(nextParent, end));
|
|
695
|
-
else factory(nextParent, end);
|
|
696
|
-
},
|
|
697
|
-
unmount(nextParent) {
|
|
698
|
-
if (!initialized || parent !== nextParent) {
|
|
699
|
-
throw new Error("Vobs Fragment: Fragment \u4E0D\u5C5E\u4E8E\u6307\u5B9A\u7236\u8282\u70B9");
|
|
700
|
-
}
|
|
701
|
-
const renderer = getRenderer();
|
|
702
|
-
let current = renderer.nextSibling(start);
|
|
703
|
-
while (current && current !== end) {
|
|
704
|
-
const next = renderer.nextSibling(current);
|
|
705
|
-
renderer.removeChild(nextParent, current);
|
|
706
|
-
current = next;
|
|
707
|
-
}
|
|
708
|
-
renderer.removeChild(nextParent, start);
|
|
709
|
-
renderer.removeChild(nextParent, end);
|
|
710
|
-
parent = null;
|
|
711
|
-
initialized = false;
|
|
712
|
-
}
|
|
713
|
-
};
|
|
714
|
-
return fragment;
|
|
715
|
-
}
|
|
716
|
-
__name(createFragment, "createFragment");
|
|
717
|
-
function isVobsFragment(value) {
|
|
718
|
-
return Boolean(value) && typeof value === "object" && value.kind === "vobs-fragment";
|
|
719
|
-
}
|
|
720
|
-
__name(isVobsFragment, "isVobsFragment");
|
|
721
|
-
function moveRange(parent, start, end, anchor) {
|
|
722
|
-
const renderer = getRenderer();
|
|
723
|
-
const nodes = [start];
|
|
724
|
-
let current = renderer.nextSibling(start);
|
|
725
|
-
while (current) {
|
|
726
|
-
nodes.push(current);
|
|
727
|
-
if (current === end) break;
|
|
728
|
-
current = renderer.nextSibling(current);
|
|
729
|
-
}
|
|
730
|
-
if (nodes[nodes.length - 1] !== end) {
|
|
731
|
-
throw new Error("Vobs Fragment: \u627E\u4E0D\u5230\u7ED3\u675F\u951A\u70B9");
|
|
732
|
-
}
|
|
733
|
-
for (const node of nodes) renderer.insertBefore(parent, node, anchor);
|
|
734
|
-
}
|
|
735
|
-
__name(moveRange, "moveRange");
|
|
736
|
-
|
|
737
|
-
// packages/runtime/src/dynamic.ts
|
|
738
|
-
function insertDynamic(parent, anchor, factory) {
|
|
739
|
-
const marker = createComment("vobs:dynamic");
|
|
740
|
-
insertBefore(parent, marker, anchor);
|
|
741
|
-
let current = null;
|
|
742
|
-
effect(() => {
|
|
743
|
-
const next = createBlock(factory);
|
|
744
|
-
if (next === current) return;
|
|
745
|
-
if (current) removeChild(parent, current);
|
|
746
|
-
current = next;
|
|
747
|
-
if (current) insertBefore(parent, current, marker);
|
|
748
|
-
});
|
|
749
|
-
}
|
|
750
|
-
__name(insertDynamic, "insertDynamic");
|
|
751
|
-
|
|
752
|
-
// packages/vobs/src/context.ts
|
|
753
|
-
var ownerProviders = /* @__PURE__ */ new WeakMap();
|
|
754
|
-
function provide(key, value, options = {}) {
|
|
755
|
-
const owner = getCurrentOwner();
|
|
756
|
-
if (!owner) throw new Error("Vobs: provide \u5FC5\u987B\u5728\u7EC4\u4EF6\u6216 Owner \u4F5C\u7528\u57DF\u5185\u8C03\u7528");
|
|
757
|
-
provideToOwner(owner, key, value, options);
|
|
758
|
-
}
|
|
759
|
-
__name(provide, "provide");
|
|
760
|
-
function inject(key, fallback) {
|
|
761
|
-
const owner = getCurrentOwner();
|
|
762
|
-
const value = owner ? injectFromOwner(owner, key) : void 0;
|
|
763
|
-
return value === void 0 ? fallback : value;
|
|
764
|
-
}
|
|
765
|
-
__name(inject, "inject");
|
|
766
|
-
function provideToOwner(owner, key, value, options = {}) {
|
|
767
|
-
let providers = ownerProviders.get(owner);
|
|
768
|
-
if (!providers) {
|
|
769
|
-
providers = /* @__PURE__ */ new Map();
|
|
770
|
-
ownerProviders.set(owner, providers);
|
|
771
|
-
owner.onDispose(() => ownerProviders.delete(owner));
|
|
772
|
-
}
|
|
773
|
-
if (providers.has(key) && !options.override) {
|
|
774
|
-
throw new Error(`Vobs: \u6CE8\u5165\u9879 ${String(key)} \u5DF2\u5B58\u5728\uFF1B\u5982\u9700\u8986\u76D6\u8BF7\u4F20\u5165 override: true`);
|
|
775
|
-
}
|
|
776
|
-
providers.set(key, value);
|
|
777
|
-
}
|
|
778
|
-
__name(provideToOwner, "provideToOwner");
|
|
779
|
-
function injectFromOwner(owner, key) {
|
|
780
|
-
let current = owner;
|
|
781
|
-
while (current) {
|
|
782
|
-
const providers = ownerProviders.get(current);
|
|
783
|
-
if (providers?.has(key)) return providers.get(key);
|
|
784
|
-
current = current.parent;
|
|
785
|
-
}
|
|
786
|
-
return void 0;
|
|
787
|
-
}
|
|
788
|
-
__name(injectFromOwner, "injectFromOwner");
|
|
789
|
-
|
|
790
|
-
// packages/vobs/src/app.ts
|
|
791
|
-
function createInjectionKey(description) {
|
|
792
|
-
return Symbol(description);
|
|
793
|
-
}
|
|
794
|
-
__name(createInjectionKey, "createInjectionKey");
|
|
4
|
+
// packages/layout/src/layout.ts
|
|
5
|
+
import { effect as effect4, memo as memo2, state as state3 } from "@vobs/reactivity";
|
|
6
|
+
import {
|
|
7
|
+
addEventListener as addEventListener4,
|
|
8
|
+
createComponent as createComponent2,
|
|
9
|
+
createElement as createElement4,
|
|
10
|
+
createText as createText5,
|
|
11
|
+
insertBefore as insertBefore5,
|
|
12
|
+
insertDynamic as insertDynamic4,
|
|
13
|
+
provide,
|
|
14
|
+
setAttribute as setAttribute5,
|
|
15
|
+
setProperty as setProperty3
|
|
16
|
+
} from "@vobs/vobs";
|
|
795
17
|
|
|
796
18
|
// packages/layout/src/context.ts
|
|
19
|
+
import {
|
|
20
|
+
createInjectionKey,
|
|
21
|
+
inject
|
|
22
|
+
} from "@vobs/vobs";
|
|
797
23
|
var KIT_LAYOUT_KEY = createInjectionKey("vobs.kit.layout");
|
|
798
24
|
function useKitLayout() {
|
|
799
25
|
const context = inject(KIT_LAYOUT_KEY);
|
|
@@ -804,7 +30,27 @@ function useKitLayout() {
|
|
|
804
30
|
}
|
|
805
31
|
__name(useKitLayout, "useKitLayout");
|
|
806
32
|
|
|
33
|
+
// packages/layout/src/header.ts
|
|
34
|
+
import { effect as effect2 } from "@vobs/reactivity";
|
|
35
|
+
import {
|
|
36
|
+
addEventListener,
|
|
37
|
+
createElement,
|
|
38
|
+
createText as createText2,
|
|
39
|
+
insertBefore as insertBefore2,
|
|
40
|
+
setAttribute as setAttribute2
|
|
41
|
+
} from "@vobs/vobs";
|
|
42
|
+
|
|
807
43
|
// packages/layout/src/utils.ts
|
|
44
|
+
import { effect } from "@vobs/reactivity";
|
|
45
|
+
import {
|
|
46
|
+
createFragment,
|
|
47
|
+
createText,
|
|
48
|
+
insertBefore,
|
|
49
|
+
insertDynamic,
|
|
50
|
+
setAttribute,
|
|
51
|
+
setProperty,
|
|
52
|
+
setTextContent
|
|
53
|
+
} from "@vobs/vobs";
|
|
808
54
|
function readProp(props, name, fallback) {
|
|
809
55
|
const value = Reflect.get(props, name);
|
|
810
56
|
return value === void 0 ? fallback : value;
|
|
@@ -933,44 +179,44 @@ function KitHeader(props = {}) {
|
|
|
933
179
|
"onToggleSidebar"
|
|
934
180
|
]);
|
|
935
181
|
bindUserStyle(root, props);
|
|
936
|
-
|
|
182
|
+
setAttribute2(toggleRegion, "class", "vobs-kit-header__toggle");
|
|
937
183
|
if (hasProp(props, "sidebarToggle")) {
|
|
938
184
|
mountSlot(toggleRegion, props, "sidebarToggle");
|
|
939
185
|
} else {
|
|
940
|
-
|
|
186
|
+
insertBefore2(toggleRegion, createDefaultToggle(props), null);
|
|
941
187
|
}
|
|
942
|
-
|
|
188
|
+
setAttribute2(brand, "class", "vobs-kit-header__brand");
|
|
943
189
|
if (readProp(props, "logo", void 0) !== void 0) {
|
|
944
190
|
const logo = createElement("span");
|
|
945
|
-
|
|
191
|
+
setAttribute2(logo, "class", "vobs-kit-header__logo");
|
|
946
192
|
mountSlot(logo, props, "logo");
|
|
947
|
-
|
|
193
|
+
insertBefore2(brand, logo, null);
|
|
948
194
|
}
|
|
949
195
|
if (readProp(props, "title", void 0) !== void 0) {
|
|
950
196
|
const title = createElement("h1");
|
|
951
|
-
const text =
|
|
952
|
-
|
|
197
|
+
const text = createText2("");
|
|
198
|
+
setAttribute2(title, "class", "vobs-kit-header__title");
|
|
953
199
|
bindTextContent(text, () => readProp(props, "title", ""));
|
|
954
|
-
|
|
955
|
-
|
|
200
|
+
insertBefore2(title, text, null);
|
|
201
|
+
insertBefore2(brand, title, null);
|
|
956
202
|
}
|
|
957
|
-
|
|
203
|
+
setAttribute2(actions, "class", "vobs-kit-header__actions");
|
|
958
204
|
if (readProp(props, "headerActions", void 0) !== void 0) mountSlot(actions, props, "headerActions");
|
|
959
205
|
if (readProp(props, "userMenu", void 0) !== void 0) mountSlot(actions, props, "userMenu");
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
|
|
206
|
+
insertBefore2(root, toggleRegion, null);
|
|
207
|
+
insertBefore2(root, brand, null);
|
|
208
|
+
insertBefore2(root, actions, null);
|
|
963
209
|
if (hasProp(props, "children")) mountSlot(root, props, "children");
|
|
964
210
|
return root;
|
|
965
211
|
}
|
|
966
212
|
__name(KitHeader, "KitHeader");
|
|
967
213
|
function createDefaultToggle(props) {
|
|
968
214
|
const button = createElement("button");
|
|
969
|
-
const label =
|
|
970
|
-
|
|
971
|
-
|
|
215
|
+
const label = createText2("");
|
|
216
|
+
setAttribute2(button, "type", "button");
|
|
217
|
+
setAttribute2(button, "class", "vobs-kit-header__toggle-button");
|
|
972
218
|
bindTextContent(label, () => readProp(props, "toggleLabel", "Menu"));
|
|
973
|
-
|
|
219
|
+
insertBefore2(button, label, null);
|
|
974
220
|
addEventListener(button, "click", () => {
|
|
975
221
|
const handler = readProp(props, "onToggleSidebar", void 0);
|
|
976
222
|
if (typeof handler === "function") handler();
|
|
@@ -980,20 +226,43 @@ function createDefaultToggle(props) {
|
|
|
980
226
|
}
|
|
981
227
|
__name(createDefaultToggle, "createDefaultToggle");
|
|
982
228
|
function effectToggleLabel(button, props) {
|
|
983
|
-
|
|
229
|
+
effect2(() => {
|
|
984
230
|
setOptionalAttribute(button, "aria-label", readProp(props, "toggleLabel", "Menu"));
|
|
985
231
|
});
|
|
986
232
|
}
|
|
987
233
|
__name(effectToggleLabel, "effectToggleLabel");
|
|
988
234
|
|
|
235
|
+
// packages/layout/src/sidebar.ts
|
|
236
|
+
import { effect as effect3 } from "@vobs/reactivity";
|
|
237
|
+
import {
|
|
238
|
+
addEventListener as addEventListener3,
|
|
239
|
+
createComponent,
|
|
240
|
+
createElement as createElement3,
|
|
241
|
+
createText as createText4,
|
|
242
|
+
insertBefore as insertBefore4,
|
|
243
|
+
insertDynamic as insertDynamic3,
|
|
244
|
+
setAttribute as setAttribute4
|
|
245
|
+
} from "@vobs/vobs";
|
|
246
|
+
|
|
989
247
|
// packages/layout/src/menu.ts
|
|
248
|
+
import { state } from "@vobs/reactivity";
|
|
249
|
+
import {
|
|
250
|
+
addEventListener as addEventListener2,
|
|
251
|
+
createElement as createElement2,
|
|
252
|
+
createFragment as createFragment2,
|
|
253
|
+
createText as createText3,
|
|
254
|
+
insertBefore as insertBefore3,
|
|
255
|
+
insertDynamic as insertDynamic2,
|
|
256
|
+
setAttribute as setAttribute3,
|
|
257
|
+
setProperty as setProperty2
|
|
258
|
+
} from "@vobs/vobs";
|
|
990
259
|
function KitMenu(props) {
|
|
991
|
-
const root =
|
|
260
|
+
const root = createElement2("ul");
|
|
992
261
|
const expanded = state(/* @__PURE__ */ new Set());
|
|
993
262
|
bindClassList(root, props, () => ["vobs-kit-menu"]);
|
|
994
263
|
bindCommonAttributes(root, props, ["items", "collapsed", "activeKey", "onSelect"]);
|
|
995
|
-
if (!hasProp(props, "role"))
|
|
996
|
-
|
|
264
|
+
if (!hasProp(props, "role")) setAttribute3(root, "role", "menu");
|
|
265
|
+
insertDynamic2(root, null, () => createMenuTree(props, expanded));
|
|
997
266
|
if (hasProp(props, "children")) mountSlot(root, props, "children");
|
|
998
267
|
return root;
|
|
999
268
|
}
|
|
@@ -1002,93 +271,93 @@ function createMenuTree(props, expanded) {
|
|
|
1002
271
|
const items = readProp(props, "items", []);
|
|
1003
272
|
const activeKey = readProp(props, "activeKey", void 0);
|
|
1004
273
|
const collapsed = readProp(props, "collapsed", false);
|
|
1005
|
-
return
|
|
274
|
+
return createFragment2((parent, anchor) => {
|
|
1006
275
|
for (const item of items) {
|
|
1007
|
-
|
|
276
|
+
insertBefore3(parent, createMenuItem(item, props, activeKey, collapsed, expanded), anchor);
|
|
1008
277
|
}
|
|
1009
278
|
});
|
|
1010
279
|
}
|
|
1011
280
|
__name(createMenuTree, "createMenuTree");
|
|
1012
281
|
function createMenuItem(item, props, activeKey, collapsed, expanded) {
|
|
1013
|
-
const li =
|
|
282
|
+
const li = createElement2("li");
|
|
1014
283
|
const children = item.children ?? [];
|
|
1015
284
|
const hasChildren = children.length > 0;
|
|
1016
285
|
const active = item.key === activeKey;
|
|
1017
286
|
const activeDescendant = children.some((child) => hasActiveDescendant(child, activeKey));
|
|
1018
287
|
const isExpanded = expanded.value.has(item.key) || activeDescendant;
|
|
1019
|
-
|
|
288
|
+
setAttribute3(li, "class", `vobs-kit-menu__item${active || activeDescendant ? " is-active" : ""}`);
|
|
1020
289
|
setOptionalAttribute(li, "data-menu-key", item.key);
|
|
1021
290
|
if (hasChildren) {
|
|
1022
|
-
const groupButton =
|
|
1023
|
-
|
|
1024
|
-
|
|
1025
|
-
|
|
291
|
+
const groupButton = createElement2("button");
|
|
292
|
+
setAttribute3(groupButton, "type", "button");
|
|
293
|
+
setAttribute3(groupButton, "class", "vobs-kit-menu__link vobs-kit-menu__group-toggle");
|
|
294
|
+
setAttribute3(groupButton, "aria-expanded", isExpanded ? "true" : "false");
|
|
1026
295
|
if (collapsed) setOptionalAttribute(groupButton, "title", item.label);
|
|
1027
296
|
appendMenuContent(groupButton, item, collapsed);
|
|
1028
|
-
|
|
297
|
+
addEventListener2(groupButton, "click", () => {
|
|
1029
298
|
toggleExpanded(expanded, item.key);
|
|
1030
299
|
if (item.href !== void 0) emitSelect(props, item);
|
|
1031
300
|
});
|
|
1032
|
-
|
|
301
|
+
insertBefore3(li, groupButton, null);
|
|
1033
302
|
if (isExpanded) {
|
|
1034
|
-
const nested =
|
|
1035
|
-
|
|
1036
|
-
|
|
303
|
+
const nested = createElement2("ul");
|
|
304
|
+
setAttribute3(nested, "class", "vobs-kit-menu__children");
|
|
305
|
+
setAttribute3(nested, "role", "menu");
|
|
1037
306
|
for (const child of children) {
|
|
1038
|
-
|
|
307
|
+
insertBefore3(nested, createMenuItem(child, props, activeKey, collapsed, expanded), null);
|
|
1039
308
|
}
|
|
1040
|
-
|
|
309
|
+
insertBefore3(li, nested, null);
|
|
1041
310
|
}
|
|
1042
311
|
} else {
|
|
1043
|
-
const link =
|
|
1044
|
-
|
|
1045
|
-
if (item.href === void 0)
|
|
312
|
+
const link = createElement2(item.href === void 0 ? "button" : "a");
|
|
313
|
+
setAttribute3(link, "class", "vobs-kit-menu__link");
|
|
314
|
+
if (item.href === void 0) setAttribute3(link, "type", "button");
|
|
1046
315
|
else {
|
|
1047
|
-
|
|
316
|
+
setAttribute3(link, "href", item.href);
|
|
1048
317
|
setOptionalAttribute(link, "target", item.target);
|
|
1049
318
|
setOptionalAttribute(link, "rel", item.rel);
|
|
1050
319
|
}
|
|
1051
|
-
if (active)
|
|
320
|
+
if (active) setAttribute3(link, "aria-current", "page");
|
|
1052
321
|
if (item.disabled === true) {
|
|
1053
|
-
|
|
1054
|
-
|
|
322
|
+
setAttribute3(link, "aria-disabled", "true");
|
|
323
|
+
setProperty2(link, "disabled", true);
|
|
1055
324
|
}
|
|
1056
325
|
if (collapsed) setOptionalAttribute(link, "title", item.label);
|
|
1057
326
|
appendMenuContent(link, item, collapsed);
|
|
1058
|
-
|
|
327
|
+
addEventListener2(link, "click", (event) => {
|
|
1059
328
|
if (item.disabled === true) {
|
|
1060
329
|
event.preventDefault?.();
|
|
1061
330
|
return;
|
|
1062
331
|
}
|
|
1063
332
|
emitSelect(props, item);
|
|
1064
333
|
});
|
|
1065
|
-
|
|
334
|
+
insertBefore3(li, link, null);
|
|
1066
335
|
}
|
|
1067
336
|
return li;
|
|
1068
337
|
}
|
|
1069
338
|
__name(createMenuItem, "createMenuItem");
|
|
1070
339
|
function appendMenuContent(parent, item, collapsed) {
|
|
1071
340
|
if (item.icon !== void 0) {
|
|
1072
|
-
const icon =
|
|
1073
|
-
|
|
341
|
+
const icon = createElement2("span");
|
|
342
|
+
setAttribute3(icon, "class", "vobs-kit-menu__icon");
|
|
1074
343
|
mountSlot(icon, item, "icon");
|
|
1075
|
-
|
|
344
|
+
insertBefore3(parent, icon, null);
|
|
1076
345
|
}
|
|
1077
|
-
const label =
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
346
|
+
const label = createElement2("span");
|
|
347
|
+
setAttribute3(label, "class", "vobs-kit-menu__label");
|
|
348
|
+
insertBefore3(label, createText3(item.label), null);
|
|
349
|
+
insertBefore3(parent, label, null);
|
|
1081
350
|
if (item.badge !== void 0 && !collapsed) {
|
|
1082
|
-
const badge =
|
|
1083
|
-
|
|
351
|
+
const badge = createElement2("span");
|
|
352
|
+
setAttribute3(badge, "class", "vobs-kit-menu__badge");
|
|
1084
353
|
mountSlot(badge, item, "badge");
|
|
1085
|
-
|
|
354
|
+
insertBefore3(parent, badge, null);
|
|
1086
355
|
}
|
|
1087
356
|
if (item.children && item.children.length > 0) {
|
|
1088
|
-
const expand =
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
|
|
357
|
+
const expand = createElement2("span");
|
|
358
|
+
setAttribute3(expand, "class", "vobs-kit-menu__expand");
|
|
359
|
+
setAttribute3(expand, "aria-hidden", "true");
|
|
360
|
+
insertBefore3(parent, expand, null);
|
|
1092
361
|
}
|
|
1093
362
|
}
|
|
1094
363
|
__name(appendMenuContent, "appendMenuContent");
|
|
@@ -1112,8 +381,8 @@ __name(hasActiveDescendant, "hasActiveDescendant");
|
|
|
1112
381
|
|
|
1113
382
|
// packages/layout/src/sidebar.ts
|
|
1114
383
|
function KitSidebar(props = {}) {
|
|
1115
|
-
const root =
|
|
1116
|
-
const close =
|
|
384
|
+
const root = createElement3("aside");
|
|
385
|
+
const close = createElement3("button");
|
|
1117
386
|
bindClassList(root, props, () => [
|
|
1118
387
|
"vobs-kit-sidebar",
|
|
1119
388
|
readProp(props, "collapsed", false) ? "is-collapsed" : void 0,
|
|
@@ -1133,23 +402,23 @@ function KitSidebar(props = {}) {
|
|
|
1133
402
|
"onClose"
|
|
1134
403
|
]);
|
|
1135
404
|
bindUserStyle(root, props);
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
405
|
+
setAttribute4(close, "type", "button");
|
|
406
|
+
setAttribute4(close, "class", "vobs-kit-sidebar__close");
|
|
407
|
+
effect3(() => {
|
|
1139
408
|
setOptionalAttribute(close, "aria-label", readProp(props, "closeLabel", "Close navigation"));
|
|
1140
409
|
});
|
|
1141
|
-
|
|
1142
|
-
|
|
410
|
+
insertBefore4(close, createCloseLabel(props), null);
|
|
411
|
+
addEventListener3(close, "click", () => {
|
|
1143
412
|
const handler = readProp(props, "onClose", void 0);
|
|
1144
413
|
if (typeof handler === "function") handler();
|
|
1145
414
|
});
|
|
1146
|
-
|
|
1147
|
-
|
|
415
|
+
insertBefore4(root, close, null);
|
|
416
|
+
insertDynamic3(root, null, () => createDefaultMenu(props));
|
|
1148
417
|
if (hasProp(props, "footer")) {
|
|
1149
|
-
const footer =
|
|
1150
|
-
|
|
418
|
+
const footer = createElement3("div");
|
|
419
|
+
setAttribute4(footer, "class", "vobs-kit-sidebar__footer");
|
|
1151
420
|
mountSlot(footer, props, "footer");
|
|
1152
|
-
|
|
421
|
+
insertBefore4(root, footer, null);
|
|
1153
422
|
}
|
|
1154
423
|
if (hasProp(props, "children")) mountSlot(root, props, "children");
|
|
1155
424
|
return root;
|
|
@@ -1175,21 +444,22 @@ function createDefaultMenu(props) {
|
|
|
1175
444
|
}
|
|
1176
445
|
__name(createDefaultMenu, "createDefaultMenu");
|
|
1177
446
|
function createCloseLabel(props) {
|
|
1178
|
-
const text =
|
|
1179
|
-
const content =
|
|
1180
|
-
|
|
447
|
+
const text = createElement3("span");
|
|
448
|
+
const content = createText4("");
|
|
449
|
+
setAttribute4(text, "class", "vobs-kit-sidebar__close-label");
|
|
1181
450
|
bindTextContent(content, () => readProp(props, "closeLabel", "Close navigation"));
|
|
1182
|
-
|
|
451
|
+
insertBefore4(text, content, null);
|
|
1183
452
|
return text;
|
|
1184
453
|
}
|
|
1185
454
|
__name(createCloseLabel, "createCloseLabel");
|
|
1186
455
|
|
|
1187
456
|
// packages/layout/src/viewport.ts
|
|
457
|
+
import { getCurrentOwner, memo, onDispose, state as state2 } from "@vobs/reactivity";
|
|
1188
458
|
var DEFAULT_MOBILE_BREAKPOINT = 768;
|
|
1189
459
|
function createKitViewport(breakpoint = DEFAULT_MOBILE_BREAKPOINT) {
|
|
1190
460
|
const normalizedBreakpoint = normalizeBreakpoint(breakpoint);
|
|
1191
|
-
const width =
|
|
1192
|
-
const height =
|
|
461
|
+
const width = state2(readWidth(), "layout.viewport.width");
|
|
462
|
+
const height = state2(readHeight(), "layout.viewport.height");
|
|
1193
463
|
const isMobile = memo(() => width.value < normalizedBreakpoint);
|
|
1194
464
|
let disposed = false;
|
|
1195
465
|
const onResize = /* @__PURE__ */ __name(() => {
|
|
@@ -1235,33 +505,33 @@ __name(readHeight, "readHeight");
|
|
|
1235
505
|
|
|
1236
506
|
// packages/layout/src/layout.ts
|
|
1237
507
|
function KitLayout(props = {}) {
|
|
1238
|
-
const root =
|
|
1239
|
-
const header =
|
|
1240
|
-
const body =
|
|
1241
|
-
const sidebar =
|
|
1242
|
-
const main =
|
|
1243
|
-
const breadcrumb =
|
|
1244
|
-
const tabs =
|
|
1245
|
-
const content =
|
|
1246
|
-
const backdrop =
|
|
1247
|
-
const footer =
|
|
508
|
+
const root = createElement4("div");
|
|
509
|
+
const header = createElement4("div");
|
|
510
|
+
const body = createElement4("div");
|
|
511
|
+
const sidebar = createElement4("div");
|
|
512
|
+
const main = createElement4("main");
|
|
513
|
+
const breadcrumb = createElement4("div");
|
|
514
|
+
const tabs = createElement4("div");
|
|
515
|
+
const content = createElement4("div");
|
|
516
|
+
const backdrop = createElement4("div");
|
|
517
|
+
const footer = createElement4("footer");
|
|
1248
518
|
const breakpoint = normalizeBreakpoint(
|
|
1249
519
|
readProp(props, "mobileBreakpoint", DEFAULT_MOBILE_BREAKPOINT)
|
|
1250
520
|
);
|
|
1251
521
|
const viewport = createKitViewport(breakpoint);
|
|
1252
522
|
const sidebarExpanded = readProp(props, "sidebarExpanded", false);
|
|
1253
|
-
const internalCollapsed =
|
|
523
|
+
const internalCollapsed = state3(
|
|
1254
524
|
readProp(props, "sidebarCollapsed", void 0) ?? !sidebarExpanded
|
|
1255
525
|
);
|
|
1256
|
-
const internalMobileOpen =
|
|
1257
|
-
const collapsed =
|
|
1258
|
-
const mobileOpen =
|
|
1259
|
-
const headerVisible =
|
|
1260
|
-
const sidebarVisible =
|
|
1261
|
-
const backdropVisible =
|
|
1262
|
-
const breadcrumbVisible =
|
|
1263
|
-
const tabsVisible =
|
|
1264
|
-
const footerVisible =
|
|
526
|
+
const internalMobileOpen = state3(readProp(props, "mobileOpen", void 0) ?? false);
|
|
527
|
+
const collapsed = memo2(() => readProp(props, "sidebarCollapsed", void 0) ?? internalCollapsed.value);
|
|
528
|
+
const mobileOpen = memo2(() => readProp(props, "mobileOpen", void 0) ?? internalMobileOpen.value);
|
|
529
|
+
const headerVisible = state3(!isProvided(props, "header"));
|
|
530
|
+
const sidebarVisible = state3(isProvided(props, "sidebar") || hasProp(props, "menu"));
|
|
531
|
+
const backdropVisible = state3(!isProvided(props, "mobileBackdrop"));
|
|
532
|
+
const breadcrumbVisible = state3(false);
|
|
533
|
+
const tabsVisible = state3(false);
|
|
534
|
+
const footerVisible = state3(false);
|
|
1265
535
|
const context = {
|
|
1266
536
|
sidebarCollapsed: collapsed,
|
|
1267
537
|
mobileOpen,
|
|
@@ -1325,41 +595,41 @@ function KitLayout(props = {}) {
|
|
|
1325
595
|
if (sidebarWidth === void 0) return "";
|
|
1326
596
|
return `--vobs-kit-sidebar-width: ${normalizeSidebarWidth(sidebarWidth)}px`;
|
|
1327
597
|
});
|
|
1328
|
-
|
|
1329
|
-
|
|
598
|
+
setAttribute5(header, "class", "vobs-kit-layout__header");
|
|
599
|
+
insertDynamic4(header, null, () => createHeaderSlot(props, context, headerVisible));
|
|
1330
600
|
bindVisibility(header, headerVisible);
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
601
|
+
setAttribute5(body, "class", "vobs-kit-layout__body");
|
|
602
|
+
setAttribute5(sidebar, "class", "vobs-kit-layout__sidebar");
|
|
603
|
+
setAttribute5(main, "class", "vobs-kit-layout__main");
|
|
604
|
+
setAttribute5(breadcrumb, "class", "vobs-kit-layout__breadcrumb");
|
|
605
|
+
setAttribute5(tabs, "class", "vobs-kit-layout__tabs");
|
|
606
|
+
setAttribute5(content, "class", "vobs-kit-layout__content");
|
|
607
|
+
insertDynamic4(sidebar, null, () => createSidebarSlot(props, context, sidebarVisible));
|
|
1338
608
|
bindVisibility(sidebar, sidebarVisible);
|
|
1339
|
-
|
|
609
|
+
insertDynamic4(breadcrumb, null, () => createNamedSlot(props, "breadcrumb", breadcrumbVisible));
|
|
1340
610
|
bindVisibility(breadcrumb, breadcrumbVisible);
|
|
1341
|
-
|
|
611
|
+
insertDynamic4(tabs, null, () => createNamedSlot(props, "tabs", tabsVisible));
|
|
1342
612
|
bindVisibility(tabs, tabsVisible);
|
|
1343
613
|
if (hasProp(props, "children")) mountSlot(content, props, "children");
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
bindVisibility(backdrop,
|
|
1352
|
-
|
|
1353
|
-
|
|
614
|
+
insertBefore5(main, breadcrumb, null);
|
|
615
|
+
insertBefore5(main, tabs, null);
|
|
616
|
+
insertBefore5(main, content, null);
|
|
617
|
+
insertBefore5(body, sidebar, null);
|
|
618
|
+
insertBefore5(body, main, null);
|
|
619
|
+
setAttribute5(backdrop, "class", "vobs-kit-layout__backdrop");
|
|
620
|
+
insertDynamic4(backdrop, null, () => createBackdropSlot(props, context, sidebarVisible, backdropVisible));
|
|
621
|
+
bindVisibility(backdrop, memo2(() => backdropVisible.value && sidebarVisible.value && mobileOpen.value));
|
|
622
|
+
setAttribute5(footer, "class", "vobs-kit-layout__footer");
|
|
623
|
+
insertDynamic4(footer, null, () => {
|
|
1354
624
|
const value = isProvided(props, "footer") ? resolveSlot(readProp(props, "footer", void 0)) : null;
|
|
1355
625
|
footerVisible.value = value !== null;
|
|
1356
626
|
return value;
|
|
1357
627
|
});
|
|
1358
628
|
bindVisibility(footer, footerVisible);
|
|
1359
|
-
|
|
1360
|
-
|
|
1361
|
-
|
|
1362
|
-
|
|
629
|
+
insertBefore5(root, header, null);
|
|
630
|
+
insertBefore5(root, body, null);
|
|
631
|
+
insertBefore5(root, backdrop, null);
|
|
632
|
+
insertBefore5(root, footer, null);
|
|
1363
633
|
return root;
|
|
1364
634
|
}
|
|
1365
635
|
__name(KitLayout, "KitLayout");
|
|
@@ -1370,7 +640,7 @@ function createHeaderSlot(props, context, visible) {
|
|
|
1370
640
|
return value;
|
|
1371
641
|
}
|
|
1372
642
|
visible.value = true;
|
|
1373
|
-
return
|
|
643
|
+
return createComponent2(KitHeader, {
|
|
1374
644
|
get logo() {
|
|
1375
645
|
return readProp(props, "logo", void 0);
|
|
1376
646
|
},
|
|
@@ -1402,7 +672,7 @@ function createSidebarSlot(props, context, visible) {
|
|
|
1402
672
|
return null;
|
|
1403
673
|
}
|
|
1404
674
|
visible.value = true;
|
|
1405
|
-
return
|
|
675
|
+
return createComponent2(KitSidebar, {
|
|
1406
676
|
get menu() {
|
|
1407
677
|
return readProp(props, "menu", []);
|
|
1408
678
|
},
|
|
@@ -1446,12 +716,12 @@ function createBackdropSlot(props, context, sidebarVisible, visible) {
|
|
|
1446
716
|
return null;
|
|
1447
717
|
}
|
|
1448
718
|
visible.value = true;
|
|
1449
|
-
const button =
|
|
1450
|
-
|
|
1451
|
-
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
|
|
719
|
+
const button = createElement4("button");
|
|
720
|
+
setAttribute5(button, "type", "button");
|
|
721
|
+
setAttribute5(button, "class", "vobs-kit-layout__backdrop-button");
|
|
722
|
+
setAttribute5(button, "aria-label", "Close navigation");
|
|
723
|
+
insertBefore5(button, createText5(""), null);
|
|
724
|
+
addEventListener4(button, "click", () => {
|
|
1455
725
|
context.setMobileOpen(false);
|
|
1456
726
|
const handler = readProp(props, "onCloseSidebar", void 0);
|
|
1457
727
|
if (typeof handler === "function") handler();
|
|
@@ -1460,8 +730,8 @@ function createBackdropSlot(props, context, sidebarVisible, visible) {
|
|
|
1460
730
|
}
|
|
1461
731
|
__name(createBackdropSlot, "createBackdropSlot");
|
|
1462
732
|
function bindVisibility(node, visible) {
|
|
1463
|
-
|
|
1464
|
-
|
|
733
|
+
effect4(() => {
|
|
734
|
+
setProperty3(node, "hidden", !visible.value);
|
|
1465
735
|
setOptionalAttribute(node, "aria-hidden", visible.value ? void 0 : "true");
|
|
1466
736
|
});
|
|
1467
737
|
}
|
|
@@ -1483,51 +753,61 @@ function isProvided(props, name) {
|
|
|
1483
753
|
__name(isProvided, "isProvided");
|
|
1484
754
|
|
|
1485
755
|
// packages/layout/src/breadcrumb.ts
|
|
756
|
+
import {
|
|
757
|
+
addEventListener as addEventListener5,
|
|
758
|
+
createElement as createElement5,
|
|
759
|
+
createFragment as createFragment3,
|
|
760
|
+
createText as createText6,
|
|
761
|
+
insertBefore as insertBefore6,
|
|
762
|
+
insertDynamic as insertDynamic5,
|
|
763
|
+
setAttribute as setAttribute6,
|
|
764
|
+
setProperty as setProperty4
|
|
765
|
+
} from "@vobs/vobs";
|
|
1486
766
|
function KitBreadcrumb(props) {
|
|
1487
|
-
const root =
|
|
767
|
+
const root = createElement5("nav");
|
|
1488
768
|
bindClassList(root, props, () => ["vobs-kit-breadcrumb"]);
|
|
1489
769
|
bindCommonAttributes(root, props, ["items", "separator", "onNavigate"]);
|
|
1490
|
-
if (!hasProp(props, "aria-label"))
|
|
1491
|
-
const list =
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
770
|
+
if (!hasProp(props, "aria-label")) setAttribute6(root, "aria-label", "Breadcrumb");
|
|
771
|
+
const list = createElement5("ol");
|
|
772
|
+
setAttribute6(list, "class", "vobs-kit-breadcrumb__list");
|
|
773
|
+
insertDynamic5(list, null, () => createBreadcrumbItems(props));
|
|
774
|
+
insertBefore6(root, list, null);
|
|
1495
775
|
if (hasProp(props, "children")) mountSlot(root, props, "children");
|
|
1496
776
|
return root;
|
|
1497
777
|
}
|
|
1498
778
|
__name(KitBreadcrumb, "KitBreadcrumb");
|
|
1499
779
|
function createBreadcrumbItems(props) {
|
|
1500
780
|
const items = readProp(props, "items", []);
|
|
1501
|
-
return
|
|
781
|
+
return createFragment3((parent, anchor) => {
|
|
1502
782
|
for (let index = 0; index < items.length; index++) {
|
|
1503
783
|
const item = items[index];
|
|
1504
|
-
const entry =
|
|
784
|
+
const entry = createElement5("li");
|
|
1505
785
|
const isLast = index === items.length - 1;
|
|
1506
|
-
|
|
786
|
+
setAttribute6(entry, "class", `vobs-kit-breadcrumb__item${isLast ? " is-current" : ""}`);
|
|
1507
787
|
if (item.key !== void 0) setOptionalAttribute(entry, "data-breadcrumb-key", item.key);
|
|
1508
788
|
if (index > 0) {
|
|
1509
|
-
const separator =
|
|
1510
|
-
|
|
1511
|
-
|
|
789
|
+
const separator = createElement5("span");
|
|
790
|
+
setAttribute6(separator, "class", "vobs-kit-breadcrumb__separator");
|
|
791
|
+
setAttribute6(separator, "aria-hidden", "true");
|
|
1512
792
|
if (hasProp(props, "separator")) mountSlot(separator, props, "separator");
|
|
1513
|
-
else
|
|
1514
|
-
|
|
793
|
+
else insertBefore6(separator, createText6("/"), null);
|
|
794
|
+
insertBefore6(entry, separator, null);
|
|
1515
795
|
}
|
|
1516
796
|
const content = createBreadcrumbContent(item, props, index, isLast);
|
|
1517
|
-
|
|
1518
|
-
|
|
797
|
+
insertBefore6(entry, content, null);
|
|
798
|
+
insertBefore6(parent, entry, anchor);
|
|
1519
799
|
}
|
|
1520
800
|
});
|
|
1521
801
|
}
|
|
1522
802
|
__name(createBreadcrumbItems, "createBreadcrumbItems");
|
|
1523
803
|
function createBreadcrumbContent(item, props, index, isLast) {
|
|
1524
804
|
const isLink = item.href !== void 0 && !isLast;
|
|
1525
|
-
const element = isLink ?
|
|
1526
|
-
|
|
1527
|
-
|
|
805
|
+
const element = isLink ? createElement5("a") : createElement5("span");
|
|
806
|
+
setAttribute6(element, "class", "vobs-kit-breadcrumb__label");
|
|
807
|
+
insertBefore6(element, createText6(item.label), null);
|
|
1528
808
|
if (isLink) {
|
|
1529
|
-
|
|
1530
|
-
|
|
809
|
+
setAttribute6(element, "href", item.href);
|
|
810
|
+
addEventListener5(element, "click", (event) => {
|
|
1531
811
|
if (item.disabled === true) {
|
|
1532
812
|
event.preventDefault?.();
|
|
1533
813
|
return;
|
|
@@ -1539,18 +819,29 @@ function createBreadcrumbContent(item, props, index, isLast) {
|
|
|
1539
819
|
});
|
|
1540
820
|
}
|
|
1541
821
|
if (item.disabled === true) {
|
|
1542
|
-
|
|
1543
|
-
|
|
822
|
+
setAttribute6(element, "aria-disabled", "true");
|
|
823
|
+
setProperty4(element, "tabIndex", -1);
|
|
1544
824
|
}
|
|
1545
|
-
if (isLast)
|
|
825
|
+
if (isLast) setAttribute6(element, "aria-current", "page");
|
|
1546
826
|
return element;
|
|
1547
827
|
}
|
|
1548
828
|
__name(createBreadcrumbContent, "createBreadcrumbContent");
|
|
1549
829
|
|
|
1550
830
|
// packages/layout/src/tabs.ts
|
|
831
|
+
import { state as state4 } from "@vobs/reactivity";
|
|
832
|
+
import {
|
|
833
|
+
addEventListener as addEventListener6,
|
|
834
|
+
createElement as createElement6,
|
|
835
|
+
createFragment as createFragment4,
|
|
836
|
+
createText as createText7,
|
|
837
|
+
insertBefore as insertBefore7,
|
|
838
|
+
insertDynamic as insertDynamic6,
|
|
839
|
+
setAttribute as setAttribute7,
|
|
840
|
+
setProperty as setProperty5
|
|
841
|
+
} from "@vobs/vobs";
|
|
1551
842
|
function KitTabs(props = {}) {
|
|
1552
|
-
const root =
|
|
1553
|
-
const active =
|
|
843
|
+
const root = createElement6("nav");
|
|
844
|
+
const active = state4(void 0);
|
|
1554
845
|
bindClassList(root, props, () => ["vobs-kit-tabs"]);
|
|
1555
846
|
bindCommonAttributes(root, props, [
|
|
1556
847
|
"tabs",
|
|
@@ -1562,9 +853,9 @@ function KitTabs(props = {}) {
|
|
|
1562
853
|
"onChange",
|
|
1563
854
|
"onClose"
|
|
1564
855
|
]);
|
|
1565
|
-
if (!hasProp(props, "aria-label"))
|
|
1566
|
-
if (!hasProp(props, "role"))
|
|
1567
|
-
|
|
856
|
+
if (!hasProp(props, "aria-label")) setAttribute7(root, "aria-label", "Tabs");
|
|
857
|
+
if (!hasProp(props, "role")) setAttribute7(root, "role", "tablist");
|
|
858
|
+
insertDynamic6(root, null, () => createTabItems(props, active));
|
|
1568
859
|
if (hasProp(props, "children")) mountSlot(root, props, "children");
|
|
1569
860
|
return root;
|
|
1570
861
|
}
|
|
@@ -1576,52 +867,52 @@ function createTabItems(props, internal) {
|
|
|
1576
867
|
"activeKey",
|
|
1577
868
|
readProp(props, "value", void 0)
|
|
1578
869
|
) ?? internal.value ?? tabs.find((tab) => tab.disabled !== true)?.id;
|
|
1579
|
-
return
|
|
870
|
+
return createFragment4((parent, anchor) => {
|
|
1580
871
|
for (const tab of tabs) {
|
|
1581
|
-
|
|
872
|
+
insertBefore7(parent, createTab(tab, props, selected, internal), anchor);
|
|
1582
873
|
}
|
|
1583
874
|
});
|
|
1584
875
|
}
|
|
1585
876
|
__name(createTabItems, "createTabItems");
|
|
1586
877
|
function createTab(tab, props, selected, internal) {
|
|
1587
878
|
const active = tab.id === selected;
|
|
1588
|
-
const element =
|
|
1589
|
-
|
|
1590
|
-
|
|
1591
|
-
|
|
879
|
+
const element = createElement6(tab.href === void 0 ? "button" : "a");
|
|
880
|
+
setAttribute7(element, "class", `vobs-kit-tabs__tab${active ? " is-active" : ""}`);
|
|
881
|
+
setAttribute7(element, "role", "tab");
|
|
882
|
+
setAttribute7(element, "aria-selected", active ? "true" : "false");
|
|
1592
883
|
setOptionalAttribute(element, "data-tab-id", tab.id);
|
|
1593
|
-
if (tab.href === void 0)
|
|
1594
|
-
else
|
|
884
|
+
if (tab.href === void 0) setAttribute7(element, "type", "button");
|
|
885
|
+
else setAttribute7(element, "href", tab.href);
|
|
1595
886
|
if (tab.disabled === true) {
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
if (tab.href === void 0)
|
|
887
|
+
setAttribute7(element, "aria-disabled", "true");
|
|
888
|
+
setProperty5(element, "tabIndex", -1);
|
|
889
|
+
if (tab.href === void 0) setProperty5(element, "disabled", true);
|
|
1599
890
|
}
|
|
1600
891
|
if (tab.icon !== void 0) {
|
|
1601
|
-
const icon =
|
|
1602
|
-
|
|
892
|
+
const icon = createElement6("span");
|
|
893
|
+
setAttribute7(icon, "class", "vobs-kit-tabs__icon");
|
|
1603
894
|
mountSlot(icon, tab, "icon");
|
|
1604
|
-
|
|
895
|
+
insertBefore7(element, icon, null);
|
|
1605
896
|
}
|
|
1606
|
-
const label =
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
897
|
+
const label = createElement6("span");
|
|
898
|
+
setAttribute7(label, "class", "vobs-kit-tabs__label");
|
|
899
|
+
insertBefore7(label, createText7(tab.label), null);
|
|
900
|
+
insertBefore7(element, label, null);
|
|
1610
901
|
const closable = readProp(props, "closable", false) || tab.closable === true;
|
|
1611
902
|
if (closable) {
|
|
1612
|
-
const close =
|
|
1613
|
-
|
|
1614
|
-
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
|
|
903
|
+
const close = createElement6("button");
|
|
904
|
+
setAttribute7(close, "class", "vobs-kit-tabs__close");
|
|
905
|
+
setAttribute7(close, "type", "button");
|
|
906
|
+
setAttribute7(close, "aria-label", `Close ${tab.label}`);
|
|
907
|
+
insertBefore7(close, createText7("x"), null);
|
|
908
|
+
addEventListener6(close, "click", (event) => {
|
|
1618
909
|
event.stopPropagation?.();
|
|
1619
910
|
const handler = readProp(props, "onClose", void 0);
|
|
1620
911
|
if (typeof handler === "function") handler(tab);
|
|
1621
912
|
});
|
|
1622
|
-
|
|
913
|
+
insertBefore7(element, close, null);
|
|
1623
914
|
}
|
|
1624
|
-
|
|
915
|
+
addEventListener6(element, "click", (event) => {
|
|
1625
916
|
if (tab.disabled === true) {
|
|
1626
917
|
event.preventDefault?.();
|
|
1627
918
|
return;
|
|
@@ -1639,7 +930,17 @@ function isControlled(props) {
|
|
|
1639
930
|
return readProp(props, "activeKey", void 0) !== void 0 || readProp(props, "value", void 0) !== void 0;
|
|
1640
931
|
}
|
|
1641
932
|
__name(isControlled, "isControlled");
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
933
|
+
export {
|
|
934
|
+
DEFAULT_MOBILE_BREAKPOINT,
|
|
935
|
+
KIT_LAYOUT_KEY,
|
|
936
|
+
KitBreadcrumb,
|
|
937
|
+
KitHeader,
|
|
938
|
+
KitLayout,
|
|
939
|
+
KitMenu,
|
|
940
|
+
KitSidebar,
|
|
941
|
+
KitTabs,
|
|
942
|
+
createKitViewport,
|
|
943
|
+
normalizeBreakpoint,
|
|
944
|
+
useKitLayout
|
|
945
|
+
};
|
|
1645
946
|
//# sourceMappingURL=index.js.map
|