@salsita-ai/sdk 0.50.0-develop.c1dcc73e88 → 0.50.0-develop.c4848d224b

package/dist/configurator/ui/configurator-layout/sidebar-keys/index.js

@@ -0,0 +1 @@
+export{SidebarKeys}from"./sidebar-keys.js";

package/dist/configurator/ui/configurator-layout/sidebar-keys/sidebar-keys.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Values of the desktop sidebar's `data-sidebar` attribute: its variants and states. The sidebar writes
+ * them; the built-in desktop layout's rules react to them.
+ */
+export declare const SidebarKeys: {
+    readonly Minimalist: 'minimalist';
+    readonly Split: 'split';
+    readonly Visible: 'visible';
+    readonly Hidden: 'hidden';
+    readonly Assistant: 'assistant';
+};

package/dist/configurator/ui/configurator-layout/sidebar-keys/sidebar-keys.js

@@ -0,0 +1 @@
+export const SidebarKeys={Minimalist:"minimalist",Split:"split",Visible:"visible",Hidden:"hidden",Assistant:"assistant"};

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import{Box as a}from"@mui/material";import{useDetectGPU as i}from"@react-three/drei";import{Canvas as o,useThree as n}from"@react-three/fiber";import{memo as s,useCallback as l,useEffect as p,useMemo as c,useState as f}from"react";import{BuiltInLoadingPhase as m,useLoadingPhase as d,useLoadingStateManager as h,useStoreSelector as u}from"#package/react-sdk";import{useResponsive as g}from"#package/ui-sdk";import{useConfigurator as x}from"../../../../application-runtime/index.js";import{Scene as v,SceneEnvironment as C}from"../../../../scene/index.js";import{CanvasLoader as P}from"../../../phoenix-layout-elements/index.js";import{GPUIssuePage as w}from"./GPUIssuePage.js";let j=e=>{let{onCanNotLoad:t}=e,r=n(e=>e.gl);return p(()=>{let e=r.getContext(),a=e.getExtension("WEBGL_debug_renderer_info");a?e.getParameter(a.UNMASKED_RENDERER_WEBGL).toLocaleLowerCase().includes("swiftshader")&&t?.("no-acceleration"):t?.("no-acceleration")},[r,t]),null};export const Canvas=s(()=>{let[n,s]=f(null),[D,E]=f(!0),{canvasSystem:B}=x(),L=u(e=>B.getCanvasConfig(e.state),[B]),y=i(),{canvasPadding:k}=g(),M=null!==h();d({id:m.SceneAssets,label:"Loading 3D scene…"},D);let $=l(()=>{E(!1),B.reportFirstLoadFinished()},[B]),_=l(e=>{B.onCanvasClick$.next(e)},[B]),b=l(e=>{B.onCanvasPointerMove$.next(e)},[B]),A=c(()=>{let e={};return L?.precision&&(e.precision=L.precision),L?.alpha&&(e.alpha=L.alpha),L?.premultipliedAlpha&&(e.premultipliedAlpha=L.premultipliedAlpha),L?.antialias&&(e.antialias=L.antialias),L?.stencil&&(e.stencil=L.stencil),L?.preserveDrawingBuffer&&(e.preserveDrawingBuffer=L.preserveDrawingBuffer),L?.powerPreference&&(e.powerPreference=L.powerPreference),L?.depth&&(e.depth=L.depth),L?.logarithmicDepthBuffer&&(e.logarithmicDepthBuffer=L.logarithmicDepthBuffer),L?.failIfMajorPerformanceCaveat&&(e.failIfMajorPerformanceCaveat=L.failIfMajorPerformanceCaveat),e},[L]);return(p(()=>{"WEBGL_UNSUPPORTED"===y.type&&s("no-gpu")},[y,s]),n)?e(w,{issue:n}):t(r,{children:[e(a,{component:"div",sx:{transition:"opacity 0.3s ease-in",opacity:+!D,width:"100%",height:"100%"},children:t(o,{gl:A,onClick:_,onPointerMove:b,frameloop:L?.frameloop,shadows:L?.shadows,children:[e(v,{onFirstLoad:$}),e(j,{onCanNotLoad:s}),e(C,{})]})}),!M&&e(a,{component:"div",sx:{position:"absolute",top:k.top,left:k.left,width:`calc(100% - ${k.left}px - ${k.right}px)`,height:`calc(100% - ${k.top}px - ${k.bottom}px)`,display:"flex",justifyContent:"center",alignItems:"center",transition:"opacity 0.3s ease-in",opacity:+!!D,pointerEvents:"none"},children:e(P,{})})]})});
+import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import{Box as a}from"@mui/material";import{useDetectGPU as i}from"@react-three/drei";import{Canvas as o,useThree as n}from"@react-three/fiber";import{memo as s,useCallback as l,useEffect as p,useMemo as c,useState as f}from"react";import{BuiltInLoadingPhase as m,useExpectPhase as d,useLoadingPhase as h,useLoadingStateManager as u,useStoreSelector as g}from"#package/react-sdk";import{useResponsive as x}from"#package/ui-sdk";import{useConfigurator as v}from"../../../../application-runtime/index.js";import{Scene as C,SceneEnvironment as P}from"../../../../scene/index.js";import{CanvasLoader as w}from"../../../phoenix-layout-elements/index.js";import{GPUIssuePage as j}from"./GPUIssuePage.js";let D=e=>{let{onCanNotLoad:t}=e,r=n(e=>e.gl);return p(()=>{let e=r.getContext(),a=e.getExtension("WEBGL_debug_renderer_info");a?e.getParameter(a.UNMASKED_RENDERER_WEBGL).toLocaleLowerCase().includes("swiftshader")&&t?.("no-acceleration"):t?.("no-acceleration")},[r,t]),null};export const Canvas=s(()=>{let[n,s]=f(null),[E,B]=f(!0),{canvasSystem:L}=v(),y=g(e=>L.getCanvasConfig(e.state),[L]),k=i(),{canvasPadding:A}=x(),M=null!==u();d(m.SceneAssets),h({id:m.SceneAssets,label:"Loading 3D scene…"},E);let $=l(()=>{B(!1),L.reportFirstLoadFinished()},[L]),_=l(e=>{L.onCanvasClick$.next(e)},[L]),b=l(e=>{L.onCanvasPointerMove$.next(e)},[L]),I=c(()=>{let e={};return y?.precision&&(e.precision=y.precision),y?.alpha&&(e.alpha=y.alpha),y?.premultipliedAlpha&&(e.premultipliedAlpha=y.premultipliedAlpha),y?.antialias&&(e.antialias=y.antialias),y?.stencil&&(e.stencil=y.stencil),y?.preserveDrawingBuffer&&(e.preserveDrawingBuffer=y.preserveDrawingBuffer),y?.powerPreference&&(e.powerPreference=y.powerPreference),y?.depth&&(e.depth=y.depth),y?.logarithmicDepthBuffer&&(e.logarithmicDepthBuffer=y.logarithmicDepthBuffer),y?.failIfMajorPerformanceCaveat&&(e.failIfMajorPerformanceCaveat=y.failIfMajorPerformanceCaveat),e},[y]);return(p(()=>{"WEBGL_UNSUPPORTED"===k.type&&s("no-gpu")},[k,s]),n)?e(j,{issue:n}):t(r,{children:[e(a,{component:"div",sx:{transition:"opacity 0.3s ease-in",opacity:+!E,width:"100%",height:"100%"},children:t(o,{gl:I,onClick:_,onPointerMove:b,frameloop:y?.frameloop,shadows:y?.shadows,children:[e(C,{onFirstLoad:$}),e(D,{onCanNotLoad:s}),e(P,{})]})}),!M&&e(a,{component:"div",sx:{position:"absolute",top:A.top,left:A.left,width:`calc(100% - ${A.left}px - ${A.right}px)`,height:`calc(100% - ${A.top}px - ${A.bottom}px)`,display:"flex",justifyContent:"center",alignItems:"center",transition:"opacity 0.3s ease-in",opacity:+!!E,pointerEvents:"none"},children:e(w,{})})]})});

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

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{styled as e}from"@mui/material";import{Suspense as o,memo as r,useEffect as i,useRef as n,useState as a}from"react";import{useLoadingStateManager as s}from"#package/react-sdk";import{usePreview as l}from"../../../../configurator-context/index.js";import{CanvasLoader as m}from"../../../phoenix-layout-elements/index.js";import{Canvas as c}from"./LayoutCanvas.js";let p=e("div",{shouldForwardProp:t=>"masked"!==t})(({masked:t,theme:{palette:e}})=>({backgroundColor:e.background.scene,inset:0,position:"absolute",isolation:"isolate",maxBlockSize:"var(--phx-app-height)","&::after":{backgroundColor:"inherit",content:'""',display:"block",inset:"inherit",opacity:+!!t,pointerEvents:"none",position:"absolute",transitionDuration:t?"0ms":"100ms",transitionProperty:"opacity",transitionTimingFunction:"linear"}})),u=e("div")({display:"grid",inset:0,placeItems:"center",pointerEvents:"none",position:"absolute"}),d=()=>null!==s()?null:t(u,{children:t(m,{})});export const SharedCanvas=r(()=>{let{isExpanded:e}=l(),[r,s]=a(!1),m=n(e);return i(()=>{if(e===m.current)return;m.current=e,s(!0);let t=setTimeout(()=>s(!1),600);return()=>clearTimeout(t)},[e]),t(p,{masked:r,children:t(o,{fallback:t(d,{}),children:t(c,{})})})});
+import{jsx as t}from"react/jsx-runtime";import{styled as e}from"@mui/material";import{Suspense as o,memo as r,useEffect as i,useRef as n,useState as a}from"react";import{BuiltInLoadingPhase as s,useExpectPhase as l,useLoadingStateManager as m}from"#package/react-sdk";import{usePreview as c}from"../../../../configurator-context/index.js";import{CanvasLoader as p}from"../../../phoenix-layout-elements/index.js";import{Canvas as u}from"./LayoutCanvas.js";let d=e("div",{shouldForwardProp:t=>"masked"!==t})(({masked:t,theme:{palette:e}})=>({backgroundColor:e.background.scene,inset:0,position:"absolute",isolation:"isolate",maxBlockSize:"var(--phx-app-height)","&::after":{backgroundColor:"inherit",content:'""',display:"block",inset:"inherit",opacity:+!!t,pointerEvents:"none",position:"absolute",transitionDuration:t?"0ms":"100ms",transitionProperty:"opacity",transitionTimingFunction:"linear"}})),h=e("div")({display:"grid",inset:0,placeItems:"center",pointerEvents:"none",position:"absolute"}),f=()=>null!==m()?null:t(h,{children:t(p,{})});export const SharedCanvas=r(()=>{l(s.SceneAssets);let{isExpanded:e}=c(),[r,m]=a(!1),p=n(e);return i(()=>{if(e===p.current)return;p.current=e,m(!0);let t=setTimeout(()=>m(!1),600);return()=>clearTimeout(t)},[e]),t(d,{masked:r,children:t(o,{fallback:t(f,{}),children:t(u,{})})})});

package/dist/configurator/ui/configurator-layout/{universal → slots/desktop-sidebar}/DesktopSidebar.d.ts

@@ -25,13 +25,8 @@ declare module '@mui/material/styles' {
         };
     }
 }
