@aws/mynah-ui 4.23.0-beta.4 → 4.23.0-beta.6

package/dist/static.d.ts

@@ -7,6 +7,7 @@ import { ChatItemBodyRenderer } from './helper/dom';
 import { SelectAbstract, SelectProps, RadioGroupAbstract, RadioGroupProps, ButtonAbstract, ButtonProps, TextInputProps, TextInputAbstract, TextAreaProps, TextAreaAbstract, ToggleOption } from './main';
 export interface QuickActionCommand {
     command: string;
+    id?: string;
     label?: string;
     disabled?: boolean;
     icon?: MynahIcons | MynahIconsType;
@@ -15,17 +16,11 @@ export interface QuickActionCommand {
     children?: QuickActionCommandGroup[];
     route?: string[];
 }
-export interface QuickActionCommandInternal extends QuickActionCommand {
-    route?: string[];
-}
 export interface QuickActionCommandGroup {
     groupName?: string;
     actions?: Action[];
     commands: QuickActionCommand[];
 }
-export interface QuickActionCommandGroupInternal extends QuickActionCommandGroup {
-    commands: QuickActionCommandInternal[];
-}
 /**
  * data store model to update the mynah ui partially or fully
  */
@@ -233,6 +228,7 @@ export interface TreeNodeDetails {
     clickable?: boolean;
 }
 export interface ChatItemContent {
+    header?: ChatItemContent | null;
     body?: string | null;
     customRenderer?: string | ChatItemBodyRenderer | ChatItemBodyRenderer[] | null;
     followUp?: {
@@ -249,6 +245,8 @@ export interface ChatItemContent {
         rootFolderTitle?: string;
         filePaths?: string[];
         deletedFiles?: string[];
+        collapsedByDefault?: boolean;
+        hideFileCount?: boolean;
         actions?: Record<string, FileNodeAction[]>;
         details?: Record<string, TreeNodeDetails>;
     } | null;
@@ -283,23 +281,45 @@ export interface ChatItem extends ChatItemContent {
     hoverEffect?: boolean;
     status?: Status;
 }
-export interface ChatItemFormItem {
+export interface ValidationPattern {
+    pattern: string | RegExp;
+    errorMessage?: string;
+}
+interface BaseFormItem {
     id: string;
-    type: 'select' | 'textarea' | 'textinput' | 'numericinput' | 'stars' | 'radiogroup' | 'email';
     mandatory?: boolean;
     title?: string;
     placeholder?: string;
     value?: string;
+}
+export type TextBasedFormItem = BaseFormItem & {
+    type: 'textarea' | 'textinput' | 'numericinput' | 'email';
+    validationPatterns?: {
+        operator?: 'and' | 'or';
+        genericValidationErrorMessage?: string;
+        patterns: ValidationPattern[];
+    };
+};
+type SelectFormItem = BaseFormItem & {
+    type: 'select';
+    options: Array<{
+        value: string;
+        label: string;
+    }>;
+};
+type OtherFormItem = BaseFormItem & {
+    type: 'stars' | 'radiogroup';
     options?: Array<{
         value: string;
         label: string;
     }>;
-}
+};
+export type ChatItemFormItem = TextBasedFormItem | SelectFormItem | OtherFormItem;
 export interface ChatPrompt {
     prompt?: string;
     escapedPrompt?: string;
     command?: string;
-    context?: string[] | string[][];
+    context?: string[] | QuickActionCommand[];
 }
 export interface ChatItemAction extends ChatPrompt {
     type?: string;

package/docs/DATAMODEL.md

@@ -868,6 +868,7 @@ type CodeBlockActions = Record<'copy' | 'insert-to-cursor' | string, CodeBlockAc
 
 // ################################# 
 interface ChatItemContent {
+  header?: ChatItemContent | null;
   body?: string | null;
   customRenderer?: string | ChatItemBodyRenderer | ChatItemBodyRenderer[] | null;
   followUp?: {
@@ -884,6 +885,8 @@ interface ChatItemContent {
     rootFolderTitle?: string;
     filePaths?: string[];
     deletedFiles?: string[];
+    collapsedByDefault?: boolean;
+    hideFileCount?: boolean;
     actions?: Record<string, FileNodeAction[]>;
     details?: Record<string, TreeNodeDetails>;
   } | null;
@@ -1075,6 +1078,43 @@ mynahUI.addChatItem('tab-1', {
 
 ---
 
+## `header`
+With this parameter, you can add a `ChatItem` at the top of a ChatItem, before the body, but still within the card itself.
+
+```typescript
+const mynahUI = new MynahUI({
+    tabs: {
+        'tab-1': {
+            ...
+        }
+    }
+});
+
+mynahUI.addChatItem(tabId, {
+  type: ChatItemType.ANSWER,
+  body: `SOME CONTENT`,
+  header: {
+    fileList: { // For example, want to show which file is used to generate that answer
+      rootFolderTitle: undefined,
+      fileTreeTitle: '',
+      filePaths: ['./src/index.ts'],
+      details: {
+        './src/index.ts': {
+          icon: MynahIcons.FILE,
+          description: `SOME DESCRIPTION.`
+        }
+      }
+    }
+  }
+});
+```
+
+<p align="center">
+  <img src="./img/data-model/chatItems/header.png" alt="header" style="max-width:600px; width:100%;border: 1px solid #e0e0e0;">
+</p>
+
+---
+
 ## `body`
 Basically the body of the card. Which you can send a full markdown string. Allows code blocks, links etc. 
 
@@ -1732,6 +1772,8 @@ mynahUI.addChatItem(tabId, {
     deletedFiles: ['src/devfile.yaml'],
     // fileTreeTitle: "Custom file tree card title";
     // rootFolderTitle: "Custom root folder title";
+    // collapsedByDefault: true // Collapse the root folder by default
+    // hideFileCount: true // Hide the file counter next to folders
     actions: {
       'src/App.tsx': [
         {

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@aws/mynah-ui",
     "displayName": "AWS Mynah UI",
-    "version": "4.23.0-beta.4",
+    "version": "4.23.0-beta.6",
     "description": "AWS Toolkit VSCode and Intellij IDE Extension Mynah UI",
     "publisher": "Amazon Web Services",
     "license": "Apache License 2.0",