@ni/spright-components 6.24.0 → 7.0.0

package/dist/all-components-bundle.min.js

@@ -18101,7 +18101,7 @@ const Q6=Mt`
     .footer-actions ::slotted(*) {
         height: ${Dc};
     }
-`,t5=Q`
+`,t5="Send",e5="Stop",n5=ki.create({name:"chat-send-label",cssCustomPropertyName:null}).withDefault(t5),i5=ki.create({name:"chat-stop-label",cssCustomPropertyName:null}).withDefault(e5),o5=Q`
 <div class="container">
     <section class="attachments ${t=>t.attachmentsIsEmpty?"":"has-content"}">
         <slot
@@ -18132,10 +18132,10 @@ const Q6=Mt`
             ?disabled=${t=>!t.processing&&(t.sendDisabled||t.isInputEmpty)}
             @click=${t=>t.processing?t.stopButtonClickHandler():t.sendButtonClickHandler()}
             tabindex="${t=>t.tabIndex}"
-            title=${t=>t.processing?t.stopButtonLabel:t.sendButtonLabel}
+            title=${t=>t.processing?i5.getValueFor(t):n5.getValueFor(t)}
             content-hidden
         >
-            ${t=>t.processing?t.stopButtonLabel:t.sendButtonLabel}
+            ${t=>t.processing?i5.getValueFor(t):n5.getValueFor(t)}
             ${qt(t=>t.processing,Q`<${zb} slot="start"></${zb}>`,Q`<${Nb} slot="start"></${Nb}>`)}
         </${rv}>
     </section>
@@ -18146,14 +18146,14 @@ const Q6=Mt`
     ></${gg}>
     ${zv}
 </div>`
