@heartlandone/vega 2.74.0-RTE-table-preview → 2.74.0

package/dist/vega/vega-image-uploader.entry.js

@@ -1,977 +0,0 @@
-import { h, g as Host, r as registerInstance, e as createEvent, i as getElement } from './index-01a2f9c9.js';
-import { s as sanitizeVegaComponent } from './component-0cff85cf.js';
-import { R as RequiredFieldRule } from './required-field-rule-ab4bdc47.js';
-import { V as VegaSlimmer, b as MapToComponentField, M as MapToComponentMethod, m as methodPlaceholder, e as InjectVegaGlobalSlimmer, a as InjectVegaSlimmer } from './vega-slimmer-core-83fd0e22.js';
-import { r as responsiveFormatFacade } from './responsive-format-facade-d4abfdb9.js';
-import { D as DomNodeSubjectObserverFactory } from './dom-node-subject-observer-factory-3b49c6b3.js';
-import { a as VegaClick, h as VegaChange, n as VegaRemove, E as VegaCancel } from './vega-event-id-61c8bd9f.js';
-import { F as FORM_ELEMENT_VALUE_CHANGE } from './static-subject-title-6fdf8c8b.js';
-import { C as ChangeManager } from './change-manager-b115783e.js';
-import { c as createEnterKeyHandlerToTriggerClick } from './accessibility-e5fd0fab.js';
-import { c as VegaDialog } from './public-api-a77a0b33.js';
-import { F as FormFieldControllerSlimmer } from './form-field-controller-slimmer-316ebdb1.js';
-import { d as getDeepActiveElementInShadow, f as findParent } from './ui-5f775fd9.js';
-import { C as ChildNodesEventPreventSlimmer } from './child-nodes-event-prevent-slimmer-fcfc9c8b.js';
-import { c as createEventEmitSlimmer } from './event-emit-slimmer-61db3eef.js';
-import { V as VegaComponentUsageRuntimeMetricsSlimmer } from './component-usage-runtime-metrics-0513698f.js';
-import './index-9fdb7060.js';
-import { D as DarkModeStateControllerSlimmer } from './dark-mode-state-controller-slimmer-32138407.js';
-import { V as VegaInternalThemeManager } from './dark-mode-style-controller-e2a2f76c.js';
-import { T as TranslationSlimmer } from './translation-slimmer-3c4e2876.js';
-import './internal-form-field-validation-rule.abstract-f5b6bdbf.js';
-import './type-guard-09acedc9.js';
-import './breakpoints-d9faf11c.js';
-import './ui-189dae23.js';
-import './typography-396de03f.js';
-import './index-81ce67e2.js';
-import './create-public-api-runtime-metrics-slimmer-8565f08b.js';
-import './page-resize-observer-slimmer-ee8774a6.js';
-import './try-get-document-bef0f526.js';
-import './number-4398f2e1.js';
-import './pixel-f32c07ce.js';
-import './array-a1d98264.js';
-import './feature-flag-controller-24b9f956.js';
-import './index-1f9eab8f.js';
-import './_commonjsHelpers-2088bffa.js';
-import './observer-3959f9dd.js';
-import './dom-node-subject-factory-5798693b.js';
-import './vega-env-manager-8f8dc473.js';
-import './internal-vega-event-manager-826279b7.js';
-import './internal-vega-z-index-manager-f0ca0975.js';
-import './internal-icon-manager-9279071a.js';
-import './valid-credit-card-number-rule-04b032a6.js';
-import './index-b04c1ee0.js';
-import './vega-internal-event-id-b65a01a3.js';
-import './content-state-fc9d98e0.js';
-import './code-block-b5f8fc8a.js';
-import './string-a953eafc.js';
-import './object-66c37948.js';
-import './vega-nonce-manager-497e5eb5.js';
-import './dto-renderer-manager-12bc9121.js';
-import './base-renderer-101f6d04.js';
-import './column-operation-a1620c67.js';
-import './remote-invocation-registry-4219120b.js';
-import './timer-9321173b.js';
-import './styles.constants-b320e4a7.js';
-import './range-429fb0e2.js';
-import './mutation-observer-slimmer-7065c745.js';
-import './mutation-observer-filters-6c515793.js';
-import './sub-state-observer-slimmer-4fc8b3da.js';
-
-var __decorate$b = (undefined && undefined.__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;
-};
-/** The VegaImageUploaderRenderer class is a TypeScript React component that renders a VegaImageUploader with different content based on its status. */
-class VegaImageUploaderRenderer extends VegaSlimmer {
-  getImageUploaderContainer() {
-    return this.imageUploaderContainerRef;
-  }
-  /**
-   * The render function returns a JSX element that represents a VegaImageUploader component with a disabled border if it is disabled and does not have a value.
-   *
-   * @returns {VegaImageUploader} The render() function is returning a JSX element of type VegaImageUploader.
-   */
-  render() {
-    return (h(Host, { class: { disabled: this.disabled } },
-      this.renderLabelDom(),
-      h("div", { ref: (e) => (this.imageUploaderContainerRef = e), class: {
-          'vega-image-uploader-select': true,
-          'disabled-border': this.disabled && !this.value,
-        }, style: {
-          width: this.getSize(this.width),
-          height: this.getSize(this.height),
-        } }, this.renderContentByStatus()),
-      this.inputRenderer.render(),
-      this.renderHint()));
-  }
-  renderLabelDom() {
-    return (h("vega-field-label", { "is-field-required": this.required, disabled: this.disabled, label: this.label }));
-  }
-  renderContentByStatus() {
-    if (this.status === 'uploading') {
-      return this.uploadingContentRenderer.render();
-    }
-    else {
-      const imagePreviewURL = this.previewController.getImagePreviewURL();
-      return imagePreviewURL
-        ? this.previewContentRenderer.render(imagePreviewURL)
-        : this.defaultContentRenderer.render();
-    }
-  }
-  renderHint() {
-    return (this.hint && (h("div", { class: "vega-hint" },
-      h("label", null, this.hint))));
-  }
-  getSize(size) {
-    if (size) {
-      const result = responsiveFormatFacade.format(size, 'size');
-      return typeof result === 'number' ? `${result}px` : `${result}`;
-    }
-  }
-}
-__decorate$b([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderInputRenderer' })
-], VegaImageUploaderRenderer.prototype, "inputRenderer", void 0);
-__decorate$b([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderDefaultContentRenderer' })
-], VegaImageUploaderRenderer.prototype, "defaultContentRenderer", void 0);
-__decorate$b([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderPreviewContentRenderer' })
-], VegaImageUploaderRenderer.prototype, "previewContentRenderer", void 0);
-__decorate$b([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderUploadingContentRenderer' })
-], VegaImageUploaderRenderer.prototype, "uploadingContentRenderer", void 0);
-__decorate$b([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderPreviewController' })
-], VegaImageUploaderRenderer.prototype, "previewController", void 0);
-__decorate$b([
-  MapToComponentField()
-], VegaImageUploaderRenderer.prototype, "value", void 0);
-__decorate$b([
-  MapToComponentField()
-], VegaImageUploaderRenderer.prototype, "disabled", void 0);
-__decorate$b([
-  MapToComponentField()
-], VegaImageUploaderRenderer.prototype, "status", void 0);
-__decorate$b([
-  MapToComponentField()
-], VegaImageUploaderRenderer.prototype, "label", void 0);
-__decorate$b([
-  MapToComponentField()
-], VegaImageUploaderRenderer.prototype, "required", void 0);
-__decorate$b([
-  MapToComponentField()
-], VegaImageUploaderRenderer.prototype, "width", void 0);
-__decorate$b([
-  MapToComponentField()
-], VegaImageUploaderRenderer.prototype, "height", void 0);
-__decorate$b([
-  MapToComponentField()
-], VegaImageUploaderRenderer.prototype, "hint", void 0);
-
-var __decorate$a = (undefined && undefined.__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;
-};
-/** The VegaImageUploaderInputRenderer class is a TypeScript React component that renders an input element of type "file" for uploading images and provides methods for accessing and manipulating the file input element. */
-class VegaImageUploaderInputRenderer extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    /**
-     * The below method is e2e-test covered in
-     * @see{module:the-value-will-be-changed-when-selected-the-image-file}
-     */
-    /* istanbul ignore next */
-    this.handleFileInputChange = (e) => {
-      e.stopPropagation();
-      const input = e.target;
-      if (!input.files.length) {
-        return;
-      }
-      this.valueController.setValue(input.files[0]);
-    };
-  }
-  /**
-   * The `getFileInputRef()` method is returning a reference to the HTMLInputElement that represents the
-   * file input element in the component's render method. This allows other parts of the code to access
-   * and manipulate the file input element if needed.
-   *
-   * @returns {HTMLInputElement} the input ref
-   */
-  getFileInputRef() {
-    return this.fileInputRef;
-  }
-  /** The `render()` method is defining the JSX/HTML structure that will be rendered by this component. In this case, it is returning an `<input>` element of type "file". */
-  render() {
-    return (h("input", { type: "file", accept: this.accept, class: "v-hidden", ref: (ref) => (this.fileInputRef = ref), onChange: this.handleFileInputChange }));
-  }
-}
-__decorate$a([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderValueController' })
-], VegaImageUploaderInputRenderer.prototype, "valueController", void 0);
-__decorate$a([
-  MapToComponentField()
-], VegaImageUploaderInputRenderer.prototype, "accept", void 0);
-
-var __decorate$9 = (undefined && undefined.__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;
-};
-/** The VegaImageUploaderInputController class is responsible for handling user interactions and controlling the input element of the VegaImageUploader component. */
-class VegaImageUploaderInputController extends VegaSlimmer {
-  /**
-   * The function triggers a click event on a file input element if it is not disabled.
-   */
-  triggerInputClick() {
-    if (this.disabled)
-      return;
-    this.inputRenderer.getFileInputRef().click();
-  }
-  /**
-   * The function "resetInput" clears the value of a file input element.
-   */
-  resetInput() {
-    this.inputRenderer.getFileInputRef().value = '';
-  }
-}
-__decorate$9([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderInputRenderer' })
-], VegaImageUploaderInputController.prototype, "inputRenderer", void 0);
-__decorate$9([
-  MapToComponentField()
-], VegaImageUploaderInputController.prototype, "disabled", void 0);
-
-var __decorate$8 = (undefined && undefined.__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;
-};
-/** The `VegaImageUploaderActionsRenderer` class is a TypeScript React component that renders action buttons for an image uploader component. */
-class VegaImageUploaderActionsRenderer extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    /**
-     * render the action button by action type, preview button, delete button
-     *
-     * @param {UploaderActionTypes} actionType action type
-     * @returns {HTMLVegaButtonCircleElement} tooltip element
-     */
-    this.renderActionButton = (actionType) => {
-      const options = this.getButtonOptions(actionType);
-      return (h("vega-button-circle", Object.assign({ size: "small", variant: "icon-only", iconColor: this.isInDarkMode ? 'text-primary' : 'text-inverted-primary', role: "menuitem", ref: (ref) => {
-          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, () => {
-            this.handleClick(actionType);
-          });
-        } }, options)));
-    };
-  }
-  /**
-   * The handleClick function takes a type parameter and performs different actions based on the value of the type.
-   *
-   * @param {string} type - The `type` parameter is a string that represents the type of action to be performed. It can have one of the following values: 'Preview', 'Delete', or 'Replace'.
-   */
-  handleClick(type) {
-    switch (type) {
-      case 'Preview':
-        this.previewController.showPreview();
-        break;
-      case 'Delete':
-        this.removeController.showRemoveDialog();
-        break;
-      case 'Replace':
-        this.inputController.triggerInputClick();
-        break;
-    }
-  }
-  /**
-   * The render function returns a span element with action buttons based on certain conditions.
-   *
-   * @returns {HTMLSpanElement | null} an HTMLSpanElement if the condition "withActions" is true. Otherwise, it returns null.
-   */
-  render() {
-    const withActions = this.showRemoveButton || this.showPreviewButton || this.showReplaceButton;
-    return withActions ? (h("span", { class: "actions" },
-      this.showPreviewButton && this.renderActionButton('Preview'),
-      this.showReplaceButton && !this.disabled && this.renderActionButton('Replace'),
-      this.showRemoveButton && !this.disabled && this.renderActionButton('Delete'))) : null;
-  }
-  /**
-   * get action button props icon, onClick, label by action type
-   *
-   * @param {UploaderActionTypes} actionType action type
-   * @returns {Nullable<ActionButtonOptions>} the options result
-   */
-  getButtonOptions(actionType) {
-    let options;
-    switch (actionType) {
-      case 'Preview':
-        options = {
-          icon: 'zoom-in',
-          label: actionType,
-        };
-        break;
-      case 'Delete':
-        options = {
-          icon: 'delete-bin',
-          label: actionType,
-        };
-        break;
-      case 'Replace':
-        options = {
-          icon: 'photo',
-          label: actionType,
-        };
-        break;
-      /* istanbul ignore next */
-      default:
-        break;
-    }
-    return options;
-  }
-}
-__decorate$8([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderInputController' })
-], VegaImageUploaderActionsRenderer.prototype, "inputController", void 0);
-__decorate$8([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderValueController' })
-], VegaImageUploaderActionsRenderer.prototype, "valueController", void 0);
-__decorate$8([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderPreviewController' })
-], VegaImageUploaderActionsRenderer.prototype, "previewController", void 0);
-__decorate$8([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderRemoveController' })
-], VegaImageUploaderActionsRenderer.prototype, "removeController", void 0);
-__decorate$8([
-  MapToComponentField()
-], VegaImageUploaderActionsRenderer.prototype, "disabled", void 0);
-__decorate$8([
-  MapToComponentField()
-], VegaImageUploaderActionsRenderer.prototype, "showPreviewButton", void 0);
-__decorate$8([
-  MapToComponentField()
-], VegaImageUploaderActionsRenderer.prototype, "showRemoveButton", void 0);
-__decorate$8([
-  MapToComponentField()
-], VegaImageUploaderActionsRenderer.prototype, "showReplaceButton", void 0);
-__decorate$8([
-  MapToComponentField()
-], VegaImageUploaderActionsRenderer.prototype, "removeEventEmitter", void 0);
-__decorate$8([
-  MapToComponentField()
-], VegaImageUploaderActionsRenderer.prototype, "isInDarkMode", void 0);
-
-var __decorate$7 = (undefined && undefined.__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;
-};
-/** The VegaImageUploaderValueController class is responsible for handling the value and change events of a VegaImageUploader component. */
-class VegaImageUploaderValueController extends VegaSlimmer {
-  /** trigger a vegaChange event when component value change */
-  handleValueChange() {
-    if (!this.value) {
-      this.inputController.resetInput();
-    }
-    this.changeEventEmitter.emit(this.value);
-    ChangeManager.notify(FORM_ELEMENT_VALUE_CHANGE, {
-      host: this.host,
-      detail: this.value,
-    });
-  }
-  /**
-   * The function sets the value of a variable to either a VegaFile object or null.
-   *
-   * @param {VegaFile | null} value - The value parameter is of type VegaFile or null.
-   */
-  setValue(value) {
-    this.value = value;
-  }
-}
-__decorate$7([
-  MapToComponentField({ writable: true })
-], VegaImageUploaderValueController.prototype, "value", void 0);
-__decorate$7([
-  MapToComponentField()
-], VegaImageUploaderValueController.prototype, "changeEventEmitter", void 0);
-__decorate$7([
-  MapToComponentField()
-], VegaImageUploaderValueController.prototype, "host", void 0);
-__decorate$7([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderInputController' })
-], VegaImageUploaderValueController.prototype, "inputController", void 0);
-__decorate$7([
-  MapToComponentMethod('watchValue')
-], VegaImageUploaderValueController.prototype, "handleValueChange", null);
-
-var __decorate$6 = (undefined && undefined.__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;
-};
-/** The `VegaImageUploaderPreviewController` class is responsible for showing a preview of an uploaded image in a modal. */
-class VegaImageUploaderPreviewController extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    /**
-     * The `getImagePreviewURL` method is responsible for generating the URL of the image preview. It
-     * checks if `this.value` exists, and if so, it returns the URL of the uploaded file (`(this.value as
-     * VegaUploadedFile).url`). If the URL is not available, it falls back to creating a temporary URL
-     * using `URL.createObjectURL(this.value as File)`. This temporary URL is used for previewing the
-     * image until it is uploaded or saved permanently.
-     *
-     * @param {VegaFile} [file] the file object which needs to convert to a URL
-     * @returns {Nullable<string>} the url of image
-     */
-    this.getImagePreviewURL = (file) => {
-      file = file ? file : this.value;
-      if (file) {
-        return (file.url ||
-          /*
-           * The below method is e2e-test covered in
-           *
-           * @see{module:should-show-preview-image-when-click-the-preview-button-after-selected-image}
-           */
-          /* istanbul ignore next */
-          URL.createObjectURL(file));
-      }
-    };
-    /**
-     * The `generatePreviewModal` method is a private method of the `VegaImageUploaderPreviewController`
-     * class. It is responsible for creating a modal element and appending it to the document body.
-     *
-     * @param {Nullable<string>} imagePreviewURL the image url
-     * @returns {HTMLElement} a preview vega modal
-     */
-    this.generatePreviewModal = (imagePreviewURL) => {
-      // eslint-disable-next-line no-restricted-globals
-      const previewModal = document.createElement('vega-modal');
-      if (this.value && this.value.name) {
-        previewModal.modalTitle = this.value.name;
-      }
-      // eslint-disable-next-line no-restricted-globals
-      const container = document.createElement('div');
-      container.style.textAlign = 'center';
-      // eslint-disable-next-line no-restricted-globals
-      const img = document.createElement('img');
-      img.width = 0;
-      img.className = 'preview-image';
-      if (imagePreviewURL) {
-        img.src = imagePreviewURL;
-      }
-      img.alt = '';
-      img.style.width = '100%';
-      container.appendChild(img);
-      previewModal.appendChild(container);
-      this.previewModalRef = previewModal;
-      // eslint-disable-next-line no-restricted-globals
-      document.body.append(previewModal);
-      return previewModal;
-    };
-  }
-  /**
-   * remove preview modal when component destroy
-   */
-  disconnectedCallback() {
-    var _a;
-    (_a = this.previewModalRef) === null || _a === void 0 ? void 0 : _a.remove();
-  }
-  /**
-   * The `showPreview` function displays an image preview in a modal, either by generating a new modal or updating an existing one.
-   */
-  showPreview() {
-    const imagePreviewURL = this.getImagePreviewURL();
-    if (!this.previewModalRef) {
-      const previewModal = this.generatePreviewModal(imagePreviewURL);
-      void previewModal.modal('show');
-    }
-    else {
-      const previewImage = this.previewModalRef.querySelector('.preview-image');
-      if (previewImage && imagePreviewURL) {
-        previewImage.src = imagePreviewURL;
-      }
-      if (this.value && this.value.name) {
-        this.previewModalRef.modalTitle = this.value.name;
-      }
-      void this.previewModalRef.modal('show');
-    }
-  }
-}
-__decorate$6([
-  MapToComponentField()
-], VegaImageUploaderPreviewController.prototype, "value", void 0);
-__decorate$6([
-  MapToComponentMethod('disconnectedCallback')
-], VegaImageUploaderPreviewController.prototype, "disconnectedCallback", null);
-__decorate$6([
-  MapToComponentMethod('getContentURL')
-], VegaImageUploaderPreviewController.prototype, "getImagePreviewURL", void 0);
-
-var __decorate$5 = (undefined && undefined.__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;
-};
-/** The VegaImageUploaderPreviewContentRenderer class is responsible for rendering an image preview container with an image and optional actions element. */
-class VegaImageUploaderPreviewContentRenderer extends VegaSlimmer {
-  /**
-   * The function renders an image preview container with an image and optional actions element.
-   *
-   * @param {string} imagePreviewURL - A string representing the URL of the image to be previewed.
-   * @returns {HTMLDivElement} an HTMLDivElement includes an image and action buttons
-   */
-  render(imagePreviewURL) {
-    const actionsElement = this.actionsRenderer.render();
-    return (h("div", { class: {
-        'image-preview-container': true,
-        'actions-backdrop': actionsElement ? true : false,
-      }, tabIndex: 0, role: "menu" },
-      h("img", { src: imagePreviewURL, alt: "" }),
-      actionsElement));
-  }
-}
-__decorate$5([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderActionsRenderer' })
-], VegaImageUploaderPreviewContentRenderer.prototype, "actionsRenderer", void 0);
-
-var __decorate$4 = (undefined && undefined.__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;
-};
-/** The VegaImageUploaderUploadingContentRenderer class is a TypeScript React component that renders a cancel action button for an image uploader. */
-class VegaImageUploaderUploadingContentRenderer extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    this.handleCancelUploading = (e) => {
-      e.stopPropagation();
-      this.status = undefined;
-      this.removeController.handleRemoveFile();
-      this.cancelEventEmitter.emit();
-    };
-  }
-  /**
-   * The above function renders a div element with a cancel action button that triggers a function when clicked or when the enter key is pressed.
-   *
-   * @returns {HTMLDivElement} The render() method is returning an HTMLDivElement.
-   */
-  render() {
-    return (h("div", { class: "action-wrapper", role: "button", tabIndex: 0, onClick: this.handleCancelUploading, onKeyDown: createEnterKeyHandlerToTriggerClick() },
-      h("span", { class: "action-loading" }),
-      h("div", { class: "vega-image-uploader-text cancel-action" }, "Cancel")));
-  }
-}
-__decorate$4([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderRemoveController' })
-], VegaImageUploaderUploadingContentRenderer.prototype, "removeController", void 0);
-__decorate$4([
-  MapToComponentField({ writable: true })
-], VegaImageUploaderUploadingContentRenderer.prototype, "status", void 0);
-__decorate$4([
-  MapToComponentField()
-], VegaImageUploaderUploadingContentRenderer.prototype, "cancelEventEmitter", void 0);
-
-var __decorate$3 = (undefined && undefined.__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;
-};
-/** The VegaImageUploaderDefaultContentRenderer class is a TypeScript React component that renders a button-like element for uploading images. */
-class VegaImageUploaderDefaultContentRenderer extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    this.handleUploaderClick = (e) => {
-      e.stopPropagation();
-      this.inputController.triggerInputClick();
-    };
-  }
-  /**
-   * The render function returns a div element with a button-like appearance that triggers a click event when clicked or when the enter key is pressed.
-   *
-   * @returns {HTMLDivElement} The render() method is returning an HTMLDivElement.
-   */
-  render() {
-    return (h("div", { class: "action-wrapper", role: "button", tabIndex: 0, onClick: this.handleUploaderClick, onKeyDown: createEnterKeyHandlerToTriggerClick() },
-      h("vega-icon", { icon: "plus-sign", size: "size-24" }),
-      h("div", { class: "vega-image-uploader-text" }, this.translationSlimmer.t(this.actionTitle)),
-      this.renderSubtitle()));
-  }
-  renderSubtitle() {
-    return this.actionSubTitle && h("div", { class: "sub-title" }, this.actionSubTitle);
-  }
-}
-__decorate$3([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderInputController' })
-], VegaImageUploaderDefaultContentRenderer.prototype, "inputController", void 0);
-__decorate$3([
-  MapToComponentField()
-], VegaImageUploaderDefaultContentRenderer.prototype, "actionTitle", void 0);
-__decorate$3([
-  MapToComponentField()
-], VegaImageUploaderDefaultContentRenderer.prototype, "actionSubTitle", void 0);
-__decorate$3([
-  MapToComponentField()
-], VegaImageUploaderDefaultContentRenderer.prototype, "translationSlimmer", void 0);
-
-var __decorate$2 = (undefined && undefined.__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;
-};
-/** The `VegaImageUploaderRemoveController` class is responsible for handling the removal of images from the `VegaImageUploader` component. */
-class VegaImageUploaderRemoveController extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    /*
-     * The below method is e2e-test covered in
-     * @see{module:image-file-should-be-removed-when-click-the-remove-button}
-     */
-    /* istanbul ignore next */
-    /**
-     * open a vega dialog confirm remove the file
-     */
-    this.showRemoveDialog = () => {
-      this.removeDialogRef = VegaDialog.open({
-        type: 'danger',
-        title: 'Delete Image',
-        content: 'Are you sure you want to delete this image?',
-        // eslint-disable-next-line jsdoc/require-jsdoc
-        handleOk: () => {
-          this.handleRemoveFile();
-          return true;
-        },
-        okButton: {
-          label: 'Delete',
-        },
-      });
-    };
-    /** The `handleRemoveFile` method is responsible for removing the image from the `VegaImageUploader` component. */
-    this.handleRemoveFile = () => {
-      this.valueController.setValue(null);
-      this.removeEventEmitter.emit();
-    };
-  }
-  /**
-   * remove the dialog when element destroy
-   */
-  disconnectedCallback() {
-    var _a;
-    /* istanbul ignore next */
-    (_a = this.removeDialogRef) === null || _a === void 0 ? void 0 : _a.remove();
-  }
-}
-__decorate$2([
-  MapToComponentField({ componentFieldName: 'vegaImageUploaderValueController' })
-], VegaImageUploaderRemoveController.prototype, "valueController", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaImageUploaderRemoveController.prototype, "removeEventEmitter", void 0);
-__decorate$2([
-  MapToComponentMethod('disconnectedCallback')
-], VegaImageUploaderRemoveController.prototype, "disconnectedCallback", null);
-
-var __decorate$1 = (undefined && undefined.__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;
-};
-/** The `VegaImageUploaderActionsVisibilityController` class is responsible for handling the focus and hiding of backdrop and tooltip elements in a Vega Image Uploader component. */
-class VegaImageUploaderActionsVisibilityController extends VegaSlimmer {
-  /*
-   * The below method is e2e-test covered in
-   * @see{module:should-hide-backdrop-and-tooltip-when-change-value}
-   */
-  /* istanbul ignore next */
-  /** trigger a vegaChange event when component value change */
-  handleValueChange() {
-    if (this.value) {
-      this.hideBackDropAndActions();
-    }
-  }
-  /*
-   * The below method is e2e-test covered in
-   * @see{module:should-hide-backdrop-and-tooltip-when-change-value}
-   */
-  /* istanbul ignore next */
-  /**
-   * The function hides the backdrop and actions of a vega-image-uploader component by blurring the active element.
-   * The activeElement should be div.image-preview-container and replace button
-   */
-  hideBackDropAndActions() {
-    const activeElement = getDeepActiveElementInShadow();
-    if (activeElement && findParent(activeElement, 'vega-image-uploader') === this.host) {
-      activeElement.blur();
-    }
-  }
-}
-__decorate$1([
-  MapToComponentField()
-], VegaImageUploaderActionsVisibilityController.prototype, "host", void 0);
-__decorate$1([
-  MapToComponentField()
-], VegaImageUploaderActionsVisibilityController.prototype, "value", void 0);
-__decorate$1([
-  MapToComponentMethod('watchValue')
-], VegaImageUploaderActionsVisibilityController.prototype, "handleValueChange", null);
-
-const VegaImageUploaderRuntimeMetricsPayloadDefinition = [
-  {
-    payloadKey: 'AUTO_VALIDATION_IS_TRUE',
-    payloadDescription: 'Determines whether automatic validation should be implemented for image uploads',
-    /**
-     * The function checks if the `autoValidation` property of the `host` element is equal to 'true'.
-     * If it is, the function will return `true`.
-     *
-     * @param {HTMLElement} host - The element to check
-     * @returns {boolean} A boolean value
-     */
-    payloadValue: (host) => host.autoValidation === true,
-  },
-  {
-    payloadKey: 'AUTO_VALIDATION_IS_FALSE',
-    payloadDescription: 'Determines whether automatic validation should be implemented for image uploads',
-    /**
-     * The function checks if the `autoValidation` property of the `host` element is equal to 'false'.
-     * If it is, the function will return `true`.
-     *
-     * @param {HTMLElement} host - The element to check
-     * @returns {boolean} A boolean value
-     */
-    payloadValue: (host) => host.autoValidation === false,
-  },
-];
-
-const vegaImageUploaderCss = ":host{display:inline-block;vertical-align:middle}:host .vega-image-uploader-select{box-sizing:border-box;background-color:rgba(var(--v-bg-tertiary, 240, 243, 247, 1));border-radius:8px;border-color:rgba(var(--v-border-color-input-field, 171, 198, 216, 1));display:flex;flex-direction:row;align-items:center;border-width:1px;border-style:dashed;min-width:120px;min-height:120px}:host .vega-image-uploader-select .action-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:8px;width:100%;height:100%;padding:12px;box-sizing:border-box;cursor:pointer;flex-grow:1;outline:none}:host(.disabled) .vega-image-uploader-select.disabled-border{border-color:rgba(var(--v-border-color-input-field-disabled, 222, 225, 227, 1))}:host(:not(.disabled)) .vega-image-uploader-select:hover{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1));border-color:rgba(var(--v-border-color-input-field-hover, 115, 160, 190, 1));background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1))}:host(:not(.disabled)) .vega-image-uploader-select:hover .vega-image-uploader-text{color:rgba(var(--v-text-link-hover, 4, 112, 236, 1))}:host(:not(.disabled)) .vega-image-uploader-select .action-wrapper:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:3px;border:1px solid rgba(var(--v-border-color-input-field-focus, 19, 98, 226, 1));border-style:none}:host(:not(.disabled)) .vega-image-uploader-select .actions-backdrop:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:3px;border:1px solid rgba(var(--v-border-color-input-field-focus, 19, 98, 226, 1));border-style:none}:host(:not(.disabled)) .vega-image-uploader-select .error .action-wrapper:focus-visible{outline:2px solid rgba(var(--v-border-color-danger, 230, 50, 87, 1));outline-offset:3px;border:1px solid rgba(var(--v-border-color-input-field-danger-focus, 233, 71, 104, 1))}:host(.disabled) .vega-image-uploader-select .action-wrapper{cursor:not-allowed}:host(.disabled) .vega-image-uploader-select .action-wrapper vega-icon{color:rgba(var(--v-text-disabled, 176, 180, 181, 1))}:host(.disabled) .vega-image-uploader-select .action-wrapper .vega-image-uploader-text{color:rgba(var(--v-text-disabled, 176, 180, 181, 1))}:host .vega-image-uploader-select .vega-image-uploader-text{padding-top:20px;color:rgba(var(--v-text-link, 19, 98, 226, 1));font-family:\"Inter\", sans-serif;font-size:16px;font-weight:700;line-height:24px;letter-spacing:0px;text-align:center}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-image-uploader-select .vega-image-uploader-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-image-uploader-select .vega-image-uploader-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-image-uploader-select .vega-image-uploader-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px;letter-spacing:0px}}:host .vega-image-uploader-select .action-wrapper vega-icon{color:rgba(var(--v-text-link, 19, 98, 226, 1))}:host .image-preview-container{display:flex;align-items:center;justify-content:center;position:relative;height:100%;width:100%;border-radius:8px;outline:none}:host .image-preview-container img{width:100%;height:100%;border-radius:8px;object-fit:contain}:host .image-preview-container.actions-backdrop::before{width:100%;height:100%;border-radius:8px;position:absolute;top:0px;right:0px;bottom:0px;left:0px;opacity:0;transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;background-color:rgba(0, 0, 0, 0.6);content:\" \"}:host .vega-image-uploader-select .actions{position:absolute;top:0px;right:0px;bottom:0px;left:0px;opacity:0;transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;display:flex;align-items:center;justify-content:center;gap:2px;pointer-events:none}:host .image-preview-container.actions-backdrop:hover::before{opacity:1;pointer-events:auto}:host .image-preview-container:hover .actions{opacity:1;pointer-events:auto}:host .vega-image-uploader-select .actions-backdrop:focus-visible::before{opacity:1;pointer-events:auto}:host .vega-image-uploader-select .actions-backdrop:focus-visible .actions{opacity:1;pointer-events:auto}:host .vega-image-uploader-select .actions-backdrop:focus-within::before{opacity:1;pointer-events:auto}:host .vega-image-uploader-select .actions-backdrop:focus-within .actions{opacity:1;pointer-events:auto}:host .vega-image-uploader-select .action-loading{position:relative;display:inline-block;width:24px;height:24px}:host .vega-image-uploader-select .action-loading::before{content:\" \";display:block;border-radius:9999px;position:absolute;top:0px;right:0px;bottom:0px;left:0px;border:4px solid rgb(229, 239, 255)}:host .vega-image-uploader-select .action-loading::after{display:block;border-radius:9999px;position:absolute;top:0px;right:0px;bottom:0px;left:0px;content:\" \";border-style:solid;border-width:4px;border-color:rgb(153, 192, 255) transparent transparent transparent;animation:loading 1.2s linear infinite}@keyframes loading{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host .vega-image-uploader-select .action-wrapper .cancel-action{color:rgba(var(--v-text-secondary, 107, 116, 125, 1))}:host vega-input{display:none}:host input[type=file]{display:none}:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px;color:rgba(var(--v-text-error, 189, 41, 71, 1));display:block;padding-top:12px;padding-right:8px;padding-left:8px}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}:host .vega-image-uploader-select.error{border-color:rgba(var(--v-border-color-input-field-danger, 230, 50, 87, 1))}:host .vega-image-uploader-select.error:hover{border-color:rgba(var(--v-border-color-input-field-danger-hover, 255, 87, 114, 1))}:host .vega-image-uploader-select.error .action-wrapper:focus-within{outline:2px solid rgba(var(--v-border-color-danger, 230, 50, 87, 1));outline-offset:3px;border:1px solid rgba(var(--v-border-color-input-field-danger-focus, 233, 71, 104, 1));border-style:none}:host .vega-image-uploader-select.error .actions-backdrop:focus-visible{outline:2px solid rgba(var(--v-border-color-danger, 230, 50, 87, 1));outline-offset:3px;border:1px solid rgba(var(--v-border-color-input-field-danger-focus, 233, 71, 104, 1));border-style:none}:host .vega-hidden{display:none}:host vega-field-label{margin-bottom:8px}:host .sub-title{padding-top:4px;color:rgba(var(--v-text-primary, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px;text-align:center}@media screen and (min-width: 768px) and (max-width: 1023px){:host .sub-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .sub-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .sub-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}:host .vega-hint{padding-left:8px;padding-right:8px;padding-top:12px;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px;color:rgba(var(--v-text-secondary, 107, 116, 125, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-hint{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-hint{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-hint{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}";
-
-var __decorate = (undefined && undefined.__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;
-};
-const IMAGE_FILE_TYPES = ['jpg', 'png', 'jpeg'];
-const VegaImageUploader = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.vegaChange = createEvent(this, "vegaChange", 7);
-    this.change = createEvent(this, "change", 7);
-    this.vegaRemove = createEvent(this, "vegaRemove", 7);
-    this.remove = createEvent(this, "remove", 7);
-    this.vegaCancel = createEvent(this, "vegaCancel", 7);
-    this.cancel = createEvent(this, "cancel", 7);
-    this.globalSlimmers = {};
-    this.translationSlimmer = new TranslationSlimmer();
-    this.vegaImageUploaderRenderer = new VegaImageUploaderRenderer();
-    this.vegaImageUploaderUploadingContentRenderer = new VegaImageUploaderUploadingContentRenderer();
-    this.vegaImageUploaderPreviewContentRenderer = new VegaImageUploaderPreviewContentRenderer();
-    this.vegaImageUploaderDefaultContentRenderer = new VegaImageUploaderDefaultContentRenderer();
-    this.vegaImageUploaderInputRenderer = new VegaImageUploaderInputRenderer();
-    this.vegaImageUploaderActionsRenderer = new VegaImageUploaderActionsRenderer();
-    this.vegaImageUploaderInputController = new VegaImageUploaderInputController();
-    this.vegaImageUploaderValueController = new VegaImageUploaderValueController();
-    this.vegaImageUploaderPreviewController = new VegaImageUploaderPreviewController();
-    this.vegaImageUploaderRemoveController = new VegaImageUploaderRemoveController();
-    this.actionsVisibilityController = new VegaImageUploaderActionsVisibilityController();
-    this.darkModeStateControllerSlimmer = new DarkModeStateControllerSlimmer();
-    this.formFieldController = new FormFieldControllerSlimmer({
-      propertyRules: [
-        {
-          propertyName: 'required',
-          ruleFactory: (isRequired) => (isRequired ? new RequiredFieldRule() : null),
-        },
-      ],
-      validationRulesName: 'validationRules',
-      defaultValue: null,
-      attributeGetter: (propertyName) => this[propertyName],
-      inputContainerGetter: () => this.vegaImageUploaderRenderer.getImageUploaderContainer(),
-      touchableAreaGetter: () => [this.vegaImageUploaderInputRenderer.getFileInputRef()],
-    });
-    this.changeEventEmitter = createEventEmitSlimmer(VegaImageUploader, VegaChange);
-    this.removeEventEmitter = createEventEmitSlimmer(VegaImageUploader, VegaRemove);
-    this.cancelEventEmitter = createEventEmitSlimmer(VegaImageUploader, VegaCancel);
-    this.buttonCircleEventPrevent = new ChildNodesEventPreventSlimmer([VegaClick], () => this.vegaImageUploaderRenderer.getImageUploaderContainer());
-    this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer(VegaImageUploaderRuntimeMetricsPayloadDefinition);
-    this.isInDarkMode = VegaInternalThemeManager.isDarkMode();
-    /**
-     * Determines the visual content that is initially displayed in
-     *    the image uploader component, thereby providing a preview of
-     *    the uploaded image or a default placeholder.
-     *
-     * @vegaVersion 1.14.0
-     */
-    /* eslint-disable-next-line @stencil/strict-mutable */
-    this.value = null;
-    /**
-     * Specifies the allowed file types for upload.
-     *
-     * @vegaVersion 1.14.0
-     * @defaultValue .jpg,.png,.jpeg
-     */
-    this.accept = IMAGE_FILE_TYPES.map((type) => `.${type}`).join(',');
-    /**
-     * Determines whether to show the preview button.
-     *
-     * @vegaVersion 1.14.0
-     */
-    this.showPreviewButton = true;
-    /**
-     * Determines whether to show the remove button.
-     *
-     * @vegaVersion 1.14.0
-     */
-    this.showRemoveButton = true;
-    /**
-     * Determines whether to show the replace button.
-     *
-     * @vegaVersion 1.39.2
-     */
-    this.showReplaceButton = true;
-    /**
-     * Specifies whether the Image Uploader field is disabled.
-     *
-     * @vegaVersion 1.14.0
-     */
-    this.disabled = false;
-    /**
-     * Specifies whether uploading an image is mandatory.
-     *
-     * @vegaVersion 1.14.0
-     */
-    this.required = false;
-    /**
-     * Specifies the validation status.
-     *
-     * @vegaVersion 1.14.0
-     */
-    /* eslint-disable-next-line @stencil/strict-mutable */
-    this.isValid = null;
-    /**
-     * Determines whether automatic validation should be
-     *    implemented for image uploads.
-     *
-     * @vegaVersion 1.14.0
-     */
-    this.autoValidation = true;
-    /**
-     * Specifies custom validation rules for image uploads.
-     *
-     * @vegaVersion 1.14.0
-     */
-    this.validationRules = [];
-    /**
-     * Specifies the label or title for the image uploader.
-     *    It provides descriptive text that helps identify
-     *    the purpose of the image uploader.
-     *
-     * @vegaVersion 2.5.0
-     */
-    this.label = '';
-    /**
-     * Specifies the action title for the image uploader.
-     *    This property provides descriptive text that identifies
-     *    the intended action or function of the image uploader.
-     *
-     * @vegaVersion 2.9.0
-     */
-    this.actionTitle = 'Upload';
-    /**
-     * Defines the width of the image uploader field.
-     *
-     * @vegaVersion 2.9.0
-     */
-    this.width = 120;
-    /**
-     * Defines the height of the image uploader field.
-     *
-     * @vegaVersion 2.9.0
-     */
-    this.height = 120;
-  }
-  watchValue() {
-    methodPlaceholder();
-  }
-  watchValidationRules() {
-    methodPlaceholder();
-  }
-  disconnectedCallback() {
-    methodPlaceholder();
-  }
-  /**
-   * Invoke this method to retrieve the image preview URL for
-   *    the current selection in the `vega-image-uploader` component.
-   *
-   * @vegaVersion 1.45.0
-   */
-  async getContentURL(file) {
-    return methodPlaceholder(file);
-  }
-  render() {
-    return sanitizeVegaComponent(this.vegaImageUploaderRenderer.render(), this.host);
-  }
-  get host() { return getElement(this); }
-  static get watchers() { return {
-    "value": ["watchValue"],
-    "validationRules": ["watchValidationRules"]
-  }; }
-};
-__decorate([
-  InjectVegaGlobalSlimmer()
-], VegaImageUploader.prototype, "globalSlimmers", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "translationSlimmer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderUploadingContentRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderPreviewContentRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderDefaultContentRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderInputRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderActionsRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderInputController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderValueController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderPreviewController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaImageUploaderRemoveController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "actionsVisibilityController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "darkModeStateControllerSlimmer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "formFieldController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "changeEventEmitter", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "removeEventEmitter", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "cancelEventEmitter", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "buttonCircleEventPrevent", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaImageUploader.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-VegaImageUploader.style = vegaImageUploaderCss;
-
-export { VegaImageUploader as vega_image_uploader };