@atlaskit/editor-core 209.6.5 → 209.7.0

package/dist/es2019/ui/ContentStyles/tasks-and-decisions.js

@@ -342,4 +342,210 @@ export const taskItemStyles = css({
       }
     }
   }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const taskItemStylesWithBlockTaskItem = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"], [data-prosemirror-node-name="blockTaskItem"]': {
+    listStyle: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="task-item-main"], [data-prosemirror-node-name="blockTaskItem"] [data-component="task-item-main"]': {
+    display: 'flex',
+    flexDirection: 'row',
+    position: 'relative'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="placeholder"], [data-prosemirror-node-name="blockTaskItem"] [data-component="placeholder"]': {
+    position: 'absolute',
+    color: "var(--ds-text-subtlest, #626F86)",
+    margin: `0 0 0 calc(${"var(--ds-space-100, 8px)"} * 3)`,
+    pointerEvents: 'none',
+    textOverflow: 'ellipsis',
+    overflow: 'hidden',
+    whiteSpace: 'nowrap',
+    maxWidth: 'calc(100% - 50px)',
+    display: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  "[data-prosemirror-node-name='taskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder'], [data-prosemirror-node-name='blockTaskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder']": {
+    display: 'block'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="content"], [data-prosemirror-node-name="blockTaskItem"] [data-component="content"]': {
+    margin: 0,
+    wordWrap: 'break-word',
+    minWidth: 0,
+    flex: '1 1 auto'
+  },
+  // copied styles from packages/design-system/icon/src/components/icon-new.tsx
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"], [data-prosemirror-node-name="blockTaskItem"] [data-component="checkbox-icon-wrap"]': {
+    display: 'inline-block',
+    boxSizing: 'border-box',
+    flexShrink: 0,
+    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
+    lineHeight: 1,
+    paddingInlineEnd: 'var(--ds--button--new-icon-padding-end, 0)',
+    paddingInlineStart: 'var(--ds--button--new-icon-padding-start, 0)'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"] svg, [data-prosemirror-node-name="blockTaskItem"] [data-component="checkbox-icon-wrap"] svg': {
+    overflow: 'hidden',
+    pointerEvents: 'none',
+    color: 'currentColor',
+    verticalAlign: 'bottom',
+    width: "var(--ds-space-200, 16px)",
+    height: "var(--ds-space-200, 16px)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-prosemirror-node-name="taskItem"] input[type=checkbox]:not(:checked) + span [data-component=checkbox-checked-icon], [data-prosemirror-node-name="blockTaskItem"] input[type=checkbox]:not(:checked) + span [data-component=checkbox-checked-icon]': {
+    display: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-prosemirror-node-name="taskItem"] input[type=checkbox]:not(:checked) + span [data-component=checkbox-unchecked-icon], [data-prosemirror-node-name="blockTaskItem"] input[type=checkbox]:not(:checked) + span [data-component=checkbox-unchecked-icon]': {
+    display: 'inline'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] input[type=checkbox]:checked + span [data-component=checkbox-checked-icon], [data-prosemirror-node-name="blockTaskItem"] input[type=checkbox]:checked + span [data-component=checkbox-checked-icon]': {
+    display: 'inline'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] input[type=checkbox]:checked + span [data-component=checkbox-unchecked-icon], [data-prosemirror-node-name="blockTaskItem"] input[type=checkbox]:checked + span [data-component=checkbox-unchecked-icon]': {
+    display: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+  [`[data-prosemirror-node-name="taskItem"] .${TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER}, [data-prosemirror-node-name="blockTaskItem"] .${TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER}`]: {
+    flex: '0 0 24px',
+    width: '24px',
+    height: '24px',
+    position: 'relative',
+    alignSelf: 'start',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "& > input[type='checkbox']": {
+      width: '16px',
+      height: '16px',
+      zIndex: 1,
+      cursor: 'pointer',
+      outline: 'none',
+      margin: 0,
+      opacity: 0,
+      position: 'absolute',
+      top: '50%',
+      left: '50%',
+      transform: 'translate(-50%, -50%)',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&[disabled]': {
+        cursor: 'default'
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '+ span': {
+        width: '24px',
+        height: '24px',
+        position: 'absolute',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)'
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '+ span > svg': {
+        boxSizing: 'border-box',
+        display: 'inline',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)',
+        maxWidth: 'unset',
+        maxHeight: 'unset',
+        position: 'absolute',
+        overflow: 'hidden',
+        color: "var(--ds-background-input, #FFFFFF)",
+        transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'path:first-of-type': {
+          visibility: 'hidden'
+        },
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-border-input, #8590A2)",
+          strokeWidth: 1,
+          transition: 'stroke 0.2s ease-in-out'
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '&:hover + span > svg': {
+        color: "var(--ds-background-input-hovered, #F7F8F9)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-border-input, #8590A2)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '&:checked:hover + span > svg': {
+        color: "var(--ds-background-selected-bold-hovered, #0055CC)",
+        fill: "var(--ds-icon-inverse, #FFFFFF)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-background-selected-bold-hovered, #0055CC)"
+        }
+      },
+      '&:checked': {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+        '+ span > svg': {
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+          'path:first-of-type': {
+            visibility: 'visible'
+          },
+          color: "var(--ds-background-selected-bold, #0C66E4)",
+          fill: "var(--ds-icon-inverse, #FFFFFF)",
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+          'rect:first-of-type': {
+            stroke: "var(--ds-background-selected-bold, #0C66E4)"
+          }
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:active + span > svg': {
+        color: "var(--ds-background-input-pressed, #FFFFFF)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-border, #091E4224)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:checked:active + span > svg': {
+        color: "var(--ds-background-input-pressed, #FFFFFF)",
+        fill: "var(--ds-icon-inverse, #FFFFFF)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-border, #091E4224)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:disabled + span > svg, &:disabled:hover + span > svg, &:disabled:focus + span > svg, &:disabled:active + span > svg': {
+        color: "var(--ds-background-disabled, #091E4208)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-background-disabled, #091E4208)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:disabled:checked + span > svg': {
+        fill: "var(--ds-icon-disabled, #091E424F)"
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:focus + span::after': {
+        position: 'absolute',
+        width: "var(--ds-space-200, 16px)",
+        height: "var(--ds-space-200, 16px)",
+        border: `2px solid ${"var(--ds-border-focused, #388BFF)"}`,
+        borderRadius: "var(--ds-space-050, 4px)",
+        content: "''",
+        display: 'block',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)'
+      }
+    }
+  }
 });

