@heartlandone/vega 2.80.0 → 2.81.0

package/dist/cjs/{responsive-format-facade-4419b4ae.js → responsive-format-facade-9cae7f27.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const typeGuard = require('./type-guard-d760850a.js');
+const typeGuard = require('./type-guard-362d7da3.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const ui = require('./ui-32120990.js');
 const breakpoints = require('./breakpoints-1cc2c4c6.js');
@@ -103,10 +103,10 @@ class ResponsiveMarginFormatter extends ResponsiveClassStringFormatter {
    */
   formatToken(input, breakpoint) {
     const prefix = typeGuard.isBreakpointsForPrefixType(breakpoint) ? `${breakpoint}:` : '';
-    if (typeGuard.isSpacingTokenType(input)) {
+    if (typeGuard.isMarginValueType(input)) {
       return `${prefix}v-m-${input}`;
     }
-    else if (typeGuard.isDirectionalSpacingType(input)) {
+    else if (typeGuard.isDirectionalMarginType(input)) {
       return Object.keys(input)
         .map((direction) => {
         return `${prefix}v-${MARGIN_DIRECTION_CLASS_PARTIAL_MAP[direction]}-${input[direction]}`;

package/dist/cjs/{rich-text-editor-required-rule-7d4c2973.js → rich-text-editor-required-rule-4b919054.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const contentState = require('./content-state-afa26456.js');
+const contentState = require('./content-state-0f26036c.js');
 const internalFormFieldValidationRule_abstract = require('./internal-form-field-validation-rule.abstract-07cdff46.js');
 
 /**

package/dist/cjs/{split-cell-operation-19f98afb.js → split-cell-operation-3596f738.js}

@@ -1,14 +1,14 @@
 'use strict';
 
-const codeBlock = require('./code-block-71a330a1.js');
+const codeBlock = require('./code-block-24b3d0e7.js');
 const object = require('./object-b53e9416.js');
 const darkModeStyleController = require('./dark-mode-style-controller-3a04af3d.js');
 require('./global-slimmer-registry-b3bce7e0.js');
 const createPublicApiRuntimeMetricsSlimmer = require('./create-public-api-runtime-metrics-slimmer-9cb09fb2.js');
-const ui = require('./ui-9e8c9732.js');
-const typeGuard = require('./type-guard-d760850a.js');
+const ui = require('./ui-ae4ee13d.js');
+const typeGuard = require('./type-guard-362d7da3.js');
 const misc = require('./misc-3d30df91.js');
-const contentState = require('./content-state-afa26456.js');
+const contentState = require('./content-state-0f26036c.js');
 
 const ThemeManagerRuntimeMetricsPayloadDefinition = [
   {
@@ -357,6 +357,17 @@ class RTETableAnnotation extends codeBlock.BlockAnnotation {
   static from(value, useInternalStyle = true) {
     return [exports.RTETableExtensionAnnotationTypeEnum.TABLE, new RTETableAnnotation(value, useInternalStyle)];
   }
+  /**
+   * Get the default styles for the table annotation.
+   *
+   * @returns {AnnotationStyle} The default styles for the table annotation.
+   */
+  static getDefaultStyles() {
+    return {
+      borderCollapse: RTETableAnnotation.DEFAULT_BORDER_COLLAPSE,
+      margin: RTETableAnnotation.DEFAULT_ALIGNMENT_STYLE_VALUE,
+    };
+  }
   /**
    * Generates the CSS border string from the border properties.
    *
@@ -420,12 +431,17 @@ class RTETableAnnotation extends codeBlock.BlockAnnotation {
     if (!this.alignment)
       return {};
     return {
-      margin: this.alignment === 'center' ? '0 auto' : this.alignment === 'left' ? '0' : '0 0 0 auto',
+      margin: this.alignment === 'center'
+        ? RTETableAnnotation.DEFAULT_ALIGNMENT_STYLE_VALUE
+        : this.alignment === 'left'
+          ? '0'
+          : '0 0 0 auto',
     };
   }
 }
 RTETableAnnotation.DEFAULT_BORDER_COLLAPSE = 'collapse';
 RTETableAnnotation.DEFAULT_ALIGNMENT = 'center';
+RTETableAnnotation.DEFAULT_ALIGNMENT_STYLE_VALUE = '0 auto';
 
 /**
  * Class representing a table block in the rich text editor.
@@ -493,9 +509,9 @@ class RTETableBlock extends codeBlock.RTEBlock {
   /**
    * @inheritDoc
    */
-  toHtml() {
-    const childrenHtml = this.children.map((child) => child.toHtml()).join('');
-    const attrStr = super.generateAttributeString();
+  toHtml(options) {
+    const childrenHtml = this.children.map((child) => child.toHtml(options)).join('');
+    const attrStr = super.generateAttributeString(options);
     return `<table${attrStr}>${childrenHtml}</table>`;
   }
   /**
@@ -709,9 +725,9 @@ class RTETableBodyBlock extends codeBlock.RTEBlock {
   /**
    * @inheritDoc
    */
-  toHtml() {
-    const childrenHtml = this.children.map((child) => child.toHtml()).join('');
-    const attrStr = super.generateAttributeString();
+  toHtml(options) {
+    const childrenHtml = this.children.map((child) => child.toHtml(options)).join('');
+    const attrStr = super.generateAttributeString(options);
     return `<tbody${attrStr}>${childrenHtml}</tbody>`;
   }
   /**
@@ -765,13 +781,13 @@ class RTETableHeadBlock extends codeBlock.RTEBlock {
   /**
    * @inheritDoc
    */
-  toHtml() {
+  toHtml(options) {
     const childrenHtml = this.children
       .map((child) => {
-      return child.toHtml();
+      return child.toHtml(options);
     })
       .join('');
-    const attrStr = super.generateAttributeString();
+    const attrStr = super.generateAttributeString(options);
     return `<thead${attrStr}>${childrenHtml}</thead>`;
   }
   /**
@@ -825,13 +841,13 @@ class RTETableRowBlock extends codeBlock.RTEBlock {
   /**
    * @inheritDoc
    */
-  toHtml() {
+  toHtml(options) {
     const childrenHtml = this.children
       .map((child) => {
-      return child.toHtml();
+      return child.toHtml(options);
     })
       .join('');
-    const attrStr = super.generateAttributeString();
+    const attrStr = super.generateAttributeString(options);
     return `<tr${attrStr}>${childrenHtml}</tr>`;
   }
   /**
@@ -883,6 +899,24 @@ class RTETableCellAnnotation extends codeBlock.BlockAnnotation {
       new RTETableCellAnnotation(cellAnnotation, useInternalStyle),
     ];
   }
+  /**
+   * Get the default styles for the table annotation.
+   *
+   * @param {boolean} isHexColor - Whether to return color values as hex codes.
+   * @returns {AnnotationStyle} The default styles for the table annotation.
+   */
+  static getDefaultStyles(isHexColor = true) {
+    return {
+      padding: RTETableCellAnnotation.DEFAULT_PADDING,
+      textAlign: RTETableCellAnnotation.DEFAULT_HORIZONTAL_TEXT_ALIGN,
+      verticalAlign: RTETableCellAnnotation.DEFAULT_VERTICAL_TEXT_ALIGN,
+      minWidth: RTETableCellAnnotation.DEFAULT_CELL_MIN_WIDTH,
+      boxSizing: RTETableCellAnnotation.DEFAULT_BOX_SIZING,
+      border: `${RTETableCellAnnotation.DEFAULT_BORDER.style} ${RTETableCellAnnotation.DEFAULT_BORDER.width} ${isHexColor
+        ? RTETableCellAnnotation.DEFAULT_BORDER.color
+        : RTETableCellAnnotation.DEFAULT_BORDER_RGB_COLOR}`,
+    };
+  }
   /**
    * Generates the CSS border string from the border properties.
    *
@@ -1026,6 +1060,7 @@ RTETableCellAnnotation.DEFAULT_BORDER = {
   width: '1px',
   color: '#ddd',
 };
+RTETableCellAnnotation.DEFAULT_BORDER_RGB_COLOR = 'rgb(221, 221, 221)'; // Equivalent RGB for #ddd
 RTETableCellAnnotation.DEFAULT_HORIZONTAL_TEXT_ALIGN = 'left';
 RTETableCellAnnotation.DEFAULT_VERTICAL_TEXT_ALIGN = 'middle';
 RTETableCellAnnotation.DEFAULT_CELL_MIN_WIDTH = '55px';
@@ -1100,9 +1135,9 @@ class RTETableCellBlock extends codeBlock.RTEBlock {
   /**
    * @inheritDoc
    */
-  toHtml() {
-    const childrenHtml = this.children.map((child) => child.toHtml()).join('');
-    const attrStr = super.generateAttributeString();
+  toHtml(options) {
+    const childrenHtml = this.children.map((child) => child.toHtml(options)).join('');
+    const attrStr = super.generateAttributeString(options);
     return `<td${attrStr}>${childrenHtml}</td>`;
   }
   /**
@@ -1216,9 +1251,9 @@ class RTETableHeadCellBlock extends RTETableCellBlock {
   /**
    * @inheritDoc
    */
-  toHtml() {
-    const childrenHtml = this.children.map((child) => child.toHtml()).join('');
-    const attrStr = super.generateAttributeString();
+  toHtml(options) {
+    const childrenHtml = this.children.map((child) => child.toHtml(options)).join('');
+    const attrStr = super.generateAttributeString(options);
     return `<th${attrStr}>${childrenHtml}</th>`;
   }
   /**

package/dist/cjs/{string-format-strategy.abstract-c65d9861.js → string-format-strategy.abstract-ebdb2573.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const typeGuard = require('./type-guard-d760850a.js');
+const typeGuard = require('./type-guard-362d7da3.js');
 
 /**
  * String format strategy abstract class

package/dist/cjs/{string-input-formatter-slimmer-c2e04acc.js → string-input-formatter-slimmer-9b6a8399.js}

@@ -1,11 +1,11 @@
 'use strict';
 
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
-const typeGuard = require('./type-guard-d760850a.js');
+const typeGuard = require('./type-guard-362d7da3.js');
 const changeManager = require('./change-manager-a297e4d2.js');
-const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-a3a60da4.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-9110cb94.js');
 const vegaInternalEventId = require('./vega-internal-event-id-a1837fa2.js');
-const waitForComponentDidRender = require('./wait-for-component-did-render-b6aba2de.js');
+const waitForComponentDidRender = require('./wait-for-component-did-render-b6d12d51.js');
 
 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;

package/dist/cjs/{string-mask-strategy-418fc0b8.js → string-mask-strategy-6cc9f391.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const stringFormatStrategy_abstract = require('./string-format-strategy.abstract-c65d9861.js');
-const typeGuard = require('./type-guard-d760850a.js');
+const stringFormatStrategy_abstract = require('./string-format-strategy.abstract-ebdb2573.js');
+const typeGuard = require('./type-guard-362d7da3.js');
 
 /**
  * A class for formatting string with the given mask format

package/dist/cjs/{style-formatter-3c9ce0e5.js → style-formatter-18289c4d.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const typeGuard = require('./type-guard-d760850a.js');
-const responsiveFormatFacade = require('./responsive-format-facade-4419b4ae.js');
+const typeGuard = require('./type-guard-362d7da3.js');
+const responsiveFormatFacade = require('./responsive-format-facade-9cae7f27.js');
 
 /**
  * Fomatter flex styles.

package/dist/cjs/{sub-state-notify-slimmer-7a4c6061.js → sub-state-notify-slimmer-39bfcfe3.js}

@@ -5,7 +5,7 @@ const dynamicSlimmer = require('./dynamic-slimmer-f31fdfd7.js');
 const changeManager = require('./change-manager-a297e4d2.js');
 const observer = require('./observer-f49483e8.js');
 const vegaInternalEventId = require('./vega-internal-event-id-a1837fa2.js');
-const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-a3a60da4.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-9110cb94.js');
 
 /**
  * Sub state notify slimmer

package/dist/cjs/{sub-state-observer-slimmer-f728e068.js → sub-state-observer-slimmer-e5b50cbf.js}

@@ -3,8 +3,8 @@
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const observer = require('./observer-f49483e8.js');
 const changeManager = require('./change-manager-a297e4d2.js');
-const ui = require('./ui-9e8c9732.js');
-const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-a3a60da4.js');
+const ui = require('./ui-ae4ee13d.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-9110cb94.js');
 const vegaInternalEventId = require('./vega-internal-event-id-a1837fa2.js');
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {

package/dist/cjs/{time-required-rule-ad091302.js → time-required-rule-3517beff.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const typeGuard = require('./type-guard-d760850a.js');
+const typeGuard = require('./type-guard-362d7da3.js');
 const internalFormFieldValidationRule_abstract = require('./internal-form-field-validation-rule.abstract-07cdff46.js');
 
 /**

package/dist/cjs/{token-extension-90396de7.js → token-extension-addc97c1.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 const misc = require('./misc-3d30df91.js');
-const ui = require('./ui-9e8c9732.js');
+const ui = require('./ui-ae4ee13d.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const createPublicApiRuntimeMetricsSlimmer = require('./create-public-api-runtime-metrics-slimmer-9cb09fb2.js');
 const internalVegaZIndexManager = require('./internal-vega-z-index-manager-f03ddb37.js');
@@ -9,16 +9,16 @@ const dynamicSlimmer = require('./dynamic-slimmer-f31fdfd7.js');
 const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-273d62ef.js');
 const internalVegaEventManager = require('./internal-vega-event-manager-cc0f511c.js');
 const internalTranslationController = require('./internal-translation-controller-9f58a4e4.js');
-const contentState = require('./content-state-afa26456.js');
-const codeBlock = require('./code-block-71a330a1.js');
-const typeGuard = require('./type-guard-d760850a.js');
+const contentState = require('./content-state-0f26036c.js');
+const codeBlock = require('./code-block-24b3d0e7.js');
+const typeGuard = require('./type-guard-362d7da3.js');
 const dtoRendererManager = require('./dto-renderer-manager-ae5fcbba.js');
 const baseRenderer = require('./base-renderer-0a3b62b7.js');
 const internalIconManager = require('./internal-icon-manager-c989189a.js');
 const vegaNonceManager = require('./vega-nonce-manager-df69d3ed.js');
-const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-a3a60da4.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-9110cb94.js');
 const vegaEventId = require('./vega-event-id-c08ce3d3.js');
-const splitCellOperation = require('./split-cell-operation-19f98afb.js');
+const splitCellOperation = require('./split-cell-operation-3596f738.js');
 const remoteInvocationRegistry = require('./remote-invocation-registry-fc22fdd0.js');
 const vegaInternalEventId = require('./vega-internal-event-id-a1837fa2.js');
 const darkModeStyleController = require('./dark-mode-style-controller-3a04af3d.js');
@@ -1223,6 +1223,15 @@ class VegaRTEExtension {
   static registerActionHandlerInterceptor(nodeOrBlockClassName, actionType, strategy) {
     codeBlock.ActionHandlerInterceptorRegistry.register(actionType, nodeOrBlockClassName, strategy);
   }
+  /**
+   * Registers a filter styles strategy for a specific block or node class.
+   *
+   * @param {string} blockOrNodeClassName - The name of the block or node class.
+   * @param {RTEFilterStylesStrategy} strategy - The filter styles strategy to register.
+   */
+  static registerFilterStylesStrategy(blockOrNodeClassName, strategy) {
+    codeBlock.RTEFilterStylesStrategyRegistry.register(blockOrNodeClassName, strategy);
+  }
   /**
    * Initializes the RTE extension with the provided context.
    *
@@ -1955,13 +1964,19 @@ class VegaRTELanguageExtension extends VegaRTEExtension {
    * @returns {VegaRTEContent} - The content.
    */
   getRTELatestValue(host) {
+    var _a;
     let result = host.value;
     if (this.extensionContext && this.extensionContext.isSourceEditMode() && host.shadowRoot) {
       const codeBlock = host.shadowRoot.querySelector('.source-view-container vega-code-block');
       if (codeBlock) {
-        result = contentState.VegaRTEContent.fromHtml(codeBlock.value.code, {
-          autoMatchFormat: host.sourceEditConfig.autoMatchFormat,
-        });
+        let options = undefined;
+        if (host.sourceEditConfig) {
+          options = {
+            autoMatchFormat: (_a = host.sourceEditConfig.autoMatchFormat) !== null && _a !== void 0 ? _a : true,
+            filterInlineStyles: host.sourceEditConfig.filterInlineStyles,
+          };
+        }
+        result = contentState.VegaRTEContent.fromHtml(codeBlock.value.code, options);
       }
     }
     return result;
@@ -2798,6 +2813,21 @@ class RTETableCaptionAnnotation extends codeBlock.BlockAnnotation {
     super(...arguments);
     this.type = splitCellOperation.RTETableExtensionAnnotationTypeEnum.CAPTION;
   }
+  /**
+   * Get the default styles for the table caption annotation.
+   *
+   * @returns {AnnotationStyle} The default styles for the table caption annotation.
+   */
+  static getDefaultStyles() {
+    return {
+      padding: '8px',
+      border: '1px solid #ddd',
+      borderBottom: 'none',
+      position: 'relative',
+      textAlign: 'center',
+      minHeight: '22px',
+    };
+  }
   /**
    * @inheritDoc
    */
@@ -2818,30 +2848,14 @@ class RTETableCaptionAnnotation extends codeBlock.BlockAnnotation {
   renderStyle(options) {
     if (!(options === null || options === void 0 ? void 0 : options.standalone))
       return null;
-    return {
-      padding: '8px',
-      border: '1px solid #ddd',
-      borderBottom: 'none',
-      backgroundColor: this.getCaptionBackgroundColor(),
-      position: 'relative',
-      textAlign: 'center',
-      minHeight: '22px',
-    };
+    return Object.assign(Object.assign({}, RTETableCaptionAnnotation.getDefaultStyles()), { backgroundColor: this.getCaptionBackgroundColor() });
   }
   /**
    * @inheritDoc
    */
   toJSON() {
     return {
-      caption: {
-        padding: '8px 12px',
-        border: '1px solid #ddd',
-        borderBottom: 'none',
-        backgroundColor: this.getCaptionBackgroundColor(),
-        position: 'relative',
-        textAlign: 'center',
-        minHeight: '22px',
-      },
+      caption: true,
     };
   }
   /**
@@ -2856,6 +2870,17 @@ class RTETableCaptionAnnotation extends codeBlock.BlockAnnotation {
   }
 }
 
+var __rest$3 = (undefined && undefined.__rest) || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+    t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+        t[p[i]] = s[p[i]];
+    }
+  return t;
+};
 /**
  * Represents the optional caption block for a table.
  */
@@ -2873,7 +2898,11 @@ class RTETableCaptionBlock extends codeBlock.RTEBlock {
    */
   static from(block, options) {
     const captionBlock = new RTETableCaptionBlock(block.id, options);
-    super.convertAnnotationsToMap(captionBlock.annotationMap, Object.assign({}, block.annotations));
+    const _a = block.annotations || {}, { caption } = _a, restAnnotations = __rest$3(_a, ["caption"]);
+    if (caption) {
+      captionBlock.annotationMap.set(splitCellOperation.RTETableExtensionAnnotationTypeEnum.CAPTION, new RTETableCaptionAnnotation());
+    }
+    super.convertAnnotationsToMap(captionBlock.annotationMap, Object.assign({}, restAnnotations));
     captionBlock.children = super.generateBlockChildren(block.children, options, captionBlock);
     return captionBlock;
   }
@@ -2902,9 +2931,11 @@ class RTETableCaptionBlock extends codeBlock.RTEBlock {
   /**
    * @inheritDoc
    */
-  toHtml() {
-    const childrenHtml = this.children.map((child) => child.toHtml()).join('');
-    const attrStr = super.generateAttributeString();
+  toHtml(options) {
+    const childrenHtml = this.children
+      .map((child) => child.toHtml(options))
+      .join('');
+    const attrStr = super.generateAttributeString(options);
     return `<caption${attrStr}>${childrenHtml}</caption>`;
   }
   /**
@@ -6354,7 +6385,7 @@ class TdToTableCellBlockStrategy extends contentState.BlockToRTEBlockStrategyAbs
     return splitCellOperation.RTETableCellBlock.from({
       id: misc.generateUUID(),
       type: 'table-cell',
-      annotations: contentState.htmlElementToAnnotationGenerator.generate(splitCellOperation.RTETableHeadCellBlock, element, options),
+      annotations: contentState.htmlElementToAnnotationGenerator.generate(splitCellOperation.RTETableCellBlock, element, options),
       children: defaultChildren,
     }, options);
   }
@@ -6381,7 +6412,7 @@ class TdToTableCellBlockStrategy extends contentState.BlockToRTEBlockStrategyAbs
    * @returns {VegaRTETableHeadCellBlock['annotations']} The annotations for the table head element.
    */
   getTableHeadCellAnnotations(element, options) {
-    const result = contentState.htmlElementToAnnotationGenerator.generate(splitCellOperation.RTETableCellBlock, element, options);
+    const result = contentState.htmlElementToAnnotationGenerator.generate(splitCellOperation.RTETableHeadCellBlock, element, options);
     if (result && result.tableCell) {
       // If the background color matches the default, remove it from the annotation to avoid unnecessary styling
       const colorKey = splitCellOperation.RTETableColorManager.getColorKey(result.tableCell.backgroundColor, true);
@@ -6418,10 +6449,11 @@ class CaptionToCaptionBlockStrategy extends contentState.ElementToDTOStrategy {
    * @inheritDoc
    */
   handle(elementsArray, options) {
+    const captionAnnotations = this.getTableCaptionAnnotations(elementsArray[0], options);
     return RTETableCaptionBlock.from({
       id: misc.generateUUID(),
       type: 'table-caption',
-      annotations: this.getTableCaptionAnnotations(elementsArray[0], options),
+      annotations: Object.assign(Object.assign({}, captionAnnotations), { caption: true }),
       children: [],
     }, options);
   }
@@ -7190,6 +7222,144 @@ class PreventTableInsertParagraphInterceptor extends ActionHandlerInterceptor {
   }
 }
 
+/**
+ * A strategy defines how to filter and refill styles for table elements.
+ */
+class TableBlockFilterStylesStrategy extends codeBlock.RTEFilterStylesStrategy {
+  constructor() {
+    super(...arguments);
+    this.stylesToBeFiltered = splitCellOperation.RTETableAnnotation.getDefaultStyles();
+    this.elementTagName = 'table';
+  }
+  /**
+   * @inheritDoc
+   */
+  canFilter(blockOrNodeInstance) {
+    return this.isTableBlock(blockOrNodeInstance.constructor.name);
+  }
+  /**
+   * @inheritDoc
+   */
+  canRefill(blockOrNodeClassName, element) {
+    return (this.isTableBlock(blockOrNodeClassName) && element.tagName.toLowerCase() === this.elementTagName);
+  }
+  /**
+   * @inheritDoc
+   */
+  toCssText() {
+    return this.buildCssTextForStyles(this.elementTagName, this.classNameToBeAdded);
+  }
+  /**
+   * Checks if the given class name corresponds to a table block.
+   *
+   * @param {string} className - The class name to check.
+   * @returns {boolean} - True if it's a table block, false otherwise.
+   */
+  isTableBlock(className) {
+    return className === 'RTETableBlock';
+  }
+}
+
+/**
+ * A strategy defines how to filter and refill styles for table caption elements.
+ */
+class TableCaptionFilterStylesStrategy extends codeBlock.RTEFilterStylesStrategy {
+  constructor() {
+    super(...arguments);
+    this.stylesToBeFiltered = RTETableCaptionAnnotation.getDefaultStyles();
+    this.elementTagName = 'table caption';
+  }
+  /**
+   * @inheritDoc
+   */
+  canFilter(blockOrNodeInstance) {
+    return this.isTableCaption(blockOrNodeInstance.constructor.name);
+  }
+  /**
+   * @inheritDoc
+   */
+  canRefill(blockOrNodeClassName, element) {
+    return this.isTableCaption(blockOrNodeClassName) && element.nodeName === 'CAPTION';
+  }
+  /**
+   * @inheritDoc
+   */
+  toCssText() {
+    return this.buildCssTextForStyles(this.elementTagName, this.classNameToBeAdded);
+  }
+  /**
+   * Checks if the given class name corresponds to a table caption block.
+   *
+   * @param {string} className - The class name to check.
+   * @returns {boolean} - True if it's a table caption block, false otherwise.
+   */
+  isTableCaption(className) {
+    return className === 'RTETableCaptionBlock';
+  }
+}
+
+/**
+ * A strategy defines how to filter and refill styles for table cell elements.
+ */
+class TableCellFilterStylesStrategy extends codeBlock.RTEFilterStylesStrategy {
+  constructor(cellType = 'td') {
+    super();
+    this.stylesToBeFiltered = splitCellOperation.RTETableCellAnnotation.getDefaultStyles();
+    this.elementTagName = '';
+    this.stylesWithRGBColor = splitCellOperation.RTETableCellAnnotation.getDefaultStyles(false);
+    this.cellBlockClassName = '';
+    this.elementTagName = cellType;
+    this.cellBlockClassName = cellType === 'td' ? 'RTETableCellBlock' : 'RTETableHeadCellBlock';
+  }
+  /**
+   * @inheritDoc
+   */
+  canFilter(blockOrNodeInstance) {
+    return this.isTableCell(blockOrNodeInstance.constructor.name);
+  }
+  /**
+   * The table cell border color can be represented in different formats (e.g., hex, rgb), so we need to ensure that we can handle both cases.
+   *
+   * @inheritDoc
+   */
+  filterAndDeleteStyles(fullStyles, classNames) {
+    this.convertDefaultBorderColorFromRGBToHex(fullStyles);
+    return super.filterAndDeleteStyles(fullStyles, classNames);
+  }
+  /**
+   * @inheritDoc
+   */
+  canRefill(blockOrNodeClassName, element) {
+    return (this.isTableCell(blockOrNodeClassName) && element.nodeName === this.elementTagName.toUpperCase());
+  }
+  /**
+   * @inheritDoc
+   */
+  toCssText() {
+    return this.buildCssTextForStyles(this.elementTagName, this.classNameToBeAdded);
+  }
+  /**
+   * Checks if the given class name corresponds to a table cell block.
+   *
+   * @param {string} className - The class name to check.
+   * @returns {boolean} - True if it's a table cell block, false otherwise.
+   */
+  isTableCell(className) {
+    return className === this.cellBlockClassName;
+  }
+  /**
+   * Converts the default border color from RGB to HEX if necessary.
+   *
+   * @param {Nullable<RTEFilterStyles>} styles - The styles object to be modified.
+   */
+  convertDefaultBorderColorFromRGBToHex(styles) {
+    const defaultRGBBorder = this.stylesWithRGBColor.border;
+    if (styles && styles.border && styles.border === defaultRGBBorder) {
+      styles.border = this.stylesToBeFiltered.border; // Use the hex color from stylesToBeFiltered
+    }
+  }
+}
+
 /**
  * Function extension class for Vega Rich Text Editor.
  */
@@ -7290,6 +7460,10 @@ class VegaRTETableExtension extends VegaRTEExtension {
   VegaRTEExtension.registerActionHandlerInterceptor(splitCellOperation.RTETableCellBlock.name, codeBlock.ModifyContentActionType.DELETE_CHILDREN, new PreventCellChildrenRemoveInterceptor());
   VegaRTEExtension.registerActionHandlerInterceptor(splitCellOperation.RTETableHeadCellBlock.name, codeBlock.ModifyContentActionType.DELETE_CHILDREN, new PreventCellChildrenRemoveInterceptor());
   VegaRTEExtension.registerActionHandlerInterceptor(splitCellOperation.RTETableBlock.name, codeBlock.ModifyContentActionType.INSERT_NEW_PARAGRAPH, new PreventTableInsertParagraphInterceptor());
+  VegaRTEExtension.registerFilterStylesStrategy(splitCellOperation.RTETableBlock.name, new TableBlockFilterStylesStrategy());
+  VegaRTEExtension.registerFilterStylesStrategy(RTETableCaptionBlock.name, new TableCaptionFilterStylesStrategy());
+  VegaRTEExtension.registerFilterStylesStrategy(splitCellOperation.RTETableCellBlock.name, new TableCellFilterStylesStrategy());
+  VegaRTEExtension.registerFilterStylesStrategy(splitCellOperation.RTETableHeadCellBlock.name, new TableCellFilterStylesStrategy('th'));
 })();
 
 /**