npm - @atlaskit/editor-core - Versions diffs - 174.0.0 → 175.0.1 - Mend

@atlaskit/editor-core 174.0.0 → 175.0.1

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

package/dist/es2019/plugins/table/ui/common-styles.js DELETED Viewed

@@ -1,647 +0,0 @@
-import { css } from '@emotion/react';
-import { tableMarginTop, tableSharedStyle } from '@atlaskit/editor-common/styles';
-import { fontSize } from '@atlaskit/theme/constants';
-import { N40A, B300, N300, N20A, N0, R500 } from '@atlaskit/theme/colors';
-import { SelectionStyle, getSelectionStyles, akEditorSmallZIndex, akEditorTableNumberColumnWidth, akEditorStickyHeaderZIndex, akEditorTableToolbarSize, akEditorUnitZIndex, akEditorSelectedNodeClassName, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
-import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
-import { TableCssClassName as ClassName } from '../types';
-import { tableCellBackgroundColor, tableToolbarColor, tableBorderColor, tableCellSelectedColor, tableToolbarSelectedColor, tableBorderSelectedColor, tableCellDeleteColor, tableBorderDeleteColor, tableToolbarDeleteColor, tableBorderRadiusSize, tablePadding, tableScrollbarOffset, resizeHandlerAreaWidth, resizeLineWidth, tableToolbarSize, tableInsertColumnButtonSize, tableControlsSpacing, tableTextColor, stickyRowZIndex, columnControlsDecorationHeight, stickyRowOffsetTop, stickyHeaderBorderBottomWidth } from './consts';
-import { HeaderButton, HeaderButtonHover, HeaderButtonDanger, insertColumnButtonWrapper, insertRowButtonWrapper, columnControlsLineMarker, DeleteButton, OverflowShadow, columnControlsDecoration, hoveredDeleteButton, hoveredCell, hoveredWarningCell, resizeHandle, InsertMarker } from './ui-styles';
-import { token } from '@atlaskit/tokens';
-const cornerControlHeight = tableToolbarSize + 1;
-const rangeSelectionStyles = `
-.${ClassName.NODEVIEW_WRAPPER}.${akEditorSelectedNodeClassName} table tbody tr {
-  th,td {
-    ${getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.Border])}
-  }
-}
-`;
-const sentinelStyles = `.${ClassName.TABLE_CONTAINER} {
-  > .${ClassName.TABLE_STICKY_SENTINEL_TOP}, > .${ClassName.TABLE_STICKY_SENTINEL_BOTTOM} {
-    position: absolute;
-    width: 100%;
-    height: 1px;
-    margin-top: -1px;
-    // need this to avoid sentinel being focused via keyboard
-    // this still allows it to be detected by intersection observer
-    visibility: hidden;
-  }
-  > .${ClassName.TABLE_STICKY_SENTINEL_TOP} {
-    top: ${columnControlsDecorationHeight}px;
-  }
-  > .${ClassName.TABLE_STICKY_SENTINEL_BOTTOM} {
-      bottom: ${tableScrollbarOffset + stickyRowOffsetTop + tablePadding * 2 + 23}px;
-  }
-  &.${ClassName.WITH_CONTROLS} {
-    > .${ClassName.TABLE_STICKY_SENTINEL_TOP} {
-      top: 0px;
-    }
-    > .${ClassName.TABLE_STICKY_SENTINEL_BOTTOM} {
-      margin-bottom: ${columnControlsDecorationHeight}px;
-    }
-  }
-}`; // TODO: https://product-fabric.atlassian.net/browse/DSP-4139
-export const tableStyles = props => {
-  var _props$featureFlags;
-  return css`
-  .${ClassName.LAYOUT_BUTTON} button {
-    background: ${token('color.background.neutral', N20A)};
-    color: ${token('color.icon', N300)};
-    cursor: none;
-  }
-  .${ClassName.LAYOUT_BUTTON}:not(.${ClassName.IS_RESIZING}) button:hover {
-    background: ${token('color.background.neutral.hovered', B300)};
-    color: ${token('color.icon', 'white')} !important;
-    cursor: pointer;
-  }
-  .ProseMirror {
-    ${tableSharedStyle(props)};
-    ${columnControlsLineMarker(props)};
-    ${hoveredDeleteButton};
-    ${hoveredCell};
-    ${hoveredWarningCell};
-    ${resizeHandle};
-    ${rangeSelectionStyles};
-    .${ClassName.LAST_ITEM_IN_CELL} {
-      margin-bottom: 0;
-    }
-    .${ClassName.TABLE_NODE_WRAPPER} {
-      td.${ClassName.TABLE_CELL}, th.${ClassName.TABLE_HEADER_CELL} {
-        position: relative;
-        overflow: visible;
-      }
-      td.${ClassName.TABLE_CELL} {
-        background-color: ${tableCellBackgroundColor(props)};
-        // ED-15246: Trello card is visible through a border of a table border
-        // This fixes a border issue caused by relative positioned table cells
-        &::after {
-          height: 100%;
-          content: '';
-          border-left: 1px solid ${tableBorderColor(props)};
-          border-bottom: 1px solid ${tableBorderColor(props)};
-          position: absolute;
-          right: 0px;
-          top: 0px;
-          bottom: 0;
-          width: 100%;
-          display: inline-block;
-          pointer-events: none;
-        }
-      }
-    }
-    .${ClassName.CONTROLS_FLOATING_BUTTON_COLUMN} {
-      ${insertColumnButtonWrapper}
-    }
-    .${ClassName.CONTROLS_FLOATING_BUTTON_ROW} {
-      ${insertRowButtonWrapper}
-    }
-    /* Delete button */
-    ${DeleteButton}
-    /* Ends Delete button */
-    /* sticky styles */
-    .${ClassName.TABLE_STICKY} .${ClassName.NUMBERED_COLUMN} .${ClassName.NUMBERED_COLUMN_BUTTON}:first-of-type {
-      margin-top: ${stickyRowOffsetTop + 2}px;
-      width: ${akEditorTableNumberColumnWidth}px;
-      position: fixed !important;
-      z-index: ${akEditorStickyHeaderZIndex} !important;
-      box-shadow: 0px -${stickyRowOffsetTop}px ${token('elevation.surface', 'white')};
-      border-right: 0 none;
-      /* top set by NumberColumn component */
-    }
-    .${ClassName.TABLE_STICKY} .${ClassName.CORNER_CONTROLS}.sticky {
-      position: fixed !important;
-      /* needs to be above row controls */
-      z-index: ${akEditorSmallZIndex} !important;
-      background: ${token('elevation.surface', 'white')};
-      width: ${tableToolbarSize}px;
-      height: ${tableToolbarSize}px;
-    }
-    .${ClassName.CORNER_CONTROLS}.sticky .${ClassName.CONTROLS_CORNER_BUTTON} {
-      border-bottom: 0px none;
-      border-right: 0px none;
-      height: ${tableToolbarSize}px;
-      width: ${tableToolbarSize}px;
-    }
-    .${ClassName.TABLE_STICKY} .${ClassName.COLUMN_CONTROLS_DECORATIONS} {
-      z-index: 0;
-    }
-    .${ClassName.TABLE_STICKY}
-      .${ClassName.ROW_CONTROLS}
-      .${ClassName.ROW_CONTROLS_BUTTON_WRAP}.sticky {
-      position: fixed !important;
-      z-index: ${akEditorStickyHeaderZIndex} !important;
-      display: flex;
-      border-left: ${tableToolbarSize}px solid
-        ${token('elevation.surface', 'white')};
-      margin-left: -${tableToolbarSize}px;
-    }
-    .${ClassName.TABLE_STICKY} col:first-of-type {
-      /* moving rows out of a table layout does weird things in Chrome */
-      border-right: 1px solid ${token('elevation.surface', 'green')};
-    }
-    tr.sticky {
-      padding-top: ${stickyRowOffsetTop}px;
-      position: fixed;
-      display: grid;
-      /* to keep it above cell selection */
-      z-index: ${stickyRowZIndex};
-      overflow-y: visible;
-      overflow-x: hidden;
-      grid-auto-flow: column;
-      /* background for where controls apply */
-      background: ${token('elevation.surface', 'white')};
-      box-sizing: content-box;
-      margin-top: 2px;
-      box-shadow: ${token('elevation.shadow.overflow', `0 6px 4px -4px ${N40A}`)};
-      margin-left: -1px;
-      &.no-pointer-events {
-        pointer-events: none;
-      }
-    }
-    .${ClassName.TABLE_STICKY} .${ClassName.TABLE_STICKY_SHADOW} {
-      left: unset;
-      position: fixed;
-      z-index: ${stickyRowZIndex + 1};
-    }
-    .${ClassName.WITH_CONTROLS}.${ClassName.TABLE_STICKY}
-      .${ClassName.TABLE_STICKY_SHADOW} {
-      padding-bottom: ${tableToolbarSize}px;
-    }
-    tr.sticky th {
-      border-bottom: ${stickyHeaderBorderBottomWidth}px solid
-        ${tableBorderColor(props)};
-      margin-right: -1px;
-    }
-    .${ClassName.TABLE_STICKY} tr.sticky > th:last-child {
-      border-right-width: 1px;
-    }
-    /* add left edge for first cell */
-    .${ClassName.TABLE_STICKY} tr.sticky > th:first-of-type {
-      margin-left: 0px;
-    }
-    /* add a little bit so the scroll lines up with the table */
-    .${ClassName.TABLE_STICKY} tr.sticky::after {
-      content: ' ';
-      width: 1px;
-    }
-    /* To fix jumpiness caused in Chrome Browsers for sticky headers */
-    .${ClassName.TABLE_STICKY} .sticky + tr {
-      min-height: 0px;
-    }
-    /* move resize line a little in sticky bar */
-    .${ClassName.TABLE_CONTAINER}.${ClassName.TABLE_STICKY} {
-      tr.sticky
-        td.${ClassName.WITH_RESIZE_LINE},
-        tr.sticky
-        th.${ClassName.WITH_RESIZE_LINE} {
-        .${ClassName.RESIZE_HANDLE_DECORATION}::after {
-          right: ${(resizeHandlerAreaWidth - resizeLineWidth) / 2 + 1}px;
-        }
-      }
-      /* when selected put it back to normal -- :not selector would be nicer */
-      tr.sticky
-        td.${ClassName.WITH_RESIZE_LINE}.${ClassName.SELECTED_CELL},
-        tr.sticky
-        th.${ClassName.WITH_RESIZE_LINE}.${ClassName.SELECTED_CELL} {
-        .${ClassName.RESIZE_HANDLE_DECORATION}::after {
-          right: ${(resizeHandlerAreaWidth - resizeLineWidth) / 2}px;
-        }
-      }
-    }
-    tr.sticky
-      .${ClassName.HOVERED_CELL},
-      tr.sticky
-      .${ClassName.SELECTED_CELL} {
-      z-index: 1;
-    }
-    .${ClassName.WITH_CONTROLS} tr.sticky {
-      padding-top: ${tableControlsSpacing}px;
-    }
-    .${ClassName.WITH_CONTROLS}.${ClassName.TABLE_STICKY}
-      .${ClassName.NUMBERED_COLUMN}
-      .${ClassName.NUMBERED_COLUMN_BUTTON}:first-of-type {
-      margin-top: ${tableControlsSpacing + 2}px;
-    }
-    .${ClassName.CORNER_CONTROLS}.sticky {
-      border-top: ${tableControlsSpacing - tableToolbarSize + 2}px solid
-        ${token('elevation.surface', 'white')};
-    }
-    ${(_props$featureFlags = props.featureFlags) !== null && _props$featureFlags !== void 0 && _props$featureFlags.stickyHeadersOptimization ? sentinelStyles : ''}
-    ${OverflowShadow(props)}
-    .${ClassName.TABLE_STICKY} .${ClassName.TABLE_STICKY_SHADOW} {
-      height: 0; // stop overflow flash & set correct height in update-overflow-shadows.ts
-    }
-    .less-padding {
-      padding: 0 ${tablePadding}px;
-      .${ClassName.ROW_CONTROLS_WRAPPER} {
-        padding: 0 ${tablePadding}px;
-      }
-      &.${ClassName.TABLE_CONTAINER}[data-number-column='true'] {
-        padding-left: ${akEditorTableNumberColumnWidth + tablePadding - 1}px;
-      }
-      .${ClassName.TABLE_LEFT_SHADOW} {
-        left: 6px;
-      }
-      .${ClassName.TABLE_RIGHT_SHADOW} {
-        left: calc(100% - 6px);
-      }
-    }
-    > .${ClassName.NODEVIEW_WRAPPER} {
-      /**
-       * Prevent margins collapsing, aids with placing the gap-cursor correctly
-       * @see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing
-       *
-       * TODO: Enable this, many tests will fail!
-       * border-top: 1px solid transparent;
-       */
-    }
-    /* Breakout only works on top level */
-    > * .${ClassName.NODEVIEW_WRAPPER} .${ClassName.TABLE_CONTAINER} {
-      margin-left: unset !important;
-      width: 100% !important;
-    }
-    ${columnControlsDecoration(props)};
-    /* Corner controls */
-    .${ClassName.CORNER_CONTROLS} {
-      width: ${tableToolbarSize + 1}px;
-      height: ${cornerControlHeight}px;
-      display: none;
-      .${ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER} {
-        position: relative;
-        ${InsertMarker(props, `
-          left: -11px;
-          top: 9px;
-        `)};
-      }
-      .${ClassName.CORNER_CONTROLS_INSERT_COLUMN_MARKER} {
-        position: relative;
-        ${InsertMarker(props, `
-          right: -1px;
-          top: -12px;
-        `)};
-      }
-    }
-    .${ClassName.CORNER_CONTROLS}.sticky {
-      .${ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER} {
-        /* sticky row insert dot overlaps other row insert and messes things up */
-        display: none !important;
-      }
-    }
-    .${ClassName.CONTROLS_CORNER_BUTTON} {
-      position: absolute;
-      top: 0;
-      width: ${tableToolbarSize + 1}px;
-      height: ${tableToolbarSize + 1}px;
-      border: 1px solid ${tableBorderColor(props)};
-      border-radius: 0;
-      border-top-left-radius: ${tableBorderRadiusSize}px;
-      background: ${tableToolbarColor(props)};
-      box-sizing: border-box;
-      padding: 0;
-      :focus {
-        outline: none;
-      }
-    }
-    .active .${ClassName.CONTROLS_CORNER_BUTTON} {
-      border-color: ${tableBorderSelectedColor};
-      background: ${tableToolbarSelectedColor};
-    }
-    .${ClassName.TABLE_CONTAINER}[data-number-column='true'] {
-      .${ClassName.CORNER_CONTROLS}, .${ClassName.CONTROLS_CORNER_BUTTON} {
-        width: ${akEditorTableToolbarSize + akEditorTableNumberColumnWidth}px;
-      }
-      .${ClassName.ROW_CONTROLS} .${ClassName.CONTROLS_BUTTON} {
-        border-right-width: 0;
-      }
-    }
-    :not(.${ClassName.IS_RESIZING}) .${ClassName.CONTROLS_CORNER_BUTTON}:hover {
-      border-color: ${tableBorderSelectedColor};
-      background: ${tableToolbarSelectedColor};
-      cursor: pointer;
-    }
-    :not(.${ClassName.IS_RESIZING})
-      .${ClassName.CONTROLS_CORNER_BUTTON}.${ClassName.HOVERED_CELL_IN_DANGER} {
-      border-color: ${tableBorderDeleteColor};
-      background: ${tableToolbarDeleteColor};
-    }
-    /* Row controls */
-    .${ClassName.ROW_CONTROLS} {
-      width: ${tableToolbarSize}px;
-      box-sizing: border-box;
-      display: none;
-      position: relative;
-      ${InsertMarker(props, `
-        bottom: -1px;
-        left: -11px;
-      `)};
-      .${ClassName.ROW_CONTROLS_INNER} {
-        display: flex;
-        flex-direction: column;
-      }
-      .${ClassName.ROW_CONTROLS_BUTTON_WRAP}:last-child > button {
-        border-bottom-left-radius: ${tableBorderRadiusSize}px;
-      }
-      .${ClassName.ROW_CONTROLS_BUTTON_WRAP} {
-        position: relative;
-        margin-top: -1px;
-      }
-      .${ClassName.ROW_CONTROLS_BUTTON_WRAP}:hover,
-        .${ClassName.ROW_CONTROLS_BUTTON_WRAP}.active,
-        .${ClassName.CONTROLS_BUTTON}:hover {
-        z-index: ${akEditorUnitZIndex};
-      }
-      ${HeaderButton(props, `
-        border-bottom: 1px solid ${tableBorderColor(props)};
-        border-right: 0px;
-        border-radius: 0;
-        height: 100%;
-        width: ${tableToolbarSize}px;
-        .${ClassName.CONTROLS_BUTTON_OVERLAY} {
-          position: absolute;
-          width: 30px;
-          height: 50%;
-          right: 0;
-          bottom: 0;
-        }
-        .${ClassName.CONTROLS_BUTTON_OVERLAY}:first-of-type {
-          top: 0;
-        }
-      `)}
-    }
-    :not(.${ClassName.IS_RESIZING}) .${ClassName.ROW_CONTROLS} {
-      ${HeaderButtonHover()}
-      ${HeaderButtonDanger()}
-    }
-    /* Numbered column */
-    .${ClassName.NUMBERED_COLUMN} {
-      position: relative;
-      float: right;
-      margin-left: ${akEditorTableToolbarSize - 1}px;
-      top: ${akEditorTableToolbarSize}px;
-      width: ${akEditorTableNumberColumnWidth + 1}px;
-      box-sizing: border-box;
-    }
-    .${ClassName.NUMBERED_COLUMN_BUTTON} {
-      border: 1px solid ${tableBorderColor(props)};
-      box-sizing: border-box;
-      margin-top: -1px;
-      padding-bottom: 2px;
-      padding: 10px 2px;
-      text-align: center;
-      font-size: ${relativeFontSizeToBase16(fontSize())};
-      background-color: ${tableToolbarColor(props)};
-      color: ${tableTextColor(props)};
-      border-color: ${tableBorderColor(props)};
-      :first-child:not(style),
-      style:first-child + * {
-        margin-top: 0;
-      }
-      :last-child {
-        border-bottom: 1px solid ${tableBorderColor(props)};
-      }
-    }
-    .${ClassName.WITH_CONTROLS} {
-      .${ClassName.CORNER_CONTROLS}, .${ClassName.ROW_CONTROLS} {
-        display: block;
-      }
-      .${ClassName.NUMBERED_COLUMN} {
-        padding-left: 1px;
-        .${ClassName.NUMBERED_COLUMN_BUTTON} {
-          border-left: 0 none;
-        }
-        .${ClassName.NUMBERED_COLUMN_BUTTON}.active {
-          border-bottom: 1px solid ${tableBorderSelectedColor};
-          border-color: ${tableBorderSelectedColor};
-          background-color: ${tableToolbarSelectedColor};
-          position: relative;
-          z-index: ${akEditorUnitZIndex};
-          color: ${token('color.text.inverse', N0)};
-        }
-      }
-    }
-    :not(.${ClassName.IS_RESIZING}) .${ClassName.WITH_CONTROLS} {
-      .${ClassName.NUMBERED_COLUMN_BUTTON} {
-        cursor: pointer;
-      }
-      .${ClassName.NUMBERED_COLUMN_BUTTON}:hover {
-        border-bottom: 1px solid ${tableBorderSelectedColor};
-        border-color: ${tableBorderSelectedColor};
-        background-color: ${tableToolbarSelectedColor};
-        position: relative;
-        z-index: ${akEditorUnitZIndex};
-        color: ${token('color.text.inverse', N0)};
-      }
-      .${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_IN_DANGER} {
-        background-color: ${tableToolbarDeleteColor};
-        border: 1px solid ${tableBorderDeleteColor};
-        border-left: 0;
-        color: ${token('color.text.inverse', R500)};
-        position: relative;
-        z-index: ${akEditorUnitZIndex};
-      }
-    }
-    /* Table */
-    .${ClassName.TABLE_NODE_WRAPPER} > table {
-      table-layout: fixed;
-      .${ClassName.COLUMN_CONTROLS_DECORATIONS} + * {
-        margin-top: 0;
-      }
-      /*
-       * Headings have a top margin by default, but we don't want this on the
-       * first heading within table header cells.
-       *
-       * This specifically sets margin-top for the first heading within a header
-       * cell when center/right aligned.
-       */
-      th.${ClassName.TABLE_HEADER_CELL} > .fabric-editor-block-mark {
-        > h1:first-of-type,
-        > h2:first-of-type,
-        > h3:first-of-type,
-        > h4:first-of-type,
-        > h5:first-of-type,
-        > h6:first-of-type {
-          margin-top: 0;
-        }
-      }
-      .${ClassName.SELECTED_CELL}, .${ClassName.HOVERED_CELL_IN_DANGER} {
-        position: relative;
-      }
-      /* Give selected cells a blue overlay */
-      .${ClassName.SELECTED_CELL}::after,
-        .${ClassName.HOVERED_CELL_IN_DANGER}::after {
-        z-index: ${akEditorSmallZIndex};
-        position: absolute;
-        content: '';
-        left: 0;
-        right: 0;
-        top: 0;
-        bottom: 0;
-        width: 100%;
-        pointer-events: none;
-      }
-      .${ClassName.SELECTED_CELL} {
-        border: 1px solid ${tableBorderSelectedColor};
-      }
-      .${ClassName.SELECTED_CELL}::after {
-        background: ${tableCellSelectedColor};
-        z-index: ${akEditorSmallZIndex};
-      }
-      th.${ClassName.HOVERED_CELL_IN_DANGER}::after,
-        td.${ClassName.HOVERED_CELL_IN_DANGER}::after {
-        background: ${tableCellDeleteColor};
-        z-index: ${akEditorUnitZIndex * 100};
-      }
-      // ED-15246: Trello card is visible through a border of a table border
-      td.${ClassName.HOVERED_CELL}, td.${ClassName.SELECTED_CELL} {
-        &::after {
-          height: 100%;
-          width: 100%;
-          border: 1px solid ${tableBorderSelectedColor};
-          content: '';
-          position: absolute;
-          left: -1px;
-          top: -1px;
-          bottom: 0;
-          z-index: ${akEditorSmallZIndex};
-          display: inline-block;
-          pointer-events: none;
-        }
-        &.${ClassName.HOVERED_CELL_IN_DANGER}::after {
-          border: 1px solid ${tableBorderDeleteColor};
-          z-index: ${akEditorUnitZIndex * 100};
-        }
-      }
-    }
-    .${ClassName.ROW_CONTROLS_WRAPPER} {
-      position: absolute;
-      /* top of corner control is table margin top - corner control height + 1 pixel of table border. */
-      top: ${tableMarginTop - cornerControlHeight + 1}px;
-    }
-    .${ClassName.ROW_CONTROLS_WRAPPER}.${ClassName.TABLE_LEFT_SHADOW} {
-      z-index: ${akEditorUnitZIndex};
-    }
-    .${ClassName.ROW_CONTROLS_WRAPPER} {
-      left: -${tableToolbarSize}px;
-    }
-    .${ClassName.TABLE_NODE_WRAPPER} {
-      /*
-      compensating for half of the insert column button
-      that is aligned to the right edge initially on hover of the top right column control when table overflown,
-      its center should be aligned with the edge
-       */
-      padding-right: ${tableInsertColumnButtonSize / 2}px;
-      margin-right: -${tableInsertColumnButtonSize / 2}px;
-      padding-bottom: ${tableScrollbarOffset}px;
-      margin-bottom: -${tableScrollbarOffset}px;
-      /* fixes gap cursor height */
-      overflow: auto;
-      position: relative;
-    }
-  }
-  .ProseMirror.${ClassName.IS_RESIZING} {
-    .${ClassName.TABLE_NODE_WRAPPER} {
-      overflow-x: auto;
-      ${scrollbarStyles};
-    }
-  }
-  .ProseMirror.${ClassName.RESIZE_CURSOR} {
-    cursor: col-resize;
-  }
-  .ProseMirror .pm-table-cell-content-wrap ol[data-child-count='100+'] {
-    padding-left: revert;
-  }
-`;
-};
-export const tableFullPageEditorStyles = css`
-  .ProseMirror .${ClassName.TABLE_NODE_WRAPPER} > table {
-    margin-left: 0;
-    margin-right: 0;
-    width: 100%;
-  }
-`;
-export const tableCommentEditorStyles = css`
-  .ProseMirror .${ClassName.TABLE_NODE_WRAPPER} > table {
-    margin-left: 0;
-    margin-right: 0;
-    ${scrollbarStyles};
-  }
-`;

package/dist/es2019/plugins/table/ui/consts.js DELETED Viewed

@@ -1,61 +0,0 @@
-import { B200, B300, N0, N20, R400, R75, DN400, N200, DN30 } from '@atlaskit/theme/colors';
-import { tableCellBorderWidth, tableMarginTop } from '@atlaskit/editor-common/styles';
-import { akEditorTableBorder, akEditorTableBorderDark, akEditorTableToolbar, akEditorTableToolbarDark, akEditorTableToolbarSize, akEditorUnitZIndex, akRichMediaResizeZIndex } from '@atlaskit/editor-shared-styles';
-import { token } from '@atlaskit/tokens';
-import { RESIZE_HANDLE_AREA_DECORATION_GAP } from '../types';
-import { themed } from '@atlaskit/theme/components';
-/**
- * Basic colors added to prevent content overflow in table cells.
- */
-// TODO: https://product-fabric.atlassian.net/browse/DSP-4135
-// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-export const tableCellBackgroundColor = themed({
-  light: N0,
-  dark: DN30
-});
-export const tableToolbarColor = themed({
-  light: akEditorTableToolbar,
-  dark: akEditorTableToolbarDark
-});
-export const tableTextColor = themed({
-  light: token('color.text.subtlest', N200),
-  dark: token('color.text.subtlest', DN400)
-});
-export const tableBorderColor = themed({
-  light: token('color.border', akEditorTableBorder),
-  dark: token('color.border', akEditorTableBorderDark)
-});
-export const tableFloatingControlsColor = token('color.background.neutral', N20); // TODO: https://product-fabric.atlassian.net/browse/DSP-4461
-export const tableCellSelectedColor = token('color.blanket.selected', 'rgba(179, 212, 255, 0.3)');
-export const tableToolbarSelectedColor = token('color.background.selected.bold', B200);
-export const tableBorderSelectedColor = token('color.border.selected', B300);
-export const tableCellDeleteColor = token('color.blanket.danger', 'rgba(255, 235, 230, 0.3)');
-export const tableBorderDeleteColor = token('color.border.danger', R400);
-export const tableToolbarDeleteColor = token('color.background.danger.bold', R75);
-export const tableBorderRadiusSize = 3;
-export const tablePadding = 8;
-export const tableScrollbarOffset = 15;
-export const tableMarginFullWidthMode = 2;
-export const tableInsertColumnButtonSize = 20;
-export const tableDeleteButtonSize = 16;
-export const tableDeleteButtonOffset = 6;
-export const tableToolbarSize = akEditorTableToolbarSize;
-export const tableControlsSpacing = tableMarginTop + tablePadding - tableCellBorderWidth;
-export const tableInsertColumnButtonOffset = 3;
-export const layoutButtonSize = 32;
-export const lineMarkerOffsetFromColumnControls = 13;
-export const lineMarkerSize = 4;
-export const columnControlsDecorationHeight = 25;
-export const columnControlsZIndex = akEditorUnitZIndex * 10;
-export const columnControlsSelectedZIndex = columnControlsZIndex + 1;
-export const columnResizeHandleZIndex = columnControlsSelectedZIndex + 1;
-export const resizeHandlerAreaWidth = RESIZE_HANDLE_AREA_DECORATION_GAP / 3;
-export const resizeLineWidth = 2;
-export const resizeHandlerZIndex = columnControlsZIndex + akRichMediaResizeZIndex;
-export const contextualMenuTriggerSize = 16;
-export const contextualMenuDropdownWidth = 180;
-export const stickyRowZIndex = resizeHandlerZIndex + 2;
-export const stickyRowOffsetTop = 8;
-export const stickyHeaderBorderBottomWidth = 1;