@tellegen/svelte 0.2.0 → 0.3.0

package/dist/panels.svelte.js

@@ -0,0 +1,215 @@
+import { getContext, setContext } from 'svelte';
+const KEY = Symbol('tellegen.panel-layout');
+const STORAGE_KEY = 'tellegen.panel-layout.v1';
+export const PANEL_BREAKPOINT = 960;
+export const PANEL_MIN_DOCK_HEIGHT = 500;
+export const PANEL_COMPACT_QUERY = `(max-width: ${PANEL_BREAKPOINT}px), (max-height: ${PANEL_MIN_DOCK_HEIGHT - 1}px)`;
+/** Layout belongs to one provider and stores presentation preferences only. */
+export class PanelLayout {
+    panels = $state.raw([]);
+    placements = $state({});
+    compact = $state(false);
+    drawer = $state('network');
+    lastActive = $state('network');
+    dockActive = $state({ left: 'network', right: 'solver' });
+    viewportWidth = $state(1280);
+    viewportHeight = $state(800);
+    top = $state(100);
+    bottom = $state(88);
+    storageError = $state(null);
+    #storage;
+    #gesture = null;
+    beginGesture(panel, kind, x, y, bounds) {
+        this.#gesture = { panel, kind, x, y, bounds, moved: false };
+    }
+    moveGesture(x, y) {
+        const gesture = this.#gesture;
+        if (!gesture)
+            return;
+        const dx = x - gesture.x, dy = y - gesture.y;
+        if (!gesture.moved && Math.hypot(dx, dy) < 4)
+            return;
+        gesture.moved = true;
+        this.float(gesture.panel, gesture.kind === 'move'
+            ? {
+                ...gesture.bounds,
+                x: gesture.bounds.x + dx,
+                y: gesture.bounds.y + dy
+            }
+            : {
+                ...gesture.bounds,
+                width: gesture.bounds.width + dx,
+                height: gesture.bounds.height + dy
+            });
+    }
+    finishGesture() {
+        if (this.#gesture?.moved)
+            this.save();
+        this.#gesture = null;
+    }
+    register(panel) {
+        this.panels = [...this.panels.filter((p) => p.id !== panel.id), panel];
+        return () => {
+            this.panels = this.panels.filter((p) => p.id !== panel.id);
+        };
+    }
+    update(id, open, title, width) {
+        const previous = this.panels.find((p) => p.id === id);
+        if (!previous ||
+            (previous.open === open && previous.title === title && previous.width === width))
+            return;
+        this.panels = this.panels.map((p) => (p.id === id ? { ...p, open, title, width } : p));
+        if (open && !previous.open) {
+            this.activate(previous);
+            if (this.compact)
+                this.drawer = id;
+        }
+    }
+    activate(panel) {
+        this.lastActive = panel.id;
+        const side = this.position(panel);
+        if (side !== 'floating')
+            this.dockActive[side] = panel.id;
+    }
+    preferred(panel) {
+        const side = this.position(panel);
+        if (side === 'floating')
+            return false;
+        const open = this.ordered(side).filter((candidate) => candidate.open);
+        const selected = open.find((candidate) => candidate.id === this.dockActive[side]) ?? open[0];
+        return selected?.id === panel.id;
+    }
+    position(panel) {
+        return this.placements[panel.id]?.position ?? panel.side;
+    }
+    ordered(side) {
+        return this.panels
+            .filter((p) => side === undefined || this.position(p) === side)
+            .sort((a, b) => a.order - b.order || a.id.localeCompare(b.id));
+    }
+    toggle(panel) {
+        if (this.compact) {
+            this.drawer = this.drawer === panel.id ? null : panel.id;
+            if (this.drawer === panel.id) {
+                this.activate(panel);
+                panel.setOpen(true);
+                panel.onopen?.();
+            }
+        }
+        else {
+            if (!panel.open)
+                this.activate(panel);
+            panel.setOpen(!panel.open);
+            if (!panel.open)
+                panel.onopen?.();
+        }
+    }
+    close(panel) {
+        panel.setOpen(false);
+        if (this.drawer === panel.id)
+            this.drawer = null;
+    }
+    dock(panel, side = panel.side) {
+        this.placements[panel.id] = { ...this.bounds(panel), position: side };
+        this.activate(panel);
+        this.save();
+    }
+    float(panel, bounds) {
+        this.placements[panel.id] = {
+            ...this.clamp(bounds ?? this.bounds(panel)),
+            position: 'floating'
+        };
+    }
+    bounds(panel) {
+        return this.clamp(this.placements[panel.id] ?? {
+            x: panel.side === 'left' ? 24 : this.viewportWidth - panel.width - 24,
+            y: this.top + 16,
+            width: panel.width,
+            height: Math.min(520, this.viewportHeight - this.top - this.bottom - 22)
+        });
+    }
+    clamp(bounds) {
+        const availableWidth = Math.max(1, this.viewportWidth - 32);
+        const availableHeight = Math.max(1, this.viewportHeight - this.top - this.bottom - 12);
+        const width = Math.min(availableWidth, Math.max(240, bounds.width));
+        const height = Math.min(availableHeight, Math.max(120, bounds.height));
+        return {
+            width,
+            height,
+            x: Math.max(16, Math.min(bounds.x, this.viewportWidth - width - 16)),
+            y: Math.max(this.top, Math.min(bounds.y, this.viewportHeight - height - this.bottom))
+        };
+    }
+    resizeViewport(width, height, top) {
+        this.viewportWidth = width;
+        this.viewportHeight = height;
+        this.top = top;
+        const wasCompact = this.compact;
+        this.compact = width <= PANEL_BREAKPOINT || height < PANEL_MIN_DOCK_HEIGHT;
+        if (this.compact && !wasCompact && this.panels.length > 0) {
+            const latest = this.panels.find((panel) => panel.id === this.lastActive && panel.open);
+            this.drawer = latest?.id ?? this.panels.find((panel) => panel.open)?.id ?? null;
+        }
+        for (const [id, panel] of Object.entries(this.placements)) {
+            if (panel.position === 'floating')
+                this.placements[id] = { ...this.clamp(panel), position: 'floating' };
+        }
+    }
+    dockWidth(side) {
+        const panels = this.ordered(side).filter((p) => p.open);
+        return panels.length
+            ? Math.min(Math.max(...panels.map((p) => p.width)), this.viewportWidth * 0.29)
+            : 0;
+    }
+    reset() {
+        this.placements = {};
+        this.save();
+    }
+    initialize(storage) {
+        this.#storage = storage;
+        if (!storage)
+            return;
+        try {
+            const text = storage.getItem(STORAGE_KEY);
+            if (!text)
+                return;
+            const value = JSON.parse(text);
+            if (value.version !== 1 || !value.panels || typeof value.panels !== 'object')
+                return;
+            for (const [id, panel] of Object.entries(value.panels)) {
+                if (!panel ||
+                    !['left', 'right', 'floating'].includes(panel.position) ||
+                    !['x', 'y', 'width', 'height'].every((key) => Number.isFinite(panel[key])))
+                    continue;
+                this.placements[id] = {
+                    ...this.clamp(panel),
+                    position: panel.position
+                };
+            }
+        }
+        catch {
+            this.storageError = 'Panel layout could not be restored. Reset layout to use the defaults.';
+        }
+    }
+    save() {
+        if (!this.#storage)
+            return;
+        try {
+            this.#storage.setItem(STORAGE_KEY, JSON.stringify({
+                version: 1,
+                panels: this.placements
+            }));
+            this.storageError = null;
+        }
+        catch {
+            this.storageError = 'Panel layout could not be saved. Changes last for this visit.';
+        }
+    }
+}
+export const setPanelLayout = (layout) => setContext(KEY, layout);
+export const getPanelLayout = () => {
+    const layout = getContext(KEY);
+    if (!layout)
+        throw new Error('PanelFrame requires a TellegenProvider');
+    return layout;
+};

