@witchcraft/layout 0.1.3 → 0.2.1

package/src/runtime/layout/createSplitDecoFromDrag.ts

@@ -1,7 +1,7 @@
-import { createSplitDecoEdge } from "./createSplitDecoEdge.js"
+import { createSplitDecoShapes } from "./createSplitDecoShapes.js"
 
 import { dirToOrientation } from "../helpers/dirToOrientation.js"
-import { getMarginSize, getSnapPoint } from "../settings.js"
+import { settings } from "../settings.js"
 import type { Direction, LayoutFrame, Point, RawSplitDeco, Size, SplitDeco } from "../types/index.js"
 
 export function createSplitDecoFromDrag(
@@ -9,16 +9,22 @@ export function createSplitDecoFromDrag(
 	frame: LayoutFrame,
 	dragDirection: Direction,
 	dragPoint: Point,
-	snapAmount: Point = getSnapPoint(),
-	minSize: Size = getMarginSize()
+	snapAmount: Point = settings.snapPointScaled,
+	minSize: Size = settings.minSizeScaled,
+	classes: {
+		/** @default "deco-split-edge bg-red-500" */
+		splitEdge?: string
+		/** @default "deco-split-new-frame bg-blue-500/50" */
+		splitNewFrame?: string
+	} = {}
 ): SplitDeco {
 	const orientation = dirToOrientation(dragDirection)
-	const deco: RawSplitDeco = {
+	const deco: RawSplitDeco & Partial<SplitDeco> = {
 		type: "split",
 		id: frame.id,
 		position: dragPoint[orientation === "horizontal" ? "x" : "y"],
 		direction: dragDirection
 	}
-	;(deco as SplitDeco).shapes = createSplitDecoEdge(frames, deco, snapAmount, minSize)
+	deco.shapes = createSplitDecoShapes(frames, deco, snapAmount, minSize, classes)
 	return deco as SplitDeco
 }

package/src/runtime/layout/{createSplitDecoEdge.ts → createSplitDecoShapes.ts}

@@ -1,14 +1,21 @@
 import { findSafeSplitEdgeAndPosition } from "./findSafeSplitEdge.js"
 
-import { getMarginSize, getSnapPoint } from "../settings.js"
-import type { LayoutFrame, Point, RawSplitDeco, Size, SplitDecoShapes } from "../types/index.js"
+import { settings } from "../settings.js"
+import type { LayoutFrame, LayoutShape, Point, RawSplitDeco, Size } from "../types/index.js"
 
-export function createSplitDecoEdge(
+export function createSplitDecoShapes(
 	frames: Record<string, LayoutFrame>,
 	deco: RawSplitDeco,
-	snapAmount: Point = getSnapPoint(),
-	minSize: Size = getMarginSize()
-): SplitDecoShapes {
+	snapAmount: Point = settings.snapPointScaled,
+	minSize: Size = settings.minSizeScaled,
+	classes: {
+		/** @default "deco-split-edge bg-red-500" */
+		splitEdge?: string
+		/** @default "deco-split-new-frame bg-blue-500/50" */
+		splitNewFrame?: string
+	} = {}
+
+): LayoutShape[] {
 	const frame = frames[deco.id]
 	const { edge, position } = findSafeSplitEdgeAndPosition(frame, deco.direction, deco.position, snapAmount, minSize)
 	const newFrame = { x: frame.x, y: frame.y, width: frame.width, height: frame.height }
@@ -30,5 +37,8 @@ export function createSplitDecoEdge(
 			break
 	}
 
-	return { edge, newFrame }
+	return [
+		{ type: "edge", data: edge, attrs: { class: classes.splitEdge ?? "deco-split-edge bg-red-500" } },
+		{ type: "square", data: newFrame, attrs: { class: classes.splitNewFrame ?? "deco-split-new-frame bg-blue-500/50" } }
+	]
 }

package/src/runtime/layout/debugFrame.ts

@@ -2,5 +2,5 @@ import type { LayoutFrame } from "../types/index.js"
 
 export function debugFrame(frame: LayoutFrame): string {
 	const f = frame
-	return `id: ${f.id.slice(0, 4)}, x:  ${f.x}, y: ${f.y}, w: ${f.width}, h: ${f.height}`
+	return `id: ${f.id.slice(0, 4)}, x:  ${f.x}, y: ${f.y}, w: ${f.width}, h: ${f.height}\ndocked: ${f.docked}, collapsed: ${f.collapsed}`
 }

package/src/runtime/layout/findSafeSplitEdge.ts

@@ -2,15 +2,15 @@ import { clampNumber, snapNumber } from "@alanscodelog/utils"
 
 import { dirToOrientation } from "../helpers/dirToOrientation.js"
 import { oppositeSide } from "../helpers/oppositeSide.js"
-import { getMarginSize, getSnapPoint } from "../settings.js"
+import { settings } from "../settings.js"
 import type { Direction, Edge, LayoutFrame, Point, Size } from "../types/index.js"
 
 export function findSafeSplitEdgeAndPosition(
 	frame: LayoutFrame,
 	dragDirection: Direction,
 	dragPointOrPosition: Point | number,
-	snapAmount: Point = getSnapPoint(),
-	minSize: Size = getMarginSize()
+	snapAmount: Point = settings.snapPointScaled,
+	minSize: Size = settings.minSizeScaled
 ): { edge: Edge, position: number } {
 	const orientation = dirToOrientation(dragDirection)
 	const position

package/src/runtime/layout/frameCreate.ts

@@ -1,6 +1,6 @@
 import { v4 as uuidv4 } from "uuid"
 
-import { getMaxInt } from "../settings.js"
+import { settings } from "../settings.js"
 import type {
 	BaseLayoutFrame,
 	ExtendedLayoutFrame,
@@ -11,7 +11,7 @@ import type {
 export function frameCreate(
 	opts: Partial<BaseLayoutFrame> & Omit<ExtendedLayoutFrame, keyof BaseLayoutFrame> = {}
 ): LayoutFrame {
-	const maxInt = getMaxInt()
+	const maxInt = settings.maxInt
 	return {
 		width: maxInt,
 		height: maxInt,

package/src/runtime/layout/getCloseFrameInfo.ts

@@ -10,12 +10,14 @@ import { dirToSide } from "../helpers/dirToSide.js"
 import { findFrameDraggableEdges } from "../helpers/findFrameDraggableEdges.js"
 import { getEdgeOrientation } from "../helpers/getEdgeOrientation.js"
 import { oppositeSide } from "../helpers/oppositeSide.js"
-import { getMarginSize } from "../settings.js"
-import { type Direction, type Edge, type EdgeSide, LAYOUT_ERROR, type LayoutFrame, type Size } from "../types/index.js"
+import { settings } from "../settings.js"
+import { type Direction, type Edge, type EdgeSide, LAYOUT_ERROR, type LayoutChange, type LayoutFrame, type Size } from "../types/index.js"
 import { KnownError } from "../utils/KnownError.js"
 
 /**
- * Returns the information necessary to close a frame or frames (if force: true).
+ * Returns a {@link LayoutChange} with the information necessary to close a frame or frames (if force: true).
+ *
+ * Changes can be applied to a window with {@link applyFrameChanges}.
  *
  * Can close by direction or by frame edge.
  *
@@ -74,6 +76,8 @@ import { KnownError } from "../utils/KnownError.js"
  *│C        │  │
  *└─────────┴──┘
  * ```
+ *
+ * Changes can be applied with {@link applyFrameChanges}.
  */
 
 export function getCloseFrameInfo<T extends "edge" | "dir">(
@@ -88,19 +92,28 @@ export function getCloseFrameInfo<T extends "edge" | "dir">(
 	closeDirOrSide: (T extends "dir" ? Direction : EdgeSide),
 	closeBy: T = "dir" as any as T,
 	force: boolean = false,
-	minSize: Size = getMarginSize()
-): { modifiedFrames: LayoutFrame[], deletedFrames: LayoutFrame[] }
+	minSize: Size = settings.minSizeScaled
+): LayoutChange
 	| KnownError<
 		| typeof LAYOUT_ERROR.CANT_CLOSE_NEARBY_FRAMES_TOO_SMALL
 		| typeof LAYOUT_ERROR.CANT_CLOSE_NO_DRAG_EDGE
 		| typeof LAYOUT_ERROR.CANT_CLOSE_SINGLE_FRAME
 		| typeof LAYOUT_ERROR.CANT_CLOSE_WITHOUT_FORCE
+		| typeof LAYOUT_ERROR.CANT_LEAVE_NO_UNDOCKED_FRAMES
 	> {
 	if (frames.length === 1) {
 		return new KnownError(LAYOUT_ERROR.CANT_CLOSE_SINGLE_FRAME,
 			`Can't close frame ${frame.id}, it is the last frame in the window.`,
 			{ frame })
 	}
+	if (!frame.docked && frames.filter(_ => !_.docked).length === 0) {
+		return new KnownError(
+			LAYOUT_ERROR.CANT_LEAVE_NO_UNDOCKED_FRAMES,
+			`Can't close last undocked frame. One undocked frame must remain`,
+			{ frame: frame.id }
+		)
+	}
+
 	const side = closeBy === "dir"
 		? oppositeSide(dirToSide(closeDirOrSide as Direction))
 		: closeDirOrSide as EdgeSide
@@ -159,8 +172,8 @@ export function getCloseFrameInfo<T extends "edge" | "dir">(
 			)
 		}
 	}
-	const modifiedFrames = []
-	const deletedFrames = []
+	const modifiedFrames: LayoutFrame[] = []
+	const deletedFrames: LayoutFrame[] = []
 	const moveAmount = thisFrameSize
 
 	for (const entry of sameSideEntries) {
@@ -189,5 +202,5 @@ export function getCloseFrameInfo<T extends "edge" | "dir">(
 		clone[sizeKey] += moveAmount
 		modifiedFrames.push(clone)
 	}
-	return { modifiedFrames, deletedFrames }
+	return { modified: modifiedFrames, created: [], deleted: deletedFrames }
 }

package/src/runtime/layout/getDragZones.ts

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

package/src/runtime/layout/getFillEmptySpaceInfo.ts

@@ -0,0 +1,177 @@
+import { doEdgesOverlap } from "../helpers/doEdgesOverlap.js"
+import { frameToEdges } from "../helpers/frameToEdges.js"
+import { getEdgeLength } from "../helpers/getEdgeLength.js"
+import { oppositeSide } from "../helpers/oppositeSide.js"
+import type { EdgeSide, LayoutChange, LayoutFrame, LayoutWindow } from "../types/index.js"
+import { LAYOUT_ERROR } from "../types/index.js"
+import { KnownError } from "../utils/KnownError.js"
+/**
+ * Finds a frame to fill the empty space left behind by a moved/empty frame (e.g. a dragged frame's original position).
+ *
+ * Returns a {@link LayoutChange} with the information necessary information..
+ *
+ * Changes can be applied to a window with {@link applyFrameChanges}.
+ *
+ * Examples where * would be the empty space:
+ *
+ * Selection priority:
+ * 1. Prefer frames listed in preferredFrames (for dragging these are the dragged and target frames).
+ * ┌─────┬─────┐
+ * │A    │*    │
+ * ├─────┼─────┤
+ * │C    │B    │
+ * └─────┴─────┘
+ *
+ * Without preferredFrames set to B, A would be preferred as it shares the shortest edge with the empty space.
+ *
+ * ┌─────┬─────┐
+ * │A    │B    │
+ * ├─────┤     │
+ * │C    │     │
+ * └─────┴─────┘
+ *
+ * In a more complex example:
+ *
+ * ┌─────┬─────┬─────┐
+ * │A    │*    │C    │
+ * │     │     ├─────┤
+ * │     │     │D    │
+ * └─────┴─────┴─────┘
+ *
+ * If preferredFrames is C OR D (usually it's both but it might only be one, just take all other frames along that edge if they end at the empty frames end).
+ *
+ * ┌─────┬──────────┐
+ * │A    │C         │
+ * │     ├──────────┤
+ * │     │D         │
+ * └─────┴──────────┘
+ *
+ * And then in the following we would not be able to even expand C or D so we would not be able to satisfy the preference:
+ *
+ * ┌─────┬─────┬─────┐
+ * │A    │*    │C    │
+ * │     │     ├─────┤
+ * │     │     │     │
+ * │     ├─────┤D    │
+ * │     │B    │     │
+ * └─────┴─────┴─────┘
+ *
+ * 2. Prefer the shortest frame that shares an exact edge. Taking the previous example it would be B:
+ *
+ * ┌─────┬─────┬─────┐
+ * │A    │B    │C    │
+ * │     │     ├─────┤
+ * │     │     │     │
+ * │     │     │D    │
+ * │     │     │     │
+ * └─────┴─────┴─────┘
+ */
+export function getFillEmptySpaceInfo(
+	win: LayoutWindow,
+	emptyFrame: Omit<LayoutFrame, "id">,
+	preferredFrames: string[] = [],
+	skipFrames: string[] = []
+): LayoutChange | KnownError<typeof LAYOUT_ERROR.NO_FILL_CANDIDATES> {
+	const emptyEdges = frameToEdges(emptyFrame as LayoutFrame)
+	const vacHeight = emptyFrame.height
+	const vacWidth = emptyFrame.width
+
+	type Candidate = {
+		frame: LayoutFrame
+		frameSide: EdgeSide
+		emptySide: EdgeSide
+		edgeLength: number
+		exact: boolean
+	}
+
+	type SideGroup = {
+		candidates: Candidate[]
+		skip: boolean
+		totalLength: number
+		hasExact: boolean
+		hasPreferred: boolean
+	}
+
+	const candidatesBySides = new Map<EdgeSide, SideGroup>()
+
+	for (const frame of Object.values(win.frames)) {
+		if (skipFrames.includes(frame.id)) continue
+		const frameEdges = frameToEdges(frame)
+
+		for (const frameSide of ["top", "bottom", "left", "right"] as EdgeSide[]) {
+			const frameEdge = frameEdges[frameSide]
+			const emptyOppositeSide = oppositeSide(frameSide)
+			const emptyEdge = emptyEdges[emptyOppositeSide]
+
+			if (candidatesBySides.get(emptyOppositeSide)?.skip) continue
+
+			const exact = (
+				frameEdge.startX === emptyEdge.startX
+				&& frameEdge.startY === emptyEdge.startY
+				&& frameEdge.endX === emptyEdge.endX
+				&& frameEdge.endY === emptyEdge.endY
+			)
+
+			if (exact || doEdgesOverlap(frameEdge, emptyEdge, undefined, false)) {
+				if (!candidatesBySides.has(emptyOppositeSide)) {
+					candidatesBySides.set(emptyOppositeSide, { candidates: [], skip: false, totalLength: 0, hasExact: false, hasPreferred: false })
+				}
+
+				const group = candidatesBySides.get(emptyOppositeSide)!
+
+				// for shared edges if any of the candidates exceed the empty edge we can't use that side
+				// so we mark it as skip so we can skip all other candidates on that side
+				if (!exact) {
+					const isVertical = frameEdge.startX === emptyEdge.startX
+					const extendsBeyond = isVertical
+						? (frameEdge.startY < emptyEdge.startY || frameEdge.endY > emptyEdge.endY)
+						: (frameEdge.startX < emptyEdge.startX || frameEdge.endX > emptyEdge.endX)
+
+					if (extendsBeyond) {
+						group.skip = true
+					}
+				}
+				const len = getEdgeLength(frameEdge)
+				group.totalLength += len
+				if (exact) group.hasExact = true
+				if (preferredFrames.includes(frame.id)) group.hasPreferred = true
+				group.candidates.push({ frame, frameSide, emptySide: emptyOppositeSide, edgeLength: len, exact })
+			}
+		}
+	}
+
+	const entries = [...candidatesBySides.values()]
+	const preferredSides = entries.filter(c => c.hasPreferred && !c.skip).sort((a, b) => a.totalLength - b.totalLength)
+	const fallbackSides = entries.filter(c => !c.hasPreferred && !c.skip).sort((a, b) => a.totalLength - b.totalLength)
+
+	if (preferredSides.length === 0 && fallbackSides.length === 0) return new KnownError(LAYOUT_ERROR.NO_FILL_CANDIDATES, `No fill candidates found.`, {})
+
+	const chosenCandidates = preferredSides.length > 0 ? preferredSides[0].candidates : fallbackSides[0].candidates
+
+	const result: LayoutFrame[] = []
+	for (const chosen of chosenCandidates) {
+		const { frame, frameSide } = chosen
+		const updated = { ...frame }
+
+		switch (frameSide) {
+			case "top":
+				updated.y -= vacHeight
+				updated.height += vacHeight
+				break
+			case "bottom":
+				updated.height += vacHeight
+				break
+			case "left":
+				updated.x -= vacWidth
+				updated.width += vacWidth
+				break
+			case "right":
+				updated.width += vacWidth
+				break
+		}
+
+		result.push(updated)
+	}
+
+	return { modified: result, created: [], deleted: [] }
+}

package/src/runtime/layout/getFrameCollapseInfo.ts

@@ -0,0 +1,164 @@
+import { pushIfNotIn } from "@alanscodelog/utils/pushIfNotIn"
+import { walk } from "@alanscodelog/utils/walk"
+
+import { applyFrameChanges } from "./applyFrameChanges.js"
+import { getFramesRedistributeInfo } from "./getFramesRedistributeInfo.js"
+
+import { oppositeSide } from "../helpers/oppositeSide.js"
+import { settings } from "../settings.js"
+import type { EdgeSide, LayoutChange, LayoutWindow, Size } from "../types/index.js"
+import { LAYOUT_ERROR } from "../types/index.js"
+import { KnownError } from "../utils/KnownError.js"
+
+/**
+ * Returns a {@link LayoutChange} with the information necessary to collapse a docked frame.
+ *
+ * Changes can be applied to a window with {@link applyFrameChanges}.
+ *
+ * Collapsing shrinks the frame to the configured collapse size and redistributes
+ * the freed space to neighboring frames. The pre-collapse size is stored in
+ * `collapsed` so it can be restored later.
+ */
+export function getFrameCollapseInfo(
+	win: LayoutWindow,
+	frameId: string
+): LayoutChange
+	| KnownError<typeof LAYOUT_ERROR.CANT_COLLAPSE_NOT_DOCKED> {
+	win = walk(win, undefined, { save: true }) as typeof win
+	const frame = win.frames[frameId]
+	if (!frame) throw new Error(`Unknown frame ${frameId}`)
+	if (!frame.docked) throw new Error(`Frame ${frameId} is not docked.`)
+	if (typeof frame.collapsed === "number") throw new Error(`Frame ${frameId} is already collapsed.`)
+
+	const toExtract = [frame.id]
+	if (frame.docked === undefined) {
+		return new KnownError(
+			LAYOUT_ERROR.CANT_COLLAPSE_NOT_DOCKED,
+			`Frame ${frameId} is not docked and cannot be collapsed.`,
+			{ frame }
+		)
+	}
+
+	const isVertical = frame.docked === "left" || frame.docked === "right"
+	const sizeKey = isVertical ? "width" : "height" as const
+	const posKey = isVertical ? "x" : "y"
+	const oppositePosKey = isVertical ? "y" : "x"
+	const oppositeSizeKey = isVertical ? "height" : "width"
+
+	const collapseSize: Size = settings.collapseSizeScaled
+
+	const currentSize = frame[sizeKey]
+	const collapseAmount = collapseSize[sizeKey]
+	const shrinkAmount = currentSize - collapseAmount
+
+	const dockedSide = frame.docked as EdgeSide
+
+
+	/**
+	 * When multiple frames are docked* they may share an edge like this:
+	 * For example, if we collapse A, we need to allow everything else to expand,
+	 * but if we expand D it will overflow the bounds of the window and we'd get an error.
+	 * To avoid this, we shrink these frames towards the opposite side first.
+	 *
+	 * collapsed size/amount
+	 * ├──┘
+	 * │  shrink amount
+	 * │  ├───┘
+	 * ├──────┬───────────┐
+	 * │A*│   │B*         │
+	 * │      ├──────┬────┤
+	 * │  │   │E     │C*  │
+	 * │      │      │    │
+	 * ├──┴───┴──────┤    │
+	 * │D*           │    │
+	 * └──────┬──────┴────┘
+	 *        │we would shrink D to here
+	 *
+	 *  D.x = A.x + A.width, and then subtract the difference from it's width
+	 *
+	 * ***IMPROTANT: It needs to stay aligned with the right side of A and the rest of the frames, or redistribute doesn't know how to redistribute it properly.
+	 *
+	 * When redistribute expands it again by shrinkAmount it will end up at A.x + collapseSize.
+	 *
+	 * This works fine when collapseSize is 0, but otherwise breaks so we keep a list of
+	 * fixes to make after redistributing to place it's left edge back at the right place (it's right edge will have been moved by redistribute).
+	 */
+
+	const framesToFix: ({
+		id: string
+		posKey: "x" | "y"
+		sizeKey: "width" | "height"
+		type: "start" | "end"
+	})[] = []
+	const opposite = oppositeSide(dockedSide)
+	for (const other of Object.values(win.frames)) {
+		if (frame.id === other.id || !other.docked) continue
+
+		if (other.docked === opposite) continue
+		if (dockedSide === "left" || dockedSide === "top") {
+			if (other[posKey] !== 0) continue
+			other[posKey] = frame[posKey] + frame[sizeKey]
+			other[sizeKey] -= frame[sizeKey]
+			framesToFix.push({
+				id: other.id,
+				posKey,
+				sizeKey,
+				type: "start"
+			})
+		} else {
+			if (other[posKey] + other[sizeKey] !== settings.maxInt) continue
+			other[sizeKey] -= frame[sizeKey]
+			framesToFix.push({
+				id: other.id,
+				posKey,
+				sizeKey,
+				type: "end"
+			})
+		}
+	}
+
+	// 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(dockedSide)
+
+	const changes = getFramesRedistributeInfo(win, redistributeSide, otherFrameIds, -shrinkAmount, true)
+
+	if (changes instanceof KnownError) {
+		// we should never get out of bounds and because this is a collapse there should always be space
+		if (changes.code === LAYOUT_ERROR.REDISTRIBUTE_OUT_OF_BOUNDS || LAYOUT_ERROR.NO_SPACE_TO_REDISTRIBUTE) {
+			changes.message = `This error should never happen, please file a bug report: ${changes.message}`
+			throw changes
+		}
+		return changes as any // in case of other errors
+	}
+	applyFrameChanges(win, changes)
+	pushIfNotIn(toExtract, changes.modified.map(_ => _.id))
+
+	for (const fix of framesToFix) {
+		const other = win.frames[fix.id]
+		if (fix.type === "start") {
+			const sizeDiff = other[fix.posKey]
+			other[fix.posKey] = 0
+			other[fix.sizeKey] += sizeDiff
+		} else {
+			const sizeDiff = settings.maxInt - (other[fix.posKey] + other[fix.sizeKey])
+			other[fix.sizeKey] += sizeDiff
+		}
+	}
+	pushIfNotIn(toExtract, framesToFix.map(_ => _.id))
+
+	if (frame.docked === "right" || frame.docked === "bottom") {
+		frame[posKey] = frame[posKey] + (frame[sizeKey] - collapseSize[sizeKey])
+	}
+	frame[sizeKey] = collapseSize[sizeKey]
+	frame.collapsed = currentSize
+	// when we collapse to 0 it's a special case where the frame will always fit the entire window edge
+	// for proper uncollapsing later
+	if (collapseSize[sizeKey] === 0) {
+		frame[oppositePosKey] = 0
+		frame[oppositeSizeKey] = settings.maxInt
+	}
+
+	return { modified: toExtract.map(_ => win.frames[_]), created: [], deleted: [] }
+}