@atlaskit/editor-plugin-table 22.4.3 → 22.4.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (161) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/nodeviews/TableComponent.js +1 -1
  3. package/dist/cjs/pm-plugins/table-resizing/utils/scale-table.js +1 -2
  4. package/dist/cjs/tablePlugin.js +2 -2
  5. package/dist/cjs/ui/FloatingDragMenu/index.js +9 -6
  6. package/dist/cjs/ui/TableFloatingControls/NumberColumn/index.js +4 -6
  7. package/dist/cjs/ui/TableMenu/column/getColumnMenuComponents.js +194 -0
  8. package/dist/cjs/ui/TableMenu/column/items/AddColumnLeftItem.js +27 -0
  9. package/dist/cjs/ui/TableMenu/column/items/AddColumnRightItem.js +27 -0
  10. package/dist/cjs/ui/TableMenu/column/items/DeleteColumnItem.js +29 -0
  11. package/dist/cjs/ui/TableMenu/column/items/DistributeColumnsItem.js +22 -0
  12. package/dist/cjs/ui/TableMenu/column/items/HeaderColumnToggleItem.js +23 -0
  13. package/dist/cjs/ui/TableMenu/column/items/MoveColumnRightItem.js +33 -0
  14. package/dist/cjs/ui/TableMenu/column/items/SortDecreasingItem.js +23 -0
  15. package/dist/cjs/ui/TableMenu/column/items/SortIncreasingItem.js +23 -0
  16. package/dist/cjs/ui/TableMenu/column/keys.js +79 -0
  17. package/dist/cjs/ui/TableMenu/row/getRowMenuComponents.js +25 -47
  18. package/dist/cjs/ui/TableMenu/row/items/AddRowAboveItem.js +27 -0
  19. package/dist/cjs/ui/TableMenu/row/items/AddRowBelowItem.js +27 -0
  20. package/dist/cjs/ui/TableMenu/row/items/DeleteRowItem.js +29 -0
  21. package/dist/cjs/ui/TableMenu/row/items/HeaderRowToggleItem.js +23 -0
  22. package/dist/cjs/ui/TableMenu/row/items/MoveRowDownItem.js +33 -0
  23. package/dist/cjs/ui/TableMenu/row/items/MoveRowUpItem.js +33 -0
  24. package/dist/cjs/ui/TableMenu/row/items/NumberedRowsToggleItem.js +23 -0
  25. package/dist/cjs/ui/TableMenu/row/keys.js +7 -14
  26. package/dist/cjs/ui/TableMenu/shared/TableMenu.js +35 -0
  27. package/dist/cjs/ui/TableMenu/shared/consts.js +2 -2
  28. package/dist/cjs/ui/TableMenu/shared/getSharedItems.js +46 -0
  29. package/dist/cjs/ui/TableMenu/shared/getTableMenuComponents.js +14 -0
  30. package/dist/cjs/ui/TableMenu/shared/items/BackgroundColorItem.js +5 -7
  31. package/dist/cjs/ui/TableMenu/shared/items/ClearCellsItem.js +1 -3
  32. package/dist/cjs/ui/TableMenu/shared/keys.js +14 -0
  33. package/dist/cjs/ui/common-styles.js +4 -4
  34. package/dist/es2019/nodeviews/TableComponent.js +1 -1
  35. package/dist/es2019/pm-plugins/table-resizing/utils/scale-table.js +1 -2
  36. package/dist/es2019/tablePlugin.js +2 -2
  37. package/dist/es2019/ui/FloatingDragMenu/index.js +10 -7
  38. package/dist/es2019/ui/TableFloatingControls/NumberColumn/index.js +4 -4
  39. package/dist/es2019/ui/TableMenu/column/getColumnMenuComponents.js +160 -0
  40. package/dist/es2019/ui/TableMenu/column/items/AddColumnLeftItem.js +21 -0
  41. package/dist/es2019/ui/TableMenu/column/items/AddColumnRightItem.js +21 -0
  42. package/dist/es2019/ui/TableMenu/column/items/DeleteColumnItem.js +23 -0
  43. package/dist/es2019/ui/TableMenu/column/items/DistributeColumnsItem.js +16 -0
  44. package/dist/es2019/ui/TableMenu/column/items/HeaderColumnToggleItem.js +17 -0
  45. package/dist/es2019/ui/TableMenu/column/items/MoveColumnRightItem.js +25 -0
  46. package/dist/es2019/ui/TableMenu/column/items/SortDecreasingItem.js +17 -0
  47. package/dist/es2019/ui/TableMenu/column/items/SortIncreasingItem.js +17 -0
  48. package/dist/es2019/ui/TableMenu/column/keys.js +93 -0
  49. package/dist/es2019/ui/TableMenu/row/getRowMenuComponents.js +19 -37
  50. package/dist/es2019/ui/TableMenu/row/items/AddRowAboveItem.js +21 -0
  51. package/dist/es2019/ui/TableMenu/row/items/AddRowBelowItem.js +21 -0
  52. package/dist/es2019/ui/TableMenu/row/items/DeleteRowItem.js +23 -0
  53. package/dist/es2019/ui/TableMenu/row/items/HeaderRowToggleItem.js +17 -0
  54. package/dist/es2019/ui/TableMenu/row/items/MoveRowDownItem.js +25 -0
  55. package/dist/es2019/ui/TableMenu/row/items/MoveRowUpItem.js +25 -0
  56. package/dist/es2019/ui/TableMenu/row/items/NumberedRowsToggleItem.js +17 -0
  57. package/dist/es2019/ui/TableMenu/row/keys.js +7 -13
  58. package/dist/es2019/ui/TableMenu/shared/TableMenu.js +28 -0
  59. package/dist/es2019/ui/TableMenu/shared/consts.js +1 -1
  60. package/dist/es2019/ui/TableMenu/shared/getSharedItems.js +33 -0
  61. package/dist/es2019/ui/TableMenu/shared/getTableMenuComponents.js +4 -0
  62. package/dist/es2019/ui/TableMenu/shared/items/BackgroundColorItem.js +5 -8
  63. package/dist/es2019/ui/TableMenu/shared/items/ClearCellsItem.js +1 -4
  64. package/dist/es2019/ui/TableMenu/shared/keys.js +8 -0
  65. package/dist/es2019/ui/common-styles.js +167 -66
  66. package/dist/esm/nodeviews/TableComponent.js +1 -1
  67. package/dist/esm/pm-plugins/table-resizing/utils/scale-table.js +1 -2
  68. package/dist/esm/tablePlugin.js +2 -2
  69. package/dist/esm/ui/FloatingDragMenu/index.js +10 -7
  70. package/dist/esm/ui/TableFloatingControls/NumberColumn/index.js +4 -6
  71. package/dist/esm/ui/TableMenu/column/getColumnMenuComponents.js +188 -0
  72. package/dist/esm/ui/TableMenu/column/items/AddColumnLeftItem.js +20 -0
  73. package/dist/esm/ui/TableMenu/column/items/AddColumnRightItem.js +20 -0
  74. package/dist/esm/ui/TableMenu/column/items/DeleteColumnItem.js +22 -0
  75. package/dist/esm/ui/TableMenu/column/items/DistributeColumnsItem.js +15 -0
  76. package/dist/esm/ui/TableMenu/column/items/HeaderColumnToggleItem.js +16 -0
  77. package/dist/esm/ui/TableMenu/column/items/MoveColumnRightItem.js +26 -0
  78. package/dist/esm/ui/TableMenu/column/items/SortDecreasingItem.js +16 -0
  79. package/dist/esm/ui/TableMenu/column/items/SortIncreasingItem.js +16 -0
  80. package/dist/esm/ui/TableMenu/column/keys.js +73 -0
  81. package/dist/esm/ui/TableMenu/row/getRowMenuComponents.js +19 -41
  82. package/dist/esm/ui/TableMenu/row/items/AddRowAboveItem.js +20 -0
  83. package/dist/esm/ui/TableMenu/row/items/AddRowBelowItem.js +20 -0
  84. package/dist/esm/ui/TableMenu/row/items/DeleteRowItem.js +22 -0
  85. package/dist/esm/ui/TableMenu/row/items/HeaderRowToggleItem.js +16 -0
  86. package/dist/esm/ui/TableMenu/row/items/MoveRowDownItem.js +26 -0
  87. package/dist/esm/ui/TableMenu/row/items/MoveRowUpItem.js +26 -0
  88. package/dist/esm/ui/TableMenu/row/items/NumberedRowsToggleItem.js +16 -0
  89. package/dist/esm/ui/TableMenu/row/keys.js +7 -13
  90. package/dist/esm/ui/TableMenu/shared/TableMenu.js +27 -0
  91. package/dist/esm/ui/TableMenu/shared/consts.js +1 -1
  92. package/dist/esm/ui/TableMenu/shared/getSharedItems.js +39 -0
  93. package/dist/esm/ui/TableMenu/shared/getTableMenuComponents.js +7 -0
  94. package/dist/esm/ui/TableMenu/shared/items/BackgroundColorItem.js +5 -7
  95. package/dist/esm/ui/TableMenu/shared/items/ClearCellsItem.js +1 -3
  96. package/dist/esm/ui/TableMenu/shared/keys.js +8 -0
  97. package/dist/esm/ui/common-styles.js +4 -4
  98. package/dist/types/ui/TableMenu/column/getColumnMenuComponents.d.ts +9 -0
  99. package/dist/types/ui/TableMenu/column/items/AddColumnLeftItem.d.ts +2 -0
  100. package/dist/types/ui/TableMenu/column/items/AddColumnRightItem.d.ts +2 -0
  101. package/dist/types/ui/TableMenu/column/items/DeleteColumnItem.d.ts +2 -0
  102. package/dist/types/ui/TableMenu/column/items/DistributeColumnsItem.d.ts +2 -0
  103. package/dist/types/ui/TableMenu/column/items/HeaderColumnToggleItem.d.ts +2 -0
  104. package/dist/types/ui/TableMenu/column/items/MoveColumnRightItem.d.ts +2 -0
  105. package/dist/types/ui/TableMenu/column/items/SortDecreasingItem.d.ts +2 -0
  106. package/dist/types/ui/TableMenu/column/items/SortIncreasingItem.d.ts +2 -0
  107. package/dist/types/ui/TableMenu/column/keys.d.ts +21 -0
  108. package/dist/types/ui/TableMenu/row/items/AddRowAboveItem.d.ts +2 -0
  109. package/dist/types/ui/TableMenu/row/items/AddRowBelowItem.d.ts +2 -0
  110. package/dist/types/ui/TableMenu/row/items/DeleteRowItem.d.ts +2 -0
  111. package/dist/types/ui/TableMenu/row/items/HeaderRowToggleItem.d.ts +2 -0
  112. package/dist/types/ui/TableMenu/row/items/MoveRowDownItem.d.ts +2 -0
  113. package/dist/types/ui/TableMenu/row/items/MoveRowUpItem.d.ts +2 -0
  114. package/dist/types/ui/TableMenu/row/items/NumberedRowsToggleItem.d.ts +2 -0
  115. package/dist/types/ui/TableMenu/row/keys.d.ts +5 -7
  116. package/dist/types/ui/TableMenu/shared/TableMenu.d.ts +9 -0
  117. package/dist/types/ui/TableMenu/shared/consts.d.ts +1 -1
  118. package/dist/types/ui/TableMenu/shared/getSharedItems.d.ts +2 -0
  119. package/dist/types/ui/TableMenu/shared/getTableMenuComponents.d.ts +2 -0
  120. package/dist/types/ui/TableMenu/shared/items/BackgroundColorItem.d.ts +1 -5
  121. package/dist/types/ui/TableMenu/shared/items/ClearCellsItem.d.ts +1 -5
  122. package/dist/types/ui/TableMenu/shared/keys.d.ts +3 -0
  123. package/dist/types-ts4.5/ui/TableMenu/column/getColumnMenuComponents.d.ts +9 -0
  124. package/dist/types-ts4.5/ui/TableMenu/column/items/AddColumnLeftItem.d.ts +2 -0
  125. package/dist/types-ts4.5/ui/TableMenu/column/items/AddColumnRightItem.d.ts +2 -0
  126. package/dist/types-ts4.5/ui/TableMenu/column/items/DeleteColumnItem.d.ts +2 -0
  127. package/dist/types-ts4.5/ui/TableMenu/column/items/DistributeColumnsItem.d.ts +2 -0
  128. package/dist/types-ts4.5/ui/TableMenu/column/items/HeaderColumnToggleItem.d.ts +2 -0
  129. package/dist/types-ts4.5/ui/TableMenu/column/items/MoveColumnRightItem.d.ts +2 -0
  130. package/dist/types-ts4.5/ui/TableMenu/column/items/SortDecreasingItem.d.ts +2 -0
  131. package/dist/types-ts4.5/ui/TableMenu/column/items/SortIncreasingItem.d.ts +2 -0
  132. package/dist/types-ts4.5/ui/TableMenu/column/keys.d.ts +21 -0
  133. package/dist/types-ts4.5/ui/TableMenu/row/items/AddRowAboveItem.d.ts +2 -0
  134. package/dist/types-ts4.5/ui/TableMenu/row/items/AddRowBelowItem.d.ts +2 -0
  135. package/dist/types-ts4.5/ui/TableMenu/row/items/DeleteRowItem.d.ts +2 -0
  136. package/dist/types-ts4.5/ui/TableMenu/row/items/HeaderRowToggleItem.d.ts +2 -0
  137. package/dist/types-ts4.5/ui/TableMenu/row/items/MoveRowDownItem.d.ts +2 -0
  138. package/dist/types-ts4.5/ui/TableMenu/row/items/MoveRowUpItem.d.ts +2 -0
  139. package/dist/types-ts4.5/ui/TableMenu/row/items/NumberedRowsToggleItem.d.ts +2 -0
  140. package/dist/types-ts4.5/ui/TableMenu/row/keys.d.ts +5 -7
  141. package/dist/types-ts4.5/ui/TableMenu/shared/TableMenu.d.ts +9 -0
  142. package/dist/types-ts4.5/ui/TableMenu/shared/consts.d.ts +1 -1
  143. package/dist/types-ts4.5/ui/TableMenu/shared/getSharedItems.d.ts +2 -0
  144. package/dist/types-ts4.5/ui/TableMenu/shared/getTableMenuComponents.d.ts +2 -0
  145. package/dist/types-ts4.5/ui/TableMenu/shared/items/BackgroundColorItem.d.ts +1 -5
  146. package/dist/types-ts4.5/ui/TableMenu/shared/items/ClearCellsItem.d.ts +1 -5
  147. package/dist/types-ts4.5/ui/TableMenu/shared/keys.d.ts +3 -0
  148. package/package.json +13 -16
  149. package/dist/cjs/ui/TableMenu/row/RowMenu.js +0 -35
  150. package/dist/cjs/ui/TableMenu/row/RowMenuItems.js +0 -130
  151. package/dist/es2019/ui/TableMenu/row/RowMenu.js +0 -27
  152. package/dist/es2019/ui/TableMenu/row/RowMenuItems.js +0 -126
  153. package/dist/esm/ui/TableMenu/row/RowMenu.js +0 -28
  154. package/dist/esm/ui/TableMenu/row/RowMenuItems.js +0 -123
  155. package/dist/types/ui/TableMenu/row/RowMenu.d.ts +0 -7
  156. package/dist/types/ui/TableMenu/row/RowMenuItems.d.ts +0 -8
  157. package/dist/types-ts4.5/ui/TableMenu/row/RowMenu.d.ts +0 -7
  158. package/dist/types-ts4.5/ui/TableMenu/row/RowMenuItems.d.ts +0 -8
  159. /package/dist/cjs/ui/TableMenu/{row/RowMenu.compiled.css → shared/TableMenu.compiled.css} +0 -0
  160. /package/dist/es2019/ui/TableMenu/{row/RowMenu.compiled.css → shared/TableMenu.compiled.css} +0 -0
  161. /package/dist/esm/ui/TableMenu/{row/RowMenu.compiled.css → shared/TableMenu.compiled.css} +0 -0
