@kubuild/editor 0.1.3 → 0.3.0

package/README.md

@@ -0,0 +1,106 @@
+# @kubuild/editor
+
+[![npm version](https://img.shields.io/npm/v/@kubuild/editor.svg)](https://www.npmjs.com/package/@kubuild/editor)
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
+[![TypeScript](https://img.shields.io/badge/TypeScript-5.7-blue)](https://www.typescriptlang.org/)
+
+Visual page builder editor for **KUBUILD** featuring an interactive canvas, Action Builder modal, Form Validation & Debugger panels, variable autocomplete, style manager, and mobile-responsive layout.
+
+---
+
+## 📦 Installation
+
+```bash
+# Using pnpm (recommended)
+pnpm add @kubuild/editor @kubuild/components @kubuild/core @kubuild/renderer @kubuild/schema react react-dom zustand lucide-react
+
+# Using npm
+npm install @kubuild/editor @kubuild/components @kubuild/core @kubuild/renderer @kubuild/schema react react-dom zustand lucide-react
+
+# Using yarn
+yarn add @kubuild/editor @kubuild/components @kubuild/core @kubuild/renderer @kubuild/schema react react-dom zustand lucide-react
+```
+
+---
+
+## ✨ Features
+
+- **Interactive Visual Canvas**:
+  - Drag-and-drop components and pre-built starter blocks from side panels onto the canvas with real-time drop indicators.
+  - Inline text editing with rich styling support.
+  - Multi-viewport switcher (Desktop, Tablet, Mobile) with zoom, pan, and alignment guides.
+  - Breadcrumbs navigator and tree hierarchy layers panel.
+- **Action Builder System**:
+  - `ActionBuilderModal`: Visual modal for composing multi-step action workflows (`onClick`, `onSubmit`, `onChange`).
+  - `ActionStepForm`: Dedicated configuration forms for API requests, Toast feedback, Modal toggles, Navigation, and Custom handlers.
+  - `ActionBranchEditor`: Visual branch management for handling Success and Error outcomes in asynchronous actions.
+- **Form Validation & Live Debugger**:
+  - `ActionDebuggerPanel`: Real-time inspection of runtime state, form input values, and live action execution logs.
+  - `FormValidationRulesPanel`: Visual editor for managing form field validation rules (required, regex, email, min/max length).
+- **Variable System & Autocomplete**:
+  - `VariableAutocompleteInput` & Textarea: Intelligent suggestion popups for template variables (e.g. `{{form.email}}`, `{{user.name}}`).
+  - `VariablePicker`: Hierarchical variable catalog for browsing available data sources.
+- **Style Manager Accordion**:
+  - Granular control over Dimensions, Typography, Backgrounds, Borders, Layouts (Flexbox & CSS Grid), Spacing (Box Model), and Motion/Animations.
+- **Mobile & Touch Friendly**:
+  - Adaptive toolbar and bottom navigation bar for mobile devices.
+  - Pointer and touch event drag support for floating navigator and table spreadsheet modals.
+  - Responsive slide-over drawer drawers for sidebars and inspectors.
+- **State Management**:
+  - High-performance reactive store built on Zustand, seamlessly wired to `@kubuild/core` CommandEngine for unlimited undo/redo.
+
+---
+
+## 🚀 Quick Usage
+
+### Embedding the Editor
+
+```tsx
+import React from 'react';
+import { Editor, useEditorStore } from '@kubuild/editor';
+import type { PageDocument } from '@kubuild/schema';
+
+const initialPage: PageDocument = {
+  schema: 'stora.page',
+  version: '1.0.0',
+  metadata: { title: 'New Web Page' },
+  document: {
+    id: 'root',
+    type: 'container',
+    children: []
+  }
+};
+
+export const PageBuilderApp: React.FC = () => {
+  return (
+    <div style={{ width: '100vw', height: '100vh' }}>
+      <Editor
+        initialDocument={initialPage}
+        onSave={(document) => {
+          console.log('Saved document:', document);
+        }}
+        onExport={(format, data) => {
+          console.log(`Exported as ${format}:`, data);
+        }}
+      />
+    </div>
+  );
+};
+```
+
+### Accessing Editor State Programmatically
+
+```typescript
+import { useEditorStore } from '@kubuild/editor';
+
+// Access active selection or trigger commands outside the canvas
+const selectedNodeId = useEditorStore((state) => state.selectedNodeId);
+const undo = useEditorStore((state) => state.undo);
+const redo = useEditorStore((state) => state.redo);
+```
+
+---
+
+## 📄 License
+
+MIT © [KUBUILD](https://github.com/kustora/kubuild)

package/dist/ai/enhance-node.d.ts

@@ -0,0 +1,100 @@
+import type { Node, StyleDefinition } from '@kubuild/schema';
+import type { AiRefactorNodeRequest } from '@kubuild/ai';
+import type { DocumentSecurityLimits } from '@kubuild/core';
+/**
+ * STORA-513 — one changed prop/style/state field between the original node and an AI
+ * enhance candidate. `path` is a dotted pointer such as `props.label`,
+ * `styles.base.color`, or `styles.states.:hover.color` — used to render a targeted diff
+ * line instead of a full object dump (explicitly disallowed by the ticket).
+ */
+export interface EnhanceFieldDiff {
+    path: string;
+    before: unknown;
+    after: unknown;
+}
+export interface EnhanceNodeDiff {
+    fields: EnhanceFieldDiff[];
+    /**
+     * True when the candidate's `children` subtree differs structurally from the
+     * original (not just a props/styles tweak) — e.g. the AI regenerated nested content.
+     * `updateNodeProps`/`updateNodeStyle` can't express this; Apply (STORA-514) falls back
+     * to the `replaceNode` command engine command when this is true.
+     */
+    childrenChanged: boolean;
+}
+/**
+ * STORA-513 — pure diff between an original node and a validated AI enhance candidate.
+ * Only ever surfaces props/styles(+pseudo-state) fields that actually changed, plus a
+ * coarse `childrenChanged` flag — never a full node dump.
+ */
+export declare function diffEnhanceNode(original: Node, candidate: Node): EnhanceNodeDiff;
+export type EnhanceNodeOutcome = {
+    status: 'success';
+    originalNode: Node;
+    candidateNode: Node;
+}
+/** Network/provider/abort failure — already surfaced via `useAiGenerator`'s own `error` state. */
+ | {
+    status: 'no-result';
+}
+/** The candidate failed the STORA-509 normalize/validate pipeline. */
+ | {
+    status: 'invalid';
+    message: string;
+};
+/**
+ * STORA-512 — wires `useAiGenerator().refactorNode` into the same document-safety
+ * pipeline `generate-page.ts` uses for `streamPage` sections: the raw result is
+ * re-validated through `@kubuild/ai`'s `normalizeAndValidateRefactoredNode` (normalize ->
+ * Zod schema validate -> `validateDocumentSecurity`) *before* it is ever shown to the
+ * user as a candidate. This is defense-in-depth, exactly like `runStreamPageGeneration`:
+ * regardless of whether the configured provider already validated server-side via
+ * `KubuildAiEngine`, a host's custom HTTP endpoint may not have.
+ *
+ * Critically, this function never touches the document or the command engine — it only
+ * ever returns a candidate for the caller to hold in local/component state. The original
+ * node is not mutated until the caller explicitly applies the result (STORA-514).
+ */
+export declare function runEnhanceNode(refactorNode: (params: AiRefactorNodeRequest) => Promise<Node | null>, params: AiRefactorNodeRequest, deps?: {
+    securityLimits?: DocumentSecurityLimits;
+}): Promise<EnhanceNodeOutcome>;
+export interface EnhanceCandidate {
+    originalNode: Node;
+    candidateNode: Node;
+    diff: EnhanceNodeDiff;
+}
+export interface ApplyEnhanceResult {
+    success: boolean;
+    error?: string;
+}
+/**
+ * Dependency-injected store bindings for `applyEnhanceCandidate` (STORA-514) — mirrors
+ * `StreamPageGenerationDeps` in `generate-page.ts`: every mutation goes through the exact
+ * same store actions manual editing uses (`updateNodeProps`/`updateNodeStyle`/
+ * `updateNodeStateStyle`), so it lands in `DocumentHistoryManager` and `undo()` reverts it.
+ */
+export interface ApplyEnhanceCandidateDeps {
+    updateNodeProps: (nodeId: string, props: Record<string, unknown>, merge: boolean) => ApplyEnhanceResult;
+    updateNodeStyle: (nodeId: string, styles: StyleDefinition, breakpoint: 'base' | 'desktop' | 'tablet' | 'mobile', merge: boolean) => ApplyEnhanceResult;
+    updateNodeStateStyle: (nodeId: string, styles: StyleDefinition, state: string, merge: boolean) => ApplyEnhanceResult;
+    /** Only invoked when `diff.childrenChanged` — falls back to the `replaceNode` command. */
+    replaceNodeSubtree: (nodeId: string, node: Node) => ApplyEnhanceResult;
+    /** Groups a multi-field apply (props + several style layers) into one undo entry. */
+    beginHistoryTransaction: () => void;
+    endHistoryTransaction: () => void;
+}
+/**
+ * STORA-514 — applies a validated enhance candidate through the command engine, the same
+ * path manual editing already uses. Reuses `updateNodeProps`/`updateNodeStyle` for the
+ * common case (only props/styles changed); falls back to a whole-subtree `replaceNode`
+ * only when `diff.childrenChanged` is true, since `updateNodeProps`/`updateNodeStyle`
+ * can't express a nested-children change.
+ *
+ * The `replaceNode` fallback re-attaches the *original* node's `animation`/`actions`/
+ * `formConfig` onto the candidate before dispatching: `normalizeAndValidateRefactoredNode`
+ * never reads or preserves those fields (the AI enhance pipeline is props/styles/children
+ * only), so without this the candidate would silently wipe out any existing interactivity
+ * config on Apply.
+ */
+export declare function applyEnhanceCandidate(candidate: EnhanceCandidate, deps: ApplyEnhanceCandidateDeps): ApplyEnhanceResult;
+//# sourceMappingURL=enhance-node.d.ts.map

package/dist/ai/enhance-node.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"enhance-node.d.ts","sourceRoot":"","sources":["../../src/ai/enhance-node.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAC;AAEzD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAE5D;;;;;GAKG;AACH,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,gBAAgB,EAAE,CAAC;IAC3B;;;;;OAKG;IACH,eAAe,EAAE,OAAO,CAAC;CAC1B;AAWD;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,GAAG,eAAe,CA+ChF;AAED,MAAM,MAAM,kBAAkB,GAC1B;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,YAAY,EAAE,IAAI,CAAC;IAAC,aAAa,EAAE,IAAI,CAAA;CAAE;AAChE,kGAAkG;GAChG;IAAE,MAAM,EAAE,WAAW,CAAA;CAAE;AACzB,sEAAsE;GACpE;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC;AAE3C;;;;;;;;;;;;GAYG;AACH,wBAAsB,cAAc,CAClC,YAAY,EAAE,CAAC,MAAM,EAAE,qBAAqB,KAAK,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,EACrE,MAAM,EAAE,qBAAqB,EAC7B,IAAI,GAAE;IAAE,cAAc,CAAC,EAAE,sBAAsB,CAAA;CAAO,GACrD,OAAO,CAAC,kBAAkB,CAAC,CAgB7B;AAED,MAAM,WAAW,gBAAgB;IAC/B,YAAY,EAAE,IAAI,CAAC;IACnB,aAAa,EAAE,IAAI,CAAC;IACpB,IAAI,EAAE,eAAe,CAAC;CACvB;AAED,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;GAKG;AACH,MAAM,WAAW,yBAAyB;IACxC,eAAe,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,OAAO,KAAK,kBAAkB,CAAC;IACxG,eAAe,EAAE,CACf,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,eAAe,EACvB,UAAU,EAAE,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,EACpD,KAAK,EAAE,OAAO,KACX,kBAAkB,CAAC;IACxB,oBAAoB,EAAE,CACpB,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,eAAe,EACvB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,OAAO,KACX,kBAAkB,CAAC;IACxB,0FAA0F;IAC1F,kBAAkB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,KAAK,kBAAkB,CAAC;IACvE,qFAAqF;IACrF,uBAAuB,EAAE,MAAM,IAAI,CAAC;IACpC,qBAAqB,EAAE,MAAM,IAAI,CAAC;CACnC;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,qBAAqB,CACnC,SAAS,EAAE,gBAAgB,EAC3B,IAAI,EAAE,yBAAyB,GAC9B,kBAAkB,CA6DpB"}

package/dist/ai/generate-page.d.ts

@@ -0,0 +1,80 @@
+import type { PageDocument } from '@kubuild/schema';
+import type { AiGeneratePageRequest, AiStreamCallbacks } from '@kubuild/ai';
+import { type CommandResult, type DocumentSecurityLimits, type Diagnostic } from '@kubuild/core';
+/**
+ * Progressive-preview status for one `streamPage` session (STORA-508). A canvas/chat
+ * panel subscribes to this via `StreamPageGenerationDeps.onPlaceholderChange` to show a
+ * loading placeholder for the section currently being generated, and to hide it the
+ * instant the real section lands (the real section is rendered by the normal
+ * store -> `KubuildRenderer` path, not a separate preview tree).
+ */
+export interface AiGenerationPlaceholderStatus {
+    /** True while more sections are still expected in this streaming session. */
+    active: boolean;
+    totalSections: number;
+    completedSections: number;
+    currentLabel?: string;
+}
+export interface StreamPageGenerationDeps {
+    /** The editor store's `dispatch` — the only sanctioned document mutation path. */
+    dispatch: (executor: (doc: PageDocument) => CommandResult) => void;
+    /** Reads the live document (called fresh on every section so ids stay collision-free). */
+    getDocument: () => PageDocument;
+    /** Groups every section inserted during the session into one undo entry (STORA-510). */
+    beginHistoryTransaction: () => void;
+    endHistoryTransaction: () => void;
+    /** Reused non-fatal reporting channel — same `onDiagnostic` prop used elsewhere in the editor. */
+    onDiagnostic?: (diagnostic: Diagnostic) => void;
+    /** STORA-508 progressive-preview hook. */
+    onPlaceholderChange?: (status: AiGenerationPlaceholderStatus | null) => void;
+    /** Same security limits `.stora` import uses; omit to use `@kubuild/core`'s defaults. */
+    securityLimits?: DocumentSecurityLimits;
+    /** Insertion target for generated sections. Defaults to the document's root page node. */
+    parentId?: string;
+}
+/**
+ * Pure visibility rule for the STORA-508 canvas placeholder — kept as a standalone
+ * function (rather than inlined JSX conditionals) so it's trivially unit-testable
+ * without needing to render the canvas: the placeholder only ever shows on the active
+ * artboard, never in preview mode, and only while a generation session reports itself
+ * as still active.
+ */
+export declare function shouldShowAiGenerationPlaceholder(params: {
+    isActive: boolean;
+    previewMode: boolean;
+    aiGenerationStatus: AiGenerationPlaceholderStatus | null | undefined;
+}): boolean;
+export interface StreamPageGenerationSummary {
+    insertedSectionIds: string[];
+    failedSectionCount: number;
+    totalSections: number;
+    /** Whether the stream itself emitted an `error` event (network/provider/parse failure). */
+    streamErrored: boolean;
+}
+type StreamPageFn = (params: AiGeneratePageRequest, callbacks?: AiStreamCallbacks) => Promise<PageDocument | null>;
+/**
+ * STORA-507/509/510 — wires `useAiGenerator().streamPage()` into the editor's command
+ * engine and history.
+ *
+ * Every `section` event is independently re-run through `@kubuild/ai`'s
+ * `normalizeAndValidateSectionNode` — the same normalize -> Zod schema validate ->
+ * `validateDocumentSecurity` pipeline used for `.stora` import (docs/ARCHITECTURE.md
+ * §31/§40) — before ever being dispatched as `insertNode`. This is defense-in-depth:
+ * it re-validates regardless of whether the configured provider already went through
+ * `KubuildAiEngine` server-side (a host's custom HTTP endpoint may not have).
+ *
+ * - **Partial success (STORA-507)**: a section that fails validation, or that fails to
+ *   insert (e.g. an id collision `insertNode` rejects), is reported via `onDiagnostic`
+ *   and skipped — it never blocks subsequent sections. Because validation always runs
+ *   strictly before dispatch, every section that *is* inserted is independently valid,
+ *   so the document is never left in a partially-invalid state, including when the
+ *   stream later emits an `error` event.
+ * - **Progressive preview (STORA-508)**: `onPlaceholderChange` fires as each section
+ *   starts/finishes generating so a canvas placeholder can be shown/hidden; the real
+ *   section renders through the exact same store/renderer path as any manual edit.
+ * - **Batched history (STORA-510)**: the whole session is wrapped in one history
+ *   transaction, so a single `undo()` reverts every section this call inserted.
+ */
+export declare function runStreamPageGeneration(streamPage: StreamPageFn, params: AiGeneratePageRequest, deps: StreamPageGenerationDeps): Promise<StreamPageGenerationSummary>;
+export {};
+//# sourceMappingURL=generate-page.d.ts.map

package/dist/ai/generate-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"generate-page.d.ts","sourceRoot":"","sources":["../../src/ai/generate-page.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,KAAK,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAE5E,OAAO,EAIL,KAAK,aAAa,EAClB,KAAK,sBAAsB,EAC3B,KAAK,UAAU,EAChB,MAAM,eAAe,CAAC;AAEvB;;;;;;GAMG;AACH,MAAM,WAAW,6BAA6B;IAC5C,6EAA6E;IAC7E,MAAM,EAAE,OAAO,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,wBAAwB;IACvC,kFAAkF;IAClF,QAAQ,EAAE,CAAC,QAAQ,EAAE,CAAC,GAAG,EAAE,YAAY,KAAK,aAAa,KAAK,IAAI,CAAC;IACnE,0FAA0F;IAC1F,WAAW,EAAE,MAAM,YAAY,CAAC;IAChC,wFAAwF;IACxF,uBAAuB,EAAE,MAAM,IAAI,CAAC;IACpC,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAClC,kGAAkG;IAClG,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAChD,0CAA0C;IAC1C,mBAAmB,CAAC,EAAE,CAAC,MAAM,EAAE,6BAA6B,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7E,yFAAyF;IACzF,cAAc,CAAC,EAAE,sBAAsB,CAAC;IACxC,0FAA0F;IAC1F,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;GAMG;AACH,wBAAgB,iCAAiC,CAAC,MAAM,EAAE;IACxD,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,kBAAkB,EAAE,6BAA6B,GAAG,IAAI,GAAG,SAAS,CAAC;CACtE,GAAG,OAAO,CAEV;AAED,MAAM,WAAW,2BAA2B;IAC1C,kBAAkB,EAAE,MAAM,EAAE,CAAC;IAC7B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,aAAa,EAAE,MAAM,CAAC;IACtB,2FAA2F;IAC3F,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,KAAK,YAAY,GAAG,CAClB,MAAM,EAAE,qBAAqB,EAC7B,SAAS,CAAC,EAAE,iBAAiB,KAC1B,OAAO,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;AAElC;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAsB,uBAAuB,CAC3C,UAAU,EAAE,YAAY,EACxB,MAAM,EAAE,qBAAqB,EAC7B,IAAI,EAAE,wBAAwB,GAC7B,OAAO,CAAC,2BAA2B,CAAC,CAmGtC"}

package/dist/ai/index.d.ts

@@ -0,0 +1,3 @@
+export * from './generate-page';
+export * from './enhance-node';
+//# sourceMappingURL=index.d.ts.map

package/dist/ai/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ai/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC"}

package/dist/components/action-builder/action-branch-editor.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { ActionStep, PageDocument } from '@kubuild/schema';
+export interface ActionBranchEditorProps {
+    parentStep: ActionStep;
+    document?: PageDocument;
+    onUpdateSuccessSteps: (steps: ActionStep[]) => void;
+    onUpdateErrorSteps: (steps: ActionStep[]) => void;
+    className?: string;
+}
+export interface BranchLaneProps {
+    branchType: 'success' | 'error';
+    steps: ActionStep[];
+    document?: PageDocument;
+    onUpdateSteps: (steps: ActionStep[]) => void;
+}
+export declare const BranchLane: React.FC<BranchLaneProps>;
+export declare const ActionBranchEditor: React.FC<ActionBranchEditorProps>;
+//# sourceMappingURL=action-branch-editor.d.ts.map

package/dist/components/action-builder/action-branch-editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-branch-editor.d.ts","sourceRoot":"","sources":["../../../src/components/action-builder/action-branch-editor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EACL,UAAU,EAEV,YAAY,EACb,MAAM,iBAAiB,CAAC;AAmBzB,MAAM,WAAW,uBAAuB;IACtC,UAAU,EAAE,UAAU,CAAC;IACvB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,oBAAoB,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACpD,kBAAkB,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,EAAE,SAAS,GAAG,OAAO,CAAC;IAChC,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,aAAa,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;CAC9C;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAsQhD,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAuChE,CAAC"}

package/dist/components/action-builder/action-builder-modal.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { PageDocument, ActionStep, ActionStepType, ActionTriggerType } from '@kubuild/schema';
+export interface ActionBuilderModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    nodeId?: string | null;
+    initialTrigger?: ActionTriggerType;
+    document?: PageDocument;
+}
+export interface TriggerMeta {
+    type: ActionTriggerType;
+    label: string;
+    description: string;
+    badge: string;
+}
+export declare const TRIGGER_OPTIONS: TriggerMeta[];
+export interface StepTypeMeta {
+    type: ActionStepType;
+    label: string;
+    description: string;
+    category: 'network' | 'ui' | 'navigation' | 'state' | 'utility';
+    icon: React.ComponentType<{
+        className?: string;
+    }>;
+    defaultPayload: Record<string, unknown>;
+}
+export declare const STEP_TYPE_OPTIONS: StepTypeMeta[];
+export declare function getStepTypeMeta(type: ActionStepType): StepTypeMeta;
+export declare function getCategoryBadgeClass(category: 'network' | 'ui' | 'navigation' | 'state' | 'utility'): string;
+export declare function formatStepSummary(step: ActionStep): string;
+export declare const ActionBuilderModal: React.FC<ActionBuilderModalProps>;
+//# sourceMappingURL=action-builder-modal.d.ts.map

package/dist/components/action-builder/action-builder-modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-builder-modal.d.ts","sourceRoot":"","sources":["../../../src/components/action-builder/action-builder-modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAC;AACzE,OAAO,EACL,YAAY,EAEZ,UAAU,EACV,cAAc,EACd,iBAAiB,EAClB,MAAM,iBAAiB,CAAC;AA6BzB,MAAM,WAAW,uBAAuB;IACtC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC,QAAQ,CAAC,EAAE,YAAY,CAAC;CACzB;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,iBAAiB,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,eAAe,EAAE,WAAW,EAqCxC,CAAC;AAEF,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,SAAS,GAAG,IAAI,GAAG,YAAY,GAAG,OAAO,GAAG,SAAS,CAAC;IAChE,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAClD,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACzC;AAED,eAAO,MAAM,iBAAiB,EAAE,YAAY,EAkG3C,CAAC;AAEF,wBAAgB,eAAe,CAAC,IAAI,EAAE,cAAc,GAAG,YAAY,CAWlE;AAED,wBAAgB,qBAAqB,CAAC,QAAQ,EAAE,SAAS,GAAG,IAAI,GAAG,YAAY,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAc7G;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CA6C1D;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA+qBhE,CAAC"}

package/dist/components/action-builder/action-step-form.d.ts

@@ -0,0 +1,71 @@
+import React from 'react';
+import { ActionStep, PageDocument } from '@kubuild/schema';
+export interface ActionStepFormProps {
+    step: ActionStep;
+    document?: PageDocument;
+    onUpdatePayload: (payload: Record<string, unknown>) => void;
+    onUpdateMeta?: (meta: {
+        label?: string;
+        timeout?: number;
+        continueOnError?: boolean;
+    }) => void;
+    onUpdateBranches?: (branches: {
+        onSuccess?: ActionStep[];
+        onError?: ActionStep[];
+    }) => void;
+    className?: string;
+    hideBranches?: boolean;
+}
+export interface KeyValueEditorProps {
+    title: string;
+    entries: Record<string, unknown> | undefined;
+    onChange: (updated: Record<string, string>) => void;
+    document?: PageDocument;
+    keyPlaceholder?: string;
+    valuePlaceholder?: string;
+    emptyLabel?: string;
+}
+export declare const KeyValueEditor: React.FC<KeyValueEditorProps>;
+export declare const ApiRequestStepForm: React.FC<{
+    payload: Record<string, unknown>;
+    document?: PageDocument;
+    onChange: (payload: Record<string, unknown>) => void;
+}>;
+export declare const ShowToastStepForm: React.FC<{
+    payload: Record<string, unknown>;
+    document?: PageDocument;
+    onChange: (payload: Record<string, unknown>) => void;
+}>;
+export declare const NavigateStepForm: React.FC<{
+    payload: Record<string, unknown>;
+    document?: PageDocument;
+    onChange: (payload: Record<string, unknown>) => void;
+}>;
+export declare const ModalStepForm: React.FC<{
+    payload: Record<string, unknown>;
+    isOpenAction: boolean;
+    document?: PageDocument;
+    onChange: (payload: Record<string, unknown>) => void;
+}>;
+export declare const SetStateStepForm: React.FC<{
+    payload: Record<string, unknown>;
+    document?: PageDocument;
+    onChange: (payload: Record<string, unknown>) => void;
+}>;
+export declare const ResetFormStepForm: React.FC<{
+    payload: Record<string, unknown>;
+    document?: PageDocument;
+    onChange: (payload: Record<string, unknown>) => void;
+}>;
+export declare const CopyClipboardStepForm: React.FC<{
+    payload: Record<string, unknown>;
+    document?: PageDocument;
+    onChange: (payload: Record<string, unknown>) => void;
+}>;
+export declare const CustomEventStepForm: React.FC<{
+    payload: Record<string, unknown>;
+    document?: PageDocument;
+    onChange: (payload: Record<string, unknown>) => void;
+}>;
+export declare const ActionStepForm: React.FC<ActionStepFormProps>;
+//# sourceMappingURL=action-step-form.d.ts.map

package/dist/components/action-builder/action-step-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-step-form.d.ts","sourceRoot":"","sources":["../../../src/components/action-builder/action-step-form.tsx"],"names":[],"mappings":"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"}

package/dist/components/action-builder/index.d.ts

@@ -0,0 +1,4 @@
+export * from './action-branch-editor';
+export * from './action-builder-modal';
+export * from './action-step-form';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/action-builder/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/action-builder/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC"}

package/dist/components/ai-chat/ai-chat-panel.d.ts

@@ -0,0 +1,66 @@
+import React from 'react';
+import type { PageDocument } from '@kubuild/schema';
+import { type Diagnostic } from '@kubuild/core';
+import { ComponentRegistry } from '@kubuild/components';
+import type { AiChatHistoryStorageAdapter } from '@kubuild/ai/react';
+import type { AiChatMessage } from '@kubuild/ai';
+import { ResolvedAiEditorConfig } from '../../config';
+export interface AiChatPanelProps {
+    /** Fully-resolved AI config (STORA-501) — panel must only ever be mounted when this is enabled. */
+    aiConfig: ResolvedAiEditorConfig;
+    /** `'hidden'` is handled by the caller not mounting this component at all. */
+    mode: 'docked' | 'floating';
+    onClose?: () => void;
+    onToggleMode?: () => void;
+    className?: string;
+    /**
+     * Seeds `useAiChat`'s message history (e.g. a persisted chat restored by the host, or a
+     * fixture in tests). Passed straight through to `useAiChat({ initialMessages })`.
+     */
+    initialMessages?: AiChatMessage[];
+    /**
+     * Optional chat history persistence adapter (STORA-520), passed straight through to
+     * `useAiChat({ historyStorage })`. Without it, chat history stays pure in-memory React
+     * state and is lost on reload — exactly as before. Hosts can implement this with
+     * `localStorage`, a Stora.page backend call, etc.; `@kubuild/ai`/`@kubuild/editor`
+     * never assume a concrete storage mechanism.
+     */
+    historyStorage?: AiChatHistoryStorageAdapter;
+    /**
+     * Optional overrides for the document/selection this panel builds AI context from,
+     * following the same prop-over-store precedence as `InspectorPanel`. Falls back to the
+     * live editor store when omitted — real usage should always omit these.
+     */
+    document?: PageDocument;
+    selectedNodeId?: string | null;
+    /**
+     * Component registry used to validate an AI enhance candidate's props before Apply
+     * (STORA-514), the same registry manual editing (`InspectorPanel`) validates against.
+     * Defaults to `createDefaultComponentRegistry()` so existing callers/tests that predate
+     * STORA-512 keep compiling without passing one.
+     */
+    registry?: ComponentRegistry;
+    /**
+     * Non-fatal reporting channel for full-page generation (STORA-507/509) — the same
+     * `onDiagnostic` prop `KubuildEditorProps` already exposes for import/validation
+     * diagnostics elsewhere in the editor. A section that fails validation is reported
+     * here and skipped; it never silently corrupts the document or blocks other sections.
+     */
+    onDiagnostic?: (diagnostic: Diagnostic) => void;
+}
+/** Exported for isolated unit testing (STORA-505) — the loading/typing bubble. */
+export declare function AiChatTypingIndicator(): React.JSX.Element;
+/** Exported for isolated unit testing (STORA-505) — a single user/assistant chat bubble. */
+export declare function AiChatBubble({ message }: {
+    message: AiChatMessage;
+}): React.JSX.Element;
+/**
+ * Exported for isolated unit testing (STORA-505) — network/provider error bubble with a
+ * Retry action, never a silent fail (PRD §4 NFR-5 graceful degradation).
+ */
+export declare function AiChatErrorBubble({ message, onRetry, }: {
+    message: string;
+    onRetry: () => void;
+}): React.JSX.Element;
+export declare const AiChatPanel: React.FC<AiChatPanelProps>;
+//# sourceMappingURL=ai-chat-panel.d.ts.map

package/dist/components/ai-chat/ai-chat-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-chat-panel.d.ts","sourceRoot":"","sources":["../../../src/components/ai-chat/ai-chat-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AACpE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAgB,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAkC,MAAM,qBAAqB,CAAC;AAExF,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,mBAAmB,CAAC;AACrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAGjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AA2BtD,MAAM,WAAW,gBAAgB;IAC/B,mGAAmG;IACnG,QAAQ,EAAE,sBAAsB,CAAC;IACjC,8EAA8E;IAC9E,IAAI,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,eAAe,CAAC,EAAE,aAAa,EAAE,CAAC;IAClC;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,2BAA2B,CAAC;IAC7C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;CACjD;AAsCD,kFAAkF;AAClF,wBAAgB,qBAAqB,sBAYpC;AAED,4FAA4F;AAC5F,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,aAAa,CAAA;CAAE,qBA0BnE;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,OAAO,EACP,OAAO,GACR,EAAE;IACD,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,qBAsBA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAmqBlD,CAAC"}

package/dist/components/ai-chat/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ai-chat-panel';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ai-chat/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ai-chat/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}

package/dist/components/canvas/breadcrumbs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/breadcrumbs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAkC,MAAM,qBAAqB,CAAC;AAIxF,MAAM,WAAW,yBAAyB;IACxC,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CA2EpE,CAAC"}

package/dist/components/canvas/canvas-pan-zoom.d.ts

@@ -0,0 +1,61 @@
+import React from 'react';
+export interface CanvasPanZoomState {
+    pan: {
+        x: number;
+        y: number;
+    };
+    zoom: number;
+    isPanning: boolean;
+    isSpacePressed: boolean;
+}
+export interface CanvasZoomToolbarProps {
+    zoom: number;
+    onZoomChange: (newZoom: number) => void;
+    onReset: () => void;
+    onFit?: () => void;
+    className?: string;
+    /** Active navigation tool mode: 'select' (V) or 'hand' (H) */
+    toolMode?: 'select' | 'hand';
+    /** Callback when user changes navigation tool mode */
+    onToolModeChange?: (mode: 'select' | 'hand') => void;
+    /** Whether multi-device side-by-side preview mode is active (STORA-143) */
+    multiDeviceMode?: boolean;
+    /** Callback to toggle multi-device preview mode (STORA-143) */
+    onToggleMultiDevice?: () => void;
+}
+export declare const MIN_ZOOM = 0.25;
+export declare const MAX_ZOOM = 2;
+export declare function clampZoom(val: number): number;
+/**
+ * Zoom Presets Toolbar (STORA-131).
+ * Supports presets (50%, 75%, 100%, 150%, Fit) and step in/out buttons.
+ */
+export declare const CanvasZoomToolbar: React.FC<CanvasZoomToolbarProps>;
+export interface UseCanvasPanZoomOptions {
+    containerRef: React.RefObject<HTMLElement | null>;
+    enabled?: boolean;
+}
+/**
+ * Hook for Canvas Pan (Trackpad swipe, Hand tool, Space+Drag, Middle-click) & Zoom (Cmd/Ctrl + Wheel) (STORA-130, STORA-131).
+ */
+export declare function useCanvasPanZoom({ containerRef, enabled, }: UseCanvasPanZoomOptions): {
+    pan: {
+        x: number;
+        y: number;
+    };
+    setPan: React.Dispatch<React.SetStateAction<{
+        x: number;
+        y: number;
+    }>>;
+    zoom: number;
+    setZoom: React.Dispatch<React.SetStateAction<number>>;
+    isPanning: boolean;
+    isSpacePressed: boolean;
+    toolMode: "select" | "hand";
+    setToolMode: React.Dispatch<React.SetStateAction<"select" | "hand">>;
+    cursorStyle: string | undefined;
+    handlePointerDown: (e: React.PointerEvent) => void;
+    resetPanZoom: () => void;
+    fitPanZoom: () => void;
+};
+//# sourceMappingURL=canvas-pan-zoom.d.ts.map

package/dist/components/canvas/canvas-pan-zoom.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-pan-zoom.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-pan-zoom.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAGxE,MAAM,WAAW,kBAAkB;IACjC,GAAG,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC7B,sDAAsD;IACtD,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,GAAG,MAAM,KAAK,IAAI,CAAC;IACrD,2EAA2E;IAC3E,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+DAA+D;IAC/D,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAED,eAAO,MAAM,QAAQ,OAAO,CAAC;AAC7B,eAAO,MAAM,QAAQ,IAAM,CAAC;AAE5B,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAE7C;AAED;;;GAGG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAyL9D,CAAC;AAEF,MAAM,WAAW,uBAAuB;IACtC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAClD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,YAAY,EACZ,OAAc,GACf,EAAE,uBAAuB;;WACY,MAAM;WAAK,MAAM;;;WAAjB,MAAM;WAAK,MAAM;;;;;;;;;2BAiG/C,KAAK,CAAC,YAAY;;;EAmFzB"}