From 8fdcb3b3f7e1889f4cd8b8bf15c819b0b2f03a5f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E2=80=9Cchrisshank=E2=80=9D?= Date: Sat, 7 Dec 2024 13:21:29 -0800 Subject: [PATCH] fix shape edge case --- demo/sticky-html-rope.html | 1 - src/folk-shape.ts | 29 ++++++----------------------- tsconfig.json | 1 + 3 files changed, 7 insertions(+), 24 deletions(-) diff --git a/demo/sticky-html-rope.html b/demo/sticky-html-rope.html index 63ce51b..bb06190 100644 --- a/demo/sticky-html-rope.html +++ b/demo/sticky-html-rope.html @@ -36,7 +36,6 @@ - diff --git a/src/folk-shape.ts b/src/folk-shape.ts index d4db10d..187223d 100644 --- a/src/folk-shape.ts +++ b/src/folk-shape.ts @@ -231,9 +231,10 @@ export class FolkShape extends HTMLElement { set width(width: Dimension) { if (width === 'auto') { resizeObserver.observe(this, this.#onAutoResize); - } else if (this.#attrWidth === 'auto' && this.#attrHeight !== 'auto') { - resizeObserver.unobserve(this, this.#onAutoResize); } else { + if (this.#attrWidth === 'auto' && this.#attrHeight !== 'auto') { + resizeObserver.unobserve(this, this.#onAutoResize); + } this.#previousRect.width = this.#rect.width; this.#rect.width = width; } @@ -248,9 +249,10 @@ export class FolkShape extends HTMLElement { set height(height: Dimension) { if (height === 'auto') { resizeObserver.observe(this, this.#onAutoResize); - } else if (this.#attrHeight === 'auto' && this.#attrWidth !== 'auto') { - resizeObserver.unobserve(this, this.#onAutoResize); } else { + if (this.#attrHeight === 'auto' && this.#attrWidth !== 'auto') { + resizeObserver.unobserve(this, this.#onAutoResize); + } this.#previousRect.height = this.#rect.height; this.#rect.height = height; } @@ -334,9 +336,6 @@ export class FolkShape extends HTMLElement { const focusedElement = this.#shadow.activeElement; const handle = focusedElement?.getAttribute('part') as Handle | null; - // Create synthetic mouse coordinates for keyboard events - let syntheticMouse: Point | null = null; - if (handle?.startsWith('resize')) { const anyChange = event.key === 'ArrowUp' || @@ -348,22 +347,6 @@ export class FolkShape extends HTMLElement { // Get the corner coordinates of the shape for the corresponding handle const rect = this.#rect; - let vector: Point; - switch (event.key) { - case 'ArrowUp': - vector = { x: 0, y: -MOVEMENT_DELTA }; - break; - case 'ArrowDown': - vector = { x: 0, y: MOVEMENT_DELTA }; - break; - case 'ArrowLeft': - vector = { x: -MOVEMENT_DELTA, y: 0 }; - break; - case 'ArrowRight': - vector = { x: MOVEMENT_DELTA, y: 0 }; - break; - } - // Map handle names to corner points const HANDLE_TO_CORNER: Record = { 'resize-top-left': rect.topLeft, diff --git a/tsconfig.json b/tsconfig.json index e2ada0a..eef571a 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -10,6 +10,7 @@ "allowImportingTsExtensions": true, "useDefineForClassFields": true, "skipLibCheck": true, + "noUnusedLocals": true, "lib": ["DOM", "DOM.Iterable", "ESNext", "WebWorker"], "types": ["@webgpu/types", "@types/node", "bun-types"] },