-class e5 extends(Pv(qe)){constructor(){super(...arguments),this.value="",this.maxLength=-1,this.processing=!1,this.sendDisabled=!1,this.isInputEmpty=!0,this.scrollbarWidth=-1,this.footerActionsIsEmpty=!0,this.attachmentsIsEmpty=!0,this.updateScrollbarWidthQueued=!1,this.fieldSizingSupported=CSS.supports("field-sizing","content")}slottedFooterActionsElementsChanged(t,e){this.footerActionsIsEmpty=void 0===e||0===e.length}slottedAttachmentsElementsChanged(t,e){this.attachmentsIsEmpty=void 0===e||0===e.length}textAreaKeydownHandler(t){return!(t.key===ln&&!t.shiftKey)||(this.processing||this.sendButtonClickHandler(),!1)}textAreaInputHandler(){this.value=this.textArea.value,this.isInputEmpty=0===this.textArea.value.length,this.adjustTextAreaHeight(),this.queueUpdateScrollbarWidth()}placeholderChanged(){this.queueUpdateScrollbarWidth()}valueChanged(){this.textArea&&(this.textArea.value=this.value,this.isInputEmpty=0===this.textArea.value.length,this.adjustTextAreaHeight(),this.queueUpdateScrollbarWidth())}connectedCallback(){super.connectedCallback(),this.textArea.value=this.value,this.isInputEmpty=0===this.textArea.value.length,this.adjustTextAreaHeight(),this.resizeObserver=new ResizeObserver(()=>this.onResize()),this.resizeObserver.observe(this)}disconnectedCallback(){super.disconnectedCallback(),this.resizeObserver?.disconnect()}sendButtonClickHandler(){if(this.shouldDisableSendButton())return
+class r5 extends(Pv(qe)){constructor(){super(...arguments),this.value="",this.maxLength=-1,this.processing=!1,this.sendDisabled=!1,this.isInputEmpty=!0,this.scrollbarWidth=-1,this.footerActionsIsEmpty=!0,this.attachmentsIsEmpty=!0,this.updateScrollbarWidthQueued=!1,this.fieldSizingSupported=CSS.supports("field-sizing","content")}slottedFooterActionsElementsChanged(t,e){this.footerActionsIsEmpty=void 0===e||0===e.length}slottedAttachmentsElementsChanged(t,e){this.attachmentsIsEmpty=void 0===e||0===e.length}textAreaKeydownHandler(t){return!(t.key===ln&&!t.shiftKey)||(this.processing||this.sendButtonClickHandler(),!1)}textAreaInputHandler(){this.value=this.textArea.value,this.isInputEmpty=0===this.textArea.value.length,this.adjustTextAreaHeight(),this.queueUpdateScrollbarWidth()}placeholderChanged(){this.queueUpdateScrollbarWidth()}valueChanged(){this.textArea&&(this.textArea.value=this.value,this.isInputEmpty=0===this.textArea.value.length,this.adjustTextAreaHeight(),this.queueUpdateScrollbarWidth())}connectedCallback(){super.connectedCallback(),this.textArea.value=this.value,this.isInputEmpty=0===this.textArea.value.length,this.adjustTextAreaHeight(),this.resizeObserver=new ResizeObserver(()=>this.onResize()),this.resizeObserver.observe(this)}disconnectedCallback(){super.disconnectedCallback(),this.resizeObserver?.disconnect()}sendButtonClickHandler(){if(this.shouldDisableSendButton())return
 const t={text:this.textArea.value}
 this.resetInput(),this.$emit("send",t)}stopButtonClickHandler(){this.processing&&(this.$emit("stop"),this.textArea?.blur())}shouldDisableSendButton(){return this.sendDisabled||0===this.textArea.value.length}resetInput(){this.value="",this.isInputEmpty=!0,this.textArea&&(this.textArea.value="",this.adjustTextAreaHeight(),this.textArea.focus())}onResize(){this.adjustTextAreaHeight(),this.scrollbarWidth=this.textArea.offsetWidth-this.textArea.clientWidth}queueUpdateScrollbarWidth(){this.$fastController.isConnected&&(this.updateScrollbarWidthQueued||(this.updateScrollbarWidthQueued=!0,y.queueUpdate(()=>this.updateScrollbarWidth())))}adjustTextAreaHeight(){if(this.fieldSizingSupported||!this.textArea)return
 const t=this.textArea
-t.style.height="auto",t.style.height=`${t.scrollHeight}px`}updateScrollbarWidth(){this.updateScrollbarWidthQueued=!1,this.scrollbarWidth=this.textArea.offsetWidth-this.textArea.clientWidth}}t([ft],e5.prototype,"placeholder",void 0),t([ft({attribute:"send-button-label"})],e5.prototype,"sendButtonLabel",void 0),t([ft({attribute:"stop-button-label"})],e5.prototype,"stopButtonLabel",void 0),t([ft],e5.prototype,"value",void 0),t([ft({attribute:"tabindex",converter:ut})],e5.prototype,"tabIndex",void 0),t([ft({attribute:"maxlength",converter:ut})],e5.prototype,"maxLength",void 0),t([ft({attribute:"processing",mode:"boolean"})],e5.prototype,"processing",void 0),t([ft({attribute:"send-disabled",mode:"boolean"})],e5.prototype,"sendDisabled",void 0),t([k],e5.prototype,"textArea",void 0),t([k],e5.prototype,"isInputEmpty",void 0),t([k],e5.prototype,"scrollbarWidth",void 0),t([k],e5.prototype,"footerActionsIsEmpty",void 0),t([k],e5.prototype,"slottedFooterActionsElements",void 0),t([k],e5.prototype,"attachmentsIsEmpty",void 0),t([k],e5.prototype,"slottedAttachmentsElements",void 0)
-const n5=e5.compose({baseName:"chat-input",template:t5,styles:Q6,shadowOptions:{delegatesFocus:!0}})
-Ei.getOrCreate().withPrefix("spright").register(n5())
-const i5={system:void 0,outbound:"outbound",inbound:"inbound"},o5=Mt`
+t.style.height="auto",t.style.height=`${t.scrollHeight}px`}updateScrollbarWidth(){this.updateScrollbarWidthQueued=!1,this.scrollbarWidth=this.textArea.offsetWidth-this.textArea.clientWidth}}t([ft],r5.prototype,"placeholder",void 0),t([ft],r5.prototype,"value",void 0),t([ft({attribute:"tabindex",converter:ut})],r5.prototype,"tabIndex",void 0),t([ft({attribute:"maxlength",converter:ut})],r5.prototype,"maxLength",void 0),t([ft({attribute:"processing",mode:"boolean"})],r5.prototype,"processing",void 0),t([ft({attribute:"send-disabled",mode:"boolean"})],r5.prototype,"sendDisabled",void 0),t([k],r5.prototype,"textArea",void 0),t([k],r5.prototype,"isInputEmpty",void 0),t([k],r5.prototype,"scrollbarWidth",void 0),t([k],r5.prototype,"footerActionsIsEmpty",void 0),t([k],r5.prototype,"slottedFooterActionsElements",void 0),t([k],r5.prototype,"attachmentsIsEmpty",void 0),t([k],r5.prototype,"slottedAttachmentsElements",void 0)
+const s5=r5.compose({baseName:"chat-input",template:o5,styles:Q6,shadowOptions:{delegatesFocus:!0}})
+Ei.getOrCreate().withPrefix("spright").register(s5())
+const a5={system:void 0,outbound:"outbound",inbound:"inbound"},l5=Mt`
     ${j6("flex")}
 
     :host {
@@ -18167,11 +18167,11 @@ const i5={system:void 0,outbound:"outbound",inbound:"inbound"},o5=Mt`
         color: ${ud};
     }
 
-    :host([message-type='${i5.outbound}']) {
+    :host([message-type='${a5.outbound}']) {
         justify-content: flex-end;
     }
 
-    :host([message-type='${i5.inbound}']) {
+    :host([message-type='${a5.inbound}']) {
         justify-content: flex-start;
     }
 
@@ -18191,7 +18191,7 @@ const i5={system:void 0,outbound:"outbound",inbound:"inbound"},o5=Mt`
         overflow-x: auto;
     }
 
-    :host([message-type='${i5.outbound}']) .message-content {
+    :host([message-type='${a5.outbound}']) .message-content {
         background: ${nc};
         border: ${Nc} solid ${pc};
         border-radius: ${Fc} ${Fc} 0px ${Fc};
@@ -18202,7 +18202,7 @@ const i5={system:void 0,outbound:"outbound",inbound:"inbound"},o5=Mt`
         display: none;
     }
 
-    :host([message-type='${i5.inbound}'])
+    :host([message-type='${a5.inbound}'])
         .footer-actions.has-content {
         display: flex;
         column-gap: ${Lc};
@@ -18220,14 +18220,14 @@ const i5={system:void 0,outbound:"outbound",inbound:"inbound"},o5=Mt`
         display: none;
     }
 
-    :host([message-type='${i5.inbound}']) .end {
+    :host([message-type='${a5.inbound}']) .end {
         display: flex;
         column-gap: ${Lc};
         margin-top: ${Bc};
     }
 `
-class r5 extends qe{constructor(){super(...arguments),this.messageType=i5.system,this.footerActionsIsEmpty=!0}slottedFooterActionsElementsChanged(t,e){this.footerActionsIsEmpty=void 0===e||0===e.length}}t([ft({attribute:"message-type"})],r5.prototype,"messageType",void 0),t([k],r5.prototype,"footerActionsIsEmpty",void 0),t([k],r5.prototype,"slottedFooterActionsElements",void 0),Ze(r5,ie)
-const s5=r5.compose({baseName:"chat-message",template:(t,e)=>Q`
+class c5 extends qe{constructor(){super(...arguments),this.messageType=a5.system,this.footerActionsIsEmpty=!0}slottedFooterActionsElementsChanged(t,e){this.footerActionsIsEmpty=void 0===e||0===e.length}}t([ft({attribute:"message-type"})],c5.prototype,"messageType",void 0),t([k],c5.prototype,"footerActionsIsEmpty",void 0),t([k],c5.prototype,"slottedFooterActionsElements",void 0),Ze(c5,ie)
+const d5=c5.compose({baseName:"chat-message",template:(t,e)=>Q`
     <div class="container">
         ${re(0,e)}
         <section class="message-content">
@@ -18241,9 +18241,9 @@ const s5=r5.compose({baseName:"chat-message",template:(t,e)=>Q`
         </section>
         ${oe(0,e)}
     </div>
-`,styles:o5})
-Ei.getOrCreate().withPrefix("spright").register(s5())
-const a5=Mt`
+`,styles:l5})
+Ei.getOrCreate().withPrefix("spright").register(d5())
+const h5=Mt`
     ${j6("flex")}
 
     :host {
@@ -18304,8 +18304,8 @@ const a5=Mt`
         margin-top: ${Bc};
     }
 `
-class l5 extends qe{constructor(){super(...arguments),this.messageInternals=new K6(this),this.footerActionsIsEmpty=!0}slottedFooterActionsElementsChanged(t,e){this.footerActionsIsEmpty=void 0===e||0===e.length}}t([k],l5.prototype,"footerActionsIsEmpty",void 0),t([k],l5.prototype,"slottedFooterActionsElements",void 0),Ze(l5,ie)
-const c5=l5.compose({baseName:"chat-message-inbound",template:(t,e)=>Q`
+class u5 extends qe{constructor(){super(...arguments),this.messageInternals=new K6(this),this.footerActionsIsEmpty=!0}slottedFooterActionsElementsChanged(t,e){this.footerActionsIsEmpty=void 0===e||0===e.length}}t([k],u5.prototype,"footerActionsIsEmpty",void 0),t([k],u5.prototype,"slottedFooterActionsElements",void 0),Ze(u5,ie)
+const p5=u5.compose({baseName:"chat-message-inbound",template:(t,e)=>Q`
     <div class="container">
         ${re(0,e)}
         <section class="message-content">
@@ -18319,9 +18319,9 @@ const c5=l5.compose({baseName:"chat-message-inbound",template:(t,e)=>Q`
         </section>
         ${oe(0,e)}
     </div>
-`,styles:a5})
-Ei.getOrCreate().withPrefix("spright").register(c5())
-const d5=Mt`
+`,styles:h5})
+Ei.getOrCreate().withPrefix("spright").register(p5())
+const f5=Mt`
     ${j6("flex")}
 
     :host {
@@ -18355,15 +18355,15 @@ const d5=Mt`
         overflow-x: auto;
     }
 `
-const h5=class extends qe{constructor(){super(...arguments),this.messageInternals=new K6(this,{anchorOnInsert:!0})}}.compose({baseName:"chat-message-outbound",template:()=>Q`
+const m5=class extends qe{constructor(){super(...arguments),this.messageInternals=new K6(this,{anchorOnInsert:!0})}}.compose({baseName:"chat-message-outbound",template:()=>Q`
     <div class="container">
         <section class="message-content">
             <slot></slot>
         </section>
     </div>
-`,styles:d5})
-Ei.getOrCreate().withPrefix("spright").register(h5())
-const u5=Mt`
+`,styles:f5})
+Ei.getOrCreate().withPrefix("spright").register(m5())
+const g5=Mt`
     ${j6("flex")}
 
     :host {
@@ -18393,15 +18393,15 @@ const u5=Mt`
         overflow-x: auto;
     }
 `
-const p5=class extends qe{constructor(){super(...arguments),this.messageInternals=new K6(this)}}.compose({baseName:"chat-message-system",template:()=>Q`
+const v5=class extends qe{constructor(){super(...arguments),this.messageInternals=new K6(this)}}.compose({baseName:"chat-message-system",template:()=>Q`
     <div class="container">
         <section class="message-content">
             <slot></slot>
         </section>
     </div>
-`,styles:u5})
-Ei.getOrCreate().withPrefix("spright").register(p5())
-const f5=Mt`
+`,styles:g5})
+Ei.getOrCreate().withPrefix("spright").register(v5())
+const b5=Mt`
     ${j6("flex")}
 
     :host {
@@ -18459,10 +18459,10 @@ const f5=Mt`
         overflow-x: auto;
         gap: ${Fc};
     }
