@salsita-ai/sdk 0.0.0-stage → 0.49.0-develop.cbee856178

package/dist/domain/system-components/view-controls.d.ts

@@ -0,0 +1,25 @@
+import { type Localizable } from '@salsita-ai/common/utils';
+export type ViewControlsComponentState = {
+    /**
+     * Items to be rendered
+     */
+    readonly items: ReadonlyArray<{
+        /**
+         * Localizable text which will be displayed to the user
+         */
+        readonly label: Localizable;
+        /**
+         * ViewState which will be activated when clicking on the toggle
+         */
+        readonly value: string;
+        /**
+         * Icon name which will be displayed to the user
+         */
+        readonly icon: string;
+    }>;
+};
+/**
+ * Renders a view controls next to the toolbar.
+ */
+export declare const viewControlsComponent: import("../index.js").SystemComponentType<"viewControls", ViewControlsComponentState, never>;
+export type ViewControlsComponent = typeof viewControlsComponent;

package/dist/domain/system-components/view-controls.js

@@ -0,0 +1 @@
+import{EnhancedLocalizableSchema as e}from"@salsita-ai/common/utils";import{SystemComponentBuilder as t}from"../components/system-component-builder.js";export const viewControlsComponent=t.component("viewControls").withState({type:"object",tsType:"ViewControlsComponentState",import:[{module:"@salsita-ai/sdk/domain",member:"ViewControlsComponentState"}],properties:{items:{type:"array",items:{type:"object",properties:{label:e,value:{type:"string"},icon:{type:"string"}},required:["label","value","icon"],additionalProperties:!1}}},required:["items"],additionalProperties:!1}).build();

package/dist/domain/system-definitions.d.ts

@@ -0,0 +1,5 @@
+import { type ExtendedJsonSchema } from '@salsita-ai/common/utils';
+/**
+ * Returns all named definitions from common definitions, components and components hoisted definitions (local definitions in the component schema)
+ */
+export declare const getAllPhxDefinitions: () => Record<string, ExtendedJsonSchema>;

package/dist/domain/system-definitions.js

@@ -0,0 +1 @@
+import{availableSystemComponents as e}from"./available-system-components.js";import{availableDefinitions as t}from"./core/index.js";export const getAllPhxDefinitions=()=>[...t,...e.map(e=>{let{definitions:t,...n}=e.schema;return n}),...e.flatMap(e=>Object.values(e.schema.definitions??{}).map(t=>{if("object"==typeof t&&"tsType"in t)return t;throw Error(`Schema definition in a component ${e.name} is not an extended json schema! Add a tsType to the schema.`)}))].reduce((e,t)=>{if(!t.tsType)throw Error(`Schema definition is not an extended json schema! Add a tsType to the schema. ${JSON.stringify(t)}`);return e[t.tsType]=t,e},{});

package/dist/domain/utils/deep-writable.d.ts

@@ -0,0 +1,3 @@
+export type DeepWritable<T> = {
+    -readonly [P in keyof T]: DeepWritable<T[P]>;
+};

package/dist/domain/utils/deep-writable.js

@@ -0,0 +1 @@
+export{};

package/dist/domain/utils/eval-cache.d.ts

@@ -0,0 +1,36 @@
+import type { DomainEntity } from '../core/model.js';
+import type { DomainState } from '../core/state.js';
+/**
+ * Clone the evaluation cache from one state to another.
+ * You should not need to use this function manually as it is used internally by the framework.
+ */
+export declare const cloneEvalCache: <ENTITIES extends DomainEntity<string>>(originalState: DomainState<ENTITIES>, newState: DomainState<ENTITIES>) => void;
+/**
+ * A unique token that can be used to retrieve an evaluation cache from a state.
+ * The token carries type information about the cache's key and value types.
+ * The `clone` function is used when the cache is copied from one state to another.
+ */
+export interface EvalCacheToken<T> {
+    readonly clone: (value: T) => T;
+}
+/**
+ * Creates a new cache token to be used with `getEvalCache`.
+ */
+export declare const createEvalCacheToken: <T>(token: EvalCacheToken<T>) => EvalCacheToken<T>;
+/**
+ * Retrieves a cache defined by the given token which is attached to the given state snapshot.
+ *
+ * Cache is automatically copied from the original state to the new state when updates are applied.
+ *
+ * @param state the state snapshot to retrieve the cache from
+ * @param token a token that uniquely identifies the cache, previously created with `createEvalCacheToken`
+ */
+export declare const getEvalCache: <T>(state: DomainState<DomainEntity<string>>, token: EvalCacheToken<T>) => T | null;
+/**
+ * Sets a value in the evaluation cache for the given token and state.
+ *
+ * @param state the state snapshot to set the cache in
+ * @param token a token that uniquely identifies the cache, previously created with `createEvalCacheToken`
+ * @param value the value to set in the cache
+ */
+export declare const setEvalCache: <T>(state: DomainState<DomainEntity<string>>, token: EvalCacheToken<T>, value: T) => void;

package/dist/domain/utils/eval-cache.js

@@ -0,0 +1 @@
+let e=new WeakMap;export const cloneEvalCache=(t,a)=>{let n=e.get(t);if(!n)return;let l=new Map;n.forEach((e,t)=>{l.set(t,t.clone(e))}),e.set(a,l)};export const createEvalCacheToken=e=>e;export const getEvalCache=(t,a)=>{let n=e.get(t);return n||(n=new Map,e.set(t,n)),n.get(a)??null};export const setEvalCache=(t,a,n)=>{let l=e.get(t);l||(l=new Map,e.set(t,l)),l.set(a,n)};

package/dist/domain/utils/map-nested-object.d.ts

@@ -0,0 +1 @@
+export declare const mapNestedObject: <TI, TO, KI extends string, KO extends string = KI>() => <REC extends Partial<Record<KI, Record<string, TI>>>>(record: REC, map: (entry: [key1: KI, key2: string, value: TI]) => Array<[key1: KO, key2: string, value: TO]>, onDuplicate?: (previousValue: TO, newValue: TO, key1: KO, key2: string) => void) => Record<KO, Record<string, TO>>;

package/dist/domain/utils/map-nested-object.js

@@ -0,0 +1 @@
+import{assertExistence as t}from"@salsita-ai/common/utils";export const mapNestedObject=()=>(e,r,o)=>{let c={};return Object.entries(e).forEach(([e,a])=>{Object.entries(a).forEach(([a,s])=>{r([e,a,s]).forEach(([e,r,a])=>{c[e]=c[e]??{};let s=t(c[e]),i=s[r];i?o?.(i,a,e,r):s[r]=a})})}),c};

package/dist/domain/utils/memo-eval.d.ts