package/dist/state.svelte.d.ts

@@ -1,14 +1,28 @@
 import type { CaseSummary, DemandDeltas, Network, NetworkBranch, NetworkBus, SensitivityColumn, Solution, SolveIteration } from './api.js';
-import { type BranchRatingDeltas, type CaseFileSummary, type DistGraph, type IngestedDistCase, type SensTarget, type Topology } from '@tellegen/engine';
+import { type StudyView, type BranchRatingDeltas, type BrowserMcPfSession, type CaseFileSummary, type DistGraph, type Formulation, type IngestedDistCase, type McPfResult, type McLoadBranchState, type McLoadPowerEdit, type McStudySnapshot, type SensTarget, type Topology } from '@tellegen/engine';
 import type { MultiView } from './multiconductor.js';
 export type SolveBackend = 'clarabel-wasm' | 'clarabel-wasm-server-sensitivity' | 'rust-server';
 /** A map framing request: a case id, 'all', or one branch to center. */
 export type FrameTarget = string | 'all' | {
     caseId: string;
     branchId: number;
+} | {
+    caseId: string;
+    busId: number;
 };
+export interface CameraSnapshot {
+    center: [number, number];
+    zoom: number;
+    bearing: number;
+    pitch: number;
+}
+export interface DiagramCameraSnapshot {
+    caseId: string;
+    center: [number, number];
+    scale: number;
+}
 export type DemandRangeMode = 'local' | 'full';
