@salsita-ai/sdk 0.50.0-develop.b7caacb493 → 0.50.0-develop.b929a82a82

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

@@ -1 +1 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Trans as i}from"@lingui/react";import{Button as t,styled as s}from"@mui/material";import{useCallback as r,useMemo as n}from"react";import{match as o}from"ts-pattern";import{useEagerObservableValue as l}from"#package/react-sdk";import{PhxIcon as d}from"#package/ui-sdk";import{useConfigurator as m}from"../../application-runtime/index.js";import{AssistantToolChips as c}from"./AssistantChips.js";import{AssistantMarkdown as h}from"./AssistantMarkdown.js";import{describeAssistantFailure as p}from"./assistant-failure.js";import{EntityLinkSelectionProvider as g,useCreateEntityLinkSelection as u}from"./entity-link/index.js";import{AssistantPanelName as f}from"./theme.js";import{buildEarlierThreadItems as k,buildThreadView as v}from"./thread-items.js";import{useFollowStream as b}from"./use-follow-stream.js";let w=s("div",{name:f,slot:"thread"})({display:"grid",position:"relative"}),x=s("div",{name:f,slot:"messages"})(({theme:{spacing:e,typography:a}})=>({...a.body2,display:"flex",flexDirection:"column",gap:e(1.5),overflowY:"auto",overscrollBehavior:"contain",paddingBlock:e(2),paddingInline:`var(--phx-sidebar-padding, ${e(2)})`,"& > :first-child":{marginBlockStart:"auto"}})),y=s("div",{name:f,slot:"userMessage"})(({theme:{palette:e,spacing:a}})=>({alignSelf:"flex-end",background:`hsl(from ${e.primary.main} h s l / 12%)`,borderRadius:"14px 14px 4px 14px",maxInlineSize:"85%",overflowWrap:"anywhere",paddingBlock:a(1),paddingInline:a(1.5),whiteSpace:"pre-wrap"})),T=s("div",{name:f,slot:"greeting"})({}),C=s("div",{name:f,slot:"status"})(({theme:{palette:e,typography:a}})=>({...a.caption,color:e.text.secondary})),S=s("div",{name:f,slot:"separator"})(({theme:{palette:e,spacing:a,typography:i}})=>({...i.caption,alignItems:"center",color:e.text.secondary,display:"flex",gap:a(1),"&::before, &::after":{borderBlockStart:`1px solid ${e.divider}`,content:'""',flex:1}})),j=s(t,{name:f,slot:"earlierButton"})({alignSelf:"center"}),I=s("div",{name:f,slot:"notice"})(({theme:{palette:e,shape:a,spacing:i}})=>({alignItems:"center",background:e.action.hover,borderRadius:a.borderRadius,display:"flex",flexWrap:"wrap",gap:i(1),justifyContent:"space-between",paddingBlock:i(1),paddingInline:i(1.5)})),B=s(t,{name:f,slot:"newReplyButton"})(({theme:{palette:e,spacing:a}})=>({background:e.text.primary,borderRadius:"calc(infinity * 1px)",color:e.background.paper,insetBlockEnd:a(1),insetInlineStart:"50%",position:"absolute",translate:"-50% 0","&:hover":{background:e.text.secondary}})),E=({item:a,isActive:t,undoableToolCallId:s,onUndo:r})=>o(a).with({kind:"user"},({text:a})=>e(y,{children:a})).with({kind:"text"},({markdown:a,isStreaming:i,forms:t})=>e(h,{markdown:a,isStreaming:i,forms:t})).with({kind:"tools"},({tools:a})=>e(c,{tools:a,isActive:t,canUndo:a.some(({id:e})=>e===s),onUndo:r})).with({kind:"separator"},()=>e(S,{role:"separator",children:e(i,{id:"sdk.assistant.thread.earlierSummarized",message:"Earlier conversation summarized"})})).exhaustive();export const AssistantThread=()=>{let{assistantSystem:s}=m(),c=l(s.chat$),{messages:h,isLoading:f,isResuming:y,earlierThreads:S}=c,A=l(s.undoTipToolCallId$),R=f?void 0:A,{items:L,isThinking:z}=n(()=>v(h,f,y),[h,f,y]),$=n(()=>k(S),[S]),U=n(()=>L.filter(({kind:e})=>"user"===e).length,[L]),D=c.error?p(c.failedStatus):void 0,{scrollerRef:M,hasUnseenContent:W,handleScroll:q,scrollToEnd:H}=b(n(()=>({messages:h,isThinking:z,isResuming:y,failure:D?.kind}),[h,z,y,D?.kind]),U),N=u(),Y=r(e=>{e.target instanceof Element&&e.target.closest('a, button, input, label, select, textarea, [role="button"], [role="tooltip"]')||window.getSelection()?.isCollapsed!==!1&&N.release()},[N]),F=!c.isLoaded&&0===$.length&&!y&&!D;return a(w,{children:[e(g,{selection:N,children:a(x,{ref:M,onScroll:q,onClick:Y,role:"log","aria-live":"polite",children:[c.isLoaded&&0===L.length&&0===$.length&&!f&&!y&&!D&&e(T,{children:e(i,{id:"sdk.assistant.thread.greeting",message:"Hi. I can answer questions about this design and change it with you. Tell me what you need."})}),F&&e(C,{children:e(i,{id:"sdk.assistant.thread.loading",message:"Loading the conversation…"})}),c.isLoadingEarlierThread&&e(C,{children:e(i,{id:"sdk.assistant.thread.loadingEarlier",message:"Loading the earlier conversation…"})}),c.hasEarlierThread&&!c.isLoadingEarlierThread&&e(j,{size:"small",color:"inherit",onClick:s.loadEarlierThread,children:e(i,{id:"sdk.assistant.thread.showEarlier.label",message:"Show earlier conversation"})}),$.map(a=>e(E,{item:a,isActive:!1,undoableToolCallId:R,onUndo:s.undoToolCalls},a.id)),L.map(a=>e(E,{item:a,isActive:f&&a===L.at(-1),undoableToolCallId:R,onUndo:s.undoToolCalls},a.id)),y&&e(C,{children:e(i,{id:"sdk.assistant.thread.resuming",message:"Resuming the conversation…"})}),z&&e(C,{children:e(i,{id:"sdk.assistant.thread.thinking",message:"Thinking…"})}),D&&a(I,{role:"alert",children:[e("span",{children:o(D.kind).with("notAvailable",()=>e(i,{id:"sdk.assistant.failure.notAvailable",message:"The assistant is not available here."})).with("busy",()=>e(i,{id:"sdk.assistant.failure.busy",message:"The assistant is still working on an earlier message."})).with("unavailable",()=>e(i,{id:"sdk.assistant.failure.unavailable",message:"The assistant is unavailable right now."})).exhaustive()}),D.canRetry&&e(t,{size:"small",variant:"outlined",color:"inherit",onClick:s.reloadThread,children:e(i,{id:"sdk.assistant.failure.retry.label",message:"Try again"})})]})]})}),W&&e(B,{size:"small",onClick:H,endIcon:e(d,{name:"CaretDown"}),children:e(i,{id:"sdk.assistant.thread.newReply.label",message:"New reply"})})]})};
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Trans as i}from"@lingui/react";import{Button as s,styled as t}from"@mui/material";import{useCallback as n,useMemo as r,useRef as o}from"react";import{match as l}from"ts-pattern";import{useEagerObservableValue as d,useLocalizable as m}from"#package/react-sdk";import{PhxIcon as h,hoverStyles as g}from"#package/ui-sdk";import{useConfigurator as c}from"../../application-runtime/index.js";import{AssistantActivityRow as p,AssistantToolChips as u}from"./AssistantChips.js";import{AssistantMarkdown as k}from"./AssistantMarkdown.js";import{MessageAnnotations as f}from"./annotation/index.js";import{describeAssistantFailure as b}from"./assistant-failure.js";import{MessageImages as v}from"./attachments/index.js";import{EntityLinkSelectionProvider as x,useCreateEntityLinkSelection as w}from"./entity-link/index.js";import{AssistantPanelName as y}from"./theme.js";import{buildEarlierThreadItems as T,buildThreadView as I}from"./thread-items.js";import{useFollowStream as S}from"./use-follow-stream.js";import{useLoadOlderOnTop as j}from"./use-load-older-on-top.js";let C={id:"sdk.assistant.failure.resting",message:"The assistant needs a break. Try again in {minutes, plural, one {# minute} other {# minutes}}."},B=t("div",{name:y,slot:"thread"})({display:"grid",position:"relative"}),R=t("div",{name:y,slot:"messages"})(({theme:{spacing:e,typography:a}})=>({...a.body2,display:"flex",flexDirection:"column",gap:e(1.5),overflowY:"auto",overscrollBehavior:"contain",paddingBlock:e(2),paddingInline:`var(--phx-sidebar-padding, ${e(2)})`,position:"relative","& > :first-child":{marginBlockStart:"auto"}})),L=t("div",{name:y,slot:"userMessage"})(({theme:{palette:e,spacing:a}})=>({alignSelf:"flex-end",background:`hsl(from ${e.primary.main} h s l / 12%)`,borderRadius:"14px 14px 4px 14px",display:"grid",gap:a(1),maxInlineSize:"85%",overflowWrap:"anywhere",paddingBlock:a(1),paddingInline:a(1.5),whiteSpace:"pre-wrap"})),A=t("div",{name:y,slot:"greeting"})({}),E=t("div",{name:y,slot:"status"})(({theme:{palette:e,typography:a}})=>({...a.caption,color:e.text.secondary})),M=t("div",{name:y,slot:"separator"})(({theme:{palette:e,spacing:a,typography:i}})=>({...i.caption,alignItems:"center",color:e.text.secondary,display:"flex",gap:a(1),"&::before, &::after":{borderBlockStart:`1px solid ${e.divider}`,content:'""',flex:1}})),z=t(s,{name:y,slot:"earlierButton"})({alignSelf:"center"}),O=t("div")({blockSize:1,insetBlockStart:0,insetInline:0,position:"absolute"}),$=t(E)(({theme:{palette:e,shape:a,spacing:i}})=>({background:e.background.paper,borderRadius:a.borderRadius,insetBlockStart:i(1),insetInlineStart:"50%",paddingBlock:i(.5),paddingInline:i(1),position:"absolute",translate:"-50% 0"})),U=t("div",{name:y,slot:"notice"})(({theme:{palette:e,shape:a,spacing:i}})=>({alignItems:"center",background:e.action.hover,borderRadius:a.borderRadius,display:"flex",flexWrap:"wrap",gap:i(1),justifyContent:"space-between",paddingBlock:i(1),paddingInline:i(1.5)})),D=t(s,{name:y,slot:"newReplyButton"})(({theme:{palette:e,spacing:a}})=>({background:e.text.primary,borderRadius:"calc(infinity * 1px)",color:e.background.paper,insetBlockEnd:a(1),insetInlineStart:"50%",position:"absolute",translate:"-50% 0","&:hover":{background:e.text.primary},...g({"&:hover":{background:e.text.secondary}})})),W=({item:s,isActive:t,undoableToolCallId:n,onUndo:r})=>l(s).with({kind:"user"},({text:i,imageIds:s,annotations:t})=>a(L,{children:[(s.length>0||t.length>0)&&e(v,{imageIds:s,children:e(f,{annotations:t})}),i]})).with({kind:"text"},({markdown:a,isStreaming:i,forms:s})=>e(k,{markdown:a,isStreaming:i,forms:s})).with({kind:"tools"},({tools:a})=>e(u,{tools:a,isActive:t,canUndo:a.some(({id:e})=>e===n),onUndo:r})).with({kind:"separator"},()=>e(M,{role:"separator",children:e(i,{id:"sdk.assistant.thread.earlierSummarized",message:"Earlier conversation summarized"})})).exhaustive();export const AssistantThread=()=>{let{assistantSystem:t}=c(),g=d(t.chat$),{messages:u,isLoading:k,isResuming:f,earlierThreads:v}=g,y=d(t.undoTipToolCallId$),L=k?void 0:y,{items:M,isThinking:Y}=r(()=>I(u,k,f),[u,k,f]),q=r(()=>T(v),[v]),H=r(()=>M.filter(({kind:e})=>"user"===e).at(-1)?.id,[M]),K=g.error?b(g.failedStatus,g.retryAfterSeconds):void 0,N=m({...C,values:{minutes:K?.kind==="resting"?K.minutes:0}}),F=u.at(-1),{scrollerRef:G,hasUnseenContent:J,handleScroll:P,scrollToEnd:Q}=S(r(()=>({newestMessage:F,isThinking:Y,isResuming:f,failure:K?.kind}),[F,Y,f,K?.kind]),H),V=o(null);j(G,V,{enabled:g.hasOlderMessages&&!g.isLoadingOlderMessages,onReachTop:t.loadOlderMessages,firstItemKey:u[0]?.id});let X=null!==g.earlierThreadId&&!g.hasOlderMessages&&!g.isLoadingEarlierThread,Z=w(),_=n(e=>{e.target instanceof Element&&e.target.closest('a, button, input, label, select, textarea, [role="button"], [role="tooltip"]')||window.getSelection()?.isCollapsed!==!1&&Z.release()},[Z]),ee=!g.isLoaded&&0===q.length&&!f&&!K;return a(B,{children:[e(x,{selection:Z,children:a(R,{ref:G,onScroll:P,onClick:_,role:"log","aria-live":"polite",children:[g.isLoaded&&0===M.length&&0===q.length&&!k&&!f&&!K&&e(A,{children:e(i,{id:"sdk.assistant.thread.greeting",message:"Hi. I can answer questions about this design and change it with you. Tell me what you need."})}),ee&&e(E,{children:e(i,{id:"sdk.assistant.thread.loading",message:"Loading the conversation…"})}),g.isLoadingEarlierThread&&e(E,{children:e(i,{id:"sdk.assistant.thread.loadingEarlier",message:"Loading the earlier conversation…"})}),X&&e(z,{size:"small",color:"inherit",onClick:t.loadEarlierThread,children:e(i,{id:"sdk.assistant.thread.showEarlier.label",message:"Show earlier conversation"})}),q.map(a=>e(W,{item:a,isActive:!1,undoableToolCallId:L,onUndo:t.undoToolCalls},a.id)),M.map(a=>e(W,{item:a,isActive:k&&a===M.at(-1),undoableToolCallId:L,onUndo:t.undoToolCalls},a.id)),f&&e(E,{children:e(i,{id:"sdk.assistant.thread.resuming",message:"Resuming the conversation…"})}),Y&&e(p,{label:e(i,{id:"sdk.assistant.thread.thinking",message:"Thinking…"})}),K&&a(U,{role:"alert",children:[e("span",{children:l(K.kind).with("notAvailable",()=>e(i,{id:"sdk.assistant.failure.notAvailable",message:"The assistant is not available here."})).with("busy",()=>e(i,{id:"sdk.assistant.failure.busy",message:"The assistant is still working on an earlier message."})).with("resting",()=>N).with("exhausted",()=>e(i,{id:"sdk.assistant.failure.exhausted",message:"The assistant is unavailable right now. You can keep configuring as usual."})).with("unavailable",()=>e(i,{id:"sdk.assistant.failure.unavailable",message:"The assistant is unavailable right now."})).exhaustive()}),K.canRetry&&e(s,{size:"small",variant:"outlined",color:"inherit",onClick:t.reloadThread,children:e(i,{id:"sdk.assistant.failure.retry.label",message:"Try again"})})]}),g.hasOlderMessages&&e(O,{ref:V,"aria-hidden":!0})]})}),g.isLoadingOlderMessages&&e($,{role:"status",children:e(i,{id:"sdk.assistant.thread.loadingOlder",message:"Loading earlier messages…"})}),J&&e(D,{size:"small",onClick:Q,endIcon:e(h,{name:"CaretDown"}),children:e(i,{id:"sdk.assistant.thread.newReply.label",message:"New reply"})})]})};

