@gitlab/duo-ui 10.23.0 → 11.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,26 @@
1
+ # [11.0.0](https://gitlab.com/gitlab-org/duo-ui/compare/v10.23.1...v11.0.0) (2025-09-18)
2
+
3
+
4
+ ### Features
5
+
6
+ * Introduce Web only component to reduce Agentic Chat ([3e68e06](https://gitlab.com/gitlab-org/duo-ui/commit/3e68e06a1477d274c1bfe98321dee9090be07009))
7
+
8
+
9
+ ### BREAKING CHANGES
10
+
11
+ * Adds web_ prefixed components (WebDuoChat,
12
+ WebAgenticDuoChat, WebDuoChatHeader) with unique translation
13
+ keys to implement the new Chat design for Web platform.
14
+ These components are intended for Web consumption only
15
+ IDE versions remain unchanged.
16
+
17
+ ## [10.23.1](https://gitlab.com/gitlab-org/duo-ui/compare/v10.23.0...v10.23.1) (2025-09-16)
18
+
19
+
20
+ ### Bug Fixes
21
+
22
+ * trigger release pipeline after reverting MR 271 and MR 263 ([514243a](https://gitlab.com/gitlab-org/duo-ui/commit/514243a6e5ccdaff638032e4d7970f80d2c6acd9))
23
+
1
24
  # [10.23.0](https://gitlab.com/gitlab-org/duo-ui/compare/v10.22.1...v10.23.0) (2025-09-13)
2
25
 
3
26
 
@@ -1,5 +1,6 @@
1
1
  import throttle from 'lodash/throttle';
2
- import { GlButton, GlFormTextarea, GlForm, GlCard, GlDropdownItem, GlSafeHtmlDirective } from '@gitlab/ui';
2
+ import VueResizable from 'vue-resizable';
3
+ import { GlButton, GlAlert, GlFormInputGroup, GlFormTextarea, GlForm, GlExperimentBadge, GlCard, GlDropdownItem, GlSafeHtmlDirective } from '@gitlab/ui';
3
4
  import { translate, sprintf, translatePlural } from '@gitlab/ui/dist/utils/i18n';
4
5
  import { badgeTypes, badgeTypeValidator, MAX_PROMPT_LENGTH, PROMPT_LENGTH_WARNING, CHAT_RESET_MESSAGE, CHAT_INCLUDE_MESSAGE, MESSAGE_MODEL_ROLES, CHAT_BASE_COMMANDS } from '../chat/constants';
5
6
  import { VIEW_TYPES } from '../chat/components/duo_chat_header/constants';
@@ -13,10 +14,9 @@ import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
13
14
  const i18n = {
14
15
  CHAT_DEFAULT_TITLE: translate('AgenticDuoChat.chatDefaultTitle', 'GitLab Duo Agentic Chat'),
15
16
  CHAT_HISTORY_TITLE: translate('AgenticDuoChat.chatHistoryTitle', 'Chat history'),
16
- CHAT_DISCLAMER: translate('AgenticDuoChat.chatDisclamer', 'Responses may be inaccurate. Verify before use.'),
17
+ CHAT_DISCLAMER: translate('AgenticDuoChat.chatDisclamer', 'Chat can autonomously change code. Responses and changes can be inaccurate. Review carefully.'),
17
18
  CHAT_EMPTY_STATE_TITLE: translate('AgenticDuoChat.chatEmptyStateTitle', '👋 I am GitLab Duo Agentic Chat, your personal AI-powered assistant. How can I help you today?'),
18
- CHAT_PROMPT_PLACEHOLDER_DEFAULT: translate('AgenticDuoChat.chatPromptPlaceholderDefault', "Let's work through this together..."),
19
- CHAT_MODEL_PLACEHOLDER: translate('AgenticDuoChat.chatModelPlaceholder', 'GitLab Duo Agentic Chat'),
19
+ CHAT_PROMPT_PLACEHOLDER_DEFAULT: translate('AgenticDuoChat.chatPromptPlaceholderDefault', 'GitLab Duo Agentic Chat'),
20
20
  CHAT_PROMPT_PLACEHOLDER_WITH_COMMANDS: translate('AgenticDuoChat.chatPromptPlaceholderWithCommands', 'Type /help to learn more'),
21
21
  CHAT_SUBMIT_LABEL: translate('AgenticDuoChat.chatSubmitLabel', 'Send chat message.'),
22
22
  CHAT_CANCEL_LABEL: translate('AgenticDuoChat.chatCancelLabel', 'Cancel'),
@@ -45,15 +45,19 @@ var script = {
45
45
  name: 'DuoChat',
46
46
  components: {
47
47
  GlButton,
48
+ GlAlert,
49
+ GlFormInputGroup,
48
50
  GlFormTextarea,
49
51
  GlForm,
52
+ GlExperimentBadge,
50
53
  DuoChatLoader,
51
54
  DuoChatPredefinedPrompts,
52
55
  DuoChatConversation,
53
56
  DuoChatHeader,
54
57
  DuoChatThreads,
55
58
  GlCard,
56
- GlDropdownItem
59
+ GlDropdownItem,
60
+ VueResizable
57
61
  },
58
62
  directives: {
59
63
  SafeHtml: GlSafeHtmlDirective
@@ -279,6 +283,7 @@ var script = {
279
283
  },
280
284
  data() {
281
285
  return {
286
+ isHidden: false,
282
287
  prompt: '',
283
288
  scrolledToBottom: true,
284
289
  activeCommandIndex: 0,
@@ -382,6 +387,7 @@ var script = {
382
387
  if (!loading && !this.isStreaming) {
383
388
  this.canSubmit = true; // Re-enable submit button when loading stops
384
389
  }
390
+ this.isHidden = false;
385
391
  },
386
392
  isStreaming(streaming) {
387
393
  if (!streaming && !this.isLoading) {
@@ -420,10 +426,14 @@ var script = {
420
426
  this.focusChatInput();
421
427
  });
422
428
  },
429
+ updateSize(e) {
430
+ this.$emit('chat-resize', e);
431
+ },
423
432
  compositionEnd() {
424
433
  this.compositionJustEnded = true;
425
434
  },
426
435
  hideChat() {
436
+ this.isHidden = true;
427
437
  /**
428
438
  * Emitted when clicking the cross in the title and the chat gets closed.
429
439
  */
@@ -677,19 +687,28 @@ var script = {
677
687
  const __vue_script__ = script;
678
688
 
679
689
  /* template */
680
- var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"markdown-code-block duo-chat gl-bottom-0 gl-flex gl-max-h-full gl-flex-col",attrs:{"id":"chat-component","role":"complementary","data-testid":"chat-component"}},[(_vm.showHeader)?_c('duo-chat-header',{ref:"header",attrs:{"active-thread-id":_vm.activeThreadId,"title":_vm.isMultithreaded && _vm.currentView === 'list' ? _vm.$options.i18n.CHAT_HISTORY_TITLE : _vm.title,"subtitle":_vm.activeThreadTitleForView,"error":_vm.error,"is-multithreaded":_vm.isMultithreaded,"current-view":_vm.currentView,"should-render-resizable":_vm.shouldRenderResizable,"badge-type":_vm.isMultithreaded ? null : _vm.badgeType,"session-id":_vm.sessionId,"agents":_vm.agents},on:{"go-back":_vm.onGoBack,"new-chat":_vm.onNewChat,"close":_vm.hideChat},scopedSlots:_vm._u([{key:"subheader",fn:function(){return [_vm._t("subheader")]},proxy:true}],null,true)}):_vm._e(),_vm._v(" "),_c('div',{staticClass:"gl-flex gl-flex-1 gl-flex-grow gl-flex-col gl-overflow-y-auto gl-overscroll-contain gl-bg-inherit",attrs:{"data-testid":"chat-history"},on:{"scroll":_vm.handleScrollingThrottled}},[(_vm.shouldShowThreadList)?_c('duo-chat-threads',{attrs:{"threads":_vm.threadList,"preferred-locale":_vm.preferredLocale},on:{"new-chat":_vm.onNewChat,"select-thread":_vm.onSelectThread,"delete-thread":_vm.onDeleteThread,"close":_vm.hideChat}}):_c('transition-group',{staticClass:"duo-chat-history gl-mt-auto gl-p-5",attrs:{"mode":"out-in","tag":"section","name":"message"}},[_vm._l((_vm.conversations),function(conversation,index){return _c('duo-chat-conversation',{key:("conversation-" + index),attrs:{"enable-code-insertion":_vm.enableCodeInsertion,"messages":conversation,"show-delimiter":index > 0,"with-feedback":_vm.withFeedback,"is-tool-approval-processing":_vm.isToolApprovalProcessing,"working-directory":_vm.workingDirectory},on:{"track-feedback":_vm.onTrackFeedback,"insert-code-snippet":_vm.onInsertCodeSnippet,"copy-code-snippet":_vm.onCopyCodeSnippet,"copy-message":_vm.onCopyMessage,"get-context-item-content":_vm.onGetContextItemContent,"approve-tool":_vm.onApproveToolCall,"deny-tool":_vm.onDenyToolCall,"open-file-path":_vm.onOpenFilePath}})}),_vm._v(" "),(!_vm.hasMessages && !_vm.isLoading)?[_c('div',{key:"empty-state-message",staticClass:"duo-chat-message gl-rounded-bl-none gl-leading-20 gl-text-gray-900 gl-break-anywhere",attrs:{"data-testid":"gl-duo-chat-empty-state"}},[(_vm.emptyStateTitle)?_c('p',{staticClass:"gl-m-0",attrs:{"data-testid":"gl-duo-chat-empty-state-title"}},[_vm._v("\n "+_vm._s(_vm.emptyStateTitle)+"\n ")]):_vm._e(),_vm._v(" "),_c('duo-chat-predefined-prompts',{key:"predefined-prompts",attrs:{"prompts":_vm.predefinedPrompts},on:{"click":_vm.sendPredefinedPrompt}})],1)]:_vm._e(),_vm._v(" "),(_vm.isLoading)?_c('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 && !_vm.shouldShowThreadList)?_c('footer',{staticClass:"duo-chat-drawer-footer gl-relative gl-z-2 gl-shrink-0 gl-border-0 gl-bg-default gl-pb-3",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('div',{staticClass:"duo-chat-input gl-min-h-8 gl-max-w-full gl-grow gl-flex-col gl-rounded-bl-[12px] gl-rounded-br-[18px] gl-rounded-tl-[12px] gl-rounded-tr-[12px] gl-align-top"},[_c('div',{staticClass:"gl-flex gl-justify-between gl-border-0 gl-border-b-1 gl-border-solid gl-border-[#DCDCDE] gl-px-4 gl-py-4"},[_c('div',[_vm._v(_vm._s(_vm.$options.i18n.CHAT_MODEL_PLACEHOLDER))]),_vm._v(" "),_c('div',[_vm._t("agentic-switch")],2)]),_vm._v(" "),_c('div',{staticClass:"gl-h-[40px] gl-grow",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",attrs:{"disabled":!_vm.canSubmit,"data-testid":"chat-prompt-input","placeholder":_vm.inputPlaceholder,"character-count-limit":_vm.maxPromptLength,"textarea-classes":[
681
- '!gl-h-full',
682
- '!gl-bg-transparent',
683
- '!gl-py-4',
684
- '!gl-shadow-none',
685
- 'form-control',
686
- 'gl-form-input',
687
- 'gl-form-textarea',
688
- { 'gl-truncate': !_vm.prompt } ],"aria-label":"Chat prompt input","autofocus":""},on:{"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"z",undefined,$event.key,undefined)){ return null; }if(!$event.ctrlKey){ return null; }if($event.shiftKey||$event.altKey||$event.metaKey){ return null; }return _vm.handleUndo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"z",undefined,$event.key,undefined)){ return null; }if(!$event.metaKey){ return null; }if($event.ctrlKey||$event.shiftKey||$event.altKey){ return null; }return _vm.handleUndo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"z",undefined,$event.key,undefined)){ return null; }if(!$event.ctrlKey){ return null; }if(!$event.shiftKey){ return null; }if($event.altKey||$event.metaKey){ return null; }return _vm.handleRedo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"z",undefined,$event.key,undefined)){ return null; }if(!$event.metaKey){ return null; }if(!$event.shiftKey){ return null; }if($event.ctrlKey||$event.altKey){ return null; }return _vm.handleRedo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"y",undefined,$event.key,undefined)){ return null; }if(!$event.ctrlKey){ return null; }if($event.shiftKey||$event.altKey||$event.metaKey){ return null; }return _vm.handleRedo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"y",undefined,$event.key,undefined)){ return null; }if(!$event.metaKey){ return null; }if($event.ctrlKey||$event.shiftKey||$event.altKey){ return null; }return _vm.handleRedo.apply(null, arguments)}],"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)}},scopedSlots:_vm._u([{key:"remaining-character-count-text",fn:function(ref){
689
- var count = ref.count;
690
- return [(count <= _vm.promptLengthWarningCount)?_c('span',{staticClass:"gl-absolute gl-bottom-[-25px] gl-right-px gl-pr-3"},[_vm._v("\n "+_vm._s(_vm.remainingCharacterCountMessage(count))+"\n ")]):_vm._e()]}},{key:"character-count-over-limit-text",fn:function(ref){
691
- var count = ref.count;
692
- return [_c('span',{staticClass:"gl-absolute gl-bottom-[-25px] gl-right-px gl-pr-3"},[_vm._v(_vm._s(_vm.overLimitCharacterCountMessage(count)))])]}}],null,false,839584904),model:{value:(_vm.prompt),callback:function ($$v) {_vm.prompt=$$v;},expression:"prompt"}})],1),_vm._v(" "),_c('div',{staticClass:"gl-flex gl-justify-end gl-px-3 gl-pb-3"},[(_vm.canSubmit)?_c('gl-button',{staticClass:"gl-bottom-2 gl-right-2 gl-ml-auto !gl-rounded-full",attrs:{"icon":"paper-airplane","category":"primary","variant":"confirm","type":"submit","disabled":_vm.isPromptEmpty || !_vm.hasValidPrompt,"data-testid":"chat-prompt-submit-button","aria-label":_vm.$options.i18n.CHAT_SUBMIT_LABEL}}):_c('gl-button',{staticClass:"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}})],1)])]),_vm._v(" "),_vm._t("footer-controls"),_vm._v(" "),_c('p',{staticClass:"gl-mb-0 gl-mt-3 gl-px-4 gl-text-sm gl-text-secondary",class:{ 'gl-mt-6 sm:gl-mt-3 sm:gl-max-w-1/2': _vm.prompt.length >= _vm.maxPromptLengthWarning }},[_vm._v("\n "+_vm._s(_vm.$options.i18n.CHAT_DISCLAMER)+"\n ")])],2):_vm._e()],1)};
690
+ var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c(_vm.shouldRenderResizable ? 'vue-resizable' : 'div',{tag:"component",class:{
691
+ 'duo-chat-resizable': _vm.shouldRenderResizable,
692
+ 'non-resizable-wrapper': !_vm.shouldRenderResizable,
693
+ },attrs:{"width":_vm.shouldRenderResizable ? _vm.dimensions.width : null,"height":_vm.shouldRenderResizable ? _vm.dimensions.height : null,"max-width":_vm.shouldRenderResizable ? _vm.dimensions.maxWidth : null,"max-height":_vm.shouldRenderResizable ? _vm.dimensions.maxHeight : null,"min-width":_vm.shouldRenderResizable ? _vm.dimensions.minWidth : null,"left":_vm.shouldRenderResizable ? _vm.dimensions.left : null,"top":_vm.shouldRenderResizable ? _vm.dimensions.top : null,"fit-parent":true,"min-height":_vm.shouldRenderResizable ? _vm.dimensions.minHeight : null,"active":_vm.shouldRenderResizable ? ['l', 't', 'lt'] : null},on:{"resize:end":_vm.updateSize}},[(!_vm.isHidden)?_c('aside',{staticClass:"markdown-code-block duo-chat gl-bottom-0 gl-flex gl-max-h-full gl-flex-col",class:{
694
+ 'resizable-content': _vm.shouldRenderResizable,
695
+ 'duo-chat-drawer': !_vm.shouldRenderResizable,
696
+ },attrs:{"id":"chat-component","role":"complementary","data-testid":"chat-component"}},[(_vm.showHeader)?_c('duo-chat-header',{ref:"header",attrs:{"active-thread-id":_vm.activeThreadId,"title":_vm.isMultithreaded && _vm.currentView === 'list' ? _vm.$options.i18n.CHAT_HISTORY_TITLE : _vm.title,"subtitle":_vm.activeThreadTitleForView,"error":_vm.error,"is-multithreaded":_vm.isMultithreaded,"current-view":_vm.currentView,"should-render-resizable":_vm.shouldRenderResizable,"badge-type":_vm.isMultithreaded ? null : _vm.badgeType,"session-id":_vm.sessionId,"agents":_vm.agents},on:{"go-back":_vm.onGoBack,"new-chat":_vm.onNewChat,"close":_vm.hideChat},scopedSlots:_vm._u([{key:"subheader",fn:function(){return [_vm._t("subheader")]},proxy:true}],null,true)}):_vm._e(),_vm._v(" "),_c('div',{staticClass:"gl-flex gl-flex-1 gl-flex-grow gl-flex-col gl-overflow-y-auto gl-overscroll-contain gl-bg-inherit",attrs:{"data-testid":"chat-history"},on:{"scroll":_vm.handleScrollingThrottled}},[(_vm.shouldShowThreadList)?_c('duo-chat-threads',{attrs:{"threads":_vm.threadList,"preferred-locale":_vm.preferredLocale},on:{"new-chat":_vm.onNewChat,"select-thread":_vm.onSelectThread,"delete-thread":_vm.onDeleteThread,"close":_vm.hideChat}}):_c('transition-group',{staticClass:"duo-chat-history gl-mt-auto gl-p-5",attrs:{"mode":"out-in","tag":"section","name":"message"}},[_vm._l((_vm.conversations),function(conversation,index){return _c('duo-chat-conversation',{key:("conversation-" + index),attrs:{"enable-code-insertion":_vm.enableCodeInsertion,"messages":conversation,"show-delimiter":index > 0,"with-feedback":_vm.withFeedback,"is-tool-approval-processing":_vm.isToolApprovalProcessing,"working-directory":_vm.workingDirectory},on:{"track-feedback":_vm.onTrackFeedback,"insert-code-snippet":_vm.onInsertCodeSnippet,"copy-code-snippet":_vm.onCopyCodeSnippet,"copy-message":_vm.onCopyMessage,"get-context-item-content":_vm.onGetContextItemContent,"approve-tool":_vm.onApproveToolCall,"deny-tool":_vm.onDenyToolCall,"open-file-path":_vm.onOpenFilePath}})}),_vm._v(" "),(!_vm.hasMessages && !_vm.isLoading)?[_c('div',{key:"empty-state-message",staticClass:"duo-chat-message gl-rounded-bl-none gl-leading-20 gl-text-gray-900 gl-break-anywhere",attrs:{"data-testid":"gl-duo-chat-empty-state"}},[(_vm.emptyStateTitle)?_c('p',{staticClass:"gl-m-0",attrs:{"data-testid":"gl-duo-chat-empty-state-title"}},[_vm._v("\n "+_vm._s(_vm.emptyStateTitle)+"\n ")]):_vm._e(),_vm._v(" "),_c('duo-chat-predefined-prompts',{key:"predefined-prompts",attrs:{"prompts":_vm.predefinedPrompts},on:{"click":_vm.sendPredefinedPrompt}})],1)]:_vm._e(),_vm._v(" "),(_vm.isLoading)?_c('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 && !_vm.shouldShowThreadList)?_c('footer',{staticClass:"duo-chat-drawer-footer gl-relative gl-z-2 gl-shrink-0 gl-border-0 gl-bg-default gl-pb-3",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.canSubmit)?_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","disabled":_vm.isPromptEmpty || !_vm.hasValidPrompt,"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,2030360392)},[_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",attrs:{"disabled":!_vm.canSubmit,"data-testid":"chat-prompt-input","placeholder":_vm.inputPlaceholder,"character-count-limit":_vm.maxPromptLength,"textarea-classes":[
697
+ 'gl-absolute',
698
+ '!gl-h-full',
699
+ 'gl-rounded-br-none',
700
+ 'gl-rounded-tr-none',
701
+ '!gl-bg-transparent',
702
+ '!gl-py-4',
703
+ '!gl-shadow-none',
704
+ 'form-control',
705
+ 'gl-form-input',
706
+ 'gl-form-textarea',
707
+ { 'gl-truncate': !_vm.prompt } ],"aria-label":"Chat prompt input","autofocus":""},on:{"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"z",undefined,$event.key,undefined)){ return null; }if(!$event.ctrlKey){ return null; }if($event.shiftKey||$event.altKey||$event.metaKey){ return null; }return _vm.handleUndo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"z",undefined,$event.key,undefined)){ return null; }if(!$event.metaKey){ return null; }if($event.ctrlKey||$event.shiftKey||$event.altKey){ return null; }return _vm.handleUndo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"z",undefined,$event.key,undefined)){ return null; }if(!$event.ctrlKey){ return null; }if(!$event.shiftKey){ return null; }if($event.altKey||$event.metaKey){ return null; }return _vm.handleRedo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"z",undefined,$event.key,undefined)){ return null; }if(!$event.metaKey){ return null; }if(!$event.shiftKey){ return null; }if($event.ctrlKey||$event.altKey){ return null; }return _vm.handleRedo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"y",undefined,$event.key,undefined)){ return null; }if(!$event.ctrlKey){ return null; }if($event.shiftKey||$event.altKey||$event.metaKey){ return null; }return _vm.handleRedo.apply(null, arguments)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"y",undefined,$event.key,undefined)){ return null; }if(!$event.metaKey){ return null; }if($event.ctrlKey||$event.shiftKey||$event.altKey){ return null; }return _vm.handleRedo.apply(null, arguments)}],"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)}},scopedSlots:_vm._u([{key:"remaining-character-count-text",fn:function(ref){
708
+ var count = ref.count;
709
+ return [(count <= _vm.promptLengthWarningCount)?_c('span',{staticClass:"gl-absolute gl-bottom-[-25px] gl-right-px gl-pr-3"},[_vm._v("\n "+_vm._s(_vm.remainingCharacterCountMessage(count))+"\n ")]):_vm._e()]}},{key:"character-count-over-limit-text",fn:function(ref){
710
+ var count = ref.count;
711
+ return [_c('span',{staticClass:"gl-absolute gl-bottom-[-25px] gl-right-px gl-pr-3"},[_vm._v(_vm._s(_vm.overLimitCharacterCountMessage(count)))])]}}],null,false,578626568),model:{value:(_vm.prompt),callback:function ($$v) {_vm.prompt=$$v;},expression:"prompt"}})],1)])],1),_vm._v(" "),_vm._t("footer-controls"),_vm._v(" "),_c('p',{staticClass:"gl-mb-0 gl-mt-3 gl-px-4 gl-text-sm gl-text-secondary",class:{ 'gl-mt-6 sm:gl-mt-3 sm:gl-max-w-1/2': _vm.prompt.length >= _vm.maxPromptLengthWarning }},[_vm._v("\n "+_vm._s(_vm.$options.i18n.CHAT_DISCLAMER)+"\n ")])],2):_vm._e()],1):_vm._e()])};
693
712
  var __vue_staticRenderFns__ = [];
694
713
 
695
714
  /* style */