@globalpayments/vega 2.49.1 → 2.51.0

package/dist/collection/components/vega-code-block/slimmers/controllers/vega-code-block-input-controller.js

@@ -0,0 +1,240 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
+/**
+ * The class used to control the code block modify content action.
+ */
+export class CodeBlockInputController extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    /**
+     * Stop the input event bubbles and update the code value.
+     *
+     * @param {InputEvent} e - The input event object.
+     */
+    this.handleInputEvent = (e) => {
+      this.stopEventPropagation(e);
+      this.updateCodeContent();
+    };
+    /**
+     * Prevent paste the file into code block. Prevent to delete the last space.
+     *
+     * @param {InputEvent} e - The input event object.
+     */
+    this.handleBeforeInput = (e) => {
+      e.stopPropagation();
+      const inputType = e.inputType;
+      if (inputType === 'insertFromPaste' && e.dataTransfer) {
+        // Should prevent the paste action if the content is a file.
+        if (e.dataTransfer.files && e.dataTransfer.files.length) {
+          e.preventDefault();
+          return;
+        }
+        // Should prevent the paste action if the plain text is empty.
+        const htmlContent = e.dataTransfer.getData('text/html');
+        // eslint-disable-next-line no-restricted-globals
+        const tempContainer = document.createElement('div');
+        tempContainer.innerHTML = htmlContent;
+        if (htmlContent && !tempContainer.innerText) {
+          e.preventDefault();
+          return;
+        }
+      }
+      else if (inputType === 'deleteContentBackward') {
+        if (!this.value || !this.value.code || this.value.code === '') {
+          e.preventDefault();
+        }
+        else {
+          this.handleDeleteAction(e);
+        }
+        return;
+      }
+      this.updateCodeBlockRange(e);
+    };
+  }
+  /**
+   * Stop `beforeinput` and `input` event bubbles to parent element.
+   */
+  registerInputEvent() {
+    const codeContentContainerRef = this.contentRenderer.getCodeContentContainerRef();
+    if (codeContentContainerRef) {
+      codeContentContainerRef.addEventListener('beforeinput', this.handleBeforeInput);
+      codeContentContainerRef.addEventListener('input', this.handleInputEvent);
+    }
+  }
+  /**
+   * Remove the event listener.
+   */
+  unregisterEventListener() {
+    const codeContentContainerRef = this.contentRenderer.getCodeContentContainerRef();
+    if (codeContentContainerRef) {
+      codeContentContainerRef.removeEventListener('beforeinput', this.handleBeforeInput);
+      codeContentContainerRef.removeEventListener('input', this.handleInputEvent);
+    }
+  }
+  /**
+   * Stop the event bubbles.
+   *
+   * @param {Event} e - The event object.
+   */
+  stopEventPropagation(e) {
+    e.stopPropagation();
+  }
+  /**
+   * Modify the component code content when user press delete key.
+   *
+   * @param {InputEvent} e - The input event object.
+   */
+  handleDeleteAction(e) {
+    const range = this.selectionController.getCurrentRange();
+    if (range) {
+      e.preventDefault();
+      const contentStartOffset = range.contentOffset;
+      const currentNodes = this.contentParseController.getCurrentCodeNodes();
+      let content = this.getCodeNodesContent(currentNodes);
+      let nextOffset = contentStartOffset;
+      // In low version firefox, the selected text could not delete when press delete key, so we handle the action manually.
+      if (range.selectedText.length) {
+        content = this.deleteSelectedText(content, contentStartOffset, range.selectedText.length);
+      }
+      else if (contentStartOffset > 0) {
+        content = content.slice(0, contentStartOffset - 1) + content.slice(contentStartOffset);
+        nextOffset -= 1;
+      }
+      this.valueController.updateValue(content, this.value.language);
+      this.selectionController.setNextCodeBlockRange(nextOffset);
+    }
+  }
+  /**
+   * Delete the selected text manually.
+   *
+   * @param {string} oldValue - The old value.
+   * @param {number} contentStartOffset - The start index.
+   * @param {number} length - The selected text length.
+   * @returns {string} - The content after delete.
+   */
+  deleteSelectedText(oldValue, contentStartOffset, length) {
+    if (length >= oldValue.length) {
+      oldValue = '';
+    }
+    else {
+      oldValue = oldValue.slice(0, contentStartOffset) + oldValue.slice(contentStartOffset + length);
+    }
+    return oldValue;
+  }
+  /**
+   * Update the code block range base on input data.
+   *
+   * @param {InputEvent} e - The input event object.
+   */
+  updateCodeBlockRange(e) {
+    const range = this.selectionController.getCurrentRange();
+    if (!this.insertCompositionTextController.isComposing() && range) {
+      this.selectionController.setNextCodeBlockRange(range.contentOffset + this.getInsertDataLength(e));
+    }
+  }
+  /**
+   * Calculates the length of the inserted data based on the input event type.
+   *
+   * @param {InputEvent} e - The input event object.
+   * @returns {number} - The length of the inserted data.
+   */
+  getInsertDataLength(e) {
+    const { data, inputType } = e;
+    switch (inputType) {
+      case 'insertText':
+        return data.length; // For insert text, we return the length of the inserted text.
+      case 'insertParagraph':
+      case 'insertLineBreak':
+        return 1;
+      case 'insertFromPaste':
+        return this.getPasteContentLength(e);
+      default:
+        return 0; // For other input types, we return 0.
+    }
+  }
+  /**
+   * Get the paste content text length.
+   *
+   * @param {InputEvent} e - The input event object.
+   * @returns {number} - The text length.
+   */
+  getPasteContentLength(e) {
+    const htmlContent = e.dataTransfer.getData('text/html');
+    if (htmlContent) {
+      // eslint-disable-next-line no-restricted-globals
+      const tempContainer = document.createElement('div');
+      tempContainer.innerHTML = htmlContent;
+      return tempContainer.innerText.length;
+    }
+    else {
+      const plainText = e.dataTransfer.getData('text/plain');
+      return plainText.length;
+    }
+  }
+  /**
+   * Update the code content after user modify action.
+   */
+  updateCodeContent() {
+    var _a;
+    if (!this.insertCompositionTextController.isComposing()) {
+      const codeContentContainerRef = this.contentRenderer.getCodeContentContainerRef();
+      let newText = codeContentContainerRef.innerText;
+      if (this.isInsertLineBreakInLowVersionFirefox(newText)) {
+        newText = newText + '\n';
+      }
+      this.valueController.updateValue(newText, (_a = this.value) === null || _a === void 0 ? void 0 : _a.language);
+    }
+  }
+  /**
+   * Collect the code nodes content from the code nodes array.
+   *
+   * @param {CodeNodeType[]} codeNodes - The code nodes array.
+   * @returns {string} - The content of code nodes.
+   */
+  getCodeNodesContent(codeNodes) {
+    return codeNodes.map((codeNode) => codeNode.text).join('');
+  }
+  /**
+   * Check if the new content update by insert line break in low version Firefox.
+   *
+   * @param {string} newText - The new text content.
+   * @returns {boolean} - Boolean value.
+   */
+  isInsertLineBreakInLowVersionFirefox(newText) {
+    var _a;
+    const oldValue = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.code) || '';
+    if (!oldValue.endsWith('\n') && newText === oldValue + '\n') {
+      return true;
+    }
+    return false;
+  }
+}
+__decorate([
+  MapToComponentField()
+], CodeBlockInputController.prototype, "selectionController", void 0);
+__decorate([
+  MapToComponentField()
+], CodeBlockInputController.prototype, "contentRenderer", void 0);
+__decorate([
+  MapToComponentField()
+], CodeBlockInputController.prototype, "valueController", void 0);
+__decorate([
+  MapToComponentField()
+], CodeBlockInputController.prototype, "contentParseController", void 0);
+__decorate([
+  MapToComponentField()
+], CodeBlockInputController.prototype, "insertCompositionTextController", void 0);
+__decorate([
+  MapToComponentField()
+], CodeBlockInputController.prototype, "value", void 0);
+__decorate([
+  MapToComponentMethod('componentDidLoad')
+], CodeBlockInputController.prototype, "registerInputEvent", null);
+__decorate([
+  MapToComponentMethod('disconnectedCallback')
+], CodeBlockInputController.prototype, "unregisterEventListener", null);

