@witchcraft/layout 0.4.3 → 0.5.0

package/src/runtime/layout/getFrameUncollapseInfo.ts

@@ -2,11 +2,8 @@ import { pushIfNotIn } from "@alanscodelog/utils/pushIfNotIn"
 import { walk } from "@alanscodelog/utils/walk"
 
 import { applyFrameChanges } from "./applyFrameChanges.js"
-import { getFramesRedistributeInfo } from "./getFramesRedistributeInfo.js"
+import { getFrameExpandInfo } from "./getFrameExpandInfo.js"
 
-import { framesRedistributeFix } from "../helpers/framesRedistributeFix.js"
-import { getPinnedEdgesForCollapsedFrames } from "../helpers/getPinnedEdgesForCollapsedFrames.js"
-import { oppositeSide } from "../helpers/oppositeSide.js"
 import type { EdgeSide, LayoutChange, LayoutWindow, Size } from "../types/index.js"
 import { LAYOUT_ERROR } from "../types/index.js"
 import { KnownError } from "../utils/KnownError.js"
@@ -32,7 +29,8 @@ export function getFrameUncollapseInfo(
 	| KnownError<typeof LAYOUT_ERROR.CANT_UNCOLLAPSE_NOT_COLLAPSED>
 	| KnownError<typeof LAYOUT_ERROR.REDISTRIBUTE_OUT_OF_BOUNDS>
 	| KnownError<typeof LAYOUT_ERROR.NO_SPACE_TO_REDISTRIBUTE>
-	| KnownError<typeof LAYOUT_ERROR.REDISTRIBUTE_WOULD_RESULT_IN_INVALID_FRAMES> {
+	| KnownError<typeof LAYOUT_ERROR.REDISTRIBUTE_WOULD_RESULT_IN_INVALID_FRAMES>
+	| KnownError<typeof LAYOUT_ERROR.CANT_RESIZE_SINGLE_FRAME> {
 	win = walk(win, undefined, { save: true })
 	const frame = win.frames[frameId]
 	if (!frame) { throw new Error(`Unknown frame ${frameId}`) }
@@ -42,7 +40,6 @@ export function getFrameUncollapseInfo(
 
 	const isVertical = frame.docked === "left" || frame.docked === "right"
 	const sizeKey = isVertical ? "width" : "height" as const
-	const posKey = isVertical ? "x" : "y"
 	const currentSize = frame[sizeKey]
 
 	const storedSize = (restoreSize !== undefined ? restoreSize[sizeKey] : frame.collapsed)!
@@ -60,34 +57,15 @@ export function getFrameUncollapseInfo(
 
 	const dockedSide = frame.docked as EdgeSide
 
-	const { applyFixes, toFix } = framesRedistributeFix(win, frame, dockedSide, posKey, sizeKey, "expand")
-
-	// note fully collapsed frames without an area are already excluded by getFramesRedistributeInfo
-	const otherFrameIds = Object.keys(win.frames).filter(id => id !== frameId)
-
-	const redistributeSide = oppositeSide(frame.docked)
-
-	const pinnedEdgeCoordinates: number[] = getPinnedEdgesForCollapsedFrames(win, frame, dockedSide, posKey, sizeKey)
-
-	const changes = getFramesRedistributeInfo(win, redistributeSide, otherFrameIds, expandAmount, { pinnedEdgeCoordinates })
-
-	if (changes instanceof KnownError) {
-		return changes
+	const expandResult = getFrameExpandInfo(win, frameId, expandAmount, dockedSide)
+	if (expandResult instanceof KnownError) {
+		return expandResult
 	}
+	applyFrameChanges(win, expandResult)
+	pushIfNotIn(toExtract, expandResult.modified.map(_ => _.id))
 
-	applyFrameChanges(win, changes)
-	pushIfNotIn(toExtract, changes.modified.map(_ => _.id))
-
-	applyFixes()
-	pushIfNotIn(toExtract, toFix)
-
-	frame[sizeKey] = storedSize
 	frame.collapsed = undefined
 
-	if (frame.docked === "right" || frame.docked === "bottom") {
-		frame[posKey] -= expandAmount
-	}
-
 	return { modified: toExtract.map(_ => win.frames[_]), created: [], deleted: [] }
 }
 

package/src/runtime/layout/{getFrameDragZones.ts → getFrameZones.ts}

@@ -1,5 +1,5 @@
 import { settings } from "../settings.js"
-import type { DragZone } from "../types/index.js"
+import type { Zone } from "../types/index.js"
 
 /**
  * Returns frame drag zones (in **unrounded** scaled coordinate space).
@@ -10,12 +10,12 @@ import type { DragZone } from "../types/index.js"
  *
  * Unrounded because these are for display purposes only.
  */
-export function getFrameDragZones(
+export function getFrameZones(
 	frame: { x: number, y: number, width: number, height: number },
 	thresholdPx: number,
 	windowPxWidth: number,
 	windowPxHeight: number
-): DragZone[] {
+): Zone[] {
 // we do not round as we might undo this transform and drag along errors
 	// plugs this is is for display purposes only
 	const thX = thresholdPx / windowPxWidth * settings.maxInt
@@ -36,7 +36,7 @@ export function getFrameDragZones(
 		}]
 	}
 
-	const zones: DragZone[] = []
+	const zones: Zone[] = []
 
 	zones.push({
 		type: "frame",

package/src/runtime/layout/getUpdateWindowSizeInfo.ts

@@ -2,8 +2,8 @@ import { pushIfNotIn } from "@alanscodelog/utils/pushIfNotIn"
 import { walk } from "@alanscodelog/utils/walk"
 
 import { applyFrameChanges } from "../layout/applyFrameChanges.js"
-import { getFrameCollapseInfo } from "../layout/getFrameCollapseInfo.js"
-import { getFrameUncollapseInfo } from "../layout/getFrameUncollapseInfo.js"
+import { getFrameExpandInfo } from "../layout/getFrameExpandInfo.js"
+import { getFrameShrinkInfo } from "../layout/getFrameShrinkInfo.js"
 import { getRelaxFramesInfo } from "../layout/getRelaxFramesInfo.js"
 import { settings } from "../settings.js"
 import type { LayoutChange, LayoutWindow, PxSize } from "../types/index.js"
@@ -48,29 +48,27 @@ export function getUpdateWindowSizeInfo(
 	for (const frameId of dockedFrameIds) {
 		const frame = win.frames[frameId]
 		const orientation = (frame.docked === "left" || frame.docked === "right") ? "horizontal" : "vertical"
-		const sizeKey = orientation === "horizontal" ? "width" : "height" as const
+		const sizeKey = orientation === "horizontal" ? "width" : "height"
 		const targetPxSize = settings.collapseSizePx[sizeKey]
 		const targetScaled = Math.round((targetPxSize / (orientation === "horizontal" ? win.pxWidth : win.pxHeight)) * maxInt)
 
-
 		if (frame[sizeKey] === targetScaled) continue
 		if (frame[sizeKey] === 0) continue
 
-		let result: LayoutChange | KnownError<any>
-
-		// the logic needed to do this is nearly identical to the collapse/uncollapse logic
-		// so we abuse the functions a bit, in future might allow a more flexible collapse/uncollapse function
-		const wasCollapsed = frame.collapsed
-		const wasMinSize = { ...settings.minSize }
-		settings.minSize = 1
-		if (targetScaled < frame[sizeKey]) {
-			// clear temporarily so collapse doesn't error
-			frame.collapsed = undefined
-			result = getFrameCollapseInfo(win, frame.id, { collapseSizeScaled: { width: targetScaled, height: targetScaled } })
+		const side = frame.docked!
+		const diff = targetScaled - frame[sizeKey]
+
+		let result: ReturnType<typeof getFrameShrinkInfo> | ReturnType<typeof getFrameExpandInfo>
+
+		if (diff < 0) {
+			result = getFrameShrinkInfo(win, frame.id, -diff, side, { allowOutOfBounds: true })
 		} else {
-			// set to something, could be anything
-			frame.collapsed = Infinity
-			result = getFrameUncollapseInfo(win, frame.id, { restoreSize: { width: targetScaled, height: targetScaled } })
+			// in worst case scenario allow frames to shrink
+			// minSize must be 1 (not 0) to avoid zero-size frames during redistribution
+			const wasMinSize = { ...settings.minSize }
+			settings.minSize = 1
+			result = getFrameExpandInfo(win, frame.id, diff, side)
+			settings.minSize = wasMinSize
 		}
 
 		if (!(result instanceof KnownError)) {
@@ -78,10 +76,6 @@ export function getUpdateWindowSizeInfo(
 			pushIfNotIn(toExtract, result.modified.map(f => f.id))
 		}
 
-		// restore original collapsed value
-		frame.collapsed = wasCollapsed
-		settings.minSize = wasMinSize
-
 
 		// attempt relaxation
 		const result2 = getRelaxFramesInfo(win, relaxPasses)

package/src/runtime/layout/{getWindowDragZones.ts → getWindowZones.ts}

@@ -6,7 +6,7 @@ import type { LayoutWindow, WindowEdgeZone } from "../types/index.js"
  * Returns window edge drag zones (in scaled coordinates)
  *
  */
-export function getWindowDragZones(
+export function getWindowZones(
 	win: LayoutWindow,
 	thresholdPx: number
 ): WindowEdgeZone[] {

package/src/runtime/layout/getZones.ts

@@ -0,0 +1,48 @@
+import { getFrameZones } from "./getFrameZones.js"
+import { getWindowZones } from "./getWindowZones.js"
+import { isPointInRect } from "./isPointInRect.js"
+
+import type { MoveState, WindowEdgeZone, Zone } from "../types/index.js"
+
+/**
+ * Find the drag zone under the drag point.
+ */
+export function getZones(
+	state: Pick<MoveState, "movePoint" | "moveHoveredFrame" | "frames" | "win">,
+	{ frameEdgePx, windowEdgePx }: { frameEdgePx: number, windowEdgePx: number }
+): Zone | undefined {
+	const { movePoint, win } = state
+	const frameId = state.moveHoveredFrame?.id
+	if (!frameId) return
+
+	const frame = state.frames[frameId]
+	if (!frame || !movePoint) return
+
+	const frameZones = getFrameZones(frame, frameEdgePx, win.pxWidth, win.pxHeight)
+
+	const windowZones = getWindowZones(win, windowEdgePx)
+
+	let matchedZone: Zone | undefined
+	for (const zone of windowZones) {
+		if (isPointInRect(zone, movePoint)) {
+			matchedZone = {
+				...zone,
+				type: "window"
+			} as WindowEdgeZone
+			break
+		}
+	}
+
+	if (!matchedZone) {
+		for (const zone of frameZones) {
+			if (isPointInRect(zone, movePoint)) {
+				matchedZone = zone
+				break
+			}
+		}
+	}
+
+	if (!matchedZone) return undefined
+
+	return matchedZone
+}

package/src/runtime/layout/index.ts

@@ -9,20 +9,23 @@ export { findSafeSplitEdgeAndPosition } from "./findSafeSplitEdge.js"
 export { findVisualEdge } from "./findVisualEdge.js"
 export { frameCreate } from "./frameCreate.js"
 export { getCloseFrameInfo } from "./getCloseFrameInfo.js"
-export { getDragZones } from "./getDragZones.js"
+export { getZones } from "./getZones.js"
 export { getFillEmptySpaceInfo } from "./getFillEmptySpaceInfo.js"
 export { getFrameCollapseInfo } from "./getFrameCollapseInfo.js"
 export { getFrameDockInfo } from "./getFrameDockInfo.js"
-export { getFrameDragZones } from "./getFrameDragZones.js"
+export { getFrameZones } from "./getFrameZones.js"
+export { getFrameExpandInfo } from "./getFrameExpandInfo.js"
 export { getFrameRearrangeInfo } from "./getFrameRearrangeInfo.js"
+export { getFrameShrinkInfo } from "./getFrameShrinkInfo.js"
 export { getFrameSplitInfo } from "./getFrameSplitInfo.js"
 export { getFramesRedistributeInfo } from "./getFramesRedistributeInfo.js"
 export { getFrameSwapInfo } from "./getFrameSwapInfo.js"
 export { getFrameTo } from "./getFrameTo.js"
 export { getFrameUncollapseInfo } from "./getFrameUncollapseInfo.js"
 export { getFrameUndockInfo } from "./getFrameUndockInfo.js"
+export { getRelaxFramesInfo } from "./getRelaxFramesInfo.js"
 export { getUpdateWindowSizeInfo } from "./getUpdateWindowSizeInfo.js"
-export { getWindowDragZones } from "./getWindowDragZones.js"
+export { getWindowZones } from "./getWindowZones.js"
 export { isPointInRect } from "./isPointInRect.js"
 export { layoutAddWindow } from "./layoutAddWindow.js"
 export { layoutCreate } from "./layoutCreate.js"

package/src/runtime/{drag/DragActionHandler.ts → move/ActionHandler.ts}

@@ -2,36 +2,36 @@ import { get, type RecordFromArray } from "@alanscodelog/utils"
 
 import { isWindowEdge } from "../helpers/isWindowEdge.js"
 import { findFramesTouchingEdge } from "../layout/findFramesTouchingEdge.js"
-import type { DragChangeHandler, DragChangeResult, DragState, Edge, IDragAction, LayoutFrame, LayoutShape } from "../types/index.js"
+import type { ActionHandlerApplyResult, Edge, IAction, LayoutFrame, LayoutShape, MoveChangeHandler, MoveChangeResult, MoveState } from "../types/index.js"
 import { LAYOUT_ERROR } from "../types/index.js"
 import { KnownError } from "../utils/KnownError.js"
 
 /**
- * Handles the lifecycle of a drag actions {@link IDragAction} and provides additional hooks.
+ * Handles the lifecycle of a drag actions {@link IAction} and provides additional hooks.
  *
  * The first action instance that can handle the request is passed control of the event handlers until the request changes.
  */
-export class DragActionHandler<
-	TRawDragActions extends IDragAction[],
-	TDragActions extends RecordFromArray<TRawDragActions, "name"> = RecordFromArray<TRawDragActions, "name">
+export class ActionHandler<
+	TRawActions extends IAction[],
+	TActions extends RecordFromArray<TRawActions, "name"> = RecordFromArray<TRawActions, "name">
 > {
-	activeAction?: keyof TDragActions
+	activeAction?: keyof TActions
 
-	actions: TDragActions
+	actions: TActions
 
-	eventCanceller: ((e: PointerEvent | KeyboardEvent | undefined, state: DragState) => void) | undefined = undefined
+	eventCanceller: ((e: PointerEvent | KeyboardEvent | undefined, state: MoveState) => void) | undefined = undefined
 
-	boundCancel: (e: PointerEvent | KeyboardEvent | undefined, state: DragState) => void
+	boundCancel: (e: PointerEvent | KeyboardEvent | undefined, state: MoveState) => void
 
-	defaultOnDragChange: DragChangeHandler = (type, _e, state, _forceRecalculateEdges, _cancel) => {
+	defaultOnMoveChange: MoveChangeHandler = (type, _e, state, _forceRecalculateEdges, _cancel) => {
 		const isTouchingCollapsedFrameEdge = type === "move"
-			&& state.isDragging === "edge"
+			&& state.isMoving === "edge"
 			&& state.touchingFramesArrays.some(frames =>
 				// we check with a falsy check on PURPOSE, frames collapsed to 0 aren't an issue, they are ignored anyways
 				Object.values(frames).some(f => f.collapsed)
 			)
 		return {
-			updateEdges: type === "move" ? !(state.isDraggingFromWindowEdge || isTouchingCollapsedFrameEdge) : true,
+			updateEdges: type === "move" ? !(state.isMovingFromWindowEdge || isTouchingCollapsedFrameEdge) : true,
 			shapes: []
 		}
 	}
@@ -46,7 +46,7 @@ export class DragActionHandler<
 		 */
 		onEvent?: (e: PointerEvent | KeyboardEvent | undefined, cancel: () => void) => void
 		/** Called when the action requested changes. */
-		onRequestChange?: (type: keyof TDragActions | undefined) => void
+		onRequestChange?: (type: keyof TActions | undefined) => void
 		/** Called when the drag action ends either because it was completed or cancelled. */
 		onEnd?: (context: { cancelled: boolean, applied: boolean }) => void
 	}
@@ -54,22 +54,22 @@ export class DragActionHandler<
 	/** All action shapes merged into a single array. If using vue you can set this to a reactive array for reactivity. */
 	shapes: LayoutShape[] = []
 
-	/** All hint/error text from all actions, updated on every onDragChange. If using vue you can set this to a reactive object for reactivity. */
+	/** All hint/error text from all actions, updated on every onMoveChange. If using vue you can set this to a reactive object for reactivity. */
 	textHints: { actions: string[], errors: string[] } = { actions: [], errors: [] }
 
 	constructor(
-		actions: TRawDragActions,
-		hooks: DragActionHandler<TRawDragActions, TDragActions>["hooks"] = {},
+		actions: TRawActions,
+		hooks: ActionHandler<TRawActions, TActions>["hooks"] = {},
 		/**
-		 * Default onDragChange handler for when no action can handle the request.
+		 * Default onMoveChange handler for when no action can handle the request.
 		 *
 		 * Should return true to allow the edges to be moved, or false to prevent it.
 		 *
 		 * The default prevents movement when the edge is a window edge and when the edge is touching a collapsed frame.
 		 */
-		defaultOnDragChange?: DragChangeHandler
+		defaultOnMoveChange?: MoveChangeHandler
 	) {
-		if (defaultOnDragChange) this.defaultOnDragChange = defaultOnDragChange
+		if (defaultOnMoveChange) this.defaultOnMoveChange = defaultOnMoveChange
 		this.hooks = hooks
 		this.actions = {} as any
 		for (const action of actions) {
@@ -80,10 +80,10 @@ export class DragActionHandler<
 
 	eventHandler(
 		e: KeyboardEvent | PointerEvent,
-		state: DragState,
+		state: MoveState,
 		forceRecalculateEdges: () => void
 	) {
-		if (state.isDragging) {
+		if (state.isMoving) {
 			e.preventDefault()
 		}
 		let cancelled = false
@@ -95,7 +95,7 @@ export class DragActionHandler<
 
 		let found = false
 		const oldActiveAction = this.activeAction
-		for (const action of Object.values<TRawDragActions[number]>(this.actions)) {
+		for (const action of Object.values<TRawActions[number]>(this.actions)) {
 			if (action.canHandleRequest(e, state, forceRecalculateEdges)) {
 				// if (this.activeAction !== action.name) {
 				// }
@@ -116,38 +116,40 @@ export class DragActionHandler<
 			this.hooks.onRequestChange?.(this.activeAction)
 		}
 
-		if (state.isDragging) {
+		if (state.isMoving) {
 			forceRecalculateEdges()
 			this.hooks.onRecalculate?.()
 		}
 		return undefined
 	}
 
-	onDragChange<T extends "start" | "move" | "end">(
+	onMoveChange<T extends "start" | "move" | "end">(
 		type: T,
 		e: T extends "end" ? PointerEvent | undefined : PointerEvent,
-		state: DragState,
+		state: MoveState,
 		forceRecalculateEdges: () => void,
-		cancel: (e: PointerEvent | KeyboardEvent | undefined, state: DragState) => void
-	): DragChangeResult {
+		cancel: T extends "end" ? undefined : (e: PointerEvent | KeyboardEvent | undefined, state: MoveState) => void,
+		resolve: T extends "end" ? undefined : (opts: ActionHandlerApplyResult) => void
+	): MoveChangeResult {
 		if (type === "start") {
 			this.eventCanceller = cancel
 			this.eventHandler(e!, state, forceRecalculateEdges)
 		}
-		if (type === "end") {
-			this.activeAction = undefined
-		}
 
 		if (this.activeAction) {
-			const res = this.actions[this.activeAction]!.onDragChange(type, e, state, forceRecalculateEdges, this.boundCancel)
+			const res = this.actions[this.activeAction]!.onMoveChange(type, e, state, forceRecalculateEdges, this.boundCancel as any, resolve as any)
 			// in case it's a vue reactive array
 			this.shapes.splice(0, this.shapes.length, ...res.shapes)
 			this.setTextHints(type)
 			return res
 		}
 		this.setTextHints(type)
-		const res = this.defaultOnDragChange(type, e, state, forceRecalculateEdges, this.boundCancel)
+		const res = this.defaultOnMoveChange(type, e, state, forceRecalculateEdges, this.boundCancel as any, resolve as any)
 		this.shapes.splice(0, this.shapes.length, ...res.shapes)
+
+		if (type === "end") {
+			this.activeAction = undefined
+		}
 		return res
 	}
 
@@ -155,7 +157,7 @@ export class DragActionHandler<
 		// again in case it's a vue reactive object
 		this.textHints.actions = []
 		this.textHints.errors = []
-		for (const action of Object.values<IDragAction>(this.actions)) {
+		for (const action of Object.values<IAction>(this.actions)) {
 			const res = action.getTextHints?.(type)
 			this.textHints.actions.push(...(res?.actions ?? []))
 			this.textHints.errors.push(...(res?.errors ?? []))
@@ -166,7 +168,7 @@ export class DragActionHandler<
 		for (const edge of edges) {
 			// edge already has an error
 			if (edge.error) continue
-			for (const action of Object.values<IDragAction>(this.actions)) {
+			for (const action of Object.values<IAction>(this.actions)) {
 				action.annotateEdge?.(edge, frames)
 				if (edge.error) break
 			}
@@ -188,20 +190,20 @@ export class DragActionHandler<
 		}
 	}
 
-	onDragApply(
-		state: DragState,
+	onMoveApply(
+		state: MoveState,
 		forceRecalculateEdges: () => void
-	): boolean {
+	): ActionHandlerApplyResult {
 		if (this.activeAction) {
-			const res = this.actions[this.activeAction]!.onDragApply(state, forceRecalculateEdges)
+			const res = this.actions[this.activeAction]!.onMoveApply(state, forceRecalculateEdges)
 			this.hooks.onEnd?.({ cancelled: false, applied: res })
-			return false
+			return { apply: res, result: undefined }
 		}
 		this.hooks.onEnd?.({ cancelled: false, applied: false })
-		return true
+		return { apply: true, result: undefined }
 	}
 
-	cancel(e: PointerEvent | KeyboardEvent | undefined, state: DragState): void {
+	cancel(e: PointerEvent | KeyboardEvent | undefined, state: MoveState): void {
 		if (this.activeAction) {
 			this.actions[this.activeAction].cancel(e, state)
 		}
@@ -213,7 +215,7 @@ export class DragActionHandler<
 	static debugState(
 		pluginName: string,
 		type: "before" | "after" | string,
-		state: DragState,
+		state: MoveState,
 		pluginState: Record<string, any> = {},
 		/** Object key to filter the state by, e.g. state.win.frames. If false is ignored. The idea is you pass this.debug and users can set this.debug to a string to filter. */
 		key?: string | boolean

package/src/runtime/{drag → move}/CloseAction.ts

@@ -1,4 +1,4 @@
-import { DragActionHandler } from "./DragActionHandler.js"
+import { ActionHandler } from "./ActionHandler.js"
 
 import { dirToOrientation } from "../helpers/dirToOrientation.js"
 import { getEdgeOrientation } from "../helpers/getEdgeOrientation.js"
@@ -6,12 +6,12 @@ import { oppositeSide } from "../helpers/oppositeSide.js"
 import { applyFrameChanges } from "../layout/applyFrameChanges.js"
 import { findFramesTouchingEdge } from "../layout/findFramesTouchingEdge.js"
 import { getCloseFrameInfo } from "../layout/getCloseFrameInfo.js"
-import type { ActionDragChangeResult, CloseDeco, DragState, IDragAction } from "../types/index.js"
+import type { ActionChangeResult, CloseDeco, IAction, MoveState } from "../types/index.js"
 import type { KnownError } from "../utils/KnownError.js"
 
 export type CloseInfo = Exclude<ReturnType<typeof getCloseFrameInfo>, KnownError>
 
-export class CloseAction implements IDragAction {
+export class CloseAction implements IAction {
 	name = "close" as const
 	minDragDistance = 5
 
@@ -20,13 +20,13 @@ export class CloseAction implements IDragAction {
 		force: boolean
 		res: CloseInfo
 		cacheKey: string | undefined
-		lastReturn: ActionDragChangeResult
+		lastReturn: ActionChangeResult
 	} | {
 		allowed: false
 		force: boolean
 		res: CloseInfo | undefined
 		cacheKey: string | undefined
-		lastReturn: ActionDragChangeResult | undefined
+		lastReturn: ActionChangeResult | undefined
 	} = {} as any // this is initialized by this.reset()
 
 	debug: boolean | string = false
@@ -40,7 +40,7 @@ export class CloseAction implements IDragAction {
 		transformError: e => e.message
 	}
 
-	handleEvent: (e: PointerEvent | KeyboardEvent, state: DragState) => boolean | "force" = (e: PointerEvent | KeyboardEvent) => {
+	handleEvent: (e: PointerEvent | KeyboardEvent, state: MoveState) => boolean | "force" = (e: PointerEvent | KeyboardEvent) => {
 		if (e.ctrlKey && e.shiftKey) {
 			return "force"
 		}
@@ -86,10 +86,10 @@ export class CloseAction implements IDragAction {
 		this.modifyDecos([])
 	}
 
-	private _getDecos(state: DragState): CloseDeco[] {
+	private _getDecos(state: MoveState): CloseDeco[] {
 		let decos: CloseDeco[] = []
-		const { isDragging } = state
-		if (isDragging && this.state.allowed && this.state.res) {
+		const { isMoving } = state
+		if (isMoving && this.state.allowed && this.state.res) {
 			const { force } = this.state
 			decos = this.state.res.deleted.map(_ => ({
 				id: _.id,
@@ -136,12 +136,12 @@ export class CloseAction implements IDragAction {
 	}
 
 
-	canHandleRequest(e: PointerEvent | KeyboardEvent, state: DragState): boolean {
-		const { draggingEdges } = state
-		if (draggingEdges.length !== 1) return false
+	canHandleRequest(e: PointerEvent | KeyboardEvent, state: MoveState): boolean {
+		const { movingEdges } = state
+		if (movingEdges.length !== 1) return false
 		const res = this.handleEvent(e, state)
 		this.state.force = res === "force"
-		this.setTextHints(state.isDragging === "edge" ? true : undefined)
+		this.setTextHints(state.isMoving === "edge" ? true : undefined)
 		if (res) {
 			this.hooks.onStart?.(true)
 			return true
@@ -150,47 +150,51 @@ export class CloseAction implements IDragAction {
 		return false
 	}
 
-	onDragChange(
-		_type: "start" | "end" | "move",
+	onMoveChange(
+		type: "start" | "end" | "move",
 		_e: PointerEvent | undefined,
-		state: DragState
-	): ActionDragChangeResult {
-		if (state.dragDistance <= this.minDragDistance) {
+		state: MoveState
+	): ActionChangeResult {
+		if (type === "end") {
+			this.reset()
+			return { shapes: [] }
+		}
+		if (state.moveDistance <= this.minDragDistance) {
 			return { updateEdges: false, shapes: [] }
 		}
 		const {
 			touchingFramesArrays,
-			dragDirections,
-			isDragging,
-			draggingEdges,
+			moveDirections,
+			isMoving,
+			movingEdges,
 			visualEdges,
 			frames,
-			isDraggingFromWindowEdge,
-			dragPoint
+			isMovingFromWindowEdge,
+			movePoint
 		} = state
-		const oppositeOrientation = oppositeSide(getEdgeOrientation(draggingEdges[0]))
-		const cacheKey = `${dragPoint?.x}-${dragPoint?.y}-${dragDirections[oppositeOrientation]!}-${this.state.force}`
+		const oppositeOrientation = oppositeSide(getEdgeOrientation(movingEdges[0]))
+		const cacheKey = `${movePoint?.x}-${movePoint?.y}-${moveDirections[oppositeOrientation]!}-${this.state.force}`
 		if (this.state.allowed) {
 			if (this.state.cacheKey === cacheKey) {
 				return this.state.lastReturn
 			}
 		}
-		if (isDragging && draggingEdges.length === 1) {
+		if (isMoving && movingEdges.length === 1) {
 			const res = findFramesTouchingEdge(
-				draggingEdges[0],
+				movingEdges[0],
 				touchingFramesArrays[0],
 				{
-					// referencePoint: dragPoint.value, // if force pick smallest frame?
-					searchDirections: [dragDirections[oppositeOrientation]!]
+					// referencePoint: movePoint.value, // if force pick smallest frame?
+					searchDirections: [moveDirections[oppositeOrientation]!]
 				}
 			)
 			if (res.length > 0) {
-				const orientation = dirToOrientation(dragDirections[oppositeOrientation]!)
+				const orientation = dirToOrientation(moveDirections[oppositeOrientation]!)
 				const sizeKey = orientation === "horizontal" ? "width" : "height"
 				const smallestFrameSize = Math.min(...res.map(_ => _.frame[sizeKey]))
 				const frame = res.find(_ => _.frame[sizeKey] === smallestFrameSize)!.frame!
 
-				const closeInfo = getCloseFrameInfo(Object.values(frames), visualEdges, frame, dragDirections[oppositeOrientation]!, "dir", this.state.force)
+				const closeInfo = getCloseFrameInfo(Object.values(frames), visualEdges, frame, moveDirections[oppositeOrientation]!, "dir", this.state.force)
 				this.state.cacheKey = cacheKey
 				this.setTextHints(closeInfo)
 				if (!(closeInfo instanceof Error)) {
@@ -205,17 +209,16 @@ export class CloseAction implements IDragAction {
 			}
 		}
 		const decos = this._getDecos(state)
-		this.state.lastReturn = { updateEdges: !isDraggingFromWindowEdge, shapes: decos.flatMap(_ => _.shapes) }
+		this.state.lastReturn = { updateEdges: !isMovingFromWindowEdge, shapes: decos.flatMap(_ => _.shapes) }
 		return this.state.lastReturn
 	}
 
-	onDragApply(state: DragState): boolean {
+	onMoveApply(state: MoveState): boolean {
 		if (this.state.res) {
 			const win = state.win
-			if (this.debug) { DragActionHandler.debugState(this.name, "before", state, this.state, this.debug) }
+			if (this.debug) { ActionHandler.debugState(this.name, "before", state, this.state, this.debug) }
 			applyFrameChanges(win, this.state.res)
-			if (this.debug) { DragActionHandler.debugState(this.name, "after", state, this.state, this.debug) }
-			this.reset()
+			if (this.debug) { ActionHandler.debugState(this.name, "after", state, this.state, this.debug) }
 			return true
 		}
 		return false