package/dist/configurator/ui/assistant/alert/AssistantAlert.d.ts

@@ -4,5 +4,8 @@ export interface AssistantAlertProps {
     readonly kind: AlertKind;
     readonly children: ReactNode;
 }
-/** A GitHub alert in a reply: its content as Markdown, marked by the colour and icon of its kind. */
+/**
+ * A GitHub alert in a reply: its content as Markdown, marked by the colour and icon of its kind,
+ * and starting with the word for its kind, which only assistive technology reads.
+ */
 export declare const AssistantAlert: import("react").MemoExoticComponent<({ kind, children }: AssistantAlertProps) => import("react/jsx-runtime").JSX.Element>;

package/dist/configurator/ui/assistant/alert/AssistantAlert.js

@@ -1 +1 @@
-import{jsx as r,jsxs as i}from"react/jsx-runtime";import{alpha as o,styled as t}from"@mui/material";import{memo as n}from"react";import{PhxIcon as a}from"#package/ui-sdk";import{AssistantPanelName as e}from"../theme.js";let l={note:{color:"info",icon:"Info"},tip:{color:"success",icon:"Lightbulb"},important:{color:"primary",icon:"WarningCircle"},warning:{color:"warning",icon:"Warning"},caution:{color:"error",icon:"XCircle"}},c=t("div",{name:e,slot:"alert"})(({theme:{palette:r,shape:i,spacing:t,typography:n}})=>({borderInlineStart:"3px solid",borderRadius:i.borderRadius,display:"grid",gap:t(1),gridTemplateColumns:"min-content minmax(0, 1fr)",marginBlock:t(1),padding:t(1,1.5),...Object.fromEntries(Object.entries(l).map(([i,{color:t}])=>[`&[data-alert="${i}"]`,{background:o(r[t].main,.08),borderInlineStartColor:r[t].main,"& > :first-child":{color:r[t].main}}])),"& > :last-child > :first-child":{marginBlockStart:0},"& > :last-child > :last-child":{marginBlockEnd:0},"& > :first-child":{blockSize:`calc(${n.body2.lineHeight} * 1em)`,display:"grid",placeItems:"center"}}));export const AssistantAlert=n(({kind:o,children:t})=>i(c,{role:"note","data-alert":o,children:[r("span",{children:r(a,{name:l[o].icon})}),r("div",{children:t})]}));
+import{jsx as a,jsxs as i}from"react/jsx-runtime";import{alpha as r,styled as t}from"@mui/material";import{visuallyHidden as e}from"@mui/utils";import{memo as l}from"react";import{useLocalizable as n}from"#package/react-sdk";import{PhxIcon as s}from"#package/ui-sdk";import{AssistantPanelName as o}from"../theme.js";let m={note:{color:"info",icon:"Info",label:{id:"sdk.assistant.alert.note.label",message:"Note"}},tip:{color:"success",icon:"Lightbulb",label:{id:"sdk.assistant.alert.tip.label",message:"Tip"}},important:{color:"primary",icon:"WarningCircle",label:{id:"sdk.assistant.alert.important.label",message:"Important"}},warning:{color:"warning",icon:"Warning",label:{id:"sdk.assistant.alert.warning.label",message:"Warning"}},caution:{color:"error",icon:"XCircle",label:{id:"sdk.assistant.alert.caution.label",message:"Caution"}}},c=t("div",{name:o,slot:"alert"})(({theme:{palette:a,shape:i,spacing:t,typography:e}})=>({borderInlineStart:"3px solid",borderRadius:i.borderRadius,display:"grid",gap:t(1),gridTemplateColumns:"min-content minmax(0, 1fr)",marginBlock:t(1),padding:t(1,1.5),...Object.fromEntries(Object.entries(m).map(([i,{color:t}])=>[`&[data-alert="${i}"]`,{background:r(a[t].main,.08),borderInlineStartColor:a[t].main,"& > :first-child":{color:a[t].main}}])),"& > :last-child > :first-child":{marginBlockStart:0},"& > :last-child > :last-child":{marginBlockEnd:0},"& > :first-child":{blockSize:`calc(${e.body2.lineHeight} * 1em)`,display:"grid",placeItems:"center"}}));export const AssistantAlert=l(({kind:r,children:t})=>{let{icon:l,label:o}=m[r],d=n(o);return i(c,{role:"note","data-alert":r,children:[i("span",{children:[a(s,{name:l}),a("span",{style:e,children:d})]}),a("div",{children:t})]})});