@@ -70,16 +70,16 @@ var tableStickyHeaderFirefoxFixStyle = function tableStickyHeaderFirefoxFixStyle
70
70
  }
71
71
  };
72
72
  var roundedTableCellCornerStyles = function roundedTableCellCornerStyles() {
73
- return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " > table {\n\t\t/* Round table corner cells (including merged cells that span to the edge)\n\t\t and their interaction overlays. The data-reaches-* attributes are set by the\n\t\t TableCell node view based on each cell's position + rowspan/colspan. */\n\t\t> tbody > tr > td[data-reaches-top][data-reaches-left],\n\t\t> tbody > tr > th[data-reaches-top][data-reaches-left] {\n\t\t\tborder-top-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t&.", ".", "::after {\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-top][data-reaches-right],\n\t\t> tbody > tr > th[data-reaches-top][data-reaches-right] {\n\t\t\tborder-top-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t&.", ".", "::after {\n\t\t\t\tborder-top-right-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-bottom][data-reaches-left],\n\t\t> tbody > tr > th[data-reaches-bottom][data-reaches-left] {\n\t\t\tborder-bottom-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t&.", ".", "::after {\n\t\t\t\tborder-bottom-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-bottom][data-reaches-right],\n\t\t> tbody > tr > th[data-reaches-bottom][data-reaches-right] {\n\t\t\tborder-bottom-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t&.", ".", "::after {\n\t\t\t\tborder-bottom-right-radius: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)");
73
+ return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " > table {\n\t\t/* Round table corner cells (including merged cells that span to the edge)\n\t\t and their interaction overlays. The data-reaches-* attributes are set by the\n\t\t TableCell node view based on each cell's position + rowspan/colspan. */\n\t\t> tbody > tr > td[data-reaches-top][data-reaches-left],\n\t\t> tbody > tr > th[data-reaches-top][data-reaches-left] {\n\t\t\tborder-top-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t\t&.", ".", "::after {\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-top][data-reaches-right],\n\t\t> tbody > tr > th[data-reaches-top][data-reaches-right] {\n\t\t\tborder-top-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t\t&.", ".", "::after {\n\t\t\t\tborder-top-right-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-bottom][data-reaches-left],\n\t\t> tbody > tr > th[data-reaches-bottom][data-reaches-left] {\n\t\t\tborder-bottom-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t\t&.", ".", "::after {\n\t\t\t\tborder-bottom-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-bottom][data-reaches-right],\n\t\t> tbody > tr > th[data-reaches-bottom][data-reaches-right] {\n\t\t\tborder-bottom-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t\t&.", ".", "::after {\n\t\t\t\tborder-bottom-right-radius: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)");
74
74
  };
