nudge-ui 0.2.4 → 0.2.6

package/dist/inspector/drafts/model.d.ts

@@ -1,12 +1,19 @@
-import type { DraftContents } from "../changes/draftChanges.js";
-export type DraftTarget = {
+import type { ChangeRecord } from "../changes/types.js";
+import type { StructuralChange } from "../changes/structuralTypes.js";
+export interface DraftContents {
+    readonly changes: readonly ChangeRecord[];
+    readonly structuralChanges: readonly StructuralChange[];
+}
+export interface ApplicationTarget {
     readonly kind: "application";
     readonly route: string;
-} | {
+}
+export interface HtmlTarget {
     readonly kind: "html";
     readonly artifactId: string;
     readonly path: string;
-};
+}
+export type DraftTarget = ApplicationTarget | HtmlTarget;
 /** A draft's ID is its target key, so every frame showing the same page or iteration edits one draft. */
 export interface Draft {
     readonly id: string;
@@ -19,16 +26,9 @@ export interface DraftSnapshot {
     readonly projectId: string;
     readonly drafts: readonly Draft[];
 }
-export declare function applicationTarget(url?: string): {
-    kind: "application";
-    route: string;
-};
-export declare function htmlTarget(artifactId: string): {
-    kind: "html";
-    artifactId: string;
-    path: string;
-};
-/** Maps a captured document URL to the draft that owns it: an iteration preview or an application page. */
+export declare function applicationTarget(url?: string): ApplicationTarget;
+export declare function htmlTarget(artifactId: string): HtmlTarget;
+export declare function artifactIdFromUrl(url: string): string | null;
 export declare function documentTarget(url: string): DraftTarget;
 export declare function targetKey(target: DraftTarget): string;
 export declare function targetFromKey(key: string): DraftTarget | null;

package/dist/inspector/drafts/model.js

@@ -10,9 +10,11 @@ export function applicationTarget(url = window.location.href) {
 export function htmlTarget(artifactId) {
     return { kind: "html", artifactId, path: `.nudge/artifacts/${artifactId}/document.html` };
 }
-/** Maps a captured document URL to the draft that owns it: an iteration preview or an application page. */
+export function artifactIdFromUrl(url) {
+    return ARTIFACT_PATH.exec(new URL(url, window.location.href).pathname)?.[1] ?? null;
+}
 export function documentTarget(url) {
-    const artifactId = ARTIFACT_PATH.exec(new URL(url, window.location.href).pathname)?.[1];
+    const artifactId = artifactIdFromUrl(url);
     return artifactId ? htmlTarget(artifactId) : applicationTarget(url);
 }
 export function targetKey(target) {

package/dist/inspector/drafts/store.d.ts

@@ -1,28 +1,59 @@
 import { type FrameContent } from "../canvas/frameContent.js";
-import { type DraftContents } from "../changes/draftChanges.js";
+import type { ChangeRecord } from "../changes/types.js";
+import type { StructuralChange } from "../changes/structuralTypes.js";
+import type { StyleRule } from "../projection/managedStylesheet.js";
 import type { SketchDocument } from "../sketch/model.js";
-import { type Draft, type DraftSnapshot } from "./model.js";
+import { type CommitResult, type DraftChangesSnapshot } from "./draftStore.js";
+import { type Draft, type DraftContents, type DraftSnapshot } from "./model.js";
+export declare function getActiveDraftChanges(): DraftChangesSnapshot;
+export declare function subscribeActiveDraftChanges(listener: () => void): () => void;
+export declare function getDraftChanges(id: string): DraftChangesSnapshot;
+export declare function listDraftIds(): readonly string[];
+export declare function getDraft(id: string): Draft | null;
+export declare function getDraftsSnapshot(): DraftSnapshot;
+export declare function subscribeDrafts(listener: () => void): () => void;
+export declare function useDrafts(): DraftSnapshot;
+export declare function canEditDraft(id?: string): boolean;
+export declare function isDraftLocked(id?: string): boolean;
+export declare function lockDraft(id: string): () => void;
+export declare function useChanges(): ChangeRecord[];
+export declare function getChangesList(): ChangeRecord[];
+export declare function getPendingRules(): StyleRule[];
+export interface AppendChangesOptions {
+    /** The rendered target captured for each change key at commit time. */
+    verificationTargets?: ReadonlyMap<string, HTMLElement | null>;
+}
+export declare function appendChanges(incoming: readonly ChangeRecord[], options?: AppendChangesOptions): CommitResult;
+export declare function appendChange(change: ChangeRecord): CommitResult;
+export declare function revertChange(change: ChangeRecord): void;
+export declare function discardChangesForSelector(selector: string): void;
+export declare function discardChangesForInstanceOverride(overrideId: string): void;
+export declare function commitStructuralChange(change: StructuralChange): boolean;
+export declare function revertStructuralChange(changeId: string): boolean;
+/** Replaces ordinary and structural intent as one undoable edit. */
+export declare function commitDraftContents(changes: readonly ChangeRecord[], structuralChanges: readonly StructuralChange[]): boolean;
+export declare function undo(): boolean;
+export declare function redo(): boolean;
+/** Removes only source-verified records, and older undo snapshots must not resurrect their previews. */
+export declare function reconcileDraftChanges(id: string, verifiedKeys: ReadonlySet<string>, verifiedStructuralIds: ReadonlySet<string>): number;
+/** Clears the active draft and its edit steps, preserving other session history. */
+export declare function clearActiveDraft(): void;
+export declare function forgetDraft(id: string): void;
+export declare function loadDrafts(projectId: string, options?: {
+    persistent?: boolean;
+}): void;
+export declare function persistDrafts(): void;
+/** Discards stored and in-memory drafts for the current project. */
+export declare function clearDrafts(): void;
+export declare function resetDrafts(): void;
 export declare function draftIdForContent(content: FrameContent): string;
 export declare function draftIdForCard(cardId: string): string | null;
-export declare function sketchOwner(document: SketchDocument): string | null;
-export declare function getDraft(id: string): Draft | null;
 export declare function getDraftForCard(cardId: string): Draft | null;
 export declare function getDraftContentsForCard(cardId: string): DraftContents | null;
-export declare function persistDrafts(): void;
-/** Replaces every in-memory draft with the stored drafts, so a tab that takes over never writes stale edits. */
-export declare function loadDrafts(nextProjectId: string, options?: {
-    persistent?: boolean;
-}): void;
 export declare function activateDraftForCard(cardId: string): void;
 export declare function activateDraft(draftId: string, preferredCardId?: string): void;
 export declare function clearSavedIterationDraft(cardId: string, expectedRevision?: number): boolean;
-/** Returns the first preferred frame that exists, then the first frame. */
 export declare function getEditableCardId(...preferredCardIds: readonly (string | null | undefined)[]): string | null;
+export declare function sketchOwner(document: SketchDocument): string | null;
 export declare function assignSketchToDraft(draftId: string, sketchId: string): void;
 export declare function sketchBelongsToCard(document: SketchDocument, cardId: string | null): boolean;
-export declare function subscribeDrafts(listener: () => void): () => void;
-export declare function getDraftsSnapshot(): DraftSnapshot;
-export declare function useDrafts(): DraftSnapshot;
-/** Discards stored and in-memory drafts for the current project. */
-export declare function clearDrafts(): void;
-export declare function resetDrafts(): void;

package/dist/inspector/drafts/store.js

@@ -1,28 +1,136 @@
+import { inspectorStorage } from "../runtime/inspectorStorage.js";
 import { useSyncExternalStore } from "react";
 import { getCanvasCards, selectCard, focusCanvasCards, activateIframeWorkspace } from "../canvas/canvasStore.js";
 import { contentEditTarget } from "../canvas/frameContent.js";
-import { deserializeChange, isSerializableChange, serializeChange, } from "../changes/codecs.js";
-import { getActiveDraftChanges, getDraftChanges, restoreDraftChanges, subscribeDraftChanges, setActiveDraft, clearDraftChanges, listDraftIds, resetDraftChanges, } from "../changes/draftChanges.js";
-import { refreshDraftPreview } from "../changes/changesLog.js";
-import { isStructuralChange } from "../projection/structuralProjection.js";
 import { canWriteWorkspace } from "../canvas/workspaceLease.js";
+import { createDraftPreview } from "../changes/draftPreview.js";
+import { buildManagedStyleRules } from "../changes/managedStyleProjection.js";
+import { cancelInlineTextForClear } from "../inline-text/inlineTextLifecycle.js";
 import { getSketchStoreSnapshot, subscribeSketchStore } from "../sketch/store.js";
-import { documentTarget, isDraftTarget, targetFromKey, targetKey } from "./model.js";
-let projectId = "";
-let persistent = true;
-/** Overrides the capture-URL owner for sketches drawn while another draft was active. */
-const sketchOwners = new Map();
+import { sessionTimeline } from "../workspace/timeline.js";
+import { createDraftStore } from "./draftStore.js";
+import { targetFromKey, targetKey } from "./model.js";
+const preview = createDraftPreview(() => drafts.getActive());
+const drafts = createDraftStore({
+    canWrite: () => canWriteWorkspace(),
+    timeline: sessionTimeline,
+    storage: {
+        read: (key) => inspectorStorage()?.getItem(key) ?? null,
+        write: (key, value) => inspectorStorage()?.setItem(key, value),
+        remove: (key) => inspectorStorage()?.removeItem(key),
+    },
+    sketches: { getSnapshot: () => getSketchStoreSnapshot(), subscribe: (listener) => subscribeSketchStore(listener) },
+    revealDraft: (draftId, cardId) => revealDraft(draftId, cardId),
+    project: (snapshot, event) => preview.project(snapshot, event),
+});
 const contentDrafts = new WeakMap();
-const listeners = new Set();
-let snapshot = null;
-function publish() {
-    snapshot = null;
-    for (const listener of listeners)
-        listener();
-}
-subscribeDraftChanges(publish);
-subscribeSketchStore(publish);
-function storageKey() { return `nudge-ui-drafts:${projectId}:v2`; }
+export function getActiveDraftChanges() {
+    return drafts.getActive();
+}
+export function subscribeActiveDraftChanges(listener) {
+    return drafts.subscribeActive(listener);
+}
+export function getDraftChanges(id) {
+    return drafts.get(id);
+}
+export function listDraftIds() {
+    return drafts.ids();
+}
+export function getDraft(id) {
+    return drafts.getDraft(id);
+}
+export function getDraftsSnapshot() {
+    return drafts.getSnapshot();
+}
+export function subscribeDrafts(listener) {
+    return drafts.subscribe(listener);
+}
+export function useDrafts() {
+    return useSyncExternalStore(subscribeDrafts, getDraftsSnapshot, getDraftsSnapshot);
+}
+export function canEditDraft(id) {
+    return drafts.canEdit(id);
+}
+export function isDraftLocked(id) {
+    return drafts.isLocked(id);
+}
+export function lockDraft(id) {
+    return drafts.lock(id);
+}
+function activeChanges() {
+    // SAFETY: The public change model is the concrete record union stored by
+    // the workspace snapshot; React consumers keep the mutable array type.
+    return drafts.getActive().changes;
+}
+export function useChanges() {
+    return useSyncExternalStore(subscribeActiveDraftChanges, activeChanges, activeChanges);
+}
+export function getChangesList() {
+    return [...activeChanges()];
+}
+export function getPendingRules() {
+    return buildManagedStyleRules(activeChanges());
+}
+export function appendChanges(incoming, options = {}) {
+    return drafts.commitChanges(incoming, options.verificationTargets);
+}
+export function appendChange(change) {
+    return drafts.commitChanges([change]);
+}
+export function revertChange(change) {
+    drafts.revertChange(change);
+}
+export function discardChangesForSelector(selector) {
+    drafts.discardChanges({ kind: "selector", selector });
+}
+export function discardChangesForInstanceOverride(overrideId) {
+    drafts.discardChanges({ kind: "instance-override", id: overrideId });
+}
+export function commitStructuralChange(change) {
+    return drafts.commitStructuralChange(change);
+}
+export function revertStructuralChange(changeId) {
+    return drafts.revertStructuralChange(changeId);
+}
+/** Replaces ordinary and structural intent as one undoable edit. */
+export function commitDraftContents(changes, structuralChanges) {
+    return drafts.commitContents({ changes, structuralChanges });
+}
+export function undo() {
+    return drafts.undo();
+}
+export function redo() {
+    return drafts.redo();
+}
+/** Removes only source-verified records, and older undo snapshots must not resurrect their previews. */
+export function reconcileDraftChanges(id, verifiedKeys, verifiedStructuralIds) {
+    return drafts.reconcile(id, verifiedKeys, verifiedStructuralIds);
+}
+/** Clears the active draft and its edit steps, preserving other session history. */
+export function clearActiveDraft() {
+    if (!drafts.canEdit())
+        return;
+    // A pending blur/composition timer must not be able to append a draft after
+    // the canonical set has been cleared.
+    cancelInlineTextForClear();
+    drafts.clearActive();
+}
+export function forgetDraft(id) {
+    drafts.forget(id);
+}
+export function loadDrafts(projectId, options = {}) {
+    drafts.load(projectId, options);
+}
+export function persistDrafts() {
+    drafts.persist();
+}
+/** Discards stored and in-memory drafts for the current project. */
+export function clearDrafts() {
+    drafts.discardAll();
+}
+export function resetDrafts() {
+    drafts.reset();
+}
 export function draftIdForContent(content) {
     let id = contentDrafts.get(content);
     if (id === undefined) {
@@ -35,116 +143,12 @@ export function draftIdForCard(cardId) {
     const card = getCanvasCards().find((candidate) => candidate.id === cardId);
     return card ? draftIdForContent(card.content) : null;
 }
-export function sketchOwner(document) {
-    const owner = sketchOwners.get(document.id);
-    if (owner)
-        return owner;
-    try {
-        return targetKey(documentTarget(document.capture.url));
-    }
-    catch {
-        return null;
-    }
-}
-function readDraft(id, target) {
-    const workspace = getDraftChanges(id);
-    return {
-        id,
-        target,
-        revision: workspace.revision,
-        contents: { changes: workspace.changes, structuralChanges: workspace.structuralChanges },
-        sketchIds: getSketchStoreSnapshot().documents.filter((document) => sketchOwner(document) === id).map((document) => document.id),
-    };
-}
-export function getDraft(id) {
-    const target = targetFromKey(id);
-    return target ? readDraft(id, target) : null;
-}
 export function getDraftForCard(cardId) {
     const id = draftIdForCard(cardId);
-    return id ? getDraft(id) : null;
+    return id ? drafts.getDraft(id) : null;
 }
 export function getDraftContentsForCard(cardId) {
-    const draft = getDraftForCard(cardId);
-    return draft ? { changes: draft.contents.changes, structuralChanges: draft.contents.structuralChanges } : null;
-}
-export function persistDrafts() {
-    if (!projectId || !persistent || !canWriteWorkspace())
-        return;
-    const sketches = getSketchStoreSnapshot();
-    const liveSketches = new Set(sketches.documents.map((document) => document.id));
-    const value = {
-        schemaVersion: 2, projectId,
-        drafts: listDraftIds().flatMap((id) => {
-            const target = targetFromKey(id);
-            const workspace = getDraftChanges(id);
-            if (!target || workspace.changes.length + workspace.structuralChanges.length === 0)
-                return [];
-            return [{
-                    target,
-                    revision: workspace.revision,
-                    contents: {
-                        changes: workspace.changes.flatMap((change) => {
-                            const serialized = serializeChange(change);
-                            return serialized ? [serialized] : [];
-                        }),
-                        structuralChanges: workspace.structuralChanges,
-                    },
-                }];
-        }),
-        sketchOwners: Object.fromEntries([...sketchOwners].filter(([id]) => !sketches.ready || liveSketches.has(id))),
-    };
-    try {
-        localStorage.setItem(storageKey(), JSON.stringify(value));
-    }
-    catch {
-        return;
-    }
-}
-function validPersisted(value) {
-    if (!value || typeof value !== "object")
-        return false;
-    const candidate = value;
-    if (candidate.schemaVersion !== 2 || candidate.projectId !== projectId || !Array.isArray(candidate.drafts))
-        return false;
-    const targets = new Set();
-    for (const draft of candidate.drafts) {
-        if (!draft || !isDraftTarget(draft.target) || targets.has(targetKey(draft.target))
-            || !Number.isSafeInteger(draft.revision) || draft.revision < 1
-            || !draft.contents || !Array.isArray(draft.contents.changes) || !draft.contents.changes.every(isSerializableChange)
-            || !Array.isArray(draft.contents.structuralChanges) || !draft.contents.structuralChanges.every(isStructuralChange))
-            return false;
-        const textIds = draft.contents.changes.filter((change) => change.kind === "text-content").map((change) => "id" in change ? change.id : "");
-        if (new Set(textIds).size !== textIds.length)
-            return false;
-        targets.add(targetKey(draft.target));
-    }
-    return !!candidate.sketchOwners && typeof candidate.sketchOwners === "object" && !Array.isArray(candidate.sketchOwners)
-        && Object.values(candidate.sketchOwners).every((id) => typeof id === "string" && targetFromKey(id) !== null);
-}
-/** Replaces every in-memory draft with the stored drafts, so a tab that takes over never writes stale edits. */
-export function loadDrafts(nextProjectId, options = {}) {
-    projectId = nextProjectId;
-    persistent = options.persistent ?? true;
-    sketchOwners.clear();
-    resetDraftChanges();
-    try {
-        const raw = persistent ? localStorage.getItem(storageKey()) : null;
-        const stored = raw ? JSON.parse(raw) : null;
-        if (validPersisted(stored)) {
-            for (const draft of stored.drafts) {
-                restoreDraftChanges(targetKey(draft.target), { changes: draft.contents.changes.map(deserializeChange), structuralChanges: draft.contents.structuralChanges }, draft.revision);
-            }
-            for (const [sketchId, draftId] of Object.entries(stored.sketchOwners))
-                sketchOwners.set(sketchId, draftId);
-        }
-    }
-    catch {
-        resetDraftChanges();
-        sketchOwners.clear();
-    }
-    publish();
-    refreshDraftPreview();
+    return getDraftForCard(cardId)?.contents ?? null;
 }
 export function activateDraftForCard(cardId) {
     const draftId = draftIdForCard(cardId);
@@ -152,10 +156,7 @@ export function activateDraftForCard(cardId) {
         activateDraft(draftId, cardId);
 }
 export function activateDraft(draftId, preferredCardId) {
-    const previous = getActiveDraftChanges().draftId;
-    setActiveDraft(draftId, () => revealDraft(draftId, preferredCardId));
-    if (previous !== draftId)
-        refreshDraftPreview();
+    drafts.activate(draftId, preferredCardId);
 }
 function revealDraft(draftId, preferredCardId) {
     const cards = getCanvasCards();
@@ -177,55 +178,21 @@ function revealDraft(draftId, preferredCardId) {
 }
 export function clearSavedIterationDraft(cardId, expectedRevision) {
     const draftId = draftIdForCard(cardId);
-    return !!draftId && clearDraftChanges(draftId, expectedRevision);
+    return !!draftId && drafts.clear(draftId, expectedRevision);
 }
-/** Returns the first preferred frame that exists, then the first frame. */
 export function getEditableCardId(...preferredCardIds) {
     const cards = getCanvasCards();
     return preferredCardIds.find((id) => !!id && cards.some((card) => card.id === id)) ?? cards[0]?.id ?? null;
 }
+export function sketchOwner(document) {
+    return drafts.sketchOwner(document);
+}
 export function assignSketchToDraft(draftId, sketchId) {
-    if (sketchOwners.get(sketchId) === draftId || !targetFromKey(draftId))
-        return;
-    sketchOwners.set(sketchId, draftId);
-    publish();
+    drafts.assignSketch(draftId, sketchId);
 }
 export function sketchBelongsToCard(document, cardId) {
-    if (!projectId || !cardId)
+    if (!drafts.getSnapshot().projectId || !cardId)
         return true;
     const draftId = draftIdForCard(cardId);
-    return !!draftId && sketchOwner(document) === draftId;
-}
-export function subscribeDrafts(listener) {
-    listeners.add(listener);
-    return () => listeners.delete(listener);
-}
-export function getDraftsSnapshot() {
-    if (!snapshot) {
-        const ids = new Set([...listDraftIds(), ...getSketchStoreSnapshot().documents.flatMap((document) => sketchOwner(document) ?? [])]);
-        snapshot = { projectId, drafts: [...ids].flatMap((id) => getDraft(id) ?? []) };
-    }
-    return snapshot;
-}
-export function useDrafts() { return useSyncExternalStore(subscribeDrafts, getDraftsSnapshot, getDraftsSnapshot); }
-/** Discards stored and in-memory drafts for the current project. */
-export function clearDrafts() {
-    if (projectId && persistent && canWriteWorkspace()) {
-        try {
-            localStorage.removeItem(storageKey());
-        }
-        catch {
-            return;
-        }
-    }
-    sketchOwners.clear();
-    resetDraftChanges();
-    publish();
-}
-export function resetDrafts() {
-    projectId = "";
-    persistent = true;
-    sketchOwners.clear();
-    resetDraftChanges();
-    publish();
+    return !!draftId && drafts.sketchOwner(document) === draftId;
 }

package/dist/inspector/editScope.d.ts

@@ -1,4 +1,3 @@
 export declare const EDIT_SCOPES: readonly ["source-site", "rendered-instance"];
 export type EditScope = (typeof EDIT_SCOPES)[number];
-/** Returns whether a host value names a supported edit scope. */
 export declare function isEditScope(value: unknown): value is EditScope;

package/dist/inspector/editScope.js

@@ -1,5 +1,4 @@
 export const EDIT_SCOPES = ["source-site", "rendered-instance"];
-/** Returns whether a host value names a supported edit scope. */
 export function isEditScope(value) {
     return EDIT_SCOPES.some((scope) => scope === value);
 }

package/dist/inspector/index.d.ts

@@ -1,8 +1,6 @@
+export { bootstrapNudgeUi, mountInspector, unmountInspector } from "./boot.js";
 export { resolveNudgeUiClientEntry } from "../transport/editor.js";
-export declare function bootstrapNudgeUi(inspectorHost: HTMLElement): void;
-export declare function mountInspector(host: HTMLElement): void;
-export declare function unmountInspector(): void;
-export { toggleInspector, setInspectorOpen } from "./shell/InspectorShell.js";
+export { toggleInspector, setInspectorOpen } from "./shell/openStore.js";
 export { InspectorShell } from "./shell/InspectorShell.js";
 export { detectFramework } from "./prompt/detectFramework.js";
 export { installStaticHtmlRuntimeIdentity, isRuntimeGeneratedSource, RUNTIME_ELEMENT_CID_PREFIX, RUNTIME_UNKNOWN_SOURCE_PREFIX, } from "./runtime/staticHtmlRuntimeIdentity.js";