@atlaskit/editor-common 81.1.4 → 81.2.0

package/dist/es2019/styles/shared/table.js

@@ -37,146 +37,144 @@ export const TableSharedCssClassName = {
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Appears safe to auto-fix, but leaving it up to the team to remediate as the readability only gets worse with autofixing
 const tableSharedStyle = () => css`
-  ${tableCellBackgroundStyleOverride()}
-  .${TableSharedCssClassName.TABLE_CONTAINER} {
-    position: relative;
-    margin: 0 auto ${"var(--ds-space-200, 16px)"};
-    box-sizing: border-box;
+	${tableCellBackgroundStyleOverride()}
+	.${TableSharedCssClassName.TABLE_CONTAINER} {
+		position: relative;
+		margin: 0 auto ${"var(--ds-space-200, 16px)"};
+		box-sizing: border-box;
 
-    /**
+		/**
      * Fix block top alignment inside table cells.
      */
-    .decisionItemView-content-wrap:first-of-type > div {
-      margin-top: 0;
-    }
-  }
-  .${TableSharedCssClassName.TABLE_CONTAINER}[data-number-column='true'] {
-    padding-left: ${akEditorTableNumberColumnWidth - 1}px;
-    clear: both;
-  }
-
-  .${TableSharedCssClassName.TABLE_RESIZER_CONTAINER} {
-    will-change: width, margin-left;
-  }
-
-  .${TableSharedCssClassName.TABLE_RESIZER_CONTAINER} table {
-    will-change: width;
-  }
-
-  .${TableSharedCssClassName.TABLE_NODE_WRAPPER} > table {
-    margin: ${"var(--ds-space-300, 24px)"} 0 0 0;
-  }
-
-  .${TableSharedCssClassName.TABLE_CONTAINER} > table,
-  .${TableSharedCssClassName.TABLE_STICKY_WRAPPER} > table {
-    margin: ${"var(--ds-space-300, 24px)"} ${"var(--ds-space-100, 8px)"} 0 0;
-  }
-
-  /* avoid applying styles to nested tables (possible via extensions) */
-  .${TableSharedCssClassName.TABLE_CONTAINER} > table,
-  .${TableSharedCssClassName.TABLE_NODE_WRAPPER} > table,
-  .${TableSharedCssClassName.TABLE_STICKY_WRAPPER} > table {
-    border-collapse: collapse;
-    border: ${tableCellBorderWidth}px solid
-      ${`var(--ds-background-accent-gray-subtler, ${akEditorTableBorder})`};
-    table-layout: fixed;
-    font-size: 1em;
-    width: 100%;
-
-    &[data-autosize='true'] {
-      table-layout: auto;
-    }
-
-    & {
-      * {
-        box-sizing: border-box;
-      }
-      hr {
-        box-sizing: content-box;
-      }
-
-      tbody {
-        border-bottom: none;
-      }
-      th td {
-        background-color: ${"var(--ds-background-neutral-subtle, white)"};
-      }
-      th,
-      td {
-        min-width: ${tableCellMinWidth}px;
-        font-weight: normal;
-        vertical-align: top;
-        border: 1px solid
-          ${`var(--ds-background-accent-gray-subtler, ${akEditorTableBorder})`};
-        border-right-width: 0;
-        border-bottom-width: 0;
-        padding: ${"var(--ds-space-100, 8px)"};
-        /* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */
-        ${browser.gecko || browser.ie || browser.mac && browser.chrome ? 'background-clip: padding-box;' : ''}
-
-        > :first-child:not(style),
+		.decisionItemView-content-wrap:first-of-type > div {
+			margin-top: 0;
+		}
+	}
+	.${TableSharedCssClassName.TABLE_CONTAINER}[data-number-column='true'] {
+		padding-left: ${akEditorTableNumberColumnWidth - 1}px;
+		clear: both;
+	}
+
+	.${TableSharedCssClassName.TABLE_RESIZER_CONTAINER} {
+		will-change: width, margin-left;
+	}
+
+	.${TableSharedCssClassName.TABLE_RESIZER_CONTAINER} table {
+		will-change: width;
+	}
+
+	.${TableSharedCssClassName.TABLE_NODE_WRAPPER} > table {
+		margin: ${"var(--ds-space-300, 24px)"} 0 0 0;
+	}
+
+	.${TableSharedCssClassName.TABLE_CONTAINER} > table,
+	.${TableSharedCssClassName.TABLE_STICKY_WRAPPER} > table {
+		margin: ${"var(--ds-space-300, 24px)"} ${"var(--ds-space-100, 8px)"} 0 0;
+	}
+
+	/* avoid applying styles to nested tables (possible via extensions) */
+	.${TableSharedCssClassName.TABLE_CONTAINER} > table,
+	.${TableSharedCssClassName.TABLE_NODE_WRAPPER} > table,
+	.${TableSharedCssClassName.TABLE_STICKY_WRAPPER} > table {
+		border-collapse: collapse;
+		border: ${tableCellBorderWidth}px solid
+			${`var(--ds-background-accent-gray-subtler, ${akEditorTableBorder})`};
+		table-layout: fixed;
+		font-size: 1em;
+		width: 100%;
+
+		&[data-autosize='true'] {
+			table-layout: auto;
+		}
+
+		& {
+			* {
+				box-sizing: border-box;
+			}
+			hr {
+				box-sizing: content-box;
+			}
+
+			tbody {
+				border-bottom: none;
+			}
+			th td {
+				background-color: ${"var(--ds-background-neutral-subtle, white)"};
+			}
+			th,
+			td {
+				min-width: ${tableCellMinWidth}px;
+				font-weight: normal;
+				vertical-align: top;
+				border: 1px solid ${`var(--ds-background-accent-gray-subtler, ${akEditorTableBorder})`};
+				border-right-width: 0;
+				border-bottom-width: 0;
+				padding: ${"var(--ds-space-100, 8px)"};
+				/* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */
+				${browser.gecko || browser.ie || browser.mac && browser.chrome ? 'background-clip: padding-box;' : ''}
+
+				> :first-child:not(style),
         > style:first-child + * {
-          margin-top: 0;
-        }
-
-        > .ProseMirror-gapcursor:first-child + *,
-        > style:first-child + .ProseMirror-gapcursor + * {
-          margin-top: 0;
-        }
-
-        > .ProseMirror-gapcursor:first-child + span + *,
-        > style:first-child + .ProseMirror-gapcursor + span + * {
-          margin-top: 0;
-        }
-
-        th p:not(:first-of-type),
-        td p:not(:first-of-type) {
-          margin-top: ${"var(--ds-space-150, 12px)"};
-        }
-      }
-      th {
-        background-color: ${`var(--ds-background-accent-gray-subtlest, ${akEditorTableToolbar})`};
-        text-align: left;
-
-        /* only apply this styling to codeblocks in default background headercells */
-        /* TODO this needs to be overhauled as it relies on unsafe selectors */
-        &:not([style]):not(.danger) {
-          .${CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER}:not(.danger) {
-            background-color: ${"var(--ds-surface-raised, rgb(235, 237, 240))"};
-
-            :not(.${akEditorSelectedNodeClassName}) {
-              box-shadow: 0px 0px 0px 1px
-                ${"var(--ds-border, transparent)"};
-            }
-
-            .${CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER} {
-              background-image: ${overflowShadow({
+					margin-top: 0;
+				}
+
+				> .ProseMirror-gapcursor:first-child + *,
+				> style:first-child + .ProseMirror-gapcursor + * {
+					margin-top: 0;
+				}
+
+				> .ProseMirror-gapcursor:first-child + span + *,
+				> style:first-child + .ProseMirror-gapcursor + span + * {
+					margin-top: 0;
+				}
+
+				th p:not(:first-of-type),
+				td p:not(:first-of-type) {
+					margin-top: ${"var(--ds-space-150, 12px)"};
+				}
+			}
+			th {
+				background-color: ${`var(--ds-background-accent-gray-subtlest, ${akEditorTableToolbar})`};
+				text-align: left;
+
+				/* only apply this styling to codeblocks in default background headercells */
+				/* TODO this needs to be overhauled as it relies on unsafe selectors */
+				&:not([style]):not(.danger) {
+					.${CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER}:not(.danger) {
+						background-color: ${"var(--ds-surface-raised, rgb(235, 237, 240))"};
+
+						:not(.${akEditorSelectedNodeClassName}) {
+							box-shadow: 0px 0px 0px 1px ${"var(--ds-border, transparent)"};
+						}
+
+						.${CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER} {
+							background-image: ${overflowShadow({
   leftCoverWidth: "var(--ds-space-300, 24px)"
 })};
 
-              background-color: ${"var(--ds-background-neutral, rgb(235, 237, 240))"};
-            }
+							background-color: ${"var(--ds-background-neutral, rgb(235, 237, 240))"};
+						}
 
-            .${CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER} {
-              background-color: ${"var(--ds-background-neutral, rgb(226, 229, 233))"};
-            }
+						.${CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER} {
+							background-color: ${"var(--ds-background-neutral, rgb(226, 229, 233))"};
+						}
 
-            /* this is only relevant to the element taken care of by renderer */
-            > [data-ds--code--code-block] {
-              background-image: ${overflowShadow({
+						/* this is only relevant to the element taken care of by renderer */
+						> [data-ds--code--code-block] {
+							background-image: ${overflowShadow({
   leftCoverWidth: "var(--ds-space-300, 24px)"
 })}!important;
 
-              background-color: ${"var(--ds-background-neutral, rgb(235, 237, 240))"}!important;
+							background-color: ${"var(--ds-background-neutral, rgb(235, 237, 240))"}!important;
 
-              // selector lives inside @atlaskit/code
-              --ds--code--line-number-bg-color: ${"var(--ds-background-neutral, rgb(226, 229, 233))"};
-            }
-          }
-        }
-      }
-    }
-  }
+							// selector lives inside @atlaskit/code
+							--ds--code--line-number-bg-color: ${"var(--ds-background-neutral, rgb(226, 229, 233))"};
+						}
+					}
+				}
+			}
+		}
+	}
 `;
 export const calcTableWidth = (layout, containerWidth, addControllerPadding = true) => {
   switch (layout) {

package/dist/es2019/styles/shared/task-decision.js

@@ -7,58 +7,58 @@ export const TaskDecisionSharedCssClassName = {
   TASK_ITEM: 'task-item'
 };
 export const tasksAndDecisionsStyles = css`
-  .ProseMirror {
-    .taskItemView-content-wrap,
-    .${TaskDecisionSharedCssClassName.DECISION_CONTAINER} {
-      position: relative;
-      min-width: ${akEditorTableCellMinWidth}px;
-    }
+	.ProseMirror {
+		.taskItemView-content-wrap,
+		.${TaskDecisionSharedCssClassName.DECISION_CONTAINER} {
+			position: relative;
+			min-width: ${akEditorTableCellMinWidth}px;
+		}
 
-    .${TaskDecisionSharedCssClassName.DECISION_CONTAINER} {
-      margin-top: 0;
-    }
+		.${TaskDecisionSharedCssClassName.DECISION_CONTAINER} {
+			margin-top: 0;
+		}
 
-    .${TaskDecisionSharedCssClassName.TASK_CONTAINER} {
-      span[contenteditable='false'] {
-        height: ${akEditorLineHeight}em;
-      }
-    }
+		.${TaskDecisionSharedCssClassName.TASK_CONTAINER} {
+			span[contenteditable='false'] {
+				height: ${akEditorLineHeight}em;
+			}
+		}
 
-    .${TaskDecisionSharedCssClassName.TASK_ITEM} {
-      line-height: ${akEditorLineHeight};
-    }
-  }
+		.${TaskDecisionSharedCssClassName.TASK_ITEM} {
+			line-height: ${akEditorLineHeight};
+		}
+	}
 
-  div[data-task-local-id] {
-    span[contenteditable='false'] {
-      height: ${akEditorLineHeight}em;
-    }
-    span[contenteditable='false'] + div {
-      line-height: ${akEditorLineHeight}em;
-    }
-  }
+	div[data-task-local-id] {
+		span[contenteditable='false'] {
+			height: ${akEditorLineHeight}em;
+		}
+		span[contenteditable='false'] + div {
+			line-height: ${akEditorLineHeight}em;
+		}
+	}
 
-  div[data-task-list-local-id] {
-    margin: ${"var(--ds-space-150, 12px)"} 0 0 0;
-  }
+	div[data-task-list-local-id] {
+		margin: ${"var(--ds-space-150, 12px)"} 0 0 0;
+	}
 
-  div[data-task-list-local-id] {
-    // If task item is not first in the list then set margin top to 4px.
-    div + div {
-      margin-top: ${"var(--ds-space-050, 4px)"};
-    }
-  }
+	div[data-task-list-local-id] {
+		// If task item is not first in the list then set margin top to 4px.
+		div + div {
+			margin-top: ${"var(--ds-space-050, 4px)"};
+		}
+	}
 
-  // If task list is not first in the document then set margin top to 4px.
-  div[data-task-list-local-id] div[data-task-list-local-id] {
-    margin-top: ${"var(--ds-space-050, 4px)"};
-    margin-left: ${"var(--ds-space-300, 24px)"};
-  }
+	// If task list is not first in the document then set margin top to 4px.
+	div[data-task-list-local-id] div[data-task-list-local-id] {
+		margin-top: ${"var(--ds-space-050, 4px)"};
+		margin-left: ${"var(--ds-space-300, 24px)"};
+	}
 
-  /* When action list is inside panel */
-  .ak-editor-panel__content {
-    > div[data-task-list-local-id]:first-child {
-      margin: 0 0 0 0 !important;
-    }
-  }
+	/* When action list is inside panel */
+	.ak-editor-panel__content {
+		> div[data-task-list-local-id]:first-child {
+			margin: 0 0 0 0 !important;
+		}
+	}
 `;

package/dist/es2019/styles/shared/unsupported-content.js

@@ -9,21 +9,21 @@ const blockUnsupportedSelector = `.${UnsupportedSharedCssClassName.BLOCK_CONTAIN
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Nested `getSelectionStyles` would need a rebuild to autofix
 export const unsupportedStyles = css`
-  ${blockUnsupportedSelector}, ${inlineUnsupportedSelector} {
-    cursor: pointer;
-  }
+	${blockUnsupportedSelector}, ${inlineUnsupportedSelector} {
+		cursor: pointer;
+	}
 
-  .${akEditorSelectedNodeClassName}${blockUnsupportedSelector},
-    .${akEditorSelectedNodeClassName}${inlineUnsupportedSelector} {
-    ${getSelectionStyles([SelectionStyle.Background, SelectionStyle.Border])}
-  }
+	.${akEditorSelectedNodeClassName}${blockUnsupportedSelector},
+		.${akEditorSelectedNodeClassName}${inlineUnsupportedSelector} {
+		${getSelectionStyles([SelectionStyle.Background, SelectionStyle.Border])}
+	}
 
-  .danger {
-    .${akEditorSelectedNodeClassName}${blockUnsupportedSelector},
-      .${akEditorSelectedNodeClassName}${inlineUnsupportedSelector} {
-      border: ${akEditorSelectedBorderSize}px solid
-        ${`var(--ds-border-danger, ${akEditorDeleteBorder})`};
-      background-color: ${`var(--ds-blanket-danger, ${akEditorDeleteBackgroundWithOpacity})`};
-    }
-  }
+	.danger {
+		.${akEditorSelectedNodeClassName}${blockUnsupportedSelector},
+			.${akEditorSelectedNodeClassName}${inlineUnsupportedSelector} {
+			border: ${akEditorSelectedBorderSize}px solid
+				${`var(--ds-border-danger, ${akEditorDeleteBorder})`};
+			background-color: ${`var(--ds-blanket-danger, ${akEditorDeleteBackgroundWithOpacity})`};
+		}
+	}
 `;

package/dist/es2019/table/SortingIcon.js

@@ -16,49 +16,49 @@ export let StatusClassNames = /*#__PURE__*/function (StatusClassNames) {
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
 const buttonStyles = css`
-  position: absolute;
-  display: flex;
-  height: 28px;
-  width: 28px;
-  margin: ${"var(--ds-space-075, 6px)"};
-  right: 0;
-  top: 0;
-  border: 2px solid ${"var(--ds-border, #fff)"};
-  border-radius: ${"var(--ds-border-radius-100, 4px)"};
-  background-color: ${`var(--ds-surface-overlay, ${N20})`};
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
+	position: absolute;
+	display: flex;
+	height: 28px;
+	width: 28px;
+	margin: ${"var(--ds-space-075, 6px)"};
+	right: 0;
+	top: 0;
+	border: 2px solid ${"var(--ds-border, #fff)"};
+	border-radius: ${"var(--ds-border-radius-100, 4px)"};
+	background-color: ${`var(--ds-surface-overlay, ${N20})`};
+	justify-content: center;
+	align-items: center;
+	cursor: pointer;
 
-  &:hover {
-    background-color: ${`var(--ds-surface-overlay-hovered, ${N30})`};
-  }
+	&:hover {
+		background-color: ${`var(--ds-surface-overlay-hovered, ${N30})`};
+	}
 
-  &:active {
-    background-color: ${"var(--ds-surface-overlay-pressed, rgba(179, 212, 255, 0.6))"};
-  }
+	&:active {
+		background-color: ${"var(--ds-surface-overlay-pressed, rgba(179, 212, 255, 0.6))"};
+	}
 
-  &.${SORTABLE_COLUMN_ICON_CLASSNAME}__not-allowed {
-    cursor: not-allowed;
-  }
+	&.${SORTABLE_COLUMN_ICON_CLASSNAME}__not-allowed {
+		cursor: not-allowed;
+	}
 `;
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
 const iconWrapperStyles = css`
-  width: 8px;
-  height: 12px;
-  transition: transform 0.3s cubic-bezier(0.15, 1, 0.3, 1);
-  transform-origin: 50% 50%;
-  display: flex;
-  justify-content: center;
+	width: 8px;
+	height: 12px;
+	transition: transform 0.3s cubic-bezier(0.15, 1, 0.3, 1);
+	transform-origin: 50% 50%;
+	display: flex;
+	justify-content: center;
 
-  &.${StatusClassNames.DESC} {
-    transform: rotate(-180deg);
-  }
+	&.${StatusClassNames.DESC} {
+		transform: rotate(-180deg);
+	}
 
-  &.${SORTABLE_COLUMN_ICON_CLASSNAME}-inactive {
-    opacity: 0.7;
-  }
+	&.${SORTABLE_COLUMN_ICON_CLASSNAME}-inactive {
+		opacity: 0.7;
+	}
 `;
 
 // The icon is created with CSS due to the following Firefox issue: https://product-fabric.atlassian.net/browse/ED-8001

package/dist/es2019/ui/DropList/index.js

@@ -7,7 +7,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "81.1.4";
+const packageVersion = "81.2.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/es2019/ui/Expand/index.js

@@ -114,21 +114,21 @@ const containerStyles = styleProps => {
 const contentStyles = styleProps => () =>
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
 css`
-    padding-top: ${styleProps.expanded ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0px)"};
-    padding-right: ${"var(--ds-space-100, 8px)"};
-    padding-left: ${"var(--ds-space-300, 24px)"};
-    margin-left: ${"var(--ds-space-050, 4px)"};
-    display: flow-root;
+		padding-top: ${styleProps.expanded ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0px)"};
+		padding-right: ${"var(--ds-space-100, 8px)"};
+		padding-left: ${"var(--ds-space-300, 24px)"};
+		margin-left: ${"var(--ds-space-050, 4px)"};
+		display: flow-root;
 
-    // The follow rules inside @supports block are added as a part of ED-8893
-    // The fix is targeting mobile bridge on iOS 12 or below,
-    // We should consider remove this fix when we no longer support iOS 12
-    @supports not (display: flow-root) {
-      width: 100%;
-      box-sizing: border-box;
-    }
+		// The follow rules inside @supports block are added as a part of ED-8893
+		// The fix is targeting mobile bridge on iOS 12 or below,
+		// We should consider remove this fix when we no longer support iOS 12
+		@supports not (display: flow-root) {
+			width: 100%;
+			box-sizing: border-box;
+		}
 
-    ${!styleProps.expanded ? `
+		${!styleProps.expanded ? `
         .expand-content-wrapper, .nestedExpand-content-wrapper {
           /* We visually hide the content here to preserve the content during copy+paste */
           /* Do not add text nowrap here because inline comment navigation depends on the location of the text */
@@ -140,7 +140,7 @@ css`
           user-select: none;
         }
       ` : ''}
-  `;
+	`;
 const titleInputStyles = () => css({
   outline: 'none',
   border: 'none',

package/dist/es2019/ui/FloatingToolbar/styles.js

@@ -4,10 +4,10 @@ export const iconOnlySpacing = {
   '&&': {
     padding: '0px',
     /**
-      Increased specificity here because css for .hyperlink-open-link defined in
-      packages/editor/editor-core/src/ui/ContentStyles/index.tsx file
-      overrides padding left-right 2px with 4px.
-    */
+        Increased specificity here because css for .hyperlink-open-link defined in
+        packages/editor/editor-core/src/ui/ContentStyles/index.tsx file
+        overrides padding left-right 2px with 4px.
+      */
     '&&[href]': {
       padding: '0 2px'
     }