@salsita-ai/sdk 0.50.0-develop.9eab66c5a9 → 0.50.0-develop.9fe72d003e

package/dist/configurator/pages/error-boundaries/DevLoadingFallback.js

@@ -1 +1 @@
-import{jsx as t,jsxs as e,Fragment as r}from"react/jsx-runtime";import{Box as i,Button as n,Divider as o,Stack as a,Typography as s}from"@mui/material";import{useEffect as c,useRef as d}from"react";import{useAccessService as l,useBackendData as h,useFrontendData as m,useIsDev as f,useLoadedData as u,useOverridesHash as p,usePublishedData as b,useSessionService as x}from"#package/react-sdk";import{JsonViewer as g,StackTraceViewer as v}from"#package/ui-sdk";import{useConfiguratorRouting as y}from"../../configurator-context/index.js";import{useResetOnEditorHotReload as k}from"./use-reset-on-editor-hot-reload.js";let w=()=>{let r=y();return e(a,{direction:"row",spacing:2,sx:{mb:2},children:[t(n,{variant:"outlined",size:"small",onClick:()=>{r.goToIndex()},children:"Reset state"}),t(n,{variant:"outlined",size:"small",onClick:()=>{window.location.reload()},children:"Reload Page"})]})},S=()=>{let n=u(),a=l(),c=x(),d=b(),f=m(),p=h();return e(r,{children:[t(s,{variant:"h5",sx:{mb:2,mt:4,fontWeight:600},children:"Debug Data"}),e(i,{component:"div",sx:{p:2,mb:4,backgroundColor:"#e3f2fd",borderRadius:1,borderLeft:"4px solid #2196f3"},children:[t(s,{variant:"subtitle2",sx:{fontWeight:600,mb:1,color:"primary.main"},children:"\uD83D\uDD0D How to Debug This Issue"}),t(s,{variant:"body2",component:"div",children:e("ul",{style:{margin:"8px 0",paddingLeft:"20px"},children:[t("li",{children:"Check the error message and stack trace above for the exact location of the issue"}),t("li",{children:"Review the data sections below to understand the current application state"}),t("li",{children:"Look for missing or unexpected values in Published, Frontend, or Backend Data"}),t("li",{children:"Verify that all required data sources are loaded correctly"}),t("li",{children:"Check Session Service for authentication issues"}),t("li",{children:'Use the "Reset state" button to return to the index page'}),t("li",{children:'Use the "Reload Page" button to start fresh if the issue persists'})]})})]}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Published Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Configuration data published to S3. This is the main source of truth for domain entities, components, and rules. Loaded from the backend at application startup."}),t(g,{data:d}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Frontend Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Data collected and processed on the frontend. Contains UI state, user selections, and client-side computed values."}),t(g,{data:f}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Backend Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Optional data fetched from backend APIs. May include pricing, availability, or other dynamic server-side data."}),t(g,{data:p}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Session Service"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Authentication and session information. Contains user identity, permissions, and session tokens."}),t(g,{data:c}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Loaded Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"The initial data of the configuration used to start the configurator. This is the starting state and context provided when the configurator was initialized."}),t(g,{data:n}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Access Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Access control and permissions service. Determines what actions the current user can perform and what data they can view."}),t(g,{data:a}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Configurator Props"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Configurator-specific properties and settings. Contains routing information, UI configuration, and configurator context settings."})]})};export const DevLoadingFallback=n=>{let{error:l,resetErrorBoundary:h}=n,m=f(),u=p();k(h);let b=d(null);if(c(()=>{if(h){if(null===b.current){b.current=u;return}u!==b.current&&h()}},[u,h]),!m)throw l;if(l instanceof Error)return t(i,{component:"div",sx:{height:"100vh",overflow:"auto"},children:e(a,{component:"div",spacing:3,sx:{p:5,boxSizing:"border-box"},alignItems:"flex-start",children:[t(s,{variant:"h6",sx:{mb:2,mt:2},color:"error",children:"Loading of the context failed for an unknown reason!"}),e(i,{component:"div",sx:{p:2,mb:2,backgroundColor:"#fff3cd",borderRadius:1,borderLeft:"4px solid #ffc107"},children:[t(s,{variant:"subtitle2",sx:{fontWeight:600,mb:1},children:"⚠️ When does this error occur?"}),e(s,{variant:"body2",children:["This error happened ",t("strong",{children:"during the initial loading of data"})," before the configurator could start. Most likely causes:"]}),e(s,{variant:"body2",component:"ul",sx:{mt:1,mb:0},children:[t("li",{children:"Migration scripts failed to transform the data correctly"}),t("li",{children:"State initialization encountered invalid or corrupted data"})]})]}),t(s,{variant:"body2",sx:{mb:2},children:"This should not happen, please report it so we can improve the platform!"}),t(w,{}),t(s,{variant:"subtitle2",children:"Error: "}),t(s,{variant:"body2",children:l.message}),l.stack&&e(r,{children:[t(o,{}),t(v,{stack:l.stack,error:l})]}),t(o,{}),t(S,{})]})});let x=l instanceof Error?l.stack:null;return t(i,{component:"div",sx:{height:"100vh",overflow:"auto"},children:e(a,{component:"div",spacing:3,sx:{p:5,boxSizing:"border-box"},children:[t(s,{variant:"h6",sx:{mb:2,mt:2},color:"error",children:"Loading of the context failed for an unknown reason!"}),t(s,{variant:"body2",children:"This should not happen, please report it so we can improve the platform!"}),t(w,{}),t(s,{variant:"subtitle2",children:"Error: "}),t(s,{variant:"body2",children:`${l}`}),x&&e(r,{children:[t(o,{}),t(v,{stack:x,error:l})]}),t(o,{}),t(S,{})]})})};
+import{jsx as t,jsxs as e,Fragment as r}from"react/jsx-runtime";import{Box as i,Button as n,Divider as o,Stack as a,Typography as s}from"@mui/material";import{useEffect as c,useRef as d}from"react";import{useAccessService as l,useBackendData as h,useConfiguratorRouting as m,useFrontendData as f,useIsDev as u,useLoadedData as p,useOverridesHash as b,usePublishedData as x,useSessionService as v}from"#package/react-sdk";import{JsonViewer as g,StackTraceViewer as y}from"#package/ui-sdk";import{useResetOnEditorHotReload as k}from"./use-reset-on-editor-hot-reload.js";let w=()=>{let r=m();return e(a,{direction:"row",spacing:2,sx:{mb:2},children:[t(n,{variant:"outlined",size:"small",onClick:()=>{r.goToIndex()},children:"Reset state"}),t(n,{variant:"outlined",size:"small",onClick:()=>{window.location.reload()},children:"Reload Page"})]})},S=()=>{let n=p(),a=l(),c=v(),d=x(),m=f(),u=h();return e(r,{children:[t(s,{variant:"h5",sx:{mb:2,mt:4,fontWeight:600},children:"Debug Data"}),e(i,{component:"div",sx:{p:2,mb:4,backgroundColor:"#e3f2fd",borderRadius:1,borderLeft:"4px solid #2196f3"},children:[t(s,{variant:"subtitle2",sx:{fontWeight:600,mb:1,color:"primary.main"},children:"\uD83D\uDD0D How to Debug This Issue"}),t(s,{variant:"body2",component:"div",children:e("ul",{style:{margin:"8px 0",paddingLeft:"20px"},children:[t("li",{children:"Check the error message and stack trace above for the exact location of the issue"}),t("li",{children:"Review the data sections below to understand the current application state"}),t("li",{children:"Look for missing or unexpected values in Published, Frontend, or Backend Data"}),t("li",{children:"Verify that all required data sources are loaded correctly"}),t("li",{children:"Check Session Service for authentication issues"}),t("li",{children:'Use the "Reset state" button to return to the index page'}),t("li",{children:'Use the "Reload Page" button to start fresh if the issue persists'})]})})]}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Published Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Configuration data published to S3. This is the main source of truth for domain entities, components, and rules. Loaded from the backend at application startup."}),t(g,{data:d}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Frontend Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Data collected and processed on the frontend. Contains UI state, user selections, and client-side computed values."}),t(g,{data:m}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Backend Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Optional data fetched from backend APIs. May include pricing, availability, or other dynamic server-side data."}),t(g,{data:u}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Session Service"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Authentication and session information. Contains user identity, permissions, and session tokens."}),t(g,{data:c}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Loaded Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"The initial data of the configuration used to start the configurator. This is the starting state and context provided when the configurator was initialized."}),t(g,{data:n}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Access Data"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Access control and permissions service. Determines what actions the current user can perform and what data they can view."}),t(g,{data:a}),t(o,{sx:{my:4}}),t(s,{variant:"h6",sx:{mb:1,mt:3,fontWeight:600,color:"primary.main"},children:"Configurator Props"}),t(s,{variant:"body2",sx:{mb:2,color:"text.secondary",fontStyle:"italic"},children:"Configurator-specific properties and settings. Contains routing information, UI configuration, and configurator context settings."})]})};export const DevLoadingFallback=n=>{let{error:l,resetErrorBoundary:h}=n,m=u(),f=b();k(h);let p=d(null);if(c(()=>{if(h){if(null===p.current){p.current=f;return}f!==p.current&&h()}},[f,h]),!m)throw l;if(l instanceof Error)return t(i,{component:"div",sx:{height:"100vh",overflow:"auto"},children:e(a,{component:"div",spacing:3,sx:{p:5,boxSizing:"border-box"},alignItems:"flex-start",children:[t(s,{variant:"h6",sx:{mb:2,mt:2},color:"error",children:"Loading of the context failed for an unknown reason!"}),e(i,{component:"div",sx:{p:2,mb:2,backgroundColor:"#fff3cd",borderRadius:1,borderLeft:"4px solid #ffc107"},children:[t(s,{variant:"subtitle2",sx:{fontWeight:600,mb:1},children:"⚠️ When does this error occur?"}),e(s,{variant:"body2",children:["This error happened ",t("strong",{children:"during the initial loading of data"})," before the configurator could start. Most likely causes:"]}),e(s,{variant:"body2",component:"ul",sx:{mt:1,mb:0},children:[t("li",{children:"Migration scripts failed to transform the data correctly"}),t("li",{children:"State initialization encountered invalid or corrupted data"})]})]}),t(s,{variant:"body2",sx:{mb:2},children:"This should not happen, please report it so we can improve the platform!"}),t(w,{}),t(s,{variant:"subtitle2",children:"Error: "}),t(s,{variant:"body2",children:l.message}),l.stack&&e(r,{children:[t(o,{}),t(y,{stack:l.stack,error:l})]}),t(o,{}),t(S,{})]})});let x=l instanceof Error?l.stack:null;return t(i,{component:"div",sx:{height:"100vh",overflow:"auto"},children:e(a,{component:"div",spacing:3,sx:{p:5,boxSizing:"border-box"},children:[t(s,{variant:"h6",sx:{mb:2,mt:2},color:"error",children:"Loading of the context failed for an unknown reason!"}),t(s,{variant:"body2",children:"This should not happen, please report it so we can improve the platform!"}),t(w,{}),t(s,{variant:"subtitle2",children:"Error: "}),t(s,{variant:"body2",children:`${l}`}),x&&e(r,{children:[t(o,{}),t(y,{stack:x,error:l})]}),t(o,{}),t(S,{})]})})};

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{ButtonBase as o,ClickAwayListener as i,Tooltip as a,styled as s}from"@mui/material";import{memo as r,useCallback as l,useMemo as d,useRef as c,useState as m}from"react";import{match as p}from"ts-pattern";import{useLocalizable as h}from"#package/react-sdk";import{PhxIcon as u}from"#package/ui-sdk";import{assistantReferenceStyles as g}from"./reference-link/index.js";import{ScreenshotThumbnails as f,readToolScreenshots as k}from"./screenshots/index.js";import{AssistantPanelName as x}from"./theme.js";let y={id:"sdk.assistant.tool.updateDesign.label",message:"Update design"},b={id:"sdk.assistant.tool.readDesign.label",message:"Read design"},w={id:"sdk.assistant.tool.mistake.hint",message:"The assistant made a mistake."},C={id:"sdk.assistant.tool.cancelled.hint",message:"Stopped before it finished."},v={id:"sdk.assistant.tool.noResult.hint",message:"The result of this step was lost. It may or may not have been done."},D={id:"sdk.assistant.tool.toolBudget.hint",message:"Not done: the assistant reached its limit of steps for one message."},I={id:"sdk.assistant.tool.undo.label",message:"Undo"},S={id:"sdk.assistant.tool.screenshots.label",message:"{count, plural, one {# screenshot} other {# screenshots}}"},j=s("div",{name:x,slot:"chips"})(({theme:{palette:e,spacing:t,typography:n}})=>({...n.caption,alignItems:"start",color:e.text.secondary,display:"grid",gap:t(.75),gridTemplateColumns:"min-content minmax(0, 1fr)"})),T=s("span",{name:x,slot:"activity"})(({theme:{typography:e}})=>({blockSize:`calc(${e.caption.lineHeight} * 1em)`,display:"grid",placeItems:"center"})),A=s(u,{name:x,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"}}}),R=s("span",{name:x,slot:"chip"})(({theme:{palette:e,spacing:t}})=>({cursor:"default",display:"inline-block",whiteSpace:"nowrap","&:not(:last-of-type)::after":{color:e.text.secondary,content:'"\xb7"',display:"inline-block",marginInline:t(.75),textDecoration:"none"},'&[data-chip="failed"]':{color:e.error.main},'&[data-chip="flawed"]':{textDecoration:"line-through",textDecorationColor:e.error.main}})),z=s("span",{name:x,slot:"screenshotsLink"})(g),E=s(o,{name:x,slot:"undoButton"})(({theme:{palette:e,shape:t,spacing:n}})=>({alignItems:"center",animation:"phx-assistant-undo-in 150ms ease-out",borderRadius:t.borderRadius,color:e.primary.main,display:"inline-flex",font:"inherit",gap:n(.5),marginInlineStart:n(1),verticalAlign:"top","&:hover":{textDecoration:"underline"},"@media (prefers-reduced-motion: reduce)":{animation:"none"},"@keyframes phx-assistant-undo-in":{from:{opacity:0}}})),L=r(({tool:t})=>{let{chip:n,input:o,result:i}=t,s=h(y),r=h(b),d=h(w),c=h(C),m=h(v),u=h(D),g=p(n.label).with({kind:"text"},({text:e})=>e).with({kind:"updateDesign"},()=>s).with({kind:"readDesign"},()=>r).exhaustive(),f=l(()=>{console.info(`Assistant tool call "${g}"`,{input:o,result:i})},[o,g,i]);return e(a,{title:p(n).with({errorCode:"cancelled"},()=>c).with({errorCode:"no_result"},()=>m).with({errorCode:"tool_budget"},()=>u).with({state:"failed"},{state:"flawed"},()=>d).otherwise(()=>""),placement:"top-start",children:e(R,{onClick:f,"data-chip":n.state,children:g})})}),P=r(({screenshots:t})=>{let n=h({...S,values:{count:t.length}}),[o,s]=m(!1),r=l(()=>s(!0),[]),d=l(()=>s(!1),[]),p=c(null),u=l(e=>{p.current=e},[]),g=l(()=>{p.current?.update()},[]),k=l(e=>{("Enter"===e.key||" "===e.key)&&(e.preventDefault(),s(!0))},[]);return e(R,{"data-chip":"screenshots",children:e(i,{onClickAway:d,mouseEvent:!!o&&"onClick",touchEvent:!!o&&"onTouchEnd",children:e(a,{open:o,onOpen:r,onClose:d,title:e(f,{screenshots:t,onImageLoad:g}),placement:"top-start",describeChild:!0,disableTouchListener:!0,PopperProps:{popperRef:u},slotProps:{tooltip:{sx:{background:"none",maxInlineSize:"none",padding:0}}},children:e(z,{role:"button",tabIndex:0,"aria-expanded":o,onClick:r,onKeyDown:k,children:n})})})})}),B=({tool:o})=>{let i=d(()=>k(o.result),[o.result]);return t(n,{children:[e(L,{tool:o}),i.length>0&&e(P,{screenshots:i})]})};export const AssistantToolChips=r(({tools:n,isActive:o,canUndo:i,onUndo:a})=>{let s=h(I),r=l(()=>{a(new Set(n.map(({id:e})=>e)))},[a,n]);return t(j,{"data-chips":o?"active":"done","aria-busy":o,children:[e(T,{children:e(A,{name:"Gear"})}),t("div",{children:[n.map(t=>e(B,{tool:t},t.id)),i&&t(E,{onClick:r,children:[e(u,{name:"ArrowCounterClockwise",fontSize:"inherit"}),s]})]})]})});
+import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{ButtonBase as i,ClickAwayListener as o,Tooltip as s,styled as a}from"@mui/material";import{memo as r,useCallback as l,useMemo as d,useRef as c,useState as m}from"react";import{match as p}from"ts-pattern";import{useLocalizable as h}from"#package/react-sdk";import{PhxIcon as u}from"#package/ui-sdk";import{assistantReferenceStyles as f}from"./reference-link/index.js";import{ScreenshotThumbnails as g,readToolScreenshots as k}from"./screenshots/index.js";import{AssistantPanelName as x}from"./theme.js";let y={id:"sdk.assistant.tool.updateDesign.label",message:"Update design"},b={id:"sdk.assistant.tool.readDesign.label",message:"Read design"},w={id:"sdk.assistant.tool.mistake.hint",message:"The assistant made a mistake."},v={id:"sdk.assistant.tool.cancelled.hint",message:"Stopped before it finished."},C={id:"sdk.assistant.tool.noResult.hint",message:"The result of this step was lost. It may or may not have been done."},I={id:"sdk.assistant.tool.toolBudget.hint",message:"Not done: the assistant reached its limit of steps for one message."},S={id:"sdk.assistant.tool.undo.label",message:"Undo"},D={id:"sdk.assistant.tool.screenshots.label",message:"{count, plural, one {# screenshot} other {# screenshots}}"},j=a("div",{name:x,slot:"chips"})(({theme:{palette:e,spacing:t,typography:n}})=>({...n.caption,alignItems:"start",color:e.text.secondary,display:"grid",gap:t(.75),gridTemplateColumns:"min-content minmax(0, 1fr)"})),z=a("span",{name:x,slot:"activity"})(({theme:{typography:e}})=>({blockSize:`calc(${e.caption.lineHeight} * 1em)`,display:"grid",placeItems:"center"})),A=a(u,{name:x,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"}}}),T=a("span",{name:x,slot:"chip"})(({theme:{palette:e,spacing:t}})=>({cursor:"default",display:"inline-flex",maxInlineSize:"100%",verticalAlign:"top",whiteSpace:"nowrap","&:not(:last-of-type)::after":{color:e.text.secondary,content:'"\xb7"',flexShrink:0,marginInline:t(.75)}})),E=a("span",{name:x,slot:"screenshotsLink"})(f),L=a(i,{name:x,slot:"undoButton"})(({theme:{palette:e,shape:t,spacing:n}})=>({alignItems:"center",animation:"phx-assistant-undo-in 150ms ease-out",borderRadius:t.borderRadius,color:e.primary.main,display:"inline-flex",font:"inherit",gap:n(.5),marginInlineStart:n(1),verticalAlign:"top","&:hover":{textDecoration:"underline"},"@media (prefers-reduced-motion: reduce)":{animation:"none"},"@keyframes phx-assistant-undo-in":{from:{opacity:0}}})),R=a("span",{name:x,slot:"chipLabel"})(({theme:{palette:e}})=>({minInlineSize:0,overflow:"hidden",textOverflow:"ellipsis",'[data-chip="failed"] > &':{textDecoration:"line-through",textDecorationColor:e.error.main}})),P=a("span",{name:x,slot:"violation"})({display:"block"}),B=a("span",{name:x,slot:"fullLabel"})({display:"block"}),O=r(({tool:i})=>{let{chip:o,input:a,result:r}=i,d=h(y),u=h(b),f=h(w),g=h(v),k=h(C),x=h(I),S=c(null),[D,j]=m(!1),z=p(o.label).with({kind:"text"},({text:e})=>e).with({kind:"updateDesign"},()=>d).with({kind:"readDesign"},()=>u).exhaustive(),A=l(()=>{console.info(`Assistant tool call "${z}"`,{input:a,result:r})},[a,z,r]),E=l(()=>{let e=S.current;j(null!=e&&e.scrollWidth>e.clientWidth)},[]),L=p(o).with({errorCode:"cancelled"},()=>g).with({errorCode:"no_result"},()=>k).with({errorCode:"tool_budget"},()=>x).when(({violations:e})=>e.length>0,({violations:t})=>t.map((t,n)=>e(P,{children:t},n))).with({state:"failed"},()=>f).otherwise(()=>""),O=D?t(n,{children:[e(B,{children:z}),L]}):L;return e(s,{title:O,placement:"top-start",children:e(T,{onClick:A,onPointerEnter:E,"data-chip":o.state,children:e(R,{ref:S,children:z})})})}),U=r(({screenshots:t})=>{let n=h({...D,values:{count:t.length}}),[i,a]=m(!1),r=l(()=>a(!0),[]),d=l(()=>a(!1),[]),p=c(null),u=l(e=>{p.current=e},[]),f=l(()=>{p.current?.update()},[]),k=l(e=>{("Enter"===e.key||" "===e.key)&&(e.preventDefault(),a(!0))},[]);return e(T,{"data-chip":"screenshots",children:e(o,{onClickAway:d,mouseEvent:!!i&&"onClick",touchEvent:!!i&&"onTouchEnd",children:e(s,{open:i,onOpen:r,onClose:d,title:e(g,{screenshots:t,onImageLoad:f}),placement:"top-start",describeChild:!0,disableTouchListener:!0,PopperProps:{popperRef:u},slotProps:{tooltip:{sx:{background:"none",maxInlineSize:"none",padding:0}}},children:e(E,{role:"button",tabIndex:0,"aria-expanded":i,onClick:r,onKeyDown:k,children:n})})})})}),W=({tool:i})=>{let o=d(()=>k(i.result),[i.result]);return t(n,{children:[e(O,{tool:i}),o.length>0&&e(U,{screenshots:o})]})};export const AssistantToolChips=r(({tools:n,isActive:i,canUndo:o,onUndo:s})=>{let a=h(S),r=l(()=>{s(new Set(n.map(({id:e})=>e)))},[s,n]);return t(j,{"data-chips":i?"active":"done","aria-busy":i,children:[e(z,{children:e(A,{name:"Gear"})}),t("div",{children:[n.map(t=>e(W,{tool:t},t.id)),o&&t(L,{onClick:r,children:[e(u,{name:"ArrowCounterClockwise",fontSize:"inherit"}),a]})]})]})});

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

@@ -1,11 +1,14 @@
 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
- * the assistant usually just asks again.
+ * How a tool call of the assistant looks in the thread: still running, finished, or gone wrong
+ * (`failed`): a change that was not kept, or a read that answered with errors. Both look the same,
+ * since the reply says what came of them.
+ */
+export type AssistantToolChipState = 'running' | 'done' | 'failed';
+/**
+ * What a tool chip is called: the title or the operation names the model gave, a fixed text, or the
+ * tool's name.
  */
-export type AssistantToolChipState = 'running' | 'done' | 'failed' | 'flawed';
-/** What a tool chip is called: the operation names the model gave, a fixed text, or the tool's name. */
 export type AssistantToolChipLabel = {
     readonly kind: 'text';
     readonly text: string;
@@ -22,6 +25,12 @@ export interface AssistantToolChip {
      * panel knows. Nothing for a call that went wrong for any other reason.
      */
     readonly errorCode: AssistantToolErrorCode | undefined;
+    /**
+     * The messages of the violations a failed call failed on, written for the user, in result order.
+     * Empty for a call that did not fail, that failed for any other reason, or whose violations have
+     * no message.
+     */
+    readonly violations: readonly string[];
 }
 /** A tool call of a message as the chip reads it. */
 export interface AssistantToolCall {
@@ -36,9 +45,10 @@ export interface AssistantToolCall {
     readonly isReplyRunning: boolean;
 }
 /**
- * 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 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.
+ * Describes one tool call for its chip: the label in the order title, 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 part of it only as the code of an error the server recorded, or as the
+ * messages of the violations it failed on, which are written for the user: the rest of a tool result
+ * is worded for the model.
  */
 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{ASSISTANT_TOOL_ERROR_CODES as r,AssistantToolError as a,applyTool as s,queryTool as o}from"@salsita-ai/contracts/assistant";let i=n.object({operations:n.array(n.object({query:n.string(),operationName:n.string().nullish()}))}),l=n.object({results:n.array(n.object({errors:n.array(n.unknown()).optional()})),committed:n.boolean()}),u=n.tuple([n.object({type:n.literal("text"),content:n.string()})]).rest(n.unknown());export const describeToolCall=n=>{let d=(({name:n,input:r})=>{let a,l=(a=i.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 l.length>0?{kind:"text",text:l.join(", ")}:n===s.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 c=(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!==s.name&&e!==o.name)return"done";let a=l.safeParse((e=>{let t=u.safeParse(e);if(!t.success)return e;try{return JSON.parse(t.data[0].content)}catch{return e}})(t));if(!a.success)return e===o.name?"flawed":"failed";let{results:i,committed:d}=a.data;return e===s.name?d?"done":"failed":i.some(({errors:e})=>(e?.length??0)>0)||0===i.length?"flawed":"done"})(n,c),errorCode:c}};
+import{Kind as e,parse as t}from"graphql";import{z as r}from"zod";import{ASSISTANT_TOOL_ERROR_CODES as a,AssistantToolError as n,applyTool as s,queryTool as i}from"@salsita-ai/contracts/assistant";let l=r.object({title:r.string().nullish().catch(void 0),operations:r.array(r.object({query:r.string(),operationName:r.string().nullish()}))}),o=r.object({results:r.array(r.object({errors:r.array(r.unknown()).optional()})),committed:r.boolean()}),u=r.tuple([r.object({type:r.literal("text"),content:r.string()})]).rest(r.unknown()),d=e=>{let t=u.safeParse(e);if(!t.success)return e;try{return JSON.parse(t.data[0].content)}catch{return e}},c=r.object({message:r.string(),extensions:r.object({code:r.literal("VIOLATION"),type:r.string()})});export const describeToolCall=r=>{var u;let f,m=(({name:r,input:a})=>{let n,o,u=(n=l.safeParse(a)).success&&n.data.title?.trim()||void 0;if(null!=u)return{kind:"text",text:u};let d=(o=l.safeParse(a)).success?o.data.operations.flatMap(({query:r,operationName:a})=>a??(r=>{try{let a=t(r).definitions.find(t=>t.kind===e.OPERATION_DEFINITION);return a?.kind===e.OPERATION_DEFINITION?a.name?.value:void 0}catch{return}})(r)??[]):[];return d.length>0?{kind:"text",text:d.join(", ")}:r===s.name?{kind:"updateDesign"}:r===i.name?{kind:"readDesign"}:{kind:"text",text:r}})(r);if(null==r.result&&null==r.error)return{label:m,state:r.isReplyRunning?"running":"done",errorCode:void 0,violations:[]};let p=(e=>{let t=n.safeParse(e);if(t.success)return a.find(e=>e===t.data.code)})(r.result),g=(({name:e,result:t,error:r},a)=>{if(null!=r||null!=a)return"failed";if(e!==s.name&&e!==i.name)return"done";let n=o.safeParse(d(t));if(!n.success)return"failed";let{results:l,committed:u}=n.data;return e===s.name?u?"done":"failed":l.some(({errors:e})=>(e?.length??0)>0)||0===l.length?"failed":"done"})(r,p);return{label:m,state:g,errorCode:p,violations:"failed"===g?(u=r.result,(f=o.safeParse(d(u))).success?f.data.results.flatMap(({errors:e})=>(e??[]).flatMap(e=>{let t=c.safeParse(e);return t.success&&t.data.message!==t.data.extensions.type?[t.data.message]:[]})):[]):[]}};

package/dist/configurator/ui/configurator-layout/slots/canvas/GPUAccelerationDisabled.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Trans as i}from"@lingui/react";import{Button as t,Typography as o,styled as s}from"@mui/material";import{PhxIcon as a}from"#package/ui-sdk";import{useConfiguratorRouting as n}from"../../../../configurator-context/index.js";let c=s("div")(({theme:{spacing:e}})=>({display:"grid",minBlockSize:"100cqb",padding:e(2),placeItems:"center",position:"relative"})),m=s("div")({maxInlineSize:"80ch",textAlign:"center",textWrap:"pretty"});export const GPUAccelerationDisabled=()=>{let{goToIndex:s}=n();return e(c,{children:r(m,{children:[e(a,{name:"CubeDuotone",sx:{fontSize:48}}),e(o,{component:"h1",variant:"h4",sx:{my:4},children:e(i,{id:"sdk.messages.error.gpuDisabled.title",message:"GPU acceleration disabled"})}),e(o,{color:"text.secondary",children:e(i,{id:"sdk.messages.error.gpuDisabled.message",message:"Your browser has GPU acceleration disabled, which prevents the configurator from working correctly. 3D performance is severely impacted. Enabled this option in your browser settings to use the configurator."})}),e(t,{variant:"text",color:"primary",size:"large",sx:{mt:6.5},onClick:s,children:e(i,{id:"sdk.messages.navigation.goToHomepage.label",message:"Go To Homepage"})})]})})};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Trans as i}from"@lingui/react";import{Button as a,Typography as t,styled as s}from"@mui/material";import{useConfiguratorRouting as o}from"#package/react-sdk";import{PhxIcon as n}from"#package/ui-sdk";let c=s("div")(({theme:{spacing:e}})=>({display:"grid",minBlockSize:"100cqb",padding:e(2),placeItems:"center",position:"relative"})),m=s("div")({maxInlineSize:"80ch",textAlign:"center",textWrap:"pretty"});export const GPUAccelerationDisabled=()=>{let{goToIndex:s}=o();return e(c,{children:r(m,{children:[e(n,{name:"CubeDuotone",sx:{fontSize:48}}),e(t,{component:"h1",variant:"h4",sx:{my:4},children:e(i,{id:"sdk.messages.error.gpuDisabled.title",message:"GPU acceleration disabled"})}),e(t,{color:"text.secondary",children:e(i,{id:"sdk.messages.error.gpuDisabled.message",message:"Your browser has GPU acceleration disabled, which prevents the configurator from working correctly. 3D performance is severely impacted. Enabled this option in your browser settings to use the configurator."})}),e(a,{variant:"text",color:"primary",size:"large",sx:{mt:6.5},onClick:s,children:e(i,{id:"sdk.messages.navigation.goToHomepage.label",message:"Go To Homepage"})})]})})};

package/dist/configurator/ui/configurator-layout/slots/canvas/WebGLNotSupported.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Trans as o}from"@lingui/react";import{Button as t,Typography as i,styled as s}from"@mui/material";import{PhxIcon as a}from"#package/ui-sdk";import{useConfiguratorRouting as n}from"../../../../configurator-context/index.js";let m=s("div")(({theme:{spacing:e}})=>({display:"grid",minBlockSize:"100cqb",padding:e(2),placeItems:"center",position:"relative"})),d=s("div")({maxInlineSize:"80ch",textAlign:"center",textWrap:"pretty"});export const WebGLNotSupported=()=>{let{goToIndex:s}=n();return e(m,{children:r(d,{children:[e(a,{name:"CubeDuotone",sx:{fontSize:48}}),e(i,{component:"h1",variant:"h4",sx:{my:4},children:e(o,{id:"sdk.messages.error.webglNotSupported.title",message:"WebGL is not supported or cannot be initialized"})}),e(i,{color:"text.secondary",children:e(o,{id:"sdk.messages.error.webglNotSupported.message",message:"Your device or browser does not support WebGL, which is required for the configurator to function. Try a different browser or device that supports WebGL"})}),e(t,{variant:"text",color:"primary",size:"large",sx:{mt:6.5},onClick:s,children:e(o,{id:"sdk.messages.navigation.goToHomepage.label",message:"Go To Homepage"})})]})})};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Trans as t}from"@lingui/react";import{Button as o,Typography as i,styled as s}from"@mui/material";import{useConfiguratorRouting as a}from"#package/react-sdk";import{PhxIcon as n}from"#package/ui-sdk";let m=s("div")(({theme:{spacing:e}})=>({display:"grid",minBlockSize:"100cqb",padding:e(2),placeItems:"center",position:"relative"})),d=s("div")({maxInlineSize:"80ch",textAlign:"center",textWrap:"pretty"});export const WebGLNotSupported=()=>{let{goToIndex:s}=a();return e(m,{children:r(d,{children:[e(n,{name:"CubeDuotone",sx:{fontSize:48}}),e(i,{component:"h1",variant:"h4",sx:{my:4},children:e(t,{id:"sdk.messages.error.webglNotSupported.title",message:"WebGL is not supported or cannot be initialized"})}),e(i,{color:"text.secondary",children:e(t,{id:"sdk.messages.error.webglNotSupported.message",message:"Your device or browser does not support WebGL, which is required for the configurator to function. Try a different browser or device that supports WebGL"})}),e(o,{variant:"text",color:"primary",size:"large",sx:{mt:6.5},onClick:s,children:e(t,{id:"sdk.messages.navigation.goToHomepage.label",message:"Go To Homepage"})})]})})};

package/dist/configurator/ui/configurator-layout/slots/readonly-banner/CloneToEditDialog.js

@@ -1 +1 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Trans as o}from"@lingui/react";import{Button as n,DialogActions as r,DialogContent as i,DialogContentText as t,DialogTitle as l,Dialog as c,dialogClasses as s,styled as d}from"@mui/material";import{useMutation as m}from"@tanstack/react-query";import{useCallback as u}from"react";import{useAuthorizedClient as p,useConfigurationId as g,useDomainApplication as f}from"#package/react-sdk";import{LoadingButton as k}from"#package/ui-sdk";import{useConfiguratorRouting as y}from"../../../../configurator-context/index.js";let h=d(c)(()=>({[`.${s.paper}`]:{inlineSize:"min(480px, 100%)",maxWidth:"unset"}}));export const CloneToEditDialog=c=>{let{onClose:s,open:d}=c,{goToConfigurationDetail:b}=y(),x=p(),C=g(),{configurationPersistSystem:j}=f(),{mutate:v,isPending:T}=m({mutationFn:()=>x.cloneConfiguration(C,j.revisionId$.value),onSuccess:e=>{s(),b(e.configurationId,e.accessToken)}}),D=u(()=>{v()},[v]);return a(h,{open:d,onClose:s,children:[e(l,{children:e(o,{id:"sdk.layout.banner.readonly.clone.title",message:"Edit configuration"})}),e(i,{children:e(t,{children:e(o,{id:"sdk.layout.banner.readonly.clone.message",message:"You're about to create an editable copy of this setup. Changes you make won't affect the original shared link."})})}),a(r,{children:[e(n,{variant:"text",color:"inherit",onClick:s,children:e(o,{id:"sdk.layout.banner.readonly.cancel.label",message:"Cancel"})}),e(k,{variant:"contained",color:"primary",busy:T,onClick:D,children:e(o,{id:"sdk.layout.banner.readonly.clone.label",message:"Create editable copy"})})]})]})};
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Trans as n}from"@lingui/react";import{Button as o,DialogActions as r,DialogContent as i,DialogContentText as t,DialogTitle as l,Dialog as s,dialogClasses as c,styled as d}from"@mui/material";import{useMutation as m}from"@tanstack/react-query";import{useCallback as u}from"react";import{useAuthorizedClient as p,useConfigurationId as g,useConfiguratorRouting as k,useDomainApplication as y}from"#package/react-sdk";import{LoadingButton as f}from"#package/ui-sdk";let h=d(s)(()=>({[`.${c.paper}`]:{inlineSize:"min(480px, 100%)",maxWidth:"unset"}}));export const CloneToEditDialog=s=>{let{onClose:c,open:d}=s,{goToConfigurationDetail:b}=k(),C=p(),x=g(),{configurationPersistSystem:v}=y(),{mutate:j,isPending:T}=m({mutationFn:()=>C.cloneConfiguration(x,v.revisionId$.value),onSuccess:e=>{c(),b(e.configurationId,e.accessToken)}}),D=u(()=>{j()},[j]);return a(h,{open:d,onClose:c,children:[e(l,{children:e(n,{id:"sdk.layout.banner.readonly.clone.title",message:"Edit configuration"})}),e(i,{children:e(t,{children:e(n,{id:"sdk.layout.banner.readonly.clone.message",message:"You're about to create an editable copy of this setup. Changes you make won't affect the original shared link."})})}),a(r,{children:[e(o,{variant:"text",color:"inherit",onClick:c,children:e(n,{id:"sdk.layout.banner.readonly.cancel.label",message:"Cancel"})}),e(f,{variant:"contained",color:"primary",busy:T,onClick:D,children:e(n,{id:"sdk.layout.banner.readonly.clone.label",message:"Create editable copy"})})]})]})};

package/dist/configurator/ui/legacy/chat/MobileChat.js

@@ -1 +1 @@
-import{jsx as a,jsxs as r,Fragment as o}from"react/jsx-runtime";import{useCallback as t,useState as e}from"react";import{useLocalizable as i}from"#package/react-sdk";import{ExperimentalChatUi as n,MobileChat as m}from"#package/ui-sdk";import{useChatEnabled as l}from"../../../configurator-context/index.js";import{Chat as s}from"./Chat.js";export const MobileChat=c=>{let{icon:p,label:h,heading:d}=c,[f,g]=e(!1),u=l(),x=i(h),b=t(()=>{g(!0)},[]),j=t(()=>{g(!1)},[]);return u?r(o,{children:[a(m.Button,{icon:p,ariaLabel:x,handleOpen:b}),a(m.Dialog,{isOpen:f,handleClose:j,heading:d,children:a(n.ChatRoot,{variant:"mobile",children:a(s,{variant:"mobile"})})})]}):null};
+import{jsx as a,jsxs as e,Fragment as r}from"react/jsx-runtime";import{useCallback as t,useState as o}from"react";import{useChatEnabled as i,useLocalizable as n}from"#package/react-sdk";import{ExperimentalChatUi as l,MobileChat as m}from"#package/ui-sdk";import{Chat as s}from"./Chat.js";export const MobileChat=c=>{let{icon:h,label:p,heading:d}=c,[b,f]=o(!1),g=i(),u=n(p),C=t(()=>{f(!0)},[]),j=t(()=>{f(!1)},[]);return g?e(r,{children:[a(m.Button,{icon:h,ariaLabel:u,handleOpen:C}),a(m.Dialog,{isOpen:b,handleClose:j,heading:d,children:a(l.ChatRoot,{variant:"mobile",children:a(s,{variant:"mobile"})})})]}):null};

package/dist/configurator/ui/legacy/layout/common/CommonTopNavigation.js

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import{Trans as r}from"@lingui/react";import{Button as t}from"@mui/material";import{memo as e,useCallback as i}from"react";import{FrontendAnalyticsFactory as a,useAnalyticsService as m,useIntegrationState as n}from"#package/react-sdk";import{PhxIcon as s}from"#package/ui-sdk";import{useConfiguratorRouting as c,usePresetSelection as l,usePreview as p}from"../../../../configurator-context/index.js";import{CloseConfiguratorButton as d}from"./CloseConfiguratorButton.js";export const CommonTopNavigation=e(()=>{let e=m(),f=c(),{presetCategories:u}=l(),{isPreview:g,isPreviewEnabled:k}=p(),x=u.flatMap(o=>o.presets).length>1,C=n(),j=i(()=>{e.push(a.GoToProductsClicked()),f.goToIndex()},[e,f]);if(!C.embeddedView)return x||!k||g?x?o(t,{size:"small",startIcon:o(s,{name:"ArrowLeft"}),onClick:j,children:o(r,{id:"sdk.layout.navigation.common.product.label",message:"Website"})}):null:o(d,{})});
+import{jsx as o}from"react/jsx-runtime";import{Trans as r}from"@lingui/react";import{Button as t}from"@mui/material";import{memo as e,useCallback as i}from"react";import{FrontendAnalyticsFactory as a,useAnalyticsService as m,useConfiguratorRouting as n,useIntegrationState as s}from"#package/react-sdk";import{PhxIcon as c}from"#package/ui-sdk";import{usePresetSelection as l,usePreview as p}from"../../../../configurator-context/index.js";import{CloseConfiguratorButton as d}from"./CloseConfiguratorButton.js";export const CommonTopNavigation=e(()=>{let e=m(),f=n(),{presetCategories:u}=l(),{isPreview:g,isPreviewEnabled:k}=p(),x=u.flatMap(o=>o.presets).length>1,C=s(),j=i(()=>{e.push(a.GoToProductsClicked()),f.goToIndex()},[e,f]);if(!C.embeddedView)return x||!k||g?x?o(t,{size:"small",startIcon:o(c,{name:"ArrowLeft"}),onClick:j,children:o(r,{id:"sdk.layout.navigation.common.product.label",message:"Website"})}):null:o(d,{})});

package/dist/configurator/ui/legacy/layout/simple/SimpleSidebar.js

@@ -1 +1 @@
-import{jsx as t,jsxs as o}from"react/jsx-runtime";import{AnimatePresence as e,motion as r}from"motion/react";import{AnimationTarget as m,Sidebar as i}from"#package/ui-sdk";import{useChatEnabled as a}from"../../../../configurator-context/index.js";import{ChatInteractionContainer as n}from"../../chat/ChatInteractionContainer.js";import{CommonFinalizeButton as c}from"../common/CommonFinalizeButton.js";import{CommonSidebarFooter as s}from"../common/CommonSidebarFooter.js";import{DesktopSummaryButton as u}from"../common/DesktopSummaryButton.js";import{SimpleSidebarContent as p}from"./SimpleSidebarContent.js";let d={transition:{type:"spring",duration:.3},variants:{initial:{opacity:0,y:16},animate:{opacity:1,y:0},exit:{opacity:0,y:16}}};export const SimpleSidebar=l=>{let{summaryPage:y,customPriceNode:f,onEnterSummary:S,onLeaveSummary:h,price:B,isSummaryActive:j,hasSummary:v}=l,x=a();return t(i.Layout,{content:t(p,{isSummaryActive:j,summaryPage:y,onLeaveSummary:h}),chat:x&&t(n,{}),footer:o(e,{initial:!1,mode:"wait",children:[!v&&t(s,{customPriceNode:f,formattedPrice:B,actionButton:t(c,{}),showTemplateButton:!0,showSaveTemplateButton:!0}),v&&!j&&t(r.div,{...d,...m,children:t(s,{customPriceNode:f,actionButton:t(u,{onEnterSummary:S}),formattedPrice:B,showSaveTemplateButton:!1})},"sidebarFooterSummary"),v&&j&&t(r.div,{...d,...m,children:t(s,{customPriceNode:f,actionButton:t(c,{}),formattedPrice:B,showTemplateButton:!0,showSaveTemplateButton:!0})},"sidebarFooterSummary")]})})};
+import{jsx as t,jsxs as o}from"react/jsx-runtime";import{AnimatePresence as e,motion as r}from"motion/react";import{useChatEnabled as m}from"#package/react-sdk";import{AnimationTarget as a,Sidebar as i}from"#package/ui-sdk";import{ChatInteractionContainer as n}from"../../chat/ChatInteractionContainer.js";import{CommonFinalizeButton as c}from"../common/CommonFinalizeButton.js";import{CommonSidebarFooter as s}from"../common/CommonSidebarFooter.js";import{DesktopSummaryButton as p}from"../common/DesktopSummaryButton.js";import{SimpleSidebarContent as u}from"./SimpleSidebarContent.js";let d={transition:{type:"spring",duration:.3},variants:{initial:{opacity:0,y:16},animate:{opacity:1,y:0},exit:{opacity:0,y:16}}};export const SimpleSidebar=l=>{let{summaryPage:y,customPriceNode:S,onEnterSummary:f,onLeaveSummary:h,price:B,isSummaryActive:j,hasSummary:v}=l,P=m();return t(i.Layout,{content:t(u,{isSummaryActive:j,summaryPage:y,onLeaveSummary:h}),chat:P&&t(n,{}),footer:o(e,{initial:!1,mode:"wait",children:[!v&&t(s,{customPriceNode:S,formattedPrice:B,actionButton:t(c,{}),showTemplateButton:!0,showSaveTemplateButton:!0}),v&&!j&&t(r.div,{...d,...a,children:t(s,{customPriceNode:S,actionButton:t(p,{onEnterSummary:f}),formattedPrice:B,showSaveTemplateButton:!1})},"sidebarFooterSummary"),v&&j&&t(r.div,{...d,...a,children:t(s,{customPriceNode:S,actionButton:t(c,{}),formattedPrice:B,showTemplateButton:!0,showSaveTemplateButton:!0})},"sidebarFooterSummary")]})})};

package/dist/configurator/ui/legacy/layout/simple/SimpleTopNavigation.js

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import{Trans as r}from"@lingui/react";import{Button as t}from"@mui/material";import{memo as e,useCallback as i}from"react";import{FrontendAnalyticsFactory as a,useAnalyticsService as m,usePresetEmbeddedState as s}from"#package/react-sdk";import{PhxIcon as n}from"#package/ui-sdk";import{useConfiguratorRouting as l,usePresetSelection as p,usePreview as c}from"../../../../configurator-context/index.js";import{CloseConfiguratorButton as f}from"../common/CloseConfiguratorButton.js";export const SimpleMobileTopNavigation=e(()=>{let e=m(),u=l(),{presetCategories:d}=p(),{isPreview:g,isPreviewEnabled:k}=c(),x=d.flatMap(o=>o.presets).length>1,b=i(()=>{e.push(a.GoToProductsClicked()),u.goToIndex()},[e,u]);if(!s())return x||g||!k?x?o(t,{size:"small",startIcon:o(n,{name:"ArrowLeft"}),onClick:b,children:o(r,{id:"sdk.layout.navigation.mobile.product.label",message:"Website"})}):null:o(f,{})});
+import{jsx as o}from"react/jsx-runtime";import{Trans as r}from"@lingui/react";import{Button as t}from"@mui/material";import{memo as e,useCallback as i}from"react";import{FrontendAnalyticsFactory as a,useAnalyticsService as m,useConfiguratorRouting as s,usePresetEmbeddedState as n}from"#package/react-sdk";import{PhxIcon as l}from"#package/ui-sdk";import{usePresetSelection as p,usePreview as c}from"../../../../configurator-context/index.js";import{CloseConfiguratorButton as f}from"../common/CloseConfiguratorButton.js";export const SimpleMobileTopNavigation=e(()=>{let e=m(),u=s(),{presetCategories:d}=p(),{isPreview:g,isPreviewEnabled:k}=c(),x=d.flatMap(o=>o.presets).length>1,b=i(()=>{e.push(a.GoToProductsClicked()),u.goToIndex()},[e,u]);if(!n())return x||g||!k?x?o(t,{size:"small",startIcon:o(l,{name:"ArrowLeft"}),onClick:b,children:o(r,{id:"sdk.layout.navigation.mobile.product.label",message:"Website"})}):null:o(f,{})});

package/dist/configurator/ui/legacy/layout/steps/StepsNavigation.js

@@ -1 +1 @@
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{Trans as a}from"@lingui/react";import{memo as i,useCallback as o}from"react";import{FrontendAnalyticsFactory as s,useActiveNavigationState as n,useAnalyticsService as r,useDomain as p,usePresetEmbeddedState as c,useResolveLocalizable as l}from"#package/react-sdk";import{TopNavigation as d,useResponsive as m}from"#package/ui-sdk";import{useConfiguratorRouting as g,usePresetSelection as u}from"../../../../configurator-context/index.js";export const StepsNavigation=i(i=>{let{steps:f}=i,k=r(),{navigationSystem:v,storeSystem:x}=p(),h=n(),C=g(),S=l(),{presetCategories:T}=u(),j=c(),N=T.flatMap(t=>t.presets).length>1,b=!j&&N,I=f.findIndex(t=>t.navigationStates.includes(h))+ +!!b,{isTablet:P}=m(),y=o(()=>{k.push(s.GoToProductsClicked()),C.goToIndex()},[k,C]);return e(d.Root,{activeStep:I,nonLinear:!0,compact:P,fullWidth:!0,children:[b&&t(d.Step,{isCompleted:!0,onClick:y,compact:P,children:t(a,{id:"sdk.layout.navigation.steps.first.label",message:"Products"})}),f.map((e,a)=>{let i=b?a<I-1:a<I,o=S(e.label);return t(d.Step,{isCompleted:i,isDisabled:!i,compact:P,onClick:()=>{let t=e.navigationStates[0];t&&(k.push(s.TopNavigationStepClicked(t)),x.stageAndCommit([v.getNavigationUpdate(t)]))},children:o},o)})]})});
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{Trans as a}from"@lingui/react";import{memo as i,useCallback as o}from"react";import{FrontendAnalyticsFactory as s,useActiveNavigationState as n,useAnalyticsService as r,useConfiguratorRouting as p,useDomain as c,usePresetEmbeddedState as l,useResolveLocalizable as d}from"#package/react-sdk";import{TopNavigation as m,useResponsive as g}from"#package/ui-sdk";import{usePresetSelection as u}from"../../../../configurator-context/index.js";export const StepsNavigation=i(i=>{let{steps:f}=i,k=r(),{navigationSystem:v,storeSystem:x}=c(),h=n(),C=p(),S=d(),{presetCategories:T}=u(),j=l(),N=T.flatMap(t=>t.presets).length>1,b=!j&&N,I=f.findIndex(t=>t.navigationStates.includes(h))+ +!!b,{isTablet:P}=g(),y=o(()=>{k.push(s.GoToProductsClicked()),C.goToIndex()},[k,C]);return e(m.Root,{activeStep:I,nonLinear:!0,compact:P,fullWidth:!0,children:[b&&t(m.Step,{isCompleted:!0,onClick:y,compact:P,children:t(a,{id:"sdk.layout.navigation.steps.first.label",message:"Products"})}),f.map((e,a)=>{let i=b?a<I-1:a<I,o=S(e.label);return t(m.Step,{isCompleted:i,isDisabled:!i,compact:P,onClick:()=>{let t=e.navigationStates[0];t&&(k.push(s.TopNavigationStepClicked(t)),x.stageAndCommit([v.getNavigationUpdate(t)]))},children:o},o)})]})});

package/dist/configurator/ui/legacy/layout/steps/StepsOwnerLayout.js

@@ -1 +1 @@
-import{jsx as o,jsxs as t,Fragment as e}from"react/jsx-runtime";import{useCallback as a,useMemo as i}from"react";import{customPriceFooterComponent as n,navigationStepsComponent as r,sidebarTabsComponent as s}from"#package/domain";import{useActiveNavigationState as m,useComponents as l,useDomain as p,useFirstRootComponent as c,usePresetEmbeddedState as f,useResolveLocalizable as d,useRootEntityPrice as g,useSelectedDomainEntityId as u,useStoreSelector as v}from"#package/react-sdk";import{MobileControls as b}from"#package/ui-sdk";import{useConfiguratorRouting as j,usePresetSelection as S}from"../../../../configurator-context/index.js";import{LayoutSlots as x}from"../../../configurator-layout/index.js";import{LayoutDialog as C}from"../../../phoenix-layout-elements/LayoutDialog.js";import{LayoutFooter as y,LayoutToolbarDesktop as k,LayoutToolbarDesktopFullScreen as T}from"../../../phoenix-layout-elements/index.js";import{SaveMessageSnackbars as I}from"../../../save-message-snackbars/index.js";import{FullscreenDesktopToolbar as h}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CommonDesktopToolbar as N}from"../common/CommonDesktopToolbar.js";import{CommonFinalizePage as w}from"../common/CommonFinalizePage.js";import{DefaultViewOnlyMessage as A}from"../common/DefaultViewOnlyMessage.js";import{InvariantViolations as D}from"../common/InvariantViolations.js";import{ReactiveInterfaceLayout as E}from"../common/ReactiveInterfaceLayout.js";import{SideEffects as L}from"../common/SideEffects.js";import{ToolControls as M}from"../common/ToolControls.js";import{ViewControls as P}from"../common/ViewControls.js";import{StepsNavigation as V}from"./StepsNavigation.js";import{StepsSideBar as F}from"./StepsSideBar.js";export const StepsOwnerLayout=()=>{let{storeSystem:O,navigationSystem:B}=p(),H=d(),R=m(),U=u(),z=c(r),$=c(n),q=l({componentTypes:[s],entityIds:[U]}),G=i(()=>z?.state.steps??[],[z]),J=i(()=>(q??[]).flatMap(o=>o.state.tabs).map(o=>{let t=o.navigationStates[0];if(!t)throw Error(`Tab ${t} has no navigation states!`);return{label:H(o.label),icon:o.icon,value:t,isActive:o.navigationStates.includes(R)}}),[q,R,H]),K=i(()=>{let o=J.find(o=>o.isActive);return o?.value??"none"},[J]),Q=v(o=>U===o.state.rootEntityId,[U]),W=g(),X=j(),{presetCategories:Y}=S(),Z=f(),_=Y.flatMap(o=>o.presets).length>1,oo=!Z&&_,ot=a(()=>{let o=G.findIndex(o=>o.navigationStates.includes(R)),t=G[o-1];if(!t){oo&&X.goToIndex();return}let e=t.navigationStates[0];e&&O.stageAndCommit([B.getNavigationUpdate(e)])},[B,R,G,oo,X,O]),oe=a(()=>{let o=G.findIndex(o=>o.navigationStates.includes(R)),t=G[o+1];if(!t)return;let e=t.navigationStates[0];e&&O.stageAndCommit([B.getNavigationUpdate(e)])},[B,R,G,O]),oa=i(()=>G.findIndex(o=>o.navigationStates.includes(R))===G.length-1,[G,R]);return o(E,{canvas:o(x.Canvas,{}),sidebar:o(F,{price:W,tabs:J,activeTab:K,isRootPage:Q,customPriceNode:$?.state.node,isLastStep:oa,onNextStepClick:oe,onPreviousStepClick:ot}),viewControls:o(P,{}),toolControls:o(M,{}),topNavigation:o(V,{steps:G}),branding:null,toolbar:o(k,{defaultSlot:()=>o(N,{})}),fullScreenToolbar:o(T,{defaultSlot:()=>o(h,{})}),overlay:t(e,{children:[o(D,{}),o(I,{}),o(w,{}),o(C,{})]}),mobileControls:o(b.ViewOnlyMode,{message:o(A,{})}),mobileTopNavigation:null,mobileHeaderActionButton:null,mobileHeaderCenter:null,sideEffects:o(L,{}),footer:o(y,{})})};
+import{jsx as o,jsxs as t,Fragment as e}from"react/jsx-runtime";import{useCallback as a,useMemo as i}from"react";import{customPriceFooterComponent as n,navigationStepsComponent as r,sidebarTabsComponent as s}from"#package/domain";import{useActiveNavigationState as m,useComponents as l,useConfiguratorRouting as p,useDomain as c,useFirstRootComponent as f,usePresetEmbeddedState as d,useResolveLocalizable as g,useRootEntityPrice as u,useSelectedDomainEntityId as v,useStoreSelector as b}from"#package/react-sdk";import{MobileControls as j}from"#package/ui-sdk";import{usePresetSelection as S}from"../../../../configurator-context/index.js";import{LayoutSlots as x}from"../../../configurator-layout/index.js";import{LayoutDialog as C}from"../../../phoenix-layout-elements/LayoutDialog.js";import{LayoutFooter as y,LayoutToolbarDesktop as k,LayoutToolbarDesktopFullScreen as T}from"../../../phoenix-layout-elements/index.js";import{SaveMessageSnackbars as I}from"../../../save-message-snackbars/index.js";import{FullscreenDesktopToolbar as h}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CommonDesktopToolbar as N}from"../common/CommonDesktopToolbar.js";import{CommonFinalizePage as w}from"../common/CommonFinalizePage.js";import{DefaultViewOnlyMessage as A}from"../common/DefaultViewOnlyMessage.js";import{InvariantViolations as D}from"../common/InvariantViolations.js";import{ReactiveInterfaceLayout as E}from"../common/ReactiveInterfaceLayout.js";import{SideEffects as L}from"../common/SideEffects.js";import{ToolControls as M}from"../common/ToolControls.js";import{ViewControls as P}from"../common/ViewControls.js";import{StepsNavigation as V}from"./StepsNavigation.js";import{StepsSideBar as F}from"./StepsSideBar.js";export const StepsOwnerLayout=()=>{let{storeSystem:O,navigationSystem:B}=c(),H=g(),R=m(),U=v(),z=f(r),$=f(n),q=l({componentTypes:[s],entityIds:[U]}),G=i(()=>z?.state.steps??[],[z]),J=i(()=>(q??[]).flatMap(o=>o.state.tabs).map(o=>{let t=o.navigationStates[0];if(!t)throw Error(`Tab ${t} has no navigation states!`);return{label:H(o.label),icon:o.icon,value:t,isActive:o.navigationStates.includes(R)}}),[q,R,H]),K=i(()=>{let o=J.find(o=>o.isActive);return o?.value??"none"},[J]),Q=b(o=>U===o.state.rootEntityId,[U]),W=u(),X=p(),{presetCategories:Y}=S(),Z=d(),_=Y.flatMap(o=>o.presets).length>1,oo=!Z&&_,ot=a(()=>{let o=G.findIndex(o=>o.navigationStates.includes(R)),t=G[o-1];if(!t){oo&&X.goToIndex();return}let e=t.navigationStates[0];e&&O.stageAndCommit([B.getNavigationUpdate(e)])},[B,R,G,oo,X,O]),oe=a(()=>{let o=G.findIndex(o=>o.navigationStates.includes(R)),t=G[o+1];if(!t)return;let e=t.navigationStates[0];e&&O.stageAndCommit([B.getNavigationUpdate(e)])},[B,R,G,O]),oa=i(()=>G.findIndex(o=>o.navigationStates.includes(R))===G.length-1,[G,R]);return o(E,{canvas:o(x.Canvas,{}),sidebar:o(F,{price:W,tabs:J,activeTab:K,isRootPage:Q,customPriceNode:$?.state.node,isLastStep:oa,onNextStepClick:oe,onPreviousStepClick:ot}),viewControls:o(P,{}),toolControls:o(M,{}),topNavigation:o(V,{steps:G}),branding:null,toolbar:o(k,{defaultSlot:()=>o(N,{})}),fullScreenToolbar:o(T,{defaultSlot:()=>o(h,{})}),overlay:t(e,{children:[o(D,{}),o(I,{}),o(w,{}),o(C,{})]}),mobileControls:o(j.ViewOnlyMode,{message:o(A,{})}),mobileTopNavigation:null,mobileHeaderActionButton:null,mobileHeaderCenter:null,sideEffects:o(L,{}),footer:o(y,{})})};

package/dist/configurator/ui/legacy/layout/steps/StepsSideBar.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{AnimatePresence as e}from"motion/react";import{memo as o,useCallback as r}from"react";import{useDomain as a}from"#package/react-sdk";import{Sidebar as i,TabNavigation as m}from"#package/ui-sdk";import{useChatEnabled as n}from"../../../../configurator-context/index.js";import{ChatInteractionContainer as p}from"../../chat/ChatInteractionContainer.js";import{PropertyPagePanel as s}from"../../property-page/PropertyPagePanel.js";import{StepsSidebarFooter as c}from"./StepsSidebarFooter.js";export const StepsSideBar=o(o=>{let{price:d,activeTab:f,tabs:g,isRootPage:l,customPriceNode:u,isLastStep:h,onNextStepClick:P,onPreviousStepClick:S}=o,j=n(),{navigationSystem:k,storeSystem:x}=a(),C=r(t=>{x.stageAndCommit([k.getNavigationUpdate(t)])},[k,x]);return t(i.Layout,{header:null,content:t(s,{isRootPage:l}),footer:t(e,{initial:!1,mode:"wait",children:t(c,{customPriceNode:u,formattedPrice:d,isLastStep:h,onNextStepClick:P,onPreviousStepClick:S})}),chat:j&&t(p,{}),aside:g.length>1&&t(m,{onChange:C,value:f,tabs:g})})});
+import{jsx as t}from"react/jsx-runtime";import{AnimatePresence as e}from"motion/react";import{memo as o,useCallback as r}from"react";import{useChatEnabled as a,useDomain as i}from"#package/react-sdk";import{Sidebar as m,TabNavigation as n}from"#package/ui-sdk";import{ChatInteractionContainer as p}from"../../chat/ChatInteractionContainer.js";import{PropertyPagePanel as s}from"../../property-page/PropertyPagePanel.js";import{StepsSidebarFooter as c}from"./StepsSidebarFooter.js";export const StepsSideBar=o(o=>{let{price:d,activeTab:f,tabs:g,isRootPage:l,customPriceNode:u,isLastStep:h,onNextStepClick:P,onPreviousStepClick:S}=o,k=a(),{navigationSystem:C,storeSystem:j}=i(),x=r(t=>{j.stageAndCommit([C.getNavigationUpdate(t)])},[C,j]);return t(m.Layout,{header:null,content:t(s,{isRootPage:l}),footer:t(e,{initial:!1,mode:"wait",children:t(c,{customPriceNode:u,formattedPrice:d,isLastStep:h,onNextStepClick:P,onPreviousStepClick:S})}),chat:k&&t(p,{}),aside:g.length>1&&t(n,{onChange:x,value:f,tabs:g})})});

package/dist/configurator/ui/legacy/layout/tabs/TabsSidebar.js

@@ -1 +1 @@
-import{jsx as t,jsxs as o}from"react/jsx-runtime";import{AnimatePresence as e,motion as a}from"motion/react";import{memo as r,useCallback as i}from"react";import{useDomain as m}from"#package/react-sdk";import{AnimationTarget as n,Sidebar as s,TabNavigation as c}from"#package/ui-sdk";import{useChatEnabled as u}from"../../../../configurator-context/index.js";import{ChatInteractionContainer as p}from"../../chat/ChatInteractionContainer.js";import{CommonFinalizeButton as d}from"../common/CommonFinalizeButton.js";import{CommonSidebarFooter as l}from"../common/CommonSidebarFooter.js";import{DesktopSummaryButton as f}from"../common/DesktopSummaryButton.js";import{TabsSidebarContent as y}from"./TabsSidebarContent.js";let h={transition:{type:"spring",duration:.3},variants:{initial:{opacity:0,y:16},animate:{opacity:1,y:0},exit:{opacity:0,y:16}}};export const TabsSidebar=r(r=>{let{price:S,isSummaryActive:g,onEnterSummary:v,activeTab:B,tabs:j,summaryPage:b,onLeaveSummary:P,isRootPage:x,customPriceNode:C,hasSummary:T}=r,w=u(),{navigationSystem:k,storeSystem:F}=m(),N=i(t=>{F.stageAndCommit([k.getNavigationUpdate(t)])},[k,F]);return t(s.Layout,{header:null,content:t(y,{summaryPage:b,isSummaryActive:g,onLeaveSummary:P,isRootPage:x}),footer:o(e,{initial:!1,mode:"wait",children:[!T&&t(l,{customPriceNode:C,formattedPrice:S,actionButton:t(d,{}),showTemplateButton:!0,showSaveTemplateButton:!0}),T&&!g&&t(a.div,{...h,...n,children:t(l,{customPriceNode:C,actionButton:t(f,{onEnterSummary:v}),formattedPrice:S,showSaveTemplateButton:!1})},"sidebarFooterSummary"),T&&g&&t(a.div,{...h,...n,children:t(l,{customPriceNode:C,actionButton:t(d,{}),formattedPrice:S,showTemplateButton:!0,showSaveTemplateButton:!0})},"sidebarFooterSummary")]}),chat:w&&t(p,{}),aside:j.length>1&&t(c,{onChange:N,value:B,tabs:j})})});
+import{jsx as t,jsxs as o}from"react/jsx-runtime";import{AnimatePresence as e,motion as a}from"motion/react";import{memo as r,useCallback as m}from"react";import{useChatEnabled as i,useDomain as n}from"#package/react-sdk";import{AnimationTarget as s,Sidebar as c,TabNavigation as u}from"#package/ui-sdk";import{ChatInteractionContainer as p}from"../../chat/ChatInteractionContainer.js";import{CommonFinalizeButton as d}from"../common/CommonFinalizeButton.js";import{CommonSidebarFooter as l}from"../common/CommonSidebarFooter.js";import{DesktopSummaryButton as y}from"../common/DesktopSummaryButton.js";import{TabsSidebarContent as f}from"./TabsSidebarContent.js";let h={transition:{type:"spring",duration:.3},variants:{initial:{opacity:0,y:16},animate:{opacity:1,y:0},exit:{opacity:0,y:16}}};export const TabsSidebar=r(r=>{let{price:S,isSummaryActive:g,onEnterSummary:v,activeTab:B,tabs:b,summaryPage:j,onLeaveSummary:P,isRootPage:C,customPriceNode:T,hasSummary:w}=r,k=i(),{navigationSystem:x,storeSystem:F}=n(),N=m(t=>{F.stageAndCommit([x.getNavigationUpdate(t)])},[x,F]);return t(c.Layout,{header:null,content:t(f,{summaryPage:j,isSummaryActive:g,onLeaveSummary:P,isRootPage:C}),footer:o(e,{initial:!1,mode:"wait",children:[!w&&t(l,{customPriceNode:T,formattedPrice:S,actionButton:t(d,{}),showTemplateButton:!0,showSaveTemplateButton:!0}),w&&!g&&t(a.div,{...h,...s,children:t(l,{customPriceNode:T,actionButton:t(y,{onEnterSummary:v}),formattedPrice:S,showSaveTemplateButton:!1})},"sidebarFooterSummary"),w&&g&&t(a.div,{...h,...s,children:t(l,{customPriceNode:T,actionButton:t(d,{}),formattedPrice:S,showTemplateButton:!0,showSaveTemplateButton:!0})},"sidebarFooterSummary")]}),chat:k&&t(p,{}),aside:b.length>1&&t(u,{onChange:N,value:B,tabs:b})})});

package/dist/configurator/ui/phoenix-layout-elements/header/common/back-button/use-go-back-action.js

@@ -1 +1 @@
-import{useMemo as e}from"react";import{FrontendAnalyticsFactory as o,useAccessService as t,useAnalyticsService as i,useDomainApplication as a,useIntegrationState as r}from"#package/react-sdk";import{useConfiguratorRouting as d,usePresetSelection as n,usePreview as s}from"../../../../../configurator-context/index.js";import{useCloseAction as c}from"../../../../../integration/index.js";export const useGoBackAction=()=>{let l=i(),{configurationPersistSystem:p}=a(),u=d(),{presetCategories:m}=n(),{isPreview:w,isPreviewEnabled:f,leave:g}=s(),{accessInfo:x}=t(),k=m.flatMap(e=>e.presets).length>1,v=r(),C=c();return e(()=>v.embeddedView?null:k?async()=>{l.push(o.GoToProductsClicked()),x.viewMode||await p.save(),u.goToIndex()}:null!==C?async()=>{l.push(o.CloseConfiguratorClicked()),x.viewMode||await p.save(),await C()}:f&&!w?()=>{l.push(o.ExpandedViewClosed()),g()}:null,[l,p,k,v.embeddedView,w,f,g,u,C,x.viewMode])};
+import{useMemo as e}from"react";import{FrontendAnalyticsFactory as o,useAccessService as t,useAnalyticsService as i,useConfiguratorRouting as a,useDomainApplication as r,useIntegrationState as d}from"#package/react-sdk";import{usePresetSelection as n,usePreview as s}from"../../../../../configurator-context/index.js";import{useCloseAction as c}from"../../../../../integration/index.js";export const useGoBackAction=()=>{let l=i(),{configurationPersistSystem:p}=r(),u=a(),{presetCategories:m}=n(),{isPreview:w,isPreviewEnabled:f,leave:g}=s(),{accessInfo:x}=t(),k=m.flatMap(e=>e.presets).length>1,v=d(),C=c();return e(()=>v.embeddedView?null:k?async()=>{l.push(o.GoToProductsClicked()),x.viewMode||await p.save(),u.goToIndex()}:null!==C?async()=>{l.push(o.CloseConfiguratorClicked()),x.viewMode||await p.save(),await C()}:f&&!w?()=>{l.push(o.ExpandedViewClosed()),g()}:null,[l,p,k,v.embeddedView,w,f,g,u,C,x.viewMode])};

package/dist/configurator/ui/phoenix-layout-elements/header/common/step-navigation/StepsNavigation.js

@@ -1 +1 @@
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{Trans as o}from"@lingui/react";import{memo as a,useCallback as i}from"react";import{FrontendAnalyticsFactory as r,useAnalyticsService as s,usePresetEmbeddedState as c}from"#package/react-sdk";import{TopNavigation as p,useResponsive as l}from"#package/ui-sdk";import{useConfiguratorRouting as n,usePresetSelection as m}from"../../../../../configurator-context/index.js";export const StepsNavigation=a(a=>{let{steps:d,activeIndex:u,goTo:f}=a,g=s(),k=n(),{presetCategories:x}=m(),h=c(),C=x.flatMap(t=>t.presets).length>1,b=!h&&C,{isTablet:j}=l(),v=i(()=>{g.push(r.GoToProductsClicked()),k.goToIndex()},[g,k]);return e(p.Root,{activeStep:u+ +!!b,nonLinear:!0,compact:j,fullWidth:!0,children:[b&&t(p.Step,{isCompleted:!0,onClick:v,compact:j,children:t(o,{id:"sdk.layout.navigation.steps.first.label",message:"Products"})}),d.map(e=>{let o="complete"===e.status;return t(p.Step,{isCompleted:o,isDisabled:!o,compact:j,onClick:()=>f(e.index),children:e.label},e.label)})]})});
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{Trans as o}from"@lingui/react";import{memo as a,useCallback as i}from"react";import{FrontendAnalyticsFactory as r,useAnalyticsService as s,useConfiguratorRouting as c,usePresetEmbeddedState as p}from"#package/react-sdk";import{TopNavigation as l,useResponsive as n}from"#package/ui-sdk";import{usePresetSelection as m}from"../../../../../configurator-context/index.js";export const StepsNavigation=a(a=>{let{steps:d,activeIndex:u,goTo:f}=a,g=s(),k=c(),{presetCategories:x}=m(),h=p(),C=x.flatMap(t=>t.presets).length>1,b=!h&&C,{isTablet:j}=n(),v=i(()=>{g.push(r.GoToProductsClicked()),k.goToIndex()},[g,k]);return e(l.Root,{activeStep:u+ +!!b,nonLinear:!0,compact:j,fullWidth:!0,children:[b&&t(l.Step,{isCompleted:!0,onClick:v,compact:j,children:t(o,{id:"sdk.layout.navigation.steps.first.label",message:"Products"})}),d.map(e=>{let o="complete"===e.status;return t(l.Step,{isCompleted:o,isDisabled:!o,compact:j,onClick:()=>f(e.index),children:e.label},e.label)})]})});

package/dist/configurator/ui/phoenix-layout-elements/sidebar-footer/common/PreviousStepButton.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{IconButton as t,Tooltip as r}from"@mui/material";import{memo as o,useCallback as i}from"react";import{createPhoenixLayoutElement as a,previousStepButtonSchema as m}from"#package/domain";import{FrontendAnalyticsFactory as s,useAnalyticsService as n,useLocalizable as l,useStepNavigation as p}from"#package/react-sdk";import{PhxIcon as c,useResponsive as d}from"#package/ui-sdk";import{useBackToPresetEnabled as u,useConfiguratorRouting as f,useSteps as k}from"../../../../configurator-context/index.js";let g={id:"sdk.layout.sidebar.previousStep.label",message:"Previous step"};export const PreviousStepButton=a({schema:m,component:o(o=>{let{icon:a}=o,m=l(g),x=n(),h=u(),v=f(),{canGoPrevious:S,previous:b}=p(),{isDesktop:j}=d(),{previousStepDisabled:C}=k();return e(r,{title:m,placement:"top",children:e("span",{style:{alignSelf:"center"},children:e(t,{variant:"muted",color:"default",size:j?"medium":"small",disabled:C,onClick:i(()=>{S?b():(x.push(s.PreviousStepButtonClicked()),h&&v.goToIndex())},[x,h,S,b,v]),children:e(c,{name:a??"CaretLeft"})})})})})});
+import{jsx as e}from"react/jsx-runtime";import{IconButton as t,Tooltip as r}from"@mui/material";import{memo as o,useCallback as i}from"react";import{createPhoenixLayoutElement as a,previousStepButtonSchema as m}from"#package/domain";import{FrontendAnalyticsFactory as s,useAnalyticsService as n,useConfiguratorRouting as l,useLocalizable as p,useStepNavigation as c}from"#package/react-sdk";import{PhxIcon as d,useResponsive as u}from"#package/ui-sdk";import{useBackToPresetEnabled as f,useSteps as k}from"../../../../configurator-context/index.js";let g={id:"sdk.layout.sidebar.previousStep.label",message:"Previous step"};export const PreviousStepButton=a({schema:m,component:o(o=>{let{icon:a}=o,m=p(g),x=n(),h=f(),v=l(),{canGoPrevious:S,previous:b}=c(),{isDesktop:j}=u(),{previousStepDisabled:C}=k();return e(r,{title:m,placement:"top",children:e("span",{style:{alignSelf:"center"},children:e(t,{variant:"muted",color:"default",size:j?"medium":"small",disabled:C,onClick:i(()=>{S?b():(x.push(s.PreviousStepButtonClicked()),h&&v.goToIndex())},[x,h,S,b,v]),children:e(d,{name:a??"CaretLeft"})})})})})});

package/dist/configurator/ui/save-message-snackbars/SaveMessageSnackbars.js

@@ -1 +1 @@
-import{jsx as r}from"react/jsx-runtime";import{Trans as e}from"@lingui/react";import{Button as s}from"@mui/material";import{useSnackbar as i}from"notistack";import{useEffect as t}from"react";import{useApplicationRuntime as o,useApplicationRuntimeSelector as a,useConfiguratorMessages as n}from"#package/react-sdk";let m="phx-configuration-persist-system-failure";export const SaveMessageSnackbars=()=>{let c=a(o().selectors.domainContext.configurator.getIsViewMode),{enqueueSnackbar:d,closeSnackbar:p}=i();return t(()=>{c&&p(m)},[c,p]),n(i=>{c||("saveError"===i.kind&&d(r(e,{id:"sdk.persist.system.error.message",message:"An error occured when trying to update a configuration"}),{variant:"error",key:m,persist:!0,preventDuplicate:!0,action:i=>r(s,{color:"inherit",size:"small",onClick:()=>{p(i)},children:r(e,{id:"sdk.persist.system.error.dismiss",message:"Dismiss"})})}),"saveRecovery"===i.kind&&(p(m),d(r(e,{id:"sdk.persist.system.error.recovered",message:"Configuration updated"}),{variant:"info"})))}),null};
+import{jsx as e}from"react/jsx-runtime";import{Trans as r}from"@lingui/react";import{useSnackbar as s}from"notistack";import{useEffect as t}from"react";import{useApplicationRuntime as i,useApplicationRuntimeSelector as o,useConfiguratorMessages as a}from"#package/react-sdk";let n="phx-configuration-persist-system-failure";export const SaveMessageSnackbars=()=>{let m=o(i().selectors.domainContext.configurator.getIsViewMode),{enqueueSnackbar:c,closeSnackbar:d}=s();return t(()=>{m&&d(n)},[m,d]),a(s=>{m||("saveError"===s.kind&&c(e(r,{id:"sdk.persist.system.error.message",message:"An error occured when trying to update a configuration"}),{variant:"error",key:n,persist:!0,preventDuplicate:!0,actionButton:{label:e(r,{id:"sdk.persist.system.error.dismiss",message:"Dismiss"}),onClick:e=>{d(e)}}}),"saveRecovery"===s.kind&&(d(n),c(e(r,{id:"sdk.persist.system.error.recovered",message:"Configuration updated"}),{variant:"info"})))}),null};

package/dist/docs/3d-scene/cameras/custom.mdx

@@ -49,7 +49,8 @@ Custom camera behavior is implemented via `scheduleCameraTransition` inside an `
 ```tsx
 import { useEffect } from 'react'
 
-import { CameraControlType, createOnConfiguratorReadyProvider, useConfigurator } from '@salsita-ai/sdk/configurator'
+import { CameraControlType, useConfigurator } from '@salsita-ai/sdk/configurator'
+import { createOnConfiguratorReadyProvider } from '@salsita-ai/sdk/react'
 
 export default createOnConfiguratorReadyProvider(({ children }) => {
   const { cameraControlSystem } = useConfigurator()
@@ -238,7 +239,8 @@ components:
 ```tsx
 import { useEffect } from 'react'
 
-import { CameraControlType, createOnConfiguratorReadyProvider, useConfigurator } from '@salsita-ai/sdk/configurator'
+import { CameraControlType, useConfigurator } from '@salsita-ai/sdk/configurator'
+import { createOnConfiguratorReadyProvider } from '@salsita-ai/sdk/react'
 
 export default createOnConfiguratorReadyProvider(({ children }) => {
   const { cameraControlSystem } = useConfigurator()

package/dist/docs/drag-and-drop/room-planner.mdx

@@ -777,7 +777,7 @@ components:
         autoRotate: true
       # Back-to-back snap: the dragged cabinet's back snaps onto another
       # cabinet's back face (the snapPlane below). autoRotate orients it
-      # 180° so the two cabinets face away from each other. Same Moduline
+      # 180° so the two cabinets face away from each other. This is the
       # shape that drives the within-MTV bug when the target is flush
       # against a wall — AutoSnap puts the dragged cabinet behind the
       # wall, Pass 1 within clamps it back into the room, and Pass 2

package/dist/docs/index.json

@@ -1,5 +1,5 @@
 {
-  "generatedAt": "2026-10-18T13:11:47.686Z",
+  "generatedAt": "2026-10-19T11:36:51.534Z",
   "categories": [
     {
       "name": "Phoenix",

package/dist/docs/phoenix/configurator-interface.mdx

@@ -547,7 +547,7 @@ export default phx.frontend.createCustomPhoenixLayoutElement('ConfiguratorLayout
 - `LayoutSlots.DesktopSidebar` is the built-in desktop sidebar as one piece: the spec's tabs, back button, property pages and sidebar footer with their spacing, scrolling and empty states, and the assistant panel. Use it when the spec's property pages are what the customer should see and only their place changes, for example a sidebar on the left; build the controls yourself when they have to look like the brand's own. Without `width` it fills its container, so the layout positions and sizes that container; `miniSidebar` does not shrink it, so a layout that honours it reads `LayoutSlots.useSidebarContent().hasMiniSidebar` and lets the container take the sidebar's height. Its tabs sit outside it on the left; `side="start"` puts them on its right, for a sidebar on the left. In fullscreen it stays in place, transparent and inert, so a layout that wants the space back removes it while `phx.frontend.useIsFullscreenActive()` is set. See [Sidebar in a Custom Layout](?path=/docs/layouts-sidebar-in-a-custom-layout--docs).
 - Nothing of the built-in layouts is rendered for it. A project layout finalizes over the spec's `finalizeAction` components, see the finalize paragraph of [Hooks for a Project Layout](#hooks-for-a-project-layout). The `finalizePage` and `finalizeButton` components are legacy: they cannot be declared in YAML, only in TypeScript, and `Legacy.CommonFinalizePage`, which is deprecated, shows a `finalizePage` for projects that still have one. `LayoutDialog` renders only what the project registers with `createLayoutDialog` and is not part of the finalize flow. The preview start screen is `DesktopPreview` or `MobilePreview`, which the layout shows while `phx.frontend.usePreview().isPreview` is set. Both previews frame the scene themselves, so the layout renders the component that calls `phx.frontend.useSceneSafeArea()` only while `isPreview` is not set; it then measures when it mounts after the preview. The assistant panel is available to a project layout only inside `LayoutSlots.DesktopSidebar`.
 - The layout reads the state it has to react to from hooks, listed with what each returns in [Hooks for a Project Layout](#hooks-for-a-project-layout).
-- Messages for the user come one of two ways. `LayoutSlots.Services` shows violations of a rejected change, side-effect hints, errors and failed saves as the built-in snackbars, which render into `LayoutSlots.DesktopSnackbarsRoot` or `LayoutSlots.MobileSnackbarsRoot` wherever the layout mounts it. `phx.frontend.useConfiguratorMessages(onMessage)` hands the same messages to the layout's own UI instead, with their text resolved, as the toast in [Custom Layout](?path=/docs/layouts-custom-layout--docs#show-messages) does; mount one of the two, not both, or every message is shown twice. A failure to save the configuration, and the first successful save after it, are messages too, so a layout that mounts neither shows no sign of a failed save. An error of the built-in finalize and other actions stays a snackbar either way. It renders into the snackbar root, so a layout that mounts none shows it outside the configurator, in the page's `body`. A failure to start a configuration from a preset is not a message of the hook either: it happens on the preset screen, before any `ConfiguratorLayout` mounts. In production with more than one preset it is a snackbar there, also on a preset screen replaced with `createPresetUi` (see [Preset UI](#preset-ui)), which reads the error from `phx.frontend.usePresetSelection().selectionError` and mounts `PresetSnackbarsRoot` to keep the snackbar inside the configurator. With a single preset it is the [Configurator Error Page](#configurator-error-page). A finalize action the layout runs with `phx.frontend.useFinalizeActions` or `phx.frontend.useFinalizeAction` reports its error as the action's `error` instead, neither as a message nor as a snackbar.
+- Messages for the user come one of two ways. `LayoutSlots.Services` shows violations of a rejected change, side-effect hints, errors and failed saves as the built-in snackbars, which render into `LayoutSlots.DesktopSnackbarsRoot` or `LayoutSlots.MobileSnackbarsRoot` wherever the layout mounts it; the theme styles them, see [Layout Slots → Styling the snackbars](?path=/docs/phoenix-layout-slots--docs#styling-the-snackbars). `phx.frontend.useConfiguratorMessages(onMessage)` hands the same messages to the layout's own UI instead, with their text resolved, as the toast in [Custom Layout](?path=/docs/layouts-custom-layout--docs#show-messages) does; mount one of the two, not both, or every message is shown twice. A failure to save the configuration, and the first successful save after it, are messages too, so a layout that mounts neither shows no sign of a failed save. An error of the built-in finalize and other actions stays a snackbar either way. It renders into the snackbar root, so a layout that mounts none shows it outside the configurator, in the page's `body`. A failure to start a configuration from a preset is not a message of the hook either: it happens on the preset screen, before any `ConfiguratorLayout` mounts. In production with more than one preset it is a snackbar there, also on a preset screen replaced with `createPresetUi` (see [Preset UI](#preset-ui)), which reads the error from `phx.frontend.usePresetSelection().selectionError` and mounts `PresetSnackbarsRoot` to keep the snackbar inside the configurator. With a single preset it is the [Configurator Error Page](#configurator-error-page). A finalize action the layout runs with `phx.frontend.useFinalizeActions` or `phx.frontend.useFinalizeAction` reports its error as the action's `error` instead, neither as a message nor as a snackbar.
 - Any project layout element named `ConfiguratorLayout` takes over the page.
 
 `defaultConfiguratorElements`, exported from `@salsita-ai/sdk/configurator`, holds the built-in UI as a `ConfiguratorLayout` registration that renders the layout the spec selects, the built-in not-found page as a `ConfigurationNotFoundPage` registration, the built-in not-authenticated page as a `NotAuthenticatedPage` registration, the built-in preset screen as a `PresetUi` registration, the built-in error page as a `ConfiguratorErrorPage` registration, the app loader's built-in content as an `AppLoaderContent` registration, and the built-in in-scene controls under the names of [In-Scene Controls](#in-scene-controls). Generated code registers these defaults with `withDefaultElements`, apart from the project's elements, so the built-in UI is a registration like any other; a project element registered under the same name wins over a default. The list also holds the configurator's built-in controls and layout elements under the kinds the spec names them by, such as `attributeSelect` or `undoToolbarButton`, so a project element registered under one of those names replaces the built-in one wherever the spec names that kind. A config assembled by hand, without generated code, calls `withDefaultElements(defaultConfiguratorElements)` too; the lists are the only way the built-in elements are registered, so without it the page shows a "not found" box instead of the configurator, and a project layout shows one in place of every built-in control. The admin mounts a full configurator, so its list, `defaultAdminElements` from `@salsita-ai/sdk/admin`, holds the configurator's defaults followed by the admin's built-in pages, sidebars and actions; generated admin code passes it to `withDefaultElements` in place of `defaultConfiguratorElements`, because each call replaces the defaults passed before.

package/dist/docs/phoenix/layout-slots.mdx

@@ -44,6 +44,27 @@ export const Toolbar = () => (
 - `SharedCanvas` fills its nearest positioned ancestor and paints an opaque background, so the layout positions its own UI after it in the markup.
 - Snackbars are raised by `Services`, for violations, side-effect hints, validation errors and a failed save, and also by the built-in finalize and footer actions when their handler fails. A layout that shows these messages its own way calls `phx.frontend.useConfiguratorMessages(onMessage)` instead of mounting `Services`, and then shows the failed save too, see [Configurator Interface → Hooks for a Project Layout](?path=/docs/phoenix-configurator-interface--docs#hooks-for-a-project-layout); the other snackbars still need a root. They render into the snackbar root the layout mounts; with no root mounted they render into the page's `document.body`, outside the configurator. The desktop root is a zero-height element the snackbars stack upwards from, so the layout places it where their bottom edge belongs. The phone root leaves them fixed to the viewport, see `MobileSnackbarsRoot`. A finalize action the layout runs with `phx.frontend.useFinalizeActions` or `phx.frontend.useFinalizeAction` raises no snackbar; its error is the action's `error`.
 
+### Styling the snackbars
+
+Every snackbar of the configurator and the admin, raised by `Services`, a failed save, a failed preset creation or a built-in action, renders as `PhxSnackbar` from `@salsita-ai/sdk/ui`: an MUI `Alert` with the snackbar's variant as its severity, inside notistack's `SnackbarContent`. A project restyles the configurator's snackbars in its theme, from [`createGetThemeHandler`](?path=/docs/layouts-custom-theme-handler--docs), under `components.PhxSnackbar` (the admin's snackbars follow the admin's own theme, which ignores the theme handler):
+
+```ts
+// Part of the ThemeOptions a theme handler returns
+const components: ThemeOptions['components'] = {
+  PhxSnackbar: {
+    styleOverrides: {
+      alert: ({ theme }) => ({ borderRadius: 0, boxShadow: theme.shadows[3] }),
+      actionButton: { fontWeight: 600, textTransform: 'none' },
+    },
+  },
+}
+```
+
+- `styleOverrides` styles three slots: `content`, notistack's outer element; `alert`, the `Alert` with the message; and `actionButton`, a button such as **Dismiss**.
+- `defaultProps.slotProps` passes props to the slots, such as `{ alert: { variant: 'filled' } }`, and `defaultProps.slots` replaces a slot's component. The `MuiAlert` and `MuiButton` overrides of the theme reach the snackbars too.
+- A snackbar's button is described as data, not as an element: the code that raises it passes `actionButton: { label, onClick }` to notistack's `enqueueSnackbar`, and `PhxSnackbar` renders it in the `actionButton` slot, an MUI `Button` with `color="inherit"` and `size="small"`, after the snackbar's notistack `action` if it has one. `onClick` receives the snackbar's key, to close it with `closeSnackbar`. A project's own snackbars take the same option, typed by `SnackbarActionButton` from `@salsita-ai/sdk/react`, so their buttons follow the theme; an element passed as `action` renders as it is.
+- Where the snackbars appear is the snackbar root's job, see `DesktopSnackbarsRoot` and `MobileSnackbarsRoot`.
+
 ## Desktop sidebar
 
 | Member                        | Shows                                                                                                                                                                                                                                                                                                                                                                                                                                   | Fed by                                                                                                                                                                                                                                                                                                     | With nothing configured                                                                                                                                                                                                                                                                                                          | Read mode                                                                                                                                                                                                  |

package/dist/docs/phoenix/phoenix-cli.mdx

@@ -324,6 +324,7 @@ The dev server watches for changes in:
 
 - `spec/**/*.yaml` — Domain specification files
 - `src/**/*.{ts,tsx,yaml,yml,json,html,css}` — Source files
+- `package.json` — Root dependency declarations; changes recheck the SDK's peers. A mismatch is reported without stopping dev, and correcting the manifest triggers another rebuild. Install changed dependencies with your package manager; changes to installed packages can still require restarting dev.
 - `.env` — Environment file; a change restarts the Vite dev server
 - `.env.generated`, `.phoenix/.env.generated` — Generated env files; a change rebuilds the project files. Only a file that exists when `phoenix dev` starts is watched: a root `.env.generated` that a deployment command creates while dev runs is not watched; restart `phoenix dev` to use it.
 
@@ -617,7 +618,7 @@ Known limits:
 - Binary assets, CSS files, locale catalog changes, dependency changes and edits requiring a full application restart are unsupported.
 - Storybook `story-dev` has no variant previews. A project on the legacy pipeline has no variant previews; the command says so and exits.
 
-Generated projects carry the `phoenix-variants` agent skill, which tells coding agents when to offer options, how to write each kind and what to do with your answer.
+Generated projects carry the `phoenix` agent skill, whose linked Variants guide tells coding agents when to offer options, how to write each kind and what to do with your answer.
 
 ## SDK Development
 
@@ -758,7 +759,7 @@ Revokes the token on the server and removes it from the credentials file. `--reg
 
 ### `phoenix deploy`
 
-Validates the spec, packs and uploads the project, starts its build on the server and follows it until the configurator is live. Before the upload the server compares the domain model with the deployed one: a model that changed under an already deployed model version is refused with the reason, and needs a new model version and a [migration](?path=/docs/phoenix-migrations--docs). Once the build starts it prints `Follow the build in Studio: <url>`, the build's page in the Studio you signed in through; a sign-in stored by an older CLI has no Studio URL, so sign in again to get the link. After `Your configurator is live at <url>` it prints one line for coding agents, which tells them to offer the run evaluation of the `phoenix-feedback` skill once you have nothing more to build; you can ignore it when you run the command yourself. `--region` or `--serverUrl` selects the server, as for `login`; `--no-wait` returns as soon as the build starts.
+Validates the spec, packs and uploads the project, starts its build on the server and follows it until the configurator is live. Before the upload the server compares the domain model with the deployed one: a model that changed under an already deployed model version is refused with the reason, and needs a new model version and a [migration](?path=/docs/phoenix-migrations--docs). Once the build starts it prints `Follow the build in Studio: <url>`, the build's page in the Studio you signed in through; a sign-in stored by an older CLI has no Studio URL, so sign in again to get the link. After `Your configurator is live at <url>` it prints one line for coding agents, which tells them to offer the run evaluation in the Feedback guide linked from the `phoenix` skill once you have nothing more to build; you can ignore it when you run the command yourself. `--region` or `--serverUrl` selects the server, as for `login`; `--no-wait` returns as soon as the build starts.
 
 To keep the conversation that led to a build, place a reviewed UTF-8 transcript in `conversation.log` at the project root before deploying. Deploy automatically includes it in the private source archive. Download the build's sources from Studio to read it; access is the same as for the rest of that build's sources. The build extractor skips the log, so it is not an application build input or a public asset. Missing logs produce a warning and deployment continues. Directories, links and special files at that path are rejected.
 
@@ -787,7 +788,7 @@ Pass the message as the argument for a short note, or `--file` for a longer repo
 
 A message holds at most 100,000 characters, from the argument or from the file. Besides the message and the flags, the CLI sends only the SDK version, the operating system and the Node.js version; no file of the project is attached, and the Phoenix team reads a build's sources through the build's page in Studio. The project must belong to the signed-in workspace, otherwise the server refuses the feedback; without a project, the feedback is sent on its own.
 
-Generated projects carry the `phoenix-feedback` agent skill. It tells coding agents when to draft feedback, to show you the draft and send it only after you approve it, and how to write a report: the build id with its Studio page link, the live configurator link, what the agent was doing, what happened and what was expected, the exact error or output, the workaround and a condensed conversation log. When you say you are done, or a deploy went live and you confirm the run is finished, the agent asks you to evaluate the run, one question at a time: minutes spent, then a score from 0 to 10 for the agent's guidance, the configurator's functionality, its UX, the quality of the 3D, the UI visuals and the overall result, then your comments. It never picks a score for you and sends nothing when you decline. Secrets, credentials and personal data never go into a message; file paths, spec and code snippets and your own words may, once you approved the draft that contains them. The command needs a server with API 1.40.0 or newer; a message over 5000 characters needs API 1.43.0 or newer.
+Generated projects carry the `phoenix` agent skill. Its linked Feedback guide tells coding agents when to draft feedback, to show you the draft and send it only after you approve it, and how to write a report: the build id with its Studio page link, the live configurator link, what the agent was doing, what happened and what was expected, the exact error or output, the workaround and a condensed conversation log. When you say you are done, or a deploy went live and you confirm the run is finished, the agent asks you to evaluate the run, one question at a time: minutes spent, then a score from 0 to 10 for the agent's guidance, the configurator's functionality, its UX, the quality of the 3D, the UI visuals and the overall result, then your comments. It never picks a score for you and sends nothing when you decline. Secrets, credentials and personal data never go into a message; file paths, spec and code snippets and your own words may, once you approved the draft that contains them. The command needs a server with API 1.40.0 or newer; a message over 5000 characters needs API 1.43.0 or newer.
 
 ## Next Steps
 

package/dist/docs/phoenix/project-structure.mdx

@@ -199,21 +199,21 @@ type CustomMaterial = Phx['AdminModel']['CustomMaterial']
 
 ### Root Level Files
 
-| File                                                   | Auto-Generated? | Notes                                 |
-| ------------------------------------------------------ | --------------- | ------------------------------------- |
-| `package.json`                                         | No              | Yours; see Dependencies               |
-| `tsconfig.json`                                        | Once            | Yours; see below                      |
-| `eslint.config.js`                                     | Once            | Yours; see below                      |
-| `prettier.config.js`                                   | Once            | Yours; see below                      |
-| `.prettierignore`                                      | No              | Optional and your own; see below      |
-| `pnpm-workspace.yaml`                                  | No              | Only with pnpm; see Package manager   |
-| `.gitignore`                                           | Partially       | Only in a git repository; see Markers |
-| `.env`                                                 | No              | Git-ignored, local config             |
-| `.env.example`                                         | No              | Template for env vars                 |
-| `.env.generated`                                       | Yes             | Optional, git-ignored; see below      |
-| `README.md`                                            | No              | Project documentation                 |
-| `AGENTS.md`                                            | No              | Your own coding-agent instructions    |
-| `.claude/skills/phoenix*/`, `.agents/skills/phoenix*/` | Yes             | Phoenix agent skills                  |
+| File                                                 | Auto-Generated? | Notes                                 |
+| ---------------------------------------------------- | --------------- | ------------------------------------- |
+| `package.json`                                       | No              | Yours; see Dependencies               |
+| `tsconfig.json`                                      | Once            | Yours; see below                      |
+| `eslint.config.js`                                   | Once            | Yours; see below                      |
+| `prettier.config.js`                                 | Once            | Yours; see below                      |
+| `.prettierignore`                                    | No              | Optional and your own; see below      |
+| `pnpm-workspace.yaml`                                | No              | Only with pnpm; see Package manager   |
+| `.gitignore`                                         | Partially       | Only in a git repository; see Markers |
+| `.env`                                               | No              | Git-ignored, local config             |
+| `.env.example`                                       | No              | Template for env vars                 |
+| `.env.generated`                                     | Yes             | Optional, git-ignored; see below      |
+| `README.md`                                          | No              | Project documentation                 |
+| `AGENTS.md`                                          | No              | Your own coding-agent instructions    |
+| `.claude/skills/phoenix/`, `.agents/skills/phoenix/` | Yes             | Phoenix agent skills                  |
 
 Sync does not write `README.md`, `AGENTS.md`, `.env.example`, `.env.ci` or the `README.md` files in `assets/public/` and `assets/private/`. Earlier SDK versions wrote them once; a project that has them keeps them, and they are yours to edit.
 
@@ -242,9 +242,13 @@ With the application-spec pipeline, the Lingui configuration is `.phoenix/.lingu
 
 ### Agent Guidance
 
-Coding agents (Claude Code, Codex, Cursor) read the Phoenix agent skills. An `AGENTS.md` is yours to add for your own instructions; sync does not write one. The `phoenix`, `phoenix-cli`, `phoenix-feedback` and `phoenix-review` skills carry the SDK conventions, CLI tooling and review checklist, and the `phoenix-create-configurator` skill walks the agent from your product documents and assets to a reviewed configurator in five stages. The `phoenix-variants` skill has the agent show you several options over the dev preview when a decision is a matter of taste, and build the one you pick. Phoenix keeps them in step with the installed SDK, including the reference files inside a skill folder. During the internal beta, a project created from a canary build of the SDK gets one more section in the `phoenix` skill: once per conversation the agent checks for a newer canary and, after telling you, updates the project's SDK, runs `phoenix deps`, installs, then runs `phoenix sync`. Other skill folders are never touched.
+Coding agents (Claude Code, Codex, Cursor) enter through the single `phoenix` skill under `.claude/skills/phoenix/` or `.agents/skills/phoenix/`. Its `SKILL.md` routes to the existing project, CLI, configurator workflow, code review, variants and feedback guides in `references/`. Agents read the guides for their task rather than the whole tree. The configurator workflow retains its five stages and supporting discovery, UX, asset-conversion and appearance-review references.
 
-Projects created by earlier SDK versions had this guidance in `CLAUDE.md`, `.cursor/rules/phoenix.mdc` and `commands/review.md`. Sync removes the SDK block from the first two, keeps your own text around it, deletes a file that held nothing else, and deletes the review commands; use the `phoenix-review` skill instead of `/review`.
+Phoenix keeps this guidance in step with the installed SDK. During the internal beta, a project created from a canary build gets the canary-update instructions in the linked project guide: once per conversation the agent checks for a newer canary and, after telling you, updates the SDK, runs `phoenix deps`, installs, then runs `phoenix sync`.
+
+An `AGENTS.md` is yours to add; sync does not write one. Sync removes retired `phoenix-*` skill folders but leaves unrelated skills alone. If your own instructions name an earlier separate skill such as `phoenix-review`, point them at `phoenix` and the same task instead.
+
+Projects created by earlier SDK versions had this guidance in `CLAUDE.md`, `.cursor/rules/phoenix.mdc` and `commands/review.md`. Sync removes the SDK block from the first two, keeps your own text around it, deletes a file that held nothing else, and deletes the review commands; ask `phoenix` to review instead of using `/review`.
 
 ### Markers for Partial Auto-Generation
 

package/dist/docs/phoenix/sdk-builder-workflow.mdx

@@ -65,7 +65,7 @@ Every user who signs the CLI in gets their own development environment, so a tea
 
 Coding agents follow the generated `phoenix` skill: before their first change they start `phoenix dev` and open the preview in your browser, and after `phoenix deploy` starts a build they open its page in Studio.
 
-To build the configurator with your coding agent, give it your product documents, prices, pictures, drawings or models and ask it to create the configurator. The generated `phoenix-create-configurator` skill guides it through five stages: a representative first slice you can try early, a plan of the whole configuration experience, options and features added in small increments, finalization, and a complete review. It studies the SDK documentation before building, keeps a `configurator-spec.md` in the project as the record of what is decided and what remains open, and asks you only for decisions it cannot derive from your materials.
+To build the configurator with your coding agent, give it your product documents, prices, pictures, drawings or models and ask it to create the configurator. The generated `phoenix` skill’s Configurator workflow guide takes it through five stages: a representative first slice you can try early, a plan of the whole configuration experience, options and features added in small increments, finalization, and a complete review. It studies the SDK documentation before building, keeps a `configurator-spec.md` in the project as the record of what is decided and what remains open, and asks you only for decisions it cannot derive from your materials.
 
 ## 4. Deploy
 
@@ -99,7 +99,7 @@ Tell us what is broken, confusing or missing, from wherever you are:
 - In the terminal, `pnpm phoenix feedback "<message>" --type bug|idea|other` sends it with your sign-in, and `--file <path>` sends a text file instead of the argument. See the [CLI reference](?path=/docs/phoenix-phoenix-cli--docs).
 - On a build's page in Studio, **Download** → **Sources** downloads the archive `phoenix deploy` uploaded for that build, so a report only needs to name the build.
 
-Coding agents working in your project use the same command, guided by the generated `phoenix-feedback` skill. They never send on their own: an agent shows you a draft, right away when the problem is crucial and otherwise at the end of the task, and sends it only after you approve it. A report names the build with its Studio page link and the live configurator, says what the agent was doing, what happened and what it expected, quotes the exact error and ends with a condensed conversation log. Agents are told never to include secrets, credentials or personal data; parts of your project and your own words go in only through a draft you approved. When you are done with the configurator, the agent also asks you, once per conversation, to evaluate the run: minutes spent, then scores from 0 to 10 for the agent's guidance, functionality, UX, 3D quality, UI visuals and the overall result, and your comments. It asks one question at a time, never picks a score for you, tells you the answers go to the Phoenix team, shows the message and sends it only after you approve it.
+Coding agents working in your project use the same command, guided by the generated `phoenix` skill’s Feedback guide. They never send on their own: an agent shows you a draft, right away when the problem is crucial and otherwise at the end of the task, and sends it only after you approve it. A report names the build with its Studio page link and the live configurator, says what the agent was doing, what happened and what it expected, quotes the exact error and ends with a condensed conversation log. Agents are told never to include secrets, credentials or personal data; parts of your project and your own words go in only through a draft you approved. When you are done with the configurator, the agent also asks you, once per conversation, to evaluate the run: minutes spent, then scores from 0 to 10 for the agent's guidance, functionality, UX, 3D quality, UI visuals and the overall result, and your comments. It asks one question at a time, never picks a score for you, tells you the answers go to the Phoenix team, shows the message and sends it only after you approve it.
 
 ## Known limits
 

package/dist/docs/phoenix/webhooks.mdx

@@ -36,7 +36,11 @@ Phoenix provides domain-aware builders through the global `phx.webhooks` namespa
 
 Your webhook is the default export of `src/webhooks/index.ts`. With the application-spec pipeline (see [Current and legacy project tooling](?path=/docs/phoenix-phoenix-cli--docs#current-and-legacy-project-tooling)), the file is yours to create; sync does not write it. A project without it gets a built-in webhook, so it builds and deploys with no webhook code. The built-in webhook has one handler, an anonymous auth handler, which the platform calls only when `spec/application.yaml` sets `useAuthHook`. The legacy pipeline writes the file with that webhook on the first sync.
 
-Create `src/webhooks/index.ts` when the project needs its own handlers: finalization, backend data, or an auth handler that does more than start an anonymous session. A project that sets `useAuthHook` or `useClerk` needs its own auth handler, because the built-in one answers only anonymous requests. The smallest file is the built-in webhook itself:
+Create `src/webhooks/index.ts` when the project needs its own handlers: finalization, backend data, or an auth handler that does more than start an anonymous session.
+
+If `useAuthHook` or `useClerk` is enabled without this file, sync, build, clean and dev report `AUTH_WITHOUT_PROJECT_WEBHOOK` and generation continues with the anonymous-only built-in webhook. This warning also applies when `useAuthHook: false` is explicit alongside `useClerk: true`. Add a default-exported webhook with the required Clerk or custom auth handlers, or disable the settings if they are unintended.
+
+The smallest file is the built-in webhook itself:
 
 ```ts
 // src/webhooks/index.ts