package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js

@@ -57,7 +57,7 @@ import { shadowStyles } from './styles/shadowStyles';
 import { editorControlsSmartCardStyles, linkingVisualRefreshV1Styles, smartCardStyles, smartCardStylesWithSearchMatch, smartCardStylesWithSearchMatchAndPreviewPanelResponsiveness, smartLinksInLivePagesStyles } from './styles/smartCardStyles';
 import { statusStyles, statusStylesMixin_fg_platform_component_visual_refresh, statusStylesMixin_fg_platform_component_visual_refresh_with_search_match, statusStylesMixin_without_fg_platform_component_visual_refresh, statusStylesMixin_without_fg_platform_component_visual_refresh_with_search_match } from './styles/statusStyles';
 import { tableCommentEditorStyles, tableLayoutFixes } from './styles/tableStyles';
-import { decisionStyles, tasksAndDecisionsStyles, decisionIconWithVisualRefresh, decisionIconWithoutVisualRefresh, taskItemStyles } from './styles/tasksAndDecisionsStyles';
+import { decisionStyles, tasksAndDecisionsStyles, decisionIconWithVisualRefresh, decisionIconWithoutVisualRefresh, taskItemStyles, taskItemStylesWithBlockTaskItem } from './styles/tasksAndDecisionsStyles';
 import { telepointerColorAndCommonStyle, telepointerStyle, telepointerStyleWithInitialOnly } from './styles/telepointerStyles';
 import { textColorStyles } from './styles/textColorStyles';
 import { textHighlightStyle } from './styles/textHighlightStyles';