-`,m5=Q`
+`,y5=Q`
     <div class="icon light-icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .nigel-chat-light-0 {\n        fill: url(#nigel-chat-gradient-light-0);\n      }\n\n      .nigel-chat-light-1 {\n        fill: url(#nigel-chat-gradient-light-1);\n      }\n    </style>\n    <linearGradient id="nigel-chat-gradient-light-1" x1="11.84" y1="6.19" x2="4.84" y2="13.18" gradientTransform="translate(0 18) scale(1 -1)" gradientUnits="userSpaceOnUse">\n      <stop offset="0" stop-color="#00ad7c"/>\n      <stop offset="1" stop-color="#32eb96"/>\n    </linearGradient>\n    <linearGradient id="nigel-chat-gradient-light-0" x1="10.25" y1="-658.82" x2="6.95" y2="-662.11" gradientTransform="translate(0 668)" xlink:href="#nigel-chat-gradient-light-1"/>\n  </defs>\n  <path class="nigel-chat-light-1" d="M14.21,7.52l-.11-.06c-2.36-1.29-4.3-3.23-5.59-5.59l-.06-.11c-.19-.36-.7-.36-.9,0l-.06.11c-1.29,2.36-3.23,4.3-5.59,5.59l-.11.06c-.36.19-.36.7,0,.9l.11.06c2.36,1.29,4.3,3.23,5.59,5.59l.06.11c.19.36.7.36.9,0l.06-.11c1.29-2.36,3.23-4.3,5.59-5.59l.11-.06c.36-.19.36-.7,0-.9ZM12.5,7.88l-.08.04c-1.58.87-2.89,2.17-3.75,3.75l-.04.08c-.13.24-.47.24-.6,0l-.04-.08c-.87-1.58-2.17-2.89-3.75-3.75l-.08-.04c-.24-.13-.24-.47,0-.6l.08-.04c1.58-.87,2.89-2.17,3.75-3.75l.04-.08c.13-.24.47-.24.6,0l.04.08c.87,1.58,2.17,2.89,3.75,3.75l.08.04c.24.13.24.47,0,.6Z"/>\n  <path class="nigel-chat-light-0" d="M11.36,7.6l-.03.02c-1.12.61-2.04,1.53-2.65,2.65l-.02.03c-.1.18-.35.18-.45,0l-.02-.03c-.61-1.12-1.53-2.04-2.65-2.65l-.03-.02c-.18-.1-.18-.35,0-.45l.03-.02c1.12-.61,2.04-1.53,2.65-2.65l.02-.03c.1-.18.35-.18.45,0l.02.03c.61,1.12,1.53,2.04,2.65,2.65l.03.02c.18.1.18.35,0,.45Z"/>\n</svg>'}"></div>
     <div class="icon dark-icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .nigel-chat-dark-0 {\n        fill: url(#nigel-chat-gradient-dark-0);\n      }\n\n      .nigel-chat-dark-1 {\n        fill: url(#nigel-chat-gradient-dark-1);\n      }\n    </style>\n    <linearGradient id="nigel-chat-gradient-dark-1" x1="11.84" y1="6.19" x2="4.84" y2="13.18" gradientTransform="translate(0 18) scale(1 -1)" gradientUnits="userSpaceOnUse">\n      <stop offset="0" stop-color="#00ad7c"/>\n      <stop offset="1" stop-color="#32eb96"/>\n    </linearGradient>\n    <linearGradient id="nigel-chat-gradient-dark-0" x1="10.25" y1="-658.82" x2="6.95" y2="-662.11" gradientTransform="translate(0 668)" xlink:href="#nigel-chat-gradient-dark-1"/>\n  </defs>\n  <path class="nigel-chat-dark-1" d="M14.21,7.52l-.11-.06c-2.36-1.29-4.3-3.23-5.59-5.59l-.06-.11c-.19-.36-.7-.36-.9,0l-.06.11c-1.29,2.36-3.23,4.3-5.59,5.59l-.11.06c-.36.19-.36.7,0,.9l.11.06c2.36,1.29,4.3,3.23,5.59,5.59l.06.11c.19.36.7.36.9,0l.06-.11c1.29-2.36,3.23-4.3,5.59-5.59l.11-.06c.36-.19.36-.7,0-.9ZM12.5,7.88l-.08.04c-1.58.87-2.89,2.17-3.75,3.75l-.04.08c-.13.24-.47.24-.6,0l-.04-.08c-.87-1.58-2.17-2.89-3.75-3.75l-.08-.04c-.24-.13-.24-.47,0-.6l.08-.04c1.58-.87,2.89-2.17,3.75-3.75l.04-.08c.13-.24.47-.24.6,0l.04.08c.87,1.58,2.17,2.89,3.75,3.75l.08.04c.24.13.24.47,0,.6Z"/>\n  <path class="nigel-chat-dark-0" d="M11.36,7.6l-.03.02c-1.12.61-2.04,1.53-2.65,2.65l-.02.03c-.1.18-.35.18-.45,0l-.02-.03c-.61-1.12-1.53-2.04-2.65-2.65l-.03-.02c-.18-.1-.18-.35,0-.45l.03-.02c1.12-.61,2.04-1.53,2.65-2.65l.02-.03c.1-.18.35-.18.45,0l.02.03c.61,1.12,1.53,2.04,2.65,2.65l.03.02c.18.1.18.35,0,.45Z"/>\n</svg>'}"></div>
