fix(chat): header fixes

Author: SisIvanova

src/components/chat/chat.ts

@@ -308,7 +308,11 @@ export default class IgcChatComponent extends EventEmitterMixin<
 
     return html`
       <div part="header" ?hidden=${!hasContent}>
-        <slot name="prefix" part="prefix"></slot>
+        <slot
+          name="prefix"
+          part="prefix"
+          ?hidden=${!this._slots.hasAssignedElements('prefix')}
+        ></slot>
         <slot name="title" part="title"
           >${this._state.options?.headerText}</slot
         >

src/components/chat/themes/input.base.scss

@@ -64,7 +64,8 @@ igc-textarea::part(input) {
     overflow-y: auto;
 }
 
-igc-icon-button {
+igc-icon-button,
+igc-textarea {
     --ig-size: 2;
 }
 

src/components/chat/themes/message.base.scss

@@ -7,11 +7,14 @@
     width: 100%;
 }
 
-[part~='message-container'] {  
+[part~='message-container'],
+[part='plain-text'] {  
     @include type-style('body-1') {
       margin: 0;
     };
+}
 
+[part~='message-container'] {
     display: flex;
     margin-inline-end: auto;
     flex-direction: column;

src/components/chat/themes/shared/chat.bootstrap.scss

@@ -14,6 +14,16 @@ $theme: $bootstrap;
     border-block-end: rem(1px) solid var-get($theme, 'header-border');
 }
 
+[part='title'] {
+    @include type-style('h5') {
+      margin: 0;
+    };
+}
+
+[part='prefix'] {
+    margin-inline-end: rem(16px);
+}
+
 igc-list {
     border: none;
 }

src/components/chat/themes/shared/chat.fluent.scss

@@ -5,3 +5,13 @@
         --textarea-height: #{rem(40px)};
     }
 }
+
+[part='title'] {
+    @include type-style('subtitle-2') {
+      margin: 0;
+    };
+}
+
+[part='prefix'] {
+    margin-inline-end: rem(16px);
+}

src/components/chat/themes/shared/chat.indigo.scss

@@ -20,6 +20,14 @@ $theme: $indigo;
     };
 }
 
+[part='prefix'] {
+    margin-inline-end: rem(16px);
+}
+
+[part='actions'] {
+    gap: rem(8px);
+}
+
 igc-list {
   --ig-size: 2;
 }

src/components/chat/themes/shared/input/input.indigo.scss

@@ -7,6 +7,10 @@ igc-textarea::part(input) {
     max-height: rem(140px);
 }
 
+[part~='input-container'] {
+    border-radius: rem(13px);
+}
+
 [part~='dragging'] {
     igc-textarea::part(container) {  
         background: var-get($theme, 'box-background-hover');