@@ -0,0 +1,84 @@
+import type { ExpressionContext } from '../core/expression.js';
+import type { $DomainEntity, DomainEntity } from '../core/model.js';
+import type { DomainState } from '../core/state.js';
+declare const MemoizedValueSymbol: unique symbol;
+export type MemoizedArray<T extends readonly unknown[]> = {
+    readonly [MemoizedValueSymbol]: 'array';
+    readonly value: T;
+};
+export type MemoizedObject<T extends Record<string, unknown>> = {
+    readonly [MemoizedValueSymbol]: 'object';
+    readonly value: T;
+};
+export declare const isMemoizedArray: (value: unknown) => value is MemoizedArray<readonly unknown[]>;
+export declare const isMemoizedObject: (value: unknown) => value is MemoizedObject<Record<string, unknown>>;
+export interface MemoEval {
+    /**
+     * Memoize evaluation over a domain entity across subsequent states.
+     * Evaluation is split into two functions: one to calculate the dependencies and one to evaluate the result.
+     * As long as the members of the dependency array are the same, the result is cached.
+     *
+     * In addition to performance optimizations, this helper is useful for custom expressions that produce non-primitive
+     * results and therefore break any downstream memoization.
+     */
+    <ENTITIES extends DomainEntity<string>, $ENTITY extends $DomainEntity<ENTITIES>, ALLOWED_ROOT_ENTITIES extends ENTITIES, PUBLISHED_DATA extends Record<string, unknown>, SESSION_DATA extends Record<string, unknown>, FRONTEND_DATA extends Record<string, unknown>, const DEPS extends any[], RES>(calculateDeps: (self: $ENTITY, state: DomainState<ENTITIES>, ctx: ExpressionContext<ENTITIES, ALLOWED_ROOT_ENTITIES, PUBLISHED_DATA, SESSION_DATA, FRONTEND_DATA>) => DEPS, evaluate: (...deps: DEPS) => RES): (self: $ENTITY, state: DomainState<ENTITIES>, ctx: ExpressionContext<ENTITIES, ALLOWED_ROOT_ENTITIES, PUBLISHED_DATA, SESSION_DATA, FRONTEND_DATA>) => RES;
+    /**
+     * Tags an array so that it is compared by contents rather than reference.
+     * Use in the deps collection phase.
+     * Don't forget to unwrap the `value` in the evaluate phase.
+     *
+     * *Important:* This comparision is shallow, meaning that if the array contains objects or arrays, they will be compared by reference.
+     * Use in combination with `memoEval.object` to compare the nested objects by key-value pairs if necessary.
+     *
+     * *Usage example:*
+     * ```ts
+     * memoEval(
+     *   (self) => [self.x, memoEval.array(self.$children.map(child => child.offsetX))],
+     *   (x, childOffsets) => x + childOffsets.value.reduce((acc, curr) => acc + curr, 0)
+     * )
+     * ```
+     */
+    array<T extends readonly unknown[]>(value: T): MemoizedArray<T>;
+    /**
+     * Tags an object so that it is compared by key-value pairs rather than reference.
+     * Use in the deps collection phase.
+     * Don't forget to unwrap the `value` in the evaluate phase.
+     *
+     * *Important:* This comparision is shallow, meaning that if the properties of the object contain arrays or objects, they will be compared by reference.
+     * Use nested `memoEval.array` and `memoEval.object` to compare the nested arrays and objects by contents if necessary.
+     *
+     * While the `memoEval.object` can be used standalone as outlined here:
+     *
+     * *Usage example:*
+     * ```ts
+     * memoEval(
+     *   (self) => [self.x, memoEval.object({ parentX: self.$parent.x, parentY: self.$parent.y })],
+     *   (x, parent) => x + parent.value.parentX + parent.value.parentY
+     * )
+     * ```
+     *
+     * it is most useful in combination with arrays:
+     * ```ts
+     * memoEval(
+     *   (self) => [self.x, memoEval.array(
+     *     self.$children.map(child =>
+     *       memoEval.object({ childX: child.offsetX, childY: child.offsetY })
+     *     )
+     *   )],
+     *   (x, children) => x + children.value.reduce((acc, curr) => acc + curr.value.childX + curr.value.childY, 0)
+     * )
+     * ```
+     *
+     */
+    object<T extends Record<string, unknown>>(value: T): MemoizedObject<T>;
+}
+/**
+ * Memoize evaluation over a domain entity across subsequent states.
+ * Evaluation is split into two functions: one to calculate the dependencies and one to evaluate the result.
+ * As long as the members of the dependency array are the same, the result is cached.
+ *
+ * In addition to performance optimizations, this helper is useful for custom expressions that produce non-primitive
+ * results and therefore break any downstream memoization.
+ */
+export declare const memoEval: MemoEval;
+export {};

package/dist/domain/utils/memo-eval.js

@@ -0,0 +1 @@
+import{createEvalCacheToken as e,getEvalCache as t,setEvalCache as r}from"./eval-cache.js";import{withProfilerLabel as l}from"./profiler-label.js";let o=Symbol("MemoizedValue");export const isMemoizedArray=e=>"object"==typeof e&&null!==e&&o in e&&"array"===e[o];export const isMemoizedObject=e=>"object"==typeof e&&null!==e&&o in e&&"object"===e[o];let a=(e,t)=>{if(t.length!==e.length)return!0;for(let r=0;r<t.length;r++)if(i(e[r],t[r]))return!0;return!1},i=(e,t)=>t!==e&&(isMemoizedArray(t)&&isMemoizedArray(e)?a(e.value,t.value):!(isMemoizedObject(t)&&isMemoizedObject(e))||((e,t)=>{let r=Object.keys(t),l=new Set(Object.keys(e));if(r.length!==l.size)return!0;for(let o of r)if(!l.has(o)||i(e[o],t[o]))return!0;return!1})(e.value,t.value));export const memoEval=(o,i)=>{let m=e({clone:e=>new Map(e)}),n=l("memoEval_calculateDeps",o),s=l("memoEval_compareDeps",a),c=l("memoEval_evaluate",i);return(e,l,o)=>{let a=n(e,l,o),i=t(l,m);i||r(l,m,i=new Map);let u=i.get(e.id);if(u&&!s(u.deps,a))return u.result;let p=c(...a);return i.set(e.id,{deps:a,result:p}),p}};memoEval.array=e=>({[o]:"array",value:e}),memoEval.object=e=>({[o]:"object",value:e});

package/dist/domain/utils/profiler-label.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Whether profiler labels are enabled for the current browser tab.
+ *
+ * The flag lives in `sessionStorage` so that it survives the page reload that activates it
+ * (the domain is built at module scope, long before any UI could flip a runtime switch),
+ * stays scoped to the tab, and disappears when the tab closes. Always false outside the
+ * browser (e.g. server-side evaluation).
+ *
+ * The first read is cached for the lifetime of the page load — the value can only change
+ * together with a reload anyway, and this is called for every expression registration.
+ */
+export declare const areProfilerLabelsEnabled: () => boolean;
+/**
+ * Persists the profiler-labels flag for the current tab. Takes effect on the next page load —
+ * callers (the editor's Profiler panel) are expected to reload immediately after toggling.
+ */
+export declare const setProfilerLabelsEnabled: (enabled: boolean) => void;
+/**
+ * Wraps `fn` in a dynamically compiled function named after `label` so it shows up as a distinct,
+ * readable frame in browser CPU profiles. Passthrough (returns `fn` unchanged) when profiler
+ * labels are disabled — the production path never pays for this.
+ *
+ * Why `new Function`: V8's profiler reads the name compiled into a function, not the runtime
+ * `name` property — `Object.defineProperty(fn, 'name', …)` is invisible to it, and all closures
+ * returned from a single factory literal (like `memoEval`) collapse into one "(anonymous)" frame.
+ * Only a per-label compiled function produces a distinct named frame. Requires `unsafe-eval`,
+ * which is acceptable because the flag is only ever enabled in dev/editor contexts.
+ */
+export declare const withProfilerLabel: <FN extends (...args: never[]) => unknown>(label: string, fn: FN) => FN;

package/dist/domain/utils/profiler-label.js

@@ -0,0 +1 @@
+let e;let r="phoenix-profiler-labels";export const areProfilerLabelsEnabled=()=>(void 0===e&&(e="u">typeof sessionStorage&&"true"===sessionStorage.getItem(r)),e);export const setProfilerLabelsEnabled=e=>{e?sessionStorage.setItem(r,"true"):sessionStorage.removeItem(r)};export const withProfilerLabel=(e,r)=>{if(!areProfilerLabelsEnabled())return r;let t=e.replace(/[^A-Za-z0-9_$]/g,"_").replace(/^(?=\d)/,"_");return Function("fn",`return function ${t}(...args) { return fn.apply(this, args) }`)(r)};

package/dist/editor/Editor.d.ts

@@ -0,0 +1,42 @@
+import type { ValueOf } from '@salsita-ai/common/utils';
+import type { RawProjectFiles } from '#package/application-spec';
+import type { MockTemplateDefinition } from './mocks/mock-template-types.js';
+export declare const EditorPanelView: {
+    readonly Files: 'Files';
+    readonly Reflections: 'Reflections';
+    readonly Domain: 'Domain';
+    readonly Templates: 'Templates';
+    readonly Mocks: 'Mocks';
+    readonly Inspector: 'Inspector';
+    readonly Debug: 'Debug';
+    readonly Profiler: 'Profiler';
+    readonly GraphQL: 'GraphQL';
+    readonly VideoStudio: 'VideoStudio';
+    readonly Analytics: 'Analytics';
+    readonly Diagnostics: 'Diagnostics';
+    readonly Logs: 'Logs';
+    readonly Tunnel: 'Tunnel';
+    readonly WebSocketStatus: 'WebSocketStatus';
+    readonly Admin: 'Admin';
+};
+export type EditorPanelView = ValueOf<typeof EditorPanelView>;
+export interface EditorProps {
+    readonly wsUrl?: string;
+    /** Enables local mode: disables WS connection and uses mock tRPC link. */
+    readonly localMode?: boolean;
+    readonly domainSpec?: string;
+    /** Raw application-spec project snapshot embedded by Storybook builds. */
+    readonly initialRawProjectFiles?: RawProjectFiles;
+    readonly onExit?: () => void;
+    /** Mock template definitions combining session, access, and configuration mocks */
+    readonly mockTemplates?: MockTemplateDefinition[];
+    /** If true, automatically apply the first template when templates are initialized */
+    readonly autoApplyTemplate?: boolean;
+    /** Key used to scope localStorage template persistence (e.g. environment slug) */
+    readonly environmentKey?: string;
+    /** Web component tag name for creating and discovering reflection systems. */
+    readonly tagName: string;
+    /** Whether the editor should expose and load the embedded Admin application. */
+    readonly enableAdmin?: boolean;
+}
+export declare const Editor: import("react").MemoExoticComponent<(props: EditorProps) => import("react/jsx-runtime").JSX.Element>;

