@salsita-ai/sdk 0.50.0-develop.be40f0cee8 → 0.50.0-develop.d6ed5efd42

package/dist/configurator/application-runtime/extensions/systems/graphql-system/graphql-system.js

@@ -1 +1 @@
-import{GraphQLError as e,buildSchema as t,defaultFieldResolver as i,getNamedType as o,graphql as a,validateSchema as n}from"graphql";import{assertExistence as r,createSelector as s,isMessageDescriptor as l,isMultilingualString as c}from"@salsita-ai/common/utils";import{DomainEntityIdSchema as h,findAssistantMutation as d}from"#package/domain";import{createEntityMeta as m}from"./entity-meta.js";let p={errors:[new e('No assistant manifest in the application spec. The GraphQL schema is generated from the "assistant" section. Add an "assistant" section to a spec file to expose a schema.')]},u={errors:[new e("The configuration is not loaded yet, so there is no state to query. Run the query again once the configurator has finished loading.")]},f=new RegExp(h.pattern),y=e=>"object"==typeof e&&null!==e&&"type"in e&&"string"==typeof e.type&&"id"in e&&"string"==typeof e.id,g=(e,t)=>"object"==typeof e&&null!==e?Reflect.get(e,t):void 0,v=e=>e instanceof Error?e.message:String(e),S=e=>/[.!?]$/.test(e)?e:`${e}.`,_=e=>"object"==typeof e&&null!==e&&Object.getPrototypeOf(e)===Object.prototype,x=(e,t)=>{let i=_(e)?e._raw:void 0;if(y(i))return i;if(!Array.isArray(e)&&!_(e))return e;if(t.has(e))throw Error("The value contains itself. Return ids or copies of the values instead of objects that reference each other.");let o=new Set([...t,e]);return Array.isArray(e)?e.map(e=>x(e,o)):Object.fromEntries(Object.entries(e).map(([e,t])=>[e,x(t,o)]))},w=(e,t)=>Array.isArray(e)?e.map(e=>w(e,t)):"string"==typeof e||l(e)||c(e)?t(e):e,$=t=>new e(`The GraphQL schema generated from the "assistant" manifest is invalid: ${S(t)} Regenerate the application so the schema is rebuilt from the current spec.`),E=e=>(e.errors?.length??0)>0,b=t=>({errors:[new e(`Not run: operation ${t+1} failed, so the operations after it were skipped and no change of the list takes effect. Fix the failing operation and send the whole list again.`)]});export class GraphQLSystem{_context;_selectSchema=s([s.leaf(e=>e)],e=>{try{let i=t(e),o=n(i);return o.length>0?$(o.map(e=>e.message).join(" ")):i}catch(e){return $(v(e))}});_selectFieldResolver=s([s.leaf(e=>e)],t=>(a,n,r,s)=>{if(s.parentType===s.schema.getQueryType())return i(a,n,r,s);if(s.parentType===s.schema.getMutationType())return this._resolveMutation(s.fieldName,String(s.path.key),n,r);if(!y(a))return i(a,n,r,s);if("meta"===s.fieldName){let e;return m({entity:a,state:("object"==typeof(e=g(a,"_state"))&&null!==e&&"entities"in e&&"rootEntityId"in e?e:void 0)??r.state},{manifest:r.manifest,recipes:this._recipeContext(),prepareStateEmission:(e,t,i)=>this._context.domainContextSelectors.getStoreSystem().prepareStateEmission(e,t,i),find$Entity:(e,t)=>this._find$Entity(e,t),validateEntity:e=>this._context.domainContextSelectors.getDomain().validateEntity(e)})}let{source:l,localized:c}=t[s.parentType.name]?.[s.fieldName]??{source:s.fieldName},h=((t,i)=>{try{return g(t,i)}catch(o){throw new e(`Expression "${i}" failed on ${y(t)?t.id:"an entity"}: ${S(v(o))} The expression threw while the query read it; fix the expression or the configuration state it reads.`,{originalError:o instanceof Error?o:void 0})}})(a,l);return c?w(h,this._context.domainServicesSelectors.getResolveLocalizable()):l.startsWith("$")&&"JSON"===o(s.returnType).name?((t,i,o)=>{try{return x(o,new Set)}catch(o){throw new e(`Expression "${i}" returned a value that is not plain serializable data on ${y(t)?t.id:"an entity"}: ${S(v(o))} A JSON field can only return data that serializes to JSON.`,{originalError:o instanceof Error?o:void 0})}})(a,l,h):h});constructor(e){this._context=e}_get$Entity=(e,t)=>this._context.domainContextSelectors.getDomain().get$Entity(e,t);_find$Entity=(e,t)=>this._context.domainContextSelectors.getDomain().getEntity(e,t)?this._get$Entity(e,t):null;_recipeContext=()=>({componentReader:this._context.domainContextSelectors.getComponentReader(),recipeCooker:this._context.domainContextSelectors.getRecipeCookerSystem(),resolveLocalizable:this._context.domainServicesSelectors.getResolveLocalizable()});_rootValue={root:(e,{state:t})=>this._get$Entity(t.rootEntityId,t),entities:({ids:t},{state:i})=>{if(null==t)return i.entities.map(e=>this._get$Entity(e.id,i));var o=i.rootEntityId;let a=t.filter(e=>!f.test(e));if(a.length>0)throw new e(`${a.map(e=>`"${e}"`).join(", ")} ${1===a.length?"is not an entity id":"are not entity ids"}. Entity ids have the form "<Type>-<number>", e.g. "${o}". Use ids as returned by the "id" field.`);return t.map(e=>f.test(e)?this._find$Entity(e,i):null)},selectedEntity:(e,{state:t})=>this._find$Entity(this._context.domainContextSelectors.getNavigationSystem().getActiveSelectionState(t),t),navigation:(e,{state:t})=>{let i=this._context.domainContextSelectors.getNavigationSystem();return{navigationState:i.getActiveNavigationState(t),viewState:i.getActiveViewState(t),toolState:i.getActiveToolState(t)}}};_resolveType=e=>y(e)?e.type:void 0;initialize=()=>{};_resolveMutation=(t,i,o,a)=>{if(void 0!==a.failedMutationField)throw new e(`Not run: the earlier field "${a.failedMutationField}" of this operation failed, so "${i}" was skipped and no change of the operation takes effect. Fix the failing field and send the operation again.`);try{return this._runMutation(t,o,a)}catch(e){throw a.failedMutationField=i,e}};_runMutation=(t,i,o)=>{let a=d(t,o.manifest);if(!a)throw new e(`The schema declares the mutation "${t}", but the configurator has no implementation for it. Regenerate the application so the schema matches the configurator.`);let n=o.state,r=a.implementation(i,n,{manifest:o.manifest,action:this._context.domainContextSelectors.getActionSystem().createContext(n),resolveLocalizable:this._context.domainServicesSelectors.getResolveLocalizable()});if(r.updates.length>0){let i=this._context.domainContextSelectors.getStoreSystem().prepareStateEmission(r.updates,n,"committed");if(!i.validity.valid)throw new e(`The changes of "${t}" were not applied, because the resulting configuration is invalid: ${(e=>{if("uncaught"===e.severity)return`validating it threw: ${S(v(e.error))}`;let t=[...new Set(e.entityViolations.filter(({violation:t})=>t.severity===e.severity).map(({entityId:e})=>e))];return`it has ${e.severity} violations on ${t.join(", ")}.`})(i.validity)} Change the request so the configuration stays valid.`);o.emissions.push(i),o.state=i.state}return r.readResult({previousState:n,state:o.state})};_setup=()=>{let t=this._context.specSelectors.getAssistant();if(!t)return{ready:!1,result:p};let i=this._selectSchema(t.sdl);return i instanceof e?{ready:!1,result:{errors:[i]}}:{ready:!0,assistant:t,schema:i,fieldResolver:this._selectFieldResolver(t.fields)}};prepare=async(e,t)=>{let i,o=this._setup();if(!o.ready)return t.map(()=>({result:o.result,emissions:[]}));let n={manifest:o.assistant,state:e,emissions:[],failedMutationField:void 0},r=[];for(let[e,s]of t.entries())if(void 0===i){let t=n.emissions.length;n.failedMutationField=void 0;let l=await a({schema:o.schema,source:s.document,rootValue:this._rootValue,contextValue:n,variableValues:s.variables,operationName:s.operationName,fieldResolver:o.fieldResolver,typeResolver:this._resolveType});r.push({result:l,emissions:n.emissions.slice(t)}),E(l)&&(i=e)}else r.push({result:b(i),emissions:[]});return r};_prepareAndCommit=async e=>{let t,i,o,a=this._context.domainContextSelectors.getStoreSystem(),n=await this.prepare(a.stateSlices.committed.value.state,e),s=n.map(({result:e})=>e),l=n.flatMap(e=>e.emissions);return s.some(E)||0===l.length?{results:s,outcome:"none"}:{results:s,outcome:a.commitPrepared((t=r(l[0]),i=r(l[l.length-1]),o=l.some(e=>void 0!==e.transformationLog),{kind:"committed",previousState:t.previousState,state:i.state,updates:l.flatMap(e=>e.updates),validity:i.validity,transformationLog:o?l.flatMap(e=>e.transformationLog??[]):void 0}))}};execute=async e=>{if(!this._context.domainContextSelectors.getStoreSystem().isInitialized)return{results:e.map(()=>u),committed:!1};let t=await this._prepareAndCommit(e),{results:i,outcome:o}="conflict"===t.outcome?await this._prepareAndCommit(e):t;return"committed"===o?{results:i,committed:!0}:"held"===o?{results:i,committed:!1,message:"The changes were not committed yet: the application held them, usually to ask the user for approval. They may still be applied once the user approves, and the next turn shows whether they were. Do not send the operations again."}:"conflict"===o?{results:i,committed:!1,message:"The changes were not committed, because the configuration changed while they were being applied. The results describe a state that was discarded. Query the current configuration and send the operations again if they still make sense."}:{results:i,committed:!1}}}
+import{GraphQLError as e,buildSchema as t,defaultFieldResolver as i,getNamedType as o,graphql as a,validateSchema as n}from"graphql";import{assertExistence as r,createSelector as s,isMessageDescriptor as l,isMultilingualString as c}from"@salsita-ai/common/utils";import{DomainEntityIdSchema as h,findAssistantMutation as d}from"#package/domain";import{createEntityMeta as m}from"./entity-meta.js";import{readSideEffects as p}from"./side-effects.js";let f={errors:[new e('No assistant manifest in the application spec. The GraphQL schema is generated from the "assistant" section. Add an "assistant" section to a spec file to expose a schema.')]},u={errors:[new e("The configuration is not loaded yet, so there is no state to query. Run the query again once the configurator has finished loading.")]},y=new RegExp(h.pattern),g=e=>"object"==typeof e&&null!==e&&"type"in e&&"string"==typeof e.type&&"id"in e&&"string"==typeof e.id,v=(e,t)=>"object"==typeof e&&null!==e?Reflect.get(e,t):void 0,S=e=>e instanceof Error?e.message:String(e),x=e=>/[.!?]$/.test(e)?e:`${e}.`,_=e=>"object"==typeof e&&null!==e&&Object.getPrototypeOf(e)===Object.prototype,w=(e,t)=>{let i=_(e)?e._raw:void 0;if(g(i))return i;if(!Array.isArray(e)&&!_(e))return e;if(t.has(e))throw Error("The value contains itself. Return ids or copies of the values instead of objects that reference each other.");let o=new Set([...t,e]);return Array.isArray(e)?e.map(e=>w(e,o)):Object.fromEntries(Object.entries(e).map(([e,t])=>[e,w(t,o)]))};export const localize=(e,t)=>Array.isArray(e)?e.map(e=>localize(e,t)):"string"==typeof e||l(e)||c(e)?t(e):e;let E=t=>new e(`The GraphQL schema generated from the "assistant" manifest is invalid: ${x(t)} Regenerate the application so the schema is rebuilt from the current spec.`),$=e=>(e.errors?.length??0)>0,b=t=>({errors:[new e(`Not run: operation ${t+1} failed, so the operations after it were skipped and no change of the list takes effect. Fix the failing operation and send the whole list again.`)]});export class GraphQLSystem{_context;_selectSchema=s([s.leaf(e=>e)],e=>{try{let i=t(e),o=n(i);return o.length>0?E(o.map(e=>e.message).join(" ")):i}catch(e){return E(S(e))}});_selectFieldResolver=s([s.leaf(e=>e)],t=>(a,n,r,s)=>{if(s.parentType===s.schema.getQueryType())return i(a,n,r,s);if(s.parentType===s.schema.getMutationType())return this._resolveMutation(s.fieldName,String(s.path.key),n,r);if(!g(a))return i(a,n,r,s);if("meta"===s.fieldName){let e;return m({entity:a,state:("object"==typeof(e=v(a,"_state"))&&null!==e&&"entities"in e&&"rootEntityId"in e?e:void 0)??r.state},{manifest:r.manifest,recipes:this._recipeContext(),prepareStateEmission:(e,t,i)=>this._context.domainContextSelectors.getStoreSystem().prepareStateEmission(e,t,i),find$Entity:(e,t)=>this._find$Entity(e,t),validateEntity:e=>this._context.domainContextSelectors.getDomain().validateEntity(e)})}let{source:l,localized:c}=t[s.parentType.name]?.[s.fieldName]??{source:s.fieldName},h=((t,i)=>{try{return v(t,i)}catch(o){throw new e(`Expression "${i}" failed on ${g(t)?t.id:"an entity"}: ${x(S(o))} The expression threw while the query read it; fix the expression or the configuration state it reads.`,{originalError:o instanceof Error?o:void 0})}})(a,l);return c?localize(h,this._context.domainServicesSelectors.getResolveLocalizable()):l.startsWith("$")&&"JSON"===o(s.returnType).name?((t,i,o)=>{try{return w(o,new Set)}catch(o){throw new e(`Expression "${i}" returned a value that is not plain serializable data on ${g(t)?t.id:"an entity"}: ${x(S(o))} A JSON field can only return data that serializes to JSON.`,{originalError:o instanceof Error?o:void 0})}})(a,l,h):h});constructor(e){this._context=e}_get$Entity=(e,t)=>this._context.domainContextSelectors.getDomain().get$Entity(e,t);_find$Entity=(e,t)=>this._context.domainContextSelectors.getDomain().getEntity(e,t)?this._get$Entity(e,t):null;_recipeContext=()=>({componentReader:this._context.domainContextSelectors.getComponentReader(),recipeCooker:this._context.domainContextSelectors.getRecipeCookerSystem(),resolveLocalizable:this._context.domainServicesSelectors.getResolveLocalizable()});_rootValue={root:(e,{state:t})=>this._get$Entity(t.rootEntityId,t),entities:({ids:t},{state:i})=>{if(null==t)return i.entities.map(e=>this._get$Entity(e.id,i));var o=i.rootEntityId;let a=t.filter(e=>!y.test(e));if(a.length>0)throw new e(`${a.map(e=>`"${e}"`).join(", ")} ${1===a.length?"is not an entity id":"are not entity ids"}. Entity ids have the form "<Type>-<number>", e.g. "${o}". Use ids as returned by the "id" field.`);return t.map(e=>y.test(e)?this._find$Entity(e,i):null)},selectedEntity:(e,{state:t})=>this._find$Entity(this._context.domainContextSelectors.getNavigationSystem().getActiveSelectionState(t),t),navigation:(e,{state:t})=>{let i=this._context.domainContextSelectors.getNavigationSystem();return{navigationState:i.getActiveNavigationState(t),viewState:i.getActiveViewState(t),toolState:i.getActiveToolState(t)}}};_resolveType=e=>g(e)?e.type:void 0;initialize=()=>{};_resolveMutation=(t,i,o,a)=>{if(void 0!==a.failedMutationField)throw new e(`Not run: the earlier field "${a.failedMutationField}" of this operation failed, so "${i}" was skipped and no change of the operation takes effect. Fix the failing field and send the operation again.`);try{return this._runMutation(t,o,a)}catch(e){throw a.failedMutationField=i,e}};_runMutation=(t,i,o)=>{let a=d(t,o.manifest);if(!a)throw new e(`The schema declares the mutation "${t}", but the configurator has no implementation for it. Regenerate the application so the schema matches the configurator.`);let n=o.state,r=a.implementation(i,n,{manifest:o.manifest,action:this._context.domainContextSelectors.getActionSystem().createContext(n),resolveLocalizable:this._context.domainServicesSelectors.getResolveLocalizable()});if(r.updates.length>0){let i=this._context.domainContextSelectors.getStoreSystem().prepareStateEmission(r.updates,n,"committed");if(!i.validity.valid)throw new e(`The changes of "${t}" were not applied, because the resulting configuration is invalid: ${(e=>{if("uncaught"===e.severity)return`validating it threw: ${x(S(e.error))}`;let t=[...new Set(e.entityViolations.filter(({violation:t})=>t.severity===e.severity).map(({entityId:e})=>e))];return`it has ${e.severity} violations on ${t.join(", ")}.`})(i.validity)} Change the request so the configuration stays valid.`);o.emissions.push(i),o.state=i.state}return r.readResult({previousState:n,state:o.state})};_setup=()=>{let t=this._context.specSelectors.getAssistant();if(!t)return{ready:!1,result:f};let i=this._selectSchema(t.sdl);return i instanceof e?{ready:!1,result:{errors:[i]}}:{ready:!0,assistant:t,schema:i,fieldResolver:this._selectFieldResolver(t.fields)}};prepare=async(e,t)=>{let i,o=this._setup();if(!o.ready)return t.map(()=>({result:o.result,emissions:[]}));let n={manifest:o.assistant,state:e,emissions:[],failedMutationField:void 0},r=[];for(let[e,s]of t.entries())if(void 0===i){let t=n.emissions.length;n.failedMutationField=void 0;let l=await a({schema:o.schema,source:s.document,rootValue:this._rootValue,contextValue:n,variableValues:s.variables,operationName:s.operationName,fieldResolver:o.fieldResolver,typeResolver:this._resolveType});r.push({result:l,emissions:n.emissions.slice(t)}),$(l)&&(i=e)}else r.push({result:b(i),emissions:[]});return r};readSideEffects=e=>{let t=this._context.domainServicesSelectors.getResolveLocalizable();return e.flatMap(({emissions:e})=>e.flatMap(e=>p(e.updates,t)))};_prepareAndCommit=async e=>{let t,i,o,a=this._context.domainContextSelectors.getStoreSystem(),n=await this.prepare(a.stateSlices.committed.value.state,e),s=n.map(({result:e})=>e),l=this.readSideEffects(n),c=n.flatMap(e=>e.emissions);return s.some($)||0===c.length?{results:s,sideEffects:l,outcome:"none"}:{results:s,sideEffects:l,outcome:a.commitPrepared((t=r(c[0]),i=r(c[c.length-1]),o=c.some(e=>void 0!==e.transformationLog),{kind:"committed",previousState:t.previousState,state:i.state,updates:c.flatMap(e=>e.updates),validity:i.validity,transformationLog:o?c.flatMap(e=>e.transformationLog??[]):void 0}))}};execute=async e=>{if(!this._context.domainContextSelectors.getStoreSystem().isInitialized)return{results:e.map(()=>u),committed:!1,sideEffects:[]};let t=await this._prepareAndCommit(e),{results:i,sideEffects:o,outcome:a}="conflict"===t.outcome?await this._prepareAndCommit(e):t;return"committed"===a?{results:i,committed:!0,sideEffects:o}:"held"===a?{results:i,committed:!1,message:"The changes were not committed yet: the application held them, usually to ask the user for approval. They may still be applied once the user approves, and the next turn shows whether they were. Do not send the operations again.",sideEffects:o}:"conflict"===a?{results:i,committed:!1,message:"The changes were not committed, because the configuration changed while they were being applied. The results describe a state that was discarded. Query the current configuration and send the operations again if they still make sense.",sideEffects:o}:{results:i,committed:!1,sideEffects:o}}}

