@salsita-ai/sdk 0.50.0-develop.9cf426b400 → 0.50.0-develop.9db1e1f3bf

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,80 +1,6 @@
 import type { ComponentsOverrides } from '@mui/material';
 import type { CSSProperties } from 'react';
 import type { ValueOf } from '@salsita-ai/common/utils';
-declare const MuiSidebarComponentName: 'PhxDesktopSidebar';
-declare const MuiSidebarSlots: {
-    readonly Root: 'root';
-    readonly Header: 'header';
-    readonly Body: 'body';
-    readonly Content: 'content';
-    readonly Tabs: 'tabs';
-    readonly Footer: 'footer';
-};
-type DesktopSidebarSlots = ValueOf<typeof MuiSidebarSlots>;
-declare module '@mui/material/styles' {
-    interface ComponentNameToClassKey {
-        [MuiSidebarComponentName]: DesktopSidebarSlots;
-    }
-    interface ComponentsPropsList {
-        [MuiSidebarComponentName]: ThemeableDesktopSidebarProps;
-    }
-    interface Components {
-        [MuiSidebarComponentName]?: {
-            defaultProps?: ComponentsPropsList['PhxDesktopSidebar'];
-            styleOverrides?: ComponentsOverrides<Theme>['PhxDesktopSidebar'];
-        };
-    }
-}
-interface SidebarOwnerState {
-    readonly isHeaderEmpty?: boolean;
-    readonly isContentEmpty?: boolean;
-}
-export interface ThemeableDesktopSidebarProps extends SidebarOwnerState {
-    /**
-     * Background applied to sidebar sections (header, body, footer).
-     *
-     * @default theme.palette.background.paper
-     */
-    readonly background?: CSSProperties['background'];
-    /**
-     * Border applied to sidebar sections.
-     *
-     * @default 0
-     */
-    readonly border?: CSSProperties['border'];
-    /**
-     * Corner radius applied to sidebar sections.
-     *
-     * @default theme.shape.sidebarBorderRadius ?? theme.shape.borderRadius
-     */
-    readonly borderRadius?: CSSProperties['borderRadius'];
-    /**
-     * CSS filter applied to the sidebar root (e.g. drop-shadow for elevation).
-     *
-     * @default elevation[1] drop-shadow
-     */
-    readonly filter?: CSSProperties['filter'];
-    /**
-     * Spacing value for sidebar inner padding.
-     * Accepts a theme spacing multiplier or a CSS value.
-     *
-     * @default theme.spacing(2.5)
-     */
-    readonly padding?: number | string;
-    /**
-     * Background gradient for scrollable edge indicators.
-     * Applied to `::before` and `::after` pseudo-elements on the content area.
-     *
-     * @default linear-gradient(180deg, hsl(from black h s l / 12%), transparent 8px)
-     */
-    readonly scrollableIndicatorBackground?: CSSProperties['background'];
-    /**
-     * Inline size (width) of the sidebar.
-     *
-     * @default inherited from ThemeableDesktopLayoutProps.sidebarWidth
-     */
-    readonly width?: CSSProperties['width'];
-}
 export declare const PhxDesktopLayoutName: 'PhxDesktopLayout';
 declare const MuiLayoutComponentName: "PhxDesktopLayout";
 declare const MuiLayoutSlots: {

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

@@ -1,17 +1,10 @@
-import{jsx as a,jsxs as t,Fragment as o}from"react/jsx-runtime";import{keyframes as e,paperClasses as r,snackbarClasses as d,styled as i,useTheme as n,useThemeProps as s}from"@mui/material";import{AnimatePresence as l,motion as p}from"motion/react";import{useCallback as b,useRef as u}from"react";import{useAccessService as c,useIsFullscreenActive as m}from"#package/react-sdk";import{attrf as h,commonStyles as y,numToPx as g,useInvalidateScrollTimeline as f,useIsEmpty as k,useResponsive as x}from"#package/ui-sdk";import{usePreview as v}from"../../../configurator-context/index.js";import{LayoutSlots as S}from"../slots/index.js";import{DesktopPreview as E}from"./DesktopPreview.js";import{useSceneSafeArea as w}from"./use-scene-safe-area.js";let R="PhxDesktopSidebar",B="minimalist",$="split",C="visible",D="hidden",T={Root:i("div",{name:R,slot:"root",shouldForwardProp:a=>"ownerState"!==a})(({ownerState:a})=>[`
-      --phx-sidebar-background: ${a.background};
-      --phx-sidebar-border: ${a.border};
-      --phx-sidebar-filter: ${a.filter};
-      --phx-sidebar-padding: ${a.padding};
-      --phx-sidebar-radius: ${a.borderRadius}px;
-      --phx-sidebar-scrollable-indicator-background: ${a.scrollableIndicatorBackground};
-    `,{borderRadius:"var(--phx-sidebar-radius)",display:"grid",filter:"var(--phx-sidebar-filter)",gridTemplateRows:"min-content minmax(0, 1fr) min-content",inlineSize:a.width,position:"relative","& > *":{pointerEvents:"auto"},"@container style(--inspect: on)":{"--phx-sidebar-background":"hsl(from gold h s l / 50%)"},[`&[data-sidebar*="${C}"]`]:{opacity:1},[`&[data-sidebar*="${D}"]`]:{opacity:0}}]),Tabs:i("div",{name:R,slot:"tabs",shouldForwardProp:a=>"ownerState"!==a})(({theme:{spacing:a}})=>({insetBlockStart:0,insetInlineEnd:"100%",maxInlineSize:150,paddingInlineEnd:a(2),position:"absolute","&:is(:empty)":{padding:0},[`.${r.root}`]:{boxShadow:"none"}})),Header:i("header",{name:R,slot:"header",shouldForwardProp:a=>"ownerState"!==a})({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:i("div",{name:R,slot:"body",shouldForwardProp:a=>"ownerState"!==a})(({ownerState:a})=>({background:"var(--phx-sidebar-background)",border:"var(--phx-sidebar-border)",borderBlockStart:0,borderBlockEnd:0,display:"grid",position:"relative",'[data-layout*="slot[sidebar]"]:where(:has([data-sidebar="slot[header]"])) &':{...a.isHeaderEmpty&&{borderBlockStart:"var(--phx-sidebar-border)",borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",paddingBlockStart:"var(--phx-sidebar-padding)"}},'&:has([data-sidebar*="slot[content]"]:empty)':{...a.isContentEmpty&&{paddingBlock:0}},[`[data-sidebar*="${B}"] &`]:{...a.isContentEmpty&&{border:0}},[`[data-sidebar*="${$}"] &`]:{borderBlockEnd:"var(--phx-sidebar-border)",borderEndStartRadius:"inherit",borderEndEndRadius:"inherit",paddingBlockEnd:"var(--phx-sidebar-padding)"}})),Content:i("div",{name:R,slot:"content",shouldForwardProp:a=>"ownerState"!==a})(({ownerState:a,theme:{spacing:t}})=>({...y.layout.normalizeScrollableContainer,alignContent:"start",borderRadius:"inherit",display:"grid",gap:t(3),padding:"var(--phx-sidebar-padding)","@supports (animation-timeline: scroll())":{"&[data-scrollable]":{scrollTimeline:"--phx-sidebar-timeline y","&::after, &::before":{animation:`${y.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% - ${t(4)}) 100%`,borderEndStartRadius:"inherit",borderEndEndRadius:"inherit",insetBlockStart:"50%",insetBlockEnd:0,scale:"1 -1"},"&::before":{animationRange:`0 ${t(4)}`,borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",insetBlockStart:0,insetBlockEnd:"50%"}}},"&:is(:empty)":{paddingBlock:0},'[data-layout*="slot[sidebar]"] &':{...a.isHeaderEmpty&&{paddingBlockStart:0,"&::before":{borderStartStartRadius:0,borderStartEndRadius:0,insetBlockStart:"var(--phx-sidebar-padding)"}}},[`[data-sidebar*="${$}"] &`]:{paddingBlockEnd:0,"&::after":{borderEndStartRadius:0,borderEndEndRadius:0,insetBlockEnd:"var(--phx-sidebar-padding)"}}})),Footer:i("footer",{name:R,slot:"footer",shouldForwardProp:a=>"ownerState"!==a})(({ownerState:a,theme:{palette:t,spacing:o}})=>({background:"var(--phx-sidebar-background)",border:"var(--phx-sidebar-border)",borderBlockStart:`1px solid ${t.divider}`,borderEndStartRadius:"inherit",borderEndEndRadius:"inherit",padding:"var(--phx-sidebar-padding)","&:is(:empty)":{border:0,paddingBlock:0},[`[data-sidebar*="${B}"] &`]:{...a.isContentEmpty&&{borderBlockStart:"var(--phx-sidebar-border)",borderStartStartRadius:"inherit",borderStartEndRadius:"inherit"}},[`[data-sidebar*="${$}"] &`]:{borderBlockStart:"var(--phx-sidebar-border)",borderStartStartRadius:"inherit",borderStartEndRadius:"inherit",marginBlockStart:o(2)}}))};export const PhxDesktopLayoutName="PhxDesktopLayout";let I="PhxDesktopLayout",A=i(p.div,{name:I,slot:"root",shouldForwardProp:a=>"ownerState"!==a})(({ownerState:a,theme:{spacing:t}})=>{let o=e({"0%":{marginInlineEnd:0},"100%":{marginInlineEnd:t(-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: ${g(a.sidebarWidth)};
+      --phx-layout-sidebar-track-size: ${c(t.sidebarWidth)};
 
-      --phx-layout-gap: ${t(2)};
-      --phx-layout-gutter: ${t(3)};
+      --phx-layout-gap: ${a(2)};
+      --phx-layout-gutter: ${a(3)};
     `,{display:"grid",gridTemplateColumns:`
         [full-start]
         var(--phx-layout-gutter)
@@ -38,12 +31,4 @@ import{jsx as a,jsxs as t,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:t(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:t(-2),overflowX:"scroll",overscrollBehavior:"contain",padding:t(2),scrollbarWidth:"none","&::after":{content:'""'}},'[data-layout="slot[body.toolControls]"]':{insetBlockEnd:`calc(100% + ${t(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% + ${t(2)})`,position:"absolute"},'[data-layout="slot[body.sideEffects]"]':{insetInline:0,[`.${d.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*="${B}"])`]:{'[data-layout*="slot[sidebar]"]':{alignContent:"end",gridRow:"main-start / main-end"}},[`&:has([data-header*="floating"]):has([data-sidebar*="${B}"])`]:{'[data-layout*="slot[header]"]':{gridColumnEnd:"sidebar-end"},'[data-layout*="slot[sidebar]"]':{gridRowStart:"top-end"}},[`&:has([data-sidebar*="${D}"])`]:{"--phx-layout-gap":0,"--phx-layout-sidebar-track-size":0,'[data-layout*="slot[sidebar]"]':{overflow:"hidden"}}}]}),P=i("div")({gridArea:"1 / 1 / -1 / -1"});export const DesktopLayout=()=>{let e=u(null),r=u(null),{palette:d,shape:i,spacing:p}=n(),{sidebarWidth:y="clamp(360px, 30cqi, 400px)"}=s({props:{},name:I}),{background:g=d.background.paper,border:F=0,borderRadius:j=i.sidebarBorderRadius??i.borderRadius,filter:z=`
-      drop-shadow(0 1px 1.5px hsl(from ${d.common.black} h s l / 12%))
-      drop-shadow(0 1px 0.5px hsl(from ${d.common.black} h s l / 14%))
-      drop-shadow(0 2px 0.5px hsl(from ${d.common.black} h s l / 20%))
-    `,padding:H=p(2.5),scrollableIndicatorBackground:L=`linear-gradient(
-      180deg,
-      hsl(from black h s l / 12%),
-      hsl(from black h s l / 0%) 8px
-    )`}=s({props:{},name:R}),{hasMiniSidebar:W,hasSplitSidebar:q}=S.useSidebarContent(),{accessInfo:M}=c(),N=m(),{isPreview:V,isHidden:X}=v(),G=!X&&!V,J=!N,{setCanvasPadding:K,setAnimating:O}=x(),{containerRef:Q,safeAreaRef:U,update:Y}=w(K,W,G),Z=b(()=>{O(!0)},[O]),_=b(()=>{O(!1),Y()},[O,Y]),aa=G&&J,at=k(e,{disabled:!aa}),ao=k(r,{disabled:!aa});f(r,{disabled:!aa});let ae={background:g,border:F,borderRadius:j,filter:z,isHeaderEmpty:at,isContentEmpty:ao,padding:H,scrollableIndicatorBackground:L,width:y};return a(o,{children:t(l,{mode:"wait",children:[!X&&V&&a(E,{},"preview-layout"),G&&t(A,{layoutId:"ui-layout",layout:!0,ownerState:{sidebarWidth:y},"data-layout":h({state:{initial:!N,fullscreen:N}}),onLayoutAnimationStart:Z,onLayoutAnimationComplete:_,children:[a(P,{ref:Q}),a("header",{"data-layout":"slot[header]",children:a(S.DesktopHeader,{})}),t("main",{"data-layout":"slot[body]",children:[a("div",{"data-layout":"slot[body.top] interactive",children:a(S.DesktopCallToAction,{})}),a("div",{ref:U,"data-layout":"slot[body.safeSceneArea]"}),t("div",{"data-layout":"slot[body.bottom] interactive",children:[a("div",{"data-layout":"slot[body.toolbar]",children:a(S.DesktopToolbar,{})}),a("div",{"data-layout":"slot[body.toolControls]",children:!N&&a(S.DesktopToolControls,{})}),a("div",{"data-layout":"slot[body.viewControls]",children:a(S.DesktopViewControls,{})}),a("div",{"data-layout":"slot[body.logo]",children:a(S.DesktopPoweredBy,{})}),a("div",{"data-layout":"slot[body.sideEffects]",children:a(S.DesktopSnackbarsRoot,{})})]})]}),a("aside",{"data-layout":"slot[sidebar]",children:t(T.Root,{ownerState:ae,"data-sidebar":h({variant:{[`${B}`]:W,[`${$}`]:q},state:{[`${C}`]:J,[`${D}`]:!J}}),inert:J?void 0:"",children:[a(T.Tabs,{ownerState:ae,"data-sidebar":"slot[tabs]",children:a(S.DesktopSidebarTabs,{})}),a(T.Header,{ref:e,ownerState:ae,"data-sidebar":"slot[header]",children:a(S.DesktopSidebarBackButton,{})}),a(T.Body,{ownerState:ae,"data-sidebar":"slot[body]",children:a(T.Content,{ref:r,ownerState:ae,"data-sidebar":"slot[content]",children:a(S.DesktopSidebarContent,{})})}),a(T.Footer,{ownerState:ae,"data-sidebar":"slot[footer]",children:a(S.DesktopSidebarFooter,{})})]})}),t("footer",{"data-layout":"slot[footer] interactive",children:[M.viewMode&&!N&&a(S.DesktopReadonlyBanner,{}),a(S.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/DesktopPreview.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{useCallback as e,useMemo as o}from"react";import{useResolveLocalizable as a}from"#package/react-sdk";import{Preview as i,useResponsive as r}from"#package/ui-sdk";import{usePresetSelection as n,usePreview as s}from"../../../configurator-context/index.js";import{useSceneSafeArea as p}from"./use-scene-safe-area.js";let m={id:"sdk.preview.customize.title",message:"Customize product"},u={id:"sdk.preview.start.button.label",message:"Start configuring"},c={layoutId:"ui-layout",initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{layout:{type:"spring",bounce:.2,duration:.6},opacity:{duration:.2,ease:"linear"}}};export const DesktopPreview=l=>{let{slotProps:d={},slots:f}=l,{enter:y}=s(),{hasMultiplePresets:g}=n(),{setCanvasPadding:k,setAnimating:x}=r(),{containerRef:b,safeAreaRef:j,update:w}=p(k,!1),S=a(),v=e(()=>{x(!0)},[x]),A=e(()=>{x(!1),w()},[x,w]),L=o(()=>({...d,root:{...c,onLayoutAnimationStart:v,onLayoutAnimationComplete:A,...d.root}}),[A,v,d]);return t(i,{title:S(m),buttonLabel:S(u),containerRef:b,safeAreaRef:j,withScene:!g,slots:f,slotProps:L,onStart:y})};
+import{jsx as t}from"react/jsx-runtime";import{useCallback as e,useMemo as o}from"react";import{useResolveLocalizable as a}from"#package/react-sdk";import{Preview as i,useResponsive as r}from"#package/ui-sdk";import{usePresetSelection as n,usePreview as s}from"../../../configurator-context/index.js";import{useLayoutSceneSafeArea as p}from"./use-layout-scene-safe-area.js";let u={id:"sdk.preview.customize.title",message:"Customize product"},m={id:"sdk.preview.start.button.label",message:"Start configuring"},c={layoutId:"ui-layout",initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{layout:{type:"spring",bounce:.2,duration:.6},opacity:{duration:.2,ease:"linear"}}};export const DesktopPreview=l=>{let{slotProps:d={},slots:f}=l,{enter:y}=s(),{hasMultiplePresets:g}=n(),{setAnimating:b}=r(),{containerRef:k,safeAreaRef:x,update:S}=p({enabled:!0,hasMiniSidebar:!1}),j=a(),w=e(()=>{b(!0)},[b]),v=e(()=>{b(!1),S()},[b,S]),A=o(()=>({...d,root:{...c,onLayoutAnimationStart:w,onLayoutAnimationComplete:v,...d.root}}),[v,w,d]);return t(i,{title:j(u),buttonLabel:j(m),containerRef:k,safeAreaRef:x,withScene:!g,slots:f,slotProps:A,onStart:y})};

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

@@ -86,6 +86,8 @@ declare module '@mui/material/styles' {
 }
 interface LayoutOwnerState {
     readonly isContentEmpty?: boolean;
+    /** Height of the assistant panel while its input has focus: what the on-screen keyboard leaves free. */
+    readonly assistantFocusHeight?: number;
 }
 export interface ThemeableMobileLayoutProps extends LayoutOwnerState {
     /**

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

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

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

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import e from"lodash/noop.js";import{useCallback as o,useMemo as i}from"react";import{useResolveLocalizable as r}from"#package/react-sdk";import{Preview as a,useResponsive as s}from"#package/ui-sdk";import{usePresetSelection as n,usePreview as m}from"../../../configurator-context/index.js";import{useSceneSafeArea as p}from"./use-scene-safe-area.js";let c={id:"sdk.preview.customize.title",message:"Customize product"},l={id:"sdk.preview.start.button.label",message:"Start configuring"},u={initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{opacity:{duration:.1,ease:"linear"}}};export const MobilePreview=f=>{let{slotProps:d={},slots:g}=f,{enter:k,isPreview:x}=m(),{hasMultiplePresets:b}=n(),{setCanvasPadding:j}=s(),{containerRef:y,safeAreaRef:w,update:v}=p(x?j:e,!1),S=r(),h=o(()=>{v()},[v]),z=i(()=>({...d,root:{...u,onLayoutAnimationComplete:h,...d.root}}),[h,d]);return t(a,{title:S(c),buttonLabel:S(l),containerRef:y,safeAreaRef:w,withScene:!b,slots:g,slotProps:z,onStart:k})};
+import{jsx as t}from"react/jsx-runtime";import{useCallback as e,useMemo as o}from"react";import{useResolveLocalizable as i}from"#package/react-sdk";import{Preview as a}from"#package/ui-sdk";import{usePresetSelection as r,usePreview as s}from"../../../configurator-context/index.js";import{useLayoutSceneSafeArea as n}from"./use-layout-scene-safe-area.js";let m={id:"sdk.preview.customize.title",message:"Customize product"},p={id:"sdk.preview.start.button.label",message:"Start configuring"},c={initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{opacity:{duration:.1,ease:"linear"}}};export const MobilePreview=l=>{let{slotProps:u={},slots:d}=l,{enter:f,isPreview:b}=s(),{hasMultiplePresets:g}=r(),{containerRef:k,safeAreaRef:x,update:y}=n({enabled:b,hasMiniSidebar:!1}),j=i(),w=e(()=>{y()},[y]),S=o(()=>({...u,root:{...c,onLayoutAnimationComplete:w,...u.root}}),[w,u]);return t(a,{title:j(m),buttonLabel:j(p),containerRef:k,safeAreaRef:x,withScene:!g,slots:d,slotProps:S,onStart:f})};

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

@@ -0,0 +1,47 @@
+/** What a built-in layout tells the safe-area measurement about itself. */
+export interface LayoutSceneSafeAreaOptions {
+    /** Whether the layout owns the canvas padding now. See `useLayoutSceneSafeArea`. */
+    readonly enabled: boolean;
+    /** Whether the sidebar is collapsed to its mini form, which the scene clears only in part. */
+    readonly hasMiniSidebar: boolean;
+}
+/**
+ * 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
+ * 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
+ * layouts need: `enabled` and `hasMiniSidebar`.
+ *
+ * Returns:
+ * - `containerRef` — attach to the full-area measurement element.
+ * - `safeAreaRef` — attach to the region the scene should remain visible in.
+ * - `update` — trigger a manual re-measure on demand.
+ *
+ * `containerRef` / `safeAreaRef` are *callback* refs: the `ResizeObserver` (re)connects
+ * whenever a node attaches or detaches. This matters because the owning layout can mount
+ * late — `AnimatePresence mode="wait"` only mounts the interface after the preview has
+ * finished exiting, well after a one-shot mount effect would have run and bailed on null
+ * refs (leaving the scene stuck at the preview's padding).
+ *
+ * `enabled` is for a layout that stays mounted while another one owns the padding (e.g. the
+ * mobile interface while previewing, or a preview that lingers through its exit fade). While
+ * it is `false` the observer is disconnected, and a measurement started by the `update` of that
+ * render or by a pending retry writes nothing. An `update` that was created while the hook was
+ * enabled, such as a handler an animation already holds, still measures and writes. Turning
+ * `enabled` back on reconnects the observer, which measures again.
+ *
+ * `getBoundingClientRect()` returns *visually transformed* rects, so `measure` skips
+ * transformed frames automatically (retrying until the transform clears) to avoid feeding
+ * the scene a scaled gap mid layout animation.
+ *
+ * `update` exists for the complementary case: when only an ancestor's `transform` changes
+ * (e.g. motion FLIP settling), `ResizeObserver` doesn't fire, so nothing re-triggers
+ * `measure`. Call `update()` once the transform settles (e.g. from
+ * `onLayoutAnimationComplete`) to re-measure against the actual layout box.
+ */
+export declare const useLayoutSceneSafeArea: (options: LayoutSceneSafeAreaOptions) => {
+    containerRef: (node: HTMLDivElement | null) => void;
+    safeAreaRef: (node: HTMLDivElement | null) => void;
+    update: () => void;
+};

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

@@ -0,0 +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}};

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

@@ -1,33 +1,18 @@
-import type { CanvasPadding } from '#package/ui-sdk';
 /**
- * Measures the gap between a full-area container and an inner "safe area" element,
- * and forwards the resulting gaps as canvas padding — letting the 3D scene render
- * only in the region not covered by overlay UI (preview body, sidebar, etc.).
+ * Tells the camera which part of the canvas a layout leaves free for the scene.
  *
- * Returns:
- * - `containerRef` — attach to the full-area measurement element.
- * - `safeAreaRef` — attach to the region the scene should remain visible in.
- * - `update` — trigger a manual re-measure on demand.
- *
- * `containerRef` / `safeAreaRef` are *callback* refs: the `ResizeObserver` (re)connects
- * whenever a node attaches or detaches. This matters because the owning layout can mount
- * late — `AnimatePresence mode="wait"` only mounts the interface after the preview has
- * finished exiting, well after a one-shot mount effect would have run and bailed on null
- * refs (leaving the scene stuck at the preview's padding).
- *
- * `enabled` gates the whole thing: when `false` the observer is disconnected so an inactive
- * layout (e.g. the interface while previewing) neither measures nor writes padding.
+ * 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
+ * padding the camera frames the scene with.
  *
- * `getBoundingClientRect()` returns *visually transformed* rects, so `measure` skips
- * transformed frames automatically (retrying until the transform clears) to avoid feeding
- * the scene a scaled gap mid layout animation.
- *
- * `update` exists for the complementary case: when only an ancestor's `transform` changes
- * (e.g. motion FLIP settling), `ResizeObserver` doesn't fire, so nothing re-triggers
- * `measure`. Call `update()` once the transform settles (e.g. from
- * `onLayoutAnimationComplete`) to re-measure against the actual layout box.
+ * Returns:
+ * - `containerRef` — attach to the element that covers the whole canvas.
+ * - `safeAreaRef` — attach to the region the scene should stay visible in.
+ * - `update` — measures again on demand, for a change no resize reports, such as a `transform`
+ *   on an ancestor settling at the end of an animation.
  */
-export declare const useSceneSafeArea: (setCanvasPadding: (padding: CanvasPadding) => void, hasMiniSidebar: boolean, enabled?: boolean) => {
+export declare const useSceneSafeArea: () => {
     containerRef: (node: HTMLDivElement | null) => void;
     safeAreaRef: (node: HTMLDivElement | null) => void;
     update: () => void;

package/dist/configurator/ui/configurator-layout/universal/use-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";export const useSceneSafeArea=(a,c,u=!0)=>{let i=r(null),l=r(null),m=r(null),s=r(null),f=r(0),h=r(()=>{}),g=o({componentTypes:[n]}),p=t(()=>{let t=l.current,e=m.current;if(!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(f.current+=1,f.current>60){f.current=0;return}i.current&&cancelAnimationFrame(i.current),i.current=requestAnimationFrame(()=>h.current());return}f.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)},u=c?.3:1,s=g?.state.bottom??1,p=g?.state.left??1,b=g?.state.right??u,d=g?.state.top??1;a({bottom:o.bottom*s,left:o.left*p,right:o.right*b,top:o.top*d})},[c,g?.state.bottom,g?.state.left,g?.state.right,g?.state.top,a]);h.current=p;let b=t(()=>{i.current&&cancelAnimationFrame(i.current),i.current=requestAnimationFrame(p)},[p]),d=t(()=>{s.current?.disconnect(),s.current=null},[]),A=t(()=>{let t=l.current,e=m.current;if(!u||!t||!e)return void d();d();let r=new ResizeObserver(b);r.observe(t),r.observe(e),s.current=r},[d,u,b]),M=t(t=>{l.current=t,A()},[A]),x=t(t=>{m.current=t,A()},[A]);return e(()=>(A(),()=>{d(),i.current&&cancelAnimationFrame(i.current)}),[A,d]),{containerRef:M,safeAreaRef:x,update:b}};
+import{useLayoutSceneSafeArea as e}from"./use-layout-scene-safe-area.js";export const useSceneSafeArea=()=>e({enabled:!0,hasMiniSidebar:!1});

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/mobile-controls/MobileControls.d.ts

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

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

@@ -0,0 +1,10 @@
+/**
+ * Opens and closes the assistant panel. It renders nothing in a project without an assistant. A
+ * layout that lists the button is expected to carry the panel; the button does not check for it.
+ */
+export declare const AssistantToolbarButton: import("react").FunctionComponent<{
+    readonly showTitle?: boolean;
+    readonly icon?: string;
+} & {
+    children?: import("react").ReactNode;
+}>;

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

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

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

@@ -1,9 +1,9 @@
 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[];
 }
 export declare const StepsNavigation: import("react").MemoExoticComponent<(props: StepsNavigationComponentProps) => import("react/jsx-runtime").JSX.Element>;

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

@@ -14,6 +14,7 @@ export { UndoToolbarButton } from './UndoToolbarButton.js';
 export { RedoToolbarButton } from './RedoToolbarButton.js';
 export { MeasurementsToolbarButton } from './MeasurementsToolbarButton.js';
 export { HelpToolbarButton } from './HelpToolbarButton.js';
+export { AssistantToolbarButton } from './AssistantToolbarButton.js';
 export { HelpMenuAction } from './HelpMenuAction.js';
 export { LanguageMenuAction } from './LanguageMenuAction.js';
 export { MeasurementsMenuAction } from './MeasurementsMenuAction.js';

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

@@ -1 +1 @@
-export*from"./sidebar-footer/index.js";export*from"./header/index.js";export{useShareData,useShareSettings}from"./share/use-share.js";export{MenuRoutingProvider,useMenuRouting}from"./menu-actions/MenuRoutingContext.js";export{MenuAction}from"./menu-actions/MenuAction.js";export{RoutingMenuAction}from"./menu-actions/RoutingMenuAction.js";export{EnterFullscreenToolbarButton}from"./EnterFullscreenToolbarButton.js";export{ExitFullscreenToolbarButton}from"./ExitFullscreenToolbarButton.js";export{LanguageToolbarButton}from"./LanguageToolbarButton.js";export{ToolbarButtonGroup}from"./ToolbarButtonGroup.js";export{ShareMenuAction}from"./ShareMenuAction.js";export{ShareToolbarButton}from"./ShareToolbarButton.js";export{UndoToolbarButton}from"./UndoToolbarButton.js";export{RedoToolbarButton}from"./RedoToolbarButton.js";export{MeasurementsToolbarButton}from"./MeasurementsToolbarButton.js";export{HelpToolbarButton}from"./HelpToolbarButton.js";export{HelpMenuAction}from"./HelpMenuAction.js";export{LanguageMenuAction}from"./LanguageMenuAction.js";export{MeasurementsMenuAction}from"./MeasurementsMenuAction.js";export{ResetCameraToolbarButton}from"./ResetCameraToolbarButton.js";export{SimpleSummary}from"./SimpleSummary.js";export{ResetUndoListener}from"./ResetUndoListener.js";export{SetAsRecipeButton}from"./SetAsRecipeButton.js";export{LayoutDialog,createLayoutDialog}from"./LayoutDialog.js";export{LayoutFooter,createLayoutFooter}from"./LayoutFooter.js";export{CanvasLoader,createCanvasLoader}from"./CanvasLoader.js";export{AppLoader,createAppLoader}from"./AppLoader.js";export{ToolbarHelp,createToolbarHelp,useToolbarHelpExists}from"./ToolbarHelp.js";export{LayoutToolbarDesktop,createLayoutToolbarDesktop}from"./LayoutToolbarDesktop.js";export{LayoutToolbarDesktopFullScreen,createLayoutToolbarDesktopFullScreen}from"./LayoutToolbarDesktopFullScreen.js";export{LayoutToolbarReadDesktop,createLayoutToolbarReadDesktop}from"./LayoutToolbarReadDesktop.js";export{LayoutToolbarReadDesktopFullScreen,createLayoutToolbarReadDesktopFullScreen}from"./LayoutToolbarReadDesktopFullScreen.js";export{LayoutCustomOwnerUi,createLayoutCustomOwnerUi}from"./LayoutCustomOwnerUi.js";export{LayoutCustomReadUi,createLayoutCustomReadUi}from"./LayoutCustomReadUi.js";export{LayoutAdminUi,createLayoutAdminUi}from"./LayoutAdminUi.js";export{LayoutUserUi,createLayoutUserUi}from"./LayoutUserUi.js";export{ExitToolModeFab}from"./call-to-action/ExitToolModeFab.js";export*from"./svg-throbber-3d/index.js";
+export*from"./sidebar-footer/index.js";export*from"./header/index.js";export{useShareData,useShareSettings}from"./share/use-share.js";export{MenuRoutingProvider,useMenuRouting}from"./menu-actions/MenuRoutingContext.js";export{MenuAction}from"./menu-actions/MenuAction.js";export{RoutingMenuAction}from"./menu-actions/RoutingMenuAction.js";export{EnterFullscreenToolbarButton}from"./EnterFullscreenToolbarButton.js";export{ExitFullscreenToolbarButton}from"./ExitFullscreenToolbarButton.js";export{LanguageToolbarButton}from"./LanguageToolbarButton.js";export{ToolbarButtonGroup}from"./ToolbarButtonGroup.js";export{ShareMenuAction}from"./ShareMenuAction.js";export{ShareToolbarButton}from"./ShareToolbarButton.js";export{UndoToolbarButton}from"./UndoToolbarButton.js";export{RedoToolbarButton}from"./RedoToolbarButton.js";export{MeasurementsToolbarButton}from"./MeasurementsToolbarButton.js";export{HelpToolbarButton}from"./HelpToolbarButton.js";export{AssistantToolbarButton}from"./AssistantToolbarButton.js";export{HelpMenuAction}from"./HelpMenuAction.js";export{LanguageMenuAction}from"./LanguageMenuAction.js";export{MeasurementsMenuAction}from"./MeasurementsMenuAction.js";export{ResetCameraToolbarButton}from"./ResetCameraToolbarButton.js";export{SimpleSummary}from"./SimpleSummary.js";export{ResetUndoListener}from"./ResetUndoListener.js";export{SetAsRecipeButton}from"./SetAsRecipeButton.js";export{LayoutDialog,createLayoutDialog}from"./LayoutDialog.js";export{LayoutFooter,createLayoutFooter}from"./LayoutFooter.js";export{CanvasLoader,createCanvasLoader}from"./CanvasLoader.js";export{AppLoader,createAppLoader}from"./AppLoader.js";export{ToolbarHelp,createToolbarHelp,useToolbarHelpExists}from"./ToolbarHelp.js";export{LayoutToolbarDesktop,createLayoutToolbarDesktop}from"./LayoutToolbarDesktop.js";export{LayoutToolbarDesktopFullScreen,createLayoutToolbarDesktopFullScreen}from"./LayoutToolbarDesktopFullScreen.js";export{LayoutToolbarReadDesktop,createLayoutToolbarReadDesktop}from"./LayoutToolbarReadDesktop.js";export{LayoutToolbarReadDesktopFullScreen,createLayoutToolbarReadDesktopFullScreen}from"./LayoutToolbarReadDesktopFullScreen.js";export{LayoutCustomOwnerUi,createLayoutCustomOwnerUi}from"./LayoutCustomOwnerUi.js";export{LayoutCustomReadUi,createLayoutCustomReadUi}from"./LayoutCustomReadUi.js";export{LayoutAdminUi,createLayoutAdminUi}from"./LayoutAdminUi.js";export{LayoutUserUi,createLayoutUserUi}from"./LayoutUserUi.js";export{ExitToolModeFab}from"./call-to-action/ExitToolModeFab.js";export*from"./svg-throbber-3d/index.js";