@webority/ui-elements 0.35.2 → 0.36.0

package/dist/{WuiTree-Ds-8tNgs.js → WuiTree-DXP7pGeI.js}

@@ -1,5 +1,5 @@
 import { t as e } from "./elementBase-Bg1xpvup.js";
-import { c as t } from "./wuiHttp-m0yQadwQ.js";
+import { c as t } from "./wuiHttp-oeHs7X_c.js";
 import { n, t as r } from "./formMirror-jGf5M4gk.js";
 import { t as i } from "./iconGlyphs.g-Cpg1BUHm.js";
 import { t as a } from "./listboxKeyNav-zts_8d5e.js";

package/dist/elements/kanban.js

@@ -1,5 +1,5 @@
 import { n as e } from "../elementBase-Bg1xpvup.js";
-import { a as t, c as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, n as u, o as d, p as f, r as p, s as m, t as h, u as g } from "../kanban-BeVAItir.js";
+import { a as t, c as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, n as u, o as d, p as f, r as p, s as m, t as h, u as g } from "../kanban-BIiEMkTK.js";
 //#region src/elements/kanban.js
 e("wui-kanban", n);
 //#endregion

package/dist/elements/tree.js

@@ -1,5 +1,5 @@
 import { n as e } from "../elementBase-Bg1xpvup.js";
-import { t } from "../WuiTree-Ds-8tNgs.js";
+import { t } from "../WuiTree-DXP7pGeI.js";
 //#region src/elements/tree.js
 e("wui-tree", t);
 //#endregion