package/dist/configurator/application-runtime/extensions/systems/graphql-system/side-effects.d.ts

@@ -0,0 +1,9 @@
+import type { Localizable } from '@salsita-ai/common/utils';
+import type { DataUpdate, DomainEntity } from '#package/domain';
+/**
+ * What the updates of an emission tell the assistant agent the configurator did beyond what was
+ * asked, in applied order with duplicates kept, the way the user gets them as snackbars. An update's
+ * `agentHint` replaces its user-facing `hint` for the agent, `null` keeps the update from the agent,
+ * and an update with neither says nothing. Empty text counts as none, as it does for the snackbar.
+ */
+export declare const readSideEffects: (updates: ReadonlyArray<DataUpdate<DomainEntity<string>, DomainEntity<string>>>, resolveLocalizable: (message: Localizable) => string) => readonly string[];

package/dist/configurator/application-runtime/extensions/systems/graphql-system/side-effects.js

@@ -0,0 +1 @@
+export const readSideEffects=(e,t)=>e.flatMap(({hint:e,agentHint:a})=>null===a?[]:void 0!==a?a?[a]:[]:e?[t(e)]:[]);

package/dist/configurator/application-runtime/extensions/systems/index.d.ts

@@ -1,5 +1,5 @@
 export { AnimationSystem, type AnimationSystemContext } from './animation-system.js';
-export { type AssistantClientTool, AssistantSystem, type AssistantSystemContext, } from './assistant-system/assistant-system.js';
+export { type AssistantChatSnapshot, type AssistantClientTool, type AssistantPanelSnapshot, AssistantSystem, type AssistantSystemContext, } from './assistant-system/assistant-system.js';
 export { CameraControlSystem, CameraControlType } from './camera-control-system/camera-control-system.js';
 export { type AnyCameraSystem, CameraSystem, type CameraSystemContext } from './camera-control-system/camera-system.js';
 export { createCameraControls } from './camera-control-system/create-camera-controls.js';

package/dist/configurator/common/frontend-analytics.d.ts

@@ -1,25 +1,25 @@
 import { type EntityId } from '#package/domain';