75
75
  var roundedTableInteractionOverlayStyles = function roundedTableInteractionOverlayStyles() {
76
- return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " > table {\n\t\t/* Active-cell highlight base properties (replaces activeCellHighlightStyles).\n\t\t width/height: auto overrides the base cell ::after which uses width: 100%; height: 100%,\n\t\t so that left/right/top/bottom determine the size instead. */\n\t\ttd.", ".", "::after,\n\t\tth.", ".", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t\tbox-shadow: ", ";\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\ttop: -1px;\n\t\t\tleft: -1px;\n\t\t\tright: -1px;\n\t\t\tbottom: -1px;\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t\tz-index: ", ";\n\t\t\tpointer-events: none;\n\t\t}\n\n\t\t/* Normalize selected/hover/danger overlays to the same box model as active-cell.\n\t\t width/height: auto overrides the base cell ::after which uses width: 100%; height: 100%. */\n\t\ttd.", "::after,\n\t\ttd.", "::after,\n\t\tth.", ".", "::after,\n\t\tth.", ".", "::after,\n\t\tth.", ".", "::after,\n\t\ttd.", ".", "::after {\n\t\t\tleft: -1px;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\tbottom: -1px;\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t}\n\n\t\t/* Active-cell overlays: clamp outer sides using data-reaches-* attributes.\n\t\t Internal sides keep -1px overlap; true outer edges are clamped to 0. */\n\t\t> tbody > tr > td[data-reaches-top].", "::after,\n\t\t> tbody > tr > th[data-reaches-top].", "::after {\n\t\t\ttop: 0;\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-left].", "::after,\n\t\t> tbody > tr > th[data-reaches-left].", "::after {\n\t\t\tleft: 0;\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-right].", "::after,\n\t\t> tbody > tr > th[data-reaches-right].", "::after {\n\t\t\tright: 0;\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-bottom].", "::after,\n\t\t> tbody > tr > th[data-reaches-bottom].", "::after {\n\t\t\tbottom: 0;\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer left side and draw overlay border. */\n\t\t> tbody > tr > td[data-reaches-left].", ",\n\t\t> tbody > tr > th[data-reaches-left].", ",\n\t\t> tbody > tr > td[data-reaches-left].", ",\n\t\t> tbody > tr > th[data-reaches-left].", ",\n\t\t> tbody > tr > td[data-reaches-left].", ",\n\t\t> tbody > tr > th[data-reaches-left].", " {\n\t\t\tborder-left-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tleft: 0;\n\t\t\t\tborder-left-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer left side. */\n\t\t> tbody > tr > td[data-reaches-left].", ",\n\t\t> tbody > tr > th[data-reaches-left].", " {\n\t\t\tborder-left-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tleft: 0;\n\t\t\t\tborder-left-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer right side. */\n\t\t> tbody > tr > td[data-reaches-right].", ",\n\t\t> tbody > tr > th[data-reaches-right].", ",\n\t\t> tbody > tr > td[data-reaches-right].", ",\n\t\t> tbody > tr > th[data-reaches-right].", ",\n\t\t> tbody > tr > td[data-reaches-right].", ",\n\t\t> tbody > tr > th[data-reaches-right].", " {\n\t\t\tborder-right-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tright: 0;\n\t\t\t\tborder-right-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer right side. */\n\t\t> tbody > tr > td[data-reaches-right].", ",\n\t\t> tbody > tr > th[data-reaches-right].", " {\n\t\t\tborder-right-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tright: 0;\n\t\t\t\tborder-right-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer bottom side. */\n\t\t> tbody > tr > td[data-reaches-bottom].", ",\n\t\t> tbody > tr > th[data-reaches-bottom].", ",\n\t\t> tbody > tr > td[data-reaches-bottom].", ",\n\t\t> tbody > tr > th[data-reaches-bottom].", ",\n\t\t> tbody > tr > td[data-reaches-bottom].", ",\n\t\t> tbody > tr > th[data-reaches-bottom].", " {\n\t\t\tborder-bottom-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tborder-bottom-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer bottom side. */\n\t\t> tbody > tr > td[data-reaches-bottom].", ",\n\t\t> tbody > tr > th[data-reaches-bottom].", " {\n\t\t\tborder-bottom-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tborder-bottom-color: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, "var(--ds-border-selected, #1868DB)", "var(--ds-shadow-raised, 0px 1px 1px #1E1F2140, 0px 0px 1px #1E1F214f)", _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor);
76
+ return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " > table {\n\t\t/* Active-cell highlight base properties (replaces activeCellHighlightStyles).\n\t\t width/height: auto overrides the base cell ::after which uses width: 100%; height: 100%,\n\t\t so that left/right/top/bottom determine the size instead. */\n\t\ttd.", ".", "::after,\n\t\t\tth.", ".", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t\tbox-shadow: ", ";\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\ttop: -1px;\n\t\t\tleft: -1px;\n\t\t\tright: -1px;\n\t\t\tbottom: -1px;\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t\tz-index: ", ";\n\t\t\tpointer-events: none;\n\t\t}\n\n\t\t/* Normalize selected/hover/danger overlays to the same box model as active-cell.\n\t\t width/height: auto overrides the base cell ::after which uses width: 100%; height: 100%. */\n\t\ttd.", "::after,\n\t\t\ttd.", "::after,\n\t\t\tth.", ".", "::after,\n\t\t\tth.", ".", "::after,\n\t\t\tth.", ".", "::after,\n\t\t\ttd.", ".", "::after {\n\t\t\tleft: -1px;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\tbottom: -1px;\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t}\n\n\t\t/* Active-cell overlays: clamp outer sides using data-reaches-* attributes.\n\t\t Internal sides keep -1px overlap; true outer edges are clamped to 0. */\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-top].", "::after,\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-top].", "::after {\n\t\t\ttop: 0;\n\t\t}\n\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-left].", "::after,\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-left].", "::after {\n\t\t\tleft: 0;\n\t\t}\n\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-right].", "::after,\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-right].", "::after {\n\t\t\tright: 0;\n\t\t}\n\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-bottom].", "::after,\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-bottom].", "::after {\n\t\t\tbottom: 0;\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer left side and draw overlay border. */\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-left].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-left].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-left].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-left].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-left].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-left].", " {\n\t\t\tborder-left-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tleft: 0;\n\t\t\t\tborder-left-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer left side. */\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-left].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-left].", " {\n\t\t\tborder-left-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tleft: 0;\n\t\t\t\tborder-left-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer right side. */\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-right].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-right].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-right].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-right].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-right].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-right].", " {\n\t\t\tborder-right-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tright: 0;\n\t\t\t\tborder-right-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer right side. */\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-right].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-right].", " {\n\t\t\tborder-right-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tright: 0;\n\t\t\t\tborder-right-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer bottom side. */\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-bottom].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-bottom].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-bottom].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-bottom].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-bottom].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-bottom].", " {\n\t\t\tborder-bottom-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tborder-bottom-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer bottom side. */\n\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-bottom].", ",\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-bottom].", " {\n\t\t\tborder-bottom-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tborder-bottom-color: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, "var(--ds-border-selected, #1868DB)", "var(--ds-shadow-raised, 0px 1px 1px #1E1F2140, 0px 0px 1px #1E1F214f)", _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor);
77
77
  };