-`,g5=Mt`
+`,w5=Mt`
     ${ug}
 
     .dark-icon {
@@ -18477,15 +18477,15 @@ const f5=Mt`
             display: contents;
         }
     `))
-const v5=class extends pg{}.compose({baseName:"icon-nigel-chat",template:m5,styles:g5})
-Ei.getOrCreate().withPrefix("spright").register(v5())
-const b5="spright-icon-nigel-chat"
-class y5 extends qe{}t([ft({attribute:"welcome-title"})],y5.prototype,"welcomeTitle",void 0),t([ft],y5.prototype,"subtitle",void 0)
-const w5=y5.compose({baseName:"chat-message-welcome",template:()=>Q`
+const x5=class extends pg{}.compose({baseName:"icon-nigel-chat",template:y5,styles:w5})
+Ei.getOrCreate().withPrefix("spright").register(x5())
+const C5="spright-icon-nigel-chat"
+class k5 extends qe{}t([ft({attribute:"welcome-title"})],k5.prototype,"welcomeTitle",void 0),t([ft],k5.prototype,"subtitle",void 0)
+const S5=k5.compose({baseName:"chat-message-welcome",template:()=>Q`
     <div class="container">
         <div class="brand-icon">
             <slot name="brand-icon">
-                <${b5}></${b5}>
+                <${C5}></${C5}>
             </slot>
         </div>
         ${qt(t=>t.welcomeTitle,Q`
@@ -18498,100 +18498,104 @@ const w5=y5.compose({baseName:"chat-message-welcome",template:()=>Q`
             <slot></slot>
         </section>
     </div>
-`,styles:f5})
-Ei.getOrCreate().withPrefix("spright").register(w5())
-const x5=Q`
-    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-conditional-0 {\n        fill: #c42126;\n      }\n    </style>\n  </defs>\n  <path class="breakpoint-conditional-0" d="M8,3c-2.76,0-5,2.24-5,5s2.24,5,5,5,5-2.24,5-5-2.24-5-5-5ZM11,9h-2v2h-2v-2h-2v-2h2v-2h2v2h2v2Z"/>\n</svg>'}"></div>
-`,C5=class extends pg{}.compose({baseName:"icon-breakpoint-conditional",template:x5,styles:ug})
-Ei.getOrCreate().withPrefix("spright").register(C5())
-const k5=Q`
-    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-disabled-0 {\n        fill: #161617;\n        opacity: .3;\n      }\n    </style>\n  </defs>\n  <circle class="breakpoint-disabled-0" cx="8" cy="8" r="5"/>\n</svg>'}"></div>
-`,S5=class extends pg{}.compose({baseName:"icon-breakpoint-disabled",template:k5,styles:ug})
+`,styles:b5})
 Ei.getOrCreate().withPrefix("spright").register(S5())
 const $5=Q`
-    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-enabled-0 {\n        fill: #c42126;\n      }\n    </style>\n  </defs>\n  <circle class="breakpoint-enabled-0" cx="8" cy="8" r="5"/>\n</svg>'}"></div>
-`,_5=class extends pg{}.compose({baseName:"icon-breakpoint-enabled",template:$5,styles:ug})
+    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-conditional-0 {\n        fill: #c42126;\n      }\n    </style>\n  </defs>\n  <path class="breakpoint-conditional-0" d="M8,3c-2.76,0-5,2.24-5,5s2.24,5,5,5,5-2.24,5-5-2.24-5-5-5ZM11,9h-2v2h-2v-2h-2v-2h2v-2h2v2h2v2Z"/>\n</svg>'}"></div>
+`,_5=class extends pg{}.compose({baseName:"icon-breakpoint-conditional",template:$5,styles:ug})
 Ei.getOrCreate().withPrefix("spright").register(_5())
 const M5=Q`
-    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-execution-pointer-0 {\n        fill: #161617;\n      }\n    </style>\n  </defs>\n  <polygon class="breakpoint-execution-pointer-0" points="7.97 4.37 7.29 5.49 9.8 7 2 7 2 9 9.8 9 7.29 10.51 7.97 11.63 14 8 7.97 4.37"/>\n</svg>'}"></div>
-`,I5=class extends pg{}.compose({baseName:"icon-breakpoint-execution-pointer",template:M5,styles:ug})
+    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-disabled-0 {\n        fill: #161617;\n        opacity: .3;\n      }\n    </style>\n  </defs>\n  <circle class="breakpoint-disabled-0" cx="8" cy="8" r="5"/>\n</svg>'}"></div>
+`,I5=class extends pg{}.compose({baseName:"icon-breakpoint-disabled",template:M5,styles:ug})
 Ei.getOrCreate().withPrefix("spright").register(I5())
 const E5=Q`
-    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-hit-disabled-0 {\n        opacity: .3;\n      }\n\n      .breakpoint-hit-disabled-0, .breakpoint-hit-disabled-1 {\n        fill: #161617;\n      }\n    </style>\n  </defs>\n  <path class="breakpoint-hit-disabled-0" d="M3.36,6.25c.71-1.89,2.5-3.25,4.64-3.25s3.98,1.4,4.67,3.33l-4.96-2.99-1.45,2.4.84.51h-3.75ZM7.71,12.66l-1.45-2.4.84-.51h-3.75c.71,1.89,2.5,3.25,4.64,3.25s3.98-1.4,4.67-3.33l-4.96,2.99Z"/>\n  <polygon class="breakpoint-hit-disabled-1" points="7.97 4.37 7.29 5.49 9.8 7 2 7 2 9 9.8 9 7.29 10.51 7.97 11.63 14 8 7.97 4.37"/>\n</svg>'}"></div>
-`,A5=class extends pg{}.compose({baseName:"icon-breakpoint-hit-disabled",template:E5,styles:ug})
+    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-enabled-0 {\n        fill: #c42126;\n      }\n    </style>\n  </defs>\n  <circle class="breakpoint-enabled-0" cx="8" cy="8" r="5"/>\n</svg>'}"></div>
+`,A5=class extends pg{}.compose({baseName:"icon-breakpoint-enabled",template:E5,styles:ug})
 Ei.getOrCreate().withPrefix("spright").register(A5())
 const T5=Q`
-    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-hit-0 {\n        fill: #c42126;\n      }\n\n      .breakpoint-hit-1 {\n        fill: #161617;\n      }\n    </style>\n  </defs>\n  <path class="breakpoint-hit-0" d="M3.36,6.25c.71-1.89,2.5-3.25,4.64-3.25s3.98,1.4,4.67,3.33l-4.96-2.99-1.45,2.4.84.51h-3.75ZM7.71,12.66l-1.45-2.4.84-.51h-3.75c.71,1.89,2.5,3.25,4.64,3.25s3.98-1.4,4.67-3.33l-4.96,2.99Z"/>\n  <polygon class="breakpoint-hit-1" points="7.97 4.37 7.29 5.49 9.8 7 2 7 2 9 9.8 9 7.29 10.51 7.97 11.63 14 8 7.97 4.37"/>\n</svg>'}"></div>
-`,O5=class extends pg{}.compose({baseName:"icon-breakpoint-hit",template:T5,styles:ug})
+    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-execution-pointer-0 {\n        fill: #161617;\n      }\n    </style>\n  </defs>\n  <polygon class="breakpoint-execution-pointer-0" points="7.97 4.37 7.29 5.49 9.8 7 2 7 2 9 9.8 9 7.29 10.51 7.97 11.63 14 8 7.97 4.37"/>\n</svg>'}"></div>
+`,O5=class extends pg{}.compose({baseName:"icon-breakpoint-execution-pointer",template:T5,styles:ug})
 Ei.getOrCreate().withPrefix("spright").register(O5())
 const D5=Q`
-    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-hover-0 {\n        fill: #c42126;\n        opacity: .3;\n      }\n    </style>\n  </defs>\n  <circle class="breakpoint-hover-0" cx="8" cy="8" r="5"/>\n</svg>'}"></div>
-`,R5=class extends pg{}.compose({baseName:"icon-breakpoint-hover",template:D5,styles:ug})
+    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-hit-disabled-0 {\n        opacity: .3;\n      }\n\n      .breakpoint-hit-disabled-0, .breakpoint-hit-disabled-1 {\n        fill: #161617;\n      }\n    </style>\n  </defs>\n  <path class="breakpoint-hit-disabled-0" d="M3.36,6.25c.71-1.89,2.5-3.25,4.64-3.25s3.98,1.4,4.67,3.33l-4.96-2.99-1.45,2.4.84.51h-3.75ZM7.71,12.66l-1.45-2.4.84-.51h-3.75c.71,1.89,2.5,3.25,4.64,3.25s3.98-1.4,4.67-3.33l-4.96,2.99Z"/>\n  <polygon class="breakpoint-hit-disabled-1" points="7.97 4.37 7.29 5.49 9.8 7 2 7 2 9 9.8 9 7.29 10.51 7.97 11.63 14 8 7.97 4.37"/>\n</svg>'}"></div>
+`,R5=class extends pg{}.compose({baseName:"icon-breakpoint-hit-disabled",template:D5,styles:ug})
 Ei.getOrCreate().withPrefix("spright").register(R5())
-const F5=Mt`
+const F5=Q`
+    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-hit-0 {\n        fill: #c42126;\n      }\n\n      .breakpoint-hit-1 {\n        fill: #161617;\n      }\n    </style>\n  </defs>\n  <path class="breakpoint-hit-0" d="M3.36,6.25c.71-1.89,2.5-3.25,4.64-3.25s3.98,1.4,4.67,3.33l-4.96-2.99-1.45,2.4.84.51h-3.75ZM7.71,12.66l-1.45-2.4.84-.51h-3.75c.71,1.89,2.5,3.25,4.64,3.25s3.98-1.4,4.67-3.33l-4.96,2.99Z"/>\n  <polygon class="breakpoint-hit-1" points="7.97 4.37 7.29 5.49 9.8 7 2 7 2 9 9.8 9 7.29 10.51 7.97 11.63 14 8 7.97 4.37"/>\n</svg>'}"></div>
+`,L5=class extends pg{}.compose({baseName:"icon-breakpoint-hit",template:F5,styles:ug})
+Ei.getOrCreate().withPrefix("spright").register(L5())
+const B5=Q`
+    <div class="icon" aria-hidden="true" :innerHTML="${()=>'<?xml version="1.0" encoding="UTF-8"?>\n<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">\n  <defs>\n    <style>\n      .breakpoint-hover-0 {\n        fill: #c42126;\n        opacity: .3;\n      }\n    </style>\n  </defs>\n  <circle class="breakpoint-hover-0" cx="8" cy="8" r="5"/>\n</svg>'}"></div>
+`,N5=class extends pg{}.compose({baseName:"icon-breakpoint-hover",template:B5,styles:ug})
+Ei.getOrCreate().withPrefix("spright").register(N5())
+const z5=Mt`
     ${ug}
 
     .icon svg {
         fill: ${Ec};
     }
 `
-const L5=class extends fg{constructor(){super(Au)}}.compose({baseName:"icon-work-item-calendar-week",template:hg,styles:F5})
-Ei.getOrCreate().withPrefix("spright").register(L5())
-const B5=Mt`
+const P5=class extends fg{constructor(){super(Au)}}.compose({baseName:"icon-work-item-calendar-week",template:hg,styles:z5})
+Ei.getOrCreate().withPrefix("spright").register(P5())
+const V5=Mt`
     ${ug}
 
     .icon svg {
         fill: ${Ic};
     }
 `
-const N5=class extends fg{constructor(){super(Tu)}}.compose({baseName:"icon-work-item-calipers",template:hg,styles:B5})
-Ei.getOrCreate().withPrefix("spright").register(N5())
-const z5=Mt`
+const H5=class extends fg{constructor(){super(Tu)}}.compose({baseName:"icon-work-item-calipers",template:hg,styles:V5})
+Ei.getOrCreate().withPrefix("spright").register(H5())
+const U5=Mt`
     ${ug}
 
     .icon svg {
         fill: ${Ac};
     }
 `
-const P5=class extends fg{constructor(){super(Xp)}}.compose({baseName:"icon-work-item-forklift",template:hg,styles:z5})
-Ei.getOrCreate().withPrefix("spright").register(P5())
-const V5=Mt`
+const q5=class extends fg{constructor(){super(Xp)}}.compose({baseName:"icon-work-item-forklift",template:hg,styles:U5})
+Ei.getOrCreate().withPrefix("spright").register(q5())
+const j5=Mt`
     ${ug}
 
     .icon svg {
         fill: ${$c};
     }
 `
-const H5=class extends fg{constructor(){super(em)}}.compose({baseName:"icon-work-item-rectangle-check-lines",template:hg,styles:V5})
-Ei.getOrCreate().withPrefix("spright").register(H5())
-const U5=Mt`
+const W5=class extends fg{constructor(){super(em)}}.compose({baseName:"icon-work-item-rectangle-check-lines",template:hg,styles:j5})
+Ei.getOrCreate().withPrefix("spright").register(W5())
+const Z5=Mt`
     ${ug}
 
     .icon svg {
         fill: ${Tc};
     }
 `
-const q5=class extends fg{constructor(){super(wm)}}.compose({baseName:"icon-work-item-square-list-cog",template:hg,styles:U5})
-Ei.getOrCreate().withPrefix("spright").register(q5())
-const j5=Mt`
+const G5=class extends fg{constructor(){super(wm)}}.compose({baseName:"icon-work-item-square-list-cog",template:hg,styles:Z5})
+Ei.getOrCreate().withPrefix("spright").register(G5())
+const K5=Mt`
     ${ug}
 
     .icon svg {
         fill: ${_c};
     }
 `
-const W5=class extends fg{constructor(){super(Qm)}}.compose({baseName:"icon-work-item-user-helmet-safety",template:hg,styles:j5})
-Ei.getOrCreate().withPrefix("spright").register(W5())
-const Z5=Mt`
+const Y5=class extends fg{constructor(){super(Qm)}}.compose({baseName:"icon-work-item-user-helmet-safety",template:hg,styles:K5})
+Ei.getOrCreate().withPrefix("spright").register(Y5())
+const X5=Mt`
     ${ug}
 
     .icon svg {
         fill: ${Mc};
     }
 `
-const G5=class extends fg{constructor(){super(lg)}}.compose({baseName:"icon-work-item-wrench-hammer",template:hg,styles:Z5})
-Ei.getOrCreate().withPrefix("spright").register(G5())
-const K5=Mt`
+const J5=class extends fg{constructor(){super(lg)}}.compose({baseName:"icon-work-item-wrench-hammer",template:hg,styles:X5})
+Ei.getOrCreate().withPrefix("spright").register(J5())
+const Q5={send:n5,stop:i5}
+class t4 extends Ub{constructor(){super(...arguments),this.supportedLabels=Q5}}t([ft],t4.prototype,"send",void 0),t([ft],t4.prototype,"stop",void 0)
+const e4=t4.compose({baseName:"label-provider-chat",styles:qb})
+Ei.getOrCreate().withPrefix("spright").register(e4())
+const n4=Mt`
     ${j6("inline-block")}
 
     :host {
@@ -18614,7 +18618,7 @@ const K5=Mt`
     :host([disabled]) slot {
         color: ${pd};
     }
-`,Y5=Q`<slot></slot>`
-const X5=class extends qe{}.compose({baseName:"rectangle",template:Y5,styles:K5})
-Ei.getOrCreate().withPrefix("spright").register(X5())}()
+`,i4=Q`<slot></slot>`
+const o4=class extends qe{}.compose({baseName:"rectangle",template:i4,styles:n4})
+Ei.getOrCreate().withPrefix("spright").register(o4())}()
 //# sourceMappingURL=all-components-bundle.min.js.map