@ni/spright-components 7.0.0 → 7.1.0

package/dist/all-components-bundle.js

@@ -105399,6 +105399,11 @@ focus outline in that case.
         font: ${subtitleFont};
         color: ${subtitleFontColor};
         text-align: center;
+        ${linkFont.cssCustomProperty}: ${subtitleFont};
+    }
+
+    .subtitle.subtitle-empty {
+        display: none;
     }
 
     .message-content {
@@ -105506,9 +105511,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>
@@ -105519,6 +105524,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' })
@@ -105526,6 +105539,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$8,