@@ -218,6 +218,10 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     decisionStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    expValEqualsNoExposure('platform_editor_blocktaskitem_node', 'isEnabled', true) ?
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    taskItemStylesWithBlockTaskItem :
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     taskItemStyles, fg('platform-visual-refresh-icons') &&
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     decisionIconWithVisualRefresh, !fg('platform-visual-refresh-icons') &&

package/dist/es2019/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js

@@ -422,4 +422,210 @@ export const taskItemStyles = css({
       }
     }
   }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const taskItemStylesWithBlockTaskItem = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"], [data-prosemirror-node-name="blockTaskItem"]': {
+    listStyle: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="task-item-main"], [data-prosemirror-node-name="blockTaskItem"] [data-component="task-item-main"]': {
+    display: 'flex',
+    flexDirection: 'row',
+    position: 'relative'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="placeholder"], [data-prosemirror-node-name="blockTaskItem"] [data-component="placeholder"]': {
+    position: 'absolute',
+    color: "var(--ds-text-subtlest, #626F86)",
+    margin: `0 0 0 calc(${"var(--ds-space-100, 8px)"} * 3)`,
+    pointerEvents: 'none',
+    textOverflow: 'ellipsis',
+    overflow: 'hidden',
+    whiteSpace: 'nowrap',
+    maxWidth: 'calc(100% - 50px)',
+    display: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  "[data-prosemirror-node-name='taskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder'], [data-prosemirror-node-name='blockTaskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder']": {
+    display: 'block'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="content"], [data-prosemirror-node-name="blockTaskItem"] [data-component="content"]': {
+    margin: 0,
+    wordWrap: 'break-word',
+    minWidth: 0,
+    flex: '1 1 auto'
+  },
+  // copied styles from packages/design-system/icon/src/components/icon-new.tsx
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"], [data-prosemirror-node-name="blockTaskItem"] [data-component="checkbox-icon-wrap"]': {
+    display: 'inline-block',
+    boxSizing: 'border-box',
+    flexShrink: 0,
+    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
+    lineHeight: 1,
+    paddingInlineEnd: 'var(--ds--button--new-icon-padding-end, 0)',
+    paddingInlineStart: 'var(--ds--button--new-icon-padding-start, 0)'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"] svg, [data-prosemirror-node-name="blockTaskItem"] [data-component="checkbox-icon-wrap"] svg': {
+    overflow: 'hidden',
+    pointerEvents: 'none',
+    color: 'currentColor',
+    verticalAlign: 'bottom',
+    width: "var(--ds-space-200, 16px)",
+    height: "var(--ds-space-200, 16px)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-prosemirror-node-name="taskItem"] input[type=checkbox]:not(:checked) + span [data-component=checkbox-checked-icon], [data-prosemirror-node-name="blockTaskItem"] input[type=checkbox]:not(:checked) + span [data-component=checkbox-checked-icon]': {
+    display: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-prosemirror-node-name="taskItem"] input[type=checkbox]:not(:checked) + span [data-component=checkbox-unchecked-icon], [data-prosemirror-node-name="blockTaskItem"] input[type=checkbox]:not(:checked) + span [data-component=checkbox-unchecked-icon]': {
+    display: 'inline'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] input[type=checkbox]:checked + span [data-component=checkbox-checked-icon], [data-prosemirror-node-name="blockTaskItem"] input[type=checkbox]:checked + span [data-component=checkbox-checked-icon]': {
+    display: 'inline'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="taskItem"] input[type=checkbox]:checked + span [data-component=checkbox-unchecked-icon], [data-prosemirror-node-name="blockTaskItem"] input[type=checkbox]:checked + span [data-component=checkbox-unchecked-icon]': {
+    display: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+  [`[data-prosemirror-node-name="taskItem"] .${TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER}, [data-prosemirror-node-name="blockTaskItem"] .${TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER}`]: {
+    flex: '0 0 24px',
+    width: '24px',
+    height: '24px',
+    position: 'relative',
+    alignSelf: 'start',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "& > input[type='checkbox']": {
+      width: '16px',
+      height: '16px',
+      zIndex: 1,
+      cursor: 'pointer',
+      outline: 'none',
+      margin: 0,
+      opacity: 0,
+      position: 'absolute',
+      top: '50%',
+      left: '50%',
+      transform: 'translate(-50%, -50%)',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&[disabled]': {
+        cursor: 'default'
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '+ span': {
+        width: '24px',
+        height: '24px',
+        position: 'absolute',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)'
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '+ span > svg': {
+        boxSizing: 'border-box',
+        display: 'inline',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)',
+        maxWidth: 'unset',
+        maxHeight: 'unset',
+        position: 'absolute',
+        overflow: 'hidden',
+        color: "var(--ds-background-input, #FFFFFF)",
+        transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'path:first-of-type': {
+          visibility: 'hidden'
+        },
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-border-input, #8590A2)",
+          strokeWidth: 1,
+          transition: 'stroke 0.2s ease-in-out'
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '&:hover + span > svg': {
+        color: "var(--ds-background-input-hovered, #F7F8F9)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-border-input, #8590A2)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '&:checked:hover + span > svg': {
+        color: "var(--ds-background-selected-bold-hovered, #0055CC)",
+        fill: "var(--ds-icon-inverse, #FFFFFF)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-background-selected-bold-hovered, #0055CC)"
+        }
+      },
+      '&:checked': {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+        '+ span > svg': {
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+          'path:first-of-type': {
+            visibility: 'visible'
+          },
+          color: "var(--ds-background-selected-bold, #0C66E4)",
+          fill: "var(--ds-icon-inverse, #FFFFFF)",
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+          'rect:first-of-type': {
+            stroke: "var(--ds-background-selected-bold, #0C66E4)"
+          }
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:active + span > svg': {
+        color: "var(--ds-background-input-pressed, #FFFFFF)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-border, #091E4224)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:checked:active + span > svg': {
+        color: "var(--ds-background-input-pressed, #FFFFFF)",
+        fill: "var(--ds-icon-inverse, #FFFFFF)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-border, #091E4224)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:disabled + span > svg, &:disabled:hover + span > svg, &:disabled:focus + span > svg, &:disabled:active + span > svg': {
+        color: "var(--ds-background-disabled, #091E4208)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+        'rect:first-of-type': {
+          stroke: "var(--ds-background-disabled, #091E4208)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:disabled:checked + span > svg': {
+        fill: "var(--ds-icon-disabled, #091E424F)"
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      '&:focus + span::after': {
+        position: 'absolute',
+        width: "var(--ds-space-200, 16px)",
+        height: "var(--ds-space-200, 16px)",
+        border: `2px solid ${"var(--ds-border-focused, #388BFF)"}`,
+        borderRadius: "var(--ds-space-050, 4px)",
+        content: "''",
+        display: 'block',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)'
+      }
+    }
+  }
 });