78
78
  var roundedTableNumberedColumnStyles = function roundedTableNumberedColumnStyles() {
79
- return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n\t/* Numbered columns are separate, so they need their own rounded edge owner. */\n\t.", "[data-number-column='true'] {\n\t\t/* Override the inline/container left border and replace it with one rounded pseudo-border. */\n\t\t> .", " .", ",\n\t\t> .", " .", " {\n\t\t\tposition: relative;\n\t\t\tborder-left: 0;\n\n\t\t\t&::before {\n\t\t\t\tcontent: '';\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\tbottom: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\tborder-left: 1px solid ", ";\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t\tborder-bottom-left-radius: ", ";\n\t\t\t\tpointer-events: none;\n\t\t\t\tz-index: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Prevent individual number buttons from drawing a straight left border. */\n\t\t> .", " .", ",\n\t\t> .", " .", " {\n\t\t\tborder-left-color: transparent;\n\t\t}\n\n\t\t> .", " .", ".", ",\n\t\t> .", " .", ".", ",\n\t\t> .", " .", ".", ",\n\t\t> .", " .", ".", ",\n\t\t> .", " .", ".active,\n\t\t> .", " .", ".active {\n\t\t\tborder-left-color: transparent;\n\t\t}\n\n\t\t/* When numbered column is present, the visual left edge belongs to the number column widget.\n\t\t Zero out any left-side border-radius on the cell and its overlays/pseudo-borders \u2014\n\t\t but leave right-side radii untouched so right-edge cells still round correctly. */\n\t\t.", " > table > tbody > tr > th[data-reaches-top][data-reaches-left],\n\t\t.", " > table > tbody > tr > td[data-reaches-top][data-reaches-left] {\n\t\t\tborder-top-left-radius: 0;\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-left-radius: 0;\n\t\t\t}\n\t\t}\n\n\t\t.", " > table > tbody > tr > th[data-reaches-bottom][data-reaches-left],\n\t\t.", " > table > tbody > tr > td[data-reaches-bottom][data-reaches-left] {\n\t\t\tborder-bottom-left-radius: 0;\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-bottom-left-radius: 0;\n\t\t\t}\n\t\t}\n\n\t\t/* Preserve rounded numbered-column corners across normal, active, and danger states. */\n\t\t.", ":first-of-type {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ":last-of-type {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":first-of-type,\n\t\t.", ".", ":first-of-type,\n\t\t.", ".active:first-of-type {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":last-of-type,\n\t\t.", ".", ":last-of-type,\n\t\t.", ".active:last-of-type {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":first-of-type::after {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":last-of-type::after {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t/* Sticky numbered-column mask also needs the same top-left radius. */\n\t\t.", " tr th[data-reaches-top][data-reaches-left]::before {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _consts2.tableBorderColor, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, "var(--ds-radius-medium, 6px)");
79
+ return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n\t/* Numbered columns are separate, so they need their own rounded edge owner. */\n\t.", "[data-number-column='true'] {\n\t\t/* Override the inline/container left border and replace it with one rounded pseudo-border. */\n\t\t> .", "\n\t\t\t.", ",\n\t\t\t> .", "\n\t\t\t.", " {\n\t\t\tposition: relative;\n\t\t\tborder-left: 0;\n\n\t\t\t&::before {\n\t\t\t\tcontent: '';\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\tbottom: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\tborder-left: 1px solid ", ";\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t\tborder-bottom-left-radius: ", ";\n\t\t\t\tpointer-events: none;\n\t\t\t\tz-index: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Prevent individual number buttons from drawing a straight left border. */\n\t\t> .", "\n\t\t\t.", ",\n\t\t\t> .", "\n\t\t\t.", " {\n\t\t\tborder-left-color: transparent;\n\t\t}\n\n\t\t> .", "\n\t\t\t.", ".", ",\n\t\t\t> .", "\n\t\t\t.", ".", ",\n\t\t\t> .", "\n\t\t\t.", ".", ",\n\t\t\t> .", "\n\t\t\t.", ".", ",\n\t\t\t> .", "\n\t\t\t.", ".active,\n\t\t\t> .", "\n\t\t\t.", ".active {\n\t\t\tborder-left-color: transparent;\n\t\t}\n\n\t\t/* When numbered column is present, the visual left edge belongs to the number column widget.\n\t\t Zero out any left-side border-radius on the cell and its overlays/pseudo-borders \u2014\n\t\t but leave right-side radii untouched so right-edge cells still round correctly. */\n\t\t.", " > table > tbody > tr > th[data-reaches-top][data-reaches-left],\n\t\t.", "\n\t\t\t> table\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-top][data-reaches-left] {\n\t\t\tborder-top-left-radius: 0;\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-left-radius: 0;\n\t\t\t}\n\t\t}\n\n\t\t.", "\n\t\t\t> table\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> th[data-reaches-bottom][data-reaches-left],\n\t\t.", "\n\t\t\t> table\n\t\t\t> tbody\n\t\t\t> tr\n\t\t\t> td[data-reaches-bottom][data-reaches-left] {\n\t\t\tborder-bottom-left-radius: 0;\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-bottom-left-radius: 0;\n\t\t\t}\n\t\t}\n\n\t\t/* Preserve rounded numbered-column corners across normal, active, and danger states. */\n\t\t.", ":first-of-type {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ":last-of-type {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":first-of-type,\n\t\t\t.", ".", ":first-of-type,\n\t\t\t.", ".active:first-of-type {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":last-of-type,\n\t\t\t.", ".", ":last-of-type,\n\t\t\t.", ".active:last-of-type {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":first-of-type::after {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":last-of-type::after {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t/* Sticky numbered-column mask also needs the same top-left radius. */\n\t\t.", "\n\t\t\ttr\n\t\t\tth[data-reaches-top][data-reaches-left]::before {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _consts2.tableBorderColor, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, "var(--ds-radius-medium, 6px)");
80
80
  };
81
81
  var roundedTableStickyHeaderStyles = function roundedTableStickyHeaderStyles() {
82
- return (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t/* Sticky header rows have independent border/shadow/mask painting, so patch the sticky-only painters too. */\n\t.", " > table > tbody > tr.", ",\n\t.", " > table.", " > tbody > tr.sticky {\n\t\t> th[data-reaches-left],\n\t\t> td[data-reaches-left] {\n\t\t\tborder-top-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> td[data-reaches-right],\n\t\t> th[data-reaches-right] {\n\t\t\tborder-top-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-right-radius: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " .", "::after {\n\t\tborder-left-color: transparent;\n\t}\n\n\t.", "[data-number-column='true'] .", " tr th[data-reaches-top][data-reaches-left]::before,\n\t.", "[data-number-column='true'] .", " tr.", " th[data-reaches-left]::before,\n\t.", "[data-number-column='true'] .", " .", " th[data-reaches-left]::before {\n\t\tborder-top-left-radius: ", ";\n\t\tclip-path: inset(0 0 0 0 round ", " 0 0 0);\n\t\tbox-shadow: none !important;\n\t}\n\n\t.", " > table > tbody > tr.", ",\n\t.", " > table.", " > tbody > tr.sticky {\n\t\tbox-shadow: none !important;\n\t}\n\n\t.", ".", ":has(tr.sticky) .", " .", ":first-of-type {\n\t\tbox-shadow: none !important;\n\t}\n\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_STICKY, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON);
82
+ return (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t/* Sticky header rows have independent border/shadow/mask painting, so patch the sticky-only painters too. */\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ",\n\t\t.", "\n\t\t> table.", "\n\t\t> tbody\n\t\t> tr.sticky {\n\t\t> th[data-reaches-left],\n\t\t> td[data-reaches-left] {\n\t\t\tborder-top-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> td[data-reaches-right],\n\t\t> th[data-reaches-right] {\n\t\t\tborder-top-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-right-radius: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " .", "::after {\n\t\tborder-left-color: transparent;\n\t}\n\n\t.", "[data-number-column='true'] .", " tr th[data-reaches-top][data-reaches-left]::before,\n\t.", "[data-number-column='true'] .", " tr.", " th[data-reaches-left]::before,\n\t.", "[data-number-column='true'] .", " .", " th[data-reaches-left]::before {\n\t\tborder-top-left-radius: ", ";\n\t\tclip-path: inset(0 0 0 0 round ", " 0 0 0);\n\t\tbox-shadow: none !important;\n\t}\n\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ",\n\t\t.", "\n\t\t> table.", "\n\t\t> tbody\n\t\t> tr.sticky {\n\t\tbox-shadow: none !important;\n\t}\n\n\t.", ".", ":has(tr.sticky)\n\t\t.", "\n\t\t.", ":first-of-type {\n\t\tbox-shadow: none !important;\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_STICKY, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON);
83
83
  };
84
84
  var roundedTableOverrides = function roundedTableOverrides() {
85
85
  return (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t", "\n\t", "\n\t", "\n\t", "\n"])), roundedTableCellCornerStyles(), roundedTableInteractionOverlayStyles(), roundedTableNumberedColumnStyles(), roundedTableStickyHeaderStyles());
@@ -123,7 +123,7 @@ class TableComponent extends React.Component {
123
123
  const tablePos = this.props.getPos();
124
124
  const isNested = isTableNested(this.props.view.state, tablePos);
125
125
  let parentWidth = this.getParentNodeWidth();
126
- const useMeasuredWidthForBodiedSyncBlock = isNested && typeof tablePos === 'number' && isTableNestedUnderBodiedSyncBlock(this.props.view.state, tablePos) && fg('platform_synced_block_patch_9');
126
+ const useMeasuredWidthForBodiedSyncBlock = isNested && typeof tablePos === 'number' && isTableNestedUnderBodiedSyncBlock(this.props.view.state, tablePos);
127
127
  if (useMeasuredWidthForBodiedSyncBlock) {
128
128
  // Prefer the live DOM measurement (`clientWidth`) over the ResizeObserver-cached
129
129
  // value (`wrapperWidth`) because clientWidth is synchronous and more up-to-date
@@ -2,7 +2,6 @@ import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
2
2
  import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
3
3
  import { BodiedSyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
4
4
  import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
5
- import { fg } from '@atlaskit/platform-feature-flags';
6
5
  import { updateColumnWidths } from '../../transforms/column-width';
7
6
  import { getTableWidth } from '../../utils/nodes';
8
7
  import { getLayoutSize } from '../utils/misc';
@@ -165,7 +164,7 @@ export const scaleTable = (tableRef, options, domAtPos, api, isTableScalingEnabl
165
164
  // table's outer width to exceed the colgroup width by 1px. Subtract 1px from the
166
165
  // parentWidth here so that the scaled colgroup fits within the sync-block
167
166
  // container without overflowing.
168
- const isNestedInBodiedSyncBlock = !!((_tableRef$closest = tableRef.closest) !== null && _tableRef$closest !== void 0 && _tableRef$closest.call(tableRef, `.${BodiedSyncBlockSharedCssClassName.content}`)) && fg('platform_synced_block_patch_9');
167
+ const isNestedInBodiedSyncBlock = !!((_tableRef$closest = tableRef.closest) !== null && _tableRef$closest !== void 0 && _tableRef$closest.call(tableRef, `.${BodiedSyncBlockSharedCssClassName.content}`));
169
168
  const BORDER_COLLAPSE_WIDTH_PX = 1;
170
169
  const adjustedParentWidth = isNestedInBodiedSyncBlock ? parentWidth - BORDER_COLLAPSE_WIDTH_PX : parentWidth;
171
170
  resizeState = scaleWithParent(tableRef, adjustedParentWidth, node, start, domAtPos, isTableScalingEnabledOnCurrentTable, shouldUseIncreasedScalingPercent);
@@ -43,7 +43,7 @@ import { getHeightInfoPayload, getWidthInfoPayload } from './pm-plugins/utils/an
43
43
  import { createTableWithWidth } from './pm-plugins/utils/create';
44
44
  import { createPlugin as createViewModeSortPlugin } from './pm-plugins/view-mode-sort';
45
45
  import { ContentComponent } from './ui/ContentComponent';
46
- import { getRowMenuComponents } from './ui/TableMenu/row/getRowMenuComponents';
46
+ import { getTableMenuComponents } from './ui/TableMenu/shared/getTableMenuComponents';
47
47
  import { getToolbarConfig } from './ui/toolbar';
48
48
  const defaultGetEditorFeatureFlags = () => ({});
49
49
 
@@ -82,7 +82,7 @@ const tablePlugin = ({
82
82
  !(options !== null && options !== void 0 && options.isChromelessEditor) && !(options !== null && options !== void 0 && options.isCommentEditor) && (options === null || options === void 0 ? void 0 : (_options$getEditorFea2 = options.getEditorFeatureFlags) === null || _options$getEditorFea2 === void 0 ? void 0 : _options$getEditorFea2.call(options).tableSelector) && editorExperiment('platform_editor_controls', 'variant1');
83
83
  if (expValEquals('platform_editor_table_menu_updates', 'isEnabled', true)) {
84
84
  var _api$uiControlRegistr;
85
- api === null || api === void 0 ? void 0 : (_api$uiControlRegistr = api.uiControlRegistry) === null || _api$uiControlRegistr === void 0 ? void 0 : _api$uiControlRegistr.actions.register(getRowMenuComponents());
85
+ api === null || api === void 0 ? void 0 : (_api$uiControlRegistr = api.uiControlRegistry) === null || _api$uiControlRegistr === void 0 ? void 0 : _api$uiControlRegistr.actions.register(getTableMenuComponents());
86
86
  }
87
87
  return {
88
88
  name: 'table',
@@ -6,10 +6,12 @@ import { fg } from '@atlaskit/platform-feature-flags';
6
6
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
7
7
  import { TableCssClassName as ClassName } from '../../types';
8
8
  import { dragMenuDropdownWidth, dragTableInsertColumnButtonSize, tablePopupMenuFitHeight } from '../consts';
9
- import { RowMenu } from '../TableMenu/row/RowMenu';
10
- import { newMenuWidth } from '../TableMenu/shared/consts';
9
+ import { COLUMN_MENU } from '../TableMenu/column/keys';
10
+ import { ROW_MENU } from '../TableMenu/row/keys';
11
+ import { TABLE_MENU_WIDTH } from '../TableMenu/shared/consts';
12
+ import { TableMenu } from '../TableMenu/shared/TableMenu';
11
13
  import DragMenu from './DragMenu';
12
- const rowMenuOffset = dragTableInsertColumnButtonSize + 4;
14
+ const TABLE_MENU_OFFSET = dragTableInsertColumnButtonSize + 4;
13
15
  const FloatingDragMenu = ({
14
16
  mountPoint,
15
17
  boundariesElement,
@@ -54,7 +56,7 @@ const FloatingDragMenu = ({
54
56
  mountTo: mountPoint,
55
57
  boundariesElement: boundariesElement,
56
58
  scrollableElement: scrollableElement,
57
- fitWidth: expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? newMenuWidth : dragMenuDropdownWidth,
59
+ fitWidth: expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? TABLE_MENU_WIDTH : dragMenuDropdownWidth,
58
60
  fitHeight: tablePopupMenuFitHeight
59
61
  // z-index value below is to ensure that this menu is above other floating menu
60
62
  // in table, but below floating dialogs like typeaheads, pickers, etc.
@@ -62,10 +64,11 @@ const FloatingDragMenu = ({
62
64
  ,
63
65
  zIndex: inStickyMode ? akEditorFloatingDialogZIndex : akEditorFloatingOverlapPanelZIndex,
64
66
  forcePlacement: true,
65
- offset: expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? [rowMenuOffset, 0] : direction === 'row' ? [-9, 0] : [0, -7],
67
+ offset: expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? [TABLE_MENU_OFFSET, 0] : direction === 'row' ? [-9, 0] : [0, -7],
66
68
  stick: true
67
- }, expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? /*#__PURE__*/React.createElement(RowMenu, {
68
- api: api
69
+ }, expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? /*#__PURE__*/React.createElement(TableMenu, {
70
+ api: api,
71
+ surface: direction === 'row' ? ROW_MENU : COLUMN_MENU
69
72
  }) : /*#__PURE__*/React.createElement(DragMenu, {
70
73
  editorView: editorView,
71
74
  isOpen: isOpen,
@@ -60,9 +60,9 @@ export default class NumberColumn extends Component {
60
60
  style: {
61
61
  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
62
62
  marginTop: hasHeaderRow && this.props.stickyTop !== undefined ? rowHeights[0] : undefined,
63
- borderLeft: isDragAndDropEnabled && tableActive && !expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true)
63
+ borderLeft: isDragAndDropEnabled && tableActive && !expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ?
64
64
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
65
- ? `1px solid ${tableBorderColor}` : undefined,
65
+ `1px solid ${tableBorderColor}` : undefined,
66
66
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
67
67
  visibility: 'hidden' // Ensure the column is not visible during SSR
68
68
  },
@@ -75,9 +75,9 @@ export default class NumberColumn extends Component {
75
75
  style: {
76
76
  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
77
77
  marginTop: hasHeaderRow && this.props.stickyTop !== undefined ? rowHeights[0] : undefined,
78
- borderLeft: isDragAndDropEnabled && tableActive && !expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true)
78
+ borderLeft: isDragAndDropEnabled && tableActive && !expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ?
79
79
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
80
- ? `1px solid ${tableBorderColor}` : undefined,
80
+ `1px solid ${tableBorderColor}` : undefined,
81
81
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
82
82
  visibility: 'visible'
83
83
  },
@@ -0,0 +1,160 @@
1
+ import React from 'react';
2
+ import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
3
+ import { AddColumnLeftItem } from './items/AddColumnLeftItem';
4
+ import { AddColumnRightItem } from './items/AddColumnRightItem';
5
+ import { DeleteColumnItem } from './items/DeleteColumnItem';
6
+ import { DistributeColumnsItem } from './items/DistributeColumnsItem';
7
+ import { HeaderColumnToggleItem } from './items/HeaderColumnToggleItem';
8
+ import { MoveColumnRightItem } from './items/MoveColumnRightItem';
9
+ import { SortDecreasingItem } from './items/SortDecreasingItem';
10
+ import { SortIncreasingItem } from './items/SortIncreasingItem';
11
+ import { COLUMN_MENU, COLUMN_TOGGLE_SECTION, COLUMN_BACKGROUND_SECTION, COLUMN_SORT_SECTION, COLUMN_ADD_SECTION, COLUMN_DANGER_SECTION, COLUMN_SECTION_RANK, HEADER_COLUMN_TOGGLE_ITEM, SORT_INCREASING_ITEM, SORT_DECREASING_ITEM, ADD_COLUMN_LEFT_ITEM, ADD_COLUMN_RIGHT_ITEM, MOVE_COLUMN_RIGHT_ITEM, DISTRIBUTE_COLUMNS_ITEM, DELETE_COLUMN_ITEM, COLUMN_TOGGLE_SECTION_RANK, COLUMN_SORT_SECTION_RANK, COLUMN_ADD_SECTION_RANK, COLUMN_DANGER_SECTION_RANK } from './keys';
12
+
13
+ /**
14
+ * Returns the RegisterComponent[] array defining the column menu surface.
15
+ *
16
+ * This is a **UI-only stub** — all items are always visible with no conditional
17
+ * logic and no wired actions. Functional behaviour (actions, conditional visibility)
18
+ * will be connected in follow-up tickets.
19
+ */
20
+ export const getColumnMenuComponents = () => [
21
+ // --- Menu surface ---
22
+ {
23
+ type: COLUMN_MENU.type,
24
+ key: COLUMN_MENU.key
25
+ },
26
+ // --- Toggle section (Header column) ---
27
+ {
28
+ type: COLUMN_TOGGLE_SECTION.type,
29
+ key: COLUMN_TOGGLE_SECTION.key,
30
+ parents: [{
31
+ type: COLUMN_MENU.type,
32
+ key: COLUMN_MENU.key,
33
+ rank: COLUMN_SECTION_RANK[COLUMN_TOGGLE_SECTION.key]
34
+ }],
35
+ component: props => /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, null, props.children)
36
+ }, {
37
+ type: HEADER_COLUMN_TOGGLE_ITEM.type,
38
+ key: HEADER_COLUMN_TOGGLE_ITEM.key,
39
+ parents: [{
40
+ type: COLUMN_TOGGLE_SECTION.type,
41
+ key: COLUMN_TOGGLE_SECTION.key,
42
+ rank: COLUMN_TOGGLE_SECTION_RANK[HEADER_COLUMN_TOGGLE_ITEM.key]
43
+ }],
44
+ component: () => /*#__PURE__*/React.createElement(HeaderColumnToggleItem, null)
45
+ },
46
+ // --- Background color section ---
47
+ {
48
+ type: COLUMN_BACKGROUND_SECTION.type,
49
+ key: COLUMN_BACKGROUND_SECTION.key,
50
+ parents: [{
51
+ type: COLUMN_MENU.type,
52
+ key: COLUMN_MENU.key,
53
+ rank: COLUMN_SECTION_RANK[COLUMN_BACKGROUND_SECTION.key]
54
+ }],
55
+ component: props => /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
56
+ hasSeparator: true
57
+ }, props.children)
58
+ },
59
+ // --- Sort section ---
60
+ {
61
+ type: COLUMN_SORT_SECTION.type,
62
+ key: COLUMN_SORT_SECTION.key,
63
+ parents: [{
64
+ type: COLUMN_MENU.type,
65
+ key: COLUMN_MENU.key,
66
+ rank: COLUMN_SECTION_RANK[COLUMN_SORT_SECTION.key]
67
+ }],
68
+ component: props => /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
69
+ hasSeparator: true
70
+ }, props.children)
71
+ }, {
72
+ type: SORT_INCREASING_ITEM.type,
73
+ key: SORT_INCREASING_ITEM.key,
74
+ parents: [{
75
+ type: COLUMN_SORT_SECTION.type,
76
+ key: COLUMN_SORT_SECTION.key,
77
+ rank: COLUMN_SORT_SECTION_RANK[SORT_INCREASING_ITEM.key]
78
+ }],
79
+ component: () => /*#__PURE__*/React.createElement(SortIncreasingItem, null)
80
+ }, {
81
+ type: SORT_DECREASING_ITEM.type,
82
+ key: SORT_DECREASING_ITEM.key,
83
+ parents: [{
84
+ type: COLUMN_SORT_SECTION.type,
85
+ key: COLUMN_SORT_SECTION.key,
86
+ rank: COLUMN_SORT_SECTION_RANK[SORT_DECREASING_ITEM.key]
87
+ }],
88
+ component: () => /*#__PURE__*/React.createElement(SortDecreasingItem, null)
89
+ },
90
+ // --- Add / Move section ---
91
+ {
92
+ type: COLUMN_ADD_SECTION.type,
93
+ key: COLUMN_ADD_SECTION.key,
94
+ parents: [{
95
+ type: COLUMN_MENU.type,
96
+ key: COLUMN_MENU.key,
97
+ rank: COLUMN_SECTION_RANK[COLUMN_ADD_SECTION.key]
98
+ }],
99
+ component: props => /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
100
+ hasSeparator: true
101
+ }, props.children)
102
+ }, {
103
+ type: ADD_COLUMN_LEFT_ITEM.type,
104
+ key: ADD_COLUMN_LEFT_ITEM.key,
105
+ parents: [{
106
+ type: COLUMN_ADD_SECTION.type,
107
+ key: COLUMN_ADD_SECTION.key,
108
+ rank: COLUMN_ADD_SECTION_RANK[ADD_COLUMN_LEFT_ITEM.key]
109
+ }],
110
+ component: () => /*#__PURE__*/React.createElement(AddColumnLeftItem, null)
111
+ }, {
112
+ type: ADD_COLUMN_RIGHT_ITEM.type,
113
+ key: ADD_COLUMN_RIGHT_ITEM.key,
114
+ parents: [{
115
+ type: COLUMN_ADD_SECTION.type,
116
+ key: COLUMN_ADD_SECTION.key,
117
+ rank: COLUMN_ADD_SECTION_RANK[ADD_COLUMN_RIGHT_ITEM.key]
118
+ }],
119
+ component: () => /*#__PURE__*/React.createElement(AddColumnRightItem, null)
120
+ }, {
121
+ type: MOVE_COLUMN_RIGHT_ITEM.type,
122
+ key: MOVE_COLUMN_RIGHT_ITEM.key,
123
+ parents: [{
124
+ type: COLUMN_ADD_SECTION.type,
125
+ key: COLUMN_ADD_SECTION.key,
126
+ rank: COLUMN_ADD_SECTION_RANK[MOVE_COLUMN_RIGHT_ITEM.key]
127
+ }],
128
+ component: () => /*#__PURE__*/React.createElement(MoveColumnRightItem, null)
129
+ }, {
130
+ type: DISTRIBUTE_COLUMNS_ITEM.type,
131
+ key: DISTRIBUTE_COLUMNS_ITEM.key,
132
+ parents: [{
133
+ type: COLUMN_ADD_SECTION.type,
134
+ key: COLUMN_ADD_SECTION.key,
135
+ rank: COLUMN_ADD_SECTION_RANK[DISTRIBUTE_COLUMNS_ITEM.key]
136
+ }],
137
+ component: () => /*#__PURE__*/React.createElement(DistributeColumnsItem, null)
138
+ },
139
+ // --- Danger section (Clear cells, Delete column) ---
140
+ {
141
+ type: COLUMN_DANGER_SECTION.type,
142
+ key: COLUMN_DANGER_SECTION.key,
143
+ parents: [{
144
+ type: COLUMN_MENU.type,
145
+ key: COLUMN_MENU.key,
146
+ rank: COLUMN_SECTION_RANK[COLUMN_DANGER_SECTION.key]
147
+ }],
148
+ component: props => /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
149
+ hasSeparator: true
150
+ }, props.children)
151
+ }, {
152
+ type: DELETE_COLUMN_ITEM.type,
153
+ key: DELETE_COLUMN_ITEM.key,
154
+ parents: [{
155
+ type: COLUMN_DANGER_SECTION.type,
156
+ key: COLUMN_DANGER_SECTION.key,
157
+ rank: COLUMN_DANGER_SECTION_RANK[DELETE_COLUMN_ITEM.key]
158
+ }],
159
+ component: () => /*#__PURE__*/React.createElement(DeleteColumnItem, null)
160
+ }];
@@ -0,0 +1,21 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl';
3
+ import { addColumnBefore, tooltip } from '@atlaskit/editor-common/keymaps';
4
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
5
+ import { TableColumnAddLeftIcon, ToolbarDropdownItem, ToolbarKeyboardShortcutHint } from '@atlaskit/editor-toolbar';
6
+ export const AddColumnLeftItem = () => {
7
+ var _tooltip;
8
+ const {
9
+ formatMessage
10
+ } = useIntl();
11
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
12
+ elemBefore: /*#__PURE__*/React.createElement(TableColumnAddLeftIcon, {
13
+ color: "currentColor",
14
+ label: "",
15
+ size: "small"
16
+ }),
17
+ elemAfter: /*#__PURE__*/React.createElement(ToolbarKeyboardShortcutHint, {
18
+ shortcut: (_tooltip = tooltip(addColumnBefore)) !== null && _tooltip !== void 0 ? _tooltip : ''
19
+ })
20
+ }, formatMessage(messages.addColumnLeft));
21
+ };
@@ -0,0 +1,21 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl';
3
+ import { addColumnAfter, tooltip } from '@atlaskit/editor-common/keymaps';
4
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
5
+ import { TableColumnAddRightIcon, ToolbarDropdownItem, ToolbarKeyboardShortcutHint } from '@atlaskit/editor-toolbar';
6
+ export const AddColumnRightItem = () => {
7
+ var _tooltip;
8
+ const {
9
+ formatMessage
10
+ } = useIntl();
11
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
12
+ elemBefore: /*#__PURE__*/React.createElement(TableColumnAddRightIcon, {
13
+ color: "currentColor",
14
+ label: "",
15
+ size: "small"
16
+ }),
17
+ elemAfter: /*#__PURE__*/React.createElement(ToolbarKeyboardShortcutHint, {
18
+ shortcut: (_tooltip = tooltip(addColumnAfter)) !== null && _tooltip !== void 0 ? _tooltip : ''
19
+ })
20
+ }, formatMessage(messages.addColumnRight));
21
+ };
@@ -0,0 +1,23 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl';
3
+ import { deleteColumn, tooltip } from '@atlaskit/editor-common/keymaps';
4
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
5
+ import { DeleteIcon, ToolbarDropdownItem, ToolbarKeyboardShortcutHint } from '@atlaskit/editor-toolbar';
6
+ export const DeleteColumnItem = () => {
7
+ var _tooltip;
8
+ const {
9
+ formatMessage
10
+ } = useIntl();
11
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
12
+ elemBefore: /*#__PURE__*/React.createElement(DeleteIcon, {
13
+ color: "currentColor",
14
+ label: "",
15
+ size: "small"
16
+ }),
17
+ elemAfter: /*#__PURE__*/React.createElement(ToolbarKeyboardShortcutHint, {
18
+ shortcut: (_tooltip = tooltip(deleteColumn)) !== null && _tooltip !== void 0 ? _tooltip : ''
19
+ })
20
+ }, formatMessage(messages.removeColumns, {
21
+ 0: 1
22
+ }));
23
+ };
@@ -0,0 +1,16 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl';
3
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
4
+ import { TableColumnsDistributeIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ export const DistributeColumnsItem = () => {
6
+ const {
7
+ formatMessage
8
+ } = useIntl();
9
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
10
+ elemBefore: /*#__PURE__*/React.createElement(TableColumnsDistributeIcon, {
11
+ color: "currentColor",
12
+ label: "",
13
+ size: "small"
14
+ })
15
+ }, formatMessage(messages.distributeColumns));
16
+ };
@@ -0,0 +1,17 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl';
3
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
4
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ import Toggle from '@atlaskit/toggle';
6
+ export const HeaderColumnToggleItem = () => {
7
+ const {
8
+ formatMessage
9
+ } = useIntl();
10
+ const label = formatMessage(messages.headerColumn);
11
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
12
+ elemAfter: /*#__PURE__*/React.createElement(Toggle, {
13
+ label: label,
14
+ isChecked: false
15
+ })
16
+ }, label);
17
+ };
@@ -0,0 +1,25 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl';
3
+ import { moveColumnRight, moveColumnRightOld, tooltip } from '@atlaskit/editor-common/keymaps';
4
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
5
+ import { TableColumnMoveRightIcon, ToolbarDropdownItem, ToolbarKeyboardShortcutHint } from '@atlaskit/editor-toolbar';
6
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
7
+ const getMoveColumnRightShortcut = () => tooltip(expValEquals('editor-a11y-fy26-keyboard-move-row-column', 'isEnabled', true) ? moveColumnRight : moveColumnRightOld);
8
+ export const MoveColumnRightItem = () => {
9
+ var _getMoveColumnRightSh;
10
+ const {
11
+ formatMessage
12
+ } = useIntl();
13
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
14
+ elemBefore: /*#__PURE__*/React.createElement(TableColumnMoveRightIcon, {
15
+ color: "currentColor",
16
+ label: "",
17
+ size: "small"
18
+ }),
19
+ elemAfter: /*#__PURE__*/React.createElement(ToolbarKeyboardShortcutHint, {
20
+ shortcut: (_getMoveColumnRightSh = getMoveColumnRightShortcut()) !== null && _getMoveColumnRightSh !== void 0 ? _getMoveColumnRightSh : ''
21
+ })
22
+ }, formatMessage(messages.moveColumnRight, {
23
+ 0: 1
24
+ }));
25
+ };
@@ -0,0 +1,17 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl';
3
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
4
+ import { ArrowDownIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ export const SortDecreasingItem = () => {
6
+ const {
7
+ formatMessage
8
+ } = useIntl();
9
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
10
+ isDisabled: true,
11
+ elemBefore: /*#__PURE__*/React.createElement(ArrowDownIcon, {
12
+ color: "currentColor",
13
+ label: "",
14
+ size: "small"
15
+ })
16
+ }, formatMessage(messages.sortColumnDecreasing));
17
+ };
@@ -0,0 +1,17 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl';
3
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
4
+ import { ArrowUpIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ export const SortIncreasingItem = () => {
6
+ const {
7
+ formatMessage
8
+ } = useIntl();
9
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
10
+ isDisabled: true,
11
+ elemBefore: /*#__PURE__*/React.createElement(ArrowUpIcon, {
12
+ color: "currentColor",
13
+ label: "",
14
+ size: "small"
15
+ })
16
+ }, formatMessage(messages.sortColumnIncreasing));
17
+ };