npm - @dialpad/dialtone-vue - Versions diffs - 3.220.0-next.7 → 3.221.0 - Mend

@dialpad/dialtone-vue 3.220.0-next.7 → 3.221.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.

Files changed (2032) hide show

package/dist/resizable_handle-BlKBiWnx.js ADDED Viewed

@@ -0,0 +1,307 @@
+import { d as e, f as t, s as n } from "./resizable_utils-BComtrMV.js";
+import { t as r } from "./useResizableCalculations-DAajatT4.js";
+import { computed as i, createElementBlock as a, createElementVNode as o, getCurrentInstance as s, inject as c, normalizeClass as l, normalizeStyle as u, onMounted as d, onUnmounted as f, openBlock as p, ref as m, unref as h } from "vue";
+//#region components/resizable/composables/useResizableKeyboard.ts
+var g = {
+	resizeAnnouncement: "{beforeId}: {beforePx}px, {afterId}: {afterPx}px",
+	collapseAnnouncement: "{panelId} collapsed",
+	expandAnnouncement: "{panelId} expanded",
+	resetAnnouncement: "{beforeId} and {afterId} reset",
+	ariaValueText: "{panelId}: {pixels}px",
+	handleAriaLabel: "Resize handle between {before} and {after} panels"
+}, _ = {
+	fine: 1,
+	normal: 8,
+	large: 24
+};
+function v(e) {
+	let { panels: n, direction: i, containerSize: a, beforePanelId: o, afterPanelId: s, handleElement: c, onResize: l, onCollapse: u, onReset: d, onSizeAnnouncement: f, messages: p } = e, h = {
+		...g,
+		...p
+	}, v = m(!1), y = r(() => a.value);
+	function b() {
+		return {
+			beforePanel: n.value.find((e) => e.id === o.value),
+			afterPanel: n.value.find((e) => e.id === s.value)
+		};
+	}
+	function x(e) {
+		return e.metaKey || e.ctrlKey ? _.fine : e.shiftKey ? _.large : _.normal;
+	}
+	function S(e, t) {
+		return t === "row" ? {
+			ArrowLeft: "decrease",
+			ArrowRight: "increase"
+		}[e] || null : {
+			ArrowUp: "decrease",
+			ArrowDown: "increase"
+		}[e] || null;
+	}
+	function C(e, t) {
+		let n = Math.round(e.pixelSize), r = Math.round(t.pixelSize);
+		return h.resizeAnnouncement.replace("{beforeId}", e.id).replace("{afterId}", t.id).replace("{beforePx}", String(n)).replace("{afterPx}", String(r));
+	}
+	function w(e, t, n, r, i) {
+		e.style.insetInlineStart = e.style.insetInlineStart || "0px", e.style.insetInlineEnd = `${i}px`, e.style.inlineSize = "", t.style.insetInlineStart = `${r}px`, t.style.inlineSize = "", n && (n.style.insetInlineStart = `${Math.max(0, r - 2)}px`);
+	}
+	function T(e, t, n) {
+		e.style.insetInlineStart = "", e.style.insetInlineEnd = "", e.style.inlineSize = "", t.style.insetInlineStart = "", t.style.inlineSize = "", n && (n.style.insetInlineStart = "");
+	}
+	function E(e, n, r, i) {
+		let u = Math.round(r), d = Math.round(i), f = r, p = c.value?.closest(".d-resizable"), m = null, h = null, g = null;
+		if (p && (m = p.querySelector(`[data-panel-id="${o.value}"]`), h = p.querySelector(`[data-panel-id="${s.value}"]`), g = p.querySelector(`[data-handle-id="${t(o.value, s.value)}"]`), m && h)) {
+			let e = a.value - f;
+			w(m, h, g, f, e);
+		}
+		l(o.value, u, s.value, d), m && h && T(m, h, g);
+	}
+	function D(e, r, i, c) {
+		let l = i === "increase" ? c : -c, u = e.pixelSize + l, d = y.processResizeMove(u, e, r, a.value, t(o.value, s.value), n.value, 0);
+		return d.isValidResize ? (E(e, r, d.beforePanelSize, d.afterPanelSize), f && f(C(e, r)), !0) : !1;
+	}
+	function O(e) {
+		let t = S(e.key, i.value);
+		if (!t) return;
+		e.preventDefault(), e.stopPropagation();
+		let { beforePanel: n, afterPanel: r } = b();
+		!n || !r || D(n, r, t, x(e));
+	}
+	function k(e) {
+		let { beforePanel: t } = b();
+		if (!t?.collapsible || !u) return;
+		e.preventDefault();
+		let n = !t.collapsed;
+		u(t.id, n), f && f((n ? h.collapseAnnouncement : h.expandAnnouncement).replace("{panelId}", t.id));
+	}
+	function A(e) {
+		e.preventDefault();
+		let { beforePanel: t, afterPanel: n } = b();
+		if (!t || !n) return;
+		let r = (t.userMinSizePixels ?? 10) - t.pixelSize;
+		r !== 0 && D(t, n, r > 0 ? "increase" : "decrease", Math.abs(r));
+	}
+	function j(e) {
+		e.preventDefault();
+		let { beforePanel: t, afterPanel: n } = b();
+		if (!t || !n) return;
+		let r = n.userMinSizePixels ?? 10, i = t.userMaxSizePixels ?? a.value - r, o = Math.min(i, a.value - r) - t.pixelSize;
+		o !== 0 && D(t, n, o > 0 ? "increase" : "decrease", Math.abs(o));
+	}
+	function M(e) {
+		if (e.ctrlKey || e.metaKey || e.altKey || e.shiftKey) return;
+		e.preventDefault();
+		let { beforePanel: t, afterPanel: n } = b();
+		!t || !n || !d || (d(t.id, n.id), f && f(h.resetAnnouncement.replace("{beforeId}", t.id).replace("{afterId}", n.id)));
+	}
+	function N(e) {
+		e.preventDefault(), c.value?.blur();
+	}
+	function P(e) {
+		if (v.value) {
+			switch (e.key) {
+				case "Enter":
+					k(e);
+					return;
+				case "Home":
+					A(e);
+					return;
+				case "End":
+					j(e);
+					return;
+				case "r":
+				case "R":
+					M(e);
+					return;
+				case "Escape":
+					N(e);
+					return;
+			}
+			O(e);
+		}
+	}
+	function F() {
+		v.value = !0;
+	}
+	function I() {
+		v.value = !1;
+	}
+	function L() {
+		c.value?.focus();
+	}
+	return {
+		isFocused: v,
+		focusHandle: L,
+		handleKeyDown: P,
+		handleFocus: F,
+		handleBlur: I,
+		KEYBOARD_INCREMENTS: _
+	};
+}
+//#endregion
+//#region components/resizable/resizable_handle.vue
+var y = [
+	"data-handle-id",
+	"tabindex",
+	"aria-orientation",
+	"aria-label",
+	"aria-valuenow",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-controls",
+	"aria-valuetext",
+	"aria-disabled"
+], b = {
+	__name: "resizable_handle",
+	props: {
+		beforePanelId: {
+			type: String,
+			default: null
+		},
+		afterPanelId: {
+			type: String,
+			default: null
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		class: {
+			type: [
+				String,
+				Object,
+				Array
+			],
+			default: ""
+		},
+		disableResetOnDoubleClick: {
+			type: Boolean,
+			default: !1
+		},
+		resetBehavior: {
+			type: String,
+			default: "both"
+		},
+		ariaLabel: {
+			type: String,
+			default: null
+		}
+	},
+	setup(r) {
+		let g = r, _ = c(e, null), b = _?.layout ?? i(() => ({
+			panels: /* @__PURE__ */ new Map(),
+			handles: []
+		})), x = _?.panels ?? i(() => []), S = _?.direction ?? i(() => "row"), C = _?.containerSize ?? i(() => 1e3), w = _?.activeHandleId ?? i(() => void 0), T = _?.startResize ?? (() => {}), E = _?.resetPanels ?? (() => {}), D = _?.registerHandle ?? (() => 0), O = _?.unregisterHandle ?? (() => {}), k = _?.saveToStorage ?? null, A = _?.collapsePanel ?? null, j = _?.commitPanelSize ?? null, M = _?.announce ?? null, N = _?.panelMap ?? i(() => /* @__PURE__ */ new Map()), P = _?.messages ?? {}, F = s(), I = m(0), L = i(() => {
+			let e = b.value;
+			if (e.handles.length === 0) return null;
+			if (g.beforePanelId && g.afterPanelId) {
+				let n = t(g.beforePanelId, g.afterPanelId);
+				return e.handles.find((e) => e.id === n) ?? null;
+			}
+			return e.handles[I.value] ?? null;
+		}), R = i(() => L.value?.id ?? ""), z = i(() => L.value?.beforePanelId ?? g.beforePanelId ?? ""), B = i(() => L.value?.afterPanelId ?? g.afterPanelId ?? ""), V = i(() => !!(R.value && w.value === R.value)), H = i(() => g.disabled || (L.value?.disabled ?? !1)), U = S, W = i(() => {
+			let e = L.value;
+			return e ? {
+				insetInlineStart: `${Math.max(0, e.left)}px`,
+				visibility: "",
+				...Q.value
+			} : { visibility: "hidden" };
+		}), G = i(() => {
+			if (g.ariaLabel) return g.ariaLabel;
+			let e = z.value || "first", t = B.value || "second";
+			return (P.handleAriaLabel ?? "Resize handle between {before} and {after} panels").replace("{before}", e).replace("{after}", t);
+		}), K = i(() => {
+			let e = N.value.get(z.value);
+			return e ? (P.ariaValueText ?? "{panelId}: {pixels}px").replace("{panelId}", z.value).replace("{pixels}", String(Math.round(e.pixelSize))) : "";
+		}), q = i(() => {
+			let e = N.value.get(z.value), t = C.value;
+			return !e || !t ? 0 : Math.floor(n(e.collapsed ? 0 : e.pixelSize || 0, t));
+		}), J = i(() => {
+			let e = N.value.get(z.value), t = C.value;
+			return !e || !t ? 0 : Math.floor(n(e.userMinSizePixels || 0, t));
+		}), Y = i(() => {
+			let e = N.value.get(z.value), t = C.value;
+			return !e || !t ? 100 : Math.floor(n(e.userMaxSizePixels || t, t));
+		}), X = m(null), Z = v({
+			panels: x,
+			direction: S,
+			containerSize: C,
+			beforePanelId: z,
+			afterPanelId: B,
+			handleElement: X,
+			onResize(e, t, n, r) {
+				j ? (j(e, t), j(n, r)) : k?.();
+			},
+			onCollapse(e, t) {
+				A?.(e, t);
+			},
+			onReset(e, t) {
+				E?.(e, t, "both");
+			},
+			onSizeAnnouncement(e) {
+				M?.(e);
+			},
+			messages: P
+		}), Q = _?.offsetHandleStyles ?? i(() => ({}));
+		d(() => {
+			D(F);
+			let e = X.value;
+			if (e?.parentElement) {
+				let t = Array.from(e.parentElement.querySelectorAll(".d-resizable-handle")).indexOf(e);
+				t >= 0 && (I.value = t);
+			}
+		}), f(() => {
+			O(F);
+		});
+		function $(e) {
+			H.value || (e.preventDefault(), T(R.value));
+		}
+		function ee() {
+			if (g.disableResetOnDoubleClick || H.value) return;
+			let e = z.value, t = B.value;
+			!e || !t || E(e, t, g.resetBehavior);
+		}
+		function te(e) {
+			Z.handleKeyDown(e);
+		}
+		function ne() {
+			Z.handleFocus();
+		}
+		function re() {
+			Z.handleBlur();
+		}
+		return (e, t) => (p(), a("div", {
+			ref_key: "handleElement",
+			ref: X,
+			class: l([
+				"d-resizable-handle",
+				`d-resizable-handle--${h(U)}`,
+				g.class,
+				{
+					"d-resizable-handle--active": V.value,
+					"d-resizable-handle--disabled": H.value
+				}
+			]),
+			style: u(W.value),
+			"data-handle-id": R.value,
+			tabindex: H.value ? "-1" : "0",
+			role: "separator",
+			"aria-orientation": h(U) === "row" ? "vertical" : "horizontal",
+			"aria-label": G.value,
+			"aria-valuenow": q.value,
+			"aria-valuemin": J.value,
+			"aria-valuemax": Y.value,
+			"aria-controls": `dt-resizable-panel-${z.value}`,
+			"aria-valuetext": K.value,
+			"aria-disabled": H.value || void 0,
+			onPointerdown: $,
+			onDblclick: ee,
+			onKeydown: te,
+			onFocus: ne,
+			onBlur: re
+		}, [...t[0] || (t[0] = [o("div", { class: "d-resizable-handle__indicator" }, null, -1)])], 46, y));
+	}
+};
+//#endregion
+export { b as t };
+//# sourceMappingURL=resizable_handle-BlKBiWnx.js.map

package/dist/resizable_handle-BlKBiWnx.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"resizable_handle-BlKBiWnx.js","names":[],"sources":["../components/resizable/composables/useResizableKeyboard.ts","../components/resizable/resizable_handle.vue"],"sourcesContent":["import { ref, type ComputedRef, type Ref } from 'vue';\nimport type {\n ResizablePanelState,\n ResizableDirection,\n} from '../resizable_constants';\nimport { MIN_PANEL_SIZE_PX, buildHandleId } from '../resizable_constants';\nimport { useResizeHandling } from './useResizableCalculations';\n\nexport interface ResizableKeyboardMessages {\n /**\n * Announcement template for resize actions.\n * Placeholders: {beforeId}, {afterId}, {beforePx}, {afterPx}\n */\n resizeAnnouncement?: string;\n /** Announced when a panel is collapsed. Placeholder: {panelId} */\n collapseAnnouncement?: string;\n /** Announced when a panel is expanded. Placeholder: {panelId} */\n expandAnnouncement?: string;\n /** Announced when panels are reset. Placeholders: {beforeId}, {afterId} */\n resetAnnouncement?: string;\n /** aria-valuetext template. Placeholders: {panelId}, {pixels} */\n ariaValueText?: string;\n /** aria-label template. Placeholders: {before}, {after} */\n handleAriaLabel?: string;\n}\n\nconst DEFAULT_KEYBOARD_MESSAGES: Required<ResizableKeyboardMessages> = {\n resizeAnnouncement:\n '{beforeId}: {beforePx}px, {afterId}: {afterPx}px',\n collapseAnnouncement: '{panelId} collapsed',\n expandAnnouncement: '{panelId} expanded',\n resetAnnouncement: '{beforeId} and {afterId} reset',\n ariaValueText: '{panelId}: {pixels}px',\n handleAriaLabel: 'Resize handle between {before} and {after} panels',\n};\n\nexport interface ResizableKeyboardOptions {\n panels: ComputedRef<ResizablePanelState[]>;\n direction: ComputedRef<ResizableDirection>;\n containerSize: ComputedRef<number>;\n beforePanelId: ComputedRef<string>;\n afterPanelId: ComputedRef<string>;\n handleElement: Ref<HTMLElement | null>;\n onResize: (\n beforePanelId: string,\n beforeSize: number,\n afterPanelId: string,\n afterSize: number,\n ) => void;\n onCollapse?: (panelId: string, collapsed: boolean) => void;\n onReset?: (beforePanelId: string, afterPanelId: string) => void;\n onSizeAnnouncement?: (message: string) => void;\n messages?: ResizableKeyboardMessages;\n}\n\n/**\n * Keyboard increment settings for different modifier combinations (pixels).\n */\nexport const KEYBOARD_INCREMENTS = {\n /** Fine control (Cmd/Ctrl + Arrow) */\n fine: 1,\n /** Normal increment (Arrow only) */\n normal: 8,\n /** Large increment (Shift + Arrow) */\n large: 24,\n} as const;\n\n/**\n * Composable for keyboard-driven resize on a single handle.\n * Implements the W3C ARIA separator keyboard pattern:\n * - Arrow keys: resize\n * - Enter: toggle collapse on before panel\n * - Home: resize to min\n * - End: resize to max\n * - R: reset adjacent panels\n * - Escape: blur handle\n */\nexport function useResizableKeyboard(options: ResizableKeyboardOptions) {\n const {\n panels,\n direction,\n containerSize,\n beforePanelId,\n afterPanelId,\n handleElement,\n onResize,\n onCollapse,\n onReset,\n onSizeAnnouncement,\n messages: userMessages,\n } = options;\n\n const msg = { ...DEFAULT_KEYBOARD_MESSAGES, ...userMessages };\n\n const isFocused = ref(false);\n\n const resizeHandler = useResizeHandling(() => containerSize.value);\n\n function getCurrentPanels() {\n const beforePanel = panels.value.find(\n (p) => p.id === beforePanelId.value,\n );\n const afterPanel = panels.value.find(\n (p) => p.id === afterPanelId.value,\n );\n return { beforePanel, afterPanel };\n }\n\n function getResizeIncrement(event: KeyboardEvent): number {\n if (event.metaKey || event.ctrlKey) return KEYBOARD_INCREMENTS.fine;\n if (event.shiftKey) return KEYBOARD_INCREMENTS.large;\n return KEYBOARD_INCREMENTS.normal;\n }\n\n function getResizeDirection(\n key: string,\n layoutDirection: ResizableDirection,\n ): 'increase' | 'decrease' | null {\n const rowKeyMap: Record<string, 'increase' | 'decrease'> = {\n ArrowLeft: 'decrease',\n ArrowRight: 'increase',\n };\n const columnKeyMap: Record<string, 'increase' | 'decrease'> = {\n ArrowUp: 'decrease',\n ArrowDown: 'increase',\n };\n return layoutDirection === 'row'\n ? rowKeyMap[key] || null\n : columnKeyMap[key] || null;\n }\n\n function generateSizeAnnouncement(\n beforePanel: ResizablePanelState,\n afterPanel: ResizablePanelState,\n ): string {\n const beforePx = Math.round(beforePanel.pixelSize);\n const afterPx = Math.round(afterPanel.pixelSize);\n\n return msg.resizeAnnouncement\n .replace('{beforeId}', beforePanel.id)\n .replace('{afterId}', afterPanel.id)\n .replace('{beforePx}', String(beforePx))\n .replace('{afterPx}', String(afterPx));\n }\n\n // ─── DOM position updates (logical properties) ──────────────────────\n\n function updateLayout(\n beforeEl: HTMLElement,\n afterEl: HTMLElement,\n handleEl: HTMLElement | null,\n cursorPos: number,\n beforeEnd: number,\n ): void {\n beforeEl.style.insetInlineStart = beforeEl.style.insetInlineStart || '0px';\n beforeEl.style.insetInlineEnd = `${beforeEnd}px`;\n beforeEl.style.inlineSize = '';\n\n afterEl.style.insetInlineStart = `${cursorPos}px`;\n afterEl.style.inlineSize = '';\n\n if (handleEl) {\n handleEl.style.insetInlineStart = `${Math.max(0, cursorPos - 2)}px`;\n }\n }\n\n function clearInlineStyles(\n beforeEl: HTMLElement,\n afterEl: HTMLElement,\n handleEl: HTMLElement | null,\n ): void {\n beforeEl.style.insetInlineStart = '';\n beforeEl.style.insetInlineEnd = '';\n beforeEl.style.inlineSize = '';\n afterEl.style.insetInlineStart = '';\n afterEl.style.inlineSize = '';\n if (handleEl) handleEl.style.insetInlineStart = '';\n }\n\n function applyResize(\n beforePanel: ResizablePanelState,\n afterPanel: ResizablePanelState,\n newBeforePixels: number,\n newAfterPixels: number,\n ): void {\n const roundedBefore = Math.round(newBeforePixels);\n const roundedAfter = Math.round(newAfterPixels);\n\n // DOM updates for immediate visual feedback\n const cursorPos = newBeforePixels;\n const container = handleElement.value?.closest('.d-resizable');\n\n let beforeEl: HTMLElement | null = null;\n let afterEl: HTMLElement | null = null;\n let hEl: HTMLElement | null = null;\n\n if (container) {\n beforeEl = container.querySelector(\n `[data-panel-id=\"${beforePanelId.value}\"]`,\n );\n afterEl = container.querySelector(\n `[data-panel-id=\"${afterPanelId.value}\"]`,\n );\n hEl = container.querySelector(\n `[data-handle-id=\"${buildHandleId(beforePanelId.value, afterPanelId.value)}\"]`,\n );\n\n if (beforeEl && afterEl) {\n const beforeEnd = containerSize.value - cursorPos;\n updateLayout(beforeEl, afterEl, hEl, cursorPos, beforeEnd);\n }\n }\n\n // Commit to reactive state — mirrors drag's commitDrag discipline\n onResize(\n beforePanelId.value,\n roundedBefore,\n afterPanelId.value,\n roundedAfter,\n );\n\n // Clear inline styles so Vue exclusively owns the DOM from this point.\n // Without this, there's a frame where both inline styles and Vue's\n // computed layout coexist — a latent bug surface if anything reads\n // DOM positions between onResize and Vue's next render.\n if (beforeEl && afterEl) {\n clearInlineStyles(beforeEl, afterEl, hEl);\n }\n }\n\n function processKeyboardResize(\n beforePanel: ResizablePanelState,\n afterPanel: ResizablePanelState,\n resizeDirection: 'increase' | 'decrease',\n incrementPixels: number,\n ): boolean {\n const delta =\n resizeDirection === 'increase' ? incrementPixels : -incrementPixels;\n const newCursorPosition = beforePanel.pixelSize + delta;\n\n const resizeResult = resizeHandler.processResizeMove(\n newCursorPosition,\n beforePanel,\n afterPanel,\n containerSize.value,\n buildHandleId(beforePanelId.value, afterPanelId.value),\n panels.value,\n 0,\n );\n\n if (!resizeResult.isValidResize) return false;\n\n applyResize(\n beforePanel,\n afterPanel,\n resizeResult.beforePanelSize,\n resizeResult.afterPanelSize,\n );\n\n if (onSizeAnnouncement) {\n onSizeAnnouncement(\n generateSizeAnnouncement(beforePanel, afterPanel),\n );\n }\n\n return true;\n }\n\n // ─── Key handlers ─────────────────────────────────────────────────\n\n function handleArrowKey(event: KeyboardEvent): void {\n const resizeDirection = getResizeDirection(event.key, direction.value);\n if (!resizeDirection) return;\n\n event.preventDefault();\n event.stopPropagation();\n\n const { beforePanel, afterPanel } = getCurrentPanels();\n if (!beforePanel || !afterPanel) return;\n\n const incrementPixels = getResizeIncrement(event);\n processKeyboardResize(\n beforePanel, afterPanel, resizeDirection, incrementPixels,\n );\n }\n\n function handleEnterKey(event: KeyboardEvent): void {\n const { beforePanel } = getCurrentPanels();\n if (!beforePanel?.collapsible || !onCollapse) return;\n\n event.preventDefault();\n const newCollapsed = !beforePanel.collapsed;\n onCollapse(beforePanel.id, newCollapsed);\n\n if (onSizeAnnouncement) {\n const template = newCollapsed\n ? msg.collapseAnnouncement\n : msg.expandAnnouncement;\n onSizeAnnouncement(template.replace('{panelId}', beforePanel.id));\n }\n }\n\n function handleHomeKey(event: KeyboardEvent): void {\n event.preventDefault();\n\n const { beforePanel, afterPanel } = getCurrentPanels();\n if (!beforePanel || !afterPanel) return;\n\n const targetSize = beforePanel.userMinSizePixels ?? MIN_PANEL_SIZE_PX;\n const delta = targetSize - beforePanel.pixelSize;\n if (delta === 0) return;\n\n const dir = delta > 0 ? 'increase' : 'decrease';\n processKeyboardResize(beforePanel, afterPanel, dir, Math.abs(delta));\n }\n\n function handleEndKey(event: KeyboardEvent): void {\n event.preventDefault();\n\n const { beforePanel, afterPanel } = getCurrentPanels();\n if (!beforePanel || !afterPanel) return;\n\n const afterMin = afterPanel.userMinSizePixels ?? MIN_PANEL_SIZE_PX;\n const maxSize = beforePanel.userMaxSizePixels\n ?? (containerSize.value - afterMin);\n const targetSize = Math.min(maxSize, containerSize.value - afterMin);\n const delta = targetSize - beforePanel.pixelSize;\n if (delta === 0) return;\n\n const dir = delta > 0 ? 'increase' : 'decrease';\n processKeyboardResize(beforePanel, afterPanel, dir, Math.abs(delta));\n }\n\n function handleResetKey(event: KeyboardEvent): void {\n if (event.ctrlKey || event.metaKey || event.altKey || event.shiftKey) return;\n\n event.preventDefault();\n\n const { beforePanel, afterPanel } = getCurrentPanels();\n if (!beforePanel || !afterPanel || !onReset) return;\n\n onReset(beforePanel.id, afterPanel.id);\n\n if (onSizeAnnouncement) {\n onSizeAnnouncement(\n msg.resetAnnouncement\n .replace('{beforeId}', beforePanel.id)\n .replace('{afterId}', afterPanel.id),\n );\n }\n }\n\n function handleEscapeKey(event: KeyboardEvent): void {\n event.preventDefault();\n handleElement.value?.blur();\n }\n\n // ─── Event handlers ─────────────────────────────────────────────────\n\n function handleKeyDown(event: KeyboardEvent): void {\n if (!isFocused.value) return;\n\n switch (event.key) {\n case 'Enter':\n handleEnterKey(event);\n return;\n case 'Home':\n handleHomeKey(event);\n return;\n case 'End':\n handleEndKey(event);\n return;\n case 'r':\n case 'R':\n handleResetKey(event);\n return;\n case 'Escape':\n handleEscapeKey(event);\n return;\n }\n\n // Arrow keys — resize\n handleArrowKey(event);\n }\n\n function handleFocus(): void {\n isFocused.value = true;\n }\n\n function handleBlur(): void {\n isFocused.value = false;\n }\n\n function focusHandle(): void {\n handleElement.value?.focus();\n }\n\n return {\n isFocused,\n focusHandle,\n handleKeyDown,\n handleFocus,\n handleBlur,\n KEYBOARD_INCREMENTS,\n };\n}\n","<template>\n \n <div\n ref=\"handleElement\"\n :class=\"[\n 'd-resizable-handle',\n `d-resizable-handle--${direction}`,\n props.class,\n {\n 'd-resizable-handle--active': isActive,\n 'd-resizable-handle--disabled': isDisabled,\n },\n ]\"\n :style=\"handleStyles\"\n :data-handle-id=\"handleId\"\n :tabindex=\"isDisabled ? '-1' : '0'\"\n role=\"separator\"\n :aria-orientation=\"direction === 'row' ? 'vertical' : 'horizontal'\"\n :aria-label=\"computedAriaLabel\"\n :aria-valuenow=\"ariaValueNow\"\n :aria-valuemin=\"ariaValueMin\"\n :aria-valuemax=\"ariaValueMax\"\n :aria-controls=\"`dt-resizable-panel-${resolvedBeforePanelId}`\"\n :aria-valuetext=\"ariaValueText\"\n :aria-disabled=\"isDisabled || undefined\"\n @pointerdown=\"handlePointerDown\"\n @dblclick=\"handleDoubleClick\"\n @keydown=\"handleKeyDown\"\n @focus=\"handleFocusEvent\"\n @blur=\"handleBlurEvent\"\n >\n <div class=\"d-resizable-handle__indicator\" />\n </div>\n</template>\n\n<script setup>\nimport { computed, inject, onMounted, onUnmounted, ref, getCurrentInstance } from 'vue';\nimport { RESIZABLE_CONTEXT_KEY, buildHandleId } from './resizable_constants';\nimport { pixelsToPercentage } from './resizable_utils';\nimport { useResizableKeyboard } from './composables/useResizableKeyboard';\n\nconst props = defineProps({\n /** ID of the panel before this handle. Auto-detected from layout order if not set. */\n beforePanelId: { type: String, default: null },\n /** ID of the panel after this handle. Auto-detected from layout order if not set. */\n afterPanelId: { type: String, default: null },\n /** Disable resize interaction for this handle. */\n disabled: { type: Boolean, default: false },\n /** Additional CSS classes applied to the handle element. */\n class: { type: [String, Object, Array], default: '' },\n /** Disable the double-click reset behavior. */\n disableResetOnDoubleClick: { type: Boolean, default: false },\n /**\n * Which panels to reset on double-click.\n * @values 'both', 'before', 'after', 'all'\n */\n resetBehavior: { type: String, default: 'both' },\n /** Override the default aria-label for i18n. */\n ariaLabel: { type: String, default: null },\n});\n\n// ── Injected context from DtResizable ────────────────────────────────────\n\nconst ctx = inject(RESIZABLE_CONTEXT_KEY, null);\nconst layoutRef = ctx?.layout ?? computed(() => ({ panels: new Map(), handles: [] }));\nconst panels = ctx?.panels ?? computed(() => []);\nconst directionRef = ctx?.direction ?? computed(() => 'row');\nconst containerSizeRef = ctx?.containerSize ?? computed(() => 1000);\nconst activeHandleId = ctx?.activeHandleId ?? computed(() => undefined);\nconst startResize = ctx?.startResize ?? (() => {});\nconst resetPanels = ctx?.resetPanels ?? (() => {});\nconst registerHandle = ctx?.registerHandle ?? (() => 0);\nconst unregisterHandle = ctx?.unregisterHandle ?? (() => {});\nconst saveToStorage = ctx?.saveToStorage ?? null;\nconst collapsePanel = ctx?.collapsePanel ?? null;\nconst commitPanelSize = ctx?.commitPanelSize ?? null;\nconst announce = ctx?.announce ?? null;\nconst panelMap = ctx?.panelMap ?? computed(() => new Map());\nconst injectedMessages = ctx?.messages ?? {};\n\n// ── Handle registration ──────────────────────────────────────────────────────\n\nconst currentInstance = getCurrentInstance();\n\n// ── Layout-driven position ───────────────────────────────────────────────────\n\n// DOM index resolved once at mount time to avoid repeated querySelectorAll calls\nconst resolvedDomIndex = ref(0);\n\nconst handlePosition = computed(() => {\n const layout = layoutRef.value;\n if (layout.handles.length === 0) return null;\n\n if (props.beforePanelId && props.afterPanelId) {\n const id = buildHandleId(props.beforePanelId, props.afterPanelId);\n return layout.handles.find(h => h.id === id) ?? null;\n }\n\n return layout.handles[resolvedDomIndex.value] ?? null;\n});\n\n/** The composite handle identifier used by the drag system */\nconst handleId = computed(() => handlePosition.value?.id ?? '');\n\n/** Panel ID before this handle (from layout result) */\nconst resolvedBeforePanelId = computed(() => handlePosition.value?.beforePanelId ?? props.beforePanelId ?? '');\n\n/** Panel ID after this handle (from layout result) */\nconst resolvedAfterPanelId = computed(() => handlePosition.value?.afterPanelId ?? props.afterPanelId ?? '');\n\n/** Whether this handle is currently the active drag handle */\nconst isActive = computed(() => !!(handleId.value && activeHandleId.value === handleId.value));\n\n/**\n * Handle is disabled when:\n * - props.disabled is set, OR\n * - the layout marks this handle as disabled (adjacent collapsed/non-resizable panel)\n */\nconst isDisabled = computed(() => props.disabled || (handlePosition.value?.disabled ?? false));\n\n/** Reactive layout direction */\nconst direction = directionRef;\n\n// ── Position styles from layout ──────────────────────────────────────────────\n\nconst handleStyles = computed(() => {\n const pos = handlePosition.value;\n\n if (!pos) {\n return { visibility: 'hidden' };\n }\n\n return {\n insetInlineStart: `${Math.max(0, pos.left)}px`,\n visibility: '',\n ...offsetHandleStyles.value,\n };\n});\n\n// ── ARIA values ──────────────────────────────────────────────────────────────\n\nconst computedAriaLabel = computed(() => {\n if (props.ariaLabel) return props.ariaLabel;\n const before = resolvedBeforePanelId.value || 'first';\n const after = resolvedAfterPanelId.value || 'second';\n const template = injectedMessages.handleAriaLabel\n ?? 'Resize handle between {before} and {after} panels';\n return template.replace('{before}', before).replace('{after}', after);\n});\n\nconst ariaValueText = computed(() => {\n const p = panelMap.value.get(resolvedBeforePanelId.value);\n if (!p) return '';\n const template = injectedMessages.ariaValueText ?? '{panelId}: {pixels}px';\n return template\n .replace('{panelId}', resolvedBeforePanelId.value)\n .replace('{pixels}', String(Math.round(p.pixelSize)));\n});\n\nconst ariaValueNow = computed(() => {\n const p = panelMap.value.get(resolvedBeforePanelId.value);\n const cs = containerSizeRef.value;\n if (!p || !cs) return 0;\n return Math.floor(pixelsToPercentage(p.collapsed ? 0 : p.pixelSize || 0, cs));\n});\n\nconst ariaValueMin = computed(() => {\n const p = panelMap.value.get(resolvedBeforePanelId.value);\n const cs = containerSizeRef.value;\n if (!p || !cs) return 0;\n return Math.floor(pixelsToPercentage(p.userMinSizePixels || 0, cs));\n});\n\nconst ariaValueMax = computed(() => {\n const p = panelMap.value.get(resolvedBeforePanelId.value);\n const cs = containerSizeRef.value;\n if (!p || !cs) return 100;\n return Math.floor(pixelsToPercentage(p.userMaxSizePixels || cs, cs));\n});\n\n// ── Handle DOM element ───────────────────────────────────────────────────────\n\nconst handleElement = ref(null);\n\n// ── Keyboard resize composable ─────────────────────────────────────────────\n\nconst keyboard = useResizableKeyboard({\n panels,\n direction: directionRef,\n containerSize: containerSizeRef,\n beforePanelId: resolvedBeforePanelId,\n afterPanelId: resolvedAfterPanelId,\n handleElement,\n onResize (beforeId, beforeSize, afterId, afterSize) {\n if (commitPanelSize) {\n commitPanelSize(beforeId, beforeSize);\n commitPanelSize(afterId, afterSize);\n } else {\n saveToStorage?.();\n }\n },\n onCollapse (panelId, collapsed) { collapsePanel?.(panelId, collapsed); },\n onReset (beforeId, afterId) { resetPanels?.(beforeId, afterId, 'both'); },\n onSizeAnnouncement (msg) { announce?.(msg); },\n messages: injectedMessages,\n});\n\n// ── Offset (from parent context) ──────────────────────────────────────────\nconst offsetHandleStyles = ctx?.offsetHandleStyles ?? computed(() => ({}));\n\n// ── Lifecycle ────────────────────────────────────────────────────────────────\n\nonMounted(() => {\n registerHandle(currentInstance);\n\n const el = handleElement.value;\n if (el?.parentElement) {\n const allHandles = Array.from(el.parentElement.querySelectorAll('.d-resizable-handle'));\n const idx = allHandles.indexOf(el);\n if (idx >= 0) resolvedDomIndex.value = idx;\n }\n});\n\nonUnmounted(() => {\n unregisterHandle(currentInstance);\n});\n\n// ── Event handlers ───────────────────────────────────────────────────────────\n\nfunction handlePointerDown (event) {\n if (isDisabled.value) return;\n event.preventDefault();\n startResize(handleId.value);\n}\n\nfunction handleDoubleClick () {\n if (props.disableResetOnDoubleClick) return;\n if (isDisabled.value) return;\n\n const beforeId = resolvedBeforePanelId.value;\n const afterId = resolvedAfterPanelId.value;\n\n if (!beforeId || !afterId) return;\n\n resetPanels(beforeId, afterId, props.resetBehavior);\n}\n\nfunction handleKeyDown (event) {\n keyboard.handleKeyDown(event);\n}\n\nfunction handleFocusEvent () {\n keyboard.handleFocus();\n}\n\nfunction handleBlurEvent () {\n keyboard.handleBlur();\n}\n</script>\n"],"mappings":"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"}

