@atlaskit/editor-plugin-table 1.6.9 → 1.7.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/editor-plugin-table
 
+## 1.7.0
+
+### Minor Changes
+
+- [`cb69e6847ec`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb69e6847ec) - [ux] The table colgroup will always set the width to the min width when the custom-table-width flag is enabled
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.6.9
 
 ### Patch Changes

package/dist/cjs/plugins/table/nodeviews/TableComponent.js

@@ -32,6 +32,7 @@ var _updateOverflowShadows = require("./update-overflow-shadows");
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
 var _OverflowShadowsObserver = require("./OverflowShadowsObserver");
 var _TableContainer = require("./TableContainer");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty3.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
@@ -135,7 +136,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       // Usually happens on window resize.
       layoutSize !== _this.layoutSize || noOfColumnsChanged) {
         // If column has been inserted/deleted avoid multi dispatch
-        if (!hasNumberedColumnChanged && !noOfColumnsChanged) {
+        if (!(0, _platformFeatureFlags.getBooleanFF)('platform.editor.custom-table-width') && !hasNumberedColumnChanged && !noOfColumnsChanged) {
           _this.scaleTable({
             parentWidth: parentWidth,
             layoutChanged: layoutChanged

package/dist/cjs/plugins/table/pm-plugins/table-resizing/utils/colgroup.js

@@ -10,29 +10,56 @@ var _prosemirrorModel = require("prosemirror-model");
 var _utils = require("@atlaskit/editor-common/utils");
 var _styles = require("@atlaskit/editor-common/styles");
 var _tableMap = require("@atlaskit/editor-tables/table-map");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var generateColgroup = function generateColgroup(table) {
   var cols = [];
-  table.content.firstChild.content.forEach(function (cell) {
-    var colspan = cell.attrs.colspan || 1;
-    if (Array.isArray(cell.attrs.colwidth)) {
-      // We slice here to guard against our colwidth array having more entries
-      // Than the we actually span. We'll patch the document at a later point.
-      cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
-        cols.push(['col', width ? {
-          style: "width: ".concat(width, "px;")
-        } : {}]);
-      });
-    } else {
-      // When we have merged cells on the first row (firstChild),
-      // We want to ensure we're creating the appropriate amount of
-      // cols the table still has.
-      cols.push.apply(cols, (0, _toConsumableArray2.default)(Array.from({
-        length: colspan
-      }, function (_) {
-        return ['col', {}];
-      })));
-    }
-  });
+  if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.custom-table-width')) {
+    table.content.firstChild.content.forEach(function (cell) {
+      var colspan = cell.attrs.colspan || 1;
+      if (Array.isArray(cell.attrs.colwidth)) {
+        // We slice here to guard against our colwidth array having more entries
+        // Than the we actually span. We'll patch the document at a later point.
+        cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
+          cols.push(['col', {
+            style: "width: ".concat(width ? Math.max(width, _styles.tableCellMinWidth) : _styles.tableCellMinWidth, "px;")
+          }]);
+        });
+      } else {
+        // When we have merged cells on the first row (firstChild),
+        // We want to ensure we're creating the appropriate amount of
+        // cols the table still has.
+        cols.push.apply(cols, (0, _toConsumableArray2.default)(Array.from({
+          length: colspan
+        }, function (_) {
+          return ['col', {
+            style: "width: ".concat(_styles.tableCellMinWidth, "px;")
+          }];
+        })));
+      }
+    });
+  } else {
+    table.content.firstChild.content.forEach(function (cell) {
+      var colspan = cell.attrs.colspan || 1;
+      if (Array.isArray(cell.attrs.colwidth)) {
+        // We slice here to guard against our colwidth array having more entries
+        // Than the we actually span. We'll patch the document at a later point.
+        cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
+          cols.push(['col', width ? {
+            style: "width: ".concat(width, "px;")
+          } : {}]);
+        });
+      } else {
+        // When we have merged cells on the first row (firstChild),
+        // We want to ensure we're creating the appropriate amount of
+        // cols the table still has.
+        cols.push.apply(cols, (0, _toConsumableArray2.default)(Array.from({
+          length: colspan
+        }, function (_) {
+          return ['col', {}];
+        })));
+      }
+    });
+  }
   return cols;
 };
 exports.generateColgroup = generateColgroup;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "1.6.9",