package/dist/{kanban-BeVAItir.js → kanban-BIiEMkTK.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./elementBase-Bg1xpvup.js";
 import { m as t, s as n, t as r } from "./formatters-DusKbTyV.js";
-import { c as i, o as a } from "./wuiHttp-m0yQadwQ.js";
+import { c as i, o as a } from "./wuiHttp-oeHs7X_c.js";
 //#region src/remoteModal.js
 var o = "wui-remote-modal", s = "wui-modal-fullscreen", c = Object.freeze({
 	sm: 380,
@@ -350,7 +350,7 @@ var _e = Object.freeze([
 		server: "Something went wrong on our side, so the card went back. Try again in a moment.",
 		network: "Could not reach the server, so the card went back. Check your connection and try again."
 	})
-}), B = "[data-wui-column]", V = "[data-wui-body]", H = "[data-wui-card]", U = "[data-wui-count]", xe = "[data-wui-summary]", Se = "[data-wui-empty]", Ce = "[data-wui-drop-note]", we = "[data-wui-live]", Te = "[data-wui-help]", W = "[data-wui-switch]", Ee = "[data-wui-scroller]", De = "[data-wui-collapse]", Oe = "[data-wui-more]", ke = "data-wui-visible-limit", G = "data-wui-overflow", Ae = "input, select, textarea, [contenteditable=\"\"], [contenteditable=\"true\"], [data-wui-no-drag]", K = 48, je = 16, q = (e) => e.getAttribute("data-wui-column"), J = (e) => e.getAttribute("data-wui-card"), Y = (e) => e.hidden || e.hasAttribute("hidden"), Me = (e) => Y(e) || e.hasAttribute(G);
+}), B = "[data-wui-column]", V = "[data-wui-body]", H = "[data-wui-card]", xe = "[data-wui-count]", Se = "[data-wui-summary]", Ce = "[data-wui-empty]", we = "[data-wui-drop-note]", Te = "[data-wui-live]", Ee = "[data-wui-help]", U = "[data-wui-switch]", De = "[data-wui-scroller]", Oe = "[data-wui-collapse]", ke = "[data-wui-more]", Ae = "data-wui-visible-limit", W = "data-wui-overflow", je = "input, select, textarea, [contenteditable=\"\"], [contenteditable=\"true\"], [data-wui-no-drag]", G = 48, K = 16, q = (e) => e.getAttribute("data-wui-column"), J = (e) => e.getAttribute("data-wui-card"), Y = (e) => e.hidden || e.hasAttribute("hidden"), Me = (e) => Y(e) || e.hasAttribute(W);
 function Ne(e) {
 	if (e == null || e === "") return null;
 	let t = typeof e == "number" ? e : Number(e);
@@ -460,24 +460,24 @@ var $ = (e, t) => {
 		this._refreshQueued = !1;
 		let e = this._summaryFormat();
 		for (let n of this._columns()) {
-			let r = q(n), i = Ne(n.getAttribute(ke)), a = [], o = [];
+			let r = q(n), i = Ne(n.getAttribute(Ae)), a = [], o = [];
 			for (let e of this._cardsIn(n)) {
 				if (this._filter && (e.hidden = this._filter(e) === !1), Y(e)) {
-					e.removeAttribute(G);
+					e.removeAttribute(W);
 					continue;
 				}
 				a.push(e), o.push(e.getAttribute("data-wui-value"));
 			}
 			let s = this._expanded.has(r), c = Pe(a.map(J), i, s, this._revealed);
-			for (let e of a) e.toggleAttribute(G, c.has(J(e)));
+			for (let e of a) e.toggleAttribute(W, c.has(J(e)));
 			let l = String(a.length);
 			for (let e of this._countsOf(n)) e.textContent !== l && (e.textContent = l);
-			let u = n.querySelector(Se);
+			let u = n.querySelector(Ce);
 			if (u && (u.hidden = a.length > 0), e) {
-				let r = n.querySelector(xe);
+				let r = n.querySelector(Se);
 				r && (r.textContent = t(Le(o), e));
 			}
-			let d = n.querySelector(Oe);
+			let d = n.querySelector(ke);
 			if (d) {
 				d.hidden = i == null || (s ? a.length <= i : c.size === 0), d.setAttribute("aria-expanded", s ? "true" : "false");
 				let e = s ? z.fewer : z.more(c.size);
@@ -520,11 +520,11 @@ var $ = (e, t) => {
 		return this._allCards().find((t) => J(t) === e) || null;
 	}
 	_countsOf(e) {
-		let t = q(e), n = [...this.querySelectorAll(W)].filter((e) => e.getAttribute("data-wui-switch") === t);
-		return [...e.querySelectorAll(U), ...n.flatMap((e) => [...e.querySelectorAll(U)])];
+		let t = q(e), n = [...this.querySelectorAll(U)].filter((e) => e.getAttribute("data-wui-switch") === t);
+		return [...e.querySelectorAll(xe), ...n.flatMap((e) => [...e.querySelectorAll(xe)])];
 	}
 	_scroller() {
-		return this.querySelector(Ee);
+		return this.querySelector(De);
 	}
 	_summaryFormat() {
 		let e = this.getAttribute("summary-format");
@@ -536,11 +536,11 @@ var $ = (e, t) => {
 		}));
 	}
 	_prepareCard(e) {
-		let t = this.querySelector(Te);
+		let t = this.querySelector(Ee);
 		t?.id && !e.hasAttribute("aria-describedby") && e.setAttribute("aria-describedby", t.id), e.hasAttribute("tabindex") || (e.tabIndex = 0);
 	}
 	_announce(e) {
-		let t = this.querySelector(we);
+		let t = this.querySelector(Te);
 		!t || !e || (t.textContent = "", t.textContent = e);
 	}
 	_fire(e, t, n = !1) {
@@ -590,7 +590,7 @@ var $ = (e, t) => {
 		for (let i of this._columns()) {
 			let a = q(i), o = this._check(e, t, a);
 			r.set(a, o), i.setAttribute("data-wui-drop", o.source ? "source" : o.ok ? "ok" : "refused");
-			let s = i.querySelector(Ce);
+			let s = i.querySelector(we);
 			s && !o.source && (s.textContent = o.ok ? z.dropHere(n, this._titleOf(i)) : o.reason, s.hidden = !1);
 		}
 		return r;
@@ -598,7 +598,7 @@ var $ = (e, t) => {
 	_clearTargets() {
 		for (let e of this._columns()) {
 			e.removeAttribute("data-wui-drop"), e.removeAttribute("data-wui-over"), e.removeAttribute("data-wui-target");
-			let t = e.querySelector(Ce);
+			let t = e.querySelector(we);
 			t && (t.hidden = !0, t.textContent = "");
 		}
 	}
@@ -616,7 +616,7 @@ var $ = (e, t) => {
 		}, f = e.contains(document.activeElement);
 		if (this._controlled()) return this._fire("wui:kanban:move", d), this._announce(z.moved(s, this._titleOf(o))), f && this._refocusSoon(d.key), !0;
 		if (!this._fire("wui:kanban:move", d, !0)) return !1;
-		let p = o.hasAttribute(ke) && !this._revealed.has(d.key);
+		let p = o.hasAttribute(Ae) && !this._revealed.has(d.key);
 		p && this._revealed.add(d.key);
 		let m = {
 			parent: e.parentNode,
@@ -624,7 +624,7 @@ var $ = (e, t) => {
 			column: r,
 			revealed: p
 		};
-		this._bodyOf(o).insertBefore(e, l[u] || null), f && e.focus(), this.refresh();
+		this._bodyOf(o).insertBefore(e, l[u] || null), f && this._focusMoved(e), this.refresh();
 		let h = o.getAttribute("data-wui-step");
 		if (h) return this._runStep(e, d, m, h, o.getAttribute("data-wui-step-size"));
 		let g = this.getAttribute("move-url");
@@ -716,17 +716,23 @@ var $ = (e, t) => {
 			let r = t.contains(document.activeElement);
 			t.dispatchEvent(new CustomEvent("wui:teardown", { bubbles: !0 })), t.hidden && (e.hidden = !0), t.replaceWith(e), this._prepareCard(e), r && e.focus(), n ??= e;
 		}
-		for (let e of t.content.querySelectorAll("template[data-wui-kanban-summary]")) this._columnByKey(e.getAttribute("data-wui-kanban-summary"))?.querySelector(xe)?.replaceChildren(e.content.cloneNode(!0));
+		for (let e of t.content.querySelectorAll("template[data-wui-kanban-summary]")) this._columnByKey(e.getAttribute("data-wui-kanban-summary"))?.querySelector(Se)?.replaceChildren(e.content.cloneNode(!0));
 		return this.refresh(), window.WUI?.refresh?.(), n;
 	}
 	_refocusSoon(e) {
-		let t = () => this._cardByKey(e)?.focus();
+		let t = () => {
+			let t = this._cardByKey(e);
+			t && this._focusMoved(t);
+		};
 		typeof requestAnimationFrame == "function" ? requestAnimationFrame(t) : setTimeout(t, 0);
 	}
+	_focusMoved(e) {
+		e.focus({ preventScroll: !0 }), e.scrollIntoView?.({ block: "nearest" });
+	}
 	_pointerDown(e) {
 		if (e.button !== 0 || e.isPrimary === !1 || this._drag || this._kbd) return;
 		let t = e.target.closest?.(H);
-		if (!t || !this.contains(t) || e.target.closest(Ae)) return;
+		if (!t || !this.contains(t) || e.target.closest(je)) return;
 		let n = {
 			card: t,
 			id: e.pointerId,
@@ -778,7 +784,7 @@ var $ = (e, t) => {
 		let n = this._drag;
 		n.x = e, n.y = t, n.ghost.style.transform = `translate(${e - n.dx}px, ${t - n.dy}px)`;
 		let r = this._columnAt(e, t);
-		r !== n.over && (n.over?.removeAttribute("data-wui-over"), r?.setAttribute("data-wui-over", ""), n.over = r), this._autoScroll(e, t);
+		r !== n.over && (n.over?.removeAttribute("data-wui-over"), r?.setAttribute("data-wui-over", ""), n.over = r), this._autoScroll(e, t, r);
 	}
 	_columnAt(e, t) {
 		for (let n of this._columns()) {
@@ -794,14 +800,21 @@ var $ = (e, t) => {
 		}), r = this._cardsIn(e).filter((e) => e !== this._drag?.card);
 		return n ? r.indexOf(n) : r.length;
 	}
-	_autoScroll(e, t) {
-		let n = this._scroller();
-		if (n) {
-			let t = n.getBoundingClientRect();
-			t.width > 0 && (e < t.left + K ? n.scrollBy?.({ left: -16 }) : e > t.right - K && n.scrollBy?.({ left: je }));
+	_autoScroll(e, t, n) {
+		let r = this._scroller();
+		if (r) {
+			let t = r.getBoundingClientRect();
+			t.width > 0 && (e < t.left + G ? r.scrollBy?.({ left: -16 }) : e > t.right - G && r.scrollBy?.({ left: K }));
 		}
-		let r = window.innerHeight || 0;
-		r > 0 && (t < K ? window.scrollBy?.({ top: -16 }) : t > r - K && window.scrollBy?.({ top: je }));
+		if (n && this._scrollColumn(n, t)) return;
+		let i = window.innerHeight || 0;
+		i > 0 && (t < G ? window.scrollBy?.({ top: -16 }) : t > i - G && window.scrollBy?.({ top: K }));
+	}
+	_scrollColumn(e, t) {
+		let n = this._bodyOf(e);
+		if (!n || e.hasAttribute("data-collapsed") || n.scrollHeight <= n.clientHeight) return !1;
+		let r = n.getBoundingClientRect();
+		return t < r.top + G && n.scrollTop > 0 ? (n.scrollBy?.({ top: -16 }), !0) : t > r.bottom - G && n.scrollTop + n.clientHeight < n.scrollHeight - 1 ? (n.scrollBy?.({ top: K }), !0) : !1;
 	}
 	_endPointer(e) {
 		let t = this._press, n = this._drag;
@@ -830,18 +843,18 @@ var $ = (e, t) => {
 			e.preventDefault(), e.stopPropagation(), this._suppressClick = !1;
 			return;
 		}
-		let t = e.target.closest?.(De);
+		let t = e.target.closest?.(Oe);
 		if (t && this.contains(t)) {
 			let e = t.closest(B);
 			e && this._setCollapsed(e, !e.hasAttribute("data-collapsed"), !0);
 			return;
 		}
-		let n = e.target.closest?.(Oe);
+		let n = e.target.closest?.(ke);
 		if (n && this.contains(n)) {
 			this._controlled() || this._toggleMore(n.closest(B));
 			return;
 		}
-		let r = e.target.closest?.(W);
+		let r = e.target.closest?.(U);
 		r && this.contains(r) && this._showColumn(r.getAttribute("data-wui-switch"));
 	}
 	_keyDown(e) {
@@ -935,7 +948,7 @@ var $ = (e, t) => {
 		let r = q(e);
 		e.toggleAttribute("data-collapsed", t);
 		let i = this._titleOf(e);
-		for (let n of e.querySelectorAll(De)) n.setAttribute("aria-expanded", t ? "false" : "true"), n.setAttribute("aria-label", t ? z.expand(i) : z.collapse(i));
+		for (let n of e.querySelectorAll(Oe)) n.setAttribute("aria-expanded", t ? "false" : "true"), n.setAttribute("aria-label", t ? z.expand(i) : z.collapse(i));
 		n && (Fe(this.getAttribute("board-id"), r, t), this._fire("wui:kanban:collapse", {
 			column: r,
 			collapsed: t
@@ -952,7 +965,7 @@ var $ = (e, t) => {
 		return typeof matchMedia == "function" && matchMedia("(max-width: 767.98px)").matches;
 	}
 	_showColumn(e, t = !0) {
-		for (let t of this.querySelectorAll(W)) t.getAttribute("data-wui-switch") === e ? t.setAttribute("aria-current", "true") : t.removeAttribute("aria-current");
+		for (let t of this.querySelectorAll(U)) t.getAttribute("data-wui-switch") === e ? t.setAttribute("aria-current", "true") : t.removeAttribute("aria-current");
 		let n = this._columnByKey(e), r = this._scroller();
 		if (!n || !r || !t && !this._isPhone()) return;
 		let i = typeof matchMedia == "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
@@ -965,7 +978,7 @@ var $ = (e, t) => {
 		let e = this._scroller();
 		if (!e || !this._isPhone()) return;
 		let t = e.clientWidth || 1, n = this._columns()[Math.round(e.scrollLeft / t)];
-		if (n) for (let e of this.querySelectorAll(W)) e.getAttribute("data-wui-switch") === q(n) ? e.setAttribute("aria-current", "true") : e.removeAttribute("aria-current");
+		if (n) for (let e of this.querySelectorAll(U)) e.getAttribute("data-wui-switch") === q(n) ? e.setAttribute("aria-current", "true") : e.removeAttribute("aria-current");
 	}
 };
 //#endregion