@editora/ui-core 0.1.19 → 0.1.20
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/{ElementBase-1b301e7f.js → ElementBase-EV6mVBUV.js} +1 -1
- package/dist/{ElementBase-909688f3.mjs → ElementBase-YlTLMsGk.mjs} +3 -3
- package/dist/accordion.cjs.js +3 -3
- package/dist/accordion.esm.js +39 -62
- package/dist/alert-dialog.cjs.js +19 -19
- package/dist/alert-dialog.esm.js +69 -87
- package/dist/alert.cjs.js +1 -1
- package/dist/alert.esm.js +4 -7
- package/dist/anchor.cjs.js +2 -2
- package/dist/anchor.esm.js +3 -3
- package/dist/animated-beam.cjs.js +83 -83
- package/dist/animated-beam.esm.js +250 -277
- package/dist/animated-list.cjs.js +4 -4
- package/dist/animated-list.esm.js +47 -61
- package/dist/animated-text.cjs.js +2 -2
- package/dist/animated-text.esm.js +13 -24
- package/dist/app-header.cjs.js +3 -3
- package/dist/app-header.esm.js +11 -13
- package/dist/aspect-ratio.cjs.js +1 -1
- package/dist/aspect-ratio.esm.js +4 -7
- package/dist/avatar.cjs.js +1 -1
- package/dist/avatar.esm.js +7 -13
- package/dist/badge.cjs.js +1 -1
- package/dist/badge.esm.js +4 -7
- package/dist/block-controls.cjs.js +2 -2
- package/dist/block-controls.esm.js +19 -35
- package/dist/box.cjs.js +1 -1
- package/dist/box.esm.js +8 -15
- package/dist/breadcrumb.cjs.js +2 -2
- package/dist/breadcrumb.esm.js +20 -37
- package/dist/button.cjs.js +1 -521
- package/dist/button.esm.js +2 -671
- package/dist/{calendar-2c11b824.mjs → calendar-DLY4acgn.mjs} +293 -342
- package/dist/{calendar-a8735e40.js → calendar-Dkof-FTK.js} +25 -25
- package/dist/calendar.cjs.js +1 -1
- package/dist/calendar.esm.js +8 -9
- package/dist/card.cjs.js +4 -4
- package/dist/card.esm.js +13 -19
- package/dist/chart.cjs.js +64 -64
- package/dist/chart.esm.js +223 -254
- package/dist/checkbox.cjs.js +1 -1
- package/dist/checkbox.esm.js +2 -3
- package/dist/collapsible.cjs.js +1 -1
- package/dist/collapsible.esm.js +5 -9
- package/dist/{collection-a1aac0c6.mjs → collection-C7URGjEI.mjs} +8 -14
- package/dist/collection.cjs.js +1 -1
- package/dist/collection.esm.js +4 -7
- package/dist/color-picker.cjs.js +9 -9
- package/dist/color-picker.esm.js +189 -252
- package/dist/combobox.cjs.js +13 -13
- package/dist/combobox.esm.js +93 -126
- package/dist/command-palette.cjs.js +3 -3
- package/dist/command-palette.esm.js +19 -30
- package/dist/command.cjs.js +4 -4
- package/dist/command.esm.js +41 -53
- package/dist/components/ui-orbiter.d.ts.map +1 -1
- package/dist/components/ui-skeleton.d.ts.map +1 -1
- package/dist/components/ui-split-button.d.ts +1 -0
- package/dist/components/ui-split-button.d.ts.map +1 -1
- package/dist/components/ui-time-picker.d.ts.map +1 -1
- package/dist/container.cjs.js +2 -2
- package/dist/container.esm.js +2 -3
- package/dist/context-menu.cjs.js +8 -8
- package/dist/context-menu.esm.js +157 -219
- package/dist/control-group.cjs.js +1 -1
- package/dist/control-group.esm.js +2 -3
- package/dist/data-table.cjs.js +4 -4
- package/dist/data-table.esm.js +299 -381
- package/dist/date-field.cjs.js +3 -3
- package/dist/date-field.esm.js +68 -80
- package/dist/date-picker.cjs.js +9 -9
- package/dist/date-picker.esm.js +69 -97
- package/dist/date-range-picker.cjs.js +3 -3
- package/dist/date-range-picker.esm.js +32 -56
- package/dist/date-range-time-picker.cjs.js +9 -9
- package/dist/date-range-time-picker.esm.js +111 -140
- package/dist/date-time-picker.cjs.js +4 -4
- package/dist/date-time-picker.esm.js +112 -144
- package/dist/date-time-utils-Dmost5Ee.js +1 -0
- package/dist/date-time-utils-y1N2gvG2.mjs +268 -0
- package/dist/description.cjs.js +1 -1
- package/dist/description.esm.js +3 -5
- package/dist/dialog.cjs.js +12 -12
- package/dist/dialog.esm.js +44 -63
- package/dist/direction-provider.cjs.js +1 -1
- package/dist/direction-provider.esm.js +2 -3
- package/dist/{dismissable-layer-9c7e6b58.mjs → dismissable-layer-BmPIoK80.mjs} +29 -33
- package/dist/dismissable-layer-DNfrKA20.js +1 -0
- package/dist/dismissable-layer.cjs.js +2 -2
- package/dist/dismissable-layer.esm.js +4 -6
- package/dist/dock.cjs.js +5 -5
- package/dist/dock.esm.js +134 -155
- package/dist/drawer.cjs.js +2 -2
- package/dist/drawer.esm.js +18 -35
- package/dist/dropdown.cjs.js +2 -2
- package/dist/dropdown.esm.js +119 -149
- package/dist/dropzone.cjs.js +1 -1
- package/dist/dropzone.esm.js +0 -1
- package/dist/empty-state.cjs.js +1 -1
- package/dist/empty-state.esm.js +1 -1
- package/dist/field-error.cjs.js +1 -1
- package/dist/field-error.esm.js +3 -5
- package/dist/field.cjs.js +5 -5
- package/dist/field.esm.js +27 -34
- package/dist/fieldset.cjs.js +4 -4
- package/dist/fieldset.esm.js +19 -24
- package/dist/file-upload.cjs.js +4 -4
- package/dist/file-upload.esm.js +69 -93
- package/dist/flex.cjs.js +1 -1
- package/dist/flex.esm.js +5 -9
- package/dist/floating-toolbar.cjs.js +4 -4
- package/dist/floating-toolbar.esm.js +60 -85
- package/dist/focus-scope-Bwug2gDv.js +1 -0
- package/dist/{focus-scope-103833ee.mjs → focus-scope-CmEsG5UZ.mjs} +39 -48
- package/dist/focus-scope.cjs.js +2 -2
- package/dist/focus-scope.esm.js +15 -20
- package/dist/form.cjs.js +2 -2
- package/dist/form.esm.js +26 -53
- package/dist/gantt.cjs.js +43 -43
- package/dist/gantt.esm.js +295 -322
- package/dist/grid.cjs.js +1 -1
- package/dist/grid.esm.js +5 -9
- package/dist/hover-card.cjs.js +4 -4
- package/dist/hover-card.esm.js +22 -28
- package/dist/icon-cloud.cjs.js +7 -7
- package/dist/icon-cloud.esm.js +48 -62
- package/dist/icon.cjs.js +1 -1
- package/dist/icon.esm.js +2 -4
- package/dist/index.cjs.js +1 -1
- package/dist/index.esm.js +378 -390
- package/dist/inline-edit.cjs.js +11 -11
- package/dist/inline-edit.esm.js +32 -36
- package/dist/input.cjs.js +17 -17
- package/dist/input.esm.js +50 -63
- package/dist/label.cjs.js +2 -2
- package/dist/label.esm.js +8 -17
- package/dist/layout.cjs.js +2 -2
- package/dist/layout.esm.js +20 -26
- package/dist/listbox-B6QgECax.js +46 -0
- package/dist/listbox-DJamVeFj.mjs +200 -0
- package/dist/listbox.cjs.js +1 -1
- package/dist/listbox.esm.js +2 -4
- package/dist/marquee.cjs.js +5 -5
- package/dist/marquee.esm.js +33 -50
- package/dist/masonry-grid.cjs.js +1 -1
- package/dist/masonry-grid.esm.js +5 -9
- package/dist/menu.cjs.js +3 -3
- package/dist/menu.esm.js +106 -126
- package/dist/menubar.cjs.js +5 -5
- package/dist/menubar.esm.js +118 -164
- package/dist/meter.cjs.js +2 -2
- package/dist/meter.esm.js +4 -4
- package/dist/multi-select.cjs.js +4 -4
- package/dist/multi-select.esm.js +120 -140
- package/dist/navigation-menu.cjs.js +4 -4
- package/dist/navigation-menu.esm.js +44 -55
- package/dist/number-field.cjs.js +2 -2
- package/dist/number-field.esm.js +73 -98
- package/dist/number-ticker.cjs.js +3 -3
- package/dist/number-ticker.esm.js +22 -43
- package/dist/odometer.cjs.js +1 -1
- package/dist/odometer.esm.js +5 -9
- package/dist/orbiter.cjs.js +13 -13
- package/dist/orbiter.esm.js +79 -90
- package/dist/{overlayManager-5bbd4dc3.mjs → overlayManager-BJjU1VA8.mjs} +4 -5
- package/dist/{overlayManager-0eda4e08.js → overlayManager-CSy3fJmJ.js} +1 -1
- package/dist/pagination.cjs.js +2 -2
- package/dist/pagination.esm.js +14 -18
- package/dist/{panel-group-a376cc5e.mjs → panel-group-8sVNnGxg.mjs} +24 -46
- package/dist/panel-group-CaD0_KQf.js +36 -0
- package/dist/panel-group.cjs.js +1 -1
- package/dist/panel-group.esm.js +2 -5
- package/dist/panel.cjs.js +4 -4
- package/dist/panel.esm.js +8 -10
- package/dist/password-field.cjs.js +9 -9
- package/dist/password-field.esm.js +62 -82
- package/dist/pin-input.cjs.js +3 -3
- package/dist/pin-input.esm.js +33 -39
- package/dist/placement-grid.cjs.js +4 -4
- package/dist/placement-grid.esm.js +108 -131
- package/dist/plugin-panel.cjs.js +7 -7
- package/dist/plugin-panel.esm.js +13 -15
- package/dist/popover.cjs.js +2 -2
- package/dist/popover.esm.js +21 -31
- package/dist/portal-DgpQ3Jo1.js +1 -0
- package/dist/{portal-fe73e5cc.mjs → portal-bR42gHvG.mjs} +43 -48
- package/dist/portal.cjs.js +2 -2
- package/dist/portal.esm.js +10 -19
- package/dist/{positioner-e9770c66.mjs → positioner-D0VGxtYU.mjs} +189 -209
- package/dist/positioner-D_fqyx_j.js +1 -0
- package/dist/positioner.cjs.js +2 -2
- package/dist/positioner.esm.js +11 -18
- package/dist/presence.cjs.js +1 -1
- package/dist/presence.esm.js +7 -13
- package/dist/progress.cjs.js +1 -1
- package/dist/progress.esm.js +5 -9
- package/dist/quick-actions.cjs.js +6 -6
- package/dist/quick-actions.esm.js +52 -62
- package/dist/radio-group.cjs.js +13 -13
- package/dist/radio-group.esm.js +39 -51
- package/dist/radio.cjs.js +1 -1
- package/dist/radio.esm.js +5 -9
- package/dist/rating.cjs.js +1 -1
- package/dist/rating.esm.js +12 -23
- package/dist/{roving-focus-group-4350c9a7.mjs → roving-focus-group-Dbm1Jko_.mjs} +3 -6
- package/dist/roving-focus-group.cjs.js +1 -1
- package/dist/roving-focus-group.esm.js +3 -5
- package/dist/runtime-CTaOSmBj.js +1 -0
- package/dist/{runtime-161f68a2.mjs → runtime-D1gFh1fS.mjs} +338 -366
- package/dist/runtime.cjs.js +1 -1
- package/dist/runtime.esm.js +6 -6
- package/dist/scroll-area.cjs.js +3 -3
- package/dist/scroll-area.esm.js +38 -46
- package/dist/{scroll-lock-31da444f.mjs → scroll-lock-LfqXXqsu.mjs} +5 -9
- package/dist/section.cjs.js +1 -1
- package/dist/section.esm.js +1 -1
- package/dist/select.cjs.js +7 -7
- package/dist/select.esm.js +67 -97
- package/dist/selection-popup.cjs.js +1 -1
- package/dist/selection-popup.esm.js +8 -15
- package/dist/separator.cjs.js +1 -1
- package/dist/separator.esm.js +1 -1
- package/dist/sidebar.cjs.js +18 -18
- package/dist/sidebar.esm.js +117 -139
- package/dist/skeleton.cjs.js +11 -11
- package/dist/skeleton.esm.js +27 -24
- package/dist/slider.cjs.js +1 -1
- package/dist/slider.esm.js +6 -11
- package/dist/slot.cjs.js +4 -4
- package/dist/slot.esm.js +16 -19
- package/dist/sortable.cjs.js +45 -45
- package/dist/sortable.esm.js +421 -524
- package/dist/spinning-text.cjs.js +12 -12
- package/dist/spinning-text.esm.js +80 -92
- package/dist/split-button.cjs.js +4 -4
- package/dist/split-button.esm.js +77 -62
- package/dist/splitter.cjs.js +1 -1
- package/dist/splitter.esm.js +1 -1
- package/dist/stepper.cjs.js +8 -8
- package/dist/stepper.esm.js +32 -52
- package/dist/switch.cjs.js +7 -7
- package/dist/switch.esm.js +23 -31
- package/dist/table.cjs.js +2 -2
- package/dist/table.esm.js +46 -56
- package/dist/tabs.cjs.js +3 -3
- package/dist/tabs.esm.js +35 -55
- package/dist/tags-input.cjs.js +4 -4
- package/dist/tags-input.esm.js +45 -62
- package/dist/textarea.cjs.js +6 -6
- package/dist/textarea.esm.js +32 -41
- package/dist/time-field.cjs.js +4 -4
- package/dist/time-field.esm.js +70 -84
- package/dist/time-picker.cjs.js +22 -22
- package/dist/time-picker.esm.js +88 -110
- package/dist/timeline.cjs.js +1 -1
- package/dist/timeline.esm.js +3 -5
- package/dist/toast.cjs.js +2 -2
- package/dist/toast.esm.js +33 -47
- package/dist/toggle-group.cjs.js +6 -6
- package/dist/toggle-group.esm.js +85 -105
- package/dist/toggle.cjs.js +1 -1
- package/dist/toggle.esm.js +3 -5
- package/dist/toolbar.cjs.js +1 -1
- package/dist/toolbar.esm.js +13 -24
- package/dist/tooltip.cjs.js +2 -2
- package/dist/tooltip.esm.js +31 -42
- package/dist/transfer-list.cjs.js +19 -19
- package/dist/transfer-list.esm.js +98 -111
- package/dist/{tree-dcd74a4a.mjs → tree-B3kE8ESs.mjs} +55 -62
- package/dist/tree-Dx_kv_ih.js +39 -0
- package/dist/tree-item.cjs.js +2 -2
- package/dist/tree-item.esm.js +2 -3
- package/dist/tree.cjs.js +1 -1
- package/dist/tree.esm.js +2 -5
- package/dist/ui-button-Q0GNNWKC.mjs +665 -0
- package/dist/ui-button-rXQOS9QJ.js +521 -0
- package/dist/{icon-9e9da03b.js → ui-icon-BzVNC_lr.js} +4 -4
- package/dist/{icon-e2a85cc1.mjs → ui-icon-YI6lyuqU.mjs} +58 -65
- package/dist/visually-hidden.cjs.js +1 -1
- package/dist/visually-hidden.esm.js +1 -1
- package/dist/wizard.cjs.js +14 -14
- package/dist/wizard.esm.js +85 -105
- package/package.json +2 -2
- package/dist/date-time-utils-66480de4.js +0 -1
- package/dist/date-time-utils-a2c7af25.mjs +0 -307
- package/dist/dismissable-layer-193e3bed.js +0 -1
- package/dist/focus-scope-2b12b4e7.js +0 -1
- package/dist/listbox-308789a0.mjs +0 -210
- package/dist/listbox-ef2f708e.js +0 -46
- package/dist/panel-group-40254cdd.js +0 -36
- package/dist/portal-c69756c0.js +0 -1
- package/dist/positioner-33529bb8.js +0 -1
- package/dist/runtime-3f13807b.js +0 -1
- package/dist/tree-0a7a8d05.js +0 -39
- /package/dist/{collection-a2969ad2.js → collection-qv8A8rq4.js} +0 -0
- /package/dist/{menu-item-styles-27fdbac4.mjs → menu-item-styles-CZiPwPwl.mjs} +0 -0
- /package/dist/{menu-item-styles-83ad1e22.js → menu-item-styles-CbNUEwP2.js} +0 -0
- /package/dist/{roving-focus-group-5c059bf9.js → roving-focus-group-BdJ_4Njm.js} +0 -0
- /package/dist/{scroll-lock-d7b0df21.js → scroll-lock-BX6e3Ced.js} +0 -0
package/dist/pagination.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { E as e } from "./ElementBase-
|
|
1
|
+
import { E as e } from "./ElementBase-YlTLMsGk.mjs";
|
|
2
2
|
const r = `
|
|
3
3
|
:host {
|
|
4
4
|
display: inline-flex;
|
|
@@ -227,8 +227,8 @@ class s extends e {
|
|
|
227
227
|
t += `<button type="button" data-page="1" aria-label="First" ${this._page === 1 ? "disabled" : ""}>«</button>`, t += `<button type="button" data-page="${this._page - 1}" aria-label="Previous" ${this._page === 1 ? "disabled" : ""}>‹</button>`;
|
|
228
228
|
const a = this._getPageRange(this._page, this._count);
|
|
229
229
|
a[0] > 1 && (t += '<button type="button" data-page="1">1</button>', a[0] > 2 && (t += '<span class="ellipsis" aria-hidden="true">…</span>'));
|
|
230
|
-
for (let
|
|
231
|
-
t += `<button type="button" data-page="${
|
|
230
|
+
for (let n = a[0]; n <= a[1]; n++)
|
|
231
|
+
t += `<button type="button" data-page="${n}" ${n === this._page ? 'aria-current="page"' : ""}>${n}</button>`;
|
|
232
232
|
a[1] < this._count && (a[1] < this._count - 1 && (t += '<span class="ellipsis" aria-hidden="true">…</span>'), t += `<button type="button" data-page="${this._count}">${this._count}</button>`), t += `<button type="button" data-page="${this._page + 1}" aria-label="Next" ${this._page === this._count ? "disabled" : ""}>›</button>`, t += `<button type="button" data-page="${this._count}" aria-label="Last" ${this._page === this._count ? "disabled" : ""}>»</button>`, this.setContent(`
|
|
233
233
|
<style>${r}</style>
|
|
234
234
|
<nav class="pagination" role="navigation" aria-label="${this.getAttribute("aria-label") || "Pagination"}" tabindex="0">
|
|
@@ -255,40 +255,36 @@ class s extends e {
|
|
|
255
255
|
this.goToPage(this._count);
|
|
256
256
|
}
|
|
257
257
|
focusCurrent() {
|
|
258
|
-
|
|
259
|
-
t == null || t.focus();
|
|
258
|
+
this.root.querySelector('button[aria-current="page"]')?.focus();
|
|
260
259
|
}
|
|
261
260
|
_getPageRange(t, a) {
|
|
262
261
|
return a <= 5 ? [1, a] : t <= 3 ? [1, 5] : t >= a - 2 ? [a - 4, a] : [t - 2, t + 2];
|
|
263
262
|
}
|
|
264
263
|
_onClick(t) {
|
|
265
264
|
const a = t.target.closest("button[data-page]");
|
|
266
|
-
if (!a || a.hasAttribute("disabled"))
|
|
267
|
-
return;
|
|
265
|
+
if (!a || a.hasAttribute("disabled")) return;
|
|
268
266
|
const i = Number(a.getAttribute("data-page"));
|
|
269
267
|
isNaN(i) || i < 1 || i > this._count || i === this._page || this._applyPageChange(i);
|
|
270
268
|
}
|
|
271
269
|
_onKeyDown(t) {
|
|
272
270
|
const a = this.root.querySelector(".pagination");
|
|
273
|
-
if (!a)
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
t.key === "ArrowRight" || t.key === "ArrowDown" ? (n = (n + 1) % i.length, i[n].focus(), t.preventDefault()) : t.key === "ArrowLeft" || t.key === "ArrowUp" ? (n = (n - 1 + i.length) % i.length, i[n].focus(), t.preventDefault()) : t.key === "Home" ? (i[0].focus(), t.preventDefault()) : t.key === "End" && (i[i.length - 1].focus(), t.preventDefault());
|
|
271
|
+
if (!a) return;
|
|
272
|
+
const i = Array.from(a.querySelectorAll("button:not(:disabled)")), n = this.root.activeElement;
|
|
273
|
+
let o = i.indexOf(n);
|
|
274
|
+
t.key === "ArrowRight" || t.key === "ArrowDown" ? (o = (o + 1) % i.length, i[o].focus(), t.preventDefault()) : t.key === "ArrowLeft" || t.key === "ArrowUp" ? (o = (o - 1 + i.length) % i.length, i[o].focus(), t.preventDefault()) : t.key === "Home" ? (i[0].focus(), t.preventDefault()) : t.key === "End" && (i[i.length - 1].focus(), t.preventDefault());
|
|
278
275
|
}
|
|
279
276
|
_applyPageChange(t) {
|
|
280
277
|
const a = this._page, i = Math.max(1, Math.min(this._count, Number(t) || 1));
|
|
281
|
-
if (i === a)
|
|
282
|
-
|
|
283
|
-
const o = i === 1 && a !== 1 ? "first" : i === this._count && a !== this._count ? "last" : i === a - 1 ? "prev" : i === a + 1 ? "next" : "change";
|
|
278
|
+
if (i === a) return;
|
|
279
|
+
const n = i === 1 && a !== 1 ? "first" : i === this._count && a !== this._count ? "last" : i === a - 1 ? "prev" : i === a + 1 ? "next" : "change";
|
|
284
280
|
this.setAttribute("page", String(i));
|
|
285
|
-
const
|
|
281
|
+
const o = {
|
|
286
282
|
page: i,
|
|
287
283
|
previousPage: a,
|
|
288
284
|
count: this._count,
|
|
289
|
-
reason:
|
|
285
|
+
reason: n
|
|
290
286
|
};
|
|
291
|
-
this.dispatchEvent(new CustomEvent(
|
|
287
|
+
this.dispatchEvent(new CustomEvent(n, { detail: o, bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent("change", { detail: o, bubbles: !0, composed: !0 }));
|
|
292
288
|
}
|
|
293
289
|
}
|
|
294
290
|
typeof customElements < "u" && !customElements.get("ui-pagination") && customElements.define("ui-pagination", s);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { E as A } from "./ElementBase-
|
|
1
|
+
import { E as A } from "./ElementBase-YlTLMsGk.mjs";
|
|
2
2
|
import { UIPanel as y } from "./panel.esm.js";
|
|
3
3
|
import { UISplitter as b } from "./splitter.esm.js";
|
|
4
4
|
function f(o, e, t) {
|
|
@@ -16,8 +16,7 @@ function v(o) {
|
|
|
16
16
|
return { min: e, max: t };
|
|
17
17
|
}
|
|
18
18
|
function _(o, e = []) {
|
|
19
|
-
if (!o.length)
|
|
20
|
-
return [];
|
|
19
|
+
if (!o.length) return [];
|
|
21
20
|
const t = o.map((u, c) => {
|
|
22
21
|
const d = e[c], { min: h, max: p } = v(u);
|
|
23
22
|
return Number.isFinite(d) ? f(Number(d), h, p) : u.collapsed ? h : NaN;
|
|
@@ -32,23 +31,20 @@ function _(o, e = []) {
|
|
|
32
31
|
const { min: w, max: z } = v(p);
|
|
33
32
|
return l > 0 && t[g] < z - 1e-3 && h.push(g), l < 0 && t[g] > w + 1e-3 && h.push(g), h;
|
|
34
33
|
}, []);
|
|
35
|
-
if (!u.length)
|
|
36
|
-
break;
|
|
34
|
+
if (!u.length) break;
|
|
37
35
|
const c = l / u.length;
|
|
38
36
|
let d = 0;
|
|
39
37
|
if (u.forEach((h) => {
|
|
40
38
|
const { min: p, max: g } = v(o[h]), w = t[h], z = f(w + c, p, g);
|
|
41
39
|
t[h] = x(z), d += t[h] - w;
|
|
42
|
-
}), a = t.reduce((h, p) => h + p, 0), l = x(100 - a), Math.abs(d) < 1e-3)
|
|
43
|
-
break;
|
|
40
|
+
}), a = t.reduce((h, p) => h + p, 0), l = x(100 - a), Math.abs(d) < 1e-3) break;
|
|
44
41
|
m += 1;
|
|
45
42
|
}
|
|
46
43
|
return t.map((u) => x(u));
|
|
47
44
|
}
|
|
48
45
|
function L(o, e, t, i) {
|
|
49
46
|
const n = t, s = t + 1;
|
|
50
|
-
if (n < 0 || s >= o.length)
|
|
51
|
-
return [...o];
|
|
47
|
+
if (n < 0 || s >= o.length) return [...o];
|
|
52
48
|
const r = [...o], a = r[n], l = r[s], m = v(e[n]), u = v(e[s]), c = Math.max(m.min - a, l - u.max), d = Math.min(m.max - a, l - u.min), h = f(i, c, d);
|
|
53
49
|
return r[n] = x(a + h), r[s] = x(l - h), r;
|
|
54
50
|
}
|
|
@@ -98,8 +94,7 @@ class M extends A {
|
|
|
98
94
|
super.connectedCallback(), this.addEventListener("pointerdown", this._onPointerDown), this.addEventListener("keydown", this._onKeyDown), this._observer = new MutationObserver(this._onMutation), this._observer.observe(this, { childList: !0, attributes: !0, subtree: !0 }), queueMicrotask(() => this._syncStructure({ restore: !0 }));
|
|
99
95
|
}
|
|
100
96
|
disconnectedCallback() {
|
|
101
|
-
|
|
102
|
-
this.removeEventListener("pointerdown", this._onPointerDown), this.removeEventListener("keydown", this._onKeyDown), (e = this._observer) == null || e.disconnect(), this._observer = null, this._teardownDrag(), super.disconnectedCallback();
|
|
97
|
+
this.removeEventListener("pointerdown", this._onPointerDown), this.removeEventListener("keydown", this._onKeyDown), this._observer?.disconnect(), this._observer = null, this._teardownDrag(), super.disconnectedCallback();
|
|
103
98
|
}
|
|
104
99
|
getLayout() {
|
|
105
100
|
return [...this._layout];
|
|
@@ -114,15 +109,13 @@ class M extends A {
|
|
|
114
109
|
}
|
|
115
110
|
collapsePanel(e) {
|
|
116
111
|
const t = this._panels.indexOf(e);
|
|
117
|
-
if (t < 0)
|
|
118
|
-
return;
|
|
112
|
+
if (t < 0) return;
|
|
119
113
|
const i = this._constraints(), n = [...this._layout], s = n[t] - i[t].collapsedSize;
|
|
120
114
|
n[t] = i[t].collapsedSize, this._distributeRemainder(n, t, s), e.setAttribute("collapsed", ""), this._applyLayout(_(this._constraints(), n), { persist: !0, emit: !0 });
|
|
121
115
|
}
|
|
122
116
|
expandPanel(e) {
|
|
123
117
|
const t = this._panels.indexOf(e);
|
|
124
|
-
if (t < 0)
|
|
125
|
-
return;
|
|
118
|
+
if (t < 0) return;
|
|
126
119
|
e.removeAttribute("collapsed");
|
|
127
120
|
const i = this._constraints(), n = this._layout[t] <= i[t].collapsedSize + 1e-3 ? _(i, this._initialLayout)[t] : this._layout[t], s = [...this._layout], r = n - s[t];
|
|
128
121
|
s[t] = n, this._distributeRemainder(s, t, -r), this._applyLayout(_(this._constraints(), s), { persist: !0, emit: !0 });
|
|
@@ -137,8 +130,7 @@ class M extends A {
|
|
|
137
130
|
}
|
|
138
131
|
}
|
|
139
132
|
_onMutation(e) {
|
|
140
|
-
if (this._isMutatingChildren)
|
|
141
|
-
return;
|
|
133
|
+
if (this._isMutatingChildren) return;
|
|
142
134
|
e.some((i) => i.type === "childList" ? !0 : i.target instanceof y && (i.attributeName === "size" || i.attributeName === "min-size" || i.attributeName === "max-size" || i.attributeName === "collapsed-size" || i.attributeName === "collapsed")) && this._syncStructure({ restore: !1 });
|
|
143
135
|
}
|
|
144
136
|
_orientation() {
|
|
@@ -157,10 +149,9 @@ class M extends A {
|
|
|
157
149
|
}
|
|
158
150
|
_desiredLayout() {
|
|
159
151
|
const e = this._loadPersistedLayout();
|
|
160
|
-
return
|
|
152
|
+
return e?.length === this._panels.length ? e : this._panels.map((t) => {
|
|
161
153
|
const i = t.getAttribute("size");
|
|
162
|
-
if (i == null || i.trim() === "")
|
|
163
|
-
return NaN;
|
|
154
|
+
if (i == null || i.trim() === "") return NaN;
|
|
164
155
|
const n = Number(i);
|
|
165
156
|
return Number.isFinite(n) ? n : NaN;
|
|
166
157
|
});
|
|
@@ -184,8 +175,7 @@ class M extends A {
|
|
|
184
175
|
let n = i.previousElementSibling;
|
|
185
176
|
for (; n && !(n instanceof y || n instanceof b); )
|
|
186
177
|
n = n.previousElementSibling;
|
|
187
|
-
if (n instanceof b)
|
|
188
|
-
continue;
|
|
178
|
+
if (n instanceof b) continue;
|
|
189
179
|
const s = document.createElement("ui-splitter");
|
|
190
180
|
s.setAttribute("data-generated", ""), i.before(s);
|
|
191
181
|
}
|
|
@@ -234,12 +224,10 @@ class M extends A {
|
|
|
234
224
|
}
|
|
235
225
|
_loadPersistedLayout() {
|
|
236
226
|
const e = this.getAttribute("storage-key");
|
|
237
|
-
if (!e)
|
|
238
|
-
return null;
|
|
227
|
+
if (!e) return null;
|
|
239
228
|
try {
|
|
240
229
|
const t = window.localStorage.getItem(`ui-panel-group:${e}`);
|
|
241
|
-
if (!t)
|
|
242
|
-
return null;
|
|
230
|
+
if (!t) return null;
|
|
243
231
|
const i = JSON.parse(t);
|
|
244
232
|
return Array.isArray(i) ? i.map((n) => Number(n)).filter(Number.isFinite) : null;
|
|
245
233
|
} catch {
|
|
@@ -247,11 +235,9 @@ class M extends A {
|
|
|
247
235
|
}
|
|
248
236
|
}
|
|
249
237
|
_distributeRemainder(e, t, i) {
|
|
250
|
-
if (Math.abs(i) < 1e-3)
|
|
251
|
-
return;
|
|
238
|
+
if (Math.abs(i) < 1e-3) return;
|
|
252
239
|
const n = e.map((r, a) => a).filter((r) => r !== t);
|
|
253
|
-
if (!n.length)
|
|
254
|
-
return;
|
|
240
|
+
if (!n.length) return;
|
|
255
241
|
const s = i / n.length;
|
|
256
242
|
n.forEach((r) => {
|
|
257
243
|
e[r] += s;
|
|
@@ -259,8 +245,7 @@ class M extends A {
|
|
|
259
245
|
}
|
|
260
246
|
_onPointerDown(e) {
|
|
261
247
|
const t = e.composedPath().find((n) => n instanceof b);
|
|
262
|
-
if (!t || t.hasAttribute("disabled"))
|
|
263
|
-
return;
|
|
248
|
+
if (!t || t.hasAttribute("disabled")) return;
|
|
264
249
|
const i = Number(t.getAttribute("data-index"));
|
|
265
250
|
Number.isFinite(i) && (e.preventDefault(), t.setAttribute("data-dragging", "true"), this._dragState = {
|
|
266
251
|
splitterIndex: i,
|
|
@@ -270,31 +255,25 @@ class M extends A {
|
|
|
270
255
|
}, window.addEventListener("pointermove", this._onPointerMove), window.addEventListener("pointerup", this._onPointerUp), this.dispatchEvent(new CustomEvent("resize-start", { detail: { index: i }, bubbles: !0, composed: !0 })));
|
|
271
256
|
}
|
|
272
257
|
_onPointerMove(e) {
|
|
273
|
-
if (!this._dragState || e.pointerId !== this._dragState.pointerId)
|
|
274
|
-
return;
|
|
258
|
+
if (!this._dragState || e.pointerId !== this._dragState.pointerId) return;
|
|
275
259
|
const n = ((this._orientation() === "horizontal" ? e.clientX : e.clientY) - this._dragState.origin) / this._availableSize() * 100, s = L(this._dragState.startLayout, this._constraints(), this._dragState.splitterIndex, n);
|
|
276
260
|
this._applyLayout(s, { persist: !1, emit: !0 }), this.dispatchEvent(new CustomEvent("resize", { detail: { index: this._dragState.splitterIndex, sizes: [...this._layout] }, bubbles: !0, composed: !0 }));
|
|
277
261
|
}
|
|
278
262
|
_onPointerUp(e) {
|
|
279
|
-
if (!this._dragState || e.pointerId !== this._dragState.pointerId)
|
|
280
|
-
|
|
281
|
-
const t = this._splitters[this._dragState.splitterIndex];
|
|
282
|
-
t == null || t.removeAttribute("data-dragging"), this._persistLayout(), this.dispatchEvent(new CustomEvent("resize-end", { detail: { index: this._dragState.splitterIndex, sizes: [...this._layout] }, bubbles: !0, composed: !0 })), this._teardownDrag();
|
|
263
|
+
if (!this._dragState || e.pointerId !== this._dragState.pointerId) return;
|
|
264
|
+
this._splitters[this._dragState.splitterIndex]?.removeAttribute("data-dragging"), this._persistLayout(), this.dispatchEvent(new CustomEvent("resize-end", { detail: { index: this._dragState.splitterIndex, sizes: [...this._layout] }, bubbles: !0, composed: !0 })), this._teardownDrag();
|
|
283
265
|
}
|
|
284
266
|
_teardownDrag() {
|
|
285
267
|
window.removeEventListener("pointermove", this._onPointerMove), window.removeEventListener("pointerup", this._onPointerUp), this._splitters.forEach((e) => e.removeAttribute("data-dragging")), this._dragState = null;
|
|
286
268
|
}
|
|
287
269
|
_onKeyDown(e) {
|
|
288
270
|
const t = e.composedPath().find((m) => m instanceof b);
|
|
289
|
-
if (!t || t.hasAttribute("disabled"))
|
|
290
|
-
return;
|
|
271
|
+
if (!t || t.hasAttribute("disabled")) return;
|
|
291
272
|
const i = Number(t.getAttribute("data-index"));
|
|
292
|
-
if (!Number.isFinite(i))
|
|
293
|
-
return;
|
|
273
|
+
if (!Number.isFinite(i)) return;
|
|
294
274
|
const s = this._orientation() === "horizontal", r = e.shiftKey ? 10 : 2;
|
|
295
275
|
let a = 0;
|
|
296
|
-
if ((s && e.key === "ArrowRight" || !s && e.key === "ArrowDown") && (a = r), (s && e.key === "ArrowLeft" || !s && e.key === "ArrowUp") && (a = -r), e.key === "Home" && (a = -100), e.key === "End" && (a = 100), !a)
|
|
297
|
-
return;
|
|
276
|
+
if ((s && e.key === "ArrowRight" || !s && e.key === "ArrowDown") && (a = r), (s && e.key === "ArrowLeft" || !s && e.key === "ArrowUp") && (a = -r), e.key === "Home" && (a = -100), e.key === "End" && (a = 100), !a) return;
|
|
298
277
|
e.preventDefault();
|
|
299
278
|
const l = L(this._layout, this._constraints(), i, a);
|
|
300
279
|
this._applyLayout(l, { persist: !0, emit: !0 }), this.dispatchEvent(new CustomEvent("resize", { detail: { index: i, sizes: [...this._layout] }, bubbles: !0, composed: !0 }));
|
|
@@ -313,8 +292,7 @@ class M extends A {
|
|
|
313
292
|
}
|
|
314
293
|
function N(o, e) {
|
|
315
294
|
const t = o.getAttribute(e);
|
|
316
|
-
if (t == null)
|
|
317
|
-
return !1;
|
|
295
|
+
if (t == null) return !1;
|
|
318
296
|
const i = String(t).trim().toLowerCase();
|
|
319
297
|
return i !== "false" && i !== "0";
|
|
320
298
|
}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";const P=require("./ElementBase-EV6mVBUV.js"),y=require("./panel.cjs.js"),b=require("./splitter.cjs.js");function f(o,e,t){return Math.min(t,Math.max(e,o))}function x(o){return Math.round(o*1e3)/1e3}function v(o){if(o.collapsed){const i=f(o.collapsedSize,0,100);return{min:i,max:i}}const e=f(o.min,0,100),t=f(Math.max(e,o.max),e,100);return{min:e,max:t}}function p(o,e=[]){if(!o.length)return[];const t=o.map((l,c)=>{const d=e[c],{min:h,max:_}=v(l);return Number.isFinite(d)?f(Number(d),h,_):l.collapsed?h:NaN}),i=t.reduce((l,c,d)=>(Number.isFinite(c)||l.push(d),l),[]),n=t.reduce((l,c)=>l+(Number.isFinite(c)?c:0),0),s=Math.max(0,100-n),r=i.length?s/i.length:0;i.forEach(l=>{const{min:c,max:d}=v(o[l]);t[l]=f(r,c,d)});let a=t.reduce((l,c)=>l+c,0),u=x(100-a),m=0;for(;Math.abs(u)>.001&&m<30;){const l=o.reduce((h,_,g)=>{const{min:w,max:S}=v(_);return u>0&&t[g]<S-.001&&h.push(g),u<0&&t[g]>w+.001&&h.push(g),h},[]);if(!l.length)break;const c=u/l.length;let d=0;if(l.forEach(h=>{const{min:_,max:g}=v(o[h]),w=t[h],S=f(w+c,_,g);t[h]=x(S),d+=t[h]-w}),a=t.reduce((h,_)=>h+_,0),u=x(100-a),Math.abs(d)<.001)break;m+=1}return t.map(l=>x(l))}function L(o,e,t,i){const n=t,s=t+1;if(n<0||s>=o.length)return[...o];const r=[...o],a=r[n],u=r[s],m=v(e[n]),l=v(e[s]),c=Math.max(m.min-a,u-l.max),d=Math.min(m.max-a,u-l.min),h=f(i,c,d);return r[n]=x(a+h),r[s]=x(u-h),r}const E=`
|
|
2
|
+
:host {
|
|
3
|
+
display: block;
|
|
4
|
+
min-inline-size: 0;
|
|
5
|
+
min-block-size: 0;
|
|
6
|
+
--ui-panel-group-gap: 0px;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.group {
|
|
10
|
+
inline-size: 100%;
|
|
11
|
+
block-size: 100%;
|
|
12
|
+
min-inline-size: 0;
|
|
13
|
+
min-block-size: 0;
|
|
14
|
+
display: flex;
|
|
15
|
+
gap: var(--ui-panel-group-gap);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
:host([orientation="vertical"]) .group {
|
|
19
|
+
flex-direction: column;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
slot {
|
|
23
|
+
display: contents;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
::slotted(ui-panel) {
|
|
27
|
+
min-inline-size: 0;
|
|
28
|
+
min-block-size: 0;
|
|
29
|
+
overflow: hidden;
|
|
30
|
+
}
|
|
31
|
+
`;function z(o,e){const t=Number(o);return Number.isFinite(t)?Math.min(100,Math.max(0,t)):e}class A extends P.ElementBase{constructor(){super(),this._observer=null,this._panels=[],this._splitters=[],this._layout=[],this._initialLayout=[],this._dragState=null,this._isMutatingChildren=!1,this._onMutation=this._onMutation.bind(this),this._onPointerMove=this._onPointerMove.bind(this),this._onPointerUp=this._onPointerUp.bind(this),this._onPointerDown=this._onPointerDown.bind(this),this._onKeyDown=this._onKeyDown.bind(this)}static get observedAttributes(){return["orientation","storage-key","auto-save"]}connectedCallback(){super.connectedCallback(),this.addEventListener("pointerdown",this._onPointerDown),this.addEventListener("keydown",this._onKeyDown),this._observer=new MutationObserver(this._onMutation),this._observer.observe(this,{childList:!0,attributes:!0,subtree:!0}),queueMicrotask(()=>this._syncStructure({restore:!0}))}disconnectedCallback(){this.removeEventListener("pointerdown",this._onPointerDown),this.removeEventListener("keydown",this._onKeyDown),this._observer?.disconnect(),this._observer=null,this._teardownDrag(),super.disconnectedCallback()}getLayout(){return[...this._layout]}setLayout(e){const t=p(this._constraints(),e);this._applyLayout(t,{persist:!0,emit:!0})}resetLayout(){const e=this._initialLayout.length?this._initialLayout:p(this._constraints(),[]);this._applyLayout(e,{persist:!0,emit:!0})}collapsePanel(e){const t=this._panels.indexOf(e);if(t<0)return;const i=this._constraints(),n=[...this._layout],s=n[t]-i[t].collapsedSize;n[t]=i[t].collapsedSize,this._distributeRemainder(n,t,s),e.setAttribute("collapsed",""),this._applyLayout(p(this._constraints(),n),{persist:!0,emit:!0})}expandPanel(e){const t=this._panels.indexOf(e);if(t<0)return;e.removeAttribute("collapsed");const i=this._constraints(),n=this._layout[t]<=i[t].collapsedSize+.001?p(i,this._initialLayout)[t]:this._layout[t],s=[...this._layout],r=n-s[t];s[t]=n,this._distributeRemainder(s,t,-r),this._applyLayout(p(this._constraints(),s),{persist:!0,emit:!0})}attributeChangedCallback(e,t,i){if(t!==i){if(e==="orientation"){this._syncOrientation(),this._applyLayout(this._layout.length?this._layout:p(this._constraints(),[]),{persist:!1,emit:!1});return}e==="storage-key"||e==="auto-save"||super.attributeChangedCallback(e,t,i)}}_onMutation(e){if(this._isMutatingChildren)return;e.some(i=>i.type==="childList"?!0:i.target instanceof y.UIPanel&&(i.attributeName==="size"||i.attributeName==="min-size"||i.attributeName==="max-size"||i.attributeName==="collapsed-size"||i.attributeName==="collapsed"))&&this._syncStructure({restore:!1})}_orientation(){return this.getAttribute("orientation")==="vertical"?"vertical":"horizontal"}_constraints(){return this._panels.map(e=>{const t=e.hasAttribute("collapsed"),i=z(Number(e.getAttribute("collapsed-size")||0),0),n=z(Number(e.getAttribute("min-size")||(t?i:10)),t?i:10),s=z(Number(e.getAttribute("max-size")||100),100);return{min:t?i:Math.min(n,s),max:t?i:Math.max(n,s),collapsedSize:i,collapsed:t}})}_desiredLayout(){const e=this._loadPersistedLayout();return e?.length===this._panels.length?e:this._panels.map(t=>{const i=t.getAttribute("size");if(i==null||i.trim()==="")return NaN;const n=Number(i);return Number.isFinite(n)?n:NaN})}_syncStructure(e){this._syncGeneratedSplitters(),this._panels=Array.from(this.children).filter(n=>n instanceof y.UIPanel),this._splitters=Array.from(this.children).filter(n=>n instanceof b.UISplitter),this._syncOrientation();const t=this._desiredLayout(),i=p(this._constraints(),t);(!this._initialLayout.length||e.restore)&&(this._initialLayout=[...i]),this._applyLayout(i,{persist:!1,emit:!1})}_syncGeneratedSplitters(){const e=Array.from(this.children).filter(t=>t instanceof y.UIPanel);if(!(e.length<=1)){this._isMutatingChildren=!0;try{Array.from(this.children).filter(t=>t instanceof b.UISplitter&&t.hasAttribute("data-generated")).forEach(t=>{const i=t.previousElementSibling,n=t.nextElementSibling;(!(i instanceof y.UIPanel)||!(n instanceof y.UIPanel))&&t.remove()});for(let t=1;t<e.length;t+=1){const i=e[t];let n=i.previousElementSibling;for(;n&&!(n instanceof y.UIPanel||n instanceof b.UISplitter);)n=n.previousElementSibling;if(n instanceof b.UISplitter)continue;const s=document.createElement("ui-splitter");s.setAttribute("data-generated",""),i.before(s)}}finally{this._isMutatingChildren=!1}}}_syncOrientation(){const e=this._orientation();this._splitters.forEach((t,i)=>{t.setAttribute("orientation",e),t.setAttribute("data-index",String(i))})}_applyLayout(e,t){this._layout=[...e];const i=this._orientation(),n=this._constraints();this._panels.forEach((s,r)=>{const a=this._layout[r]??0,u=n[r];s.style.flex=`${a} 1 0px`,i==="horizontal"?(s.style.minWidth=`${u.min}%`,s.style.maxWidth=`${u.max}%`,s.style.minHeight="0",s.style.maxHeight=""):(s.style.minHeight=`${u.min}%`,s.style.maxHeight=`${u.max}%`,s.style.minWidth="0",s.style.maxWidth=""),s.setAttribute("data-panel-size",String(a))}),this._splitters.forEach((s,r)=>{const a=this._layout[r]??0;s.setAttribute("aria-valuemin",String(Math.round(n[r].min))),s.setAttribute("aria-valuemax",String(Math.round(n[r].max))),s.setAttribute("aria-valuenow",String(Math.round(a)))}),t.persist&&this._persistLayout(),t.emit&&this.dispatchEvent(new CustomEvent("layout-change",{detail:{sizes:[...this._layout]},bubbles:!0,composed:!0}))}_availableSize(){const e=this.getBoundingClientRect(),t=this._orientation()==="horizontal"?e.width:e.height,i=this._splitters.reduce((n,s)=>{const r=s.getBoundingClientRect();return n+(this._orientation()==="horizontal"?r.width:r.height)},0);return Math.max(1,t-i)}_persistLayout(){const e=this.getAttribute("storage-key");if(!(!e||!M(this,"auto-save")))try{window.localStorage.setItem(`ui-panel-group:${e}`,JSON.stringify(this._layout))}catch{}}_loadPersistedLayout(){const e=this.getAttribute("storage-key");if(!e)return null;try{const t=window.localStorage.getItem(`ui-panel-group:${e}`);if(!t)return null;const i=JSON.parse(t);return Array.isArray(i)?i.map(n=>Number(n)).filter(Number.isFinite):null}catch{return null}}_distributeRemainder(e,t,i){if(Math.abs(i)<.001)return;const n=e.map((r,a)=>a).filter(r=>r!==t);if(!n.length)return;const s=i/n.length;n.forEach(r=>{e[r]+=s})}_onPointerDown(e){const t=e.composedPath().find(n=>n instanceof b.UISplitter);if(!t||t.hasAttribute("disabled"))return;const i=Number(t.getAttribute("data-index"));Number.isFinite(i)&&(e.preventDefault(),t.setAttribute("data-dragging","true"),this._dragState={splitterIndex:i,pointerId:e.pointerId,origin:this._orientation()==="horizontal"?e.clientX:e.clientY,startLayout:[...this._layout]},window.addEventListener("pointermove",this._onPointerMove),window.addEventListener("pointerup",this._onPointerUp),this.dispatchEvent(new CustomEvent("resize-start",{detail:{index:i},bubbles:!0,composed:!0})))}_onPointerMove(e){if(!this._dragState||e.pointerId!==this._dragState.pointerId)return;const n=((this._orientation()==="horizontal"?e.clientX:e.clientY)-this._dragState.origin)/this._availableSize()*100,s=L(this._dragState.startLayout,this._constraints(),this._dragState.splitterIndex,n);this._applyLayout(s,{persist:!1,emit:!0}),this.dispatchEvent(new CustomEvent("resize",{detail:{index:this._dragState.splitterIndex,sizes:[...this._layout]},bubbles:!0,composed:!0}))}_onPointerUp(e){if(!this._dragState||e.pointerId!==this._dragState.pointerId)return;this._splitters[this._dragState.splitterIndex]?.removeAttribute("data-dragging"),this._persistLayout(),this.dispatchEvent(new CustomEvent("resize-end",{detail:{index:this._dragState.splitterIndex,sizes:[...this._layout]},bubbles:!0,composed:!0})),this._teardownDrag()}_teardownDrag(){window.removeEventListener("pointermove",this._onPointerMove),window.removeEventListener("pointerup",this._onPointerUp),this._splitters.forEach(e=>e.removeAttribute("data-dragging")),this._dragState=null}_onKeyDown(e){const t=e.composedPath().find(m=>m instanceof b.UISplitter);if(!t||t.hasAttribute("disabled"))return;const i=Number(t.getAttribute("data-index"));if(!Number.isFinite(i))return;const s=this._orientation()==="horizontal",r=e.shiftKey?10:2;let a=0;if((s&&e.key==="ArrowRight"||!s&&e.key==="ArrowDown")&&(a=r),(s&&e.key==="ArrowLeft"||!s&&e.key==="ArrowUp")&&(a=-r),e.key==="Home"&&(a=-100),e.key==="End"&&(a=100),!a)return;e.preventDefault();const u=L(this._layout,this._constraints(),i,a);this._applyLayout(u,{persist:!0,emit:!0}),this.dispatchEvent(new CustomEvent("resize",{detail:{index:i,sizes:[...this._layout]},bubbles:!0,composed:!0}))}shouldRenderOnAttributeChange(){return!1}render(){this.setContent(`
|
|
32
|
+
<style>${E}</style>
|
|
33
|
+
<div class="group" part="group">
|
|
34
|
+
<slot></slot>
|
|
35
|
+
</div>
|
|
36
|
+
`)}}function M(o,e){const t=o.getAttribute(e);if(t==null)return!1;const i=String(t).trim().toLowerCase();return i!=="false"&&i!=="0"}typeof customElements<"u"&&!customElements.get("ui-panel-group")&&customElements.define("ui-panel-group",A);exports.UIPanelGroup=A;exports.normalizePanelLayout=p;exports.resizePanelPair=L;
|
package/dist/panel-group.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./panel-group-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./panel-group-CaD0_KQf.js");exports.UIPanelGroup=e.UIPanelGroup;
|
package/dist/panel-group.esm.js
CHANGED
package/dist/panel.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("./ElementBase-EV6mVBUV.js"),s=`
|
|
2
2
|
:host {
|
|
3
3
|
display: block;
|
|
4
4
|
min-inline-size: 0;
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
min-block-size: 0;
|
|
15
15
|
box-sizing: border-box;
|
|
16
16
|
}
|
|
17
|
-
`;class
|
|
18
|
-
<style>${
|
|
17
|
+
`;class e extends t.ElementBase{static get observedAttributes(){return["collapsed"]}collapse(){this.setAttribute("collapsed",""),this.closest("ui-panel-group")?.collapsePanel?.(this)}expand(){this.removeAttribute("collapsed"),this.closest("ui-panel-group")?.expandPanel?.(this)}shouldRenderOnAttributeChange(){return!1}render(){this.setContent(`
|
|
18
|
+
<style>${s}</style>
|
|
19
19
|
<div class="panel" part="panel">
|
|
20
20
|
<slot></slot>
|
|
21
21
|
</div>
|
|
22
|
-
`)}}typeof customElements<"u"&&!customElements.get("ui-panel")&&customElements.define("ui-panel",
|
|
22
|
+
`)}}typeof customElements<"u"&&!customElements.get("ui-panel")&&customElements.define("ui-panel",e);exports.UIPanel=e;
|
package/dist/panel.esm.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { E as
|
|
2
|
-
const
|
|
1
|
+
import { E as e } from "./ElementBase-YlTLMsGk.mjs";
|
|
2
|
+
const s = `
|
|
3
3
|
:host {
|
|
4
4
|
display: block;
|
|
5
5
|
min-inline-size: 0;
|
|
@@ -16,31 +16,29 @@ const i = `
|
|
|
16
16
|
box-sizing: border-box;
|
|
17
17
|
}
|
|
18
18
|
`;
|
|
19
|
-
class
|
|
19
|
+
class t extends e {
|
|
20
20
|
static get observedAttributes() {
|
|
21
21
|
return ["collapsed"];
|
|
22
22
|
}
|
|
23
23
|
collapse() {
|
|
24
|
-
|
|
25
|
-
this.setAttribute("collapsed", ""), (s = (e = this.closest("ui-panel-group")) == null ? void 0 : e.collapsePanel) == null || s.call(e, this);
|
|
24
|
+
this.setAttribute("collapsed", ""), this.closest("ui-panel-group")?.collapsePanel?.(this);
|
|
26
25
|
}
|
|
27
26
|
expand() {
|
|
28
|
-
|
|
29
|
-
this.removeAttribute("collapsed"), (s = (e = this.closest("ui-panel-group")) == null ? void 0 : e.expandPanel) == null || s.call(e, this);
|
|
27
|
+
this.removeAttribute("collapsed"), this.closest("ui-panel-group")?.expandPanel?.(this);
|
|
30
28
|
}
|
|
31
29
|
shouldRenderOnAttributeChange() {
|
|
32
30
|
return !1;
|
|
33
31
|
}
|
|
34
32
|
render() {
|
|
35
33
|
this.setContent(`
|
|
36
|
-
<style>${
|
|
34
|
+
<style>${s}</style>
|
|
37
35
|
<div class="panel" part="panel">
|
|
38
36
|
<slot></slot>
|
|
39
37
|
</div>
|
|
40
38
|
`);
|
|
41
39
|
}
|
|
42
40
|
}
|
|
43
|
-
typeof customElements < "u" && !customElements.get("ui-panel") && customElements.define("ui-panel",
|
|
41
|
+
typeof customElements < "u" && !customElements.get("ui-panel") && customElements.define("ui-panel", t);
|
|
44
42
|
export {
|
|
45
|
-
|
|
43
|
+
t as UIPanel
|
|
46
44
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("./ElementBase-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("./ElementBase-EV6mVBUV.js"),T=`
|
|
2
2
|
<svg viewBox="0 0 20 20" aria-hidden="true" focusable="false">
|
|
3
3
|
<path d="m6 6 8 8M14 6l-8 8" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/>
|
|
4
4
|
</svg>
|
|
@@ -573,16 +573,16 @@
|
|
|
573
573
|
box-shadow: none;
|
|
574
574
|
}
|
|
575
575
|
}
|
|
576
|
-
`,M=["value","placeholder","disabled","clearable","debounce","validation","size","minlength","maxlength","readonly","autofocus","counter","floating-label","name","required","pattern","autocomplete","spellcheck","variant","tone","density","shape","color","radius","label","description","data-error"];function
|
|
576
|
+
`,M=["value","placeholder","disabled","clearable","debounce","validation","size","minlength","maxlength","readonly","autofocus","counter","floating-label","name","required","pattern","autocomplete","spellcheck","variant","tone","density","shape","color","radius","label","description","data-error"];function l(o){return o.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'")}function p(o){if(!o)return!1;const t=o.assignedNodes({flatten:!0});return t.length?t.some(e=>e.nodeType===Node.TEXT_NODE?!!e.textContent?.trim():e.nodeType===Node.ELEMENT_NODE):!1}function u(o,t){const e=o.getAttribute(t);if(e==null)return!1;const i=String(e).trim().toLowerCase();return i!=="false"&&i!=="0"}function I(o){return o==="none"||o==="large"||o==="full"}function U(o){let t=0;switch(o.length>=8&&(t+=1),/[a-z]/.test(o)&&/[A-Z]/.test(o)&&(t+=1),/\d/.test(o)&&(t+=1),(/[^A-Za-z0-9]/.test(o)||o.length>=14)&&(t+=1),Math.max(1,Math.min(4,t||1))){case 1:return{score:1,label:"Weak",caption:"Use more characters and mix case, numbers, or symbols."};case 2:return{score:2,label:"Fair",caption:"Add numbers or symbols to reduce guessability."};case 3:return{score:3,label:"Good",caption:"Solid baseline. Longer passphrases are even better."};default:return{score:4,label:"Strong",caption:"Strong password shape for production accounts."}}}class C extends q.ElementBase{constructor(){super(),this._input=null,this._clearBtn=null,this._toggleBtn=null,this._debounceTimer=null,this._formUnregister=null,this._uid=Math.random().toString(36).slice(2,9),this._autofocusApplied=!1,this._revealed=!1,this._lastStrengthKey="",this.strengthEvaluator=null,this._onNativeInput=this._onNativeInput.bind(this),this._onNativeChange=this._onNativeChange.bind(this),this._onClearClick=this._onClearClick.bind(this),this._onToggleClick=this._onToggleClick.bind(this),this._onSlotChange=this._onSlotChange.bind(this)}static get observedAttributes(){return[...M,"show-strength","revealable"]}get value(){return this.getAttribute("value")||""}set value(t){t?this.setAttribute("value",t):this.removeAttribute("value")}get revealed(){return this._revealed}connectedCallback(){super.connectedCallback(),this.root.addEventListener("slotchange",this._onSlotChange),this._registerWithForm()}disconnectedCallback(){this.root.removeEventListener("slotchange",this._onSlotChange),this._detachListeners(),this._debounceTimer&&(clearTimeout(this._debounceTimer),this._debounceTimer=null),this._formUnregister&&(this._formUnregister(),this._formUnregister=null),this._autofocusApplied=!1,super.disconnectedCallback()}attributeChangedCallback(t,e,i){if(e!==i&&(t==="name"&&this.isConnected&&this._registerWithForm(),t==="autofocus"&&!this.hasAttribute("autofocus")&&(this._autofocusApplied=!1),!(!this.isConnected||!this._input))){if(t==="value"){this._syncInputValue(this.value),this._syncStrengthUi();return}this._syncUi(),t==="autofocus"&&this.hasAttribute("autofocus")&&!this._autofocusApplied&&(this._autofocusApplied=!0,queueMicrotask(()=>{if(this.isConnected)try{this._input?.focus({preventScroll:!0})}catch{this._input?.focus()}}))}}shouldRenderOnAttributeChange(){return!1}focus(t){if(this._input){this._input.focus(t);return}super.focus(t)}blur(){this._input?.blur()}select(){this._input?.select()}toggleVisibility(t){if(u(this,"disabled")||this.hasAttribute("readonly")||this.getAttribute("revealable")==="false")return;const e=typeof t=="boolean"?t:!this._revealed;if(e===this._revealed)return;const i=this._input?.selectionStart??null,r=this._input?.selectionEnd??null;this._revealed=e,this._syncToggleUi(),this.dispatchEvent(new CustomEvent("visibility-change",{detail:{revealed:this._revealed},bubbles:!0,composed:!0})),queueMicrotask(()=>{const n=this._input;if(n){try{n.focus({preventScroll:!0})}catch{n.focus()}if(i!=null&&r!=null&&typeof n.setSelectionRange=="function")try{n.setSelectionRange(i,r)}catch{}}})}render(){const t=this.value,e=this.getAttribute("label")||"",i=this.getAttribute("description")||"",r=this.getAttribute("data-error")||"",n=this.getAttribute("placeholder")||"",s=this.hasAttribute("required")?'<span class="required" aria-hidden="true">*</span>':"",a=this.hasAttribute("floating-label");this.setContent(`
|
|
577
577
|
<style>${N}</style>
|
|
578
578
|
<div class="root" part="root">
|
|
579
579
|
<div class="meta" part="meta">
|
|
580
580
|
<label class="label" id="${this._uid}-label" part="label">
|
|
581
|
-
<slot name="label">${
|
|
581
|
+
<slot name="label">${l(e)}</slot>
|
|
582
582
|
${s}
|
|
583
583
|
</label>
|
|
584
584
|
<p class="description" id="${this._uid}-description" part="description">
|
|
585
|
-
<slot name="description">${
|
|
585
|
+
<slot name="description">${l(i)}</slot>
|
|
586
586
|
</p>
|
|
587
587
|
</div>
|
|
588
588
|
|
|
@@ -593,10 +593,10 @@
|
|
|
593
593
|
<input
|
|
594
594
|
part="input"
|
|
595
595
|
type="password"
|
|
596
|
-
value="${
|
|
597
|
-
placeholder="${
|
|
596
|
+
value="${l(t)}"
|
|
597
|
+
placeholder="${l(n)}"
|
|
598
598
|
/>
|
|
599
|
-
${
|
|
599
|
+
${a?`<span class="floating-label" part="floating-label">${l(e||n||"Password")}</span>`:""}
|
|
600
600
|
</div>
|
|
601
601
|
|
|
602
602
|
<div class="actions" part="actions">
|
|
@@ -608,7 +608,7 @@
|
|
|
608
608
|
|
|
609
609
|
<div class="footer" part="footer">
|
|
610
610
|
<p class="error" id="${this._uid}-error" part="error" aria-live="polite">
|
|
611
|
-
<slot name="error">${
|
|
611
|
+
<slot name="error">${l(r)}</slot>
|
|
612
612
|
</p>
|
|
613
613
|
<p class="counter" part="counter"></p>
|
|
614
614
|
</div>
|
|
@@ -623,4 +623,4 @@
|
|
|
623
623
|
</div>
|
|
624
624
|
</div>
|
|
625
625
|
</div>
|
|
626
|
-
`),this._detachListeners(),this._input=this.root.querySelector("input"),this._clearBtn=this.root.querySelector(".clear-btn"),this._toggleBtn=this.root.querySelector(".toggle-btn"),
|
|
626
|
+
`),this._detachListeners(),this._input=this.root.querySelector("input"),this._clearBtn=this.root.querySelector(".clear-btn"),this._toggleBtn=this.root.querySelector(".toggle-btn"),this._input?.addEventListener("input",this._onNativeInput),this._input?.addEventListener("change",this._onNativeChange),this._clearBtn?.addEventListener("click",this._onClearClick),this._toggleBtn?.addEventListener("click",this._onToggleClick),this._syncUi()}_detachListeners(){this._input?.removeEventListener("input",this._onNativeInput),this._input?.removeEventListener("change",this._onNativeChange),this._clearBtn?.removeEventListener("click",this._onClearClick),this._toggleBtn?.removeEventListener("click",this._onToggleClick),this._clearBtn=null,this._toggleBtn=null}_syncHostTokens(){const t=this.getAttribute("color");t?this.style.setProperty("--ui-input-accent",t):this.style.removeProperty("--ui-input-accent");const e=this.getAttribute("radius")||"";e&&!I(e)?this.style.setProperty("--ui-input-border-radius",e):this.style.removeProperty("--ui-input-border-radius")}_syncControlAttrs(){if(this._syncHostTokens(),!this._input)return;const t=u(this,"disabled"),e=this.hasAttribute("required"),i=this.hasAttribute("readonly"),r=this.getAttribute("maxlength")||"",n=this.getAttribute("minlength")||"",s=this.getAttribute("pattern")||"",a=this.getAttribute("autocomplete")||"current-password",c=this.getAttribute("spellcheck")||"",h=this.getAttribute("placeholder")||"",d=this.getAttribute("name")||"";this._input.disabled=t,this._input.required=e,this._input.readOnly=i,this._input.placeholder=h,this._input.name=d,this._input.type=this._revealed?"text":"password",this._input.setAttribute("autocomplete",a),s?this._input.setAttribute("pattern",s):this._input.removeAttribute("pattern"),c?this._input.setAttribute("spellcheck",c):this._input.removeAttribute("spellcheck"),r&&Number.isFinite(Number(r))?this._input.setAttribute("maxlength",r):this._input.removeAttribute("maxlength"),n&&Number.isFinite(Number(n))?this._input.setAttribute("minlength",n):this._input.removeAttribute("minlength")}_syncInputValue(t){this._input&&this._input.value!==t&&(this._input.value=t);const e=this.root.querySelector(".shell");e&&e.setAttribute("data-has-value",t?"true":"false"),this._clearBtn&&(u(this,"clearable")&&t.length>0&&!u(this,"disabled")&&!this.hasAttribute("readonly")?this._clearBtn.removeAttribute("hidden"):this._clearBtn.setAttribute("hidden",""));const i=this.root.querySelector(".counter");if(i&&this.hasAttribute("counter")){const r=this.getAttribute("maxlength");i.textContent=r?`${t.length}/${r}`:String(t.length)}else i&&(i.textContent="")}_syncToggleUi(){if(!this._toggleBtn||!this._input)return;this._input.type=this._revealed?"text":"password";const t=this.getAttribute("revealable")!=="false",e=u(this,"disabled")||this.hasAttribute("readonly");this._toggleBtn.hidden=!t,this._toggleBtn.disabled=e,this._toggleBtn.setAttribute("aria-pressed",this._revealed?"true":"false"),this._toggleBtn.setAttribute("aria-label",this._revealed?"Hide password":"Show password");const i=this._revealed?"revealed":"hidden";this._toggleBtn.dataset.iconState!==i&&(this._toggleBtn.dataset.iconState=i,this._toggleBtn.innerHTML=this._revealed?B:S)}_syncStrengthUi(){const t=this.root.querySelector(".strength"),e=this.root.querySelector(".strength-label"),i=this.root.querySelector(".strength-caption");if(!t||!e||!i)return;const r=this.value,n=this.hasAttribute("show-strength")&&r.length>0;if(t.hidden=!n,!n){delete t.dataset.score,e.textContent="",i.textContent="",this._lastStrengthKey="";return}const s=(this.strengthEvaluator||U)(r);t.dataset.score=String(s.score),e.textContent=s.label,i.textContent=s.caption;const a=`${r}|${s.score}|${s.label}|${s.caption}`;a!==this._lastStrengthKey&&(this._lastStrengthKey=a,this.dispatchEvent(new CustomEvent("strength-change",{detail:{value:r,score:s.score,label:s.label,caption:s.caption},bubbles:!0,composed:!0})))}_syncDerivedState(){const t=this.root.querySelector('slot[name="label"]'),e=this.root.querySelector('slot[name="description"]'),i=this.root.querySelector('slot[name="error"]'),r=this.root.querySelector('slot[name="prefix"]'),n=this.root.querySelector('slot[name="suffix"]'),s=(this.getAttribute("label")||"").trim(),a=(this.getAttribute("description")||"").trim(),c=(this.getAttribute("data-error")||"").trim(),h=!!s||p(t),d=!!a||p(e),b=!!c||p(i),E=p(r),z=p(n),f=this.root.querySelector(".label"),v=this.root.querySelector(".description"),m=this.root.querySelector(".prefix"),_=this.root.querySelector(".suffix-slot"),x=this.root.querySelector(".meta"),y=this.root.querySelector(".footer"),A=this.root.querySelector(".error"),w=this.root.querySelector(".counter");f&&f.toggleAttribute("hidden",!h),v&&v.toggleAttribute("hidden",!d),m&&m.toggleAttribute("hidden",!E),_&&_.toggleAttribute("hidden",!z),x&&x.toggleAttribute("hidden",!h&&!d);const k=this.hasAttribute("counter");if(w&&w.toggleAttribute("hidden",!k),A&&A.toggleAttribute("hidden",!b),y&&y.toggleAttribute("hidden",!b&&!k),!this._input)return;h?this._input.setAttribute("aria-labelledby",`${this._uid}-label`):this._input.removeAttribute("aria-labelledby");const g=[];d&&g.push(`${this._uid}-description`),b&&g.push(`${this._uid}-error`),g.length?this._input.setAttribute("aria-describedby",g.join(" ")):this._input.removeAttribute("aria-describedby"),this.getAttribute("validation")==="error"||!!c?this._input.setAttribute("aria-invalid","true"):this._input.removeAttribute("aria-invalid"),this.hasAttribute("required")?this._input.setAttribute("aria-required","true"):this._input.removeAttribute("aria-required")}_syncUi(){this._syncControlAttrs(),this._syncInputValue(this.value),this._syncDerivedState(),this._syncToggleUi(),this._syncStrengthUi(),this.hasAttribute("autofocus")&&!this._autofocusApplied&&(this._autofocusApplied=!0,queueMicrotask(()=>{if(this.isConnected)try{this._input?.focus({preventScroll:!0})}catch{this._input?.focus()}}))}_emitValueEvent(t,e){this.dispatchEvent(new CustomEvent(t,{detail:{value:e},bubbles:!0,composed:!0}))}_registerWithForm(){this._formUnregister&&(this._formUnregister(),this._formUnregister=null);try{const r=this.getRootNode().host?.closest?.("ui-form")||null||this.closest("ui-form"),n=this.getAttribute("name");r&&typeof r.registerField=="function"&&n&&(this._formUnregister=r.registerField(n,{name:n,getValue:()=>this.value,setValue:s=>{this.value=String(s??"")},validate:async()=>this._input?{valid:this._input.checkValidity(),message:this._input.validationMessage||void 0}:{valid:!0},setError:s=>{s?(this.setAttribute("validation","error"),this.setAttribute("data-error",s)):(this.removeAttribute("validation"),this.removeAttribute("data-error")),this._syncUi()}}))}catch{}}_onSlotChange(){this._syncDerivedState()}_onNativeInput(t){const e=t.target.value;this.getAttribute("value")!==e?e?this.setAttribute("value",e):this.removeAttribute("value"):(this._syncInputValue(e),this._syncStrengthUi()),this._emitValueEvent("input",e);const i=Number(this.getAttribute("debounce")||0);i>0?(this._debounceTimer&&clearTimeout(this._debounceTimer),this._debounceTimer=setTimeout(()=>{this._emitValueEvent("debounced-input",e),this._debounceTimer=null},i)):this._emitValueEvent("debounced-input",e)}_onNativeChange(t){const e=t.target.value;this._emitValueEvent("change",e)}_onClearClick(t){if(t.preventDefault(),!(u(this,"disabled")||this.hasAttribute("readonly"))&&this._input){this.value="",this._input.value="",this._input.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this._input.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("clear",{bubbles:!0,composed:!0}));try{this._input.focus({preventScroll:!0})}catch{this._input.focus()}}}_onToggleClick(t){t.preventDefault(),t.stopPropagation(),this.toggleVisibility()}}typeof customElements<"u"&&!customElements.get("ui-password-field")&&customElements.define("ui-password-field",C);exports.UIPasswordField=C;
|