@atlaskit/editor-plugin-table 10.4.7 → 10.5.1

package/dist/es2019/ui/toolbar.js

@@ -22,14 +22,12 @@ import { findCellRectClosestToPos, findTable, getSelectionRect, isSelectionType,
 import AlignImageCenterIcon from '@atlaskit/icon/core/align-image-center';
 import AlignImageLeftIcon from '@atlaskit/icon/core/align-image-left';
 import CopyIcon from '@atlaskit/icon/core/copy';
-import CustomizeIcon from '@atlaskit/icon/core/customize';
-import DeleteIcon from '@atlaskit/icon/core/delete';
+import CustomizeIcon from '@atlaskit/icon/core/migration/customize--preferences';
+import DeleteIcon from '@atlaskit/icon/core/migration/delete--editor-remove';
 import TableColumnsDistributeIcon from '@atlaskit/icon/core/table-columns-distribute';
 import EditorAlignImageCenter from '@atlaskit/icon/glyph/editor/align-image-center';
 import EditorAlignImageLeft from '@atlaskit/icon/glyph/editor/align-image-left';
 import DistributeColumnIcon from '@atlaskit/icon/glyph/editor/layout-three-equal';
-import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
-import TableOptionsIcon from '@atlaskit/icon/glyph/preferences';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { clearHoverSelection, hoverColumns, hoverMergedCells, hoverRows, hoverTable, removeDescendantNodes } from '../pm-plugins/commands';
@@ -104,8 +102,7 @@ export const getToolbarMenuConfig = (config, state, {
       type: 'dropdown',
       testId: 'table_options',
       // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
-      icon: fg('platform-visual-refresh-icons') ? undefined : TableOptionsIcon,
-      // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+      icon: fg('platform-visual-refresh-icons') ? undefined : CustomizeIcon,
       iconBefore: fg('platform-visual-refresh-icons') ? CustomizeIcon : undefined,
       title: formatMessage(messages.tableOptions),
       hidden: options.every(option => option.hidden),
@@ -405,7 +402,6 @@ export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAP
       type: 'button',
       appearance: 'danger',
       icon: DeleteIcon,
-      iconFallback: RemoveIcon,
       onClick: deleteTableWithAnalytics(editorAnalyticsAPI),
       disabled: !!resizeState && !!resizeState.dragging,
       onMouseEnter: hoverTable(true),
@@ -550,8 +546,11 @@ const getColumnSettingItems = (editorState, editorView, {
       id: 'editor.table.distributeColumns',
       type: 'button',
       title: formatMessage(messages.distributeColumns),
-      icon: TableColumnsDistributeIcon,
-      iconFallback: DistributeColumnIcon,
+      icon: () => jsx(TableColumnsDistributeIcon, {
+        LEGACY_fallbackIcon: DistributeColumnIcon,
+        spacing: 'spacious',
+        label: ''
+      }),
       onClick: (state, dispatch, view) => getDistributeConfig(getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor)(state, dispatch, view),
       disabled: !wouldChange
     });

package/dist/esm/nodeviews/TableComponent.js

@@ -164,7 +164,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       var prevAttrs = prevNode.attrs;
       var isNested = isTableNested(_this.props.view.state, _this.props.getPos());
       var parentWidth = _this.getParentNodeWidth();
-      if (isNested && isTableNestedInMoreThanOneNode(_this.props.view.state, _this.props.getPos()) && fg('platform_editor_nested_table_in_nested_parent_fix')) {
+      if (isNested && isTableNestedInMoreThanOneNode(_this.props.view.state, _this.props.getPos())) {
         var resizeObsWrapperWidth = _this.wrapperWidth || 0;
         var wrapperWidthDiffBetweenRerenders = Math.abs(resizeObsWrapperWidth - (_this.state.parentWidth || 0));
         var isOusideOfThreshold = wrapperWidthDiffBetweenRerenders <= NESTED_TABLE_IN_NESTED_PARENT_WIDTH_DIFF_MIN_THRESHOLD || wrapperWidthDiffBetweenRerenders > NESTED_TABLE_IN_NESTED_PARENT_WIDTH_DIFF_MAX_THRESHOLD;
@@ -422,14 +422,15 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       if (isTableScalingEnabled && tableWithFixedColumnWidthsOption && getNode().attrs.displayMode !== 'fixed') {
         this.handleColgroupUpdates(true);
       }
-      if (this.wrapper && fg('platform_editor_nested_table_in_nested_parent_fix')) {
+      if (this.wrapper) {
         this.wrapperReisizeObserver = new ResizeObserver(function (entries) {
           var _iterator2 = _createForOfIteratorHelper(entries),
             _step2;
           try {
             for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+              var _entry$contentRect3;
               var entry = _step2.value;
-              _this2.wrapperWidth = entry.contentRect.width;
+              _this2.wrapperWidth = (_entry$contentRect3 = entry.contentRect) === null || _entry$contentRect3 === void 0 ? void 0 : _entry$contentRect3.width;
             }
           } catch (err) {
             _iterator2.e(err);

package/dist/esm/pm-plugins/utils/drag-menu.js

@@ -1,4 +1,5 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import React from 'react';
 import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { addColumnAfter, addColumnBefore, addRowAfter, addRowBefore, backspace, deleteColumn, deleteRow, moveColumnLeft, moveColumnRight, moveRowDown, moveRowUp, tooltip } from '@atlaskit/editor-common/keymaps';
@@ -91,32 +92,57 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
   var addOptions = direction === 'row' ? [{
     label: 'above',
     offset: 0,
-    icon: TableRowAddAboveIcon,
-    iconFallback: AddRowAboveIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableRowAddAboveIcon, {
+        LEGACY_fallbackIcon: AddRowAboveIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: addRowBefore
   }, {
     label: 'below',
     offset: 1,
-    icon: TableRowAddBelowIcon,
-    iconFallback: AddRowBelowIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableRowAddBelowIcon, {
+        LEGACY_fallbackIcon: AddRowBelowIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: addRowAfter
   }] : [{
     label: 'left',
     offset: 0,
-    icon: TableColumnAddLeftIcon,
-    iconFallback: AddColLeftIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableColumnAddLeftIcon, {
+        LEGACY_fallbackIcon: AddColLeftIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: addColumnBefore
   }, {
     label: 'right',
     offset: 1,
-    icon: TableColumnAddRightIcon,
-    iconFallback: AddColRightIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableColumnAddRightIcon, {
+        LEGACY_fallbackIcon: AddColRightIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: addColumnAfter
   }];
   var moveOptions = direction === 'row' ? [{
     label: 'up',
-    icon: TableRowMoveUpIcon,
-    iconFallback: ArrowUpIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableRowMoveUpIcon, {
+        LEGACY_fallbackIcon: ArrowUpIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: moveRowUp,
     canMove: canMove('table-row', -1, (_tableMap$height = tableMap === null || tableMap === void 0 ? void 0 : tableMap.height) !== null && _tableMap$height !== void 0 ? _tableMap$height : 0, selection, selectionRect),
     getOriginIndexes: getSelectedRowIndexes,
@@ -125,8 +151,13 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
     }
   }, {
     label: 'down',
-    icon: TableRowMoveDownIcon,
-    iconFallback: ArrowDownIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableRowMoveDownIcon, {
+        LEGACY_fallbackIcon: ArrowDownIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: moveRowDown,
     canMove: canMove('table-row', 1, (_tableMap$height2 = tableMap === null || tableMap === void 0 ? void 0 : tableMap.height) !== null && _tableMap$height2 !== void 0 ? _tableMap$height2 : 0, selection, selectionRect),
     getOriginIndexes: getSelectedRowIndexes,
@@ -135,8 +166,13 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
     }
   }] : [{
     label: 'left',
-    icon: TableColumnMoveLeftIcon,
-    iconFallback: ArrowLeftIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableColumnMoveLeftIcon, {
+        LEGACY_fallbackIcon: ArrowLeftIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: moveColumnLeft,
     canMove: canMove('table-column', -1, (_tableMap$width = tableMap === null || tableMap === void 0 ? void 0 : tableMap.width) !== null && _tableMap$width !== void 0 ? _tableMap$width : 0, selection, selectionRect),
     getOriginIndexes: getSelectedColumnIndexes,
@@ -145,8 +181,13 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
     }
   }, {
     label: 'right',
-    icon: TableColumnMoveRightIcon,
-    iconFallback: ArrowRightIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableColumnMoveRightIcon, {
+        LEGACY_fallbackIcon: ArrowRightIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: moveColumnRight,
     canMove: canMove('table-column', 1, (_tableMap$width2 = tableMap === null || tableMap === void 0 ? void 0 : tableMap.width) !== null && _tableMap$width2 !== void 0 ? _tableMap$width2 : 0, selection, selectionRect),
     getOriginIndexes: getSelectedColumnIndexes,
@@ -157,25 +198,33 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
   var sortOptions = direction === 'column' ? [{
     label: 'increasing',
     order: SortOrder.ASC,
-    icon: SortAscendingIcon,
-    iconFallback: HipchatChevronDoubleUpIcon
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(SortAscendingIcon, {
+        LEGACY_fallbackIcon: HipchatChevronDoubleUpIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    }
   }, {
     label: 'decreasing',
     order: SortOrder.DESC,
-    icon: SortDescendingIcon,
-    iconFallback: HipchatChevronDoubleDownIcon
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(SortDescendingIcon, {
+        LEGACY_fallbackIcon: HipchatChevronDoubleDownIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    }
   }] : [];
   var sortConfigs = _toConsumableArray(sortOptions.map(function (_ref) {
     var label = _ref.label,
       order = _ref.order,
-      icon = _ref.icon,
-      iconFallback = _ref.iconFallback;
+      icon = _ref.icon;
     return {
       id: "sort_column_".concat(order),
       title: "Sort ".concat(label),
       disabled: hasMergedCellsInTable,
       icon: icon,
-      iconFallback: iconFallback,
       onClick: function onClick(state, dispatch) {
         sortColumnWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, index !== null && index !== void 0 ? index : 0, order)(state, dispatch);
         return true;
@@ -186,13 +235,11 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
     var label = _ref2.label,
       offset = _ref2.offset,
       icon = _ref2.icon,
-      iconFallback = _ref2.iconFallback,
       keymap = _ref2.keymap;
     return {
       id: "add_".concat(direction, "_").concat(label),
       title: "Add ".concat(direction, " ").concat(label),
       icon: icon,
-      iconFallback: iconFallback,
       onClick: function onClick(state, dispatch) {
         if (direction === 'row') {
           insertRowWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, {
@@ -222,8 +269,13 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
       }
       return false;
     },
-    icon: TableColumnsDistributeIcon,
-    iconFallback: EditorLayoutThreeEqualIcon
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableColumnsDistributeIcon, {
+        LEGACY_fallbackIcon: EditorLayoutThreeEqualIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    }
   } : undefined, {
     id: 'clear_cells',
     title: 'Clear cells',
@@ -231,8 +283,13 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
       emptyMultipleCellsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, targetCellPosition)(state, dispatch);
       return true;
     },
-    icon: TableCellClearIcon,
-    iconFallback: CrossCircleIcon,
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(TableCellClearIcon, {
+        LEGACY_fallbackIcon: CrossCircleIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: tooltip(backspace)
   }, {
     id: "delete_".concat(direction),
@@ -245,14 +302,24 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
       }
       return true;
     },
-    icon: direction === 'row' ? TableRowDeleteIcon : TableColumnDeleteIcon,
-    iconFallback: RemoveIcon,
+    icon: direction === 'row' ? function () {
+      return /*#__PURE__*/React.createElement(TableRowDeleteIcon, {
+        LEGACY_fallbackIcon: RemoveIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    } : function () {
+      return /*#__PURE__*/React.createElement(TableColumnDeleteIcon, {
+        LEGACY_fallbackIcon: RemoveIcon,
+        spacing: 'spacious',
+        label: ''
+      });
+    },
     keymap: direction === 'row' ? tooltip(deleteRow) : tooltip(deleteColumn)
   }], _toConsumableArray(moveOptions.map(function (_ref3) {
     var label = _ref3.label,
       canMove = _ref3.canMove,
       icon = _ref3.icon,
-      iconFallback = _ref3.iconFallback,
       keymap = _ref3.keymap,
       getOriginIndexes = _ref3.getOriginIndexes,
       getTargetIndex = _ref3.getTargetIndex;
@@ -261,7 +328,6 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
       title: "Move ".concat(direction, " ").concat(label),
       disabled: !canMove,
       icon: icon,
-      iconFallback: iconFallback,
       onClick: function onClick(state, dispatch) {
         if (canMove) {
           requestAnimationFrame(function () {

package/dist/esm/pm-plugins/utils/paste.js

@@ -83,7 +83,8 @@ export var transformSliceToRemoveNestedTables = function transformSliceToRemoveN
       var _slice$content$firstC, _slice$content$lastCh;
       var isPasteInTable = hasParentNodeOfType([table, tableCell, tableHeader])(selection);
       var isPasteInNestedTable = getParentOfTypeCount(schema.nodes.table)(selection.$from) > 1;
-      var isCellPaste = isPasteInTable && slice.content.childCount === 1 && ((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) === table && slice.openStart !== 0 && slice.openEnd !== 0;
+      var isPasteFullTableInsideEmptyCellEnabled = fg('platform_editor_paste_full_table_inside_empty_cell');
+      var isCellPaste = isPasteInTable && slice.content.childCount === 1 && ((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) === table && (!isPasteFullTableInsideEmptyCellEnabled || slice.openStart !== 0 && slice.openEnd !== 0);
 
       // if nesting is allowed we bump up the default nesting allowance to 2 to support
       // two levels of nesting in nodes that support table nesting already such as layoutSection and expands

package/dist/esm/ui/toolbar.js

@@ -26,14 +26,12 @@ import { findCellRectClosestToPos, findTable, getSelectionRect, isSelectionType,
 import AlignImageCenterIcon from '@atlaskit/icon/core/align-image-center';
 import AlignImageLeftIcon from '@atlaskit/icon/core/align-image-left';
 import CopyIcon from '@atlaskit/icon/core/copy';
-import CustomizeIcon from '@atlaskit/icon/core/customize';
-import DeleteIcon from '@atlaskit/icon/core/delete';
+import CustomizeIcon from '@atlaskit/icon/core/migration/customize--preferences';
+import DeleteIcon from '@atlaskit/icon/core/migration/delete--editor-remove';
 import TableColumnsDistributeIcon from '@atlaskit/icon/core/table-columns-distribute';
 import EditorAlignImageCenter from '@atlaskit/icon/glyph/editor/align-image-center';
 import EditorAlignImageLeft from '@atlaskit/icon/glyph/editor/align-image-left';
 import DistributeColumnIcon from '@atlaskit/icon/glyph/editor/layout-three-equal';
-import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
-import TableOptionsIcon from '@atlaskit/icon/glyph/preferences';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { clearHoverSelection, hoverColumns, hoverMergedCells, hoverRows, hoverTable, removeDescendantNodes } from '../pm-plugins/commands';
@@ -109,8 +107,7 @@ export var getToolbarMenuConfig = function getToolbarMenuConfig(config, state, _
       type: 'dropdown',
       testId: 'table_options',
       // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
-      icon: fg('platform-visual-refresh-icons') ? undefined : TableOptionsIcon,
-      // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+      icon: fg('platform-visual-refresh-icons') ? undefined : CustomizeIcon,
       iconBefore: fg('platform-visual-refresh-icons') ? CustomizeIcon : undefined,
       title: formatMessage(messages.tableOptions),
       hidden: options.every(function (option) {
@@ -425,7 +422,6 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
           type: 'button',
           appearance: 'danger',
           icon: DeleteIcon,
-          iconFallback: RemoveIcon,
           onClick: deleteTableWithAnalytics(editorAnalyticsAPI),
           disabled: !!resizeState && !!resizeState.dragging,
           onMouseEnter: hoverTable(true),
@@ -582,8 +578,13 @@ var getColumnSettingItems = function getColumnSettingItems(editorState, editorVi
       id: 'editor.table.distributeColumns',
       type: 'button',
       title: formatMessage(messages.distributeColumns),
-      icon: TableColumnsDistributeIcon,
-      iconFallback: DistributeColumnIcon,
+      icon: function icon() {
+        return jsx(TableColumnsDistributeIcon, {
+          LEGACY_fallbackIcon: DistributeColumnIcon,
+          spacing: 'spacious',
+          label: ''
+        });
+      },
       onClick: function onClick(state, dispatch, view) {
         return getDistributeConfig(getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor)(state, dispatch, view);
       },

package/dist/types/pm-plugins/utils/drag-menu.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { Command, DropdownOptionT, GetEditorContainerWidth } from '@atlaskit/editor-common/types';
 import type { AriaLiveElementAttributes } from '@atlaskit/editor-plugin-accessibility-utils';

package/dist/types-ts4.5/pm-plugins/utils/drag-menu.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { Command, DropdownOptionT, GetEditorContainerWidth } from '@atlaskit/editor-common/types';
 import type { AriaLiveElementAttributes } from '@atlaskit/editor-plugin-accessibility-utils';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "10.4.7",
+	"version": "10.5.1",
 	"description": "Table plugin for the @atlaskit/editor",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -32,7 +32,7 @@
 		"@atlaskit/adf-schema": "^47.6.0",
 		"@atlaskit/button": "^21.1.0",
 		"@atlaskit/custom-steps": "^0.11.0",
-		"@atlaskit/editor-common": "^102.11.0",
+		"@atlaskit/editor-common": "^102.12.0",
 		"@atlaskit/editor-palette": "^2.1.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^2.0.0",
 		"@atlaskit/editor-plugin-analytics": "^2.2.0",
@@ -116,9 +116,6 @@
 		"platform_editor_batch_steps_table": {
 			"type": "boolean"
 		},
-		"platform_editor_nested_table_in_nested_parent_fix": {
-			"type": "boolean"
-		},
 		"platform-visual-refresh-icons": {
 			"type": "boolean"
 		},
@@ -194,6 +191,9 @@
 		},
 		"platform_editor_scroll_table_flickering_fix": {
 			"type": "boolean"
+		},
+		"platform_editor_paste_full_table_inside_empty_cell": {
+			"type": "boolean"
 		}
 	}
 }

package/src/nodeviews/TableComponent.tsx

@@ -286,10 +286,10 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 			this.handleColgroupUpdates(true);
 		}
 
-		if (this.wrapper && fg('platform_editor_nested_table_in_nested_parent_fix')) {
+		if (this.wrapper) {
 			this.wrapperReisizeObserver = new ResizeObserver((entries) => {
 				for (const entry of entries) {
-					this.wrapperWidth = entry.contentRect.width;
+					this.wrapperWidth = entry.contentRect?.width;
 				}
 			});
 
@@ -1193,8 +1193,7 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 
 		if (
 			isNested &&
-			isTableNestedInMoreThanOneNode(this.props.view.state, this.props.getPos()) &&
-			fg('platform_editor_nested_table_in_nested_parent_fix')
+			isTableNestedInMoreThanOneNode(this.props.view.state, this.props.getPos())
 		) {
 			const resizeObsWrapperWidth = this.wrapperWidth || 0;