-export type DisplayMode = 'lmp' | 'angle' | 'voltage';
+export type DisplayMode = 'price' | 'angle' | 'voltage';
 /** The case a removal promoted to active, so the caller can hydrate it: a backend
  * case needs its network/solution loaded, a local needs a browser solve, and
  * `none` means nothing remains (or the removal left the active case untouched). */
@@ -34,6 +48,7 @@ export interface LocalSubstations {
 }
 type CoordsKind = 'file' | 'synthetic_pending' | 'synthetic' | 'manual' | 'geofile';
 type LocalView = {
+    coordinate_space?: 'geographic' | 'diagram';
     buses: NetworkBus[];
     branches: NetworkBranch[];
 };
@@ -42,8 +57,11 @@ export interface LocalCaseInit {
     id: string;
     label: string;
     fileName: string;
+    formulation?: Formulation;
+    declaredFormulation?: Formulation;
     summary?: CaseFileSummary | null;
-    networkJson?: string;
+    /** Retained PowerIO module used to construct solver studies. */
+    studyInputJson?: string;
     topology?: Topology;
     coordsKind?: CoordsKind;
     view?: LocalView | null;
@@ -59,10 +77,11 @@ export declare class LocalCase {
     readonly id: string;
     readonly label: string;
     readonly fileName: string;
+    readonly declaredFormulation?: Formulation;
     /** Case stats; null for a .pwd display only entry. */
     summary: CaseFileSummary | null;
-    /** Raw powerio Network JSON for the browser solver branch. */
-    networkJson: string | undefined;
+    /** Generation 2 PowerIO IR used for display edits and solver studies. */
+    studyInputJson: string | undefined;
     /** Topology for synthetic placement when the file has no coordinates. */
     topology: Topology | undefined;
     coordsKind: CoordsKind | undefined;
@@ -72,6 +91,13 @@ export declare class LocalCase {
         lon: number;
         lat: number;
     } | undefined;
+    diagram: {
+        view: LocalView;
+        layer: string;
+        name: string;
+        warnings: string[];
+    } | null;
+    displayMode: 'geographic' | 'diagram';
     geoSource: string | undefined;
     geoWarnings: string[] | undefined;
     network: Network | null;
@@ -81,8 +107,7 @@ export declare class LocalCase {
     deltas: DemandDeltas;
     /** Committed branch rating deltas (MW from base, keyed by branch). */
     ratings: BranchRatingDeltas;
-    /** The OPF formulation the browser Study solves for this case: DC OPF (default),
-     * full AC OPF, or the SOCWR relaxation. Changing it rebuilds the Study. */
+    /** The selected calculation. Changing it rebuilds the numerical Study. */
     formulation: import("@tellegen/engine").BrowserFormulation;
     iterations: SolveIteration[];
     solving: boolean;
@@ -91,6 +116,8 @@ export declare class LocalCase {
     solveFallbackReason: string | null;
     /** Monotone token: only the latest solve may write this case. */
     solveSeq: number;
+    /** Monotone generation for external optimistic concurrency. */
+    revisionGeneration: number;
     /** Monotone token: only the latest sensitivity request may write this case. */
     sensitivitySeq: number;
     predictedObjective: number | null;
@@ -104,9 +131,10 @@ export declare class LocalCase {
 export declare class CaseState {
     readonly id: string;
     readonly name: string;
+    readonly unavailableReason: string | null;
     network: Network | null;
-    /** Raw powerio Network JSON for the browser solver; fetched lazily. */
-    networkJson: string | null;
+    /** Retained PowerIO module for the browser solver; fetched lazily. */
+    studyInputJson: string | null;
     /** Boot solution at base demand; never changes. */
     baseSolution: Solution | null;
     /** Exact solution at the current committed perturbation. */
@@ -126,6 +154,8 @@ export declare class CaseState {
     solveFallbackReason: string | null;
     /** Monotone token: only the latest solve may write this case. */
     solveSeq: number;
+    /** Monotone generation for external optimistic concurrency. */
+    revisionGeneration: number;
     /** Monotone token: only the latest sensitivity request may write this case. */
     sensitivitySeq: number;
     /** Closer for this case's in-flight server solve stream, if any. Owned per
@@ -140,27 +170,39 @@ export declare class CaseState {
 /** A case the solver can run: a server-backed case or a browser-parsed local case. */
 export type SolvableCase = CaseState | LocalCase;
 /** The multiconductor ingest payload without the graph: the summary counts,
- * connected load/generation, coordinate provenance, and warnings. */
+ * connected load/generation, coordinate provenance, and diagnostics. */
 export type MultiCaseSummary = Omit<IngestedDistCase, 'graph'>;
-/** How a multiconductor case is placed on the map. `geographic` positions drop
- * straight on; `planar`/`synthetic` need a map center, so they sit `pending`
- * until the user places them. */
+/** Geographic coordinates use the map; other positions use the diagram canvas. */
 export type MultiCoordsKind = 'geographic' | 'planar' | 'synthetic';
-/** A multiconductor distribution case parsed in the browser, viewed only: no
- * formulation, no sliders, no Study. It carries the bus/terminal graph, its
- * placed map view, and the selected bus whose terminal detail expands. Fields
- * are reactive like the solvable cases so the panel and map track them. */
+/** A conductor-resolved case with retained electrical inputs and terminal results. */
 export declare class MulticonductorCase {
     readonly id: string;
     readonly label: string;
     readonly fileName: string;
+    moduleJson: string | null;
+    geoLayer: string | null;
+    geoWarnings: string[];
+    result: McPfResult | null;
+    mcSnapshot: McStudySnapshot | null;
+    mcSession: BrowserMcPfSession | null;
+    mcLoadBranches: McLoadBranchState[];
+    mcLoadEdits: McLoadPowerEdit[];
+    mcEditRevision: number;
+    mcEditRunning: boolean;
+    mcEditTimer: ReturnType<typeof setTimeout> | null;
+    mcSavedAt: string | null;
+    solving: boolean;
+    solveMs: number | null;
+    solveSeq: number;
+    revisionGeneration: number;
+    solveAbort: AbortController | null;
     /** Summary counts and coordinate provenance from the parse. */
     summary: MultiCaseSummary | null;
     /** The render-ready bus/terminal graph. */
     graph: DistGraph | null;
     /** Placement kind resolved at ingest from the case's coordinate space. */
     coordsKind: MultiCoordsKind;
-    /** The placed map view; null until placed (planar/synthetic await a center). */
+    /** The map or diagram positions. */
     view: MultiView | null;
     syntheticCenter: {
         lon: number;
@@ -181,6 +223,8 @@ export declare class MulticonductorCase {
         coordsKind: MultiCoordsKind;
         view?: MultiView | null;
     });
+    get mcPfReason(): string | null;
+    get mcPfSupported(): boolean;
     /** Whether the case is placed and ready to render. */
     get placed(): boolean;
     /** The selected bus's placed detail, or null. */
@@ -188,8 +232,30 @@ export declare class MulticonductorCase {
     /** The selected edge's placed detail, or null. */
     get selectedEdge(): import("./multiconductor.js").PlacedMultiEdge | null;
 }
+export interface StudyDisplaySnapshot {
+    id: string;
+    studyId: string;
+    caseId: string;
+    revision: number;
+    label: string;
+    formulation: Formulation;
+    network: Network;
+    solution: StudyView | null;
+    inputJson?: string;
+    baseDemandMw?: Record<string, number>;
+}
 export declare class AppState {
     #private;
+    camera: CameraSnapshot | null;
+    cameraRequest: CameraSnapshot | null;
+    cameraSeq: number;
+    diagramCamera: DiagramCameraSnapshot | null;
+    diagramCameraRequest: DiagramCameraSnapshot | null;
+    diagramCameraSeq: number;
+    requestDiagramCamera(caseId: string, snapshot: Omit<DiagramCameraSnapshot, 'caseId'>): void;
+    requestCamera(snapshot: CameraSnapshot): void;
+    /** Saved Study inspection is independent of the editable case and its solution. */
+    studyView: StudyDisplaySnapshot | null;
     cases: CaseState[];
     activeCaseId: string | null;
     /** Selected bus in the active case. */
@@ -200,21 +266,22 @@ export declare class AppState {
     previewDeltaMw: number | null;
     /** Live rating slider value (MW from base) before commit; null when idle. */
     previewRatingMw: number | null;
-    /** True while the demand control should keep the map in LMP preview mode. */
+    /** True while the demand control should keep the map in nodal value preview mode. */
     previewActive: boolean;
-    /** Engine first-order LMP preview for the live drag: predicted change in LMP
-     * ($/MWh) per bus at the previewed edit, scoped to the case and selection
+    /** Engine first order nodal value preview for the live drag, scoped to the case and selection
      * target (bus or branch) it was computed for. Set by the Study path; null when
      * no Study preview applies (the map then falls back to the JS
      * sensitivity-times-step preview). Reassigned wholesale, so $state.raw. */
-    previewLmp: {
+    previewPrices: {
         caseId: string;
         target: SensTarget;
         delta: Map<number, number>;
+        units: string;
     } | null;
     demandRangeMode: DemandRangeMode;
     displayMode: DisplayMode;
     sensitivityLoading: boolean;
+    errorRevision: number;
     /** Re-runs the operation behind the current `error`, when one applies. Every
      * write to `error` clears it, so a retry op can never outlive its message. */
     errorRetry: (() => void) | null;
@@ -225,7 +292,7 @@ export declare class AppState {
     /** Local case the panel shows; clicking a bundled case or a bus clears it. */
     activeLocalId: string | null;
     placingLocalId: string | null;
-    /** Multiconductor distribution cases parsed in the browser (viewing only). */
+    /** Multiconductor cases with retained inputs and AC power flow results. */
     multiCases: MulticonductorCase[];
     /** Multiconductor case the panel shows; mutually exclusive with the solvable
      * active ids. */