package/dist/resizable_handle-RIKS8frB.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ require(`./chunk-Bmb41Sf3.cjs`);const e=require(`./resizable_utils-DhuzXRdP.cjs`),t=require(`./useResizableCalculations-BDITle3Q.cjs`);let n=require(`vue`);var r={resizeAnnouncement:`{beforeId}: {beforePx}px, {afterId}: {afterPx}px`,collapseAnnouncement:`{panelId} collapsed`,expandAnnouncement:`{panelId} expanded`,resetAnnouncement:`{beforeId} and {afterId} reset`,ariaValueText:`{panelId}: {pixels}px`,handleAriaLabel:`Resize handle between {before} and {after} panels`},i={fine:1,normal:8,large:24};function a(a){let{panels:o,direction:s,containerSize:c,beforePanelId:l,afterPanelId:u,handleElement:d,onResize:f,onCollapse:p,onReset:m,onSizeAnnouncement:h,messages:g}=a,_={...r,...g},v=(0,n.ref)(!1),y=t.t(()=>c.value);function b(){return{beforePanel:o.value.find(e=>e.id===l.value),afterPanel:o.value.find(e=>e.id===u.value)}}function x(e){return e.metaKey\|\|e.ctrlKey?i.fine:e.shiftKey?i.large:i.normal}function S(e,t){return t===`row`?{ArrowLeft:`decrease`,ArrowRight:`increase`}[e]\|\|null:{ArrowUp:`decrease`,ArrowDown:`increase`}[e]\|\|null}function C(e,t){let n=Math.round(e.pixelSize),r=Math.round(t.pixelSize);return _.resizeAnnouncement.replace(`{beforeId}`,e.id).replace(`{afterId}`,t.id).replace(`{beforePx}`,String(n)).replace(`{afterPx}`,String(r))}function w(e,t,n,r,i){e.style.insetInlineStart=e.style.insetInlineStart\|\|`0px`,e.style.insetInlineEnd=`${i}px`,e.style.inlineSize=``,t.style.insetInlineStart=`${r}px`,t.style.inlineSize=``,n&&(n.style.insetInlineStart=`${Math.max(0,r-2)}px`)}function T(e,t,n){e.style.insetInlineStart=``,e.style.insetInlineEnd=``,e.style.inlineSize=``,t.style.insetInlineStart=``,t.style.inlineSize=``,n&&(n.style.insetInlineStart=``)}function E(t,n,r,i){let a=Math.round(r),o=Math.round(i),s=r,p=d.value?.closest(`.d-resizable`),m=null,h=null,g=null;if(p&&(m=p.querySelector(`[data-panel-id="${l.value}"]`),h=p.querySelector(`[data-panel-id="${u.value}"]`),g=p.querySelector(`[data-handle-id="${e.f(l.value,u.value)}"]`),m&&h)){let e=c.value-s;w(m,h,g,s,e)}f(l.value,a,u.value,o),m&&h&&T(m,h,g)}function D(t,n,r,i){let a=r===`increase`?i:-i,s=t.pixelSize+a,d=y.processResizeMove(s,t,n,c.value,e.f(l.value,u.value),o.value,0);return d.isValidResize?(E(t,n,d.beforePanelSize,d.afterPanelSize),h&&h(C(t,n)),!0):!1}function O(e){let t=S(e.key,s.value);if(!t)return;e.preventDefault(),e.stopPropagation();let{beforePanel:n,afterPanel:r}=b();!n\|\|!r\|\|D(n,r,t,x(e))}function k(e){let{beforePanel:t}=b();if(!t?.collapsible\|\|!p)return;e.preventDefault();let n=!t.collapsed;p(t.id,n),h&&h((n?_.collapseAnnouncement:_.expandAnnouncement).replace(`{panelId}`,t.id))}function A(e){e.preventDefault();let{beforePanel:t,afterPanel:n}=b();if(!t\|\|!n)return;let r=(t.userMinSizePixels??10)-t.pixelSize;r!==0&&D(t,n,r>0?`increase`:`decrease`,Math.abs(r))}function j(e){e.preventDefault();let{beforePanel:t,afterPanel:n}=b();if(!t\|\|!n)return;let r=n.userMinSizePixels??10,i=t.userMaxSizePixels??c.value-r,a=Math.min(i,c.value-r)-t.pixelSize;a!==0&&D(t,n,a>0?`increase`:`decrease`,Math.abs(a))}function M(e){if(e.ctrlKey\|\|e.metaKey\|\|e.altKey\|\|e.shiftKey)return;e.preventDefault();let{beforePanel:t,afterPanel:n}=b();!t\|\|!n\|\|!m\|\|(m(t.id,n.id),h&&h(_.resetAnnouncement.replace(`{beforeId}`,t.id).replace(`{afterId}`,n.id)))}function N(e){e.preventDefault(),d.value?.blur()}function P(e){if(v.value){switch(e.key){case`Enter`:k(e);return;case`Home`:A(e);return;case`End`:j(e);return;case`r`:case`R`:M(e);return;case`Escape`:N(e);return}O(e)}}function F(){v.value=!0}function I(){v.value=!1}function L(){d.value?.focus()}return{isFocused:v,focusHandle:L,handleKeyDown:P,handleFocus:F,handleBlur:I,KEYBOARD_INCREMENTS:i}}var o=[`data-handle-id`,`tabindex`,`aria-orientation`,`aria-label`,`aria-valuenow`,`aria-valuemin`,`aria-valuemax`,`aria-controls`,`aria-valuetext`,`aria-disabled`],s={__name:`resizable_handle`,props:{beforePanelId:{type:String,default:null},afterPanelId:{type:String,default:null},disabled:{type:Boolean,default:!1},class:{type:[String,Object,Array],default:``},disableResetOnDoubleClick:{type:Boolean,default:!1},resetBehavior:{type:String,default:`both`},ariaLabel:{type:String,default:null}},setup(t){let r=t,i=(0,n.inject)(e.d,null),s=i?.layout??(0,n.computed)(()=>({panels:new Map,handles:[]})),c=i?.panels??(0,n.computed)(()=>[]),l=i?.direction??(0,n.computed)(()=>`row`),u=i?.containerSize??(0,n.computed)(()=>1e3),d=i?.activeHandleId??(0,n.computed)(()=>void 0),f=i?.startResize??(()=>{}),p=i?.resetPanels??(()=>{}),m=i?.registerHandle??(()=>0),h=i?.unregisterHandle??(()=>{}),g=i?.saveToStorage??null,_=i?.collapsePanel??null,v=i?.commitPanelSize??null,y=i?.announce??null,b=i?.panelMap??(0,n.computed)(()=>new Map),x=i?.messages??{},S=(0,n.getCurrentInstance)(),C=(0,n.ref)(0),w=(0,n.computed)(()=>{let t=s.value;if(t.handles.length===0)return null;if(r.beforePanelId&&r.afterPanelId){let n=e.f(r.beforePanelId,r.afterPanelId);return t.handles.find(e=>e.id===n)??null}return t.handles[C.value]??null}),T=(0,n.computed)(()=>w.value?.id??``),E=(0,n.computed)(()=>w.value?.beforePanelId??r.beforePanelId??``),D=(0,n.computed)(()=>w.value?.afterPanelId??r.afterPanelId??``),O=(0,n.computed)(()=>!!(T.value&&d.value===T.value)),k=(0,n.computed)(()=>r.disabled\|\|(w.value?.disabled??!1)),A=l,j=(0,n.computed)(()=>{let e=w.value;return e?{insetInlineStart:`${Math.max(0,e.left)}px`,visibility:``,...z.value}:{visibility:`hidden`}}),M=(0,n.computed)(()=>{if(r.ariaLabel)return r.ariaLabel;let e=E.value\|\|`first`,t=D.value\|\|`second`;return(x.handleAriaLabel??`Resize handle between {before} and {after} panels`).replace(`{before}`,e).replace(`{after}`,t)}),N=(0,n.computed)(()=>{let e=b.value.get(E.value);return e?(x.ariaValueText??`{panelId}: {pixels}px`).replace(`{panelId}`,E.value).replace(`{pixels}`,String(Math.round(e.pixelSize))):``}),P=(0,n.computed)(()=>{let t=b.value.get(E.value),n=u.value;return!t\|\|!n?0:Math.floor(e.s(t.collapsed?0:t.pixelSize\|\|0,n))}),F=(0,n.computed)(()=>{let t=b.value.get(E.value),n=u.value;return!t\|\|!n?0:Math.floor(e.s(t.userMinSizePixels\|\|0,n))}),I=(0,n.computed)(()=>{let t=b.value.get(E.value),n=u.value;return!t\|\|!n?100:Math.floor(e.s(t.userMaxSizePixels\|\|n,n))}),L=(0,n.ref)(null),R=a({panels:c,direction:l,containerSize:u,beforePanelId:E,afterPanelId:D,handleElement:L,onResize(e,t,n,r){v?(v(e,t),v(n,r)):g?.()},onCollapse(e,t){_?.(e,t)},onReset(e,t){p?.(e,t,`both`)},onSizeAnnouncement(e){y?.(e)},messages:x}),z=i?.offsetHandleStyles??(0,n.computed)(()=>({}));(0,n.onMounted)(()=>{m(S);let e=L.value;if(e?.parentElement){let t=Array.from(e.parentElement.querySelectorAll(`.d-resizable-handle`)).indexOf(e);t>=0&&(C.value=t)}}),(0,n.onUnmounted)(()=>{h(S)});function B(e){k.value\|\|(e.preventDefault(),f(T.value))}function V(){if(r.disableResetOnDoubleClick\|\|k.value)return;let e=E.value,t=D.value;!e\|\|!t\|\|p(e,t,r.resetBehavior)}function H(e){R.handleKeyDown(e)}function U(){R.handleFocus()}function W(){R.handleBlur()}return(e,t)=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{ref_key:`handleElement`,ref:L,class:(0,n.normalizeClass)([`d-resizable-handle`,`d-resizable-handle--${(0,n.unref)(A)}`,r.class,{"d-resizable-handle--active":O.value,"d-resizable-handle--disabled":k.value}]),style:(0,n.normalizeStyle)(j.value),"data-handle-id":T.value,tabindex:k.value?`-1`:`0`,role:`separator`,"aria-orientation":(0,n.unref)(A)===`row`?`vertical`:`horizontal`,"aria-label":M.value,"aria-valuenow":P.value,"aria-valuemin":F.value,"aria-valuemax":I.value,"aria-controls":`dt-resizable-panel-${E.value}`,"aria-valuetext":N.value,"aria-disabled":k.value\|\|void 0,onPointerdown:B,onDblclick:V,onKeydown:H,onFocus:U,onBlur:W},[...t[0]\|\|(t[0]=[(0,n.createElementVNode)(`div`,{class:`d-resizable-handle__indicator`},null,-1)])],46,o))}};Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return s}});
2	+ //# sourceMappingURL=resizable_handle-RIKS8frB.cjs.map

