@aws/mynah-ui 4.22.1 → 4.23.0-beta.10

package/dist/components/chat-item/chat-item-card.d.ts

@@ -18,6 +18,7 @@ export declare class ChatItemCard {
     private readonly updateStack;
     private readonly initialSpinner;
     private cardFooter;
+    private cardHeader;
     private informationCard;
     private tabbedCard;
     private cardIcon;
@@ -31,8 +32,10 @@ export declare class ChatItemCard {
     private followUps;
     private votes;
     private footer;
+    private header;
     constructor(props: ChatItemCardProps);
     private readonly getCardFooter;
+    private readonly getCardHeader;
     private readonly generateCard;
     private readonly getCardClasses;
     private readonly updateCardContent;

package/dist/components/chat-item/chat-item-form-items.d.ts

@@ -18,6 +18,7 @@ export declare class ChatItemFormItemsWrapper {
     render: ExtendedHTMLElement;
     constructor(props: ChatItemFormItemsWrapperProps);
     private readonly getValidationHandler;
+    private readonly isItemValid;
     isFormValid: () => boolean;
     disableAll: () => void;
     getAllValues: () => Record<string, string>;

package/dist/components/chat-item/chat-item-tree-view-wrapper.d.ts

@@ -4,6 +4,7 @@
  */
 import { ExtendedHTMLElement } from '../../helper/dom';
 import { FileNodeAction, ReferenceTrackerInformation, TreeNodeDetails } from '../../static';
+import { MynahIcons, MynahIconsType } from '../icon';
 export interface ChatItemTreeViewWrapperProps {
     tabId: string;
     messageId: string;
@@ -12,8 +13,12 @@ export interface ChatItemTreeViewWrapperProps {
     classNames?: string[];
     rootTitle?: string;
     deletedFiles: string[];
+    flatList?: boolean;
+    folderIcon?: MynahIcons | MynahIconsType | null;
     actions?: Record<string, FileNodeAction[]>;
     details?: Record<string, TreeNodeDetails>;
+    hideFileCount?: boolean;
+    collapsed?: boolean;
     referenceSuggestionLabel: string;
     references: ReferenceTrackerInformation[];
 }

package/dist/components/chat-item/chat-item-tree-view.d.ts

@@ -1,17 +1,23 @@
 import { ExtendedHTMLElement } from '../../helper/dom';
 import { TreeNode } from '../../helper/file-tree';
+import { MynahIcons, MynahIconsType } from '../icon';
 export interface ChatItemTreeViewProps {
     node: TreeNode;
     depth?: number;
     tabId: string;
     messageId: string;
+    hideFileCount?: boolean;
+    collapsed?: boolean;
+    folderIcon?: MynahIcons | MynahIconsType | null;
 }
 export declare class ChatItemTreeView {
     private readonly node;
+    private readonly folderIcon;
     private isOpen;
     private readonly depth;
     private readonly tabId;
     private readonly messageId;
+    private readonly hideFileCount;
     render: ExtendedHTMLElement;
     constructor(props: ChatItemTreeViewProps);
     getClassNames(): string[];

package/dist/components/chat-item/chat-prompt-input.d.ts

@@ -20,13 +20,14 @@ export declare class ChatPromptInput {
     private readonly progressIndicator;
     private readonly promptAttachment;
     private readonly chatPrompt;
+    private quickPickItemsSelectorContainer;
     private promptTextInputLabel;
     private remainingCharsOverlay;
     private quickPickTriggerIndex;
     private quickPickType;
-    private textAfter;
     private quickPickItemGroups;
     private filteredQuickPickItemGroups;
+    private searchTerm;
     private quickPick;
     private quickPickOpen;
     private selectedCommand;

package/dist/components/chat-item/prompt-input/prompt-input-quick-pick-item.d.ts

@@ -0,0 +1,13 @@
+import { ExtendedHTMLElement } from '../../../helper/dom';
+import { QuickActionCommand } from '../../../static';
+export interface PromptInputQuickPickItemProps {
+    quickPickItem: QuickActionCommand;
+    onSelect: (quickPickItem: QuickActionCommand) => void;
+}
+export declare class PromptInputQuickPickItem {
+    render: ExtendedHTMLElement;
+    private readonly props;
+    constructor(props: PromptInputQuickPickItemProps);
+    readonly setFocus: (isFocused: boolean) => void;
+    readonly getItem: () => QuickActionCommand;
+}

package/dist/components/chat-item/prompt-input/prompt-input-quick-pick-selector.d.ts

@@ -0,0 +1,18 @@
+import { ExtendedHTMLElement } from '../../../helper/dom';
+import { ChatItemButton, QuickActionCommandGroup, QuickActionCommand } from '../../../static';
+export interface PromptInputQuickPickSelectorProps {
+    quickPickGroupList: QuickActionCommandGroup[];
+    onQuickPickGroupActionClick: (action: ChatItemButton) => void;
+    onQuickPickItemSelect: (quickPickItem: QuickActionCommand) => void;
+}
+export declare class PromptInputQuickPickSelector {
+    render: ExtendedHTMLElement;
+    private readonly props;
+    private activeTargetElementIndex;
+    private allSelectableQuickPickElements;
+    constructor(props: PromptInputQuickPickSelectorProps);
+    private readonly getQuickPickGroups;
+    readonly changeTarget: (direction: 'up' | 'down') => void;
+    readonly getTargetElement: () => QuickActionCommand | null;
+    readonly updateList: (quickPickGroupList: QuickActionCommandGroup[]) => void;
+}

package/dist/components/chat-item/prompt-input/prompt-text-input.d.ts

@@ -1,9 +1,8 @@
 import { ExtendedHTMLElement } from '../../../helper/dom';
+import { QuickActionCommand } from '../../../static';
 export interface PromptTextInputProps {
     tabId: string;
     initMaxLength: number;
-    contextReplacement?: boolean;
-    contextItems?: string[];
     onKeydown: (e: KeyboardEvent) => void;
     onInput?: (e: KeyboardEvent) => void;
     onFocus?: () => void;
@@ -12,33 +11,35 @@ export interface PromptTextInputProps {
 export declare class PromptTextInput {
     render: ExtendedHTMLElement;
     promptTextInputMaxLength: number;
+    private lastCursorIndex;
     private readonly props;
-    private readonly promptTextInputSizer;
     private readonly promptTextInput;
     private promptInputOverlay;
     private keydownSupport;
+    private readonly selectedContext;
+    private contextTooltip;
+    private contextTooltipTimeout;
     constructor(props: PromptTextInputProps);
-    private readonly updatePromptTextInputSizer;
-    readonly setContextReplacement: (contextReplacement: boolean) => void;
+    private readonly updateCursorPos;
+    private readonly checkIsEmpty;
+    private readonly removeContextPlaceholderOverlay;
+    private readonly insertElementToGivenPosition;
+    private readonly moveCursorToEnd;
+    private readonly showContextTooltip;
+    private readonly hideContextTooltip;
+    readonly insertContextItem: (contextItem: QuickActionCommand, position: number) => void;
     readonly getCursorPos: () => number;
-    readonly getWordAndIndexOnCursorPos: () => {
-        wordStartIndex: number;
-        word: string;
-    };
-    readonly getContextElementAtTextIndex: (textIndex: number) => HTMLSpanElement | null;
     readonly clear: () => void;
-    readonly focus: (cursorIndex?: number) => void;
+    readonly focus: () => void;
     readonly blur: () => void;
     readonly getTextInputValue: () => string;
-    readonly updateTextInputValue: (value: string, placeHolder?: {
-        index?: number;
-        text?: string;
-    }) => void;
+    readonly updateTextInputValue: (value: string) => void;
     readonly updateTextInputMaxLength: (maxLength: number) => void;
     readonly updateTextInputPlaceholder: (text: string) => void;
-    readonly updateContextItems: (contextItems: string[]) => void;
+    readonly deleteTextRange: (position: number, endPosition: number) => void;
     readonly getCursorLine: () => {
         cursorLine: number;
         totalLines: number;
     };
+    readonly getUsedContext: () => QuickActionCommand[];
 }

package/dist/components/form-items/radio-group.d.ts

@@ -12,6 +12,7 @@ export interface RadioGroupProps {
     classNames?: string[];
     attributes?: Record<string, string>;
     label?: HTMLElement | ExtendedHTMLElement | string;
+    description?: ExtendedHTMLElement;
     value?: string;
     optional?: boolean;
     options?: SelectOption[];

package/dist/components/form-items/select.d.ts

@@ -14,6 +14,7 @@ export interface SelectProps {
     attributes?: Record<string, string>;
     icon?: MynahIcons;
     label?: HTMLElement | ExtendedHTMLElement | string;
+    description?: ExtendedHTMLElement;
     value?: string;
     optional?: boolean;
     options?: SelectOption[];

package/dist/components/form-items/stars.d.ts

@@ -9,6 +9,7 @@ export interface StarsProps {
     classNames?: string[];
     attributes?: Record<string, string>;
     label?: HTMLElement | ExtendedHTMLElement | string;
+    description?: ExtendedHTMLElement;
     value?: string;
     onChange?: (value: string) => void;
     initStar?: StarValues;

package/dist/components/form-items/text-area.d.ts

@@ -3,12 +3,20 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import { ExtendedHTMLElement } from '../../helper/dom';
+import { ValidationPattern } from '../../static';
 import '../../styles/components/_form-input.scss';
 export interface TextAreaProps {
     classNames?: string[];
     attributes?: Record<string, string>;
     label?: HTMLElement | ExtendedHTMLElement | string;
+    description?: ExtendedHTMLElement;
+    mandatory?: boolean;
+    fireModifierAndEnterKeyPress?: () => void;
     placeholder?: string;
+    validationPatterns?: {
+        operator?: 'and' | 'or';
+        patterns: ValidationPattern[];
+    };
     value?: string;
     onChange?: (value: string) => void;
     testId?: string;
@@ -18,14 +26,19 @@ export declare abstract class TextAreaAbstract {
     setValue: (value: string) => void;
     getValue: () => string;
     setEnabled: (enabled: boolean) => void;
+    checkValidation: () => void;
 }
 export declare class TextAreaInternal extends TextAreaAbstract {
     private readonly inputElement;
+    private readonly validationErrorBlock;
+    private readonly props;
+    private readyToValidate;
     render: ExtendedHTMLElement;
     constructor(props: TextAreaProps);
     setValue: (value: string) => void;
     getValue: () => string;
     setEnabled: (enabled: boolean) => void;
+    checkValidation: () => void;
 }
 export declare class TextArea extends TextAreaAbstract {
     render: ExtendedHTMLElement;
@@ -33,4 +46,5 @@ export declare class TextArea extends TextAreaAbstract {
     setValue: (value: string) => void;
     getValue: () => string;
     setEnabled: (enabled: boolean) => void;
+    checkValidation: () => void;
 }

package/dist/components/form-items/text-input.d.ts

@@ -3,13 +3,21 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import { ExtendedHTMLElement } from '../../helper/dom';
+import { ValidationPattern } from '../../static';
 import '../../styles/components/_form-input.scss';
 export interface TextInputProps {
     classNames?: string[];
     attributes?: Record<string, string>;
     label?: HTMLElement | ExtendedHTMLElement | string;
+    description?: ExtendedHTMLElement;
+    mandatory?: boolean;
+    fireModifierAndEnterKeyPress?: () => void;
     placeholder?: string;
     type?: 'text' | 'number' | 'email';
+    validationPatterns?: {
+        operator?: 'and' | 'or';
+        patterns: ValidationPattern[];
+    };
     value?: string;
     onChange?: (value: string) => void;
     testId?: string;
@@ -19,14 +27,19 @@ export declare abstract class TextInputAbstract {
     setValue: (value: string) => void;
     getValue: () => string;
     setEnabled: (enabled: boolean) => void;
+    checkValidation: () => void;
 }
 export declare class TextInputInternal extends TextInputAbstract {
     private readonly inputElement;
+    private readonly validationErrorBlock;
+    private readonly props;
+    private readyToValidate;
     render: ExtendedHTMLElement;
     constructor(props: TextInputProps);
     setValue: (value: string) => void;
     getValue: () => string;
     setEnabled: (enabled: boolean) => void;
+    checkValidation: () => void;
 }
 export declare class TextInput extends TextInputAbstract {
     render: ExtendedHTMLElement;
@@ -34,4 +47,5 @@ export declare class TextInput extends TextInputAbstract {
     setValue: (value: string) => void;
     getValue: () => string;
     setEnabled: (enabled: boolean) => void;
+    checkValidation: () => void;
 }

package/dist/components/icon.d.ts

@@ -65,8 +65,9 @@ export declare enum MynahIcons {
     TRASH = "trash",
     TRANSFORM = "transform"
 }
+export type MynahIconsType = `${MynahIcons}`;
 export interface IconProps {
-    icon: MynahIcons;
+    icon: MynahIcons | MynahIconsType;
     classNames?: string[];
 }
 export declare class Icon {

package/dist/components/title-description-with-icon.d.ts

@@ -3,12 +3,12 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import { DomBuilderObject, ExtendedHTMLElement } from '../helper/dom';
-import { MynahIcons } from './icon';
+import { MynahIcons, MynahIconsType } from './icon';
 import '../styles/components/_title-description-icon.scss';
 interface TitleDescriptionWithIconProps {
     title?: string | ExtendedHTMLElement | HTMLElement | DomBuilderObject;
     description?: string | ExtendedHTMLElement | HTMLElement | DomBuilderObject;
-    icon?: MynahIcons;
+    icon?: MynahIcons | MynahIconsType;
     testId?: string;
     classNames?: string[];
 }

package/dist/helper/quick-pick-data-handler.d.ts

@@ -0,0 +1,4 @@
+import { QuickActionCommandGroup } from '../static';
+export declare const filterQuickPickItems: (commands: QuickActionCommandGroup[], searchTerm: string) => QuickActionCommandGroup[];
+export declare const MARK_OPEN = "<mark>";
+export declare const MARK_CLOSE = "</mark>";

package/dist/helper/serialize-chat.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Serialize all (non-empty) chat messages in a tab to a markdown string
+ * @param tabId Corresponding tab ID.
+ * @returns The bodies of chat cards in markdown format, separated by \n\n---\n\n
+ */
+export declare const serializeMarkdown: (tabId: string) => string;
+/**
+ * Serialize all (non-empty) chat messages in a tab to an HTML string
+ * @param tabId Corresponding tab ID.
+ * @returns The bodies of chat cards in HTML format
+ */
+export declare const serializeHtml: (tabId: string) => string;

package/dist/helper/test-ids.d.ts

@@ -9,6 +9,7 @@ declare const _default: {
         input: string;
         inputWrapper: string;
         remainingCharsIndicator: string;
+        contextTooltip: string;
         selectedCommand: string;
         quickPicksWrapper: string;
         quickPicksGroup: string;
@@ -59,6 +60,7 @@ declare const _default: {
         chatItemForm: {
             wrapper: string;
             title: string;
+            description: string;
             itemSelectWrapper: string;
             itemSelect: string;
             itemRadioWrapper: string;

package/dist/helper/validator.d.ts

@@ -0,0 +1,19 @@
+/*!
+ * Copyright 2022 Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { ExtendedHTMLElement } from '../main';
+import { ValidationPattern } from '../static';
+export declare const isTextualFormItemValid: (value: string, validationPatterns: {
+    operator?: 'and' | 'or';
+    genericValidationErrorMessage?: string;
+    patterns: ValidationPattern[];
+}, mandatory?: boolean) => {
+    isValid: boolean;
+    validationErrors: string[];
+};
+export declare const isMandatoryItemValid: (value: string) => boolean;
+export declare const checkTextElementValidation: (inputElement: ExtendedHTMLElement, validationPatterns: {
+    operator?: 'and' | 'or';
+    patterns: ValidationPattern[];
+} | undefined, validationErrorBlock: ExtendedHTMLElement, readyToValidate: boolean, mandatory?: boolean) => void;

package/dist/main.d.ts

@@ -2,14 +2,14 @@
  * Copyright 2022 Amazon.com, Inc. or its affiliates. All Rights Reserved.
  * SPDX-License-Identifier: Apache-2.0
  */
-import { RelevancyVoteType, FeedbackPayload, MynahUIDataModel, NotificationType, ChatItem, ChatItemAction, ChatPrompt, MynahUITabStoreModel, MynahUITabStoreTab, ConfigModel, ReferenceTrackerInformation, CodeSelectionType, Engagement, ChatItemFormItem, ChatItemButton, CardRenderDetails, PromptAttachmentType } from './static';
+import { RelevancyVoteType, FeedbackPayload, MynahUIDataModel, NotificationType, ChatItem, ChatItemAction, ChatPrompt, MynahUITabStoreModel, MynahUITabStoreTab, ConfigModel, ReferenceTrackerInformation, CodeSelectionType, Engagement, ChatItemFormItem, ChatItemButton, CardRenderDetails, PromptAttachmentType, QuickActionCommand } from './static';
 import './styles/styles.scss';
 export { generateUID } from './helper/guid';
 export { ChatItemBodyRenderer, } from './helper/dom';
 export { AllowedAttributesInCustomRenderer, AllowedTagsInCustomRenderer } from './helper/sanitize';
 export * from './static';
 export { ToggleOption } from './components/toggle';
-export { MynahIcons } from './components/icon';
+export { MynahIcons, MynahIconsType } from './components/icon';
 export { DomBuilder, DomBuilderObject, ExtendedHTMLElement, } from './helper/dom';
 export { ButtonProps, ButtonAbstract } from './components/button';
 export { RadioGroupProps, RadioGroupAbstract } from './components/form-items/radio-group';
@@ -47,6 +47,7 @@ export interface MynahUIProps {
     onTabbedContentTabChange?: (tabId: string, messageId: string, contentTabId: string, eventId?: string) => void;
     onTabChange?: (tabId: string, eventId?: string) => void;
     onTabAdd?: (tabId: string, eventId?: string) => void;
+    onContextSelected?: (contextItem: QuickActionCommand, tabId: string, eventId?: string) => boolean;
     onTabRemove?: (tabId: string, eventId?: string) => void;
     /**
      * @param tabId tabId which the close button triggered
@@ -68,6 +69,7 @@ export interface MynahUIProps {
     onInfoLinkClick?: (tabId: string, link: string, mouseEvent?: MouseEvent, eventId?: string) => void;
     onFormLinkClick?: (link: string, mouseEvent?: MouseEvent, eventId?: string) => void;
     onSendFeedback?: (tabId: string, feedbackPayload: FeedbackPayload, eventId?: string) => void;
+    onFormModifierEnterPress?: (formData: Record<string, string>, tabId: string, eventId?: string) => void;
     onCustomFormAction?: (tabId: string, action: {
         id: string;
         text?: string;
@@ -80,6 +82,9 @@ export interface MynahUIProps {
     onFileClick?: (tabId: string, filePath: string, deleted: boolean, messageId?: string, eventId?: string) => void;
     onFileActionClick?: (tabId: string, messageId: string, filePath: string, actionName: string, eventId?: string) => void;
     onTabBarButtonClick?: (tabId: string, buttonId: string, eventId?: string) => void;
+    onQuickCommandGroupActionClick?: (tabId: string, action: {
+        id: string;
+    }, eventId?: string) => void;
 }
 export declare class MynahUI {
     private readonly render;
@@ -115,6 +120,12 @@ export declare class MynahUI {
      * @param updateWith ChatItem object to update with.
      */
     updateChatAnswerWithMessageId: (tabId: string, messageId: string, updateWith: Partial<ChatItem>) => void;
+    /**
+     * Serialize all (non-empty) chat messages in a tab into a string
+     * @param tabId Corresponding tab ID.
+     * @param format Whether to serialize to markdown or HTML format
+     */
+    serializeChat: (tabId: string, format: 'markdown' | 'html') => string;
     /**
      * Converts a card to an ANSWER if it is an ANSWER_STREAM
      * @param tabId Corresponding tab ID.
@@ -159,6 +170,7 @@ export declare class MynahUI {
      * @returns string selectedTabId or undefined
      */
     getAllTabs: () => MynahUITabStoreModel;
+    getTabData: (tabId: string) => any;
     /**
      * Toggles the visibility of the splash loader screen
      */