@salsita-ai/sdk 0.50.0-develop.f03b563886 → 0.50.0-develop.f81ab6ac76

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/header/common/step-navigation/StepsNavigation.js

@@ -1 +1 @@
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{Trans as o}from"@lingui/react";import{memo as 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/phoenix-layout-elements/measurements/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/phoenix-layout-elements/measurements/MeasurementsIndicatorsSwitch.js

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

package/dist/configurator/ui/phoenix-layout-elements/sidebar-footer/basic/BasicFinalizeButton.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import i from"lodash/noop.js";import{useCallback as e}from"react";import{finalizeButtonComponent as o,finalizePageComponent as a}from"#package/domain";import{useAnalyticsService as n,useDomain as s,useFinalizeViolations as m,useFirstRootComponent as r}from"#package/react-sdk";import{FrontendAnalyticsFactory as l}from"../../../../common/index.js";import{CustomFinalizeButton as c}from"../common/CustomFinalizeButton.js";let d=()=>t(c,{hints:"Finalize feature is not configured.",disabled:!0,onClick:i}),p=i=>{let{finalizeNavigationStates:o}=i,{navigationSystem:a,storeSystem:r}=s(),d=n(),p=e(async()=>{let t=o[0];t&&(d.push(l.FinalizeButtonClicked()),r.stageAndCommit([a.getPushNavigationUpdate(t,r.stateSlices.committed.value.state)]))},[o,a,d,r]),{disabled:u,hints:f}=m();return t(c,{hints:f,disabled:u,onClick:p})};export const BasicFinalizeButton=()=>{let i=r(o),e=r(a);return i?i?.state.button:e?t(p,{finalizeNavigationStates:e.state.finalizeNavigationStates}):t(d,{})};
+import{jsx as t}from"react/jsx-runtime";import i from"lodash/noop.js";import{useCallback as e}from"react";import{finalizeButtonComponent as a,finalizePageComponent as o}from"#package/domain";import{FrontendAnalyticsFactory as n,useAnalyticsService as s,useDomain as r,useFinalizeViolations as m,useFirstRootComponent as l}from"#package/react-sdk";import{CustomFinalizeButton as c}from"../common/CustomFinalizeButton.js";let u=()=>t(c,{hints:"Finalize feature is not configured.",disabled:!0,onClick:i}),d=i=>{let{finalizeNavigationStates:a}=i,{navigationSystem:o,storeSystem:l}=r(),u=s(),d=e(async()=>{let t=a[0];t&&(u.push(n.FinalizeButtonClicked()),l.stageAndCommit([o.getPushNavigationUpdate(t,l.stateSlices.committed.value.state)]))},[a,o,u,l]),{disabled:p,hints:f}=m();return t(c,{hints:f,disabled:p,onClick:d})};export const BasicFinalizeButton=()=>{let i=l(a),e=l(o);return i?i?.state.button:e?t(d,{finalizeNavigationStates:e.state.finalizeNavigationStates}):t(u,{})};

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

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{Trans as o}from"@lingui/react";import{useCallback as i}from"react";import{useAnalyticsService as e,useResolveLocalizable as r}from"#package/react-sdk";import{PhxIcon as a,ResponsiveSidebarFooterButton as s}from"#package/ui-sdk";import{FrontendAnalyticsFactory as n}from"../../../../common/index.js";export const CustomFinalizeButton=m=>{let{busy:l,disabled:p,hints:c,icon:u,onClick:d,title:f}=m,k=r(),g=e();return t(s,{tooltip:c,busy:l,disabled:p,onClick:i(t=>{t.preventDefault(),t.stopPropagation(),g.push(n.FinalizeButtonClicked()),d?.()},[g,d]),slotProps:{button:{startIcon:u?t(a,{name:u}):void 0}},children:f?k(f):t(o,{id:"sdk.layout.sidebar.finalizePage.label",message:"Finalize"})})};
+import{jsx as t}from"react/jsx-runtime";import{Trans as o}from"@lingui/react";import{useCallback as a}from"react";import{FrontendAnalyticsFactory as e,useAnalyticsService as i,useResolveLocalizable as r}from"#package/react-sdk";import{PhxIcon as s,ResponsiveSidebarFooterButton as n}from"#package/ui-sdk";export const CustomFinalizeButton=l=>{let{busy:m,disabled:p,hints:u,icon:c,onClick:d,title:f}=l,k=r(),g=i();return t(n,{tooltip:u,busy:m,disabled:p,onClick:a(t=>{t.preventDefault(),t.stopPropagation(),g.push(e.FinalizeButtonClicked()),d?.()},[g,d]),slotProps:{button:{startIcon:c?t(s,{name:c}):void 0}},children:f?k(f):t(o,{id:"sdk.layout.sidebar.finalizePage.label",message:"Finalize"})})};

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

@@ -1 +1 @@
-import{jsx as r}from"react/jsx-runtime";import{Trans as m}from"@lingui/react";import{memo as o,useCallback as t}from"react";import{createPhoenixLayoutElement as a,enterSummaryButtonSchema as e}from"#package/domain";import{useAnalyticsService as i}from"#package/react-sdk";import{ResponsiveSidebarFooterButton as n}from"#package/ui-sdk";import{FrontendAnalyticsFactory as c}from"../../../../common/index.js";import{useEnterSidebarSummary as s}from"../../../../configurator-context/index.js";export const EnterSummaryButton=a({schema:e,component:o(()=>{let o=i(),a=s();return r(n,{onClick:t(()=>{o.push(c.SummaryButtonClicked()),a()},[o,a]),children:r(m,{id:"sdk.layout.summary.button.label",message:"Summary"})})})});
+import{jsx as r}from"react/jsx-runtime";import{Trans as t}from"@lingui/react";import{memo as m,useCallback as o}from"react";import{createPhoenixLayoutElement as a,enterSummaryButtonSchema as e}from"#package/domain";import{FrontendAnalyticsFactory as i,useAnalyticsService as n}from"#package/react-sdk";import{ResponsiveSidebarFooterButton as c}from"#package/ui-sdk";import{useEnterSidebarSummary as s}from"../../../../configurator-context/index.js";export const EnterSummaryButton=a({schema:e,component:m(()=>{let m=n(),a=s();return r(c,{onClick:o(()=>{m.push(i.SummaryButtonClicked()),a()},[m,a]),children:r(t,{id:"sdk.layout.summary.button.label",message:"Summary"})})})});

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

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{Trans as e}from"@lingui/react";import{Button as a}from"@mui/material";import{memo as i,useCallback as o}from"react";import{createPhoenixLayoutElement as r,nextStepButtonSchema as n}from"#package/domain";import{useAnalyticsService as m,useDomain as s}from"#package/react-sdk";import{useResponsive as l}from"#package/ui-sdk";import{useConfigurator as c}from"../../../../application-runtime/index.js";import{FrontendAnalyticsFactory as p}from"../../../../common/index.js";export const NextStepButton=r({schema:n,component:i(()=>{let i=m(),{layoutSystem:r}=c(),{navigationSystem:n,storeSystem:d}=s(),{isDesktop:g}=l(),u=o(()=>{let t=n.getActiveNavigationState(d.stateSlices.committed.value.state),e=r.getNavigationSteps(d.stateSlices.committed.value.state);i.push(p.NextStepButtonClicked());let a=e.findIndex(e=>e.navigationStates.includes(t)),o=e[a+1];if(!o)return;let m=o.navigationStates[0];m&&d.stageAndCommit([n.getNavigationUpdate(m)])},[i,n,d,r]);return g?t(a,{variant:"contained",color:"primary",size:"large",onClick:u,children:t(e,{id:"sdk.layout.sidebar.nextStep.label",message:"Next step"})}):t(a,{variant:"contained",color:"primary",size:"small",onClick:u,children:t(e,{id:"sdk.layout.sidebar.nextStepShort.label",message:"Next"})})})});
+import{jsx as t}from"react/jsx-runtime";import{Trans as e}from"@lingui/react";import{Button as a}from"@mui/material";import{memo as i,useCallback as o}from"react";import{createPhoenixLayoutElement as r,nextStepButtonSchema as n}from"#package/domain";import{FrontendAnalyticsFactory as m,useAnalyticsService as s,useDomain as l}from"#package/react-sdk";import{useResponsive as c}from"#package/ui-sdk";import{useConfigurator as p}from"../../../../application-runtime/index.js";export const NextStepButton=r({schema:n,component:i(()=>{let i=s(),{layoutSystem:r}=p(),{navigationSystem:n,storeSystem:d}=l(),{isDesktop:g}=c(),u=o(()=>{let t=n.getActiveNavigationState(d.stateSlices.committed.value.state),e=r.getNavigationSteps(d.stateSlices.committed.value.state);i.push(m.NextStepButtonClicked());let a=e.findIndex(e=>e.navigationStates.includes(t)),o=e[a+1];if(!o)return;let s=o.navigationStates[0];s&&d.stageAndCommit([n.getNavigationUpdate(s)])},[i,n,d,r]);return g?t(a,{variant:"contained",color:"primary",size:"large",onClick:u,children:t(e,{id:"sdk.layout.sidebar.nextStep.label",message:"Next step"})}):t(a,{variant:"contained",color:"primary",size:"small",onClick:u,children:t(e,{id:"sdk.layout.sidebar.nextStepShort.label",message:"Next"})})})});

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

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

package/dist/configurator/ui/preset-layout/CategoryPresetUi.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{useCallback as r,useState as s}from"react";import{ConfigurationNotFoundPage as l,useResolveLocalizable as o,useResourceUrl as n}from"#package/react-sdk";import{Preset as a}from"#package/ui-sdk";import{usePresetSelection as d,usePreview as m}from"../../configurator-context/index.js";import{ClosePresetScreenButton as c}from"./ClosePresetScreenButton.js";import{PresetBackButton as g}from"./PresetBackButton.js";import{PresetPreviewLayout as p}from"./PresetPreviewLayout.js";import{PresetSnackbarsRoot as u}from"./PresetSnackbarsRoot.js";let f={id:"sdk.presets.select.button.label",message:"Select"},k={id:"sdk.presets.detail.close.label",message:"Close"},S={id:"sdk.presets.detail.learnMore.label",message:"Learn more"},h={id:"sdk.presets.detail.select.label",message:"Select"},B=t=>{let{id:i,name:s,description:l,img:m,imgAlt:c,detailTitle:g,detailDescription:p}=t,{selectPreset:u,creatingPresetId:B}=d(),b=o(),{getResourceUrl:C}=n(),T=r(()=>{u(i)},[u,i]),y=(m&&C(m))??"",A=B===i;return e(a.Card,{title:b(s),description:b(l),imgSrc:y,imgAlt:b(c),selectButtonTitle:b(f),loading:A,disabled:null!==B&&!A,onSelect:T,additionalInfoButton:void 0!==g&&void 0!==p&&e(a.DetailDialog,{img:y,imgAlt:b(c),detailTitle:b(g),detailDescription:b(p),closeButtonTitle:b(k),learnMoreLinkTitle:b(S),selectButtonTitle:b(h),onSelect:T})},b(s))},b=t=>{let{id:i,name:s,description:l,img:d,imgAlt:m,onSelect:c}=t,g=o(),{getResourceUrl:p}=n(),u=r(()=>{c(i)},[c,i]);return e(a.Card,{title:g(s),description:g(l),imgSrc:(d&&p(d))??"",imgAlt:g(m),selectButtonTitle:g(f),onSelect:u},g(s))},C={id:"sdk.presets.category.count.message",message:"{presetCount, plural, one {# preset} other {# presets}}"},T=t=>{let{selectedCategory:r,onCategorySelected:s}=t,{presetCategories:l}=d(),n=o();if(1===l.length)return e(i,{children:l[0].presets.map(t=>e(B,{id:t.id,name:t.name,description:t.description,img:t.img,imgAlt:t.imgAlt,detailTitle:t.detailTitle,detailDescription:t.detailDescription},t.id))});if(null!==r){let t=l.find(e=>e.id===r);if(void 0===t)throw Error(`Category with id ${r} not found!`);return e(i,{children:t.presets.map(t=>e(B,{id:t.id,name:t.name,description:t.description,img:t.img,imgAlt:t.imgAlt,detailTitle:t.detailTitle,detailDescription:t.detailDescription},t.id))})}return e(i,{children:l.map(t=>e(b,{id:t.id,name:t.name,description:t.description??n({...C,values:{presetCount:t.presets.length}}),img:t.img,imgAlt:t.imgAlt,onSelect:s},t.id))})},y={id:"sdk.presets.category.heading.title",message:"Select starting preset"},A={id:"sdk.presets.preview.title",message:"Customize product"},j={id:"sdk.presets.start.button.label",message:"Start configuring"};export const CategoryPresetUi=n=>{let{action:f,footer:k,overlay:S}=n,[h,B]=s(null),{isPreview:b}=m(),C=o(),v=r(()=>{B(null)},[]),{presetCategories:D}=d();return b?e(p,{title:C(A),startButtonLabel:C(j)}):0===D.length?e(l,{}):t(i,{children:[e(a.ScreenLayout,{heading:C(y),action:f,footer:k,overlay:S,backButton:h&&e(g,{onBack:v}),closeButton:!h&&e(c,{}),children:e(T,{selectedCategory:h,onCategorySelected:B})}),e(u,{})]})};
+import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{useCallback as r,useState as s}from"react";import{useResolveLocalizable as o,useResourceUrl as l}from"#package/react-sdk";import{Preset as n}from"#package/ui-sdk";import{ConfigurationNotFoundPageElement as a}from"../../configuration-not-found-page/index.js";import{usePresetSelection as d,usePreview as m}from"../../configurator-context/index.js";import{ClosePresetScreenButton as c}from"./ClosePresetScreenButton.js";import{PresetBackButton as g}from"./PresetBackButton.js";import{PresetPreviewLayout as p}from"./PresetPreviewLayout.js";import{PresetSnackbarsRoot as u}from"./PresetSnackbarsRoot.js";let f={id:"sdk.presets.select.button.label",message:"Select"},k={id:"sdk.presets.detail.close.label",message:"Close"},S={id:"sdk.presets.detail.learnMore.label",message:"Learn more"},h={id:"sdk.presets.detail.select.label",message:"Select"},B=t=>{let{id:i,name:s,description:a,img:m,imgAlt:c,detailTitle:g,detailDescription:p}=t,{selectPreset:u,creatingPresetId:B}=d(),b=o(),{getResourceUrl:C}=l(),T=r(()=>{u(i)},[u,i]),j=(m&&C(m))??"",y=B===i;return e(n.Card,{title:b(s),description:b(a),imgSrc:j,imgAlt:b(c),selectButtonTitle:b(f),loading:y,disabled:null!==B&&!y,onSelect:T,additionalInfoButton:void 0!==g&&void 0!==p&&e(n.DetailDialog,{img:j,imgAlt:b(c),detailTitle:b(g),detailDescription:b(p),closeButtonTitle:b(k),learnMoreLinkTitle:b(S),selectButtonTitle:b(h),onSelect:T})},b(s))},b=t=>{let{id:i,name:s,description:a,img:d,imgAlt:m,onSelect:c}=t,g=o(),{getResourceUrl:p}=l(),u=r(()=>{c(i)},[c,i]);return e(n.Card,{title:g(s),description:g(a),imgSrc:(d&&p(d))??"",imgAlt:g(m),selectButtonTitle:g(f),onSelect:u},g(s))},C={id:"sdk.presets.category.count.message",message:"{presetCount, plural, one {# preset} other {# presets}}"},T=t=>{let{selectedCategory:r,onCategorySelected:s}=t,{presetCategories:l}=d(),n=o();if(1===l.length)return e(i,{children:l[0].presets.map(t=>e(B,{id:t.id,name:t.name,description:t.description,img:t.img,imgAlt:t.imgAlt,detailTitle:t.detailTitle,detailDescription:t.detailDescription},t.id))});if(null!==r){let t=l.find(e=>e.id===r);if(void 0===t)throw Error(`Category with id ${r} not found!`);return e(i,{children:t.presets.map(t=>e(B,{id:t.id,name:t.name,description:t.description,img:t.img,imgAlt:t.imgAlt,detailTitle:t.detailTitle,detailDescription:t.detailDescription},t.id))})}return e(i,{children:l.map(t=>e(b,{id:t.id,name:t.name,description:t.description??n({...C,values:{presetCount:t.presets.length}}),img:t.img,imgAlt:t.imgAlt,onSelect:s},t.id))})},j={id:"sdk.presets.category.heading.title",message:"Select starting preset"},y={id:"sdk.presets.preview.title",message:"Customize product"},A={id:"sdk.presets.start.button.label",message:"Start configuring"};export const CategoryPresetUi=l=>{let{action:f,footer:k,overlay:S}=l,[h,B]=s(null),{isPreview:b}=m(),C=o(),v=r(()=>{B(null)},[]),{presetCategories:x}=d();return b?e(p,{title:C(y),startButtonLabel:C(A)}):0===x.length?e(a,{}):t(i,{children:[e(n.ScreenLayout,{heading:C(j),action:f,footer:k,overlay:S,backButton:h&&e(g,{onBack:v}),closeButton:!h&&e(c,{}),children:e(T,{selectedCategory:h,onCategorySelected:B})}),e(u,{})]})};

package/dist/configurator/ui/preset-layout/PresetUi.d.ts

@@ -5,4 +5,8 @@ export type CreatePresetPageAction = (Element: () => JSX.Element) => PhoenixLayo
 export declare const createPresetPageAction: (Element: () => JSX.Element) => PhoenixLayoutElementRegistration;
 export declare const createPresetDeviceNotSupported: (Element: () => JSX.Element) => PhoenixLayoutElementRegistration;
 export type CreatePresetDeviceNotSupported = (Element: () => JSX.Element) => PhoenixLayoutElementRegistration;
+/**
+ * Renders the `PresetUi` element. Its default, the built-in preset screen, comes from
+ * `defaultConfiguratorElements`; a project element registered under the name replaces it.
+ */
 export declare const PresetUi: () => import("react/jsx-runtime").JSX.Element;

package/dist/configurator/ui/preset-layout/PresetUi.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{createCustomPhoenixLayoutElement as t}from"#package/domain";import{PhoenixLayoutElement as r}from"#package/react-sdk";import{CategoryPresetUi as o}from"./CategoryPresetUi.js";let a="PresetUi";export const createPresetUi=e=>t(a,e);let s="PresetPageAction";export const createPresetPageAction=e=>t(s,e);let l="PresetDeviceNotSupported";export const createPresetDeviceNotSupported=e=>t(l,e);let n=()=>e(r,{name:s,elementProps:{},defaultSlot:()=>null}),p=()=>e(r,{name:l,elementProps:{},defaultSlot:()=>null}),c=()=>e(o,{action:e(n,{}),overlay:e(p,{})});export const PresetUi=()=>e(r,{name:a,elementProps:{},defaultSlot:c});
+import{jsx as e}from"react/jsx-runtime";import{createCustomPhoenixLayoutElement as t}from"#package/domain";import{PhoenixLayoutElement as r}from"#package/react-sdk";import{PresetDeviceNotSupportedName as o,PresetPageActionName as s}from"../../preset-screen-elements/index.js";let c="PresetUi";export const createPresetUi=e=>t(c,e);export const createPresetPageAction=e=>t(s,e);export const createPresetDeviceNotSupported=e=>t(o,e);export const PresetUi=()=>e(r,{name:c,elementProps:{}});

package/dist/configurator/ui/save-message-snackbars/SaveMessageSnackbars.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Shows the save messages of `useConfiguratorMessages` as snackbars: a `saveError` as an error snackbar that stays
+ * until it is dismissed or a later save succeeds, and a `saveRecovery` as an informational one. Mounted wherever a
+ * layout mounts its message services: `LayoutSlots.Services`, the legacy layouts' overlays and the `custom` owner UI.
+ * In read mode, from the access or the web component's `readonly`, nothing is saved: an error snackbar left from
+ * owner mode is closed and no message is shown. The read UIs that replace an owner UI in read mode
+ * (`SummaryReadLayout`, the `custom` read UI) mount it too, since the owner UI's instance unmounts before it can close
+ * the snackbar.
+ */
+export declare const SaveMessageSnackbars: () => null;

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

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

package/dist/configurator/ui/save-message-snackbars/index.d.ts

@@ -0,0 +1 @@
+export { SaveMessageSnackbars } from './SaveMessageSnackbars.js';

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

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

package/dist/docs/complex-use-cases/filtered-controls-with-fix-dialog.mdx

@@ -46,25 +46,22 @@ countersinkNotAvailable:
 ```
 
 ```ts
-const violationExpressions = invariantBuilder
-  .withInvariants(
-    implementCustomInvariants({
-      Plate: {
-        finishNotAvailable: s => {
-          return availableMaterials.some(state => state.material === s.material && state.finish === s.finish)
-        },
-        thicknessNotAvailable: s => {
-          return availableMaterials.some(
-            state => state.material === s.material && state.finish === s.finish && state.thickness === s.thickness
-          )
-        },
-        countersinkNotAvailable: s => {
-          return !s.someCounterSinkAdded || counterSinkThicknesses.includes(s.thickness)
-        },
-      },
-    })
-  )
-  .buildViolationExpressions()
+// src/invariants/invariants.ts
+export default phx.domain.implementCustomInvariants({
+  Plate: {
+    finishNotAvailable: s => {
+      return availableMaterials.some(state => state.material === s.material && state.finish === s.finish)
+    },
+    thicknessNotAvailable: s => {
+      return availableMaterials.some(
+        state => state.material === s.material && state.finish === s.finish && state.thickness === s.thickness
+      )
+    },
+    countersinkNotAvailable: s => {
+      return !s.someCounterSinkAdded || counterSinkThicknesses.includes(s.thickness)
+    },
+  },
+})
 ```
 
 With following control structure. Note the hierarchy of `fixableViolations`. The top input "fixes" all violations as it should never be disabled.

package/dist/docs/complex-use-cases/sketching.mdx

@@ -669,44 +669,6 @@ import { Model, attachComponent, configuratorBuilder } from './domain/index.js'
 // ... identical to the Code section above ...
 ```
 
-### Domain Setup (`domain/index.ts`)
-
-```typescript
-import { memoEval } from '@salsita-ai/sdk/domain'
-
-import { adminDomainBuilder } from './__generated/admin-implementation.js'
-import { generatedConfiguratorBuilder } from './__generated/configurator-builder.js'
-import {
-  domainBuilder,
-  implementCustomExpressions,
-  implementCustomInvariants,
-  invariantBuilder,
-} from './__generated/implementation.js'
-
-const violationExpressions = invariantBuilder.withInvariants(implementCustomInvariants({})).buildViolationExpressions()
-
-const customExpressions = implementCustomExpressions({
-  // ... as shown in Code section ...
-})
-
-const domainFactory = domainBuilder.withExpressions(violationExpressions).withExpressions(customExpressions).build()
-const adminDomainFactory = adminDomainBuilder.build()
-
-export const configuratorBuilder = generatedConfiguratorBuilder
-  .withDomainFactory(domainFactory)
-  .withAdminDomainFactory(adminDomainFactory)
-
-export * as AdminEnhancedDomain from './__generated/admin-enhanced-model.js'
-export * as AdminModel from './__generated/admin-model/index.js'
-export * as ApplicationTypes from './__generated/application-types.js'
-export * as EnhancedDomain from './__generated/enhanced-model.js'
-export * as Model from './__generated/model/index.js'
-
-export { attachAdminComponent, createAdminRecipe } from './__generated/admin-implementation.js'
-export { attachComponent, createRecipe } from './__generated/implementation.js'
-export { createPresets } from './__generated/presets.js'
-```
-
 ### Domain Configuration (`domain/domain.yaml`)
 
 ```yaml

package/dist/docs/controls/select-attribute/cardselect.mdx

@@ -99,19 +99,15 @@ components:
 Optionally disable specific options using invariants. The control performs a dry run for each option and disables those that would violate your rules. Provide a clear message; if multiple violations apply, messages are concatenated.
 
 ```typescript
-// domain/index.ts (extract)
-const violationExpressions = invariantBuilder
-  .withInvariants(
-    implementCustomInvariants({
-      Table: {
-        trunkDisabled: s =>
-          s.edgeFinish === 'TreeTrunk'
-            ? [{ type: 'trunkDisabled', severity: 'fatal', message: 'TreeTrunk finish is disabled because stuff!' }]
-            : [],
-      },
-    })
-  )
-  .buildViolationExpressions()
+// src/invariants/trunk-disabled.ts
+export default phx.domain.implementCustomInvariants({
+  Table: {
+    trunkDisabled: s =>
+      s.edgeFinish === 'TreeTrunk'
+        ? [{ type: 'trunkDisabled', severity: 'fatal', message: 'TreeTrunk finish is disabled because stuff!' }]
+        : [],
+  },
+})
 ```
 
 Register the invariant type in YAML so the system knows about it.

package/dist/docs/controls/select-child-entity/cardselect.mdx

@@ -189,6 +189,7 @@ interface ChildEntityCardSelectorSchema {
 interface ChildEntitySelectionComponentState {
   value: { $read: string } // Read-only - system manages DomainEntityId updates
   options: { $read: string } // Expression returning ChildEntitySelectionOption[]
+  keepChildren?: boolean // Keep the children of the replaced entity; by default they are deleted
 }
 
 // Each selectable option configuration

package/dist/docs/dimensions/3d-scene-integration/dimension-indicators.mdx

@@ -572,9 +572,9 @@ export type DimensionIndicatorState = {
    */
   readonly labelFontStyle?: 'normal' | 'italic'
   /**
-   * Font weight, which can be a numeric value, 'normal', or 'bold'.
+   * Font weight: a number, or a keyword such as 'normal' or 'bold'.
    */
-  readonly labelFontWeight?: number | 'normal' | 'bold'
+  readonly labelFontWeight?: number | string
   /**
    * Spacing between letters. Default is 0.
    */

package/dist/docs/dimensions/3d-scene-integration/editable-angle-indicator.mdx

@@ -131,7 +131,7 @@ export type EditableAngleIndicatorComponentState = AngleIndicatorBaseState &
     /** The instance name of the angleDimension component that will be used to update the angle. */
     readonly targetDimension: string
     /** An array of fixable violations. They will be ignored in the violation hint. */
-    readonly fixableViolations?: string[]
+    readonly fixableViolations?: readonly string[]
     /** The label of the input field. */
     readonly inputLabel?: Localizable
     /** The title of the modal. */

package/dist/docs/dimensions/3d-scene-integration/editable-distance-dimension-indicator.mdx

@@ -330,7 +330,7 @@ export type EditableDistanceDimensionIndicatorComponentState = DimensionIndicato
     /**
      * An array of fixable violations. They will be ignored in the violation hint.
      */
-    readonly fixableViolations?: string[]
+    readonly fixableViolations?: readonly string[]
     /**
      * The label of the input field.
      */

package/dist/docs/dimensions/3d-scene-integration/list-selector-dimension-indicator.mdx

@@ -365,7 +365,7 @@ export type ListSelectorDimensionIndicatorComponentState = DimensionIndicatorSta
     /**
      * An array of fixable violations. They will be ignored in the violation hint.
      */
-    readonly fixableViolations?: string[]
+    readonly fixableViolations?: readonly string[]
     /**
      * The title of the modal.
      */

package/dist/docs/drag-and-drop/drag-handle.mdx

@@ -71,7 +71,7 @@ export type DragHandleComponentState = {
    * It is defined in hessian normal form: `normal.x * x + normal.y * y + normal.z * z + constant = 0`
    * see https://threejs.org/docs/#api/en/math/Plane
    */
-  readonly surfaces: DraggableSurface[]
+  readonly surfaces: readonly DraggableSurface[]
 
   /**
    * The x property to be updated when the drag handle is dragged.

package/dist/docs/drag-and-drop/hotspot-handle.mdx

@@ -120,7 +120,7 @@ export type HotspotDragHandleComponentState = SceneEntityHtmlPositionState &
      * It is defined in hessian normal form: `normal.x * x + normal.y * y + normal.z * z + constant = 0`
      * see https://threejs.org/docs/#api/en/math/Plane
      */
-    readonly surfaces: DraggableSurface[]
+    readonly surfaces: readonly DraggableSurface[]
     /**
      * Instance name of hotspot binding. All hotspots which instance name is the same as the target will be dragged when the hotspot drag handle is dragged.
      */

package/dist/docs/drag-and-drop/planes.mdx

@@ -76,7 +76,7 @@ export type DragHandleComponentState = {
    * It is defined in hessian normal form: `normal.x * x + normal.y * y + normal.z * z + constant = 0`
    * see https://threejs.org/docs/#api/en/math/Plane
    */
-  readonly surfaces: DraggableSurface[]
+  readonly surfaces: readonly DraggableSurface[]
 
   /**
    * The x property to be updated when the drag handle is dragged.

package/dist/docs/drag-and-drop/rotatable.mdx

@@ -154,9 +154,9 @@ export type RotationHandleComponentState = {
 ```typescript
 export type RotatableSurface = {
   /**
-   * Unique identifier for the surface.
+   * Identifier of the surface.
    */
-  readonly key: string
+  readonly key?: string
 
   /**
    * The widget rotation axis in normal form. Usually corresponds to the target object's rotation axis.

package/dist/docs/fabs/basic.mdx

@@ -62,8 +62,8 @@ Lastly as both `sceneEntityDeleteFab` and `sceneEntityAddFab` are controls that
 
 All on-scene controls allow definition of `azimuthAngleLimits`, `polarAngleLimits` and `distanceLimits` properties to limit the visibility of the control based on the camera position. These properties optionally take an object with the following properties:
 
-- `min`, `max` - the range of the angle or distance where the control is visible
-- `minOpacity` - the opacity of the control when the camera is out of the range (default is `0.15`)
+- `min`, `max` (both required) - the range of the angle or distance where the control is visible
+- `minOpacity` - the opacity of the control when the camera is out of the range (default is `0`)
 - `smoothZone` - zone that eats from both sides of the range, where the opacity is interpolated from `minOpacity` to `1.0` (default is `(max - min) / 8`)
 
 All three limits can be used separately or combined. The angle limits are in radians and the distance limits respect the `unit` defined on the component.

package/dist/docs/index.json

@@ -1,5 +1,5 @@
 {
-  "generatedAt": "2026-10-13T16:48:29.381Z",
+  "generatedAt": "2026-10-15T17:13:10.434Z",
   "categories": [
     {
       "name": "Phoenix",
@@ -164,6 +164,16 @@
           ],
           "source": "storybook-root"
         },
+        {
+          "title": "Layout Slots",
+          "description": "A project layout registered as `ConfiguratorLayout` builds its UI from its own components and from the pieces of the built-in layout it wants to keep. Those pieces are the members of `LayoutSlots`,...",
+          "path": "docs/phoenix/layout-slots.mdx",
+          "category": [
+            "Phoenix",
+            "Layout Slots"
+          ],
+          "source": "storybook-root"
+        },
         {
           "title": "Localization",
           "description": "Phoenix provides a localization system built on **Lingui** that enables multi-language support across your configurator. The system handles React components and server-side webhook processing,...",
@@ -264,6 +274,16 @@
           ],
           "source": "storybook-root"
         },
+        {
+          "title": "Testing",
+          "description": "A project's tests check its own logic, such as an expression on a preset, a transformer that completes an edit, a Blender projection or a migration, against the application the project ships. They...",
+          "path": "docs/phoenix/testing.mdx",
+          "category": [
+            "Phoenix",
+            "Testing"
+          ],
+          "source": "storybook-root"
+        },
         {
           "title": "Webhook Membership",
           "description": "Build component controls with React and browser SDKs without pulling them into the server webhook bundle. Phoenix keeps user-authored components and handlers in the frontend unless a file explicitly...",
@@ -686,6 +706,16 @@
           ],
           "source": "storybook-example"
         },
+        {
+          "title": "Custom Layout",
+          "description": "Make the configurator look like the brand's own product page. A furniture shop wants its table configurator to read like the rest of its site: a floating panel on the left with the product's name,...",
+          "path": "docs/layouts/custom-layout.mdx",
+          "category": [
+            "Layouts",
+            "Custom Layout"
+          ],
+          "source": "storybook-example"
+        },
         {
           "title": "Custom Price",
           "description": "The custom price footer component replaces the standard price display in the sidebar footer with a fully customizable React component. This allows you to create custom pricing interfaces, add...",
@@ -804,6 +834,17 @@
               ],
               "source": "storybook-example"
             },
+            {
+              "title": "In a Custom Layout",
+              "description": "A project wants the configurator arranged differently, for example with the sidebar on the left, but the sidebar itself is right as it is: the spec's tabs, property pages and sidebar footer, with...",
+              "path": "docs/layouts/sidebar/in-a-custom-layout.mdx",
+              "category": [
+                "Layouts",
+                "Sidebar",
+                "In a Custom Layout"
+              ],
+              "source": "storybook-example"
+            },
             {
               "title": "General",
               "description": "The sidebar is the primary navigation and control interface in Phoenix configurators. It provides a flexible container for property pages, tabs, summary views, and other interactive components that...",

package/dist/docs/integrations/woocommerce/local-development.mdx

@@ -133,7 +133,7 @@ The value of `WOOCOMMERCE_API_KEY` must correspond to the value of the 'API key'
 settings page and `WOOCOMMERCE_PRODUCT_NAME` must correspond to the name of the product template you created.
 
 - run development server (from this repo): `pnpm dev:server`
-- prepare local deployment (from the implementation project): `pnpm deployment:prepare-local`
+- prepare local deployment (from the implementation project): `pnpm phoenix deployment:prepare-local`
 - start the dev process (from the implementation project): `pnpm dev`
 - run bundle build (from the implementation project): `pnpm build`