@gitlab/ui 104.2.0 → 105.0.1

package/dist/components/experimental/duo/chat/duo_chat.js

@@ -1,553 +0,0 @@
-import throttle from 'lodash/throttle';
-import emptySvg from '@gitlab/svgs/dist/illustrations/empty-state/empty-activity-md.svg';
-import GlDropdownItem from '../../../base/dropdown/dropdown_item';
-import GlCard from '../../../base/card/card';
-import GlEmptyState from '../../../regions/empty_state/empty_state';
-import GlButton from '../../../base/button/button';
-import GlAlert from '../../../base/alert/alert';
-import GlFormInputGroup from '../../../base/form/form_input_group/form_input_group';
-import GlFormTextarea from '../../../base/form/form_textarea/form_textarea';
-import GlForm from '../../../base/form/form';
-import GlExperimentBadge from '../../experiment_badge/experiment_badge';
-import { badgeTypes, badgeTypeValidator } from '../../experiment_badge/constants';
-import { SafeHtmlDirective } from '../../../../directives/safe_html/safe_html';
-import { translate } from '../../../../utils/i18n';
-import GlDuoChatLoader from './components/duo_chat_loader/duo_chat_loader';
-import GlDuoChatPredefinedPrompts from './components/duo_chat_predefined_prompts/duo_chat_predefined_prompts';
-import GlDuoChatConversation from './components/duo_chat_conversation/duo_chat_conversation';
-import { CHAT_RESET_MESSAGE, CHAT_INCLUDE_MESSAGE, MESSAGE_MODEL_ROLES, CHAT_CLEAR_MESSAGE } from './constants';
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-/**
- * This component has been migrated to the Duo-UI library (https://gitlab.com/gitlab-org/duo-ui).
- *
- * Please use the corresponding component in Duo-UI going forward.
- * All future development and maintenance for Duo components should take place in Duo-UI.
- *
- * For more details, see the migration epic: https://gitlab.com/groups/gitlab-org/-/epics/15344 or reach out to the Duo-Chat team in #g_duo_chat.
- */
-const i18n = {
-  CHAT_DEFAULT_TITLE: translate('GlDuoChat.chatDefaultTitle', 'GitLab Duo Chat'),
-  CHAT_CLOSE_LABEL: translate('GlDuoChat.chatCloseLabel', 'Close the Code Explanation'),
-  CHAT_EMPTY_STATE_TITLE: translate('GlDuoChat.chatEmptyStateTitle', 'Ask a question'),
-  CHAT_EMPTY_STATE_DESC: translate('GlDuoChat.chatEmptyStateDesc', 'GitLab Duo Chat is your AI-powered assistant.'),
-  CHAT_EMPTY_STATE_SECONDARY_DESC: translate('GlDuoChat.chatEmptyStateSecondaryDesc', 'Responses may be inaccurate. Verify before use.'),
-  CHAT_PROMPT_PLACEHOLDER_DEFAULT: translate('GlDuoChat.chatPromptPlaceholderDefault', 'GitLab Duo Chat'),
-  CHAT_PROMPT_PLACEHOLDER_WITH_COMMANDS: translate('GlDuoChat.chatPromptPlaceholderWithCommands', 'Type /help to learn more'),
-  CHAT_SUBMIT_LABEL: translate('GlDuoChat.chatSubmitLabel', 'Send chat message.'),
-  CHAT_CANCEL_LABEL: translate('GlDuoChat.chatCancelLabel', 'Cancel'),
-  CHAT_DEFAULT_PREDEFINED_PROMPTS: [translate('GlDuoChat.chatDefaultPredefinedPromptsChangePassword', 'How do I change my password in GitLab?'), translate('GlDuoChat.chatDefaultPredefinedPromptsForkProject', 'How do I fork a project?'), translate('GlDuoChat.chatDefaultPredefinedPromptsCloneRepository', 'How do I clone a repository?'), translate('GlDuoChat.chatDefaultPredefinedPromptsCreateTemplate', 'How do I create a template?')]
-};
-const isMessage = item => Boolean(item) && (item === null || item === void 0 ? void 0 : item.role);
-const isSlashCommand = command => Boolean(command) && (command === null || command === void 0 ? void 0 : command.name) && command.description;
-
-// eslint-disable-next-line unicorn/no-array-callback-reference
-const itemsValidator = items => items.every(isMessage);
-// eslint-disable-next-line unicorn/no-array-callback-reference
-const slashCommandsValidator = commands => commands.every(isSlashCommand);
-var script = {
-  name: 'GlDuoChat',
-  components: {
-    GlEmptyState,
-    GlButton,
-    GlAlert,
-    GlFormInputGroup,
-    GlFormTextarea,
-    GlForm,
-    GlExperimentBadge,
-    GlDuoChatLoader,
-    GlDuoChatPredefinedPrompts,
-    GlDuoChatConversation,
-    GlCard,
-    GlDropdownItem
-  },
-  directives: {
-    SafeHtml: SafeHtmlDirective
-  },
-  props: {
-    /**
-     * The title of the chat/feature.
-     */
-    title: {
-      type: String,
-      required: false,
-      default: i18n.CHAT_DEFAULT_TITLE
-    },
-    /**
-     * Array of messages to display in the chat.
-     */
-    messages: {
-      type: Array,
-      required: false,
-      default: () => [],
-      validator: itemsValidator
-    },
-    /**
-     * Array of RequestIds that have been canceled.
-     */
-    canceledRequestIds: {
-      type: Array,
-      required: false,
-      default: () => []
-    },
-    /**
-     * A non-recoverable error message to display in the chat.
-     */
-    error: {
-      type: String,
-      required: false,
-      default: ''
-    },
-    /**
-     * Whether the chat is currently fetching a response from AI.
-     */
-    isLoading: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    /**
-     * Whether the conversational interfaces should be enabled.
-     */
-    isChatAvailable: {
-      type: Boolean,
-      required: false,
-      default: true
-    },
-    /**
-     * Whether the insertCode feature should be available.
-     */
-    enableCodeInsertion: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    /**
-     * Array of predefined prompts to display in the chat to start a conversation.
-     */
-    predefinedPrompts: {
-      type: Array,
-      required: false,
-      default: () => i18n.CHAT_DEFAULT_PREDEFINED_PROMPTS
-    },
-    /**
-     * URL to the help page. This is passed down to the `GlExperimentBadge` component.
-     */
-    badgeHelpPageUrl: {
-      type: String,
-      required: false,
-      default: ''
-    },
-    /**
-     * The type of the badge. This is passed down to the `GlExperimentBadge` component. Refer that component for more information.
-     */
-    badgeType: {
-      type: String || null,
-      required: false,
-      default: badgeTypes[0],
-      validator: badgeTypeValidator
-    },
-    /**
-     * The current tool's name to display in the loading message while waiting for a response from AI. Refer the `GlDuoChatLoader` component for more information.
-     */
-    toolName: {
-      type: String,
-      required: false,
-      default: i18n.CHAT_DEFAULT_TITLE
-    },
-    /**
-     * Array of slash commands to display in the chat.
-     */
-    slashCommands: {
-      type: Array,
-      required: false,
-      default: () => [],
-      validator: slashCommandsValidator
-    },
-    /**
-     * Whether the header should be displayed.
-     */
-    showHeader: {
-      type: Boolean,
-      required: false,
-      default: true
-    },
-    /**
-     * Override the default empty state title text.
-     */
-    emptyStateTitle: {
-      type: String,
-      required: false,
-      default: i18n.CHAT_EMPTY_STATE_TITLE
-    },
-    /**
-     * Override the default empty state description text.
-     */
-    emptyStateDescription: {
-      type: String,
-      required: false,
-      default: i18n.CHAT_EMPTY_STATE_DESC
-    },
-    /**
-     * Override the default empty state description secondary text.
-     */
-    emptyStateSecondaryDescription: {
-      type: String,
-      required: false,
-      default: i18n.CHAT_EMPTY_STATE_SECONDARY_DESC
-    },
-    /**
-     * Override the default chat prompt placeholder text.
-     */
-    chatPromptPlaceholder: {
-      type: String,
-      required: false,
-      default: ''
-    }
-  },
-  data() {
-    return {
-      isHidden: false,
-      prompt: '',
-      scrolledToBottom: true,
-      activeCommandIndex: 0,
-      displaySubmitButton: true,
-      compositionJustEnded: false,
-      contextItemsMenuIsOpen: false,
-      contextItemMenuRef: null
-    };
-  },
-  computed: {
-    withSlashCommands() {
-      return this.slashCommands.length > 0;
-    },
-    hasMessages() {
-      var _this$messages;
-      return ((_this$messages = this.messages) === null || _this$messages === void 0 ? void 0 : _this$messages.length) > 0;
-    },
-    conversations() {
-      if (!this.hasMessages) return [];
-      return this.messages.reduce((acc, message) => {
-        if (message.content === CHAT_RESET_MESSAGE) {
-          acc.push([]);
-        } else {
-          acc[acc.length - 1].push(message);
-        }
-        return acc;
-      }, [[]]);
-    },
-    lastMessage() {
-      var _this$messages2;
-      return (_this$messages2 = this.messages) === null || _this$messages2 === void 0 ? void 0 : _this$messages2[this.messages.length - 1];
-    },
-    caseInsensitivePrompt() {
-      return this.prompt.toLowerCase().trim();
-    },
-    resetDisabled() {
-      var _this$lastMessage;
-      if (this.isLoading || !this.hasMessages) {
-        return true;
-      }
-      return ((_this$lastMessage = this.lastMessage) === null || _this$lastMessage === void 0 ? void 0 : _this$lastMessage.content) === CHAT_RESET_MESSAGE;
-    },
-    isStreaming() {
-      var _this$lastMessage2, _this$lastMessage3, _this$lastMessage3$ch, _this$lastMessage4, _this$lastMessage5;
-      if (this.canceledRequestIds.includes((_this$lastMessage2 = this.lastMessage) === null || _this$lastMessage2 === void 0 ? void 0 : _this$lastMessage2.requestId)) {
-        return false;
-      }
-      return Boolean(((_this$lastMessage3 = this.lastMessage) === null || _this$lastMessage3 === void 0 ? void 0 : (_this$lastMessage3$ch = _this$lastMessage3.chunks) === null || _this$lastMessage3$ch === void 0 ? void 0 : _this$lastMessage3$ch.length) > 0 && !((_this$lastMessage4 = this.lastMessage) !== null && _this$lastMessage4 !== void 0 && _this$lastMessage4.content) || typeof ((_this$lastMessage5 = this.lastMessage) === null || _this$lastMessage5 === void 0 ? void 0 : _this$lastMessage5.chunkId) === 'number');
-    },
-    filteredSlashCommands() {
-      return this.slashCommands.filter(c => c.name.toLowerCase().startsWith(this.caseInsensitivePrompt)).filter(c => {
-        if (c.name === CHAT_INCLUDE_MESSAGE) {
-          return this.hasContextItemSelectionMenu;
-        }
-        return true;
-      });
-    },
-    shouldShowSlashCommands() {
-      if (!this.withSlashCommands || this.contextItemsMenuIsOpen) return false;
-      const startsWithSlash = this.caseInsensitivePrompt.startsWith('/');
-      const startsWithSlashCommand = this.slashCommands.some(c => this.caseInsensitivePrompt.startsWith(c.name));
-      return startsWithSlash && this.filteredSlashCommands.length && !startsWithSlashCommand;
-    },
-    shouldShowContextItemSelectionMenu() {
-      if (!this.hasContextItemSelectionMenu) {
-        return false;
-      }
-      const isSlash = this.caseInsensitivePrompt === '/';
-      if (!this.caseInsensitivePrompt || isSlash) {
-        // if user has removed entire command (or whole command except for '/') we should close context item menu and allow slash command menu to show again
-        return false;
-      }
-      return CHAT_INCLUDE_MESSAGE.startsWith(this.caseInsensitivePrompt);
-    },
-    inputPlaceholder() {
-      if (this.chatPromptPlaceholder) {
-        return this.chatPromptPlaceholder;
-      }
-      return this.withSlashCommands ? i18n.CHAT_PROMPT_PLACEHOLDER_WITH_COMMANDS : i18n.CHAT_PROMPT_PLACEHOLDER_DEFAULT;
-    },
-    hasContextItemSelectionMenu() {
-      return Boolean(this.contextItemMenuRef);
-    }
-  },
-  watch: {
-    isLoading(newVal) {
-      if (!newVal && !this.isStreaming) {
-        this.displaySubmitButton = true; // Re-enable submit button when loading stops
-      }
-      this.isHidden = false;
-    },
-    isStreaming(newVal) {
-      if (!newVal && !this.isLoading) {
-        this.displaySubmitButton = true; // Re-enable submit button when streaming stops
-      }
-    },
-    lastMessage(newMessage) {
-      if (this.scrolledToBottom || newMessage.role.toLowerCase() === MESSAGE_MODEL_ROLES.user) {
-        // only scroll to bottom on new message if the user hasn't explicitly scrolled up to view an earlier message
-        // or if the user has just submitted a new message
-        this.scrollToBottom();
-      }
-    },
-    shouldShowSlashCommands(shouldShow) {
-      if (shouldShow) {
-        this.onShowSlashCommands();
-      }
-    }
-  },
-  created() {
-    this.handleScrollingTrottled = throttle(this.handleScrolling, 200); // Assume a 200ms throttle for example
-  },
-  mounted() {
-    this.scrollToBottom();
-  },
-  methods: {
-    compositionEnd() {
-      this.compositionJustEnded = true;
-    },
-    hideChat() {
-      this.isHidden = true;
-      /**
-       * Emitted when clicking the cross in the title and the chat gets closed.
-       */
-      this.$emit('chat-hidden');
-    },
-    cancelPrompt() {
-      /**
-       * Emitted when user clicks the stop button in the textarea
-       */
-
-      this.displaySubmitButton = true;
-      this.$emit('chat-cancel');
-      this.setPromptAndFocus();
-    },
-    sendChatPrompt() {
-      if (!this.displaySubmitButton || this.contextItemsMenuIsOpen) {
-        return;
-      }
-      if (this.prompt) {
-        if (this.caseInsensitivePrompt === CHAT_RESET_MESSAGE && this.resetDisabled) {
-          return;
-        }
-        if (this.caseInsensitivePrompt.startsWith(CHAT_INCLUDE_MESSAGE) && this.hasContextItemSelectionMenu) {
-          this.contextItemsMenuIsOpen = true;
-          return;
-        }
-        if (![CHAT_RESET_MESSAGE, CHAT_CLEAR_MESSAGE].includes(this.caseInsensitivePrompt)) {
-          this.displaySubmitButton = false;
-        }
-
-        /**
-         * Emitted when a new user prompt should be sent out.
-         *
-         * @param {String} prompt The user prompt to send.
-         */
-        this.$emit('send-chat-prompt', this.prompt.trim());
-        this.setPromptAndFocus();
-      }
-    },
-    sendPredefinedPrompt(prompt) {
-      this.contextItemsMenuIsOpen = false;
-      this.prompt = prompt;
-      this.sendChatPrompt();
-    },
-    handleScrolling(event) {
-      const {
-        scrollTop,
-        offsetHeight,
-        scrollHeight
-      } = event.target;
-      this.scrolledToBottom = scrollTop + offsetHeight >= scrollHeight;
-    },
-    async scrollToBottom() {
-      var _this$$refs$anchor, _this$$refs$anchor$sc;
-      await this.$nextTick();
-      (_this$$refs$anchor = this.$refs.anchor) === null || _this$$refs$anchor === void 0 ? void 0 : (_this$$refs$anchor$sc = _this$$refs$anchor.scrollIntoView) === null || _this$$refs$anchor$sc === void 0 ? void 0 : _this$$refs$anchor$sc.call(_this$$refs$anchor);
-    },
-    focusChatInput() {
-      var _this$$refs$prompt, _this$$refs$prompt$$e;
-      // This method is also called directly by consumers of this component
-      // https://gitlab.com/gitlab-org/gitlab-vscode-extension/-/blob/dae2d4669ab4da327921492a2962beae8a05c290/webviews/vue2/gitlab_duo_chat/src/App.vue#L109
-      (_this$$refs$prompt = this.$refs.prompt) === null || _this$$refs$prompt === void 0 ? void 0 : (_this$$refs$prompt$$e = _this$$refs$prompt.$el) === null || _this$$refs$prompt$$e === void 0 ? void 0 : _this$$refs$prompt$$e.focus();
-    },
-    onTrackFeedback(event) {
-      /**
-       * Notify listeners about the feedback form submission on a response message.
-       * @param {*} event An event, containing the feedback choices and the extended feedback text.
-       */
-      this.$emit('track-feedback', event);
-    },
-    onShowSlashCommands() {
-      /**
-       * Emitted when user opens the slash commands menu
-       */
-      this.$emit('chat-slash');
-    },
-    sendChatPromptOnEnter(e) {
-      const {
-        metaKey,
-        ctrlKey,
-        altKey,
-        shiftKey,
-        isComposing
-      } = e;
-      const isModifierKey = metaKey || ctrlKey || altKey || shiftKey;
-      return !(isModifierKey || isComposing || this.compositionJustEnded);
-    },
-    onInputKeyup(e) {
-      const {
-        key
-      } = e;
-      if (this.contextItemsMenuIsOpen) {
-        var _this$contextItemMenu;
-        if (!this.shouldShowContextItemSelectionMenu) {
-          this.contextItemsMenuIsOpen = false;
-        }
-        (_this$contextItemMenu = this.contextItemMenuRef) === null || _this$contextItemMenu === void 0 ? void 0 : _this$contextItemMenu.handleKeyUp(e);
-        return;
-      }
-      if (this.caseInsensitivePrompt === CHAT_INCLUDE_MESSAGE) {
-        this.contextItemsMenuIsOpen = true;
-        return;
-      }
-      if (this.shouldShowSlashCommands) {
-        e.preventDefault();
-        if (key === 'Enter') {
-          this.selectSlashCommand(this.activeCommandIndex);
-        } else if (key === 'ArrowUp') {
-          this.prevCommand();
-        } else if (key === 'ArrowDown') {
-          this.nextCommand();
-        } else {
-          this.activeCommandIndex = 0;
-        }
-      } else if (key === 'Enter' && this.sendChatPromptOnEnter(e)) {
-        e.preventDefault();
-        this.sendChatPrompt();
-      }
-      this.compositionJustEnded = false;
-    },
-    prevCommand() {
-      this.activeCommandIndex -= 1;
-      this.wrapCommandIndex();
-    },
-    nextCommand() {
-      this.activeCommandIndex += 1;
-      this.wrapCommandIndex();
-    },
-    wrapCommandIndex() {
-      if (this.activeCommandIndex < 0) {
-        this.activeCommandIndex = this.filteredSlashCommands.length - 1;
-      } else if (this.activeCommandIndex >= this.filteredSlashCommands.length) {
-        this.activeCommandIndex = 0;
-      }
-    },
-    async setPromptAndFocus() {
-      let prompt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-      this.prompt = prompt;
-      await this.$nextTick();
-      this.focusChatInput();
-    },
-    selectSlashCommand(index) {
-      const command = this.filteredSlashCommands[index];
-      if (command.shouldSubmit) {
-        this.prompt = command.name;
-        this.sendChatPrompt();
-      } else {
-        this.setPromptAndFocus(`${command.name} `);
-        if (command.name === CHAT_INCLUDE_MESSAGE && this.hasContextItemSelectionMenu) {
-          this.contextItemsMenuIsOpen = true;
-        }
-      }
-    },
-    onInsertCodeSnippet(e) {
-      /**
-       * Emit insert-code-snippet event that clients can use to interact with a suggested code.
-       * @param {*} event An event containing code string in the "detail.code" field.
-       */
-      this.$emit('insert-code-snippet', e);
-    },
-    onGetContextItemContent(event) {
-      /**
-       * Emit get-context-item-content event that tells clients to load the full file content for a selected context item.
-       * The fully hydrated context item should be updated in the chat message context item.
-       * @param {*} event An event containing the message ID and context item to hydrate
-       */
-      this.$emit('get-context-item-content', event);
-    },
-    closeContextItemsMenuOpen() {
-      this.contextItemsMenuIsOpen = false;
-      this.setPromptAndFocus();
-    },
-    setContextItemsMenuRef(ref) {
-      this.contextItemMenuRef = ref;
-    }
-  },
-  i18n,
-  emptySvg
-};
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (!_vm.isHidden)?_c('aside',{staticClass:"markdown-code-block duo-chat-drawer duo-chat gl-bottom-0 gl-max-h-full",attrs:{"id":"chat-component","role":"complementary","data-testid":"chat-component"}},[(_vm.showHeader)?_c('header',{staticClass:"duo-chat-drawer-header duo-chat-drawer-header-sticky gl-z-200 gl-border-0 gl-bg-default !gl-p-0",attrs:{"data-testid":"chat-header"}},[_c('div',{staticClass:"drawer-title gl-flex gl-items-center gl-justify-start gl-p-5"},[_c('h3',{staticClass:"gl-my-0 gl-text-size-h2"},[_vm._v(_vm._s(_vm.title))]),_vm._v(" "),(_vm.badgeType)?_c('gl-experiment-badge',{attrs:{"help-page-url":_vm.badgeHelpPageUrl,"type":_vm.badgeType,"container-id":"chat-component"}}):_vm._e(),_vm._v(" "),_c('gl-button',{staticClass:"gl-ml-auto",attrs:{"category":"tertiary","variant":"default","icon":"close","size":"small","data-testid":"chat-close-button","aria-label":_vm.$options.i18n.CHAT_CLOSE_LABEL},on:{"click":_vm.hideChat}})],1),_vm._v(" "),_vm._t("subheader"),_vm._v(" "),(_vm.error)?_c('gl-alert',{key:"error",staticClass:"!gl-pl-9",attrs:{"dismissible":false,"variant":"danger","role":"alert","data-testid":"chat-error"}},[_c('span',{directives:[{name:"safe-html",rawName:"v-safe-html",value:(_vm.error),expression:"error"}]})]):_vm._e()],2):_vm._e(),_vm._v(" "),_c('div',{staticClass:"duo-chat-drawer-body gl-bg-default",attrs:{"data-testid":"chat-history"},on:{"scroll":_vm.handleScrollingTrottled}},[_c('transition-group',{staticClass:"duo-chat-history gl-flex gl-flex-col gl-justify-end",class:[
-        {
-          'gl-h-full': !_vm.hasMessages,
-          'force-scroll-bar': _vm.hasMessages,
-        } ],attrs:{"tag":"section","name":"message"}},[_vm._l((_vm.conversations),function(conversation,index){return _c('gl-duo-chat-conversation',{key:("conversation-" + index),attrs:{"enable-code-insertion":_vm.enableCodeInsertion,"messages":conversation,"canceled-request-ids":_vm.canceledRequestIds,"show-delimiter":index > 0},on:{"track-feedback":_vm.onTrackFeedback,"insert-code-snippet":_vm.onInsertCodeSnippet,"get-context-item-content":_vm.onGetContextItemContent}})}),_vm._v(" "),(!_vm.hasMessages && !_vm.isLoading)?[_c('gl-empty-state',{key:"empty-state",staticClass:"gl-flex-grow gl-justify-center",attrs:{"svg-path":_vm.$options.emptySvg,"svg-height":145,"title":_vm.emptyStateTitle},scopedSlots:_vm._u([{key:"description",fn:function(){return [_c('p',{staticClass:"gl-mb-3",attrs:{"data-testid":"gl-duo-chat-empty-state-description"}},[_vm._v("\n              "+_vm._s(_vm.emptyStateDescription)+"\n            ")]),_vm._v(" "),_c('p',{staticClass:"gl-mt-3 gl-text-sm gl-text-subtle",attrs:{"data-testid":"gl-duo-chat-empty-state-secondary-description"}},[_vm._v("\n              "+_vm._s(_vm.emptyStateSecondaryDescription)+"\n            ")])]},proxy:true}],null,false,460840487)}),_vm._v(" "),_c('gl-duo-chat-predefined-prompts',{key:"predefined-prompts",attrs:{"prompts":_vm.predefinedPrompts},on:{"click":_vm.sendPredefinedPrompt}})]:_vm._e(),_vm._v(" "),(_vm.isLoading)?_c('gl-duo-chat-loader',{key:"loader",attrs:{"tool-name":_vm.toolName}}):_vm._e(),_vm._v(" "),_c('div',{key:"anchor",ref:"anchor",staticClass:"scroll-anchor"})],2)],1),_vm._v(" "),(_vm.isChatAvailable)?_c('footer',{staticClass:"duo-chat-drawer-footer duo-chat-drawer-footer-sticky gl-border-0 gl-bg-default gl-p-5",class:{ 'duo-chat-drawer-body-scrim-on-footer': !_vm.scrolledToBottom },attrs:{"data-testid":"chat-footer"}},[_c('gl-form',{attrs:{"data-testid":"chat-prompt-form"},on:{"submit":function($event){$event.stopPropagation();$event.preventDefault();return _vm.sendChatPrompt.apply(null, arguments)}}},[_c('div',{staticClass:"gl-relative gl-max-w-full"},[_vm._t("context-items-menu",null,{"isOpen":_vm.contextItemsMenuIsOpen,"onClose":_vm.closeContextItemsMenuOpen,"setRef":_vm.setContextItemsMenuRef,"focusPrompt":_vm.focusChatInput})],2),_vm._v(" "),_c('gl-form-input-group',{scopedSlots:_vm._u([{key:"append",fn:function(){return [(_vm.displaySubmitButton)?_c('gl-button',{staticClass:"!gl-absolute gl-bottom-2 gl-right-2 !gl-rounded-full",attrs:{"icon":"paper-airplane","category":"primary","variant":"confirm","type":"submit","data-testid":"chat-prompt-submit-button","aria-label":_vm.$options.i18n.CHAT_SUBMIT_LABEL}}):_c('gl-button',{staticClass:"!gl-absolute gl-bottom-2 gl-right-2 !gl-rounded-full",attrs:{"icon":"stop","category":"primary","variant":"default","data-testid":"chat-prompt-cancel-button","aria-label":_vm.$options.i18n.CHAT_CANCEL_LABEL},on:{"click":_vm.cancelPrompt}})]},proxy:true}],null,false,608602988)},[_c('div',{staticClass:"duo-chat-input gl-min-h-8 gl-max-w-full gl-grow gl-align-top",attrs:{"data-value":_vm.prompt}},[(_vm.shouldShowSlashCommands)?_c('gl-card',{ref:"commands",staticClass:"slash-commands !gl-absolute gl-w-full -gl-translate-y-full gl-list-none gl-pl-0 gl-shadow-md",attrs:{"body-class":"!gl-p-2"}},_vm._l((_vm.filteredSlashCommands),function(command,index){return _c('gl-dropdown-item',{key:command.name,class:{ 'active-command': index === _vm.activeCommandIndex },on:{"click":function($event){return _vm.selectSlashCommand(index)}},nativeOn:{"mouseenter":function($event){_vm.activeCommandIndex = index;}}},[_c('span',{staticClass:"gl-flex gl-justify-between"},[_c('span',{staticClass:"gl-block"},[_vm._v(_vm._s(command.name))]),_vm._v(" "),_c('small',{staticClass:"gl-pl-3 gl-text-right gl-italic gl-text-subtle"},[_vm._v(_vm._s(command.description))])])])}),1):_vm._e(),_vm._v(" "),_c('gl-form-textarea',{ref:"prompt",staticClass:"gl-absolute !gl-h-full gl-rounded-br-none gl-rounded-tr-none !gl-bg-transparent !gl-py-4 !gl-shadow-none",class:{ 'gl-truncate': !_vm.prompt },attrs:{"data-testid":"chat-prompt-input","placeholder":_vm.inputPlaceholder,"autofocus":""},on:{"compositionend":_vm.compositionEnd},nativeOn:{"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }if($event.ctrlKey||$event.shiftKey||$event.altKey||$event.metaKey){ return null; }$event.preventDefault();},"keyup":function($event){return _vm.onInputKeyup.apply(null, arguments)}},model:{value:(_vm.prompt),callback:function ($$v) {_vm.prompt=$$v;},expression:"prompt"}})],1)])],1)],1):_vm._e()]):_vm._e()};
-var __vue_staticRenderFns__ = [];
-
-  /* style */
-  const __vue_inject_styles__ = undefined;
-  /* scoped */
-  const __vue_scope_id__ = undefined;
-  /* module identifier */
-  const __vue_module_identifier__ = undefined;
-  /* functional template */
-  const __vue_is_functional_template__ = false;
-  /* style inject */
-  
-  /* style inject SSR */
-  
-  /* style inject shadow dom */
-  
-
-  
-  const __vue_component__ = __vue_normalize__(
-    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
-    __vue_inject_styles__,
-    __vue_script__,
-    __vue_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;
-export { i18n };

package/dist/components/experimental/duo/chat/markdown_renderer.js

@@ -1,25 +0,0 @@
-import { Marked } from 'marked';
-import markedBidi from 'marked-bidi';
-
-/**
- * This component has been migrated to the Duo-UI library (https://gitlab.com/gitlab-org/duo-ui).
- *
- * Please use the corresponding component in Duo-UI going forward.
- * All future development and maintenance for Duo components should take place in Duo-UI.
- *
- * For more details, see the migration epic: https://gitlab.com/groups/gitlab-org/-/epics/15344 or reach out to the Duo-Chat team in #g_duo_chat.
- */
-const duoMarked = new Marked([{
-  async: false,
-  breaks: false,
-  gfm: false
-}, markedBidi()]);
-function renderDuoChatMarkdownPreview(md) {
-  try {
-    return md ? duoMarked.parse(md.toString()) : '';
-  } catch {
-    return md;
-  }
-}
-
-export { renderDuoChatMarkdownPreview };