@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 +23 -0
- package/dist/components/agentic_chat/agentic_duo_chat.js +37 -18
- package/dist/components/agentic_chat/web_agentic_duo_chat.js +725 -0
- package/dist/components/chat/components/duo_chat_header/duo_chat_header.js +4 -4
- package/dist/components/chat/components/duo_chat_header/web_duo_chat_header.js +161 -0
- package/dist/components/chat/duo_chat.js +54 -35
- package/dist/components/chat/web_duo_chat.js +658 -0
- package/dist/components/ui/duo_layout/duo_layout.js +1 -1
- package/dist/components.css +1 -1
- package/dist/components.css.map +1 -1
- package/dist/index.js +3 -1
- package/dist/tailwind.css +1 -1
- package/dist/tailwind.css.map +1 -1
- package/package.json +1 -1
- package/src/components/agentic_chat/agentic_duo_chat.vue +244 -210
- package/src/components/agentic_chat/web_agentic_duo_chat.vue +978 -0
- package/src/components/chat/components/duo_chat_header/duo_chat_header.vue +22 -24
- package/src/components/chat/components/duo_chat_header/web_duo_chat_header.vue +274 -0
- package/src/components/chat/duo_chat.scss +2 -1
- package/src/components/chat/duo_chat.vue +238 -214
- package/src/components/chat/web_duo_chat.vue +891 -0
- package/src/components/ui/duo_layout/duo_layout.vue +2 -2
- package/src/index.js +5 -2
- package/translations.js +46 -5
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import Vue from 'vue';
|
|
2
|
-
import { GlToast, GlAlert, GlBadge,
|
|
2
|
+
import { GlToast, GlAlert, GlBadge, GlButton, GlDropdown, GlDropdownItem, GlExperimentBadge, GlDisclosureDropdown, GlSafeHtmlDirective, GlTooltipDirective } from '@gitlab/ui';
|
|
3
3
|
import { translate } from '../../../../utils/i18n';
|
|
4
4
|
import { VIEW_TYPES } from './constants';
|
|
5
5
|
import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
|
|
@@ -23,10 +23,10 @@ var script = {
|
|
|
23
23
|
components: {
|
|
24
24
|
GlAlert,
|
|
25
25
|
GlBadge,
|
|
26
|
-
GlAvatar,
|
|
27
26
|
GlButton,
|
|
28
27
|
GlDropdown,
|
|
29
28
|
GlDropdownItem,
|
|
29
|
+
GlExperimentBadge,
|
|
30
30
|
GlDisclosureDropdown
|
|
31
31
|
},
|
|
32
32
|
directives: {
|
|
@@ -121,11 +121,11 @@ var script = {
|
|
|
121
121
|
const __vue_script__ = script;
|
|
122
122
|
|
|
123
123
|
/* template */
|
|
124
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('header',{staticClass:"gl-border-b gl-shrink-0 gl-bg-default gl-p-0",attrs:{"data-testid":"chat-header"}},[_c('div',{staticClass:"
|
|
124
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('header',{staticClass:"gl-border-b gl-shrink-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('div',{staticClass:"gl-flex-1 gl-overflow-hidden"},[_c('div',{staticClass:"gl-flex gl-items-center"},[_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:{"type":_vm.badgeType,"container-id":"chat-component"}}):_vm._e()],1),_vm._v(" "),(_vm.subtitle)?_c('h4',{staticClass:"gl-mb-0 gl-overflow-hidden gl-text-ellipsis gl-whitespace-nowrap gl-pr-3 gl-text-sm gl-font-normal gl-text-subtle",attrs:{"data-testid":"chat-subtitle"}},[_vm._v("\n "+_vm._s(_vm.subtitle)+"\n ")]):_vm._e()]),_vm._v(" "),_c('div',{staticClass:"gl-flex gl-gap-3"},[(
|
|
125
125
|
_vm.isMultithreaded && (_vm.activeThreadId || _vm.currentView === _vm.VIEW_TYPES.LIST || _vm.hasManyAgents)
|
|
126
126
|
)?[(_vm.hasManyAgents)?_c('gl-disclosure-dropdown',{attrs:{"title":_vm.$options.i18n.CHAT_NEW_TOOLTIP,"toggle-text":_vm.$options.i18n.CHAT_NEW_TOOLTIP,"items":_vm.agents,"data-testid":"chat-new-button","variant":"confirm","category":"tertiary","size":"small","icon":"duo-chat-new","text-sr-only":"","aria-label":_vm.$options.i18n.CHAT_NEW_LABEL,"no-caret":""},on:{"action":_vm.startNewChat},scopedSlots:_vm._u([{key:"list-item",fn:function(ref){
|
|
127
127
|
var item = ref.item;
|
|
128
|
-
return [_c('span',{staticClass:"gl-flex gl-flex-col"},[_c('span',{attrs:{"clas":"gl-block"}},[_vm._v(_vm._s(item.name))]),_vm._v(" "),_c('span',{staticClass:"gl-overflow-hidden gl-text-ellipsis gl-whitespace-nowrap gl-text-sm"},[_vm._v(_vm._s(item.description))])])]}}],null,false,117082970)}):_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_NEW_TOOLTIP,"data-testid":"chat-new-button","variant":"confirm","category":"tertiary","size":"small","icon":"duo-chat-new","aria-label":_vm.$options.i18n.CHAT_NEW_LABEL},on:{"click":_vm.startNewChat}})]:_vm._e(),_vm._v(" "),(_vm.isMultithreaded && _vm.currentView === _vm.VIEW_TYPES.CHAT)?_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_HISTORY_TOOLTIP,"data-testid":"go-back-to-list-button","category":"tertiary","size":"small","icon":"history","aria-label":_vm.$options.i18n.CHAT_BACK_LABEL},on:{"click":function($event){return _vm.$emit('go-back')}}}):_vm._e(),_vm._v(" "),(_vm.isMultithreaded && _vm.activeThreadId && _vm.currentView === _vm.VIEW_TYPES.LIST)?_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_BACK_TO_CHAT_TOOLTIP,"data-testid":"go-back-to-chat-button","category":"tertiary","size":"small","icon":"go-back","aria-label":_vm.$options.i18n.CHAT_BACK_TO_CHAT_TOOLTIP},on:{"click":function($event){return _vm.$emit('go-back-to-chat')}}}):_vm._e(),_vm._v(" "),(_vm.sessionId)?_c('gl-dropdown',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip.hover",modifiers:{"hover":true}}],attrs:{"icon":"ellipsis_v","category":"tertiary","text-sr-only":"","size":"small","text":_vm.$options.i18n.CHAT_DROPDOWN_MORE_OPTIONS,"title":_vm.$options.i18n.CHAT_DROPDOWN_MORE_OPTIONS,"no-caret":""}},[_c('gl-dropdown-item',{on:{"click":function($event){return _vm.copySessionIdToClipboard()}}},[_c('span',{staticClass:"gl-flex gl-items-center gl-gap-2"},[_c('span',{staticClass:"gl-flex-shrink-0"},[_vm._v(_vm._s(_vm.$options.i18n.CHAT_COPY_TOOLTIP))]),_vm._v(" "),_c('gl-badge',{staticClass:"gl-flex-shrink"},[_c('span',{staticClass:"gl-max-w-12 gl-truncate",attrs:{"title":_vm.sessionId}},[_vm._v("\n "+_vm._s(_vm.sessionId)+"\n ")])])],1)])],1):_vm._e()],2)]),_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)};
|
|
128
|
+
return [_c('span',{staticClass:"gl-flex gl-flex-col"},[_c('span',{attrs:{"clas":"gl-block"}},[_vm._v(_vm._s(item.name))]),_vm._v(" "),_c('span',{staticClass:"gl-overflow-hidden gl-text-ellipsis gl-whitespace-nowrap gl-text-sm"},[_vm._v(_vm._s(item.description))])])]}}],null,false,117082970)}):_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_NEW_TOOLTIP,"data-testid":"chat-new-button","variant":"confirm","category":"tertiary","size":"small","icon":"duo-chat-new","aria-label":_vm.$options.i18n.CHAT_NEW_LABEL},on:{"click":_vm.startNewChat}})]:_vm._e(),_vm._v(" "),(_vm.isMultithreaded && _vm.currentView === _vm.VIEW_TYPES.CHAT)?_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_HISTORY_TOOLTIP,"data-testid":"go-back-to-list-button","category":"tertiary","size":"small","icon":"history","aria-label":_vm.$options.i18n.CHAT_BACK_LABEL},on:{"click":function($event){return _vm.$emit('go-back')}}}):_vm._e(),_vm._v(" "),(_vm.isMultithreaded && _vm.activeThreadId && _vm.currentView === _vm.VIEW_TYPES.LIST)?_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_BACK_TO_CHAT_TOOLTIP,"data-testid":"go-back-to-chat-button","category":"tertiary","size":"small","icon":"go-back","aria-label":_vm.$options.i18n.CHAT_BACK_TO_CHAT_TOOLTIP},on:{"click":function($event){return _vm.$emit('go-back-to-chat')}}}):_vm._e(),_vm._v(" "),(_vm.sessionId)?_c('gl-dropdown',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip.hover",modifiers:{"hover":true}}],attrs:{"icon":"ellipsis_v","category":"tertiary","text-sr-only":"","size":"small","text":_vm.$options.i18n.CHAT_DROPDOWN_MORE_OPTIONS,"title":_vm.$options.i18n.CHAT_DROPDOWN_MORE_OPTIONS,"no-caret":""}},[_c('gl-dropdown-item',{on:{"click":function($event){return _vm.copySessionIdToClipboard()}}},[_c('span',{staticClass:"gl-flex gl-items-center gl-gap-2"},[_c('span',{staticClass:"gl-flex-shrink-0"},[_vm._v(_vm._s(_vm.$options.i18n.CHAT_COPY_TOOLTIP))]),_vm._v(" "),_c('gl-badge',{staticClass:"gl-flex-shrink"},[_c('span',{staticClass:"gl-max-w-12 gl-truncate",attrs:{"title":_vm.sessionId}},[_vm._v("\n "+_vm._s(_vm.sessionId)+"\n ")])])],1)])],1):_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":function($event){return _vm.$emit('close')}}})],2)]),_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)};
|
|
129
129
|
var __vue_staticRenderFns__ = [];
|
|
130
130
|
|
|
131
131
|
/* style */
|
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
import Vue from 'vue';
|
|
2
|
+
import { GlToast, GlAlert, GlBadge, GlAvatar, GlButton, GlDropdown, GlDropdownItem, GlDisclosureDropdown, GlSafeHtmlDirective, GlTooltipDirective } from '@gitlab/ui';
|
|
3
|
+
import { translate } from '../../../../utils/i18n';
|
|
4
|
+
import { VIEW_TYPES } from './constants';
|
|
5
|
+
import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
|
|
6
|
+
|
|
7
|
+
const i18n = {
|
|
8
|
+
CHAT_BACK_LABEL: translate('WebDuoChat.chatBackLabel', 'Back to history'),
|
|
9
|
+
CHAT_CLOSE_LABEL: translate('WebDuoChat.closeChatHeaderLabel', 'Close chat'),
|
|
10
|
+
CHAT_NEW_LABEL: translate('WebDuoChat.chatNewLabel', 'New chat'),
|
|
11
|
+
CHAT_NEW_TOOLTIP: translate('WebDuoChat.chatNewToolTip', 'New chat'),
|
|
12
|
+
CHAT_HISTORY_TOOLTIP: translate('WebDuoChat.chatHistoryToolTip', 'Chat history'),
|
|
13
|
+
CHAT_BACK_TO_CHAT_TOOLTIP: translate('WebDuoChat.chatBackToChatToolTip', 'Back to chat'),
|
|
14
|
+
CHAT_TITLE: translate('WebDuoChat.chatTitle', 'GitLab Duo Chat'),
|
|
15
|
+
CHAT_DROPDOWN_MORE_OPTIONS: translate('WebDuoChat.chatDropdownMoreOptions', 'More options'),
|
|
16
|
+
CHAT_COPY_TOOLTIP: translate('WebDuoChat.copySessionIdTooltip', 'Copy session ID'),
|
|
17
|
+
CHAT_COPY_SUCCESS_TOAST: translate('WebDuoChat.copySessionIdSuccessToast', 'Session ID copied to clipboard'),
|
|
18
|
+
CHAT_COPY_FAILED_TOAST: translate('WebDuoChat.copySessionIdFailedToast', 'Could not copy session ID')
|
|
19
|
+
};
|
|
20
|
+
Vue.use(GlToast);
|
|
21
|
+
var script = {
|
|
22
|
+
name: 'DuoChatHeader',
|
|
23
|
+
components: {
|
|
24
|
+
GlAlert,
|
|
25
|
+
GlBadge,
|
|
26
|
+
GlAvatar,
|
|
27
|
+
GlButton,
|
|
28
|
+
GlDropdown,
|
|
29
|
+
GlDropdownItem,
|
|
30
|
+
GlDisclosureDropdown
|
|
31
|
+
},
|
|
32
|
+
directives: {
|
|
33
|
+
SafeHtml: GlSafeHtmlDirective,
|
|
34
|
+
GlTooltip: GlTooltipDirective
|
|
35
|
+
},
|
|
36
|
+
props: {
|
|
37
|
+
title: {
|
|
38
|
+
type: String,
|
|
39
|
+
required: false,
|
|
40
|
+
default: i18n.CHAT_TITLE
|
|
41
|
+
},
|
|
42
|
+
subtitle: {
|
|
43
|
+
type: String,
|
|
44
|
+
required: false,
|
|
45
|
+
default: ''
|
|
46
|
+
},
|
|
47
|
+
sessionId: {
|
|
48
|
+
type: String,
|
|
49
|
+
required: false,
|
|
50
|
+
default: ''
|
|
51
|
+
},
|
|
52
|
+
error: {
|
|
53
|
+
type: String,
|
|
54
|
+
required: false,
|
|
55
|
+
default: ''
|
|
56
|
+
},
|
|
57
|
+
isMultithreaded: {
|
|
58
|
+
type: Boolean,
|
|
59
|
+
required: false,
|
|
60
|
+
default: false
|
|
61
|
+
},
|
|
62
|
+
shouldRenderResizable: {
|
|
63
|
+
type: Boolean,
|
|
64
|
+
required: false,
|
|
65
|
+
default: false
|
|
66
|
+
},
|
|
67
|
+
activeThreadId: {
|
|
68
|
+
type: String,
|
|
69
|
+
required: false,
|
|
70
|
+
default: null
|
|
71
|
+
},
|
|
72
|
+
badgeType: {
|
|
73
|
+
type: String,
|
|
74
|
+
required: false,
|
|
75
|
+
default: null
|
|
76
|
+
},
|
|
77
|
+
currentView: {
|
|
78
|
+
type: String,
|
|
79
|
+
required: true
|
|
80
|
+
},
|
|
81
|
+
agents: {
|
|
82
|
+
type: Array,
|
|
83
|
+
required: false,
|
|
84
|
+
default: () => []
|
|
85
|
+
}
|
|
86
|
+
},
|
|
87
|
+
computed: {
|
|
88
|
+
VIEW_TYPES() {
|
|
89
|
+
return VIEW_TYPES;
|
|
90
|
+
},
|
|
91
|
+
hasManyAgents() {
|
|
92
|
+
return this.agents.length > 1;
|
|
93
|
+
},
|
|
94
|
+
hasAgents() {
|
|
95
|
+
return this.agents.length > 0;
|
|
96
|
+
}
|
|
97
|
+
},
|
|
98
|
+
methods: {
|
|
99
|
+
startNewChat(agent) {
|
|
100
|
+
if (agent) {
|
|
101
|
+
this.$emit('new-chat', agent);
|
|
102
|
+
} else if (this.hasAgents) {
|
|
103
|
+
this.$emit('new-chat', this.agents[0]);
|
|
104
|
+
} else {
|
|
105
|
+
this.$emit('new-chat');
|
|
106
|
+
}
|
|
107
|
+
},
|
|
108
|
+
async copySessionIdToClipboard() {
|
|
109
|
+
try {
|
|
110
|
+
await navigator.clipboard.writeText(this.sessionId);
|
|
111
|
+
this.$toast.show('Session ID copied to clipboard');
|
|
112
|
+
} catch {
|
|
113
|
+
this.$toast.show('Could not copy session ID');
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
},
|
|
117
|
+
i18n
|
|
118
|
+
};
|
|
119
|
+
|
|
120
|
+
/* script */
|
|
121
|
+
const __vue_script__ = script;
|
|
122
|
+
|
|
123
|
+
/* template */
|
|
124
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('header',{staticClass:"gl-border-b gl-shrink-0 gl-bg-default gl-p-0",attrs:{"data-testid":"chat-header"}},[_c('div',{staticClass:"gl-border-b gl-flex gl-w-full gl-items-center gl-px-5 gl-py-3"},[(_vm.subtitle)?_c('h4',{staticClass:"gl-mb-0 gl-shrink-0 gl-overflow-hidden gl-text-ellipsis gl-whitespace-nowrap gl-pr-3 gl-text-sm gl-font-normal gl-text-subtle",attrs:{"data-testid":"chat-subtitle"}},[_vm._v("\n "+_vm._s(_vm.subtitle)+"\n ")]):_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":function($event){return _vm.$emit('close')}}})],1),_vm._v(" "),_c('div',{staticClass:"drawer-title gl-flex gl-items-center gl-justify-start gl-p-5"},[_c('div',{staticClass:"gl-flex gl-flex-1 gl-overflow-hidden"},[_c('gl-avatar',{staticClass:"gl-mr-3",attrs:{"size":32,"entity-name":_vm.title,"shape":"circle"}}),_vm._v(" "),_c('div',{staticClass:"gl-flex gl-items-center"},[_c('h3',{staticClass:"gl-my-0 gl-text-[0.875rem]"},[_vm._v(_vm._s(_vm.title))])])],1),_vm._v(" "),_c('div',{staticClass:"gl-flex gl-gap-3"},[(
|
|
125
|
+
_vm.isMultithreaded && (_vm.activeThreadId || _vm.currentView === _vm.VIEW_TYPES.LIST || _vm.hasManyAgents)
|
|
126
|
+
)?[(_vm.hasManyAgents)?_c('gl-disclosure-dropdown',{attrs:{"title":_vm.$options.i18n.CHAT_NEW_TOOLTIP,"toggle-text":_vm.$options.i18n.CHAT_NEW_TOOLTIP,"items":_vm.agents,"data-testid":"chat-new-button","variant":"confirm","category":"tertiary","size":"small","icon":"duo-chat-new","text-sr-only":"","aria-label":_vm.$options.i18n.CHAT_NEW_LABEL,"no-caret":""},on:{"action":_vm.startNewChat},scopedSlots:_vm._u([{key:"list-item",fn:function(ref){
|
|
127
|
+
var item = ref.item;
|
|
128
|
+
return [_c('span',{staticClass:"gl-flex gl-flex-col"},[_c('span',{attrs:{"clas":"gl-block"}},[_vm._v(_vm._s(item.name))]),_vm._v(" "),_c('span',{staticClass:"gl-overflow-hidden gl-text-ellipsis gl-whitespace-nowrap gl-text-sm"},[_vm._v(_vm._s(item.description))])])]}}],null,false,117082970)}):_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_NEW_TOOLTIP,"data-testid":"chat-new-button","variant":"confirm","category":"tertiary","size":"small","icon":"duo-chat-new","aria-label":_vm.$options.i18n.CHAT_NEW_LABEL},on:{"click":_vm.startNewChat}})]:_vm._e(),_vm._v(" "),(_vm.isMultithreaded && _vm.currentView === _vm.VIEW_TYPES.CHAT)?_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_HISTORY_TOOLTIP,"data-testid":"go-back-to-list-button","category":"tertiary","size":"small","icon":"history","aria-label":_vm.$options.i18n.CHAT_BACK_LABEL},on:{"click":function($event){return _vm.$emit('go-back')}}}):_vm._e(),_vm._v(" "),(_vm.isMultithreaded && _vm.activeThreadId && _vm.currentView === _vm.VIEW_TYPES.LIST)?_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"title":_vm.$options.i18n.CHAT_BACK_TO_CHAT_TOOLTIP,"data-testid":"go-back-to-chat-button","category":"tertiary","size":"small","icon":"go-back","aria-label":_vm.$options.i18n.CHAT_BACK_TO_CHAT_TOOLTIP},on:{"click":function($event){return _vm.$emit('go-back-to-chat')}}}):_vm._e(),_vm._v(" "),(_vm.sessionId)?_c('gl-dropdown',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip.hover",modifiers:{"hover":true}}],attrs:{"icon":"ellipsis_v","category":"tertiary","text-sr-only":"","size":"small","text":_vm.$options.i18n.CHAT_DROPDOWN_MORE_OPTIONS,"title":_vm.$options.i18n.CHAT_DROPDOWN_MORE_OPTIONS,"no-caret":""}},[_c('gl-dropdown-item',{on:{"click":function($event){return _vm.copySessionIdToClipboard()}}},[_c('span',{staticClass:"gl-flex gl-items-center gl-gap-2"},[_c('span',{staticClass:"gl-flex-shrink-0"},[_vm._v(_vm._s(_vm.$options.i18n.CHAT_COPY_TOOLTIP))]),_vm._v(" "),_c('gl-badge',{staticClass:"gl-flex-shrink"},[_c('span',{staticClass:"gl-max-w-12 gl-truncate",attrs:{"title":_vm.sessionId}},[_vm._v("\n "+_vm._s(_vm.sessionId)+"\n ")])])],1)])],1):_vm._e()],2)]),_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)};
|
|
129
|
+
var __vue_staticRenderFns__ = [];
|
|
130
|
+
|
|
131
|
+
/* style */
|
|
132
|
+
const __vue_inject_styles__ = undefined;
|
|
133
|
+
/* scoped */
|
|
134
|
+
const __vue_scope_id__ = undefined;
|
|
135
|
+
/* module identifier */
|
|
136
|
+
const __vue_module_identifier__ = undefined;
|
|
137
|
+
/* functional template */
|
|
138
|
+
const __vue_is_functional_template__ = false;
|
|
139
|
+
/* style inject */
|
|
140
|
+
|
|
141
|
+
/* style inject SSR */
|
|
142
|
+
|
|
143
|
+
/* style inject shadow dom */
|
|
144
|
+
|
|
145
|
+
|
|
146
|
+
|
|
147
|
+
const __vue_component__ = __vue_normalize__(
|
|
148
|
+
{ render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
|
|
149
|
+
__vue_inject_styles__,
|
|
150
|
+
__vue_script__,
|
|
151
|
+
__vue_scope_id__,
|
|
152
|
+
__vue_is_functional_template__,
|
|
153
|
+
__vue_module_identifier__,
|
|
154
|
+
false,
|
|
155
|
+
undefined,
|
|
156
|
+
undefined,
|
|
157
|
+
undefined
|
|
158
|
+
);
|
|
159
|
+
|
|
160
|
+
export default __vue_component__;
|
|
161
|
+
export { i18n };
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import throttle from 'lodash/throttle';
|
|
2
|
-
import
|
|
2
|
+
import VueResizable from 'vue-resizable';
|
|
3
|
+
import { GlButton, GlAlert, GlFormInputGroup, GlFormTextarea, GlForm, GlExperimentBadge, GlCard, GlDropdownItem, GlSafeHtmlDirective } from '@gitlab/ui';
|
|
3
4
|
import { translate } from '../../utils/i18n';
|
|
4
|
-
import { badgeTypes, badgeTypeValidator,
|
|
5
|
+
import { badgeTypes, badgeTypeValidator, CHAT_RESET_MESSAGE, CHAT_INCLUDE_MESSAGE, MESSAGE_MODEL_ROLES, CHAT_CLEAR_MESSAGE, CHAT_NEW_MESSAGE } from './constants';
|
|
5
6
|
import { VIEW_TYPES } from './components/duo_chat_header/constants';
|
|
6
7
|
import DuoChatLoader from './components/duo_chat_loader/duo_chat_loader';
|
|
7
8
|
import DuoChatPredefinedPrompts from './components/duo_chat_predefined_prompts/duo_chat_predefined_prompts';
|
|
@@ -15,11 +16,10 @@ const i18n = {
|
|
|
15
16
|
CHAT_HISTORY_TITLE: translate('GlDuoChat.chatHistoryTitle', 'Chat history'),
|
|
16
17
|
CHAT_DISCLAMER: translate('GlDuoChat.chatDisclamer', 'Responses may be inaccurate. Verify before use.'),
|
|
17
18
|
CHAT_EMPTY_STATE_TITLE: translate('DuoChat.chatEmptyStateTitle', '👋 I am GitLab Duo Chat, your personal AI-powered assistant. How can I help you today?'),
|
|
18
|
-
CHAT_PROMPT_PLACEHOLDER_DEFAULT: translate('DuoChat.chatPromptPlaceholderDefault',
|
|
19
|
+
CHAT_PROMPT_PLACEHOLDER_DEFAULT: translate('DuoChat.chatPromptPlaceholderDefault', 'GitLab Duo Chat'),
|
|
19
20
|
CHAT_PROMPT_PLACEHOLDER_WITH_COMMANDS: translate('DuoChat.chatPromptPlaceholderWithCommands', 'Type /help to learn more'),
|
|
20
21
|
CHAT_SUBMIT_LABEL: translate('DuoChat.chatSubmitLabel', 'Send chat message.'),
|
|
21
22
|
CHAT_CANCEL_LABEL: translate('DuoChat.chatCancelLabel', 'Cancel'),
|
|
22
|
-
CHAT_MODEL_PLACEHOLDER: translate('DuoChat.chatModelPlaceholder', 'GitLab Duo Chat'),
|
|
23
23
|
CHAT_DEFAULT_PREDEFINED_PROMPTS: [translate('DuoChat.chatDefaultPredefinedPromptsChangePassword', 'How do I change my password in GitLab?'), translate('DuoChat.chatDefaultPredefinedPromptsForkProject', 'How do I fork a project?'), translate('DuoChat.chatDefaultPredefinedPromptsCloneRepository', 'How do I clone a repository?'), translate('DuoChat.chatDefaultPredefinedPromptsCreateTemplate', 'How do I create a template?')]
|
|
24
24
|
};
|
|
25
25
|
const isMessage = item => Boolean(item) && (item === null || item === void 0 ? void 0 : item.role);
|
|
@@ -45,20 +45,53 @@ 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
|
|
60
64
|
},
|
|
61
65
|
props: {
|
|
66
|
+
/**
|
|
67
|
+
* Determines if the component should be resizable. When true, it renders inside
|
|
68
|
+
* a `vue-resizable` wrapper; otherwise, a standard `div` is used.
|
|
69
|
+
*/
|
|
70
|
+
shouldRenderResizable: {
|
|
71
|
+
type: Boolean,
|
|
72
|
+
required: false,
|
|
73
|
+
default: false
|
|
74
|
+
},
|
|
75
|
+
/**
|
|
76
|
+
* Defines the dimensions of the chat container when resizable.
|
|
77
|
+
* By default, the height is set to match the height of the browser window,
|
|
78
|
+
* and the width is fixed at 400px. The `top` position is left undefined,
|
|
79
|
+
* allowing it to be dynamically adjusted if needed.
|
|
80
|
+
*/
|
|
81
|
+
dimensions: {
|
|
82
|
+
type: Object,
|
|
83
|
+
required: false,
|
|
84
|
+
default: () => ({
|
|
85
|
+
width: undefined,
|
|
86
|
+
height: undefined,
|
|
87
|
+
top: undefined,
|
|
88
|
+
left: undefined,
|
|
89
|
+
maxWidth: undefined,
|
|
90
|
+
minWidth: 400,
|
|
91
|
+
maxHeight: undefined,
|
|
92
|
+
minHeight: 400
|
|
93
|
+
})
|
|
94
|
+
},
|
|
62
95
|
/**
|
|
63
96
|
* The title of the chat/feature.
|
|
64
97
|
*/
|
|
@@ -225,15 +258,11 @@ var script = {
|
|
|
225
258
|
required: false,
|
|
226
259
|
default: () => ['en-US', 'en'],
|
|
227
260
|
validator: localeValidator
|
|
228
|
-
},
|
|
229
|
-
shouldRenderResizable: {
|
|
230
|
-
type: Boolean,
|
|
231
|
-
required: false,
|
|
232
|
-
default: false
|
|
233
261
|
}
|
|
234
262
|
},
|
|
235
263
|
data() {
|
|
236
264
|
return {
|
|
265
|
+
isHidden: false,
|
|
237
266
|
prompt: '',
|
|
238
267
|
scrolledToBottom: true,
|
|
239
268
|
activeCommandIndex: 0,
|
|
@@ -241,10 +270,7 @@ var script = {
|
|
|
241
270
|
compositionJustEnded: false,
|
|
242
271
|
contextItemsMenuIsOpen: false,
|
|
243
272
|
contextItemMenuRef: null,
|
|
244
|
-
currentView: this.multiThreadedView
|
|
245
|
-
maxPromptLength: MAX_PROMPT_LENGTH,
|
|
246
|
-
maxPromptLengthWarning: PROMPT_LENGTH_WARNING,
|
|
247
|
-
promptLengthWarningCount: MAX_PROMPT_LENGTH - PROMPT_LENGTH_WARNING
|
|
273
|
+
currentView: this.multiThreadedView
|
|
248
274
|
};
|
|
249
275
|
},
|
|
250
276
|
computed: {
|
|
@@ -339,6 +365,7 @@ var script = {
|
|
|
339
365
|
if (!newVal && !this.isStreaming) {
|
|
340
366
|
this.displaySubmitButton = true; // Re-enable submit button when loading stops
|
|
341
367
|
}
|
|
368
|
+
this.isHidden = false;
|
|
342
369
|
},
|
|
343
370
|
isStreaming(newVal) {
|
|
344
371
|
if (!newVal && !this.isLoading) {
|
|
@@ -377,10 +404,14 @@ var script = {
|
|
|
377
404
|
this.focusChatInput();
|
|
378
405
|
});
|
|
379
406
|
},
|
|
407
|
+
updateSize(e) {
|
|
408
|
+
this.$emit('chat-resize', e);
|
|
409
|
+
},
|
|
380
410
|
compositionEnd() {
|
|
381
411
|
this.compositionJustEnded = true;
|
|
382
412
|
},
|
|
383
413
|
hideChat() {
|
|
414
|
+
this.isHidden = true;
|
|
384
415
|
/**
|
|
385
416
|
* Emitted when clicking the cross in the title and the chat gets closed.
|
|
386
417
|
*/
|
|
@@ -436,10 +467,10 @@ var script = {
|
|
|
436
467
|
(_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);
|
|
437
468
|
},
|
|
438
469
|
focusChatInput() {
|
|
439
|
-
var _this$$refs$prompt, _this$$refs$prompt$$e
|
|
470
|
+
var _this$$refs$prompt, _this$$refs$prompt$$e;
|
|
440
471
|
// This method is also called directly by consumers of this component
|
|
441
472
|
// https://gitlab.com/gitlab-org/gitlab-vscode-extension/-/blob/dae2d4669ab4da327921492a2962beae8a05c290/webviews/vue2/gitlab_duo_chat/src/App.vue#L109
|
|
442
|
-
(_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 :
|
|
473
|
+
(_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();
|
|
443
474
|
},
|
|
444
475
|
onTrackFeedback(event) {
|
|
445
476
|
/**
|
|
@@ -595,12 +626,6 @@ var script = {
|
|
|
595
626
|
handleRedo(event) {
|
|
596
627
|
event.preventDefault();
|
|
597
628
|
document.execCommand('redo');
|
|
598
|
-
},
|
|
599
|
-
remainingCharacterCountMessage(count) {
|
|
600
|
-
return `${count} characters remaining`;
|
|
601
|
-
},
|
|
602
|
-
overLimitCharacterCountMessage(count) {
|
|
603
|
-
return `${Math.abs(count)} characters over limit`;
|
|
604
629
|
}
|
|
605
630
|
},
|
|
606
631
|
i18n
|
|
@@ -610,19 +635,13 @@ var script = {
|
|
|
610
635
|
const __vue_script__ = script;
|
|
611
636
|
|
|
612
637
|
/* template */
|
|
613
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c(
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
'gl-form-input',
|
|
620
|
-
'gl-form-textarea',
|
|
621
|
-
{ 'gl-truncate': !_vm.prompt } ],"placeholder":_vm.inputPlaceholder,"character-count-limit":_vm.maxPromptLength,"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; }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; }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; }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; }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){
|
|
622
|
-
var count = ref.count;
|
|
623
|
-
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){
|
|
624
|
-
var count = ref.count;
|
|
625
|
-
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.displaySubmitButton)?_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","data-testid":"chat-prompt-submit-button","disabled":_vm.isPromptEmpty,"aria-label":_vm.$options.i18n.CHAT_SUBMIT_LABEL}}):_c('gl-button',{staticClass:"gl-bottom-2 gl-right-2 gl-ml-auto !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"},[_vm._v("\n "+_vm._s(_vm.$options.i18n.CHAT_DISCLAMER)+"\n ")])],2):_vm._e()],1)};
|
|
638
|
+
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:{
|
|
639
|
+
'duo-chat-resizable': _vm.shouldRenderResizable,
|
|
640
|
+
'non-resizable-wrapper': !_vm.shouldRenderResizable,
|
|
641
|
+
},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:{
|
|
642
|
+
'resizable-content': _vm.shouldRenderResizable,
|
|
643
|
+
'duo-chat-drawer': !_vm.shouldRenderResizable,
|
|
644
|
+
},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,"is-multithreaded":_vm.isMultithreaded,"current-view":_vm.currentView,"should-render-resizable":_vm.shouldRenderResizable,"badge-type":_vm.isMultithreaded ? null : _vm.badgeType},on:{"go-back":_vm.onGoBack,"go-back-to-chat":_vm.onGoBackToChat,"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,"canceled-request-ids":_vm.canceledRequestIds,"show-delimiter":index > 0,"trusted-urls":_vm.trustedUrls},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,"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-p-4 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.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","disabled":_vm.isPromptEmpty,"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,661265825)},[_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:{"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; }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; }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; }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; }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)}},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"},[_vm._v("\n "+_vm._s(_vm.$options.i18n.CHAT_DISCLAMER)+"\n ")])],2):_vm._e()],1):_vm._e()])};
|
|
626
645
|
var __vue_staticRenderFns__ = [];
|
|
627
646
|
|
|
628
647
|
/* style */
|