@atlaskit/editor-plugin-table
Version:
Table plugin for the @atlaskit/editor
113 lines (112 loc) • 4.87 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.measureTableWithAutoLayout = void 0;
var _styles = require("@atlaskit/editor-common/styles");
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
var _contentMode = require("../../transforms/content-mode");
var _runSmartAdjust = require("./smart-adjust/run-smart-adjust");
var measureTableWithAutoLayout = exports.measureTableWithAutoLayout = function measureTableWithAutoLayout(tableRef, editorContainerWidth) {
var cols = Array.from(tableRef.querySelectorAll(':scope > colgroup > col'));
var contentWrap = tableRef.closest(".".concat(_styles.TableSharedCssClassName.TABLE_VIEW_CONTENT_WRAP));
var resizerContainer = contentWrap === null || contentWrap === void 0 ? void 0 : contentWrap.querySelector(".".concat(_styles.TableSharedCssClassName.TABLE_RESIZER_CONTAINER));
var resizerItem = resizerContainer === null || resizerContainer === void 0 ? void 0 : resizerContainer.querySelector('.resizer-item.display-handle');
var prevTableWidth = tableRef.style.width;
var prevTableLayout = tableRef.style.tableLayout;
var prevColWidths = cols.map(function (col) {
return col.style.width;
});
var prevResizerItemWidth = resizerItem === null || resizerItem === void 0 ? void 0 : resizerItem.style.width;
tableRef.style.width = '';
tableRef.style.tableLayout = 'auto';
cols.forEach(function (col) {
return col.style.width = '';
});
if ((0, _platformFeatureFlags.fg)('platform_editor_table_fit_to_content_smart_adjust')) {
var hadTableSticky = tableRef.classList.contains(_styles.TableSharedCssClassName.TABLE_STICKY);
var prevTableMarginTop = tableRef.style.marginTop;
if (hadTableSticky) {
tableRef.classList.remove(_styles.TableSharedCssClassName.TABLE_NATIVE_STICKY);
}
if (prevTableMarginTop) {
tableRef.style.marginTop = '';
}
var stickyRows = Array.from(tableRef.querySelectorAll("tr.sticky, tr.".concat(_styles.TableSharedCssClassName.TABLE_NATIVE_STICKY)));
var prevStickyRowState = stickyRows.map(function (row) {
return {
row: row,
hadSticky: row.classList.contains('sticky'),
hadNative: row.classList.contains(_styles.TableSharedCssClassName.TABLE_NATIVE_STICKY),
width: row.style.width,
top: row.style.top,
position: row.style.position,
gridTemplateColumns: row.style.gridTemplateColumns
};
});
stickyRows.forEach(function (row) {
row.classList.remove('sticky');
row.classList.remove(_styles.TableSharedCssClassName.TABLE_NATIVE_STICKY);
row.style.width = '';
row.style.top = '';
row.style.position = '';
row.style.gridTemplateColumns = '';
});
try {
return (0, _runSmartAdjust.runSmartAdjust)(tableRef, resizerContainer, resizerItem, editorContainerWidth);
} finally {
tableRef.style.width = prevTableWidth;
tableRef.style.tableLayout = prevTableLayout;
cols.forEach(function (col, i) {
return col.style.width = prevColWidths[i];
});
if (hadTableSticky) {
tableRef.classList.add(_styles.TableSharedCssClassName.TABLE_STICKY);
}
if (prevTableMarginTop) {
tableRef.style.marginTop = prevTableMarginTop;
}
prevStickyRowState.forEach(function (state) {
if (state.hadSticky) {
state.row.classList.add('sticky');
}
if (state.hadNative) {
state.row.classList.add(_styles.TableSharedCssClassName.TABLE_NATIVE_STICKY);
}
if (state.width) {
state.row.style.width = state.width;
}
if (state.top) {
state.row.style.top = state.top;
}
if (state.position) {
state.row.style.position = state.position;
}
if (state.gridTemplateColumns) {
state.row.style.gridTemplateColumns = state.gridTemplateColumns;
}
});
(0, _runSmartAdjust.restoreResizerContainer)(resizerContainer);
if (resizerItem) {
resizerItem.style.width = prevResizerItemWidth !== null && prevResizerItemWidth !== void 0 ? prevResizerItemWidth : '';
}
}
}
if (resizerContainer) {
resizerContainer.style.width = 'var(--ak-editor-table-width)';
resizerContainer.style.setProperty('--ak-editor-table-width', 'max-content');
}
if (resizerItem) {
resizerItem.style.width = 'max-content';
}
var measurement = (0, _contentMode.getTableMeasurement)(tableRef);
tableRef.style.width = prevTableWidth;
tableRef.style.tableLayout = prevTableLayout;
cols.forEach(function (col, i) {
return col.style.width = prevColWidths[i];
});
if (resizerItem) {
resizerItem.style.width = prevResizerItemWidth !== null && prevResizerItemWidth !== void 0 ? prevResizerItemWidth : '';
}
return measurement;
};