+	"version": "1.7.0",
 	"sideEffects": false
 }

package/dist/es2019/plugins/table/nodeviews/TableComponent.js

@@ -20,6 +20,7 @@ import { updateOverflowShadows } from './update-overflow-shadows';
 import memoizeOne from 'memoize-one';
 import { OverflowShadowsObserver } from './OverflowShadowsObserver';
 import { TableContainer } from './TableContainer';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 const isIE11 = browser.ie_version === 11;
 const NOOP = () => undefined;
 class TableComponent extends React.Component {
@@ -121,7 +122,7 @@ class TableComponent extends React.Component {
       // Usually happens on window resize.
       layoutSize !== this.layoutSize || noOfColumnsChanged) {
         // If column has been inserted/deleted avoid multi dispatch
-        if (!hasNumberedColumnChanged && !noOfColumnsChanged) {
+        if (!getBooleanFF('platform.editor.custom-table-width') && !hasNumberedColumnChanged && !noOfColumnsChanged) {
           this.scaleTable({
             parentWidth,
             layoutChanged

package/dist/es2019/plugins/table/pm-plugins/table-resizing/utils/colgroup.js

@@ -2,27 +2,52 @@ import { DOMSerializer } from 'prosemirror-model';
 import { getFragmentBackingArray } from '@atlaskit/editor-common/utils';
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 export const generateColgroup = table => {
   const cols = [];
-  table.content.firstChild.content.forEach(cell => {
-    const colspan = cell.attrs.colspan || 1;
-    if (Array.isArray(cell.attrs.colwidth)) {
-      // We slice here to guard against our colwidth array having more entries
-      // Than the we actually span. We'll patch the document at a later point.
-      cell.attrs.colwidth.slice(0, colspan).forEach(width => {
-        cols.push(['col', width ? {
-          style: `width: ${width}px;`
-        } : {}]);
-      });
-    } else {
-      // When we have merged cells on the first row (firstChild),
-      // We want to ensure we're creating the appropriate amount of
-      // cols the table still has.
-      cols.push(...Array.from({
-        length: colspan
-      }, _ => ['col', {}]));
-    }
-  });
+  if (getBooleanFF('platform.editor.custom-table-width')) {
+    table.content.firstChild.content.forEach(cell => {
+      const colspan = cell.attrs.colspan || 1;
+      if (Array.isArray(cell.attrs.colwidth)) {
+        // We slice here to guard against our colwidth array having more entries
+        // Than the we actually span. We'll patch the document at a later point.
+        cell.attrs.colwidth.slice(0, colspan).forEach(width => {
+          cols.push(['col', {
+            style: `width: ${width ? Math.max(width, tableCellMinWidth) : tableCellMinWidth}px;`
+          }]);
+        });
+      } else {
+        // When we have merged cells on the first row (firstChild),
+        // We want to ensure we're creating the appropriate amount of
+        // cols the table still has.
+        cols.push(...Array.from({
+          length: colspan
+        }, _ => ['col', {
+          style: `width: ${tableCellMinWidth}px;`
+        }]));
+      }
+    });
+  } else {
+    table.content.firstChild.content.forEach(cell => {
+      const colspan = cell.attrs.colspan || 1;
+      if (Array.isArray(cell.attrs.colwidth)) {
+        // We slice here to guard against our colwidth array having more entries
+        // Than the we actually span. We'll patch the document at a later point.
+        cell.attrs.colwidth.slice(0, colspan).forEach(width => {
+          cols.push(['col', width ? {
+            style: `width: ${width}px;`
+          } : {}]);
+        });
+      } else {
+        // When we have merged cells on the first row (firstChild),
+        // We want to ensure we're creating the appropriate amount of
+        // cols the table still has.
+        cols.push(...Array.from({
+          length: colspan
+        }, _ => ['col', {}]));
+      }
+    });
+  }
   return cols;
 };
 export const insertColgroupFromNode = (tableRef, table) => {

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "1.6.9",
+	"version": "1.7.0",
 	"sideEffects": false
 }

package/dist/esm/plugins/table/nodeviews/TableComponent.js

@@ -30,6 +30,7 @@ import { updateOverflowShadows } from './update-overflow-shadows';
 import memoizeOne from 'memoize-one';
 import { OverflowShadowsObserver } from './OverflowShadowsObserver';
 import { TableContainer } from './TableContainer';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 var isIE11 = browser.ie_version === 11;
 var NOOP = function NOOP() {
   return undefined;
@@ -129,7 +130,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       // Usually happens on window resize.
       layoutSize !== _this.layoutSize || noOfColumnsChanged) {
         // If column has been inserted/deleted avoid multi dispatch
-        if (!hasNumberedColumnChanged && !noOfColumnsChanged) {
+        if (!getBooleanFF('platform.editor.custom-table-width') && !hasNumberedColumnChanged && !noOfColumnsChanged) {
           _this.scaleTable({
             parentWidth: parentWidth,
             layoutChanged: layoutChanged

package/dist/esm/plugins/table/pm-plugins/table-resizing/utils/colgroup.js

@@ -3,29 +3,56 @@ import { DOMSerializer } from 'prosemirror-model';
 import { getFragmentBackingArray } from '@atlaskit/editor-common/utils';
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 export var generateColgroup = function generateColgroup(table) {
   var cols = [];
-  table.content.firstChild.content.forEach(function (cell) {
-    var colspan = cell.attrs.colspan || 1;
-    if (Array.isArray(cell.attrs.colwidth)) {
-      // We slice here to guard against our colwidth array having more entries
-      // Than the we actually span. We'll patch the document at a later point.
-      cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
-        cols.push(['col', width ? {
-          style: "width: ".concat(width, "px;")
-        } : {}]);
-      });
-    } else {
-      // When we have merged cells on the first row (firstChild),
-      // We want to ensure we're creating the appropriate amount of
-      // cols the table still has.
-      cols.push.apply(cols, _toConsumableArray(Array.from({
-        length: colspan
-      }, function (_) {
-        return ['col', {}];
-      })));
-    }
-  });
+  if (getBooleanFF('platform.editor.custom-table-width')) {
+    table.content.firstChild.content.forEach(function (cell) {
+      var colspan = cell.attrs.colspan || 1;
+      if (Array.isArray(cell.attrs.colwidth)) {
+        // We slice here to guard against our colwidth array having more entries
+        // Than the we actually span. We'll patch the document at a later point.
+        cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
+          cols.push(['col', {
+            style: "width: ".concat(width ? Math.max(width, tableCellMinWidth) : tableCellMinWidth, "px;")
+          }]);
+        });
+      } else {
+        // When we have merged cells on the first row (firstChild),
+        // We want to ensure we're creating the appropriate amount of
+        // cols the table still has.
+        cols.push.apply(cols, _toConsumableArray(Array.from({
+          length: colspan
+        }, function (_) {
+          return ['col', {
+            style: "width: ".concat(tableCellMinWidth, "px;")
+          }];
+        })));
+      }
+    });
+  } else {
+    table.content.firstChild.content.forEach(function (cell) {
+      var colspan = cell.attrs.colspan || 1;
+      if (Array.isArray(cell.attrs.colwidth)) {
+        // We slice here to guard against our colwidth array having more entries
+        // Than the we actually span. We'll patch the document at a later point.
+        cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
+          cols.push(['col', width ? {
+            style: "width: ".concat(width, "px;")
+          } : {}]);
+        });
+      } else {
+        // When we have merged cells on the first row (firstChild),
+        // We want to ensure we're creating the appropriate amount of
+        // cols the table still has.
+        cols.push.apply(cols, _toConsumableArray(Array.from({
+          length: colspan
+        }, function (_) {
+          return ['col', {}];
+        })));
+      }
+    });
+  }
   return cols;
 };
 export var insertColgroupFromNode = function insertColgroupFromNode(tableRef, table) {

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "1.6.9",
+	"version": "1.7.0",
 	"sideEffects": false
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "1.6.9",
+  "version": "1.7.0",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@atlaskit/adf-schema": "^25.10.0",
-    "@atlaskit/editor-common": "^74.11.0",
+    "@atlaskit/editor-common": "^74.12.0",
     "@atlaskit/editor-palette": "1.5.1",
     "@atlaskit/editor-plugin-analytics": "^0.0.3",
     "@atlaskit/editor-plugin-content-insertion": "^0.0.3",
@@ -37,7 +37,7 @@
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/platform-feature-flags": "^0.2.1",
     "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.10.0",
+    "@atlaskit/tokens": "^1.11.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
@@ -65,7 +65,7 @@
     "@af/editor-libra": "*",
     "@atlaskit/analytics-next": "^9.1.0",
     "@atlaskit/button": "^16.8.0",
-    "@atlaskit/editor-core": "^185.5.0",
+    "@atlaskit/editor-core": "^185.6.0",
     "@atlaskit/editor-plugin-decorations": "^0.1.0",
     "@atlaskit/editor-plugin-feature-flags": "^0.1.0",
     "@atlaskit/editor-plugin-grid": "^0.1.0",

package/src/plugins/table/nodeviews/TableComponent.tsx

@@ -52,6 +52,7 @@ import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import memoizeOne from 'memoize-one';
 import { OverflowShadowsObserver } from './OverflowShadowsObserver';
 import { TableContainer } from './TableContainer';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
 const isIE11 = browser.ie_version === 11;
 const NOOP = () => undefined;
@@ -550,7 +551,11 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
       noOfColumnsChanged
     ) {
       // If column has been inserted/deleted avoid multi dispatch
-      if (!hasNumberedColumnChanged && !noOfColumnsChanged) {
+      if (
+        !getBooleanFF('platform.editor.custom-table-width') &&
+        !hasNumberedColumnChanged &&
+        !noOfColumnsChanged
+      ) {
         this.scaleTable({ parentWidth, layoutChanged });
       }
       this.updateParentWidth(parentWidth);

package/src/plugins/table/pm-plugins/table-resizing/utils/colgroup.ts

@@ -2,27 +2,58 @@ import { DOMSerializer, Node as PmNode } from 'prosemirror-model';
 import { getFragmentBackingArray } from '@atlaskit/editor-common/utils';
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
 type Col = Array<string | { [name: string]: string }>;
 
 export const generateColgroup = (table: PmNode): Col[] => {
   const cols: Col[] = [];
 
-  table.content.firstChild!.content.forEach((cell) => {
-    const colspan = cell.attrs.colspan || 1;
-    if (Array.isArray(cell.attrs.colwidth)) {
-      // We slice here to guard against our colwidth array having more entries
-      // Than the we actually span. We'll patch the document at a later point.
-      cell.attrs.colwidth.slice(0, colspan).forEach((width) => {
-        cols.push(['col', width ? { style: `width: ${width}px;` } : {}]);
-      });
-    } else {
-      // When we have merged cells on the first row (firstChild),
-      // We want to ensure we're creating the appropriate amount of
-      // cols the table still has.
-      cols.push(...Array.from({ length: colspan }, (_) => ['col', {}]));
-    }
-  });
+  if (getBooleanFF('platform.editor.custom-table-width')) {
+    table.content.firstChild!.content.forEach((cell) => {
+      const colspan = cell.attrs.colspan || 1;
+      if (Array.isArray(cell.attrs.colwidth)) {
+        // We slice here to guard against our colwidth array having more entries
+        // Than the we actually span. We'll patch the document at a later point.
+        cell.attrs.colwidth.slice(0, colspan).forEach((width) => {
+          cols.push([
+            'col',
+            {
+              style: `width: ${
+                width ? Math.max(width, tableCellMinWidth) : tableCellMinWidth
+              }px;`,
+            },
+          ]);
+        });
+      } else {
+        // When we have merged cells on the first row (firstChild),
+        // We want to ensure we're creating the appropriate amount of
+        // cols the table still has.
+        cols.push(
+          ...Array.from({ length: colspan }, (_) => [
+            'col',
+            { style: `width: ${tableCellMinWidth}px;` },
+          ]),
+        );
+      }
+    });
+  } else {
+    table.content.firstChild!.content.forEach((cell) => {
+      const colspan = cell.attrs.colspan || 1;
+      if (Array.isArray(cell.attrs.colwidth)) {
+        // We slice here to guard against our colwidth array having more entries
+        // Than the we actually span. We'll patch the document at a later point.
+        cell.attrs.colwidth.slice(0, colspan).forEach((width) => {
+          cols.push(['col', width ? { style: `width: ${width}px;` } : {}]);
+        });
+      } else {
+        // When we have merged cells on the first row (firstChild),
+        // We want to ensure we're creating the appropriate amount of
+        // cols the table still has.
+        cols.push(...Array.from({ length: colspan }, (_) => ['col', {}]));
+      }
+    });
+  }
 
   return cols;
 };