@ni/ok-components 1.12.0 → 1.12.2

package/dist/all-components-bundle.js

@@ -27017,7 +27017,7 @@ so this becomes the fallback color for the slot */ ''}
     ${display$2('none')}
 `;
 
-  const supportedLabels$1 = {
+  const supportedLabels$2 = {
       popupDismiss: popupDismissLabel,
       numericDecrement: numericDecrementLabel,
       numericIncrement: numericIncrementLabel,
@@ -27039,7 +27039,7 @@ so this becomes the fallback color for the slot */ ''}
   class LabelProviderCore extends LabelProviderBase {
       constructor() {
           super(...arguments);
-          this.supportedLabels = supportedLabels$1;
+          this.supportedLabels = supportedLabels$2;
       }
   }
   __decorate([
@@ -27176,7 +27176,7 @@ so this becomes the fallback color for the slot */ ''}
       cssCustomPropertyName: null
   }).withDefault(tableLabelDefaults.tableGroupRowPlaceholderEmptyLabel);
 
-  const supportedLabels = {
+  const supportedLabels$1 = {
       groupCollapse: tableGroupCollapseLabel,
       groupExpand: tableGroupExpandLabel,
       rowCollapse: tableRowCollapseLabel,
@@ -27200,7 +27200,7 @@ so this becomes the fallback color for the slot */ ''}
   class LabelProviderTable extends LabelProviderBase {
       constructor() {
           super(...arguments);
-          this.supportedLabels = supportedLabels;
+          this.supportedLabels = supportedLabels$1;
       }
   }
   __decorate([
@@ -104733,6 +104733,20 @@ focus outline in that case.
     }
 `;
 
+  const chatLabelDefaults = {
+      chatSendLabel: 'Send',
+      chatStopLabel: 'Stop'
+  };
+
+  const chatSendLabel = DesignToken.create({
+      name: 'chat-send-label',
+      cssCustomPropertyName: null
+  }).withDefault(chatLabelDefaults.chatSendLabel);
+  const chatStopLabel = DesignToken.create({
+      name: 'chat-stop-label',
+      cssCustomPropertyName: null
+  }).withDefault(chatLabelDefaults.chatStopLabel);
+
   const template$y = html `
 <div class="container">
     <section class="attachments ${x => (x.attachmentsIsEmpty ? '' : 'has-content')}">
@@ -104764,10 +104778,10 @@ focus outline in that case.
             ?disabled=${x => (x.processing ? false : (x.sendDisabled || x.isInputEmpty))}
             @click=${x => (x.processing ? x.stopButtonClickHandler() : x.sendButtonClickHandler())}
             tabindex="${x => x.tabIndex}"
-            title=${x => (x.processing ? x.stopButtonLabel : x.sendButtonLabel)}
+            title=${x => (x.processing ? chatStopLabel.getValueFor(x) : chatSendLabel.getValueFor(x))}
             content-hidden
         >
-            ${x => (x.processing ? x.stopButtonLabel : x.sendButtonLabel)}
+            ${x => (x.processing ? chatStopLabel.getValueFor(x) : chatSendLabel.getValueFor(x))}
             ${when(x => x.processing, html `<${iconStopSquareTag} slot="start"></${iconStopSquareTag}>`, html `<${iconPaperPlaneTag} slot="start"></${iconPaperPlaneTag}>`)}
         </${buttonTag}>
     </section>
@@ -104941,12 +104955,6 @@ focus outline in that case.
   __decorate([
       attr
   ], ChatInput.prototype, "placeholder", void 0);
-  __decorate([
-      attr({ attribute: 'send-button-label' })
-  ], ChatInput.prototype, "sendButtonLabel", void 0);
-  __decorate([
-      attr({ attribute: 'stop-button-label' })
-  ], ChatInput.prototype, "stopButtonLabel", void 0);
   __decorate([
       attr
   ], ChatInput.prototype, "value", void 0);
@@ -105403,6 +105411,11 @@ focus outline in that case.
         font: ${subtitleFont};
         color: ${subtitleFontColor};
         text-align: center;
+        ${linkFont.cssCustomProperty}: ${subtitleFont};
+    }
+
+    .subtitle.subtitle-empty {
+        display: none;
     }
 
     .message-content {
@@ -105510,9 +105523,9 @@ focus outline in that case.
         ${when(x => x.welcomeTitle, html `
             <div class="title">${x => x.welcomeTitle}</div>
         `)}
-        ${when(x => x.subtitle, html `
-            <div class="subtitle">${x => x.subtitle}</div>
-        `)}
+        <div class="subtitle ${x => (!x.subtitle && x.subtitleIsEmpty ? 'subtitle-empty' : '')}">
+            <slot name="subtitle" ${slotted({ property: 'slottedSubtitleElements' })}>${x => x.subtitle}</slot>
+        </div>
         <section class="message-content">
             <slot></slot>
         </section>
@@ -105523,6 +105536,14 @@ focus outline in that case.
    * A Spright component for displaying a welcome chat message
    */
   class ChatMessageWelcome extends FoundationElement {
+      constructor() {
+          super(...arguments);
+          /** @internal */
+          this.subtitleIsEmpty = true;
+      }
+      slottedSubtitleElementsChanged(_prev, next) {
+          this.subtitleIsEmpty = next === undefined || next.length === 0;
+      }
   }
   __decorate([
       attr({ attribute: 'welcome-title' })
@@ -105530,6 +105551,12 @@ focus outline in that case.
   __decorate([
       attr
   ], ChatMessageWelcome.prototype, "subtitle", void 0);
+  __decorate([
+      observable
+  ], ChatMessageWelcome.prototype, "slottedSubtitleElements", void 0);
+  __decorate([
+      observable
+  ], ChatMessageWelcome.prototype, "subtitleIsEmpty", void 0);
   const sprightChatMessageWelcome = ChatMessageWelcome.compose({
       baseName: 'chat-message-welcome',
       template: template$s,
@@ -105933,6 +105960,33 @@ focus outline in that case.
       .withPrefix('spright')
       .register(sprightIconWorkItemWrenchHammer());
 
+  const supportedLabels = {
+      send: chatSendLabel,
+      stop: chatStopLabel
+  };
+  /**
+   * Label provider for Spright chat components
+   */
+  class LabelProviderChat extends LabelProviderBase {
+      constructor() {
+          super(...arguments);
+          this.supportedLabels = supportedLabels;
+      }
+  }
+  __decorate([
+      attr
+  ], LabelProviderChat.prototype, "send", void 0);
+  __decorate([
+      attr
+  ], LabelProviderChat.prototype, "stop", void 0);
+  const sprightLabelProviderChat = LabelProviderChat.compose({
+      baseName: 'label-provider-chat',
+      styles: styles$1e
+  });
+  DesignSystem.getOrCreate()
+      .withPrefix('spright')
+      .register(sprightLabelProviderChat());
+
   const styles$j = css `
     ${display$1('inline-block')}