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

package/dist/collection/components/vega-rich-text-editor/extensions/table/setting-event-handlers/column-operation.js

@@ -0,0 +1,109 @@
+import { ToggleHeaderTableColumnStrategy } from '../action-handler-strategies/toggle-header-table-column-strategy';
+import { DeleteTableColumnAction } from '../actions/delete-table-column-action';
+import { InsertTableColumnDirection, InsertTableColumnAction } from '../actions/insert-table-column-action';
+import { SelectTableColumnAction } from '../actions/select-table-column-action';
+import { ToggleHeaderTableColumnAction } from '../actions/toggle-header-table-column-action';
+import { RTETableBlock } from '../dto/table-block';
+import { getParentBlockByType } from '../utils/utils';
+import { SettingEventHandler, TableSettingType } from './setting-event-handler.abstract';
+export var ColumnOperationType;
+(function (ColumnOperationType) {
+  ColumnOperationType["HEADER_COLUMN"] = "HEADER_COLUMN";
+  ColumnOperationType["ADD_COLUMN_LEFT"] = "ADD_COLUMN_LEFT";
+  ColumnOperationType["ADD_COLUMN_RIGHT"] = "ADD_COLUMN_RIGHT";
+  ColumnOperationType["DELETE_COLUMN"] = "DELETE_COLUMN";
+  ColumnOperationType["SELECT_COLUMN"] = "SELECT_COLUMN";
+})(ColumnOperationType || (ColumnOperationType = {}));
+/**
+ * Event handler for column operations in a table.
+ */
+export class ColumnOperationEventHandler extends SettingEventHandler {
+  /**
+   * @inheritDoc
+   */
+  canHandle(action) {
+    return action[0] === TableSettingType.COLUMN;
+  }
+  /**
+   * @inheritDoc
+   */
+  execute(action, extensionContext) {
+    const selectedCells = extensionContext.tableSelection.getSelectedCells();
+    if (!selectedCells || selectedCells.length === 0) {
+      return;
+    }
+    const operation = action[1];
+    switch (operation) {
+      case ColumnOperationType.ADD_COLUMN_LEFT:
+      case ColumnOperationType.ADD_COLUMN_RIGHT:
+        this.handleInsertColumn(operation, selectedCells);
+        break;
+      case ColumnOperationType.DELETE_COLUMN:
+        this.handleDeleteColumn(selectedCells);
+        break;
+      case ColumnOperationType.SELECT_COLUMN:
+        this.handleSelectColumn(selectedCells, extensionContext);
+        break;
+      case ColumnOperationType.HEADER_COLUMN:
+        this.handleToggleHeaderColumn(selectedCells);
+        break;
+      default:
+        break;
+    }
+  }
+  /**
+   * Adds a new column to the table at the specified position.
+   *
+   * @param {ColumnOperationType} direction - The position to insert the new column (left or right).
+   * @param {RTETableCellBlock[] | RTETableHeadCellBlock[]} selectedCells - The selected table cells.
+   */
+  handleInsertColumn(direction, selectedCells) {
+    const action = new InsertTableColumnAction(direction === ColumnOperationType.ADD_COLUMN_LEFT
+      ? InsertTableColumnDirection.LEFT
+      : InsertTableColumnDirection.RIGHT, selectedCells);
+    this.applyActionOnTable(action, selectedCells[0]);
+  }
+  /**
+   * Deletes the selected column from the table.
+   *
+   * @param {RTETableCellBlock[] | RTETableHeadCellBlock[]} selectedCells - The selected table cells.
+   */
+  handleDeleteColumn(selectedCells) {
+    const action = new DeleteTableColumnAction(selectedCells);
+    this.applyActionOnTable(action, selectedCells[0]);
+  }
+  /**
+   * Selects the entire column in the table.
+   *
+   * @param {RTETableCellBlock[] | RTETableHeadCellBlock[]} selectedCells - The selected table cells.
+   * @param {RTETableExtensionContext} extensionContext - The table extension context.
+   */
+  handleSelectColumn(selectedCells, extensionContext) {
+    const action = new SelectTableColumnAction(selectedCells, (allSelectedCells) => {
+      extensionContext.tableSelection.setSelectedCells(allSelectedCells);
+    });
+    this.applyActionOnTable(action, selectedCells[0]);
+  }
+  /**
+   * Toggles the header state of the selected column in the table.
+   *
+   * @param {RTETableCellBlock[] | RTETableHeadCellBlock[]} selectedCells - The selected table cells.
+   */
+  handleToggleHeaderColumn(selectedCells) {
+    const headerOn = !ToggleHeaderTableColumnStrategy.isFullHeaderSelection(selectedCells);
+    const action = new ToggleHeaderTableColumnAction(selectedCells, headerOn);
+    this.applyActionOnTable(action, selectedCells[0]);
+  }
+  /**
+   * Apply the specified action on the table containing the selected cell.
+   *
+   * @param {DeleteTableColumnAction | InsertTableColumnAction} action - The action to apply.
+   * @param {RTETableCellBlock | RTETableHeadCellBlock} selectedCell - The selected table cell.
+   */
+  applyActionOnTable(action, selectedCell) {
+    const table = getParentBlockByType(selectedCell, RTETableBlock);
+    if (table) {
+      table.apply(action);
+    }
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/table/setting-event-handlers/row-operation.js

@@ -0,0 +1,132 @@
+import { DeleteTableRowAction } from '../actions/delete-table-row-action';
+import { InsertTableRowAction, InsertTableRowDirection } from '../actions/insert-table-row-action';
+import { ToggleHeaderRowAction } from '../actions/toggle-header-row-action';
+import { RTETableBlock } from '../dto/table-block';
+import { RTETableRowBlock } from '../dto/table-row-block';
+import { getParentBlockByType } from '../utils/utils';
+import { SettingEventHandler, TableSettingType } from './setting-event-handler.abstract';
+export var RowOperationType;
+(function (RowOperationType) {
+  RowOperationType["HEADER_ROW"] = "HEADER_ROW";
+  RowOperationType["ADD_ROW_ABOVE"] = "ADD_ROW_ABOVE";
+  RowOperationType["ADD_ROW_BELOW"] = "ADD_ROW_BELOW";
+  RowOperationType["DELETE_ROW"] = "DELETE_ROW";
+  RowOperationType["SELECT_ROW"] = "SELECT_ROW";
+})(RowOperationType || (RowOperationType = {}));
+/**
+ * Event handler for row operations in a table.
+ */
+export class RowOperationEventHandler extends SettingEventHandler {
+  /**
+   * @inheritDoc
+   */
+  canHandle(action) {
+    return action[0] === TableSettingType.ROW;
+  }
+  /**
+   * @inheritDoc
+   */
+  execute(action, extensionContext) {
+    const operation = action[1];
+    switch (operation) {
+      case RowOperationType.ADD_ROW_ABOVE:
+      case RowOperationType.ADD_ROW_BELOW:
+        this.handleInsertRow(operation, extensionContext);
+        break;
+      case RowOperationType.DELETE_ROW:
+        this.handleDeleteRow(extensionContext);
+        break;
+      case RowOperationType.HEADER_ROW:
+        this.handleToggleHeader(extensionContext);
+        break;
+      case RowOperationType.SELECT_ROW:
+        this.handleSelectRow(extensionContext);
+        break;
+      default:
+        break;
+    }
+  }
+  /**
+   * Adds a new row to the table at the specified position.
+   *
+   * @param {RowOperationType} direction - The position to insert the new row (above or below).
+   * @param {RTETableExtensionContext} extensionContext - The extension context.
+   */
+  handleInsertRow(direction, extensionContext) {
+    const selectedRows = this.getAllSelectedRows(extensionContext);
+    if (selectedRows.length > 0) {
+      const action = new InsertTableRowAction(direction === RowOperationType.ADD_ROW_ABOVE
+        ? InsertTableRowDirection.ABOVE
+        : InsertTableRowDirection.BELOW, selectedRows);
+      this.applyActionToTable(selectedRows[0], action);
+    }
+  }
+  /**
+   * Deletes the selected row(s) from the table.
+   *
+   * @param {RTETableExtensionContext} extensionContext - The extension context.
+   */
+  handleDeleteRow(extensionContext) {
+    const selectedRows = this.getAllSelectedRows(extensionContext);
+    if (selectedRows.length) {
+      const action = new DeleteTableRowAction(selectedRows);
+      this.applyActionToTable(selectedRows[0], action);
+    }
+  }
+  /**
+   * Converts selected rows to header rows or reverts them back to normal rows.
+   *
+   * @param {RTETableExtensionContext} extensionContext - The extension context.
+   */
+  handleToggleHeader(extensionContext) {
+    const selectedRows = this.getAllSelectedRows(extensionContext);
+    if (selectedRows.length > 0) {
+      const action = new ToggleHeaderRowAction(selectedRows);
+      this.applyActionToTable(selectedRows[0], action);
+    }
+  }
+  /**
+   * Selects the focus row(s) in the table.
+   *
+   * @param {RTETableExtensionContext} extensionContext - The extension context.
+   */
+  handleSelectRow(extensionContext) {
+    const selectedRows = this.getAllSelectedRows(extensionContext);
+    if (selectedRows.length > 0 && extensionContext && extensionContext.tableSelection) {
+      const allCells = selectedRows.flatMap((row) => row.children);
+      extensionContext.tableSelection.setSelectedCells(allCells);
+    }
+  }
+  /**
+   * Get all selected table rows.
+   *
+   * @param {RTETableExtensionContext} extensionContext - The extension context.
+   * @returns {RTETableRowBlock[]} The selected table row blocks.
+   */
+  getAllSelectedRows(extensionContext) {
+    const selectedRows = new Set();
+    if (extensionContext && extensionContext.tableSelection) {
+      const { tableSelection } = extensionContext;
+      const selectedCells = tableSelection.getSelectedCells();
+      selectedCells.forEach((cell) => {
+        const rowBlock = getParentBlockByType(cell, RTETableRowBlock);
+        if (rowBlock) {
+          selectedRows.add(rowBlock);
+        }
+      });
+    }
+    return Array.from(selectedRows);
+  }
+  /**
+   * Applies the given action to the table containing the reference block.
+   *
+   * @param {RTEBlock} refBlock - The reference block within the table.
+   * @param {ModifyContentAction} action - The action to apply to the table.
+   */
+  applyActionToTable(refBlock, action) {
+    const table = getParentBlockByType(refBlock, RTETableBlock);
+    if (table) {
+      table.apply(action);
+    }
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/table/setting-event-handlers/setting-event-handler.abstract.js

@@ -0,0 +1,44 @@
+import { VegaRTEContent } from '../../../dto/content-state';
+import { UpdateCursorPositionAction } from '../../../dto/actions/update-cursor-position-action';
+export var TableSettingType;
+(function (TableSettingType) {
+  TableSettingType["ROW"] = "ROW";
+  TableSettingType["CAPTION"] = "CAPTION";
+  TableSettingType["COLUMN"] = "COLUMN";
+  TableSettingType["MERGE_CELLS"] = "MERGE_CELLS";
+  TableSettingType["TABLE"] = "TABLE";
+  TableSettingType["CELL"] = "CELL";
+})(TableSettingType || (TableSettingType = {}));
+/**
+ * Abstract class for setting event handlers.
+ */
+export class SettingEventHandler {
+  /**
+   * Applies a cursor update action so the editor focuses on the resolved node.
+   *
+   * @param {RTETableBlock} block - Table block currently being toggled.
+   * @param {Nullable<RTENode>} focusNode - Target node that should receive the caret.
+   */
+  syncCursorPosition(block, focusNode) {
+    const rootContent = this.findRootContent(block);
+    if (focusNode && rootContent) {
+      const offset = focusNode.getRangeEndOffset();
+      rootContent.apply(new UpdateCursorPositionAction(focusNode, offset));
+    }
+  }
+  /**
+   * Walks up the parent chain to locate the nearest VegaRTEContent root.
+   *
+   * @param {RTETableBlock} block - Table block used as the starting point.
+   * @returns {Nullable<VegaRTEContent>} Content root containing the table, if found.
+   */
+  findRootContent(block) {
+    let currentParent = block.parent;
+    while (currentParent) {
+      if (currentParent instanceof VegaRTEContent) {
+        return currentParent;
+      }
+      currentParent = currentParent.parent;
+    }
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/table/setting-event-handlers/table-properties-cancel-event-handler.js

@@ -0,0 +1,19 @@
+import { UpdateTablePropertiesAction } from '../actions/update-table-properties-action';
+import { TablePropertiesEventHandler } from './table-properties';
+/**
+ * Cancel Event handler for the table properties.
+ */
+export class TablePropertiesCancelEventHandler extends TablePropertiesEventHandler {
+  /**
+   * Cancel table properties changes
+   *
+   * @param {RTETableExtensionContext} extensionContext - The table extension context.
+   * @param {RTETableBlock} tableBlock - The table block that owns the properties.
+   * @param {RTETablePropertiesType} data - The origin of the properties.
+   * @param {RTENode} focusNode - The node to focus on.
+   */
+  handle(extensionContext, tableBlock, data, focusNode) {
+    tableBlock.apply(new UpdateTablePropertiesAction(data));
+    this.updateCursorPosition(extensionContext, focusNode);
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/table/setting-event-handlers/table-properties-change-event-handler.js

@@ -0,0 +1,20 @@
+import { UpdateTablePropertiesAction } from '../actions/update-table-properties-action';
+import { TablePropertiesEventHandler } from './table-properties';
+/**
+ * Change Event handler for the table properties.
+ */
+export class TablePropertiesChangeEventHandler extends TablePropertiesEventHandler {
+  /**
+   * Update the table properties based on the provided data.
+   *
+   * @param {RTETableExtensionContext} _extensionContext - The table extension context.
+   * @param {RTETableBlock} tableBlock - The table block to update
+   * @param {RTETablePropertiesType} [data] - The new table properties data
+   */
+  handle(_extensionContext, tableBlock, data) {
+    const action = new UpdateTablePropertiesAction(data);
+    // Prevent automatic flushing of the action
+    action.isFlushable = false;
+    tableBlock.apply(action);
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/table/setting-event-handlers/table-properties-save-event-handler.js

@@ -0,0 +1,20 @@
+import { TablePropertiesEventHandler } from './table-properties';
+/**
+ * Save Event handler for the table properties.
+ */
+export class TablePropertiesSaveEventHandler extends TablePropertiesEventHandler {
+  /**
+   * Commit the table properties changes
+   *
+   * @param {RTETableExtensionContext} extensionContext - The table extension context.
+   * @param {unknown} _tableBlock - The table block.
+   * @param {unknown} _data - The table properties data.
+   * @param {RTENode} focusNode - The focus node.
+   */
+  handle(extensionContext, _tableBlock, _data, focusNode) {
+    if (extensionContext && extensionContext.host) {
+      extensionContext.flushValue(extensionContext.host.value);
+      this.updateCursorPosition(extensionContext, focusNode);
+    }
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/table/setting-event-handlers/table-properties.js

@@ -0,0 +1,50 @@
+import { RTETableExtensionAnnotationTypeEnum, } from '../annotations/table-annotation';
+import { UpdateCursorPositionAction } from '../../../dto/actions/update-cursor-position-action';
+/**
+ * Event handler for row operations in a table.
+ */
+export class TablePropertiesEventHandler {
+  /**
+   * Generate form object from table block
+   *
+   * @param {RTETableBlock} tableBlock - The table block
+   * @returns {RTETablePropertiesType} The generated form object
+   */
+  static generateTablePropertiesForm(tableBlock) {
+    const annotation = tableBlock.annotationMap.get(RTETableExtensionAnnotationTypeEnum.TABLE);
+    let result = {
+      borderStyle: 'none',
+      borderColor: '',
+      borderWidth: '',
+      backgroundColor: '',
+      width: '',
+      height: '',
+      textAlign: 'center',
+    };
+    if (annotation) {
+      const annotationJSON = annotation.toJSON().table;
+      const { style = 'none', color = '', width = '', } = annotationJSON.border || { style: 'none', color: '', width: '' };
+      result = {
+        backgroundColor: annotationJSON.backgroundColor || '',
+        width: annotationJSON.width || '',
+        height: annotationJSON.height || '',
+        textAlign: annotationJSON.alignment,
+        borderStyle: style,
+        borderColor: color,
+        borderWidth: width,
+      };
+    }
+    return result;
+  }
+  /**
+   * Update the rich text editor cursor position
+   *
+   * @param {RTETableExtensionContext} extensionContext - The table extension context.
+   * @param {Nullable<RTENode>} focusNode - The node to focus on.
+   */
+  updateCursorPosition(extensionContext, focusNode) {
+    if (extensionContext && focusNode) {
+      extensionContext.host.value.apply(new UpdateCursorPositionAction(focusNode, 0));
+    }
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/table/table-extension.js

@@ -0,0 +1,152 @@
+import { VegaRTEExtension } from '../extension.abstract';
+import { RTETableBlock } from './dto/table-block';
+import { RTETableBlockRenderer } from './renderers/table-renderer';
+import { RTETableHeadRenderer } from './renderers/table-head-renderer';
+import { RTETableRowBlockRenderer } from './renderers/table-row-renderer';
+import { RTETableCellRenderer } from './renderers/table-cell-renderer';
+import { RTETableBodyRenderer } from './renderers/table-body-renderer';
+import { RTETableHeadBlock } from './dto/table-head-block';
+import { RTETableRowBlock } from './dto/table-row-block';
+import { RTETableCellBlock } from './dto/table-cell-block';
+import { RTETableBodyBlock } from './dto/table-body-block';
+import { RTETableHeadCellBlock } from './dto/table-head-cell-block';
+import { RTETableHeadCellRenderer } from './renderers/table-head-cell-renderer';
+import { RTETableToolbarButtonRenderer } from './table-toolbar-button-renderer';
+import { InsertTableBlockStrategy } from './action-handler-strategies/insert-table-block-strategy';
+import { VegaRTEContent } from '../../dto/content-state';
+import { INSERT_TABLE_BLOCK } from './actions/insert-table-block-action';
+import { RTETextBlock } from '../../dto/blocks/text-block';
+import { RTEImageBlock } from '../../dto/blocks/image-block';
+import { PreventCellContentDeleteInterceptor } from './action-handler-interceptors/prevent-cell-content-delete-interceptor';
+import { ModifyContentActionType } from '../../dto/actions/modify-content-action.abstract';
+import { DELETE_TABLE_BLOCK } from './actions/delete-table-block-action';
+import { DeleteTableBlockStrategy } from './action-handler-strategies/delete-table-block-strategy';
+import { PreventCellChildrenRemoveInterceptor } from './action-handler-interceptors/prevent-cell-children-remove-interceptor';
+import { INSERT_TABLE_ROW } from './actions/insert-table-row-action';
+import { InsertTableRowStrategy } from './action-handler-strategies/insert-table-row-strategy';
+import { RTETableCaptionBlock } from './dto/table-caption-block';
+import { RTETableCaptionRenderer } from './renderers/table-caption-renderer';
+import { DELETE_TABLE_ROW } from './actions/delete-table-row-action';
+import { DeleteTableRowStrategy } from './action-handler-strategies/delete-table-row-strategy';
+import { RTETableSelection } from './table-selection';
+import { ToggleHeaderRowStrategy } from './action-handler-strategies/toggle-header-row-strategy';
+import { TOGGLE_HEADER_ROW } from './actions/toggle-header-row-action';
+import { INSERT_TABLE_COLUMN } from './actions/insert-table-column-action';
+import { InsertTableColumnStrategy } from './action-handler-strategies/insert-table-column-strategy';
+import { DELETE_TABLE_COLUMN } from './actions/delete-table-column-action';
+import { DeleteTableColumnStrategy } from './action-handler-strategies/delete-table-column-strategy';
+import { TOGGLE_HEADER_TABLE_COLUMN } from './actions/toggle-header-table-column-action';
+import { ToggleHeaderTableColumnStrategy } from './action-handler-strategies/toggle-header-table-column-strategy';
+import { SELECT_TABLE_COLUMN } from './actions/select-table-column-action';
+import { SelectTableColumnStrategy } from './action-handler-strategies/select-table-column-strategy';
+import { PreventRowInsertInterceptor } from './action-handler-interceptors/prevent-row-insert-interceptor';
+import { TableToTableBlockStrategy } from './element-to-dto-strategies/table-to-table-block-strategy';
+import { TheadToTableHeadBlockStrategy } from './element-to-dto-strategies/thead-to-table-head-block-strategy';
+import { TbodyToTableBodyBlockStrategy } from './element-to-dto-strategies/tbody-to-table-body-block-strategy';
+import { TrToTableRowBlockStrategy } from './element-to-dto-strategies/tr-to-table-row-block-strategy';
+import { TdToTableCellBlockStrategy } from './element-to-dto-strategies/td-to-table-cell-block-strategy';
+import { CaptionToCaptionBlockStrategy } from './element-to-dto-strategies/caption-to-caption-block-strategy';
+import { TableAnnotationHandler } from './annotation-handler/table-annotation-handler';
+import { TableCellAnnotationHandler } from './annotation-handler/table-cell-annotation-handler';
+import { TableHeadCellAnnotationHandler } from './annotation-handler/table-head-cell-annotation-handler';
+import { UpdateTablePropertiesAction } from './actions/update-table-properties-action';
+import { UpdateTablePropertiesStrategy } from './action-handler-strategies/update-table-properties-strategy';
+import { RTE_TABLE_DEFAULT_COLORS } from './constants/styles.constants';
+import { UpdateTableCellPropertiesStrategy } from './action-handler-strategies/update-table-cell-properties-strategy';
+import { RTETableCellAnnotationsAction } from './actions/table-cell-annotations-action';
+import { RTETableHeadCellAnnotationsAction } from './actions/table-head-cell-annotations-action';
+/**
+ * Function extension class for Vega Rich Text Editor.
+ */
+export class VegaRTETableExtension extends VegaRTEExtension {
+  /**
+   * Instantiate the table extension
+   *
+   * @param {RTETableColorSchema[]} colors - The table border color and background color list.
+   */
+  constructor(colors = RTE_TABLE_DEFAULT_COLORS) {
+    super();
+    this.toolbarButtonRenderer = new RTETableToolbarButtonRenderer();
+    this.tableBlockRenderer = new RTETableBlockRenderer();
+    this.tableRowBlockRenderer = new RTETableRowBlockRenderer();
+    this.tableCellRenderer = new RTETableCellRenderer();
+    this.tableHeadCellRenderer = new RTETableHeadCellRenderer();
+    this.tableSelection = new RTETableSelection();
+    this.registerToolbarButtonRenderer('table', this.toolbarButtonRenderer);
+    this.registerBlockBasicStrategies(RTETableBlock.name);
+    this.registerBlockBasicStrategies(RTETableHeadBlock.name);
+    this.registerBlockBasicStrategies(RTETableHeadCellBlock.name);
+    this.registerBlockBasicStrategies(RTETableRowBlock.name);
+    this.registerBlockBasicStrategies(RTETableCellBlock.name);
+    this.registerBlockBasicStrategies(RTETableBodyBlock.name);
+    this.registerRenderer('table-block', this.tableBlockRenderer);
+    this.registerRenderer('table-head', new RTETableHeadRenderer());
+    this.registerRenderer('table-head-cell', this.tableHeadCellRenderer);
+    this.registerRenderer('table-row', this.tableRowBlockRenderer);
+    this.registerRenderer('table-cell', this.tableCellRenderer);
+    this.registerRenderer('table-body', new RTETableBodyRenderer());
+    this.registerRenderer('table-caption', new RTETableCaptionRenderer());
+    this.registerNode('table-block', RTETableBlock);
+    this.registerNode('table-head', RTETableHeadBlock);
+    this.registerNode('table-head-cell', RTETableHeadCellBlock);
+    this.registerNode('table-row', RTETableRowBlock);
+    this.registerNode('table-cell', RTETableCellBlock);
+    this.registerNode('table-body', RTETableBodyBlock);
+    this.registerNode('table-caption', RTETableCaptionBlock);
+    this.registerElementToBlockDTOClassStrategy(new TableToTableBlockStrategy());
+    this.registerElementToBlockDTOClassStrategy(new TheadToTableHeadBlockStrategy());
+    this.registerElementToBlockDTOClassStrategy(new TbodyToTableBodyBlockStrategy());
+    this.registerElementToBlockDTOClassStrategy(new TrToTableRowBlockStrategy());
+    this.registerElementToBlockDTOClassStrategy(new TdToTableCellBlockStrategy());
+    this.registerElementToBlockDTOClassStrategy(new CaptionToCaptionBlockStrategy());
+    // Register custom annotation handlers for table elements
+    this.registerAnnotationHandler(new TableAnnotationHandler());
+    this.registerAnnotationHandler(new TableCellAnnotationHandler());
+    this.registerAnnotationHandler(new TableHeadCellAnnotationHandler());
+    this.tableBlockRenderer.updateTableColorSchema(colors);
+  }
+  /**
+   * Initializes the extension with the given context
+   *
+   * @param {RTEExtensionContext} context - extension context
+   */
+  initialExtension(context) {
+    super.initialExtension(context);
+    this.tableSelection.init(context);
+    const tableExtensionContext = Object.assign(Object.assign({}, context), { tableSelection: this.tableSelection });
+    this.toolbarButtonRenderer.injectExtensionContext(tableExtensionContext);
+    this.tableBlockRenderer.injectExtensionContext(tableExtensionContext);
+    this.tableCellRenderer.injectExtensionContext(tableExtensionContext);
+    this.tableHeadCellRenderer.injectExtensionContext(tableExtensionContext);
+  }
+  /**
+   * @inheritDoc
+   */
+  destroyExtension() {
+    this.tableSelection.destroy();
+  }
+}
+(() => {
+  const insertTableBlockStrategy = new InsertTableBlockStrategy();
+  const deleteTableBlockStrategy = new DeleteTableBlockStrategy();
+  VegaRTEExtension.registerActionHandleStrategy(VegaRTEContent.name, INSERT_TABLE_BLOCK, insertTableBlockStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(VegaRTEContent.name, DELETE_TABLE_BLOCK, deleteTableBlockStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(RTETableCellBlock.name, DELETE_TABLE_BLOCK, deleteTableBlockStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(RTETableHeadCellBlock.name, DELETE_TABLE_BLOCK, deleteTableBlockStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(RTETextBlock.name, INSERT_TABLE_BLOCK, insertTableBlockStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(RTEImageBlock.name, INSERT_TABLE_BLOCK, insertTableBlockStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, INSERT_TABLE_ROW, new InsertTableRowStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, DELETE_TABLE_ROW, new DeleteTableRowStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, TOGGLE_HEADER_ROW, new ToggleHeaderRowStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, INSERT_TABLE_COLUMN, new InsertTableColumnStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, DELETE_TABLE_COLUMN, new DeleteTableColumnStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, TOGGLE_HEADER_TABLE_COLUMN, new ToggleHeaderTableColumnStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, SELECT_TABLE_COLUMN, new SelectTableColumnStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, UpdateTablePropertiesAction.name, new UpdateTablePropertiesStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableCellBlock.name, RTETableCellAnnotationsAction.name, new UpdateTableCellPropertiesStrategy());
+  VegaRTEExtension.registerActionHandleStrategy(RTETableHeadCellBlock.name, RTETableHeadCellAnnotationsAction.name, new UpdateTableCellPropertiesStrategy());
+  VegaRTEExtension.registerActionHandlerInterceptor(RTETextBlock.name, ModifyContentActionType.DELETE_BLOCK_CONTENT, new PreventCellContentDeleteInterceptor());
+  VegaRTEExtension.registerActionHandlerInterceptor(RTETableRowBlock.name, ModifyContentActionType.INSERT_CHILDREN_BEFORE, new PreventRowInsertInterceptor());
+  VegaRTEExtension.registerActionHandlerInterceptor(RTETableCellBlock.name, ModifyContentActionType.DELETE_CHILDREN, new PreventCellChildrenRemoveInterceptor());
+  VegaRTEExtension.registerActionHandlerInterceptor(RTETableHeadCellBlock.name, ModifyContentActionType.DELETE_CHILDREN, new PreventCellChildrenRemoveInterceptor());
+})();

package/dist/collection/components/vega-rich-text-editor/extensions/table/table-icon.js

@@ -0,0 +1,3 @@
+export default {
+  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="M48 264V160H232V264H48zm0 48H232V432H64c-8.8 0-16-7.2-16-16V312zM280 432V312H464V416c0 8.8-7.2 16-16 16H280zM464 264H280V160H464V264zM64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64z"/></svg>`,
+};