package/dist/es2019/version-wrapper.js

@@ -1,2 +1,2 @@
 export const name = "@atlaskit/editor-core";
-export const version = "209.6.4";
+export const version = "209.6.5";

package/dist/esm/ui/ContentStyles/index.js

@@ -40,7 +40,7 @@ import { layoutStyles } from './layout';
 import { mediaStyles } from './media';
 import { panelStyles } from './panel';
 import { statusStyles, statusNodeStyles } from './status';
-import { taskDecisionStyles, taskDecisionIconWithoutVisualRefresh as decisionIconWithoutVisualRefresh, taskDecisionIconWithVisualRefresh as decisionIconWithVisualRefresh, taskItemStyles } from './tasks-and-decisions';
+import { taskDecisionStyles, taskDecisionIconWithoutVisualRefresh as decisionIconWithoutVisualRefresh, taskDecisionIconWithVisualRefresh as decisionIconWithVisualRefresh, taskItemStyles, taskItemStylesWithBlockTaskItem } from './tasks-and-decisions';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export var linkStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", "\n\t}\n"])), linkSharedStyle);
@@ -165,7 +165,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
 var legacyContentStyles = function legacyContentStyles(props) {
   return css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: ", "px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-padding)\n\t);\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t", "\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t *\n\t * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t *    https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  /* Switch between the two icons based on the visual refresh feature gate */\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n\n  .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t/* For FullPage only when inside a table\n\tRelated code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\tIn the \"editorContentAreaContainerStyle\" function */\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n     is bigger than the others, new ADS icon does not have this issue\n  */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, expValEqualsNoExposure('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? css(_templateObject1 || (_templateObject1 = _taggedTemplateLiteral(["\n\t\t\t\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t\t\t\t@container editor-area (max-width: ", "px) {\n\t\t\t\t\t--ak-editor--large-gutter-padding: ", "px;\n\t\t\t\t}\n\t\t\t"])), akEditorFullPageNarrowBreakout, akEditorGutterPaddingReduced) : null, editorFontSize({
     theme: props.theme
-  }), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", firstFloatingToolbarButtonStyles, placeholderTextStyles, fg('platform_editor_system_fake_text_highlight_colour') && placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(props.typographyTheme), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles(), listsStyles, ruleStyles(), mediaStyles(), layoutStyles(props.viewMode), fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, mentionNodeStyles, fg('platform_editor_centre_mention_padding') && mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1') ? mentionsSelectionStylesWithSearchMatch : mentionSelectionStyles, fg('platform_editor_fix_emoji_style_selectors') ? emojiStylesWithSelectorFixes : emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? fg('platform_editor_find_and_replace_improvements_1') ? findReplaceStylesNewNoImportant : findReplaceStylesNew : findReplaceStyles, textHighlightStyle, taskDecisionStyles, taskItemStyles, fg('platform-visual-refresh-icons') && decisionIconWithVisualRefresh, !fg('platform-visual-refresh-icons') && decisionIconWithoutVisualRefresh, statusStyles(), statusNodeStyles(), annotationSharedStyles(), smartCardStyles(), getSmartCardSharedStyles(), dateStyles, dateNodeStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), pragmaticStylesLayoutFirstNodeResizeHandleFix(), pragmaticResizerStylesForTooltip(), pragmaticResizerStylesWithReducedEditorGutter(), aiPanelStyles(props.colorMode), firstBlockNodeStylesNew, fg('platform_editor_vanilla_codebidi_warning') && codeBidiWarningStyles, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !fg('platform-visual-refresh-icons') ? css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
+  }), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", firstFloatingToolbarButtonStyles, placeholderTextStyles, fg('platform_editor_system_fake_text_highlight_colour') && placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(props.typographyTheme), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles(), listsStyles, ruleStyles(), mediaStyles(), layoutStyles(props.viewMode), fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, mentionNodeStyles, fg('platform_editor_centre_mention_padding') && mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1') ? mentionsSelectionStylesWithSearchMatch : mentionSelectionStyles, fg('platform_editor_fix_emoji_style_selectors') ? emojiStylesWithSelectorFixes : emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? fg('platform_editor_find_and_replace_improvements_1') ? findReplaceStylesNewNoImportant : findReplaceStylesNew : findReplaceStyles, textHighlightStyle, taskDecisionStyles, expValEqualsNoExposure('platform_editor_blocktaskitem_node', 'isEnabled', true) ? taskItemStylesWithBlockTaskItem : taskItemStyles, fg('platform-visual-refresh-icons') && decisionIconWithVisualRefresh, !fg('platform-visual-refresh-icons') && decisionIconWithoutVisualRefresh, statusStyles(), statusNodeStyles(), annotationSharedStyles(), smartCardStyles(), getSmartCardSharedStyles(), dateStyles, dateNodeStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), pragmaticStylesLayoutFirstNodeResizeHandleFix(), pragmaticResizerStylesForTooltip(), pragmaticResizerStylesWithReducedEditorGutter(), aiPanelStyles(props.colorMode), firstBlockNodeStylesNew, fg('platform_editor_vanilla_codebidi_warning') && codeBidiWarningStyles, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !fg('platform-visual-refresh-icons') ? css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
 };
 export var createEditorContentStyle = function createEditorContentStyle(styles) {
   return /*#__PURE__*/React.forwardRef(function (props, ref) {