@xenosystem/blocks 0.12.2 → 0.12.4

package/dist/edit/index.d.ts

@@ -1361,7 +1361,14 @@ declare class InspectorPanelController {
  * components cannot cross a sandbox RPC boundary, so a sandboxed host simply cannot supply them and
  * `type:'custom'` fields degrade to their JSON representation (union spec §1.1).
  */
-type CreateInspectorPanelOptions = InspectorPanelControllerOptions;
+interface CreateInspectorPanelOptions extends InspectorPanelControllerOptions {
+    /**
+     * Draw the panel yourself — a host that mounts the block AS ITS DECLARATION renders
+     * `INSPECTOR_DECLARATION` from `inspectorViewState(controller)` with `inspectorRuntimeComponents(controller)`
+     * in its registry and applies `ui` intents with `applyInspectorUi`. Default: the code view.
+     */
+    render?: (root: HTMLElement, controller: InspectorPanelController) => () => void;
+}
 /**
  * Build the Inspector panel module.
  *
@@ -1608,7 +1615,7 @@ declare function inspectorViewState(c: InspectorPanelController): InspectorViewS
 /** Apply a `ui` intent to the controller — the runtime's half of the contract. */
 declare function applyInspectorUi(c: InspectorPanelController, intent: InspectorUiIntent): void;
 declare const inspectorViewManifest: PanelManifest;
-declare const BEHAVIOURS: {
+declare const BEHAVIOURS$1: {
     'edit/inspectorPanelView': (inputs: Record<string, unknown>) => InspectorViewState;
 };
 declare const INSPECTOR_DECLARATION: BlockDeclaration;
@@ -1976,7 +1983,14 @@ declare class HistoryPanelController {
  */
 
 /** Options for {@link createHistoryPanel}. */
-type CreateHistoryPanelOptions = HistoryPanelControllerOptions;
+interface CreateHistoryPanelOptions extends HistoryPanelControllerOptions {
+    /**
+     * Draw the panel yourself — a host that mounts the block AS ITS DECLARATION renders
+     * `HISTORY_DECLARATION` from `historyViewState(controller)` with `historyRuntimeComponents(controller)`
+     * in its registry and applies `ui` intents with `applyHistoryUi`. Default: the code view.
+     */
+    render?: (root: HTMLElement, controller: HistoryPanelController) => () => void;
+}
 /**
  * Build the History panel module.
  *
@@ -2098,10 +2112,10 @@ declare function resolveIconName(kind: string | undefined, hostMap?: Record<stri
  * `useSyncExternalStore` and forwards interactions. No projection logic, no intent construction and
  * no virtualization math live here.
  *
- * Rendered over the chrome family: a `Toolbar` of undo/redo/search/count/clear, an `InlineConfirm`
- * for clearing, a `ScrollArea` the virtualizer measures, a `VirtualWindow` of `Row`s (the current
- * row `selected`, the keyboard row `focused`, future entries `struck` — Photoshop's affordance),
- * and a `StatusBar` for memory. The window math and the keyboard model stay in the controller.
+ * Drawn from the SAME view state as `HISTORY_DECLARATION` (`historyViewState(controller)`) — the
+ * declaration test holds the two byte-identical. The window math and the keyboard model stay in the
+ * controller; the scroller (`HistoryScroller`) is the one runtime-bound unit: the element the
+ * virtualizer measures, whose scrollTop the controller mirrors, the keys listen on.
  *
  * @module
  */
@@ -2111,6 +2125,109 @@ interface HistoryPanelViewProps {
     controller: HistoryPanelController;
 }
 declare function HistoryPanelView({ controller }: HistoryPanelViewProps): ReactElement;
+/**
+ * The units the runtime registers for `HISTORY_DECLARATION`, bound to ITS controller: the scroller,
+ * the cancel button, and the glyphs.
+ */
+declare function historyRuntimeComponents(controller: HistoryPanelController): Record<string, React.ComponentType<any>>;
+
+/**
+ * The history panel AS A DECLARATION — the sixth block written the §8d way (auth gate, agent, account,
+ * transport, inspector, history), and the first virtualized list.
+ *
+ * Presentation contract: input `view` (a {@link HistoryViewState} the runtime derives from the
+ * controller on every draw — the window already computed, every row flag decided), output `ui`
+ * (a {@link HistoryUiIntent}) applied by the runtime to the controller's own methods. The declaration
+ * composes everything a reader sees: the toolbar, the inline confirmation, the pruned note, the
+ * virtual window of rows, the empty state, the memory status bar.
+ *
+ * What a declaration cannot hold is the SCROLLER: the element the virtualizer measures, whose
+ * `scrollTop` the controller mirrors, the keyboard model listens on. That is `history/Scroller`, a
+ * unit the runtime registers bound to its controller ({@link historyRuntimeComponents}) — the same
+ * shape as the inspector's cell. The rows inside it are data.
+ */
+
+interface HistoryViewRow {
+    key: string;
+    entryId: string | null;
+    label: string;
+    meta?: number;
+    current: boolean;
+    future: boolean;
+    focused: boolean;
+    jumpable: boolean;
+    showIcon: boolean;
+    hideIcon: boolean;
+    iconName: string;
+    pending: boolean;
+    failed: boolean;
+    showSource: boolean;
+    sourceGlyph: string;
+    sourceTitle: string;
+    showCoalesced: boolean;
+    coalescedText: string;
+    coalescedTitle: string;
+    showTime: boolean;
+    time: string;
+    height: number;
+    cancelId?: string;
+}
+interface HistoryViewState {
+    canUndo: boolean;
+    canRedo: boolean;
+    cannotUndo: boolean;
+    cannotRedo: boolean;
+    searchShown: boolean;
+    filter: string;
+    counter: string;
+    clearAllowed: boolean;
+    confirmingClear: boolean;
+    pruned: boolean;
+    totalHeight: number;
+    offsetTop: number;
+    rows: HistoryViewRow[];
+    empty: boolean;
+    hasMemory: boolean;
+    memoryText: string;
+    memoryDisk?: string;
+}
+type HistoryUiIntent = {
+    kind: 'undo';
+} | {
+    kind: 'redo';
+} | {
+    kind: 'filter';
+    value: string;
+} | {
+    kind: 'requestClear';
+} | {
+    kind: 'confirmClear';
+} | {
+    kind: 'cancelClear';
+} | {
+    kind: 'jump';
+    entryId: string | null;
+} | {
+    kind: 'hover';
+    entryId: string | null;
+} | {
+    kind: 'contextMenu';
+    entryId: string | null;
+    x: number;
+    y: number;
+} | {
+    kind: 'cancelPending';
+    entryId?: string;
+};
+/** Derive the view state from the live controller — the runtime calls this on every draw. */
+declare function historyViewState(c: HistoryPanelController): HistoryViewState;
+/** Apply a `ui` intent to the controller — the runtime's half of the contract. */
+declare function applyHistoryUi(c: HistoryPanelController, intent: HistoryUiIntent): void;
+declare const historyViewManifest: PanelManifest;
+declare const BEHAVIOURS: {
+    'edit/historyPanelView': (inputs: Record<string, unknown>) => HistoryViewState;
+};
+declare const HISTORY_DECLARATION: BlockDeclaration;
 
 /**
  * Internal color math for `@xenosystem/blocks/edit`.
@@ -6610,4 +6727,4 @@ declare function TreeIcon({ name, size }: {
     size?: number;
 }): ReactNode;
 
-export { type BlendModeGroup, type BlendModeOption, type Box, COLOR_SPACES, COMMENTS_PANEL_ID, CURVE_PANEL_ID, type ChannelId, ColorPanelController, type ColorPanelControllerOptions, type ColorPanelSerialized, ColorPanelView, type ColorPanelViewProps, type ColorSpace, type ColorStopSink, type ColorToken, CommentsController, type CommentsControllerOptions, type CommentsHostBridge, type CommentsPanelState, CommentsPanelView, type CommentsPanelViewProps, type CommentsRenderContext, type CommentsThreadView, type CommentsViewState, type ConnectRules, type ConnectVerdict, type CreateColorPanelOptions, type CreateCommentsPanelOptions, type CreateCurvePanelOptions, type CreateFindPanelOptions, type CreateHistoryPanelOptions, type CreateInspectorPanelOptions, type CreateLayersPanelOptions, type CreateNodeGraphPanelOptions, type CreateTreePanelOptions, type CreateViewportPanelOptions, CurveController, type CurveControllerOptions, type CurveDragKind, type CurveDragState, type CurveHostBridge, type CurvePanelState, CurvePanelView, type CurvePanelViewProps, type CurvePreview, type CurveRenderConfig, type CurveRenderContext, type CurveViewState, DEFAULT_BLEND_MODES, DEFAULT_CURVE_ZOOM, DEFAULT_GRAPH_ZOOM, DEFAULT_ICON_MAP, DEFAULT_ORIGINAL_LABEL, type DropInput, EASING_PRESETS, EDIT_SPACES, EMPTY_HISTORY, EMPTY_SCHEMA, EMPTY_TREE, EMPTY_TREE_SOURCE, FIND_PANEL_ID, FindController, type FindControllerOptions, type FindHostBridge, type FindPanelState, FindPanelView, type FindPanelViewProps, type FindRenderContext, type FindViewState, type FlatRow, type FlattenOptions, GENERIC_ICON, GraphController, type GraphControllerOptions, type GraphDragKind, type GraphDragState, type GraphHostBridge, type GraphPanelState, type GraphPreview, type GraphRenderConfig, type GraphRenderContext, type GraphViewState, type HistoryKeyEvent, HistoryPanelController, type HistoryPanelControllerOptions, type HistoryPanelSerialized, HistoryPanelView, type HistoryPanelViewProps, type ProjectOptions as HistoryProjectOptions, type HistoryRow, type Hsl, type Hsv, IMPLEMENTED_TREE_MODES, BEHAVIOURS as INSPECTOR_BEHAVIOURS, INSPECTOR_DECLARATION, type InspectorKeyEvent, InspectorPanelController, type InspectorPanelControllerOptions, type InspectorPanelSerialized, InspectorPanelView, type InspectorPanelViewProps, type ProjectOptions$1 as InspectorProjectOptions, type InspectorUiIntent, type InspectorViewField, type InspectorViewSection, type InspectorViewState, LAYER_COLUMNS, type LayerColumn, type LayersKeyEvent, LayersPanelController, type LayersPanelControllerOptions, type LayersPanelSerialized, LayersPanelView, type LayersPanelViewProps, MIXED, NODEGRAPH_PANEL_ID, NodeGraphPanelView, type NodeGraphPanelViewProps, type NumericConstraints, type OklchDisplay, type ParseResult, type ProjectedSection, type Rgba, type ScrubOptions, type SelectMods, TREE_PANEL_ID, type TangentEdit, Thumbnail, type ThumbnailProps, TreeController, type TreeControllerOptions, type TreeHostBridge, TreeIcon, type TreeKeyEvent, type TreePanelState, TreePanelView, type TreePanelViewProps, type TreeRenderContext, type TreeRow, type TreeViewState, VIEWPORT_PANEL_ID, VIEWPORT_SLOTS, VIEW_STATE_OPS, ViewportController, type ViewportControllerOptions, type ViewportHostBridge, type ViewportPanelState, ViewportPanelView, type ViewportPanelViewProps, type ViewportRenderContext, type ViewportViewState, type XenoAddMenuItem, type XenoAnchorState, type XenoColorValue, type XenoCommentAuthor, type XenoCommentFilter, type XenoCommentMessage, type XenoCommentOp, type XenoCommentReaction, type XenoCommentSort, type XenoCommentThread, type XenoCommitPolicy, type XenoContextMenuRequest, type XenoCurveChannel, type XenoCurveInterpolation, type XenoCurveKey, type XenoCurveKeyRef, type XenoCurveOp, type XenoCurvePoint, XenoCurveScale, type XenoCurveScaleGeometry, type XenoCurveScaleState, type XenoCurveSelection, type XenoCurveSet, type XenoCurveViewport, type XenoCurveZoom, type XenoEasingPreset, type XenoEdge, type XenoFieldAnim, type XenoFieldFocus, type XenoFieldOption, type XenoFieldToken, type XenoFieldType, type XenoFieldValue, type XenoFindMatch, type XenoFindNavigate, type XenoFindOptions, type XenoFindQuery, type XenoFindReplace, type XenoFindResults, type XenoFindStatus, type XenoGradient, type XenoGraph, type XenoGraphOp, XenoGraphScale, type XenoGraphScaleGeometry, type XenoGraphScaleState, type XenoGraphSelection, type XenoGraphViewport, type XenoGraphZoom, type XenoHistoryEntry, type XenoHistoryIntent, type XenoHistoryMemory, type XenoHistoryOrder, type XenoHistoryScope, type XenoHistorySnapshot, type XenoHistorySource, type XenoHistoryState, type XenoHistoryStatus, type XenoInspectorEdit, type XenoInspectorField, type XenoInspectorSchema, type XenoInspectorSection, type XenoInspectorTarget, type XenoInspectorToken, type XenoKeyframeKind, type XenoLayerAdornment, type XenoLayerCap, type XenoLayerKind, type XenoLayerNode, type XenoLayerOp, type XenoLayerTree, type XenoNavigateRequest, type XenoNode, XenoNodeIndex, type XenoPort, type XenoPortDirection, type XenoPortRef, type XenoSectionAction, type XenoTangent, type XenoTangentMode, type XenoTangentSide, type XenoThreadActivate, type XenoThumbnailRequest, type XenoThumbnailResponse, type XenoTreeAction, type XenoTreeBadge, type XenoTreeCaps, type XenoTreeChildState, type XenoTreeChildrenResponse, type XenoTreeError, type XenoTreeGlyph, type XenoTreeIcon, type XenoTreeInvalidate, type XenoTreeMode, type XenoTreeModifiers, type XenoTreeNode, type XenoTreeNodeKind, type XenoTreeOp, type XenoTreeReveal, type XenoTreeSource, type XenoTreeSourceKind, type XenoTreeSourceState, type XenoViewportClient, type XenoViewportKey, type XenoViewportPointer, type XenoViewportSlot, type XenoViewportStats, type XenoViewportSurface, allFields, allIds, anchorStateOf, appliedCount, applyInspectorUi, applyPrecision, applyTangentDrag, ariaSliderProps, boxesIntersect, canConnect, canRedo, canUndo, childStateOf, clamp, clampAlpha, clampTangent, collectDescendants, colorManifest, colorPanel, commentsManifest, commentsPanel, commitPolicyOf, componentsForSpace, computeSurfaceSize, constraintsOf, countIsMeaningful, createColorPanel, createCommentsPanel, createCurvePanel, createFindPanel, createHistoryPanel, createInspectorPanel, createLayersPanel, createNodeGraphPanel, createTreePanel, createViewportPanel, createsCycle, currentRowIndex, curveManifest, curvePanel, defaultIconFor, displayOrder, distanceToEdge, easeAt, easingPreset, edgeBounds, edgeKey, edgePath, edgesToReplace, edgesTouching, evaluateChannel, fieldMatches, findField, findManifest, findPanel, findPort, findSectionOf, fitToBounds, fitValueRange, flattenVisible, focusOrder, formatAge, formatNumeric, getAncestors, graphBounds, groupMatches, hasCap, hasDraggableTangents, hasTreeCap, hexFromHsv, highlightSegments, historyManifest, historyPanel, hslToRgb, hsvFromHex, hsvToRgb, inspectorManifest, inspectorPanel, inspectorRuntimeComponents, inspectorViewManifest, inspectorViewState, interpolateSegment, isAncestorOf, isAnimated, isCollapsed, isColorSpace, isContainer, isEmptyContainer, isFieldEditable, isFieldMixed, isJumpable, isKeyEditable, isLayerColumn, isMixedValue, isOrphaned, isTreeContainer, isValidHex, isViewStateOp, keyRefId, layersManifest, layersPanel, liveEdges, makeColorValue, matchesFilter, messagesOf, mirrorTangent, nodeBounds, nodegraphManifest, nodegraphPanel, normalizeColorInput, normalizeHistoryState, normalizeKindKey, normalizeNumeric, normalizeRanges, normalizeSchema, normalizeTree, nudgeValue, oklchToRgb, parseCssColor, parseHexColor, parseNumeric, passesFilter, patternError, portHasRoom, portRefId, positionToValue, projectRows, projectSections, rangeBetween, resolveDropTarget, resolveIconName, rgbToHex, rgbToHsl, rgbToHsv, rgbToOklch, rgbaToCssHex, roundRgb, rowIndexOf, rowIndexOfEntry, safeAddColorStop, safeAddColorStops, sameKey, sampleChannel, scrubValue, segmentsAround, solveBezierT, sortThreads, surfaceChanged, tangentsForMode, tangentsToControlPoints, toViewportCoords, totalCount, treeManifest, treePanel, usesLogScale, valueExtent, valueToPosition, valuesEqual, viewportManifest, viewportPanel, visibleEdges, walkTree, wheelZoomFactor, zoomAboutCursor, zoomTimeAboutCursor, zoomValueAboutCursor };
+export { type BlendModeGroup, type BlendModeOption, type Box, COLOR_SPACES, COMMENTS_PANEL_ID, CURVE_PANEL_ID, type ChannelId, ColorPanelController, type ColorPanelControllerOptions, type ColorPanelSerialized, ColorPanelView, type ColorPanelViewProps, type ColorSpace, type ColorStopSink, type ColorToken, CommentsController, type CommentsControllerOptions, type CommentsHostBridge, type CommentsPanelState, CommentsPanelView, type CommentsPanelViewProps, type CommentsRenderContext, type CommentsThreadView, type CommentsViewState, type ConnectRules, type ConnectVerdict, type CreateColorPanelOptions, type CreateCommentsPanelOptions, type CreateCurvePanelOptions, type CreateFindPanelOptions, type CreateHistoryPanelOptions, type CreateInspectorPanelOptions, type CreateLayersPanelOptions, type CreateNodeGraphPanelOptions, type CreateTreePanelOptions, type CreateViewportPanelOptions, CurveController, type CurveControllerOptions, type CurveDragKind, type CurveDragState, type CurveHostBridge, type CurvePanelState, CurvePanelView, type CurvePanelViewProps, type CurvePreview, type CurveRenderConfig, type CurveRenderContext, type CurveViewState, DEFAULT_BLEND_MODES, DEFAULT_CURVE_ZOOM, DEFAULT_GRAPH_ZOOM, DEFAULT_ICON_MAP, DEFAULT_ORIGINAL_LABEL, type DropInput, EASING_PRESETS, EDIT_SPACES, EMPTY_HISTORY, EMPTY_SCHEMA, EMPTY_TREE, EMPTY_TREE_SOURCE, FIND_PANEL_ID, FindController, type FindControllerOptions, type FindHostBridge, type FindPanelState, FindPanelView, type FindPanelViewProps, type FindRenderContext, type FindViewState, type FlatRow, type FlattenOptions, GENERIC_ICON, GraphController, type GraphControllerOptions, type GraphDragKind, type GraphDragState, type GraphHostBridge, type GraphPanelState, type GraphPreview, type GraphRenderConfig, type GraphRenderContext, type GraphViewState, BEHAVIOURS as HISTORY_BEHAVIOURS, HISTORY_DECLARATION, type HistoryKeyEvent, HistoryPanelController, type HistoryPanelControllerOptions, type HistoryPanelSerialized, HistoryPanelView, type HistoryPanelViewProps, type ProjectOptions as HistoryProjectOptions, type HistoryRow, type HistoryUiIntent, type HistoryViewRow, type HistoryViewState, type Hsl, type Hsv, IMPLEMENTED_TREE_MODES, BEHAVIOURS$1 as INSPECTOR_BEHAVIOURS, INSPECTOR_DECLARATION, type InspectorKeyEvent, InspectorPanelController, type InspectorPanelControllerOptions, type InspectorPanelSerialized, InspectorPanelView, type InspectorPanelViewProps, type ProjectOptions$1 as InspectorProjectOptions, type InspectorUiIntent, type InspectorViewField, type InspectorViewSection, type InspectorViewState, LAYER_COLUMNS, type LayerColumn, type LayersKeyEvent, LayersPanelController, type LayersPanelControllerOptions, type LayersPanelSerialized, LayersPanelView, type LayersPanelViewProps, MIXED, NODEGRAPH_PANEL_ID, NodeGraphPanelView, type NodeGraphPanelViewProps, type NumericConstraints, type OklchDisplay, type ParseResult, type ProjectedSection, type Rgba, type ScrubOptions, type SelectMods, TREE_PANEL_ID, type TangentEdit, Thumbnail, type ThumbnailProps, TreeController, type TreeControllerOptions, type TreeHostBridge, TreeIcon, type TreeKeyEvent, type TreePanelState, TreePanelView, type TreePanelViewProps, type TreeRenderContext, type TreeRow, type TreeViewState, VIEWPORT_PANEL_ID, VIEWPORT_SLOTS, VIEW_STATE_OPS, ViewportController, type ViewportControllerOptions, type ViewportHostBridge, type ViewportPanelState, ViewportPanelView, type ViewportPanelViewProps, type ViewportRenderContext, type ViewportViewState, type XenoAddMenuItem, type XenoAnchorState, type XenoColorValue, type XenoCommentAuthor, type XenoCommentFilter, type XenoCommentMessage, type XenoCommentOp, type XenoCommentReaction, type XenoCommentSort, type XenoCommentThread, type XenoCommitPolicy, type XenoContextMenuRequest, type XenoCurveChannel, type XenoCurveInterpolation, type XenoCurveKey, type XenoCurveKeyRef, type XenoCurveOp, type XenoCurvePoint, XenoCurveScale, type XenoCurveScaleGeometry, type XenoCurveScaleState, type XenoCurveSelection, type XenoCurveSet, type XenoCurveViewport, type XenoCurveZoom, type XenoEasingPreset, type XenoEdge, type XenoFieldAnim, type XenoFieldFocus, type XenoFieldOption, type XenoFieldToken, type XenoFieldType, type XenoFieldValue, type XenoFindMatch, type XenoFindNavigate, type XenoFindOptions, type XenoFindQuery, type XenoFindReplace, type XenoFindResults, type XenoFindStatus, type XenoGradient, type XenoGraph, type XenoGraphOp, XenoGraphScale, type XenoGraphScaleGeometry, type XenoGraphScaleState, type XenoGraphSelection, type XenoGraphViewport, type XenoGraphZoom, type XenoHistoryEntry, type XenoHistoryIntent, type XenoHistoryMemory, type XenoHistoryOrder, type XenoHistoryScope, type XenoHistorySnapshot, type XenoHistorySource, type XenoHistoryState, type XenoHistoryStatus, type XenoInspectorEdit, type XenoInspectorField, type XenoInspectorSchema, type XenoInspectorSection, type XenoInspectorTarget, type XenoInspectorToken, type XenoKeyframeKind, type XenoLayerAdornment, type XenoLayerCap, type XenoLayerKind, type XenoLayerNode, type XenoLayerOp, type XenoLayerTree, type XenoNavigateRequest, type XenoNode, XenoNodeIndex, type XenoPort, type XenoPortDirection, type XenoPortRef, type XenoSectionAction, type XenoTangent, type XenoTangentMode, type XenoTangentSide, type XenoThreadActivate, type XenoThumbnailRequest, type XenoThumbnailResponse, type XenoTreeAction, type XenoTreeBadge, type XenoTreeCaps, type XenoTreeChildState, type XenoTreeChildrenResponse, type XenoTreeError, type XenoTreeGlyph, type XenoTreeIcon, type XenoTreeInvalidate, type XenoTreeMode, type XenoTreeModifiers, type XenoTreeNode, type XenoTreeNodeKind, type XenoTreeOp, type XenoTreeReveal, type XenoTreeSource, type XenoTreeSourceKind, type XenoTreeSourceState, type XenoViewportClient, type XenoViewportKey, type XenoViewportPointer, type XenoViewportSlot, type XenoViewportStats, type XenoViewportSurface, allFields, allIds, anchorStateOf, appliedCount, applyHistoryUi, applyInspectorUi, applyPrecision, applyTangentDrag, ariaSliderProps, boxesIntersect, canConnect, canRedo, canUndo, childStateOf, clamp, clampAlpha, clampTangent, collectDescendants, colorManifest, colorPanel, commentsManifest, commentsPanel, commitPolicyOf, componentsForSpace, computeSurfaceSize, constraintsOf, countIsMeaningful, createColorPanel, createCommentsPanel, createCurvePanel, createFindPanel, createHistoryPanel, createInspectorPanel, createLayersPanel, createNodeGraphPanel, createTreePanel, createViewportPanel, createsCycle, currentRowIndex, curveManifest, curvePanel, defaultIconFor, displayOrder, distanceToEdge, easeAt, easingPreset, edgeBounds, edgeKey, edgePath, edgesToReplace, edgesTouching, evaluateChannel, fieldMatches, findField, findManifest, findPanel, findPort, findSectionOf, fitToBounds, fitValueRange, flattenVisible, focusOrder, formatAge, formatNumeric, getAncestors, graphBounds, groupMatches, hasCap, hasDraggableTangents, hasTreeCap, hexFromHsv, highlightSegments, historyManifest, historyPanel, historyRuntimeComponents, historyViewManifest, historyViewState, hslToRgb, hsvFromHex, hsvToRgb, inspectorManifest, inspectorPanel, inspectorRuntimeComponents, inspectorViewManifest, inspectorViewState, interpolateSegment, isAncestorOf, isAnimated, isCollapsed, isColorSpace, isContainer, isEmptyContainer, isFieldEditable, isFieldMixed, isJumpable, isKeyEditable, isLayerColumn, isMixedValue, isOrphaned, isTreeContainer, isValidHex, isViewStateOp, keyRefId, layersManifest, layersPanel, liveEdges, makeColorValue, matchesFilter, messagesOf, mirrorTangent, nodeBounds, nodegraphManifest, nodegraphPanel, normalizeColorInput, normalizeHistoryState, normalizeKindKey, normalizeNumeric, normalizeRanges, normalizeSchema, normalizeTree, nudgeValue, oklchToRgb, parseCssColor, parseHexColor, parseNumeric, passesFilter, patternError, portHasRoom, portRefId, positionToValue, projectRows, projectSections, rangeBetween, resolveDropTarget, resolveIconName, rgbToHex, rgbToHsl, rgbToHsv, rgbToOklch, rgbaToCssHex, roundRgb, rowIndexOf, rowIndexOfEntry, safeAddColorStop, safeAddColorStops, sameKey, sampleChannel, scrubValue, segmentsAround, solveBezierT, sortThreads, surfaceChanged, tangentsForMode, tangentsToControlPoints, toViewportCoords, totalCount, treeManifest, treePanel, usesLogScale, valueExtent, valueToPosition, valuesEqual, viewportManifest, viewportPanel, visibleEdges, walkTree, wheelZoomFactor, zoomAboutCursor, zoomTimeAboutCursor, zoomValueAboutCursor };

package/dist/edit/index.js

@@ -1871,8 +1871,8 @@ function constraintsOf(field) {
     scale: field.scale
   };
 }
-function parseNumeric(text2) {
-  const trimmed = String(text2).trim();
+function parseNumeric(text3) {
+  const trimmed = String(text3).trim();
   if (trimmed.length === 0) return { ok: false, reason: "empty" };
   const match = /^[+-]?(\d+\.?\d*|\.\d+)(?:[eE][+-]?\d+)?/.exec(trimmed);
   if (!match) return { ok: false, reason: "nan" };
@@ -1897,8 +1897,8 @@ function normalizeNumeric(value, c) {
 function formatNumeric(value, field) {
   if (!Number.isFinite(value)) return "";
   const precision = field.precision;
-  const text2 = typeof precision === "number" && Number.isFinite(precision) ? value.toFixed(Math.max(0, Math.floor(precision))) : String(value);
-  return field.unit ? `${text2}${field.unit}` : text2;
+  const text3 = typeof precision === "number" && Number.isFinite(precision) ? value.toFixed(Math.max(0, Math.floor(precision))) : String(value);
+  return field.unit ? `${text3}${field.unit}` : text3;
 }
 function usesLogScale(c) {
   return c.scale === "log" && typeof c.min === "number" && typeof c.max === "number" && c.min > 0 && c.max > c.min;
@@ -2232,44 +2232,44 @@ var InspectorPanelController = class {
     if (!field || !isFieldEditable(field)) return;
     const mixed = isFieldMixed(field);
     const value = this.getFieldValue(fieldId);
-    const text2 = mixed ? "" : field.type === "number" && typeof value === "number" ? formatNumeric(value, field) : value === void 0 || value === null ? "" : String(value);
-    this.drafts.set(fieldId, { text: text2, original: value });
+    const text3 = mixed ? "" : field.type === "number" && typeof value === "number" ? formatNumeric(value, field) : value === void 0 || value === null ? "" : String(value);
+    this.drafts.set(fieldId, { text: text3, original: value });
     this.focusedFieldId = fieldId;
     this.emitFieldFocus(fieldId);
     this.notify();
   }
   /** Update the draft text (typing). Emits nothing under the `blur` policy. */
-  setDraft(fieldId, text2) {
+  setDraft(fieldId, text3) {
     const draft = this.drafts.get(fieldId);
     if (!draft) {
-      this.drafts.set(fieldId, { text: text2, original: this.getFieldValue(fieldId) });
+      this.drafts.set(fieldId, { text: text3, original: this.getFieldValue(fieldId) });
     } else {
-      draft.text = text2;
+      draft.text = text3;
     }
     const field = this.getField(fieldId);
     if (field && commitPolicyOf(field) === "live") {
-      const parsed = this.parseDraft(fieldId, text2);
+      const parsed = this.parseDraft(fieldId, text3);
       if (parsed.ok) this.emitSet(fieldId, parsed.value);
     }
     this.notify();
   }
   /** Parse a draft string into a field-appropriate value. */
-  parseDraft(fieldId, text2) {
+  parseDraft(fieldId, text3) {
     const field = this.getField(fieldId);
     if (!field) return { ok: false };
     if (field.type === "number") {
-      const parsed = parseNumeric(text2);
+      const parsed = parseNumeric(text3);
       if (!parsed.ok) return { ok: false };
       return { ok: true, value: normalizeNumeric(parsed.value, constraintsOf(field)) };
     }
     if (field.type === "json") {
       try {
-        return { ok: true, value: JSON.parse(text2) };
+        return { ok: true, value: JSON.parse(text3) };
       } catch {
         return { ok: false };
       }
     }
-    return { ok: true, value: text2 };
+    return { ok: true, value: text3 };
   }
   /**
    * Commit the draft (Enter / blur). Invalid input reverts instead of committing garbage.
@@ -3244,7 +3244,7 @@ function NumberWidget({ field, controller, component }) {
     },
     [controller, editable, field.id, component]
   );
-  const text2 = component !== void 0 ? (() => {
+  const text3 = component !== void 0 ? (() => {
     const raw = controller.getFieldValue(field.id);
     const v = Array.isArray(raw) ? raw[component] : void 0;
     return typeof v === "number" ? formatNumeric(v, field) : "";
@@ -3256,7 +3256,7 @@ function NumberWidget({ field, controller, component }) {
       Input2,
       {
         inputMode: "decimal",
-        value: text2,
+        value: text3,
         placeholder: mixed ? controller.getMixedPlaceholder() : field.placeholder,
         mixed,
         readOnly: !editable,
@@ -3474,7 +3474,7 @@ function ActionGlyph({ glyph }) {
   return /* @__PURE__ */ jsx6("span", { "aria-hidden": true, children: glyph });
 }
 function SectionView({ section, controller }) {
-  const ui2 = (intent) => applyInspectorUi(controller, intent);
+  const ui3 = (intent) => applyInspectorUi(controller, intent);
   const hasActions = section.actions.length > 0 || section.hasAddMenu;
   return /* @__PURE__ */ jsxs5(
     Section,
@@ -3483,13 +3483,13 @@ function SectionView({ section, controller }) {
       flush: true,
       collapsible: section.collapsible,
       collapsed: section.collapsed,
-      onCollapsedChange: () => ui2({ kind: "toggleSectionCollapsed", sectionId: section.id }),
+      onCollapsedChange: () => ui3({ kind: "toggleSectionCollapsed", sectionId: section.id }),
       enabled: section.enabled,
-      onEnabledChange: () => ui2({ kind: "toggleSectionEnabled", sectionId: section.id }),
+      onEnabledChange: () => ui3({ kind: "toggleSectionEnabled", sectionId: section.id }),
       badge: section.badge ? /* @__PURE__ */ jsx6(Badge2, { children: section.badge }) : null,
       actions: hasActions ? /* @__PURE__ */ jsxs5(Fragment3, { children: [
-        section.actions.map((action) => /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(ActionGlyph, { glyph: action.glyph }), label: action.label, disabled: action.disabled, onClick: () => ui2({ kind: "runAction", sectionId: section.id, actionId: action.id }) }, action.id)),
-        section.hasAddMenu ? /* @__PURE__ */ jsx6(Select2, { size: "sm", placeholder: "\uFF0B", options: section.addOptions, value: "", label: section.addLabel, onChange: (id) => ui2({ kind: "addItem", sectionId: section.id, itemId: id }) }) : null
+        section.actions.map((action) => /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(ActionGlyph, { glyph: action.glyph }), label: action.label, disabled: action.disabled, onClick: () => ui3({ kind: "runAction", sectionId: section.id, actionId: action.id }) }, action.id)),
+        section.hasAddMenu ? /* @__PURE__ */ jsx6(Select2, { size: "sm", placeholder: "\uFF0B", options: section.addOptions, value: "", label: section.addLabel, onChange: (id) => ui3({ kind: "addItem", sectionId: section.id, itemId: id }) }) : null
       ] }) : null,
       children: [
         section.showEmptyHint ? /* @__PURE__ */ jsx6(Stack2, { pad: "inset", children: /* @__PURE__ */ jsx6(Text3, { role: "caption", children: section.emptyHint }) }) : null,
@@ -3499,7 +3499,7 @@ function SectionView({ section, controller }) {
   );
 }
 function FieldRow({ row, controller }) {
-  const ui2 = (intent) => applyInspectorUi(controller, intent);
+  const ui3 = (intent) => applyInspectorUi(controller, intent);
   return /* @__PURE__ */ jsxs5(Fragment3, { children: [
     /* @__PURE__ */ jsxs5(
       Field,
@@ -3507,19 +3507,19 @@ function FieldRow({ row, controller }) {
         label: row.label,
         title: row.title,
         focused: row.focused,
-        onLabelClick: () => ui2({ kind: "focusField", fieldId: row.id }),
-        onContextMenu: (x, y) => ui2({ kind: "contextMenu", fieldId: row.id, x, y }),
+        onLabelClick: () => ui3({ kind: "focusField", fieldId: row.id }),
+        onContextMenu: (x, y) => ui3({ kind: "contextMenu", fieldId: row.id, x, y }),
         leading: row.showKeyframes ? /* @__PURE__ */ jsxs5(Fragment3, { children: [
-          /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(StopwatchIcon, {}), label: "Toggle animation", active: row.animated, onClick: () => ui2({ kind: "keyframe", fieldId: row.id, op: "toggleAnim" }) }),
-          row.animated ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(PrevIcon, {}), label: "Previous keyframe", disabled: row.prevDisabled, onClick: () => ui2({ kind: "keyframe", fieldId: row.id, op: "prev" }) }) : null,
-          row.animated ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(DiamondIcon, { filled: row.onKeyframe }), label: row.keyframeLabel, onClick: () => ui2({ kind: "keyframe", fieldId: row.id, op: row.keyframeOp }) }) : null,
-          row.animated ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(NextIcon, {}), label: "Next keyframe", disabled: row.nextDisabled, onClick: () => ui2({ kind: "keyframe", fieldId: row.id, op: "next" }) }) : null
+          /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(StopwatchIcon, {}), label: "Toggle animation", active: row.animated, onClick: () => ui3({ kind: "keyframe", fieldId: row.id, op: "toggleAnim" }) }),
+          row.animated ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(PrevIcon, {}), label: "Previous keyframe", disabled: row.prevDisabled, onClick: () => ui3({ kind: "keyframe", fieldId: row.id, op: "prev" }) }) : null,
+          row.animated ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(DiamondIcon, { filled: row.onKeyframe }), label: row.keyframeLabel, onClick: () => ui3({ kind: "keyframe", fieldId: row.id, op: row.keyframeOp }) }) : null,
+          row.animated ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(NextIcon, {}), label: "Next keyframe", disabled: row.nextDisabled, onClick: () => ui3({ kind: "keyframe", fieldId: row.id, op: "next" }) }) : null
         ] }) : null,
         trailing: /* @__PURE__ */ jsxs5(Fragment3, { children: [
-          row.showEasing ? /* @__PURE__ */ jsx6(Select2, { size: "sm", options: row.easingOptions, value: row.easing, label: "Easing", onChange: (v) => ui2({ kind: "setEasing", fieldId: row.id, easing: v }) }) : null,
+          row.showEasing ? /* @__PURE__ */ jsx6(Select2, { size: "sm", options: row.easingOptions, value: row.easing, label: "Easing", onChange: (v) => ui3({ kind: "setEasing", fieldId: row.id, easing: v }) }) : null,
           row.showKeyframes ? /* @__PURE__ */ jsx6(Badge2, { size: "sm", children: row.keyframeChip }) : null,
-          row.showToken ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(LinkIcon, {}), label: row.tokenActionLabel, active: row.bound, onClick: () => ui2({ kind: "bindToken", fieldId: row.id }) }) : null,
-          row.showReset ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(ResetIcon, {}), label: "Reset to default", onClick: () => ui2({ kind: "resetField", fieldId: row.id }) }) : null
+          row.showToken ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(LinkIcon, {}), label: row.tokenActionLabel, active: row.bound, onClick: () => ui3({ kind: "bindToken", fieldId: row.id }) }) : null,
+          row.showReset ? /* @__PURE__ */ jsx6(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx6(ResetIcon, {}), label: "Reset to default", onClick: () => ui3({ kind: "resetField", fieldId: row.id }) }) : null
         ] }),
         children: [
           row.bound ? /* @__PURE__ */ jsx6(Badge2, { title: row.tokenTitle, children: row.tokenLabel }) : null,
@@ -3587,11 +3587,20 @@ function createInspectorPanel(options = {}) {
   return {
     manifest: inspectorManifest,
     activate(host) {
-      const controller = new InspectorPanelController(host, options);
+      const { render: customRender, ...controllerOptions } = options;
+      const controller = new InspectorPanelController(host, controllerOptions);
       void controller.load();
       let root = null;
+      let unrender = null;
       return {
         render(el) {
+          if (customRender) {
+            unrender = customRender(el, controller);
+            return () => {
+              unrender?.();
+              unrender = null;
+            };
+          }
           root = createRoot2(el);
           root.render(createElement2(InspectorPanelView, { controller }));
           return () => {
@@ -3614,6 +3623,8 @@ function createInspectorPanel(options = {}) {
         dispose() {
           root?.unmount();
           root = null;
+          unrender?.();
+          unrender = null;
           controller.dispose();
         }
       };
@@ -4528,6 +4539,231 @@ var HistoryPanelController = class {
 
 // src/edit/history/react/HistoryPanelView.tsx
 import { useCallback as useCallback4, useEffect as useEffect3, useRef as useRef4, useSyncExternalStore as useSyncExternalStore3 } from "react";
+
+// src/edit/history/react/format.ts
+function formatTime(at) {
+  const date = typeof at === "number" ? new Date(at) : new Date(at);
+  if (Number.isNaN(date.getTime())) return typeof at === "string" ? at : "";
+  return date.toLocaleTimeString(void 0, { hour: "2-digit", minute: "2-digit" });
+}
+
+// src/edit/history/declaration.ts
+function historyViewState(c) {
+  const rows = c.getRows();
+  const window_ = c.getWindow();
+  const rowHeight = c.getRowHeight();
+  const memory = c.getMemory();
+  const focused = c.getFocused();
+  const showIcons = c.areIconsShown();
+  const showSource = c.isSourceShown();
+  const showTime = c.areTimestampsShown();
+  const jumpAllowed = c.isJumpAllowed();
+  return {
+    canUndo: c.canUndo(),
+    canRedo: c.canRedo(),
+    cannotUndo: !c.canUndo(),
+    cannotRedo: !c.canRedo(),
+    searchShown: c.isSearchShown(),
+    filter: c.getFilter(),
+    counter: `${c.getAppliedCount()} / ${c.getTotalCount()}`,
+    clearAllowed: c.isClearAllowed(),
+    confirmingClear: c.isConfirmingClear(),
+    pruned: c.isPruned(),
+    totalHeight: window_.totalHeight,
+    offsetTop: window_.offsetTop,
+    rows: c.getWindowRows().map((row) => {
+      const entry = row.entry;
+      const pending = entry?.status === "pending";
+      const source = entry?.source;
+      return {
+        key: row.entryId ?? "__original__",
+        entryId: row.entryId,
+        label: row.label,
+        meta: row.kind === "entry" ? row.ordinal : void 0,
+        current: row.current,
+        future: row.future,
+        focused: focused === row.entryId,
+        jumpable: jumpAllowed && entry?.caps?.jumpable !== false,
+        showIcon: showIcons,
+        hideIcon: !showIcons,
+        iconName: row.kind === "original" ? "original" : c.getIconName(entry?.kind),
+        pending,
+        failed: entry?.status === "failed",
+        showSource: showSource && !!source && source !== "user",
+        sourceGlyph: source === "agent" ? "AI" : "S",
+        sourceTitle: `Source: ${source ?? ""}`,
+        showCoalesced: !!entry?.coalesced && entry.coalesced > 1,
+        coalescedText: `\xD7${entry?.coalesced ?? 0}`,
+        coalescedTitle: `${entry?.coalesced ?? 0} actions coalesced`,
+        showTime: showTime && entry?.at !== void 0,
+        time: entry?.at !== void 0 ? formatTime(entry.at) : "",
+        height: rowHeight,
+        cancelId: pending ? entry?.id : void 0
+      };
+    }),
+    empty: rows.length === 0,
+    hasMemory: !!memory,
+    memoryText: memory ? `${memory.usedMB.toFixed(1)} MB${memory.limitMB ? ` / ${memory.limitMB} MB` : ""}` : "",
+    memoryDisk: memory?.onDiskCount !== void 0 ? `${memory.onDiskCount} on disk` : void 0
+  };
+}
+function applyHistoryUi(c, intent) {
+  switch (intent.kind) {
+    case "undo":
+      c.undo();
+      break;
+    case "redo":
+      c.redo();
+      break;
+    case "filter":
+      c.setFilter(intent.value);
+      break;
+    case "requestClear":
+      c.requestClear();
+      break;
+    case "confirmClear":
+      c.confirmClearNow();
+      break;
+    case "cancelClear":
+      c.cancelClear();
+      break;
+    case "jump":
+      c.jumpTo(intent.entryId);
+      break;
+    case "hover":
+      c.setHovered(intent.entryId);
+      break;
+    case "contextMenu":
+      c.requestContextMenu(intent.entryId, intent.x, intent.y);
+      break;
+    case "cancelPending":
+      c.cancelPending(intent.entryId);
+      break;
+  }
+}
+var historyViewManifest = {
+  id: historyManifest.id,
+  version: "1.0.0",
+  title: "History",
+  category: "edit",
+  layout: { slot: "side" },
+  inputs: [{ id: "view", type: "object", label: "View state", description: "The HistoryViewState the runtime derives from the controller on every draw." }],
+  outputs: [{ id: "ui", type: "object", label: "UI intent", description: "{ kind, entryId?, value?, x?, y? } \u2014 applied by the runtime to the controller." }],
+  commands: []
+};
+var EMPTY2 = { canUndo: false, canRedo: false, cannotUndo: true, cannotRedo: true, searchShown: true, filter: "", counter: "0 / 0", clearAllowed: false, confirmingClear: false, pruned: false, totalHeight: 0, offsetTop: 0, rows: [], empty: true, hasMemory: false, memoryText: "" };
+var BEHAVIOURS2 = {
+  "edit/historyPanelView": (inputs) => inputs.view ?? EMPTY2
+};
+var text2 = (b) => ({ component: "text", props: { text: b } });
+var ui2 = (kind, fields = {}) => ({ emit: "ui", value: { object: { kind: { value: kind }, ...fields } } });
+var HISTORY_DECLARATION = {
+  format: "xeno.block@1",
+  manifest: historyViewManifest,
+  behaviour: "edit/historyPanelView",
+  composition: {
+    component: "chrome/Column",
+    props: { className: { value: "xeno-history-panel" } },
+    children: [
+      {
+        component: "chrome/Toolbar",
+        props: {
+          left: {
+            node: {
+              component: "fragment",
+              children: [
+                { component: "chrome/IconButton", props: { size: { value: "sm" }, icon: { node: { component: "history/UndoIcon" } }, label: { value: "Undo" }, disabled: { input: "view.cannotUndo" } }, on: { onClick: ui2("undo") } },
+                { component: "chrome/IconButton", props: { size: { value: "sm" }, icon: { node: { component: "history/RedoIcon" } }, label: { value: "Redo" }, disabled: { input: "view.cannotRedo" } }, on: { onClick: ui2("redo") } }
+              ]
+            }
+          },
+          right: {
+            node: {
+              component: "fragment",
+              children: [
+                { component: "chrome/Text", props: { role: { value: "number" } }, children: [text2({ input: "view.counter" })] },
+                { component: "chrome/IconButton", when: { input: "view.clearAllowed" }, props: { size: { value: "sm" }, icon: { node: { component: "history/TrashIcon" } }, label: { value: "Clear history" } }, on: { onClick: ui2("requestClear") } }
+              ]
+            }
+          }
+        },
+        children: [
+          { component: "chrome/SearchField", when: { input: "view.searchShown" }, props: { value: { input: "view.filter" }, placeholder: { value: "Search history" }, label: { value: "Search history" } }, on: { onChange: ui2("filter", { value: { arg: "" } }) } }
+        ]
+      },
+      {
+        component: "chrome/InlineConfirm",
+        when: { input: "view.confirmingClear" },
+        props: { message: { value: "Clear all history?" }, label: { value: "Confirm clear history" }, confirmLabel: { value: "Clear" } },
+        on: { onConfirm: ui2("confirmClear"), onCancel: ui2("cancelClear") }
+      },
+      { component: "chrome/Text", when: { input: "view.pruned" }, props: { role: { value: "caption" } }, children: [text2({ value: "Earlier history discarded (limit reached)" })] },
+      {
+        component: "history/Scroller",
+        children: [
+          {
+            component: "chrome/RowList",
+            props: { role: { value: "listbox" }, "aria-label": { value: "History" } },
+            children: [
+              {
+                component: "chrome/VirtualWindow",
+                props: { totalHeight: { input: "view.totalHeight" }, offsetTop: { input: "view.offsetTop" } },
+                children: [
+                  {
+                    component: "chrome/Row",
+                    each: { input: "view.rows", key: "key" },
+                    props: {
+                      height: { item: "height" },
+                      selected: { item: "current" },
+                      focused: { item: "focused" },
+                      struck: { item: "future" },
+                      noIcon: { item: "hideIcon" },
+                      interactive: { item: "jumpable" },
+                      icon: { node: { component: "history/EntryIcon", props: { name: { item: "iconName" } } } },
+                      label: { item: "label" },
+                      meta: { item: "meta" },
+                      "data-history-row": { item: "key" },
+                      title: { item: "label" },
+                      trailing: {
+                        node: {
+                          component: "fragment",
+                          children: [
+                            { component: "history/PendingGlyph", when: { item: "pending" } },
+                            { component: "chrome/Badge", when: { item: "failed" }, props: { size: { value: "sm" }, tone: { value: "error" } }, children: [text2({ value: "failed" })] },
+                            { component: "chrome/Badge", when: { item: "showSource" }, props: { size: { value: "sm" }, title: { item: "sourceTitle" } }, children: [text2({ item: "sourceGlyph" })] },
+                            { component: "chrome/Badge", when: { item: "showCoalesced" }, props: { size: { value: "sm" }, title: { item: "coalescedTitle" } }, children: [text2({ item: "coalescedText" })] },
+                            { component: "chrome/Text", when: { item: "showTime" }, props: { role: { value: "meta" } }, children: [text2({ item: "time" })] },
+                            { component: "history/CancelButton", when: { item: "pending" }, props: { entryId: { item: "cancelId" } } }
+                          ]
+                        }
+                      }
+                    },
+                    on: {
+                      onClick: ui2("jump", { entryId: { item: "entryId" } }),
+                      onMouseEnter: ui2("hover", { entryId: { item: "entryId" } }),
+                      onContextMenuAt: ui2("contextMenu", { entryId: { item: "entryId" }, x: { arg: "" }, y: { arg: "", index: 1 } })
+                    }
+                  }
+                ]
+              }
+            ]
+          },
+          { component: "chrome/EmptyState", when: { input: "view.empty" }, props: { title: { value: "No history" } } }
+        ]
+      },
+      {
+        component: "chrome/StatusBar",
+        when: { input: "view.hasMemory" },
+        props: {
+          left: { node: { component: "chrome/Text", props: { role: { value: "number" } }, children: [text2({ input: "view.memoryText" })] } },
+          right: { node: { component: "chrome/Text", when: { input: "view.memoryDisk" }, props: { role: { value: "meta" } }, children: [text2({ input: "view.memoryDisk" })] } }
+        }
+      }
+    ]
+  }
+};
+
+// src/edit/history/react/HistoryPanelView.tsx
 import { Badge as Badge3, Column as Column3, EmptyState as EmptyState3, IconButton as IconButton4, InlineConfirm, RowList as RowList2, Row as Row2, ScrollArea as ScrollArea3, SearchField as SearchField3, StatusBar as StatusBar2, Text as Text4, Toolbar as Toolbar2, VirtualWindow as VirtualWindow2 } from "@xenosystem/components/chrome";
 
 // src/edit/history/react/icons.tsx
@@ -4629,12 +4865,34 @@ function HistoryPanelView({ controller }) {
   const subscribe = useCallback4((cb) => controller.subscribe(cb), [controller]);
   const getSnapshot = useCallback4(() => controller.getRevision(), [controller]);
   useSyncExternalStore3(subscribe, getSnapshot, getSnapshot);
+  const view = historyViewState(controller);
+  const ui3 = (intent) => applyHistoryUi(controller, intent);
+  return /* @__PURE__ */ jsxs7(Column3, { className: "xeno-history-panel", children: [
+    /* @__PURE__ */ jsx8(
+      Toolbar2,
+      {
+        left: /* @__PURE__ */ jsxs7(Fragment4, { children: [
+          /* @__PURE__ */ jsx8(IconButton4, { size: "sm", icon: /* @__PURE__ */ jsx8(UndoIcon, {}), label: "Undo", disabled: view.cannotUndo, onClick: () => ui3({ kind: "undo" }) }),
+          /* @__PURE__ */ jsx8(IconButton4, { size: "sm", icon: /* @__PURE__ */ jsx8(RedoIcon, {}), label: "Redo", disabled: view.cannotRedo, onClick: () => ui3({ kind: "redo" }) })
+        ] }),
+        right: /* @__PURE__ */ jsxs7(Fragment4, { children: [
+          /* @__PURE__ */ jsx8(Text4, { role: "number", children: view.counter }),
+          view.clearAllowed ? /* @__PURE__ */ jsx8(IconButton4, { size: "sm", icon: /* @__PURE__ */ jsx8(TrashIcon, {}), label: "Clear history", onClick: () => ui3({ kind: "requestClear" }) }) : null
+        ] }),
+        children: view.searchShown ? /* @__PURE__ */ jsx8(SearchField3, { value: view.filter, onChange: (v) => ui3({ kind: "filter", value: v }), placeholder: "Search history", label: "Search history" }) : null
+      }
+    ),
+    view.confirmingClear ? /* @__PURE__ */ jsx8(InlineConfirm, { message: "Clear all history?", label: "Confirm clear history", confirmLabel: "Clear", onConfirm: () => ui3({ kind: "confirmClear" }), onCancel: () => ui3({ kind: "cancelClear" }) }) : null,
+    view.pruned ? /* @__PURE__ */ jsx8(Text4, { role: "caption", children: "Earlier history discarded (limit reached)" }) : null,
+    /* @__PURE__ */ jsxs7(HistoryScroller, { controller, children: [
+      /* @__PURE__ */ jsx8(RowList2, { role: "listbox", "aria-label": "History", children: /* @__PURE__ */ jsx8(VirtualWindow2, { totalHeight: view.totalHeight, offsetTop: view.offsetTop, children: view.rows.map((row) => /* @__PURE__ */ jsx8(HistoryRowView, { row, controller }, row.key)) }) }),
+      view.empty ? /* @__PURE__ */ jsx8(EmptyState3, { title: "No history" }) : null
+    ] }),
+    view.hasMemory ? /* @__PURE__ */ jsx8(StatusBar2, { left: /* @__PURE__ */ jsx8(Text4, { role: "number", children: view.memoryText }), right: view.memoryDisk ? /* @__PURE__ */ jsx8(Text4, { role: "meta", children: view.memoryDisk }) : null }) : null
+  ] });
+}
+function HistoryScroller({ controller, children }) {
   const scrollRef = useRef4(null);
-  const rows = controller.getRows();
-  const window_ = controller.getWindow();
-  const windowRows = controller.getWindowRows();
-  const rowHeight = controller.getRowHeight();
-  const memory = controller.getMemory();
   useEffect3(() => {
     const el = scrollRef.current;
     if (!el) return;
@@ -4654,18 +4912,10 @@ function HistoryPanelView({ controller }) {
       el.scrollTop = controller.getScrollTop();
     }
   });
-  const onScroll = useCallback4(
-    (e) => controller.setScrollTop(e.currentTarget.scrollTop),
-    [controller]
-  );
+  const onScroll = useCallback4((e) => controller.setScrollTop(e.currentTarget.scrollTop), [controller]);
   const onKeyDown = useCallback4(
     (e) => {
-      const handled = controller.handleKey({
-        key: e.key,
-        ctrl: e.ctrlKey,
-        meta: e.metaKey,
-        shift: e.shiftKey
-      });
+      const handled = controller.handleKey({ key: e.key, ctrl: e.ctrlKey, meta: e.metaKey, shift: e.shiftKey });
       if (handled) {
         e.preventDefault();
         e.stopPropagation();
@@ -4673,109 +4923,62 @@ function HistoryPanelView({ controller }) {
     },
     [controller]
   );
-  return /* @__PURE__ */ jsxs7(Column3, { className: "xeno-history-panel", children: [
-    /* @__PURE__ */ jsx8(
-      Toolbar2,
-      {
-        left: /* @__PURE__ */ jsxs7(Fragment4, { children: [
-          /* @__PURE__ */ jsx8(IconButton4, { size: "sm", icon: /* @__PURE__ */ jsx8(UndoIcon, {}), label: "Undo", disabled: !controller.canUndo(), onClick: () => controller.undo() }),
-          /* @__PURE__ */ jsx8(IconButton4, { size: "sm", icon: /* @__PURE__ */ jsx8(RedoIcon, {}), label: "Redo", disabled: !controller.canRedo(), onClick: () => controller.redo() })
-        ] }),
-        right: /* @__PURE__ */ jsxs7(Fragment4, { children: [
-          /* @__PURE__ */ jsxs7(Text4, { role: "number", children: [
-            controller.getAppliedCount(),
-            " / ",
-            controller.getTotalCount()
-          ] }),
-          controller.isClearAllowed() ? /* @__PURE__ */ jsx8(IconButton4, { size: "sm", icon: /* @__PURE__ */ jsx8(TrashIcon, {}), label: "Clear history", onClick: () => controller.requestClear() }) : null
-        ] }),
-        children: controller.isSearchShown() ? /* @__PURE__ */ jsx8(SearchField3, { value: controller.getFilter(), onChange: (v) => controller.setFilter(v), placeholder: "Search history", label: "Search history" }) : null
-      }
-    ),
-    controller.isConfirmingClear() ? /* @__PURE__ */ jsx8(InlineConfirm, { message: "Clear all history?", label: "Confirm clear history", confirmLabel: "Clear", onConfirm: () => controller.confirmClearNow(), onCancel: () => controller.cancelClear() }) : null,
-    controller.isPruned() ? /* @__PURE__ */ jsx8(Text4, { role: "caption", children: "Earlier history discarded (limit reached)" }) : null,
-    /* @__PURE__ */ jsxs7(ScrollArea3, { ref: scrollRef, onScroll, onKeyDown, onMouseLeave: () => controller.setHovered(null), tabIndex: 0, children: [
-      /* @__PURE__ */ jsx8(RowList2, { role: "listbox", "aria-label": "History", children: /* @__PURE__ */ jsx8(VirtualWindow2, { totalHeight: window_.totalHeight, offsetTop: window_.offsetTop, children: windowRows.map((row) => /* @__PURE__ */ jsx8(
-        HistoryRowView,
-        {
-          row,
-          controller,
-          rowHeight,
-          focused: controller.getFocused() === row.entryId
-        },
-        row.entryId ?? "__original__"
-      )) }) }),
-      rows.length === 0 ? /* @__PURE__ */ jsx8(EmptyState3, { title: "No history" }) : null
-    ] }),
-    memory ? /* @__PURE__ */ jsx8(
-      StatusBar2,
-      {
-        left: /* @__PURE__ */ jsxs7(Text4, { role: "number", children: [
-          memory.usedMB.toFixed(1),
-          " MB",
-          memory.limitMB ? ` / ${memory.limitMB} MB` : ""
-        ] }),
-        right: memory.onDiskCount !== void 0 ? /* @__PURE__ */ jsxs7(Text4, { role: "meta", children: [
-          memory.onDiskCount,
-          " on disk"
-        ] }) : null
+  return /* @__PURE__ */ jsx8(ScrollArea3, { ref: scrollRef, onScroll, onKeyDown, onMouseLeave: () => controller.setHovered(null), tabIndex: 0, children });
+}
+function HistoryCancelButton({ entryId, controller }) {
+  return /* @__PURE__ */ jsx8(
+    IconButton4,
+    {
+      size: "sm",
+      icon: /* @__PURE__ */ jsx8(XIcon2, {}),
+      label: "Cancel operation",
+      onClick: (e) => {
+        e.stopPropagation();
+        controller.cancelPending(entryId);
       }
-    ) : null
-  ] });
+    }
+  );
 }
-function HistoryRowView({ row, controller, rowHeight, focused }) {
-  const entry = row.entry;
-  const pending = entry?.status === "pending";
-  const failed = entry?.status === "failed";
-  const jumpable = controller.isJumpAllowed() && entry?.caps?.jumpable !== false;
+function HistoryRowView({ row, controller }) {
+  const ui3 = (intent) => applyHistoryUi(controller, intent);
   return /* @__PURE__ */ jsx8(
     Row2,
     {
-      height: rowHeight,
+      height: row.height,
       selected: row.current,
-      focused,
+      focused: row.focused,
       struck: row.future,
-      noIcon: !controller.areIconsShown(),
-      icon: /* @__PURE__ */ jsx8(EntryIcon, { name: row.kind === "original" ? "original" : controller.getIconName(entry?.kind) }),
+      noIcon: row.hideIcon,
+      interactive: row.jumpable,
+      icon: /* @__PURE__ */ jsx8(EntryIcon, { name: row.iconName }),
       label: row.label,
-      meta: row.kind === "entry" ? row.ordinal : void 0,
-      "data-history-row": row.entryId ?? "__original__",
-      onClick: jumpable ? () => controller.jumpTo(row.entryId) : void 0,
-      onMouseEnter: () => controller.setHovered(row.entryId),
-      onContextMenu: (e) => {
-        e.preventDefault();
-        controller.requestContextMenu(row.entryId, e.clientX, e.clientY);
-      },
+      meta: row.meta,
+      "data-history-row": row.key,
       title: row.label,
       trailing: /* @__PURE__ */ jsxs7(Fragment4, { children: [
-        pending ? /* @__PURE__ */ jsx8(PendingGlyph, {}) : null,
-        failed ? /* @__PURE__ */ jsx8(Badge3, { size: "sm", tone: "error", children: "failed" }) : null,
-        controller.isSourceShown() && entry?.source && entry.source !== "user" ? /* @__PURE__ */ jsx8(Badge3, { size: "sm", title: `Source: ${entry.source}`, children: entry.source === "agent" ? "AI" : "S" }) : null,
-        entry?.coalesced && entry.coalesced > 1 ? /* @__PURE__ */ jsxs7(Badge3, { size: "sm", title: `${entry.coalesced} actions coalesced`, children: [
-          "\xD7",
-          entry.coalesced
-        ] }) : null,
-        controller.areTimestampsShown() && entry?.at !== void 0 ? /* @__PURE__ */ jsx8(Text4, { role: "meta", children: formatTime(entry.at) }) : null,
-        pending ? /* @__PURE__ */ jsx8(
-          IconButton4,
-          {
-            size: "sm",
-            icon: /* @__PURE__ */ jsx8(XIcon2, {}),
-            label: "Cancel operation",
-            onClick: (e) => {
-              e.stopPropagation();
-              controller.cancelPending(entry?.id);
-            }
-          }
-        ) : null
-      ] })
+        row.pending ? /* @__PURE__ */ jsx8(PendingGlyph, {}) : null,
+        row.failed ? /* @__PURE__ */ jsx8(Badge3, { size: "sm", tone: "error", children: "failed" }) : null,
+        row.showSource ? /* @__PURE__ */ jsx8(Badge3, { size: "sm", title: row.sourceTitle, children: row.sourceGlyph }) : null,
+        row.showCoalesced ? /* @__PURE__ */ jsx8(Badge3, { size: "sm", title: row.coalescedTitle, children: row.coalescedText }) : null,
+        row.showTime ? /* @__PURE__ */ jsx8(Text4, { role: "meta", children: row.time }) : null,
+        row.pending ? /* @__PURE__ */ jsx8(HistoryCancelButton, { entryId: row.cancelId, controller }) : null
+      ] }),
+      onClick: () => ui3({ kind: "jump", entryId: row.entryId }),
+      onMouseEnter: () => ui3({ kind: "hover", entryId: row.entryId }),
+      onContextMenuAt: (x, y) => ui3({ kind: "contextMenu", entryId: row.entryId, x, y })
     }
   );
 }
-function formatTime(at) {
-  const date = typeof at === "number" ? new Date(at) : new Date(at);
-  if (Number.isNaN(date.getTime())) return typeof at === "string" ? at : "";
-  return date.toLocaleTimeString(void 0, { hour: "2-digit", minute: "2-digit" });
+function historyRuntimeComponents(controller) {
+  return {
+    "history/Scroller": ({ children }) => /* @__PURE__ */ jsx8(HistoryScroller, { controller, children }),
+    "history/CancelButton": ({ entryId }) => /* @__PURE__ */ jsx8(HistoryCancelButton, { entryId, controller }),
+    "history/EntryIcon": EntryIcon,
+    "history/PendingGlyph": PendingGlyph,
+    "history/UndoIcon": UndoIcon,
+    "history/RedoIcon": RedoIcon,
+    "history/TrashIcon": TrashIcon
+  };
 }
 
 // src/edit/history/panel.ts
@@ -4783,11 +4986,20 @@ function createHistoryPanel(options = {}) {
   return {
     manifest: historyManifest,
     activate(host) {
-      const controller = new HistoryPanelController(host, options);
+      const { render: customRender, ...controllerOptions } = options;
+      const controller = new HistoryPanelController(host, controllerOptions);
       void controller.load();
       let root = null;
+      let unrender = null;
       return {
         render(el) {
+          if (customRender) {
+            unrender = customRender(el, controller);
+            return () => {
+              unrender?.();
+              unrender = null;
+            };
+          }
           root = createRoot3(el);
           root.render(createElement3(HistoryPanelView, { controller }));
           return () => {
@@ -4810,6 +5022,8 @@ function createHistoryPanel(options = {}) {
         dispose() {
           root?.unmount();
           root = null;
+          unrender?.();
+          unrender = null;
           controller.dispose();
         }
       };
@@ -8587,11 +8801,11 @@ var FindController = class {
    * @param text - The new query text.
    * @param immediate - Skip the debounce (a paste, or pressing Enter).
    */
-  setText(text2, immediate = false) {
-    if (text2 === this.text) return;
-    this.text = text2;
+  setText(text3, immediate = false) {
+    if (text3 === this.text) return;
+    this.text = text3;
     this.index = -1;
-    if (text2 === "") {
+    if (text3 === "") {
       this.clearResults("idle");
       this.emitQuery(true);
       return;
@@ -8619,8 +8833,8 @@ var FindController = class {
     this.notify();
   }
   /** The replacement text. Never emitted on its own — a replacement is not a search. */
-  setReplaceText(text2) {
-    this.replaceText = text2;
+  setReplaceText(text3) {
+    this.replaceText = text3;
     this.notify();
   }
   /** Show or hide the replace row. */
@@ -12256,12 +12470,12 @@ var TreeController = class {
     }
     if (event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey) {
       const fresh = now - this.typeAhead.at > this.typeAheadMs;
-      const text2 = (fresh ? "" : this.typeAhead.text) + event.key.toLowerCase();
-      this.typeAhead = { text: text2, at: now };
+      const text3 = (fresh ? "" : this.typeAhead.text) + event.key.toLowerCase();
+      this.typeAhead = { text: text3, at: now };
       const from = fresh ? current : current + 1;
       for (let i = 0; i < rows.length; i += 1) {
         const candidate = rows[(from + i) % rows.length];
-        if (candidate.node.label.toLowerCase().startsWith(text2)) {
+        if (candidate.node.label.toLowerCase().startsWith(text3)) {
           this.focusedId = candidate.id;
           this.select([candidate.id]);
           return true;
@@ -12287,9 +12501,9 @@ var TreeController = class {
     return true;
   }
   /** Update the rename draft. */
-  updateRenameDraft(text2) {
+  updateRenameDraft(text3) {
     if (!this.renaming) return;
-    this.renaming = { ...this.renaming, draft: text2 };
+    this.renaming = { ...this.renaming, draft: text3 };
     this.notify();
   }
   /**
@@ -13478,6 +13692,8 @@ export {
   FindPanelView,
   GENERIC_ICON,
   GraphController,
+  BEHAVIOURS2 as HISTORY_BEHAVIOURS,
+  HISTORY_DECLARATION,
   HistoryPanelController,
   HistoryPanelView,
   IMPLEMENTED_TREE_MODES,
@@ -13508,6 +13724,7 @@ export {
   allIds,
   anchorStateOf,
   appliedCount,
+  applyHistoryUi,
   applyInspectorUi,
   applyPrecision,
   applyTangentDrag,
@@ -13577,6 +13794,9 @@ export {
   highlightSegments,
   historyManifest,
   historyPanel,
+  historyRuntimeComponents,
+  historyViewManifest,
+  historyViewState,
   hslToRgb,
   hsvFromHex,
   hsvToRgb,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xenosystem/blocks",
-  "version": "0.12.2",
+  "version": "0.12.4",
   "description": "XENO Blocks — rung 3 of the front ladder: components composed into a contract-bearing unit (manifest: ports, intents, commands, agent surface), rendered by @xenosystem/workbench. ONE package, one subpath per family (/auth, /edit, /data, /time, /ops, /trust, /agent), one named export per block — XENO PACKAGE NAMING - STANDARD.md.",
   "license": "UNLICENSED",
   "type": "module",
@@ -60,7 +60,7 @@
   "peerDependencies": {
     "@duckdb/duckdb-wasm": ">=1.28.0",
     "@xenosystem/block-sdk": ">=0.3.3 <1",
-    "@xenosystem/components": ">=0.16.0 <1",
+    "@xenosystem/components": ">=0.16.1 <1",
     "@xenosystem/data-core": "^0.1.0",
     "@xenosystem/elements-react": ">=0.0.1",
     "@xenosystem/time-core": "^0.1.0",
@@ -76,7 +76,7 @@
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "@xenosystem/block-sdk": "^0.3.3",
-    "@xenosystem/components": "^0.16.0",
+    "@xenosystem/components": "^0.16.1",
     "@xenosystem/data-core": "^0.1.0",
     "@xenosystem/elements-react": "0.0.1",
     "@xenosystem/time-core": "^0.1.0",