package/dist/editor/Editor.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as i,Fragment as t}from"react/jsx-runtime";import{Box as o,Chip as n,CssBaseline as r,IconButton as s,ThemeProvider as l,Tooltip as a,Typography as d,createTheme as c,useMediaQuery as m,useTheme as p}from"@mui/material";import{ModalProvider as f}from"mui-modal-provider";import{memo as h,useCallback as u,useEffect as g,useRef as w,useState as k}from"react";import{match as x}from"ts-pattern";import{useLocalStorage as y}from"usehooks-ts";import{PhxIcon as b,SnackbarProvider as v,createThemeWithPhoenixIcons as S}from"#package/ui-sdk";import{EditorMode as P}from"./EditorMode.js";import{EditorRuntimeProvider as j,useWebComponent as V}from"./EditorRuntimeProvider.js";import{EditorAdminContextProvider as E}from"./admin/EditorAdminContext.js";import{EditorAdminMainContent as D}from"./admin/EditorAdminMainContent.js";import{EditorAdminSidebar as C}from"./admin/EditorAdminSidebar.js";import{useEditorAdminState as T}from"./admin/use-editor-admin-state.js";import{Analytics as A}from"./analytics/Analytics.js";import{AnalyticsProvider as L}from"./analytics/AnalyticsContext.js";import{Logotype as M}from"./common/Logotype.js";import{PanelIconButton as W}from"./common/PanelIconButton.js";import{BrowserConsoleReporter as R}from"./console-reporter/BrowserConsoleReporter.js";import{DataHandler as I}from"./data/DataHandler.js";import{DebugFlags as F}from"./debug-flags/DebugFlags.js";import{DiagnosticsPanel as G}from"./diagnostics/DiagnosticsPanel.js";import{DomainEditors as z}from"./domain-editors/DomainEditors.js";import{DomainSpecProvider as B,useDomainSpecContext as Q}from"./domain-editors/DomainSpecContext.js";import{DomainReflection as H}from"./domain-reflection/DomainReflection.js";import{GraphQLPanel as U}from"./graphql/GraphQLPanel.js";import{LogsPanel as q}from"./logs/LogsPanel.js";import{EditorMockProvider as O}from"./mocks/EditorMockContext.js";import{Mocks as K}from"./mocks/Mocks.js";import{ProfilerPanel as N}from"./profiler/ProfilerPanel.js";import{RemoteFilesList as X}from"./remote-files/RemoteFilesList.js";import{SceneHandler as Y}from"./scene/SceneHandler.js";import{ScreenshotHandler as $}from"./screenshot/ScreenshotHandler.js";import{EditorConnectionProvider as J}from"./services/EditorConnectionContext.js";import{EditorActionButtons as Z}from"./sidebar/EditorActionButtons.js";import{StateInspector as _}from"./state-inspector/index.js";import{StateHandler as ee}from"./state/StateHandler.js";import{SpaTemplate as ei}from"./templates/SpaTemplate.js";import{Templates as et}from"./templates/Templates.js";import{TemplatesList as eo}from"./templates/TemplatesList.js";import{TunnelProvider as en,useTunnel as er}from"./tunnel/TunnelContext.js";import{TunnelPanel as es}from"./tunnel/TunnelPanel.js";import{hasTunnelProblem as el}from"./tunnel/tunnel-view-model.js";import{VideoStudio as ea}from"./video-studio/VideoStudio.js";import{WebSocketStatus as ed}from"./websocket-status/WebSocketStatus.js";let ec=h(()=>{let i=w(null),t=V();return g(()=>{let e=i.current;if(e&&t)return e.appendChild(t),()=>{e.contains(t)&&e.removeChild(t)}},[t]),e("div",{ref:i,style:{width:"100%",height:"100%"}})}),em=S(c());export const EditorPanelView={Files:"Files",Reflections:"Reflections",Domain:"Domain",Templates:"Templates",Mocks:"Mocks",Inspector:"Inspector",Debug:"Debug",Profiler:"Profiler",GraphQL:"GraphQL",VideoStudio:"VideoStudio",Analytics:"Analytics",Diagnostics:"Diagnostics",Logs:"Logs",Tunnel:"Tunnel",WebSocketStatus:"WebSocketStatus",Admin:"Admin"};let ep=[{key:EditorPanelView.Templates,icon:"GridFour",title:"Templates"},{key:EditorPanelView.Reflections,icon:"House",title:"Reflections"},{key:EditorPanelView.Files,icon:"List",title:"Files"},{key:EditorPanelView.Domain,icon:"Gear",title:"Domain"},{key:EditorPanelView.Mocks,icon:"TagBold",title:"Mocks"},{key:EditorPanelView.Inspector,icon:"CurrencyDollar",title:"Inspector"},{key:EditorPanelView.Debug,icon:"EyeBold",title:"Debug"},{key:EditorPanelView.Profiler,icon:"Alarm",title:"Profiler"},{key:EditorPanelView.GraphQL,icon:"MagnifyingGlassBold",title:"GraphQL"},{key:EditorPanelView.VideoStudio,icon:"CameraRotate",title:"Video Studio"},{key:EditorPanelView.Analytics,icon:"Flame",title:"Analytics"},{key:EditorPanelView.Diagnostics,icon:"WarningCircle",title:"Diagnostics"},{key:EditorPanelView.Logs,icon:"BracketsCurly",title:"Logs"},{key:EditorPanelView.Tunnel,icon:"ArrowsHorizontal",title:"Webhook Tunnel"}],ef=h(r=>{let{panelView:l,setPanelView:c,width:m,setWidth:p,selectedTemplate:f,setSelectedTemplate:h,isResizing:w,setIsResizing:y,onExit:v,enableAdmin:S}=r,P=T(S),{unreadDiagnosticCount:j,markDiagnosticsRead:V}=Q(),{state:E}=er(),L=l?Math.max(m,240):38,[R,I]=k(0),B=u(()=>I(e=>e+1),[]);return g(()=>{l===EditorPanelView.Diagnostics&&V()},[V,l]),i(o,{component:"div",sx:{display:"grid",gridTemplateColumns:`${L}px min-content auto`,gridTemplateRows:"minmax(0, 1fr)",width:"100vw",height:"100vh",backgroundColor:"#ffffff",overflow:"hidden"},onMouseMove:e=>{w&&p(e.clientX)},onMouseUp:()=>{y(!1)},children:[i(o,{component:"div",sx:{display:"grid",gridTemplateColumns:"36px auto",backgroundColor:"#f8f9fa",borderRight:"1px solid #dee2e6",boxShadow:"2px 0 8px rgba(0, 0, 0, 0.06)",overflow:"hidden",height:"100%"},children:[i("div",{style:{backgroundColor:"#f8f9fa",height:"100%",display:"flex",flexDirection:"column",alignItems:"center",padding:"4px 0"},children:[e("div",{style:{marginBottom:"8px"},children:e(M,{variant:"icon-only"})}),i("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:"2px"},children:[S&&i(t,{children:[e(W,{icon:"SlidersHorizontal",title:"Admin",active:l===EditorPanelView.Admin,onClick:()=>{l===EditorPanelView.Admin?c(null):c(EditorPanelView.Admin)}}),e("div",{style:{borderBottom:"1px solid #dee2e6",margin:"2px 0"}})]}),ep.map(i=>e(W,{icon:i.icon,title:i.title,active:l===i.key,badgeCount:i.key===EditorPanelView.Tunnel?+!!el(E):i.key===EditorPanelView.Diagnostics?j:0,onClick:()=>{l===i.key?c(null):c(i.key)}},i.key))]}),e(Z,{reload:B}),e("div",{style:{padding:"0 2px",paddingBottom:"4px"},children:e(W,{icon:"CloudArrowUp",title:"WebSocket Status",active:l===EditorPanelView.WebSocketStatus,onClick:()=>{l===EditorPanelView.WebSocketStatus?c(null):c(EditorPanelView.WebSocketStatus)}})}),v&&e("div",{style:{padding:"0 2px",paddingBottom:"8px"},children:e(W,{icon:"SignOut",title:"Exit Editor",variant:"danger",onClick:v})})]}),l&&i(o,{component:"div",sx:{display:"flex",flexDirection:"column",height:"100%",overflow:"hidden",backgroundColor:"#ffffff"},children:[e(o,{component:"div",sx:{p:1.5,borderBottom:"1px solid #e9ecef",backgroundColor:"#ffffff"},children:i(o,{component:"div",sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[i(o,{component:"div",sx:{display:"flex",flexDirection:"row",alignItems:"center"},children:[e(d,{variant:"h6",sx:{fontSize:16,fontWeight:600,color:"#212529"},children:x(l).with("Files",()=>"Files").with("Reflections",()=>"Reflections").with("Domain",()=>"Domain").with("Templates",()=>"Templates").with("Mocks",()=>"Mocks").with("Inspector",()=>"State Inspector").with("Debug",()=>"Debug").with("Profiler",()=>"Profiler").with("GraphQL",()=>"GraphQL").with("VideoStudio",()=>"Video Studio").with("Analytics",()=>"Analytics").with("Diagnostics",()=>"Diagnostics").with("Logs",()=>"Dev Server Logs").with("Tunnel",()=>"Webhook Tunnel").with("WebSocketStatus",()=>"WebSocket Status").with("Admin",()=>"Admin").otherwise(e=>e)}),e(a,{title:x(l).with("Files",()=>"Browse and inspect loaded GLTF files and their contents").with("Reflections",()=>"Inspect internal Phoenix systems state and configuration").with("Domain",()=>"Edit YAML domain specifications and component configurations").with("Templates",()=>"Select different layout templates for the configurator interface").with("Mocks",()=>"Create and manage mock data for testing session and access configurations").with("Inspector",()=>"Walk the entity tree: fields, expressions, and children").with("Debug",()=>"Toggle scene debug visuals like offset anchors, snapping, and collision meshes").with("Profiler",()=>"Make domain expressions show up as named frames in browser CPU profiles").with("GraphQL",()=>"Run GraphQL queries against the schema generated from the assistant manifest").with("VideoStudio",()=>"Create video sequences by capturing keyframes and exporting as video").with("Analytics",()=>"View parse pipeline metrics, domain stats, and diagnostics").with("Diagnostics",()=>"View latest editor warnings and errors").with("Logs",()=>"View dev server logs: spec builds, webhooks, vite, and browser console").with("Tunnel",()=>"View webhook tunnel status and the requests routed through it").with("WebSocketStatus",()=>"View WebSocket connection status and editor mode information").with("Admin",()=>"Manage admin panel, publish data, and configure settings").otherwise(()=>"Panel information"),placement:"left",arrow:!0,children:e(s,{size:"small",sx:{ml:1,color:"#6c757d",fontSize:14,p:.25,"&:hover":{backgroundColor:"#f8f9fa",color:"#495057"}},children:e(b,{name:"Info",style:{fontSize:14}})})})]}),e(o,{component:"div",sx:{display:"flex",alignItems:"center",gap:1},children:"Templates"===l&&e(n,{label:f.charAt(0).toUpperCase()+f.slice(1),variant:"outlined",size:"small",sx:{backgroundColor:"#f8f9fa",borderColor:"#dee2e6",color:"#495057",fontWeight:500,fontSize:"0.75rem"}})})]})}),i(o,{component:"div",sx:{flex:1,backgroundColor:"#ffffff",overflow:"auto"},children:["Files"===l&&e(X,{}),"Reflections"===l&&e(H,{}),"Domain"===l&&e(z,{}),"Templates"===l&&e(eo,{selectedTemplate:f,onTemplateSelect:h}),"Mocks"===l&&e(K,{}),"Inspector"===l&&e(_,{}),"Debug"===l&&e(F,{}),"Profiler"===l&&e(N,{}),"GraphQL"===l&&e(U,{}),"VideoStudio"===l&&e(ea,{}),"Analytics"===l&&e(A,{}),"Diagnostics"===l&&e(G,{}),"Logs"===l&&e(q,{}),"Tunnel"===l&&e(es,{}),"WebSocketStatus"===l&&e(ed,{}),S&&"Admin"===l&&e(C,{...P})]})]})]}),e("div",{style:{width:"2px",backgroundColor:"#dee2e6",cursor:"ew-resize",boxShadow:"1px 0 3px rgba(0, 0, 0, 0.05)"},onMouseDown:()=>{y(!0)}}),i("div",{style:{position:"relative",overflow:"hidden"},children:[e("div",{style:{position:"absolute",inset:0,zIndex:+("Admin"!==l)},children:e(et,{selectedTemplate:f,children:e(ec,{},R)})}),S&&e("div",{style:{position:"absolute",inset:0,zIndex:+("Admin"===l)},children:e(D,{})})]})]})}),eh=h(()=>e(ei,{children:e(ec,{})})),eu=h(o=>{let{wsUrl:n="ws://localhost:3020",localMode:r=!1,domainSpec:s,initialRawProjectFiles:l,onExit:a,mockTemplates:d,autoApplyTemplate:c,environmentKey:h,tagName:u,enableAdmin:w=!0}=o,x=m(p().breakpoints.up("md")),[b,S]=y("editor-width",350),[V,D]=y("editor-view",null),[C,T]=y("editor-template","spa"),[A,M]=k(!1);return g(()=>{null===V||Object.values(EditorPanelView).some(e=>e===V)&&(w||V!==EditorPanelView.Admin)||D(null)},[w,V,D]),e(f,{children:e(v,{maxSnack:5,children:e(E,{children:e(j,{tagName:u,children:e(J,{initialWsUrl:n,localMode:r,children:e(en,{children:e(P,{children:e(L,{children:e(B,{domainSpec:s,initialRawProjectFiles:l,children:i(O,{mockTemplates:d,autoApplyTemplate:c,environmentKey:h,children:[!r&&i(t,{children:[e($,{}),e(ee,{}),e(I,{}),e(Y,{}),e(R,{})]}),x?e(ef,{panelView:V,setPanelView:D,width:b,setWidth:S,selectedTemplate:C,setSelectedTemplate:T,isResizing:A,setIsResizing:M,onExit:a,enableAdmin:w}):e(eh,{})]})})})})})})})})})})});export const Editor=h(t=>i(l,{theme:em,children:[e(r,{}),e(eu,{...t})]}));

package/dist/editor/EditorMode.d.ts

@@ -0,0 +1,6 @@
+import { type ReactNode } from 'react';
+interface EditorModeProps {
+    readonly children: ReactNode;
+}
+export declare const EditorMode: (props: EditorModeProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/editor/EditorMode.js

@@ -0,0 +1 @@
+import{jsx as t,Fragment as r}from"react/jsx-runtime";import{useEffect as e}from"react";import{useApplicationRuntime as o}from"#package/react-sdk";export const EditorMode=n=>{let{children:i}=n,a=o();return e(()=>(a.actions.environment.setEditorMode(!0),()=>{a.actions.environment.setEditorMode(!1)}),[a]),t(r,{children:i})};

package/dist/editor/EditorRuntimeProvider.d.ts

@@ -0,0 +1,8 @@
+import { type ReactNode } from 'react';
+export declare const useWebComponent: () => HTMLElement | null;
+export interface EditorRuntimeProviderProps {
+    readonly children: ReactNode;
+    /** Web component tag name used to create the editor-owned configurator instance. */
+    readonly tagName: string;
+}
+export declare const EditorRuntimeProvider: (props: EditorRuntimeProviderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/editor/EditorRuntimeProvider.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Box as r,CircularProgress as n,Typography as i}from"@mui/material";import{createContext as o,useContext as a,useEffect as l,useRef as c,useState as s}from"react";import{ApplicationRuntimeProvider as u,ApplicationType as m,ApplicationTypeProvider as d}from"#package/react-sdk";import{PhxIcon as p}from"#package/ui-sdk";let g=o(null);export const useWebComponent=()=>a(g);export const EditorRuntimeProvider=o=>{let{children:a,tagName:h}=o,f=c(null),[x,v]=s({status:"loading"});return(l(()=>{if(f.current)return;let e=document.createElement(h);if(e.style.width="100%",e.style.height="100%",f.current=e,!e.applicationRuntime)throw Error(`Web component does not expose an application runtime, tagName: ${h}`);v({status:"ready",applicationRuntime:e.applicationRuntime})},[h]),"loading"===x.status)?t(r,{component:"div",sx:{width:"100vw",height:"100vh",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2,backgroundColor:"background.default"},children:[e(n,{}),e(i,{color:"text.secondary",children:"Loading configurator..."})]}):"error"===x.status?t(r,{component:"div",sx:{width:"100vw",height:"100vh",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2,backgroundColor:"error.light",color:"error.dark"},children:[e(p,{name:"WarningCircle",style:{fontSize:48}}),e(i,{variant:"h6",children:"Configuration Error"}),e(i,{children:x.message})]}):e(d,{type:m.Configurator,children:e(u,{runtime:x.applicationRuntime,children:e(g.Provider,{value:f.current,children:a})})})};

package/dist/editor/admin/EditorAdminContext.d.ts

@@ -0,0 +1,17 @@
+import { type Observable } from 'rxjs';
+import { type WebComponentEvent } from '#package/react-sdk';
+interface EditorAdminContextType {
+    readonly webComponentContainer: React.ReactNode;
+    readonly isAdminLoading: boolean;
+    readonly isAdminError: boolean;
+    readonly $embeddedEvents: Observable<WebComponentEvent>;
+    readonly retryAdmin: () => void;
+    readonly dispatch: (event: WebComponentEvent) => void;
+    readonly requestLoad: () => void;
+}
+export declare const createEditorAdminElement: (adminTag: string) => HTMLElement & import("#package/react-sdk").EmbeddedIntegration;
+export declare const EditorAdminContextProvider: ({ children }: {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const useEditorAdminContext: () => EditorAdminContextType;
+export {};

package/dist/editor/admin/EditorAdminContext.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import{createContext as t,useCallback as r,useContext as n,useEffect as i,useMemo as o,useRef as d,useState as a}from"react";import{Subject as m}from"rxjs";import{assertEmbeddedIntegration as l}from"#package/react-sdk";import{embeddedModuleSchema as u}from"../../application/mount-application.js";let c=t(null);export const createEditorAdminElement=e=>{let t=document.createElement(e);return t.setAttribute("integration-mode","handoff"),l(t),t};export const EditorAdminContextProvider=({children:t})=>{let{webComponentContainer:n,$embeddedEvents:l,dispatch:s,isAdminLoading:p,isAdminError:E,retryAdmin:f,requestLoad:b}=(()=>{let[t,n]=a(null),[l,c]=a(!1),[s,p]=a(!1),E=d(null),f=d(null),b=console,w=o(()=>new m,[]),x=r(e=>{if(!f.current)throw Error("Embedded admin events subject not found!");f.current.next(e)},[]),v=import.meta.env.DEV?`${window.location.origin}/embedded-admin.ts`:`${window.location.origin}/salsita-embedded-admin.js`,A=r(async()=>{b.debug("[EditorAdmin] Starting admin load",{adminWebcomponentUrl:v});try{delete window.__THREE__;let e=await import(v),t=u.parse(e).default.mount();n(t),b.debug("[EditorAdmin] Script loaded successfully",{tag:t})}catch(e){b.error(`Failed to load admin webcomponent from ${v}`,{error:e}),c(!0)}},[v,b]);i(()=>{s&&A()},[s,A]);let g=r(()=>{s||p(!0)},[s]),h=r(()=>{c(!1),A()},[A]),j=o(()=>e("div",{"data-id":"editor-admin-container",ref:E}),[]);return i(()=>{let e=E.current;if(!e||!t)return;let r=createEditorAdminElement(t),n=r.$events.subscribe(e=>{w.next(e)});return f.current=r.$events,e.appendChild(r),()=>{e.removeChild(r),f.current=null,n.unsubscribe()}},[t,w]),{webComponentContainer:j,$embeddedEvents:w,dispatch:x,isAdminLoading:s&&null===t&&!l,isAdminError:l,retryAdmin:h,requestLoad:g}})(),w=o(()=>({webComponentContainer:n,isAdminLoading:p,isAdminError:E,retryAdmin:f,$embeddedEvents:l,dispatch:s,requestLoad:b}),[n,p,E,f,l,s,b]);return e(c.Provider,{value:w,children:t})};export const useEditorAdminContext=()=>{let e=n(c);if(!e)throw Error("useEditorAdminContext must be used within an EditorAdminContextProvider");return e};

package/dist/editor/admin/EditorAdminMainContent.d.ts

@@ -0,0 +1 @@
+export declare const EditorAdminMainContent: () => import("react/jsx-runtime").JSX.Element;

package/dist/editor/admin/EditorAdminMainContent.js

@@ -0,0 +1 @@
+import{jsx as o}from"react/jsx-runtime";import{Box as t,ThemeProvider as r}from"@mui/material";import{useEditorAdminContext as i}from"./EditorAdminContext.js";import{editorAdminTheme as e}from"./editor-admin-theme.js";export const EditorAdminMainContent=()=>{let{webComponentContainer:n}=i();return o(r,{theme:e,children:o(t,{component:"main",sx:{width:"100%",height:"100%",backgroundColor:"background.default",p:3,overflowY:"auto",boxSizing:"border-box",'& > [data-id="editor-admin-container"]':{height:"100%"}},children:n})})};

package/dist/editor/admin/EditorAdminSidebar.d.ts

@@ -0,0 +1,2 @@
+import type { useEditorAdminState } from './use-editor-admin-state.js';
+export declare const EditorAdminSidebar: (props: ReturnType<typeof useEditorAdminState>) => import("react/jsx-runtime").JSX.Element;

package/dist/editor/admin/EditorAdminSidebar.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as i}from"react/jsx-runtime";import{Box as o,ThemeProvider as t}from"@mui/material";import{useCallback as r}from"react";import{AdminLoadError as a,AdminPublishButton as n,EmbeddedAdminNavigation as l}from"#package/admin";import{editorAdminTheme as m}from"./editor-admin-theme.js";export const EditorAdminSidebar=d=>{let{navigationItems:s,selectedPage:c,requestAdminNavigation:p,isAdminLoading:x,isAdminError:f,retryAdmin:g,publish:h,isAvailable:u,loading:v}=d,b=r(async()=>{await h()},[h]);return f?e(a,{onRetry:g}):e(t,{theme:m,children:i(o,{component:"div",sx:{display:"flex",flexDirection:"column",height:"100%",borderRight:e=>`1px solid ${e.palette.divider}`,p:e=>`${e.spacing(2)} ${e.spacing(1)}`,overflowY:"auto"},children:[e(o,{component:"div",sx:{flex:1,overflowY:"auto",minHeight:0},children:e(l,{navigationItems:s,selectedPage:c,onSelectPage:p,isLoading:x})}),e(o,{component:"div",sx:{display:"flex",flexDirection:"column",gap:1,pt:1},children:e(n,{publish:b,isAvailable:u,loading:v})})]})})};

package/dist/editor/admin/editor-admin-theme.d.ts

@@ -0,0 +1,10 @@
+/**
+ * The admin design language built into a complete MUI theme, for the editor's admin chrome.
+ *
+ * `adminTheme` is raw `ThemeOptions`. Handing those options to a nested `ThemeProvider` makes MUI
+ * shallow-merge them over the editor theme, replacing `palette` wholesale — the result carries no
+ * `mode`, `grey`, or `divider`, and any component reading them crashes. The web-component admin
+ * avoids this by building the options through `EncapsulatedTheme`; the editor renders its admin
+ * chrome outside that encapsulation, so it builds them here instead.
+ */
+export declare const editorAdminTheme: import("@mui/material").Theme;

package/dist/editor/admin/editor-admin-theme.js

@@ -0,0 +1 @@
+import{adminTheme as m}from"#package/admin";import{createScaledPhoenixTheme as o}from"#package/ui-sdk";export const editorAdminTheme=o(m);

package/dist/editor/admin/use-editor-admin-state.d.ts

@@ -0,0 +1,13 @@
+export declare const useEditorAdminState: (enableAdmin?: boolean) => {
+    publish: () => Promise<import("#package/admin").StudioPublishState>;
+    isAvailable: boolean;
+    loading: boolean;
+    error: string | null;
+    interrupted: boolean;
+    navigationItems: (import("../../domain/index.js").NavigationListItem | import("../../domain/index.js").NestedNavigationListItem)[];
+    selectedPage: string;
+    requestAdminNavigation: (state: string) => void;
+    isAdminLoading: boolean;
+    isAdminError: boolean;
+    retryAdmin: () => void;
+};

package/dist/editor/admin/use-editor-admin-state.js

@@ -0,0 +1 @@
+import{useEffect as t,useState as e}from"react";import{useHostAdminPublish as o,useHostEmbeddedNavigation as r}from"#package/admin";import{useEditorAdminContext as i}from"./EditorAdminContext.js";export const useEditorAdminState=(m=!0)=>{let{$embeddedEvents:n,dispatch:a,isAdminLoading:d,isAdminError:c,retryAdmin:p,requestLoad:s}=i(),[A,f]=e(""),{navigationItems:u,requestAdminNavigation:g}=r({$embeddedEvents:n,dispatch:a,onSelectPage:f,isAdminRouteActive:!0}),l=o({$embeddedEvents:n,dispatch:a});return t(()=>{m&&s()},[m,s]),{navigationItems:u,selectedPage:A,requestAdminNavigation:g,isAdminLoading:d,isAdminError:c,retryAdmin:p,...l}};

package/dist/editor/analytics/Analytics.d.ts

@@ -0,0 +1,2 @@
+/** Analytics panel — list of recent builds with drill-down to flamegraph detail. */
+export declare const Analytics: () => import("react/jsx-runtime").JSX.Element;

package/dist/editor/analytics/Analytics.js

@@ -0,0 +1 @@
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{Box as o,Chip as i,Typography as r}from"@mui/material";import{useState as l}from"react";import{PanelListHeader as n,PanelListItem as s}from"../common/PanelList.js";import{useAnalytics as a}from"./AnalyticsContext.js";import{AnalyticsDetail as c}from"./AnalyticsDetail.js";export const Analytics=()=>{let{builds:f}=a(),[m,d]=l(null);return m?t(c,{build:m,onBack:()=>{d(null)}}):e(o,{component:"div",sx:{height:"100%",display:"flex",flexDirection:"column",backgroundColor:"#ffffff"},children:[t(n,{title:"Build Analytics",tooltip:"Last 10 parse pipeline runs with metrics and diagnostics"}),0===f.length&&t(o,{component:"div",sx:{p:2,textAlign:"center",color:"#6c757d"},children:t(r,{variant:"caption",sx:{fontSize:"11px"},children:"No builds recorded yet."})}),f.map(r=>{let l=r.diagnostics.filter(t=>"warning"===t.severity).length,n=r.diagnostics.filter(t=>"info"===t.severity).length,a=r.metrics.reduce((t,e)=>Math.max(t,e.startOffset+e.duration),0);return t(s,{title:(t=>{let e=Math.floor((Date.now()-t)/1e3);if(e<5)return"just now";if(e<60)return`${e}s ago`;let o=Math.floor(e/60);return o<60?`${o}m ago`:new Date(t).toLocaleTimeString()})(r.timestamp),onClick:()=>{d(r)},selected:!1,secondary:e(o,{component:"div",sx:{display:"flex",gap:.5,alignItems:"center"},children:[l>0&&t(i,{label:`${l}W`,size:"small",sx:{fontSize:"9px",height:16,backgroundColor:"#fff3cd",color:"#856404"}}),n>0&&t(i,{label:`${n}I`,size:"small",sx:{fontSize:"9px",height:16,backgroundColor:"#e3f2fd",color:"#0984e3"}}),t(i,{label:`${Math.round(a)}ms`,size:"small",sx:{fontSize:"9px",height:16,backgroundColor:"#f1f3f5",color:"#495057"}})]})},r.timestamp)})]})};

package/dist/editor/analytics/AnalyticsContext.d.ts

@@ -0,0 +1,17 @@
+import type { ParseCount, ParseMetric, SpecDiagnostic } from '#package/application-spec';
+/** A snapshot of one parse pipeline run. */
+export interface BuildAnalytics {
+    readonly timestamp: number;
+    readonly diagnostics: readonly SpecDiagnostic[];
+    readonly metrics: readonly ParseMetric[];
+    readonly counts: readonly ParseCount[];
+}
+export interface AnalyticsContextType {
+    readonly builds: readonly BuildAnalytics[];
+    readonly latestBuild: BuildAnalytics | undefined;
+    readonly pushBuild: (entry: Omit<BuildAnalytics, 'timestamp'>) => void;
+}
+export declare const AnalyticsProvider: (props: {
+    readonly children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const useAnalytics: () => AnalyticsContextType;

package/dist/editor/analytics/AnalyticsContext.js

@@ -0,0 +1 @@
+import{jsx as t}from"react/jsx-runtime";import{createContext as e,useCallback as r,useContext as i,useMemo as l,useState as s}from"react";let n=e(null);export const AnalyticsProvider=e=>{let[i,o]=s([]),a=r(t=>{let e={...t,timestamp:Date.now()};o(t=>[e,...t].slice(0,10))},[]),c=l(()=>({builds:i,latestBuild:i[0],pushBuild:a}),[i,a]);return t(n.Provider,{value:c,children:e.children})};export const useAnalytics=()=>{let t=i(n);if(null===t)throw Error("useAnalytics must be used within AnalyticsProvider");return t};

package/dist/editor/analytics/AnalyticsDetail.d.ts

@@ -0,0 +1,5 @@
+import type { BuildAnalytics } from './AnalyticsContext.js';
+export declare const AnalyticsDetail: (props: {
+    readonly build: BuildAnalytics;
+    readonly onBack: () => void;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/editor/analytics/AnalyticsDetail.js

@@ -0,0 +1 @@
+import{jsx as i,jsxs as o}from"react/jsx-runtime";import{Box as e,Chip as n,Typography as t}from"@mui/material";import{PhxIcon as l}from"#package/ui-sdk";import{PanelDetail as r}from"../common/PanelDetail.js";import{MetricsFlamegraph as a}from"./MetricsFlamegraph.js";let c={warning:{color:"#e67700",icon:"WarningCircle"},info:{color:"#0984e3",icon:"Info"},error:{color:"#dc3545",icon:"XCircle"}};export const AnalyticsDetail=s=>{let{build:m,onBack:d}=s,p=m.metrics.reduce((i,o)=>Math.max(i,o.startOffset+o.duration),0);return i(r,{onBack:d,title:`Build ${new Date(m.timestamp).toLocaleTimeString()}`,children:o(e,{component:"div",sx:{display:"flex",flexDirection:"column",gap:2},children:[o(e,{component:"div",children:[i(t,{variant:"subtitle2",sx:{fontSize:"11px",fontWeight:600,color:"#212529",mb:.5},children:"Domain Stats"}),o(e,{component:"div",sx:{display:"flex",flexWrap:"wrap",gap:.5},children:[m.counts.map(o=>i(n,{label:`${o.name}: ${o.value}`,size:"small",sx:{fontSize:"10px",height:20,backgroundColor:"#f1f3f5",color:"#495057"}},o.name)),i(n,{label:`${Math.round(p)}ms`,size:"small",sx:{fontSize:"10px",height:20,backgroundColor:"#e3f2fd",color:"#0984e3",fontWeight:600}})]})]}),m.diagnostics.length>0&&o(e,{component:"div",children:[o(t,{variant:"subtitle2",sx:{fontSize:"11px",fontWeight:600,color:"#212529",mb:.5},children:["Diagnostics (",m.diagnostics.length,")"]}),i(e,{component:"div",sx:{display:"flex",flexDirection:"column",gap:.25},children:m.diagnostics.map((n,r)=>{let a=c[n.severity];return o(e,{component:"div",sx:{display:"flex",alignItems:"flex-start",gap:.5,px:.5,py:.25,borderRadius:"2px","&:hover":{backgroundColor:"#f8f9fa"}},children:[i(l,{name:a.icon,style:{fontSize:12,color:a.color,marginTop:2}}),o(e,{component:"div",sx:{flex:1,minWidth:0},children:[o(t,{variant:"caption",sx:{fontSize:"10px",fontWeight:600,color:a.color,display:"block"},children:["[",n.code,"]"]}),i(t,{variant:"caption",sx:{fontSize:"10px",color:"#495057",display:"block"},children:n.message}),n.file&&i(t,{variant:"caption",sx:{fontSize:"9px",color:"#6c757d",display:"block"},children:n.file})]})]},`${n.code}-${r}`)})})]}),o(e,{component:"div",children:[i(t,{variant:"subtitle2",sx:{fontSize:"11px",fontWeight:600,color:"#212529",mb:.5},children:"Pipeline Timeline"}),i(a,{metrics:m.metrics})]})]})})};

package/dist/editor/analytics/MetricsFlamegraph.d.ts

@@ -0,0 +1,5 @@
+import type { ParseMetric } from '#package/application-spec';
+/** Renders pipeline metrics as a horizontal flamegraph with nested bars. */
+export declare const MetricsFlamegraph: (props: {
+    readonly metrics: readonly ParseMetric[];
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/editor/analytics/MetricsFlamegraph.js

@@ -0,0 +1,3 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Box as r,Tooltip as i,Typography as n}from"@mui/material";let o=(e,t)=>{let r=[];for(let i of e)r.push({metric:i,depth:t}),i.children.length>0&&r.push(...o(i.children,t+1));return r},a=e=>e>=1e3?`${(e/1e3).toFixed(1)}s`:e<.1?"<0.1ms":e<1?`${e.toFixed(1)}ms`:`${Math.round(e)}ms`,l=["#0984e3","#74b9ff","#a29bfe","#6c5ce7","#fd79a8"];export const MetricsFlamegraph=d=>{let{metrics:s}=d;if(0===s.length)return e(n,{variant:"caption",sx:{color:"#6c757d",fontSize:"11px"},children:"No metrics recorded."});let p=s.reduce((e,t)=>Math.max(e,t.startOffset+t.duration),0);return e(r,{component:"div",sx:{display:"grid",gridTemplateColumns:"150px 1fr 45px",gap:"2px 4px",alignItems:"center"},children:o(s,0).map((o,d)=>{let{metric:s,depth:c}=o,m=p>0?s.startOffset/p*100:0,h=p>0?Math.max(.5,s.duration/p*100):100,x=l[c%l.length];return e(i,{title:`${s.caller} → ${s.name}
+${s.file}
+${a(s.duration)}`,arrow:!0,placement:"top",children:t(r,{component:"div",sx:{display:"grid",gridColumn:"1 / -1",gridTemplateColumns:"subgrid",alignItems:"center"},children:[e(n,{variant:"caption",noWrap:!0,sx:{fontSize:"10px",fontWeight:500,color:"#495057",overflow:"hidden",textOverflow:"ellipsis",pl:`${10*c}px`},children:s.name}),e(r,{component:"div",sx:{height:14,position:"relative"},children:e(r,{component:"div",sx:{position:"absolute",left:`${m}%`,width:`${h}%`,height:"100%",backgroundColor:x,borderRadius:"3px",minWidth:"3px"}})}),e(n,{variant:"caption",noWrap:!0,sx:{fontSize:"10px",color:"#6c757d",textAlign:"right"},children:a(s.duration)})]})},`${s.name}-${d}`)})})};

package/dist/editor/analytics/index.d.ts

@@ -0,0 +1,2 @@
+export { Analytics } from './Analytics.js';
+export { AnalyticsProvider, useAnalytics, type BuildAnalytics } from './AnalyticsContext.js';

package/dist/editor/analytics/index.js

@@ -0,0 +1 @@
+export{Analytics}from"./Analytics.js";export{AnalyticsProvider,useAnalytics}from"./AnalyticsContext.js";

package/dist/editor/common/CollapsibleSection.d.ts

@@ -0,0 +1,36 @@
+import { type ReactNode } from 'react';
+export interface CollapsibleSectionItem<T = unknown> {
+    readonly key: string;
+    readonly title: string;
+    readonly description?: string;
+    readonly isActive?: boolean;
+    readonly badges?: ReactNode[];
+    readonly data: T;
+}
+interface CollapsibleSectionPropsWithItems<T> {
+    readonly icon?: ReactNode;
+    readonly title: string;
+    readonly subtitle?: string;
+    readonly count?: number;
+    readonly defaultExpanded?: boolean;
+    readonly actions?: ReactNode[];
+    readonly tooltip?: string;
+    readonly items: ReadonlyArray<CollapsibleSectionItem<T>>;
+    readonly onItemClick: (item: CollapsibleSectionItem<T>) => void | Promise<void>;
+    readonly children?: never;
+}
+interface CollapsibleSectionPropsWithChildren {
+    readonly icon?: ReactNode;
+    readonly title: string;
+    readonly subtitle?: string;
+    readonly count?: number;
+    readonly defaultExpanded?: boolean;
+    readonly actions?: ReactNode[];
+    readonly tooltip?: string;
+    readonly items?: never;
+    readonly onItemClick?: never;
+    readonly children: ReactNode;
+}
+type CollapsibleSectionProps<T = unknown> = CollapsibleSectionPropsWithItems<T> | CollapsibleSectionPropsWithChildren;
+export declare const CollapsibleSection: <T>(props: CollapsibleSectionProps<T>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/editor/common/CollapsibleSection.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import{Box as i,Collapse as r,IconButton as n,Stack as l,Tooltip as t,Typography as c}from"@mui/material";import{useState as d}from"react";import{PhxIcon as a}from"#package/ui-sdk";export const CollapsibleSection=s=>{let{icon:p,title:f,subtitle:m,count:x,defaultExpanded:h=!0,actions:b=[],tooltip:g,items:v,onItemClick:u,children:y}=s,[k,C]=d(h),z=void 0!==x?`${f} (${x})`:f,S=v?e(l,{direction:"column",spacing:0,sx:{py:1},children:v.map(r=>{let n=r.isActive??!1;return o(i,{component:"div",sx:{display:"flex",alignItems:"center",gap:1,p:1,backgroundColor:n?"#e7f3ff":"#ffffff",borderRadius:1,border:"1px solid",borderColor:n?"#0066cc":"#e9ecef",cursor:"pointer",transition:"all 0.15s ease",mb:.5,"&:hover":{backgroundColor:n?"#d6ebff":"#f8f9fa",borderColor:"#adb5bd"}},onClick:async()=>{await u(r)},children:[o(i,{component:"div",sx:{flex:1},children:[e(c,{variant:"subtitle2",sx:{fontWeight:600,color:"#212529",fontSize:"12px"},children:r.title}),r.description&&e(c,{variant:"caption",sx:{color:"#6c757d",fontSize:"10px",display:"block"},children:r.description})]}),r.badges&&r.badges.length>0&&e(i,{component:"div",sx:{display:"flex",alignItems:"center",gap:.5},children:r.badges})]},r.key)})}):y;return o(i,{component:"div",sx:{borderBottom:"1px solid #e9ecef"},children:[o(i,{component:"div",sx:{display:"flex",alignItems:"center",gap:1,px:1,py:.5,mb:.5*!!k,backgroundColor:"#f8f9fa",borderRadius:1,border:"1px solid #e9ecef",cursor:"pointer","&:hover":{backgroundColor:"#e9ecef"}},onClick:()=>{C(!k)},children:[e(n,{size:"small",sx:{p:0,color:"#495057"},children:e(a,{name:k?"CaretDown":"CaretRight",style:{fontSize:14}})}),p&&e(i,{component:"div",sx:{fontSize:"14px"},children:p}),o(i,{component:"div",sx:{flex:1},children:[o(i,{component:"div",sx:{display:"flex",alignItems:"center",gap:.5},children:[e(c,{variant:"subtitle2",sx:{fontWeight:600,color:"#495057",fontSize:"11px"},children:z}),g&&e(t,{title:g,placement:"right",arrow:!0,children:e(n,{size:"small",sx:{color:"#6c757d",fontSize:10,p:.1,"&:hover":{backgroundColor:"#ffffff",color:"#495057"}},children:e(a,{name:"Info",style:{fontSize:10}})})})]}),m&&e(c,{variant:"caption",sx:{color:"#6c757d",fontSize:"10px",display:"block"},children:m})]}),b.length>0&&e(i,{component:"div",sx:{display:"flex",gap:.5},children:b.map((o,r)=>e(i,{component:"div",children:o},r))})]}),e(r,{in:k,children:S})]})};

package/dist/editor/common/EditorButton.d.ts

@@ -0,0 +1,9 @@
+import { type ButtonProps } from '@mui/material';
+import type { ReactNode } from 'react';
+interface EditorButtonProps extends Omit<ButtonProps, 'variant' | 'color' | 'size'> {
+    children: ReactNode;
+    variant?: 'primary' | 'secondary' | 'danger';
+    fullWidth?: boolean;
+}
+export declare const EditorButton: ({ children, variant, fullWidth, sx, ...props }: EditorButtonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/editor/common/EditorButton.js

@@ -0,0 +1 @@
+import{jsx as r}from"react/jsx-runtime";import{Button as o}from"@mui/material";export const EditorButton=({children:e,variant:a="primary",fullWidth:d=!1,sx:t,...n})=>r(o,{variant:"outlined",size:"small",sx:{...(()=>{let r={fontSize:"13px",fontWeight:500,textTransform:"none",borderRadius:"6px",py:1,px:2,minWidth:d?"100%":"auto",width:d?"100%":"auto",transition:"all 0.15s ease"};switch(a){case"primary":return{...r,backgroundColor:"#ffffff",border:"1px solid #dee2e6",color:"#495057","&:hover":{backgroundColor:"#f8f9fa",borderColor:"#adb5bd",color:"#212529",boxShadow:"0 2px 4px rgba(0, 0, 0, 0.08)"},"&:active":{backgroundColor:"#e9ecef",borderColor:"#6c757d"}};case"secondary":return{...r,backgroundColor:"transparent",border:"1px solid #dee2e6",color:"#6c757d","&:hover":{backgroundColor:"#f8f9fa",borderColor:"#adb5bd",color:"#495057"}};case"danger":return{...r,backgroundColor:"transparent",border:"1px solid #dc3545",color:"#dc3545","&:hover":{backgroundColor:"#fff5f5",borderColor:"#dc3545",color:"#c82333"}};default:return r}})(),...t},...n,children:e});

package/dist/editor/common/EditorPageHeader.d.ts

@@ -0,0 +1,8 @@
+import { type ReactNode } from 'react';
+export interface EditorPageHeaderProps {
+    readonly title: string;
+    readonly description?: string;
+    readonly tooltip?: string;
+    readonly actions?: ReactNode;
+}
+export declare const EditorPageHeader: (props: EditorPageHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/editor/common/EditorPageHeader.js

@@ -0,0 +1 @@
+import{jsx as o,jsxs as e}from"react/jsx-runtime";import{Box as r,IconButton as t,Tooltip as i,Typography as n}from"@mui/material";import{PhxIcon as a}from"#package/ui-sdk";export const EditorPageHeader=c=>{let{title:l,description:d,tooltip:s,actions:f}=c;return e(r,{component:"div",sx:{p:1.5,backgroundColor:"#f8f9fa",borderBottom:"1px solid #e9ecef"},children:[e(r,{component:"div",sx:{display:"flex",alignItems:"center",gap:1,mb:.5*!!d},children:[o(n,{variant:"h6",sx:{fontWeight:600,color:"#212529",fontSize:"14px"},children:l}),s&&o(i,{title:s,placement:"right",arrow:!0,children:o(t,{size:"small",sx:{color:"#6c757d",fontSize:11,p:.25,"&:hover":{backgroundColor:"#ffffff",color:"#495057"}},children:o(a,{name:"Info",style:{fontSize:12}})})}),f&&o(r,{component:"div",sx:{ml:"auto"},children:f})]}),d&&o(n,{variant:"caption",sx:{color:"#6c757d"},children:d})]})};

package/dist/editor/common/JsonInspector.d.ts

@@ -0,0 +1,13 @@
+export declare const JsonInspector: (props: {
+    object: unknown;
+    onClose: () => void;
+    collapsed?: boolean | number;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const JsonInspectorButton: <T>(props: {
+    title: string;
+    data: T;
+    collapsed?: boolean | number;
+    disabled?: boolean;
+    compact?: boolean;
+    format?: (data: T) => unknown;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/editor/common/JsonInspector.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as o,Fragment as r}from"react/jsx-runtime";import{Box as n,Card as t,CardContent as i,Dialog as l,IconButton as a,Typography as c}from"@mui/material";import{useMemo as s,useState as d}from"react";import{JsonViewer as p,PhxIcon as x}from"#package/ui-sdk";export const JsonInspector=r=>{let{object:t,onClose:i,collapsed:s}=r,[h,f]=d(s),[g,m]=d(0);return o(l,{open:!0,onClose:i,maxWidth:"xl",fullWidth:!0,PaperProps:{sx:{borderRadius:3,boxShadow:"0 8px 32px rgba(25, 118, 210, 0.12)",border:"1px solid rgba(25, 118, 210, 0.08)",overflow:"hidden"}},children:[o(n,{component:"div",sx:{display:"flex",alignItems:"center",justifyContent:"space-between",p:3,borderBottom:"1px solid #e9ecef",backgroundColor:"#FAFBFC",background:"linear-gradient(135deg, #FAFBFC 0%, #f8f9fa 100%)"},children:[o(n,{component:"div",sx:{display:"flex",alignItems:"center",gap:2},children:[e(n,{component:"div",sx:{width:32,height:32,display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"rgba(25, 118, 210, 0.1)",borderRadius:1.5,color:"#1976d2"},children:e(x,{name:"BracketsCurly",sx:{fontSize:18}})}),o(n,{component:"div",children:[e(c,{variant:"h6",sx:{fontWeight:700,color:"#212529",fontSize:"1.1rem",mb:.5},children:"JSON Inspector"}),e(c,{variant:"caption",sx:{color:"#6c757d",fontSize:"0.8rem"},children:"Explore object structure and properties"})]})]}),o(n,{component:"div",sx:{display:"flex",alignItems:"center",gap:1},children:[o(n,{component:"button",onClick:()=>{f(!1),m(e=>e+1)},sx:{display:"flex",alignItems:"center",gap:.5,px:1.5,py:.75,border:"none",backgroundColor:"transparent",color:"#6c757d",fontSize:"13px",fontWeight:500,cursor:"pointer",borderRadius:1,transition:"all 0.2s","&:hover":{backgroundColor:"rgba(25, 118, 210, 0.08)",color:"#1976d2"}},children:[e(x,{name:"ArrowsOut",sx:{fontSize:14}}),e(c,{sx:{fontSize:"13px",fontWeight:500},children:"Expand All"})]}),o(n,{component:"button",onClick:()=>{f(!0),m(e=>e+1)},sx:{display:"flex",alignItems:"center",gap:.5,px:1.5,py:.75,border:"none",backgroundColor:"transparent",color:"#6c757d",fontSize:"13px",fontWeight:500,cursor:"pointer",borderRadius:1,transition:"all 0.2s","&:hover":{backgroundColor:"rgba(25, 118, 210, 0.08)",color:"#1976d2"}},children:[e(x,{name:"ArrowsIn",sx:{fontSize:14}}),e(c,{sx:{fontSize:"13px",fontWeight:500},children:"Collapse All"})]}),e(n,{component:"div",sx:{width:"1px",height:"24px",backgroundColor:"#dee2e6",mx:.5}}),e(a,{onClick:i,size:"small",sx:{color:"#6c757d","&:hover":{backgroundColor:"rgba(220, 53, 69, 0.08)",color:"#dc3545"}},children:e(x,{name:"X",sx:{fontSize:18}})})]})]}),e(n,{component:"div",sx:{height:"85vh",overflow:"auto"},children:e(p,{data:t,collapsed:h},g)})]})};export const JsonInspectorButton=l=>{let{title:a,data:p,collapsed:h,disabled:f,compact:g,format:m}=l,[b,u]=d(!1),y=Array.isArray(p)?"Array":typeof p,C=Array.isArray(p)?p.length:p&&"object"==typeof p?Object.keys(p).length:0,v=s(()=>b?m?.(p)??p:null,[p,m,b]);return o(r,{children:[e(t,{variant:"outlined",sx:{borderColor:"#e9ecef",borderRadius:g?1:2,boxShadow:"0 1px 3px rgba(25, 118, 210, 0.08)",opacity:f?.5:1,pointerEvents:f?"none":"auto","&:hover":f?{}:{borderColor:"#1976d2",backgroundColor:"#ffffff",cursor:"pointer",boxShadow:"0 4px 12px rgba(25, 118, 210, 0.15)"},transition:"all 0.25s ease"},onClick:()=>{f||u(!0)},children:e(i,{sx:{p:g?.5:1,"&:last-child":{pb:g?.5:1}},children:o(n,{component:"div",sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[o(n,{component:"div",sx:{display:"flex",alignItems:"center",gap:g?1:2,flex:1},children:[e(n,{component:"div",sx:{width:g?20:28,height:g?20:28,display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"rgba(25, 118, 210, 0.1)",borderRadius:g?.75:1,color:"#1976d2"},children:e(x,{name:"BracketsCurly",sx:{fontSize:g?11:14}})}),o(n,{component:"div",sx:{flex:1},children:[e(c,{variant:"subtitle2",sx:{fontWeight:600,color:"#212529",fontSize:g?"11px":"14px"},children:a}),o(c,{variant:"caption",sx:{color:"#6c757d",fontSize:g?"9px":"12px"},children:[y,C>0&&` • ${C} ${1===C?"item":"items"}`]})]})]}),o(n,{component:"div",sx:{display:"flex",alignItems:"center",gap:.25},children:[!g&&e(c,{variant:"caption",sx:{color:"#1976d2",fontWeight:600,fontSize:"12px"},children:"Inspect"}),e(x,{name:"ArrowRight",sx:{fontSize:g?12:16,color:"#1976d2"}})]})]})})}),b&&e(JsonInspector,{object:v,onClose:()=>{u(!1)},collapsed:h})]})};

package/dist/editor/common/LoadingState.d.ts

@@ -0,0 +1,5 @@
+interface LoadingStateProps {
+    message?: string;
+}
+export declare const LoadingState: (props: LoadingStateProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/editor/common/LoadingState.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Box as i,CircularProgress as n,Typography as o}from"@mui/material";export const LoadingState=r=>{let{message:a="Loading..."}=r;return t(i,{component:"div",sx:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",height:"100%",p:4,gap:2},children:[e(n,{size:40}),e(o,{variant:"body2",sx:{color:"#6c757d",fontSize:"13px"},children:a})]})};