package/dist/resizable_handle-RIKS8frB.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"resizable_handle-RIKS8frB.cjs","names":[],"sources":["../components/resizable/composables/useResizableKeyboard.ts","../components/resizable/resizable_handle.vue"],"sourcesContent":["import { ref, type ComputedRef, type Ref } from 'vue';\nimport type {\n ResizablePanelState,\n ResizableDirection,\n} from '../resizable_constants';\nimport { MIN_PANEL_SIZE_PX, buildHandleId } from '../resizable_constants';\nimport { useResizeHandling } from './useResizableCalculations';\n\nexport interface ResizableKeyboardMessages {\n /**\n * Announcement template for resize actions.\n * Placeholders: {beforeId}, {afterId}, {beforePx}, {afterPx}\n */\n resizeAnnouncement?: string;\n /** Announced when a panel is collapsed. Placeholder: {panelId} */\n collapseAnnouncement?: string;\n /** Announced when a panel is expanded. Placeholder: {panelId} */\n expandAnnouncement?: string;\n /** Announced when panels are reset. Placeholders: {beforeId}, {afterId} */\n resetAnnouncement?: string;\n /** aria-valuetext template. Placeholders: {panelId}, {pixels} */\n ariaValueText?: string;\n /** aria-label template. Placeholders: {before}, {after} */\n handleAriaLabel?: string;\n}\n\nconst DEFAULT_KEYBOARD_MESSAGES: Required<ResizableKeyboardMessages> = {\n resizeAnnouncement:\n '{beforeId}: {beforePx}px, {afterId}: {afterPx}px',\n collapseAnnouncement: '{panelId} collapsed',\n expandAnnouncement: '{panelId} expanded',\n resetAnnouncement: '{beforeId} and {afterId} reset',\n ariaValueText: '{panelId}: {pixels}px',\n handleAriaLabel: 'Resize handle between {before} and {after} panels',\n};\n\nexport interface ResizableKeyboardOptions {\n panels: ComputedRef<ResizablePanelState[]>;\n direction: ComputedRef<ResizableDirection>;\n containerSize: ComputedRef<number>;\n beforePanelId: ComputedRef<string>;\n afterPanelId: ComputedRef<string>;\n handleElement: Ref<HTMLElement | null>;\n onResize: (\n beforePanelId: string,\n beforeSize: number,\n afterPanelId: string,\n afterSize: number,\n ) => void;\n onCollapse?: (panelId: string, collapsed: boolean) => void;\n onReset?: (beforePanelId: string, afterPanelId: string) => void;\n onSizeAnnouncement?: (message: string) => void;\n messages?: ResizableKeyboardMessages;\n}\n\n/**\n * Keyboard increment settings for different modifier combinations (pixels).\n */\nexport const KEYBOARD_INCREMENTS = {\n /** Fine control (Cmd/Ctrl + Arrow) */\n fine: 1,\n /** Normal increment (Arrow only) */\n normal: 8,\n /** Large increment (Shift + Arrow) */\n large: 24,\n} as const;\n\n/**\n * Composable for keyboard-driven resize on a single handle.\n * Implements the W3C ARIA separator keyboard pattern:\n * - Arrow keys: resize\n * - Enter: toggle collapse on before panel\n * - Home: resize to min\n * - End: resize to max\n * - R: reset adjacent panels\n * - Escape: blur handle\n */\nexport function useResizableKeyboard(options: ResizableKeyboardOptions) {\n const {\n panels,\n direction,\n containerSize,\n beforePanelId,\n afterPanelId,\n handleElement,\n onResize,\n onCollapse,\n onReset,\n onSizeAnnouncement,\n messages: userMessages,\n } = options;\n\n const msg = { ...DEFAULT_KEYBOARD_MESSAGES, ...userMessages };\n\n const isFocused = ref(false);\n\n const resizeHandler = useResizeHandling(() => containerSize.value);\n\n function getCurrentPanels() {\n const beforePanel = panels.value.find(\n (p) => p.id === beforePanelId.value,\n );\n const afterPanel = panels.value.find(\n (p) => p.id === afterPanelId.value,\n );\n return { beforePanel, afterPanel };\n }\n\n function getResizeIncrement(event: KeyboardEvent): number {\n if (event.metaKey || event.ctrlKey) return KEYBOARD_INCREMENTS.fine;\n if (event.shiftKey) return KEYBOARD_INCREMENTS.large;\n return KEYBOARD_INCREMENTS.normal;\n }\n\n function getResizeDirection(\n key: string,\n layoutDirection: ResizableDirection,\n ): 'increase' | 'decrease' | null {\n const rowKeyMap: Record<string, 'increase' | 'decrease'> = {\n ArrowLeft: 'decrease',\n ArrowRight: 'increase',\n };\n const columnKeyMap: Record<string, 'increase' | 'decrease'> = {\n ArrowUp: 'decrease',\n ArrowDown: 'increase',\n };\n return layoutDirection === 'row'\n ? rowKeyMap[key] || null\n : columnKeyMap[key] || null;\n }\n\n function generateSizeAnnouncement(\n beforePanel: ResizablePanelState,\n afterPanel: ResizablePanelState,\n ): string {\n const beforePx = Math.round(beforePanel.pixelSize);\n const afterPx = Math.round(afterPanel.pixelSize);\n\n return msg.resizeAnnouncement\n .replace('{beforeId}', beforePanel.id)\n .replace('{afterId}', afterPanel.id)\n .replace('{beforePx}', String(beforePx))\n .replace('{afterPx}', String(afterPx));\n }\n\n // ─── DOM position updates (logical properties) ──────────────────────\n\n function updateLayout(\n beforeEl: HTMLElement,\n afterEl: HTMLElement,\n handleEl: HTMLElement | null,\n cursorPos: number,\n beforeEnd: number,\n ): void {\n beforeEl.style.insetInlineStart = beforeEl.style.insetInlineStart || '0px';\n beforeEl.style.insetInlineEnd = `${beforeEnd}px`;\n beforeEl.style.inlineSize = '';\n\n afterEl.style.insetInlineStart = `${cursorPos}px`;\n afterEl.style.inlineSize = '';\n\n if (handleEl) {\n handleEl.style.insetInlineStart = `${Math.max(0, cursorPos - 2)}px`;\n }\n }\n\n function clearInlineStyles(\n beforeEl: HTMLElement,\n afterEl: HTMLElement,\n handleEl: HTMLElement | null,\n ): void {\n beforeEl.style.insetInlineStart = '';\n beforeEl.style.insetInlineEnd = '';\n beforeEl.style.inlineSize = '';\n afterEl.style.insetInlineStart = '';\n afterEl.style.inlineSize = '';\n if (handleEl) handleEl.style.insetInlineStart = '';\n }\n\n function applyResize(\n beforePanel: ResizablePanelState,\n afterPanel: ResizablePanelState,\n newBeforePixels: number,\n newAfterPixels: number,\n ): void {\n const roundedBefore = Math.round(newBeforePixels);\n const roundedAfter = Math.round(newAfterPixels);\n\n // DOM updates for immediate visual feedback\n const cursorPos = newBeforePixels;\n const container = handleElement.value?.closest('.d-resizable');\n\n let beforeEl: HTMLElement | null = null;\n let afterEl: HTMLElement | null = null;\n let hEl: HTMLElement | null = null;\n\n if (container) {\n beforeEl = container.querySelector(\n `[data-panel-id=\"${beforePanelId.value}\"]`,\n );\n afterEl = container.querySelector(\n `[data-panel-id=\"${afterPanelId.value}\"]`,\n );\n hEl = container.querySelector(\n `[data-handle-id=\"${buildHandleId(beforePanelId.value, afterPanelId.value)}\"]`,\n );\n\n if (beforeEl && afterEl) {\n const beforeEnd = containerSize.value - cursorPos;\n updateLayout(beforeEl, afterEl, hEl, cursorPos, beforeEnd);\n }\n }\n\n // Commit to reactive state — mirrors drag's commitDrag discipline\n onResize(\n beforePanelId.value,\n roundedBefore,\n afterPanelId.value,\n roundedAfter,\n );\n\n // Clear inline styles so Vue exclusively owns the DOM from this point.\n // Without this, there's a frame where both inline styles and Vue's\n // computed layout coexist — a latent bug surface if anything reads\n // DOM positions between onResize and Vue's next render.\n if (beforeEl && afterEl) {\n clearInlineStyles(beforeEl, afterEl, hEl);\n }\n }\n\n function processKeyboardResize(\n beforePanel: ResizablePanelState,\n afterPanel: ResizablePanelState,\n resizeDirection: 'increase' | 'decrease',\n incrementPixels: number,\n ): boolean {\n const delta =\n resizeDirection === 'increase' ? incrementPixels : -incrementPixels;\n const newCursorPosition = beforePanel.pixelSize + delta;\n\n const resizeResult = resizeHandler.processResizeMove(\n newCursorPosition,\n beforePanel,\n afterPanel,\n containerSize.value,\n buildHandleId(beforePanelId.value, afterPanelId.value),\n panels.value,\n 0,\n );\n\n if (!resizeResult.isValidResize) return false;\n\n applyResize(\n beforePanel,\n afterPanel,\n resizeResult.beforePanelSize,\n resizeResult.afterPanelSize,\n );\n\n if (onSizeAnnouncement) {\n onSizeAnnouncement(\n generateSizeAnnouncement(beforePanel, afterPanel),\n );\n }\n\n return true;\n }\n\n // ─── Key handlers ─────────────────────────────────────────────────\n\n function handleArrowKey(event: KeyboardEvent): void {\n const resizeDirection = getResizeDirection(event.key, direction.value);\n if (!resizeDirection) return;\n\n event.preventDefault();\n event.stopPropagation();\n\n const { beforePanel, afterPanel } = getCurrentPanels();\n if (!beforePanel || !afterPanel) return;\n\n const incrementPixels = getResizeIncrement(event);\n processKeyboardResize(\n beforePanel, afterPanel, resizeDirection, incrementPixels,\n );\n }\n\n function handleEnterKey(event: KeyboardEvent): void {\n const { beforePanel } = getCurrentPanels();\n if (!beforePanel?.collapsible || !onCollapse) return;\n\n event.preventDefault();\n const newCollapsed = !beforePanel.collapsed;\n onCollapse(beforePanel.id, newCollapsed);\n\n if (onSizeAnnouncement) {\n const template = newCollapsed\n ? msg.collapseAnnouncement\n : msg.expandAnnouncement;\n onSizeAnnouncement(template.replace('{panelId}', beforePanel.id));\n }\n }\n\n function handleHomeKey(event: KeyboardEvent): void {\n event.preventDefault();\n\n const { beforePanel, afterPanel } = getCurrentPanels();\n if (!beforePanel || !afterPanel) return;\n\n const targetSize = beforePanel.userMinSizePixels ?? MIN_PANEL_SIZE_PX;\n const delta = targetSize - beforePanel.pixelSize;\n if (delta === 0) return;\n\n const dir = delta > 0 ? 'increase' : 'decrease';\n processKeyboardResize(beforePanel, afterPanel, dir, Math.abs(delta));\n }\n\n function handleEndKey(event: KeyboardEvent): void {\n event.preventDefault();\n\n const { beforePanel, afterPanel } = getCurrentPanels();\n if (!beforePanel || !afterPanel) return;\n\n const afterMin = afterPanel.userMinSizePixels ?? MIN_PANEL_SIZE_PX;\n const maxSize = beforePanel.userMaxSizePixels\n ?? (containerSize.value - afterMin);\n const targetSize = Math.min(maxSize, containerSize.value - afterMin);\n const delta = targetSize - beforePanel.pixelSize;\n if (delta === 0) return;\n\n const dir = delta > 0 ? 'increase' : 'decrease';\n processKeyboardResize(beforePanel, afterPanel, dir, Math.abs(delta));\n }\n\n function handleResetKey(event: KeyboardEvent): void {\n if (event.ctrlKey || event.metaKey || event.altKey || event.shiftKey) return;\n\n event.preventDefault();\n\n const { beforePanel, afterPanel } = getCurrentPanels();\n if (!beforePanel || !afterPanel || !onReset) return;\n\n onReset(beforePanel.id, afterPanel.id);\n\n if (onSizeAnnouncement) {\n onSizeAnnouncement(\n msg.resetAnnouncement\n .replace('{beforeId}', beforePanel.id)\n .replace('{afterId}', afterPanel.id),\n );\n }\n }\n\n function handleEscapeKey(event: KeyboardEvent): void {\n event.preventDefault();\n handleElement.value?.blur();\n }\n\n // ─── Event handlers ─────────────────────────────────────────────────\n\n function handleKeyDown(event: KeyboardEvent): void {\n if (!isFocused.value) return;\n\n switch (event.key) {\n case 'Enter':\n handleEnterKey(event);\n return;\n case 'Home':\n handleHomeKey(event);\n return;\n case 'End':\n handleEndKey(event);\n return;\n case 'r':\n case 'R':\n handleResetKey(event);\n return;\n case 'Escape':\n handleEscapeKey(event);\n return;\n }\n\n // Arrow keys — resize\n handleArrowKey(event);\n }\n\n function handleFocus(): void {\n isFocused.value = true;\n }\n\n function handleBlur(): void {\n isFocused.value = false;\n }\n\n function focusHandle(): void {\n handleElement.value?.focus();\n }\n\n return {\n isFocused,\n focusHandle,\n handleKeyDown,\n handleFocus,\n handleBlur,\n KEYBOARD_INCREMENTS,\n };\n}\n","<template>\n \n <div\n ref=\"handleElement\"\n :class=\"[\n 'd-resizable-handle',\n `d-resizable-handle--${direction}`,\n props.class,\n {\n 'd-resizable-handle--active': isActive,\n 'd-resizable-handle--disabled': isDisabled,\n },\n ]\"\n :style=\"handleStyles\"\n :data-handle-id=\"handleId\"\n :tabindex=\"isDisabled ? '-1' : '0'\"\n role=\"separator\"\n :aria-orientation=\"direction === 'row' ? 'vertical' : 'horizontal'\"\n :aria-label=\"computedAriaLabel\"\n :aria-valuenow=\"ariaValueNow\"\n :aria-valuemin=\"ariaValueMin\"\n :aria-valuemax=\"ariaValueMax\"\n :aria-controls=\"`dt-resizable-panel-${resolvedBeforePanelId}`\"\n :aria-valuetext=\"ariaValueText\"\n :aria-disabled=\"isDisabled || undefined\"\n @pointerdown=\"handlePointerDown\"\n @dblclick=\"handleDoubleClick\"\n @keydown=\"handleKeyDown\"\n @focus=\"handleFocusEvent\"\n @blur=\"handleBlurEvent\"\n >\n <div class=\"d-resizable-handle__indicator\" />\n </div>\n</template>\n\n<script setup>\nimport { computed, inject, onMounted, onUnmounted, ref, getCurrentInstance } from 'vue';\nimport { RESIZABLE_CONTEXT_KEY, buildHandleId } from './resizable_constants';\nimport { pixelsToPercentage } from './resizable_utils';\nimport { useResizableKeyboard } from './composables/useResizableKeyboard';\n\nconst props = defineProps({\n /** ID of the panel before this handle. Auto-detected from layout order if not set. */\n beforePanelId: { type: String, default: null },\n /** ID of the panel after this handle. Auto-detected from layout order if not set. */\n afterPanelId: { type: String, default: null },\n /** Disable resize interaction for this handle. */\n disabled: { type: Boolean, default: false },\n /** Additional CSS classes applied to the handle element. */\n class: { type: [String, Object, Array], default: '' },\n /** Disable the double-click reset behavior. */\n disableResetOnDoubleClick: { type: Boolean, default: false },\n /**\n * Which panels to reset on double-click.\n * @values 'both', 'before', 'after', 'all'\n */\n resetBehavior: { type: String, default: 'both' },\n /** Override the default aria-label for i18n. */\n ariaLabel: { type: String, default: null },\n});\n\n// ── Injected context from DtResizable ────────────────────────────────────\n\nconst ctx = inject(RESIZABLE_CONTEXT_KEY, null);\nconst layoutRef = ctx?.layout ?? computed(() => ({ panels: new Map(), handles: [] }));\nconst panels = ctx?.panels ?? computed(() => []);\nconst directionRef = ctx?.direction ?? computed(() => 'row');\nconst containerSizeRef = ctx?.containerSize ?? computed(() => 1000);\nconst activeHandleId = ctx?.activeHandleId ?? computed(() => undefined);\nconst startResize = ctx?.startResize ?? (() => {});\nconst resetPanels = ctx?.resetPanels ?? (() => {});\nconst registerHandle = ctx?.registerHandle ?? (() => 0);\nconst unregisterHandle = ctx?.unregisterHandle ?? (() => {});\nconst saveToStorage = ctx?.saveToStorage ?? null;\nconst collapsePanel = ctx?.collapsePanel ?? null;\nconst commitPanelSize = ctx?.commitPanelSize ?? null;\nconst announce = ctx?.announce ?? null;\nconst panelMap = ctx?.panelMap ?? computed(() => new Map());\nconst injectedMessages = ctx?.messages ?? {};\n\n// ── Handle registration ──────────────────────────────────────────────────────\n\nconst currentInstance = getCurrentInstance();\n\n// ── Layout-driven position ───────────────────────────────────────────────────\n\n// DOM index resolved once at mount time to avoid repeated querySelectorAll calls\nconst resolvedDomIndex = ref(0);\n\nconst handlePosition = computed(() => {\n const layout = layoutRef.value;\n if (layout.handles.length === 0) return null;\n\n if (props.beforePanelId && props.afterPanelId) {\n const id = buildHandleId(props.beforePanelId, props.afterPanelId);\n return layout.handles.find(h => h.id === id) ?? null;\n }\n\n return layout.handles[resolvedDomIndex.value] ?? null;\n});\n\n/** The composite handle identifier used by the drag system */\nconst handleId = computed(() => handlePosition.value?.id ?? '');\n\n/** Panel ID before this handle (from layout result) */\nconst resolvedBeforePanelId = computed(() => handlePosition.value?.beforePanelId ?? props.beforePanelId ?? '');\n\n/** Panel ID after this handle (from layout result) */\nconst resolvedAfterPanelId = computed(() => handlePosition.value?.afterPanelId ?? props.afterPanelId ?? '');\n\n/** Whether this handle is currently the active drag handle */\nconst isActive = computed(() => !!(handleId.value && activeHandleId.value === handleId.value));\n\n/**\n * Handle is disabled when:\n * - props.disabled is set, OR\n * - the layout marks this handle as disabled (adjacent collapsed/non-resizable panel)\n */\nconst isDisabled = computed(() => props.disabled || (handlePosition.value?.disabled ?? false));\n\n/** Reactive layout direction */\nconst direction = directionRef;\n\n// ── Position styles from layout ──────────────────────────────────────────────\n\nconst handleStyles = computed(() => {\n const pos = handlePosition.value;\n\n if (!pos) {\n return { visibility: 'hidden' };\n }\n\n return {\n insetInlineStart: `${Math.max(0, pos.left)}px`,\n visibility: '',\n ...offsetHandleStyles.value,\n };\n});\n\n// ── ARIA values ──────────────────────────────────────────────────────────────\n\nconst computedAriaLabel = computed(() => {\n if (props.ariaLabel) return props.ariaLabel;\n const before = resolvedBeforePanelId.value || 'first';\n const after = resolvedAfterPanelId.value || 'second';\n const template = injectedMessages.handleAriaLabel\n ?? 'Resize handle between {before} and {after} panels';\n return template.replace('{before}', before).replace('{after}', after);\n});\n\nconst ariaValueText = computed(() => {\n const p = panelMap.value.get(resolvedBeforePanelId.value);\n if (!p) return '';\n const template = injectedMessages.ariaValueText ?? '{panelId}: {pixels}px';\n return template\n .replace('{panelId}', resolvedBeforePanelId.value)\n .replace('{pixels}', String(Math.round(p.pixelSize)));\n});\n\nconst ariaValueNow = computed(() => {\n const p = panelMap.value.get(resolvedBeforePanelId.value);\n const cs = containerSizeRef.value;\n if (!p || !cs) return 0;\n return Math.floor(pixelsToPercentage(p.collapsed ? 0 : p.pixelSize || 0, cs));\n});\n\nconst ariaValueMin = computed(() => {\n const p = panelMap.value.get(resolvedBeforePanelId.value);\n const cs = containerSizeRef.value;\n if (!p || !cs) return 0;\n return Math.floor(pixelsToPercentage(p.userMinSizePixels || 0, cs));\n});\n\nconst ariaValueMax = computed(() => {\n const p = panelMap.value.get(resolvedBeforePanelId.value);\n const cs = containerSizeRef.value;\n if (!p || !cs) return 100;\n return Math.floor(pixelsToPercentage(p.userMaxSizePixels || cs, cs));\n});\n\n// ── Handle DOM element ───────────────────────────────────────────────────────\n\nconst handleElement = ref(null);\n\n// ── Keyboard resize composable ─────────────────────────────────────────────\n\nconst keyboard = useResizableKeyboard({\n panels,\n direction: directionRef,\n containerSize: containerSizeRef,\n beforePanelId: resolvedBeforePanelId,\n afterPanelId: resolvedAfterPanelId,\n handleElement,\n onResize (beforeId, beforeSize, afterId, afterSize) {\n if (commitPanelSize) {\n commitPanelSize(beforeId, beforeSize);\n commitPanelSize(afterId, afterSize);\n } else {\n saveToStorage?.();\n }\n },\n onCollapse (panelId, collapsed) { collapsePanel?.(panelId, collapsed); },\n onReset (beforeId, afterId) { resetPanels?.(beforeId, afterId, 'both'); },\n onSizeAnnouncement (msg) { announce?.(msg); },\n messages: injectedMessages,\n});\n\n// ── Offset (from parent context) ──────────────────────────────────────────\nconst offsetHandleStyles = ctx?.offsetHandleStyles ?? computed(() => ({}));\n\n// ── Lifecycle ────────────────────────────────────────────────────────────────\n\nonMounted(() => {\n registerHandle(currentInstance);\n\n const el = handleElement.value;\n if (el?.parentElement) {\n const allHandles = Array.from(el.parentElement.querySelectorAll('.d-resizable-handle'));\n const idx = allHandles.indexOf(el);\n if (idx >= 0) resolvedDomIndex.value = idx;\n }\n});\n\nonUnmounted(() => {\n unregisterHandle(currentInstance);\n});\n\n// ── Event handlers ───────────────────────────────────────────────────────────\n\nfunction handlePointerDown (event) {\n if (isDisabled.value) return;\n event.preventDefault();\n startResize(handleId.value);\n}\n\nfunction handleDoubleClick () {\n if (props.disableResetOnDoubleClick) return;\n if (isDisabled.value) return;\n\n const beforeId = resolvedBeforePanelId.value;\n const afterId = resolvedAfterPanelId.value;\n\n if (!beforeId || !afterId) return;\n\n resetPanels(beforeId, afterId, props.resetBehavior);\n}\n\nfunction handleKeyDown (event) {\n keyboard.handleKeyDown(event);\n}\n\nfunction handleFocusEvent () {\n keyboard.handleFocus();\n}\n\nfunction handleBlurEvent () {\n keyboard.handleBlur();\n}\n</script>\n"],"mappings":"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"}

