@salsita-ai/sdk 0.50.0-develop.e33c8d8711 → 0.50.0-develop.e54f47e4bf

package/dist/configurator/ui/assistant/form/registry/use-form-registry.d.ts

@@ -0,0 +1,8 @@
+import { type FormRegistry } from './form-registry.js';
+/**
+ * The registry the application's forms are read with. It is built when a form renders rather than
+ * when the bundle loads, since compiling validators then would break a configurator on a page whose
+ * CSP forbids eval, even one without an assistant; and rebuilt when the YAML or a component
+ * changes, so hot reload reaches the forms.
+ */
+export declare const useFormRegistry: () => FormRegistry;

package/dist/configurator/ui/assistant/form/registry/use-form-registry.js

@@ -0,0 +1 @@
+import{useMemo as r}from"react";import{extendedSchemaValidator as e}from"#package/domain";import{usePhoenixElementSlots as t,useSpecAssistant as m}from"#package/react-sdk";import{BUILT_IN_FORM_ELEMENTS as o}from"./built-in-form-elements.js";import{createFormElementDefinition as i}from"./form-element-definition.js";import{createFormRegistry as a}from"./form-registry.js";let f=[];export const useFormRegistry=()=>{let n=m()?.formElements??f,{assistantFormElements:s}=t();return r(()=>a([...o,...n.flatMap(r=>{let e=Object.entries(s).find(([e])=>e===r.name)?.[1];return e?[i(r,e)]:[]})],{schemaValidator:e}),[n,s])};

package/dist/configurator/ui/assistant/form-elements/FormCard.d.ts

