@aiquants/resize-panels 1.8.1 → 2.0.0

package/src/reducer.ts

@@ -1,1234 +1,472 @@
 /**
- * @file Reducer for managing panel state in PanelGroup
- * PanelGroup のパネル状態を管理するための Reducer
+ * @file Panel group reducer: the only writer of panel sizes.
+ * パネルグループのリデューサー: パネルサイズを書き込む唯一の主体。
+ *
+ * Every action edits configuration or preferences and then runs the same allocator, so the first paint, a
+ * container resize, a drag, a collapse and a restored layout all produce sizes from one function of
+ * (preferences, constraints, container length).
+ * すべてのアクションは構成か希望値を編集したうえで同一の配分器を実行する。したがって初回描画・コンテナリサイズ・
+ * ドラッグ・折りたたみ・レイアウト復元のいずれも、(希望値, 制約, コンテナ長) の同一関数からサイズを得る。
  */
-import { roundHalfToEven } from "./roundHalfToEven"
-import type { PanelCollapseDirection, PanelLayoutData } from "./types"
-import { adjustPixelPanelsByPriority, clamp, getConstraintInPixels, PERCENTAGE_DIGITS, percentageToPixels, toRoundedPercentage } from "./utils"
+
+import { allocatePanelSizes, isPixelPanel, resolvePanelBounds } from "./allocateLayout"
+import { type LayoutConstraintViolation, PANEL_ALLOCATION_EPSILON, type PanelAction, type PanelCollapseDirection, type PanelGroupLayoutState, type PanelLayoutData, type PanelRegistration } from "./types"
+import { calculateSnapThreshold, clamp } from "./utils"
 import { Logger, LogLevel } from "./utils/simple-logger"
 
 const logger = new Logger(LogLevel.INFO, "[resize-panels]")
 