package/dist/resizable_utils-BComtrMV.js ADDED Viewed

@@ -0,0 +1,131 @@
+//#region components/resizable/resizable_constants.ts
+var e = "50p", t = 10, n = Symbol("resizable-context");
+function r(e, t) {
+	return `${e}:${t}`;
+}
+//#endregion
+//#region components/resizable/resizable_utils.ts
+var i = /* @__PURE__ */ new Map(), a = null;
+function o() {
+	return a === null && (a = typeof document < "u" && parseFloat(getComputedStyle(document.documentElement).fontSize) || 10), a;
+}
+function s(e) {
+	if (i.has(e)) return i.get(e);
+	if (typeof document < "u") {
+		let t = getComputedStyle(document.documentElement).getPropertyValue(`--dt-size-${e}`).trim();
+		if (t) {
+			let n = t.match(/^([\d.]+)rem$/);
+			if (n) {
+				let t = parseFloat(n[1]) * o();
+				return i.set(e, t), t;
+			}
+			let r = t.match(/^([\d.]+)px$/);
+			if (r) {
+				let t = parseFloat(r[1]);
+				return i.set(e, t), t;
+			}
+		}
+	}
+	if (e in c) {
+		let t = c[e];
+		return i.set(e, t), t;
+	}
+}
+var c = {
+	0: 0,
+	50: .5,
+	100: 1,
+	200: 2,
+	300: 4,
+	350: 6,
+	400: 8,
+	450: 12,
+	500: 16,
+	525: 20,
+	550: 24,
+	600: 32,
+	625: 42,
+	650: 48,
+	700: 64,
+	720: 72,
+	730: 84,
+	750: 96,
+	760: 102,
+	775: 114,
+	800: 128,
+	825: 164,
+	850: 192,
+	875: 216,
+	900: 256,
+	905: 264,
+	925: 332,
+	950: 384,
+	975: 464,
+	1e3: 512,
+	1020: 628,
+	1040: 764,
+	1050: 768,
+	1060: 828,
+	1080: 912,
+	1100: 1024,
+	1115: 1140,
+	1120: 1268,
+	1125: 1280,
+	1130: 1340,
+	1150: 1536,
+	1200: 2048
+};
+function l(e) {
+	if (!e.endsWith("p")) return;
+	let t = parseFloat(e.slice(0, -1));
+	return isFinite(t) && t >= 0 && t <= 100 ? t : void 0;
+}
+function u(e) {
+	return s(e) !== void 0;
+}
+function d(e) {
+	return l(e) !== void 0;
+}
+function f(e) {
+	return u(e) || d(e);
+}
+function p(e, t) {
+	let n = s(e);
+	if (n !== void 0) return n;
+	let r = l(e);
+	return r === void 0 ? (console.warn(`[resizable] Invalid sizing value: ${e}`), 0) : r / 100 * t;
+}
+function m(e, t, n) {
+	let { clampToContainer: r = !0 } = n ?? {}, i = h(t);
+	if (g(i, e)) return 0;
+	let a = i === 0 ? 1e3 : i;
+	return typeof e == "string" && f(e) ? _(p(e, a), e, i, r) : (console.warn(`[resizable] Invalid ResizableSizeValue: ${e}. Expected a size token or percentage with 'p' suffix.`), 0);
+}
+function h(e) {
+	return !isFinite(e) || e < 0 ? (console.warn(`[resizable] Invalid containerSize: ${e}. Using fallback value of 1000px.`), 1e3) : e > 1e4 ? (console.warn(`[resizable] Unusually large containerSize: ${e}px. Capping at 10000px.`), 1e4) : e;
+}
+function g(e, t) {
+	return e === 0 && t === "0";
+}
+function _(e, t, n, r) {
+	return !isFinite(e) || e < 0 ? (console.warn(`[resizable] Invalid pixel calculation result: ${e} for value: ${t}, containerSize: ${n}`), 0) : r && n > 0 && e > n ? (console.warn(`[resizable] Size value '${t}' (${e}px) exceeds container (${n}px). Clamping to container.`), n) : e;
+}
+function v(e) {
+	return d(e);
+}
+function y(e) {
+	return u(e);
+}
+function b(e, t) {
+	return e / t * 100;
+}
+function x(e) {
+	return e.userMinSize ? d(e.userMinSize) : !1;
+}
+function S() {
+	i.clear(), a = null;
+}
+//#endregion
+export { f as a, h as c, n as d, r as f, v as i, e as l, S as n, m as o, y as r, b as s, x as t, t as u };
+//# sourceMappingURL=resizable_utils-BComtrMV.js.map