npm - @atlaskit/editor-plugin-table - Versions diffs - 7.6.2 → 7.6.3 - Mend

@atlaskit/editor-plugin-table 7.6.2 → 7.6.3

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 (93) hide show

package/dist/esm/ui/common-styles.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
 /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression */
 import { css } from '@emotion/react';
@@ -65,10 +65,15 @@ var tableWrapperStyles = function tableWrapperStyles() {
   }
 };
+// re-exporting these styles to use in Gemini test when table node view is rendered outside of PM
+export var baseTableStyles = function baseTableStyles(props) {
+  var _props$featureFlags, _props$featureFlags2, _props$featureFlags3, _props$featureFlags4;
+  return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n\n  .", " {\n    margin-bottom: 0;\n  }\n\n  .", " {\n    td.", ", th.", " {\n      position: relative;\n      overflow: visible;\n    }\n\n    td.", " {\n      background-color: ", ";\n\n      // ED-15246: Trello card is visible through a border of a table border\n      // This fixes a border issue caused by relative positioned table cells\n      &::after {\n        height: 100%;\n        content: '';\n        border-left: 1px solid ", ";\n        border-bottom: 1px solid ", ";\n        position: absolute;\n        right: 0px;\n        top: 0px;\n        bottom: 0;\n        width: 100%;\n        display: inline-block;\n        pointer-events: none;\n      }\n    }\n  }\n\n  .", " {\n    ", "\n  }\n\n  .", " {\n    ", "\n  }\n\n  ", "\n\n  ", "\n\n    /* Delete button */\n    ", "\n    /* Ends Delete button */\n\n    /* sticky styles */\n    .", " .", " .", ":first-of-type {\n    margin-top: ", "px;\n    width: ", "px;\n\n    position: fixed !important;\n    z-index: ", " !important;\n    box-shadow: 0px -", "px ", ";\n    border-right: 0 none;\n    /* top set by NumberColumn component */\n  }\n\n  .", " .", ".sticky {\n    position: fixed !important;\n    /* needs to be above row controls */\n    z-index: ", " !important;\n    background: ", ";\n\n    width: ", "px;\n    height: ", "px;\n  }\n\n  .", ".sticky .", " {\n    border-bottom: 0px none;\n    border-right: 0px none;\n\n    height: ", "px;\n    width: ", "px;\n  }\n\n  ", "\n\n  ", "\n\n    .", "\n      .", "\n      .", ".sticky {\n    position: fixed !important;\n    z-index: ", " !important;\n    display: flex;\n    border-left: ", "px solid\n      ", ";\n    margin-left: -", "px;\n  }\n\n  .", " col:first-of-type {\n    /* moving rows out of a table layout does weird things in Chrome */\n    border-right: 1px solid ", ";\n  }\n\n  tr.sticky {\n    padding-top: ", "px;\n    position: fixed;\n    display: grid;\n\n    /* to keep it above cell selection but below date and other nodes popups that are inside sticky header */\n    z-index: ", ";\n\n    overflow-y: visible;\n    overflow-x: hidden;\n\n    grid-auto-flow: column;\n\n    /* background for where controls apply */\n    background: ", ";\n    box-sizing: content-box;\n\n    margin-top: 2px;\n\n    box-shadow: 0 6px 4px -4px ", ";\n    margin-left: -1px;\n\n    &.no-pointer-events {\n      pointer-events: none;\n    }\n  }\n\n  .", " .", " {\n    left: unset;\n    position: fixed;\n    /* needs to be above sticky header row and below date and other nodes popups that are inside sticky header */\n    z-index: ", ";\n  }\n\n  .", ".", "\n    .", " {\n    padding-bottom: ", "px;\n  }\n\n  tr.sticky th {\n    border-bottom: ", "px solid ", ";\n    margin-right: -1px;\n  }\n\n  .", " tr.sticky > th:last-child {\n    border-right-width: 1px;\n  }\n\n  /* add left edge for first cell */\n  .", " tr.sticky > th:first-of-type {\n    margin-left: 0px;\n  }\n\n  /* add a little bit so the scroll lines up with the table */\n  .", " tr.sticky::after {\n    content: ' ';\n    width: ", "px;\n  }\n\n  /* To fix jumpiness caused in Chrome Browsers for sticky headers */\n  .", " .sticky + tr {\n    min-height: 0px;\n  }\n\n  /* move resize line a little in sticky bar */\n  .", ".", " {\n    tr.sticky\n      td.", ",\n      tr.sticky\n      th.", " {\n      .", "::after {\n        right: ", "px;\n      }\n    }\n\n    /* when selected put it back to normal -- :not selector would be nicer */\n    tr.sticky\n      td.", ".", ",\n      tr.sticky\n      th.", ".", " {\n      .", "::after {\n        right: ", "px;\n      }\n    }\n  }\n\n  tr.sticky .", ", tr.sticky .", " {\n    z-index: 1;\n  }\n\n  .", " tr.sticky {\n    padding-top: ", "px;\n  }\n\n  .", ".", "\n    .", "\n    .", ":first-of-type {\n    margin-top: ", "px;\n  }\n\n  .", ".sticky {\n    border-top: ", "px solid\n      ", ";\n  }\n\n  ", "\n  ", "\n    ", "\n\n    .", " .", " {\n    height: 0; // stop overflow flash & set correct height in update-overflow-shadows.ts\n  }\n\n  .less-padding {\n    padding: 0 ", "px;\n\n    .", ",\n      .", " {\n      padding: 0 ", "px;\n\n      // https://product-fabric.atlassian.net/browse/ED-16386\n      // Fixes issue where the extra padding that is added here throws off the position\n      // of the rows control dot\n      &::after {\n        right: 6px !important;\n      }\n    }\n\n    .", " {\n      padding: 0 ", "px;\n    }\n\n    &.", "[data-number-column='true'] {\n      padding-left: ", "px;\n    }\n    .", ", .", " {\n      width: ", "px;\n    }\n\n    .", " {\n      left: 6px;\n    }\n\n    .", " {\n      left: calc(100% - 6px);\n    }\n  }\n\n  > .", " {\n    /**\n       * Prevent margins collapsing, aids with placing the gap-cursor correctly\n       * @see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing\n       *\n       * TODO: Enable this, many tests will fail!\n       * border-top: 1px solid transparent;\n       */\n  }\n\n  /* Breakout only works on top level unless wrapped in fragment mark */\n  ", "\n\n  ", ";\n  ", ";\n\n  /* Corner controls */\n  .", " {\n    width: ", "px;\n    height: ", "px;\n    display: none;\n\n    .", " {\n      position: relative;\n\n      ", ";\n    }\n  }\n\n  .", ".sticky {\n    .", " {\n      /* sticky row insert dot overlaps other row insert and messes things up */\n      display: none !important;\n    }\n  }\n\n  .", " {\n    position: absolute;\n    top: 0;\n    width: ", "px;\n    height: ", "px;\n    border: 1px solid ", ";\n    border-radius: 0;\n    border-top-left-radius: ", "px;\n    background: ", ";\n    box-sizing: border-box;\n    padding: 0;\n    :focus {\n      outline: none;\n    }\n  }\n  .active .", " {\n    border-color: ", ";\n    background: ", ";\n  }\n\n  .", "[data-number-column='true'] {\n    .", ", .", " {\n      width: ", "px;\n    }\n    .", " .", " {\n      border-right-width: 0;\n    }\n  }\n\n  :not(.", ") .", ":hover {\n    border-color: ", ";\n    background: ", ";\n    cursor: pointer;\n  }\n\n  :not(.", ")\n    .", ".", " {\n    border-color: ", ";\n    background: ", ";\n  }\n\n  /* Row controls */\n  .", " {\n    width: ", "px;\n    box-sizing: border-box;\n    display: none;\n    position: relative;\n\n    ", ";\n\n    .", " {\n      display: flex;\n      flex-direction: column;\n    }\n    .", ":last-child > button {\n      border-bottom-left-radius: ", "px;\n    }\n    .", " {\n      position: relative;\n      margin-top: -1px;\n    }\n    .", ":hover,\n      .", ".active,\n      .", ":hover {\n      z-index: ", ";\n    }\n\n    ", "\n  }\n\n  .", " {\n    display: grid;\n    align-items: center;\n    position: absolute;\n    z-index: ", ";\n\n    .", " {\n      position: absolute;\n      align-self: end;\n      height: 100%;\n      width: 18px;\n    }\n\n    .", " {\n      position: absolute;\n      bottom: -3px;\n      left: 2px;\n      background-color: ", ";\n      height: 4px;\n      width: 4px;\n      border-radius: 50%;\n      pointer-events: none;\n    }\n  }\n\n  .", " {\n    .", " {\n      height: 24px;\n      position: absolute;\n      top: ", ";\n      z-index: ", ";\n    }\n\n    .", " {\n      position: absolute;\n      height: 24px;\n      width: 100%;\n    }\n\n    .", " {\n      background-color: ", ";\n      height: 4px;\n      width: 4px;\n      border-radius: 50%;\n      position: absolute;\n      right: -2px;\n    }\n  }\n\n  .", " {\n    background: none;\n    border: none;\n    outline: none;\n    position: absolute;\n    margin: 0;\n    padding: 0;\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n\n    :focus {\n      outline: none;\n    }\n  }\n\n  .", " {\n    cursor: grab;\n    pointer-events: auto;\n\n    line-height: 0;\n    padding: 0;\n    border-radius: 6px;\n    width: max-content;\n    border: 2px solid ", ";\n\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background: transparent;\n    outline: none;\n\n    &.placeholder {\n      background-color: transparent;\n      border: 2px solid transparent;\n    }\n\n    &.", " {\n      cursor: pointer;\n      & svg {\n        & > rect.", " {\n          fill: ", ";\n        }\n        & > rect {\n          fill: ", ";\n        }\n        & > g > rect {\n          fill: ", ";\n        }\n      }\n    }\n\n    &:not(.", ") {\n      & svg {\n        rect {\n          fill: ", ";\n        }\n        g {\n          fill: ", ";\n        }\n      }\n\n      &:hover {\n        svg {\n          rect {\n            fill: ", ";\n          }\n          g {\n            fill: ", ";\n          }\n        }\n      }\n\n      &:active {\n        cursor: grabbing;\n      }\n\n      &.selected {\n        :focus {\n          outline: 2px solid ", ";\n          outline-offset: 1px;\n        }\n\n        &:active {\n          outline: none;\n        }\n\n        svg {\n          rect {\n            fill: ", ";\n          }\n          g {\n            fill: ", ";\n          }\n        }\n      }\n\n      &.danger {\n        svg {\n          rect {\n            fill: ", ";\n          }\n          g {\n            fill: ", ";\n          }\n        }\n      }\n    }\n  }\n\n  ", "\n\n  :not(.", ") .", " {\n    ", "\n    ", "\n  }\n\n  /* Numbered column */\n  .", " {\n    position: relative;\n    float: right;\n    margin-left: ", "px;\n    top: ", "px;\n    width: ", "px;\n    box-sizing: border-box;\n  }\n\n  .", " {\n    border: 1px solid ", ";\n    box-sizing: border-box;\n    margin-top: -1px;\n    padding-bottom: 2px;\n    padding: 10px 2px;\n    text-align: center;\n    font-size: ", ";\n    background-color: ", ";\n    color: ", ";\n    border-color: ", ";\n\n    :first-child:not(style),\n    style:first-child + * {\n      margin-top: 0;\n    }\n    :last-child {\n      border-bottom: 1px solid ", ";\n    }\n  }\n\n  // add a background above the first numbered column cell when sticky header is engaged\n  // which hides the table when scrolling\n  .", " {\n    .", ":first-of-type::after {\n      content: '';\n      display: block;\n      height: 33px;\n      width: 100%;\n      background-color: ", ";\n      position: absolute;\n\n      // the extra pixel is accounting for borders\n      top: -34px;\n      left: -1px;\n    }\n  }\n\n  .", " {\n    .", ", .", " {\n      display: block;\n    }\n    .", " {\n      padding-left: ", "px;\n\n      .", " {\n        border-left: 0 none;\n      }\n\n      .", ".active {\n        border-bottom: 1px solid ", ";\n        border-color: ", ";\n        background-color: ", ";\n        position: relative;\n        z-index: ", ";\n        color: ", ";\n      }\n    }\n  }\n  :not(.", ") .", " {\n    .", ":not(.", ") {\n      cursor: pointer;\n    }\n    .", ":not(.", "):hover {\n      border-bottom: 1px solid ", ";\n      border-color: ", ";\n      background-color: ", ";\n      position: relative;\n      z-index: ", ";\n      color: ", ";\n    }\n    .", ".", " {\n      background-color: ", ";\n      border: 1px solid ", ";\n      border-left: 0;\n      color: ", ";\n      position: relative;\n      z-index: ", ";\n    }\n  }\n\n  /* Table */\n  .", " > table {\n    table-layout: fixed;\n    white-space: normal;\n    border-top: none;\n    // 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212\n    margin-right: -1px;\n    // Allows better positioning for the shadow sentinels - ED-16668\n    position: relative;\n\n    > tbody > tr {\n      white-space: pre-wrap;\n    }\n\n    .", " + * {\n      margin-top: 0;\n    }\n\n    /*\n       * Headings have a top margin by default, but we don't want this on the\n       * first heading within table header cells.\n       *\n       * This specifically sets margin-top for the first heading within a header\n       * cell when center/right aligned.\n       */\n    th.", " > .fabric-editor-block-mark {\n      > h1:first-of-type,\n      > h2:first-of-type,\n      > h3:first-of-type,\n      > h4:first-of-type,\n      > h5:first-of-type,\n      > h6:first-of-type {\n        margin-top: 0;\n      }\n    }\n\n    .", ", .", " {\n      position: relative;\n    }\n    /* Give selected cells a blue overlay */\n    .", "::after,\n      .", "::after {\n      z-index: ", ";\n      position: absolute;\n      content: '';\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      width: 100%;\n      pointer-events: none;\n    }\n    .", " {\n      border: 1px solid ", ";\n    }\n    .", "::after {\n      background: ", ";\n      z-index: ", ";\n    }\n    th.", "::after,\n      td.", "::after {\n      background: ", ";\n      z-index: ", ";\n    }\n    // ED-15246: Trello card is visible through a border of a table border\n    /* ED-19064: To fix when enable header column in the table,\n       and selection the header column, the right border is not tableBorderSelectedColor\n       when deleting the header column, the right border is not tableToolbarDeleteColor */\n    td.", ",\n      td.", ",\n      th.", ".", ",\n      th.", ".", " {\n      &::after {\n        height: 100%;\n        width: 100%;\n        border: 1px solid ", ";\n        content: '';\n        position: absolute;\n        left: -1px;\n        top: -1px;\n        bottom: 0;\n        z-index: ", ";\n        display: inline-block;\n        pointer-events: none;\n      }\n      &.", "::after {\n        ", ";\n        z-index: ", ";\n      }\n\n      &.", ".", "::after {\n        ", ";\n        z-index: ", ";\n      }\n    }\n  }\n\n  // override for DnD controls\n  .", " {\n    position: absolute;\n    margin-top: ", "px;\n    left: -", "px;\n    z-index: ", ";\n  }\n\n  .", " {\n    position: absolute;\n    /* top of corner control is table margin top - corner control height + 1 pixel of table border. */\n    top: ", "px;\n    left: -", "px;\n  }\n\n  .", ".", ",\n    .", ".", " {\n    z-index: ", ";\n  }\n\n  .", " {\n    position: absolute;\n    top: ", "px;\n  }\n\n  .", " .", " {\n    position: fixed;\n    /* higher zIndex than sticky header which is akEditorTableCellOnStickyHeaderZIndex - 5 */\n    z-index: ", ";\n  }\n\n  ", "\n"])), tableSharedStyle(), columnControlsLineMarker(), hoveredDeleteButton(), hoveredCell(), hoveredWarningCell, ((_props$featureFlags = props.featureFlags) === null || _props$featureFlags === void 0 ? void 0 : _props$featureFlags.tableDragAndDrop) && insertLine(), resizeHandle((_props$featureFlags2 = props.featureFlags) === null || _props$featureFlags2 === void 0 ? void 0 : _props$featureFlags2.tableDragAndDrop), rangeSelectionStyles, ClassName.LAST_ITEM_IN_CELL, ClassName.TABLE_NODE_WRAPPER, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.TABLE_CELL, tableCellBackgroundColor, tableBorderColor, tableBorderColor, ClassName.CONTROLS_FLOATING_BUTTON_COLUMN, insertColumnButtonWrapper(), ClassName.CONTROLS_FLOATING_BUTTON_ROW, insertRowButtonWrapper(), dragInsertButtonWrapper(), dragCornerControlButton(), DeleteButton(), ClassName.TABLE_STICKY, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, stickyRowOffsetTop + 2, akEditorTableNumberColumnWidth, akEditorStickyHeaderZIndex, stickyRowOffsetTop, "var(--ds-surface, white)", ClassName.TABLE_STICKY, ClassName.CORNER_CONTROLS, akEditorSmallZIndex, "var(--ds-surface, white)", tableToolbarSize, tableToolbarSize, ClassName.CORNER_CONTROLS, ClassName.CONTROLS_CORNER_BUTTON, tableToolbarSize, tableToolbarSize, tableStickyHeaderColumnControlsDecorationsStyle(), tableStickyHeaderFirefoxFixStyle(), ClassName.TABLE_STICKY, ClassName.ROW_CONTROLS, ClassName.ROW_CONTROLS_BUTTON_WRAP, akEditorStickyHeaderZIndex, tableToolbarSize, "var(--ds-surface, white)", tableToolbarSize, ClassName.TABLE_STICKY, "var(--ds-surface, green)", stickyRowOffsetTop, akEditorTableCellOnStickyHeaderZIndex - 5, "var(--ds-surface, white)", "var(--ds-shadow-overflow-perimeter, ".concat(N40A, ")"), ClassName.TABLE_STICKY, ClassName.TABLE_STICKY_SHADOW, akEditorTableCellOnStickyHeaderZIndex, ClassName.WITH_CONTROLS, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY_SHADOW, tableToolbarSize, stickyHeaderBorderBottomWidth, tableBorderColor, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY, insertColumnButtonOffset + 1, ClassName.TABLE_STICKY, ClassName.TABLE_CONTAINER, ClassName.TABLE_STICKY, ClassName.WITH_RESIZE_LINE, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, (resizeHandlerAreaWidth - resizeLineWidth) / 2 + 1, ClassName.WITH_RESIZE_LINE, ClassName.SELECTED_CELL, ClassName.WITH_RESIZE_LINE, ClassName.SELECTED_CELL, ClassName.RESIZE_HANDLE_DECORATION, (resizeHandlerAreaWidth - resizeLineWidth) / 2, ClassName.HOVERED_CELL, ClassName.SELECTED_CELL, ClassName.WITH_CONTROLS, tableControlsSpacing, ClassName.WITH_CONTROLS, ClassName.TABLE_STICKY, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, tableControlsSpacing + 2, ClassName.CORNER_CONTROLS, tableControlsSpacing - tableToolbarSize + 2, "var(--ds-surface, white)", sentinelStyles, OverflowShadow((_props$featureFlags3 = props.featureFlags) === null || _props$featureFlags3 === void 0 ? void 0 : _props$featureFlags3.tableDragAndDrop), stickyScrollbarStyles(props.featureFlags), ClassName.TABLE_STICKY, ClassName.TABLE_STICKY_SHADOW, tablePadding, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.ROW_CONTROLS_WRAPPER, tablePadding, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tablePadding, ClassName.TABLE_CONTAINER, akEditorTableNumberColumnWidth + tablePadding - 1, ClassName.TABLE_LEFT_SHADOW, ClassName.TABLE_RIGHT_SHADOW, tableOverflowShadowWidth, ClassName.TABLE_LEFT_SHADOW, ClassName.TABLE_RIGHT_SHADOW, ClassName.NODEVIEW_WRAPPER, breakoutWidthStyling(), columnControlsDecoration(), rowControlsWrapperDotStyle(), ClassName.CORNER_CONTROLS, tableToolbarSize + 1, cornerControlHeight, ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, InsertMarker("\n          left: -11px;\n          top: 9px;\n        "), ClassName.CORNER_CONTROLS, ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, ClassName.CONTROLS_CORNER_BUTTON, tableToolbarSize + 1, tableToolbarSize + 1, tableBorderColor, tableBorderRadiusSize, tableHeaderCellBackgroundColor, ClassName.CONTROLS_CORNER_BUTTON, tableBorderSelectedColor, tableToolbarSelectedColor, ClassName.TABLE_CONTAINER, ClassName.CORNER_CONTROLS, ClassName.CONTROLS_CORNER_BUTTON, getBooleanFF('platform.editor.custom-table-width') ? akEditorTableToolbarSize + akEditorTableNumberColumnWidth + 1 : akEditorTableToolbarSize + akEditorTableNumberColumnWidth, ClassName.ROW_CONTROLS, ClassName.CONTROLS_BUTTON, ClassName.IS_RESIZING, ClassName.CONTROLS_CORNER_BUTTON, tableBorderSelectedColor, tableToolbarSelectedColor, ClassName.IS_RESIZING, ClassName.CONTROLS_CORNER_BUTTON, ClassName.HOVERED_CELL_IN_DANGER, tableBorderDeleteColor, tableToolbarDeleteColor, ClassName.ROW_CONTROLS, tableToolbarSize, InsertMarker("\n        bottom: -1px;\n        left: -11px;\n      "), ClassName.ROW_CONTROLS_INNER, ClassName.ROW_CONTROLS_BUTTON_WRAP, tableBorderRadiusSize, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.CONTROLS_BUTTON, akEditorUnitZIndex, HeaderButton("\n        border-bottom: 1px solid ".concat(tableBorderColor, ";\n        border-right: 0px;\n        border-radius: 0;\n        height: 100%;\n        width: ").concat(tableToolbarSize, "px;\n\n        .").concat(ClassName.CONTROLS_BUTTON_OVERLAY, " {\n          position: absolute;\n          width: 30px;\n          height: 50%;\n          right: 0;\n          bottom: 0;\n        }\n        .").concat(ClassName.CONTROLS_BUTTON_OVERLAY, ":first-of-type {\n          top: 0;\n        }\n      ")), ClassName.DRAG_ROW_CONTROLS, akEditorUnitZIndex, ClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER, ClassName.DRAG_ROW_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #C1C7D0)", ClassName.DRAG_COLUMN_CONTROLS, ClassName.DRAG_COLUMN_CONTROLS_INNER, "var(--ds-space-negative-150, -12px)", resizeHandlerZIndex, ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER, ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #C1C7D0)", ClassName.DRAG_HANDLE_BUTTON_CLICKABLE_ZONE, ClassName.DRAG_HANDLE_BUTTON_CONTAINER, "var(--ds-surface, ".concat(N0, ")"), ClassName.DRAG_HANDLE_DISABLED, ClassName.DRAG_HANDLE_MINIMISED, "var(--ds-background-accent-gray-subtler, #DCDFE4)", "var(--ds-background-accent-gray-subtlest, #F4F5F7)", "var(--ds-icon-disabled, #BFDBF847)", ClassName.DRAG_HANDLE_DISABLED, "var(--ds-background-accent-gray-subtler, #DCDFE4)", "var(--ds-icon-subtle, #626f86)", "var(--ds-background-accent-blue-subtle, #579DFF)", "var(--ds-icon-inverse, #FFF)", "var(--ds-border-focused, #2684FF)", "var(--ds-background-accent-blue-subtle, #579dff)", "var(--ds-icon-inverse, #fff)", "var(--ds-background-accent-red-subtler-pressed, #F87462)", "var(--ds-border-inverse, #FFF)", floatingColumnControls(), ClassName.IS_RESIZING, ClassName.ROW_CONTROLS, HeaderButtonHover(), HeaderButtonDanger(), ClassName.NUMBERED_COLUMN, getBooleanFF('platform.editor.custom-table-width') ? akEditorTableToolbarSize : akEditorTableToolbarSize - 1, (_props$featureFlags4 = props.featureFlags) !== null && _props$featureFlags4 !== void 0 && _props$featureFlags4.tableDragAndDrop ? 0 : akEditorTableToolbarSize, akEditorTableNumberColumnWidth + 1, ClassName.NUMBERED_COLUMN_BUTTON, tableBorderColor, relativeFontSizeToBase16(fontSize()), tableHeaderCellBackgroundColor, tableTextColor, tableBorderColor, tableBorderColor, ClassName.TABLE_STICKY, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, "var(--ds-surface, white)", ClassName.WITH_CONTROLS, ClassName.CORNER_CONTROLS, ClassName.ROW_CONTROLS, ClassName.NUMBERED_COLUMN, getBooleanFF('platform.editor.custom-table-width') ? 0 : 1, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON, tableBorderSelectedColor, tableBorderSelectedColor, tableToolbarSelectedColor, akEditorUnitZIndex, "var(--ds-text-selected, ".concat(N0, ")"), ClassName.IS_RESIZING, ClassName.WITH_CONTROLS, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, tableBorderSelectedColor, tableBorderSelectedColor, tableToolbarSelectedColor, akEditorUnitZIndex, "var(--ds-text-selected, ".concat(N0, ")"), ClassName.NUMBERED_COLUMN_BUTTON, ClassName.HOVERED_CELL_IN_DANGER, tableToolbarDeleteColor, tableBorderDeleteColor, "var(--ds-text-danger, ".concat(R500, ")"), akEditorUnitZIndex, ClassName.TABLE_NODE_WRAPPER, ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, akEditorSmallZIndex, ClassName.SELECTED_CELL, tableBorderSelectedColor, ClassName.SELECTED_CELL, tableCellSelectedColor, akEditorSmallZIndex, ClassName.HOVERED_CELL_IN_DANGER, ClassName.HOVERED_CELL_IN_DANGER, tableCellDeleteColor, akEditorUnitZIndex * 100, ClassName.HOVERED_CELL, ClassName.SELECTED_CELL, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_CELL, tableBorderSelectedColor, akEditorSmallZIndex, ClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), akEditorUnitZIndex * 100, ClassName.HOVERED_NO_HIGHLIGHT, ClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), akEditorUnitZIndex * 100, ClassName.DRAG_ROW_CONTROLS_WRAPPER, tableMarginTop, tableToolbarSize + 1, rowControlsZIndex + 4, ClassName.ROW_CONTROLS_WRAPPER, tableMarginTop - cornerControlHeight + 1, tableToolbarSize, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.TABLE_LEFT_SHADOW, ClassName.ROW_CONTROLS_WRAPPER, ClassName.TABLE_LEFT_SHADOW, akEditorUnitZIndex, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tableMarginTop, ClassName.TABLE_STICKY, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, akEditorTableCellOnStickyHeaderZIndex - 4, tableWrapperStyles());
+};
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4139
 export var tableStyles = function tableStyles(props) {
-  var _props$featureFlags, _props$featureFlags2, _props$featureFlags3, _props$featureFlags4;
-  return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  .", " button {\n    background: ", ";\n    color: ", ";\n    cursor: none;\n  }\n\n  .", ":not(.", ") button:hover {\n    background: ", ";\n    color: ", " !important;\n    cursor: pointer;\n  }\n\n  .ProseMirror {\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n\n    .", " {\n      margin-bottom: 0;\n    }\n\n    .", " {\n      td.", ", th.", " {\n        position: relative;\n        overflow: visible;\n      }\n\n      td.", " {\n        background-color: ", ";\n\n        // ED-15246: Trello card is visible through a border of a table border\n        // This fixes a border issue caused by relative positioned table cells\n        &::after {\n          height: 100%;\n          content: '';\n          border-left: 1px solid ", ";\n          border-bottom: 1px solid ", ";\n          position: absolute;\n          right: 0px;\n          top: 0px;\n          bottom: 0;\n          width: 100%;\n          display: inline-block;\n          pointer-events: none;\n        }\n      }\n    }\n\n    .", " {\n      ", "\n    }\n\n    .", " {\n      ", "\n    }\n\n    ", "\n\n    ", "\n\n    /* Delete button */\n    ", "\n    /* Ends Delete button */\n\n    /* sticky styles */\n    .", " .", " .", ":first-of-type {\n      margin-top: ", "px;\n      width: ", "px;\n\n      position: fixed !important;\n      z-index: ", " !important;\n      box-shadow: 0px -", "px ", ";\n      border-right: 0 none;\n      /* top set by NumberColumn component */\n    }\n\n    .", " .", ".sticky {\n      position: fixed !important;\n      /* needs to be above row controls */\n      z-index: ", " !important;\n      background: ", ";\n\n      width: ", "px;\n      height: ", "px;\n    }\n\n    .", ".sticky .", " {\n      border-bottom: 0px none;\n      border-right: 0px none;\n\n      height: ", "px;\n      width: ", "px;\n    }\n\n    ", "\n\n    ", "\n\n    .", "\n      .", "\n      .", ".sticky {\n      position: fixed !important;\n      z-index: ", " !important;\n      display: flex;\n      border-left: ", "px solid\n        ", ";\n      margin-left: -", "px;\n    }\n\n    .", " col:first-of-type {\n      /* moving rows out of a table layout does weird things in Chrome */\n      border-right: 1px solid ", ";\n    }\n\n    tr.sticky {\n      padding-top: ", "px;\n      position: fixed;\n      display: grid;\n\n      /* to keep it above cell selection but below date and other nodes popups that are inside sticky header */\n      z-index: ", ";\n\n      overflow-y: visible;\n      overflow-x: hidden;\n\n      grid-auto-flow: column;\n\n      /* background for where controls apply */\n      background: ", ";\n      box-sizing: content-box;\n\n      margin-top: 2px;\n\n      box-shadow: 0 6px 4px -4px ", ";\n      margin-left: -1px;\n\n      &.no-pointer-events {\n        pointer-events: none;\n      }\n    }\n\n    .", " .", " {\n      left: unset;\n      position: fixed;\n      /* needs to be above sticky header row and below date and other nodes popups that are inside sticky header */\n      z-index: ", ";\n    }\n\n    .", ".", "\n      .", " {\n      padding-bottom: ", "px;\n    }\n\n    tr.sticky th {\n      border-bottom: ", "px solid\n        ", ";\n      margin-right: -1px;\n    }\n\n    .", " tr.sticky > th:last-child {\n      border-right-width: 1px;\n    }\n\n    /* add left edge for first cell */\n    .", " tr.sticky > th:first-of-type {\n      margin-left: 0px;\n    }\n\n    /* add a little bit so the scroll lines up with the table */\n    .", " tr.sticky::after {\n      content: ' ';\n      width: ", "px;\n    }\n\n    /* To fix jumpiness caused in Chrome Browsers for sticky headers */\n    .", " .sticky + tr {\n      min-height: 0px;\n    }\n\n    /* move resize line a little in sticky bar */\n    .", ".", " {\n      tr.sticky\n        td.", ",\n        tr.sticky\n        th.", " {\n        .", "::after {\n          right: ", "px;\n        }\n      }\n\n      /* when selected put it back to normal -- :not selector would be nicer */\n      tr.sticky\n        td.", ".", ",\n        tr.sticky\n        th.", ".", " {\n        .", "::after {\n          right: ", "px;\n        }\n      }\n    }\n\n    tr.sticky\n      .", ",\n      tr.sticky\n      .", " {\n      z-index: 1;\n    }\n\n    .", " tr.sticky {\n      padding-top: ", "px;\n    }\n\n    .", ".", "\n      .", "\n      .", ":first-of-type {\n      margin-top: ", "px;\n    }\n\n    .", ".sticky {\n      border-top: ", "px solid\n        ", ";\n    }\n\n    ", "\n    ", "\n    ", "\n\n    .", " .", " {\n      height: 0; // stop overflow flash & set correct height in update-overflow-shadows.ts\n    }\n\n    .less-padding {\n      padding: 0 ", "px;\n\n      .", ",\n        .", " {\n        padding: 0 ", "px;\n\n        // https://product-fabric.atlassian.net/browse/ED-16386\n        // Fixes issue where the extra padding that is added here throws off the position\n        // of the rows control dot\n        &::after {\n          right: 6px !important;\n        }\n      }\n\n      .", " {\n        padding: 0 ", "px;\n      }\n\n      &.", "[data-number-column='true'] {\n        padding-left: ", "px;\n      }\n      .", ", .", " {\n        width: ", "px;\n      }\n\n      .", " {\n        left: 6px;\n      }\n\n      .", " {\n        left: calc(100% - 6px);\n      }\n    }\n\n    > .", " {\n      /**\n       * Prevent margins collapsing, aids with placing the gap-cursor correctly\n       * @see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing\n       *\n       * TODO: Enable this, many tests will fail!\n       * border-top: 1px solid transparent;\n       */\n    }\n\n    /* Breakout only works on top level unless wrapped in fragment mark */\n    ", "\n\n    ", ";\n    ", ";\n\n    /* Corner controls */\n    .", " {\n      width: ", "px;\n      height: ", "px;\n      display: none;\n\n      .", " {\n        position: relative;\n\n        ", ";\n      }\n    }\n\n    .", ".sticky {\n      .", " {\n        /* sticky row insert dot overlaps other row insert and messes things up */\n        display: none !important;\n      }\n    }\n\n    .", " {\n      position: absolute;\n      top: 0;\n      width: ", "px;\n      height: ", "px;\n      border: 1px solid ", ";\n      border-radius: 0;\n      border-top-left-radius: ", "px;\n      background: ", ";\n      box-sizing: border-box;\n      padding: 0;\n      :focus {\n        outline: none;\n      }\n    }\n    .active .", " {\n      border-color: ", ";\n      background: ", ";\n    }\n\n    .", "[data-number-column='true'] {\n      .", ", .", " {\n        width: ", "px;\n      }\n      .", " .", " {\n        border-right-width: 0;\n      }\n    }\n\n    :not(.", ") .", ":hover {\n      border-color: ", ";\n      background: ", ";\n      cursor: pointer;\n    }\n\n    :not(.", ")\n      .", ".", " {\n      border-color: ", ";\n      background: ", ";\n    }\n\n    /* Row controls */\n    .", " {\n      width: ", "px;\n      box-sizing: border-box;\n      display: none;\n      position: relative;\n\n      ", ";\n\n      .", " {\n        display: flex;\n        flex-direction: column;\n      }\n      .", ":last-child > button {\n        border-bottom-left-radius: ", "px;\n      }\n      .", " {\n        position: relative;\n        margin-top: -1px;\n      }\n      .", ":hover,\n        .", ".active,\n        .", ":hover {\n        z-index: ", ";\n      }\n\n      ", "\n    }\n\n    .", " {\n      display: grid;\n      align-items: center;\n      position: absolute;\n      z-index: ", ";\n\n      .", " {\n        position: absolute;\n        align-self: end;\n        height: 100%;\n        width: 18px;\n      }\n\n      .", " {\n        position: absolute;\n        bottom: -3px;\n        left: 2px;\n        background-color: ", ";\n        height: 4px;\n        width: 4px;\n        border-radius: 50%;\n        pointer-events: none;\n      }\n    }\n\n    .", " {\n      .", " {\n        height: 24px;\n        position: absolute;\n        top: ", ";\n        z-index: ", ";\n      }\n\n      .", " {\n        position: absolute;\n        height: 24px;\n        width: 100%;\n      }\n\n      .", " {\n        background-color: ", ";\n        height: 4px;\n        width: 4px;\n        border-radius: 50%;\n        position: absolute;\n        right: -2px;\n      }\n    }\n\n    .", " {\n      background: none;\n      border: none;\n      outline: none;\n      position: absolute;\n      margin: 0;\n      padding: 0;\n      display: flex;\n      align-items: center;\n      cursor: pointer;\n\n      :focus {\n        outline: none;\n      }\n    }\n\n    .", " {\n      cursor: grab;\n      pointer-events: auto;\n\n      line-height: 0;\n      padding: 0;\n      border-radius: 6px;\n      width: max-content;\n      border: 2px solid ", ";\n\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      background: transparent;\n      outline: none;\n\n      &.placeholder {\n        background-color: transparent;\n        border: 2px solid transparent;\n      }\n\n      &.", " {\n        cursor: pointer;\n        & svg {\n          & > rect.", " {\n            fill: ", ";\n          }\n          & > rect {\n            fill: ", ";\n          }\n          & > g > rect {\n            fill: ", ";\n          }\n        }\n      }\n\n      &:not(.", ") {\n        & svg {\n          rect {\n            fill: ", ";\n          }\n          g {\n            fill: ", ";\n          }\n        }\n\n        &:hover {\n          svg {\n            rect {\n              fill: ", ";\n            }\n            g {\n              fill: ", ";\n            }\n          }\n        }\n\n        &:active {\n          cursor: grabbing;\n        }\n\n        &.selected {\n          :focus {\n            outline: 2px solid ", ";\n            outline-offset: 1px;\n          }\n\n          &:active {\n            outline: none;\n          }\n\n          svg {\n            rect {\n              fill: ", ";\n            }\n            g {\n              fill: ", ";\n            }\n          }\n        }\n\n        &.danger {\n          svg {\n            rect {\n              fill: ", ";\n            }\n            g {\n              fill: ", ";\n            }\n          }\n        }\n      }\n    }\n\n    ", "\n\n    :not(.", ") .", " {\n      ", "\n      ", "\n    }\n\n    /* Numbered column */\n    .", " {\n      position: relative;\n      float: right;\n      margin-left: ", "px;\n      top: ", "px;\n      width: ", "px;\n      box-sizing: border-box;\n    }\n\n    .", " {\n      border: 1px solid ", ";\n      box-sizing: border-box;\n      margin-top: -1px;\n      padding-bottom: 2px;\n      padding: 10px 2px;\n      text-align: center;\n      font-size: ", ";\n      background-color: ", ";\n      color: ", ";\n      border-color: ", ";\n\n      :first-child:not(style),\n      style:first-child + * {\n        margin-top: 0;\n      }\n      :last-child {\n        border-bottom: 1px solid ", ";\n      }\n    }\n\n    // add a background above the first numbered column cell when sticky header is engaged\n    // which hides the table when scrolling\n    .", " {\n      .", ":first-of-type::after {\n        content: '';\n        display: block;\n        height: 33px;\n        width: 100%;\n        background-color: ", ";\n        position: absolute;\n\n        // the extra pixel is accounting for borders\n        top: -34px;\n        left: -1px;\n      }\n    }\n\n    .", " {\n      .", ", .", " {\n        display: block;\n      }\n      .", " {\n        padding-left: ", "px;\n\n        .", " {\n          border-left: 0 none;\n        }\n\n        .", ".active {\n          border-bottom: 1px solid ", ";\n          border-color: ", ";\n          background-color: ", ";\n          position: relative;\n          z-index: ", ";\n          color: ", ";\n        }\n      }\n    }\n    :not(.", ") .", " {\n      .", ":not(.", ") {\n        cursor: pointer;\n      }\n      .", ":not(.", "):hover {\n        border-bottom: 1px solid ", ";\n        border-color: ", ";\n        background-color: ", ";\n        position: relative;\n        z-index: ", ";\n        color: ", ";\n      }\n      .", ".", " {\n        background-color: ", ";\n        border: 1px solid ", ";\n        border-left: 0;\n        color: ", ";\n        position: relative;\n        z-index: ", ";\n      }\n    }\n\n    /* Table */\n    .", " > table {\n      table-layout: fixed;\n      white-space: normal;\n      border-top: none;\n      // 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212\n      margin-right: -1px;\n      // Allows better positioning for the shadow sentinels - ED-16668\n      position: relative;\n\n      > tbody > tr {\n        white-space: pre-wrap;\n      }\n\n      .", " + * {\n        margin-top: 0;\n      }\n\n      /*\n       * Headings have a top margin by default, but we don't want this on the\n       * first heading within table header cells.\n       *\n       * This specifically sets margin-top for the first heading within a header\n       * cell when center/right aligned.\n       */\n      th.", " > .fabric-editor-block-mark {\n        > h1:first-of-type,\n        > h2:first-of-type,\n        > h3:first-of-type,\n        > h4:first-of-type,\n        > h5:first-of-type,\n        > h6:first-of-type {\n          margin-top: 0;\n        }\n      }\n\n      .", ", .", " {\n        position: relative;\n      }\n      /* Give selected cells a blue overlay */\n      .", "::after,\n        .", "::after {\n        z-index: ", ";\n        position: absolute;\n        content: '';\n        left: 0;\n        right: 0;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        pointer-events: none;\n      }\n      .", " {\n        border: 1px solid ", ";\n      }\n      .", "::after {\n        background: ", ";\n        z-index: ", ";\n      }\n      th.", "::after,\n        td.", "::after {\n        background: ", ";\n        z-index: ", ";\n      }\n      // ED-15246: Trello card is visible through a border of a table border\n      /* ED-19064: To fix when enable header column in the table,\n       and selection the header column, the right border is not tableBorderSelectedColor\n       when deleting the header column, the right border is not tableToolbarDeleteColor */\n      td.", ",\n        td.", ",\n        th.", ".", ",\n        th.", ".", " {\n        &::after {\n          height: 100%;\n          width: 100%;\n          border: 1px solid ", ";\n          content: '';\n          position: absolute;\n          left: -1px;\n          top: -1px;\n          bottom: 0;\n          z-index: ", ";\n          display: inline-block;\n          pointer-events: none;\n        }\n        &.", "::after {\n          ", ";\n          z-index: ", ";\n        }\n\n        &.", ".", "::after {\n          ", ";\n          z-index: ", ";\n        }\n      }\n    }\n\n    // override for DnD controls\n    .", " {\n      position: absolute;\n      margin-top: ", "px;\n      left: -", "px;\n      z-index: ", ";\n    }\n\n    .", " {\n      position: absolute;\n      /* top of corner control is table margin top - corner control height + 1 pixel of table border. */\n      top: ", "px;\n      left: -", "px;\n    }\n\n    .", ".", ",\n      .", ".", " {\n      z-index: ", ";\n    }\n\n    .", " {\n      position: absolute;\n      top: ", "px;\n    }\n\n    .", " .", " {\n      position: fixed;\n      /* higher zIndex than sticky header which is akEditorTableCellOnStickyHeaderZIndex - 5 */\n      z-index: ", ";\n    }\n\n    ", "\n  }\n\n  .ProseMirror.", " {\n    .", " {\n      overflow-x: auto;\n      ", ";\n    }\n  }\n\n  .ProseMirror.", " {\n    cursor: col-resize;\n  }\n\n  ", "\n"])), ClassName.LAYOUT_BUTTON, "var(--ds-background-neutral, ".concat(N20A, ")"), "var(--ds-icon, ".concat(N300, ")"), ClassName.LAYOUT_BUTTON, ClassName.IS_RESIZING, "var(--ds-background-neutral-hovered, ".concat(B300, ")"), "var(--ds-icon, white)", tableSharedStyle(), columnControlsLineMarker(), hoveredDeleteButton(), hoveredCell(), hoveredWarningCell, ((_props$featureFlags = props.featureFlags) === null || _props$featureFlags === void 0 ? void 0 : _props$featureFlags.tableDragAndDrop) && insertLine(), resizeHandle((_props$featureFlags2 = props.featureFlags) === null || _props$featureFlags2 === void 0 ? void 0 : _props$featureFlags2.tableDragAndDrop), rangeSelectionStyles, ClassName.LAST_ITEM_IN_CELL, ClassName.TABLE_NODE_WRAPPER, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.TABLE_CELL, tableCellBackgroundColor, tableBorderColor, tableBorderColor, ClassName.CONTROLS_FLOATING_BUTTON_COLUMN, insertColumnButtonWrapper(), ClassName.CONTROLS_FLOATING_BUTTON_ROW, insertRowButtonWrapper(), dragInsertButtonWrapper(), dragCornerControlButton(), DeleteButton(), ClassName.TABLE_STICKY, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, stickyRowOffsetTop + 2, akEditorTableNumberColumnWidth, akEditorStickyHeaderZIndex, stickyRowOffsetTop, "var(--ds-surface, white)", ClassName.TABLE_STICKY, ClassName.CORNER_CONTROLS, akEditorSmallZIndex, "var(--ds-surface, white)", tableToolbarSize, tableToolbarSize, ClassName.CORNER_CONTROLS, ClassName.CONTROLS_CORNER_BUTTON, tableToolbarSize, tableToolbarSize, tableStickyHeaderColumnControlsDecorationsStyle(), tableStickyHeaderFirefoxFixStyle(), ClassName.TABLE_STICKY, ClassName.ROW_CONTROLS, ClassName.ROW_CONTROLS_BUTTON_WRAP, akEditorStickyHeaderZIndex, tableToolbarSize, "var(--ds-surface, white)", tableToolbarSize, ClassName.TABLE_STICKY, "var(--ds-surface, green)", stickyRowOffsetTop, akEditorTableCellOnStickyHeaderZIndex - 5, "var(--ds-surface, white)", "var(--ds-shadow-overflow-perimeter, ".concat(N40A, ")"), ClassName.TABLE_STICKY, ClassName.TABLE_STICKY_SHADOW, akEditorTableCellOnStickyHeaderZIndex, ClassName.WITH_CONTROLS, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY_SHADOW, tableToolbarSize, stickyHeaderBorderBottomWidth, tableBorderColor, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY, insertColumnButtonOffset + 1, ClassName.TABLE_STICKY, ClassName.TABLE_CONTAINER, ClassName.TABLE_STICKY, ClassName.WITH_RESIZE_LINE, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, (resizeHandlerAreaWidth - resizeLineWidth) / 2 + 1, ClassName.WITH_RESIZE_LINE, ClassName.SELECTED_CELL, ClassName.WITH_RESIZE_LINE, ClassName.SELECTED_CELL, ClassName.RESIZE_HANDLE_DECORATION, (resizeHandlerAreaWidth - resizeLineWidth) / 2, ClassName.HOVERED_CELL, ClassName.SELECTED_CELL, ClassName.WITH_CONTROLS, tableControlsSpacing, ClassName.WITH_CONTROLS, ClassName.TABLE_STICKY, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, tableControlsSpacing + 2, ClassName.CORNER_CONTROLS, tableControlsSpacing - tableToolbarSize + 2, "var(--ds-surface, white)", sentinelStyles, OverflowShadow((_props$featureFlags3 = props.featureFlags) === null || _props$featureFlags3 === void 0 ? void 0 : _props$featureFlags3.tableDragAndDrop), stickyScrollbarStyles(props.featureFlags), ClassName.TABLE_STICKY, ClassName.TABLE_STICKY_SHADOW, tablePadding, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.ROW_CONTROLS_WRAPPER, tablePadding, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tablePadding, ClassName.TABLE_CONTAINER, akEditorTableNumberColumnWidth + tablePadding - 1, ClassName.TABLE_LEFT_SHADOW, ClassName.TABLE_RIGHT_SHADOW, tableOverflowShadowWidth, ClassName.TABLE_LEFT_SHADOW, ClassName.TABLE_RIGHT_SHADOW, ClassName.NODEVIEW_WRAPPER, breakoutWidthStyling(), columnControlsDecoration(), rowControlsWrapperDotStyle(), ClassName.CORNER_CONTROLS, tableToolbarSize + 1, cornerControlHeight, ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, InsertMarker("\n          left: -11px;\n          top: 9px;\n        "), ClassName.CORNER_CONTROLS, ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, ClassName.CONTROLS_CORNER_BUTTON, tableToolbarSize + 1, tableToolbarSize + 1, tableBorderColor, tableBorderRadiusSize, tableHeaderCellBackgroundColor, ClassName.CONTROLS_CORNER_BUTTON, tableBorderSelectedColor, tableToolbarSelectedColor, ClassName.TABLE_CONTAINER, ClassName.CORNER_CONTROLS, ClassName.CONTROLS_CORNER_BUTTON, getBooleanFF('platform.editor.custom-table-width') ? akEditorTableToolbarSize + akEditorTableNumberColumnWidth + 1 : akEditorTableToolbarSize + akEditorTableNumberColumnWidth, ClassName.ROW_CONTROLS, ClassName.CONTROLS_BUTTON, ClassName.IS_RESIZING, ClassName.CONTROLS_CORNER_BUTTON, tableBorderSelectedColor, tableToolbarSelectedColor, ClassName.IS_RESIZING, ClassName.CONTROLS_CORNER_BUTTON, ClassName.HOVERED_CELL_IN_DANGER, tableBorderDeleteColor, tableToolbarDeleteColor, ClassName.ROW_CONTROLS, tableToolbarSize, InsertMarker("\n        bottom: -1px;\n        left: -11px;\n      "), ClassName.ROW_CONTROLS_INNER, ClassName.ROW_CONTROLS_BUTTON_WRAP, tableBorderRadiusSize, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.CONTROLS_BUTTON, akEditorUnitZIndex, HeaderButton("\n        border-bottom: 1px solid ".concat(tableBorderColor, ";\n        border-right: 0px;\n        border-radius: 0;\n        height: 100%;\n        width: ").concat(tableToolbarSize, "px;\n\n        .").concat(ClassName.CONTROLS_BUTTON_OVERLAY, " {\n          position: absolute;\n          width: 30px;\n          height: 50%;\n          right: 0;\n          bottom: 0;\n        }\n        .").concat(ClassName.CONTROLS_BUTTON_OVERLAY, ":first-of-type {\n          top: 0;\n        }\n      ")), ClassName.DRAG_ROW_CONTROLS, akEditorUnitZIndex, ClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER, ClassName.DRAG_ROW_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #C1C7D0)", ClassName.DRAG_COLUMN_CONTROLS, ClassName.DRAG_COLUMN_CONTROLS_INNER, "var(--ds-space-negative-150, -12px)", resizeHandlerZIndex, ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER, ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #C1C7D0)", ClassName.DRAG_HANDLE_BUTTON_CLICKABLE_ZONE, ClassName.DRAG_HANDLE_BUTTON_CONTAINER, "var(--ds-surface, ".concat(N0, ")"), ClassName.DRAG_HANDLE_DISABLED, ClassName.DRAG_HANDLE_MINIMISED, "var(--ds-background-accent-gray-subtler, #DCDFE4)", "var(--ds-background-accent-gray-subtlest, #F4F5F7)", "var(--ds-icon-disabled, #BFDBF847)", ClassName.DRAG_HANDLE_DISABLED, "var(--ds-background-accent-gray-subtler, #DCDFE4)", "var(--ds-icon-subtle, #626f86)", "var(--ds-background-accent-blue-subtle, #579DFF)", "var(--ds-icon-inverse, #FFF)", "var(--ds-border-focused, #2684FF)", "var(--ds-background-accent-blue-subtle, #579dff)", "var(--ds-icon-inverse, #fff)", "var(--ds-background-accent-red-subtler-pressed, #F87462)", "var(--ds-border-inverse, #FFF)", floatingColumnControls(), ClassName.IS_RESIZING, ClassName.ROW_CONTROLS, HeaderButtonHover(), HeaderButtonDanger(), ClassName.NUMBERED_COLUMN, getBooleanFF('platform.editor.custom-table-width') ? akEditorTableToolbarSize : akEditorTableToolbarSize - 1, (_props$featureFlags4 = props.featureFlags) !== null && _props$featureFlags4 !== void 0 && _props$featureFlags4.tableDragAndDrop ? 0 : akEditorTableToolbarSize, akEditorTableNumberColumnWidth + 1, ClassName.NUMBERED_COLUMN_BUTTON, tableBorderColor, relativeFontSizeToBase16(fontSize()), tableHeaderCellBackgroundColor, tableTextColor, tableBorderColor, tableBorderColor, ClassName.TABLE_STICKY, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, "var(--ds-surface, white)", ClassName.WITH_CONTROLS, ClassName.CORNER_CONTROLS, ClassName.ROW_CONTROLS, ClassName.NUMBERED_COLUMN, getBooleanFF('platform.editor.custom-table-width') ? 0 : 1, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON, tableBorderSelectedColor, tableBorderSelectedColor, tableToolbarSelectedColor, akEditorUnitZIndex, "var(--ds-text-selected, ".concat(N0, ")"), ClassName.IS_RESIZING, ClassName.WITH_CONTROLS, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, tableBorderSelectedColor, tableBorderSelectedColor, tableToolbarSelectedColor, akEditorUnitZIndex, "var(--ds-text-selected, ".concat(N0, ")"), ClassName.NUMBERED_COLUMN_BUTTON, ClassName.HOVERED_CELL_IN_DANGER, tableToolbarDeleteColor, tableBorderDeleteColor, "var(--ds-text-danger, ".concat(R500, ")"), akEditorUnitZIndex, ClassName.TABLE_NODE_WRAPPER, ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, akEditorSmallZIndex, ClassName.SELECTED_CELL, tableBorderSelectedColor, ClassName.SELECTED_CELL, tableCellSelectedColor, akEditorSmallZIndex, ClassName.HOVERED_CELL_IN_DANGER, ClassName.HOVERED_CELL_IN_DANGER, tableCellDeleteColor, akEditorUnitZIndex * 100, ClassName.HOVERED_CELL, ClassName.SELECTED_CELL, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_CELL, tableBorderSelectedColor, akEditorSmallZIndex, ClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), akEditorUnitZIndex * 100, ClassName.HOVERED_NO_HIGHLIGHT, ClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), akEditorUnitZIndex * 100, ClassName.DRAG_ROW_CONTROLS_WRAPPER, tableMarginTop, tableToolbarSize + 1, rowControlsZIndex + 4, ClassName.ROW_CONTROLS_WRAPPER, tableMarginTop - cornerControlHeight + 1, tableToolbarSize, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.TABLE_LEFT_SHADOW, ClassName.ROW_CONTROLS_WRAPPER, ClassName.TABLE_LEFT_SHADOW, akEditorUnitZIndex, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tableMarginTop, ClassName.TABLE_STICKY, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, akEditorTableCellOnStickyHeaderZIndex - 4, tableWrapperStyles(), ClassName.IS_RESIZING, ClassName.TABLE_NODE_WRAPPER, scrollbarStyles, ClassName.RESIZE_CURSOR, shadowSentinelStyles);
+  return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  .", " button {\n    background: ", ";\n    color: ", ";\n    cursor: none;\n  }\n\n  .", ":not(.", ") button:hover {\n    background: ", ";\n    color: ", " !important;\n    cursor: pointer;\n  }\n\n  .ProseMirror {\n    ", "\n  }\n\n  .ProseMirror.", " {\n    .", " {\n      overflow-x: auto;\n      ", ";\n    }\n  }\n\n  .ProseMirror.", " {\n    cursor: col-resize;\n  }\n\n  ", "\n"])), ClassName.LAYOUT_BUTTON, "var(--ds-background-neutral, ".concat(N20A, ")"), "var(--ds-icon, ".concat(N300, ")"), ClassName.LAYOUT_BUTTON, ClassName.IS_RESIZING, "var(--ds-background-neutral-hovered, ".concat(B300, ")"), "var(--ds-icon, white)", baseTableStyles(props), ClassName.IS_RESIZING, ClassName.TABLE_NODE_WRAPPER, scrollbarStyles, ClassName.RESIZE_CURSOR, shadowSentinelStyles);
 };
-export var tableFullPageEditorStyles = css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  .ProseMirror .", " > table {\n    margin-left: 0;\n    // 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212\n    margin-right: -1px;\n    width: 100%;\n  }\n"])), ClassName.TABLE_NODE_WRAPPER);
-export var tableCommentEditorStyles = css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  .ProseMirror .", " > table {\n    margin-left: 0;\n    margin-right: 0;\n    ", ";\n  }\n"])), ClassName.TABLE_NODE_WRAPPER, scrollbarStyles);
+export var tableFullPageEditorStyles = css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  .ProseMirror .", " > table {\n    margin-left: 0;\n    // 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212\n    margin-right: -1px;\n    width: 100%;\n  }\n"])), ClassName.TABLE_NODE_WRAPPER);
+export var tableCommentEditorStyles = css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  .ProseMirror .", " > table {\n    margin-left: 0;\n    margin-right: 0;\n    ", ";\n  }\n"])), ClassName.TABLE_NODE_WRAPPER, scrollbarStyles);

package/dist/types/nodeviews/TableComponent.d.ts CHANGED Viewed

@@ -6,7 +6,7 @@ import type { EditorContainerWidth, GetEditorFeatureFlags } from '@atlaskit/edit
 import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { RowStickyState, StickyPluginState } from '../pm-plugins/sticky-headers';
-import type { PluginInjectionAPI } from '../types';
+import type { CellHoverMeta, PluginInjectionAPI } from '../types';
 import { ShadowEvent } from '../types';
 import type { TableOptions } from './types';
 export interface ComponentProps {
@@ -25,11 +25,16 @@ export interface ComponentProps {
     isDragAndDropEnabled?: boolean;
     isTableScalingEnabled?: boolean;
     tableActive: boolean;
-    ordering: TableColumnOrdering;
+    ordering?: TableColumnOrdering;
     isResizing?: boolean;
     getEditorFeatureFlags: GetEditorFeatureFlags;
     dispatchAnalyticsEvent: DispatchAnalyticsEvent;
     pluginInjectionApi?: PluginInjectionAPI;
+    isInDanger?: boolean;
+    hoveredRows?: number[];
+    hoveredCell?: CellHoverMeta;
+    isTableHovered?: boolean;
+    isWholeTableInDanger?: boolean;
 }
 interface TableState {
     scroll: number;

package/dist/types/nodeviews/TableComponentWithSharedState.d.ts ADDED Viewed

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
+import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
+import type { GetEditorFeatureFlags, getPosHandlerNode } from '@atlaskit/editor-common/types';
+import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { PluginInjectionAPI } from '../types';
+import type { TableOptions } from './types';
+type ForwardRef = (node: HTMLElement | null) => any;
+type TableComponentWithSharedStateProps = {
+    view: EditorView;
+    options?: TableOptions;
+    getNode: () => PmNode;
+    dispatchAnalyticsEvent: DispatchAnalyticsEvent;
+    getEditorFeatureFlags: GetEditorFeatureFlags;
+    api?: PluginInjectionAPI;
+    eventDispatcher: EventDispatcher;
+    forwardRef: ForwardRef;
+    getPos: getPosHandlerNode;
+    allowColumnResizing?: boolean;
+    allowControls?: boolean;
+};
+/**
+ * Use useSharedPluginState to control re-renders from plugin dependencies
+ */
+export declare const TableComponentWithSharedState: ({ view, options, getNode, dispatchAnalyticsEvent, api, getEditorFeatureFlags, eventDispatcher, allowColumnResizing, allowControls, getPos, forwardRef, }: TableComponentWithSharedStateProps) => JSX.Element | null;
+export {};

package/dist/types/nodeviews/TableContainer.d.ts CHANGED Viewed

@@ -26,8 +26,9 @@ type ResizableTableContainerProps = {
     pluginInjectionApi?: PluginInjectionAPI;
     isTableScalingEnabled?: boolean;
     tableWrapperHeight?: number;
+    isWholeTableInDanger?: boolean;
 };
-export declare const ResizableTableContainer: React.MemoExoticComponent<({ children, className, node, containerWidth, editorView, getPos, tableRef, isResizing, pluginInjectionApi, isTableScalingEnabled, tableWrapperHeight, }: PropsWithChildren<ResizableTableContainerProps>) => JSX.Element>;
+export declare const ResizableTableContainer: React.MemoExoticComponent<({ children, className, node, containerWidth, editorView, getPos, tableRef, isResizing, pluginInjectionApi, isTableScalingEnabled, tableWrapperHeight, isWholeTableInDanger, }: PropsWithChildren<ResizableTableContainerProps>) => JSX.Element>;
 type TableContainerProps = {
     node: PMNode;
     className: string;
@@ -42,6 +43,7 @@ type TableContainerProps = {
     pluginInjectionApi?: PluginInjectionAPI;
     isTableScalingEnabled?: boolean;
     tableWrapperHeight?: number;
+    isWholeTableInDanger?: boolean;
 };
-export declare const TableContainer: ({ children, node, className, containerWidth: { lineLength, width: editorWidth }, isTableResizingEnabled, isBreakoutEnabled, editorView, getPos, tableRef, isNested, tableWrapperHeight, isResizing, pluginInjectionApi, isTableScalingEnabled, }: PropsWithChildren<TableContainerProps>) => JSX.Element;
+export declare const TableContainer: ({ children, node, className, containerWidth: { lineLength, width: editorWidth }, isTableResizingEnabled, isBreakoutEnabled, editorView, getPos, tableRef, isNested, tableWrapperHeight, isResizing, pluginInjectionApi, isTableScalingEnabled, isWholeTableInDanger, }: PropsWithChildren<TableContainerProps>) => JSX.Element;
 export {};

package/dist/types/nodeviews/TableResizer.d.ts CHANGED Viewed

@@ -17,10 +17,11 @@ interface TableResizerProps {
     attachAnalyticsEvent: (payload: TableEventPayload) => ((tr: Transaction) => boolean) | undefined;
     displayGapCursor: (toggle: boolean) => boolean;
     isTableScalingEnabled?: boolean;
+    isWholeTableInDanger?: boolean;
 }
 export interface TableResizerImprovementProps extends TableResizerProps {
     onResizeStop?: () => void;
     onResizeStart?: () => void;
 }
-export declare const TableResizer: ({ children, width, maxWidth, containerWidth, updateWidth, onResizeStop, onResizeStart, editorView, getPos, node, tableRef, displayGuideline, attachAnalyticsEvent, displayGapCursor, isTableScalingEnabled, }: PropsWithChildren<TableResizerImprovementProps>) => JSX.Element;
+export declare const TableResizer: ({ children, width, maxWidth, containerWidth, updateWidth, onResizeStop, onResizeStart, editorView, getPos, node, tableRef, displayGuideline, attachAnalyticsEvent, displayGapCursor, isTableScalingEnabled, isWholeTableInDanger, }: PropsWithChildren<TableResizerImprovementProps>) => JSX.Element;
 export {};

package/dist/types/nodeviews/types.d.ts CHANGED Viewed

@@ -17,6 +17,7 @@ export interface Props {
     node: PmNode;
     view: EditorView;
     allowColumnResizing?: boolean;
+    allowControls?: boolean;
     cellMinWidth?: number;
     portalProviderAPI: PortalProviderAPI;
     eventDispatcher: EventDispatcher;

package/dist/types/plugin.d.ts CHANGED Viewed

@@ -1,12 +1,12 @@
 import type { AnalyticsEventPayload } from '@atlaskit/editor-common/analytics';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import type { Command, EditorCommand, GetEditorFeatureFlags, NextEditorPlugin } from '@atlaskit/editor-common/types';
+import type { Command, EditorCommand, GetEditorFeatureFlags, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { ContentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import type { GuidelinePlugin } from '@atlaskit/editor-plugin-guideline';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
-import type { PluginConfig } from './types';
+import type { PluginConfig, TableSharedState } from './types';
 export interface TablePluginOptions {
     tableOptions: PluginConfig;
     tableResizingEnabled?: boolean;
@@ -19,15 +19,18 @@ export interface TablePluginOptions {
     isTableScalingEnabled?: boolean;
 }
 type InsertTableAction = (analyticsPayload: AnalyticsEventPayload) => Command;
+type MediaPlugin = NextEditorPlugin<'media', {
+    pluginConfiguration: any;
+    dependencies: any;
+    sharedState: any;
+    actions: any;
+}>;
 export type TablePlugin = NextEditorPlugin<'table', {
     pluginConfiguration: TablePluginOptions | undefined;
     actions: {
         insertTable: InsertTableAction;
     };
-    sharedState: {
-        isFullWidthModeEnabled: boolean;
-        wasFullWidthModeEnabled: boolean;
-    };
+    sharedState?: TableSharedState;
     commands: {
         insertTableWithSize: (rowsCount: number, colsCount: number, inputMethod?: INPUT_METHOD.PICKER) => EditorCommand;
     };
@@ -36,7 +39,8 @@ export type TablePlugin = NextEditorPlugin<'table', {
         ContentInsertionPlugin,
         WidthPlugin,
         GuidelinePlugin,
-        SelectionPlugin
+        SelectionPlugin,
+        OptionalPlugin<MediaPlugin>
     ];
 }>;
 /**

package/dist/types/types.d.ts CHANGED Viewed

@@ -8,7 +8,7 @@ import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
 import type { Rect } from '@atlaskit/editor-tables/table-map';
 import type { Edge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';
-import type tablePlugin from './plugin';
+import type { TablePlugin } from './plugin';
 export declare const RESIZE_HANDLE_AREA_DECORATION_GAP = 30;
 export type RowInsertPosition = 'TOP' | 'BOTTOM';
 /**
@@ -25,7 +25,13 @@ export interface InsertRowOptions {
     index: number;
     moveCursorToInsertedRow: boolean;
 }
-export type PluginInjectionAPI = ExtractInjectionAPI<typeof tablePlugin>;
+export type PluginInjectionAPI = ExtractInjectionAPI<TablePlugin>;
+export type TableSharedStateInternal = Pick<TablePluginState, 'isFullWidthModeEnabled' | 'wasFullWidthModeEnabled' | 'isHeaderRowEnabled' | 'isHeaderColumnEnabled' | 'ordering' | 'isInDanger' | 'hoveredRows' | 'hoveredCell' | 'isTableHovered' | 'tableNode'> & {
+    isResizing: boolean;
+    isTableResizing?: boolean;
+    isWholeTableInDanger?: boolean;
+};
+export type TableSharedState = Pick<TablePluginState, 'isFullWidthModeEnabled' | 'wasFullWidthModeEnabled'>;
 export type InsertRowMethods = INPUT_METHOD.CONTEXT_MENU | INPUT_METHOD.BUTTON | INPUT_METHOD.SHORTCUT | INPUT_METHOD.KEYBOARD | INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TABLE_CONTEXT_MENU;
 export interface PluginConfig {
     advanced?: boolean;

package/dist/types/ui/TableFloatingColumnControls/ColumnControls/index.d.ts CHANGED Viewed

@@ -1,5 +1,7 @@
 /// <reference types="react" />
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { TablePlugin } from '../../../plugin';
 import type { CellHoverMeta } from '../../../types';
 export interface ColumnControlsProps {
     editorView: EditorView;
@@ -18,5 +20,115 @@ export interface ColumnControlsProps {
     isDragging?: boolean;
     getScrollOffset?: () => number;
 }
-export declare const ColumnControls: ({ editorView, tableActive, tableRef, hoveredCell, stickyTop, localId, isInDanger, rowHeights, colWidths, hasHeaderColumn, isTableHovered, tableContainerWidth, isNumberColumnEnabled, isDragging, getScrollOffset, }: ColumnControlsProps) => JSX.Element;
+export declare const ColumnControls: ({ editorView, tableActive, tableRef, hoveredCell, stickyTop, localId, isInDanger, rowHeights, colWidths, hasHeaderColumn, isTableHovered, tableContainerWidth, isNumberColumnEnabled, isDragging, getScrollOffset, api, }: ColumnControlsProps & {
+    api?: import("@atlaskit/editor-common/types").PublicPluginAPI<[import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"table", {
+        pluginConfiguration: import("../../../plugin").TablePluginOptions | undefined;
+        actions: {
+            insertTable: (analyticsPayload: import("@atlaskit/editor-common/analytics").AnalyticsEventPayload) => import("@atlaskit/editor-common/types").Command;
+        };
+        sharedState?: import("../../../types").TableSharedState | undefined;
+        commands: {
+            insertTableWithSize: (rowsCount: number, colsCount: number, inputMethod?: import("@atlaskit/editor-common/analytics").INPUT_METHOD.PICKER | undefined) => import("@atlaskit/editor-common/types").EditorCommand;
+        };
+        dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
+            pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
+            sharedState: {
+                createAnalyticsEvent: import("@atlaskit/analytics-next").CreateUIAnalyticsEvent | null;
+                attachAnalyticsEvent: import("@atlaskit/editor-plugin-analytics").CreateAttachPayloadIntoTransaction | null;
+                performanceTracking: import("@atlaskit/editor-common/types").PerformanceTracking | undefined;
+            };
+            dependencies: [import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+                sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+            }, import("@atlaskit/editor-common/types").FeatureFlags>>];
+            actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
+        }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"contentInsertion", {
+            actions: import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI;
+            dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
+                pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
+                sharedState: {
+                    createAnalyticsEvent: import("@atlaskit/analytics-next").CreateUIAnalyticsEvent | null;
+                    attachAnalyticsEvent: import("@atlaskit/editor-plugin-analytics").CreateAttachPayloadIntoTransaction | null;
+                    performanceTracking: import("@atlaskit/editor-common/types").PerformanceTracking | undefined;
+                };
+                dependencies: [import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                    pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+                    sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+                }, import("@atlaskit/editor-common/types").FeatureFlags>>];
+                actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
+            }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>];
+        }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
+            sharedState: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
+        }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"guideline", {
+            dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
+                sharedState: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
+            }, undefined>];
+            sharedState: import("@atlaskit/editor-common/guideline").GuidelinePluginState | null;
+            actions: {
+                displayGuideline: import("@atlaskit/editor-common/guideline").DisplayGuideline;
+            };
+        }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"selection", {
+            pluginConfiguration: import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined;
+            actions: import("@atlaskit/editor-plugin-selection").EditorSelectionAPI;
+            commands: {
+                displayGapCursor: (toggle: boolean) => import("@atlaskit/editor-common/types").EditorCommand;
+            };
+            sharedState: import("@atlaskit/editor-common/selection").SelectionSharedState;
+        }, import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined>, import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"media", {
+            pluginConfiguration: any;
+            dependencies: any;
+            sharedState: any;
+            actions: any;
+        }, any>>];
+    }, import("../../../plugin").TablePluginOptions | undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
+        pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
+        sharedState: {
+            createAnalyticsEvent: import("@atlaskit/analytics-next").CreateUIAnalyticsEvent | null;
+            attachAnalyticsEvent: import("@atlaskit/editor-plugin-analytics").CreateAttachPayloadIntoTransaction | null;
+            performanceTracking: import("@atlaskit/editor-common/types").PerformanceTracking | undefined;
+        };
+        dependencies: [import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+            pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+            sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+        }, import("@atlaskit/editor-common/types").FeatureFlags>>];
+        actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
+    }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"contentInsertion", {
+        actions: import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI;
+        dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
+            pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
+            sharedState: {
+                createAnalyticsEvent: import("@atlaskit/analytics-next").CreateUIAnalyticsEvent | null;
+                attachAnalyticsEvent: import("@atlaskit/editor-plugin-analytics").CreateAttachPayloadIntoTransaction | null;
+                performanceTracking: import("@atlaskit/editor-common/types").PerformanceTracking | undefined;
+            };
+            dependencies: [import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+                sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+            }, import("@atlaskit/editor-common/types").FeatureFlags>>];
+            actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
+        }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>];
+    }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
+        sharedState: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
+    }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"guideline", {
+        dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
+            sharedState: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
+        }, undefined>];
+        sharedState: import("@atlaskit/editor-common/guideline").GuidelinePluginState | null;
+        actions: {
+            displayGuideline: import("@atlaskit/editor-common/guideline").DisplayGuideline;
+        };
+    }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"selection", {
+        pluginConfiguration: import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined;
+        actions: import("@atlaskit/editor-plugin-selection").EditorSelectionAPI;
+        commands: {
+            displayGapCursor: (toggle: boolean) => import("@atlaskit/editor-common/types").EditorCommand;
+        };
+        sharedState: import("@atlaskit/editor-common/selection").SelectionSharedState;
+    }, import("@atlaskit/editor-plugin-selection/types").SelectionPluginOptions | undefined>, import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"media", {
+        pluginConfiguration: any;
+        dependencies: any;
+        sharedState: any;
+        actions: any;
+    }, any>>]> | undefined;
+}) => JSX.Element;
 export default ColumnControls;

package/dist/types/ui/TableFloatingColumnControls/index.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
 import type { Selection } from '@atlaskit/editor-prosemirror/state';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { RowStickyState } from '../../pm-plugins/sticky-headers';
-import type { CellHoverMeta } from '../../types';
+import type { CellHoverMeta, PluginInjectionAPI } from '../../types';
 export interface Props {
     editorView: EditorView;
     getEditorFeatureFlags: GetEditorFeatureFlags;
@@ -26,6 +26,7 @@ export interface Props {
     isNumberColumnEnabled?: boolean;
     getScrollOffset?: () => number;
     tableWrapperHeight?: number;
+    api?: PluginInjectionAPI;
 }
-export declare const TableFloatingColumnControls: ({ editorView, tableRef, getNode, tableActive, hasHeaderRow, hoveredCell, isResizing, stickyHeader, selection, isInDanger, isTableHovered, tableContainerWidth, isNumberColumnEnabled, getScrollOffset, tableWrapperHeight, }: Props) => JSX.Element | null;
+export declare const TableFloatingColumnControls: ({ editorView, tableRef, getNode, tableActive, hasHeaderRow, hoveredCell, isResizing, stickyHeader, selection, isInDanger, isTableHovered, tableContainerWidth, isNumberColumnEnabled, getScrollOffset, tableWrapperHeight, api, }: Props) => JSX.Element | null;
 export default TableFloatingColumnControls;