-// px 値同士の比較で浮動小数点の桁落ち (数 ulp 程度) を許容する誤差。
-// 厳密比較だと T - (T - min) が min を 1ulp 下回っただけで境界へのリサイズが棄却され、
-// 小数コンテナ幅では最小サイズに到達できなくなる。
-const SIZE_EPSILON = 1e-9
-
-const snapshotPanelState = (panels: PanelLayoutData[]) =>
-    panels.map((panel) => ({
-        id: panel.id,
-        size: panel.size,
-        percentageSize: panel.percentageSize,
-        preferredPercentageSize: panel.preferredPercentageSize,
-        sizeBeforeCollapse: panel.sizeBeforeCollapse,
-        percentageSizeBeforeCollapse: panel.percentageSizeBeforeCollapse,
-        preferredPercentageSizeBeforeCollapse: panel.preferredPercentageSizeBeforeCollapse,
-        measuredPercentageSize: panel.measuredPercentageSize,
-        excludeFromAutoGrowth: panel.excludeFromAutoGrowth ?? false,
-        collapsed: panel.collapsed ?? false,
-        collapseFromStart: panel.collapseFromStart,
-        collapseFromEnd: panel.collapseFromEnd,
-        collapsedByDirection: panel.collapsedByDirection ?? null,
-    }))
-
-const snapshotSinglePanel = (panel: PanelLayoutData | undefined | null) => {
-    if (!panel) {
-        return null
-    }
-    return snapshotPanelState([panel])[0]
+/**
+ * Empty layout state used before the group has measured itself or registered any panel.
+ * グループが自身を計測する前・パネル登録前の空レイアウト状態。
+ */
+export const initialPanelGroupLayoutState: PanelGroupLayoutState = {
+    containerSize: 0,
+    panels: [],
+    violation: null,
 }
 
-const panelCanCollapse = (panel: PanelLayoutData | undefined | null): boolean => {
-    if (!panel) {
-        return false
+/**
+ * Report whether two violations describe the same situation.
+ * 2 つの違反が同じ状況を表すかどうかの判定。
+ */
+const isSameViolation = (left: LayoutConstraintViolation | null, right: LayoutConstraintViolation | null): boolean => {
+    if (left === null || right === null) {
+        return left === right
     }
-    return Boolean(panel.collapseFromStart || panel.collapseFromEnd)
+    return (
+        left.reason === right.reason &&
+        Math.abs(left.totalMinimumSize - right.totalMinimumSize) <= PANEL_ALLOCATION_EPSILON &&
+        Math.abs(left.totalMaximumSize - right.totalMaximumSize) <= PANEL_ALLOCATION_EPSILON &&
+        Math.abs(left.availableContainerSize - right.availableContainerSize) <= PANEL_ALLOCATION_EPSILON
+    )
 }
 
-// biome-ignore lint/complexity/noExcessiveCognitiveComplexity: Layout calculation logic
-const recalculateFlexiblePanels = (panels: PanelLayoutData[], containerSize: number): PanelLayoutData[] => {
-    if (!Number.isFinite(containerSize) || containerSize <= 0) {
-        return panels
-    }
-
-    type Descriptor = {
-        index: number
-        isPixelPanel: boolean
-        minSize: number
-        maxSize: number
-        preferredSize: number
-        priority: number
-        flexPriority?: number
-        excludeFromGrowth: boolean
-    }
-
-    const nextPanels = panels.map((panel) => ({ ...panel }))
-    const descriptors: Descriptor[] = []
+/**
+ * Run the allocator over the given panels and fold the result into a layout state.
+ * 与えられたパネルへ配分器を実行し、結果をレイアウト状態へ畳み込む処理。
+ *
+ * Panel objects and the panel array keep their identity when the allocation did not move them, so a transition
+ * that changes nothing produces no new state and no render at all. (When something does change, every panel of
+ * the group re-renders: they all read the same context value.)
+ * 配分でサイズが動かなかったパネルとパネル配列は同一性を保つため、何も変えない遷移は新しい状態を作らず再描画も
+ * 起こらない (何かが変われば、同じコンテキスト値を読むグループ内の全パネルが再描画される)。
+ *
+ * @param panels - Panels in DOM order with up-to-date preferences / 希望値が最新の DOM 順パネル一覧
+ * @param containerSize - Container content-box length in pixels / コンテナ内容領域長 (px)
+ * @returns Layout state whose sizes satisfy the allocator / 配分結果を反映したレイアウト状態
+ */
+const allocate = (panels: PanelLayoutData[], containerSize: number): PanelGroupLayoutState => {
+    const { sizes, violation } = allocatePanelSizes(panels, containerSize)
 
-    for (let index = 0; index < nextPanels.length; index += 1) {
-        const panel = nextPanels[index]
-        if (panel.collapsed) {
-            nextPanels[index] = {
-                ...panel,
-                size: 0,
-                percentageSize: 0,
-            }
-            continue
+    let changed = false
+    const nextPanels = panels.map((panel, index) => {
+        const size = panel.collapsed ? 0 : sizes[index]
+        if (Math.abs(panel.size - size) <= PANEL_ALLOCATION_EPSILON) {
+            return panel
         }
+        changed = true
+        return { ...panel, size }
+    })
 
-        const minFromConstraint = Math.max(0, getConstraintInPixels(panel.minSize, 0, containerSize))
-        const autoMinSize = Math.max(0, getConstraintInPixels(panel.autoMinSize, 0, containerSize))
-        const minSize = Math.max(minFromConstraint, autoMinSize)
-        const zeroThreshold = Math.max(1e-3, minSize)
-        const rawMaxSize = getConstraintInPixels(panel.maxSize, containerSize, containerSize)
-        const maxSize = Math.max(minSize, rawMaxSize)
-        const isPixelPanel = panel.sizeUnit === "pixels" || panel.originalPixelSize !== undefined
-        const currentSize = Math.max(0, panel.size)
-        let preferredSize = minSize
+    const next = { containerSize, panels: changed ? nextPanels : panels, violation }
+    reportInvariantBreach(next)
+    return next
+}
 
-        if (isPixelPanel) {
-            const preferredPixel = panel.preferredPixelSize ?? panel.size ?? panel.originalPixelSize ?? minSize
-            preferredSize = clamp(preferredPixel, minSize, maxSize)
-        } else {
-            const fallbackPercentage = panel.preferredPercentageSize ?? panel.percentageSize ?? toRoundedPercentage(panel.size, containerSize)
-            const preferredPixels = percentageToPixels(fallbackPercentage, containerSize)
-            preferredSize = clamp(preferredPixels, minSize, maxSize)
+/**
+ * Find the layout invariant breach in a state, if there is one.
+ * レイアウト状態に不変条件の違反があれば、その内容を返す処理。
+ *
+ * The condition is the one the whole package rests on: with a measured container and no reported constraint
+ * conflict, the active panels fill it exactly. The misaligned handle this package once shipped was a silent
+ * violation of exactly this — the sizes stopped filling the container and nothing noticed.
+ * ここで見る条件はパッケージ全体の土台である: コンテナが計測済みで制約矛盾も報告されていないなら、
+ * アクティブなパネルはコンテナをちょうど満たす。かつて出荷された「ハンドルがずれる」欠陥は、まさにこの条件が
+ * 無言で破れた状態だった。
+ *
+ * @param state - Layout state to check / 検査するレイアウト状態
+ * @returns Allocated total and container length when they disagree, otherwise null / 食い違う場合の合計と
+ *   コンテナ長、問題なければ null
+ */
+export const findLayoutInvariantBreach = (state: PanelGroupLayoutState): { allocatedTotal: number; containerSize: number } | null => {
+    if (state.containerSize <= 0 || state.violation !== null) {
+        return null
+    }
+    let total = 0
+    let activeCount = 0
+    for (const panel of state.panels) {
+        if (!panel.collapsed) {
+            total += panel.size
+            activeCount += 1
         }
-
-        const excludeFromGrowth = !isPixelPanel && (panel.excludeFromAutoGrowth ?? false) && currentSize <= zeroThreshold
-        descriptors.push({
-            index,
-            isPixelPanel,
-            minSize,
-            maxSize,
-            preferredSize,
-            priority: panel.pixelAdjustPriority ?? index + 1,
-            flexPriority: !isPixelPanel ? panel.flexAdjustPriority : undefined,
-            excludeFromGrowth,
-        })
     }
-
-    if (descriptors.length === 0) {
-        return nextPanels
+    // 全パネルが折りたたまれたグループは「満たすべきパネルが無い」正当な状態
+    if (activeCount === 0) {
+        return null
     }
-
-    const assignments = new Map<number, number>()
-    let baseTotal = 0
-    for (const descriptor of descriptors) {
-        assignments.set(descriptor.index, descriptor.minSize)
-        baseTotal += descriptor.minSize
+    const tolerance = PANEL_ALLOCATION_EPSILON * Math.max(1, state.containerSize)
+    if (!Number.isFinite(total) || Math.abs(total - state.containerSize) > tolerance) {
+        return { allocatedTotal: total, containerSize: state.containerSize }
     }
+    return null
+}
 
-    let remaining = containerSize - baseTotal
-
-    const allocate = (descriptor: Descriptor, amount: number): number => {
-        if (amount <= 0) {
-            return 0
-        }
-        const currentSize = assignments.get(descriptor.index) ?? descriptor.minSize
-        const capacity = Math.max(0, descriptor.maxSize - currentSize)
-        if (capacity <= 0) {
-            return 0
-        }
-        const applied = Math.min(amount, capacity)
-        assignments.set(descriptor.index, currentSize + applied)
-        return applied
+/**
+ * Report a layout invariant breach, which can only come from a defect in this package.
+ * レイアウト不変条件の違反を報告する処理 (違反はこのパッケージの欠陥でしか起こり得ない)。
+ *
+ * The check is O(panels) with no allocation, so it runs on every transition rather than behind a flag.
+ * 検査はパネル数に比例するだけで確保も伴わないため、フラグに隠さずすべての遷移で実行する。
+ *
+ * @param state - Layout state produced by the allocator / 配分器が生成したレイアウト状態
+ */
+const reportInvariantBreach = (state: PanelGroupLayoutState): void => {
+    const breach = findLayoutInvariantBreach(state)
+    if (breach) {
+        logger.error("Allocated sizes do not fill the container.", {
+            ...breach,
+            panels: state.panels.map((panel) => ({ id: panel.id, size: panel.size, collapsed: panel.collapsed })),
+        })
     }
+}
 
-    if (remaining > 0) {
-        const distributeFlexibleByRatio = (targetDescriptors: Descriptor[]) => {
-            const epsilon = 1e-6
-            while (remaining > epsilon) {
-                let totalWeight = 0
-                const weights: Array<{ descriptor: Descriptor; capacity: number }> = []
-                for (const descriptor of targetDescriptors) {
-                    if (!descriptor.isPixelPanel && descriptor.excludeFromGrowth) {
-                        continue
-                    }
-                    const currentSize = assignments.get(descriptor.index) ?? descriptor.minSize
-                    const targetSize = Math.min(descriptor.preferredSize, descriptor.maxSize)
-                    const capacity = Math.max(0, targetSize - currentSize)
-                    if (capacity > epsilon) {
-                        totalWeight += capacity
-                        weights.push({ descriptor, capacity })
-                    }
-                }
-                if (weights.length === 0 || totalWeight <= epsilon) {
-                    break
-                }
-
-                let progress = 0
-                const iterationRemaining = remaining
-                for (const entry of weights) {
-                    if (remaining <= epsilon) {
-                        break
-                    }
-                    if (!entry.descriptor.isPixelPanel && entry.descriptor.excludeFromGrowth) {
-                        continue
-                    }
-                    const share = (iterationRemaining * entry.capacity) / totalWeight
-                    const amount = Math.min(entry.capacity, share)
-                    if (amount <= 0) {
-                        continue
-                    }
-                    const applied = allocate(entry.descriptor, amount)
-                    if (applied > 0) {
-                        remaining -= applied
-                        progress += applied
-                    }
-                }
-
-                if (progress <= epsilon) {
-                    break
-                }
-            }
-        }
-
-        const pixelDescriptors = descriptors.filter((descriptor) => descriptor.isPixelPanel)
-        pixelDescriptors.sort((a, b) => b.priority - a.priority)
-        for (const descriptor of pixelDescriptors) {
-            if (remaining <= 0) {
-                break
-            }
-            const currentSize = assignments.get(descriptor.index) ?? descriptor.minSize
-            const targetSize = Math.min(descriptor.preferredSize, descriptor.maxSize)
-            const needed = Math.max(0, targetSize - currentSize)
-            if (needed <= 0) {
-                continue
-            }
-            const applied = allocate(descriptor, Math.min(needed, remaining))
-            if (applied > 0) {
-                remaining -= applied
-            }
-        }
-
-        if (remaining > 0) {
-            const flexibleDescriptors = descriptors.filter((descriptor) => !descriptor.isPixelPanel)
-            if (flexibleDescriptors.length > 0) {
-                const prioritizedDescriptors = flexibleDescriptors.filter((descriptor) => descriptor.flexPriority !== undefined && !descriptor.excludeFromGrowth)
-                if (prioritizedDescriptors.length > 0) {
-                    prioritizedDescriptors.sort((a, b) => (b.flexPriority ?? 0) - (a.flexPriority ?? 0))
-                    for (const descriptor of prioritizedDescriptors) {
-                        if (remaining <= 0) {
-                            break
-                        }
-                        if (descriptor.excludeFromGrowth) {
-                            continue
-                        }
-                        const currentSize = assignments.get(descriptor.index) ?? descriptor.minSize
-                        const targetSize = Math.min(descriptor.preferredSize, descriptor.maxSize)
-                        const needed = Math.max(0, targetSize - currentSize)
-                        if (needed <= 0) {
-                            continue
-                        }
-                        const applied = allocate(descriptor, Math.min(needed, remaining))
-                        if (applied > 0) {
-                            remaining -= applied
-                        }
-                    }
-                }
-
-                if (remaining > 0) {
-                    const ratioTargets = prioritizedDescriptors.length > 0 ? flexibleDescriptors.filter((descriptor) => descriptor.flexPriority === undefined && !descriptor.excludeFromGrowth) : flexibleDescriptors.filter((descriptor) => !descriptor.excludeFromGrowth)
-                    if (ratioTargets.length > 0) {
-                        distributeFlexibleByRatio(ratioTargets)
-                    }
-                }
-            }
-        }
+/**
+ * Fold a freshly allocated state into the previous one, preserving identity where nothing moved.
+ * 新たに配分した状態を直前の状態へ畳み込み、変化が無い部分の同一性を保つ処理。
+ */
+const commit = (previous: PanelGroupLayoutState, next: PanelGroupLayoutState): PanelGroupLayoutState => {
+    if (previous.panels === next.panels && previous.containerSize === next.containerSize && isSameViolation(previous.violation, next.violation)) {
+        return previous
     }
-
-    if (remaining > 0) {
-        let previousRemaining = remaining
-        for (;;) {
-            let totalCapacity = 0
-            const candidates: Descriptor[] = []
-            for (const descriptor of descriptors) {
-                if (!descriptor.isPixelPanel && descriptor.excludeFromGrowth) {
-                    continue
-                }
-                const currentSize = assignments.get(descriptor.index) ?? descriptor.minSize
-                const descriptorMax = descriptor.isPixelPanel ? Math.min(descriptor.maxSize, descriptor.preferredSize) : descriptor.maxSize
-                const capacity = Math.max(0, descriptorMax - currentSize)
-                if (capacity > 0) {
-                    candidates.push(descriptor)
-                    totalCapacity += capacity
-                }
-            }
-            if (totalCapacity <= 0) {
-                break
-            }
-            const iterationRemaining = remaining
-            for (const descriptor of candidates) {
-                if (remaining <= 0) {
-                    break
-                }
-                if (!descriptor.isPixelPanel && descriptor.excludeFromGrowth) {
-                    continue
-                }
-                const currentSize = assignments.get(descriptor.index) ?? descriptor.minSize
-                const descriptorMax = descriptor.isPixelPanel ? Math.min(descriptor.maxSize, descriptor.preferredSize) : descriptor.maxSize
-                const capacity = Math.max(0, descriptorMax - currentSize)
-                if (capacity <= 0) {
-                    continue
-                }
-                const share = (iterationRemaining * capacity) / totalCapacity
-                const applied = allocate(descriptor, Math.min(capacity, share))
-                if (applied > 0) {
-                    remaining -= applied
-                }
-            }
-            if (remaining <= 1e-6 || Math.abs(previousRemaining - remaining) <= 1e-6) {
-                break
-            }
-            previousRemaining = remaining
-        }
-        remaining = Math.max(0, remaining)
+    return {
+        containerSize: next.containerSize,
+        panels: next.panels,
+        violation: isSameViolation(previous.violation, next.violation) ? previous.violation : next.violation,
     }
+}
 
-    // remaining < 0 (最小サイズ合計がコンテナを超える不能構成) は意図的にここで縮小しない。
-    // 配分は各パネルの minSize を下限として維持し、不能状態は hooks 側の layoutConstraintViolation が
-    // 検出・通知してハンドル無効化とプレースホルダー表示で対処する。
-    // (かつて存在した縮小ループは、割当が常に minSize 以上・縮小下限も minSize のため一切動作しないデッドコードだった)
-
-    for (const descriptor of descriptors) {
-        const assignedSize = assignments.get(descriptor.index) ?? descriptor.minSize
-        const panel = nextPanels[descriptor.index]
-        const panelIsCollapsible = panelCanCollapse(panel)
-        const nextSizeBeforeCollapse = panelIsCollapsible ? assignedSize : panel.sizeBeforeCollapse
-        const nextMeasuredBeforeCollapse = panelIsCollapsible ? (panel.measuredPixelSizeBeforeCollapse ?? panel.measuredPixelSize ?? assignedSize) : panel.measuredPixelSizeBeforeCollapse
-        const nextPercentage = containerSize > 0 ? toRoundedPercentage(assignedSize, containerSize) : 0
-
-        nextPanels[descriptor.index] = {
-            ...panel,
-            size: assignedSize,
-            percentageSize: nextPercentage,
-            preferredPercentageSize: panel.preferredPercentageSize,
-            preferredPixelSize: descriptor.isPixelPanel ? (panel.preferredPixelSize ?? assignedSize) : panel.preferredPixelSize,
-            sizeBeforeCollapse: nextSizeBeforeCollapse,
-            measuredPixelSizeBeforeCollapse: nextMeasuredBeforeCollapse,
-            measuredPixelSize: undefined,
-            measuredPercentageSize: undefined,
-        }
+/**
+ * Create the layout data of a newly registered panel.
+ * 新規登録パネルのレイアウトデータを生成する処理。
+ */
+const createPanel = (registration: PanelRegistration, defaultCollapsedFrom: PanelCollapseDirection | null): PanelLayoutData => {
+    const preference = registration.sizeUnit === "pixels" ? registration.preferredPixelSize : registration.preferredPercentageSize
+    return {
+        ...registration,
+        size: 0,
+        collapsed: registration.collapsed,
+        collapsedByDirection: registration.collapsed ? defaultCollapsedFrom : null,
+        preferenceBeforeCollapse: preference,
+        authoredPreference: preference,
     }
-
-    return normalizePanelPercentages(nextPanels)
 }
 
 /**
- * Normalize panel percentage snapshots so active panels sum to 100%.
- * アクティブなパネルの割合が 100% になるようにスナップショットを正規化する処理。
+ * Resolve the direction a panel collapses to when it starts collapsed.
+ * 初期状態で折りたたまれているパネルの折りたたみ方向を解決する処理。
  */
-const normalizePanelPercentages = (panels: PanelLayoutData[]): PanelLayoutData[] => {
-    let totalActiveSize = 0
-    for (const panel of panels) {
-        if (panel.collapsed) {
-            continue
-        }
-        totalActiveSize += Math.max(panel.size, 0)
+const initialCollapseDirection = (registration: Pick<PanelRegistration, "collapseFromStart" | "collapseFromEnd">): PanelCollapseDirection | null => {
+    if (registration.collapseFromStart) {
+        return "start"
     }
-
-    // アクティブなパネルサイズの合計がゼロの場合はすべての割合をゼロにリセット
-    if (totalActiveSize <= 0) {
-        let mutated = false
-        const normalizedPanels = panels.map((panel) => {
-            if ((panel.percentageSize ?? 0) !== 0) {
-                mutated = true
-                // 折りたたみ時は割合をゼロに初期化して整合性を保つ
-                return {
-                    ...panel,
-                    percentageSize: 0,
-                    measuredPercentageSize: panel.measuredPercentageSize !== undefined ? 0 : panel.measuredPercentageSize,
-                }
-            }
-            if (!panel.collapsed && panel.sizeBeforeCollapse !== panel.size) {
-                mutated = true
-                // 折りたたみ前のサイズがずれている場合は現在サイズで上書きする
-                return {
-                    ...panel,
-                    sizeBeforeCollapse: panel.size,
-                }
-            }
-            return panel
-        })
-        return mutated ? normalizedPanels : panels
+    if (registration.collapseFromEnd) {
+        return "end"
     }
+    return null
+}
 
-    // パネル配列に変更が発生したかを示すフラグ
-    let mutated = false
-
-    const normalizedPanels = panels.map((panel) => {
-        // 折りたたまれたパネルの割合はゼロに固定
+/**
+ * Rewrite every active panel's preference so that it reproduces the sizes it currently has.
+ * アクティブな各パネルの希望値を、現在のサイズを再現する値へ書き換える処理。
+ *
+ * A drag is a statement about proportions, so the sizes it produced become the new preferences. Because a
+ * flexible panel's weight is then exactly `size / C × 100`, re-running the allocator returns the very same
+ * sizes: the layout the user released the pointer on is a fixed point.
+ * ドラッグは比率に対する利用者の意思表示なので、その結果のサイズを新たな希望値とする。柔軟パネルの重みは
+ * `size / C × 100` そのものになるため、配分器を再実行しても同じサイズが返る (ドラッグ結果は不動点)。
+ */
+const commitPreferences = (panels: PanelLayoutData[], containerSize: number): PanelLayoutData[] => {
+    if (containerSize <= 0) {
+        return panels
+    }
+    // 端まで引いて折りたたむ操作では、閉じる直前のフレームの寸法が復元用に残ると
+    // 展開しても潰れたままになる。復元用の希望値は「閉じたとみなす幅より広い間」だけ更新する
+    const snapThreshold = calculateSnapThreshold(containerSize)
+    return panels.map((panel) => {
         if (panel.collapsed) {
-            if ((panel.percentageSize ?? 0) !== 0) {
-                mutated = true
-                return {
-                    ...panel,
-                    percentageSize: 0,
-                    measuredPercentageSize: panel.measuredPercentageSize !== undefined ? 0 : panel.measuredPercentageSize,
-                }
-            }
             return panel
         }
-
-        // size から計算した割合
-        const calculatedPercentage = toRoundedPercentage(panel.size, totalActiveSize)
-
-        // 測定済み割合があり、size から計算した割合と近い場合は測定値を優先
-        // 乖離が大きい場合は size から計算した値を使用（RESIZE_PANELS 直後など）
-        const measuredPercentage = panel.measuredPercentageSize
-        const percentageDivergence = measuredPercentage !== undefined ? Math.abs(measuredPercentage - calculatedPercentage) : Infinity
-        const useMeasuredPercentage = percentageDivergence < 0.0001 // 0.01% 未満の乖離なら測定値を優先
-
-        // 判定結果に基づき割合の基準値を確定する
-        const basePercentage = useMeasuredPercentage && measuredPercentage !== undefined ? measuredPercentage : calculatedPercentage
-        const nextPercentage = roundHalfToEven(basePercentage, PERCENTAGE_DIGITS)
-        const percentageDiff = Math.abs((panel.percentageSize ?? 0) - nextPercentage)
-        const shouldUpdatePercentage = percentageDiff > 0 || panel.percentageSize === undefined
-        const sizeBeforeCollapseDiffers = panel.sizeBeforeCollapse === undefined || panel.sizeBeforeCollapse !== panel.size
-        const panelIsCollapsible = panelCanCollapse(panel)
-        const shouldUpdateSizeBeforeCollapse = panelIsCollapsible && sizeBeforeCollapseDiffers
-        const measuredSnapshot = panel.measuredPixelSize ?? panel.size
-        const measuredBeforeDiffers = panelIsCollapsible && (panel.measuredPixelSizeBeforeCollapse === undefined || panel.measuredPixelSizeBeforeCollapse !== measuredSnapshot)
-
-        if (!(shouldUpdatePercentage || shouldUpdateSizeBeforeCollapse || measuredBeforeDiffers)) {
+        const preference = isPixelPanel(panel) ? panel.size : (panel.size / containerSize) * 100
+        const current = isPixelPanel(panel) ? panel.preferredPixelSize : panel.preferredPercentageSize
+        const preferenceBeforeCollapse = panel.size > snapThreshold ? preference : panel.preferenceBeforeCollapse
+        if (current === preference && preferenceBeforeCollapse === panel.preferenceBeforeCollapse) {
             return panel
         }
-
-        mutated = true
-        const nextSizeBeforeCollapse = shouldUpdateSizeBeforeCollapse ? panel.size : panel.sizeBeforeCollapse
-        const nextMeasuredPixelBeforeCollapse = measuredBeforeDiffers ? measuredSnapshot : panel.measuredPixelSizeBeforeCollapse
-        return {
-            ...panel,
-            percentageSize: nextPercentage,
-            sizeBeforeCollapse: nextSizeBeforeCollapse,
-            measuredPixelSizeBeforeCollapse: nextMeasuredPixelBeforeCollapse,
-            collapsedByDirection: panel.collapsed ? (panel.collapsedByDirection ?? null) : null,
-        }
+        return isPixelPanel(panel) ? { ...panel, preferredPixelSize: preference, preferenceBeforeCollapse } : { ...panel, preferredPercentageSize: preference, preferenceBeforeCollapse }
     })
-
-    return mutated ? normalizedPanels : panels
-}
-
-type ActivePanelCandidate = {
-    index: number
-    minSize: number
-    maxSize: number
-    isFlexible: boolean
 }
 
 /**
- * Reconcile active panel sizes so their total matches the container dimensions.
- * コンテナ寸法に整合するようアクティブパネルのサイズ合計を補正する処理。
+ * Set a panel's preference from an absolute pixel length.
+ * 絶対ピクセル長からパネルの希望値を設定する処理。
+ *
+ * A flexible panel's weight is a share of the container, so an absolute length only lands where it was
+ * asked for when the active panels' weights are expressed on the same scale — which is why every caller
+ * that hands out absolute lengths rewrites the whole set.
+ * 柔軟パネルの重みはコンテナ比なので、絶対長がそのままの位置に収まるのはアクティブパネルの重みが同じ尺度で
+ * 表されているときだけである。絶対長を配る呼び出し側が常に集合全体を書き換えるのはこのため。
  */
-const reconcilePanelSizesWithContainer = (panels: PanelLayoutData[], containerSize: number): boolean => {
-    if (containerSize <= 0) {
-        return false
-    }
-
-    const activeIndices: number[] = []
-    let activeTotal = 0
-
-    // アクティブなパネルのインデックスとサイズ合計を収集
-    for (let index = 0; index < panels.length; index += 1) {
-        const panel = panels[index]
-        // 折りたたまれたパネルは除外
-        if (!panel || panel.collapsed) {
-            continue
-        }
-        activeIndices.push(index)
-        activeTotal += panel.size
-    }
-
-    // アクティブなパネルが存在しない場合は調整不要
-    if (activeIndices.length === 0) {
-        return false
-    }
-
-    // コンテナサイズとアクティブパネルの合計サイズの差分を計算
-    let remaining = containerSize - activeTotal
-    // 差分がゼロの場合は調整不要
-    if (Math.abs(remaining) <= 0) {
-        return false
-    }
-
-    // パネルに変更が発生したかを追跡するフラグ
-    let mutated = false
-
-    // パネルインデックスから調整候補情報を構築 (キャッシュ付き)
-    const buildCandidate = (index: number): ActivePanelCandidate => {
-        // // キャッシュから取得を試みる
-        // const cached = candidateCache.get(index)
-        // if (cached) {
-        //     return cached
-        // }
-        const panel = panels[index]
-        // パネルの制約をピクセル値に変換
-        const minFromConstraint = getConstraintInPixels(panel.minSize, 0, containerSize)
-        const autoMinSize = getConstraintInPixels(panel.autoMinSize, 0, containerSize)
-        const minSize = Math.max(minFromConstraint, autoMinSize)
-        const maxSize = getConstraintInPixels(panel.maxSize, containerSize, containerSize)
-        // パーセンテージ単位かつピクセル固定値を持たないパネルを柔軟とみなす
-        const isFlexible = panel.sizeUnit === "percentage" && panel.originalPixelSize === undefined
-        const candidate = {
-            index,
-            minSize,
-            maxSize,
-            isFlexible,
-        }
-        // // 構築した候補情報をキャッシュに保存
-        // candidateCache.set(index, candidate)
-        return candidate
-    }
-
-    // 指定パネルにサイズ差分を適用
-    const applyDelta = (index: number, delta: number) => {
-        // 差分が有限数でない、またはゼロ以下の場合は適用不要
-        if (!Number.isFinite(delta) || Math.abs(delta) <= 0) {
-            return
-        }
-        const target = panels[index]
-        // 対象パネルが存在しない場合はスキップ
-        if (!target) {
-            return
-        }
-        // 差分を適用した新しいサイズを計算 (負値にならないよう保護)
-        const nextSize = Math.max(0, target.size + delta)
-        // サイズ変化が実質ゼロの場合は更新不要
-        if (Math.abs(nextSize - target.size) <= 0) {
-            return
-        }
-
-        // 新しいサイズに対応する割合を計算
-        const nextPercentage = toRoundedPercentage(nextSize, containerSize)
-        // 折りたたみ可能な場合は新サイズを復元用に保存、そうでない場合は既存値を維持
-        const targetIsCollapsible = panelCanCollapse(target)
-        const nextSizeBeforeCollapse = targetIsCollapsible ? nextSize : target.sizeBeforeCollapse
-        // 折りたたみ可能な場合は測定ピクセル値を更新、そうでない場合は既存値を維持
-        const nextMeasuredPixelBeforeCollapse = targetIsCollapsible ? (target.measuredPixelSizeBeforeCollapse ?? target.measuredPixelSize ?? nextSize) : target.measuredPixelSizeBeforeCollapse
-
-        // パネルデータを更新し、測定値はリセットして再測定を促す
-        panels[index] = {
-            ...target,
-            size: nextSize,
-            percentageSize: nextPercentage,
-            sizeBeforeCollapse: nextSizeBeforeCollapse,
-            measuredPixelSizeBeforeCollapse: nextMeasuredPixelBeforeCollapse,
-            measuredPixelSize: undefined,
-            measuredPercentageSize: undefined,
-        }
-
-        // 残余スペースから適用した差分を減算
-        remaining -= delta
-        // 変更フラグを立てる
-        mutated = true
+const withPreferenceFromPixels = (panel: PanelLayoutData, pixels: number, containerSize: number): PanelLayoutData => {
+    if (isPixelPanel(panel)) {
+        const preferredPixelSize = Math.max(0, pixels)
+        return { ...panel, preferredPixelSize, preferenceBeforeCollapse: preferredPixelSize }
     }
-
-    /**
-     * Distribute remaining size among candidate panels to satisfy container constraints.
-     * コンテナ制約に合わせるため候補パネルへ残余サイズを再配分する処理。
-     */
-    const adjustWithCandidates = (candidates: ActivePanelCandidate[]) => {
-        for (const candidate of candidates) {
-            // 残余スペースがゼロになったら調整完了
-            if (Math.abs(remaining) <= 0) {
-                break
-            }
-            const panel = panels[candidate.index]
-            // パネルが存在しないか折りたたまれている場合はスキップ
-            if (!panel || panel.collapsed) {
-                continue
-            }
-            const currentSize = panel.size
-
-            // 残余スペースが正の場合はパネルを拡張
-            if (remaining > 0) {
-                // 最大サイズまでの拡張可能量を計算
-                const capacity = Math.max(0, candidate.maxSize - currentSize)
-                // 拡張余地がない場合は次の候補へ
-                if (capacity <= 0) {
-                    continue
-                }
-                // 拡張可能量と残余スペースの小さい方を適用量とする
-                const applied = Math.min(capacity, remaining)
-                // 適用量がゼロ以下の場合はスキップ
-                if (applied <= 0) {
-                    continue
-                }
-                // 拡張差分を適用
-                applyDelta(candidate.index, applied)
-            } else {
-                // 残余スペースが負の場合はパネルを縮小
-                // 最小サイズまでの縮小可能量を計算
-                const capacity = Math.max(0, currentSize - candidate.minSize)
-                // 縮小余地がない場合は次の候補へ
-                if (capacity <= 0) {
-                    continue
-                }
-                // 縮小可能量と残余スペースの絶対値の小さい方を適用量とする
-                const applied = Math.min(capacity, Math.abs(remaining))
-                // 適用量がゼロ以下の場合はスキップ
-                if (applied <= 0) {
-                    continue
-                }
-                // 縮小差分を適用 (負の値)
-                applyDelta(candidate.index, -applied)
-            }
-        }
-    }
-
-    // 柔軟パネル (パーセンテージ単位) の候補を抽出
-    const flexibleCandidates = activeIndices.map((index) => buildCandidate(index)).filter((candidate) => candidate.isFlexible)
-    // 柔軟パネルが存在する場合は優先的に調整
-    if (flexibleCandidates.length > 0) {
-        adjustWithCandidates(flexibleCandidates)
-    }
-
-    // まだ残余スペースが残っている場合はピクセルパネルを優先度順に調整
-    if (Math.abs(remaining) > 0) {
-        const previousRemaining = remaining
-        // ピクセルパネルを優先度に基づいて調整
-        remaining = adjustPixelPanelsByPriority(panels, remaining, containerSize, { enforceAutoMinSize: true })
-        // 残余スペースが変化した場合は変更フラグを立てる
-        if (Math.abs(remaining - previousRemaining) > 0) {
-            mutated = true
-        }
+    if (containerSize <= 0) {
+        return panel
     }
-
-    // // 残余が負でかつ最小サイズ合計がコンテナを超える場合は比率縮小を実施
-    // if (Math.abs(remaining) > 0 && remaining < 0 && totalMinSize - containerSize > 0) {
-    //     // 調整後のアクティブパネル合計サイズを再計算
-    //     const activeTotalAfter = activeIndices.reduce((sum, index) => {
-    //         const panel = panels[index]
-    //         // 折りたたまれたパネルは除外
-    //         if (!panel || panel.collapsed) {
-    //             return sum
-    //         }
-    //         return sum + Math.max(panel.size, 0)
-    //     }, 0)
-
-    //     // アクティブ合計がゼロより大きい場合は比率縮小を実行
-    //     if (activeTotalAfter > 0) {
-    //         // コンテナサイズに対する縮小比率を計算
-    //         const scale = containerSize > 0 ? containerSize / activeTotalAfter : 0
-    //         // 割り当て済みサイズの累積値
-    //         let allocated = 0
-
-    //         // 各アクティブパネルに対して比率縮小を適用
-    //         for (let i = 0; i < activeIndices.length; i += 1) {
-    //             const panelIndex = activeIndices[i]
-    //             const target = panels[panelIndex]
-
-    //             // 折りたたまれたパネルはスキップ
-    //             if (!target || target.collapsed) {
-    //                 continue
-    //             }
-
-    //             // 現在サイズに縮小比率を掛けて新サイズを計算
-    //             let nextSize = containerSize <= 0 ? 0 : target.size * scale
-
-    //             // コンテナサイズがゼロまたはパネルが1つだけの場合はコンテナサイズ全体を割り当て
-    //             if (containerSize <= 0 || activeIndices.length === 1) {
-    //                 nextSize = Math.max(0, containerSize)
-    //                 allocated = nextSize
-    //             } else if (i === activeIndices.length - 1) {
-    //                 // 最後のパネルには残りスペース全体を割り当てて丸め誤差を吸収
-    //                 nextSize = Math.max(0, containerSize - allocated)
-    //             } else {
-    //                 // 中間パネルは計算値をそのまま使用
-    //                 nextSize = Math.max(0, nextSize)
-    //                 allocated += nextSize
-    //             }
-
-    //             // 新しいサイズに対応する割合を計算
-    //             const nextPercentage = toRoundedPercentage(nextSize, containerSize)
-    //             // 折りたたみ可能な場合は新サイズを復元用に保存
-    //             const nextSizeBeforeCollapse = target.collapsible ? nextSize : target.sizeBeforeCollapse
-    //             // 折りたたみ可能な場合は測定ピクセル値を更新
-    //             const nextMeasuredPixelBeforeCollapse = target.collapsible ? (target.measuredPixelSizeBeforeCollapse ?? target.measuredPixelSize ?? nextSize) : target.measuredPixelSizeBeforeCollapse
-
-    //             // パネルデータを更新し、測定値はリセットして再測定を促す
-    //             panels[panelIndex] = {
-    //                 ...target,
-    //                 size: nextSize,
-    //                 percentageSize: nextPercentage,
-    //                 sizeBeforeCollapse: nextSizeBeforeCollapse,
-    //                 measuredPixelSizeBeforeCollapse: nextMeasuredPixelBeforeCollapse,
-    //                 measuredPixelSize: undefined,
-    //                 measuredPercentageSize: undefined,
-    //             }
-    //         }
-
-    //         // 残余スペースをゼロにリセット
-    //         remaining = 0
-    //         // 変更フラグを立てる
-    //         mutated = true
-    //     }
-    // }
-
-    // // まだ残余が残っている場合は、すべてのアクティブパネルをフォールバック候補として調整
-    // if (Math.abs(remaining) > 0) {
-    //     const fallbackCandidates = activeIndices.map((index) => buildCandidate(index))
-    //     adjustWithCandidates(fallbackCandidates)
-    // }
-
-    return mutated
+    const preferredPercentageSize = Math.max(0, (pixels / containerSize) * 100)
+    return { ...panel, preferredPercentageSize, preferenceBeforeCollapse: preferredPercentageSize }
 }
 
-export type PanelAction =
-    | { type: "REGISTER_PANEL"; panel: PanelLayoutData }
-    | { type: "UNREGISTER_PANEL"; id: string }
-    | { type: "RESIZE_PANELS"; leftId: string; rightId: string; leftSize: number; rightSize: number; containerSize?: number }
-    | { type: "SET_PANELS"; panels: PanelLayoutData[] }
-    | { type: "CONTAINER_RESIZED"; containerSize: number; direction: "horizontal" | "vertical" }
-    | { type: "COLLAPSE_PANEL"; id: string; containerSize: number; from: PanelCollapseDirection }
-    | { type: "EXPAND_PANEL"; id: string; containerSize: number; from: PanelCollapseDirection; targetSize?: number }
-
 /**
- * Assign priority for pixel adjustment if the panel is pixel-based and priority is undefined.
- * ピクセルベースのパネルで優先度が未定義の場合に調整優先度を自動割り当てする関数。
+ * Express a panel's preference as a length in pixels for the given container.
+ * パネルの希望値を、指定コンテナに対するピクセル長として表す処理。
  *
- * @param panel - Target panel data / 対象のパネルデータ
- * @param panels - All current panels in the group / グループ内の全パネル
- * @param excludeIndex - Index to exclude from priority calculation (for updates) / 優先度計算から除外するインデックス (更新時用)
- * @returns Updated panel with assigned priority / 優先度が割り当てられたパネル
+ * This is the length the panel occupies when it is open, which is what a persisted layout has to carry: the
+ * allocated size of a collapsed panel is 0 and would restore as "closed and with nothing to open to".
+ * これは「開いているときに占める長さ」であり、保存レイアウトが持つべき値でもある。折りたたみ中のパネルの
+ * 配分結果は 0 であり、そのまま保存すると「閉じたまま、開く先も無い」状態として復元されてしまう。
+ *
+ * @param panel - Panel layout data / パネルレイアウトデータ
+ * @param containerSize - Container content-box length in pixels / コンテナ内容領域長 (px)
+ * @returns Preferred length in pixels / 希望する長さ (px)
  */
-const assignPixelAdjustPriority = (panel: PanelLayoutData, panels: PanelLayoutData[], excludeIndex?: number): PanelLayoutData => {
-    // ピクセル単位パネルかどうかを判定
-    const isPixelPanel = panel.sizeUnit === "pixels" || panel.originalPixelSize !== undefined
-    // ピクセルパネルでない、または既に優先度が設定済みの場合はそのまま返す
-    if (!isPixelPanel || panel.pixelAdjustPriority !== undefined) {
-        return panel
-    }
-
-    // 既存のピクセルパネルから優先度を収集 (除外インデックスを考慮)
-    const existingPriorities = panels
-        .filter((candidate, index) => index !== excludeIndex && (candidate.sizeUnit === "pixels" || candidate.originalPixelSize !== undefined))
-        .map((candidate) => candidate.pixelAdjustPriority)
-        .filter((value): value is number => value !== undefined)
+export const getPanelPreferenceInPixels = (panel: PanelLayoutData, containerSize: number): number => {
+    const preference = panel.collapsed ? panel.preferenceBeforeCollapse : isPixelPanel(panel) ? panel.preferredPixelSize : panel.preferredPercentageSize
+    return isPixelPanel(panel) ? preference : (preference / 100) * containerSize
+}
 
-    // 既存の最大優先度 + 1 を新しい優先度として割り当て (既存がない場合は 1)
-    const nextPriority = existingPriorities.length > 0 ? Math.max(...existingPriorities) + 1 : 1
-    return {
-        ...panel,
-        pixelAdjustPriority: nextPriority,
-    }
+/**
+ * Give one panel an absolute length and let the other active panels share what is left, keeping their ratio.
+ * 1 枚のパネルへ絶対長を与え、残りのアクティブパネルが現在の比のまま残余を分け合うよう希望値を揃える処理。
+ *
+ * @param panels - Panels in DOM order / DOM 順のパネル一覧
+ * @param targetId - Panel that receives the absolute length / 絶対長を受け取るパネル
+ * @param pixels - Absolute length in pixels / 絶対長 (px)
+ * @param containerSize - Container content-box length in pixels / コンテナ内容領域長 (px)
+ * @returns Panels whose preferences reproduce the requested layout / 要求どおりの配置を再現する希望値を持つパネル一覧
+ */
+const withAbsoluteSize = (panels: PanelLayoutData[], targetId: string, pixels: number, containerSize: number): PanelLayoutData[] => {
+    const target = Math.max(0, Math.min(pixels, containerSize))
+    // ピクセルパネルの希望長は利用者が宣言した絶対値なので、他のパネルの都合で書き換えない。
+    // 残余を分け合うのは柔軟パネルだけ
+    const sharing = panels.filter((panel) => panel.id !== targetId && !panel.collapsed && !isPixelPanel(panel))
+    const reserved = panels.reduce((total, panel) => (panel.id !== targetId && !panel.collapsed && isPixelPanel(panel) ? total + panel.size : total), 0)
+    const sharingTotal = sharing.reduce((total, panel) => total + panel.size, 0)
+    const sharingBudget = Math.max(0, containerSize - target - reserved)
+
+    return panels.map((panel) => {
+        if (panel.id === targetId) {
+            return withPreferenceFromPixels(panel, target, containerSize)
+        }
+        if (panel.collapsed || isPixelPanel(panel) || sharing.length === 0) {
+            return panel
+        }
+        const share = sharingTotal > 0 ? (panel.size / sharingTotal) * sharingBudget : sharingBudget / sharing.length
+        return withPreferenceFromPixels(panel, share, containerSize)
+    })
 }
 
 /**
- * Handle panel registration and size updates for the panel group.
- * パネルグループ内の登録・サイズ更新を処理するリデューサー。
+ * Reduce the layout state of one panel group.
+ * パネルグループのレイアウト状態を遷移させるリデューサー。
+ *
+ * @param state - Current layout state / 現在のレイアウト状態
+ * @param action - Action describing the edit / 編集内容を表すアクション
+ * @returns Next layout state, identical by reference when nothing changed / 次のレイアウト状態 (無変化なら同一参照)
  */
-// biome-ignore lint/complexity/noExcessiveCognitiveComplexity: Reducer logic
-export const panelReducer = (state: PanelLayoutData[], action: PanelAction): PanelLayoutData[] => {
+export const panelReducer = (state: PanelGroupLayoutState, action: PanelAction): PanelGroupLayoutState => {
     switch (action.type) {
-        case "REGISTER_PANEL": {
-            logger.debug("REGISTER_PANEL", action.panel)
-            const existingIndex = state.findIndex((p) => p.id === action.panel.id)
-
-            if (existingIndex >= 0) {
-                // 既存パネルの場合はプロパティを更新
-                const newState = [...state]
-                const existingPanel = state[existingIndex]
-                const updatedPanelBase: PanelLayoutData = {
-                    ...existingPanel,
-                    minSize: action.panel.minSize,
-                    maxSize: action.panel.maxSize,
-                    collapseFromStart: action.panel.collapseFromStart,
-                    collapseFromEnd: action.panel.collapseFromEnd,
-                    collapsedByDirection: action.panel.collapsedByDirection !== undefined ? action.panel.collapsedByDirection : existingPanel.collapsedByDirection,
-                    sizeUnit: action.panel.sizeUnit,
-                    originalPixelSize: action.panel.originalPixelSize,
-                    preferredPercentageSize: action.panel.preferredPercentageSize !== undefined ? action.panel.preferredPercentageSize : existingPanel.preferredPercentageSize,
-                    preferredPercentageSizeBeforeCollapse: action.panel.preferredPercentageSizeBeforeCollapse !== undefined ? action.panel.preferredPercentageSizeBeforeCollapse : existingPanel.preferredPercentageSizeBeforeCollapse,
-                    percentageSizeBeforeCollapse: action.panel.percentageSizeBeforeCollapse !== undefined ? action.panel.percentageSizeBeforeCollapse : existingPanel.percentageSizeBeforeCollapse,
-                    pixelAdjustPriority: action.panel.pixelAdjustPriority !== undefined ? action.panel.pixelAdjustPriority : existingPanel.pixelAdjustPriority,
-                    flexAdjustPriority: action.panel.flexAdjustPriority !== undefined ? action.panel.flexAdjustPriority : existingPanel.flexAdjustPriority,
-                    autoMinSize: action.panel.autoMinSize !== undefined ? action.panel.autoMinSize : existingPanel.autoMinSize,
-                    excludeFromAutoGrowth: action.panel.excludeFromAutoGrowth !== undefined ? action.panel.excludeFromAutoGrowth : existingPanel.excludeFromAutoGrowth,
-                }
-                // ピクセル単位パネルで優先度が未設定の場合は自動割り当て
-                const updatedPanel = assignPixelAdjustPriority(updatedPanelBase, state, existingIndex)
-                logger.debug("register panel (update)", {
-                    panelId: updatedPanel.id,
-                    incoming: snapshotSinglePanel(action.panel),
-                    previous: snapshotSinglePanel(existingPanel),
-                    next: snapshotSinglePanel(updatedPanel),
-                })
-
-                newState[existingIndex] = updatedPanel
-
-                // minSize/maxSize の更新で現行サイズが制約違反になった場合はレイアウトへ即時再適用する
-                // (従来は保存されるだけで、次のドラッグやコンテナリサイズまで反映されなかった)
-                // 制約を満たしている間は現行レイアウトに触れず、ユーザー操作後の配置を維持する
-                if (!updatedPanel.collapsed) {
-                    const estimatedContainerSize = newState.reduce((sum, panel) => (panel.collapsed ? sum : sum + panel.size), 0)
-                    if (estimatedContainerSize > 0) {
-                        const minPixels = getConstraintInPixels(updatedPanel.minSize, 0, estimatedContainerSize)
-                        const maxPixels = Math.max(minPixels, getConstraintInPixels(updatedPanel.maxSize, estimatedContainerSize, estimatedContainerSize))
-                        if (updatedPanel.size < minPixels - SIZE_EPSILON || updatedPanel.size > maxPixels + SIZE_EPSILON) {
-                            return recalculateFlexiblePanels(newState, estimatedContainerSize)
-                        }
-                    }
-                }
-
-                return newState
+        case "SET_CONTAINER_SIZE": {
+            if (!Number.isFinite(action.containerSize) || action.containerSize < 0 || action.containerSize === state.containerSize) {
+                return state
             }
+            return commit(state, allocate(state.panels, action.containerSize))
+        }
 
-            // 新規パネルの場合は末尾に追加し、必要に応じて優先度を割り当て
-            const newPanelBase: PanelLayoutData = { ...action.panel }
-            const newPanel = assignPixelAdjustPriority(newPanelBase, state)
-            logger.debug("register panel (insert)", {
-                panelId: newPanel.id,
-                incoming: snapshotSinglePanel(newPanel),
-                previousLength: state.length,
-            })
-            return [...state, newPanel]
+        case "REGISTER_PANEL": {
+            const index = state.panels.findIndex((panel) => panel.id === action.panel.id)
+            if (index === -1) {
+                const panels = [...state.panels, createPanel(action.panel, initialCollapseDirection(action.panel))]
+                return commit(state, allocate(panels, state.containerSize))
+            }
+
+            const previous = state.panels[index]
+            const authored = action.panel.sizeUnit === "pixels" ? action.panel.preferredPixelSize : action.panel.preferredPercentageSize
+            // 利用者が指定した既定サイズが変わったときだけ希望値を採用する。
+            // 変わっていない再登録 (制約プロパティの変更など) でドラッグ結果を巻き戻さないための判定
+            const adoptsAuthoredPreference = authored !== previous.authoredPreference || action.panel.sizeUnit !== previous.sizeUnit
+            const collapseDirectionStillAllowed = previous.collapsedByDirection === "start" ? action.panel.collapseFromStart : previous.collapsedByDirection === "end" ? action.panel.collapseFromEnd : false
+            // 折りたたみ設定が変わったのに方向が残ると、どの方向でも展開できないパネルになる
+            const stillCollapsible = action.panel.collapseFromStart || action.panel.collapseFromEnd
+            const nextCollapsed = previous.collapsed && stillCollapsible
+            const updated: PanelLayoutData = {
+                ...previous,
+                ...action.panel,
+                collapsed: nextCollapsed,
+                collapsedByDirection: nextCollapsed ? (collapseDirectionStillAllowed ? previous.collapsedByDirection : initialCollapseDirection(action.panel)) : null,
+                preferredPercentageSize: adoptsAuthoredPreference ? action.panel.preferredPercentageSize : previous.preferredPercentageSize,
+                preferredPixelSize: adoptsAuthoredPreference ? action.panel.preferredPixelSize : previous.preferredPixelSize,
+                preferenceBeforeCollapse: adoptsAuthoredPreference ? authored : previous.preferenceBeforeCollapse,
+                authoredPreference: authored,
+            }
+
+            const panels = [...state.panels]
+            panels[index] = updated
+            return commit(state, allocate(panels, state.containerSize))
         }
+
         case "UNREGISTER_PANEL": {
-            logger.debug("UNREGISTER_PANEL", action.id)
-            // 指定 ID のパネルを削除し、残ったパネルの割合を正規化
-            const filtered = state.filter((panel) => panel.id !== action.id)
-            const normalized = normalizePanelPercentages(filtered)
-            // スナップショット構築が高コストなため、debug 出力が有効な場合のみ組み立てる
-            if (logger.enabledFor(LogLevel.DEBUG)) {
-                logger.debug("unregister panel", {
-                    panelId: action.id,
-                    previous: snapshotPanelState(state),
-                    filtered: snapshotPanelState(filtered),
-                    next: snapshotPanelState(normalized),
-                })
+            const panels = state.panels.filter((panel) => panel.id !== action.id)
+            if (panels.length === state.panels.length) {
+                return state
             }
-            return normalized
+            return commit(state, allocate(panels, state.containerSize))
         }
-        case "RESIZE_PANELS": {
-            // PanelResizeHandle の onPointerMove/onPointerUp ハンドラから呼び出されるドラッグ更新ロジック
-            // フック側は「制約を大きく外さない初期値」を作る役割、リデューサー側が「最終確定」の役割を担う
-            // フック側はドラッグ中の左右ペアに即座に制約を適用して「安全な候補サイズ」を算出するだけで、他パネルとの整合や割合正規化までは扱わない
-            // フック側で暫定計算した結果を受け取り、ここで唯一の正規ロジックとして全パネルに対する最終調整と割合正規化を確定させる
-
-            logger.debug("RESIZE_PANELS", action.leftId, action.rightId, action.leftSize, action.rightSize)
-            const leftIndex = state.findIndex((p) => p.id === action.leftId)
-            const rightIndex = state.findIndex((p) => p.id === action.rightId)
-            if (leftIndex === -1 || rightIndex === -1) return state
 
-            const newState = [...state]
-            const leftPanel = newState[leftIndex]
-            const rightPanel = newState[rightIndex]
-
-            // 折りたたまれたパネルがある場合はリサイズを中断
-            if (leftPanel.collapsed || rightPanel.collapsed) {
+        case "REORDER_PANELS": {
+            if (action.ids.length !== state.panels.length) {
+                // DOM と登録状態が一時的にずれている間は並べ替えない (揃った時点で再度通知される)
                 return state
             }
-
-            // サイズ変化が無い場合はスキップして不要な再レンダリングを防止
-            if (action.leftSize === leftPanel.size && action.rightSize === rightPanel.size) {
+            if (new Set(action.ids).size !== action.ids.length) {
+                // 同じ id が 2 度現れる並びは、片方のパネルを取り違えて落とすことになる
                 return state
             }
-
-            // コンテナサイズを推定 (指定がない場合は全パネルのサイズ合計を使用)
-            const estimatedContainerSize = action.containerSize ?? state.reduce((sum, p) => sum + p.size, 0)
-            // 左パネルの最小・最大サイズをピクセル値に変換
-            const leftMinSize = getConstraintInPixels(leftPanel.minSize, 0, estimatedContainerSize)
-            const leftMaxSize = getConstraintInPixels(leftPanel.maxSize, estimatedContainerSize, estimatedContainerSize)
-            // 右パネルの最小・最大サイズをピクセル値に変換
-            const rightMinSize = getConstraintInPixels(rightPanel.minSize, 0, estimatedContainerSize)
-            const rightMaxSize = getConstraintInPixels(rightPanel.maxSize, estimatedContainerSize, estimatedContainerSize)
-
-            // リサイズ対象ペアの元の合計サイズを記録
-            const originalPairTotal = leftPanel.size + rightPanel.size
-            // 全アクティブパネルの合計サイズを計算
-            const activeTotalBefore = state.reduce((sum, panel) => (panel.collapsed ? sum : sum + panel.size), 0)
-            // リサイズ対象ペア以外のアクティブパネルの合計サイズを算出
-            const otherActiveTotal = activeTotalBefore - originalPairTotal
-
-            // ペアの最小・最大合計サイズを算出
-            const minPairTotal = leftMinSize + rightMinSize
-            const maxPairTotal = leftMaxSize + rightMaxSize
-
-            // リクエストされたペア合計を制約内にクランプ
-            const requestedPairTotal = clamp(action.leftSize + action.rightSize, minPairTotal, maxPairTotal)
-
-            // コンテナサイズとペア以外の合計から必要なペア合計を計算
-            let requiredPairTotal = estimatedContainerSize > 0 ? estimatedContainerSize - otherActiveTotal : requestedPairTotal
-            // 計算結果が無効な場合はリクエスト値を使用
-            if (!Number.isFinite(requiredPairTotal)) {
-                requiredPairTotal = requestedPairTotal
-            }
-            // リクエスト値と必要値の大きい方を選び、制約内にクランプして目標合計を決定
-            const targetPairTotal = clamp(Math.max(requestedPairTotal, requiredPairTotal), minPairTotal, maxPairTotal)
-
-            // 左パネルの有効範囲を計算 (右パネルの制約を考慮して決定)
-            const computeLeftRange = (sum: number) => ({
-                min: Math.max(leftMinSize, sum - rightMaxSize),
-                max: Math.min(leftMaxSize, sum - rightMinSize),
-            })
-            // 右パネルの有効範囲を計算 (左パネルの制約を考慮して決定)
-            const computeRightRange = (sum: number) => ({
-                min: Math.max(rightMinSize, sum - leftMaxSize),
-                max: Math.min(rightMaxSize, sum - leftMinSize),
-            })
-
-            // 左パネルのサイズ変化量を計算
-            const leftInfluence = Math.abs(action.leftSize - leftPanel.size)
-            // 右パネルのサイズ変化量を計算
-            const rightInfluence = Math.abs(action.rightSize - rightPanel.size)
-            // 変化量が大きい方のパネルを優先して調整
-            const prioritizeLeft = leftInfluence >= rightInfluence
-
-            // 最終的に適用するサイズを初期化
-            let finalLeftSize = leftPanel.size
-            let finalRightSize = rightPanel.size
-
-            // 左パネルを優先する場合の調整
-            if (prioritizeLeft) {
-                // 左パネルの有効範囲を取得
-                const leftRange = computeLeftRange(targetPairTotal)
-                // 有効範囲が不正な場合は変更をキャンセル (桁落ちで境界が 1ulp 交差しただけなら単一点として扱う)
-                if (leftRange.min > leftRange.max + SIZE_EPSILON) {
+            const byId = new Map(state.panels.map((panel) => [panel.id, panel]))
+            const panels: PanelLayoutData[] = []
+            for (const id of action.ids) {
+                const panel = byId.get(id)
+                if (!panel) {
                     return state
                 }
-                // 左パネルの希望サイズを有効範囲内にクランプ
-                const desiredLeft = clamp(action.leftSize, leftRange.min, leftRange.max)
-                // 右パネルのサイズを合計から逆算
-                const adjustedRight = targetPairTotal - desiredLeft
-                // 右パネルのサイズが制約を満たさない場合は変更をキャンセル (桁落ち分は境界へ丸めて受理する)
-                if (adjustedRight < rightMinSize - SIZE_EPSILON || adjustedRight > rightMaxSize + SIZE_EPSILON) {
-                    return state
-                }
-                // 計算結果を最終サイズとして確定
-                finalLeftSize = desiredLeft
-                finalRightSize = clamp(adjustedRight, rightMinSize, rightMaxSize)
-            } else {
-                // 右パネルを優先する場合の調整
-                // 右パネルの有効範囲を取得
-                const rightRange = computeRightRange(targetPairTotal)
-                // 有効範囲が不正な場合は変更をキャンセル (桁落ちで境界が 1ulp 交差しただけなら単一点として扱う)
-                if (rightRange.min > rightRange.max + SIZE_EPSILON) {
-                    return state
-                }
-                // 右パネルの希望サイズを有効範囲内にクランプ
-                const desiredRight = clamp(action.rightSize, rightRange.min, rightRange.max)
-                // 左パネルのサイズを合計から逆算
-                const adjustedLeft = targetPairTotal - desiredRight
-                // 左パネルのサイズが制約を満たさない場合は変更をキャンセル (桁落ち分は境界へ丸めて受理する)
-                if (adjustedLeft < leftMinSize - SIZE_EPSILON || adjustedLeft > leftMaxSize + SIZE_EPSILON) {
-                    return state
-                }
-                // 計算結果を最終サイズとして確定
-                finalRightSize = desiredRight
-                finalLeftSize = clamp(adjustedLeft, leftMinSize, leftMaxSize)
+                panels.push(panel)
             }
-
-            // 誤差範囲を超えて合計が変化する場合は状態を維持
-            const pairTotalAfter = finalLeftSize + finalRightSize
-            if (Math.abs(targetPairTotal - pairTotalAfter) > SIZE_EPSILON) {
+            if (panels.every((panel, index) => panel === state.panels[index])) {
                 return state
             }
+            return commit(state, allocate(panels, state.containerSize))
+        }
 
-            // リサイズ後のアクティブパネル合計サイズを計算
-            const activeTotalAfter = activeTotalBefore - leftPanel.size - rightPanel.size + pairTotalAfter
-
-            // // リサイズ前後でアクティブ合計が変化している場合は変更をキャンセル
-            // if (activeTotalAfter !== activeTotalBefore) {
-            //     return state
-            // }
-
-            // // コンテナサイズが指定されているのにアクティブ合計が不足する場合は変更をキャンセル
-            // if (estimatedContainerSize > 0 && activeTotalAfter < estimatedContainerSize) {
-            //     return state
-            // }
-
-            // 割合計算に使用するコンテナサイズを決定 (推定値がある場合はそれを使用、なければ合計値)
-            const containerSizeForPercentage = estimatedContainerSize > 0 ? estimatedContainerSize : activeTotalAfter
-            // 左パネルの新しい割合を計算
-            const nextLeftPercentage = containerSizeForPercentage > 0 ? toRoundedPercentage(finalLeftSize, containerSizeForPercentage) : 0
-            // 右パネルの新しい割合を計算
-            const nextRightPercentage = containerSizeForPercentage > 0 ? toRoundedPercentage(finalRightSize, containerSizeForPercentage) : 0
-            const nextLeftPreferredPixel = leftPanel.sizeUnit === "pixels" || leftPanel.originalPixelSize !== undefined ? finalLeftSize : leftPanel.preferredPixelSize
-            const nextRightPreferredPixel = rightPanel.sizeUnit === "pixels" || rightPanel.originalPixelSize !== undefined ? finalRightSize : rightPanel.preferredPixelSize
-
-            const leftAutoMin = getConstraintInPixels(leftPanel.autoMinSize, 0, estimatedContainerSize)
-            const rightAutoMin = getConstraintInPixels(rightPanel.autoMinSize, 0, estimatedContainerSize)
-            const leftZeroThreshold = Math.max(1e-3, leftAutoMin)
-            const rightZeroThreshold = Math.max(1e-3, rightAutoMin)
-            const manageLeftGrowth = leftPanel.sizeUnit === "percentage" && leftPanel.originalPixelSize === undefined
-            const manageRightGrowth = rightPanel.sizeUnit === "percentage" && rightPanel.originalPixelSize === undefined
-            let nextLeftExclude = leftPanel.excludeFromAutoGrowth
-            let nextRightExclude = rightPanel.excludeFromAutoGrowth
-            if (manageLeftGrowth) {
-                if (finalLeftSize <= leftZeroThreshold) {
-                    nextLeftExclude = true
-                } else if (finalLeftSize > leftZeroThreshold) {
-                    nextLeftExclude = false
-                }
-            }
-            if (manageRightGrowth) {
-                if (finalRightSize <= rightZeroThreshold) {
-                    nextRightExclude = true
-                } else if (finalRightSize > rightZeroThreshold) {
-                    nextRightExclude = false
-                }
+        case "RESIZE_PANELS": {
+            const startIndex = state.panels.findIndex((panel) => panel.id === action.startId)
+            const endIndex = state.panels.findIndex((panel) => panel.id === action.endId)
+            if (startIndex === -1 || endIndex === -1) {
+                return state
             }
 
-            const leftIsCollapsible = panelCanCollapse(leftPanel)
-            const rightIsCollapsible = panelCanCollapse(rightPanel)
-
-            // 左パネルの状態を更新 (測定値はリセットして再測定を促す)
-            newState[leftIndex] = {
-                ...leftPanel,
-                size: finalLeftSize,
-                percentageSize: nextLeftPercentage,
-                preferredPercentageSize: nextLeftPercentage > 0 ? nextLeftPercentage : leftPanel.preferredPercentageSize,
-                preferredPixelSize: nextLeftPreferredPixel,
-                sizeBeforeCollapse: leftIsCollapsible ? finalLeftSize : leftPanel.sizeBeforeCollapse,
-                measuredPixelSize: undefined,
-                measuredPercentageSize: undefined,
-                excludeFromAutoGrowth: nextLeftExclude,
-            }
-            // 右パネルの状態を更新 (測定値はリセットして再測定を促す)
-            newState[rightIndex] = {
-                ...rightPanel,
-                size: finalRightSize,
-                percentageSize: nextRightPercentage,
-                preferredPercentageSize: nextRightPercentage > 0 ? nextRightPercentage : rightPanel.preferredPercentageSize,
-                preferredPixelSize: nextRightPreferredPixel,
-                sizeBeforeCollapse: rightIsCollapsible ? finalRightSize : rightPanel.sizeBeforeCollapse,
-                measuredPixelSize: undefined,
-                measuredPercentageSize: undefined,
-                excludeFromAutoGrowth: nextRightExclude,
-            }
-            // コンテナサイズが有効な場合は他のパネルとの整合性を確保
-            if (estimatedContainerSize > 0 && reconcilePanelSizesWithContainer(newState, estimatedContainerSize)) {
-                return normalizePanelPercentages(newState)
-            }
-            return newState
-        }
-        case "SET_PANELS": {
-            logger.debug("SET_PANELS", action.panels)
-            // スナップショット構築が高コストなため、debug 出力が有効な場合のみログ専用の組み立てを行う
-            const debugEnabled = logger.enabledFor(LogLevel.DEBUG)
-            // パネル配列全体を置き換えて割合を正規化
-            const enrichedPanels = action.panels.map((panel) => {
-                const isPixelPanel = panel.sizeUnit === "pixels" || panel.originalPixelSize !== undefined
-                const nextPreferredPercentage = panel.preferredPercentageSize !== undefined ? panel.preferredPercentageSize : panel.percentageSize
-                const nextPreferredPixelSize = panel.preferredPixelSize !== undefined ? panel.preferredPixelSize : isPixelPanel ? panel.size : panel.preferredPixelSize
-                return {
-                    ...panel,
-                    preferredPercentageSize: nextPreferredPercentage,
-                    preferredPixelSize: nextPreferredPixelSize,
-                }
-            })
-            const previousSnapshot = snapshotPanelState(state)
-            // incomingSnapshot はログ専用のため debug 有効時のみ構築する
-            const incomingSnapshot = debugEnabled ? snapshotPanelState(enrichedPanels) : null
-            const normalized = normalizePanelPercentages(enrichedPanels)
-            const nextSnapshot = snapshotPanelState(normalized)
-            let isNoop = previousSnapshot.length === nextSnapshot.length
-            if (isNoop) {
-                for (let index = 0; index < nextSnapshot.length; index += 1) {
-                    const panel = nextSnapshot[index]
-                    const previous = previousSnapshot[index]
-                    if (!previous) {
-                        isNoop = false
-                        break
-                    }
-                    // スナップショットの全フィールドを比較する (一部だけ比較すると実際の状態変化を no-op と誤判定して捨ててしまう)
-                    const isSame =
-                        previous.id === panel.id &&
-                        previous.size === panel.size &&
-                        previous.percentageSize === panel.percentageSize &&
-                        previous.preferredPercentageSize === panel.preferredPercentageSize &&
-                        previous.sizeBeforeCollapse === panel.sizeBeforeCollapse &&
-                        previous.percentageSizeBeforeCollapse === panel.percentageSizeBeforeCollapse &&
-                        previous.preferredPercentageSizeBeforeCollapse === panel.preferredPercentageSizeBeforeCollapse &&
-                        previous.measuredPercentageSize === panel.measuredPercentageSize &&
-                        previous.excludeFromAutoGrowth === panel.excludeFromAutoGrowth &&
-                        previous.collapsed === panel.collapsed &&
-                        previous.collapseFromStart === panel.collapseFromStart &&
-                        previous.collapseFromEnd === panel.collapseFromEnd &&
-                        previous.collapsedByDirection === panel.collapsedByDirection
-                    if (!isSame) {
-                        isNoop = false
-                        break
-                    }
-                }
+            const startPanel = state.panels[startIndex]
+            const endPanel = state.panels[endIndex]
+            if (startPanel.collapsed || endPanel.collapsed || state.containerSize <= 0 || !Number.isFinite(action.startSize)) {
+                return state
             }
 
-            if (isNoop) {
-                if (debugEnabled) {
-                    logger.debug("set panels skipped (no diff)", {
-                        previous: previousSnapshot,
-                        incoming: incomingSnapshot,
-                        next: nextSnapshot,
-                        previousLength: previousSnapshot.length,
-                        incomingLength: incomingSnapshot?.length ?? enrichedPanels.length,
-                    })
-                }
+            // ドラッグはこの 2 枚の間で領域を移すだけの操作なので、合計は動かさない
+            const total = startPanel.size + endPanel.size
+            const startBounds = resolvePanelBounds(startPanel, state.containerSize)
+            const endBounds = resolvePanelBounds(endPanel, state.containerSize)
+            const lowerBound = Math.max(startBounds.min, total - endBounds.max)
+            const upperBound = Math.min(startBounds.max, total - endBounds.min)
+            if (lowerBound - upperBound > PANEL_ALLOCATION_EPSILON) {
                 return state
             }
-            if (debugEnabled) {
-                logger.debug("set panels", {
-                    previous: previousSnapshot,
-                    incoming: incomingSnapshot,
-                    next: nextSnapshot,
-                    previousLength: previousSnapshot.length,
-                    incomingLength: incomingSnapshot?.length ?? enrichedPanels.length,
-                })
-            }
-            return normalized
-        }
-        case "CONTAINER_RESIZED": {
-            logger.debug("CONTAINER_RESIZED", action.containerSize)
-            // リサイズ毎ティックに走るホットパスのため、抑制中はスナップショット構築ごと省略する
-            // (logger.debug は引数を先に評価するので、ガードなしでは全パネルのスナップショットが毎回作られる)
-            const debugEnabled = logger.enabledFor(LogLevel.DEBUG)
-            if (action.containerSize <= 0) {
-                if (debugEnabled) {
-                    logger.debug("container resized skipped (non-positive size)", {
-                        containerSize: action.containerSize,
-                        panels: snapshotPanelState(state),
-                    })
-                }
+
+            const startSize = clamp(action.startSize, lowerBound, Math.max(lowerBound, upperBound))
+            const endSize = total - startSize
+            if (Math.abs(startSize - startPanel.size) <= PANEL_ALLOCATION_EPSILON) {
                 return state
             }
-            if (debugEnabled) {
-                logger.debug("container resized (before)", {
-                    containerSize: action.containerSize,
-                    panels: snapshotPanelState(state),
-                })
-            }
-            // コンテナサイズ変更時に柔軟パネルを再計算
-            const recalculated = recalculateFlexiblePanels(state, action.containerSize)
-            if (debugEnabled) {
-                logger.debug("container resized (after recalc)", {
-                    containerSize: action.containerSize,
-                    panels: snapshotPanelState(recalculated),
-                })
-            }
-            if (action.containerSize > 0 && reconcilePanelSizesWithContainer(recalculated, action.containerSize)) {
-                const normalized = normalizePanelPercentages(recalculated)
-                if (debugEnabled) {
-                    logger.debug("container resized (after reconcile)", {
-                        containerSize: action.containerSize,
-                        panels: snapshotPanelState(normalized),
-                    })
-                }
-                return normalized
-            }
-            if (debugEnabled) {
-                logger.debug("container resized (final)", {
-                    containerSize: action.containerSize,
-                    panels: snapshotPanelState(recalculated),
-                })
-            }
-            return recalculated
+
+            const resized = [...state.panels]
+            resized[startIndex] = { ...startPanel, size: startSize }
+            resized[endIndex] = { ...endPanel, size: endSize }
+            return commit(state, allocate(commitPreferences(resized, state.containerSize), state.containerSize))
         }
+
         case "COLLAPSE_PANEL": {
-            logger.debug("COLLAPSE_PANEL", action.id)
-            const panelIndex = state.findIndex((panel) => panel.id === action.id)
-            if (panelIndex === -1) {
+            const index = state.panels.findIndex((panel) => panel.id === action.id)
+            if (index === -1) {
                 return state
             }
-
-            const targetPanel = state[panelIndex]
-            const directionAllowed = action.from === "start" ? targetPanel.collapseFromStart : targetPanel.collapseFromEnd
-            const panelIsCollapsible = panelCanCollapse(targetPanel)
-            // 折りたたみ不可または既に折りたたまれている場合はスキップ
-            if (!(panelIsCollapsible && directionAllowed) || targetPanel.collapsed) {
+            const panel = state.panels[index]
+            const allowed = action.from === "start" ? panel.collapseFromStart : panel.collapseFromEnd
+            if (!allowed || panel.collapsed) {
                 return state
             }
 
-            // 折りたたみ前のサイズと測定値をピクセル基準で保存
-            const sizeBefore = targetPanel.size
-            const measuredPixelBefore = targetPanel.measuredPixelSize ?? sizeBefore
-            const percentageBefore = targetPanel.percentageSize ?? targetPanel.preferredPercentageSize ?? 0
-
-            const updatedPanel: PanelLayoutData = {
-                ...targetPanel,
+            const panels = [...state.panels]
+            panels[index] = {
+                ...panel,
                 collapsed: true,
                 collapsedByDirection: action.from,
-                sizeBeforeCollapse: sizeBefore,
-                percentageSizeBeforeCollapse: percentageBefore,
-                preferredPercentageSizeBeforeCollapse: targetPanel.preferredPercentageSize ?? percentageBefore,
-                preferredPixelSizeBeforeCollapse: targetPanel.preferredPixelSize ?? sizeBefore,
-                measuredPixelSizeBeforeCollapse: measuredPixelBefore,
-                size: 0,
-                percentageSize: 0,
-                preferredPercentageSize: targetPanel.preferredPercentageSize,
-                measuredPixelSize: targetPanel.measuredPixelSize !== undefined ? 0 : targetPanel.measuredPixelSize,
-                measuredPercentageSize: targetPanel.measuredPercentageSize !== undefined ? 0 : targetPanel.measuredPercentageSize,
-            }
-
-            const newState = [...state]
-            newState[panelIndex] = updatedPanel
-
-            const recalculated = recalculateFlexiblePanels(newState, action.containerSize)
-            if (action.containerSize > 0 && reconcilePanelSizesWithContainer(recalculated, action.containerSize)) {
-                return normalizePanelPercentages(recalculated)
             }
-            return recalculated
+            return commit(state, allocate(panels, state.containerSize))
         }
-        case "EXPAND_PANEL": {
-            logger.debug("EXPAND_PANEL", action.id, action.targetSize)
-            const panelIndex = state.findIndex((panel) => panel.id === action.id)
-            if (panelIndex === -1) {
-                return state
-            }
-
-            const containerSize = action.containerSize
 
-            const targetPanel = state[panelIndex]
-            // 折りたたみ不可または既に展開されている場合はスキップ
-            const directionAllowed = action.from === "start" ? targetPanel.collapseFromStart : targetPanel.collapseFromEnd
-            if (!(panelCanCollapse(targetPanel) && directionAllowed && targetPanel.collapsed)) {
+        case "EXPAND_PANEL": {
+            const index = state.panels.findIndex((panel) => panel.id === action.id)
+            if (index === -1 || (action.targetSize !== undefined && state.containerSize <= 0)) {
                 return state
             }
-            if (targetPanel.collapsedByDirection && targetPanel.collapsedByDirection !== action.from) {
+            const panel = state.panels[index]
+            const allowed = action.from === "start" ? panel.collapseFromStart : panel.collapseFromEnd
+            if (!(allowed && panel.collapsed) || (panel.collapsedByDirection !== null && panel.collapsedByDirection !== action.from)) {
                 return state
             }
 
-            // 復元サイズを決定 (優先順: targetSize → sizeBeforeCollapse → measuredPixelSizeBeforeCollapse → preferredPixelSizeBeforeCollapse → originalPixelSize)
-            const candidateSizes = [action.targetSize, targetPanel.sizeBeforeCollapse, targetPanel.measuredPixelSizeBeforeCollapse, targetPanel.preferredPixelSizeBeforeCollapse, targetPanel.originalPixelSize]
-            const proposedSize = candidateSizes.find((value) => value !== undefined) ?? 0
-            const minSize = getConstraintInPixels(targetPanel.minSize, 0, containerSize)
-            const maxSize = getConstraintInPixels(targetPanel.maxSize, containerSize, containerSize)
-            const restoredSize = clamp(proposedSize, minSize, maxSize)
-            const restoredPercentage = toRoundedPercentage(restoredSize, containerSize)
-            const restoredMeasuredPixel = targetPanel.measuredPixelSizeBeforeCollapse ?? restoredSize
-            const restoredMeasuredPercentage = toRoundedPercentage(restoredMeasuredPixel, containerSize)
-            const restoredPreferredPercentage = targetPanel.preferredPercentageSizeBeforeCollapse ?? targetPanel.percentageSizeBeforeCollapse ?? restoredPercentage
-            const restoredPreferredPixel = targetPanel.preferredPixelSizeBeforeCollapse ?? targetPanel.preferredPixelSize ?? restoredSize
-
-            // 復元サイズを反映したパネル情報を構築し測定値も再設定
-            const updatedPanel: PanelLayoutData = {
-                ...targetPanel,
+            const restored: PanelLayoutData = {
+                ...panel,
                 collapsed: false,
                 collapsedByDirection: null,
-                size: restoredSize,
-                percentageSize: restoredPercentage,
-                preferredPercentageSize: restoredPreferredPercentage,
-                preferredPixelSize: restoredPreferredPixel,
-                sizeBeforeCollapse: restoredSize,
-                percentageSizeBeforeCollapse: undefined,
-                preferredPercentageSizeBeforeCollapse: undefined,
-                preferredPixelSizeBeforeCollapse: undefined,
-                measuredPixelSize: restoredSize,
-                measuredPixelSizeBeforeCollapse: restoredMeasuredPixel,
-                measuredPercentageSize: restoredMeasuredPercentage,
+                preferredPixelSize: isPixelPanel(panel) ? panel.preferenceBeforeCollapse : panel.preferredPixelSize,
+                preferredPercentageSize: isPixelPanel(panel) ? panel.preferredPercentageSize : panel.preferenceBeforeCollapse,
             }
 
-            // 新しい状態配列を用意して対象パネルを差し替え
-            const newState = [...state]
-            newState[panelIndex] = updatedPanel
+            const expanded = [...state.panels]
+            expanded[index] = restored
+            const panels = action.targetSize === undefined ? expanded : withAbsoluteSize(expanded, action.id, action.targetSize, state.containerSize)
+            return commit(state, allocate(panels, state.containerSize))
+        }
 
-            const recalculated = recalculateFlexiblePanels(newState, containerSize)
-            if (containerSize > 0 && reconcilePanelSizesWithContainer(recalculated, containerSize)) {
-                return normalizePanelPercentages(recalculated)
+        case "RESTORE_LAYOUT": {
+            if (action.entries.length !== state.panels.length || state.containerSize <= 0) {
+                return state
+            }
+            const stored = new Map(action.entries.map((entry) => [entry.id, entry]))
+            if (state.panels.some((panel) => !stored.has(panel.id))) {
+                // 保存時と構成が違う。位置で当てはめると別のパネルへ他人の寸法を与えてしまうため適用しない
+                return state
             }
-            return recalculated
+            const panels = state.panels.map((panel) => {
+                const entry = stored.get(panel.id)
+                if (!entry) {
+                    return panel
+                }
+                // 保存されているのは「開いているときに占める長さ」なので、折りたたみ状態に関わらず希望値として適用する
+                const restored = withPreferenceFromPixels(panel, entry.size, state.containerSize)
+                const canCollapse = panel.collapseFromStart || panel.collapseFromEnd
+                if (entry.collapsed && canCollapse) {
+                    return { ...restored, collapsed: true, collapsedByDirection: panel.collapsedByDirection ?? initialCollapseDirection(panel) }
+                }
+                return restored.collapsed ? { ...restored, collapsed: false, collapsedByDirection: null } : restored
+            })
+            logger.debug("restore layout", { containerSize: state.containerSize, entries: action.entries })
+            return commit(state, allocate(panels, state.containerSize))
         }
-        default:
+
+        default: {
             return state
+        }
     }
 }