package/dist/collection/components/vega-code-block/slimmers/controllers/vega-code-block-selection-controller.js

@@ -0,0 +1,133 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { MapToComponentField, MapToComponentMethod } from 'vega-slimmer/core';
+import ShadowSelectionPolyfill from '../../../../polyfill/shadow-selection/shadow-selection-polyfill';
+import { AutoRunWhenReRenderTaskQueueSlimmer } from '../../../../helpers/slimmers/auto-run-when-re-render-task-queue-slimmer.abstract';
+import changeManager from '../../../../helpers/change-manager/change-manager';
+import domNodeSubjectFactory from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
+import { VegaInternalCodeBlockSelectionChange } from '../../../../helpers/event-manager/event-id/vega-internal-event-id';
+import { SelectionController } from '../../../vega-rich-text-editor/slimmers/controllers/selection-controller';
+import { debounce } from '../../../../utils/timer';
+import { CodeBlockRange } from './code-block-range';
+/**
+ * The class used to control the code block input cursor.
+ */
+export class VegaCodeBlockSelectionController extends AutoRunWhenReRenderTaskQueueSlimmer {
+  constructor() {
+    super(1);
+    this.handleSelectionWithDebounce = debounce(this.handleSelectionChange, VegaCodeBlockSelectionController.SELECTION_CHANGE_DEBOUNCE_TIME, this);
+    /**
+     * The method invoke after the component re-render.
+     */
+    this.doTask = async () => {
+      // add await Promise.resolve to put the code behind to a micro task
+      await Promise.resolve();
+      const selection = this.getSelection();
+      const range = this.codeBlockRange.createNativeRange(this.contentParseController.getCurrentCodeNodes());
+      if (selection && range) {
+        selection.removeAllRanges();
+        selection.addRange(range);
+      }
+    };
+  }
+  /**
+   * Get current range instance.
+   *
+   * @returns {Nullable<CodeBlockRange>} - The range instance or null.
+   */
+  getCurrentRange() {
+    return this.codeBlockRange;
+  }
+  /**
+   * Update the text content offset, push the update native range task to a queue.
+   *
+   * @param {number} contentOffset - The next content offset.
+   * @param {boolean} [immediatelyRun] - Run the task immediately or not.
+   */
+  setNextCodeBlockRange(contentOffset, immediatelyRun = false) {
+    this.codeBlockRange.updateContentOffset(contentOffset);
+    super.enqueueTheTaskIntoQueue(immediatelyRun);
+  }
+  /**
+   * Component lifecycle
+   */
+  addSelectionChangeEventListener() {
+    this.codeBlockRange = new CodeBlockRange(this.contentRenderer.getCodeContentContainerRef());
+    // eslint-disable-next-line no-restricted-globals
+    document.addEventListener('selectionchange', this.handleSelectionWithDebounce);
+  }
+  /**
+   * Component lifecycle
+   */
+  removeSelectionChangeEventListener() {
+    // eslint-disable-next-line no-restricted-globals
+    document.removeEventListener('selectionchange', this.handleSelectionWithDebounce);
+  }
+  /**
+   * Get the code block selected range
+   *
+   * @returns {Selection} A [Selection](https://developer.mozilla.org/en-US/docs/Web/API/Selection) object
+   */
+  getSelection() {
+    return ShadowSelectionPolyfill.getSelection(this.host.shadowRoot);
+  }
+  /**
+   * Notify the code content selection change event.
+   */
+  handleSelectionChange() {
+    const selection = this.getSelection();
+    if (selection && selection.rangeCount > 0) {
+      this.syncCodeRangeByNativeRange();
+      changeManager.notify(domNodeSubjectFactory.getSubject(this.host, VegaInternalCodeBlockSelectionChange), { detail: true });
+    }
+    else {
+      changeManager.notify(domNodeSubjectFactory.getSubject(this.host, VegaInternalCodeBlockSelectionChange), { detail: false });
+    }
+  }
+  /**
+   * Sync the code block range to make sure the code block range content offset is up to date after user click or selected text.
+   */
+  syncCodeRangeByNativeRange() {
+    const selection = this.getSelection();
+    if (this.isCodeBlockActive() &&
+      this.autoRunTaskQueue.queue.length === 0 &&
+      !this.insertCompositionTextController.isComposing()) {
+      const range = selection.getRangeAt(0);
+      const { startContainer, startOffset } = range;
+      this.codeBlockRange = this.codeBlockRange.updateRange(startContainer, startOffset, this.contentParseController.getCurrentCodeNodes(), range.toString());
+    }
+  }
+  /**
+   * This method is used to determine if the code block is currently focused or active.
+   * In firefox and safari, the selection change event will trigger when the code block is not active, because the shadow selection polyfill will always return the selection of the code block.
+   *
+   * @returns {boolean} - Returns true if the code block is active, otherwise false.
+   */
+  isCodeBlockActive() {
+    return this.host && this.host.classList.contains('focus');
+  }
+}
+// Must make sure the debounce time will not greater than the RTE selection range debounce time.
+VegaCodeBlockSelectionController.SELECTION_CHANGE_DEBOUNCE_TIME = Math.min(SelectionController.SELECTION_CHANGE_DEBOUNCE_TIME, 40);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockSelectionController.prototype, "host", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockSelectionController.prototype, "contentRenderer", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockSelectionController.prototype, "contentParseController", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockSelectionController.prototype, "insertCompositionTextController", void 0);
+__decorate([
+  MapToComponentMethod('componentDidLoad')
+], VegaCodeBlockSelectionController.prototype, "addSelectionChangeEventListener", null);
+__decorate([
+  MapToComponentMethod('disconnectedCallback')
+], VegaCodeBlockSelectionController.prototype, "removeSelectionChangeEventListener", null);

