Rename regular-layout-resize-before to regular-layout-before-resize for consistency

Author: texodus

README.md

@@ -94,12 +94,12 @@ localStorage.setItem("layout", JSON.stringify(state));
 layout.restore(JSON.parse(localStorage.getItem("layout")));
 ```
 
-`restore()` dispatches a cancelable `regular-layout-resize-before` event before
+`restore()` dispatches a cancelable `regular-layout-before-resize` event before
 applying the new state. Call `preventDefault()` to suspend the update, then
 `layout.resumeResize()` when ready:
 
 ```javascript
-layout.addEventListener("regular-layout-resize-before", (event) => {
+layout.addEventListener("regular-layout-before-resize", (event) => {
     event.preventDefault();
     // ... prepare for resize ...
     layout.resumeResize();
@@ -152,7 +152,7 @@ complete theme for `<regular-layout>` and `regular-layout-frame>`.
 
 | Event | Detail | Cancelable | Description |
 |-------|--------|------------|-------------|
-| `regular-layout-resize-before` | `{ calculatePresizePaths() }` | Yes | Fired before any layout change. Cancel to suspend until `resumeResize()`. |
+| `regular-layout-before-resize` | `{ calculatePresizePaths() }` | Yes | Fired before any layout change. Cancel to suspend until `resumeResize()`. |
 | `regular-layout-update` | `Layout` | No | Fired after layout state is updated. |
 
 ```javascript

src/core/types.ts

@@ -96,7 +96,7 @@ export interface LayoutPath {
 }
 
 /**
- * The detail payload of the `regular-layout-resize-before` event.
+ * The detail payload of the `regular-layout-before-resize` event.
  */
 export interface PresizeDetail {
 	calculatePresizePaths(): Record<string, LayoutPath>;

src/extensions.ts

@@ -60,7 +60,7 @@ declare global {
 		): void;
 
 		addEventListener(
-			name: "regular-layout-resize-before",
+			name: "regular-layout-before-resize",
 			cb: (e: RegularLayoutPresizeEvent) => void,
 			options?: { signal: AbortSignal },
 		): void;
@@ -76,7 +76,7 @@ declare global {
 		): void;
 
 		removeEventListener(
-			name: "regular-layout-resize-before",
+			name: "regular-layout-before-resize",
 			cb: (e: RegularLayoutPresizeEvent) => void,
 		): void;
 	}

src/regular-layout.ts

@@ -128,7 +128,7 @@ export class RegularLayout extends HTMLElement {
 		this._stylesheet = new CSSStyleSheet();
 		this._cursor_stylesheet = new CSSStyleSheet();
 		this._cursor_override = false;
-		const event_name = `${this._physics.CUSTOM_EVENT_NAME_PREFIX}-resize-before`;
+		const event_name = `${this._physics.CUSTOM_EVENT_NAME_PREFIX}-before-resize`;
 		this._presizeQueue = new PresizeQueue(this, event_name);
 		this._overlayController = new OverlayController(this.create_overlay_host());
 		this._shadowRoot.adoptedStyleSheets = [
@@ -288,7 +288,7 @@ export class RegularLayout extends HTMLElement {
 
 	/**
 	 * Restores the layout from a saved state synchronously, without
-	 * dispatching the `regular-layout-resize-before` event.
+	 * dispatching the `regular-layout-before-resize` event.
 	 *
 	 * @param layout - The layout tree to restore
 	 */
@@ -304,7 +304,7 @@ export class RegularLayout extends HTMLElement {
 	/**
 	 * Restores the layout from a saved state.
 	 *
-	 * Before applying, dispatches a cancelable `regular-layout-resize-before`
+	 * Before applying, dispatches a cancelable `regular-layout-before-resize`
 	 * event. If the event is cancelled via `preventDefault()`, the layout
 	 * update is suspended until {@link resumeResize} is called.
 	 *
@@ -333,7 +333,7 @@ export class RegularLayout extends HTMLElement {
 
 	/**
 	 * Resumes a layout update that was suspended by cancelling the
-	 * `regular-layout-resize-before` event.
+	 * `regular-layout-before-resize` event.
 	 */
 	resumeResize = () => {
 		this._presizeQueue.resume();

tests/integration/resize-before.spec.ts

@@ -13,14 +13,14 @@ import { expect, test } from "../helpers/coverage.ts";
 import { setupLayout, saveLayout, dragMouse } from "../helpers/integration.ts";
 import { LAYOUTS } from "../helpers/fixtures.ts";
 
-test("should fire regular-layout-resize-before on restore", async ({
+test("should fire regular-layout-before-resize on restore", async ({
 	page,
 }) => {
 	await setupLayout(page, LAYOUTS.SINGLE_AAA);
 	const fired = await page.evaluate(async () => {
 		const layout = document.querySelector("regular-layout");
 		let eventFired = false;
-		layout?.addEventListener("regular-layout-resize-before", () => {
+		layout?.addEventListener("regular-layout-before-resize", () => {
 			eventFired = true;
 		});
 		await layout?.restore({
@@ -42,7 +42,7 @@ test("should provide calculatePresizePaths in event detail", async ({
 			value: null,
 		};
 
-		layout?.addEventListener("regular-layout-resize-before", (e) => {
+		layout?.addEventListener("regular-layout-before-resize", (e) => {
 			presizePaths.value = (
 				e as CustomEvent
 			).detail.calculatePresizePaths() as Record<string, unknown>;
@@ -80,7 +80,7 @@ test("should suspend resize when preventDefault is called", async ({
 	await setupLayout(page, LAYOUTS.SINGLE_AAA);
 	const result = await page.evaluate(async () => {
 		const layout = document.querySelector("regular-layout");
-		layout?.addEventListener("regular-layout-resize-before", (e) => {
+		layout?.addEventListener("regular-layout-before-resize", (e) => {
 			e.preventDefault();
 		});
 
@@ -113,7 +113,7 @@ test("should resume suspended resize when resumeResize is called", async ({
 	await setupLayout(page, LAYOUTS.SINGLE_AAA);
 	const result = await page.evaluate(async () => {
 		const layout = document.querySelector("regular-layout");
-		layout?.addEventListener("regular-layout-resize-before", (e) => {
+		layout?.addEventListener("regular-layout-before-resize", (e) => {
 			e.preventDefault();
 		});
 
@@ -144,7 +144,7 @@ test("should proceed immediately when event is not cancelled", async ({
 	const tabs = await page.evaluate(async () => {
 		const layout = document.querySelector("regular-layout");
 		let eventCount = 0;
-		layout?.addEventListener("regular-layout-resize-before", () => {
+		layout?.addEventListener("regular-layout-before-resize", () => {
 			eventCount++;
 		});
 		await layout?.restore({
@@ -167,7 +167,7 @@ test("should fire resize-before on drag resize", async ({ page }) => {
 	await page.evaluate(() => {
 		const layout = document.querySelector("regular-layout");
 		(window as unknown as Record<string, number>).__resizeBeforeCount = 0;
-		layout?.addEventListener("regular-layout-resize-before", () => {
+		layout?.addEventListener("regular-layout-before-resize", () => {
 			(window as unknown as Record<string, number>).__resizeBeforeCount++;
 		});
 	});
@@ -196,7 +196,7 @@ test("should queue concurrent resizes and process sequentially", async ({
 		let callCount = 0;
 		let cancelFirst = true;
 
-		layout?.addEventListener("regular-layout-resize-before", (e) => {
+		layout?.addEventListener("regular-layout-before-resize", (e) => {
 			callCount++;
 			events.push(`before-${callCount}`);
 			if (cancelFirst) {
@@ -243,7 +243,7 @@ test("should provide pre-resize panel paths for nested layout", async ({
 	const paths = await page.evaluate(async () => {
 		const layout = document.querySelector("regular-layout");
 		let presizePaths: Record<string, Record<string, unknown>> | null = null;
-		layout?.addEventListener("regular-layout-resize-before", (e) => {
+		layout?.addEventListener("regular-layout-before-resize", (e) => {
 			presizePaths = (e as CustomEvent).detail.calculatePresizePaths();
 		});
 
@@ -299,7 +299,7 @@ test("should fire resize-before on double-click equalize", async ({ page }) => {
 	await page.evaluate(() => {
 		const layout = document.querySelector("regular-layout");
 		(window as unknown as Record<string, boolean>).__resizeBeforeFired = false;
-		layout?.addEventListener("regular-layout-resize-before", () => {
+		layout?.addEventListener("regular-layout-before-resize", () => {
 			(window as unknown as Record<string, boolean>).__resizeBeforeFired = true;
 		});
 	});
@@ -326,7 +326,7 @@ test("should not fire resize-before on restoreSync", async ({ page }) => {
 	const fired = await page.evaluate(() => {
 		const layout = document.querySelector("regular-layout");
 		let eventFired = false;
-		layout?.addEventListener("regular-layout-resize-before", () => {
+		layout?.addEventListener("regular-layout-before-resize", () => {
 			eventFired = true;
 		});
 		layout?.restoreSync({