@gitlab/ui 91.7.0 → 91.9.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [91.9.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v91.8.0...v91.9.0) (2024-09-04)
+
+
+### Features
+
+* **GlDuoChat:** make insert code snippet work with server-generated elements ([ce66a88](https://gitlab.com/gitlab-org/gitlab-ui/commit/ce66a88f7a477d5120c70633850106e8a8c1200e))
+
+# [91.8.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v91.7.0...v91.8.0) (2024-09-04)
+
+
+### Features
+
+* **GlLink:** Add and update tokens ([df90a00](https://gitlab.com/gitlab-org/gitlab-ui/commit/df90a0020dabcb05357dc0a65f468ef77c5575cd))
+
 # [91.7.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v91.6.0...v91.7.0) (2024-09-04)
 
 

package/dist/components/experimental/duo/chat/components/duo_chat_message/insert_code_snippet_element.js

@@ -1,19 +1,55 @@
 import { createButton } from './buttons_utils';
 
+function _assertClassBrand(e, t, n) {
+  if ("function" == typeof e ? e === t : e.has(t)) return arguments.length < 3 ? t : n;
+  throw new TypeError("Private element is not present on this object");
+}
+function _checkPrivateRedeclaration(e, t) {
+  if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object");
+}
+function _classPrivateFieldGet2(s, a) {
+  return s.get(_assertClassBrand(s, a));
+}
+function _classPrivateFieldInitSpec(e, t, a) {
+  _checkPrivateRedeclaration(e, t), t.set(e, a);
+}
+function _classPrivateFieldSet2(s, a, r) {
+  return s.set(_assertClassBrand(s, a), r), r;
+}
+
+const CODE_MARKDOWN_CLASS = 'js-markdown-code';
+var _actionButton = /*#__PURE__*/new WeakMap();
+var _codeBlock = /*#__PURE__*/new WeakMap();
+var _handleClick = /*#__PURE__*/new WeakMap();
 class InsertCodeSnippetElement extends HTMLElement {
   constructor(codeBlock) {
     super();
-    const btn = createButton();
-    const wrapper = codeBlock;
-    this.appendChild(btn);
-    btn.addEventListener('click', () => {
-      if (wrapper) {
-        wrapper.dispatchEvent(new CustomEvent('insert-code-snippet', {
+    _classPrivateFieldInitSpec(this, _actionButton, void 0);
+    _classPrivateFieldInitSpec(this, _codeBlock, void 0);
+    _classPrivateFieldInitSpec(this, _handleClick, () => {
+      if (_classPrivateFieldGet2(_codeBlock, this)) {
+        _classPrivateFieldGet2(_codeBlock, this).dispatchEvent(new CustomEvent('insert-code-snippet', {
           bubbles: true,
-          cancelable: true
+          cancelable: true,
+          detail: {
+            code: _classPrivateFieldGet2(_codeBlock, this).textContent.trim()
+          }
         }));
       }
     });
+    _classPrivateFieldSet2(_actionButton, this, createButton());
+
+    // we handle two possible cases here:
+    // 1. we use constructor parameter if the element is created in Javscript and inserted in the document
+    // 2. we find the wrapping element containing code if the element is received from the server
+    _classPrivateFieldSet2(_codeBlock, this, codeBlock !== null && codeBlock !== void 0 ? codeBlock : this.closest(`.${CODE_MARKDOWN_CLASS}`));
+  }
+  connectedCallback() {
+    this.appendChild(_classPrivateFieldGet2(_actionButton, this));
+    _classPrivateFieldGet2(_actionButton, this).addEventListener('click', _classPrivateFieldGet2(_handleClick, this));
+  }
+  disconnectedCallback() {
+    _classPrivateFieldGet2(_actionButton, this).removeEventListener('click', _classPrivateFieldGet2(_handleClick, this));
   }
 }
 

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

@@ -419,6 +419,10 @@ var script = {
       }
     },
     onInsertCodeSnippet(e) {
+      /**
+       * Emit insert-code-snippet event that clients can use to interact with a suggested code.
+       * @param {*} event An event containing code string in the "detail.code" field.
+       */
       this.$emit('insert-code-snippet', e);
     }
   },

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

@@ -1,5 +1,4 @@
 import { setStoryTimeout } from '../../../../utils/test_utils';
-import { InsertCodeSnippetElement } from './components/duo_chat_message/insert_code_snippet_element';
 import { DOCUMENTATION_SOURCE_TYPES, MESSAGE_MODEL_ROLES, CHAT_RESET_MESSAGE, CHAT_CLEAN_MESSAGE } from './constants';
 import { getMockContextItems } from './components/duo_chat_context/mock_context_data';
 
@@ -135,7 +134,6 @@ const renderGFM = el => {
   const codeBlock = el.querySelectorAll('.markdown-code-block');
   codeBlock.forEach(block => {
     block === null || block === void 0 ? void 0 : block.classList.add('gl-markdown', 'gl-compact-markdown');
-    block === null || block === void 0 ? void 0 : block.appendChild(new InsertCodeSnippetElement(block));
   });
 };
 const SLASH_COMMANDS = [{