package/dist/collection/components/vega-code-block/slimmers/controllers/vega-code-block-value-controller.js

@@ -0,0 +1,44 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
+/**
+ * The component value controller.
+ */
+export class VegaCodeBlockValueController extends VegaSlimmer {
+  /**
+   * Update the component value if code content or code language update.
+   *
+   * @param {string} code - The new code content.
+   * @param {string} language - The new code language.
+   */
+  updateValue(code, language) {
+    if (!this.value || this.value.code !== code || this.value.language !== language) {
+      this.value = {
+        language: language,
+        code,
+      };
+      this.changeEventEmitter.emit(this.value);
+    }
+  }
+  /**
+   * Set a default value if the value is not defined.
+   */
+  initialValue() {
+    if (!this.value) {
+      this.value = { code: '', language: 'plainText' };
+    }
+  }
+}
+__decorate([
+  MapToComponentField({ writable: true })
+], VegaCodeBlockValueController.prototype, "value", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockValueController.prototype, "changeEventEmitter", void 0);
+__decorate([
+  MapToComponentMethod('connectedCallback')
+], VegaCodeBlockValueController.prototype, "initialValue", null);

package/dist/collection/components/vega-code-block/slimmers/renderers/vega-code-block-content-renderer.js

@@ -0,0 +1,117 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Fragment, h } from '@stencil/core';
+import { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
+/**
+ * The code block content renderer class.
+ */
+export class VegaCodeBlockContentRenderer extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    /**
+     * The code input area focus.
+     */
+    this.handleFocus = () => {
+      if (!this.readOnly && !this.disabled) {
+        this.host.classList.add('focus');
+      }
+    };
+    /**
+     * The code input area blur.
+     */
+    this.handleBlur = () => {
+      this.host.classList.remove('focus');
+    };
+  }
+  /**
+   * Get the editable root element.
+   *
+   * @returns {HTMLElement} - The root element.
+   */
+  getCodeContentContainerRef() {
+    return this.codeContentContainerRef;
+  }
+  /**
+   * Add focus and blur event listener.
+   */
+  registerEventListener() {
+    if (this.codeContentContainerRef) {
+      this.codeContentContainerRef.addEventListener('focusin', this.handleFocus);
+      this.codeContentContainerRef.addEventListener('focusout', this.handleBlur);
+    }
+  }
+  /**
+   * Remove the event listener.
+   */
+  unregisterEventListener() {
+    if (this.codeContentContainerRef) {
+      this.codeContentContainerRef.removeEventListener('focusin', this.handleFocus);
+      this.codeContentContainerRef.removeEventListener('focusout', this.handleBlur);
+    }
+  }
+  /**
+   * Render the code content.
+   *
+   * @returns {HTMLElement} - The code element.
+   */
+  render() {
+    var _a;
+    const codeNodes = this.contentParseController.parseCode();
+    const language = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.language) || '';
+    return (h(Fragment, null,
+      h("style", null, this.getLineNumberStyleVariable(codeNodes)),
+      h("code", { role: "textbox", tabIndex: 0, spellcheck: false, ref: (node) => (this.codeContentContainerRef = node), contenteditable: this.readOnly || this.disabled ? false : true, "data-language": language, innerHTML: codeNodes
+          .map((codeNode) => this.renderCodeNode(codeNode))
+          .join('') })));
+  }
+  /**
+   * Render the code node the html element.
+   *
+   * @param {CodeNodeType} codeNode - The code node object.
+   * @returns {string} - The html element.
+   */
+  renderCodeNode(codeNode) {
+    const { key, className, mark, text } = codeNode;
+    return `<span key='${key}' class='${className}' data-mark='${mark}' data-index='${key}'>${text}</span>`;
+  }
+  /**
+   * Dynamic calculate line number element width and update the margin and padding variable.
+   *
+   * @param {CodeNodeType[]} codeNodes - The code node array.
+   * @returns {string} - The style content.
+   */
+  getLineNumberStyleVariable(codeNodes) {
+    const lineCountArray = codeNodes.filter((item) => {
+      return item.text === '\n';
+    });
+    const singleTextLength = 10;
+    const gap = 16;
+    const space = (lineCountArray.length + 1).toString().length * singleTextLength;
+    return `code{--v-code-line-number-width:${space}px;--v-code-line-number-ml:-${space + gap}px;--v-code-block-pl:${space + gap}px}`;
+  }
+}
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockContentRenderer.prototype, "host", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockContentRenderer.prototype, "readOnly", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockContentRenderer.prototype, "disabled", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockContentRenderer.prototype, "value", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockContentRenderer.prototype, "contentParseController", void 0);
+__decorate([
+  MapToComponentMethod('componentDidLoad')
+], VegaCodeBlockContentRenderer.prototype, "registerEventListener", null);
+__decorate([
+  MapToComponentMethod('disconnectedCallback')
+], VegaCodeBlockContentRenderer.prototype, "unregisterEventListener", null);