-declare const CloseConfiguratorClicked: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const PreviousStepButtonClicked: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const NextStepButtonClicked: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const FinalizeButtonClicked: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const SummaryButtonClicked: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const TopNavigationStepClicked: (step: string) => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const HorizontalTabClicked: (tab: string) => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const GoToProductsClicked: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const ExpandedViewClosed: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const ProductSelected: (productType: string, productName: string) => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const SelectionHotspotClicked: (id: string) => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const RedoButtonClicked: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const UndoButtonClicked: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const GlobalDimensionsButtonClicked: (dimensionUnit: string) => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const MeasurementsMenuToggled: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const MeasurementsMenuClosed: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const DimensionIndicatorsToggled: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const FullScreenModeToggled: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const HelpDialogOpened: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const HelpDialogClosed: () => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const EntityDeleteHotspotClicked: (id: EntityId) => import("../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
+declare const CloseConfiguratorClicked: () => import("#package/domain").UserActionEvent;
+declare const PreviousStepButtonClicked: () => import("#package/domain").UserActionEvent;
+declare const NextStepButtonClicked: () => import("#package/domain").UserActionEvent;
+declare const FinalizeButtonClicked: () => import("#package/domain").UserActionEvent;
+declare const SummaryButtonClicked: () => import("#package/domain").UserActionEvent;
+declare const TopNavigationStepClicked: (step: string) => import("#package/domain").UserActionEvent;
+declare const HorizontalTabClicked: (tab: string) => import("#package/domain").UserActionEvent;
+declare const GoToProductsClicked: () => import("#package/domain").UserActionEvent;
+declare const ExpandedViewClosed: () => import("#package/domain").UserActionEvent;
+declare const ProductSelected: (productType: string, productName: string) => import("#package/domain").UserActionEvent;
+declare const SelectionHotspotClicked: (id: string) => import("#package/domain").UserActionEvent;
+declare const RedoButtonClicked: () => import("#package/domain").UserActionEvent;
+declare const UndoButtonClicked: () => import("#package/domain").UserActionEvent;
+declare const GlobalDimensionsButtonClicked: (dimensionUnit: string) => import("#package/domain").UserActionEvent;
+declare const MeasurementsMenuToggled: () => import("#package/domain").UserActionEvent;
+declare const MeasurementsMenuClosed: () => import("#package/domain").UserActionEvent;
+declare const DimensionIndicatorsToggled: () => import("#package/domain").UserActionEvent;
+declare const FullScreenModeToggled: () => import("#package/domain").UserActionEvent;
+declare const HelpDialogOpened: () => import("#package/domain").UserActionEvent;
+declare const HelpDialogClosed: () => import("#package/domain").UserActionEvent;
+declare const EntityDeleteHotspotClicked: (id: EntityId) => import("#package/domain").UserActionEvent;
 export declare const FrontendAnalyticsFactory: {
     CloseConfiguratorClicked: typeof CloseConfiguratorClicked;
     PreviousStepButtonClicked: typeof PreviousStepButtonClicked;

package/dist/configurator/index.d.ts

@@ -1,6 +1,5 @@
 export { ConfiguratorApp } from './ConfiguratorApp.js';
 export * from './application-runtime/index.js';
-export * from './assistant/index.js';
 export * from './common/index.js';
 export * from './configurator-context/index.js';
 export * from './pages/index.js';

package/dist/configurator/index.js

@@ -1 +1 @@
-export{ConfiguratorApp}from"./ConfiguratorApp.js";export*from"./application-runtime/index.js";export*from"./assistant/index.js";export*from"./common/index.js";export*from"./configurator-context/index.js";export*from"./pages/index.js";export*from"./scene/index.js";export*from"./ui/index.js";export*from"./integration/index.js";
+export{ConfiguratorApp}from"./ConfiguratorApp.js";export*from"./application-runtime/index.js";export*from"./common/index.js";export*from"./configurator-context/index.js";export*from"./pages/index.js";export*from"./scene/index.js";export*from"./ui/index.js";export*from"./integration/index.js";

package/dist/configurator/pages/LoadedConfiguratorDetailPage.js

@@ -1 +1 @@
-import{jsx as o,jsxs as e,Fragment as i}from"react/jsx-runtime";import r from"mui-modal-provider";import{memo as n,useCallback as t,useMemo as a}from"react";import{match as d}from"ts-pattern";import{InvalidAccessKeyError as s}from"#package/client";import{BuiltInLoadingPhase as u,CommonAnalyticsFactory as l,DomainLifecycleBoundary as m,LoadedDataProvider as c,useAccessService as f,useAnalyticsService as p,useAuthorizedClient as g,useConfiguratorDomainFactory as v,useConfiguratorLoadStatus as w,useConfiguratorRawLoadedData as y,useExpectPhase as h,useLoadedDataActions as I,useLoadingError as C,useLoadingPhase as b,useLogger as j,useRoutingService as x}from"#package/react-sdk";import{IntegrationSubscription as k,OnConfiguratorReadyProvider as L,ViewportStateSync as U,useLayoutSystemConfig as M}from"../configurator-context/index.js";import{Layout as S,Legacy as E}from"../ui/index.js";import{LayoutCustomOwnerUi as F,LayoutCustomReadUi as R,LayoutDialog as D}from"../ui/phoenix-layout-elements/index.js";import{ConfiguratorNotFoundPage as T}from"./ConfiguratorNotFoundPage.js";import{DevContextFallback as P}from"./error-boundaries/DevContextFallback.js";import{DevLoadingFallback as A}from"./error-boundaries/DevLoadingFallback.js";import{LoadingErrorBoundary as O}from"./error-boundaries/LoadingErrorBoundary.js";import{useLoad as V}from"./use-load.js";let q=n(n=>{let{viewMode:t}=n,s=M(),{ownerUi:u,readUi:l}=a(()=>d(s.layout).with("simple",()=>({ownerUi:o(E.SimpleOwnerLayout,{}),readUi:o(E.SummaryReadLayout,{})})).with("tabs",()=>({ownerUi:o(E.TabsOwnerLayout,{}),readUi:o(E.SummaryReadLayout,{})})).with("steps",()=>({ownerUi:o(E.StepsOwnerLayout,{}),readUi:o(E.SummaryReadLayout,{})})).with("universal",()=>({ownerUi:o(S,{}),readUi:o(S,{})})).with("custom",()=>({ownerUi:o(F,{}),readUi:o(R,{})})).exhaustive(),[s.layout]);return o(r,{children:e(L,{children:[t?l:u,"universal"===s.layout&&e(i,{children:[o(E.CommonFinalizePage,{}),o(D,{})]})]})})});export const LoadedConfiguratorDetailPage=()=>{h(u.SceneAssets);let{configurationId:i,accessInfo:r}=f(),n=g(),a=x(),d=j(),L=p(),{startConfiguratorLoad:M,completeConfiguratorLoad:S,failConfiguratorLoad:E,resetConfiguratorLoad:F}=I(),{isLoading:R,isError:D}=w(),z=y(),B=v(),G=t(()=>r.viewMode&&void 0!==r.revisionId?n.getConfigurationRevision(i,r.revisionId):n.getConfiguration(i),[r.revisionId,r.viewMode,n,i]),N=t(()=>{M()},[M]),H=t(o=>{S({initialRevisionId:o.revisionId,initialEntities:o.data,modelVersion:o.modelVersion,rootEntityType:o.rootEntityType,schemaIdentity:B}),L.push(l.ConfigurationLoaded(o.configurationId,o.revisionId,r.viewMode?"read":"owner")),d.appendToGlobalContext({configurationId:o.configurationId,revisionId:o.revisionId,mode:r.viewMode}),d.info("Configuration loaded.")},[r.viewMode,L,S,B,d]),J=t(o=>{if(E(o),o instanceof s)return void a.rejectAccessToken(i,r.raw);let e=o instanceof Error?o:Error("Configuration loading failed with an unknown error.",{cause:o});d.error("Configuration loading failed because the API request did not succeed. Verify the configuration ID and access token.",{configurationId:i},e)},[r.raw,i,E,d,a]),K=t(()=>{F()},[F]);return(V({key:[n,i,r.revisionId,r.viewMode],load:G,onStart:N,onSuccess:H,onError:J,onCleanup:K}),b({id:u.DataFetch,label:"Loading configuration…"},R),C(D),D)?o(T,{}):null===z?null:o(c,{value:z,children:o(O,{fallbackRender:e=>o(A,{...e}),children:o(m,{type:"configurator",children:o(O,{FallbackComponent:P,children:e(k,{children:[o(U,{}),o(q,{viewMode:r.viewMode})]})})})})})};
+import{jsx as e,jsxs as o,Fragment as i}from"react/jsx-runtime";import r from"mui-modal-provider";import{memo as n,useCallback as t,useEffect as a,useMemo as d}from"react";import{match as s}from"ts-pattern";import{InvalidAccessKeyError as l}from"#package/client";import{BuiltInLoadingPhase as u,CommonAnalyticsFactory as m,DomainLifecycleBoundary as c,LoadedDataProvider as f,useAccessService as p,useAnalyticsService as g,useAuthorizedClient as v,useConfiguratorDomainFactory as w,useConfiguratorLoadStatus as y,useConfiguratorRawLoadedData as h,useExpectPhase as I,useLoadedDataActions as j,useLoadingError as x,useLoadingPhase as C,useLogger as b,useRoutingService as k,useSpecAssistant as L}from"#package/react-sdk";import{useConfigurator as U}from"../application-runtime/index.js";import{IntegrationSubscription as M,OnConfiguratorReadyProvider as S,ViewportStateSync as E,useLayoutSystemConfig as F}from"../configurator-context/index.js";import{Layout as R,Legacy as D}from"../ui/index.js";import{LayoutCustomOwnerUi as T,LayoutCustomReadUi as P,LayoutDialog as A}from"../ui/phoenix-layout-elements/index.js";import{ConfiguratorNotFoundPage as O}from"./ConfiguratorNotFoundPage.js";import{DevContextFallback as V}from"./error-boundaries/DevContextFallback.js";import{DevLoadingFallback as q}from"./error-boundaries/DevLoadingFallback.js";import{LoadingErrorBoundary as z}from"./error-boundaries/LoadingErrorBoundary.js";import{useLoad as B}from"./use-load.js";let G=n(n=>{let{viewMode:t}=n,l=F();(()=>{let{assistantSystem:e}=U(),o=null!=L();a(()=>{if(o)return e.activate()},[e,o])})();let{ownerUi:u,readUi:m}=d(()=>s(l.layout).with("simple",()=>({ownerUi:e(D.SimpleOwnerLayout,{}),readUi:e(D.SummaryReadLayout,{})})).with("tabs",()=>({ownerUi:e(D.TabsOwnerLayout,{}),readUi:e(D.SummaryReadLayout,{})})).with("steps",()=>({ownerUi:e(D.StepsOwnerLayout,{}),readUi:e(D.SummaryReadLayout,{})})).with("universal",()=>({ownerUi:e(R,{}),readUi:e(R,{})})).with("custom",()=>({ownerUi:e(T,{}),readUi:e(P,{})})).exhaustive(),[l.layout]);return e(r,{children:o(S,{children:[t?m:u,"universal"===l.layout&&o(i,{children:[e(D.CommonFinalizePage,{}),e(A,{})]})]})})});export const LoadedConfiguratorDetailPage=()=>{I(u.SceneAssets);let{configurationId:i,accessInfo:r}=p(),n=v(),a=k(),d=b(),s=g(),{startConfiguratorLoad:L,completeConfiguratorLoad:U,failConfiguratorLoad:S,resetConfiguratorLoad:F}=j(),{isLoading:R,isError:D}=y(),T=h(),P=w(),A=t(()=>r.viewMode&&void 0!==r.revisionId?n.getConfigurationRevision(i,r.revisionId):n.getConfiguration(i),[r.revisionId,r.viewMode,n,i]),N=t(()=>{L()},[L]),H=t(e=>{U({initialRevisionId:e.revisionId,initialEntities:e.data,modelVersion:e.modelVersion,rootEntityType:e.rootEntityType,schemaIdentity:P}),s.push(m.ConfigurationLoaded(e.configurationId,e.revisionId,r.viewMode?"read":"owner")),d.appendToGlobalContext({configurationId:e.configurationId,revisionId:e.revisionId,mode:r.viewMode}),d.info("Configuration loaded.")},[r.viewMode,s,U,P,d]),J=t(e=>{if(S(e),e instanceof l)return void a.rejectAccessToken(i,r.raw);let o=e instanceof Error?e:Error("Configuration loading failed with an unknown error.",{cause:e});d.error("Configuration loading failed because the API request did not succeed. Verify the configuration ID and access token.",{configurationId:i},o)},[r.raw,i,S,d,a]),K=t(()=>{F()},[F]);return(B({key:[n,i,r.revisionId,r.viewMode],load:A,onStart:N,onSuccess:H,onError:J,onCleanup:K}),C({id:u.DataFetch,label:"Loading configuration…"},R),x(D),D)?e(O,{}):null===T?null:e(f,{value:T,children:e(z,{fallbackRender:o=>e(q,{...o}),children:e(c,{type:"configurator",children:e(z,{FallbackComponent:V,children:o(M,{children:[e(E,{}),e(G,{viewMode:r.viewMode})]})})})})})};

package/dist/configurator/scene/scene-analytics/scene-analytics.d.ts

@@ -1,5 +1,5 @@
-declare const PerspectiveCameraDragEvent: () => import("../../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
-declare const OrthographicCameraDragEvent: () => import("../../../domain/domain-context/analytics-system/analytics-contracts").UserActionEvent;
+declare const PerspectiveCameraDragEvent: () => import("#package/domain").UserActionEvent;
+declare const OrthographicCameraDragEvent: () => import("#package/domain").UserActionEvent;
 export declare const SceneAnalyticsFactory: {
     PerspectiveCameraDragEvent: typeof PerspectiveCameraDragEvent;
     OrthographicCameraDragEvent: typeof OrthographicCameraDragEvent;

package/dist/configurator/ui/assistant/AssistantChips.js

@@ -1 +1 @@
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{Tooltip as a,styled as i}from"@mui/material";import{memo as n,useCallback as s}from"react";import{match as o}from"ts-pattern";import{useLocalizable as r}from"#package/react-sdk";import{PhxIcon as l}from"#package/ui-sdk";import{AssistantPanelName as d}from"./theme.js";let c={id:"sdk.assistant.tool.updateDesign.label",message:"Update design"},m={id:"sdk.assistant.tool.readDesign.label",message:"Read design"},p={id:"sdk.assistant.tool.mistake.hint",message:"The assistant made a mistake."},h=i("div",{name:d,slot:"chips"})(({theme:{palette:t,spacing:e,typography:a}})=>({...a.caption,alignItems:"start",color:t.text.secondary,display:"grid",gap:e(.75),gridTemplateColumns:"min-content minmax(0, 1fr)"})),g=i("span",{name:d,slot:"activity"})(({theme:{typography:t}})=>({blockSize:`calc(${t.caption.lineHeight} * 1em)`,display:"grid",placeItems:"center"})),f=i(l,{name:d,slot:"activityIcon"})({fontSize:14,'[data-chips="active"] &':{animation:"phx-assistant-turn 2.4s linear infinite","@media (prefers-reduced-motion: reduce)":{animation:"none"}},"@keyframes phx-assistant-turn":{to:{rotate:"360deg"}}}),k=i("span",{name:d,slot:"chip"})(({theme:{palette:t,spacing:e}})=>({cursor:"default",display:"inline-block",whiteSpace:"nowrap","&:not(:last-child)::after":{color:t.text.secondary,content:'"\xb7"',display:"inline-block",marginInline:e(.75),textDecoration:"none"},'&[data-chip="failed"]':{color:t.error.main},'&[data-chip="flawed"]':{textDecoration:"line-through",textDecorationColor:t.error.main}})),u=n(({tool:e})=>{let{chip:i,input:n,result:l}=e,d=r(c),h=r(m),g=r(p),f=o(i.label).with({kind:"text"},({text:t})=>t).with({kind:"updateDesign"},()=>d).with({kind:"readDesign"},()=>h).exhaustive(),u=s(()=>{console.info(`Assistant tool call "${f}"`,{input:n,result:l})},[n,f,l]);return t(a,{title:"failed"===i.state||"flawed"===i.state?g:"",placement:"top-start",children:t(k,{onClick:u,"data-chip":i.state,children:f})})});export const AssistantToolChips=n(({tools:a,isActive:i})=>e(h,{"data-chips":i?"active":"done","aria-busy":i,children:[t(g,{children:t(f,{name:"Gear"})}),t("div",{children:a.map(e=>t(u,{tool:e},e.id))})]}));
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{Tooltip as a,styled as i}from"@mui/material";import{memo as s,useCallback as o}from"react";import{match as n}from"ts-pattern";import{useLocalizable as r}from"#package/react-sdk";import{PhxIcon as l}from"#package/ui-sdk";import{AssistantPanelName as d}from"./theme.js";let m={id:"sdk.assistant.tool.updateDesign.label",message:"Update design"},c={id:"sdk.assistant.tool.readDesign.label",message:"Read design"},p={id:"sdk.assistant.tool.mistake.hint",message:"The assistant made a mistake."},h={id:"sdk.assistant.tool.cancelled.hint",message:"Stopped before it finished."},g={id:"sdk.assistant.tool.noResult.hint",message:"The result of this step was lost. It may or may not have been done."},f={id:"sdk.assistant.tool.toolBudget.hint",message:"Not done: the assistant reached its limit of steps for one message."},u=i("div",{name:d,slot:"chips"})(({theme:{palette:t,spacing:e,typography:a}})=>({...a.caption,alignItems:"start",color:t.text.secondary,display:"grid",gap:e(.75),gridTemplateColumns:"min-content minmax(0, 1fr)"})),k=i("span",{name:d,slot:"activity"})(({theme:{typography:t}})=>({blockSize:`calc(${t.caption.lineHeight} * 1em)`,display:"grid",placeItems:"center"})),x=i(l,{name:d,slot:"activityIcon"})({fontSize:14,'[data-chips="active"] &':{animation:"phx-assistant-turn 2.4s linear infinite","@media (prefers-reduced-motion: reduce)":{animation:"none"}},"@keyframes phx-assistant-turn":{to:{rotate:"360deg"}}}),w=i("span",{name:d,slot:"chip"})(({theme:{palette:t,spacing:e}})=>({cursor:"default",display:"inline-block",whiteSpace:"nowrap","&:not(:last-child)::after":{color:t.text.secondary,content:'"\xb7"',display:"inline-block",marginInline:e(.75),textDecoration:"none"},'&[data-chip="failed"]':{color:t.error.main},'&[data-chip="flawed"]':{textDecoration:"line-through",textDecorationColor:t.error.main}})),y=s(({tool:e})=>{let{chip:i,input:s,result:l}=e,d=r(m),u=r(c),k=r(p),x=r(h),y=r(g),b=r(f),v=n(i.label).with({kind:"text"},({text:t})=>t).with({kind:"updateDesign"},()=>d).with({kind:"readDesign"},()=>u).exhaustive(),C=o(()=>{console.info(`Assistant tool call "${v}"`,{input:s,result:l})},[s,v,l]);return t(a,{title:n(i).with({errorCode:"cancelled"},()=>x).with({errorCode:"no_result"},()=>y).with({errorCode:"tool_budget"},()=>b).with({state:"failed"},{state:"flawed"},()=>k).otherwise(()=>""),placement:"top-start",children:t(w,{onClick:C,"data-chip":i.state,children:v})})});export const AssistantToolChips=s(({tools:a,isActive:i})=>e(u,{"data-chips":i?"active":"done","aria-busy":i,children:[t(k,{children:t(x,{name:"Gear"})}),t("div",{children:a.map(e=>t(y,{tool:e},e.id))})]}));

package/dist/configurator/ui/assistant/AssistantComposer.d.ts

@@ -1,11 +1,6 @@
-import type { AssistantChatState } from '../../assistant/index.js';
-export interface AssistantComposerProps {
-    readonly chat: AssistantChatState | undefined;
-    readonly onFocusChange: (isFocused: boolean) => void;
-}
 /**
  * The message input of the panel. Enter sends and Shift+Enter adds a line. While a reply runs the
  * send control is a Stop control and the input stays editable, so the next message can be written.
  * A thread this session may not continue disables the input and says why.
  */
-export declare const AssistantComposer: ({ chat, onFocusChange }: AssistantComposerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AssistantComposer: () => import("react/jsx-runtime").JSX.Element;

package/dist/configurator/ui/assistant/AssistantComposer.js

@@ -1 +1 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Trans as r}from"@lingui/react";import{IconButton as o,InputBase as i,Tooltip as t,styled as n}from"@mui/material";import{useCallback as s,useRef as d,useState as l}from"react";import{useLocalizable as m}from"#package/react-sdk";import{PhxIcon as c,useResponsive as p}from"#package/ui-sdk";import{AssistantPanelName as u}from"./theme.js";let b={id:"sdk.assistant.composer.placeholder",message:"Ask or tell me what to change…"},g={id:"sdk.assistant.composer.send.label",message:"Send"},h={id:"sdk.assistant.composer.stop.label",message:"Stop"},k=n("form",{name:u,slot:"composer"})(({theme:{palette:e,spacing:a}})=>({borderBlockStart:`1px solid ${e.divider}`,display:"grid",gap:a(.75),paddingBlock:a(1.25),paddingInline:`var(--phx-sidebar-padding, ${a(2)})`})),f=n("div",{name:u,slot:"inputFrame"})(({theme:{palette:e,spacing:a}})=>({alignItems:"flex-end",border:`1px solid ${e.divider}`,borderRadius:12,display:"flex",gap:a(1),paddingBlock:a(.5),paddingInline:`${a(1.5)} ${a(.5)}`,"&:focus-within":{borderColor:e.primary.main},"&:has(textarea:disabled)":{background:e.action.disabledBackground}})),x=n(i,{name:u,slot:"input"})(({theme:{spacing:e,typography:a}})=>({...a.body2,flex:1,paddingBlock:e(.75)})),v=n(o,{name:u,slot:"sendButton"})(({theme:{palette:e}})=>({background:e.primary.main,borderRadius:8,color:e.primary.contrastText,"&:hover":{background:e.primary.dark},"&.Mui-disabled":{background:e.action.disabledBackground,color:e.action.disabled}})),y=n(o,{name:u,slot:"stopButton"})(({theme:{palette:e}})=>({background:e.text.primary,borderRadius:8,color:e.background.paper,"&:hover":{background:e.text.secondary}})),B=n("span")({background:"currentColor",blockSize:10,borderRadius:2,inlineSize:10,margin:5}),C=n("div",{name:u,slot:"hint"})(({theme:{palette:e,typography:a}})=>({...a.caption,color:e.text.secondary}));export const AssistantComposer=({chat:o,onFocusChange:i})=>{let[n,u]=l(""),R=d(null),{isDesktop:S}=p(),w=m(b),z=m(g),$=m(h),j=o?.isLoading??!1,I=o?.isContinuable??!0,A=n.trim(),D=null!=o&&I&&!j&&A.length>0,P=s(()=>{o&&D&&(u(""),o.send(A),S||R.current?.blur())},[D,o,A,S]),T=s(e=>{e.preventDefault(),P()},[P]),E=s(e=>{"Enter"!==e.key||e.shiftKey||e.nativeEvent.isComposing||(e.preventDefault(),P())},[P]),F=s(()=>{o?.stop()},[o]);return a(k,{onSubmit:T,children:[!I&&e(C,{role:"status",children:e(r,{id:"sdk.assistant.composer.notContinuable",message:"This conversation can be read here, but it can no longer be continued."})}),a(f,{children:[e(x,{multiline:!0,maxRows:6,placeholder:w,value:n,disabled:!I,inputRef:R,onChange:e=>u(e.target.value),onKeyDown:E,onFocus:()=>i(!0),onBlur:()=>i(!1),inputProps:{"aria-label":w}}),j?e(t,{title:$,placement:"top",children:e(y,{size:"small","aria-label":$,onClick:F,children:e(B,{})})}):e(t,{title:z,placement:"top",children:e("span",{children:e(v,{type:"submit",size:"small","aria-label":z,disabled:!D,children:e(c,{name:"PaperPlaneRightBold",fontSize:"small"})})})})]}),e(C,{children:e(r,{id:"sdk.assistant.composer.disclaimer",message:"AI can be wrong. Check the result."})})]})};
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Trans as i}from"@lingui/react";import{IconButton as o,InputBase as r,Tooltip as t,styled as n}from"@mui/material";import{useCallback as s,useRef as d,useState as l}from"react";import{useEagerObservableSelector as m,useLocalizable as c}from"#package/react-sdk";import{PhxIcon as p,useResponsive as u}from"#package/ui-sdk";import{useConfigurator as b}from"../../application-runtime/index.js";import{AssistantPanelName as g}from"./theme.js";let h={id:"sdk.assistant.composer.placeholder",message:"Ask or tell me what to change…"},k={id:"sdk.assistant.composer.send.label",message:"Send"},f={id:"sdk.assistant.composer.stop.label",message:"Stop"},x=n("form",{name:g,slot:"composer"})(({theme:{palette:e,spacing:a}})=>({borderBlockStart:`1px solid ${e.divider}`,display:"grid",gap:a(.75),paddingBlock:a(1.25),paddingInline:`var(--phx-sidebar-padding, ${a(2)})`})),y=n("div",{name:g,slot:"inputFrame"})(({theme:{palette:e,spacing:a}})=>({alignItems:"flex-end",border:`1px solid ${e.divider}`,borderRadius:12,display:"flex",gap:a(1),paddingBlock:a(.5),paddingInline:`${a(1.5)} ${a(.5)}`,"&:focus-within":{borderColor:e.primary.main},"&:has(textarea:disabled)":{background:e.action.disabledBackground}})),v=n(r,{name:g,slot:"input"})(({theme:{spacing:e,typography:a}})=>({...a.body2,flex:1,paddingBlock:e(.75)})),B=n(o,{name:g,slot:"sendButton"})(({theme:{palette:e}})=>({background:e.primary.main,borderRadius:8,color:e.primary.contrastText,"&:hover":{background:e.primary.dark},"&.Mui-disabled":{background:e.action.disabledBackground,color:e.action.disabled}})),C=n(o,{name:g,slot:"stopButton"})(({theme:{palette:e}})=>({background:e.text.primary,borderRadius:8,color:e.background.paper,"&:hover":{background:e.text.secondary}})),R=n("span")({background:"currentColor",blockSize:10,borderRadius:2,inlineSize:10,margin:5}),S=n("div",{name:g,slot:"hint"})(({theme:{palette:e,typography:a}})=>({...a.caption,color:e.text.secondary}));export const AssistantComposer=()=>{let{assistantSystem:o}=b(),[r,n]=l(""),g=d(null),{isDesktop:I}=u(),$=c(h),j=c(k),w=c(f),{isReplying:z,isContinuable:F}=m(o.chat$,e=>({isReplying:e.isLoading,isContinuable:e.isContinuable}),[]),A=r.trim(),D=F&&!z&&A.length>0,P=s(()=>{D&&(n(""),o.send(A),I||g.current?.blur())},[o,D,A,I]),T=s(e=>{e.preventDefault(),P()},[P]),E=s(e=>{"Enter"!==e.key||e.shiftKey||e.nativeEvent.isComposing||(e.preventDefault(),P())},[P]),K=s(()=>{o.stop()},[o]);return a(x,{onSubmit:T,children:[!F&&e(S,{role:"status",children:e(i,{id:"sdk.assistant.composer.notContinuable",message:"This conversation can be read here, but it can no longer be continued."})}),a(y,{children:[e(v,{multiline:!0,maxRows:6,placeholder:$,value:r,disabled:!F,inputRef:g,onChange:e=>n(e.target.value),onKeyDown:E,onFocus:()=>o.setInputFocused(!0),onBlur:()=>o.setInputFocused(!1),inputProps:{"aria-label":$}}),z?e(t,{title:w,placement:"top",children:e(C,{size:"small","aria-label":w,onClick:K,children:e(R,{})})}):e(t,{title:j,placement:"top",children:e("span",{children:e(B,{type:"submit",size:"small","aria-label":j,disabled:!D,children:e(p,{name:"PaperPlaneRightBold",fontSize:"small"})})})})]}),e(S,{children:e(i,{id:"sdk.assistant.composer.disclaimer",message:"AI can be wrong. Check the result."})})]})};

package/dist/configurator/ui/assistant/AssistantPanel.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{IconButton as a,Tooltip as s,Typography as n,styled as r}from"@mui/material";import{useCallback as o}from"react";import{useLocalizable as i}from"#package/react-sdk";import{PhxIcon as l}from"#package/ui-sdk";import{AssistantComposer as d}from"./AssistantComposer.js";import{useAssistantPanel as m,useAssistantPanelConversation as p}from"./AssistantPanelProvider.js";import{AssistantThread as c}from"./AssistantThread.js";import{AssistantPanelName as h}from"./theme.js";let u={id:"sdk.assistant.panel.title",message:"Assistant"},g={id:"sdk.assistant.panel.close.label",message:"Close assistant"};export const ASSISTANT_PANEL_SLOT="slot[assistant]";let b=r("section",{name:h,slot:"root"})(({theme:{palette:e}})=>({background:`var(--phx-sidebar-background, ${e.background.paper})`,border:"var(--phx-sidebar-border, 0)",borderRadius:"inherit",display:"grid",gridTemplateColumns:"minmax(0, 1fr)",gridTemplateRows:"min-content minmax(0, 1fr) min-content",inset:0,overflow:"hidden",position:"absolute",zIndex:1})),f=r("header",{name:h,slot:"header"})(({theme:{palette:e,spacing:t}})=>({alignItems:"center",borderBlockEnd:`1px solid ${e.divider}`,display:"flex",gap:t(1),justifyContent:"space-between",paddingBlock:t(1),paddingInline:`var(--phx-sidebar-padding, ${t(2)}) ${t(1)}`})),x=r(n,{name:h,slot:"title"})({fontWeight:600}),k=r(a,{name:h,slot:"closeButton"})({}),j=e=>{e.target instanceof Element&&e.target.closest("button")&&e.preventDefault()};export const AssistantPanel=()=>{let a=m(),n=p(),r=i(u),h=i(g),v=a?.setOpen,A=o(()=>{v?.(!1)},[v]);return a?.open&&n?t(b,{"data-sidebar":"slot[assistant]","aria-label":r,onMouseDown:j,children:[t(f,{children:[e(x,{variant:"subtitle1",component:"h2",children:r}),e(s,{title:h,placement:"top",children:e(k,{size:"small","aria-label":h,onClick:A,children:e(l,{name:"X"})})})]}),e(c,{chat:n.chat,onRetry:n.reloadThread}),e(d,{chat:n.chat,onFocusChange:a.setInputFocused})]}):null};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{IconButton as s,Tooltip as a,Typography as i,styled as n}from"@mui/material";import{useCallback as r}from"react";import{useLocalizable as o}from"#package/react-sdk";import{PhxIcon as l}from"#package/ui-sdk";import{useConfigurator as m}from"../../application-runtime/index.js";import{AssistantComposer as d}from"./AssistantComposer.js";import{AssistantThread as p}from"./AssistantThread.js";import{AssistantPanelName as c}from"./theme.js";import{useIsAssistantPanelOpen as u}from"./use-is-assistant-panel-open.js";let b={id:"sdk.assistant.panel.title",message:"Assistant"},f={id:"sdk.assistant.panel.close.label",message:"Close assistant"};export const ASSISTANT_PANEL_SLOT="slot[assistant]";let g=n("section",{name:c,slot:"root"})(({theme:{palette:e}})=>({background:`var(--phx-sidebar-background, ${e.background.paper})`,border:"var(--phx-sidebar-border, 0)",borderRadius:"inherit",display:"grid",gridTemplateColumns:"minmax(0, 1fr)",gridTemplateRows:"min-content minmax(0, 1fr) min-content",inset:0,overflow:"hidden",position:"absolute",zIndex:1})),h=n("header",{name:c,slot:"header"})(({theme:{palette:e,spacing:t}})=>({alignItems:"center",borderBlockEnd:`1px solid ${e.divider}`,display:"flex",gap:t(1),justifyContent:"space-between",paddingBlock:t(1),paddingInline:`var(--phx-sidebar-padding, ${t(2)}) ${t(1)}`})),x=n(i,{name:c,slot:"title"})({fontWeight:600}),k=n(s,{name:c,slot:"closeButton"})({}),j=e=>{e.target instanceof Element&&e.target.closest("button")&&e.preventDefault()};export const AssistantPanel=()=>{let{assistantSystem:s}=m(),i=u(),n=o(b),c=o(f),v=r(()=>{s.setOpen(!1)},[s]);return i?t(g,{"data-sidebar":"slot[assistant]","aria-label":n,onMouseDown:j,children:[t(h,{children:[e(x,{variant:"subtitle1",component:"h2",children:n}),e(a,{title:c,placement:"top",children:e(k,{size:"small","aria-label":c,onClick:v,children:e(l,{name:"X"})})})]}),e(p,{}),e(d,{})]}):null};

package/dist/configurator/ui/assistant/AssistantThread.d.ts

@@ -1,11 +1,6 @@
-import type { AssistantChatState } from '../../assistant/index.js';
-export interface AssistantThreadProps {
-    readonly chat: AssistantChatState | undefined;
-    readonly onRetry: () => void;
-}
 /**
  * The conversation: user bubbles, assistant Markdown, tool chips, and what the panel
  * has to say itself, which is a greeting for an empty thread, a "Thinking…" line and a failure with
  * its way out. It follows a streaming reply until the user scrolls up.
  */
-export declare const AssistantThread: ({ chat, onRetry }: AssistantThreadProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AssistantThread: () => import("react/jsx-runtime").JSX.Element;

package/dist/configurator/ui/assistant/AssistantThread.js

@@ -1 +1 @@
-import{jsx as e,jsxs as i}from"react/jsx-runtime";import{Trans as a}from"@lingui/react";import{Button as s,styled as t}from"@mui/material";import{useMemo as n}from"react";import{match as r}from"ts-pattern";import{PhxIcon as o}from"#package/ui-sdk";import{AssistantToolChips as l}from"./AssistantChips.js";import{AssistantMarkdown as d}from"./AssistantMarkdown.js";import{describeAssistantFailure as m}from"./assistant-failure.js";import{AssistantPanelName as p}from"./theme.js";import{buildThreadView as h}from"./thread-items.js";import{useFollowStream as c}from"./use-follow-stream.js";let g=t("div",{name:p,slot:"thread"})({display:"grid",position:"relative"}),u=t("div",{name:p,slot:"messages"})(({theme:{spacing:e,typography:i}})=>({...i.body2,display:"flex",flexDirection:"column",gap:e(1.5),overflowY:"auto",overscrollBehavior:"contain",paddingBlock:e(2),paddingInline:`var(--phx-sidebar-padding, ${e(2)})`,"& > :first-child":{marginBlockStart:"auto"}})),f=t("div",{name:p,slot:"userMessage"})(({theme:{palette:e,spacing:i}})=>({alignSelf:"flex-end",background:`hsl(from ${e.primary.main} h s l / 12%)`,borderRadius:"14px 14px 4px 14px",maxInlineSize:"85%",overflowWrap:"anywhere",paddingBlock:i(1),paddingInline:i(1.5),whiteSpace:"pre-wrap"})),k=t("div",{name:p,slot:"greeting"})({}),v=t("div",{name:p,slot:"status"})(({theme:{palette:e,typography:i}})=>({...i.caption,color:e.text.secondary})),w=t("div",{name:p,slot:"notice"})(({theme:{palette:e,shape:i,spacing:a}})=>({alignItems:"center",background:e.action.hover,borderRadius:i.borderRadius,display:"flex",flexWrap:"wrap",gap:a(1),justifyContent:"space-between",paddingBlock:a(1),paddingInline:a(1.5)})),b=t(s,{name:p,slot:"newReplyButton"})(({theme:{palette:e,spacing:i}})=>({background:e.text.primary,borderRadius:"calc(infinity * 1px)",color:e.background.paper,insetBlockEnd:i(1),insetInlineStart:"50%",position:"absolute",translate:"-50% 0","&:hover":{background:e.text.secondary}})),x=({item:i,isActive:a})=>r(i).with({kind:"user"},({text:i})=>e(f,{children:i})).with({kind:"text"},({markdown:i,isStreaming:a})=>e(d,{markdown:i,isStreaming:a})).with({kind:"tools"},({tools:i})=>e(l,{tools:i,isActive:a})).exhaustive();export const AssistantThread=({chat:t,onRetry:l})=>{let d=t?.messages,p=t?.isLoading??!1,{items:f,isThinking:y}=n(()=>h(d??[],p),[d,p]),j=n(()=>f.filter(({kind:e})=>"user"===e).length,[f]),I=t?.error?m(t.failedStatus):void 0,{scrollerRef:S,hasUnseenContent:T,handleScroll:A,scrollToEnd:B}=c(n(()=>({messages:d,isThinking:y,failure:I?.kind}),[d,y,I?.kind]),j);return i(g,{children:[i(u,{ref:S,onScroll:A,role:"log","aria-live":"polite",children:[t?.isLoaded===!0&&0===f.length&&!p&&!I&&e(k,{children:e(a,{id:"sdk.assistant.thread.greeting",message:"Hi. I can answer questions about this design and change it with you. Tell me what you need."})}),f.map(i=>e(x,{item:i,isActive:p&&i===f.at(-1)},i.id)),y&&e(v,{children:e(a,{id:"sdk.assistant.thread.thinking",message:"Thinking…"})}),I&&i(w,{role:"alert",children:[e("span",{children:r(I.kind).with("notAvailable",()=>e(a,{id:"sdk.assistant.failure.notAvailable",message:"The assistant is not available here."})).with("busy",()=>e(a,{id:"sdk.assistant.failure.busy",message:"The assistant is still working on an earlier message."})).with("unavailable",()=>e(a,{id:"sdk.assistant.failure.unavailable",message:"The assistant is unavailable right now."})).exhaustive()}),I.canRetry&&e(s,{size:"small",variant:"outlined",color:"inherit",onClick:l,children:e(a,{id:"sdk.assistant.failure.retry.label",message:"Try again"})})]})]}),T&&e(b,{size:"small",onClick:B,endIcon:e(o,{name:"CaretDown"}),children:e(a,{id:"sdk.assistant.thread.newReply.label",message:"New reply"})})]})};
+import{jsx as e,jsxs as i}from"react/jsx-runtime";import{Trans as a}from"@lingui/react";import{Button as t,styled as s}from"@mui/material";import{useMemo as r}from"react";import{match as n}from"ts-pattern";import{useEagerObservableValue as o}from"#package/react-sdk";import{PhxIcon as l}from"#package/ui-sdk";import{useConfigurator as d}from"../../application-runtime/index.js";import{AssistantToolChips as m}from"./AssistantChips.js";import{AssistantMarkdown as p}from"./AssistantMarkdown.js";import{describeAssistantFailure as c}from"./assistant-failure.js";import{AssistantPanelName as h}from"./theme.js";import{buildThreadView as g}from"./thread-items.js";import{useFollowStream as u}from"./use-follow-stream.js";let f=s("div",{name:h,slot:"thread"})({display:"grid",position:"relative"}),k=s("div",{name:h,slot:"messages"})(({theme:{spacing:e,typography:i}})=>({...i.body2,display:"flex",flexDirection:"column",gap:e(1.5),overflowY:"auto",overscrollBehavior:"contain",paddingBlock:e(2),paddingInline:`var(--phx-sidebar-padding, ${e(2)})`,"& > :first-child":{marginBlockStart:"auto"}})),v=s("div",{name:h,slot:"userMessage"})(({theme:{palette:e,spacing:i}})=>({alignSelf:"flex-end",background:`hsl(from ${e.primary.main} h s l / 12%)`,borderRadius:"14px 14px 4px 14px",maxInlineSize:"85%",overflowWrap:"anywhere",paddingBlock:i(1),paddingInline:i(1.5),whiteSpace:"pre-wrap"})),w=s("div",{name:h,slot:"greeting"})({}),b=s("div",{name:h,slot:"status"})(({theme:{palette:e,typography:i}})=>({...i.caption,color:e.text.secondary})),x=s("div",{name:h,slot:"notice"})(({theme:{palette:e,shape:i,spacing:a}})=>({alignItems:"center",background:e.action.hover,borderRadius:i.borderRadius,display:"flex",flexWrap:"wrap",gap:a(1),justifyContent:"space-between",paddingBlock:a(1),paddingInline:a(1.5)})),y=s(t,{name:h,slot:"newReplyButton"})(({theme:{palette:e,spacing:i}})=>({background:e.text.primary,borderRadius:"calc(infinity * 1px)",color:e.background.paper,insetBlockEnd:i(1),insetInlineStart:"50%",position:"absolute",translate:"-50% 0","&:hover":{background:e.text.secondary}})),j=({item:i,isActive:a})=>n(i).with({kind:"user"},({text:i})=>e(v,{children:i})).with({kind:"text"},({markdown:i,isStreaming:a})=>e(p,{markdown:i,isStreaming:a})).with({kind:"tools"},({tools:i})=>e(m,{tools:i,isActive:a})).exhaustive();export const AssistantThread=()=>{let{assistantSystem:s}=d(),m=o(s.chat$),{messages:p,isLoading:h}=m,{items:v,isThinking:T}=r(()=>g(p,h),[p,h]),I=r(()=>v.filter(({kind:e})=>"user"===e).length,[v]),S=m.error?c(m.failedStatus):void 0,{scrollerRef:A,hasUnseenContent:B,handleScroll:R,scrollToEnd:C}=u(r(()=>({messages:p,isThinking:T,failure:S?.kind}),[p,T,S?.kind]),I);return i(f,{children:[i(k,{ref:A,onScroll:R,role:"log","aria-live":"polite",children:[m.isLoaded&&0===v.length&&!h&&!S&&e(w,{children:e(a,{id:"sdk.assistant.thread.greeting",message:"Hi. I can answer questions about this design and change it with you. Tell me what you need."})}),v.map(i=>e(j,{item:i,isActive:h&&i===v.at(-1)},i.id)),T&&e(b,{children:e(a,{id:"sdk.assistant.thread.thinking",message:"Thinking…"})}),S&&i(x,{role:"alert",children:[e("span",{children:n(S.kind).with("notAvailable",()=>e(a,{id:"sdk.assistant.failure.notAvailable",message:"The assistant is not available here."})).with("busy",()=>e(a,{id:"sdk.assistant.failure.busy",message:"The assistant is still working on an earlier message."})).with("unavailable",()=>e(a,{id:"sdk.assistant.failure.unavailable",message:"The assistant is unavailable right now."})).exhaustive()}),S.canRetry&&e(t,{size:"small",variant:"outlined",color:"inherit",onClick:s.reloadThread,children:e(a,{id:"sdk.assistant.failure.retry.label",message:"Try again"})})]})]}),B&&e(y,{size:"small",onClick:C,endIcon:e(l,{name:"CaretDown"}),children:e(a,{id:"sdk.assistant.thread.newReply.label",message:"New reply"})})]})};

package/dist/configurator/ui/assistant/index.d.ts

@@ -1,2 +1,2 @@
 export { AssistantPanel, ASSISTANT_PANEL_SLOT } from './AssistantPanel.js';
-export { AssistantPanelProvider, useAssistantPanel, type AssistantPanelState } from './AssistantPanelProvider.js';
+export { useIsAssistantPanelOpen } from './use-is-assistant-panel-open.js';

package/dist/configurator/ui/assistant/index.js

@@ -1 +1 @@
-export{AssistantPanel,ASSISTANT_PANEL_SLOT}from"./AssistantPanel.js";export{AssistantPanelProvider,useAssistantPanel}from"./AssistantPanelProvider.js";
+export{AssistantPanel,ASSISTANT_PANEL_SLOT}from"./AssistantPanel.js";export{useIsAssistantPanelOpen}from"./use-is-assistant-panel-open.js";

package/dist/configurator/ui/assistant/thread-items.d.ts

@@ -1,4 +1,4 @@
-import type { UIMessage } from '@tanstack/ai-react';
+import type { UIMessage } from '@tanstack/ai-client';
 import { type AssistantToolChip } from './tool-chip.js';
 /** A tool call of the thread, with what its chip shows and what a click on the chip logs. */
 export interface AssistantToolItem {

package/dist/configurator/ui/assistant/tool-chip.d.ts

@@ -1,3 +1,4 @@
+import { type AssistantToolErrorCode } from '@salsita-ai/contracts/assistant';
 /**
  * How a tool call of the assistant looks in the thread: still running, finished, a change that was
  * not kept (`failed`), or a read that answered with errors (`flawed`), which matters less because
@@ -16,6 +17,11 @@ export type AssistantToolChipLabel = {
 export interface AssistantToolChip {
     readonly label: AssistantToolChipLabel;
     readonly state: AssistantToolChipState;
+    /**
+     * Why the server recorded an error in place of the call's result, when it said so with a code this
+     * panel knows. Nothing for a call that went wrong for any other reason.
+     */
+    readonly errorCode: AssistantToolErrorCode | undefined;
 }
 /** A tool call of a message as the chip reads it. */
 export interface AssistantToolCall {
@@ -32,6 +38,7 @@ export interface AssistantToolCall {
 /**
  * Describes one tool call for its chip: the label in the order operation names, fixed text for the
  * `apply` and `query` tools, tool name; and whether the call runs, finished, or went wrong. Why it
- * went wrong is not part of it: the tool result words that for the model, not for the user.
+ * went wrong is part of it only as the code of an error the server recorded: the text of a tool
+ * result is worded for the model, not for the user.
  */
 export declare const describeToolCall: (call: AssistantToolCall) => AssistantToolChip;

package/dist/configurator/ui/assistant/tool-chip.js

@@ -1 +1 @@
-import{Kind as e,parse as t}from"graphql";import{z as n}from"zod";import{applyTool as r,queryTool as a}from"@salsita-ai/contracts/assistant";let o=n.object({operations:n.array(n.object({query:n.string(),operationName:n.string().nullish()}))}),i=n.object({results:n.array(n.object({errors:n.array(n.unknown()).optional()})),committed:n.boolean()});export const describeToolCall=n=>{let s=(({name:n,input:i})=>{let s,l=(s=o.safeParse(i)).success?s.data.operations.flatMap(({query:n,operationName:r})=>r??(n=>{try{let r=t(n).definitions.find(t=>t.kind===e.OPERATION_DEFINITION);return r?.kind===e.OPERATION_DEFINITION?r.name?.value:void 0}catch{return}})(n)??[]):[];return l.length>0?{kind:"text",text:l.join(", ")}:n===r.name?{kind:"updateDesign"}:n===a.name?{kind:"readDesign"}:{kind:"text",text:n}})(n);return null==n.result&&null==n.error?{label:s,state:n.isReplyRunning?"running":"done"}:{label:s,state:(({name:e,result:t,error:n})=>{if(null!=n)return e===a.name?"flawed":"failed";let o=i.safeParse(t);if(!o.success)return"done";let{results:s,committed:l}=o.data;return e===r.name?l?"done":"failed":s.some(({errors:e})=>(e?.length??0)>0)||0===s.length?"flawed":"done"})(n)}};
+import{Kind as e,parse as t}from"graphql";import{z as n}from"zod";import{ASSISTANT_TOOL_ERROR_CODES as r,AssistantToolError as a,applyTool as i,queryTool as o}from"@salsita-ai/contracts/assistant";let l=n.object({operations:n.array(n.object({query:n.string(),operationName:n.string().nullish()}))}),s=n.object({results:n.array(n.object({errors:n.array(n.unknown()).optional()})),committed:n.boolean()});export const describeToolCall=n=>{let d=(({name:n,input:r})=>{let a,s=(a=l.safeParse(r)).success?a.data.operations.flatMap(({query:n,operationName:r})=>r??(n=>{try{let r=t(n).definitions.find(t=>t.kind===e.OPERATION_DEFINITION);return r?.kind===e.OPERATION_DEFINITION?r.name?.value:void 0}catch{return}})(n)??[]):[];return s.length>0?{kind:"text",text:s.join(", ")}:n===i.name?{kind:"updateDesign"}:n===o.name?{kind:"readDesign"}:{kind:"text",text:n}})(n);if(null==n.result&&null==n.error)return{label:d,state:n.isReplyRunning?"running":"done",errorCode:void 0};let u=(e=>{let t=a.safeParse(e);if(t.success)return r.find(e=>e===t.data.code)})(n.result);return{label:d,state:(({name:e,result:t,error:n},r)=>{if(null!=n||null!=r)return e===o.name?"flawed":"failed";if(e!==i.name&&e!==o.name)return"done";let a=s.safeParse(t);if(!a.success)return e===o.name?"flawed":"failed";let{results:l,committed:d}=a.data;return e===i.name?d?"done":"failed":l.some(({errors:e})=>(e?.length??0)>0)||0===l.length?"flawed":"done"})(n,u),errorCode:u}};

package/dist/configurator/ui/assistant/use-is-assistant-panel-open.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Whether the assistant panel is shown: it was opened and the application spec still has the
+ * `assistant` section, which editor hot reload can take away under an open panel.
+ */
+export declare const useIsAssistantPanelOpen: () => boolean;

package/dist/configurator/ui/assistant/use-is-assistant-panel-open.js

@@ -0,0 +1 @@
+import{useEagerObservableSelector as e,useSpecAssistant as n}from"#package/react-sdk";import{useConfigurator as t}from"../../application-runtime/index.js";export const useIsAssistantPanelOpen=()=>{let{assistantSystem:p}=t(),r=n();return e(p.panel$,e=>e.open,[])&&null!=r};

package/dist/configurator/ui/configurator-layout/universal/DesktopLayout.js

@@ -1,4 +1,4 @@
-import{jsx as a,jsxs as t,Fragment as o}from"react/jsx-runtime";import{keyframes as e,paperClasses as r,snackbarClasses as d,styled as i,useTheme as n,useThemeProps as s}from"@mui/material";import{AnimatePresence as l,motion as p}from"motion/react";import{useCallback as b,useRef as u}from"react";import{useAccessService as c,useIsFullscreenActive as m}from"#package/react-sdk";import{attrf as h,commonStyles as y,numToPx as g,useInvalidateScrollTimeline as f,useIsEmpty as x,useResponsive as k}from"#package/ui-sdk";import{usePreview as v}from"../../../configurator-context/index.js";import{ASSISTANT_PANEL_SLOT as S,AssistantPanel as E,useAssistantPanel as w}from"../../assistant/index.js";import{LayoutSlots as R}from"../slots/index.js";import{DesktopPreview as $}from"./DesktopPreview.js";import{useSceneSafeArea as B}from"./use-scene-safe-area.js";let C="PhxDesktopSidebar",D="minimalist",T="split",I="visible",A="hidden",P="assistant",F={Root:i("div",{name:C,slot:"root",shouldForwardProp:a=>"ownerState"!==a})(({ownerState:a})=>[`
+import{jsx as a,jsxs as t,Fragment as o}from"react/jsx-runtime";import{keyframes as e,paperClasses as r,snackbarClasses as d,styled as i,useTheme as n,useThemeProps as s}from"@mui/material";import{AnimatePresence as l,motion as p}from"motion/react";import{useCallback as b,useRef as u}from"react";import{useAccessService as c,useIsFullscreenActive as m}from"#package/react-sdk";import{attrf as h,commonStyles as y,numToPx as g,useInvalidateScrollTimeline as f,useIsEmpty as x,useResponsive as k}from"#package/ui-sdk";import{usePreview as v}from"../../../configurator-context/index.js";import{ASSISTANT_PANEL_SLOT as S,AssistantPanel as E,useIsAssistantPanelOpen as w}from"../../assistant/index.js";import{LayoutSlots as R}from"../slots/index.js";import{DesktopPreview as $}from"./DesktopPreview.js";import{useSceneSafeArea as B}from"./use-scene-safe-area.js";let C="PhxDesktopSidebar",D="minimalist",T="split",I="visible",A="hidden",P="assistant",F={Root:i("div",{name:C,slot:"root",shouldForwardProp:a=>"ownerState"!==a})(({ownerState:a})=>[`
       --phx-sidebar-background: ${a.background};
       --phx-sidebar-border: ${a.border};
       --phx-sidebar-filter: ${a.filter};
@@ -46,4 +46,4 @@ import{jsx as a,jsxs as t,Fragment as o}from"react/jsx-runtime";import{keyframes
       180deg,
       hsl(from black h s l / 12%),
       hsl(from black h s l / 0%) 8px
-    )`}=s({props:{},name:C}),{hasMiniSidebar:N,hasSplitSidebar:V}=R.useSidebarContent(),X=w()?.open??!1,{accessInfo:G}=c(),J=m(),{isPreview:K,isHidden:O}=v(),Q=!O&&!K,U=!J,{setCanvasPadding:Y,setAnimating:Z}=k(),{containerRef:_,safeAreaRef:aa,update:at}=B(Y,N&&!X,Q),ao=b(()=>{Z(!0)},[Z]),ae=b(()=>{Z(!1),at()},[Z,at]),ar=Q&&U,ad=x(e,{disabled:!ar}),ai=x(r,{disabled:!ar});f(r,{disabled:!ar});let an={background:g,border:S,borderRadius:L,filter:W,isHeaderEmpty:ad,isContentEmpty:ai,padding:q,scrollableIndicatorBackground:M,width:y};return a(o,{children:t(l,{mode:"wait",children:[!O&&K&&a($,{},"preview-layout"),Q&&t(z,{layoutId:"ui-layout",layout:!0,ownerState:{sidebarWidth:y},"data-layout":h({state:{initial:!J,fullscreen:J}}),onLayoutAnimationStart:ao,onLayoutAnimationComplete:ae,children:[a(H,{ref:_}),a("header",{"data-layout":"slot[header]",children:a(R.DesktopHeader,{})}),t("main",{"data-layout":"slot[body]",children:[a("div",{"data-layout":"slot[body.top] interactive",children:a(R.DesktopCallToAction,{})}),a("div",{ref:aa,"data-layout":"slot[body.safeSceneArea]"}),t("div",{"data-layout":"slot[body.bottom] interactive",children:[a("div",{"data-layout":"slot[body.toolbar]",children:a(R.DesktopToolbar,{})}),a("div",{"data-layout":"slot[body.toolControls]",children:!J&&a(R.DesktopToolControls,{})}),a("div",{"data-layout":"slot[body.viewControls]",children:a(R.DesktopViewControls,{})}),a("div",{"data-layout":"slot[body.logo]",children:a(R.DesktopPoweredBy,{})}),a("div",{"data-layout":"slot[body.sideEffects]",children:a(R.DesktopSnackbarsRoot,{})})]})]}),a("aside",{"data-layout":"slot[sidebar]",children:t(F.Root,{ownerState:an,"data-sidebar":h({variant:{[`${D}`]:N,[`${T}`]:V},state:{[`${I}`]:U,[`${A}`]:!U,[`${P}`]:X}}),inert:U?void 0:"",children:[a(F.Tabs,{ownerState:an,"data-sidebar":"slot[tabs]",children:a(R.DesktopSidebarTabs,{})}),a(F.Header,{ref:e,ownerState:an,"data-sidebar":"slot[header]",children:a(R.DesktopSidebarBackButton,{})}),a(F.Body,{ownerState:an,"data-sidebar":"slot[body]",children:a(F.Content,{ref:r,ownerState:an,"data-sidebar":"slot[content]",children:a(R.DesktopSidebarContent,{})})}),a(F.Footer,{ownerState:an,"data-sidebar":"slot[footer]",children:a(R.DesktopSidebarFooter,{})}),a(E,{})]})}),t("footer",{"data-layout":"slot[footer] interactive",children:[G.viewMode&&!J&&a(R.DesktopReadonlyBanner,{}),a(R.DesktopFooter,{})]})]},"interface-layout")]})})};
+    )`}=s({props:{},name:C}),{hasMiniSidebar:N,hasSplitSidebar:V}=R.useSidebarContent(),X=w(),{accessInfo:G}=c(),J=m(),{isPreview:K,isHidden:O}=v(),Q=!O&&!K,U=!J,{setCanvasPadding:Y,setAnimating:Z}=k(),{containerRef:_,safeAreaRef:aa,update:at}=B(Y,N&&!X,Q),ao=b(()=>{Z(!0)},[Z]),ae=b(()=>{Z(!1),at()},[Z,at]),ar=Q&&U,ad=x(e,{disabled:!ar}),ai=x(r,{disabled:!ar});f(r,{disabled:!ar});let an={background:g,border:S,borderRadius:L,filter:W,isHeaderEmpty:ad,isContentEmpty:ai,padding:q,scrollableIndicatorBackground:M,width:y};return a(o,{children:t(l,{mode:"wait",children:[!O&&K&&a($,{},"preview-layout"),Q&&t(z,{layoutId:"ui-layout",layout:!0,ownerState:{sidebarWidth:y},"data-layout":h({state:{initial:!J,fullscreen:J}}),onLayoutAnimationStart:ao,onLayoutAnimationComplete:ae,children:[a(H,{ref:_}),a("header",{"data-layout":"slot[header]",children:a(R.DesktopHeader,{})}),t("main",{"data-layout":"slot[body]",children:[a("div",{"data-layout":"slot[body.top] interactive",children:a(R.DesktopCallToAction,{})}),a("div",{ref:aa,"data-layout":"slot[body.safeSceneArea]"}),t("div",{"data-layout":"slot[body.bottom] interactive",children:[a("div",{"data-layout":"slot[body.toolbar]",children:a(R.DesktopToolbar,{})}),a("div",{"data-layout":"slot[body.toolControls]",children:!J&&a(R.DesktopToolControls,{})}),a("div",{"data-layout":"slot[body.viewControls]",children:a(R.DesktopViewControls,{})}),a("div",{"data-layout":"slot[body.logo]",children:a(R.DesktopPoweredBy,{})}),a("div",{"data-layout":"slot[body.sideEffects]",children:a(R.DesktopSnackbarsRoot,{})})]})]}),a("aside",{"data-layout":"slot[sidebar]",children:t(F.Root,{ownerState:an,"data-sidebar":h({variant:{[`${D}`]:N,[`${T}`]:V},state:{[`${I}`]:U,[`${A}`]:!U,[`${P}`]:X}}),inert:U?void 0:"",children:[a(F.Tabs,{ownerState:an,"data-sidebar":"slot[tabs]",children:a(R.DesktopSidebarTabs,{})}),a(F.Header,{ref:e,ownerState:an,"data-sidebar":"slot[header]",children:a(R.DesktopSidebarBackButton,{})}),a(F.Body,{ownerState:an,"data-sidebar":"slot[body]",children:a(F.Content,{ref:r,ownerState:an,"data-sidebar":"slot[content]",children:a(R.DesktopSidebarContent,{})})}),a(F.Footer,{ownerState:an,"data-sidebar":"slot[footer]",children:a(R.DesktopSidebarFooter,{})}),a(E,{})]})}),t("footer",{"data-layout":"slot[footer] interactive",children:[G.viewMode&&!J&&a(R.DesktopReadonlyBanner,{}),a(R.DesktopFooter,{})]})]},"interface-layout")]})})};

package/dist/configurator/ui/configurator-layout/universal/Layout.js

@@ -1 +1 @@
-import{jsx as r,jsxs as s,Fragment as o}from"react/jsx-runtime";import{useResponsive as t}from"#package/ui-sdk";import{AssistantPanelProvider as e}from"../../assistant/index.js";import{LayoutSlots as a}from"../slots/index.js";import{DesktopLayout as i}from"./DesktopLayout.js";import{MobileLayout as m}from"./MobileLayout.js";export const Layout=()=>{let{isDesktop:n}=t();return s(o,{children:[r(a.Services,{}),r(a.SharedCanvas,{}),r(e,{children:n?r(i,{}):r(m,{})})]})};
+import{jsx as r,jsxs as o,Fragment as s}from"react/jsx-runtime";import{useResponsive as t}from"#package/ui-sdk";import{LayoutSlots as e}from"../slots/index.js";import{DesktopLayout as a}from"./DesktopLayout.js";import{MobileLayout as m}from"./MobileLayout.js";export const Layout=()=>{let{isDesktop:i}=t();return o(s,{children:[r(e.Services,{}),r(e.SharedCanvas,{}),i?r(a,{}):r(m,{})]})};

package/dist/configurator/ui/configurator-layout/universal/MobileLayout.js

@@ -1,11 +1,11 @@
-import{jsx as t,jsxs as a,Fragment as e}from"react/jsx-runtime";import{snackbarClasses as o,styled as i,useTheme as r,useThemeProps as n}from"@mui/material";import d from"lodash/noop.js";import{AnimatePresence as s}from"motion/react";import{useRef as l}from"react";import{useAccessService as m,useIsFullscreenActive as c}from"#package/react-sdk";import{attrf as p,commonStyles as u,numToPx as b,useIsEmpty as h,useResponsive as g,useViewportSize as f}from"#package/ui-sdk";import{usePreview as y}from"../../../configurator-context/index.js";import{ASSISTANT_PANEL_SLOT as x,AssistantPanel as v,useAssistantPanel as w}from"../../assistant/index.js";import{LayoutSlots as S}from"../slots/index.js";import{MobileHeader as $}from"../slots/slots.js";import{MobilePreview as k}from"./MobilePreview.js";import{useSceneSafeArea as C}from"./use-scene-safe-area.js";let F="visible",M="hidden",T=i("div",{name:"PhxMobileHeader",slot:"root"})(({theme:{spacing:t}})=>({...u.transition.fadeInFrom,alignItems:"center",display:"flex",gap:t(1),justifyContent:"space-between",position:"relative","@container style(--inspect: on)":{background:"hsl(from tomato h s l / 50%)"},'[data-header*="slot"]':{display:"flex",gap:t(2),"& > *":{pointerEvents:"auto"}},'[data-header="slot[center]"]':{display:"grid",inset:0,placeItems:"center",position:"absolute"},[`&[data-header*="${F}"]`]:{opacity:1,transitionDuration:"200ms, 300ms",transitionTimingFunction:"linear, ease-out",translate:"0 0"},[`&[data-header*="${M}"]`]:{opacity:0,transitionDuration:"100ms, 100ms",transitionTimingFunction:"linear, ease-in",translate:"0 -60%"}})),I="visible",R="hidden",B=i("div",{name:"PhxMobileControls",slot:"root"})(({theme:{spacing:t}})=>({alignItems:"end",display:"flex",position:"relative","@container style(--inspect: on)":{background:"hsl(from tomato h s l / 50%)"},'[data-controls*="slot"]':{"& > *":{pointerEvents:"auto"}},'[data-controls="slot[toolControls]"]':{...u.transition.fadeInFrom,"&:not(:empty)":{marginInlineEnd:t(2)},"& > *":{...u.transition.fadeIn,transitionDelay:"300ms",transitionDuration:"300ms"}},'[data-controls="slot[viewControls]"]':{...u.transition.fadeInFrom,marginInlineStart:"auto"},'[data-controls="slot[toolbar]"]':{"&:not(:empty)":{marginInlineStart:t(2)}},[`&[data-controls*="${I}"]`]:{'[data-controls="slot[toolControls]"], [data-controls="slot[viewControls]"]':{opacity:1,transitionDuration:"200ms, 300ms",transitionTimingFunction:"linear, ease-out",translate:"0 0"}},[`&[data-controls*="${R}"]`]:{'[data-controls="slot[toolControls]"], [data-controls="slot[viewControls]"]':{opacity:0,transitionDuration:"100ms, 100ms",transitionTimingFunction:"linear, ease-in",translate:"0 60%"}}})),E="PhxMobileSidebar",P="visible",D="hidden",j="assistant",A={Root:i("div",{name:E,slot:"root",shouldForwardProp:t=>"ownerState"!==t})(({ownerState:t})=>[`
+import{jsx as t,jsxs as a,Fragment as e}from"react/jsx-runtime";import{snackbarClasses as o,styled as i,useTheme as r,useThemeProps as n}from"@mui/material";import d from"lodash/noop.js";import{AnimatePresence as s}from"motion/react";import{useRef as l}from"react";import{useAccessService as m,useEagerObservableSelector as c,useIsFullscreenActive as p}from"#package/react-sdk";import{attrf as u,commonStyles as b,numToPx as h,useIsEmpty as g,useResponsive as f,useViewportSize as y}from"#package/ui-sdk";import{useConfigurator as x}from"../../../application-runtime/index.js";import{usePreview as v}from"../../../configurator-context/index.js";import{ASSISTANT_PANEL_SLOT as w,AssistantPanel as S,useIsAssistantPanelOpen as $}from"../../assistant/index.js";import{LayoutSlots as k}from"../slots/index.js";import{MobileHeader as C}from"../slots/slots.js";import{MobilePreview as F}from"./MobilePreview.js";import{useSceneSafeArea as M}from"./use-scene-safe-area.js";let T="visible",I="hidden",R=i("div",{name:"PhxMobileHeader",slot:"root"})(({theme:{spacing:t}})=>({...b.transition.fadeInFrom,alignItems:"center",display:"flex",gap:t(1),justifyContent:"space-between",position:"relative","@container style(--inspect: on)":{background:"hsl(from tomato h s l / 50%)"},'[data-header*="slot"]':{display:"flex",gap:t(2),"& > *":{pointerEvents:"auto"}},'[data-header="slot[center]"]':{display:"grid",inset:0,placeItems:"center",position:"absolute"},[`&[data-header*="${T}"]`]:{opacity:1,transitionDuration:"200ms, 300ms",transitionTimingFunction:"linear, ease-out",translate:"0 0"},[`&[data-header*="${I}"]`]:{opacity:0,transitionDuration:"100ms, 100ms",transitionTimingFunction:"linear, ease-in",translate:"0 -60%"}})),B="visible",E="hidden",P=i("div",{name:"PhxMobileControls",slot:"root"})(({theme:{spacing:t}})=>({alignItems:"end",display:"flex",position:"relative","@container style(--inspect: on)":{background:"hsl(from tomato h s l / 50%)"},'[data-controls*="slot"]':{"& > *":{pointerEvents:"auto"}},'[data-controls="slot[toolControls]"]':{...b.transition.fadeInFrom,"&:not(:empty)":{marginInlineEnd:t(2)},"& > *":{...b.transition.fadeIn,transitionDelay:"300ms",transitionDuration:"300ms"}},'[data-controls="slot[viewControls]"]':{...b.transition.fadeInFrom,marginInlineStart:"auto"},'[data-controls="slot[toolbar]"]':{"&:not(:empty)":{marginInlineStart:t(2)}},[`&[data-controls*="${B}"]`]:{'[data-controls="slot[toolControls]"], [data-controls="slot[viewControls]"]':{opacity:1,transitionDuration:"200ms, 300ms",transitionTimingFunction:"linear, ease-out",translate:"0 0"}},[`&[data-controls*="${E}"]`]:{'[data-controls="slot[toolControls]"], [data-controls="slot[viewControls]"]':{opacity:0,transitionDuration:"100ms, 100ms",transitionTimingFunction:"linear, ease-in",translate:"0 60%"}}})),D="PhxMobileSidebar",j="visible",A="hidden",z="assistant",H={Root:i("div",{name:D,slot:"root",shouldForwardProp:t=>"ownerState"!==t})(({ownerState:t})=>[`
       --phx-sidebar-background: ${t.background};
       --phx-sidebar-padding: ${t.padding};
       --phx-sidebar-radius: ${t.borderRadius}px;
-    `,{...u.transition.fadeInFrom,background:"var(--phx-sidebar-background)",borderStartStartRadius:"var(--phx-sidebar-radius)",borderStartEndRadius:"var(--phx-sidebar-radius)",display:"grid",gridTemplateColumns:"minmax(0, 1fr)",gridTemplateRows:"min-content minmax(0, 1fr) min-content",position:"relative","& > *":{pointerEvents:"auto"},"@container style(--inspect: on)":{background:"hsl(from gold h s l / 50%)"},'&:has([data-sidebar*="slot[content]"])':{...t.isContentEmpty&&{"--phx-sidebar-radius":0,'[data-sidebar*="slot[header]"]':{paddingBlock:0,"& > *":{display:"none"}}}},[`&[data-sidebar*="${P}"]`]:{opacity:1,transitionDuration:"200ms, 300ms",transitionTimingFunction:"linear, ease-out",translate:"0 0"},[`&[data-sidebar*="${D}"]`]:{opacity:0,transitionDuration:"100ms, 100ms",transitionTimingFunction:"linear, ease-in",translate:"0 60%"},[`&[data-sidebar*="${j}"] > :not([data-sidebar="${x}"])`]:{visibility:"hidden"}}]),Header:i("header",{name:E,slot:"header",shouldForwardProp:t=>"ownerState"!==t})(({theme:{spacing:t}})=>({alignItems:"center",borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",display:"grid",gap:t(1),gridTemplateColumns:"repeat(2, minmax(0, 1fr))",paddingBlock:"calc(var(--phx-sidebar-padding) * 0.5)",paddingInline:"var(--phx-sidebar-padding)","& > *":{...u.transition.fadeIn,transitionDelay:"100ms",transitionDuration:"300ms"},'[data-sidebar="slot[header.start]"]':{},'[data-sidebar="slot[header.end]"]':{justifySelf:"end"}})),Body:i("div",{name:E,slot:"body",shouldForwardProp:t=>"ownerState"!==t})({display:"grid",gridTemplateRows:"minmax(0, 1fr)"}),Content:i("div",{name:E,slot:"content",shouldForwardProp:t=>"ownerState"!==t})(({theme:{spacing:t}})=>({...u.layout.normalizeScrollableContainer,display:"grid",gap:t(2),gridAutoRows:"min-content",paddingBlock:"calc(var(--phx-sidebar-padding) * 0.5)",paddingInline:"var(--phx-sidebar-padding)","&:empty":{paddingBlock:0}})),Tabs:i("div",{name:E,slot:"tabs",shouldForwardProp:t=>"ownerState"!==t})(({theme:{palette:t}})=>({borderBlockStart:`1px solid ${t.divider}`,paddingBlock:"calc(var(--phx-sidebar-padding) * 0.5)",paddingInline:"calc(var(--phx-sidebar-padding) * 0.75)","&:is(:empty)":{border:0,padding:0}})),Footer:i("footer",{name:E,slot:"footer",shouldForwardProp:t=>"ownerState"!==t})(({theme:{palette:t}})=>({borderBlockStart:`1px solid ${t.divider}`,paddingBlock:"calc(var(--phx-sidebar-padding) * 0.5)",paddingInline:"var(--phx-sidebar-padding)","&:is(:empty)":{borderColor:"transparent",paddingBlock:0}}))};export const PhxMobileLayoutName="PhxMobileLayout";let z="initial",H="fullscreen",L="min(480px, 50cqb)",q=["auto","min-content","max-content","fit-content"],N=i("div",{name:"PhxMobileLayout",slot:"root",shouldForwardProp:t=>"ownerState"!==t})(({ownerState:t,theme:{spacing:a}})=>[`
+    `,{...b.transition.fadeInFrom,background:"var(--phx-sidebar-background)",borderStartStartRadius:"var(--phx-sidebar-radius)",borderStartEndRadius:"var(--phx-sidebar-radius)",display:"grid",gridTemplateColumns:"minmax(0, 1fr)",gridTemplateRows:"min-content minmax(0, 1fr) min-content",position:"relative","& > *":{pointerEvents:"auto"},"@container style(--inspect: on)":{background:"hsl(from gold h s l / 50%)"},'&:has([data-sidebar*="slot[content]"])':{...t.isContentEmpty&&{"--phx-sidebar-radius":0,'[data-sidebar*="slot[header]"]':{paddingBlock:0,"& > *":{display:"none"}}}},[`&[data-sidebar*="${j}"]`]:{opacity:1,transitionDuration:"200ms, 300ms",transitionTimingFunction:"linear, ease-out",translate:"0 0"},[`&[data-sidebar*="${A}"]`]:{opacity:0,transitionDuration:"100ms, 100ms",transitionTimingFunction:"linear, ease-in",translate:"0 60%"},[`&[data-sidebar*="${z}"] > :not([data-sidebar="${w}"])`]:{visibility:"hidden"}}]),Header:i("header",{name:D,slot:"header",shouldForwardProp:t=>"ownerState"!==t})(({theme:{spacing:t}})=>({alignItems:"center",borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",display:"grid",gap:t(1),gridTemplateColumns:"repeat(2, minmax(0, 1fr))",paddingBlock:"calc(var(--phx-sidebar-padding) * 0.5)",paddingInline:"var(--phx-sidebar-padding)","& > *":{...b.transition.fadeIn,transitionDelay:"100ms",transitionDuration:"300ms"},'[data-sidebar="slot[header.start]"]':{},'[data-sidebar="slot[header.end]"]':{justifySelf:"end"}})),Body:i("div",{name:D,slot:"body",shouldForwardProp:t=>"ownerState"!==t})({display:"grid",gridTemplateRows:"minmax(0, 1fr)"}),Content:i("div",{name:D,slot:"content",shouldForwardProp:t=>"ownerState"!==t})(({theme:{spacing:t}})=>({...b.layout.normalizeScrollableContainer,display:"grid",gap:t(2),gridAutoRows:"min-content",paddingBlock:"calc(var(--phx-sidebar-padding) * 0.5)",paddingInline:"var(--phx-sidebar-padding)","&:empty":{paddingBlock:0}})),Tabs:i("div",{name:D,slot:"tabs",shouldForwardProp:t=>"ownerState"!==t})(({theme:{palette:t}})=>({borderBlockStart:`1px solid ${t.divider}`,paddingBlock:"calc(var(--phx-sidebar-padding) * 0.5)",paddingInline:"calc(var(--phx-sidebar-padding) * 0.75)","&:is(:empty)":{border:0,padding:0}})),Footer:i("footer",{name:D,slot:"footer",shouldForwardProp:t=>"ownerState"!==t})(({theme:{palette:t}})=>({borderBlockStart:`1px solid ${t.divider}`,paddingBlock:"calc(var(--phx-sidebar-padding) * 0.5)",paddingInline:"var(--phx-sidebar-padding)","&:is(:empty)":{borderColor:"transparent",paddingBlock:0}}))};export const PhxMobileLayoutName="PhxMobileLayout";let L="initial",q="fullscreen",N="min(480px, 50cqb)",V=["auto","min-content","max-content","fit-content"],G=i("div",{name:"PhxMobileLayout",slot:"root",shouldForwardProp:t=>"ownerState"!==t})(({ownerState:t,theme:{spacing:a}})=>[`
     --inspect: off;  // 🕹️ inspection mode toggle
 
-    --phx-layout-sidebar-track-size: ${b(t.sidebarHeight)};
+    --phx-layout-sidebar-track-size: ${h(t.sidebarHeight)};
     --phx-layout-gutter: ${a(2)};
   `,{display:"grid",gridTemplateColumns:`
       [full-start]
@@ -39,4 +39,4 @@ import{jsx as t,jsxs as a,Fragment as e}from"react/jsx-runtime";import{snackbarC
         [footer-end]
         var(--phx-layout-gutter)
         [full-end]
-      `},'[data-layout*="slot[body.header]"]':{gridArea:"header-start / main-start / header-end / main-end"},'[data-layout*="slot[body.footer]"]':{gridArea:"footer-start / main-start / footer-end / main-end",position:"relative"},'[data-layout*="slot[body.safeSceneArea]"]':{gridArea:"full","@container style(--inspect: on)":{background:"hsl(from lime h s l / 50%)"}},'[data-layout="slot[body.sideEffects]"]':{insetBlockEnd:`calc(100% + ${a(2)})`,position:"absolute"},'[data-layout*="slot[sidebar]"]':{display:"grid",gridArea:"sidebar-start / full-start / sidebar-end / full-end",gridTemplateColumns:"minmax(0, 1fr)",gridTemplateRows:"minmax(0, auto)"},'[data-layout*="slot[footer]"]':{gridArea:"footer-start / full-start / footer-end / full-end",zIndex:1},'&:has([data-sidebar*="slot[content]"])':{...t.isContentEmpty&&{"--phx-layout-sidebar-track-size":"min-content"}},[`&[data-layout*="${z}"]`]:{transitionDelay:"200ms",transitionDuration:"300ms"},[`&[data-layout*="${H}"]`]:{transitionDelay:"0ms",transitionDuration:"300ms"},[`&:has([data-sidebar*="${D}"])[class]`]:{"--phx-layout-sidebar-track-size":0}},null!=t.assistantFocusHeight&&{'[data-layout*="slot[sidebar]"]':{alignSelf:"start",blockSize:`min(100%, ${t.assistantFocusHeight}px)`,gridRow:"full-start / full-end",zIndex:2}}]),V=i("div")({gridArea:"1 / 1 / -1 / -1"}),G=t=>({inert:t?"":void 0});export const MobileLayout=()=>{let o=l(null),{palette:i,shape:u,spacing:b}=r(),{sidebarHeight:x=L}=n({props:{},name:"PhxMobileLayout"}),{background:J=i.background.paper,borderRadius:K=u.sidebarBorderRadius??u.borderRadius,padding:O=b(2)}=n({props:{},name:E}),{accessInfo:Q}=m(),U=c(),{isPreview:W,isHidden:X}=y(),Y=!X&&!W,Z=!U&&Y,_=!U&&Y,tt=!U,{setCanvasPadding:ta}=g(),{containerRef:te,safeAreaRef:to}=C(Y?ta:d,!1),ti=h(o,{disabled:!tt}),tr=w(),tn=tr?.open??!1,td=tn&&tt&&(tr?.isInputFocused??!1),ts=f(),tl=ti&&!tn,tm={isContentEmpty:tl,sidebarHeight:tn?q.includes(x)?L:x:x,assistantFocusHeight:td?ts?.[1]:void 0},tc={background:J,borderRadius:K,padding:O,isContentEmpty:tl};return a(e,{children:[t(s,{initial:!1,children:!X&&W&&t(k,{})}),a(N,{ownerState:tm,"data-layout":p({state:{[`${z}`]:!U,[`${H}`]:U}}),...G(!Y),children:[t(V,{ref:te}),t("div",{"data-layout":"slot[sideEffects]",children:t(S.MobileSnackbarsRoot,{})}),a("main",{"data-layout":"slot[body]",children:[t("header",{"data-layout":"slot[body.header]",children:a(T,{"data-header":p({state:{[`${F}`]:Z,[`${M}`]:!Z}}),...G(!Z),children:[t("div",{"data-header":"slot[start]",children:t($,{})}),t("div",{"data-header":"slot[center]",children:t(S.MobileCallToAction,{})}),a("div",{"data-header":"slot[end]",children:[Q.viewMode&&!U&&t(S.MobileReadonlyBanner,{}),t(S.MobileHamburgerMenu,{})]})]})}),t("div",{ref:to,"data-layout":"slot[body.safeSceneArea]"}),t("div",{"data-layout":"slot[body.footer] interactive",children:a(B,{"data-controls":p({state:{[`${I}`]:_,[`${R}`]:!_}}),children:[t("div",{"data-controls":"slot[toolControls]",...G(!_),children:t(S.MobileToolControls,{})}),t("div",{"data-controls":"slot[viewControls]",...G(!_),children:t(S.MobileViewControls,{})}),t("div",{"data-controls":"slot[toolbar]",children:Y&&t(S.MobileToolbar,{})})]})})]}),t("aside",{"data-layout":"slot[sidebar]",children:a(A.Root,{ownerState:tc,"data-sidebar":p({state:{[`${P}`]:tt,[`${D}`]:!tt,[`${j}`]:tn}}),...G(!tt),children:[a(A.Header,{ownerState:tc,"data-sidebar":"slot[header]",children:[t("div",{"data-sidebar":"slot[header.start]",children:t(S.MobileSidebarBackButton,{})}),t("div",{"data-sidebar":"slot[header.end]",children:t(S.MobilePoweredBy,{})})]}),t(A.Body,{ownerState:tc,"data-sidebar":"slot[body]",children:t(A.Content,{ref:o,ownerState:tc,"data-sidebar":"slot[content]",children:t(S.MobileSidebarContent,{})})}),t(A.Tabs,{ownerState:tc,"data-sidebar":"slot[tabs]",children:t(S.MobileTabs,{})}),t(A.Footer,{ownerState:tc,"data-sidebar":"slot[footer]",children:t(S.MobileSidebarFooter,{})}),t(v,{})]})}),t("footer",{"data-layout":"slot[footer] interactive",children:t(S.MobileFooter,{})})]})]})};
+      `},'[data-layout*="slot[body.header]"]':{gridArea:"header-start / main-start / header-end / main-end"},'[data-layout*="slot[body.footer]"]':{gridArea:"footer-start / main-start / footer-end / main-end",position:"relative"},'[data-layout*="slot[body.safeSceneArea]"]':{gridArea:"full","@container style(--inspect: on)":{background:"hsl(from lime h s l / 50%)"}},'[data-layout="slot[body.sideEffects]"]':{insetBlockEnd:`calc(100% + ${a(2)})`,position:"absolute"},'[data-layout*="slot[sidebar]"]':{display:"grid",gridArea:"sidebar-start / full-start / sidebar-end / full-end",gridTemplateColumns:"minmax(0, 1fr)",gridTemplateRows:"minmax(0, auto)"},'[data-layout*="slot[footer]"]':{gridArea:"footer-start / full-start / footer-end / full-end",zIndex:1},'&:has([data-sidebar*="slot[content]"])':{...t.isContentEmpty&&{"--phx-layout-sidebar-track-size":"min-content"}},[`&[data-layout*="${L}"]`]:{transitionDelay:"200ms",transitionDuration:"300ms"},[`&[data-layout*="${q}"]`]:{transitionDelay:"0ms",transitionDuration:"300ms"},[`&:has([data-sidebar*="${A}"])[class]`]:{"--phx-layout-sidebar-track-size":0}},null!=t.assistantFocusHeight&&{'[data-layout*="slot[sidebar]"]':{alignSelf:"start",blockSize:`min(100%, ${t.assistantFocusHeight}px)`,gridRow:"full-start / full-end",zIndex:2}}]),J=i("div")({gridArea:"1 / 1 / -1 / -1"}),K=t=>({inert:t?"":void 0});export const MobileLayout=()=>{let o=l(null),{palette:i,shape:b,spacing:h}=r(),{sidebarHeight:w=N}=n({props:{},name:"PhxMobileLayout"}),{background:O=i.background.paper,borderRadius:Q=b.sidebarBorderRadius??b.borderRadius,padding:U=h(2)}=n({props:{},name:D}),{accessInfo:W}=m(),X=p(),{isPreview:Y,isHidden:Z}=v(),_=!Z&&!Y,tt=!X&&_,ta=!X&&_,te=!X,{setCanvasPadding:to}=f(),{containerRef:ti,safeAreaRef:tr}=M(_?to:d,!1),tn=g(o,{disabled:!te}),{assistantSystem:td}=x(),ts=$(),tl=c(td.panel$,t=>t.isInputFocused,[]),tm=ts&&te&&tl,tc=y(tm),tp=tn&&!ts,tu={isContentEmpty:tp,sidebarHeight:ts?V.includes(w)?N:w:w,assistantFocusHeight:tm?tc?.[1]:void 0},tb={background:O,borderRadius:Q,padding:U,isContentEmpty:tp};return a(e,{children:[t(s,{initial:!1,children:!Z&&Y&&t(F,{})}),a(G,{ownerState:tu,"data-layout":u({state:{[`${L}`]:!X,[`${q}`]:X}}),...K(!_),children:[t(J,{ref:ti}),t("div",{"data-layout":"slot[sideEffects]",children:t(k.MobileSnackbarsRoot,{})}),a("main",{"data-layout":"slot[body]",children:[t("header",{"data-layout":"slot[body.header]",children:a(R,{"data-header":u({state:{[`${T}`]:tt,[`${I}`]:!tt}}),...K(!tt),children:[t("div",{"data-header":"slot[start]",children:t(C,{})}),t("div",{"data-header":"slot[center]",children:t(k.MobileCallToAction,{})}),a("div",{"data-header":"slot[end]",children:[W.viewMode&&!X&&t(k.MobileReadonlyBanner,{}),t(k.MobileHamburgerMenu,{})]})]})}),t("div",{ref:tr,"data-layout":"slot[body.safeSceneArea]"}),t("div",{"data-layout":"slot[body.footer] interactive",children:a(P,{"data-controls":u({state:{[`${B}`]:ta,[`${E}`]:!ta}}),children:[t("div",{"data-controls":"slot[toolControls]",...K(!ta),children:t(k.MobileToolControls,{})}),t("div",{"data-controls":"slot[viewControls]",...K(!ta),children:t(k.MobileViewControls,{})}),t("div",{"data-controls":"slot[toolbar]",children:_&&t(k.MobileToolbar,{})})]})})]}),t("aside",{"data-layout":"slot[sidebar]",children:a(H.Root,{ownerState:tb,"data-sidebar":u({state:{[`${j}`]:te,[`${A}`]:!te,[`${z}`]:ts}}),...K(!te),children:[a(H.Header,{ownerState:tb,"data-sidebar":"slot[header]",children:[t("div",{"data-sidebar":"slot[header.start]",children:t(k.MobileSidebarBackButton,{})}),t("div",{"data-sidebar":"slot[header.end]",children:t(k.MobilePoweredBy,{})})]}),t(H.Body,{ownerState:tb,"data-sidebar":"slot[body]",children:t(H.Content,{ref:o,ownerState:tb,"data-sidebar":"slot[content]",children:t(k.MobileSidebarContent,{})})}),t(H.Tabs,{ownerState:tb,"data-sidebar":"slot[tabs]",children:t(k.MobileTabs,{})}),t(H.Footer,{ownerState:tb,"data-sidebar":"slot[footer]",children:t(k.MobileSidebarFooter,{})}),t(S,{})]})}),t("footer",{"data-layout":"slot[footer] interactive",children:t(k.MobileFooter,{})})]})]})};

package/dist/configurator/ui/legacy/mobile-controls/MobileControls.d.ts

@@ -57,6 +57,6 @@ declare const ResponsiveNavigation: <VALUE extends string, ENTITY_ID extends Dom
  */
 export declare const MobileControls: {
     Navigation: typeof ResponsiveNavigation;
-    ViewOnlyMode: (inProps: import("../../../../ui-sdk/components/mobile-controls/MobileControls").ViewOnlyModeProps & import("#package/ui-sdk").MobileControlsThemeableProps) => import("react/jsx-runtime").JSX.Element;
+    ViewOnlyMode: (inProps: import("#package/ui-sdk").ViewOnlyModeProps & import("#package/ui-sdk").MobileControlsThemeableProps) => import("react/jsx-runtime").JSX.Element;
 };
 export {};

package/dist/configurator/ui/phoenix-layout-elements/AssistantToolbarButton.d.ts

@@ -1,6 +1,6 @@
 /**
- * Opens and closes the assistant panel. It renders nothing where there is no panel to open: in a
- * project without an assistant, or in a layout that does not carry the panel.
+ * Opens and closes the assistant panel. It renders nothing in a project without an assistant. A
+ * layout that lists the button is expected to carry the panel; the button does not check for it.
  */
 export declare const AssistantToolbarButton: import("react").FunctionComponent<{
     readonly showTitle?: boolean;

package/dist/configurator/ui/phoenix-layout-elements/AssistantToolbarButton.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{Badge as r}from"@mui/material";import{memo as s,useCallback as a}from"react";import{assistantToolbarButtonSchema as o,createPhoenixLayoutElement as e}from"#package/domain";import{useLocalizable as i}from"#package/react-sdk";import{DesktopToolbar as n,PhxIcon as m,useResponsive as l}from"#package/ui-sdk";import{useAssistantPanel as p}from"../assistant/index.js";let c={id:"sdk.assistant.toolbarButton.label",message:"Assistant"};export const AssistantToolbarButton=e({schema:o,component:s(s=>{let{icon:o,showTitle:e=!0}=s,d=p(),u=i(c),{isPhone:k,isTablet:f}=l(),A=d?.open??!1,b=d?.setOpen,g=a(()=>{b?.(!A)},[A,b]);return d?t(n.Button,{title:u,onClick:g,showTitle:e&&!k&&!f,"aria-pressed":A,sx:{'&[aria-pressed="true"]':{backgroundColor:"action.selected"}},children:t(r,{color:"primary",variant:"dot",overlap:"circular",invisible:!d.hasUnreadReply,children:t(m,{name:o??(A?"CustomAiAssistantBold":"CustomAiAssistant")})})}):null})});
+import{jsx as t}from"react/jsx-runtime";import{Badge as r}from"@mui/material";import{memo as o,useCallback as a}from"react";import{assistantToolbarButtonSchema as i,createPhoenixLayoutElement as e}from"#package/domain";import{useEagerObservableValue as s,useLocalizable as n,useSpecAssistant as m}from"#package/react-sdk";import{DesktopToolbar as l,PhxIcon as p,useResponsive as c}from"#package/ui-sdk";import{useConfigurator as d}from"../../application-runtime/index.js";let u={id:"sdk.assistant.toolbarButton.label",message:"Assistant"};export const AssistantToolbarButton=e({schema:i,component:o(o=>{let{icon:i,showTitle:e=!0}=o,{assistantSystem:k}=d(),f=m(),{open:A,hasUnreadReply:b}=s(k.panel$),g=n(u),{isPhone:x,isTablet:h}=c(),B=a(()=>{k.setOpen(!A)},[k,A]);return f?t(l.Button,{title:g,onClick:B,showTitle:e&&!x&&!h,"aria-pressed":A,sx:{'&[aria-pressed="true"]':{backgroundColor:"action.selected"}},children:t(r,{color:"primary",variant:"dot",overlap:"circular",invisible:!b,children:t(p,{name:i??(A?"CustomAiAssistantBold":"CustomAiAssistant")})})}):null})});