package/dist/configurator/ui/assistant/annotation/AnnotationBadge.d.ts

@@ -0,0 +1,9 @@
+interface AnnotationBadgeProps {
+    readonly count: number;
+}
+/**
+ * Tells on a thumbnail of an annotation how many comments it has: a comment icon and their number. An
+ * annotation without comments gets none; its strokes are on the picture.
+ */
+export declare const AnnotationBadge: ({ count }: AnnotationBadgeProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/configurator/ui/assistant/annotation/AnnotationBadge.js

@@ -0,0 +1 @@
+import{jsx as t,jsxs as n}from"react/jsx-runtime";import{styled as e}from"@mui/material";import{useLocalizable as o}from"#package/react-sdk";import{PhxIcon as a}from"#package/ui-sdk";import{AssistantPanelName as i}from"../theme.js";let r={id:"sdk.assistant.annotation.badge.label",message:"{count, plural, =0 {Annotation} one {Annotation with # comment} other {Annotation with # comments}}"},s=e("span",{name:i,slot:"annotationBadge"})(({theme:{typography:t}})=>({...t.caption,alignItems:"center",background:"rgb(0 0 0 / 60%)",borderRadius:6,color:"#fff",display:"inline-flex",fontSize:13,fontWeight:600,gap:3,insetBlockEnd:3,insetInlineStart:3,letterSpacing:0,lineHeight:1,padding:"3px 5px 3px 4px",pointerEvents:"none",position:"absolute"}));export const AnnotationBadge=({count:e})=>{let i=o({...r,values:{count:e}});return 0===e?null:n(s,{role:"img","aria-label":i,children:[t(a,{name:"ChatCircleText",sx:{fontSize:16}}),e]})};

package/dist/configurator/ui/assistant/annotation/AnnotationOverlay.d.ts

@@ -0,0 +1,6 @@
+/**
+ * What covers the configurator for an annotation of the assistant chat, rendered by a layout that
+ * hosts annotations next to its inert root; see `AnnotationHostContext`. Nothing shows while the view
+ * glides.
+ */
+export declare const AnnotationOverlay: () => import("react/jsx-runtime").JSX.Element | null;

package/dist/configurator/ui/assistant/annotation/AnnotationOverlay.js

@@ -0,0 +1 @@
+import{jsx as t}from"react/jsx-runtime";import{match as i}from"ts-pattern";import{useEagerObservableValue as o}from"#package/react-sdk";import{useConfigurator as r}from"../../../application-runtime/index.js";import{AnnotationViewer as e}from"./AnnotationViewer.js";import{AnnotationEditor as n}from"./editor/index.js";export const AnnotationOverlay=()=>{let{assistantSystem:a}=r();return i(o(a.annotationOverlay$)).with({kind:"editor"},({view:i,finish:o})=>t(n,{view:i,finish:o},"editor")).with({kind:"viewer"},({annotation:i,close:o})=>t(e,{annotation:i,close:o},i.imageId)).otherwise(()=>null)};

package/dist/configurator/ui/assistant/annotation/AnnotationPin.d.ts

@@ -0,0 +1,14 @@
+import type { AssistantAnnotationPin } from '@salsita-ai/contracts/assistant';
+interface AnnotationPinProps {
+    readonly pin: AssistantAnnotationPin;
+    /** Its position among the pins, from 0; it is numbered from 1. */
+    readonly index: number;
+    /** `badge` draws the numbered badge; `target` lies clear over a badge drawn in the image. */
+    readonly variant: 'badge' | 'target';
+    /** True while its comment is edited next to it, so hovering it does not repeat the comment. */
+    readonly isEdited?: boolean;
+    readonly onClick?: () => void;
+}
+/** A pin on an annotation surface: its comment shows on hover, focus or tap. */
+export declare const AnnotationPin: ({ pin: { x, y, comment }, index, variant, isEdited, onClick, }: AnnotationPinProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/annotation/AnnotationPin.js

@@ -0,0 +1 @@
+import{jsx as t}from"react/jsx-runtime";import{Tooltip as a}from"@mui/material";import{useLocalizable as n}from"#package/react-sdk";import{AnnotationPinButton as e}from"./annotation-layout.js";let o={id:"sdk.assistant.annotation.pin.label",message:"Comment {number}"};export const AnnotationPin=({pin:{x:r,y:i,comment:l},index:s,variant:m,isEdited:p=!1,onClick:c})=>{let d=s+1;return t(a,{title:p?"":l,enterTouchDelay:0,placement:"top",arrow:!0,children:t(e,{"data-variant":m,"aria-label":n({...o,values:{number:d}}),style:{insetInlineStart:`${100*r}%`,insetBlockStart:`${100*i}%`},onPointerDown:t=>t.stopPropagation(),onClick:c,children:"badge"===m&&d})})};

package/dist/configurator/ui/assistant/annotation/AnnotationViewer.d.ts

@@ -0,0 +1,12 @@
+import type { AssistantMessageAnnotation } from '@salsita-ai/contracts/assistant';
+interface AnnotationViewerProps {
+    readonly annotation: AssistantMessageAnnotation;
+    readonly close: () => void;
+}
+/**
+ * An annotation of a sent message over the configurator, read-only: its flattened image, with a
+ * target over each drawn pin badge that shows its comment on hover or tap. Close, or Escape, fades it
+ * out.
+ */
+export declare const AnnotationViewer: ({ annotation, close }: AnnotationViewerProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/annotation/AnnotationViewer.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Trans as i}from"@lingui/react";import{Button as r}from"@mui/material";import{useCallback as n,useEffect as a,useMemo as o,useRef as s,useState as d}from"react";import{useLocalizable as m}from"#package/react-sdk";import{useScreenshotSrc as l}from"../screenshots/index.js";import{AnnotationPin as c}from"./AnnotationPin.js";import{ANNOTATION_FADE_DURATION as u,AnnotationRoot as p,AnnotationStage as g,AnnotationSurface as h,AnnotationToolbar as f,annotationSurfaceSize as k}from"./annotation-layout.js";import{prefersReducedMotion as w}from"./prefers-reduced-motion.js";import{useEndOnUnmount as v}from"./use-end-on-unmount.js";let j={id:"sdk.assistant.annotation.viewer.label",message:"Annotation"};export const AnnotationViewer=({annotation:x,close:y})=>{let b=l(o(()=>({kind:"stored",imageId:x.imageId}),[x.imageId])),[T,A]=d(),[E,I]=d(!1),L=s(y),z=m(j);L.current=y,v(()=>L.current());let C=n(()=>{I(!0),setTimeout(()=>L.current(),w()?0:u)},[]);return a(()=>{let e=e=>{"Escape"===e.key&&C()};return window.addEventListener("keydown",e),()=>window.removeEventListener("keydown",e)},[C]),t(p,{role:"dialog","aria-modal":"true","aria-label":z,"data-leaving":E,children:[e(g,{children:void 0!==b&&t(h,{sx:T?k(T.width,T.height):{visibility:"hidden"},children:[e("img",{src:b,alt:"",style:{display:"block",inlineSize:"100%",blockSize:"100%"},onLoad:e=>A({width:e.currentTarget.naturalWidth,height:e.currentTarget.naturalHeight})}),x.pins.map((t,i)=>e(c,{pin:t,index:i,variant:"target"},i))]})}),e(f,{children:e(r,{variant:"contained",autoFocus:!0,onClick:C,children:e(i,{id:"sdk.assistant.annotation.close",message:"Close"})})})]})};

package/dist/configurator/ui/assistant/annotation/MessageAnnotations.d.ts

@@ -0,0 +1,11 @@
+import type { AssistantMessageAnnotation } from '@salsita-ai/contracts/assistant';
+interface MessageAnnotationsProps {
+    readonly annotations: readonly AssistantMessageAnnotation[];
+}
+/**
+ * The annotations a user attached to a message, as thumbnails with their comment count among the
+ * message's images. In a layout that hosts the annotation overlay, a click opens one over the
+ * configurator, read-only; elsewhere the thumbnail is all there is.
+ */
+export declare const MessageAnnotations: ({ annotations }: MessageAnnotationsProps) => import("react/jsx-runtime").JSX.Element[];
+export {};

package/dist/configurator/ui/assistant/annotation/MessageAnnotations.js

@@ -0,0 +1 @@
+import{jsx as t,jsxs as o}from"react/jsx-runtime";import{useContext as n,useMemo as a}from"react";import{useLocalizable as i}from"#package/react-sdk";import{useConfigurator as e}from"../../../application-runtime/index.js";import{MessageThumbnail as s,MessageThumbnailPicture as r}from"../attachments/index.js";import{useScreenshotSrc as m}from"../screenshots/index.js";import{AnnotationBadge as d}from"./AnnotationBadge.js";import{AnnotationHostContext as p}from"./annotation-host-context.js";let c={id:"sdk.assistant.message.annotation.open",message:"Show the annotation"},g=({annotation:g})=>{let{assistantSystem:l}=e(),f=m(a(()=>({kind:"stored",imageId:g.imageId}),[g.imageId])),j=i(c),x=n(p);return o(s,{"aria-label":x?j:void 0,disabled:void 0===f||!x,onClick:()=>l.viewAnnotation(g),children:[void 0!==f&&t(r,{src:f,alt:""}),t(d,{count:g.pins.length})]})};export const MessageAnnotations=({annotations:o})=>o.map(o=>t(g,{annotation:o},o.imageId));

package/dist/configurator/ui/assistant/annotation/annotation-host-context.d.ts

@@ -0,0 +1,5 @@
+/**
+ * True inside a layout that renders `AnnotationOverlay` and goes inert while an annotation is shown.
+ * The composer offers Annotate only there.
+ */
+export declare const AnnotationHostContext: import("react").Context<boolean>;

package/dist/configurator/ui/assistant/annotation/annotation-host-context.js

@@ -0,0 +1 @@
+import{createContext as t}from"react";export const AnnotationHostContext=t(!1);

package/dist/configurator/ui/assistant/annotation/annotation-layout.d.ts

@@ -0,0 +1,26 @@
+/** The red of marker strokes and pin badges. */
+export declare const ANNOTATION_COLOR = "#e53935";
+/** CSS px on screen; the flattened image scales it with the view. */
+export declare const ANNOTATION_STROKE_WIDTH = 4;
+/** CSS px on screen; the diameter of a pin's numbered badge. */
+export declare const ANNOTATION_PIN_SIZE = 26;
+/** ms; how long the overlay takes to fade in and out. */
+export declare const ANNOTATION_FADE_DURATION = 200;
+export declare const AnnotationRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("react").ClassAttributes<HTMLDivElement> | keyof import("react").HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const AnnotationStage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/** The box of the view: everything on it is placed by fractions of it. */
+export declare const AnnotationSurface: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/** The size of a surface for a view of `width` × `height`: as large as fits the stage, keeping its aspect ratio. */
+export declare const annotationSurfaceSize: (width: number, height: number) => {
+    aspectRatio: string;
+    inlineSize: string;
+};
+export declare const AnnotationPicture: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").CanvasHTMLAttributes<HTMLCanvasElement>, HTMLCanvasElement>, {}>;
+export declare const AnnotationToolbar: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("react").ClassAttributes<HTMLDivElement> | keyof import("react").HTMLAttributes<HTMLDivElement>>, {}>;
+/**
+ * A pin on the surface, centred on its point: in the editor the numbered badge itself, the same as the
+ * flattened image shows; over a sent annotation a clear target over the badge drawn in the image.
+ */
+export declare const AnnotationPinButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonBaseOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent.js").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: import("react").RefObject<HTMLButtonElement> | ((instance: HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}, "LinkComponent" | "TouchRippleProps" | "action" | "centerRipple" | "children" | "className" | "classes" | "disableRipple" | "disableTouchRipple" | "disabled" | "focusRipple" | "focusVisibleClassName" | "onFocusVisible" | "style" | "sx" | "tabIndex" | "touchRippleRef"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/configurator/ui/assistant/annotation/annotation-layout.js

@@ -0,0 +1 @@
+import{ButtonBase as t,keyframes as e,styled as n}from"@mui/material";import{AssistantPanelName as o}from"../theme.js";export const ANNOTATION_COLOR="#e53935";export const ANNOTATION_STROKE_WIDTH=4;export const ANNOTATION_PIN_SIZE=26;export const ANNOTATION_FADE_DURATION=200;let i=e({from:{opacity:0}});export const AnnotationRoot=n("div",{name:o,slot:"annotation"})(({theme:{palette:t,zIndex:e}})=>({animation:`${i} 200ms ease backwards`,background:t.background.default,inset:0,position:"absolute",transition:"opacity 200ms ease",zIndex:e.modal+1,'&[data-leaving="true"]':{opacity:0,pointerEvents:"none"},"@media (prefers-reduced-motion: reduce)":{animation:"none",transition:"none"}}));export const AnnotationStage=n("div")({containerType:"size",display:"grid",inset:0,placeItems:"center",position:"absolute"});export const AnnotationSurface=n("div")({position:"relative",touchAction:"none",userSelect:"none"});export const annotationSurfaceSize=(t,e)=>({aspectRatio:`${t} / ${e}`,inlineSize:`min(100cqw, calc(100cqh * ${t/e}))`});export const AnnotationPicture=n("canvas")({blockSize:"100%",display:"block",inlineSize:"100%",inset:0,position:"absolute"});export const AnnotationToolbar=n("div",{name:o,slot:"annotationToolbar"})(({theme:{palette:t,shadows:e,spacing:n}})=>({alignItems:"center",animation:`${i} 200ms ease 200ms both`,background:t.background.paper,borderRadius:12,boxShadow:e[4],display:"flex",flexWrap:"wrap",gap:n(1),insetBlockEnd:n(2),insetInlineStart:"50%",justifyContent:"center",maxInlineSize:`calc(100% - ${n(4)})`,padding:n(1),position:"absolute",translate:"-50% 0","@media (prefers-reduced-motion: reduce)":{animation:"none"}}));export const AnnotationPinButton=n(t)(({theme:{typography:t}})=>({...t.caption,alignItems:"center",blockSize:26,borderRadius:"50%",boxSizing:"border-box",display:"flex",fontWeight:700,inlineSize:26,justifyContent:"center",letterSpacing:0,lineHeight:1,padding:0,position:"absolute",translate:"-50% -50%",'&[data-variant="badge"]':{background:ANNOTATION_COLOR,border:"2px solid #fff",color:"#fff"},"&:focus-visible":{outline:`2px solid ${ANNOTATION_COLOR}`,outlineOffset:2}}));

package/dist/configurator/ui/assistant/annotation/editor/AnnotationComment.d.ts

@@ -0,0 +1,15 @@
+import type { AnnotationPoint } from './annotation-drawing.js';
+interface AnnotationCommentProps {
+    /** Where its pin is on the view. */
+    readonly point: AnnotationPoint;
+    /** The comment as saved so far; what is typed is the pin's only once it is saved. */
+    readonly comment: string;
+    readonly onDelete: () => void;
+    readonly onSave: (comment: string) => void;
+}
+/**
+ * The comment of a pin, open for editing by the pin: it takes the focus as it opens. Enter saves it and
+ * Shift+Enter adds a line, as in the composer. What is typed stays here until it is saved.
+ */
+export declare const AnnotationComment: ({ point, comment, onDelete, onSave }: AnnotationCommentProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/annotation/editor/AnnotationComment.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Tooltip as n,styled as a}from"@mui/material";import{useCallback as o,useRef as i,useState as l}from"react";import{useLocalizable as r}from"#package/react-sdk";import{PhxIcon as s}from"#package/ui-sdk";import{ComposerField as m,ComposerFrame as c,ComposerInput as p,ComposerPrimaryButton as d,ComposerToolButton as u}from"../../composer/index.js";import{AssistantPanelName as h}from"../../theme.js";let f={id:"sdk.assistant.annotation.comment.placeholder",message:"Add a comment…"},g={id:"sdk.assistant.annotation.comment.delete",message:"Delete"},k={id:"sdk.assistant.annotation.comment.save",message:"Save"},x=a(c,{name:h,slot:"annotationComment"})(({theme:{palette:e,shadows:t}})=>({background:e.background.paper,boxShadow:t[6],inlineSize:"min(280px, 80cqw)",position:"absolute",zIndex:1})),v=a("div")(({theme:{spacing:e}})=>({cursor:"default",display:"flex",gap:e(.5),gridColumn:2}));export const AnnotationComment=({point:a,comment:c,onDelete:h,onSave:C})=>{let[b,S]=l(c),w=i(null),z=r(f),D=r(g),j=r(k),y=o(e=>{e.stopPropagation(),e.target===e.currentTarget&&(e.preventDefault(),w.current?.focus())},[]),E=o(e=>{"Enter"!==e.key||e.shiftKey||e.nativeEvent.isComposing||(e.preventDefault(),C(b))},[b,C]);return t(x,{style:(({x:e,y:t})=>({...e<.5?{insetInlineStart:`${100*e}%`}:{insetInlineEnd:`${(1-e)*100}%`},...t<.5?{insetBlockStart:`calc(${100*t}% + 18px)`}:{insetBlockEnd:`calc(${(1-t)*100}% + 18px)`}}))(a),onPointerDown:e=>e.stopPropagation(),onMouseDown:y,children:[e(m,{children:e(p,{autoFocus:!0,multiline:!0,maxRows:4,placeholder:z,value:b,inputRef:w,inputProps:{"aria-label":z},onChange:e=>S(e.target.value),onKeyDown:E})}),t(v,{children:[e(n,{title:D,placement:"top",children:e(u,{size:"small","aria-label":D,onClick:h,children:e(s,{name:"Trash",fontSize:"small"})})}),e(n,{title:j,placement:"top",children:e(d,{size:"small","aria-label":j,onClick:()=>C(b),children:e(s,{name:"Check",fontSize:"small"})})})]})]})};

package/dist/configurator/ui/assistant/annotation/editor/AnnotationEditor.d.ts

@@ -0,0 +1,18 @@
+import type { AssistantAnnotation } from '../../../../application-runtime/index.js';
+interface AnnotationEditorProps {
+    /** The frozen view, at the canvas's resolution. */
+    readonly view: HTMLCanvasElement;
+    /** Ends the editor with what the user made, or with `null` when they cancel. */
+    readonly finish: (annotation: AssistantAnnotation | null) => void;
+}
+/**
+ * The editor over the configurator: the frozen view, which cannot be moved or zoomed. Marker draws
+ * red strokes; Comment places a numbered pin where the user clicks and opens its comment, and opens
+ * the comment of a pin clicked again, with Delete. Hovering or tapping a pin shows its comment.
+ *
+ * Done drops the pins without a comment and flattens the strokes and the pin badges onto the view; it
+ * does nothing while there is nothing on it. Cancel, or Escape, ends it with nothing. Either way it
+ * fades out first. An editor that goes away before it ended ends as cancelled.
+ */
+export declare const AnnotationEditor: ({ view, finish }: AnnotationEditorProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/annotation/editor/AnnotationEditor.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as n}from"react/jsx-runtime";import{Trans as t}from"@lingui/react";import{Button as r,ToggleButton as i,ToggleButtonGroup as o}from"@mui/material";import{useCallback as a,useEffect as l,useLayoutEffect as s,useRef as m,useState as c}from"react";import{useLocalizable as d}from"#package/react-sdk";import{PhxIcon as u}from"#package/ui-sdk";import{AnnotationPin as p}from"../AnnotationPin.js";import{ANNOTATION_FADE_DURATION as h,ANNOTATION_STROKE_WIDTH as g,AnnotationPicture as f,AnnotationRoot as w,AnnotationStage as v,AnnotationSurface as k,AnnotationToolbar as x,annotationSurfaceSize as C}from"../annotation-layout.js";import{prefersReducedMotion as j}from"../prefers-reduced-motion.js";import{useEndOnUnmount as P}from"../use-end-on-unmount.js";import{AnnotationComment as y}from"./AnnotationComment.js";import{drawAnnotationStrokes as I}from"./annotation-drawing.js";import{annotationPointIn as b,closeAnnotationPin as E,createAnnotationPin as T,deleteAnnotationPin as D,keptAnnotationPins as M,replaceAnnotationPin as z}from"./annotation-pins.js";import{flattenAnnotation as A}from"./flatten-annotation.js";let R={id:"sdk.assistant.annotation.label",message:"Annotate the view"},S=(e,n)=>b(n.getBoundingClientRect(),e.clientX,e.clientY);export const AnnotationEditor=({view:b,finish:L})=>{let[O,W]=c("marker"),[B,F]=c([]),[H,U]=c([]),[X,Y]=c(null),[q,G]=c(!1),J=m(null),K=m(null),N=m(null),Q=m(null),V=m(!1),Z=m(L);Z.current=L;let $=d(R),_=B.length>0||M(H).length>0;P(()=>Z.current(null)),s(()=>{K.current?.getContext("2d")?.drawImage(b,0,0)},[b]);let ee=a(()=>{let e,n,t,r=N.current,i=r?.getContext("2d");if(!r||!i)return;let{width:o,height:a,ratio:l}=(e=globalThis.devicePixelRatio||1,n=Math.round(r.clientWidth*e),t=Math.round(r.clientHeight*e),(r.width!==n||r.height!==t)&&(r.width=n,r.height=t),{width:n,height:t,ratio:e}),s=Q.current;i.clearRect(0,0,o,a),I(i,s?[...B,s.points]:B,{width:o,height:a},g*l)},[B]);s(()=>{ee();let e=J.current;if(!e)return;let n=new ResizeObserver(ee);return n.observe(e),()=>n.disconnect()},[ee]);let en=a(async e=>{if(V.current)return;V.current=!0,G(!0);let[n]=await Promise.all([e(),new Promise(e=>setTimeout(e,j()?0:h))]);Z.current(n)},[]),et=a(()=>void en(async()=>null),[en]),er=a(()=>{let e=J.current;if(!_||!e)return;let n=M(H),t=b.width/e.clientWidth;en(async()=>{try{return{blob:await A({view:b,strokes:B,pins:n,scale:t}),pins:n}}catch{return null}})},[_,en,H,B,b]),ei=a(()=>{X&&U(e=>E(e,X)),Y(null)},[X]),eo=a(e=>{if(X){let n={...X,comment:e.trim()};U(e=>E(z(e,X,n),n))}Y(null)},[X]),ea=a(()=>{X&&U(e=>D(e,X)),Y(null)},[X]),el=a(e=>{e!==X&&(ei(),Y(e))},[ei,X]);l(()=>{let e=e=>{"Escape"!==e.key||e.isComposing||(X?ei():et())};return window.addEventListener("keydown",e),()=>window.removeEventListener("keydown",e)},[ei,X,et]);let es=a(e=>{if(Q.current||!e.isPrimary)return;let n=S(e,e.currentTarget);if("comment"===O){if(X)ei();else{let e=T(n);U(n=>[...n,e]),Y(e)}return}e.currentTarget.setPointerCapture(e.pointerId),Q.current={pointerId:e.pointerId,points:[n]}},[ei,X,O]),em=a(e=>{let n=Q.current;n?.pointerId===e.pointerId&&(n.points.push(S(e,e.currentTarget)),ee())},[ee]),ec=a(e=>{let n=Q.current;n?.pointerId===e.pointerId&&(Q.current=null,F(e=>[...e,n.points]))},[]);return n(w,{role:"dialog","aria-modal":"true","aria-label":$,"data-leaving":q,children:[e(v,{children:n(k,{ref:J,sx:{...C(b.width,b.height),cursor:"comment"===O?"copy":"crosshair"},onPointerDown:es,onMouseDown:e=>"comment"===O&&e.preventDefault(),onPointerMove:em,onPointerUp:ec,onPointerCancel:ec,children:[e(f,{ref:K,width:b.width,height:b.height}),e(f,{ref:N}),H.map((n,t)=>e(p,{pin:n,index:t,variant:"badge",isEdited:n===X,onClick:"comment"===O?()=>el(n):void 0},t)),X&&e(y,{point:X,comment:X.comment,onDelete:ea,onSave:eo},H.indexOf(X))]})}),n(x,{children:[n(o,{exclusive:!0,size:"small",value:O,onChange:(e,n)=>{n&&(W(n),ei())},children:[n(i,{value:"marker",autoFocus:!0,children:[e(u,{name:"PencilSimpleLine",fontSize:"small",sx:{marginInlineEnd:.5}}),e(t,{id:"sdk.assistant.annotation.marker",message:"Marker"})]}),n(i,{value:"comment",children:[e(u,{name:"ChatCircleText",fontSize:"small",sx:{marginInlineEnd:.5}}),e(t,{id:"sdk.assistant.annotation.comment",message:"Comment"})]})]}),e(r,{variant:"text",onClick:et,children:e(t,{id:"sdk.assistant.annotation.cancel",message:"Cancel"})}),e(r,{variant:"contained",disabled:!_,onClick:er,children:e(t,{id:"sdk.assistant.annotation.done",message:"Done"})})]})]})};

package/dist/configurator/ui/assistant/annotation/editor/annotation-drawing.d.ts

@@ -0,0 +1,22 @@
+/** A point on the annotated view, as fractions 0–1 of its width and height from its top left corner. */
+export interface AnnotationPoint {
+    readonly x: number;
+    readonly y: number;
+}
+/** A marker stroke, as the points the pointer passed through. */
+export type AnnotationStroke = ReadonlyArray<AnnotationPoint>;
+interface Size {
+    readonly width: number;
+    readonly height: number;
+}
+/** Draws the strokes onto a 2D context of `size`, `lineWidth` in that context's pixels. */
+export declare const drawAnnotationStrokes: (context: CanvasRenderingContext2D, strokes: ReadonlyArray<AnnotationStroke>, { width, height }: Size, lineWidth: number) => void;
+/**
+ * Draws the numbered badge of a pin centred on `center`, `size` across in the context's pixels: the
+ * same red disc with a white ring and a white number as the editor shows over the view.
+ */
+export declare const drawAnnotationPinBadge: (context: CanvasRenderingContext2D, number: number, center: {
+    readonly x: number;
+    readonly y: number;
+}, size: number) => void;
+export {};

package/dist/configurator/ui/assistant/annotation/editor/annotation-drawing.js

@@ -0,0 +1 @@
+import{ANNOTATION_COLOR as t}from"../annotation-layout.js";export const drawAnnotationStrokes=(e,n,{width:o,height:i},l)=>{for(let f of(e.strokeStyle=t,e.fillStyle=t,e.lineWidth=l,e.lineCap="round",e.lineJoin="round",n)){let[t,...n]=f;if(void 0!==t){if(0===n.length){e.beginPath(),e.arc(t.x*o,t.y*i,l/2,0,2*Math.PI),e.fill();continue}for(let l of(e.beginPath(),e.moveTo(t.x*o,t.y*i),n))e.lineTo(l.x*o,l.y*i);e.stroke()}}};export const drawAnnotationPinBadge=(e,n,o,i)=>{e.beginPath(),e.arc(o.x,o.y,i/2,0,2*Math.PI),e.fillStyle=t,e.fill(),e.lineWidth=i/13,e.strokeStyle="#fff",e.stroke(),e.fillStyle="#fff",e.font=`bold ${Math.round(.5*i)}px system-ui, sans-serif`,e.textAlign="center",e.textBaseline="middle",e.fillText(String(n),o.x,o.y)};

package/dist/configurator/ui/assistant/annotation/editor/annotation-pins.d.ts

@@ -0,0 +1,22 @@
+import type { AssistantAnnotationPin } from '@salsita-ai/contracts/assistant';
+import type { AnnotationPoint } from './annotation-drawing.js';
+/**
+ * The pins of an annotation being edited. A pin's number is its position, from 1, so deleting one
+ * renumbers the pins after it.
+ */
+export type AnnotationPins = ReadonlyArray<AssistantAnnotationPin>;
+/** A pin placed at `point`, with no comment yet. */
+export declare const createAnnotationPin: ({ x, y }: AnnotationPoint) => AssistantAnnotationPin;
+export declare const replaceAnnotationPin: (pins: AnnotationPins, pin: AssistantAnnotationPin, replacement: AssistantAnnotationPin) => AnnotationPins;
+export declare const deleteAnnotationPin: (pins: AnnotationPins, pin: AssistantAnnotationPin) => AnnotationPins;
+/** The pins once the comment of `pin` closes: no pin is left without a comment, so a pin with none goes. */
+export declare const closeAnnotationPin: (pins: AnnotationPins, pin: AssistantAnnotationPin) => AnnotationPins;
+/** The pins an annotation keeps once it is done: those with a comment, renumbered, their comments trimmed. */
+export declare const keptAnnotationPins: (pins: AnnotationPins) => AnnotationPins;
+/** Where a point of the page is on a box, as fractions of it, kept within it. */
+export declare const annotationPointIn: (box: {
+    readonly left: number;
+    readonly top: number;
+    readonly width: number;
+    readonly height: number;
+}, clientX: number, clientY: number) => AnnotationPoint;

package/dist/configurator/ui/assistant/annotation/editor/annotation-pins.js

@@ -0,0 +1 @@
+export const createAnnotationPin=({x:t,y:n})=>({x:t,y:n,comment:""});export const replaceAnnotationPin=(t,n,o)=>t.map(t=>t===n?o:t);export const deleteAnnotationPin=(t,n)=>t.filter(t=>t!==n);export const closeAnnotationPin=(t,n)=>n.comment.trim()?t:deleteAnnotationPin(t,n);export const keptAnnotationPins=t=>t.flatMap(t=>{let n=t.comment.trim();return n?[{...t,comment:n}]:[]});let t=t=>Math.min(1,Math.max(0,t));export const annotationPointIn=(n,o,e)=>({x:t((o-n.left)/n.width),y:t((e-n.top)/n.height)});

package/dist/configurator/ui/assistant/annotation/editor/flatten-annotation.d.ts

@@ -0,0 +1,17 @@
+import type { AssistantAnnotationPin } from '@salsita-ai/contracts/assistant';
+import { type AnnotationStroke } from './annotation-drawing.js';
+interface FlattenAnnotationProps {
+    /** The frozen view, at the canvas's resolution. */
+    readonly view: HTMLCanvasElement;
+    readonly strokes: ReadonlyArray<AnnotationStroke>;
+    readonly pins: ReadonlyArray<AssistantAnnotationPin>;
+    /** Pixels of the view per CSS pixel it was shown at, so strokes and badges keep the size the user saw. */
+    readonly scale: number;
+}
+/**
+ * Flattens the view, the strokes and the numbered pin badges into one JPEG fitted within
+ * {@link ASSISTANT_IMAGE_MAX_SIDE}, like an image the user attaches. They are drawn at the view's
+ * resolution before it is fitted, so a high-DPR view keeps them as sharp as the rest.
+ */
+export declare const flattenAnnotation: ({ view, strokes, pins, scale }: FlattenAnnotationProps) => Promise<Blob>;
+export {};

package/dist/configurator/ui/assistant/annotation/editor/flatten-annotation.js

@@ -0,0 +1 @@
+import{ASSISTANT_IMAGE_MAX_SIDE as t,encodeAssistantImage as n,fitWithin as o}from"../../attachments/index.js";import{ANNOTATION_PIN_SIZE as e,ANNOTATION_STROKE_WIDTH as a}from"../annotation-layout.js";import{drawAnnotationPinBadge as h,drawAnnotationStrokes as i}from"./annotation-drawing.js";export const flattenAnnotation=async({view:r,strokes:d,pins:m,scale:g})=>{let s=document.createElement("canvas"),w={width:r.width,height:r.height};s.width=w.width,s.height=w.height;let c=s.getContext("2d");if(!c)throw Error("The browser gave no 2D canvas to flatten the annotation on.");return c.drawImage(r,0,0),i(c,d,w,a*g),m.forEach(({x:t,y:n},o)=>{h(c,o+1,{x:t*w.width,y:n*w.height},e*g)}),n(s,o(w,t))};

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

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

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

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

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

@@ -0,0 +1,4 @@
+export { AnnotationBadge } from './AnnotationBadge.js';
+export { AnnotationOverlay } from './AnnotationOverlay.js';
+export { MessageAnnotations } from './MessageAnnotations.js';
+export { AnnotationHostContext } from './annotation-host-context.js';

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

@@ -0,0 +1 @@
+export{AnnotationBadge}from"./AnnotationBadge.js";export{AnnotationOverlay}from"./AnnotationOverlay.js";export{MessageAnnotations}from"./MessageAnnotations.js";export{AnnotationHostContext}from"./annotation-host-context.js";

package/dist/configurator/ui/assistant/annotation/prefers-reduced-motion.d.ts

@@ -0,0 +1,2 @@
+/** True when the user asked the system for less motion: the overlay then appears and goes at once. */
+export declare const prefersReducedMotion: () => boolean;

package/dist/configurator/ui/assistant/annotation/prefers-reduced-motion.js

@@ -0,0 +1 @@
+export const prefersReducedMotion=()=>globalThis.matchMedia?.("(prefers-reduced-motion: reduce)").matches===!0;

package/dist/configurator/ui/assistant/annotation/use-end-on-unmount.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Runs `end` once the component is gone for good, so an overlay that is removed without being closed
+ * still ends. StrictMode unmounts and mounts a component again at once in development, so the end
+ * waits a task and is dropped when the component mounted again meanwhile.
+ */
+export declare const useEndOnUnmount: (end: () => void) => void;

package/dist/configurator/ui/assistant/annotation/use-end-on-unmount.js

@@ -0,0 +1 @@
+import{useEffect as r,useRef as t}from"react";export const useEndOnUnmount=e=>{let n=t(e),u=t(!1);n.current=e,r(()=>(u.current=!0,()=>{u.current=!1,setTimeout(()=>{u.current||n.current()})}),[])};

package/dist/configurator/ui/assistant/assistant-failure.d.ts

@@ -2,17 +2,25 @@
  * What the panel tells the user when the assistant failed:
  * - `notAvailable`: the server refuses this configuration or customer, and asking again will not help
  * - `busy`: the server is still answering an earlier message of this thread
+ * - `resting`: the assistant has used up its hourly allowance, and the message may be sent again later
+ * - `exhausted`: the assistant has used up its monthly allowance, and sending again will not help this month
  * - `unavailable`: anything else, including a dropped connection and a reply that broke off
  */
-export type AssistantFailureKind = 'notAvailable' | 'busy' | 'unavailable';
-export interface AssistantFailure {
-    readonly kind: AssistantFailureKind;
+export type AssistantFailureKind = 'notAvailable' | 'busy' | 'resting' | 'exhausted' | 'unavailable';
+export type AssistantFailure = {
+    readonly kind: Exclude<AssistantFailureKind, 'resting'>;
     /** True when loading the thread again may help, so the panel offers "Try again". */
     readonly canRetry: boolean;
-}
+} | {
+    readonly kind: 'resting';
+    readonly canRetry: false;
+    /** How long until the message may be sent again, rounded up to whole minutes. */
+    readonly minutes: number;
+};
 /**
  * Maps a failed assistant request to what the panel shows, by the HTTP status the server answered
- * with. A failure without a status never reached the server or broke off mid-reply; it gets the same
- * generic message as an unknown status, because the chat client does not tell those apart.
+ * with and the seconds it asked to wait. A failure without a status never reached the server or broke
+ * off mid-reply; it gets the same generic message as an unknown status, because the chat client does
+ * not tell those apart.
  */
-export declare const describeAssistantFailure: (failedStatus: number | undefined) => AssistantFailure;
+export declare const describeAssistantFailure: (failedStatus: number | undefined, retryAfterSeconds: number | undefined) => AssistantFailure;

package/dist/configurator/ui/assistant/assistant-failure.js

@@ -1 +1 @@
-export const describeAssistantFailure=a=>403===a?{kind:"notAvailable",canRetry:!1}:409===a?{kind:"busy",canRetry:!0}:{kind:"unavailable",canRetry:!0};
+export const describeAssistantFailure=(a,e)=>403===a?{kind:"notAvailable",canRetry:!1}:409===a?{kind:"busy",canRetry:!0}:429===a&&void 0!==e?{kind:"resting",canRetry:!1,minutes:Math.max(1,Math.ceil(e/60))}:429===a?{kind:"exhausted",canRetry:!1}:{kind:"unavailable",canRetry:!0};

package/dist/configurator/ui/assistant/attachments/MessageImages.d.ts

@@ -0,0 +1,19 @@
+import { type ReactNode } from 'react';
+/** A thumbnail of a picture the user attached to a message, as the bubble shows it. */
+export declare const MessageThumbnail: import("@emotion/styled").StyledComponent<Pick<import("@mui/material").ButtonBaseOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent.js").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: import("react").RefObject<HTMLButtonElement> | ((instance: HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}, "LinkComponent" | "TouchRippleProps" | "action" | "centerRipple" | "children" | "className" | "classes" | "disableRipple" | "disableTouchRipple" | "disabled" | "focusRipple" | "focusVisibleClassName" | "onFocusVisible" | "style" | "sx" | "tabIndex" | "touchRippleRef">, "LinkComponent" | "TouchRippleProps" | "about" | "accessKey" | "action" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "autoSave" | "centerRipple" | "children" | "className" | "classes" | "color" | "content" | "contentEditable" | "contextMenu" | "dangerouslySetInnerHTML" | "datatype" | "defaultChecked" | "defaultValue" | "dir" | "disableRipple" | "disableTouchRipple" | "disabled" | "draggable" | "enterKeyHint" | "focusRipple" | "focusVisibleClassName" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "hidden" | "id" | "inlist" | "inputMode" | "is" | "itemID" | "itemProp" | "itemRef" | "itemScope" | "itemType" | "key" | "lang" | "name" | "nonce" | "onAbort" | "onAbortCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAuxClick" | "onAuxClickCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onBlur" | "onBlurCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onChange" | "onChangeCapture" | "onClick" | "onClickCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onContextMenu" | "onContextMenuCapture" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onError" | "onErrorCapture" | "onFocus" | "onFocusCapture" | "onFocusVisible" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onInput" | "onInputCapture" | "onInvalid" | "onInvalidCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onLoad" | "onLoadCapture" | "onLoadStart" | "onLoadStartCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onPaste" | "onPasteCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerMove" | "onPointerMoveCapture" | "onPointerOut" | "onPointerOutCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerUp" | "onPointerUpCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onReset" | "onResetCapture" | "onResize" | "onResizeCapture" | "onScroll" | "onScrollCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onSelect" | "onSelectCapture" | "onStalled" | "onStalledCapture" | "onSubmit" | "onSubmitCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onWheel" | "onWheelCapture" | "prefix" | "property" | "radioGroup" | "ref" | "rel" | "resource" | "results" | "rev" | "role" | "security" | "slot" | "spellCheck" | "style" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "sx" | "tabIndex" | "title" | "touchRippleRef" | "translate" | "type" | "typeof" | "unselectable" | "value" | "vocab"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const MessageThumbnailPicture: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+interface MessageImagesProps {
+    /** The images the user attached to the message, by the ids it references them by. */
+    readonly imageIds: readonly string[];
+    /** More thumbnails of the message, after its images, such as its annotations. */
+    readonly children?: ReactNode;
+}
+/**
+ * The images a user attached to a message, as thumbnails above its text. They are read from the
+ * server as soon as the bubble shows, through the same per-configuration cache as the screenshots;
+ * a click shows one larger in a popover.
+ */
+export declare const MessageImages: ({ imageIds, children }: MessageImagesProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/configurator/ui/assistant/attachments/MessageImages.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as i}from"react/jsx-runtime";import{ButtonBase as r,Popover as a,styled as o}from"@mui/material";import{useCallback as t,useMemo as s,useState as n}from"react";import{useLocalizable as l}from"#package/react-sdk";import{useScreenshotSrc as m}from"../screenshots/index.js";import{AssistantPanelName as d}from"../theme.js";let c={id:"sdk.assistant.message.image.open",message:"Show the attached image larger"},g=o("div",{name:d,slot:"messageImages"})(({theme:{spacing:e}})=>({display:"flex",flexWrap:"wrap",gap:e(.75),justifyContent:"flex-end"}));export const MessageThumbnail=o(r,{name:d,slot:"messageImage"})(({theme:{palette:e,shape:i}})=>({background:e.action.hover,blockSize:64,borderRadius:i.borderRadius,inlineSize:64,overflow:"hidden",position:"relative"}));export const MessageThumbnailPicture=o("img")({blockSize:"100%",display:"block",inlineSize:"100%",objectFit:"cover"});let p=o("img")(({theme:{shape:e}})=>({borderRadius:e.borderRadius,display:"block",maxBlockSize:"70vh",maxInlineSize:"min(80vw, 640px)"})),h=({imageId:i,onOpen:r})=>{let a=m(s(()=>({kind:"stored",imageId:i}),[i])),o=l(c);return e(MessageThumbnail,{"aria-label":o,disabled:void 0===a,onClick:e=>void 0!==a&&r(e,a),children:void 0!==a&&e(MessageThumbnailPicture,{src:a,alt:""})})};export const MessageImages=({imageIds:r,children:o})=>{let[s,l]=n(),m=t((e,i)=>{l({anchor:e.currentTarget,src:i})},[]),d=t(()=>l(void 0),[]);return i(g,{children:[r.map(i=>e(h,{imageId:i,onOpen:m},i)),o,e(a,{open:void 0!==s,anchorEl:s?.anchor,onClose:d,anchorOrigin:{vertical:"bottom",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},slotProps:{paper:{sx:{padding:1}}},children:s&&e(p,{src:s.src,alt:""})})]})};

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

@@ -0,0 +1,2 @@
+export { MessageImages, MessageThumbnail, MessageThumbnailPicture } from './MessageImages.js';
+export { ASSISTANT_IMAGE_MAX_SIDE, encodeAssistantImage, fitWithin, prepareImage } from './prepare-image.js';

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

@@ -0,0 +1 @@
+export{MessageImages,MessageThumbnail,MessageThumbnailPicture}from"./MessageImages.js";export{ASSISTANT_IMAGE_MAX_SIDE,encodeAssistantImage,fitWithin,prepareImage}from"./prepare-image.js";

package/dist/configurator/ui/assistant/attachments/prepare-image.d.ts

@@ -0,0 +1,24 @@
+/**
+ * The longest side, in pixels, of an image the user attaches: the provider fits every image within
+ * 2048 × 2048 before the model reads it, so more would only cost upload time and storage.
+ */
+export declare const ASSISTANT_IMAGE_MAX_SIDE = 2048;
+interface Size {
+    readonly width: number;
+    readonly height: number;
+}
+/** The size that fits within `max` × `max`, keeping the aspect ratio and never enlarging. */
+export declare const fitWithin: ({ width, height }: Size, max: number) => Size;
+/**
+ * Draws `source` at `width` × `height` on a white background and encodes it as JPEG, the way every
+ * image the user sends is uploaded. Rejects when the browser has no 2D canvas or cannot encode.
+ */
+export declare const encodeAssistantImage: (source: CanvasImageSource, { width, height }: Size) => Promise<Blob>;
+/**
+ * Turns an image file the user attaches into what is uploaded: decoded, fitted within
+ * {@link ASSISTANT_IMAGE_MAX_SIDE} on each side and re-encoded as JPEG. Re-encoding drops the
+ * file's metadata, its location included, and fills a transparent background white. Rejects for a
+ * file the browser cannot decode.
+ */
+export declare const prepareImage: (file: Blob) => Promise<Blob>;
+export {};

package/dist/configurator/ui/assistant/attachments/prepare-image.js

@@ -0,0 +1 @@
+export const ASSISTANT_IMAGE_MAX_SIDE=2048;export const fitWithin=({width:e,height:t},a)=>{let r=Math.min(1,a/e,a/t);return{width:Math.max(1,Math.round(e*r)),height:Math.max(1,Math.round(t*r))}};let e=async e=>{let t=URL.createObjectURL(e),a=new Image;a.src=t;try{return await a.decode(),a}finally{URL.revokeObjectURL(t)}};export const encodeAssistantImage=async(e,{width:t,height:a})=>{let r=document.createElement("canvas");r.width=t,r.height=a;let n=r.getContext("2d");if(!n)throw Error("The browser gave no 2D canvas to prepare the attached image on.");return n.fillStyle="#fff",n.fillRect(0,0,t,a),n.drawImage(e,0,0,t,a),new Promise((e,t)=>{r.toBlob(a=>a?e(a):t(Error("The browser could not encode the attached image as JPEG.")),"image/jpeg",.85)})};export const prepareImage=async t=>{let a=await e(t);return encodeAssistantImage(a,fitWithin({width:a.naturalWidth,height:a.naturalHeight},2048))};

package/dist/configurator/ui/assistant/composer/composer-frame.d.ts

@@ -0,0 +1,15 @@
+/**
+ * The box that looks like the input, of the composer and of an annotation comment: the input on top across its
+ * whole width, so the buttons take none of it from a long text, and a thin row of buttons below. A click on its
+ * empty space is meant to type into the input.
+ */
+export declare const ComposerFrame: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("react").ClassAttributes<HTMLDivElement> | keyof import("react").HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ComposerToolButton: import("@emotion/styled").StyledComponent<Pick<import("@mui/material").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent.js").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: import("react").RefObject<HTMLButtonElement> | ((instance: HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}, "LinkComponent" | "TouchRippleProps" | "action" | "centerRipple" | "children" | "className" | "classes" | "color" | "disableFocusRipple" | "disableRipple" | "disableTouchRipple" | "disabled" | "edge" | "focusRipple" | "focusVisibleClassName" | "onFocusVisible" | "size" | "style" | "sx" | "tabIndex" | "touchRippleRef" | "variant">, "LinkComponent" | "TouchRippleProps" | "about" | "accessKey" | "action" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "autoSave" | "centerRipple" | "children" | "className" | "classes" | "color" | "content" | "contentEditable" | "contextMenu" | "dangerouslySetInnerHTML" | "datatype" | "defaultChecked" | "defaultValue" | "dir" | "disableFocusRipple" | "disableRipple" | "disableTouchRipple" | "disabled" | "draggable" | "edge" | "enterKeyHint" | "focusRipple" | "focusVisibleClassName" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "hidden" | "id" | "inlist" | "inputMode" | "is" | "itemID" | "itemProp" | "itemRef" | "itemScope" | "itemType" | "key" | "lang" | "name" | "nonce" | "onAbort" | "onAbortCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAuxClick" | "onAuxClickCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onBlur" | "onBlurCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onChange" | "onChangeCapture" | "onClick" | "onClickCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onContextMenu" | "onContextMenuCapture" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onError" | "onErrorCapture" | "onFocus" | "onFocusCapture" | "onFocusVisible" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onInput" | "onInputCapture" | "onInvalid" | "onInvalidCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onLoad" | "onLoadCapture" | "onLoadStart" | "onLoadStartCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onPaste" | "onPasteCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerMove" | "onPointerMoveCapture" | "onPointerOut" | "onPointerOutCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerUp" | "onPointerUpCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onReset" | "onResetCapture" | "onResize" | "onResizeCapture" | "onScroll" | "onScrollCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onSelect" | "onSelectCapture" | "onStalled" | "onStalledCapture" | "onSubmit" | "onSubmitCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onWheel" | "onWheelCapture" | "prefix" | "property" | "radioGroup" | "ref" | "rel" | "resource" | "results" | "rev" | "role" | "security" | "size" | "slot" | "spellCheck" | "style" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "sx" | "tabIndex" | "title" | "touchRippleRef" | "translate" | "type" | "typeof" | "unselectable" | "value" | "variant" | "vocab"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const ComposerField: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ComposerInput: import("@emotion/styled").StyledComponent<Pick<import("@mui/material").InputBaseProps, keyof import("@mui/material").InputBaseProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/** The button that sends what was typed. */
+export declare const ComposerPrimaryButton: import("@emotion/styled").StyledComponent<Pick<import("@mui/material").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent.js").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: import("react").RefObject<HTMLButtonElement> | ((instance: HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}, "LinkComponent" | "TouchRippleProps" | "action" | "centerRipple" | "children" | "className" | "classes" | "color" | "disableFocusRipple" | "disableRipple" | "disableTouchRipple" | "disabled" | "edge" | "focusRipple" | "focusVisibleClassName" | "onFocusVisible" | "size" | "style" | "sx" | "tabIndex" | "touchRippleRef" | "variant">, "LinkComponent" | "TouchRippleProps" | "about" | "accessKey" | "action" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "autoSave" | "centerRipple" | "children" | "className" | "classes" | "color" | "content" | "contentEditable" | "contextMenu" | "dangerouslySetInnerHTML" | "datatype" | "defaultChecked" | "defaultValue" | "dir" | "disableFocusRipple" | "disableRipple" | "disableTouchRipple" | "disabled" | "draggable" | "edge" | "enterKeyHint" | "focusRipple" | "focusVisibleClassName" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "hidden" | "id" | "inlist" | "inputMode" | "is" | "itemID" | "itemProp" | "itemRef" | "itemScope" | "itemType" | "key" | "lang" | "name" | "nonce" | "onAbort" | "onAbortCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAuxClick" | "onAuxClickCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onBlur" | "onBlurCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onChange" | "onChangeCapture" | "onClick" | "onClickCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onContextMenu" | "onContextMenuCapture" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onError" | "onErrorCapture" | "onFocus" | "onFocusCapture" | "onFocusVisible" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onInput" | "onInputCapture" | "onInvalid" | "onInvalidCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onLoad" | "onLoadCapture" | "onLoadStart" | "onLoadStartCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onPaste" | "onPasteCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerMove" | "onPointerMoveCapture" | "onPointerOut" | "onPointerOutCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerUp" | "onPointerUpCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onReset" | "onResetCapture" | "onResize" | "onResizeCapture" | "onScroll" | "onScrollCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onSelect" | "onSelectCapture" | "onStalled" | "onStalledCapture" | "onSubmit" | "onSubmitCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onWheel" | "onWheelCapture" | "prefix" | "property" | "radioGroup" | "ref" | "rel" | "resource" | "results" | "rev" | "role" | "security" | "size" | "slot" | "spellCheck" | "style" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "sx" | "tabIndex" | "title" | "touchRippleRef" | "translate" | "type" | "typeof" | "unselectable" | "value" | "variant" | "vocab"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/configurator/ui/assistant/composer/composer-frame.js

@@ -0,0 +1 @@
+import{IconButton as o,InputBase as r,styled as a}from"@mui/material";import{hoverStyles as e}from"#package/ui-sdk";import{AssistantPanelName as n}from"../theme.js";export const ComposerFrame=a("div",{name:n,slot:"inputFrame"})(({theme:{palette:o,spacing:r}})=>({alignItems:"center",border:`1px solid ${o.divider}`,borderRadius:12,cursor:"text",display:"grid",gridTemplateColumns:"minmax(0, 1fr) auto",padding:r(.5),'&:focus-within, &[data-dragging="true"]':{borderColor:o.primary.main}}));export const ComposerToolButton=a(o,{name:n,slot:"attachButton"})(({theme:{palette:o}})=>({background:"transparent",border:"none",borderRadius:8,boxShadow:"none",color:o.text.secondary,padding:4,"&:hover":{background:"transparent"},...e({"&:hover":{background:o.action.hover,color:o.text.primary}}),"&.Mui-disabled":{background:"transparent",color:o.action.disabled}}));export const ComposerField=a("div")({display:"grid",gridColumn:"1 / -1",minInlineSize:0});export const ComposerInput=a(r,{name:n,slot:"input"})(({theme:{spacing:o,typography:r}})=>({...r.body2,flex:1,paddingBlock:o(.5),paddingInline:o(.75)}));export const ComposerPrimaryButton=a(o,{name:n,slot:"sendButton"})(({theme:{palette:o}})=>({background:o.primary.main,borderRadius:8,color:o.primary.contrastText,padding:4,"&:hover":{background:o.primary.main},...e({"&:hover":{background:o.primary.dark}}),"&.Mui-disabled":{background:o.action.disabledBackground,color:o.action.disabled}}));

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

@@ -0,0 +1 @@
+export { ComposerField, ComposerFrame, ComposerInput, ComposerPrimaryButton, ComposerToolButton, } from './composer-frame.js';

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

@@ -0,0 +1 @@
+export{ComposerField,ComposerFrame,ComposerInput,ComposerPrimaryButton,ComposerToolButton}from"./composer-frame.js";