-export declare const SidebarKeys: {
-    readonly Minimalist: 'minimalist';
-    readonly Split: 'split';
-    readonly Visible: 'visible';
-    readonly Hidden: 'hidden';
-    readonly Assistant: 'assistant';
-};
+/** Which side of its layout the sidebar is on. */
+export type DesktopSidebarSide = 'start' | 'end';
 interface SidebarOwnerState {
     readonly isHeaderEmpty?: boolean;
     readonly isContentEmpty?: boolean;
@@ -76,17 +71,31 @@ export interface ThemeableDesktopSidebarProps extends SidebarOwnerState {
      */
     readonly scrollableIndicatorBackground?: CSSProperties['background'];
     /**
-     * Inline size (width) of the sidebar.
-     *
-     * @default inherited from ThemeableDesktopLayoutProps.sidebarWidth
+     * Inline size (width) of the sidebar. Not read from the theme: the sidebar takes its width from its
+     * `width` prop, which the built-in desktop layout sets from `ThemeableDesktopLayoutProps.sidebarWidth`.
      */
     readonly width?: CSSProperties['width'];
 }
-interface DesktopSidebarProps {
+/** Props of the built-in desktop sidebar. */
+export interface DesktopSidebarProps {
+    /**
+     * Inline size (width) of the sidebar. Without it the sidebar fills the width and height of its
+     * container, which the layout sizes and positions; with it the sidebar takes this width and the
+     * height of its content, unless its container stretches it.
+     */
+    readonly width?: CSSProperties['width'];
     /**
-     * Inline size (width) of the sidebar. The layout passes the width of its sidebar column.
+     * Which side of the layout the sidebar is on. The sidebar tabs sit outside the sidebar on the other
+     * side: to its left for `end`, to its right for `start`.
+     *
+     * @default 'end'
      */
-    readonly width: CSSProperties['width'];
+    readonly side?: DesktopSidebarSide;
 }
-export declare const DesktopSidebar: ({ width }: DesktopSidebarProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * The built-in desktop sidebar: tabs, back button, property page, footer and the assistant panel, with
+ * their spacing, scrolling and empty states. In fullscreen it stays in place, transparent and inert;
+ * the layout decides whether it keeps its space.
+ */
+export declare const DesktopSidebar: ({ width, side }: DesktopSidebarProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/configurator/ui/configurator-layout/slots/desktop-sidebar/DesktopSidebar.js

@@ -0,0 +1,16 @@
+import{jsx as r,jsxs as a}from"react/jsx-runtime";import{paperClasses as e,styled as d,tabsClasses as i,useTheme as t,useThemeProps as o}from"@mui/material";import{useMemo as n,useState as s}from"react";import{useIsFullscreenActive as b}from"#package/react-sdk";import{attrf as l,commonStyles as p,useInvalidateScrollTimeline as c,useIsEmpty as h}from"#package/ui-sdk";import{ASSISTANT_PANEL_SLOT as m,AssistantPanel as u,useIsAssistantPanelOpen as S}from"../../../assistant/index.js";import{SidebarKeys as g}from"../../sidebar-keys/index.js";import{DesktopSidebarBackButton as k}from"../sidebar-back-button/index.js";import{DesktopSidebarContent as x,useSidebarContent as E}from"../sidebar-contents/index.js";import{DesktopSidebarFooter as f}from"../sidebar-footer/index.js";import{DesktopSidebarTabs as v}from"../sidebar-tabs/index.js";let R="PhxDesktopSidebar",y={Root:d("div",{name:R,slot:"root",shouldForwardProp:r=>"ownerState"!==r})(({ownerState:r})=>[`
+      --phx-sidebar-background: ${r.background};
+      --phx-sidebar-border: ${r.border};
+      --phx-sidebar-filter: ${r.filter};
+      --phx-sidebar-padding: ${r.padding};
+      --phx-sidebar-radius: ${r.borderRadius}px;
+      --phx-sidebar-scrollable-indicator-background: ${r.scrollableIndicatorBackground};
+    `,{borderRadius:"var(--phx-sidebar-radius)",display:"grid",filter:"var(--phx-sidebar-filter)",gridTemplateRows:"min-content minmax(0, 1fr) min-content",inlineSize:r.width,...void 0===r.width&&{blockSize:"100%",inlineSize:"100%"},position:"relative","& > *":{pointerEvents:"auto"},"@container style(--inspect: on)":{"--phx-sidebar-background":"hsl(from gold h s l / 50%)"},[`&[data-sidebar*="${g.Visible}"]`]:{opacity:1},[`&[data-sidebar*="${g.Hidden}"]`]:{opacity:0},[`&[data-sidebar*="${g.Assistant}"] > :not([data-sidebar="${m}"])`]:{visibility:"hidden"}}]),Tabs:d("div",{name:R,slot:"tabs",shouldForwardProp:r=>"ownerState"!==r})(({ownerState:r,theme:{spacing:a}})=>({insetBlockStart:0,insetInlineEnd:"100%",maxInlineSize:150,paddingInlineEnd:a(2),position:"absolute",..."start"===r.side&&{insetInlineEnd:"auto",insetInlineStart:"100%",paddingInlineEnd:0,paddingInlineStart:a(2),[`.${i.indicator}`]:{left:0,right:"auto"}},"&:is(:empty)":{padding:0},[`.${e.root}`]:{boxShadow:"none"}})),Header:d("header",{name:R,slot:"header",shouldForwardProp:r=>"ownerState"!==r})({background:"var(--phx-sidebar-background)",border:"var(--phx-sidebar-border)",borderBlockEnd:0,borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",paddingBlock:"calc(0.6 * var(--phx-sidebar-padding))",paddingInline:"var(--phx-sidebar-padding)","&:is(:empty)":{border:0,paddingBlock:0}}),Body:d("div",{name:R,slot:"body",shouldForwardProp:r=>"ownerState"!==r})(({ownerState:r})=>({background:"var(--phx-sidebar-background)",border:"var(--phx-sidebar-border)",borderBlockStart:0,borderBlockEnd:0,display:"grid",position:"relative","[data-sidebar] &":{...r.isHeaderEmpty&&{borderBlockStart:"var(--phx-sidebar-border)",borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",paddingBlockStart:"var(--phx-sidebar-padding)"}},'&:has([data-sidebar*="slot[content]"]:empty)':{...r.isContentEmpty&&{paddingBlock:0}},[`[data-sidebar*="${g.Minimalist}"] &`]:{...r.isContentEmpty&&{border:0}},[`[data-sidebar*="${g.Split}"] &`]:{borderBlockEnd:"var(--phx-sidebar-border)",borderEndStartRadius:"inherit",borderEndEndRadius:"inherit",paddingBlockEnd:"var(--phx-sidebar-padding)"}})),Content:d("div",{name:R,slot:"content",shouldForwardProp:r=>"ownerState"!==r})(({ownerState:r,theme:{spacing:a}})=>({...p.layout.normalizeScrollableContainer,alignContent:"start",borderRadius:"inherit",display:"grid",gap:a(3),padding:"var(--phx-sidebar-padding)","@supports (animation-timeline: scroll())":{"&[data-scrollable]":{scrollTimeline:"--phx-sidebar-timeline y","&::after, &::before":{animation:`${p.keyframes.fadeIn} both`,animationTimeline:"--phx-sidebar-timeline",background:"var(--phx-sidebar-scrollable-indicator-background)",backgroundRepeat:"no-repeat",content:'""',display:"block",insetInline:0,opacity:0,pointerEvents:"none",position:"absolute",zIndex:1},"&::after":{animationDirection:"reverse",animationRange:`calc(100% - ${a(4)}) 100%`,borderEndStartRadius:"inherit",borderEndEndRadius:"inherit",insetBlockStart:"50%",insetBlockEnd:0,scale:"1 -1"},"&::before":{animationRange:`0 ${a(4)}`,borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",insetBlockStart:0,insetBlockEnd:"50%"}}},"&:is(:empty)":{paddingBlock:0},"[data-sidebar] &":{...r.isHeaderEmpty&&{paddingBlockStart:0,"&::before":{borderStartStartRadius:0,borderStartEndRadius:0,insetBlockStart:"var(--phx-sidebar-padding)"}}},[`[data-sidebar*="${g.Split}"] &`]:{paddingBlockEnd:0,"&::after":{borderEndStartRadius:0,borderEndEndRadius:0,insetBlockEnd:"var(--phx-sidebar-padding)"}}})),Footer:d("footer",{name:R,slot:"footer",shouldForwardProp:r=>"ownerState"!==r})(({ownerState:r,theme:{palette:a,spacing:e}})=>({background:"var(--phx-sidebar-background)",border:"var(--phx-sidebar-border)",borderBlockStart:`1px solid ${a.divider}`,borderEndStartRadius:"inherit",borderEndEndRadius:"inherit",padding:"var(--phx-sidebar-padding)","&:is(:empty)":{border:0,paddingBlock:0},[`[data-sidebar*="${g.Minimalist}"] &`]:{...r.isContentEmpty&&{borderBlockStart:"var(--phx-sidebar-border)",borderStartStartRadius:"inherit",borderStartEndRadius:"inherit"}},[`[data-sidebar*="${g.Split}"] &`]:{borderBlockStart:"var(--phx-sidebar-border)",borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",marginBlockStart:e(2)}}))};export const DesktopSidebar=({width:e,side:d="end"})=>{let[i,p]=s(null),[m,B]=s(null),$=n(()=>({current:i}),[i]),w=n(()=>({current:m}),[m]),{palette:I,shape:j,spacing:C}=t(),{background:F=I.background.paper,border:H=0,borderRadius:P=j.sidebarBorderRadius??j.borderRadius,filter:z=`
+      drop-shadow(0 1px 1.5px hsl(from ${I.common.black} h s l / 12%))
+      drop-shadow(0 1px 0.5px hsl(from ${I.common.black} h s l / 14%))
+      drop-shadow(0 2px 0.5px hsl(from ${I.common.black} h s l / 20%))
+    `,padding:T=C(2.5),scrollableIndicatorBackground:D=`linear-gradient(
+      180deg,
+      hsl(from black h s l / 12%),
+      hsl(from black h s l / 0%) 8px
+    )`}=o({props:{},name:R}),{hasMiniSidebar:M,hasSplitSidebar:A}=E(),V=S(),q=!b(),G=h($,{disabled:!q}),J=h(w,{disabled:!q});c(w,{disabled:!q});let K={background:F,border:H,borderRadius:P,filter:z,isHeaderEmpty:G,isContentEmpty:J,padding:T,scrollableIndicatorBackground:D,width:e};return a(y.Root,{ownerState:K,"data-sidebar":l({variant:{[`${g.Minimalist}`]:M,[`${g.Split}`]:A},state:{[`${g.Visible}`]:q,[`${g.Hidden}`]:!q,[`${g.Assistant}`]:V}}),inert:q?void 0:"",children:[r(y.Tabs,{ownerState:{...K,side:d},"data-sidebar":"slot[tabs]",children:r(v,{})}),r(y.Header,{ref:p,ownerState:K,"data-sidebar":"slot[header]",children:r(k,{})}),r(y.Body,{ownerState:K,"data-sidebar":"slot[body]",children:r(y.Content,{ref:B,ownerState:K,"data-sidebar":"slot[content]",children:r(x,{})})}),r(y.Footer,{ownerState:K,"data-sidebar":"slot[footer]",children:r(f,{})}),r(u,{})]})};

package/dist/configurator/ui/configurator-layout/slots/desktop-sidebar/index.d.ts

@@ -0,0 +1 @@
+export { DesktopSidebar, type DesktopSidebarProps, type DesktopSidebarSide } from './DesktopSidebar.js';

package/dist/configurator/ui/configurator-layout/slots/desktop-sidebar/index.js

@@ -0,0 +1 @@
+export{DesktopSidebar}from"./DesktopSidebar.js";

package/dist/configurator/ui/configurator-layout/slots/mobile-tabs/use-mobile-tabs.d.ts

@@ -1,7 +1,7 @@
 export declare const useMobileTabs: () => {
     tabs: {
         label: string;
-        icon: import("react").ReactNode;
+        icon: string | number | boolean | Iterable<import("react").ReactNode> | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
         value: string;
         isActive: boolean;
     }[];

package/dist/configurator/ui/configurator-layout/slots/mobile-tabs/use-mobile-tabs.js

@@ -1 +1 @@
-import{useCallback as e,useMemo as t}from"react";import{horizontalTabsComponent as o,sidebarTabsComponent as n}from"#package/domain";import{useActiveNavigationState as a,useComponents as i,useDomain as r,useResolveLocalizable as s,useSelectedDomainEntityId as c}from"#package/react-sdk";import{useIsSidebarSummaryActive as l}from"../../../../configurator-context/index.js";export const useMobileTabs=()=>{let m=a(),b=i({componentTypes:[n],entityIds:[c()]}),d=i({componentTypes:[o]}),p=t(()=>{if(b.length>0&&d.length>0)throw Error("Both sidebar tabs and horizontal tabs are configured, only one tabs component type can be used at a time, remove either sidebarTabs or horizontalTabs from your domain configuration");if(b.length>1)throw Error("Multiple sidebar tab components are active, only one sidebar tabs component can be active at a time, check your domain configuration to ensure only one sidebarTabs component is defined");if(d.length>1)throw Error("Multiple horizontal tab components are active, only one horizontal tabs component can be active at a time, check your domain configuration to ensure only one horizontalTabs component is defined");return b.length>0?b.at(0):d.at(0)},[b,d]),h=s(),u=l(),g=t(()=>p?p.state.tabs.map(e=>{let t=e.navigationStates[0];if(!t)throw Error(`Tab ${h(e.label)} has no navigation states!`);return{label:h(e.label),icon:e.icon,value:t,isActive:e.navigationStates.includes(m)}}):[],[p,m,h]),{navigationSystem:f,storeSystem:v}=r(),y=e(e=>{v.stageAndCommit([f.getNavigationUpdate(e)])},[f,v]),T=t(()=>{let e=g.find(e=>e.isActive);return e?.value??"none"},[g]);return u?{tabs:[],activeTab:"none",onChange:()=>{}}:{tabs:g,activeTab:T,onChange:y}};
+import{useCallback as t,useMemo as e}from"react";import{horizontalTabsComponent as o,sidebarTabsComponent as a}from"#package/domain";import{useComponents as n,useDomain as i,useResolveLocalizable as r,useSelectedDomainEntityId as s,useTabNavigation as c}from"#package/react-sdk";import{useIsSidebarSummaryActive as b}from"../../../../configurator-context/index.js";export const useMobileTabs=()=>{let{tabs:l,activeTab:m}=c(),{navigationSystem:p,storeSystem:d}=i(),h=n({componentTypes:[a],entityIds:[s()]}),f=n({componentTypes:[o]}),g=r(),u=b(),v=e(()=>l.map(t=>({label:t.label,icon:t.iconNode??t.icon,value:t.state,isActive:t.isActive})),[l]),y=t(t=>{d.stageAndCommit([p.getNavigationUpdate(t)])},[p,d]),T=m?.state??"none";if(h.length>0&&f.length>0)throw Error("Both sidebar tabs and horizontal tabs are configured, only one tabs component type can be used at a time, remove either sidebarTabs or horizontalTabs from your domain configuration");if(h.length>1)throw Error("Multiple sidebar tab components are active, only one sidebar tabs component can be active at a time, check your domain configuration to ensure only one sidebarTabs component is defined");if(f.length>1)throw Error("Multiple horizontal tab components are active, only one horizontal tabs component can be active at a time, check your domain configuration to ensure only one horizontalTabs component is defined");let k=[...h.flatMap(t=>t.state.tabs),...f.flatMap(t=>t.state.tabs)].find(t=>0===t.navigationStates.length);if(k)throw Error(`Tab ${g(k.label)} has no navigation states!`);return u?{tabs:[],activeTab:"none",onChange:()=>{}}:{tabs:v,activeTab:T,onChange:y}};

package/dist/configurator/ui/configurator-layout/slots/services/InvariantViolations.d.ts

@@ -1,8 +1,8 @@
 /**
- * InvariantViolations component that monitors domain store validity and displays
- * violation notifications using notistack snackbars.
+ * InvariantViolations component that shows the violation and error messages of
+ * `useConfiguratorMessages` as notistack snackbars.
  *
- * This component subscribes to the store's validity state and shows appropriate
- * error messages for uncaught errors and entity validation violations.
+ * An uncaught error is also logged; each entity violation becomes one snackbar
+ * prefixed with the id of its entity.
  */
 export declare const InvariantViolations: () => null;

package/dist/configurator/ui/configurator-layout/slots/services/InvariantViolations.js

@@ -1 +1 @@
-import{jsx as r}from"react/jsx-runtime";import{Trans as t}from"@lingui/react";import{useSnackbar as i}from"notistack";import{useSubscription as e}from"observable-hooks";import{useMemo as a}from"react";import{map as o}from"rxjs";import{match as n}from"ts-pattern";import{useDomain as s,useLogger as m,useResolveLocalizable as l}from"#package/react-sdk";export const InvariantViolations=()=>{let{storeSystem:p}=s(),{enqueueSnackbar:g}=i(),c=l(),f=m();return e(a(()=>p.stateSlices.potentiallyInvalid.pipe(o(r=>r.validity)),[p]),i=>{if(!i.valid&&"uncaught"===i.severity){f.error("Uncaught error",i.error),g(r(t,{id:"sdk.messages.validation.uncaughtError.message",message:"Oops, something went wrong"}),{variant:"error"});return}i.valid||i.entityViolations.forEach(({violation:r,entityId:t})=>{let i=c(r.message??r.type);g(`${String(t)}: ${i}`,{variant:n(r.severity).with("notice",()=>"info").with("warning",()=>"warning").with("fixable",()=>"error").with("fatal",()=>"error").exhaustive()})})}),null};
+import{jsx as r}from"react/jsx-runtime";import{Trans as i}from"@lingui/react";import{useSnackbar as t}from"notistack";import{match as e}from"ts-pattern";import{useConfiguratorMessages as a,useLogger as n}from"#package/react-sdk";export const InvariantViolations=()=>{let{enqueueSnackbar:o}=t(),s=n();return a(t=>{e(t).with({kind:"error"},({error:t})=>{s.error("Uncaught error",t),o(r(i,{id:"sdk.messages.validation.uncaughtError.message",message:"Oops, something went wrong"}),{variant:"error"})}).with({kind:"violation"},({entityId:r,violation:i,text:t})=>{o(`${String(r)}: ${t}`,{variant:e(i.severity).with("notice",()=>"info").with("warning",()=>"warning").with("fixable",()=>"error").with("fatal",()=>"error").exhaustive()})}).with({kind:"sideEffect"},()=>{}).with({kind:"saveError"},{kind:"saveRecovery"},()=>{}).exhaustive()}),null};

package/dist/configurator/ui/configurator-layout/slots/services/Services.js

@@ -1 +1 @@
-import{jsx as r,jsxs as s,Fragment as t}from"react/jsx-runtime";import{memo as o}from"react";import{InvariantViolations as i}from"./InvariantViolations.js";import{SideEffects as e}from"./SideEffects.js";export const Services=o(()=>s(t,{children:[r(i,{}),r(e,{})]}));
+import{jsx as r,jsxs as s,Fragment as e}from"react/jsx-runtime";import{memo as o}from"react";import{SaveMessageSnackbars as t}from"../../../save-message-snackbars/index.js";import{InvariantViolations as a}from"./InvariantViolations.js";import{SideEffects as i}from"./SideEffects.js";export const Services=o(()=>s(e,{children:[r(a,{}),r(i,{}),r(t,{})]}));

package/dist/configurator/ui/configurator-layout/slots/services/SideEffects.d.ts

@@ -1,9 +1,6 @@
 /**
- * SideEffects component that listens to domain store updates and displays
- * informational snackbars for updates that contain hint messages.
- *
- * This component renders nothing but subscribes to the committed state changes
- * from the domain store system and shows user-friendly notifications for
- * operations that provide feedback hints.
+ * SideEffects component that shows the side-effect messages of
+ * `useConfiguratorMessages`, the hints of committed updates, as informational
+ * notistack snackbars.
  */
 export declare const SideEffects: () => null;

package/dist/configurator/ui/configurator-layout/slots/services/SideEffects.js

@@ -1 +1 @@
-import{useSnackbar as t}from"notistack";import{useSubscription as r}from"observable-hooks";import{useMemo as e}from"react";import{distinctUntilChanged as o,map as i,skip as a}from"rxjs/operators";import{useDomain as m,useResolveLocalizable as n}from"#package/react-sdk";let p=[];export const SideEffects=()=>{let{storeSystem:s}=m(),f=n(),{enqueueSnackbar:c}=t();return r(e(()=>s.stateSlices.committed.pipe(a(1),o(),i(t=>{if("updates"in t){let r=t.updates.filter(t=>!!t.hint);return r.length>0?r:p}return p})),[s]),t=>{t.forEach(t=>{c(f(t.hint),{variant:"info"})})}),null};
+import{useSnackbar as t}from"notistack";import{useConfiguratorMessages as e}from"#package/react-sdk";export const SideEffects=()=>{let{enqueueSnackbar:r}=t();return e(t=>{"sideEffect"===t.kind&&r(t.text,{variant:"info"})}),null};

package/dist/configurator/ui/configurator-layout/slots/sidebar-tabs/use-sidebar-tabs.d.ts

@@ -1,7 +1,7 @@
 export declare const useSidebarTabs: () => {
     tabs: {
         label: string;
-        icon: import("react").ReactNode;
+        icon: string | number | boolean | Iterable<import("react").ReactNode> | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
         value: string;
         isActive: boolean;
     }[];

package/dist/configurator/ui/configurator-layout/slots/sidebar-tabs/use-sidebar-tabs.js

@@ -1 +1 @@
-import{useCallback as t,useMemo as a}from"react";import{sidebarTabsComponent as e}from"#package/domain";import{useActiveNavigationState as n,useComponents as o,useDomain as i,useResolveLocalizable as r,useSelectedDomainEntityId as s}from"#package/react-sdk";import{useIsSidebarSummaryActive as c}from"../../../../configurator-context/index.js";export const useSidebarTabs=()=>{let m=n(),p=o({componentTypes:[e],entityIds:[s()]}),g=r(),l=c(),d=a(()=>(p??[]).flatMap(t=>t.state.tabs).map(t=>{let a=t.navigationStates[0];if(!a)throw Error(`Tab ${a} has no navigation states!`);return{label:g(t.label),icon:t.icon,value:a,isActive:t.navigationStates.includes(m)}}),[p,m,g]),{navigationSystem:b,storeSystem:f}=i(),v=t(t=>{f.stageAndCommit([b.getNavigationUpdate(t)])},[b,f]),u=a(()=>{let t=d.find(t=>t.isActive);return t?.value??"none"},[d]);return l?{tabs:[],activeTab:"none",onChange:()=>{}}:{tabs:d,activeTab:u,onChange:v}};
+import{useCallback as t,useMemo as a}from"react";import{sidebarTabsComponent as e}from"#package/domain";import{useComponents as o,useResolveLocalizable as n,useSelectedDomainEntityId as i,useTabNavigation as s}from"#package/react-sdk";import{useIsSidebarSummaryActive as r}from"../../../../configurator-context/index.js";export const useSidebarTabs=()=>{let{tabs:c,activeTab:b,select:m}=s({source:"sidebarTabs"}),p=o({componentTypes:[e],entityIds:[i()]}),d=n(),l=r(),f=a(()=>c.map(t=>({label:t.label,icon:t.iconNode??t.icon,value:t.state,isActive:t.isActive})),[c]),g=t(t=>{m(c.findIndex(a=>a.state===t))},[m,c]),v=b?.state??"none",T=p.flatMap(t=>t.state.tabs).find(t=>0===t.navigationStates.length);if(T)throw Error(`Tab ${d(T.label)} has no navigation states!`);return l?{tabs:[],activeTab:"none",onChange:()=>{}}:{tabs:f,activeTab:v,onChange:g}};

package/dist/configurator/ui/configurator-layout/slots/slots.d.ts

@@ -1,5 +1,6 @@
 export * from './call-to-action/index.js';
 export * from './canvas/index.js';
+export * from './desktop-sidebar/index.js';
 export * from './footer/index.js';
 export * from './hamburger-menu/index.js';
 export * from './header/index.js';

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

@@ -1 +1 @@
-export*from"./call-to-action/index.js";export*from"./canvas/index.js";export*from"./footer/index.js";export*from"./hamburger-menu/index.js";export*from"./header/index.js";export*from"./mobile-tabs/index.js";export*from"./powered-by/index.js";export*from"./readonly-banner/index.js";export*from"./services/index.js";export*from"./sidebar-back-button/index.js";export*from"./sidebar-contents/index.js";export*from"./sidebar-footer/index.js";export*from"./sidebar-tabs/index.js";export*from"./snackbar-root/index.js";export*from"./toolbar/index.js";export*from"./tool-controls/index.js";export*from"./view-controls/index.js";
+export*from"./call-to-action/index.js";export*from"./canvas/index.js";export*from"./desktop-sidebar/index.js";export*from"./footer/index.js";export*from"./hamburger-menu/index.js";export*from"./header/index.js";export*from"./mobile-tabs/index.js";export*from"./powered-by/index.js";export*from"./readonly-banner/index.js";export*from"./services/index.js";export*from"./sidebar-back-button/index.js";export*from"./sidebar-contents/index.js";export*from"./sidebar-footer/index.js";export*from"./sidebar-tabs/index.js";export*from"./snackbar-root/index.js";export*from"./toolbar/index.js";export*from"./tool-controls/index.js";export*from"./view-controls/index.js";

package/dist/configurator/ui/configurator-layout/universal/DesktopLayout.d.ts

@@ -1,7 +1,6 @@
 import type { ComponentsOverrides } from '@mui/material';
 import type { CSSProperties } from 'react';
 import type { ValueOf } from '@salsita-ai/common/utils';
-export type { ThemeableDesktopSidebarProps } from './DesktopSidebar.js';
 export declare const PhxDesktopLayoutName: 'PhxDesktopLayout';
 declare const MuiLayoutComponentName: "PhxDesktopLayout";
 declare const MuiLayoutSlots: {
@@ -31,3 +30,4 @@ export interface ThemeableDesktopLayoutProps {
     readonly sidebarWidth?: CSSProperties['width'];
 }
 export declare const DesktopLayout: () => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -1,4 +1,4 @@
-import{jsx as t,jsxs as a,Fragment as o}from"react/jsx-runtime";import{keyframes as e,snackbarClasses as i,styled as r,useThemeProps as d}from"@mui/material";import{AnimatePresence as l,motion as n}from"motion/react";import{useCallback as s}from"react";import{useAccessService as u,useIsFullscreenActive as m}from"#package/react-sdk";import{attrf as p,commonStyles as y,numToPx as c,useResponsive as b}from"#package/ui-sdk";import{usePreview as h}from"../../../configurator-context/index.js";import{useIsAssistantPanelOpen as f}from"../../assistant/index.js";import{LayoutSlots as g}from"../slots/index.js";import{DesktopPreview as x}from"./DesktopPreview.js";import{DesktopSidebar as v,SidebarKeys as k}from"./DesktopSidebar.js";import{useLayoutSceneSafeArea as w}from"./use-layout-scene-safe-area.js";export const PhxDesktopLayoutName="PhxDesktopLayout";let C="PhxDesktopLayout",D=r(n.div,{name:C,slot:"root",shouldForwardProp:t=>"ownerState"!==t})(({ownerState:t,theme:{spacing:a}})=>{let o=e({"0%":{marginInlineEnd:0},"100%":{marginInlineEnd:a(-2)}});return[`
+import{jsx as t,jsxs as a,Fragment as o}from"react/jsx-runtime";import{keyframes as e,snackbarClasses as i,styled as r,useThemeProps as d}from"@mui/material";import{AnimatePresence as l,motion as s}from"motion/react";import{useCallback as n}from"react";import{useAccessService as u,useIsFullscreenActive as m}from"#package/react-sdk";import{attrf as p,commonStyles as y,numToPx as c,useResponsive as b}from"#package/ui-sdk";import{usePreview as h}from"../../../configurator-context/index.js";import{useIsAssistantPanelOpen as f}from"../../assistant/index.js";import{SidebarKeys as g}from"../sidebar-keys/index.js";import{LayoutSlots as x}from"../slots/index.js";import{DesktopPreview as v}from"./DesktopPreview.js";import{useLayoutSceneSafeArea as k}from"./use-layout-scene-safe-area.js";export const PhxDesktopLayoutName="PhxDesktopLayout";let w="PhxDesktopLayout",C=r(s.div,{name:w,slot:"root",shouldForwardProp:t=>"ownerState"!==t})(({ownerState:t,theme:{spacing:a}})=>{let o=e({"0%":{marginInlineEnd:0},"100%":{marginInlineEnd:a(-2)}});return[`
       --inspect: off;  // 🕹️ inspection mode toggle
 
       --phx-layout-sidebar-track-size: ${c(t.sidebarWidth)};
@@ -31,4 +31,4 @@ import{jsx as t,jsxs as a,Fragment as o}from"react/jsx-runtime";import{keyframes
         [bottom-start]
         min-content
         [bottom-end full-end]
-      `,inset:0,isolation:"isolate",pointerEvents:"none",position:"absolute","@container style(--inspect: on)":{'& > *, & > * > *, [data-layout*="slot[body.footer]"] > *':{outline:"2px solid hsl(from tomato h s l / 50%)"}},'[data-layout*="interactive"]':{"& > *":{pointerEvents:"auto"}},'[data-layout*="slot[header]"]':{gridArea:"top-start / main-start / top-end / sidebar-end"},'[data-layout*="slot[body]"]':{containerType:"size",display:"grid",gridArea:"main",gridRowStart:"top-end",gridTemplateRows:"min-content 1fr min-content"},'[data-layout*="slot[body.top]"]':{gridArea:"1 / 1 / 2 / -1","& > *":{...y.transition.fadeIn}},'[data-layout*="slot[body.safeSceneArea]"]':{gridArea:"1 / 1 / 3 / -1","@container style(--inspect: on)":{background:"hsl(from lime h s l / 50%)"}},'[data-layout*="slot[body.bottom]"]':{alignItems:"end",display:"grid",gap:a(2),gridArea:"3 / 1 / 4 / -1",gridTemplateColumns:"minmax(0, auto) minmax(60px, 1fr)",justifyContent:"start",position:"relative",'&:has([data-layout="slot[body.viewControls]"]:empty)':{gap:0,gridTemplateColumns:"repeat(2, auto)"}},'[data-layout="slot[body.toolbar]"]':{animation:`${o} auto linear both`,animationTimeline:"scroll(self inline)",display:"flex",margin:a(-2),overflowX:"scroll",overscrollBehavior:"contain",padding:a(2),scrollbarWidth:"none","&::after":{content:'""'}},'[data-layout="slot[body.toolControls]"]':{insetBlockEnd:`calc(100% + ${a(6)})`,position:"absolute","& > *":{...y.transition.fadeIn,transitionDuration:"300ms"}},'[data-layout="slot[body.viewControls]"]':{},'[data-layout="slot[body.logo]"], [data-layout="slot[body.sideEffects]"]':{insetBlockEnd:`calc(100% + ${a(2)})`,position:"absolute"},'[data-layout="slot[body.sideEffects]"]':{insetInline:0,[`.${i.root}`]:{inset:"unset",insetBlockEnd:0,position:"absolute"}},'[data-layout*="slot[sidebar]"]':{display:"grid",gridArea:"top-start / sidebar-start / main-end / sidebar-end",gridTemplateRows:"minmax(0, auto)"},'[data-layout*="slot[footer]"]':{display:"grid",gap:"var(--phx-layout-gap)",gridArea:"bottom-start / full-start / bottom-end / full-end"},'&:has([data-header*="fixed"])':{'[data-layout*="slot[header]"]':{gridArea:"full-start / full-start / top-end / full-end"},'[data-layout*="slot[body]"]':{gridRowStart:"main-start"},'[data-layout*="slot[sidebar]"]':{gridRow:"main-start / main-end"}},'&:has([data-header*="floating"])':{'[data-layout*="slot[header]"]':{gridColumnEnd:"main-end"}},[`&:has([data-sidebar*="${k.Minimalist}"])`]:{'[data-layout*="slot[sidebar]"]':{alignContent:"end",gridRow:"main-start / main-end"}},[`&:has([data-header*="floating"]):has([data-sidebar*="${k.Minimalist}"])`]:{'[data-layout*="slot[header]"]':{gridColumnEnd:"sidebar-end"},'[data-layout*="slot[sidebar]"]':{gridRowStart:"top-end"}},[`&:has([data-sidebar*="${k.Assistant}"])`]:{'[data-layout*="slot[sidebar]"]':{alignContent:"stretch"}},[`&:has([data-sidebar*="${k.Hidden}"])`]:{"--phx-layout-gap":0,"--phx-layout-sidebar-track-size":0,'[data-layout*="slot[sidebar]"]':{overflow:"hidden"}}}]}),A=r("div")({gridArea:"1 / 1 / -1 / -1"});export const DesktopLayout=()=>{let{sidebarWidth:e="clamp(360px, 30cqi, 400px)"}=d({props:{},name:C}),{hasMiniSidebar:i}=g.useSidebarContent(),r=f(),{accessInfo:n}=u(),y=m(),{isPreview:c,isHidden:k}=h(),E=!k&&!c,{setAnimating:S}=b(),{containerRef:T,safeAreaRef:$,update:j}=w({enabled:E,hasMiniSidebar:i&&!r}),R=s(()=>{S(!0)},[S]),I=s(()=>{S(!1),j()},[S,j]);return t(o,{children:a(l,{mode:"wait",children:[!k&&c&&t(x,{},"preview-layout"),E&&a(D,{layoutId:"ui-layout",layout:!0,ownerState:{sidebarWidth:e},"data-layout":p({state:{initial:!y,fullscreen:y}}),onLayoutAnimationStart:R,onLayoutAnimationComplete:I,children:[t(A,{ref:T}),t("header",{"data-layout":"slot[header]",children:t(g.DesktopHeader,{})}),a("main",{"data-layout":"slot[body]",children:[t("div",{"data-layout":"slot[body.top] interactive",children:t(g.DesktopCallToAction,{})}),t("div",{ref:$,"data-layout":"slot[body.safeSceneArea]"}),a("div",{"data-layout":"slot[body.bottom] interactive",children:[t("div",{"data-layout":"slot[body.toolbar]",children:t(g.DesktopToolbar,{})}),t("div",{"data-layout":"slot[body.toolControls]",children:!y&&t(g.DesktopToolControls,{})}),t("div",{"data-layout":"slot[body.viewControls]",children:t(g.DesktopViewControls,{})}),t("div",{"data-layout":"slot[body.logo]",children:t(g.DesktopPoweredBy,{})}),t("div",{"data-layout":"slot[body.sideEffects]",children:t(g.DesktopSnackbarsRoot,{})})]})]}),t("aside",{"data-layout":"slot[sidebar]",children:t(v,{width:e})}),a("footer",{"data-layout":"slot[footer] interactive",children:[n.viewMode&&!y&&t(g.DesktopReadonlyBanner,{}),t(g.DesktopFooter,{})]})]},"interface-layout")]})})};
+      `,inset:0,isolation:"isolate",pointerEvents:"none",position:"absolute","@container style(--inspect: on)":{'& > *, & > * > *, [data-layout*="slot[body.footer]"] > *':{outline:"2px solid hsl(from tomato h s l / 50%)"}},'[data-layout*="interactive"]':{"& > *":{pointerEvents:"auto"}},'[data-layout*="slot[header]"]':{gridArea:"top-start / main-start / top-end / sidebar-end"},'[data-layout*="slot[body]"]':{containerType:"size",display:"grid",gridArea:"main",gridRowStart:"top-end",gridTemplateRows:"min-content 1fr min-content"},'[data-layout*="slot[body.top]"]':{gridArea:"1 / 1 / 2 / -1","& > *":{...y.transition.fadeIn}},'[data-layout*="slot[body.safeSceneArea]"]':{gridArea:"1 / 1 / 3 / -1","@container style(--inspect: on)":{background:"hsl(from lime h s l / 50%)"}},'[data-layout*="slot[body.bottom]"]':{alignItems:"end",display:"grid",gap:a(2),gridArea:"3 / 1 / 4 / -1",gridTemplateColumns:"minmax(0, auto) minmax(60px, 1fr)",justifyContent:"start",position:"relative",'&:has([data-layout="slot[body.viewControls]"]:empty)':{gap:0,gridTemplateColumns:"repeat(2, auto)"}},'[data-layout="slot[body.toolbar]"]':{animation:`${o} auto linear both`,animationTimeline:"scroll(self inline)",display:"flex",margin:a(-2),overflowX:"scroll",overscrollBehavior:"contain",padding:a(2),scrollbarWidth:"none","&::after":{content:'""'}},'[data-layout="slot[body.toolControls]"]':{insetBlockEnd:`calc(100% + ${a(6)})`,position:"absolute","& > *":{...y.transition.fadeIn,transitionDuration:"300ms"}},'[data-layout="slot[body.viewControls]"]':{},'[data-layout="slot[body.logo]"], [data-layout="slot[body.sideEffects]"]':{insetBlockEnd:`calc(100% + ${a(2)})`,position:"absolute"},'[data-layout="slot[body.sideEffects]"]':{insetInline:0,[`.${i.root}`]:{inset:"unset",insetBlockEnd:0,position:"absolute"}},'[data-layout*="slot[sidebar]"]':{display:"grid",gridArea:"top-start / sidebar-start / main-end / sidebar-end",gridTemplateRows:"minmax(0, auto)"},'[data-layout*="slot[footer]"]':{display:"grid",gap:"var(--phx-layout-gap)",gridArea:"bottom-start / full-start / bottom-end / full-end"},'&:has([data-header*="fixed"])':{'[data-layout*="slot[header]"]':{gridArea:"full-start / full-start / top-end / full-end"},'[data-layout*="slot[body]"]':{gridRowStart:"main-start"},'[data-layout*="slot[sidebar]"]':{gridRow:"main-start / main-end"}},'&:has([data-header*="floating"])':{'[data-layout*="slot[header]"]':{gridColumnEnd:"main-end"}},[`&:has([data-sidebar*="${g.Minimalist}"])`]:{'[data-layout*="slot[sidebar]"]':{alignContent:"end",gridRow:"main-start / main-end"}},[`&:has([data-header*="floating"]):has([data-sidebar*="${g.Minimalist}"])`]:{'[data-layout*="slot[header]"]':{gridColumnEnd:"sidebar-end"},'[data-layout*="slot[sidebar]"]':{gridRowStart:"top-end"}},[`&:has([data-sidebar*="${g.Assistant}"])`]:{'[data-layout*="slot[sidebar]"]':{alignContent:"stretch"}},[`&:has([data-sidebar*="${g.Hidden}"])`]:{"--phx-layout-gap":0,"--phx-layout-sidebar-track-size":0,'[data-layout*="slot[sidebar]"]':{overflow:"hidden"}}}]}),D=r("div")({gridArea:"1 / 1 / -1 / -1"});export const DesktopLayout=()=>{let{sidebarWidth:e="clamp(360px, 30cqi, 400px)"}=d({props:{},name:w}),{hasMiniSidebar:i}=x.useSidebarContent(),r=f(),{accessInfo:s}=u(),y=m(),{isPreview:c,isHidden:g}=h(),A=!g&&!c,{setAnimating:E}=b(),{containerRef:S,safeAreaRef:T,update:$}=k({enabled:A,hasMiniSidebar:i&&!r}),j=n(()=>{E(!0)},[E]),R=n(()=>{E(!1),$()},[E,$]);return t(o,{children:a(l,{mode:"wait",children:[!g&&c&&t(v,{},"preview-layout"),A&&a(C,{layoutId:"ui-layout",layout:!0,ownerState:{sidebarWidth:e},"data-layout":p({state:{initial:!y,fullscreen:y}}),onLayoutAnimationStart:j,onLayoutAnimationComplete:R,children:[t(D,{ref:S}),t("header",{"data-layout":"slot[header]",children:t(x.DesktopHeader,{})}),a("main",{"data-layout":"slot[body]",children:[t("div",{"data-layout":"slot[body.top] interactive",children:t(x.DesktopCallToAction,{})}),t("div",{ref:T,"data-layout":"slot[body.safeSceneArea]"}),a("div",{"data-layout":"slot[body.bottom] interactive",children:[t("div",{"data-layout":"slot[body.toolbar]",children:t(x.DesktopToolbar,{})}),t("div",{"data-layout":"slot[body.toolControls]",children:!y&&t(x.DesktopToolControls,{})}),t("div",{"data-layout":"slot[body.viewControls]",children:t(x.DesktopViewControls,{})}),t("div",{"data-layout":"slot[body.logo]",children:t(x.DesktopPoweredBy,{})}),t("div",{"data-layout":"slot[body.sideEffects]",children:t(x.DesktopSnackbarsRoot,{})})]})]}),t("aside",{"data-layout":"slot[sidebar]",children:t(x.DesktopSidebar,{width:e})}),a("footer",{"data-layout":"slot[footer] interactive",children:[s.viewMode&&!y&&t(x.DesktopReadonlyBanner,{}),t(x.DesktopFooter,{})]})]},"interface-layout")]})})};

package/dist/configurator/ui/configurator-layout/universal/use-layout-scene-safe-area.d.ts

@@ -7,7 +7,7 @@ export interface LayoutSceneSafeAreaOptions {
 }
 /**
  * Measures the gap between a full-area container and an inner "safe area" element,
- * and writes the resulting gaps to the responsive context as canvas padding — letting the
+ * and writes the resulting gaps to the responsive state as canvas padding — letting the
  * 3D scene render only in the region not covered by overlay UI (preview body, sidebar, etc.).
  *
  * The implementation behind `useSceneSafeArea`, with the two things only the built-in

package/dist/configurator/ui/configurator-layout/universal/use-layout-scene-safe-area.js

@@ -1 +1 @@
-import{useCallback as t,useEffect as e,useRef as r}from"react";import{canvasPaddingComponent as n}from"#package/domain";import{useFirstComponent as o}from"#package/react-sdk";import{useResponsive as a}from"#package/ui-sdk";export const useLayoutSceneSafeArea=c=>{let{enabled:u,hasMiniSidebar:i}=c,{setCanvasPadding:m}=a(),l=r(null),s=r(null),f=r(null),h=r(null),p=r(0),g=r(()=>{}),b=o({componentTypes:[n]}),d=t(()=>{let t=s.current,e=f.current;if(!u||!t||!e)return;let r=t.getBoundingClientRect(),n=e.getBoundingClientRect();if(Math.abs(r.width-t.offsetWidth)>1||Math.abs(r.height-t.offsetHeight)>1){if(p.current+=1,p.current>60){p.current=0;return}l.current&&cancelAnimationFrame(l.current),l.current=requestAnimationFrame(()=>g.current());return}p.current=0;let o={bottom:Math.max(0,r.bottom-n.bottom),left:Math.max(0,n.left-r.left),right:Math.max(0,r.right-n.right),top:Math.max(0,n.top-r.top)},a=i?.3:1,c=b?.state.bottom??1,h=b?.state.left??1,d=b?.state.right??a,A=b?.state.top??1;m({bottom:o.bottom*c,left:o.left*h,right:o.right*d,top:o.top*A})},[u,i,b?.state.bottom,b?.state.left,b?.state.right,b?.state.top,m]);g.current=d;let A=t(()=>{l.current&&cancelAnimationFrame(l.current),l.current=requestAnimationFrame(d)},[d]),M=t(()=>{h.current?.disconnect(),h.current=null},[]),k=t(()=>{let t=s.current,e=f.current;if(!u||!t||!e)return void M();M();let r=new ResizeObserver(A);r.observe(t),r.observe(e),h.current=r},[M,u,A]),x=t(t=>{s.current=t,k()},[k]),F=t(t=>{f.current=t,k()},[k]);return e(()=>(k(),()=>{M(),l.current&&cancelAnimationFrame(l.current)}),[k,M]),{containerRef:x,safeAreaRef:F,update:A}};
+import{useCallback as t,useEffect as e,useRef as r}from"react";import{canvasPaddingComponent as n}from"#package/domain";import{useFirstComponent as o,useResponsiveStateManager as a}from"#package/react-sdk";export const useLayoutSceneSafeArea=c=>{let{enabled:u,hasMiniSidebar:i}=c,{setCanvasPadding:l}=a(),m=r(null),s=r(null),f=r(null),h=r(null),g=r(0),p=r(()=>{}),b=o({componentTypes:[n]}),d=t(()=>{let t=s.current,e=f.current;if(!u||!t||!e)return;let r=t.getBoundingClientRect(),n=e.getBoundingClientRect();if(Math.abs(r.width-t.offsetWidth)>1||Math.abs(r.height-t.offsetHeight)>1){if(g.current+=1,g.current>60){g.current=0;return}m.current&&cancelAnimationFrame(m.current),m.current=requestAnimationFrame(()=>p.current());return}g.current=0;let o={bottom:Math.max(0,r.bottom-n.bottom),left:Math.max(0,n.left-r.left),right:Math.max(0,r.right-n.right),top:Math.max(0,n.top-r.top)},a=i?.3:1,c=b?.state.bottom??1,h=b?.state.left??1,d=b?.state.right??a,A=b?.state.top??1;l({bottom:o.bottom*c,left:o.left*h,right:o.right*d,top:o.top*A})},[u,i,b?.state.bottom,b?.state.left,b?.state.right,b?.state.top,l]);p.current=d;let A=t(()=>{m.current&&cancelAnimationFrame(m.current),m.current=requestAnimationFrame(d)},[d]),M=t(()=>{h.current?.disconnect(),h.current=null},[]),x=t(()=>{let t=s.current,e=f.current;if(!u||!t||!e)return void M();M();let r=new ResizeObserver(A);r.observe(t),r.observe(e),h.current=r},[M,u,A]),F=t(t=>{s.current=t,x()},[x]),v=t(t=>{f.current=t,x()},[x]);return e(()=>(x(),()=>{M(),m.current&&cancelAnimationFrame(m.current)}),[x,M]),{containerRef:F,safeAreaRef:v,update:A}};

package/dist/configurator/ui/configurator-layout/universal/use-scene-safe-area.d.ts

@@ -3,7 +3,7 @@
  *
  * A layout attaches `containerRef` to the element that covers the whole canvas and `safeAreaRef`
  * to the region the scene should stay visible in. The hook measures the gap between the two,
- * again whenever either element resizes, and writes it to the responsive context as the canvas
+ * again whenever either element resizes, and writes it to the responsive state as the canvas
  * padding the camera frames the scene with.
  *
  * Returns:

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

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{Trans as e}from"@lingui/react";import{useCallback as i}from"react";import{finalizeButtonComponent as a,finalizePageComponent as o}from"#package/domain";import{useAnalyticsService as n,useDomain as r,useFinalizeViolations as s,useFirstRootComponent as l,useLocalizable as m}from"#package/react-sdk";import{TooltipWithArrow as d,useResponsive as c}from"#package/ui-sdk";import{FrontendAnalyticsFactory as p}from"../../../../common/index.js";import{ResponsiveFinalizeButton as u}from"./ResponsiveFinalizeButton.js";import{MobileThemeableFinalizeButton as f,ThemeableFinalizeButton as g}from"./ThemeableFinalizeButton.js";let h={id:"sdk.finalize.notConfigured.tooltip",message:"Finalize feature is not configured."},k=()=>{let{isMobile:i}=c(),a=m(h);return i?t(d,{title:a,children:t("span",{children:t(f,{disabled:!0})})}):t(d,{title:a,children:t("span",{children:t(g,{disabled:!0,children:t(e,{id:"sdk.layout.sidebar.finalize.label",message:"Add to cart"})})})})},z=e=>{let{finalizeNavigationStates:a}=e,{navigationSystem:o,storeSystem:l}=r(),m=n(),d=i(async()=>{let t=a[0];t&&(m.push(p.FinalizeButtonClicked()),l.stageAndCommit([o.getPushNavigationUpdate(t,l.stateSlices.committed.value.state)]))},[a,o,m,l]),{disabled:c,hints:f}=s();return t(u,{onClick:d,disabled:c,hints:f})};export const CommonFinalizeButton=()=>{let e=l(a),i=l(o);return e?e?.state.button:i?t(z,{finalizeNavigationStates:i.state.finalizeNavigationStates}):t(k,{})};
+import{jsx as t}from"react/jsx-runtime";import{Trans as e}from"@lingui/react";import{useCallback as i}from"react";import{finalizeButtonComponent as a,finalizePageComponent as n}from"#package/domain";import{FrontendAnalyticsFactory as o,useAnalyticsService as r,useDomain as s,useFinalizeViolations as l,useFirstRootComponent as d,useLocalizable as m}from"#package/react-sdk";import{TooltipWithArrow as c,useResponsive as p}from"#package/ui-sdk";import{ResponsiveFinalizeButton as u}from"./ResponsiveFinalizeButton.js";import{MobileThemeableFinalizeButton as f,ThemeableFinalizeButton as g}from"./ThemeableFinalizeButton.js";let h={id:"sdk.finalize.notConfigured.tooltip",message:"Finalize feature is not configured."},k=()=>{let{isMobile:i}=p(),a=m(h);return i?t(c,{title:a,children:t("span",{children:t(f,{disabled:!0})})}):t(c,{title:a,children:t("span",{children:t(g,{disabled:!0,children:t(e,{id:"sdk.layout.sidebar.finalize.label",message:"Add to cart"})})})})},z=e=>{let{finalizeNavigationStates:a}=e,{navigationSystem:n,storeSystem:d}=s(),m=r(),c=i(async()=>{let t=a[0];t&&(m.push(o.FinalizeButtonClicked()),d.stageAndCommit([n.getPushNavigationUpdate(t,d.stateSlices.committed.value.state)]))},[a,n,m,d]),{disabled:p,hints:f}=l();return t(u,{onClick:c,disabled:p,hints:f})};export const CommonFinalizeButton=()=>{let e=d(a),i=d(n);return e?e?.state.button:i?t(z,{finalizeNavigationStates:i.state.finalizeNavigationStates}):t(k,{})};

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

@@ -1 +1 @@
-import{jsx as r}from"react/jsx-runtime";import{Trans as t}from"@lingui/react";import{Button as m,Fab as o,styled as a}from"@mui/material";import{useCallback as e}from"react";import{useAnalyticsService as i}from"#package/react-sdk";import{PhxIcon as n,useResponsive as l}from"#package/ui-sdk";import{FrontendAnalyticsFactory as c}from"../../../../common/index.js";let p=a(o)(({theme:r})=>({backgroundColor:r.palette.primary.main,color:r.palette.getContrastText(r.palette.primary.main)}));export const CommonSummaryButton=o=>{let{onEnterSummary:a}=o,{isMobile:s}=l(),u=i(),d=e(()=>{u.push(c.SummaryButtonClicked()),a()},[u,a]);return s?r(p,{onClick:d,children:r(n,{name:"List"})}):r(m,{color:"primary",variant:"contained",size:"large",fullWidth:!0,endIcon:r(n,{name:"ArrowRight"}),onClick:d,children:r(t,{id:"sdk.layout.summary.button.label",message:"Summary"})})};
+import{jsx as r}from"react/jsx-runtime";import{Trans as t}from"@lingui/react";import{Button as a,Fab as m,styled as o}from"@mui/material";import{useCallback as e}from"react";import{FrontendAnalyticsFactory as i,useAnalyticsService as n}from"#package/react-sdk";import{PhxIcon as l,useResponsive as c}from"#package/ui-sdk";let p=o(m)(({theme:r})=>({backgroundColor:r.palette.primary.main,color:r.palette.getContrastText(r.palette.primary.main)}));export const CommonSummaryButton=m=>{let{onEnterSummary:o}=m,{isMobile:s}=c(),u=n(),d=e(()=>{u.push(i.SummaryButtonClicked()),o()},[u,o]);return s?r(p,{onClick:d,children:r(l,{name:"List"})}):r(a,{color:"primary",variant:"contained",size:"large",fullWidth:!0,endIcon:r(l,{name:"ArrowRight"}),onClick:d,children:r(t,{id:"sdk.layout.summary.button.label",message:"Summary"})})};

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{useAnalyticsService as m,useIntegrationState as a}from"#package/react-sdk";import{PhxIcon as n}from"#package/ui-sdk";import{FrontendAnalyticsFactory as s}from"../../../../common/index.js";import{useConfiguratorRouting as c,usePresetSelection as p,usePreview as l}from"../../../../configurator-context/index.js";import{CloseConfiguratorButton as d}from"./CloseConfiguratorButton.js";export const CommonTopNavigation=e(()=>{let e=m(),f=c(),{presetCategories:u}=p(),{isPreview:g,isPreviewEnabled:k}=l(),x=u.flatMap(o=>o.presets).length>1,j=a(),C=i(()=>{e.push(s.GoToProductsClicked()),f.goToIndex()},[e,f]);if(!j.embeddedView)return x||!k||g?x?o(t,{size:"small",startIcon:o(n,{name:"ArrowLeft"}),onClick:C,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,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,{})});

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{Box as i,styled as r}from"@mui/material";import{AnimatePresence as a}from"motion/react";import{Suspense as n,memo as l,useEffect as s,useState as m}from"react";import{useIsFullscreenActive as c,useLoadingStateManager as d,useResolveLocalizable as p}from"#package/react-sdk";import{useResponsive as u}from"#package/ui-sdk";import{usePreview as f}from"../../../../configurator-context/index.js";import{CanvasLoader as b}from"../../../phoenix-layout-elements/index.js";import{InterfaceLayout as g}from"../old/InterfaceLayout.js";import{PreviewLayout as v}from"../old/PreviewLayout.js";let x=({overlay:t})=>e("div",{style:{position:"absolute"},children:t}),h=r("div")({display:"grid",inset:0,placeItems:"center",pointerEvents:"none",position:"absolute"}),k=()=>null!==d()?null:e(h,{children:e(b,{})}),y=({canvas:t})=>{let[o,r]=m(!0),{isPreview:a}=f();return s(()=>{r(!1);let e=setTimeout(()=>{r(!0)},400);return()=>{clearTimeout(e)}},[a]),e(i,{component:"div",sx:{backgroundColor:"background.scene",inset:0,isolation:"isolate",maxBlockSize:"var(--phx-app-height)",position:"absolute"},children:e(n,{fallback:e(k,{}),children:o&&t})})},j={id:"sdk.preview.customize.title",message:"Customize product"},C={id:"sdk.preview.start.button.label",message:"Start configuring"};export const ReactiveInterfaceLayout=l(i=>{let{canvas:r,sidebar:n,topNavigation:l,branding:s,toolbar:m,fullScreenToolbar:d,viewControls:b,toolControls:h,overlay:k,mobileControls:S,mobileTopNavigation:L,mobileHeaderActionButton:w,mobileHeaderCenter:z,footer:B,sideEffects:I,LayoutContainer:P}=i,{setCanvasPadding:T}=u(),E=c(),{isPreview:F,isHidden:H}=f(),N=p();return t(o,{children:[e(y,{canvas:r}),e(x,{overlay:k}),t(a,{children:[!H&&F&&e(v,{title:N(j),startButtonLabel:N(C),updateScenePadding:T}),!H&&!F&&e(g,{sidebar:n,topNavigation:l,branding:s,toolbar:m,toolbarSecondary:d,mobileControls:S,mobileTopNavigation:L,mobileHeaderActionButton:w,mobileHeaderCenter:z,footer:B,sideEffects:I,isFullScreen:E,updateScenePadding:T,LayoutContainer:P,viewControls:b,toolControls:h})]})]})});
+import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{Box as i,styled as r}from"@mui/material";import{AnimatePresence as a}from"motion/react";import{Suspense as n,memo as s,useEffect as l,useState as m}from"react";import{BuiltInLoadingPhase as c,useExpectPhase as d,useIsFullscreenActive as p,useLoadingStateManager as u,useResolveLocalizable as f}from"#package/react-sdk";import{useResponsive as b}from"#package/ui-sdk";import{usePreview as g}from"../../../../configurator-context/index.js";import{CanvasLoader as v}from"../../../phoenix-layout-elements/index.js";import{InterfaceLayout as x}from"../old/InterfaceLayout.js";import{PreviewLayout as h}from"../old/PreviewLayout.js";let k=({overlay:t})=>e("div",{style:{position:"absolute"},children:t}),y=r("div")({display:"grid",inset:0,placeItems:"center",pointerEvents:"none",position:"absolute"}),j=()=>null!==u()?null:e(y,{children:e(v,{})}),C=({canvas:t})=>{d(c.SceneAssets);let[o,r]=m(!0),{isPreview:a}=g();return l(()=>{r(!1);let e=setTimeout(()=>{r(!0)},400);return()=>{clearTimeout(e)}},[a]),e(i,{component:"div",sx:{backgroundColor:"background.scene",inset:0,isolation:"isolate",maxBlockSize:"var(--phx-app-height)",position:"absolute"},children:e(n,{fallback:e(j,{}),children:o&&t})})},S={id:"sdk.preview.customize.title",message:"Customize product"},L={id:"sdk.preview.start.button.label",message:"Start configuring"};export const ReactiveInterfaceLayout=s(i=>{let{canvas:r,sidebar:n,topNavigation:s,branding:l,toolbar:m,fullScreenToolbar:c,viewControls:d,toolControls:u,overlay:v,mobileControls:y,mobileTopNavigation:j,mobileHeaderActionButton:w,mobileHeaderCenter:z,footer:B,sideEffects:I,LayoutContainer:P}=i,{setCanvasPadding:T}=b(),A=p(),{isPreview:E,isHidden:F}=g(),H=f();return t(o,{children:[e(C,{canvas:r}),e(k,{overlay:v}),t(a,{children:[!F&&E&&e(h,{title:H(S),startButtonLabel:H(L),updateScenePadding:T}),!F&&!E&&e(x,{sidebar:n,topNavigation:s,branding:l,toolbar:m,toolbarSecondary:c,mobileControls:y,mobileTopNavigation:j,mobileHeaderActionButton:w,mobileHeaderCenter:z,footer:B,sideEffects:I,isFullScreen:A,updateScenePadding:T,LayoutContainer:P,viewControls:d,toolControls:u})]})]})});

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

@@ -1 +1 @@
-import{jsx as i}from"react/jsx-runtime";import{Trans as e}from"@lingui/react";import{tooltipClasses as t}from"@mui/material";import{useCallback as o}from"react";import{useAnalyticsService as a,useResolveLocalizable as r}from"#package/react-sdk";import{TooltipWithArrow as l,useResponsive as m}from"#package/ui-sdk";import{FrontendAnalyticsFactory as n}from"../../../../common/index.js";import{MobileThemeableFinalizeButton as s,ThemeableFinalizeButton as p}from"./ThemeableFinalizeButton.js";export const ResponsiveFinalizeButton=c=>{let{title:d,onClick:u,disabled:f,hints:h}=c,{isMobile:k}=m(),x=r(),b=a(),g=o(()=>{b.push(n.FinalizeButtonClicked()),u()},[b,u]);return k?i(l,{title:h,placement:"top",sx:{[`& .${t.tooltip}`]:{maxWidth:130}},children:i("span",{children:i(s,{onClick:g,disabled:f})})}):i(l,{title:h,placement:"top",sx:{[`& .${t.tooltip}`]:{maxWidth:130}},children:i("span",{children:i(p,{disabled:f,onClick:g,children:d?x(d):i(e,{id:"sdk.layout.sidebar.finalizePage.label",message:"Finalize"})})})})};
+import{jsx as i}from"react/jsx-runtime";import{Trans as e}from"@lingui/react";import{tooltipClasses as t}from"@mui/material";import{useCallback as a}from"react";import{FrontendAnalyticsFactory as r,useAnalyticsService as o,useResolveLocalizable as l}from"#package/react-sdk";import{TooltipWithArrow as n,useResponsive as m}from"#package/ui-sdk";import{MobileThemeableFinalizeButton as s,ThemeableFinalizeButton as p}from"./ThemeableFinalizeButton.js";export const ResponsiveFinalizeButton=c=>{let{title:d,onClick:u,disabled:h,hints:f}=c,{isMobile:k}=m(),x=l(),b=o(),g=a(()=>{b.push(r.FinalizeButtonClicked()),u()},[b,u]);return k?i(n,{title:f,placement:"top",sx:{[`& .${t.tooltip}`]:{maxWidth:130}},children:i("span",{children:i(s,{onClick:g,disabled:h})})}):i(n,{title:f,placement:"top",sx:{[`& .${t.tooltip}`]:{maxWidth:130}},children:i("span",{children:i(p,{disabled:h,onClick:g,children:d?x(d):i(e,{id:"sdk.layout.sidebar.finalizePage.label",message:"Finalize"})})})})};

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

@@ -1 +1 @@
-import{jsx as o,jsxs as t}from"react/jsx-runtime";import{Stack as r,Typography as e}from"@mui/material";import{match as a}from"ts-pattern";import{isCustomSummaryComponentSnapshot as n,isSimpleSummaryComponentSnapshot as l}from"#package/domain";import{useIsFullscreenActive as i,useRootEntityPrice as m}from"#package/react-sdk";import{Sidebar as s,MobileControls as p}from"#package/ui-sdk";import{usePreview as u,useSidebarSummary as f}from"../../../../configurator-context/index.js";import{LayoutSlots as d}from"../../../configurator-layout/index.js";import{LayoutFooter as c,LayoutToolbarReadDesktop as b,LayoutToolbarReadDesktopFullScreen as C,SimpleSummary as j}from"../../../phoenix-layout-elements/index.js";import{FullscreenDesktopToolbar as g}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CloseConfiguratorButton as h}from"./CloseConfiguratorButton.js";import{CommonDesktopToolbar as k}from"./CommonDesktopToolbar.js";import{CommonMobileToolbar as x}from"./CommonMobileToolbar.js";import{ReactiveInterfaceLayout as y}from"./ReactiveInterfaceLayout.js";import{ToolControls as v}from"./ToolControls.js";import{ViewControls as w}from"./ViewControls.js";export const SummaryReadLayout=()=>{let{page:T}=f(),B=a(T).with(null,()=>null).when(n,o=>o.state.page).when(l,t=>o(j,{summary:t.state.items})).otherwise(()=>null),L=i(),M=m(),{isPreview:S,isPreviewEnabled:D}=u(),R=!L&&!S&&D;return o(y,{canvas:o(d.Canvas,{}),sidebar:B&&o(s.Layout,{content:B,chat:null,footer:null}),topNavigation:R&&o(h,{}),branding:null,toolbar:o(b,{defaultSlot:()=>o(k,{readMode:!0})}),fullScreenToolbar:o(C,{defaultSlot:()=>o(g,{})}),viewControls:o(w,{}),toolControls:o(v,{}),overlay:null,mobileControls:o(p.OrientationContainer,{portraitComponent:o(p.Layout,{chat:null,toolbar:o(x,{readMode:!0}),navigation:null,drawer:!L&&B}),landscapeComponent:null}),mobileTopNavigation:R&&o(h,{}),mobileHeaderActionButton:null,mobileHeaderCenter:!L&&o(e,{variant:"h6",sx:{paddingBlock:1},children:M}),sideEffects:null,footer:t(r,{children:[o(d.DesktopReadonlyBanner,{}),o(c,{})]})})};
+import{jsx as o,jsxs as t}from"react/jsx-runtime";import{Stack as r,Typography as e}from"@mui/material";import{match as a}from"ts-pattern";import{isCustomSummaryComponentSnapshot as n,isSimpleSummaryComponentSnapshot as l}from"#package/domain";import{useIsFullscreenActive as i,useRootEntityPrice as m}from"#package/react-sdk";import{Sidebar as s,MobileControls as p}from"#package/ui-sdk";import{usePreview as u,useSidebarSummary as f}from"../../../../configurator-context/index.js";import{LayoutSlots as d}from"../../../configurator-layout/index.js";import{LayoutFooter as c,LayoutToolbarReadDesktop as b,LayoutToolbarReadDesktopFullScreen as C,SimpleSummary as j}from"../../../phoenix-layout-elements/index.js";import{SaveMessageSnackbars as g}from"../../../save-message-snackbars/index.js";import{FullscreenDesktopToolbar as k}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CloseConfiguratorButton as x}from"./CloseConfiguratorButton.js";import{CommonDesktopToolbar as h}from"./CommonDesktopToolbar.js";import{CommonMobileToolbar as v}from"./CommonMobileToolbar.js";import{ReactiveInterfaceLayout as y}from"./ReactiveInterfaceLayout.js";import{ToolControls as w}from"./ToolControls.js";import{ViewControls as T}from"./ViewControls.js";export const SummaryReadLayout=()=>{let{page:B}=f(),L=a(B).with(null,()=>null).when(n,o=>o.state.page).when(l,t=>o(j,{summary:t.state.items})).otherwise(()=>null),M=i(),S=m(),{isPreview:D,isPreviewEnabled:R}=u(),H=!M&&!D&&R;return o(y,{canvas:o(d.Canvas,{}),sidebar:L&&o(s.Layout,{content:L,chat:null,footer:null}),topNavigation:H&&o(x,{}),branding:null,toolbar:o(b,{defaultSlot:()=>o(h,{readMode:!0})}),fullScreenToolbar:o(C,{defaultSlot:()=>o(k,{})}),viewControls:o(T,{}),toolControls:o(w,{}),overlay:o(g,{}),mobileControls:o(p.OrientationContainer,{portraitComponent:o(p.Layout,{chat:null,toolbar:o(v,{readMode:!0}),navigation:null,drawer:!M&&L}),landscapeComponent:null}),mobileTopNavigation:H&&o(x,{}),mobileHeaderActionButton:null,mobileHeaderCenter:!M&&o(e,{variant:"h6",sx:{paddingBlock:1},children:S}),sideEffects:null,footer:t(r,{children:[o(d.DesktopReadonlyBanner,{}),o(c,{})]})})};

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

@@ -1 +1 @@
-import{jsx as o,jsxs as m,Fragment as r}from"react/jsx-runtime";import{Typography as t}from"@mui/material";import{match as e}from"ts-pattern";import{customPriceFooterComponent as a,isCustomSummaryComponentSnapshot as i,isSimpleSummaryComponentSnapshot as n}from"#package/domain";import{useFirstRootComponent as s,useIsFullscreenActive as l,useRootEntityPrice as p}from"#package/react-sdk";import{MobileControls as c,MobileControls as f}from"#package/ui-sdk";import{useEnterSidebarSummary as u,useHasSidebarSummary as d,useLeaveSidebarSummary as b,useSidebarSummary as g}from"../../../../configurator-context/index.js";import{LayoutSlots as j}from"../../../configurator-layout/index.js";import{LayoutDialog as y,LayoutFooter as C,SimpleSummary as S}from"../../../phoenix-layout-elements/index.js";import{MobileChat as v}from"../../chat/MobileChat.js";import{FullscreenDesktopToolbar as h}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CommonDesktopToolbar as k}from"../common/CommonDesktopToolbar.js";import{CommonFinalizePage as w}from"../common/CommonFinalizePage.js";import{CommonMobileToolbar as x}from"../common/CommonMobileToolbar.js";import{CommonTopNavigation as A}from"../common/CommonTopNavigation.js";import{DefaultViewOnlyMessage as T}from"../common/DefaultViewOnlyMessage.js";import{InvariantViolations as M}from"../common/InvariantViolations.js";import{ReactiveInterfaceLayout as L}from"../common/ReactiveInterfaceLayout.js";import{SideEffects as N}from"../common/SideEffects.js";import{ToolControls as P}from"../common/ToolControls.js";import{ViewControls as E}from"../common/ViewControls.js";import{SimpleMobileHeaderAction as O}from"./SimpleMobileHeaderAction.js";import{SimpleSidebar as V}from"./SimpleSidebar.js";import{SimpleSidebarContent as B}from"./SimpleSidebarContent.js";import{SimpleMobileTopNavigation as D}from"./SimpleTopNavigation.js";export const SimpleOwnerLayout=()=>{let F=s(a),H=d(),{isSummaryActive:I,page:z}=g(),R=e(z).with(null,()=>null).when(i,o=>o.state.page).when(n,m=>o(S,{summary:m.state.items})).otherwise(()=>null),q=u(),G=b(),J=p(),K=l();return o(L,{canvas:o(j.Canvas,{}),sidebar:o(V,{hasSummary:H,isSummaryActive:I,summaryPage:R,price:J,onEnterSummary:q,onLeaveSummary:G,customPriceNode:F?.state.node}),topNavigation:o(A,{}),branding:null,toolbar:o(k,{}),fullScreenToolbar:o(h,{}),viewControls:o(E,{}),toolControls:o(P,{}),overlay:m(r,{children:[o(M,{}),o(w,{}),o(y,{})]}),mobileControls:o(f.OrientationContainer,{portraitComponent:o(f.Layout,{chat:!K&&o(v,{icon:"CustomBigAiAssistant",label:{id:"sdk.chat.mobile.assistant.label",message:"AI Assistant"}}),toolbar:o(x,{}),navigation:null,drawer:!K&&o(B,{summaryPage:R,isSummaryActive:I,onLeaveSummary:G})}),landscapeComponent:o(c.ViewOnlyMode,{message:o(T,{})})}),mobileTopNavigation:!K&&o(D,{}),mobileHeaderActionButton:!K&&o(O,{isSummaryPageActive:I,onEnterSummary:q,hasSummary:H}),mobileHeaderCenter:!K&&o(t,{variant:"h6",sx:{paddingBlock:1},children:J}),sideEffects:o(N,{}),footer:o(C,{})})};
+import{jsx as o,jsxs as m,Fragment as r}from"react/jsx-runtime";import{Typography as e}from"@mui/material";import{match as t}from"ts-pattern";import{customPriceFooterComponent as a,isCustomSummaryComponentSnapshot as i,isSimpleSummaryComponentSnapshot as n}from"#package/domain";import{useFirstRootComponent as s,useIsFullscreenActive as l,useRootEntityPrice as p}from"#package/react-sdk";import{MobileControls as c,MobileControls as f}from"#package/ui-sdk";import{useEnterSidebarSummary as u,useHasSidebarSummary as d,useLeaveSidebarSummary as b,useSidebarSummary as g}from"../../../../configurator-context/index.js";import{LayoutSlots as j}from"../../../configurator-layout/index.js";import{LayoutDialog as y,LayoutFooter as v,SimpleSummary as C}from"../../../phoenix-layout-elements/index.js";import{SaveMessageSnackbars as S}from"../../../save-message-snackbars/index.js";import{MobileChat as h}from"../../chat/MobileChat.js";import{FullscreenDesktopToolbar as k}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CommonDesktopToolbar as x}from"../common/CommonDesktopToolbar.js";import{CommonFinalizePage as w}from"../common/CommonFinalizePage.js";import{CommonMobileToolbar as A}from"../common/CommonMobileToolbar.js";import{CommonTopNavigation as T}from"../common/CommonTopNavigation.js";import{DefaultViewOnlyMessage as M}from"../common/DefaultViewOnlyMessage.js";import{InvariantViolations as L}from"../common/InvariantViolations.js";import{ReactiveInterfaceLayout as N}from"../common/ReactiveInterfaceLayout.js";import{SideEffects as P}from"../common/SideEffects.js";import{ToolControls as E}from"../common/ToolControls.js";import{ViewControls as O}from"../common/ViewControls.js";import{SimpleMobileHeaderAction as V}from"./SimpleMobileHeaderAction.js";import{SimpleSidebar as B}from"./SimpleSidebar.js";import{SimpleSidebarContent as D}from"./SimpleSidebarContent.js";import{SimpleMobileTopNavigation as F}from"./SimpleTopNavigation.js";export const SimpleOwnerLayout=()=>{let H=s(a),I=d(),{isSummaryActive:z,page:R}=g(),q=t(R).with(null,()=>null).when(i,o=>o.state.page).when(n,m=>o(C,{summary:m.state.items})).otherwise(()=>null),G=u(),J=b(),K=p(),Q=l();return o(N,{canvas:o(j.Canvas,{}),sidebar:o(B,{hasSummary:I,isSummaryActive:z,summaryPage:q,price:K,onEnterSummary:G,onLeaveSummary:J,customPriceNode:H?.state.node}),topNavigation:o(T,{}),branding:null,toolbar:o(x,{}),fullScreenToolbar:o(k,{}),viewControls:o(O,{}),toolControls:o(E,{}),overlay:m(r,{children:[o(L,{}),o(S,{}),o(w,{}),o(y,{})]}),mobileControls:o(f.OrientationContainer,{portraitComponent:o(f.Layout,{chat:!Q&&o(h,{icon:"CustomBigAiAssistant",label:{id:"sdk.chat.mobile.assistant.label",message:"AI Assistant"}}),toolbar:o(A,{}),navigation:null,drawer:!Q&&o(D,{summaryPage:q,isSummaryActive:z,onLeaveSummary:J})}),landscapeComponent:o(c.ViewOnlyMode,{message:o(M,{})})}),mobileTopNavigation:!Q&&o(F,{}),mobileHeaderActionButton:!Q&&o(V,{isSummaryPageActive:z,onEnterSummary:G,hasSummary:I}),mobileHeaderCenter:!Q&&o(e,{variant:"h6",sx:{paddingBlock:1},children:K}),sideEffects:o(P,{}),footer:o(v,{})})};

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 i,useCallback as e}from"react";import{useAnalyticsService as m,usePresetEmbeddedState as a}from"#package/react-sdk";import{PhxIcon as n}from"#package/ui-sdk";import{FrontendAnalyticsFactory as s}from"../../../../common/index.js";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=i(()=>{let i=m(),u=l(),{presetCategories:d}=p(),{isPreview:g,isPreviewEnabled:k}=c(),x=d.flatMap(o=>o.presets).length>1,j=e(()=>{i.push(s.GoToProductsClicked()),u.goToIndex()},[i,u]);if(!a())return x||g||!k?x?o(t,{size:"small",startIcon:o(n,{name:"ArrowLeft"}),onClick:j,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,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,{})});

package/dist/configurator/ui/legacy/layout/steps/StepsNavigation.d.ts

@@ -1,10 +1,10 @@
 import type { Localizable } from '@salsita-ai/common/utils';
 export interface TopNavigationStep {
-    navigationStates: string[];
+    readonly navigationStates: readonly string[];
     label: Localizable;
 }
 export interface StepsNavigationComponentProps {
-    steps: TopNavigationStep[];
+    steps: readonly TopNavigationStep[];
 }
 declare const StepsNavigationComponent: (props: StepsNavigationComponentProps) => import("react/jsx-runtime").JSX.Element;
 /**

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

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{FullscreenDesktopToolbar as I}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CommonDesktopToolbar as h}from"../common/CommonDesktopToolbar.js";import{CommonFinalizePage as N}from"../common/CommonFinalizePage.js";import{DefaultViewOnlyMessage as w}from"../common/DefaultViewOnlyMessage.js";import{InvariantViolations as A}from"../common/InvariantViolations.js";import{ReactiveInterfaceLayout as D}from"../common/ReactiveInterfaceLayout.js";import{SideEffects as E}from"../common/SideEffects.js";import{ToolControls as L}from"../common/ToolControls.js";import{ViewControls as M}from"../common/ViewControls.js";import{StepsNavigation as P}from"./StepsNavigation.js";import{StepsSideBar as V}from"./StepsSideBar.js";export const StepsOwnerLayout=()=>{let{storeSystem:F,navigationSystem:O}=p(),B=d(),H=m(),R=u(),U=c(r),z=c(n),$=l({componentTypes:[s],entityIds:[R]}),q=i(()=>U?.state.steps??[],[U]),G=i(()=>($??[]).flatMap(o=>o.state.tabs).map(o=>{let t=o.navigationStates[0];if(!t)throw Error(`Tab ${t} has no navigation states!`);return{label:B(o.label),icon:o.icon,value:t,isActive:o.navigationStates.includes(H)}}),[$,H,B]),J=i(()=>{let o=G.find(o=>o.isActive);return o?.value??"none"},[G]),K=v(o=>R===o.state.rootEntityId,[R]),Q=g(),W=j(),{presetCategories:X}=S(),Y=f(),Z=X.flatMap(o=>o.presets).length>1,_=!Y&&Z,oo=a(()=>{let o=q.findIndex(o=>o.navigationStates.includes(H)),t=q[o-1];if(!t){_&&W.goToIndex();return}let e=t.navigationStates[0];e&&F.stageAndCommit([O.getNavigationUpdate(e)])},[O,H,q,_,W,F]),ot=a(()=>{let o=q.findIndex(o=>o.navigationStates.includes(H)),t=q[o+1];if(!t)return;let e=t.navigationStates[0];e&&F.stageAndCommit([O.getNavigationUpdate(e)])},[O,H,q,F]),oe=i(()=>q.findIndex(o=>o.navigationStates.includes(H))===q.length-1,[q,H]);return o(D,{canvas:o(x.Canvas,{}),sidebar:o(V,{price:Q,tabs:G,activeTab:J,isRootPage:K,customPriceNode:z?.state.node,isLastStep:oe,onNextStepClick:ot,onPreviousStepClick:oo}),viewControls:o(M,{}),toolControls:o(L,{}),topNavigation:o(P,{steps:q}),branding:null,toolbar:o(k,{defaultSlot:()=>o(h,{})}),fullScreenToolbar:o(T,{defaultSlot:()=>o(I,{})}),overlay:t(e,{children:[o(A,{}),o(N,{}),o(C,{})]}),mobileControls:o(b.ViewOnlyMode,{message:o(w,{})}),mobileTopNavigation:null,mobileHeaderActionButton:null,mobileHeaderCenter:null,sideEffects:o(E,{}),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,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,{})})};

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{Trans as r}from"@lingui/react";import{Button as i,Stack as n}from"@mui/material";import{useCallback as a}from"react";import{useAnalyticsService as l,usePresetEmbeddedState as m,useResolveLocalizable as s,useSession as c}from"#package/react-sdk";import{PhxIcon as p,SidebarPrice as d,StepsSidebarFooterLayout as u}from"#package/ui-sdk";import{FrontendAnalyticsFactory as f}from"../../../../common/index.js";import{CommonFinalizeButton as k}from"../common/CommonFinalizeButton.js";import{SaveTemplateButton as g}from"../common/SaveTemplateButton.js";import{SetAsTemplateButton as h}from"../common/SetAsTemplateButton.js";let x={id:"sdk.totalPrice",message:"Total price"},S=t=>{let{onClick:o}=t,n=l(),m=a(()=>{n.push(f.PreviousStepButtonClicked()),o()},[n,o]);return e(i,{size:"large",startIcon:e(p,{name:"ArrowLeft"}),fullWidth:!0,onClick:m,children:e(r,{id:"sdk.layout.sidebar.previousStep.label",message:"Previous step"})})},B=t=>{let{onClick:o}=t,n=l(),m=a(()=>{n.push(f.NextStepButtonClicked()),o()},[n,o]);return e(i,{variant:"contained",size:"large",endIcon:e(p,{name:"ArrowRight"}),fullWidth:!0,onClick:m,children:e(r,{id:"sdk.layout.sidebar.nextStep.label",message:"Next step"})})};export const StepsSidebarFooter=r=>{let{formattedPrice:i,customPriceNode:a,isLastStep:l,onPreviousStepClick:p,onNextStepClick:f}=r,b=m(),j=s(),C=null!=c().rawAdminSessionToken,v=C&&b,A=C&&!b;return e(u,{priceNode:t(o,{children:[a,!a&&i&&t(n,{alignItems:"center",flexWrap:"wrap",direction:"row",children:[e(d.Label,{label:j(x),sx:{marginInlineEnd:"auto"}}),e(d.Value,{value:i})]})]}),startActionButton:e(S,{onClick:p}),endActionButton:t(o,{children:[!l&&e(B,{onClick:f}),l&&!v&&e(k,{}),l&&v&&e(g,{})]}),templateButton:l&&A&&e(h,{})})};
+import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import{Trans as o}from"@lingui/react";import{Button as i,Stack as n}from"@mui/material";import{useCallback as a}from"react";import{FrontendAnalyticsFactory as l,useAnalyticsService as s,usePresetEmbeddedState as m,useResolveLocalizable as c,useSession as p}from"#package/react-sdk";import{PhxIcon as u,SidebarPrice as d,StepsSidebarFooterLayout as k}from"#package/ui-sdk";import{CommonFinalizeButton as f}from"../common/CommonFinalizeButton.js";import{SaveTemplateButton as g}from"../common/SaveTemplateButton.js";import{SetAsTemplateButton as h}from"../common/SetAsTemplateButton.js";let x={id:"sdk.totalPrice",message:"Total price"},S=t=>{let{onClick:r}=t,n=s(),m=a(()=>{n.push(l.PreviousStepButtonClicked()),r()},[n,r]);return e(i,{size:"large",startIcon:e(u,{name:"ArrowLeft"}),fullWidth:!0,onClick:m,children:e(o,{id:"sdk.layout.sidebar.previousStep.label",message:"Previous step"})})},B=t=>{let{onClick:r}=t,n=s(),m=a(()=>{n.push(l.NextStepButtonClicked()),r()},[n,r]);return e(i,{variant:"contained",size:"large",endIcon:e(u,{name:"ArrowRight"}),fullWidth:!0,onClick:m,children:e(o,{id:"sdk.layout.sidebar.nextStep.label",message:"Next step"})})};export const StepsSidebarFooter=o=>{let{formattedPrice:i,customPriceNode:a,isLastStep:l,onPreviousStepClick:s,onNextStepClick:u}=o,b=m(),C=c(),j=null!=p().rawAdminSessionToken,v=j&&b,A=j&&!b;return e(k,{priceNode:t(r,{children:[a,!a&&i&&t(n,{alignItems:"center",flexWrap:"wrap",direction:"row",children:[e(d.Label,{label:C(x),sx:{marginInlineEnd:"auto"}}),e(d.Value,{value:i})]})]}),startActionButton:e(S,{onClick:s}),endActionButton:t(r,{children:[!l&&e(B,{onClick:u}),l&&!v&&e(f,{}),l&&v&&e(g,{})]}),templateButton:l&&A&&e(h,{})})};

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

@@ -1 +1 @@
-import{jsx as o,jsxs as t,Fragment as e}from"react/jsx-runtime";import{useMemo as r}from"react";import{match as a}from"ts-pattern";import{customPriceFooterComponent as m,isCustomSummaryComponentSnapshot as n,isSimpleSummaryComponentSnapshot as i,sidebarTabsComponent as s}from"#package/domain";import{useActiveNavigationState as l,useComponents as c,useFirstRootComponent as p,useResolveLocalizable as f,useRootEntityPrice as u,useSelectedDomainEntityId as d,useStoreSelector as b}from"#package/react-sdk";import{MobileControls as g}from"#package/ui-sdk";import{useEnterSidebarSummary as v,useHasSidebarSummary as j,useLeaveSidebarSummary as y,useSidebarSummary as T}from"../../../../configurator-context/index.js";import{LayoutSlots as h}from"../../../configurator-layout/index.js";import{LayoutDialog as w,LayoutFooter as C,SimpleSummary as x}from"../../../phoenix-layout-elements/index.js";import{FullscreenDesktopToolbar as S}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CommonDesktopToolbar as k}from"../common/CommonDesktopToolbar.js";import{CommonFinalizePage as E}from"../common/CommonFinalizePage.js";import{CommonTopNavigation as A}from"../common/CommonTopNavigation.js";import{DefaultViewOnlyMessage as I}from"../common/DefaultViewOnlyMessage.js";import{InvariantViolations as N}from"../common/InvariantViolations.js";import{ReactiveInterfaceLayout as P}from"../common/ReactiveInterfaceLayout.js";import{SideEffects as V}from"../common/SideEffects.js";import{ToolControls as D}from"../common/ToolControls.js";import{ViewControls as F}from"../common/ViewControls.js";import{TabsSidebar as L}from"./TabsSidebar.js";export const TabsOwnerLayout=()=>{let M=f(),O=l(),H=d(),{isSummaryActive:R,page:z}=T(),B=a(z).with(null,()=>null).when(n,o=>o.state.page).when(i,t=>o(x,{summary:t.state.items})).otherwise(()=>null),$=j(),q=v(),G=y(),J=c({componentTypes:[s],entityIds:[H]}),K=p(m),Q=b(o=>H===o.state.rootEntityId,[H]),U=r(()=>(J??[]).flatMap(o=>o.state.tabs).map(o=>{let t=o.navigationStates[0];if(!t)throw Error(`Tab ${t} has no navigation states!`);return{label:M(o.label),icon:o.icon,value:t,isActive:o.navigationStates.includes(O)}}),[J,O,M]),W=r(()=>{let o=U.find(o=>o.isActive);return o?.value??"none"},[U]),X=u();return o(e,{children:o(P,{canvas:o(h.Canvas,{}),sidebar:o(L,{hasSummary:$,isSummaryActive:R,summaryPage:B,price:X,onEnterSummary:q,onLeaveSummary:G,tabs:U,activeTab:W,isRootPage:Q,customPriceNode:K?.state.node}),topNavigation:o(A,{}),branding:null,toolbar:o(k,{}),fullScreenToolbar:o(S,{}),viewControls:o(F,{}),toolControls:o(D,{}),overlay:t(e,{children:[o(N,{}),o(E,{}),o(w,{})]}),mobileControls:o(g.ViewOnlyMode,{message:o(I,{})}),mobileTopNavigation:null,mobileHeaderActionButton:null,mobileHeaderCenter:null,sideEffects:o(V,{}),footer:o(C,{})})})};
+import{jsx as o,jsxs as t,Fragment as e}from"react/jsx-runtime";import{useMemo as r}from"react";import{match as a}from"ts-pattern";import{customPriceFooterComponent as m,isCustomSummaryComponentSnapshot as n,isSimpleSummaryComponentSnapshot as i,sidebarTabsComponent as s}from"#package/domain";import{useActiveNavigationState as l,useComponents as c,useFirstRootComponent as p,useResolveLocalizable as f,useRootEntityPrice as u,useSelectedDomainEntityId as d,useStoreSelector as b}from"#package/react-sdk";import{MobileControls as g}from"#package/ui-sdk";import{useEnterSidebarSummary as v,useHasSidebarSummary as j,useLeaveSidebarSummary as y,useSidebarSummary as T}from"../../../../configurator-context/index.js";import{LayoutSlots as h}from"../../../configurator-layout/index.js";import{LayoutDialog as w,LayoutFooter as x,SimpleSummary as C}from"../../../phoenix-layout-elements/index.js";import{SaveMessageSnackbars as k}from"../../../save-message-snackbars/index.js";import{FullscreenDesktopToolbar as S}from"../../toolbar/desktop-toolbar/FullscreenDesktopToolbar.js";import{CommonDesktopToolbar as E}from"../common/CommonDesktopToolbar.js";import{CommonFinalizePage as A}from"../common/CommonFinalizePage.js";import{CommonTopNavigation as I}from"../common/CommonTopNavigation.js";import{DefaultViewOnlyMessage as N}from"../common/DefaultViewOnlyMessage.js";import{InvariantViolations as P}from"../common/InvariantViolations.js";import{ReactiveInterfaceLayout as V}from"../common/ReactiveInterfaceLayout.js";import{SideEffects as D}from"../common/SideEffects.js";import{ToolControls as F}from"../common/ToolControls.js";import{ViewControls as L}from"../common/ViewControls.js";import{TabsSidebar as M}from"./TabsSidebar.js";export const TabsOwnerLayout=()=>{let O=f(),H=l(),R=d(),{isSummaryActive:z,page:B}=T(),$=a(B).with(null,()=>null).when(n,o=>o.state.page).when(i,t=>o(C,{summary:t.state.items})).otherwise(()=>null),q=j(),G=v(),J=y(),K=c({componentTypes:[s],entityIds:[R]}),Q=p(m),U=b(o=>R===o.state.rootEntityId,[R]),W=r(()=>(K??[]).flatMap(o=>o.state.tabs).map(o=>{let t=o.navigationStates[0];if(!t)throw Error(`Tab ${t} has no navigation states!`);return{label:O(o.label),icon:o.icon,value:t,isActive:o.navigationStates.includes(H)}}),[K,H,O]),X=r(()=>{let o=W.find(o=>o.isActive);return o?.value??"none"},[W]),Y=u();return o(e,{children:o(V,{canvas:o(h.Canvas,{}),sidebar:o(M,{hasSummary:q,isSummaryActive:z,summaryPage:$,price:Y,onEnterSummary:G,onLeaveSummary:J,tabs:W,activeTab:X,isRootPage:U,customPriceNode:Q?.state.node}),topNavigation:o(I,{}),branding:null,toolbar:o(E,{}),fullScreenToolbar:o(S,{}),viewControls:o(L,{}),toolControls:o(F,{}),overlay:t(e,{children:[o(P,{}),o(k,{}),o(A,{}),o(w,{})]}),mobileControls:o(g.ViewOnlyMode,{message:o(N,{})}),mobileTopNavigation:null,mobileHeaderActionButton:null,mobileHeaderCenter:null,sideEffects:o(D,{}),footer:o(x,{})})})};

package/dist/configurator/ui/legacy/toolbar/common/DimensionUnitSelector.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{useCallback as e,useMemo as i}from"react";import{match as m}from"ts-pattern";import{DimensionUnit as r}from"#package/domain";import{useAnalyticsService as a,useDimensionConfig as o,useDimensionState as n,useDimensions as l,useLocalizable as s}from"#package/react-sdk";import{ToggleSelector as c}from"#package/ui-sdk";import{FrontendAnalyticsFactory as u}from"../../../../common/index.js";let h=o=>{let{value:n}=o,s=a(),{setGlobalUnit:h}=l(),p=e(()=>{s.push(u.GlobalDimensionsButtonClicked(n)),h(n)},[s,n,h]),f=i(()=>m(n).with(r.mm,()=>"mm").with(r.cm,()=>"cm").with(r.m,()=>"m").with(r.inch,()=>"in").with(r.feet,()=>"ft").exhaustive(),[n]),d=i(()=>m(n).with(r.mm,()=>"millimeter").with(r.cm,()=>"centimeter").with(r.m,()=>"meter").with(r.inch,()=>"inches").with(r.feet,()=>"feet").exhaustive(),[n]);return t(c.Item,{value:n,"aria-label":d,onClick:p,children:f})},p={id:"sdk.toolbar.measurements.units.aria",message:"Measurement unit setup"};export const DimensionUnitSelector=()=>{let{availableDimensions:e}=o(),{unit:i}=n(),m=s(p);return e.length<=1?null:t(c.Root,{"aria-label":m,value:i,exclusive:!0,columnCount:"auto-fit",sx:{maxWidth:500},children:e.map(e=>t(h,{value:e},e))})};
+import{jsx as t}from"react/jsx-runtime";import{useCallback as e,useMemo as i}from"react";import{match as m}from"ts-pattern";import{DimensionUnit as r}from"#package/domain";import{FrontendAnalyticsFactory as a,useAnalyticsService as n,useDimensionConfig as o,useDimensionState as l,useDimensions as s,useLocalizable as u}from"#package/react-sdk";import{ToggleSelector as c}from"#package/ui-sdk";let h=o=>{let{value:l}=o,u=n(),{setGlobalUnit:h}=s(),p=e(()=>{u.push(a.GlobalDimensionsButtonClicked(l)),h(l)},[u,l,h]),f=i(()=>m(l).with(r.mm,()=>"mm").with(r.cm,()=>"cm").with(r.m,()=>"m").with(r.inch,()=>"in").with(r.feet,()=>"ft").exhaustive(),[l]),w=i(()=>m(l).with(r.mm,()=>"millimeter").with(r.cm,()=>"centimeter").with(r.m,()=>"meter").with(r.inch,()=>"inches").with(r.feet,()=>"feet").exhaustive(),[l]);return t(c.Item,{value:l,"aria-label":w,onClick:p,children:f})},p={id:"sdk.toolbar.measurements.units.aria",message:"Measurement unit setup"};export const DimensionUnitSelector=()=>{let{availableDimensions:e}=o(),{unit:i}=l(),m=u(p);return e.length<=1?null:t(c.Root,{"aria-label":m,value:i,exclusive:!0,columnCount:"auto-fit",sx:{maxWidth:500},children:e.map(e=>t(h,{value:e},e))})};

package/dist/configurator/ui/legacy/toolbar/common/MeasurementsIndicatorsSwitch.js

@@ -1 +1 @@
-import{jsx as i}from"react/jsx-runtime";import{useLingui as e,Trans as o}from"@lingui/react";import{Switch as r}from"@mui/material";import{useObservableEagerState as t}from"observable-hooks";import{useCallback as a}from"react";import{applicationConfigComponent as m}from"#package/domain";import{useAnalyticsService as n,useFirstRootComponent as s}from"#package/react-sdk";import{MobileToolbar as c}from"#package/ui-sdk";import{useConfigurator as l}from"../../../../application-runtime/index.js";import{FrontendAnalyticsFactory as p}from"../../../../common/index.js";let d={"aria-label":{id:"sdk.toolbar.measurements.input.aria",message:"Switch measurements"}};export const MeasurementsIndicatorsSwitch=()=>{let{_:u}=e(),g=s(m),f=g?.state.indicatorSwitch??!0,k=n(),{canvasSystem:b}=l(),h=t(b.dimensionIndicatorShown$),x=a(()=>{k.push(p.DimensionIndicatorsToggled()),b.toggleDimensionIndicator()},[k,b]);return f?i(c.SectionItem,{title:i(o,{id:"sdk.toolbar.measurements.indicators.label",message:"Dimension indicators"}),content:i(r,{inputProps:{...d,"aria-label":u(d["aria-label"])},checked:h,onChange:x})}):null};
+import{jsx as e}from"react/jsx-runtime";import{useLingui as i,Trans as t}from"@lingui/react";import{Switch as a}from"@mui/material";import{useObservableEagerState as r}from"observable-hooks";import{useCallback as o}from"react";import{applicationConfigComponent as m}from"#package/domain";import{FrontendAnalyticsFactory as n,useAnalyticsService as s,useFirstRootComponent as c}from"#package/react-sdk";import{MobileToolbar as l}from"#package/ui-sdk";import{useConfigurator as p}from"../../../../application-runtime/index.js";let d={"aria-label":{id:"sdk.toolbar.measurements.input.aria",message:"Switch measurements"}};export const MeasurementsIndicatorsSwitch=()=>{let{_:u}=i(),g=c(m),f=g?.state.indicatorSwitch??!0,k=s(),{canvasSystem:b}=p(),h=r(b.dimensionIndicatorShown$),I=o(()=>{k.push(n.DimensionIndicatorsToggled()),b.toggleDimensionIndicator()},[k,b]);return f?e(l.SectionItem,{title:e(t,{id:"sdk.toolbar.measurements.indicators.label",message:"Dimension indicators"}),content:e(a,{inputProps:{...d,"aria-label":u(d["aria-label"])},checked:h,onChange:I})}):null};