package/dist/collection/components/vega-code-block/slimmers/renderers/vega-code-block-copy-button-renderer.js

@@ -0,0 +1,67 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { MapToComponentField, VegaSlimmer } from 'vega-slimmer/core';
+import { h } from '@stencil/core';
+import { VegaInternalIconManager } from '../../../../helpers/icon/internal-icon-manager';
+import copy from '../../assets/copy';
+import { VegaClick } from '../../../../helpers/event-manager/event-id/vega-event-id';
+import { DomNodeSubjectObserverFactory } from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
+export class VegaCodeBlockCopyButtonRenderer extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    /**
+     * Copy the code.
+     *
+     * @param {HTMLVegaButtonCircleElement} node - The copy button.
+     */
+    this.handleCopyClick = (node) => {
+      DomNodeSubjectObserverFactory.addUniqueObserverToNode(node, VegaClick, async () => {
+        var _a;
+        const content = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.code) || '';
+        if (content && globalThis.navigator && globalThis.navigator.clipboard) {
+          clearTimeout(this.updateLabelTimer);
+          await globalThis.navigator.clipboard.writeText(content);
+          const oldTooltip = node.label;
+          node.label = this.translationSlimmer.t('Copied');
+          this.updateLabelTimer = setTimeout(() => {
+            if (node) {
+              node.label = oldTooltip;
+            }
+          }, VegaCodeBlockCopyButtonRenderer.RESET_TOOLTIP_TIME);
+        }
+      });
+    };
+  }
+  /**
+   * Render a copy button.
+   *
+   * @returns {Nullable<HTMLElement>} The button element.
+   */
+  render() {
+    if (this.showCopyButton && this.readOnly) {
+      return (h("vega-button-circle", { key: "copy-button", label: this.translationSlimmer.t('Copy Code'), class: "copy-code-button", icon: VegaInternalIconManager.getIconKey('copy'), iconColor: "text-secondary", variant: "icon-only", size: "extra-small", ref: this.handleCopyClick }));
+    }
+  }
+}
+(() => {
+  VegaInternalIconManager.register({
+    copy: copy,
+  });
+})();
+VegaCodeBlockCopyButtonRenderer.RESET_TOOLTIP_TIME = 1000;
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockCopyButtonRenderer.prototype, "value", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockCopyButtonRenderer.prototype, "readOnly", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockCopyButtonRenderer.prototype, "showCopyButton", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCodeBlockCopyButtonRenderer.prototype, "translationSlimmer", void 0);