@@ -0,0 +1,9 @@
+import type { AssistantBuiltInFormElementAttributes } from '#package/domain';
+import type { FormOptionProps } from './form-element-props.js';
+type FormCardProps = FormOptionProps<AssistantBuiltInFormElementAttributes<'card'>>;
+/**
+ * A `card`: a tile with its picture on top, then its label and description, outlined and checked
+ * while it is picked. A picture that is not a resource path or fails to load is left out.
+ */
+export declare const FormCard: ({ attributes, label, disabled, selected, onSelect }: FormCardProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/form-elements/FormCard.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{styled as i}from"@mui/material";import{useCallback as o,useState as t}from"react";import{PhxIcon as a}from"#package/ui-sdk";import{useResourceImageUrl as n}from"../resource-image/index.js";import{AssistantPanelName as d}from"../theme.js";let l=i("button",{name:d,slot:"formCard"})(({theme:{palette:e,shape:r,spacing:i}})=>({alignContent:"start",background:e.background.paper,border:`1px solid ${e.divider}`,borderRadius:r.borderRadius,color:e.text.primary,cursor:"pointer",display:"grid",flex:"1 1 140px",font:"inherit",gap:i(.25),margin:0,maxInlineSize:220,padding:i(.75),position:"relative",textAlign:"start","&:hover:not(:disabled)":{background:e.action.hover},"&:focus-visible":{outline:`2px solid ${e.primary.main}`,outlineOffset:1},"&:disabled":{color:e.text.disabled,cursor:"default"},'&[aria-pressed="true"]':{borderColor:e.primary.main,boxShadow:`inset 0 0 0 1px ${e.primary.main}`}})),s=i("img",{name:d,slot:"formCardImage"})(({theme:{shape:e,spacing:r}})=>({aspectRatio:"4 / 3",borderRadius:e.borderRadius,display:"block",inlineSize:"100%",marginBlockEnd:r(.5),objectFit:"contain"})),m=i("span",{name:d,slot:"formCardLabel"})(({theme:{typography:e}})=>({...e.body2,fontWeight:e.fontWeightMedium})),p=i("span",{name:d,slot:"formCardDescription"})(({theme:{palette:e,typography:r}})=>({...r.caption,color:e.text.secondary})),c=i("span",{name:d,slot:"formCardCheck"})(({theme:{palette:e,spacing:r}})=>({alignItems:"center",background:e.primary.main,borderRadius:"50%",color:e.primary.contrastText,display:"flex",fontSize:14,insetBlockStart:r(.5),insetInlineEnd:r(.5),justifyContent:"center",padding:2,position:"absolute"}));export const FormCard=({attributes:i,label:d,disabled:u,selected:b,onSelect:f})=>{let{value:g,image:h}=i,x=[d,g].find(Boolean),y=""===i.description?void 0:i.description,k=n()(h),[C,j]=t(),v=o(()=>{j(k)},[k]);return r(l,{type:"button","aria-label":null==x&&null==y?h:void 0,disabled:u,"aria-pressed":b,onClick:()=>f([g,d,y,h].find(Boolean)??""),children:[null!=k&&k!==C&&e(s,{src:k,alt:"",loading:"lazy",onError:v}),null!=x&&e(m,{children:x}),null!=y&&e(p,{children:y}),b&&e(c,{"aria-hidden":!0,children:e(a,{name:"Check",fontSize:"inherit"})})]})};

package/dist/configurator/ui/assistant/form-elements/FormConfirm.d.ts

@@ -0,0 +1,9 @@
+import type { AssistantBuiltInFormElementAttributes } from '#package/domain';
+import type { FormInputProps } from './form-element-props.js';
+type FormConfirmProps = FormInputProps<boolean, AssistantBuiltInFormElementAttributes<'confirm'>>;
+/**
+ * A `confirm`: a yes or no question as ✓ and ✗ buttons. Its state is the pick, and it answers with
+ * the user's own words for yes and no, as the answer is their own message.
+ */
+export declare const FormConfirm: ({ label, disabled, state, onChange }: FormConfirmProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/form-elements/FormConfirm.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{alpha as i,styled as a}from"@mui/material";import{useLocalizable as o}from"#package/react-sdk";import{PhxIcon as t}from"#package/ui-sdk";import{AssistantPanelName as n}from"../theme.js";let s={id:"sdk.assistant.form.confirm.yes",message:"Yes"},l={id:"sdk.assistant.form.confirm.no",message:"No"},d=a("div",{name:n,slot:"formConfirm"})(({theme:{palette:e,spacing:r,typography:i}})=>({...i.caption,color:e.text.secondary,display:"grid",gap:r(.75)})),m=a("div",{name:n,slot:"formConfirmButtons"})(({theme:{spacing:e}})=>({display:"flex",gap:e(.75)})),c=a("button",{name:n,slot:"formConfirmButton"})(({theme:{palette:e,spacing:r}})=>({alignItems:"center",background:e.background.paper,border:`1px solid ${e.divider}`,borderRadius:"calc(infinity * 1px)",color:e.text.primary,cursor:"pointer",display:"inline-flex",justifyContent:"center",margin:0,paddingBlock:r(.5),paddingInline:r(1.5),"&:hover:not(:disabled)":{background:e.action.hover},"&:focus-visible":{outline:`2px solid ${e.primary.main}`,outlineOffset:1},"&:disabled":{color:e.text.disabled,cursor:"default"},'&[aria-pressed="true"]':{background:i(e.primary.main,e.action.selectedOpacity),borderColor:e.primary.main}}));export const FormConfirm=({label:i,disabled:a,state:n,onChange:p})=>{let f=o(s),u=o(l);return r(d,{role:"group","aria-label":i,children:[null!=i&&e("span",{"aria-hidden":!0,children:i}),r(m,{children:[e(c,{type:"button","aria-label":f,title:f,disabled:a,"aria-pressed":!0===n,onClick:()=>p(!0,f),children:e(t,{name:"Check",fontSize:"small"})}),e(c,{type:"button","aria-label":u,title:u,disabled:a,"aria-pressed":!1===n,onClick:()=>p(!1,u),children:e(t,{name:"X",fontSize:"small"})})]})]})};

package/dist/configurator/ui/assistant/form-elements/FormGroup.d.ts

@@ -1,3 +1,6 @@
+import type { AssistantBuiltInFormElementAttributes } from '#package/domain';
 import type { FormContainerProps } from './form-element-props.js';
+type FormGroupProps = FormContainerProps<AssistantBuiltInFormElementAttributes<'group'>>;
 /** A `group`: its children stacked under its label, which heads them. */
-export declare const FormGroup: ({ label, children }: FormContainerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FormGroup: ({ label, children }: FormGroupProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/form-elements/FormNumber.d.ts

@@ -0,0 +1,9 @@
+import type { AssistantBuiltInFormElementAttributes } from '#package/domain';
+import type { FormInputProps } from './form-element-props.js';
+type FormNumberProps = FormInputProps<number, AssistantBuiltInFormElementAttributes<'number'>>;
+/**
+ * A `number`: a field with its unit, and a slider beside it when both `min` and `max` are given. It
+ * stays unanswered until the user enters a number, even while the slider rests at `min`.
+ */
+export declare const FormNumber: ({ attributes: { value, min, max, step, unit }, label, disabled, state, onChange, }: FormNumberProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/form-elements/FormNumber.js

@@ -0,0 +1 @@
+import{jsx as r,jsxs as i}from"react/jsx-runtime";import{Trans as e}from"@lingui/react";import{styled as o}from"@mui/material";import{useCallback as t,useEffect as a}from"react";import{NumericalInput as m}from"#package/ui-sdk";import{AssistantPanelName as n}from"../theme.js";import{clampFormNumber as s}from"./clamp-form-number.js";let l=o("div",{name:n,slot:"formNumber"})(({theme:{palette:r,spacing:i,typography:e}})=>({alignSelf:"stretch",color:r.text.secondary,display:"grid",gap:i(.5),...e.caption})),d=(r,i)=>i?`${r} ${i}`:String(r),u=r=>""===r.trim()?null:Number(r);export const FormNumber=({attributes:{value:o,min:n,max:p,step:v,unit:c},label:f,disabled:g,state:b,onChange:h})=>{let x=void 0===o?void 0:s(o,{min:n,max:p}),j=b??x;a(()=>{void 0===b&&void 0!==x&&h(x,d(x,c))},[b,x,c,h]);let N=t(r=>h(r,d(r,c)),[h,c]),S=t(()=>{if(void 0===j)return;let r=s(j,{min:n,max:p});r!==j&&N(r)},[j,n,p,N]),k=t(r=>void 0===j?"":String(r),[j]);return i(l,{role:"group","aria-label":f,children:[null!=f&&r("span",{"aria-hidden":!0,children:f}),r(m,{value:j??n??0,min:n,max:p,unit:c,size:"small",disabled:g,withSlider:void 0!==n&&void 0!==p,sliderProps:void 0===v?void 0:{step:v},inputFieldProps:{parseValue:u,formatValue:k,invalidNumberErrorMessage:r(e,{id:"sdk.assistant.form.number.invalid",message:"Enter a number."})},onChange:N,onChanged:S})]})};

package/dist/configurator/ui/assistant/form-elements/FormOptions.d.ts

@@ -1,3 +1,6 @@
+import type { AssistantBuiltInFormElementAttributes } from '#package/domain';
 import type { FormContainerProps } from './form-element-props.js';
+type FormOptionsProps = FormContainerProps<AssistantBuiltInFormElementAttributes<'choice' | 'choices'>>;
 /** A `choice` or `choices`: its options in a wrapping row under its label. */
-export declare const FormOptions: ({ label, children }: FormContainerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FormOptions: ({ label, children }: FormOptionsProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/form-elements/FormReply.d.ts

@@ -1,3 +1,6 @@
+import type { AssistantBuiltInFormElementAttributes } from '#package/domain';
 import type { FormOptionProps } from './form-element-props.js';
+type FormReplyProps = FormOptionProps<AssistantBuiltInFormElementAttributes<'reply'>>;
 /** A `reply`: a short answer as a small pill, marked while it is picked. */
-export declare const FormReply: ({ label, disabled, selected, onSelect }: FormOptionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FormReply: ({ attributes, label, disabled, selected, onSelect }: FormReplyProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/form-elements/FormReply.js

@@ -1 +1 @@
-import{jsx as r}from"react/jsx-runtime";import{alpha as e,styled as i}from"@mui/material";import{AssistantPanelName as o}from"../theme.js";let t=i("button",{name:o,slot:"formReply"})(({theme:{palette:r,spacing:i,typography:o}})=>({...o.body2,background:r.background.paper,border:`1px solid ${r.divider}`,borderRadius:"calc(infinity * 1px)",color:r.text.primary,cursor:"pointer",margin:0,paddingBlock:i(.25),paddingInline:i(1.25),textAlign:"start","&:hover:not(:disabled)":{background:r.action.hover},"&:focus-visible":{outline:`2px solid ${r.primary.main}`,outlineOffset:1},"&:disabled":{color:r.text.disabled,cursor:"default"},'&[aria-pressed="true"]':{background:e(r.primary.main,r.action.selectedOpacity),borderColor:r.primary.main}}));export const FormReply=({label:e,disabled:i,selected:o,onSelect:a})=>r(t,{type:"button",disabled:i,"aria-pressed":o,onClick:a,children:e});
+import{jsx as r}from"react/jsx-runtime";import{alpha as e,styled as o}from"@mui/material";import{AssistantPanelName as i}from"../theme.js";let a=o("button",{name:i,slot:"formReply"})(({theme:{palette:r,spacing:o,typography:i}})=>({...i.body2,background:r.background.paper,border:`1px solid ${r.divider}`,borderRadius:"calc(infinity * 1px)",color:r.text.primary,cursor:"pointer",margin:0,paddingBlock:o(.25),paddingInline:o(1.25),textAlign:"start","&:hover:not(:disabled)":{background:r.action.hover},"&:focus-visible":{outline:`2px solid ${r.primary.main}`,outlineOffset:1},"&:disabled":{color:r.text.disabled,cursor:"default"},'&[aria-pressed="true"]':{background:e(r.primary.main,r.action.selectedOpacity),borderColor:r.primary.main}}));export const FormReply=({attributes:e,label:o,disabled:i,selected:t,onSelect:d})=>r(a,{type:"button",disabled:i,"aria-pressed":t,onClick:()=>d([e.value,o].find(Boolean)??""),children:o});

package/dist/configurator/ui/assistant/form-elements/FormSwatch.d.ts

@@ -0,0 +1,10 @@
+import type { AssistantBuiltInFormElementAttributes } from '#package/domain';
+import type { FormOptionProps } from './form-element-props.js';
+type FormSwatchProps = FormOptionProps<AssistantBuiltInFormElementAttributes<'swatch'>>;
+/**
+ * A `swatch`: a small square filled with its color or covered by its picture, its label in a
+ * tooltip, ringed and checked while it is picked. A picture that is not a resource path or fails to
+ * load leaves the color, or a neutral tile.
+ */
+export declare const FormSwatch: ({ attributes, label, disabled, selected, onSelect }: FormSwatchProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/form-elements/FormSwatch.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as i}from"react/jsx-runtime";import{Tooltip as r,styled as o}from"@mui/material";import{useCallback as a,useState as t}from"react";import{PhxIcon as n}from"#package/ui-sdk";import{useResourceImageUrl as l}from"../resource-image/index.js";import{AssistantPanelName as s}from"../theme.js";let d=o("button",{name:s,slot:"formSwatch"})(({theme:{palette:e,shape:i}})=>({background:e.action.hover,blockSize:36,border:`1px solid ${e.divider}`,borderRadius:i.borderRadius,cursor:"pointer",flex:"none",inlineSize:36,margin:0,overflow:"hidden",padding:0,position:"relative","&:focus-visible":{outline:`2px solid ${e.primary.main}`,outlineOffset:3},"&:disabled":{cursor:"default",opacity:e.action.disabledOpacity},'&[aria-pressed="true"]':{boxShadow:`0 0 0 2px ${e.background.paper}, 0 0 0 4px ${e.primary.main}`}})),m=o("img",{name:s,slot:"formSwatchImage"})({blockSize:"100%",display:"block",inlineSize:"100%",objectFit:"cover"}),c=o("span",{name:s,slot:"formSwatchCheck"})(({theme:{palette:e}})=>({alignItems:"center",background:e.primary.main,borderRadius:"50%",color:e.primary.contrastText,display:"flex",fontSize:14,inset:"50% auto auto 50%",justifyContent:"center",padding:2,position:"absolute",transform:"translate(-50%, -50%)"})),p=o("span")({display:"inline-flex"});export const FormSwatch=({attributes:o,label:s,disabled:u,selected:f,onSelect:b})=>{let{value:h,color:x,image:g}=o,y=l()(g),[k,S]=t(),j=[s,h,x,g].find(Boolean),v=a(()=>{S(y)},[y]);return e(r,{title:j??"",placement:"top",children:e(p,{children:i(d,{type:"button","aria-label":j,disabled:u,"aria-pressed":f,onClick:()=>b([h,s,x,g].find(Boolean)??""),style:null==x?void 0:{background:x},children:[null!=y&&y!==k&&e(m,{src:y,alt:"",loading:"lazy",onError:v}),f&&e(c,{"aria-hidden":!0,children:e(n,{name:"Check",fontSize:"inherit"})})]})})})};

package/dist/configurator/ui/assistant/form-elements/FormText.d.ts

@@ -1,3 +1,6 @@
+import type { AssistantBuiltInFormElementAttributes } from '#package/domain';
 import type { FormInputProps } from './form-element-props.js';
+type FormTextProps = FormInputProps<string, AssistantBuiltInFormElementAttributes<'text'>>;
 /** A `text`: a single line the user types, with its label above it. */
-export declare const FormText: ({ attributes, label, value, disabled, state, onChange }: FormInputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FormText: ({ attributes: { value, placeholder }, label, disabled, state, onChange }: FormTextProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/form-elements/FormText.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import{InputBase as t,styled as o}from"@mui/material";import{useCallback as i}from"react";import{AssistantPanelName as a}from"../theme.js";let d=o("label",{name:a,slot:"formText"})(({theme:{palette:e,spacing:r,typography:t}})=>({alignSelf:"stretch",color:e.text.secondary,display:"grid",gap:r(.5),...t.caption})),m=o(t,{name:a,slot:"formTextInput"})(({theme:{palette:e,spacing:r,typography:t}})=>({...t.body2,border:`1px solid ${e.divider}`,borderRadius:12,color:e.text.primary,paddingBlock:r(.75),paddingInline:r(1.5),"&.Mui-focused":{borderColor:e.primary.main},"& .MuiInputBase-input":{padding:0}}));export const FormText=({attributes:t,label:o,value:a,disabled:l,state:n,onChange:p})=>{let{placeholder:s}=t;return r(d,{children:[o,e(m,{value:"string"==typeof n?n:a??"",placeholder:"string"==typeof s?s:void 0,disabled:l,onChange:i(e=>{let r=e.target.value;p(r,""===r.trim()?void 0:r.trim())},[p])})]})};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{InputBase as t,styled as o}from"@mui/material";import{useCallback as i,useEffect as a}from"react";import{AssistantPanelName as d}from"../theme.js";let m=o("label",{name:d,slot:"formText"})(({theme:{palette:e,spacing:r,typography:t}})=>({alignSelf:"stretch",color:e.text.secondary,display:"grid",gap:r(.5),...t.caption})),l=e=>""===e.trim()?void 0:e.trim(),n=o(t,{name:d,slot:"formTextInput"})(({theme:{palette:e,spacing:r,typography:t}})=>({...t.body2,border:`1px solid ${e.divider}`,borderRadius:12,color:e.text.primary,paddingBlock:r(.75),paddingInline:r(1.5),"&.Mui-focused":{borderColor:e.primary.main},"& .MuiInputBase-input":{padding:0}}));export const FormText=({attributes:{value:t,placeholder:o},label:d,disabled:s,state:p,onChange:c})=>(a(()=>{void 0===p&&void 0!==t&&""!==t&&c(t,l(t))},[p,t,c]),r(m,{children:[d,e(n,{value:p??t??"",placeholder:o,disabled:s,onChange:i(e=>{let r=e.target.value;c(r,l(r))},[c])})]}));

package/dist/configurator/ui/assistant/form-elements/clamp-form-number.d.ts

@@ -0,0 +1,10 @@
+/** The limits a `number` keeps its value within, from its attributes. */
+export interface FormNumberLimits {
+    readonly min?: number;
+    readonly max?: number;
+}
+/**
+ * The value a `number` settles on once the user leaves the field: within `min` and `max`. The
+ * `step` is left out: it moves the slider, and a typed value between steps stays as typed.
+ */
+export declare const clampFormNumber: (value: number, { min, max }: FormNumberLimits) => number;

package/dist/configurator/ui/assistant/form-elements/clamp-form-number.js

@@ -0,0 +1 @@
+export const clampFormNumber=(m,{min:a,max:t})=>Math.min(t??1/0,Math.max(a??-1/0,m));

package/dist/configurator/ui/assistant/form-elements/form-element-props.d.ts

@@ -1,34 +1,38 @@
 import type { ReactNode } from 'react';
-/** Validated and coerced attributes of an element, without the built-in `label` and `value`. */
+/** Validated and coerced attributes of an element, without the built-in `label`: what any element gets. */
 export type FormElementAttributes = Readonly<Record<string, unknown>>;
 /** Props of a `group`, `choice` or `choices` element: it lays out the children the form renders for it. */
-export interface FormContainerProps {
-    readonly attributes: FormElementAttributes;
+export interface FormContainerProps<ATTRIBUTES = FormElementAttributes> {
+    readonly attributes: ATTRIBUTES;
     readonly label?: string;
     readonly disabled: boolean;
     readonly children: ReactNode;
 }
 /**
- * Props of an option. Its container decides what a pick does: in a `choice` it replaces the
- * previous pick, in a `choices` it toggles, and in a form that asks one question it sends at once.
+ * Props of an option. It reports what it answers with when the user picks it, as an input reports
+ * its answer: by convention its `value` attribute, or else its label. Its container decides what a
+ * pick does: in a `choice` it replaces the previous pick, in a `choices` it toggles, and in a form
+ * that asks one question it sends at once. An empty answer counts as unanswered.
  */
-export interface FormOptionProps {
-    readonly attributes: FormElementAttributes;
+export interface FormOptionProps<ATTRIBUTES = FormElementAttributes> {
+    readonly attributes: ATTRIBUTES;
     readonly label?: string;
     readonly disabled: boolean;
     readonly selected: boolean;
-    onSelect(): void;
+    onSelect(answer: string): void;
 }
 /**
- * Props of an input. Its state is its own: the form stores it and hands it back. `answer` is the
- * text the answer shows for it, or `undefined` while there is none.
+ * Props of an input. Its state is its own: the form stores what it reports and hands it back.
+ * `answer` is the text the answer shows for it, or `undefined` while there is none. An input that
+ * starts with a `value` attribute reports its starting answer when it mounts, since an input that
+ * never reports is unanswered and only the input knows how its value reads in the answer, such as
+ * a number with its unit. A quick input, which a lone form sends on its first report, reports only
+ * what the user did.
  */
-export interface FormInputProps {
-    readonly attributes: FormElementAttributes;
+export interface FormInputProps<STATE = unknown, ATTRIBUTES = FormElementAttributes> {
+    readonly attributes: ATTRIBUTES;
     readonly label?: string;
-    /** What the field starts with. */
-    readonly value?: string;
     readonly disabled: boolean;
-    readonly state: unknown;
-    onChange(state: unknown, answer: string | undefined): void;
+    readonly state: STATE | undefined;
+    onChange(state: STATE, answer: string | undefined): void;
 }

package/dist/configurator/ui/assistant/form-elements/index.d.ts

@@ -1,5 +1,9 @@
 export type { FormContainerProps, FormElementAttributes, FormInputProps, FormOptionProps, } from './form-element-props.js';
+export { FormCard } from './FormCard.js';
+export { FormConfirm } from './FormConfirm.js';
 export { FormGroup } from './FormGroup.js';
 export { FormOptions } from './FormOptions.js';
+export { FormNumber } from './FormNumber.js';
 export { FormReply } from './FormReply.js';
+export { FormSwatch } from './FormSwatch.js';
 export { FormText } from './FormText.js';

package/dist/configurator/ui/assistant/form-elements/index.js

@@ -1 +1 @@
-export{FormGroup}from"./FormGroup.js";export{FormOptions}from"./FormOptions.js";export{FormReply}from"./FormReply.js";export{FormText}from"./FormText.js";
+export{FormCard}from"./FormCard.js";export{FormConfirm}from"./FormConfirm.js";export{FormGroup}from"./FormGroup.js";export{FormOptions}from"./FormOptions.js";export{FormNumber}from"./FormNumber.js";export{FormReply}from"./FormReply.js";export{FormSwatch}from"./FormSwatch.js";export{FormText}from"./FormText.js";

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

@@ -1,2 +1,5 @@
 export { AssistantPanel, ASSISTANT_PANEL_SLOT } from './AssistantPanel.js';
 export { useIsAssistantPanelOpen } from './use-is-assistant-panel-open.js';
+export type { AssistantFormElementRoleProps, AssistantFormElementType, CreateAssistantFormElement, } from './form/index.js';
+export { createAssistantFormElementFactory } from './form/index.js';
+export type { FormContainerProps, FormInputProps, FormOptionProps } from './form-elements/index.js';

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

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

package/dist/configurator/ui/assistant/reference-link/AssistantReferenceLink.d.ts

@@ -0,0 +1,16 @@
+import { type ReactNode } from 'react';
+import type { AssistantReferenceTarget } from './assistant-link-target.js';
+export interface AssistantReferenceLinkProps {
+    readonly target: AssistantReferenceTarget;
+    /** The text the assistant gave the link; the target itself is never shown. */
+    readonly children: ReactNode;
+}
+declare const ReferenceLinkView: ({ target, children }: AssistantReferenceLinkProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * A recipe or an option the assistant named in a reply, shown as its label. Hovering, focusing or
+ * tapping it opens a popover with its picture or color, name and description, read from the
+ * current state at that moment; leaving it, tapping outside or Escape closes it. A click does
+ * nothing else.
+ */
+export declare const AssistantReferenceLink: import("react").MemoExoticComponent<typeof ReferenceLinkView>;
+export {};

package/dist/configurator/ui/assistant/reference-link/AssistantReferenceLink.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Trans as n}from"@lingui/react";import{ClickAwayListener as t,Tooltip as a,styled as i}from"@mui/material";import{memo as o,useCallback as l,useEffect as s,useRef as d,useState as c}from"react";import{isShallowEqual as p}from"@salsita-ai/common/utils";import{useResourceUrl as m}from"#package/react-sdk";import{AssistantPanelName as u}from"../theme.js";import{assistantReferenceStyles as f}from"./reference-styles.js";import{useAssistantReferenceDetails as h}from"./use-assistant-reference-details.js";let b=i("span",{name:u,slot:"referenceLink"})(f),x=i("span",{name:u,slot:"referenceDetails"})(({theme:{palette:e,shape:r,shadows:n,spacing:t,typography:a}})=>({...a.body2,background:e.background.paper,borderRadius:r.borderRadius,boxShadow:n[4],color:e.text.primary,display:"flex",gap:t(1.5),maxInlineSize:320,padding:t(1.5),'&[data-reference-details="unavailable"]':{color:e.text.secondary}})),g=i("img")(({theme:{shape:e}})=>({alignSelf:"flex-start",blockSize:"auto",borderRadius:e.borderRadius/2,flexShrink:0,inlineSize:64,maxBlockSize:96,objectFit:"contain"})),k=i("span")(({theme:{palette:e,shape:r}})=>({blockSize:32,borderRadius:r.borderRadius/2,boxShadow:`inset 0 0 0 1px ${e.divider}`,flexShrink:0,inlineSize:32})),y=i("span")(({theme:{palette:e,spacing:r}})=>({display:"flex",flexDirection:"column",gap:r(.5),minInlineSize:0,"& > :first-of-type":{fontWeight:600},"& > :not(:first-of-type)":{color:e.text.secondary}})),S=({target:t,onResolve:a,onImageLoad:i})=>{let o=h(t),{getResourceUrl:l}=m(),d=null!=o;if(s(()=>{a(d)},[d,a]),!o)return e(x,{"data-reference-details":"unavailable",children:e(n,{id:"sdk.assistant.reference.unavailable.message",message:"Not available right now"})});let{name:c,description:p,imageUrl:u,color:f}=o;return r(x,{children:[null!=u&&e(g,{src:l(u),alt:"",onLoad:i}),null==u&&null!=f&&e(k,{style:{background:f}}),r(y,{children:[e("span",{children:c}),null!=p&&e("span",{children:p})]})]})};export const AssistantReferenceLink=o(({target:r,children:n})=>{let[i,o]=c(!1),[s,p]=c(!1),m=l(()=>o(!0),[]),u=l(()=>o(!1),[]),f=l(e=>p(!e),[]),h=d(null),x=l(e=>{h.current=e},[]),g=l(()=>{h.current?.update()},[]),k=l(e=>{("Enter"===e.key||" "===e.key)&&(e.preventDefault(),o(!0))},[]);return e(t,{onClickAway:u,mouseEvent:!!i&&"onClick",touchEvent:!!i&&"onTouchEnd",children:e(a,{open:i,onOpen:m,onClose:u,title:e(S,{target:r,onResolve:f,onImageLoad:g}),placement:"top-start",describeChild:!0,disableTouchListener:!0,PopperProps:{popperRef:x},slotProps:{tooltip:{sx:{background:"none",maxInlineSize:"none",padding:0}}},children:e(b,{role:"button",tabIndex:0,"aria-expanded":i,"data-reference":s?"muted":void 0,onClick:m,onKeyDown:k,children:n})})})},(e,r)=>e.children===r.children&&p(e.target,r.target));

package/dist/configurator/ui/assistant/reference-link/assistant-link-target.d.ts

@@ -0,0 +1,34 @@
+import { type DomainEntityId } from '#package/domain';
+/** A recipe of a recipe group on an entity, as the assistant read it under `meta`: `recipe:<entityId>/<groupId>/<key>`. */
+export interface AssistantRecipeTarget {
+    readonly kind: 'recipe';
+    readonly entityId: DomainEntityId<string>;
+    readonly groupId: string;
+    readonly key: string;
+}
+/**
+ * A choice of a writable field on an entity, as the assistant read it under `meta`:
+ * `option:<entityId>/<edgeName>/<value>`. The edge is the options field the assistant queried, such
+ * as `finishOptions`, and the value is the option's value in its string form.
+ */
+export interface AssistantOptionTarget {
+    readonly kind: 'option';
+    readonly entityId: DomainEntityId<string>;
+    readonly edgeName: string;
+    readonly value: string;
+}
+/** What a reference points at: something the configurator offers, shown by its details rather than selected. */
+export type AssistantReferenceTarget = AssistantRecipeTarget | AssistantOptionTarget;
+/** Where a link the assistant wrote in a reply points: an entity of the configuration, or a reference. */
+export type AssistantLinkTarget = {
+    readonly kind: 'entity';
+    readonly id: DomainEntityId<string>;
+} | AssistantReferenceTarget;
+/** True for the target of a link the assistant wrote with one of its schemes, whatever follows the scheme. */
+export declare const isAssistantLinkHref: (href: string) => boolean;
+/**
+ * What a link the assistant wrote points at, or `null` when what follows its scheme is not a
+ * well-formed target. An entity link holds the id as it is; the parts of a reference are decoded,
+ * so a key the model encoded as in a URL and one Markdown encoded from angle brackets read the same.
+ */
+export declare const parseAssistantLinkTarget: (href: string) => AssistantLinkTarget | null;

package/dist/configurator/ui/assistant/reference-link/assistant-link-target.js

@@ -0,0 +1 @@
+import{DomainEntityIdSchema as t}from"#package/domain";let e="entity:",n="recipe:",i="option:",l=[e,n,i],r=new RegExp(t.pattern),s=t=>{try{let e=decodeURIComponent(t);return""===e?null:e}catch{return null}},u=t=>{let e=t.split("/").map(s);if(3!==e.length)return null;let[n,i,l]=e;return null!=n&&r.test(n)&&null!=i&&null!=l?{entityId:n,first:i,second:l}:null};export const isAssistantLinkHref=t=>l.some(e=>t.startsWith(e));export const parseAssistantLinkTarget=t=>{if(t.startsWith(e)){let n=t.slice(e.length);return r.test(n)?{kind:"entity",id:n}:null}if(t.startsWith(n)){let e=u(t.slice(n.length));return e&&{kind:"recipe",entityId:e.entityId,groupId:e.first,key:e.second}}if(t.startsWith(i)){let e=u(t.slice(i.length));return e&&{kind:"option",entityId:e.entityId,edgeName:e.first,value:e.second}}return null};

package/dist/configurator/ui/assistant/reference-link/assistant-reference-details.d.ts

@@ -0,0 +1,25 @@
+import { type AssistantManifest, type AssistantRecipeContext, type DomainEntity, type DomainState } from '#package/domain';
+import type { AssistantReferenceTarget } from './assistant-link-target.js';
+type AnyDomainState = DomainState<DomainEntity<string>>;
+/** What the popover of a reference shows of the recipe or option it points at, texts in the current language. */
+export interface AssistantReferenceDetails {
+    readonly name: string;
+    readonly description: string | null;
+    readonly imageUrl: string | null;
+    readonly color: string | null;
+}
+/**
+ * What reading a reference needs: the manifest of the session and the readers `meta` resolves
+ * through, so the popover shows what the agent read.
+ */
+export interface AssistantReferenceContext extends Pick<AssistantRecipeContext, 'componentReader' | 'resolveLocalizable'> {
+    readonly manifest: AssistantManifest;
+}
+/**
+ * The details of what a reference points at on the given state, read the way `meta` reads them:
+ * only what the session's manifest exposes, from a component that is active on the entity there.
+ * `null` when the target does not resolve: the entity, the group or options edge, or the key or value is
+ * unknown, or the component is not active.
+ */
+export declare const readAssistantReferenceDetails: (target: AssistantReferenceTarget, state: AnyDomainState, context: AssistantReferenceContext) => AssistantReferenceDetails | null;
+export {};

package/dist/configurator/ui/assistant/reference-link/assistant-reference-details.js

@@ -0,0 +1 @@
+import{match as e}from"ts-pattern";import{findAssistantFieldOptions as i,findAssistantRecipeGroups as t,readAssistantFieldOptions as n,readAssistantRecipeGroup as r}from"#package/domain";let l=["child","replace"];export const readAssistantReferenceDetails=(o,a,d)=>{let u=a.entities.find(e=>e.id===o.entityId);return u?e(o).with({kind:"recipe"},e=>((e,i,n,o)=>{let a=(({entityId:e,groupId:i,key:n},o,a,d)=>{for(let u of l)for(let l of t(d.manifest,u,o)){if(l.groupId!==i)continue;let t=r(u,l,e,a,d)?.recipes.find(e=>e.key===n);if(t)return t}return null})(e,i,n,o);if(!a)return null;let{title:d,description:u,thumbnailUrl:f}=a.item,{resolveLocalizable:m}=o;return{name:m(d),description:void 0===u?null:m(u),imageUrl:void 0===f?null:m(f),color:null}})(e,u.type,a,d)).with({kind:"option"},e=>(({entityId:e,edgeName:t,value:r},l,o,a)=>{let d=i(a.manifest,l).find(e=>e.edgeName===t),u=d?n(d,e,o,a)?.find(e=>String(e.value)===r):void 0;return u?{name:u.name??u.description??String(u.value),description:null==u.name?null:u.description,imageUrl:u.imageUrl,color:u.color}:null})(e,u.type,a,d)).exhaustive():null};

package/dist/configurator/ui/assistant/reference-link/index.d.ts

@@ -0,0 +1,3 @@
+export { AssistantReferenceLink } from './AssistantReferenceLink.js';
+export { isAssistantLinkHref, parseAssistantLinkTarget } from './assistant-link-target.js';
+export { assistantReferenceStyles } from './reference-styles.js';

package/dist/configurator/ui/assistant/reference-link/index.js

@@ -0,0 +1 @@
+export{AssistantReferenceLink}from"./AssistantReferenceLink.js";export{isAssistantLinkHref,parseAssistantLinkTarget}from"./assistant-link-target.js";export{assistantReferenceStyles}from"./reference-styles.js";

package/dist/configurator/ui/assistant/reference-link/reference-styles.d.ts

@@ -0,0 +1,12 @@
+import { type CSSObject, type Theme } from '@mui/material';
+/**
+ * How a link in a reply reads: a glossary reference, text that flows with the sentence and wraps
+ * with it, in the reference color with a dashed underline. Entity links and the references to
+ * recipes and options share it, so every link of a reply looks alike.
+ *
+ * - `data-reference="plain"`: something that exists but does nothing on a click, in the text color;
+ * - `data-reference="muted"`: something that is gone or cannot be read right now.
+ */
+export declare const assistantReferenceStyles: ({ theme: { palette, shape } }: {
+    readonly theme: Theme;
+}) => CSSObject;

package/dist/configurator/ui/assistant/reference-link/reference-styles.js

@@ -0,0 +1 @@
+import{alpha as e}from"@mui/material";export const assistantReferenceStyles=({theme:{palette:r,shape:o}})=>({background:"none",border:"none",borderRadius:o.borderRadius/2,boxDecorationBreak:"clone",color:r.primary.main,cursor:"pointer",font:"inherit",margin:0,padding:0,textDecorationLine:"underline",textDecorationStyle:"dashed",textDecorationThickness:1,textUnderlineOffset:"0.2em",WebkitBoxDecorationBreak:"clone",'&:hover, &:focus-visible, &[data-hovered="true"], &[aria-expanded="true"]':{background:e(r.primary.main,r.action.hoverOpacity)},"&:focus-visible":{outline:`2px solid ${r.primary.main}`,outlineOffset:1},'&[data-reference="plain"]':{color:"inherit",cursor:"auto"},'&[data-reference="muted"]':{color:r.text.disabled}});

package/dist/configurator/ui/assistant/reference-link/use-assistant-reference-details.d.ts

@@ -0,0 +1,8 @@
+import type { AssistantReferenceTarget } from './assistant-link-target.js';
+import { type AssistantReferenceDetails } from './assistant-reference-details.js';
+/**
+ * The details of what a reference points at, read from the committed state and followed while the
+ * caller is mounted; `null` when it does not resolve there. Only the open popover of a reference
+ * calls it, so a reply full of references reads nothing until one is opened.
+ */
+export declare const useAssistantReferenceDetails: (target: AssistantReferenceTarget) => AssistantReferenceDetails | null;

package/dist/configurator/ui/assistant/reference-link/use-assistant-reference-details.js

@@ -0,0 +1 @@
+import{useDomain as e,useResolveLocalizable as t,useStoreSelector as r}from"#package/react-sdk";import{useConfigurator as s}from"../../../application-runtime/index.js";import{readAssistantReferenceDetails as i}from"./assistant-reference-details.js";export const useAssistantReferenceDetails=a=>{let{assistantSystem:n}=s(),{componentReader:o}=e(),l=t();return r(({state:e})=>{let t=n.getSessionManifest();return t?i(a,e,{manifest:t,componentReader:o,resolveLocalizable:e=>l(e)}):null},[n,o,l,a])};

package/dist/configurator/ui/assistant/resource-image/AssistantImage.d.ts

@@ -0,0 +1,9 @@
+export interface AssistantImageProps {
+    readonly src: string | undefined;
+    readonly alt: string | undefined;
+}
+/**
+ * An image in a reply, loaded from the project's resources. One the panel refuses to request or
+ * that fails to load shows its alt text instead, so the sentence around it still reads.
+ */
+export declare const AssistantImage: import("react").MemoExoticComponent<({ src, alt }: AssistantImageProps) => import("react/jsx-runtime").JSX.Element>;

package/dist/configurator/ui/assistant/resource-image/AssistantImage.js

@@ -0,0 +1 @@
+import{jsx as r,Fragment as e}from"react/jsx-runtime";import{styled as t}from"@mui/material";import{memo as m,useCallback as o,useState as a}from"react";import{AssistantPanelName as i}from"../theme.js";import{useResourceImageUrl as s}from"./use-resource-image-url.js";let l=t("img",{name:i,slot:"image"})(({theme:{shape:r,spacing:e}})=>({blockSize:"auto",borderRadius:r.borderRadius,display:"block",maxInlineSize:"100%","& + &":{marginBlockStart:e(1)}}));export const AssistantImage=m(({src:t,alt:m})=>{let i=s()(t),[n,u]=a(),c=o(()=>{u(i)},[i]);return null==i||i===n?r(e,{children:m}):r(l,{src:i,alt:m??"",loading:"lazy",onError:c})});

package/dist/configurator/ui/assistant/resource-image/index.d.ts

@@ -0,0 +1,3 @@
+export { AssistantImage } from './AssistantImage.js';
+export { isResourcePath } from './resource-path.js';
+export { useResourceImageUrl } from './use-resource-image-url.js';

package/dist/configurator/ui/assistant/resource-image/index.js

@@ -0,0 +1 @@
+export{AssistantImage}from"./AssistantImage.js";export{isResourcePath}from"./resource-path.js";export{useResourceImageUrl}from"./use-resource-image-url.js";

package/dist/configurator/ui/assistant/resource-image/resource-path.d.ts

@@ -0,0 +1,2 @@
+/** True when the image source the model wrote may be requested: a path into the project's resources. */
+export declare const isResourcePath: (src: string | undefined) => src is string;

package/dist/configurator/ui/assistant/resource-image/resource-path.js

@@ -0,0 +1 @@
+import{ASSISTANT_RESOURCE_PATH_PATTERN as e}from"#package/domain";let t=RegExp(e,"u");export const isResourcePath=e=>null!=e&&t.test(e);

package/dist/configurator/ui/assistant/resource-image/use-resource-image-url.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Resolves an image source the model wrote the way the configurator resolves thumbnails, or returns
+ * `undefined` when it is not a path into the project's resources and must not be requested.
+ */
+export declare const useResourceImageUrl: () => (src: string | undefined) => string | undefined;

package/dist/configurator/ui/assistant/resource-image/use-resource-image-url.js

@@ -0,0 +1 @@
+import{useCallback as r}from"react";import{useResourceUrl as e}from"#package/react-sdk";import{isResourcePath as o}from"./resource-path.js";export const useResourceImageUrl=()=>{let{getResourceUrl:t}=e();return r(r=>o(r)?t(r):void 0,[t])};

package/dist/configurator/ui/assistant/screenshots/ScreenshotThumbnails.d.ts

@@ -0,0 +1,9 @@
+import type { AssistantToolScreenshot } from './tool-screenshots.js';
+interface ScreenshotThumbnailsProps {
+    readonly screenshots: readonly AssistantToolScreenshot[];
+    /** Called once a picture has loaded, which changes the size of the popover. */
+    readonly onImageLoad: () => void;
+}
+/** The pictures of a tool call's screenshots. */
+export declare const ScreenshotThumbnails: ({ screenshots, onImageLoad }: ScreenshotThumbnailsProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/screenshots/ScreenshotThumbnails.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import{styled as o}from"@mui/material";import{AssistantPanelName as r}from"../theme.js";import{useScreenshotSrc as a}from"./use-screenshot-src.js";let i=o("span",{name:r,slot:"screenshots",shouldForwardProp:e=>"columns"!==e})(({columns:e,theme:{palette:o,shape:r,shadows:a,spacing:i}})=>({background:o.background.paper,borderRadius:r.borderRadius,boxShadow:a[4],display:"grid",gap:i(1.5),gridTemplateColumns:`repeat(${e}, minmax(0, 200px))`,maxInlineSize:"80vw",padding:i(1.5)})),s=o("img")(({theme:{palette:e,shape:o}})=>({blockSize:"auto",borderRadius:o.borderRadius/2,boxShadow:`inset 0 0 0 1px ${e.divider}`,display:"block",inlineSize:"100%"})),d=o("span")(({theme:{palette:e,shape:o}})=>({aspectRatio:"4 / 3",background:e.action.hover,borderRadius:o.borderRadius/2,display:"block"})),t=({picture:o,onImageLoad:r})=>{let i=a(o);return void 0===i?e(d,{}):e(s,{src:i,alt:"",onLoad:r})};export const ScreenshotThumbnails=({screenshots:o,onImageLoad:r})=>e(i,{columns:Math.min(o.length,2),children:o.map(({label:o,picture:a})=>e(t,{picture:a,onImageLoad:r},o))});

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

@@ -0,0 +1,2 @@
+export { ScreenshotThumbnails } from './ScreenshotThumbnails.js';
+export { type AssistantToolScreenshot, readToolScreenshots } from './tool-screenshots.js';

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

@@ -0,0 +1 @@
+export{ScreenshotThumbnails}from"./ScreenshotThumbnails.js";export{readToolScreenshots}from"./tool-screenshots.js";

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

@@ -0,0 +1,22 @@
+/**
+ * Where the panel gets a screenshot's picture from: the server, by the id the browser uploaded it
+ * under, or the data URL of a picture a thread from before the upload carries inline.
+ */
+export type AssistantScreenshotPicture = {
+    readonly kind: 'stored';
+    readonly imageId: string;
+} | {
+    readonly kind: 'inline';
+    readonly src: string;
+};
+/** A screenshot a `query` or `apply` call took, as the panel shows it. */
+export interface AssistantToolScreenshot {
+    /** The label the call's `image` field returned, such as `Cabinet-2/doorLayout#2`. */
+    readonly label: string;
+    readonly picture: AssistantScreenshotPicture;
+}
+/**
+ * The screenshots of a tool result: the image parts that follow the result's JSON, each after the
+ * text part with its label. A result without them, such as plain JSON or an error, has none.
+ */
+export declare const readToolScreenshots: (result: unknown) => readonly AssistantToolScreenshot[];

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

@@ -0,0 +1 @@
+import{z as t}from"zod";import{readAssistantImageReference as e}from"@salsita-ai/contracts/assistant";let a=t.object({type:t.literal("text"),content:t.string()}),r=t.object({type:t.literal("image"),source:t.discriminatedUnion("type",[t.object({type:t.literal("url"),value:t.string()}),t.object({type:t.literal("data"),value:t.string(),mimeType:t.string()})])}),s=/^[^/]+\/[^#]+(?:#\d+)?$/;export const readToolScreenshots=t=>Array.isArray(t)?t.slice(1).flatMap((t,l,i)=>{let n=r.safeParse(t),o=a.safeParse(i[l-1]),c=n.success?(({source:t})=>{if("data"===t.type)return{kind:"inline",src:`data:${t.mimeType};base64,${t.value}`};let a=e(t.value);return null===a?null:{kind:"stored",imageId:a}})(n.data):null;return c&&o.success&&s.test(o.data.content)?[{label:o.data.content,picture:c}]:[]}):[];

package/dist/configurator/ui/assistant/screenshots/use-screenshot-src.d.ts

@@ -0,0 +1,8 @@
+import type { AssistantScreenshotPicture } from './tool-screenshots.js';
+/**
+ * The `src` of a screenshot's picture: the data URL of an inline one at once, and for an uploaded
+ * one the object URL the assistant system reads it into, once it has been read; `undefined` until
+ * then and when the read fails. Only the open popover of a call's screenshots calls it, so nothing
+ * is read while the popover is closed.
+ */
+export declare const useScreenshotSrc: (picture: AssistantScreenshotPicture) => string | undefined;

package/dist/configurator/ui/assistant/screenshots/use-screenshot-src.js

@@ -0,0 +1 @@
+import{useEffect as r,useState as e}from"react";import{useConfigurator as n}from"../../../application-runtime/index.js";export const useScreenshotSrc=t=>{let{assistantSystem:i}=n(),o="stored"===t.kind?t.imageId:null,[l,d]=e();return(r(()=>{if(null===o)return;let r=!0;return i.loadScreenshotUrl(o).then(e=>{r&&d({imageId:o,src:e})},()=>void 0),()=>{r=!1}},[i,o]),"inline"===t.kind)?t.src:l?.imageId===o?l.src:void 0};

package/dist/configurator/ui/assistant/streamed-markdown.d.ts

@@ -2,7 +2,7 @@
 export declare const hasOpenFence: (text: string) => boolean;
 /**
  * Makes the Markdown of a reply that is still streaming renderable as it stands, so half-written
- * markup does not flash as raw characters: an open code fence is closed, an inline code span, a link
- * or a table header the model has not finished is held back, and open bold text is closed.
+ * markup does not flash as raw characters: an open code fence is closed, an inline code span, a link,
+ * an alert marker or a table header the model has not finished is held back, and open bold text is closed.
  */
 export declare const completeStreamedMarkdown: (text: string) => string;

package/dist/configurator/ui/assistant/streamed-markdown.js

@@ -1,2 +1,2 @@
-let e=(e,t)=>e.split(t).length-1,t=/^\|?\s*:?-+:?\s*(\|\s*:?-+:?\s*)*\|?\s*$/;export const hasOpenFence=t=>e(t,"```")%2==1;export const completeStreamedMarkdown=n=>{if(hasOpenFence(n))return`${n}
-\`\`\``;let l=n.lastIndexOf("```"),s=-1===l?"":n.slice(0,l+3),r=n.slice(s.length),c=(e=>{let n=e.split("\n"),l=n.length;for(;l>0&&n[l-1]?.trimStart().startsWith("|");)l-=1;let s=n.slice(l),r=s[1],c=null!=r&&s.length>2&&t.test(r);return 0===s.length||c?e:n.slice(0,l).join("\n")})((e(r,"`")%2==1?r.slice(0,r.lastIndexOf("`")):r).replace(/!?\[([^\]\n]*)\]\([^)\n]*$/,"$1").replace(/!?\[[^\]\n]*$/,"")),i=e(c,"**")%2==1?`${c}**`:c;return`${s}${i}`};
+let e=(e,t)=>e.split(t).length-1,t=/^\|?\s*:?-+:?\s*(\|\s*:?-+:?\s*)*\|?\s*$/,l=/(^|\n) {0,3}>[ \t]*\[![a-z]*$/i,n=/(^|\n) {0,3}>[ \t]*\[![a-z]+\][ \t]*$/i;export const hasOpenFence=t=>e(t,"```")%2==1;export const completeStreamedMarkdown=s=>{var r;let a;if(hasOpenFence(s))return`${s}
+\`\`\``;let i=s.lastIndexOf("```"),c=-1===i?"":s.slice(0,i+3),{head:$,marker:h}=(r=s.slice(c.length),null==(a=n.exec(r))?{head:r.replace(l,"$1"),marker:""}:{head:r.slice(0,a.index),marker:r.slice(a.index)}),p=(e=>{let l=e.split("\n"),n=l.length;for(;n>0&&l[n-1]?.trimStart().startsWith("|");)n-=1;let s=l.slice(n),r=s[1],a=null!=r&&s.length>2&&t.test(r);return 0===s.length||a?e:l.slice(0,n).join("\n")})((e($,"`")%2==1?$.slice(0,$.lastIndexOf("`")):$).replace(/!?\[([^\]\n]*)\](?:\([^)\n]*)?$/,"$1").replace(/!?\[[^\]\n]*$/,"")),d=e(p,"**")%2==1?`${p}**`:p;return`${c}${d}${h}`};

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

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

package/dist/configurator/ui/assistant/use-follow-stream.js

@@ -1 +1 @@
-import{useCallback as r,useEffect as e,useLayoutEffect as t,useRef as l,useState as c}from"react";export const useFollowStream=(o,n)=>{let s=l(null),u=l(!0),[i,g]=c(!1),h=r(()=>{let r=s.current;u.current=!0,g(!1),r&&(r.scrollTop=r.scrollHeight)},[]),H=r(()=>{let r=s.current;r&&(u.current=r.scrollHeight-r.scrollTop-r.clientHeight<=24,u.current&&g(!1))},[]);return t(()=>{h()},[n,h]),t(()=>{let r=s.current;r&&(u.current?r.scrollTop=r.scrollHeight:r.scrollHeight>r.clientHeight&&g(!0))},[o]),e(()=>{let r=s.current;if(!r)return;let e=new ResizeObserver(()=>{u.current&&(r.scrollTop=r.scrollHeight)});return e.observe(r),()=>{e.disconnect()}},[]),{scrollerRef:s,hasUnseenContent:i,handleScroll:H,scrollToEnd:h}};
+import{useCallback as e,useEffect as r,useLayoutEffect as t,useRef as l,useState as c}from"react";export const useFollowStream=(o,n)=>{let s=l(null),i=l(!0),[u,g]=c(!1),h=e(()=>{let e=s.current;i.current=!0,g(!1),e&&(e.scrollTop=e.scrollHeight)},[]),H=e(()=>{let e=s.current;e&&(i.current=e.scrollHeight-e.scrollTop-e.clientHeight<=24,i.current&&g(!1))},[]);return t(()=>{h()},[n,h]),t(()=>{let e=s.current;e&&(i.current?e.scrollTop=e.scrollHeight:e.scrollHeight>e.clientHeight&&g(!0))},[o]),r(()=>{let e=s.current;if(!e)return;let r=()=>{i.current&&(e.scrollTop=e.scrollHeight)},t=new ResizeObserver(r);return t.observe(e),e.addEventListener("load",r,!0),()=>{t.disconnect(),e.removeEventListener("load",r,!0)}},[]),{scrollerRef:s,hasUnseenContent:u,handleScroll:H,scrollToEnd:h}};

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

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

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

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

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

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