@signalsafe/tree-spec-editor 0.2.2 → 0.2.3

package/README.md

@@ -1,20 +1,70 @@
 # `@signalsafe/tree-spec-editor`
 
-React graph editor for authoring `TreeSpec` content.
+React **Bootstrap UI shell** for authoring TreeSpec graphs: canvas (from `@signalsafe/tree-spec-editor-react`), sidebar panels, modals, and toolbar helpers.
 
-This package gives you a ready-to-embed editor component plus a small set of editor helpers. It is focused on graph editing only: nodes, choices, transitions, selection, layout, and validation hints.
+| | |
+|---|---|
+| **npm** | `@signalsafe/tree-spec-editor` |
+| **GitHub** | [SignalSafeSoftware/tree-spec-editor](https://github.com/SignalSafeSoftware/tree-spec-editor) |
+| **Peer deps** | `react`, `react-dom`, `reactflow`, `react-bootstrap` |
+
+## What this package does
+
+- Ships a ready-to-embed **graph editor UI** (`TreeSpecGraphEditor` re-export, panels, modals, toolbar).
+- Re-exports selected **editor-core helpers** and types for one-stop imports in Bootstrap hosts.
+
+## What this package does not do
+
+- Routing, REST/GraphQL clients, or authentication — your host app loads/saves drafts and enforces permissions.
+- Wire compile/publish without your adapter — use `useTreeSpecEditor` from `@signalsafe/tree-spec-editor-react` with a host adapter.
+- React Flow CSS by itself — the canvas lives in `-editor-react`; **consumers may need** `import 'reactflow/dist/style.css'` in the app entry (see `@signalsafe/tree-spec-editor-react` README). This package keeps `sideEffects: false` because it does not import CSS directly.
+
+## Package stack
+
+| Layer | Package |
+|---|---|
+| Wire | `@signalsafe/tree-spec` |
+| Editor model | `@signalsafe/tree-spec-editor-core` |
+| React Flow canvas | `@signalsafe/tree-spec-editor-react` |
+| **Bootstrap shell (this package)** | `@signalsafe/tree-spec-editor` |
 
 ## Install
 
 ```bash
-npm install @signalsafe/tree-spec-editor react react-dom reactflow react-bootstrap
+npm install @signalsafe/tree-spec-editor @signalsafe/tree-spec-editor-react @signalsafe/tree-spec-editor-core @signalsafe/tree-spec react react-dom reactflow react-bootstrap bootstrap
+```
+
+Load Bootstrap CSS in your app. Import React Flow CSS as documented in `@signalsafe/tree-spec-editor-react`.
+
+## Development
+
+`yarn build` uses `tsconfig.build.json` and resolves `@signalsafe/*` from `node_modules`. Ecosystem sibling `paths` in `tsconfig.json` apply to local typecheck/tests only.
+
+```bash
+yarn install
+yarn build
+yarn test
+yarn typecheck
 ```
 
-The package ships React components that use `react-bootstrap` primitives (cards, buttons, form controls). The consuming app must install `react-bootstrap@^2.10.0` and load Bootstrap CSS in the usual way.
+## Security
+
+See [SECURITY.md](./SECURITY.md). Host applications must enforce authorization, validate TreeSpec server-side, and control publish permissions.
+
+## Changelog and releases
+
+- [CHANGELOG.md](./CHANGELOG.md)
+- [RELEASING.md](./RELEASING.md)
+
+---
+
+## Detailed component reference
+
+The sections below document panels, modals, toolbar items, and integration patterns. Import from **`@signalsafe/tree-spec-editor`** package root only (no subpath exports).
 
 ## Source layout (maintainers)
 
-Published consumers import only the package root (`@signalsafe/tree-spec-editor`). This package is the **React + Bootstrap UI shell** in the layered editor stack:
+Published consumers import only the package root. Layer stack:
 
 | Layer | Package | Owns |
 |-------|---------|------|
@@ -30,7 +80,7 @@ Published consumers import only the package root (`@signalsafe/tree-spec-editor`
 | `src/lib/panelHelpers.ts` | `getIssueSeverityBadgeClass` (Bootstrap-flavored — Material / Angular shells ship their own equivalent) |
 | `src/index.ts` | Public barrel — **do not** import from subpaths in apps. Re-exports the canvas from `@signalsafe/tree-spec-editor-react` and the framework-agnostic surface from `@signalsafe/tree-spec-editor-core` |
 
-Tests live under `tests/panels/`, `tests/modals/`, plus `tests/index.test.ts` for the barrel. The canvas test lives in **`packages/tree-spec-editor-react/tests/`** and the framework-agnostic helper tests live in **`packages/tree-spec-editor-core/tests/`**.
+Tests live under `tests/panels/`, `tests/modals/`, and `tests/index.test.ts` in this repo. Canvas tests live in **`tree-spec-editor-react`**; core helper tests live in **`tree-spec-editor-core`**.
 
 ## Choosing the right package
 
@@ -51,11 +101,11 @@ Tests live under `tests/panels/`, `tests/modals/`, plus `tests/index.test.ts` fo
 
 This package (`@signalsafe/tree-spec-editor`) **remains the Bootstrap reference shell** — it does not become Material, Angular, or Vue.
 
-See [docs/ai/packages-editor-architecture.md](../../docs/ai/packages-editor-architecture.md).
+See package READMEs in the [`tree-spec-editor-core`](https://github.com/SignalSafeSoftware/tree-spec-editor-core) and [`tree-spec-editor-react`](https://github.com/SignalSafeSoftware/tree-spec-editor-react) repos for layer rules.
 
-## Full-stack host import pattern
+## Host import pattern
 
-The reference host ([`ScenarioVersionGraphEditorPage`](../../frontend/shared/domains/content/ScenarioVersionGraphEditorPage.tsx)) imports from **three** packages:
+Typical host apps import from **three** packages:
 
 ```tsx
 // Bootstrap UI shell — panels, modals, toolbar, canvas default export
@@ -78,9 +128,9 @@ The smallest useful integration is:
 2. Render `TreeSpecGraphEditor`.
 3. Replace the state value in `onChange`.
 
-The screenshot below was captured from the exact example tree in this section.
+The example below uses a minimal in-memory tree (screenshot assets are not bundled in the npm package).
 
-![Happy path editor example](https://raw.githubusercontent.com/denverprogrammer/DeliveryPlus/main/packages/tree-spec-editor/docs/tree-spec-editor-happy-path.png)
+<!-- Screenshot: add your own capture when integrating the editor in your app -->
 
 ```tsx
 import { useState, type JSX } from 'react';
@@ -179,9 +229,9 @@ export function ExampleTreeSpecEditor(): JSX.Element {
 
 Pass `issues` when you want the editor to highlight problem nodes and edges.
 
-The screenshot below was captured from the exact example tree in this section.
+The example below demonstrates validation highlighting (screenshot assets are not bundled in the npm package).
 
-![Validation issues example](https://raw.githubusercontent.com/denverprogrammer/DeliveryPlus/main/packages/tree-spec-editor/docs/tree-spec-editor-issues.png)
+<!-- Screenshot: add your own capture when integrating the editor in your app -->
 
 ```tsx
 import { useMemo, useState, type JSX } from 'react';
@@ -611,7 +661,7 @@ Right-rail panel for **canvas-only** styling. Combines:
 
 Scenario-level default edge routing lives in `GraphEditorInfoPanel`, not here.
 
-Hosts typically pair node fields with a project-specific component (for example `NodeAppearanceFields` in `frontend/shared`):
+Hosts typically pair node fields with a project-specific component:
 
 ```tsx
 import { AppearancePanel, InspectorPanel } from '@signalsafe/tree-spec-editor';

package/README.standalone.md

@@ -0,0 +1,14 @@
+# Standalone export
+
+This tree was generated by `scripts/export-standalone-npm-package.sh tree-spec-editor` from the DeliveryPlus monorepo.
+
+```bash
+git init
+git branch -M main
+git add .
+git commit -m "Sync tree-spec-editor from DeliveryPlus"
+git remote add origin git@github.com:SignalSafeSoftware/tree-spec-editor.git
+git push -u origin main
+```
+
+See `RELEASING.md` for npm publish steps.

package/dist/index.d.ts

@@ -23,38 +23,38 @@
  */
 export { default } from '@signalsafe/tree-spec-editor-react';
 export type { TreeSpecGraphEditorProps, GraphEditorVersionInfo } from '@signalsafe/tree-spec-editor-react';
-export { default as IssuesPanel } from './panels/IssuesPanel';
-export type { IssuesPanelProps } from './panels/IssuesPanel';
-export { default as GraphEditorInfoPanel } from './panels/GraphEditorInfoPanel';
-export type { GraphEditorInfoPanelProps } from './panels/GraphEditorInfoPanel';
-export { default as NodesPanel } from './panels/NodesPanel';
-export type { NodesPanelProps } from './panels/NodesPanel';
-export { default as AdvancedJsonPanel } from './panels/AdvancedJsonPanel';
-export type { AdvancedJsonPanelProps } from './panels/AdvancedJsonPanel';
-export { default as InspectorPanel, DEFAULT_OUTCOME_OPTIONS } from './panels/InspectorPanel';
-export type { InspectorPanelProps, InspectorNodeRenderContext, InspectorChoiceRenderContext, } from './panels/InspectorPanel';
-export { default as AppearancePanel } from './panels/AppearancePanel';
-export type { AppearancePanelProps } from './panels/AppearancePanel';
-export { default as SelectedEdgePanel } from './panels/SelectedEdgePanel';
-export type { SelectedEdgePanelProps } from './panels/SelectedEdgePanel';
-export { default as ChoiceTemplatesPanel } from './panels/ChoiceTemplatesPanel';
-export type { ChoiceTemplatesPanelProps, ChoiceTemplateItem, ChoicePresetItem } from './panels/ChoiceTemplatesPanel';
-export type { ChoiceTypeOption } from './panels/InspectorPanel';
-export { default as ChoiceEdgeAppearanceFields } from './panels/ChoiceEdgeAppearanceFields';
-export type { ChoiceEdgeAppearanceFieldsProps } from './panels/ChoiceEdgeAppearanceFields';
-export { default as PublishReviewModal } from './modals/PublishReviewModal';
-export type { PublishReviewModalProps } from './modals/PublishReviewModal';
-export { default as DraftHistoryModal } from './modals/DraftHistoryModal';
-export type { DraftHistoryModalProps } from './modals/DraftHistoryModal';
-export { default as AuditLogModal } from './modals/AuditLogModal';
-export type { AuditLogModalProps } from './modals/AuditLogModal';
-export { default as ToolbarPanel, TOOLBAR_ITEM_KIND } from './panels/ToolbarPanel';
-export type { ToolbarPanelProps, ToolbarItem, ToolbarItemKind, ToolbarButtonItem, ToolbarDropdownItem, ToolbarDropdownEntry, ToolbarBadgeItem, ToolbarTextItem, ToolbarCustomItem, } from './panels/ToolbarPanel';
-export { getIssueSeverityBadgeClass } from './lib/panelHelpers';
-export { LIST_SELECTION_CLASS, CANVAS_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS, CANVAS_SELECTION_TEXT_CLASS } from './lib/selectionStyles';
-export { default as PanelHeaderCollapseCarets } from './lib/PanelHeaderCollapseCarets';
-export { buildDefaultToolbarSpec } from './lib/buildDefaultToolbarSpec';
-export type { BuildDefaultToolbarSpecOptions, DefaultToolbarActions, DefaultToolbarCapabilities, DefaultToolbarLabels, DefaultToolbarNodeType, DefaultToolbarState, DefaultToolbarTemplate, } from './lib/buildDefaultToolbarSpec';
+export { default as IssuesPanel } from './panels/IssuesPanel.js';
+export type { IssuesPanelProps } from './panels/IssuesPanel.js';
+export { default as GraphEditorInfoPanel } from './panels/GraphEditorInfoPanel.js';
+export type { GraphEditorInfoPanelProps } from './panels/GraphEditorInfoPanel.js';
+export { default as NodesPanel } from './panels/NodesPanel.js';
+export type { NodesPanelProps } from './panels/NodesPanel.js';
+export { default as AdvancedJsonPanel } from './panels/AdvancedJsonPanel.js';
+export type { AdvancedJsonPanelProps } from './panels/AdvancedJsonPanel.js';
+export { default as InspectorPanel, DEFAULT_OUTCOME_OPTIONS } from './panels/InspectorPanel.js';
+export type { InspectorPanelProps, InspectorNodeRenderContext, InspectorChoiceRenderContext, } from './panels/InspectorPanel.js';
+export { default as AppearancePanel } from './panels/AppearancePanel.js';
+export type { AppearancePanelProps } from './panels/AppearancePanel.js';
+export { default as SelectedEdgePanel } from './panels/SelectedEdgePanel.js';
+export type { SelectedEdgePanelProps } from './panels/SelectedEdgePanel.js';
+export { default as ChoiceTemplatesPanel } from './panels/ChoiceTemplatesPanel.js';
+export type { ChoiceTemplatesPanelProps, ChoiceTemplateItem, ChoicePresetItem } from './panels/ChoiceTemplatesPanel.js';
+export type { ChoiceTypeOption } from './panels/InspectorPanel.js';
+export { default as ChoiceEdgeAppearanceFields } from './panels/ChoiceEdgeAppearanceFields.js';
+export type { ChoiceEdgeAppearanceFieldsProps } from './panels/ChoiceEdgeAppearanceFields.js';
+export { default as PublishReviewModal } from './modals/PublishReviewModal.js';
+export type { PublishReviewModalProps } from './modals/PublishReviewModal.js';
+export { default as DraftHistoryModal } from './modals/DraftHistoryModal.js';
+export type { DraftHistoryModalProps } from './modals/DraftHistoryModal.js';
+export { default as AuditLogModal } from './modals/AuditLogModal.js';
+export type { AuditLogModalProps } from './modals/AuditLogModal.js';
+export { default as ToolbarPanel, TOOLBAR_ITEM_KIND } from './panels/ToolbarPanel.js';
+export type { ToolbarPanelProps, ToolbarItem, ToolbarItemKind, ToolbarButtonItem, ToolbarDropdownItem, ToolbarDropdownEntry, ToolbarBadgeItem, ToolbarTextItem, ToolbarCustomItem, } from './panels/ToolbarPanel.js';
+export { getIssueSeverityBadgeClass } from './lib/panelHelpers.js';
+export { LIST_SELECTION_CLASS, CANVAS_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS, CANVAS_SELECTION_TEXT_CLASS } from './lib/selectionStyles.js';
+export { default as PanelHeaderCollapseCarets } from './lib/PanelHeaderCollapseCarets.js';
+export { buildDefaultToolbarSpec } from './lib/buildDefaultToolbarSpec.js';
+export type { BuildDefaultToolbarSpecOptions, DefaultToolbarActions, DefaultToolbarCapabilities, DefaultToolbarLabels, DefaultToolbarNodeType, DefaultToolbarState, DefaultToolbarTemplate, } from './lib/buildDefaultToolbarSpec.js';
 export { END_NODE_ID, GRAPH_SELECTION_KIND, safeUUID, getTransition, upsertTransition, deleteTransitionsForChoice, lintEditorTree, parsePydanticOutcomeErrors, shouldQueueInitialValidation, TREE_SPEC_NODE_TYPE_PRESETS, autoLayoutTree, getNextSpawnPosition, needsInitialLayout, getThemeHints, getEditorHints, isNodeLocked, patchEditorHints, editorHintsToStyle, RENDER_HINTS_THEME_NS, RENDER_HINTS_EDITOR_NS, GRAPH_POSITION_KEY, getAutosaveStatusLabel, AUTOSAVE_STATUS, getKeyboardShortcutAction, KEYBOARD_SHORTCUT_ACTION, applyTreeTemplate, applyEditorConnectOnDrop, computeTreeDiffSummary, deleteNode, duplicateNode, buildStableEntries, } from '@signalsafe/tree-spec-editor-core';
 export type { EditorChoice, EditorNode, EditorTransition, EditorTree, GraphEditorIssue, GraphSelection, GraphSelectionKind, ReactFlowEdgeChange, ReactFlowNodeChange, TreeSpecAuditEventItem, TreeSpecSnapshotItem, TreeSpecNodeTypePreset, AutosaveStatus, KeyboardShortcutAction, KeyboardShortcutParams, ApplyTreeTemplateOptions, TreeDiffSummary, TreeTemplateNodeSpec, TreeTemplateSpec, TreeTemplateTransitionSpec, ConnectOnDropOptions, NodeEditorHints, GraphPosition, } from '@signalsafe/tree-spec-editor-core';
 export type { TreeSpecIssue, TreeSpecWire } from '@signalsafe/tree-spec';

package/dist/index.js

@@ -22,23 +22,23 @@
  * - `lib/` — UI-flavored helpers (Bootstrap severity badge classes)
  */
 export { default } from '@signalsafe/tree-spec-editor-react';
-export { default as IssuesPanel } from './panels/IssuesPanel';
-export { default as GraphEditorInfoPanel } from './panels/GraphEditorInfoPanel';
-export { default as NodesPanel } from './panels/NodesPanel';
-export { default as AdvancedJsonPanel } from './panels/AdvancedJsonPanel';
-export { default as InspectorPanel, DEFAULT_OUTCOME_OPTIONS } from './panels/InspectorPanel';
-export { default as AppearancePanel } from './panels/AppearancePanel';
-export { default as SelectedEdgePanel } from './panels/SelectedEdgePanel';
-export { default as ChoiceTemplatesPanel } from './panels/ChoiceTemplatesPanel';
-export { default as ChoiceEdgeAppearanceFields } from './panels/ChoiceEdgeAppearanceFields';
-export { default as PublishReviewModal } from './modals/PublishReviewModal';
-export { default as DraftHistoryModal } from './modals/DraftHistoryModal';
-export { default as AuditLogModal } from './modals/AuditLogModal';
-export { default as ToolbarPanel, TOOLBAR_ITEM_KIND } from './panels/ToolbarPanel';
-export { getIssueSeverityBadgeClass } from './lib/panelHelpers';
-export { LIST_SELECTION_CLASS, CANVAS_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS, CANVAS_SELECTION_TEXT_CLASS } from './lib/selectionStyles';
-export { default as PanelHeaderCollapseCarets } from './lib/PanelHeaderCollapseCarets';
-export { buildDefaultToolbarSpec } from './lib/buildDefaultToolbarSpec';
+export { default as IssuesPanel } from './panels/IssuesPanel.js';
+export { default as GraphEditorInfoPanel } from './panels/GraphEditorInfoPanel.js';
+export { default as NodesPanel } from './panels/NodesPanel.js';
+export { default as AdvancedJsonPanel } from './panels/AdvancedJsonPanel.js';
+export { default as InspectorPanel, DEFAULT_OUTCOME_OPTIONS } from './panels/InspectorPanel.js';
+export { default as AppearancePanel } from './panels/AppearancePanel.js';
+export { default as SelectedEdgePanel } from './panels/SelectedEdgePanel.js';
+export { default as ChoiceTemplatesPanel } from './panels/ChoiceTemplatesPanel.js';
+export { default as ChoiceEdgeAppearanceFields } from './panels/ChoiceEdgeAppearanceFields.js';
+export { default as PublishReviewModal } from './modals/PublishReviewModal.js';
+export { default as DraftHistoryModal } from './modals/DraftHistoryModal.js';
+export { default as AuditLogModal } from './modals/AuditLogModal.js';
+export { default as ToolbarPanel, TOOLBAR_ITEM_KIND } from './panels/ToolbarPanel.js';
+export { getIssueSeverityBadgeClass } from './lib/panelHelpers.js';
+export { LIST_SELECTION_CLASS, CANVAS_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS, CANVAS_SELECTION_TEXT_CLASS } from './lib/selectionStyles.js';
+export { default as PanelHeaderCollapseCarets } from './lib/PanelHeaderCollapseCarets.js';
+export { buildDefaultToolbarSpec } from './lib/buildDefaultToolbarSpec.js';
 /* ------------------------------------------------------------------------- */
 /* Framework-agnostic re-exports from @signalsafe/tree-spec-editor-core.     */
 /* Hosts may consume these directly from `-core` to skip the React surface.  */

package/dist/panels/AdvancedJsonPanel.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Button } from 'react-bootstrap';
-import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets';
+import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets.js';
 const DEFAULT_TITLE = 'Advanced JSON (read-only)';
 export default function AdvancedJsonPanel({ children, title = DEFAULT_TITLE, subtitle, onExpandAll, onCollapseAll, expandAllLabel = 'Expand all', collapseAllLabel = 'Compress all', className, }) {
     const [expanded, setExpanded] = useState(true);

package/dist/panels/AppearancePanel.d.ts

@@ -4,7 +4,7 @@
  */
 import type { ReactNode } from 'react';
 import { type ChoiceEdgeHints, type EditorNode, type EditorTransition, type EditorTree } from '@signalsafe/tree-spec-editor-core';
-import type { InspectorNodeRenderContext } from './InspectorPanel';
+import type { InspectorNodeRenderContext } from './InspectorPanel.js';
 export interface AppearancePanelProps {
     tree: EditorTree;
     selectedNode: EditorNode | null;

package/dist/panels/AppearancePanel.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
 import { getTransition, } from '@signalsafe/tree-spec-editor-core';
-import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets';
-import { PanelNodeLink } from '../lib/panelNodeLink';
-import ChoiceEdgeAppearanceFields from './ChoiceEdgeAppearanceFields';
+import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets.js';
+import { PanelNodeLink } from '../lib/panelNodeLink.js';
+import ChoiceEdgeAppearanceFields from './ChoiceEdgeAppearanceFields.js';
 function resolveActiveChoiceId(choices, selectedEdge, focusChoiceId) {
     if (selectedEdge)
         return selectedEdge.fromChoiceId;

package/dist/panels/ChoiceTemplatesPanel.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Button, Card } from 'react-bootstrap';
-import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets';
+import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets.js';
 export default function ChoiceTemplatesPanel({ templates, selectedNodeId, isPublished = false, onApplyTemplate, }) {
     const [expanded, setExpanded] = useState(true);
     const disabled = isPublished || !selectedNodeId;

package/dist/panels/GraphEditorInfoPanel.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Badge, Form, Table } from 'react-bootstrap';
-import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets';
+import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets.js';
 import { EDITOR_EDGE_TYPE_OPTIONS, getAutosaveStatusLabel, } from '@signalsafe/tree-spec-editor-core';
 function defaultFormatTimestamp(iso) {
     return new Date(iso).toLocaleString();

package/dist/panels/InspectorPanel.d.ts

@@ -1,4 +1,4 @@
-import { type InspectorPanelProps } from './inspector/types';
-export { DEFAULT_OUTCOME_OPTIONS, type ChoiceTypeOption, type InspectorChoiceRenderContext, type InspectorNodeRenderContext, type InspectorPanelProps, } from './inspector/types';
+import { type InspectorPanelProps } from './inspector/types.js';
+export { DEFAULT_OUTCOME_OPTIONS, type ChoiceTypeOption, type InspectorChoiceRenderContext, type InspectorNodeRenderContext, type InspectorPanelProps, } from './inspector/types.js';
 export default function InspectorPanel({ tree, selectedNode, focusChoiceId, isPublished, onUpdateSelectedNode, onAddChoice, onDeleteChoice, onMoveChoice, onSetChoiceTarget, onSetChoiceOutcome, outcomeOptions, hideOutcomeField, renderExtraNodeFields, renderExtraChoiceFields, choiceTypes, onSetChoiceType, title, emptyStateText, typeHelperText, onDeleteSelectedNode, onFocusChoice, }: Readonly<InspectorPanelProps>): import("react").JSX.Element;
 //# sourceMappingURL=InspectorPanel.d.ts.map

package/dist/panels/InspectorPanel.js

@@ -14,10 +14,10 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  *   - `renderExtraChoiceFields`: render additional UI below each choice card.
  *   - `choiceTypes` / `onSetChoiceType`: host-defined choice type catalog (stable ids).
  */
-import ChoiceEditorList from './inspector/ChoiceEditorList';
-import RequiredNodeCard from './inspector/RequiredNodeCard';
-import { DEFAULT_OUTCOME_OPTIONS, DEFAULT_TYPE_HELPER_TEXT, } from './inspector/types';
-export { DEFAULT_OUTCOME_OPTIONS, } from './inspector/types';
+import ChoiceEditorList from './inspector/ChoiceEditorList.js';
+import RequiredNodeCard from './inspector/RequiredNodeCard.js';
+import { DEFAULT_OUTCOME_OPTIONS, DEFAULT_TYPE_HELPER_TEXT, } from './inspector/types.js';
+export { DEFAULT_OUTCOME_OPTIONS, } from './inspector/types.js';
 export default function InspectorPanel({ tree, selectedNode, focusChoiceId = null, isPublished = false, onUpdateSelectedNode, onAddChoice, onDeleteChoice, onMoveChoice, onSetChoiceTarget, onSetChoiceOutcome, outcomeOptions = DEFAULT_OUTCOME_OPTIONS, hideOutcomeField = false, renderExtraNodeFields, renderExtraChoiceFields, choiceTypes, onSetChoiceType, title = 'Required', emptyStateText = 'Select a node to edit it.', typeHelperText = DEFAULT_TYPE_HELPER_TEXT, onDeleteSelectedNode, onFocusChoice, }) {
     return (_jsx("div", { children: selectedNode ? (_jsxs(_Fragment, { children: [_jsx(RequiredNodeCard, { tree: tree, selectedNode: selectedNode, isPublished: isPublished, title: title, typeHelperText: typeHelperText, onUpdateSelectedNode: onUpdateSelectedNode, onDeleteSelectedNode: onDeleteSelectedNode, renderExtraNodeFields: renderExtraNodeFields }), _jsx(ChoiceEditorList, { tree: tree, selectedNode: selectedNode, focusChoiceId: focusChoiceId, isPublished: isPublished, onAddChoice: onAddChoice, onUpdateSelectedNode: onUpdateSelectedNode, onDeleteChoice: onDeleteChoice, onMoveChoice: onMoveChoice, onSetChoiceTarget: onSetChoiceTarget, onSetChoiceOutcome: onSetChoiceOutcome, outcomeOptions: outcomeOptions, hideOutcomeField: hideOutcomeField, renderExtraChoiceFields: renderExtraChoiceFields, choiceTypes: choiceTypes, onSetChoiceType: onSetChoiceType, onFocusChoice: onFocusChoice })] })) : (_jsx("div", { className: "text-muted", children: _jsx("em", { children: emptyStateText }) })) }));
 }

package/dist/panels/IssuesPanel.js

@@ -2,9 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useMemo, useState } from 'react';
 import { Form } from 'react-bootstrap';
 import { buildStableEntries, GRAPH_SELECTION_KIND, } from '@signalsafe/tree-spec-editor-core';
-import { getIssueSeverityBadgeClass } from '../lib/panelHelpers';
-import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets';
-import { LIST_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS } from '../lib/selectionStyles';
+import { getIssueSeverityBadgeClass } from '../lib/panelHelpers.js';
+import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets.js';
+import { LIST_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS } from '../lib/selectionStyles.js';
 function defaultFormatTimestamp(iso) {
     return new Date(iso).toLocaleString();
 }

package/dist/panels/NodesPanel.js

@@ -2,8 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Form } from 'react-bootstrap';
 import { GRAPH_SELECTION_KIND, TREE_SPEC_NODE_TYPE_PRESETS, } from '@signalsafe/tree-spec-editor-core';
-import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets';
-import { LIST_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS } from '../lib/selectionStyles';
+import PanelHeaderCollapseCarets from '../lib/PanelHeaderCollapseCarets.js';
+import { LIST_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS } from '../lib/selectionStyles.js';
 const DEFAULT_TIP_TEXT = 'Tip: connect choices by dragging the blue dots. Shortcuts: \u2318S save, \u2318\u21E7V validate, \u2318D duplicate, Del delete.';
 const TYPE_SORT_ORDER = new Map(TREE_SPEC_NODE_TYPE_PRESETS.map((t, i) => [t, i]));
 function choiceLine(n) {

package/dist/panels/SelectedEdgePanel.d.ts

@@ -6,9 +6,9 @@
  */
 import type { ReactNode } from 'react';
 import type { EditorTransition } from '@signalsafe/tree-spec-editor-core';
-import { type PanelNodeLinkContext } from '../lib/panelNodeLink';
+import { type PanelNodeLinkContext } from '../lib/panelNodeLink.js';
 export type SelectedEdgeDetailsContext = PanelNodeLinkContext;
-export { PanelNodeLink } from '../lib/panelNodeLink';
+export { PanelNodeLink } from '../lib/panelNodeLink.js';
 export interface SelectedEdgePanelProps {
     selectedEdge: EditorTransition | null;
     /** Select a node when its id is clicked in the default details line. */

package/dist/panels/SelectedEdgePanel.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { renderDefaultEdgeBreadcrumb } from '../lib/panelNodeLink';
-export { PanelNodeLink } from '../lib/panelNodeLink';
+import { renderDefaultEdgeBreadcrumb } from '../lib/panelNodeLink.js';
+export { PanelNodeLink } from '../lib/panelNodeLink.js';
 export default function SelectedEdgePanel({ selectedEdge, onNodeSelect, title = 'Selected Edge', renderDetails = renderDefaultEdgeBreadcrumb, }) {
     if (!selectedEdge)
         return null;

package/dist/panels/inspector/ChoiceEditorCard.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import { type EditorChoice, type EditorNode, type EditorTree } from '@signalsafe/tree-spec-editor-core';
-import type { ChoiceTypeOption, InspectorChoiceRenderContext } from './types';
+import type { ChoiceTypeOption, InspectorChoiceRenderContext } from './types.js';
 export default function ChoiceEditorCard({ choice, tree, selectedNode, focusChoiceId, isPublished, canMoveUp, canMoveDown, usedChoiceTypeIds, onUpdateSelectedNode, onDeleteChoice, onMoveChoice, onSetChoiceTarget, onSetChoiceOutcome, onSetChoiceType, choiceTypes, outcomeOptions, hideOutcomeField, renderExtraChoiceFields, onFocusChoice, }: Readonly<{
     choice: EditorChoice;
     tree: EditorTree;

package/dist/panels/inspector/ChoiceEditorCard.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Form } from 'react-bootstrap';
 import { END_NODE_ID, getTransition, } from '@signalsafe/tree-spec-editor-core';
-import { LIST_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS } from '../../lib/selectionStyles';
-import { choiceActionIconProps } from './choiceActionIconProps';
+import { LIST_SELECTION_CLASS, LIST_SELECTION_TEXT_CLASS } from '../../lib/selectionStyles.js';
+import { choiceActionIconProps } from './choiceActionIconProps.js';
 export default function ChoiceEditorCard({ choice, tree, selectedNode, focusChoiceId, isPublished, canMoveUp, canMoveDown, usedChoiceTypeIds, onUpdateSelectedNode, onDeleteChoice, onMoveChoice, onSetChoiceTarget, onSetChoiceOutcome, onSetChoiceType, choiceTypes, outcomeOptions, hideOutcomeField, renderExtraChoiceFields, onFocusChoice, }) {
     const transition = getTransition(tree, selectedNode.id, choice.id);
     const targetNodeId = transition?.toNodeId ?? '';

package/dist/panels/inspector/ChoiceEditorList.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import type { EditorNode, EditorTree } from '@signalsafe/tree-spec-editor-core';
-import type { ChoiceTypeOption, InspectorChoiceRenderContext } from './types';
+import type { ChoiceTypeOption, InspectorChoiceRenderContext } from './types.js';
 export default function ChoiceEditorList({ tree, selectedNode, focusChoiceId, isPublished, onAddChoice, onUpdateSelectedNode, onDeleteChoice, onMoveChoice, onSetChoiceTarget, onSetChoiceOutcome, onSetChoiceType, choiceTypes, outcomeOptions, hideOutcomeField, renderExtraChoiceFields, onFocusChoice, }: Readonly<{
     tree: EditorTree;
     selectedNode: EditorNode;

package/dist/panels/inspector/ChoiceEditorList.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
-import PanelHeaderCollapseCarets from '../../lib/PanelHeaderCollapseCarets';
-import ChoiceEditorCard from './ChoiceEditorCard';
+import PanelHeaderCollapseCarets from '../../lib/PanelHeaderCollapseCarets.js';
+import ChoiceEditorCard from './ChoiceEditorCard.js';
 export default function ChoiceEditorList({ tree, selectedNode, focusChoiceId, isPublished, onAddChoice, onUpdateSelectedNode, onDeleteChoice, onMoveChoice, onSetChoiceTarget, onSetChoiceOutcome, onSetChoiceType, choiceTypes, outcomeOptions, hideOutcomeField, renderExtraChoiceFields, onFocusChoice, }) {
     const choices = selectedNode.choices ?? [];
     const [choicesExpanded, setChoicesExpanded] = useState(true);

package/dist/panels/inspector/RequiredNodeCard.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import type { EditorNode, EditorTree } from '@signalsafe/tree-spec-editor-core';
-import type { InspectorNodeRenderContext } from './types';
+import type { InspectorNodeRenderContext } from './types.js';
 export default function RequiredNodeCard({ tree, selectedNode, isPublished, title, typeHelperText, onUpdateSelectedNode, onDeleteSelectedNode, renderExtraNodeFields, }: Readonly<{
     tree: EditorTree;
     selectedNode: EditorNode;

package/dist/panels/inspector/RequiredNodeCard.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Form } from 'react-bootstrap';
-import PanelHeaderCollapseCarets from '../../lib/PanelHeaderCollapseCarets';
-import NodeTypeField from './NodeTypeField';
+import PanelHeaderCollapseCarets from '../../lib/PanelHeaderCollapseCarets.js';
+import NodeTypeField from './NodeTypeField.js';
 export default function RequiredNodeCard({ tree, selectedNode, isPublished, title, typeHelperText, onUpdateSelectedNode, onDeleteSelectedNode, renderExtraNodeFields, }) {
     const [requiredExpanded, setRequiredExpanded] = useState(true);
     return (_jsxs("div", { className: "card", children: [_jsxs("div", { className: "card-header bg-body-secondary py-2 px-2 d-flex justify-content-between align-items-center gap-2", children: [_jsxs("div", { className: "d-flex align-items-center min-w-0", children: [_jsx("span", { className: "fw-semibold", children: title }), _jsx(PanelHeaderCollapseCarets, { expanded: requiredExpanded, onToggle: () => setRequiredExpanded((v) => !v) })] }), onDeleteSelectedNode ? (_jsx("button", { type: "button", className: "btn p-0 border-0 bg-transparent flex-shrink-0", "aria-label": "Delete node", title: "Delete node", disabled: isPublished, onClick: onDeleteSelectedNode, children: _jsx("i", { className: `bi bi-trash action-icon cursor-pointer${isPublished ? ' text-secondary opacity-50' : ' text-danger'}`, "aria-hidden": true }) })) : null] }), _jsxs("div", { className: `card-body${requiredExpanded ? '' : ' d-none'}`, "aria-hidden": !requiredExpanded, children: [_jsx(NodeTypeField, { selectedNode: selectedNode, isPublished: isPublished, onUpdateSelectedNode: onUpdateSelectedNode, typeHelperText: typeHelperText }), _jsxs(Form.Group, { className: "mb-2", children: [_jsx(Form.Label, { children: "Prompt" }), _jsx(Form.Control, { as: "textarea", rows: 4, value: selectedNode.prompt, onChange: (e) => onUpdateSelectedNode({ prompt: e.target.value }) })] }), renderExtraNodeFields

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@signalsafe/tree-spec-editor",
-    "version": "0.2.2",
+    "version": "0.2.3",
     "type": "module",
     "description": "Reusable TreeSpec graph editor (React Flow) and authoring helpers (no API or routing).",
     "license": "MIT",
@@ -41,6 +41,7 @@
     "engines": {
         "node": ">=18"
     },
+    "packageManager": "yarn@1.22.22",
     "publishConfig": {
         "access": "public"
     },
@@ -56,15 +57,16 @@
         "pack:check": "node ../../scripts/check-package-tarball.mjs --tgz \"../../dist/reusable-npm/signalsafe-tree-spec-editor-$npm_package_version.tgz\" --expect package/dist/index.js --expect package/dist/index.d.ts --expect package/package.json --expect package/README.md",
         "smoke:external": "node ../../scripts/smoke-tree-spec-editor-external-consumer.mjs",
         "smoke:published": "node ../../scripts/smoke-tree-spec-editor-external-consumer.mjs --source registry",
+        "smoke:package": "node scripts/smoke-package.mjs",
         "prepublishOnly": "npm run build",
         "prepare": "npm run build",
         "test": "vitest run",
         "test:monorepo": "cd ../../frontend && yarn vitest run --config vitest.tree-spec-editor.config.ts"
     },
     "dependencies": {
-        "@signalsafe/tree-spec": "^0.3.1",
-        "@signalsafe/tree-spec-editor-core": "^0.1.2",
-        "@signalsafe/tree-spec-editor-react": "^0.1.2"
+        "@signalsafe/tree-spec": "^0.3.2",
+        "@signalsafe/tree-spec-editor-core": "^0.1.3",
+        "@signalsafe/tree-spec-editor-react": "^0.1.3"
     },
     "peerDependencies": {
         "react": "^18.0.0",
@@ -82,6 +84,7 @@
         "react-test-renderer": "^18.3.1",
         "reactflow": "^11.11.4",
         "typescript": "^5.4.2",
+        "@vitest/coverage-v8": "^3.2.4",
         "vitest": "^3.2.4"
     }
 }