npm - @gitlab/duo-ui - Versions diffs - 15.0.0 → 15.0.2 - Mend

@gitlab/duo-ui 15.0.0 → 15.0.2

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.

Files changed (19) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,3 +1,17 @@
+## [15.0.2](https://gitlab.com/gitlab-org/duo-ui/compare/v15.0.1...v15.0.2) (2025-11-26)
+### Bug Fixes
+* **DuoChat:** Fix pre code color inheritence in dark mode ([194ded3](https://gitlab.com/gitlab-org/duo-ui/commit/194ded33b1ef9736a72231bc5649e8cdf8497245)), closes [#000000](https://gitlab.com/gitlab-org/duo-ui/issues/000000)
+## [15.0.1](https://gitlab.com/gitlab-org/duo-ui/compare/v15.0.0...v15.0.1) (2025-11-25)
+### Bug Fixes
+* Use a generic clipboard copy action ([b1eb7a3](https://gitlab.com/gitlab-org/duo-ui/commit/b1eb7a3b5d56c42346a569bbc14740aeb8a73fb4))
 # [15.0.0](https://gitlab.com/gitlab-org/duo-ui/compare/v14.3.0...v15.0.0) (2025-11-21)

package/dist/components/chat/components/duo_chat_header/duo_chat_header.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import Vue from 'vue';
 import { GlToast, GlAlert, GlButton, GlExperimentBadge, GlDisclosureDropdown, GlSafeHtmlDirective, GlTooltipDirective } from '@gitlab/ui';
 import { translate, sprintf } from '../../../../utils/i18n';
+import { copyToClipboard } from '../utils';
 import { VIEW_TYPES } from './constants';
 import DuoChatHeaderAgentItem from './duo_chat_header_agent_item/duo_chat_header_agent_item';
 import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
@@ -133,7 +134,7 @@ var script = {
     },
     async copySessionIdToClipboard() {
       try {
-        await navigator.clipboard.writeText(this.sessionId);
+        await copyToClipboard(this.sessionId, this.$el);
         this.$toast.show('Session ID copied to clipboard');
       } catch {
         this.$toast.show('Could not copy session ID');

package/dist/components/chat/components/duo_chat_header/web_duo_chat_header.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import Vue from 'vue';
 import { GlToast, GlAlert, GlAvatar, GlButton, GlDisclosureDropdown, GlSafeHtmlDirective, GlTooltipDirective } from '@gitlab/ui';
 import { translate, sprintf } from '../../../../utils/i18n';
+import { copyToClipboard } from '../utils';
 import { VIEW_TYPES } from './constants';
 import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
@@ -140,7 +141,7 @@ var script = {
     },
     async copySessionIdToClipboard() {
       try {
-        await navigator.clipboard.writeText(this.sessionId);
+        await copyToClipboard(this.sessionId, this.$el);
         this.$toast.show('Session ID copied to clipboard');
       } catch {
         this.$toast.show('Could not copy session ID');

package/dist/components/chat/components/duo_chat_message/copy_code_element.js CHANGED Viewed

@@ -1,6 +1,6 @@
+import { copyToClipboard } from '../utils';
 import { createButton } from './buttons_utils';
 import { createTooltip } from './tooltips_utils';
-import { checkClipboardPermissions } from './utils';
 function _defineProperty(e, r, t) {
   return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
@@ -46,21 +46,11 @@ class CopyCodeElement extends HTMLElement {
       // not present in the DOM.
       const codeElement = this.getCodeElement();
       const textToCopy = codeElement.innerText;
-      const hasClipboardPermission = await checkClipboardPermissions();
       try {
-        codeElement.dispatchEvent(new CustomEvent('copy-code-snippet', {
-          bubbles: true,
-          cancelable: true,
-          detail: {
-            code: textToCopy
-          }
-        }));
-        if (hasClipboardPermission) {
-          await navigator.clipboard.writeText(textToCopy);
-        }
-      } catch (e) {
+        await copyToClipboard(textToCopy, codeElement);
+      } catch (error) {
         // eslint-disable-next-line no-console
-        console.warn('Failed to copy snippet:', e);
+        console.warn('Failed to copy to clipboard:', error);
       }
     });
   }

package/dist/components/chat/components/duo_chat_message/duo_chat_message.js CHANGED Viewed

@@ -5,10 +5,10 @@ import DuoChatContextItemSelections from '../duo_chat_context/duo_chat_context_i
 import { SELECTED_CONTEXT_ITEMS_DEFAULT_COLLAPSED, MESSAGE_MODEL_ROLES } from '../../constants';
 import DocumentationSources from '../duo_chat_message_sources/duo_chat_message_sources';
 import { renderDuoChatMarkdownPreview } from '../../markdown_renderer';
+import { concatUntilEmpty, copyToClipboard } from '../utils';
 import MessageFeedback from './message_feedback';
 import { CopyCodeElement } from './copy_code_element';
 import { InsertCodeSnippetElement } from './insert_code_snippet_element';
-import { concatUntilEmpty, checkClipboardPermissions } from './utils';
 import { DUO_CODE_SCRIM_BOTTOM_CLASS, DUO_CODE_SCRIM_OFFSET, DUO_CODE_SCRIM_TOP_CLASS } from './constants';
 import MessageMap from './message_types/message_map';
 import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
@@ -170,7 +170,7 @@ var script = {
       });
     },
     shouldShowCopyAction() {
-      return Boolean(navigator.clipboard && !this.isChunk && this.isAssistantMessage);
+      return Boolean(!this.isChunk && this.isAssistantMessage);
     },
     shouldShowFeedbackLink() {
       return this.withFeedback && this.isNotChunkOrCancelled && this.isAssistantMessage;
@@ -273,18 +273,17 @@ var script = {
       }
     },
     async copyMessage() {
-      const hasPermissions = await checkClipboardPermissions();
-      if (!this.copied) {
-        if (hasPermissions) {
-          await navigator.clipboard.writeText(this.message.content);
-        } else {
-          this.$emit('copy-message', {
-            detail: {
-              message: this.message.content
-            }
-          });
-        }
+      try {
+        await copyToClipboard(this.message.content, this.$el);
+        this.$emit('copy-message', {
+          detail: {
+            message: this.message.content
+          }
+        });
         this.copied = true;
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.warn('Failed to copy message:', error);
       }
     },
     onOpenFilePath(e) {

package/dist/components/chat/components/duo_chat_message_tool_approval/components/pre_block.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { GlTooltipDirective, GlButton } from '@gitlab/ui';
 import { translate } from '../../../../../utils/i18n';
-import { checkClipboardPermissions } from '../../duo_chat_message/utils';
+import { copyToClipboard } from '../../utils';
 import { highlightElement } from '../services/highlight';
 import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
@@ -39,26 +39,7 @@ var script = {
     async copyToClipboard() {
       try {
         const textToCopy = this.$refs.codeElement.textContent;
-        const hasClipboardPermission = await checkClipboardPermissions();
-        const event = new CustomEvent('copy-code-snippet', {
-          bubbles: true,
-          detail: {
-            code: textToCopy
-          }
-        });
-        // Emit custom event for VS Code and other environments
-        // This bubbles up to parent components that handle clipboard operations
-        this.$emit('copy-code-snippet', {
-          detail: {
-            code: textToCopy
-          }
-        });
-        this.$el.dispatchEvent(event);
-        // If we have clipboard permission, also copy directly
-        if (hasClipboardPermission) {
-          await navigator.clipboard.writeText(textToCopy);
-        }
+        await copyToClipboard(textToCopy, this.$el);
         this.$emit('copied', this.title);
         setTimeout(() => {
           this.$refs.copyToClipboardButton.$el.blur();

package/dist/components/chat/components/utils.js ADDED Viewed

@@ -0,0 +1,56 @@
+const concatUntilEmpty = arr => {
+  if (!arr) return '';
+  let end = arr.findIndex(el => !el);
+  if (end < 0) end = arr.length;
+  return arr.slice(0, end).join('');
+};
+/**
+ * Programmatically copies a text string to the clipboard. Attempts to copy in both secure and non-secure contexts as well as VSCode.
+ *
+ * Accepts a container element. This helps ensure the text can get copied to the clipboard correctly in non-secure
+ * environments, the container should be active (such as a button in a modal) to ensure the content can be copied.
+ *
+ * @param {String} text - Text to copy
+ * @param {HTMLElement} el - element that emits event for VSCode, and contains the fallback textarea.
+ */
+const copyToClipboard = (textToCopy, el) => {
+  // Fist, emit a custom event for VS Code extensions and other environments
+  // This bubbles up to parent components that handle clipboard operations
+  el.dispatchEvent(new CustomEvent('copy-code-snippet', {
+    bubbles: true,
+    cancelable: true,
+    detail: {
+      code: textToCopy
+    }
+  }));
+  // Second, for modern browsers try a simple clipboard.writeText (works on https and localhost)
+  if (navigator.clipboard && window.isSecureContext) {
+    return navigator.clipboard.writeText(textToCopy);
+  }
+  // Third, try execCommand to copy from a dynamically created invisible textarea (for http and older browsers)
+  const textarea = document.createElement('textarea');
+  textarea.value = textToCopy;
+  textarea.style.position = 'absolute';
+  textarea.style.left = '-9999px'; // eslint-disable-line @gitlab/require-i18n-strings
+  textarea.style.top = '0';
+  textarea.setAttribute('readonly', ''); // prevent keyboard popup on mobile
+  // textarea must be in document to be selectable, but we add it to the button so it works in modals
+  el.appendChild(textarea);
+  textarea.select(); // for Safari
+  textarea.setSelectionRange(0, textarea.value.length); // for mobile devices
+  try {
+    const done = document.execCommand('copy');
+    el.removeChild(textarea);
+    return done ? Promise.resolve() : Promise.reject(new Error('Copy command failed'));
+  } catch (err) {
+    el.removeChild(textarea);
+    return Promise.reject(err);
+  }
+};
+export { concatUntilEmpty, copyToClipboard };

package/dist/components.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@charset "UTF-8";.resizable-content{--tw-shadow:var(--gl-shadow-lg);--tw-shadow-colored:var(--gl-shadow-lg);background:var(--gl-background-color-default);border-radius:.5rem;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);font-size:var(--gl-font-size-base);height:100%;overflow-y:auto;width:100%}.recents-wrapper .resizable-content{margin-top:var(--gl-spacing-scale-0)}.resizable-content{display:flex;flex-direction:column;line-height:1rem}.resizable-component .resizable-l,.resizable-component .resizable-t{background-color:initial;border-radius:3px;transition:background-color .2s cubic-bezier(.22,.61,.36,1)}@media (prefers-reduced-motion){.resizable-component .resizable-l,.resizable-component .resizable-t{transition-delay:0ms!important;transition-duration:.01ms!important}}.resizable-component .resizable-l:hover,.resizable-component .resizable-t:hover{background-color:var(--gl-color-blue-200)}.resizable-component .resizable-t{height:4px!important;left:50%!important;top:2px!important;transform:translateX(-50%);width:95%!important}.resizable-component .resizable-l{height:95%!important;left:2px!important;top:50%!important;transform:translateY(-50%);width:4px!important}.resizable-component .duo-chat{z-index:var(--gl-zindex-0)}.resizable-component .resizable-l,.resizable-component .resizable-lt,.resizable-component .resizable-t{z-index:var(--gl-zindex-1)}.duo-chat{font-family:var(--gl-font-family-regular);z-index:999}.duo-chat .message-enter-active,.duo-chat .message-leave-active{transition:all .5s ease}.duo-chat .message-enter,.duo-chat .message-leave-to{opacity:var(--gl-opacity-0);transform:translateY(10px)}.duo-chat .duo-chat-loader.message-leave,.duo-chat .duo-chat-loader.message-leave-to{transition:none}.duo-chat .duo-agent-mode-switcher>*,.duo-chat .duo-model-switcher>*{width:100%}.duo-chat-drawer{--tw-shadow:var(--gl-shadow-lg);--tw-shadow-colored:var(--gl-shadow-lg);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);font-size:var(--gl-font-size-base);height:100%;overflow-y:auto;position:fixed;right:0;transition-duration:.2s;transition-property:all;transition-timing-function:ease;width:100%}.recents-wrapper .duo-chat-drawer{margin-top:var(--gl-spacing-scale-0)}.duo-chat-drawer{display:flex;flex-direction:column;line-height:1rem}.duo-chat-drawer-footer{padding-bottom:var(--gl-spacing-scale-4);padding-left:var(--gl-spacing-scale-4);padding-right:var(--gl-spacing-scale-4)}.duo-chat-drawer-footer:before{--tw-translate-y:-100%;background:linear-gradient(to bottom,#0000,var(--gl-background-color-default));content:"";height:var(--gl-spacing-scale-4);left:0;pointer-events:none;position:absolute;top:0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));width:100%}.duo-chat-history{scroll-behavior:smooth}.duo-chat-history *{overflow-anchor:none}.duo-chat-history .scroll-anchor{height:1px;margin-top:-1px;overflow-anchor:auto}.history-item{align-items:center;background:var(--gl-button-default-tertiary-background-color-default);border-radius:var(--gl-border-radius-lg);display:flex;gap:var(--gl-spacing-scale-3);margin-left:calc(var(--gl-spacing-scale-3)*-1);margin-right:calc(var(--gl-spacing-scale-3)*-1);padding-right:var(--gl-spacing-scale-2);transition:background-color .2s cubic-bezier(.22,.61,.36,1)}.history-item:focus,.history-item:focus-within,.history-item:hover{background:var(--gl-button-default-tertiary-background-color-hover)}.history-item:focus .history-remove-button,.history-item:focus-within .history-remove-button,.history-item:hover .history-remove-button{opacity:1}.history-item .history-remove-button{opacity:0;transition:opacity .2s cubic-bezier(.22,.61,.36,1)}.history-item .history-item-name{border-radius:var(--gl-border-radius-lg);border-width:0;padding:var(--gl-spacing-scale-3)}.history-item .history-item-name,.history-item .history-item-name:active,.history-item .history-item-name:focus,.history-item .history-item-name:hover{background-color:initial!important}.history-item .gl-button-text{align-items:center;display:flex;flex-direction:row;gap:var(--gl-spacing-scale-3);text-align:left;width:100%}.duo-chat-input{background:var(--gl-control-background-color-default);border-radius:1.25rem;box-shadow:inset 0 0 0 1px var(--gl-control-border-color-default);display:flex;flex-direction:column;max-height:240px;overflow:hidden}.duo-chat-input:focus-within{box-shadow:inset 0 0 0 1px var(--gl-control-border-color-focus),0 0 0 1px var(--gl-focus-ring-inner-color),0 0 0 3px var(--gl-focus-ring-outer-color);outline:none}@media (forced-colors:active){.duo-chat-input:focus-within{outline:2px solid LinkText}}.duo-chat-input .gl-form-textarea.form-control{border-radius:1.25rem;flex:1;max-height:240px;padding-right:40px;resize:none}.duo-chat-input:after{content:attr(data-value) " ";font-family:var(--gl-font-family-regular);padding:var(--gl-spacing-scale-4);padding-right:40px;visibility:hidden;word-break:break-word}.duo-chat .duo-chat-suggestion-button{border-radius:1rem}.slash-commands{margin-top:calc(var(--gl-spacing-scale-2)*-1)}.slash-commands .active-command{background-color:var(--gl-background-color-strong);border-radius:.25rem}.slash-commands .gl-dropdown-item button.dropdown-item{background-color:initial;font-size:var(--gl-font-size-sm);padding-left:var(--gl-spacing-scale-3);padding-right:var(--gl-spacing-scale-3)}.slash-commands .gl-dropdown-item button.dropdown-item:hover{background-color:initial}.duo-chat-markdown{color:#3a383f;font-family:var(--gl-font-family-regular);font-size:var(--gl-font-size-lg);font-weight:var(--gl-font-weight-normal);line-height:var(--gl-line-height-24)}.duo-chat-markdown :first-child{margin-top:var(--gl-spacing-scale-0)}.duo-chat-markdown .gl-h1,.duo-chat-markdown h1{font-size:clamp(1.5rem,.8333333333rem + 1.3888888889vw,1.875rem);margin-top:0;margin-top:var(--gl-spacing-scale-7)}.duo-chat-markdown .gl-h1,.duo-chat-markdown .gl-h2,.duo-chat-markdown h1,.duo-chat-markdown h2{color:var(--gl-text-color-heading);font-weight:600;letter-spacing:-.01em;line-height:1.25;margin-bottom:1rem}.duo-chat-markdown .gl-h2,.duo-chat-markdown h2{font-size:clamp(1.3125rem,.8680555556rem + .9259259259vw,1.5625rem);margin-top:0;margin-top:var(--gl-spacing-scale-6)}.duo-chat-markdown .gl-h3,.duo-chat-markdown h3{font-size:clamp(1.125rem,.9027777778rem + .462962963vw,1.25rem);margin-top:0;margin-top:var(--gl-spacing-scale-6)}.duo-chat-markdown .gl-h3,.duo-chat-markdown .gl-h4,.duo-chat-markdown h3,.duo-chat-markdown h4{color:var(--gl-text-color-heading);font-weight:600;letter-spacing:inherit;line-height:1.25;margin-bottom:1rem}.duo-chat-markdown .gl-h4,.duo-chat-markdown h4{font-size:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-5)}.duo-chat-markdown .gl-h5,.duo-chat-markdown h5{font-size:.875rem}.duo-chat-markdown .gl-h5,.duo-chat-markdown .gl-h6,.duo-chat-markdown h5,.duo-chat-markdown h6{color:var(--gl-text-color-heading);font-weight:600;letter-spacing:inherit;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-5)}.duo-chat-markdown .gl-h6,.duo-chat-markdown h6{font-size:.8125rem}.duo-chat-markdown .gl-paragraph,.duo-chat-markdown p{margin-bottom:var(--gl-spacing-scale-0);margin-top:var(--gl-spacing-scale-0)}.duo-chat-markdown .gl-paragraph+.gl-paragraph,.duo-chat-markdown .gl-paragraph+p,.duo-chat-markdown p+.gl-paragraph,.duo-chat-markdown p+p{margin-top:var(--gl-spacing-scale-5)}.duo-chat-markdown .gl-paragraph.sm,.duo-chat-markdown .sm,.duo-chat-markdown p.sm{font-size:.875rem;line-height:var(--gl-line-height-20)}.duo-chat-markdown .monospace,.duo-chat-markdown code{font-family:var(--gl-font-family-monospace);font-family:var(--default-mono-font,"GitLab Mono"),"JetBrains Mono","Menlo","DejaVu Sans Mono","Liberation Mono","Consolas","Ubuntu Mono","Courier New","andale mono","lucida console",monospace;font-variant-ligatures:none}.duo-chat-markdown blockquote{box-shadow:inset 4px 0 0 0 #dcdcde;color:var(--gray-700);margin:var(--gl-spacing-scale-3) var(--gl-spacing-scale-0);padding-bottom:var(--gl-spacing-scale-3);padding-left:var(--gl-spacing-scale-6);padding-top:var(--gl-spacing-scale-3)}.duo-chat-markdown .idiff{border-radius:.25rem;display:inline-flex;padding-left:var(--gl-spacing-scale-2);padding-right:var(--gl-spacing-scale-2)}.duo-chat-markdown .deletion{background-color:var(--red-100)}.duo-chat-markdown .addition{background-color:var(--green-100)}.duo-chat-markdown code{background-color:var(--gray-50);border-radius:.25rem;color:var(--gray-950);padding:var(--gl-spacing-scale-1) var(--gl-spacing-scale-2)}.duo-chat-markdown pre{border-radius:.25rem;box-shadow:inset 0 0 0 1px #dcdcde;margin-bottom:var(--gl-spacing-scale-7);margin-top:var(--gl-spacing-scale-7);overflow:auto;padding:var(--gl-spacing-scale-3) var(--gl-spacing-scale-4)}.duo-chat-markdown pre code{background-color:var(--white);border-radius:var(--gl-border-radius-none);color:var(--gray-900);padding:var(--gl-spacing-scale-0)}.duo-chat-markdown .audio-container{display:inline-flex;flex-direction:column;width:100%}.duo-chat-markdown .audio-container audio{width:100%}.duo-chat-markdown .audio-container a{margin-top:var(--gl-spacing-scale-3)}.duo-chat-markdown .audio-container a:before{-webkit-font-smoothing:antialiased;content:"📎";margin-right:var(--gl-spacing-scale-2);text-rendering:auto}.duo-chat-markdown table{margin-bottom:var(--gl-spacing-scale-7);margin-top:var(--gl-spacing-scale-7)}.duo-chat-markdown table td,.duo-chat-markdown table th{box-shadow:inset 0 -1px 0 0 #dcdcde;padding:var(--gl-spacing-scale-4) var(--gl-spacing-scale-3);vertical-align:top}.duo-chat-markdown table th{box-shadow:inset 0 1px 0 0 #dcdcde,inset 0 -1px 0 0 #dcdcde;font-weight:var(--gl-font-weight-bold)}.duo-chat-markdown table thead{background-color:var(--gray-50)}.duo-chat-markdown table tr:nth-child(2n){background-color:var(--gray-10)}.duo-chat-compact-markdown{font-size:var(--gl-font-size-base)}.recents-wrapper .duo-chat-compact-markdown{margin-top:var(--gl-spacing-scale-0)}.duo-chat-compact-markdown{line-height:var(--gl-line-height-20)}.duo-chat-compact-markdown .gl-h1,.duo-chat-compact-markdown h1{color:var(--gl-text-color-heading);font-size:1.5rem;font-weight:600;letter-spacing:-.01em;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-7)}.duo-chat-compact-markdown .gl-h2,.duo-chat-compact-markdown h2{font-size:1.3125rem;letter-spacing:-.01em}.duo-chat-compact-markdown .gl-h2,.duo-chat-compact-markdown .gl-h3,.duo-chat-compact-markdown h2,.duo-chat-compact-markdown h3{color:var(--gl-text-color-heading);font-weight:600;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-6)}.duo-chat-compact-markdown .gl-h3,.duo-chat-compact-markdown h3{font-size:1.125rem;letter-spacing:inherit}.duo-chat-compact-markdown .gl-h4,.duo-chat-compact-markdown h4{font-size:1rem}.duo-chat-compact-markdown .gl-h4,.duo-chat-compact-markdown .gl-h5,.duo-chat-compact-markdown h4,.duo-chat-compact-markdown h5{color:var(--gl-text-color-heading);font-weight:600;letter-spacing:inherit;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-5)}.duo-chat-compact-markdown .gl-h5,.duo-chat-compact-markdown h5{font-size:.875rem}.duo-chat-compact-markdown .gl-h6,.duo-chat-compact-markdown h6{color:var(--gl-text-color-heading);font-size:.8125rem;font-weight:600;letter-spacing:inherit;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-5)}.duo-chat-compact-markdown .sm{font-size:var(--gl-font-size-sm)}.duo-chat-compact-markdown .monospace,.duo-chat-compact-markdown code{font-family:var(--gl-font-family-monospace);font-family:var(--default-mono-font,"GitLab Mono"),"JetBrains Mono","Menlo","DejaVu Sans Mono","Liberation Mono","Consolas","Ubuntu Mono","Courier New","andale mono","lucida console",monospace;font-variant-ligatures:none}.duo-chat-compact-markdown table td,.duo-chat-compact-markdown table th{padding-bottom:var(--gl-spacing-scale-3);padding-top:var(--gl-spacing-scale-3)}.message-tool-approval-collapsed{border-bottom:0}.message-tool-approval-collapsed-header{border-bottom-left-radius:calc(var(--gl-card-border-radius) - 1px);border-bottom-right-radius:calc(var(--gl-card-border-radius) - 1px)}.web-only .duo-chat-input{overflow:visible;position:relative}.web-only .duo-chat-input:after{padding:var(--gl-spacing-scale-2)}.web-only .duo-chat-message pre code{background-color:initial!important;color:initial!important}.duo-chat-loader{display:flex}.duo-chat-loader .transition{transition:width .2s cubic-bezier(.22,.61,.36,1)}@media (prefers-reduced-motion){.duo-chat-loader .transition{transition-delay:0ms!important;transition-duration:.01ms!important}}.duo-chat-loader .text-enter{opacity:var(--gl-opacity-0)}.duo-chat-loader .text-enter-active{transition:opacity .4s cubic-bezier(.22,.61,.36,1)}@media (prefers-reduced-motion){.duo-chat-loader .text-enter-active{transition-delay:0ms!important;transition-duration:.01ms!important}}.duo-chat-loader .text-enter-to,.duo-chat-loader .text-leave{opacity:var(--gl-opacity-10)}.duo-chat-loader .text-leave-active{transition:opacity .2s cubic-bezier(.22,.61,.36,1)}@media (prefers-reduced-motion){.duo-chat-loader .text-leave-active{transition-delay:0ms!important;transition-duration:.01ms!important}}.duo-chat-loader .text-leave-to{opacity:var(--gl-opacity-0)}.duo-chat-message{--gl-text-color-heading:var(--duo-chat-message-heading-color,inherit)!important;border-radius:1rem 1rem 0;color:var(--duo-chat-message-color,inherit)!important;position:relative}.duo-chat-message code{background-color:var(--gl-status-neutral-background-color)}.duo-chat-message pre{background-color:var(--gl-background-color-preformat,var(--gl-background-color-default));border-color:var(--gl-border-color-default);border-style:solid;border-width:1px;box-shadow:none!important;color:var(--duo-chat-message-pre-color,inherit)!important;color:inherit;max-height:60vh;padding:var(--gl-spacing-scale-3) var(--gl-spacing-scale-4)}.duo-chat-message pre:after,.duo-chat-message pre:before{border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem;content:"";height:var(--gl-spacing-scale-7);left:1px;pointer-events:none;position:absolute;width:calc(100% - 2px)}.duo-chat-message pre.scrim-top:before{--tw-rotate:-180deg;background:linear-gradient(to bottom,#0000,var(--gl-background-color-default));top:1px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.duo-chat-message pre.scrim-bottom:after{background:linear-gradient(to bottom,#0000,var(--gl-background-color-default));bottom:1px}.duo-chat-message pre code{background-color:initial;font-size:var(--gl-font-size-sm);line-height:1;white-space:inherit}.duo-chat-message p:not(:last-of-type){margin-bottom:var(--gl-spacing-scale-4)}.duo-chat-message p:last-of-type{margin-bottom:var(--gl-spacing-scale-0)}.duo-chat-message copy-code,.duo-chat-message insert-code-snippet{opacity:var(--gl-opacity-0);position:absolute;right:.5rem;top:.5rem;transition-duration:.2s;transition-property:all;transition-timing-function:ease}.duo-chat-message copy-code [role=tooltip],.duo-chat-message insert-code-snippet [role=tooltip]{background-color:var(--gray-100);border-radius:.25rem;display:none;left:0;position:absolute;top:0;width:max-content}.duo-chat-message copy-code [role=tooltip] .arrow,.duo-chat-message insert-code-snippet [role=tooltip] .arrow{background:inherit;height:var(--gl-spacing-scale-3);position:absolute;transform:rotate(45deg);width:var(--gl-spacing-scale-3)}.duo-chat-message copy-code{margin-right:2.5rem}.duo-chat-message .js-markdown-code.markdown-code-block:hover copy-code,.duo-chat-message .js-markdown-code.markdown-code-block:hover copy-code:focus-within,.duo-chat-message .js-markdown-code.markdown-code-block:hover insert-code-snippet,.duo-chat-message .js-markdown-code.markdown-code-block:hover insert-code-snippet:focus-within{opacity:var(--gl-opacity-10)}.insert-code-hidden insert-code-snippet{display:none}.insert-code-hidden copy-code{margin-right:0}.duo-message-pre-block:focus .copy-to-clipboard-button-container,.duo-message-pre-block:hover .copy-to-clipboard-button-container{opacity:1}.duo-message-pre-block .copy-to-clipboard-button-container:has(button:focus){opacity:1}.recents-wrapper .gl-accordion-item-header .gl-button.gl-button.btn-link{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;border-radius:var(--gl-border-radius-none);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);display:block;font-size:var(--gl-font-size-sm);font-weight:var(--gl-font-weight-bold);padding-bottom:var(--gl-spacing-scale-2);padding-left:var(--gl-spacing-scale-3);padding-top:var(--gl-spacing-scale-2);text-decoration-line:none;text-transform:uppercase;width:100%}.recents-wrapper .gl-accordion-item-header>.collapse{margin-left:var(--gl-spacing-scale-0)}.recents-wrapper .gl-text-base{margin-top:var(--gl-spacing-scale-0)}
+@charset "UTF-8";.resizable-content{--tw-shadow:var(--gl-shadow-lg);--tw-shadow-colored:var(--gl-shadow-lg);background:var(--gl-background-color-default);border-radius:.5rem;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);font-size:var(--gl-font-size-base);height:100%;overflow-y:auto;width:100%}.recents-wrapper .resizable-content{margin-top:var(--gl-spacing-scale-0)}.resizable-content{display:flex;flex-direction:column;line-height:1rem}.resizable-component .resizable-l,.resizable-component .resizable-t{background-color:initial;border-radius:3px;transition:background-color .2s cubic-bezier(.22,.61,.36,1)}@media (prefers-reduced-motion){.resizable-component .resizable-l,.resizable-component .resizable-t{transition-delay:0ms!important;transition-duration:.01ms!important}}.resizable-component .resizable-l:hover,.resizable-component .resizable-t:hover{background-color:var(--gl-color-blue-200)}.resizable-component .resizable-t{height:4px!important;left:50%!important;top:2px!important;transform:translateX(-50%);width:95%!important}.resizable-component .resizable-l{height:95%!important;left:2px!important;top:50%!important;transform:translateY(-50%);width:4px!important}.resizable-component .duo-chat{z-index:var(--gl-zindex-0)}.resizable-component .resizable-l,.resizable-component .resizable-lt,.resizable-component .resizable-t{z-index:var(--gl-zindex-1)}.duo-chat{font-family:var(--gl-font-family-regular);z-index:999}.duo-chat .message-enter-active,.duo-chat .message-leave-active{transition:all .5s ease}.duo-chat .message-enter,.duo-chat .message-leave-to{opacity:var(--gl-opacity-0);transform:translateY(10px)}.duo-chat .duo-chat-loader.message-leave,.duo-chat .duo-chat-loader.message-leave-to{transition:none}.duo-chat .duo-agent-mode-switcher>*,.duo-chat .duo-model-switcher>*{width:100%}.duo-chat-drawer{--tw-shadow:var(--gl-shadow-lg);--tw-shadow-colored:var(--gl-shadow-lg);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);font-size:var(--gl-font-size-base);height:100%;overflow-y:auto;position:fixed;right:0;transition-duration:.2s;transition-property:all;transition-timing-function:ease;width:100%}.recents-wrapper .duo-chat-drawer{margin-top:var(--gl-spacing-scale-0)}.duo-chat-drawer{display:flex;flex-direction:column;line-height:1rem}.duo-chat-drawer-footer{padding-bottom:var(--gl-spacing-scale-4);padding-left:var(--gl-spacing-scale-4);padding-right:var(--gl-spacing-scale-4)}.duo-chat-drawer-footer:before{--tw-translate-y:-100%;background:linear-gradient(to bottom,#0000,var(--gl-background-color-default));content:"";height:var(--gl-spacing-scale-4);left:0;pointer-events:none;position:absolute;top:0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));width:100%}.duo-chat-history{scroll-behavior:smooth}.duo-chat-history *{overflow-anchor:none}.duo-chat-history .scroll-anchor{height:1px;margin-top:-1px;overflow-anchor:auto}.history-item{align-items:center;background:var(--gl-button-default-tertiary-background-color-default);border-radius:var(--gl-border-radius-lg);display:flex;gap:var(--gl-spacing-scale-3);margin-left:calc(var(--gl-spacing-scale-3)*-1);margin-right:calc(var(--gl-spacing-scale-3)*-1);padding-right:var(--gl-spacing-scale-2);transition:background-color .2s cubic-bezier(.22,.61,.36,1)}.history-item:focus,.history-item:focus-within,.history-item:hover{background:var(--gl-button-default-tertiary-background-color-hover)}.history-item:focus .history-remove-button,.history-item:focus-within .history-remove-button,.history-item:hover .history-remove-button{opacity:1}.history-item .history-remove-button{opacity:0;transition:opacity .2s cubic-bezier(.22,.61,.36,1)}.history-item .history-item-name{border-radius:var(--gl-border-radius-lg);border-width:0;padding:var(--gl-spacing-scale-3)}.history-item .history-item-name,.history-item .history-item-name:active,.history-item .history-item-name:focus,.history-item .history-item-name:hover{background-color:initial!important}.history-item .gl-button-text{align-items:center;display:flex;flex-direction:row;gap:var(--gl-spacing-scale-3);text-align:left;width:100%}.duo-chat-input{background:var(--gl-control-background-color-default);border-radius:1.25rem;box-shadow:inset 0 0 0 1px var(--gl-control-border-color-default);display:flex;flex-direction:column;max-height:240px;overflow:hidden}.duo-chat-input:focus-within{box-shadow:inset 0 0 0 1px var(--gl-control-border-color-focus),0 0 0 1px var(--gl-focus-ring-inner-color),0 0 0 3px var(--gl-focus-ring-outer-color);outline:none}@media (forced-colors:active){.duo-chat-input:focus-within{outline:2px solid LinkText}}.duo-chat-input .gl-form-textarea.form-control{border-radius:1.25rem;flex:1;max-height:240px;padding-right:40px;resize:none}.duo-chat-input:after{content:attr(data-value) " ";font-family:var(--gl-font-family-regular);padding:var(--gl-spacing-scale-4);padding-right:40px;visibility:hidden;word-break:break-word}.duo-chat .duo-chat-suggestion-button{border-radius:1rem}.slash-commands{margin-top:calc(var(--gl-spacing-scale-2)*-1)}.slash-commands .active-command{background-color:var(--gl-background-color-strong);border-radius:.25rem}.slash-commands .gl-dropdown-item button.dropdown-item{background-color:initial;font-size:var(--gl-font-size-sm);padding-left:var(--gl-spacing-scale-3);padding-right:var(--gl-spacing-scale-3)}.slash-commands .gl-dropdown-item button.dropdown-item:hover{background-color:initial}.duo-chat-markdown{color:#3a383f;font-family:var(--gl-font-family-regular);font-size:var(--gl-font-size-lg);font-weight:var(--gl-font-weight-normal);line-height:var(--gl-line-height-24)}.duo-chat-markdown :first-child{margin-top:var(--gl-spacing-scale-0)}.duo-chat-markdown .gl-h1,.duo-chat-markdown h1{font-size:clamp(1.5rem,.8333333333rem + 1.3888888889vw,1.875rem);margin-top:0;margin-top:var(--gl-spacing-scale-7)}.duo-chat-markdown .gl-h1,.duo-chat-markdown .gl-h2,.duo-chat-markdown h1,.duo-chat-markdown h2{color:var(--gl-text-color-heading);font-weight:600;letter-spacing:-.01em;line-height:1.25;margin-bottom:1rem}.duo-chat-markdown .gl-h2,.duo-chat-markdown h2{font-size:clamp(1.3125rem,.8680555556rem + .9259259259vw,1.5625rem);margin-top:0;margin-top:var(--gl-spacing-scale-6)}.duo-chat-markdown .gl-h3,.duo-chat-markdown h3{font-size:clamp(1.125rem,.9027777778rem + .462962963vw,1.25rem);margin-top:0;margin-top:var(--gl-spacing-scale-6)}.duo-chat-markdown .gl-h3,.duo-chat-markdown .gl-h4,.duo-chat-markdown h3,.duo-chat-markdown h4{color:var(--gl-text-color-heading);font-weight:600;letter-spacing:inherit;line-height:1.25;margin-bottom:1rem}.duo-chat-markdown .gl-h4,.duo-chat-markdown h4{font-size:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-5)}.duo-chat-markdown .gl-h5,.duo-chat-markdown h5{font-size:.875rem}.duo-chat-markdown .gl-h5,.duo-chat-markdown .gl-h6,.duo-chat-markdown h5,.duo-chat-markdown h6{color:var(--gl-text-color-heading);font-weight:600;letter-spacing:inherit;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-5)}.duo-chat-markdown .gl-h6,.duo-chat-markdown h6{font-size:.8125rem}.duo-chat-markdown .gl-paragraph,.duo-chat-markdown p{margin-bottom:var(--gl-spacing-scale-0);margin-top:var(--gl-spacing-scale-0)}.duo-chat-markdown .gl-paragraph+.gl-paragraph,.duo-chat-markdown .gl-paragraph+p,.duo-chat-markdown p+.gl-paragraph,.duo-chat-markdown p+p{margin-top:var(--gl-spacing-scale-5)}.duo-chat-markdown .gl-paragraph.sm,.duo-chat-markdown .sm,.duo-chat-markdown p.sm{font-size:.875rem;line-height:var(--gl-line-height-20)}.duo-chat-markdown .monospace,.duo-chat-markdown code{font-family:var(--gl-font-family-monospace);font-family:var(--default-mono-font,"GitLab Mono"),"JetBrains Mono","Menlo","DejaVu Sans Mono","Liberation Mono","Consolas","Ubuntu Mono","Courier New","andale mono","lucida console",monospace;font-variant-ligatures:none}.duo-chat-markdown blockquote{box-shadow:inset 4px 0 0 0 #dcdcde;color:var(--gray-700);margin:var(--gl-spacing-scale-3) var(--gl-spacing-scale-0);padding-bottom:var(--gl-spacing-scale-3);padding-left:var(--gl-spacing-scale-6);padding-top:var(--gl-spacing-scale-3)}.duo-chat-markdown .idiff{border-radius:.25rem;display:inline-flex;padding-left:var(--gl-spacing-scale-2);padding-right:var(--gl-spacing-scale-2)}.duo-chat-markdown .deletion{background-color:var(--red-100)}.duo-chat-markdown .addition{background-color:var(--green-100)}.duo-chat-markdown code{background-color:var(--gray-50);border-radius:.25rem;color:var(--gray-950);padding:var(--gl-spacing-scale-1) var(--gl-spacing-scale-2)}.duo-chat-markdown pre{border-radius:.25rem;box-shadow:inset 0 0 0 1px #dcdcde;margin-bottom:var(--gl-spacing-scale-7);margin-top:var(--gl-spacing-scale-7);overflow:auto;padding:var(--gl-spacing-scale-3) var(--gl-spacing-scale-4)}.duo-chat-markdown pre code{background-color:var(--white);border-radius:var(--gl-border-radius-none);color:var(--gray-900);padding:var(--gl-spacing-scale-0)}.duo-chat-markdown .audio-container{display:inline-flex;flex-direction:column;width:100%}.duo-chat-markdown .audio-container audio{width:100%}.duo-chat-markdown .audio-container a{margin-top:var(--gl-spacing-scale-3)}.duo-chat-markdown .audio-container a:before{-webkit-font-smoothing:antialiased;content:"📎";margin-right:var(--gl-spacing-scale-2);text-rendering:auto}.duo-chat-markdown table{margin-bottom:var(--gl-spacing-scale-7);margin-top:var(--gl-spacing-scale-7)}.duo-chat-markdown table td,.duo-chat-markdown table th{box-shadow:inset 0 -1px 0 0 #dcdcde;padding:var(--gl-spacing-scale-4) var(--gl-spacing-scale-3);vertical-align:top}.duo-chat-markdown table th{box-shadow:inset 0 1px 0 0 #dcdcde,inset 0 -1px 0 0 #dcdcde;font-weight:var(--gl-font-weight-bold)}.duo-chat-markdown table thead{background-color:var(--gray-50)}.duo-chat-markdown table tr:nth-child(2n){background-color:var(--gray-10)}.duo-chat-compact-markdown{font-size:var(--gl-font-size-base)}.recents-wrapper .duo-chat-compact-markdown{margin-top:var(--gl-spacing-scale-0)}.duo-chat-compact-markdown{line-height:var(--gl-line-height-20)}.duo-chat-compact-markdown .gl-h1,.duo-chat-compact-markdown h1{color:var(--gl-text-color-heading);font-size:1.5rem;font-weight:600;letter-spacing:-.01em;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-7)}.duo-chat-compact-markdown .gl-h2,.duo-chat-compact-markdown h2{font-size:1.3125rem;letter-spacing:-.01em}.duo-chat-compact-markdown .gl-h2,.duo-chat-compact-markdown .gl-h3,.duo-chat-compact-markdown h2,.duo-chat-compact-markdown h3{color:var(--gl-text-color-heading);font-weight:600;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-6)}.duo-chat-compact-markdown .gl-h3,.duo-chat-compact-markdown h3{font-size:1.125rem;letter-spacing:inherit}.duo-chat-compact-markdown .gl-h4,.duo-chat-compact-markdown h4{font-size:1rem}.duo-chat-compact-markdown .gl-h4,.duo-chat-compact-markdown .gl-h5,.duo-chat-compact-markdown h4,.duo-chat-compact-markdown h5{color:var(--gl-text-color-heading);font-weight:600;letter-spacing:inherit;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-5)}.duo-chat-compact-markdown .gl-h5,.duo-chat-compact-markdown h5{font-size:.875rem}.duo-chat-compact-markdown .gl-h6,.duo-chat-compact-markdown h6{color:var(--gl-text-color-heading);font-size:.8125rem;font-weight:600;letter-spacing:inherit;line-height:1.25;margin-bottom:1rem;margin-top:0;margin-top:var(--gl-spacing-scale-5)}.duo-chat-compact-markdown .sm{font-size:var(--gl-font-size-sm)}.duo-chat-compact-markdown .monospace,.duo-chat-compact-markdown code{font-family:var(--gl-font-family-monospace);font-family:var(--default-mono-font,"GitLab Mono"),"JetBrains Mono","Menlo","DejaVu Sans Mono","Liberation Mono","Consolas","Ubuntu Mono","Courier New","andale mono","lucida console",monospace;font-variant-ligatures:none}.duo-chat-compact-markdown table td,.duo-chat-compact-markdown table th{padding-bottom:var(--gl-spacing-scale-3);padding-top:var(--gl-spacing-scale-3)}.message-tool-approval-collapsed{border-bottom:0}.message-tool-approval-collapsed-header{border-bottom-left-radius:calc(var(--gl-card-border-radius) - 1px);border-bottom-right-radius:calc(var(--gl-card-border-radius) - 1px)}.web-only .duo-chat-input{overflow:visible;position:relative}.web-only .duo-chat-input:after{padding:var(--gl-spacing-scale-2)}.web-only .duo-chat-message pre code{background-color:initial!important;color:inherit!important}.duo-chat-loader{display:flex}.duo-chat-loader .transition{transition:width .2s cubic-bezier(.22,.61,.36,1)}@media (prefers-reduced-motion){.duo-chat-loader .transition{transition-delay:0ms!important;transition-duration:.01ms!important}}.duo-chat-loader .text-enter{opacity:var(--gl-opacity-0)}.duo-chat-loader .text-enter-active{transition:opacity .4s cubic-bezier(.22,.61,.36,1)}@media (prefers-reduced-motion){.duo-chat-loader .text-enter-active{transition-delay:0ms!important;transition-duration:.01ms!important}}.duo-chat-loader .text-enter-to,.duo-chat-loader .text-leave{opacity:var(--gl-opacity-10)}.duo-chat-loader .text-leave-active{transition:opacity .2s cubic-bezier(.22,.61,.36,1)}@media (prefers-reduced-motion){.duo-chat-loader .text-leave-active{transition-delay:0ms!important;transition-duration:.01ms!important}}.duo-chat-loader .text-leave-to{opacity:var(--gl-opacity-0)}.duo-chat-message{--gl-text-color-heading:var(--duo-chat-message-heading-color,inherit)!important;border-radius:1rem 1rem 0;color:var(--duo-chat-message-color,inherit)!important;position:relative}.duo-chat-message code{background-color:var(--gl-status-neutral-background-color)}.duo-chat-message pre{background-color:var(--gl-background-color-preformat,var(--gl-background-color-default));border-color:var(--gl-border-color-default);border-style:solid;border-width:1px;box-shadow:none!important;color:var(--duo-chat-message-pre-color,inherit)!important;color:inherit;max-height:60vh;padding:var(--gl-spacing-scale-3) var(--gl-spacing-scale-4)}.duo-chat-message pre:after,.duo-chat-message pre:before{border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem;content:"";height:var(--gl-spacing-scale-7);left:1px;pointer-events:none;position:absolute;width:calc(100% - 2px)}.duo-chat-message pre.scrim-top:before{--tw-rotate:-180deg;background:linear-gradient(to bottom,#0000,var(--gl-background-color-default));top:1px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.duo-chat-message pre.scrim-bottom:after{background:linear-gradient(to bottom,#0000,var(--gl-background-color-default));bottom:1px}.duo-chat-message pre code{background-color:initial;font-size:var(--gl-font-size-sm);line-height:1;white-space:inherit}.duo-chat-message p:not(:last-of-type){margin-bottom:var(--gl-spacing-scale-4)}.duo-chat-message p:last-of-type{margin-bottom:var(--gl-spacing-scale-0)}.duo-chat-message copy-code,.duo-chat-message insert-code-snippet{opacity:var(--gl-opacity-0);position:absolute;right:.5rem;top:.5rem;transition-duration:.2s;transition-property:all;transition-timing-function:ease}.duo-chat-message copy-code [role=tooltip],.duo-chat-message insert-code-snippet [role=tooltip]{background-color:var(--gray-100);border-radius:.25rem;display:none;left:0;position:absolute;top:0;width:max-content}.duo-chat-message copy-code [role=tooltip] .arrow,.duo-chat-message insert-code-snippet [role=tooltip] .arrow{background:inherit;height:var(--gl-spacing-scale-3);position:absolute;transform:rotate(45deg);width:var(--gl-spacing-scale-3)}.duo-chat-message copy-code{margin-right:2.5rem}.duo-chat-message .js-markdown-code.markdown-code-block:hover copy-code,.duo-chat-message .js-markdown-code.markdown-code-block:hover copy-code:focus-within,.duo-chat-message .js-markdown-code.markdown-code-block:hover insert-code-snippet,.duo-chat-message .js-markdown-code.markdown-code-block:hover insert-code-snippet:focus-within{opacity:var(--gl-opacity-10)}.insert-code-hidden insert-code-snippet{display:none}.insert-code-hidden copy-code{margin-right:0}.duo-message-pre-block:focus .copy-to-clipboard-button-container,.duo-message-pre-block:hover .copy-to-clipboard-button-container{opacity:1}.duo-message-pre-block .copy-to-clipboard-button-container:has(button:focus){opacity:1}.recents-wrapper .gl-accordion-item-header .gl-button.gl-button.btn-link{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;border-radius:var(--gl-border-radius-none);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);display:block;font-size:var(--gl-font-size-sm);font-weight:var(--gl-font-weight-bold);padding-bottom:var(--gl-spacing-scale-2);padding-left:var(--gl-spacing-scale-3);padding-top:var(--gl-spacing-scale-2);text-decoration-line:none;text-transform:uppercase;width:100%}.recents-wrapper .gl-accordion-item-header>.collapse{margin-left:var(--gl-spacing-scale-0)}.recents-wrapper .gl-text-base{margin-top:var(--gl-spacing-scale-0)}
 /*# sourceMappingURL=components.css.map */

package/dist/components.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["components.scss"],"names":[],"mappings":"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","file":"components.css","sourcesContent":["@charset \"UTF-8\";\n/\n SASS preserves units in arithmetic operations. For example:\n* 12em * 0 = 0em. This function return the unit of a numeric value.\n\n For more examples, see: https://codepen.io/paulgv/pen/XWrqMgQ\n/\n/ stylelint-disable @gitlab/no-gl-deprecated-design-tokens /\n/ stylelint-enable @gitlab/no-gl-deprecated-design-tokens /\n/ stylelint-disable-next-line @gitlab/no-gl-deprecated-design-tokens /\n/ stylelint-disable-next-line @gitlab/no-gl-deprecated-design-tokens /\n/\n Declares a property with a fluid value that decreases or\n* rises depending on the viewport’s size. The property type\n* should be numeric.\n\n Values are expected in rem units.\n* Fluid range: between 48rem (768px) – 75rem (1200px).\n\n @param $property Property name, i.e. line-height, font-size, width, height, etc.\n* @param $min Property value lower bound.\n* @param $max Property value upper bound.\n/\n/\n Helper function for :focus\n\n @param $size is deprecated and should not be used anymore\n/\n/\n Helper function for @media of at least the minimum\n* breakpoint width.\n\n @param $name Breakpoint name, such as `sm` or `md`.\n/\n/\n Helper function for @media of at most the maximum\n* breakpoint width.\n\n Note: Before using, consider using a mobile-first\n* approach, and define @media for larger breakpoints\n* using `gl-media-breakpoint-up` while using this rule as\n* the starting point instead.\n\n @param $name Breakpoint, such as `sm` or `md`. `xs` is not valid\n/\n/\n Helper function to resolve font-size value from $gl-font-sizes and\n* $gl-font-sizes-fixed maps.\n\n @param $size Number font-size scale\n* @param $fixed Boolean toggle default and fixed font size scales\n/\n.resizable-content {\n height: 100%;\n width: 100%;\n background: var(--gl-background-color-default);\n border-radius: 0.5rem;\n @apply gl-overflow-y-auto;\n @apply gl-shadow-lg;\n @apply gl-text-base;\n @apply gl-leading-normal;\n @apply gl-flex;\n @apply gl-flex-col;\n}\n\n.resizable-component .resizable-t,\n.resizable-component .resizable-l {\n background-color: transparent;\n border-radius: 3px;\n transition: background-color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n@media (prefers-reduced-motion) {\n .resizable-component .resizable-t,\n.resizable-component .resizable-l {\n transition-duration: 0.01ms !important;\n transition-delay: 0ms !important;\n }\n}\n.resizable-component .resizable-t:hover,\n.resizable-component .resizable-l:hover {\n background-color: var(--gl-color-blue-200);\n}\n.resizable-component .resizable-t {\n width: 95% !important;\n transform: translateX(-50%);\n left: 50% !important;\n height: 4px !important;\n top: 2px !important;\n}\n.resizable-component .resizable-l {\n height: 95% !important;\n transform: translateY(-50%);\n top: 50% !important;\n width: 4px !important;\n left: 2px !important;\n}\n.resizable-component .duo-chat {\n @apply gl-z-0;\n}\n.resizable-component .resizable-l,\n.resizable-component .resizable-lt,\n.resizable-component .resizable-t {\n @apply gl-z-1;\n}\n\n.duo-chat {\n z-index: 999;\n @apply gl-font-regular;\n}\n.duo-chat .message-enter-active,\n.duo-chat .message-leave-active {\n transition: all 0.5s ease;\n}\n.duo-chat .message-enter,\n.duo-chat .message-leave-to {\n @apply gl-opacity-0;\n transform: translateY(10px);\n}\n.duo-chat .duo-chat-loader.message-leave,\n.duo-chat .duo-chat-loader.message-leave-to {\n transition: none;\n}\n.duo-chat .duo-agent-mode-switcher > ,\n.duo-chat .duo-model-switcher > * {\n width: 100%;\n}\n\n.duo-chat-drawer {\n right: 0;\n @apply gl-transition-all;\n position: fixed;\n @apply gl-h-full;\n @apply gl-w-full;\n @apply gl-overflow-y-auto;\n @apply gl-shadow-lg;\n @apply gl-text-base;\n @apply gl-leading-normal;\n @apply gl-flex;\n @apply gl-flex-col;\n}\n\n.duo-chat-drawer-footer {\n @apply gl-px-4;\n @apply gl-pb-4;\n}\n.duo-chat-drawer-footer::before {\n background: linear-gradient(to bottom, transparent, var(--gl-background-color-default));\n top: 0;\n @apply -gl-translate-y-full;\n content: \"\";\n left: 0;\n position: absolute;\n @apply gl-pointer-events-none;\n @apply gl-w-full;\n @apply gl-h-4;\n}\n\n.duo-chat-history {\n scroll-behavior: smooth;\n /\n Browsers a are pretty good at keeping the focus on an element while\n the parent element grows in size. With this we mark all child elements\n of the chat history as \"non\" anchors.\n https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-anchor\n /\n /\n Right at the bottom of the chat history we add a scroll-anchor element.\n This scroll-anchor element is the only \"possible\" anchor. The beauty of it:\n It only will be used as an anchor _if_ it is currently inside the view port.\n So if the user manually scrolls up while a chunked message is coming in,\n it won't stick to the bottom while the message still loads.\n /\n}\n.duo-chat-history * {\n overflow-anchor: none;\n}\n.duo-chat-history .scroll-anchor {\n overflow-anchor: auto;\n height: 1px;\n margin-top: -1px;\n}\n\n.history-item {\n @apply gl-pr-2;\n @apply -gl-mx-3;\n @apply gl-rounded-lg;\n @apply gl-flex;\n @apply gl-gap-3;\n @apply gl-items-center;\n background: var(--gl-button-default-tertiary-background-color-default);\n transition: background-color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n.history-item:hover, .history-item:focus, .history-item:focus-within {\n background: var(--gl-button-default-tertiary-background-color-hover);\n}\n.history-item:hover .history-remove-button, .history-item:focus .history-remove-button, .history-item:focus-within .history-remove-button {\n opacity: 1;\n}\n.history-item .history-remove-button {\n opacity: 0;\n transition: opacity 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n.history-item .history-item-name {\n @apply gl-py-3;\n @apply gl-px-3;\n @apply gl-rounded-lg;\n @apply gl-border-0;\n}\n.history-item .history-item-name, .history-item .history-item-name:hover, .history-item .history-item-name:active, .history-item .history-item-name:focus {\n background-color: transparent !important;\n}\n.history-item .gl-button-text {\n @apply gl-w-full;\n @apply gl-flex;\n @apply gl-flex-row;\n @apply gl-items-center;\n @apply gl-gap-3;\n @apply gl-text-left;\n}\n\n.duo-chat-input {\n @apply gl-flex;\n @apply gl-flex-col;\n max-height: 240px;\n overflow: hidden;\n background: var(--gl-control-background-color-default);\n box-shadow: inset 0 0 0 1px var(--gl-control-border-color-default);\n border-radius: 1.25rem;\n}\n.duo-chat-input:focus-within {\n box-shadow: inset 0 0 0 1px var(--gl-control-border-color-focus), 0 0 0 1px var(--gl-focus-ring-inner-color), 0 0 0 3px var(--gl-focus-ring-outer-color);\n outline: none;\n}\n@media (forced-colors: active) {\n .duo-chat-input:focus-within {\n outline: 2px solid LinkText;\n }\n}\n.duo-chat-input .gl-form-textarea.form-control {\n flex: 1;\n resize: none;\n max-height: 240px;\n padding-right: 40px;\n border-radius: 1.25rem;\n}\n.duo-chat-input::after {\n content: attr(data-value) \" \";\n @apply gl-invisible;\n @apply gl-p-4;\n @apply gl-font-regular;\n padding-right: 40px;\n word-break: break-word;\n}\n\n.duo-chat .duo-chat-suggestion-button {\n @apply gl-rounded-[1rem];\n}\n\n.slash-commands {\n @apply -gl-mt-2;\n}\n.slash-commands .active-command {\n @apply gl-bg-strong;\n @apply gl-rounded-base;\n}\n.slash-commands .gl-dropdown-item button.dropdown-item {\n @apply gl-text-sm;\n @apply gl-px-3;\n @apply gl-bg-transparent;\n}\n.slash-commands .gl-dropdown-item button.dropdown-item:hover {\n @apply gl-bg-transparent;\n}\n\n.duo-chat-markdown {\n @apply gl-text-lg;\n @apply gl-leading-24;\n color: #3a383f;\n @apply gl-font-regular;\n @apply gl-font-normal;\n}\n.duo-chat-markdown :first-child {\n @apply gl-mt-0;\n}\n.duo-chat-markdown h1,\n.duo-chat-markdown .gl-h1 {\n @apply gl-heading-1;\n @apply gl-mt-7;\n}\n.duo-chat-markdown h2,\n.duo-chat-markdown .gl-h2 {\n @apply gl-heading-2;\n @apply gl-mt-6;\n}\n.duo-chat-markdown h3,\n.duo-chat-markdown .gl-h3 {\n @apply gl-heading-3;\n @apply gl-mt-6;\n}\n.duo-chat-markdown h4,\n.duo-chat-markdown .gl-h4 {\n @apply gl-heading-4;\n @apply gl-mt-5;\n}\n.duo-chat-markdown h5,\n.duo-chat-markdown .gl-h5 {\n @apply gl-heading-5;\n @apply gl-mt-5;\n}\n.duo-chat-markdown h6,\n.duo-chat-markdown .gl-h6 {\n @apply gl-heading-6;\n @apply gl-mt-5;\n}\n.duo-chat-markdown p,\n.duo-chat-markdown .gl-paragraph {\n @apply gl-mt-0;\n @apply gl-mb-0;\n}\n.duo-chat-markdown p + p,\n.duo-chat-markdown p + .gl-paragraph,\n.duo-chat-markdown .gl-paragraph + p,\n.duo-chat-markdown .gl-paragraph + .gl-paragraph {\n @apply gl-mt-5;\n}\n.duo-chat-markdown p.sm,\n.duo-chat-markdown .gl-paragraph.sm {\n font-size: 0.875rem;\n @apply gl-leading-20;\n}\n.duo-chat-markdown .sm {\n font-size: 0.875rem;\n @apply gl-leading-20;\n}\n.duo-chat-markdown .monospace,\n.duo-chat-markdown code {\n @apply gl-font-monospace;\n}\n.duo-chat-markdown blockquote {\n @apply gl-text-gray-700;\n @apply gl-py-3;\n @apply gl-pl-6;\n @apply gl-my-3;\n @apply gl-mx-0;\n box-shadow: inset 4px 0 0 0 #dcdcde;\n}\n.duo-chat-markdown .idiff {\n @apply gl-rounded-base;\n @apply gl-inline-flex;\n @apply gl-px-2;\n}\n.duo-chat-markdown .deletion {\n @apply gl-bg-red-100;\n}\n.duo-chat-markdown .addition {\n @apply gl-bg-green-100;\n}\n.duo-chat-markdown code {\n @apply gl-rounded-base;\n @apply gl-bg-gray-50;\n @apply gl-text-gray-950;\n @apply gl-px-2;\n @apply gl-py-1;\n}\n.duo-chat-markdown pre {\n @apply gl-rounded-base;\n @apply gl-py-3;\n @apply gl-px-4;\n box-shadow: inset 0 0 0 1px #dcdcde;\n @apply gl-my-7;\n @apply gl-overflow-auto;\n}\n.duo-chat-markdown pre code {\n @apply gl-bg-white;\n @apply gl-rounded-none;\n @apply gl-text-gray-900;\n @apply gl-p-0;\n}\n.duo-chat-markdown .audio-container {\n @apply gl-inline-flex;\n @apply gl-flex-col;\n @apply gl-w-full;\n}\n.duo-chat-markdown .audio-container audio {\n @apply gl-w-full;\n}\n.duo-chat-markdown .audio-container a {\n @apply gl-mt-3;\n}\n.duo-chat-markdown .audio-container a::before {\n @apply gl-mr-2;\n text-rendering: auto;\n -webkit-font-smoothing: antialiased;\n content: \"📎\";\n}\n.duo-chat-markdown table {\n @apply gl-my-7;\n}\n.duo-chat-markdown table th,\n.duo-chat-markdown table td {\n @apply gl-px-3;\n @apply gl-py-4;\n box-shadow: inset 0 -1px 0 0 #dcdcde;\n @apply gl-align-top;\n}\n.duo-chat-markdown table th {\n box-shadow: inset 0 1px 0 0 #dcdcde, inset 0 -1px 0 0 #dcdcde;\n @apply gl-font-bold;\n}\n.duo-chat-markdown table thead {\n @apply gl-bg-gray-50;\n}\n.duo-chat-markdown table tr:nth-child(even) {\n @apply gl-bg-gray-10;\n}\n\n.duo-chat-compact-markdown {\n @apply gl-text-base;\n @apply gl-leading-20;\n}\n.duo-chat-compact-markdown h1,\n.duo-chat-compact-markdown .gl-h1 {\n @apply gl-heading-1-fixed;\n @apply gl-mt-7;\n}\n.duo-chat-compact-markdown h2,\n.duo-chat-compact-markdown .gl-h2 {\n @apply gl-heading-2-fixed;\n @apply gl-mt-6;\n}\n.duo-chat-compact-markdown h3,\n.duo-chat-compact-markdown .gl-h3 {\n @apply gl-heading-3-fixed;\n @apply gl-mt-6;\n}\n.duo-chat-compact-markdown h4,\n.duo-chat-compact-markdown .gl-h4 {\n @apply gl-heading-4-fixed;\n @apply gl-mt-5;\n}\n.duo-chat-compact-markdown h5,\n.duo-chat-compact-markdown .gl-h5 {\n @apply gl-heading-5-fixed;\n @apply gl-mt-5;\n}\n.duo-chat-compact-markdown h6,\n.duo-chat-compact-markdown .gl-h6 {\n @apply gl-heading-6-fixed;\n @apply gl-mt-5;\n}\n.duo-chat-compact-markdown .sm {\n @apply gl-text-sm;\n}\n.duo-chat-compact-markdown .monospace,\n.duo-chat-compact-markdown code {\n @apply gl-font-monospace;\n}\n.duo-chat-compact-markdown table th,\n.duo-chat-compact-markdown table td {\n @apply gl-py-3;\n}\n\n.message-tool-approval-collapsed {\n border-bottom: 0;\n}\n\n.message-tool-approval-collapsed-header {\n border-bottom-left-radius: calc(var(--gl-card-border-radius) - 1px);\n border-bottom-right-radius: calc(var(--gl-card-border-radius) - 1px);\n}\n\n.web-only .duo-chat-input {\n position: relative;\n overflow: visible;\n}\n.web-only .duo-chat-input::after {\n @apply gl-p-2;\n}\n\n.web-only .duo-chat-message pre code {\n color: initial !important;\n background-color: transparent !important;\n}\n\n.duo-chat-loader {\n @apply gl-flex;\n}\n.duo-chat-loader .transition {\n transition: width 200ms cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n@media (prefers-reduced-motion) {\n .duo-chat-loader .transition {\n transition-duration: 0.01ms !important;\n transition-delay: 0ms !important;\n }\n}\n.duo-chat-loader .text-enter {\n @apply gl-opacity-0;\n}\n.duo-chat-loader .text-enter-active {\n transition: opacity 400ms cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n@media (prefers-reduced-motion) {\n .duo-chat-loader .text-enter-active {\n transition-duration: 0.01ms !important;\n transition-delay: 0ms !important;\n }\n}\n.duo-chat-loader .text-enter-to {\n @apply gl-opacity-10;\n}\n.duo-chat-loader .text-leave {\n @apply gl-opacity-10;\n}\n.duo-chat-loader .text-leave-active {\n transition: opacity 200ms cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n@media (prefers-reduced-motion) {\n .duo-chat-loader .text-leave-active {\n transition-duration: 0.01ms !important;\n transition-delay: 0ms !important;\n }\n}\n.duo-chat-loader .text-leave-to {\n @apply gl-opacity-0;\n}\n\n.duo-chat-message {\n position: relative;\n border-radius: 1rem 1rem 0;\n color: var(--duo-chat-message-color, inherit) !important;\n --gl-text-color-heading: var(--duo-chat-message-heading-color, inherit) !important;\n}\n.duo-chat-message code {\n @apply gl-bg-status-neutral;\n}\n.duo-chat-message pre {\n box-shadow: none !important;\n color: var(--duo-chat-message-pre-color, inherit) !important;\n @apply gl-border gl-max-h-[60vh] gl-px-4 gl-py-3 gl-text-inherit;\n background-color: var(--gl-background-color-preformat, var(--gl-background-color-default));\n}\n.duo-chat-message pre::before, .duo-chat-message pre::after {\n content: \"\";\n left: 1px;\n width: calc(100% - 2px);\n position: absolute;\n @apply gl-pointer-events-none gl-h-7 gl-rounded-b-base;\n}\n.duo-chat-message pre.scrim-top::before {\n background: linear-gradient(to bottom, transparent, var(--gl-background-color-default));\n top: 1px;\n @apply -gl-rotate-180;\n}\n.duo-chat-message pre.scrim-bottom::after {\n background: linear-gradient(to bottom, transparent, var(--gl-background-color-default));\n bottom: 1px;\n}\n.duo-chat-message pre code {\n @apply gl-text-sm;\n @apply gl-leading-1;\n @apply gl-bg-transparent;\n white-space: inherit;\n}\n.duo-chat-message p:not(:last-of-type) {\n @apply gl-mb-4;\n}\n.duo-chat-message p:last-of-type {\n @apply gl-mb-0;\n}\n.duo-chat-message copy-code,\n.duo-chat-message insert-code-snippet {\n position: absolute;\n @apply gl-transition-all;\n @apply gl-opacity-0;\n right: 0.5rem;\n top: 0.5rem;\n}\n.duo-chat-message copy-code [role=tooltip],\n.duo-chat-message insert-code-snippet [role=tooltip] {\n display: none;\n @apply gl-bg-gray-100;\n width: max-content;\n position: absolute;\n top: 0;\n left: 0;\n @apply gl-rounded-base;\n}\n.duo-chat-message copy-code [role=tooltip] .arrow,\n.duo-chat-message insert-code-snippet [role=tooltip] .arrow {\n position: absolute;\n background: inherit;\n @apply gl-h-3 gl-w-3;\n transform: rotate(45deg);\n}\n.duo-chat-message copy-code {\n margin-right: 2.5rem;\n}\n.duo-chat-message .js-markdown-code.markdown-code-block:hover copy-code,\n.duo-chat-message .js-markdown-code.markdown-code-block:hover copy-code:focus-within,\n.duo-chat-message .js-markdown-code.markdown-code-block:hover insert-code-snippet,\n.duo-chat-message .js-markdown-code.markdown-code-block:hover insert-code-snippet:focus-within {\n @apply gl-opacity-10;\n}\n\n.insert-code-hidden insert-code-snippet {\n display: none;\n}\n.insert-code-hidden copy-code {\n margin-right: 0;\n}\n\n.duo-message-pre-block:focus .copy-to-clipboard-button-container,\n.duo-message-pre-block:hover .copy-to-clipboard-button-container {\n opacity: 1;\n}\n\n.duo-message-pre-block .copy-to-clipboard-button-container:has(button:focus) {\n opacity: 1;\n}\n\n.recents-wrapper .gl-accordion-item-header .gl-button.gl-button.btn-link {\n @apply gl-block;\n @apply gl-w-full;\n @apply gl-pl-3;\n @apply gl-py-2;\n @apply gl-rounded-none;\n @apply gl-shadow-none;\n @apply gl-no-underline;\n @apply gl-uppercase;\n @apply gl-font-bold;\n @apply gl-text-sm;\n}\n.recents-wrapper .gl-accordion-item-header > .collapse {\n @apply gl-ml-0;\n}\n.recents-wrapper .gl-text-base {\n @apply gl-mt-0;\n}"]}
1	+ {"version":3,"sources":["components.scss"],"names":[],"mappings":"AAsYE,gBAAc,CAlVhB,mBAME,+BAAmB,CAAnB,uCAAmB,CAHnB,6CAA8C,CAC9C,mBAAqB,CAErB,kGAAmB,CACnB,kCAAmB,CANnB,WAAY,CAIZ,eAAyB,CAHzB,UASF,CAJE,oCAAA,oCAAmB,CACnB,mBACA,YAAc,CACd,qBAAA,CAFA,gBAAwB,CAK1B,oEAEE,wBAA6B,CAC7B,iBAAkB,CAClB,2DACF,CACA,gCACE,oEAGE,8BAAgC,CADhC,mCAEF,CACF,CACA,gFAEE,yCACF,CACA,kCAIE,oBAAsB,CADtB,kBAAoB,CAEpB,iBAAmB,CAHnB,0BAA2B,CAD3B,mBAKF,CACA,kCACE,oBAAsB,CAItB,kBAAoB,CAFpB,iBAAmB,CADnB,0BAA2B,CAE3B,mBAEF,CAEE,+BAAA,0BAAa,CAKb,uGAAA,0BAAa,CAGf,UAEE,yCAAsB,CADtB,WAEF,CACA,gEAEE,uBACF,CAGE,qDAAA,2BAAmB,CACnB,0BADmB,CAGrB,qFAEE,eACF,CACA,qEAEE,UACF,CAEA,iBAOE,+BAAmB,CAAnB,uCAAmB,CAAnB,kGAAmB,CACnB,kCAAmB,CAJnB,WAAgB,CAEhB,eAAyB,CAHzB,cAAe,CAFf,OAAQ,CACR,uBAAwB,CAAxB,uBAAwB,CAAxB,+BAAwB,CAGxB,UAOF,CAJE,kCAAA,oCAAmB,CACnB,iBACA,YAAc,CACd,qBAAA,CAFA,gBAAwB,CAMxB,wBACA,wCAAA,CADA,sCAAc,CAAd,uCAAc,CAGhB,+BAGE,sBAA2B,CAF3B,8EAAuF,CAGvF,UAAW,CAKX,gCAAa,CAJb,MAAO,CAEP,mBAA6B,CAD7B,iBAAkB,CAJlB,KAAM,CACN,6LAA2B,CAK3B,UAEF,CAEA,kBACE,sBAcF,CACA,oBACE,oBACF,CACA,iCAEE,UAAW,CACX,eAAgB,CAFhB,oBAGF,CAGE,cAKA,kBAAsB,CACtB,qEAAsE,CAJtE,wCAAoB,CACpB,YAAc,CACd,6BAAe,CAHf,8CAAe,CAAf,+CAAe,CADf,uCAAc,CAOd,2DAPc,CAShB,mEACE,mEACF,CACA,wIACE,SACF,CACA,qCACE,SAAU,CACV,kDACF,CAEE,iCAEA,wCAAoB,CACpB,cAAA,CAFA,iCADc,CAKhB,uJACE,kCACF,CAEE,8BAGA,kBAAsB,CAFtB,YAAc,CACd,kBAAkB,CAElB,6BAAe,CACf,eAAA,CALA,UAAgB,CAShB,gBAIA,qDAAsD,CAEtD,qBAAA,CADA,iEAAkE,CALlE,YAAc,CACd,qBAAkB,CAClB,gBAAiB,CACjB,eAHc,CAQhB,6BACE,qJAAwJ,CACxJ,YACF,CACA,8BACE,6BACE,0BACF,CACF,CACA,+CAKE,qBAAsB,CAJtB,MAAO,CAEP,gBAAiB,CACjB,kBAAmB,CAFnB,WAIF,CACA,sBACE,4BAA6B,CAG7B,yCAAsB,CADtB,iCAAa,CAEb,kBAAmB,CAHnB,iBAAmB,CAInB,qBACF,CAGE,sCAAA,kBAAwB,CAIxB,gBAAA,6CAAe,CAGf,gCAAA,kDAAmB,CACnB,oBADmB,CAInB,uDAEA,wBAAA,CAFA,gCAAiB,CACjB,sCAAc,CAAd,uCADiB,CAKjB,6DAAA,wBAAwB,CAIxB,mBAEA,aAAc,CACd,yCAAsB,CAHtB,gCAAiB,CAIjB,wCAAA,CAHA,oCADiB,CAOjB,gCAAA,oCAAc,CAId,gDAAA,gEAAmB,CAAnB,YAAmB,CACnB,oCADmB,CAKnB,gGALA,kCAAmB,CAAnB,eAAmB,CAAnB,qBAAmB,CAAnB,gBAAmB,CAAnB,kBAKmB,CAAnB,gDAAA,mEAAmB,CAAnB,YAAmB,CACnB,oCADmB,CAKnB,gDAAA,+DAAmB,CAAnB,YAAmB,CACnB,oCADmB,CAKnB,gGALA,kCAAmB,CAAnB,eAAmB,CAAnB,sBAAmB,CAAnB,gBAAmB,CAAnB,kBAKmB,CAAnB,gDAAA,cAAmB,CAAnB,YAAmB,CACnB,oCADmB,CAKnB,gDAAA,iBAAmB,CAKnB,gGALA,kCAAmB,CAAnB,eAAmB,CAAnB,sBAAmB,CAAnB,gBAAmB,CAAnB,kBAAmB,CAAnB,YAAmB,CACnB,oCAImB,CAAnB,gDAAA,kBAAmB,CAKnB,sDACA,uCAAA,CADA,oCAAc,CAOd,4IAAA,oCAAc,CAOhB,mFACE,iBAAmB,CACnB,oCACF,CAGE,sDAAA,2CAAwB,CAAxB,gMAAwB,CAAxB,2BAAwB,CAGxB,8BAKA,kCAAA,CALA,qBAAuB,CAIvB,0DAAc,CAHd,wCAAc,CACd,sCAAc,CADd,qCADuB,CAQvB,0BAAA,oBAAsB,CACtB,mBAAqB,CACrB,sCAAc,CAAd,uCAFsB,CAKtB,6BAAA,+BAAoB,CAGpB,6BAAA,iCAAsB,CAGtB,wBACA,+BAAoB,CADpB,oBAAsB,CAEtB,qBAAuB,CAEvB,2DAJsB,CAOtB,uBAAA,oBAAsB,CAGtB,kCAAmC,CACnC,uCAAc,CAAd,oCAAc,CACd,aAAA,CAHA,2DAFsB,CAQtB,4BAAA,6BAAkB,CAClB,0CAAsB,CACtB,qBAAuB,CACvB,iCAHkB,CAMlB,oCAAA,mBAAqB,CACrB,qBAAkB,CAClB,UAFqB,CAKrB,0CAAA,UAAgB,CAGhB,sCAAA,oCAAc,CAGd,6CAEA,kCAAmC,CACnC,YAAA,CAHA,sCAAc,CACd,mBADc,CAMd,yBAAA,uCAAA,CAAA,oCAAc,CAId,wDAEA,mCAAoC,CADpC,2DAAc,CAEd,kBAHc,CAKhB,4BACE,2DAA6D,CAC7D,sCACF,CAEE,+BAAA,+BAAoB,CAGpB,0CAAA,+BAAoB,CAIpB,2BAAA,kCAAmB,CAAnB,4CAAA,oCAAmB,CACnB,2BAAA,oCAAoB,CAIpB,gEAAA,kCAAyB,CAAzB,gBAAyB,CAAzB,eAAyB,CAAzB,qBAAyB,CAAzB,gBAAyB,CAAzB,kBAAyB,CAAzB,YAAyB,CACzB,oCADyB,CAKzB,gEAAA,mBAAyB,CAAzB,qBAAyB,CAKzB,gIALA,kCAAyB,CAAzB,eAAyB,CAAzB,gBAAyB,CAAzB,kBAAyB,CAAzB,YAAyB,CACzB,oCAIyB,CAAzB,gEAAA,kBAAyB,CAAzB,sBAAyB,CAKzB,gEAAA,cAAyB,CAKzB,gIALA,kCAAyB,CAAzB,eAAyB,CAAzB,sBAAyB,CAAzB,gBAAyB,CAAzB,kBAAyB,CAAzB,YAAyB,CACzB,oCAIyB,CAAzB,gEAAA,iBAAyB,CAKzB,gEAAA,kCAAyB,CAAzB,kBAAyB,CAAzB,eAAyB,CAAzB,sBAAyB,CAAzB,gBAAyB,CAAzB,kBAAyB,CAAzB,YAAyB,CACzB,oCADyB,CAIzB,+BAAA,gCAAiB,CAIjB,sEAAA,2CAAwB,CAAxB,gMAAwB,CAAxB,2BAAwB,CAIxB,wEAAA,wCAAA,CAAA,qCAAc,CAGhB,iCACE,eACF,CAEA,wCACE,kEAAmE,CACnE,mEACF,CAEA,0BAEE,gBAAiB,CADjB,iBAEF,CAEE,gCAAA,iCAAa,CAGf,qCAEE,kCAAwC,CADxC,uBAEF,CAGE,iBAAA,YAAc,CAEhB,6BACE,gDACF,CACA,gCACE,6BAEE,8BAAgC,CADhC,mCAEF,CACF,CAEE,6BAAA,2BAAmB,CAErB,oCACE,kDACF,CACA,gCACE,oCAEE,8BAAgC,CADhC,mCAEF,CACF,CAKE,6DAAA,4BAAoB,CAEtB,oCACE,kDACF,CACA,gCACE,oCAEE,8BAAgC,CADhC,mCAEF,CACF,CAEE,gCAAA,2BAAmB,CAGrB,kBAIE,+EAAkF,CAFlF,yBAA0B,CAC1B,qDAAwD,CAFxD,iBAIF,CAEE,uBAAA,0DAA2B,CAE7B,sBAIE,wFAA0F,CAD1F,2CAAgE,CAAhE,kBAAgE,CAAhE,gBAAgE,CAFhE,yBAA2B,CAC3B,yDAA4D,CAC5D,aAAgE,CAAhE,eAAgE,CAAhE,2DAEF,CACA,yDAKE,gCAAsD,CAAtD,iCAAsD,CAJtD,UAAW,CAIX,gCAAsD,CAHtD,QAAS,CAGT,mBAAsD,CADtD,iBAAkB,CADlB,sBAGF,CACA,uCAGE,mBAAqB,CAFrB,8EAAuF,CACvF,OAAQ,CACR,6LACF,CACA,yCACE,8EAAuF,CACvF,UACF,CAEE,2BAEA,wBAAwB,CAFxB,gCAAiB,CACjB,aAAmB,CAEnB,mBAHiB,CAMjB,uCAAA,uCAAc,CAGd,iCAAA,uCAAc,CAEhB,kEAIE,2BAAmB,CAFnB,iBAAkB,CAGlB,WAAa,CACb,SAAW,CAHX,uBAAwB,CAAxB,uBAAwB,CAAxB,+BAIF,CACA,gGAGE,gCAAqB,CAKrB,oBAAsB,CANtB,YAAa,CAKb,MAAO,CAFP,iBAAkB,CAClB,KAAM,CAFN,iBAKF,CACA,8GAGE,kBAAmB,CACnB,gCAAoB,CAFpB,iBAAkB,CAGlB,uBAAwB,CADxB,+BAEF,CACA,4BACE,mBACF,CAKE,8UAAA,4BAAoB,CAGtB,wCACE,YACF,CACA,8BACE,cACF,CAEA,kIAEE,SACF,CAEA,6EACE,SACF,CAGE,yEAKA,qBAAqB,CAArB,6BAAqB,CADrB,0CAAsB,CACtB,kGAAqB,CALrB,aAAe,CASf,gCAAA,CADA,sCAAmB,CALnB,wCAAc,CADd,sCAAc,CACd,qCAAc,CAGd,yBAAsB,CACtB,wBAAmB,CANnB,UADe,CAYf,qDAAA,qCAAc,CAGd,+BAAA,oCAAc","file":"components.css","sourcesContent":["@charset \"UTF-8\";\n/\n SASS preserves units in arithmetic operations. For example:\n* 12em * 0 = 0em. This function return the unit of a numeric value.\n\n For more examples, see: https://codepen.io/paulgv/pen/XWrqMgQ\n/\n/ stylelint-disable @gitlab/no-gl-deprecated-design-tokens /\n/ stylelint-enable @gitlab/no-gl-deprecated-design-tokens /\n/ stylelint-disable-next-line @gitlab/no-gl-deprecated-design-tokens /\n/ stylelint-disable-next-line @gitlab/no-gl-deprecated-design-tokens /\n/\n Declares a property with a fluid value that decreases or\n* rises depending on the viewport’s size. The property type\n* should be numeric.\n\n Values are expected in rem units.\n* Fluid range: between 48rem (768px) – 75rem (1200px).\n\n @param $property Property name, i.e. line-height, font-size, width, height, etc.\n* @param $min Property value lower bound.\n* @param $max Property value upper bound.\n/\n/\n Helper function for :focus\n\n @param $size is deprecated and should not be used anymore\n/\n/\n Helper function for @media of at least the minimum\n* breakpoint width.\n\n @param $name Breakpoint name, such as `sm` or `md`.\n/\n/\n Helper function for @media of at most the maximum\n* breakpoint width.\n\n Note: Before using, consider using a mobile-first\n* approach, and define @media for larger breakpoints\n* using `gl-media-breakpoint-up` while using this rule as\n* the starting point instead.\n\n @param $name Breakpoint, such as `sm` or `md`. `xs` is not valid\n/\n/\n Helper function to resolve font-size value from $gl-font-sizes and\n* $gl-font-sizes-fixed maps.\n\n @param $size Number font-size scale\n* @param $fixed Boolean toggle default and fixed font size scales\n/\n.resizable-content {\n height: 100%;\n width: 100%;\n background: var(--gl-background-color-default);\n border-radius: 0.5rem;\n @apply gl-overflow-y-auto;\n @apply gl-shadow-lg;\n @apply gl-text-base;\n @apply gl-leading-normal;\n @apply gl-flex;\n @apply gl-flex-col;\n}\n\n.resizable-component .resizable-t,\n.resizable-component .resizable-l {\n background-color: transparent;\n border-radius: 3px;\n transition: background-color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n@media (prefers-reduced-motion) {\n .resizable-component .resizable-t,\n.resizable-component .resizable-l {\n transition-duration: 0.01ms !important;\n transition-delay: 0ms !important;\n }\n}\n.resizable-component .resizable-t:hover,\n.resizable-component .resizable-l:hover {\n background-color: var(--gl-color-blue-200);\n}\n.resizable-component .resizable-t {\n width: 95% !important;\n transform: translateX(-50%);\n left: 50% !important;\n height: 4px !important;\n top: 2px !important;\n}\n.resizable-component .resizable-l {\n height: 95% !important;\n transform: translateY(-50%);\n top: 50% !important;\n width: 4px !important;\n left: 2px !important;\n}\n.resizable-component .duo-chat {\n @apply gl-z-0;\n}\n.resizable-component .resizable-l,\n.resizable-component .resizable-lt,\n.resizable-component .resizable-t {\n @apply gl-z-1;\n}\n\n.duo-chat {\n z-index: 999;\n @apply gl-font-regular;\n}\n.duo-chat .message-enter-active,\n.duo-chat .message-leave-active {\n transition: all 0.5s ease;\n}\n.duo-chat .message-enter,\n.duo-chat .message-leave-to {\n @apply gl-opacity-0;\n transform: translateY(10px);\n}\n.duo-chat .duo-chat-loader.message-leave,\n.duo-chat .duo-chat-loader.message-leave-to {\n transition: none;\n}\n.duo-chat .duo-agent-mode-switcher > ,\n.duo-chat .duo-model-switcher > * {\n width: 100%;\n}\n\n.duo-chat-drawer {\n right: 0;\n @apply gl-transition-all;\n position: fixed;\n @apply gl-h-full;\n @apply gl-w-full;\n @apply gl-overflow-y-auto;\n @apply gl-shadow-lg;\n @apply gl-text-base;\n @apply gl-leading-normal;\n @apply gl-flex;\n @apply gl-flex-col;\n}\n\n.duo-chat-drawer-footer {\n @apply gl-px-4;\n @apply gl-pb-4;\n}\n.duo-chat-drawer-footer::before {\n background: linear-gradient(to bottom, transparent, var(--gl-background-color-default));\n top: 0;\n @apply -gl-translate-y-full;\n content: \"\";\n left: 0;\n position: absolute;\n @apply gl-pointer-events-none;\n @apply gl-w-full;\n @apply gl-h-4;\n}\n\n.duo-chat-history {\n scroll-behavior: smooth;\n /\n Browsers a are pretty good at keeping the focus on an element while\n the parent element grows in size. With this we mark all child elements\n of the chat history as \"non\" anchors.\n https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-anchor\n /\n /\n Right at the bottom of the chat history we add a scroll-anchor element.\n This scroll-anchor element is the only \"possible\" anchor. The beauty of it:\n It only will be used as an anchor _if_ it is currently inside the view port.\n So if the user manually scrolls up while a chunked message is coming in,\n it won't stick to the bottom while the message still loads.\n /\n}\n.duo-chat-history * {\n overflow-anchor: none;\n}\n.duo-chat-history .scroll-anchor {\n overflow-anchor: auto;\n height: 1px;\n margin-top: -1px;\n}\n\n.history-item {\n @apply gl-pr-2;\n @apply -gl-mx-3;\n @apply gl-rounded-lg;\n @apply gl-flex;\n @apply gl-gap-3;\n @apply gl-items-center;\n background: var(--gl-button-default-tertiary-background-color-default);\n transition: background-color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n.history-item:hover, .history-item:focus, .history-item:focus-within {\n background: var(--gl-button-default-tertiary-background-color-hover);\n}\n.history-item:hover .history-remove-button, .history-item:focus .history-remove-button, .history-item:focus-within .history-remove-button {\n opacity: 1;\n}\n.history-item .history-remove-button {\n opacity: 0;\n transition: opacity 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n.history-item .history-item-name {\n @apply gl-py-3;\n @apply gl-px-3;\n @apply gl-rounded-lg;\n @apply gl-border-0;\n}\n.history-item .history-item-name, .history-item .history-item-name:hover, .history-item .history-item-name:active, .history-item .history-item-name:focus {\n background-color: transparent !important;\n}\n.history-item .gl-button-text {\n @apply gl-w-full;\n @apply gl-flex;\n @apply gl-flex-row;\n @apply gl-items-center;\n @apply gl-gap-3;\n @apply gl-text-left;\n}\n\n.duo-chat-input {\n @apply gl-flex;\n @apply gl-flex-col;\n max-height: 240px;\n overflow: hidden;\n background: var(--gl-control-background-color-default);\n box-shadow: inset 0 0 0 1px var(--gl-control-border-color-default);\n border-radius: 1.25rem;\n}\n.duo-chat-input:focus-within {\n box-shadow: inset 0 0 0 1px var(--gl-control-border-color-focus), 0 0 0 1px var(--gl-focus-ring-inner-color), 0 0 0 3px var(--gl-focus-ring-outer-color);\n outline: none;\n}\n@media (forced-colors: active) {\n .duo-chat-input:focus-within {\n outline: 2px solid LinkText;\n }\n}\n.duo-chat-input .gl-form-textarea.form-control {\n flex: 1;\n resize: none;\n max-height: 240px;\n padding-right: 40px;\n border-radius: 1.25rem;\n}\n.duo-chat-input::after {\n content: attr(data-value) \" \";\n @apply gl-invisible;\n @apply gl-p-4;\n @apply gl-font-regular;\n padding-right: 40px;\n word-break: break-word;\n}\n\n.duo-chat .duo-chat-suggestion-button {\n @apply gl-rounded-[1rem];\n}\n\n.slash-commands {\n @apply -gl-mt-2;\n}\n.slash-commands .active-command {\n @apply gl-bg-strong;\n @apply gl-rounded-base;\n}\n.slash-commands .gl-dropdown-item button.dropdown-item {\n @apply gl-text-sm;\n @apply gl-px-3;\n @apply gl-bg-transparent;\n}\n.slash-commands .gl-dropdown-item button.dropdown-item:hover {\n @apply gl-bg-transparent;\n}\n\n.duo-chat-markdown {\n @apply gl-text-lg;\n @apply gl-leading-24;\n color: #3a383f;\n @apply gl-font-regular;\n @apply gl-font-normal;\n}\n.duo-chat-markdown :first-child {\n @apply gl-mt-0;\n}\n.duo-chat-markdown h1,\n.duo-chat-markdown .gl-h1 {\n @apply gl-heading-1;\n @apply gl-mt-7;\n}\n.duo-chat-markdown h2,\n.duo-chat-markdown .gl-h2 {\n @apply gl-heading-2;\n @apply gl-mt-6;\n}\n.duo-chat-markdown h3,\n.duo-chat-markdown .gl-h3 {\n @apply gl-heading-3;\n @apply gl-mt-6;\n}\n.duo-chat-markdown h4,\n.duo-chat-markdown .gl-h4 {\n @apply gl-heading-4;\n @apply gl-mt-5;\n}\n.duo-chat-markdown h5,\n.duo-chat-markdown .gl-h5 {\n @apply gl-heading-5;\n @apply gl-mt-5;\n}\n.duo-chat-markdown h6,\n.duo-chat-markdown .gl-h6 {\n @apply gl-heading-6;\n @apply gl-mt-5;\n}\n.duo-chat-markdown p,\n.duo-chat-markdown .gl-paragraph {\n @apply gl-mt-0;\n @apply gl-mb-0;\n}\n.duo-chat-markdown p + p,\n.duo-chat-markdown p + .gl-paragraph,\n.duo-chat-markdown .gl-paragraph + p,\n.duo-chat-markdown .gl-paragraph + .gl-paragraph {\n @apply gl-mt-5;\n}\n.duo-chat-markdown p.sm,\n.duo-chat-markdown .gl-paragraph.sm {\n font-size: 0.875rem;\n @apply gl-leading-20;\n}\n.duo-chat-markdown .sm {\n font-size: 0.875rem;\n @apply gl-leading-20;\n}\n.duo-chat-markdown .monospace,\n.duo-chat-markdown code {\n @apply gl-font-monospace;\n}\n.duo-chat-markdown blockquote {\n @apply gl-text-gray-700;\n @apply gl-py-3;\n @apply gl-pl-6;\n @apply gl-my-3;\n @apply gl-mx-0;\n box-shadow: inset 4px 0 0 0 #dcdcde;\n}\n.duo-chat-markdown .idiff {\n @apply gl-rounded-base;\n @apply gl-inline-flex;\n @apply gl-px-2;\n}\n.duo-chat-markdown .deletion {\n @apply gl-bg-red-100;\n}\n.duo-chat-markdown .addition {\n @apply gl-bg-green-100;\n}\n.duo-chat-markdown code {\n @apply gl-rounded-base;\n @apply gl-bg-gray-50;\n @apply gl-text-gray-950;\n @apply gl-px-2;\n @apply gl-py-1;\n}\n.duo-chat-markdown pre {\n @apply gl-rounded-base;\n @apply gl-py-3;\n @apply gl-px-4;\n box-shadow: inset 0 0 0 1px #dcdcde;\n @apply gl-my-7;\n @apply gl-overflow-auto;\n}\n.duo-chat-markdown pre code {\n @apply gl-bg-white;\n @apply gl-rounded-none;\n @apply gl-text-gray-900;\n @apply gl-p-0;\n}\n.duo-chat-markdown .audio-container {\n @apply gl-inline-flex;\n @apply gl-flex-col;\n @apply gl-w-full;\n}\n.duo-chat-markdown .audio-container audio {\n @apply gl-w-full;\n}\n.duo-chat-markdown .audio-container a {\n @apply gl-mt-3;\n}\n.duo-chat-markdown .audio-container a::before {\n @apply gl-mr-2;\n text-rendering: auto;\n -webkit-font-smoothing: antialiased;\n content: \"📎\";\n}\n.duo-chat-markdown table {\n @apply gl-my-7;\n}\n.duo-chat-markdown table th,\n.duo-chat-markdown table td {\n @apply gl-px-3;\n @apply gl-py-4;\n box-shadow: inset 0 -1px 0 0 #dcdcde;\n @apply gl-align-top;\n}\n.duo-chat-markdown table th {\n box-shadow: inset 0 1px 0 0 #dcdcde, inset 0 -1px 0 0 #dcdcde;\n @apply gl-font-bold;\n}\n.duo-chat-markdown table thead {\n @apply gl-bg-gray-50;\n}\n.duo-chat-markdown table tr:nth-child(even) {\n @apply gl-bg-gray-10;\n}\n\n.duo-chat-compact-markdown {\n @apply gl-text-base;\n @apply gl-leading-20;\n}\n.duo-chat-compact-markdown h1,\n.duo-chat-compact-markdown .gl-h1 {\n @apply gl-heading-1-fixed;\n @apply gl-mt-7;\n}\n.duo-chat-compact-markdown h2,\n.duo-chat-compact-markdown .gl-h2 {\n @apply gl-heading-2-fixed;\n @apply gl-mt-6;\n}\n.duo-chat-compact-markdown h3,\n.duo-chat-compact-markdown .gl-h3 {\n @apply gl-heading-3-fixed;\n @apply gl-mt-6;\n}\n.duo-chat-compact-markdown h4,\n.duo-chat-compact-markdown .gl-h4 {\n @apply gl-heading-4-fixed;\n @apply gl-mt-5;\n}\n.duo-chat-compact-markdown h5,\n.duo-chat-compact-markdown .gl-h5 {\n @apply gl-heading-5-fixed;\n @apply gl-mt-5;\n}\n.duo-chat-compact-markdown h6,\n.duo-chat-compact-markdown .gl-h6 {\n @apply gl-heading-6-fixed;\n @apply gl-mt-5;\n}\n.duo-chat-compact-markdown .sm {\n @apply gl-text-sm;\n}\n.duo-chat-compact-markdown .monospace,\n.duo-chat-compact-markdown code {\n @apply gl-font-monospace;\n}\n.duo-chat-compact-markdown table th,\n.duo-chat-compact-markdown table td {\n @apply gl-py-3;\n}\n\n.message-tool-approval-collapsed {\n border-bottom: 0;\n}\n\n.message-tool-approval-collapsed-header {\n border-bottom-left-radius: calc(var(--gl-card-border-radius) - 1px);\n border-bottom-right-radius: calc(var(--gl-card-border-radius) - 1px);\n}\n\n.web-only .duo-chat-input {\n position: relative;\n overflow: visible;\n}\n.web-only .duo-chat-input::after {\n @apply gl-p-2;\n}\n\n.web-only .duo-chat-message pre code {\n color: inherit !important;\n background-color: transparent !important;\n}\n\n.duo-chat-loader {\n @apply gl-flex;\n}\n.duo-chat-loader .transition {\n transition: width 200ms cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n@media (prefers-reduced-motion) {\n .duo-chat-loader .transition {\n transition-duration: 0.01ms !important;\n transition-delay: 0ms !important;\n }\n}\n.duo-chat-loader .text-enter {\n @apply gl-opacity-0;\n}\n.duo-chat-loader .text-enter-active {\n transition: opacity 400ms cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n@media (prefers-reduced-motion) {\n .duo-chat-loader .text-enter-active {\n transition-duration: 0.01ms !important;\n transition-delay: 0ms !important;\n }\n}\n.duo-chat-loader .text-enter-to {\n @apply gl-opacity-10;\n}\n.duo-chat-loader .text-leave {\n @apply gl-opacity-10;\n}\n.duo-chat-loader .text-leave-active {\n transition: opacity 200ms cubic-bezier(0.22, 0.61, 0.36, 1);\n}\n@media (prefers-reduced-motion) {\n .duo-chat-loader .text-leave-active {\n transition-duration: 0.01ms !important;\n transition-delay: 0ms !important;\n }\n}\n.duo-chat-loader .text-leave-to {\n @apply gl-opacity-0;\n}\n\n.duo-chat-message {\n position: relative;\n border-radius: 1rem 1rem 0;\n color: var(--duo-chat-message-color, inherit) !important;\n --gl-text-color-heading: var(--duo-chat-message-heading-color, inherit) !important;\n}\n.duo-chat-message code {\n @apply gl-bg-status-neutral;\n}\n.duo-chat-message pre {\n box-shadow: none !important;\n color: var(--duo-chat-message-pre-color, inherit) !important;\n @apply gl-border gl-max-h-[60vh] gl-px-4 gl-py-3 gl-text-inherit;\n background-color: var(--gl-background-color-preformat, var(--gl-background-color-default));\n}\n.duo-chat-message pre::before, .duo-chat-message pre::after {\n content: \"\";\n left: 1px;\n width: calc(100% - 2px);\n position: absolute;\n @apply gl-pointer-events-none gl-h-7 gl-rounded-b-base;\n}\n.duo-chat-message pre.scrim-top::before {\n background: linear-gradient(to bottom, transparent, var(--gl-background-color-default));\n top: 1px;\n @apply -gl-rotate-180;\n}\n.duo-chat-message pre.scrim-bottom::after {\n background: linear-gradient(to bottom, transparent, var(--gl-background-color-default));\n bottom: 1px;\n}\n.duo-chat-message pre code {\n @apply gl-text-sm;\n @apply gl-leading-1;\n @apply gl-bg-transparent;\n white-space: inherit;\n}\n.duo-chat-message p:not(:last-of-type) {\n @apply gl-mb-4;\n}\n.duo-chat-message p:last-of-type {\n @apply gl-mb-0;\n}\n.duo-chat-message copy-code,\n.duo-chat-message insert-code-snippet {\n position: absolute;\n @apply gl-transition-all;\n @apply gl-opacity-0;\n right: 0.5rem;\n top: 0.5rem;\n}\n.duo-chat-message copy-code [role=tooltip],\n.duo-chat-message insert-code-snippet [role=tooltip] {\n display: none;\n @apply gl-bg-gray-100;\n width: max-content;\n position: absolute;\n top: 0;\n left: 0;\n @apply gl-rounded-base;\n}\n.duo-chat-message copy-code [role=tooltip] .arrow,\n.duo-chat-message insert-code-snippet [role=tooltip] .arrow {\n position: absolute;\n background: inherit;\n @apply gl-h-3 gl-w-3;\n transform: rotate(45deg);\n}\n.duo-chat-message copy-code {\n margin-right: 2.5rem;\n}\n.duo-chat-message .js-markdown-code.markdown-code-block:hover copy-code,\n.duo-chat-message .js-markdown-code.markdown-code-block:hover copy-code:focus-within,\n.duo-chat-message .js-markdown-code.markdown-code-block:hover insert-code-snippet,\n.duo-chat-message .js-markdown-code.markdown-code-block:hover insert-code-snippet:focus-within {\n @apply gl-opacity-10;\n}\n\n.insert-code-hidden insert-code-snippet {\n display: none;\n}\n.insert-code-hidden copy-code {\n margin-right: 0;\n}\n\n.duo-message-pre-block:focus .copy-to-clipboard-button-container,\n.duo-message-pre-block:hover .copy-to-clipboard-button-container {\n opacity: 1;\n}\n\n.duo-message-pre-block .copy-to-clipboard-button-container:has(button:focus) {\n opacity: 1;\n}\n\n.recents-wrapper .gl-accordion-item-header .gl-button.gl-button.btn-link {\n @apply gl-block;\n @apply gl-w-full;\n @apply gl-pl-3;\n @apply gl-py-2;\n @apply gl-rounded-none;\n @apply gl-shadow-none;\n @apply gl-no-underline;\n @apply gl-uppercase;\n @apply gl-font-bold;\n @apply gl-text-sm;\n}\n.recents-wrapper .gl-accordion-item-header > .collapse {\n @apply gl-ml-0;\n}\n.recents-wrapper .gl-text-base {\n @apply gl-mt-0;\n}"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@gitlab/duo-ui",
-  "version": "15.0.0",
+  "version": "15.0.2",
   "description": "Duo UI Components",
   "license": "MIT",
   "main": "dist/index.js",

package/src/components/chat/components/duo_chat_header/duo_chat_header.vue CHANGED Viewed

@@ -10,6 +10,7 @@ import {
   GlDisclosureDropdown,
 } from '@gitlab/ui';
 import { sprintf, translate } from '../../../../utils/i18n';
+import { copyToClipboard } from '../utils';
 import { VIEW_TYPES } from './constants';
 import DuoChatHeaderAgentItem from './duo_chat_header_agent_item/duo_chat_header_agent_item.vue';
@@ -150,7 +151,8 @@ export default {
     },
     async copySessionIdToClipboard() {
       try {
-        await navigator.clipboard.writeText(this.sessionId);
+        await copyToClipboard(this.sessionId, this.$el);
         this.$toast.show('Session ID copied to clipboard');
       } catch {
         this.$toast.show('Could not copy session ID');

package/src/components/chat/components/duo_chat_header/web_duo_chat_header.vue CHANGED Viewed

@@ -10,6 +10,7 @@ import {
   GlDisclosureDropdown,
 } from '@gitlab/ui';
 import { sprintf, translate } from '../../../../utils/i18n';
+import { copyToClipboard } from '../utils';
 import { VIEW_TYPES } from './constants';
 export const i18n = {
@@ -157,7 +158,8 @@ export default {
     },
     async copySessionIdToClipboard() {
       try {
-        await navigator.clipboard.writeText(this.sessionId);
+        await copyToClipboard(this.sessionId, this.$el);
         this.$toast.show('Session ID copied to clipboard');
       } catch {
         this.$toast.show('Could not copy session ID');

package/src/components/chat/components/duo_chat_message/copy_code_element.js CHANGED Viewed

@@ -1,6 +1,6 @@
+import { copyToClipboard } from '../utils';
 import { createButton } from './buttons_utils';
 import { createTooltip } from './tooltips_utils';
-import { checkClipboardPermissions } from './utils';
 export class CopyCodeElement extends HTMLElement {
   constructor() {
@@ -23,25 +23,12 @@ export class CopyCodeElement extends HTMLElement {
       // not present in the DOM.
       const codeElement = this.getCodeElement();
       const textToCopy = codeElement.innerText;
-      const hasClipboardPermission = await checkClipboardPermissions();
       try {
-        codeElement.dispatchEvent(
-          new CustomEvent('copy-code-snippet', {
-            bubbles: true,
-            cancelable: true,
-            detail: {
-              code: textToCopy,
-            },
-          })
-        );
-        if (hasClipboardPermission) {
-          await navigator.clipboard.writeText(textToCopy);
-        }
-      } catch (e) {
+        await copyToClipboard(textToCopy, codeElement);
+      } catch (error) {
         // eslint-disable-next-line no-console
-        console.warn('Failed to copy snippet:', e);
+        console.warn('Failed to copy to clipboard:', error);
       }
     });
   }

package/src/components/chat/components/duo_chat_message/duo_chat_message.vue CHANGED Viewed

@@ -15,10 +15,11 @@ import { MESSAGE_MODEL_ROLES, SELECTED_CONTEXT_ITEMS_DEFAULT_COLLAPSED } from '.
 import DocumentationSources from '../duo_chat_message_sources/duo_chat_message_sources.vue';
 // eslint-disable-next-line no-restricted-imports
 import { renderDuoChatMarkdownPreview } from '../../markdown_renderer';
+import { copyToClipboard, concatUntilEmpty } from '../utils';
 import MessageFeedback from './message_feedback.vue';
 import { CopyCodeElement } from './copy_code_element';
 import { InsertCodeSnippetElement } from './insert_code_snippet_element';
-import { checkClipboardPermissions, concatUntilEmpty } from './utils';
 import {
   DUO_CODE_SCRIM_BOTTOM_CLASS,
   DUO_CODE_SCRIM_OFFSET,
@@ -197,7 +198,7 @@ export default {
       );
     },
     shouldShowCopyAction() {
-      return Boolean(navigator.clipboard && !this.isChunk && this.isAssistantMessage);
+      return Boolean(!this.isChunk && this.isAssistantMessage);
     },
     shouldShowFeedbackLink() {
       return this.withFeedback && this.isNotChunkOrCancelled && this.isAssistantMessage;
@@ -302,19 +303,18 @@ export default {
       }
     },
     async copyMessage() {
-      const hasPermissions = await checkClipboardPermissions();
+      try {
+        await copyToClipboard(this.message.content, this.$el);
-      if (!this.copied) {
-        if (hasPermissions) {
-          await navigator.clipboard.writeText(this.message.content);
-        } else {
-          this.$emit('copy-message', {
-            detail: {
-              message: this.message.content,
-            },
-          });
-        }
+        this.$emit('copy-message', {
+          detail: {
+            message: this.message.content,
+          },
+        });
         this.copied = true;
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.warn('Failed to copy message:', error);
       }
     },
     onOpenFilePath(e) {

package/src/components/chat/components/duo_chat_message_tool_approval/components/pre_block.vue CHANGED Viewed

@@ -1,7 +1,7 @@
 <script>
 import { GlButton, GlTooltipDirective as GlTooltip } from '@gitlab/ui';
 import { translate } from '../../../../../utils/i18n';
-import { checkClipboardPermissions } from '../../duo_chat_message/utils';
+import { copyToClipboard } from '../../utils';
 import { highlightElement } from '../services/highlight';
 export default {
@@ -41,27 +41,9 @@ export default {
     async copyToClipboard() {
       try {
         const textToCopy = this.$refs.codeElement.textContent;
-        const hasClipboardPermission = await checkClipboardPermissions();
-        const event = new CustomEvent('copy-code-snippet', {
-          bubbles: true,
-          detail: {
-            code: textToCopy,
-          },
-        });
-        // Emit custom event for VS Code and other environments
-        // This bubbles up to parent components that handle clipboard operations
-        this.$emit('copy-code-snippet', {
-          detail: {
-            code: textToCopy,
-          },
-        });
-        this.$el.dispatchEvent(event);
+        await copyToClipboard(textToCopy, this.$el);
-        // If we have clipboard permission, also copy directly
-        if (hasClipboardPermission) {
-          await navigator.clipboard.writeText(textToCopy);
-        }
         this.$emit('copied', this.title);
         setTimeout(() => {
           this.$refs.copyToClipboardButton.$el.blur();

package/src/components/chat/components/utils.js ADDED Viewed

@@ -0,0 +1,60 @@
+export const concatUntilEmpty = (arr) => {
+  if (!arr) return '';
+  let end = arr.findIndex((el) => !el);
+  if (end < 0) end = arr.length;
+  return arr.slice(0, end).join('');
+};
+/**
+ * Programmatically copies a text string to the clipboard. Attempts to copy in both secure and non-secure contexts as well as VSCode.
+ *
+ * Accepts a container element. This helps ensure the text can get copied to the clipboard correctly in non-secure
+ * environments, the container should be active (such as a button in a modal) to ensure the content can be copied.
+ *
+ * @param {String} text - Text to copy
+ * @param {HTMLElement} el - element that emits event for VSCode, and contains the fallback textarea.
+ */
+export const copyToClipboard = (textToCopy, el) => {
+  // Fist, emit a custom event for VS Code extensions and other environments
+  // This bubbles up to parent components that handle clipboard operations
+  el.dispatchEvent(
+    new CustomEvent('copy-code-snippet', {
+      bubbles: true,
+      cancelable: true,
+      detail: {
+        code: textToCopy,
+      },
+    })
+  );
+  // Second, for modern browsers try a simple clipboard.writeText (works on https and localhost)
+  if (navigator.clipboard && window.isSecureContext) {
+    return navigator.clipboard.writeText(textToCopy);
+  }
+  // Third, try execCommand to copy from a dynamically created invisible textarea (for http and older browsers)
+  const textarea = document.createElement('textarea');
+  textarea.value = textToCopy;
+  textarea.style.position = 'absolute';
+  textarea.style.left = '-9999px'; // eslint-disable-line @gitlab/require-i18n-strings
+  textarea.style.top = '0';
+  textarea.setAttribute('readonly', ''); // prevent keyboard popup on mobile
+  // textarea must be in document to be selectable, but we add it to the button so it works in modals
+  el.appendChild(textarea);
+  textarea.select(); // for Safari
+  textarea.setSelectionRange(0, textarea.value.length); // for mobile devices
+  try {
+    const done = document.execCommand('copy');
+    el.removeChild(textarea);
+    return done ? Promise.resolve() : Promise.reject(new Error('Copy command failed'));
+  } catch (err) {
+    el.removeChild(textarea);
+    return Promise.reject(err);
+  }
+};

package/src/components/chat/web_duo_chat.scss CHANGED Viewed

@@ -9,7 +9,7 @@
 .web-only .duo-chat-message {
   pre code {
-    color: initial !important;
+    color: inherit !important;
     background-color: transparent !important;
   }
 }

package/dist/components/chat/components/duo_chat_message/utils.js DELETED Viewed

@@ -1,21 +0,0 @@
-const concatUntilEmpty = arr => {
-  if (!arr) return '';
-  let end = arr.findIndex(el => !el);
-  if (end < 0) end = arr.length;
-  return arr.slice(0, end).join('');
-};
-const checkClipboardPermissions = async () => {
-  try {
-    if (!navigator.clipboard || !navigator.permissions) {
-      return false;
-    }
-    const permission = await navigator.permissions.query({
-      name: 'clipboard-write'
-    });
-    return permission.state === 'granted';
-  } catch (error) {
-    return false;
-  }
-};
-export { checkClipboardPermissions, concatUntilEmpty };

package/src/components/chat/components/duo_chat_message/utils.js DELETED Viewed

@@ -1,22 +0,0 @@
-export const concatUntilEmpty = (arr) => {
-  if (!arr) return '';
-  let end = arr.findIndex((el) => !el);
-  if (end < 0) end = arr.length;
-  return arr.slice(0, end).join('');
-};
-export const checkClipboardPermissions = async () => {
-  try {
-    if (!navigator.clipboard || !navigator.permissions) {
-      return false;
-    }
-    const permission = await navigator.permissions.query({ name: 'clipboard-write' });
-    return permission.state === 'granted';
-  } catch (error) {
-    return false;
-  }
-};