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

package/dist/vega/vega-rich-text-table-properties.entry.js

@@ -1,641 +0,0 @@
-import { h, F as Fragment, r as registerInstance, e as createEvent, g as Host, i as getElement } from './index-01a2f9c9.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 './index-9fdb7060.js';
-import { s as sanitizeVegaComponent } from './component-0cff85cf.js';
-import { V as VegaComponentUsageRuntimeMetricsSlimmer } from './component-usage-runtime-metrics-0513698f.js';
-import { a as VegaInternalIconManager } from './internal-icon-manager-9279071a.js';
-import { a as AlignCenter, c as AlignJustify, A as AlignLeft, b as AlignRight } from './align-justify-a14601e9.js';
-import { C as ChildNodesEventPreventSlimmer } from './child-nodes-event-prevent-slimmer-fcfc9c8b.js';
-import { h as VegaChange, F as VegaFocus, a as VegaClick, b as VegaPopoverShow } from './vega-event-id-61c8bd9f.js';
-import { D as DomNodeSubjectObserverFactory } from './dom-node-subject-observer-factory-3b49c6b3.js';
-import { c as createEnterKeyHandlerToTriggerClick } from './accessibility-e5fd0fab.js';
-import { a as RTE_TABLE_BORDER_STYLES } from './styles.constants-b320e4a7.js';
-import { T as TranslationSlimmer } from './translation-slimmer-3c4e2876.js';
-import './create-public-api-runtime-metrics-slimmer-8565f08b.js';
-import './internal-vega-event-manager-826279b7.js';
-import './vega-env-manager-8f8dc473.js';
-import './feature-flag-controller-24b9f956.js';
-import './index-1f9eab8f.js';
-import './_commonjsHelpers-2088bffa.js';
-import './change-manager-b115783e.js';
-import './observer-3959f9dd.js';
-import './dom-node-subject-factory-5798693b.js';
-import './ui-5f775fd9.js';
-import './index-81ce67e2.js';
-import './static-subject-title-6fdf8c8b.js';
-
-const AlignTop = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M24 0H488c13.3 0 24 10.7 24 24s-10.7 24-24 24H24C10.7 48 0 37.3 0 24S10.7 0 24 0zM64 176c0-26.5 21.5-48 48-48h64c26.5 0 48 21.5 48 48V464c0 26.5-21.5 48-48 48H112c-26.5 0-48-21.5-48-48V176zm224 0c0-26.5 21.5-48 48-48h64c26.5 0 48 21.5 48 48V336c0 26.5-21.5 48-48 48H336c-26.5 0-48-21.5-48-48V176z"/></svg>`,
-};
-
-const AlignBottom = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M24 512l464 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L24 464c-13.3 0-24 10.7-24 24s10.7 24 24 24zM64 336c0 26.5 21.5 48 48 48h64c26.5 0 48-21.5 48-48l0-288c0-26.5-21.5-48-48-48H112C85.5 0 64 21.5 64 48l0 288zm224 0c0 26.5 21.5 48 48 48l64 0c26.5 0 48-21.5 48-48l0-160c0-26.5-21.5-48-48-48H336c-26.5 0-48 21.5-48 48l0 160z"/></svg>`,
-};
-
-const AlignMiddle = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M64 80c0-26.5 21.5-48 48-48h64c26.5 0 48 21.5 48 48V232h64V144c0-26.5 21.5-48 48-48h64c26.5 0 48 21.5 48 48v88h40c13.3 0 24 10.7 24 24s-10.7 24-24 24H448v88c0 26.5-21.5 48-48 48H336c-26.5 0-48-21.5-48-48V280H224V432c0 26.5-21.5 48-48 48H112c-26.5 0-48-21.5-48-48V280H24c-13.3 0-24-10.7-24-24s10.7-24 24-24H64V80z"/></svg>`,
-};
-
-const ObjectsAlignCenterHorizontal = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill='currentColor' d="M400 176L48 176l0-64 352 0 0 64zm48-64c0-26.5-21.5-48-48-48L248 64l0-40c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 40L48 64C21.5 64 0 85.5 0 112l0 64c0 26.5 21.5 48 48 48l152 0 0 64-88 0c-26.5 0-48 21.5-48 48l0 64c0 26.5 21.5 48 48 48l88 0 0 40c0 13.3 10.7 24 24 24s24-10.7 24-24l0-40 88 0c26.5 0 48-21.5 48-48l0-64c0-26.5-21.5-48-48-48l-88 0 0-64 152 0c26.5 0 48-21.5 48-48l0-64zM336 400l-224 0 0-64 224 0 0 64z"/></svg>`,
-};
-
-const ObjectsAlignLeft = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill='currentColor' d="M0 24C0 10.7 10.7 0 24 0S48 10.7 48 24l0 464c0 13.3-10.7 24-24 24s-24-10.7-24-24L0 24zM176 176l288 0 0-64-288 0 0 64zm-48-64c0-26.5 21.5-48 48-48l288 0c26.5 0 48 21.5 48 48l0 64c0 26.5-21.5 48-48 48l-288 0c-26.5 0-48-21.5-48-48l0-64zm48 288l160 0 0-64-160 0 0 64zm-48-64c0-26.5 21.5-48 48-48l160 0c26.5 0 48 21.5 48 48l0 64c0 26.5-21.5 48-48 48l-160 0c-26.5 0-48-21.5-48-48l0-64z"/></svg>`,
-};
-
-const ObjectsAlignRight = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill='currentColor' d="M512 24c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 464c0 13.3 10.7 24 24 24s24-10.7 24-24l0-464zM336 176L48 176l0-64 288 0 0 64zm48-64c0-26.5-21.5-48-48-48L48 64C21.5 64 0 85.5 0 112l0 64c0 26.5 21.5 48 48 48l288 0c26.5 0 48-21.5 48-48l0-64zM336 400l-160 0 0-64 160 0 0 64zm48-64c0-26.5-21.5-48-48-48l-160 0c-26.5 0-48 21.5-48 48l0 64c0 26.5 21.5 48 48 48l160 0c26.5 0 48-21.5 48-48l0-64z"/></svg>`,
-};
-
-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;
-};
-class VegaRichTextTablePropertiesRenderer extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    this.formTouched = false;
-    /**
-     * Mark the form as touched.
-     */
-    this.markFormTouched = () => {
-      this.formTouched = true;
-    };
-    /**
-     * Reset the touch state.
-     */
-    this.resetTouchedState = () => {
-      this.formTouched = false;
-    };
-  }
-  watchDefaultValueChange(newValue) {
-    this.resetTouchedState();
-    this.setFormFieldValues(newValue);
-  }
-  getFormRef() {
-    return this.formRef;
-  }
-  /**
-   * Indicates whether the form has been interacted with.
-   *
-   * @returns {boolean} True if the form has been touched; otherwise, false.
-   */
-  isFormTouched() {
-    return this.formTouched;
-  }
-  render() {
-    return (h("vega-form", { class: "table-properties-form", ref: (el) => (this.formRef = el), onMouseDown: this.markFormTouched }, this.type === 'TABLE'
-      ? this.tableFormRenderer.renderPropertiesFields()
-      : this.cellFormRenderer.renderPropertiesFields()));
-  }
-  /**
-   * Set form field values if the form is not touched.
-   *
-   * @param formValues
-   */
-  setFormFieldValues(formValues) {
-    if (this.formRef) {
-      void this.formRef.reset(formValues);
-    }
-  }
-}
-(() => {
-  VegaInternalIconManager.register({
-    'align-center': AlignCenter,
-    'align-justify': AlignJustify,
-    'align-left': AlignLeft,
-    'align-right': AlignRight,
-    'align-top': AlignTop,
-    'align-bottom': AlignBottom,
-    'align-middle': AlignMiddle,
-    'objects-align-left': ObjectsAlignLeft,
-    'objects-align-center': ObjectsAlignCenterHorizontal,
-    'objects-align-right': ObjectsAlignRight,
-  });
-})();
-__decorate$4([
-  MapToComponentField()
-], VegaRichTextTablePropertiesRenderer.prototype, "type", void 0);
-__decorate$4([
-  MapToComponentField()
-], VegaRichTextTablePropertiesRenderer.prototype, "tableFormRenderer", void 0);
-__decorate$4([
-  MapToComponentField()
-], VegaRichTextTablePropertiesRenderer.prototype, "cellFormRenderer", void 0);
-__decorate$4([
-  MapToComponentMethod('watchDefaultValueChange')
-], VegaRichTextTablePropertiesRenderer.prototype, "watchDefaultValueChange", null);
-
-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;
-};
-/**
- * Handles the color related properties for the table properties component.`
- */
-class TableColorController extends VegaSlimmer {
-  /**
-   * Returns an array of light color values from the color schema.
-   *
-   * @returns {string[]} An array of light color strings.
-   */
-  getLightColors() {
-    let result = [];
-    if (this.colors) {
-      result = this.colors.map((colorSchema) => colorSchema.light);
-    }
-    return result;
-  }
-}
-__decorate$3([
-  MapToComponentField()
-], TableColorController.prototype, "colors", 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;
-};
-class VegaRichTextTablePropertiesBaseFormFieldRenderer extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    this.dimensionFieldValidationRule = [
-      {
-        canEvaluate: (input) => {
-          return !!input;
-        },
-        shouldShowError: () => {
-          return true;
-        },
-        evaluate: (input) => {
-          const dimensionRegex = /^[0-9]*\.?[0-9]+(px|em|rem|%)?$/;
-          return {
-            isValid: dimensionRegex.test(input),
-            message: '',
-          };
-        },
-      },
-    ];
-    /**
-     * Emit a change event on each form field value change.
-     *
-     * @param {HTMLElement} el - The form field element.
-     */
-    this.handleFormChange = (el) => {
-      DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, VegaChange, async (input) => {
-        if (this.formRef) {
-          const validateResult = await this.formRef.valid();
-          if (validateResult.isValid) {
-            if (this.renderer.isFormTouched()) {
-              const formData = (await this.formRef.getValue());
-              const fieldName = el.dataset.vegaForm;
-              this.emitFormDataChange(fieldName, formData);
-            }
-          }
-          this.updateBorderDisplayColor(input.host);
-        }
-      });
-      if (el && el.tagName === 'VEGA-INPUT') {
-        DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, VegaFocus, this.markFormTouched);
-      }
-    };
-    /**
-     * Emit a change event on each form field value change.
-     *
-     * @param {string} fieldName - The name of the changed field.
-     * @param {RTETablePropertiesType} formData - The current form data.
-     */
-    this.emitFormDataChange = (_fieldName, formData) => {
-      this.vegaChange.emit(formData);
-    };
-    /**
-     * Handle text alignment button click event.
-     *
-     * @param {MouseEvent} e - The click event.
-     */
-    this.handleAlignmentButtonClick = async (e) => {
-      const button = e.currentTarget;
-      const formFieldName = button.dataset.formFieldName;
-      if (this.formRef) {
-        await this.formRef.setValue({ [formFieldName]: button.dataset.id }, { skipInvisible: false });
-      }
-    };
-    /**
-     * Clear border color value and hide the color picker popover.
-     *
-     * @param {HTMLElement} btn - The clear button element.
-     */
-    this.clearBorderColor = (btn) => {
-      DomNodeSubjectObserverFactory.addUniqueObserverToNode(btn, VegaClick, () => {
-        if (this.borderColorPickerRef) {
-          this.borderColorPickerRef.value = '';
-          if (this.formRef) {
-            void this.formRef.setValue({ borderColor: '' });
-          }
-        }
-        if (this.colorPickerPopoverRef) {
-          void this.colorPickerPopoverRef.hide();
-        }
-      });
-    };
-    /**
-     * Apply border color value and hide the color picker popover.
-     *
-     * @param {HTMLElement} btn - The apply button element.
-     */
-    this.applyBorderColor = (btn) => {
-      DomNodeSubjectObserverFactory.addUniqueObserverToNode(btn, VegaClick, () => {
-        if (this.borderColorPickerRef && this.formRef) {
-          void this.formRef.setValue({ borderColor: this.borderColorPickerRef.value });
-        }
-        if (this.colorPickerPopoverRef) {
-          void this.colorPickerPopoverRef.hide();
-        }
-      });
-    };
-    /**
-     * Clear background color value.
-     *
-     * @param {MouseEvent} event - The mouse event.
-     */
-    this.clearBackgroundColor = (event) => {
-      event.stopPropagation();
-      if (this.formRef) {
-        void this.formRef.setValue({ backgroundColor: '' });
-      }
-    };
-    /**
-     * Mark the form as touched.
-     */
-    this.markFormTouched = () => {
-      this.renderer.markFormTouched();
-    };
-  }
-  get formRef() {
-    return this.renderer.getFormRef();
-  }
-  /**
-   * Render style border fields.
-   *
-   * @returns { HTMLElement } The border fields element.
-   */
-  renderBorderFields() {
-    return (h("vega-flex", { gap: "size-16", direction: "row", alignItems: "center" },
-      h("vega-input-select", { "data-vega-form": "borderStyle", label: "Border Style", placeholder: "Select style", vegaDropdownProps: { searchable: false, matchTargetWidth: false }, source: VegaRichTextTablePropertiesBaseFormFieldRenderer.TABLE_BORDER_STYLES, ref: this.handleFormChange }),
-      h("vega-input", { ref: this.handleFormChange, "data-vega-form": "borderWidth", label: "Width", validationRules: this.dimensionFieldValidationRule }),
-      this.renderBorderColorPicker()));
-  }
-  /**
-   * Render background color picker.
-   *
-   * @returns {HTMLElement} The background color picker element.
-   */
-  renderBackgroundColorPicker() {
-    return (h("div", { class: "background-color-group" },
-      h("vega-font", { class: "field-label", variant: "font-field-label", color: "text-primary" }, "Background Color"),
-      h("div", { class: "color-picker-container" },
-        h("span", { role: "button", tabIndex: 0, "aria-label": "Clear background color", onClick: this.clearBackgroundColor, onKeyDown: createEnterKeyHandlerToTriggerClick(), class: "color-none" }),
-        h("vega-divider", { direction: "vertical" }),
-        h("vega-color-picker", { isInline: true, ref: this.handleFormChange, "data-vega-form": "backgroundColor", colors: this.controller.getLightColors() }))));
-  }
-  /**
-   * Render style dimension fields.
-   *
-   * @returns { HTMLElement } The dimension fields element.
-   */
-  renderDimensionFields(withPadding = false) {
-    return (h("vega-flex", { gap: "size-16", direction: "row", alignItems: "end" },
-      h("vega-input", { ref: this.handleFormChange, "data-vega-form": "width", label: "Width", validationRules: this.dimensionFieldValidationRule }),
-      h("vega-input", { ref: this.handleFormChange, "data-vega-form": "height", label: "Height", validationRules: this.dimensionFieldValidationRule }),
-      withPadding && (h("vega-input", { ref: this.handleFormChange, "data-vega-form": "padding", label: "Padding", validationRules: this.dimensionFieldValidationRule }))));
-  }
-  renderAlignmentField(alignmentList, iconPrefix, formFieldName) {
-    return (h("vega-flex", { direction: "row", gap: "0", class: "text-alignment-button-group" },
-      h("vega-input", { ref: this.handleFormChange, "data-vega-form": formFieldName, type: "hidden" }),
-      alignmentList.map((key) => {
-        return (h("button", { "data-id": key, "data-form-field-name": formFieldName, class: `text-alignment-${key}`, onClick: this.handleAlignmentButtonClick },
-          h("vega-icon", { icon: VegaInternalIconManager.getIconKey(`${iconPrefix}${key}`) })));
-      })));
-  }
-  /**
-   * Render save and cancel action buttons.
-   *
-   * @returns {HTMLElement} The action buttons element.
-   */
-  renderActionButtons() {
-    return (h("div", { class: "action-buttons" },
-      h("vega-button-link", { ref: this.handleSave }, "Save"),
-      h("vega-button-link", { ref: this.handleCancel }, "Cancel")));
-  }
-  /**
-   * Render border color field color picker.
-   *
-   * @returns {HTMLElement} The border color picker element.
-   */
-  renderBorderColorPicker() {
-    return (h("div", { class: "color-picker-group" },
-      h("vega-font", { class: "field-label", variant: "font-field-label", color: "text-primary" }, "Color"),
-      h("vega-popover", { ref: (el) => {
-          this.colorPickerPopoverRef = el;
-          DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, VegaPopoverShow, async () => {
-            if (this.formRef && this.borderColorPickerRef) {
-              const formValue = await this.formRef.getValue();
-              this.borderColorPickerRef.value = formValue['borderColor'];
-            }
-          });
-        }, trigger: "click" },
-        h("div", { slot: "popover-content", class: "color-picker-container" },
-          h("vega-input", { ref: this.handleFormChange, "data-vega-form": "borderColor", type: "hidden" }),
-          h("span", { role: "button", tabIndex: 0, "aria-label": "Clear border color", onKeyDown: createEnterKeyHandlerToTriggerClick(), class: "display-color-placeholder color-none" })),
-        h("vega-box", { slot: "popover" },
-          h("vega-color-picker", { ref: (el) => {
-              this.borderColorPickerRef = el;
-            }, isInline: true, colors: this.controller.getLightColors() }),
-          h("vega-flex", { margin: { top: 'size-16' }, justifyContent: "end", gap: "size-16" },
-            h("vega-button-link", { ref: this.clearBorderColor }, "Clear"),
-            h("vega-button-link", { ref: this.applyBorderColor }, "Apply"))))));
-  }
-  /**
-   * Update the color display span background color when border color changes.
-   *
-   * @param {HTMLElement} colorPickerRef - The border color field element.
-   */
-  updateBorderDisplayColor(colorPickerRef) {
-    if (colorPickerRef && colorPickerRef.dataset.vegaForm === 'borderColor') {
-      const selectedColor = colorPickerRef.value;
-      const displayColorDiv = colorPickerRef.nextElementSibling;
-      displayColorDiv.style.backgroundColor = selectedColor;
-      if (selectedColor) {
-        displayColorDiv.classList.remove('color-none');
-      }
-      else {
-        displayColorDiv.classList.add('color-none');
-      }
-      if (this.borderColorPickerRef && selectedColor !== this.borderColorPickerRef.value) {
-        this.borderColorPickerRef.value = selectedColor;
-      }
-    }
-  }
-}
-VegaRichTextTablePropertiesBaseFormFieldRenderer.TABLE_BORDER_STYLES = RTE_TABLE_BORDER_STYLES.map((style) => ({
-  id: style,
-  displayName: style.charAt(0).toUpperCase() + style.slice(1),
-}));
-__decorate$2([
-  MapToComponentField()
-], VegaRichTextTablePropertiesBaseFormFieldRenderer.prototype, "controller", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaRichTextTablePropertiesBaseFormFieldRenderer.prototype, "defaultValue", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaRichTextTablePropertiesBaseFormFieldRenderer.prototype, "renderer", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaRichTextTablePropertiesBaseFormFieldRenderer.prototype, "styleMap", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaRichTextTablePropertiesBaseFormFieldRenderer.prototype, "vegaChange", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaRichTextTablePropertiesBaseFormFieldRenderer.prototype, "vegaCancel", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaRichTextTablePropertiesBaseFormFieldRenderer.prototype, "vegaSave", void 0);
-
-class VegaRichTextTablePropertiesFormFieldRenderer extends VegaRichTextTablePropertiesBaseFormFieldRenderer {
-  constructor() {
-    super(...arguments);
-    /**
-     * Emit save event on save button click.
-     *
-     * @param {HTMLVegaButtonLinkElement} btn - The save button element.
-     */
-    this.handleSave = (btn) => {
-      DomNodeSubjectObserverFactory.addUniqueObserverToNode(btn, VegaClick, () => {
-        this.vegaSave.emit();
-      });
-    };
-    /**
-     * Emit cancel event on cancel button click.
-     *
-     * @param {HTMLVegaButtonLinkElement} btn - The cancel button element.
-     */
-    this.handleCancel = (btn) => {
-      DomNodeSubjectObserverFactory.addUniqueObserverToNode(btn, VegaClick, () => {
-        this.vegaCancel.emit(this.defaultValue);
-      });
-    };
-  }
-  /**
-   * Render table properties fields.
-   *
-   * @returns {HTMLElement} The table properties fields element.
-   */
-  renderPropertiesFields() {
-    return (h(Fragment, null,
-      h("vega-font", { variant: "font-h6", color: "text-black" }, "Table properties"),
-      h("vega-divider", { direction: "horizontal" }),
-      this.renderBorderFields(),
-      h("vega-divider", { direction: "horizontal" }),
-      this.renderBackgroundColorPicker(),
-      h("vega-divider", { direction: "horizontal" }),
-      this.renderDimensionFields(),
-      h("vega-divider", { direction: "horizontal" }),
-      this.renderTextAlignmentField(),
-      h("vega-divider", { direction: "horizontal" }),
-      this.renderActionButtons()));
-  }
-  /**
-   * Render style text alignment field.
-   *
-   * @returns { HTMLElement } The text alignment field element.
-   */
-  renderTextAlignmentField() {
-    return (h("div", { class: "text-alignment-container" },
-      h("vega-font", { variant: "font-field-label", color: "text-primary" }, "Alignment"),
-      h("vega-flex", { direction: "row", gap: "size-16" }, this.renderAlignmentField(['left', 'center', 'right'], 'objects-align-', 'textAlign'))));
-  }
-}
-
-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;
-};
-class VegaRichTextCellPropertiesFormFieldRenderer extends VegaRichTextTablePropertiesBaseFormFieldRenderer {
-  constructor() {
-    super(...arguments);
-    this.changesNeedApply = {};
-    /**
-     * Emit a change event on each form field value change.
-     *
-     * @param {string} fieldName - The name of the changed field.
-     * @param {RTETablePropertiesType} formData - The current form data.
-     */
-    this.emitFormDataChange = (fieldName, formData) => {
-      this.vegaChange.emit(this.mergeFormDataWithStyleMap({
-        [fieldName]: formData[fieldName],
-      }));
-    };
-    /**
-     * Emit save event on save button click.
-     *
-     * @param {HTMLVegaButtonLinkElement} btn - The save button element.
-     */
-    this.handleSave = (btn) => {
-      DomNodeSubjectObserverFactory.addUniqueObserverToNode(btn, VegaClick, () => {
-        this.vegaSave.emit();
-      });
-    };
-    /**
-     * Emit cancel event on cancel button click.
-     *
-     * @param {HTMLVegaButtonLinkElement} btn - The cancel button element.
-     */
-    this.handleCancel = (btn) => {
-      DomNodeSubjectObserverFactory.addUniqueObserverToNode(btn, VegaClick, () => {
-        this.vegaCancel.emit(this.styleMap);
-      });
-    };
-  }
-  onDefaultValueChange() {
-    this.resetChangesNeedApply();
-  }
-  /**
-   * Render cell properties fields.
-   *
-   * @returns {HTMLElement} The cell properties fields element.
-   */
-  renderPropertiesFields() {
-    return (h(Fragment, null,
-      h("vega-font", { variant: "font-h6", color: "text-black" }, "Cell properties"),
-      h("vega-divider", { direction: "horizontal" }),
-      super.renderBorderFields(),
-      h("vega-divider", { direction: "horizontal" }),
-      super.renderBackgroundColorPicker(),
-      h("vega-divider", { direction: "horizontal" }),
-      this.renderDimensionFields(true),
-      h("vega-divider", { direction: "horizontal" }),
-      this.renderTextAlignmentField(),
-      h("vega-divider", { direction: "horizontal" }),
-      this.renderActionButtons()));
-  }
-  /**
-   * Render style text alignment field.
-   *
-   * @returns { HTMLElement } The text alignment field element.
-   */
-  renderTextAlignmentField() {
-    return (h("div", { class: "text-alignment-container" },
-      h("vega-font", { variant: "font-field-label", color: "text-primary" }, "Text Alignment"),
-      h("vega-flex", { direction: "row", gap: "size-16" },
-        this.renderAlignmentField(['left', 'center', 'right', 'justify'], 'align-', 'textAlign'),
-        this.renderAlignmentField(['top', 'middle', 'bottom'], 'align-', 'verticalAlign'))));
-  }
-  /**
-   * Merge form data with style map for all selected cell blocks.
-   *
-   * @param {RTETablePropertiesType} formData - The form data.
-   * @returns {Record<string, RTETablePropertiesType>} The merged data.
-   */
-  mergeFormDataWithStyleMap(formData) {
-    this.changesNeedApply = Object.assign(Object.assign({}, this.changesNeedApply), formData);
-    const mergedData = {};
-    for (const id in this.styleMap) {
-      mergedData[id] = Object.assign(Object.assign({}, this.styleMap[id]), this.changesNeedApply);
-    }
-    return mergedData;
-  }
-  /**
-   * Reset the changesNeedApply object.
-   *
-   */
-  resetChangesNeedApply() {
-    this.changesNeedApply = {};
-  }
-}
-__decorate$1([
-  MapToComponentMethod('watchDefaultValueChange')
-], VegaRichTextCellPropertiesFormFieldRenderer.prototype, "onDefaultValueChange", null);
-
-const vegaRichTextTablePropertiesCss = ":host{display:block;max-width:420px}:host .table-properties-form{display:flex;flex-direction:column;gap:16px}:host .color-picker-group{display:flex;gap:8px;flex-direction:column}:host .color-picker-group .color-picker-container{flex-shrink:0}:host .color-picker-group .display-color-placeholder{display:block;box-sizing:border-box;border-radius:4px;border:1px solid rgba(var(--v-border-input-field, 171, 198, 216, 1));width:24px;height:24px}:host .color-picker-group .display-color-placeholder.color-none{box-sizing:content-box}:host .text-alignment-container>vega-font{display:block;margin-bottom:8px}:host .text-alignment-button-group button{display:flex;justify-content:center;align-items:center;border:1px solid rgba(var(--v-border-input-field, 171, 198, 216, 1));padding-top:16px;padding-bottom:16px;padding-left:16px;padding-right:16px;position:relative;cursor:pointer;background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1))}:host .text-alignment-button-group button:not(:first-of-type){margin-left:-1px}:host .text-alignment-button-group button:first-of-type{border-top-left-radius:4px;border-bottom-left-radius:4px}:host .text-alignment-button-group button:last-of-type{border-top-right-radius:4px;border-bottom-right-radius:4px}:host .text-alignment-button-group button:hover{background-color:rgba(var(--v-bg-quaternary, 241, 248, 251, 1));border:1px solid rgba(var(--v-border-input-field-hover, 115, 160, 190, 1));z-index:1}:host .text-alignment-button-group button:active{border:1px solid rgba(var(--v-border-input-field-focus, 19, 98, 226, 1));background-color:rgba(var(--v-bg-quaternary, 241, 248, 251, 1));z-index:1}:host .text-alignment-button-group vega-input[value=left]~.text-alignment-left,:host .text-alignment-button-group vega-input[value=center]~.text-alignment-center,:host .text-alignment-button-group vega-input[value=right]~.text-alignment-right,:host .text-alignment-button-group vega-input[value=justify]~.text-alignment-justify,:host .text-alignment-button-group vega-input[value=top]~.text-alignment-top,:host .text-alignment-button-group vega-input[value=middle]~.text-alignment-middle,:host .text-alignment-button-group vega-input[value=bottom]~.text-alignment-bottom{border:1px solid rgba(var(--v-border-input-field-focus, 19, 98, 226, 1));background-color:rgba(var(--v-bg-quaternary, 241, 248, 251, 1));z-index:1}:host .action-buttons{text-align:right}:host .action-buttons vega-button-link{margin-left:24px}:host .background-color-group{display:flex;gap:8px;flex-direction:column}:host .color-picker-container{box-sizing:border-box;border:1px solid rgba(var(--v-border-input-field, 171, 198, 216, 1));border-radius:8px;padding-left:12px;padding-right:12px;display:flex;gap:8px;align-items:center;padding-top:11px;padding-bottom:11px}:host .color-picker-container:hover{border:1px solid rgba(var(--v-border-input-field-hover, 115, 160, 190, 1))}:host .color-picker-container:focus-within{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))}:host .color-picker-container vega-divider{height:24px !important}:host .color-picker-container .color-none{display:block;box-sizing:border-box;border-radius:4px;width:24px;height:24px;border:1px solid rgba(var(--v-border-input-field-danger, 230, 50, 87, 1));overflow:hidden;cursor:pointer;position:relative}:host .color-picker-container .color-none:hover{box-shadow:0 0 0 4px rgba(230, 50, 87, 0.25)}:host .color-picker-container .color-none:before{content:\"\";position:absolute;border:1px solid rgba(var(--v-border-input-field-danger, 230, 50, 87, 1));border-left-width:0px;border-right-width:0px;border-bottom-width:0px;top:0;left:-10px;width:32px;height:0;transform-origin:top right;transform:rotate(-45deg)}:host(.vega-hidden){display:none}";
-
-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 VegaRichTextTableProperties = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.vegaChange = createEvent(this, "vegaChange", 1);
-    this.vegaCancel = createEvent(this, "vegaCancel", 1);
-    this.vegaSave = createEvent(this, "vegaSave", 1);
-    this.globalSlimmers = {};
-    this.translationSlimmer = new TranslationSlimmer();
-    this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
-    this.renderer = new VegaRichTextTablePropertiesRenderer();
-    this.tableFormRenderer = new VegaRichTextTablePropertiesFormFieldRenderer();
-    this.cellFormRenderer = new VegaRichTextCellPropertiesFormFieldRenderer();
-    this.controller = new TableColorController();
-    this.changeEventPreventSlimmer = new ChildNodesEventPreventSlimmer([VegaChange], () => this.renderer.getFormRef());
-    /**
-     * @vegaVersion 2.74.0-RTE-table-preview
-     */
-    this.type = 'TABLE';
-    /**
-     * @vegaVersion 2.74.0-RTE-table-preview
-     */
-    this.colors = [];
-  }
-  watchDefaultValueChange(newValue) {
-    methodPlaceholder(newValue);
-  }
-  render() {
-    return sanitizeVegaComponent(h(Host, null, this.renderer.render()), this.host);
-  }
-  get host() { return getElement(this); }
-  static get watchers() { return {
-    "defaultValue": ["watchDefaultValueChange"]
-  }; }
-};
-__decorate([
-  InjectVegaGlobalSlimmer()
-], VegaRichTextTableProperties.prototype, "globalSlimmers", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaRichTextTableProperties.prototype, "translationSlimmer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaRichTextTableProperties.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaRichTextTableProperties.prototype, "renderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaRichTextTableProperties.prototype, "tableFormRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaRichTextTableProperties.prototype, "cellFormRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaRichTextTableProperties.prototype, "controller", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaRichTextTableProperties.prototype, "changeEventPreventSlimmer", void 0);
-VegaRichTextTableProperties.style = vegaRichTextTablePropertiesCss;
-
-export { VegaRichTextTableProperties as vega_rich_text_table_properties };