@atlaskit/editor-core 216.5.0 → 216.6.0

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 (17) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/afm-cc/tsconfig.json +1 -1
  3. package/dist/cjs/ui/Addon/click-area-helper.js +1 -2
  4. package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js +7 -1
  5. package/dist/cjs/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js +164 -38
  6. package/dist/cjs/version-wrapper.js +1 -1
  7. package/dist/es2019/ui/Addon/click-area-helper.js +1 -2
  8. package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js +8 -2
  9. package/dist/es2019/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js +163 -35
  10. package/dist/es2019/version-wrapper.js +1 -1
  11. package/dist/esm/ui/Addon/click-area-helper.js +1 -2
  12. package/dist/esm/ui/EditorContentContainer/EditorContentContainer.js +8 -2
  13. package/dist/esm/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js +163 -37
  14. package/dist/esm/version-wrapper.js +1 -1
  15. package/dist/types/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.d.ts +3 -0
  16. package/dist/types-ts4.5/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.d.ts +3 -0
  17. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/editor-core
2
2
 
3
+ ## 216.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`7c8501566cbe0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7c8501566cbe0) -
8
+ improve task item styles by using 1 inline svg instead of 2
9
+
10
+ ### Patch Changes
11
+
12
+ - Updated dependencies
13
+
14
+ ## 216.5.1
15
+
16
+ ### Patch Changes
17
+
18
+ - [`1265c260f9bad`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1265c260f9bad) -
19
+ [ED-29455] clean up experiment platform_editor_toolbar_migrate_loom
20
+ - Updated dependencies
21
+
3
22
  ## 216.5.0
4
23
 
5
24
  ### Minor Changes
package/afm-cc/tsconfig.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "extends": "../../../../tsconfig.entry-points.confluence.json",
2
+ "extends": "../../../../tsconfig.local-consumption.json",
3
3
  "compilerOptions": {
4
4
  "declaration": true,
5
5
  "target": "es5",
package/dist/cjs/ui/Addon/click-area-helper.js CHANGED
@@ -8,7 +8,6 @@ var _collab = require("@atlaskit/editor-common/collab");
8
8
  var _commands = require("@atlaskit/editor-common/commands");
9
9
  var _selection = require("@atlaskit/editor-common/selection");
10
10
  var _utils = require("@atlaskit/editor-common/utils");
11
- var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
12
11
  var _contentComponentWrapper = require("./ClickAreaBlock/contentComponentWrapper");
13
12
  // we ignore all of the clicks made inside <div class="ak-editor-content-area" /> (but not clicks on the node itself)
14
13
  var insideContentArea = function insideContentArea(ref) {
@@ -88,7 +87,7 @@ var clickAreaClickHandler = exports.clickAreaClickHandler = function clickAreaCl
88
87
  // We don't own those components, so we can't change them
89
88
  var isEventComingFromInlineCommentPopup = Boolean((0, _utils.closestElement)(event.currentTarget, 'div[offset]')) || Boolean((0, _utils.closestElement)(target, 'div[offset]'));
90
89
  var isAnchorButtonClicked = Boolean((0, _utils.closestElement)(event.currentTarget, 'a')) || Boolean((0, _utils.closestElement)(target, 'a')) || ((_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : _event$currentTarget.nodeName) === 'A' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'A';
91
- var isButtonClicked = Boolean((0, _utils.closestElement)(event.currentTarget, 'button')) || Boolean((0, _utils.closestElement)(target, 'button')) || ((_event$currentTarget2 = event.currentTarget) === null || _event$currentTarget2 === void 0 ? void 0 : _event$currentTarget2.nodeName) === 'BUTTON' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'BUTTON' || (0, _expValEquals.expValEquals)('platform_editor_toolbar_migrate_loom', 'isEnabled', true) && isAnchorButtonClicked;
90
+ var isButtonClicked = Boolean((0, _utils.closestElement)(event.currentTarget, 'button')) || Boolean((0, _utils.closestElement)(target, 'button')) || ((_event$currentTarget2 = event.currentTarget) === null || _event$currentTarget2 === void 0 ? void 0 : _event$currentTarget2.nodeName) === 'BUTTON' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'BUTTON' || isAnchorButtonClicked;
92
91
  var isTargetInsideContentArea = Boolean(isTargetChildOfContentArea);
93
92
  var isBetweenContentAreaAndEditableContent = isTargetInsideContentArea && !isTargetInsideEditableArea;
94
93
 
package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js CHANGED
@@ -318,7 +318,13 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
318
318
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
319
319
  _tasksAndDecisionsStyles.taskItemStylesWithBlockTaskItem :
320
320
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
321
- _tasksAndDecisionsStyles.taskItemStyles,
321
+ _tasksAndDecisionsStyles.taskItemStyles, (0, _expValEquals.expValEquals)('platform_editor_task_item_styles', 'isEnabled', true) ?
322
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
323
+ _tasksAndDecisionsStyles.taskItemNextCheckboxStyles : (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_blocktaskitem_node_tenantid', 'isEnabled', true) ?
324
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
325
+ _tasksAndDecisionsStyles.taskItemCheckboxStylesWithBlockTaskItem :
326
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
327
+ _tasksAndDecisionsStyles.taskItemCheckboxStyles,
322
328
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
323
329
  _tasksAndDecisionsStyles.decisionIconWithVisualRefresh,
324
330
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
package/dist/cjs/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js CHANGED
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.tasksAndDecisionsStyles = exports.taskItemStylesWithBlockTaskItem = exports.taskItemStyles = exports.getDenseTasksAndDecisionsStyles = exports.decisionStyles = exports.decisionIconWithoutVisualRefresh = exports.decisionIconWithVisualRefresh = exports.decisionDangerStyles = exports.TaskDecisionSharedCssClassName = void 0;
7
+ exports.tasksAndDecisionsStyles = exports.taskItemStylesWithBlockTaskItem = exports.taskItemStyles = exports.taskItemNextCheckboxStyles = exports.taskItemCheckboxStylesWithBlockTaskItem = exports.taskItemCheckboxStyles = exports.getDenseTasksAndDecisionsStyles = exports.decisionStyles = exports.decisionIconWithoutVisualRefresh = exports.decisionIconWithVisualRefresh = exports.decisionDangerStyles = exports.TaskDecisionSharedCssClassName = void 0;
8
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
9
  var _react = require("@emotion/react");
10
10
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
@@ -225,7 +225,7 @@ var decisionIconWithoutVisualRefresh = exports.decisionIconWithoutVisualRefresh
225
225
  });
226
226
 
227
227
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
228
- var taskItemStyles = exports.taskItemStyles = (0, _react.css)((0, _defineProperty2.default)({
228
+ var taskItemStyles = exports.taskItemStyles = (0, _react.css)({
229
229
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
230
230
  '[data-prosemirror-node-name="taskItem"]': {
231
231
  listStyle: 'none'
@@ -258,7 +258,11 @@ var taskItemStyles = exports.taskItemStyles = (0, _react.css)((0, _definePropert
258
258
  wordWrap: 'break-word',
259
259
  minWidth: 0,
260
260
  flex: '1 1 auto'
261
- },
261
+ }
262
+ });
263
+
264
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
265
+ var taskItemCheckboxStyles = exports.taskItemCheckboxStyles = (0, _react.css)((0, _defineProperty2.default)({
262
266
  // copied styles from packages/design-system/icon/src/components/icon-new.tsx
263
267
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
264
268
  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"]': {
@@ -429,40 +433,7 @@ var taskItemStyles = exports.taskItemStyles = (0, _react.css)((0, _definePropert
429
433
  }));
430
434
 
431
435
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
432
- var taskItemStylesWithBlockTaskItem = exports.taskItemStylesWithBlockTaskItem = (0, _react.css)((0, _defineProperty2.default)({
433
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
434
- '[data-prosemirror-node-name="taskItem"], [data-prosemirror-node-name="blockTaskItem"]': {
435
- listStyle: 'none'
436
- },
437
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
438
- '[data-prosemirror-node-name="taskItem"] [data-component="task-item-main"], [data-prosemirror-node-name="blockTaskItem"] [data-component="task-item-main"]': {
439
- display: 'flex',
440
- flexDirection: 'row',
441
- position: 'relative'
442
- },
443
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
444
- '[data-prosemirror-node-name="taskItem"] [data-component="placeholder"], [data-prosemirror-node-name="blockTaskItem"] [data-component="placeholder"]': {
445
- position: 'absolute',
446
- color: "var(--ds-text-subtlest, #6B6E76)",
447
- margin: "0 0 0 calc(".concat("var(--ds-space-100, 8px)", " * 3)"),
448
- pointerEvents: 'none',
449
- textOverflow: 'ellipsis',
450
- overflow: 'hidden',
451
- whiteSpace: 'nowrap',
452
- maxWidth: 'calc(100% - 50px)',
453
- display: 'none'
454
- },
455
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
456
- "[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']": {
457
- display: 'block'
458
- },
459
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
460
- '[data-prosemirror-node-name="taskItem"] [data-component="content"], [data-prosemirror-node-name="blockTaskItem"] [data-component="content"]': {
461
- margin: 0,
462
- wordWrap: 'break-word',
463
- minWidth: 0,
464
- flex: '1 1 auto'
465
- },
436
+ var taskItemCheckboxStylesWithBlockTaskItem = exports.taskItemCheckboxStylesWithBlockTaskItem = (0, _react.css)((0, _defineProperty2.default)({
466
437
  // copied styles from packages/design-system/icon/src/components/icon-new.tsx
467
438
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
468
439
  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"], [data-prosemirror-node-name="blockTaskItem"] [data-component="checkbox-icon-wrap"]': {
@@ -630,4 +601,159 @@ var taskItemStylesWithBlockTaskItem = exports.taskItemStylesWithBlockTaskItem =
630
601
  transform: 'translate(-50%, -50%)'
631
602
  }
632
603
  }
633
- }));
604
+ }));
605
+
606
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
607
+ var taskItemNextCheckboxStyles = exports.taskItemNextCheckboxStyles = (0, _react.css)((0, _defineProperty2.default)({
608
+ /**
609
+ * Background
610
+ */
611
+ '--local-background': "var(--ds-background-input, #FFFFFF)",
612
+ '--local-background-active': "var(--ds-background-input-pressed, #FFFFFF)",
613
+ '--local-background-checked': "var(--ds-background-selected-bold, #1868DB)",
614
+ '--local-background-checked-hover': "var(--ds-background-selected-bold-hovered, #1558BC)",
615
+ '--local-background-disabled': "var(--ds-background-disabled, #17171708)",
616
+ '--local-background-hover': "var(--ds-background-input-hovered, #F8F8F8)",
617
+ /**
618
+ * Border
619
+ */
620
+ '--local-border': "var(--ds-border-input, #8C8F97)",
621
+ '--local-border-active': "var(--ds-border, #0B120E24)",
622
+ '--local-border-checked': "var(--ds-background-selected-bold, #1868DB)",
623
+ '--local-border-checked-hover': "var(--ds-background-selected-bold-hovered, #1558BC)",
624
+ '--local-border-checked-invalid': "var(--ds-border-danger, #E2483D)",
625
+ '--local-border-disabled': "var(--ds-background-disabled, #17171708)",
626
+ '--local-border-focus': "var(--ds-border-focused, #4688EC)",
627
+ '--local-border-hover': "var(--ds-border-input, #8C8F97)",
628
+ '--local-border-invalid': "var(--ds-border-danger, #E2483D)",
629
+ /**
630
+ * Tick
631
+ */
632
+ '--local-tick-active': "var(--ds-icon-inverse, #FFFFFF)",
633
+ '--local-tick-checked': "var(--ds-icon-inverse, #FFFFFF)",
634
+ '--local-tick-disabled': "var(--ds-icon-disabled, #080F214A)",
635
+ '--local-tick-rest': 'transparent'
636
+ }, "[data-prosemirror-node-name=\"taskItem\"] .".concat(TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER, ", [data-prosemirror-node-name=\"blockTaskItem\"] .").concat(TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER), {
637
+ flex: '0 0 24px',
638
+ width: '24px',
639
+ height: '24px',
640
+ position: 'relative',
641
+ alignSelf: 'start',
642
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
643
+ "& > input[type='checkbox']": {
644
+ opacity: 0,
645
+ width: '100%',
646
+ height: '100%',
647
+ zIndex: 1,
648
+ cursor: 'pointer',
649
+ outline: 'none',
650
+ margin: 0,
651
+ position: 'absolute',
652
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
653
+ '&[disabled]': {
654
+ cursor: 'default'
655
+ },
656
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
657
+ '& + svg': {
658
+ '--checkbox-background-color': 'var(--local-background)',
659
+ '--checkbox-border-color': 'var(--local-border)',
660
+ '--checkbox-tick-color': 'var(--local-tick-rest)',
661
+ color: 'var(--checkbox-background-color)',
662
+ fill: 'var(--checkbox-tick-color)',
663
+ transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
664
+ boxSizing: 'border-box',
665
+ display: 'inline',
666
+ position: 'absolute',
667
+ top: '50%',
668
+ left: '50%',
669
+ transform: 'translate(-50%, -50%)',
670
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
671
+ 'rect:first-of-type': {
672
+ stroke: 'var(--checkbox-border-color)',
673
+ strokeWidth: "var(--ds-border-width, 1px)",
674
+ transition: 'stroke 0.2s ease-in-out'
675
+ }
676
+ },
677
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
678
+ '&:focus + svg, &:checked:focus + svg': {
679
+ borderRadius: "var(--ds-radius-small, 0.25rem)",
680
+ outline: "var(--ds-border-width-focused, 2px)".concat(" solid ", "var(--ds-border-focused, #2684FF)"),
681
+ outlineOffset: "var(--ds-space-negative-025, -2px)"
682
+ },
683
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
684
+ '&:hover + svg': {
685
+ '--checkbox-background-color': 'var(--local-background-hover)',
686
+ '--checkbox-border-color': 'var(--local-border-hover)'
687
+ },
688
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
689
+ '&:checked:hover + svg': {
690
+ '--checkbox-background-color': 'var(--local-background-checked-hover)',
691
+ '--checkbox-border-color': 'var(--local-border-checked-hover)'
692
+ },
693
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
694
+ '&:checked + svg': {
695
+ '--checkbox-background-color': 'var(--local-background-checked)',
696
+ '--checkbox-border-color': 'var(--local-border-checked)',
697
+ '--checkbox-tick-color': 'var(--local-tick-checked)'
698
+ },
699
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
700
+ '&:active + svg': {
701
+ '--checkbox-background-color': 'var(--local-background-active)',
702
+ '--checkbox-border-color': 'var(--local-border-active)'
703
+ },
704
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
705
+ '&:checked:active + svg': {
706
+ '--checkbox-background-color': 'var(--local-background-active)',
707
+ '--checkbox-border-color': 'var(--local-border-active)',
708
+ '--checkbox-tick-color': 'var(--local-tick-active)'
709
+ },
710
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
711
+ '&:disabled + svg, &:disabled:hover + svg, &:disabled:focus + svg, &:disabled:active + svg, &:disabled[data-invalid] + svg': {
712
+ '--checkbox-background-color': 'var(--local-background-disabled)',
713
+ '--checkbox-border-color': 'var(--local-border-disabled)',
714
+ cursor: 'not-allowed',
715
+ pointerEvents: 'none'
716
+ },
717
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
718
+ '&:disabled:checked + svg': {
719
+ '--checkbox-tick-color': 'var(--local-tick-disabled)'
720
+ }
721
+ }
722
+ }));
723
+
724
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
725
+ var taskItemStylesWithBlockTaskItem = exports.taskItemStylesWithBlockTaskItem = (0, _react.css)({
726
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
727
+ '[data-prosemirror-node-name="taskItem"], [data-prosemirror-node-name="blockTaskItem"]': {
728
+ listStyle: 'none'
729
+ },
730
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
731
+ '[data-prosemirror-node-name="taskItem"] [data-component="task-item-main"], [data-prosemirror-node-name="blockTaskItem"] [data-component="task-item-main"]': {
732
+ display: 'flex',
733
+ flexDirection: 'row',
734
+ position: 'relative'
735
+ },
736
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
737
+ '[data-prosemirror-node-name="taskItem"] [data-component="placeholder"], [data-prosemirror-node-name="blockTaskItem"] [data-component="placeholder"]': {
738
+ position: 'absolute',
739
+ color: "var(--ds-text-subtlest, #6B6E76)",
740
+ margin: "0 0 0 calc(".concat("var(--ds-space-100, 8px)", " * 3)"),
741
+ pointerEvents: 'none',
742
+ textOverflow: 'ellipsis',
743
+ overflow: 'hidden',
744
+ whiteSpace: 'nowrap',
745
+ maxWidth: 'calc(100% - 50px)',
746
+ display: 'none'
747
+ },
748
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
749
+ "[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']": {
750
+ display: 'block'
751
+ },
752
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
753
+ '[data-prosemirror-node-name="taskItem"] [data-component="content"], [data-prosemirror-node-name="blockTaskItem"] [data-component="content"]': {
754
+ margin: 0,
755
+ wordWrap: 'break-word',
756
+ minWidth: 0,
757
+ flex: '1 1 auto'
758
+ }
759
+ });
package/dist/cjs/version-wrapper.js CHANGED
@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.version = exports.name = void 0;
7
7
  var name = exports.name = "@atlaskit/editor-core";
8
- var version = exports.version = "216.4.0";
8
+ var version = exports.version = "0.0.0-development";
package/dist/es2019/ui/Addon/click-area-helper.js CHANGED
@@ -2,7 +2,6 @@ import { tintDirtyTransaction } from '@atlaskit/editor-common/collab';
2
2
  import { addParagraphAtEnd } from '@atlaskit/editor-common/commands';
3
3
  import { setSelectionTopLevelBlocks } from '@atlaskit/editor-common/selection';
4
4
  import { closestElement } from '@atlaskit/editor-common/utils';
5
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
6
5
  import { ignoreAttribute } from './ClickAreaBlock/contentComponentWrapper';
7
6
 
8
7
  // we ignore all of the clicks made inside <div class="ak-editor-content-area" /> (but not clicks on the node itself)
@@ -83,7 +82,7 @@ const clickAreaClickHandler = (view, event) => {
83
82
  // We don't own those components, so we can't change them
84
83
  const isEventComingFromInlineCommentPopup = Boolean(closestElement(event.currentTarget, 'div[offset]')) || Boolean(closestElement(target, 'div[offset]'));
85
84
  const isAnchorButtonClicked = Boolean(closestElement(event.currentTarget, 'a')) || Boolean(closestElement(target, 'a')) || ((_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : _event$currentTarget.nodeName) === 'A' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'A';
86
- const isButtonClicked = Boolean(closestElement(event.currentTarget, 'button')) || Boolean(closestElement(target, 'button')) || ((_event$currentTarget2 = event.currentTarget) === null || _event$currentTarget2 === void 0 ? void 0 : _event$currentTarget2.nodeName) === 'BUTTON' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'BUTTON' || expValEquals('platform_editor_toolbar_migrate_loom', 'isEnabled', true) && isAnchorButtonClicked;
85
+ const isButtonClicked = Boolean(closestElement(event.currentTarget, 'button')) || Boolean(closestElement(target, 'button')) || ((_event$currentTarget2 = event.currentTarget) === null || _event$currentTarget2 === void 0 ? void 0 : _event$currentTarget2.nodeName) === 'BUTTON' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'BUTTON' || isAnchorButtonClicked;
87
86
  const isTargetInsideContentArea = Boolean(isTargetChildOfContentArea);
88
87
  const isBetweenContentAreaAndEditableContent = isTargetInsideContentArea && !isTargetInsideEditableArea;
89
88
 
package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js CHANGED
@@ -60,7 +60,7 @@ import { editorControlsSmartCardStyles, linkingVisualRefreshV1Styles, showDiffDe
60
60
  import { statusDangerStyles, 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';
61
61
  import { syncBlockStyles } from './styles/syncBlockStyles';
62
62
  import { tableCommentEditorStyles, tableContainerOverflowY, tableContainerStyles, tableEmptyRowStyles, tableLayoutFixes } from './styles/tableStyles';
63
- import { decisionDangerStyles, decisionIconWithVisualRefresh, decisionStyles, getDenseTasksAndDecisionsStyles, taskItemStyles, taskItemStylesWithBlockTaskItem, tasksAndDecisionsStyles } from './styles/tasksAndDecisionsStyles';
63
+ import { decisionDangerStyles, decisionIconWithVisualRefresh, decisionStyles, getDenseTasksAndDecisionsStyles, taskItemCheckboxStyles, taskItemCheckboxStylesWithBlockTaskItem, taskItemNextCheckboxStyles, taskItemStyles, taskItemStylesWithBlockTaskItem, tasksAndDecisionsStyles } from './styles/tasksAndDecisionsStyles';
64
64
  import { telepointerColorAndCommonStyle, telepointerStyle } from './styles/telepointerStyles';
65
65
  import { textColorStyles } from './styles/textColorStyles';
66
66
  import { textHighlightStyle } from './styles/textHighlightStyles';
@@ -314,7 +314,13 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
314
314
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
315
315
  taskItemStylesWithBlockTaskItem :
316
316
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
317
- taskItemStyles,
317
+ taskItemStyles, expValEquals('platform_editor_task_item_styles', 'isEnabled', true) ?
318
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
319
+ taskItemNextCheckboxStyles : expValEqualsNoExposure('platform_editor_blocktaskitem_node_tenantid', 'isEnabled', true) ?
320
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
321
+ taskItemCheckboxStylesWithBlockTaskItem :
322
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
323
+ taskItemCheckboxStyles,
318
324
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
319
325
  decisionIconWithVisualRefresh,
320
326
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
package/dist/es2019/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js CHANGED
@@ -297,7 +297,11 @@ export const taskItemStyles = css({
297
297
  wordWrap: 'break-word',
298
298
  minWidth: 0,
299
299
  flex: '1 1 auto'
300
- },
300
+ }
301
+ });
302
+
303
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
304
+ export const taskItemCheckboxStyles = css({
301
305
  // copied styles from packages/design-system/icon/src/components/icon-new.tsx
302
306
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
303
307
  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"]': {
@@ -470,40 +474,7 @@ export const taskItemStyles = css({
470
474
  });
471
475
 
472
476
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
473
- export const taskItemStylesWithBlockTaskItem = css({
474
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
475
- '[data-prosemirror-node-name="taskItem"], [data-prosemirror-node-name="blockTaskItem"]': {
476
- listStyle: 'none'
477
- },
478
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
479
- '[data-prosemirror-node-name="taskItem"] [data-component="task-item-main"], [data-prosemirror-node-name="blockTaskItem"] [data-component="task-item-main"]': {
480
- display: 'flex',
481
- flexDirection: 'row',
482
- position: 'relative'
483
- },
484
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
485
- '[data-prosemirror-node-name="taskItem"] [data-component="placeholder"], [data-prosemirror-node-name="blockTaskItem"] [data-component="placeholder"]': {
486
- position: 'absolute',
487
- color: "var(--ds-text-subtlest, #6B6E76)",
488
- margin: `0 0 0 calc(${"var(--ds-space-100, 8px)"} * 3)`,
489
- pointerEvents: 'none',
490
- textOverflow: 'ellipsis',
491
- overflow: 'hidden',
492
- whiteSpace: 'nowrap',
493
- maxWidth: 'calc(100% - 50px)',
494
- display: 'none'
495
- },
496
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
497
- "[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']": {
498
- display: 'block'
499
- },
500
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
501
- '[data-prosemirror-node-name="taskItem"] [data-component="content"], [data-prosemirror-node-name="blockTaskItem"] [data-component="content"]': {
502
- margin: 0,
503
- wordWrap: 'break-word',
504
- minWidth: 0,
505
- flex: '1 1 auto'
506
- },
477
+ export const taskItemCheckboxStylesWithBlockTaskItem = css({
507
478
  // copied styles from packages/design-system/icon/src/components/icon-new.tsx
508
479
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
509
480
  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"], [data-prosemirror-node-name="blockTaskItem"] [data-component="checkbox-icon-wrap"]': {
@@ -673,4 +644,161 @@ export const taskItemStylesWithBlockTaskItem = css({
673
644
  }
674
645
  }
675
646
  }
647
+ });
648
+
649
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
650
+ export const taskItemNextCheckboxStyles = css({
651
+ /**
652
+ * Background
653
+ */
654
+ '--local-background': "var(--ds-background-input, #FFFFFF)",
655
+ '--local-background-active': "var(--ds-background-input-pressed, #FFFFFF)",
656
+ '--local-background-checked': "var(--ds-background-selected-bold, #1868DB)",
657
+ '--local-background-checked-hover': "var(--ds-background-selected-bold-hovered, #1558BC)",
658
+ '--local-background-disabled': "var(--ds-background-disabled, #17171708)",
659
+ '--local-background-hover': "var(--ds-background-input-hovered, #F8F8F8)",
660
+ /**
661
+ * Border
662
+ */
663
+ '--local-border': "var(--ds-border-input, #8C8F97)",
664
+ '--local-border-active': "var(--ds-border, #0B120E24)",
665
+ '--local-border-checked': "var(--ds-background-selected-bold, #1868DB)",
666
+ '--local-border-checked-hover': "var(--ds-background-selected-bold-hovered, #1558BC)",
667
+ '--local-border-checked-invalid': "var(--ds-border-danger, #E2483D)",
668
+ '--local-border-disabled': "var(--ds-background-disabled, #17171708)",
669
+ '--local-border-focus': "var(--ds-border-focused, #4688EC)",
670
+ '--local-border-hover': "var(--ds-border-input, #8C8F97)",
671
+ '--local-border-invalid': "var(--ds-border-danger, #E2483D)",
672
+ /**
673
+ * Tick
674
+ */
675
+ '--local-tick-active': "var(--ds-icon-inverse, #FFFFFF)",
676
+ '--local-tick-checked': "var(--ds-icon-inverse, #FFFFFF)",
677
+ '--local-tick-disabled': "var(--ds-icon-disabled, #080F214A)",
678
+ '--local-tick-rest': 'transparent',
679
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
680
+ [`[data-prosemirror-node-name="taskItem"] .${TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER}, [data-prosemirror-node-name="blockTaskItem"] .${TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER}`]: {
681
+ flex: '0 0 24px',
682
+ width: '24px',
683
+ height: '24px',
684
+ position: 'relative',
685
+ alignSelf: 'start',
686
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
687
+ "& > input[type='checkbox']": {
688
+ opacity: 0,
689
+ width: '100%',
690
+ height: '100%',
691
+ zIndex: 1,
692
+ cursor: 'pointer',
693
+ outline: 'none',
694
+ margin: 0,
695
+ position: 'absolute',
696
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
697
+ '&[disabled]': {
698
+ cursor: 'default'
699
+ },
700
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
701
+ '& + svg': {
702
+ '--checkbox-background-color': 'var(--local-background)',
703
+ '--checkbox-border-color': 'var(--local-border)',
704
+ '--checkbox-tick-color': 'var(--local-tick-rest)',
705
+ color: 'var(--checkbox-background-color)',
706
+ fill: 'var(--checkbox-tick-color)',
707
+ transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
708
+ boxSizing: 'border-box',
709
+ display: 'inline',
710
+ position: 'absolute',
711
+ top: '50%',
712
+ left: '50%',
713
+ transform: 'translate(-50%, -50%)',
714
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
715
+ 'rect:first-of-type': {
716
+ stroke: 'var(--checkbox-border-color)',
717
+ strokeWidth: "var(--ds-border-width, 1px)",
718
+ transition: 'stroke 0.2s ease-in-out'
719
+ }
720
+ },
721
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
722
+ '&:focus + svg, &:checked:focus + svg': {
723
+ borderRadius: "var(--ds-radius-small, 0.25rem)",
724
+ outline: `${"var(--ds-border-width-focused, 2px)"} solid ${"var(--ds-border-focused, #2684FF)"}`,
725
+ outlineOffset: "var(--ds-space-negative-025, -2px)"
726
+ },
727
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
728
+ '&:hover + svg': {
729
+ '--checkbox-background-color': 'var(--local-background-hover)',
730
+ '--checkbox-border-color': 'var(--local-border-hover)'
731
+ },
732
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
733
+ '&:checked:hover + svg': {
734
+ '--checkbox-background-color': 'var(--local-background-checked-hover)',
735
+ '--checkbox-border-color': 'var(--local-border-checked-hover)'
736
+ },
737
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
738
+ '&:checked + svg': {
739
+ '--checkbox-background-color': 'var(--local-background-checked)',
740
+ '--checkbox-border-color': 'var(--local-border-checked)',
741
+ '--checkbox-tick-color': 'var(--local-tick-checked)'
742
+ },
743
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
744
+ '&:active + svg': {
745
+ '--checkbox-background-color': 'var(--local-background-active)',
746
+ '--checkbox-border-color': 'var(--local-border-active)'
747
+ },
748
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
749
+ '&:checked:active + svg': {
750
+ '--checkbox-background-color': 'var(--local-background-active)',
751
+ '--checkbox-border-color': 'var(--local-border-active)',
752
+ '--checkbox-tick-color': 'var(--local-tick-active)'
753
+ },
754
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
755
+ '&:disabled + svg, &:disabled:hover + svg, &:disabled:focus + svg, &:disabled:active + svg, &:disabled[data-invalid] + svg': {
756
+ '--checkbox-background-color': 'var(--local-background-disabled)',
757
+ '--checkbox-border-color': 'var(--local-border-disabled)',
758
+ cursor: 'not-allowed',
759
+ pointerEvents: 'none'
760
+ },
761
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
762
+ '&:disabled:checked + svg': {
763
+ '--checkbox-tick-color': 'var(--local-tick-disabled)'
764
+ }
765
+ }
766
+ }
767
+ });
768
+
769
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
770
+ export const taskItemStylesWithBlockTaskItem = css({
771
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
772
+ '[data-prosemirror-node-name="taskItem"], [data-prosemirror-node-name="blockTaskItem"]': {
773
+ listStyle: 'none'
774
+ },
775
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
776
+ '[data-prosemirror-node-name="taskItem"] [data-component="task-item-main"], [data-prosemirror-node-name="blockTaskItem"] [data-component="task-item-main"]': {
777
+ display: 'flex',
778
+ flexDirection: 'row',
779
+ position: 'relative'
780
+ },
781
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
782
+ '[data-prosemirror-node-name="taskItem"] [data-component="placeholder"], [data-prosemirror-node-name="blockTaskItem"] [data-component="placeholder"]': {
783
+ position: 'absolute',
784
+ color: "var(--ds-text-subtlest, #6B6E76)",
785
+ margin: `0 0 0 calc(${"var(--ds-space-100, 8px)"} * 3)`,
786
+ pointerEvents: 'none',
787
+ textOverflow: 'ellipsis',
788
+ overflow: 'hidden',
789
+ whiteSpace: 'nowrap',
790
+ maxWidth: 'calc(100% - 50px)',
791
+ display: 'none'
792
+ },
793
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
794
+ "[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']": {
795
+ display: 'block'
796
+ },
797
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
798
+ '[data-prosemirror-node-name="taskItem"] [data-component="content"], [data-prosemirror-node-name="blockTaskItem"] [data-component="content"]': {
799
+ margin: 0,
800
+ wordWrap: 'break-word',
801
+ minWidth: 0,
802
+ flex: '1 1 auto'
803
+ }
676
804
  });
package/dist/es2019/version-wrapper.js CHANGED
@@ -1,2 +1,2 @@
1
1
  export const name = "@atlaskit/editor-core";
2
- export const version = "216.4.0";
2
+ export const version = "0.0.0-development";
package/dist/esm/ui/Addon/click-area-helper.js CHANGED
@@ -2,7 +2,6 @@ import { tintDirtyTransaction } from '@atlaskit/editor-common/collab';
2
2
  import { addParagraphAtEnd } from '@atlaskit/editor-common/commands';
3
3
  import { setSelectionTopLevelBlocks } from '@atlaskit/editor-common/selection';
4
4
  import { closestElement } from '@atlaskit/editor-common/utils';
5
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
6
5
  import { ignoreAttribute } from './ClickAreaBlock/contentComponentWrapper';
7
6
 
8
7
  // we ignore all of the clicks made inside <div class="ak-editor-content-area" /> (but not clicks on the node itself)
@@ -83,7 +82,7 @@ var clickAreaClickHandler = function clickAreaClickHandler(view, event) {
83
82
  // We don't own those components, so we can't change them
84
83
  var isEventComingFromInlineCommentPopup = Boolean(closestElement(event.currentTarget, 'div[offset]')) || Boolean(closestElement(target, 'div[offset]'));
85
84
  var isAnchorButtonClicked = Boolean(closestElement(event.currentTarget, 'a')) || Boolean(closestElement(target, 'a')) || ((_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : _event$currentTarget.nodeName) === 'A' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'A';
86
- var isButtonClicked = Boolean(closestElement(event.currentTarget, 'button')) || Boolean(closestElement(target, 'button')) || ((_event$currentTarget2 = event.currentTarget) === null || _event$currentTarget2 === void 0 ? void 0 : _event$currentTarget2.nodeName) === 'BUTTON' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'BUTTON' || expValEquals('platform_editor_toolbar_migrate_loom', 'isEnabled', true) && isAnchorButtonClicked;
85
+ var isButtonClicked = Boolean(closestElement(event.currentTarget, 'button')) || Boolean(closestElement(target, 'button')) || ((_event$currentTarget2 = event.currentTarget) === null || _event$currentTarget2 === void 0 ? void 0 : _event$currentTarget2.nodeName) === 'BUTTON' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'BUTTON' || isAnchorButtonClicked;
87
86
  var isTargetInsideContentArea = Boolean(isTargetChildOfContentArea);
88
87
  var isBetweenContentAreaAndEditableContent = isTargetInsideContentArea && !isTargetInsideEditableArea;
89
88
 
package/dist/esm/ui/EditorContentContainer/EditorContentContainer.js CHANGED
@@ -61,7 +61,7 @@ import { editorControlsSmartCardStyles, linkingVisualRefreshV1Styles, showDiffDe
61
61
  import { statusDangerStyles, 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';
62
62
  import { syncBlockStyles } from './styles/syncBlockStyles';
63
63
  import { tableCommentEditorStyles, tableContainerOverflowY, tableContainerStyles, tableEmptyRowStyles, tableLayoutFixes } from './styles/tableStyles';
64
- import { decisionDangerStyles, decisionIconWithVisualRefresh, decisionStyles, getDenseTasksAndDecisionsStyles, taskItemStyles, taskItemStylesWithBlockTaskItem, tasksAndDecisionsStyles } from './styles/tasksAndDecisionsStyles';
64
+ import { decisionDangerStyles, decisionIconWithVisualRefresh, decisionStyles, getDenseTasksAndDecisionsStyles, taskItemCheckboxStyles, taskItemCheckboxStylesWithBlockTaskItem, taskItemNextCheckboxStyles, taskItemStyles, taskItemStylesWithBlockTaskItem, tasksAndDecisionsStyles } from './styles/tasksAndDecisionsStyles';
65
65
  import { telepointerColorAndCommonStyle, telepointerStyle } from './styles/telepointerStyles';
66
66
  import { textColorStyles } from './styles/textColorStyles';
67
67
  import { textHighlightStyle } from './styles/textHighlightStyles';
@@ -310,7 +310,13 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
310
310
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
311
311
  taskItemStylesWithBlockTaskItem :
312
312
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
313
- taskItemStyles,
313
+ taskItemStyles, expValEquals('platform_editor_task_item_styles', 'isEnabled', true) ?
314
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
315
+ taskItemNextCheckboxStyles : expValEqualsNoExposure('platform_editor_blocktaskitem_node_tenantid', 'isEnabled', true) ?
316
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
317
+ taskItemCheckboxStylesWithBlockTaskItem :
318
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
319
+ taskItemCheckboxStyles,
314
320
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
315
321
  decisionIconWithVisualRefresh,
316
322
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
package/dist/esm/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js CHANGED
@@ -219,7 +219,7 @@ export var decisionIconWithoutVisualRefresh = css({
219
219
  });
220
220
 
221
221
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
222
- export var taskItemStyles = css(_defineProperty({
222
+ export var taskItemStyles = css({
223
223
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
224
224
  '[data-prosemirror-node-name="taskItem"]': {
225
225
  listStyle: 'none'
@@ -252,7 +252,11 @@ export var taskItemStyles = css(_defineProperty({
252
252
  wordWrap: 'break-word',
253
253
  minWidth: 0,
254
254
  flex: '1 1 auto'
255
- },
255
+ }
256
+ });
257
+
258
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
259
+ export var taskItemCheckboxStyles = css(_defineProperty({
256
260
  // copied styles from packages/design-system/icon/src/components/icon-new.tsx
257
261
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
258
262
  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"]': {
@@ -423,40 +427,7 @@ export var taskItemStyles = css(_defineProperty({
423
427
  }));
424
428
 
425
429
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
426
- export var taskItemStylesWithBlockTaskItem = css(_defineProperty({
427
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
428
- '[data-prosemirror-node-name="taskItem"], [data-prosemirror-node-name="blockTaskItem"]': {
429
- listStyle: 'none'
430
- },
431
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
432
- '[data-prosemirror-node-name="taskItem"] [data-component="task-item-main"], [data-prosemirror-node-name="blockTaskItem"] [data-component="task-item-main"]': {
433
- display: 'flex',
434
- flexDirection: 'row',
435
- position: 'relative'
436
- },
437
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
438
- '[data-prosemirror-node-name="taskItem"] [data-component="placeholder"], [data-prosemirror-node-name="blockTaskItem"] [data-component="placeholder"]': {
439
- position: 'absolute',
440
- color: "var(--ds-text-subtlest, #6B6E76)",
441
- margin: "0 0 0 calc(".concat("var(--ds-space-100, 8px)", " * 3)"),
442
- pointerEvents: 'none',
443
- textOverflow: 'ellipsis',
444
- overflow: 'hidden',
445
- whiteSpace: 'nowrap',
446
- maxWidth: 'calc(100% - 50px)',
447
- display: 'none'
448
- },
449
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
450
- "[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']": {
451
- display: 'block'
452
- },
453
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
454
- '[data-prosemirror-node-name="taskItem"] [data-component="content"], [data-prosemirror-node-name="blockTaskItem"] [data-component="content"]': {
455
- margin: 0,
456
- wordWrap: 'break-word',
457
- minWidth: 0,
458
- flex: '1 1 auto'
459
- },
430
+ export var taskItemCheckboxStylesWithBlockTaskItem = css(_defineProperty({
460
431
  // copied styles from packages/design-system/icon/src/components/icon-new.tsx
461
432
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
462
433
  '[data-prosemirror-node-name="taskItem"] [data-component="checkbox-icon-wrap"], [data-prosemirror-node-name="blockTaskItem"] [data-component="checkbox-icon-wrap"]': {
@@ -624,4 +595,159 @@ export var taskItemStylesWithBlockTaskItem = css(_defineProperty({
624
595
  transform: 'translate(-50%, -50%)'
625
596
  }
626
597
  }
627
- }));
598
+ }));
599
+
600
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
601
+ export var taskItemNextCheckboxStyles = css(_defineProperty({
602
+ /**
603
+ * Background
604
+ */
605
+ '--local-background': "var(--ds-background-input, #FFFFFF)",
606
+ '--local-background-active': "var(--ds-background-input-pressed, #FFFFFF)",
607
+ '--local-background-checked': "var(--ds-background-selected-bold, #1868DB)",
608
+ '--local-background-checked-hover': "var(--ds-background-selected-bold-hovered, #1558BC)",
609
+ '--local-background-disabled': "var(--ds-background-disabled, #17171708)",
610
+ '--local-background-hover': "var(--ds-background-input-hovered, #F8F8F8)",
611
+ /**
612
+ * Border
613
+ */
614
+ '--local-border': "var(--ds-border-input, #8C8F97)",
615
+ '--local-border-active': "var(--ds-border, #0B120E24)",
616
+ '--local-border-checked': "var(--ds-background-selected-bold, #1868DB)",
617
+ '--local-border-checked-hover': "var(--ds-background-selected-bold-hovered, #1558BC)",
618
+ '--local-border-checked-invalid': "var(--ds-border-danger, #E2483D)",
619
+ '--local-border-disabled': "var(--ds-background-disabled, #17171708)",
620
+ '--local-border-focus': "var(--ds-border-focused, #4688EC)",
621
+ '--local-border-hover': "var(--ds-border-input, #8C8F97)",
622
+ '--local-border-invalid': "var(--ds-border-danger, #E2483D)",
623
+ /**
624
+ * Tick
625
+ */
626
+ '--local-tick-active': "var(--ds-icon-inverse, #FFFFFF)",
627
+ '--local-tick-checked': "var(--ds-icon-inverse, #FFFFFF)",
628
+ '--local-tick-disabled': "var(--ds-icon-disabled, #080F214A)",
629
+ '--local-tick-rest': 'transparent'
630
+ }, "[data-prosemirror-node-name=\"taskItem\"] .".concat(TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER, ", [data-prosemirror-node-name=\"blockTaskItem\"] .").concat(TaskDecisionSharedCssClassName.TASK_CHECKBOX_CONTAINER), {
631
+ flex: '0 0 24px',
632
+ width: '24px',
633
+ height: '24px',
634
+ position: 'relative',
635
+ alignSelf: 'start',
636
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
637
+ "& > input[type='checkbox']": {
638
+ opacity: 0,
639
+ width: '100%',
640
+ height: '100%',
641
+ zIndex: 1,
642
+ cursor: 'pointer',
643
+ outline: 'none',
644
+ margin: 0,
645
+ position: 'absolute',
646
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
647
+ '&[disabled]': {
648
+ cursor: 'default'
649
+ },
650
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
651
+ '& + svg': {
652
+ '--checkbox-background-color': 'var(--local-background)',
653
+ '--checkbox-border-color': 'var(--local-border)',
654
+ '--checkbox-tick-color': 'var(--local-tick-rest)',
655
+ color: 'var(--checkbox-background-color)',
656
+ fill: 'var(--checkbox-tick-color)',
657
+ transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
658
+ boxSizing: 'border-box',
659
+ display: 'inline',
660
+ position: 'absolute',
661
+ top: '50%',
662
+ left: '50%',
663
+ transform: 'translate(-50%, -50%)',
664
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
665
+ 'rect:first-of-type': {
666
+ stroke: 'var(--checkbox-border-color)',
667
+ strokeWidth: "var(--ds-border-width, 1px)",
668
+ transition: 'stroke 0.2s ease-in-out'
669
+ }
670
+ },
671
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
672
+ '&:focus + svg, &:checked:focus + svg': {
673
+ borderRadius: "var(--ds-radius-small, 0.25rem)",
674
+ outline: "var(--ds-border-width-focused, 2px)".concat(" solid ", "var(--ds-border-focused, #2684FF)"),
675
+ outlineOffset: "var(--ds-space-negative-025, -2px)"
676
+ },
677
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
678
+ '&:hover + svg': {
679
+ '--checkbox-background-color': 'var(--local-background-hover)',
680
+ '--checkbox-border-color': 'var(--local-border-hover)'
681
+ },
682
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
683
+ '&:checked:hover + svg': {
684
+ '--checkbox-background-color': 'var(--local-background-checked-hover)',
685
+ '--checkbox-border-color': 'var(--local-border-checked-hover)'
686
+ },
687
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
688
+ '&:checked + svg': {
689
+ '--checkbox-background-color': 'var(--local-background-checked)',
690
+ '--checkbox-border-color': 'var(--local-border-checked)',
691
+ '--checkbox-tick-color': 'var(--local-tick-checked)'
692
+ },
693
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
694
+ '&:active + svg': {
695
+ '--checkbox-background-color': 'var(--local-background-active)',
696
+ '--checkbox-border-color': 'var(--local-border-active)'
697
+ },
698
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
699
+ '&:checked:active + svg': {
700
+ '--checkbox-background-color': 'var(--local-background-active)',
701
+ '--checkbox-border-color': 'var(--local-border-active)',
702
+ '--checkbox-tick-color': 'var(--local-tick-active)'
703
+ },
704
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
705
+ '&:disabled + svg, &:disabled:hover + svg, &:disabled:focus + svg, &:disabled:active + svg, &:disabled[data-invalid] + svg': {
706
+ '--checkbox-background-color': 'var(--local-background-disabled)',
707
+ '--checkbox-border-color': 'var(--local-border-disabled)',
708
+ cursor: 'not-allowed',
709
+ pointerEvents: 'none'
710
+ },
711
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
712
+ '&:disabled:checked + svg': {
713
+ '--checkbox-tick-color': 'var(--local-tick-disabled)'
714
+ }
715
+ }
716
+ }));
717
+
718
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
719
+ export var taskItemStylesWithBlockTaskItem = css({
720
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
721
+ '[data-prosemirror-node-name="taskItem"], [data-prosemirror-node-name="blockTaskItem"]': {
722
+ listStyle: 'none'
723
+ },
724
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
725
+ '[data-prosemirror-node-name="taskItem"] [data-component="task-item-main"], [data-prosemirror-node-name="blockTaskItem"] [data-component="task-item-main"]': {
726
+ display: 'flex',
727
+ flexDirection: 'row',
728
+ position: 'relative'
729
+ },
730
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
731
+ '[data-prosemirror-node-name="taskItem"] [data-component="placeholder"], [data-prosemirror-node-name="blockTaskItem"] [data-component="placeholder"]': {
732
+ position: 'absolute',
733
+ color: "var(--ds-text-subtlest, #6B6E76)",
734
+ margin: "0 0 0 calc(".concat("var(--ds-space-100, 8px)", " * 3)"),
735
+ pointerEvents: 'none',
736
+ textOverflow: 'ellipsis',
737
+ overflow: 'hidden',
738
+ whiteSpace: 'nowrap',
739
+ maxWidth: 'calc(100% - 50px)',
740
+ display: 'none'
741
+ },
742
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
743
+ "[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']": {
744
+ display: 'block'
745
+ },
746
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
747
+ '[data-prosemirror-node-name="taskItem"] [data-component="content"], [data-prosemirror-node-name="blockTaskItem"] [data-component="content"]': {
748
+ margin: 0,
749
+ wordWrap: 'break-word',
750
+ minWidth: 0,
751
+ flex: '1 1 auto'
752
+ }
753
+ });
package/dist/esm/version-wrapper.js CHANGED
@@ -1,2 +1,2 @@
1
1
  export var name = "@atlaskit/editor-core";
2
- export var version = "216.4.0";
2
+ export var version = "0.0.0-development";
package/dist/types/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.d.ts CHANGED
@@ -13,4 +13,7 @@ export declare const decisionDangerStyles: SerializedStyles;
13
13
  export declare const decisionIconWithVisualRefresh: SerializedStyles;
14
14
  export declare const decisionIconWithoutVisualRefresh: SerializedStyles;
15
15
  export declare const taskItemStyles: SerializedStyles;
16
+ export declare const taskItemCheckboxStyles: SerializedStyles;
17
+ export declare const taskItemCheckboxStylesWithBlockTaskItem: SerializedStyles;
18
+ export declare const taskItemNextCheckboxStyles: SerializedStyles;
16
19
  export declare const taskItemStylesWithBlockTaskItem: SerializedStyles;
package/dist/types-ts4.5/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.d.ts CHANGED
@@ -13,4 +13,7 @@ export declare const decisionDangerStyles: SerializedStyles;
13
13
  export declare const decisionIconWithVisualRefresh: SerializedStyles;
14
14
  export declare const decisionIconWithoutVisualRefresh: SerializedStyles;
15
15
  export declare const taskItemStyles: SerializedStyles;
16
+ export declare const taskItemCheckboxStyles: SerializedStyles;
17
+ export declare const taskItemCheckboxStylesWithBlockTaskItem: SerializedStyles;
18
+ export declare const taskItemNextCheckboxStyles: SerializedStyles;
16
19
  export declare const taskItemStylesWithBlockTaskItem: SerializedStyles;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-core",
3
- "version": "216.5.0",
3
+ "version": "216.6.0",
4
4
  "description": "A package contains Atlassian editor core functionality",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -49,7 +49,7 @@
49
49
  "@atlaskit/editor-json-transformer": "^8.31.0",
50
50
  "@atlaskit/editor-performance-metrics": "^2.1.0",
51
51
  "@atlaskit/editor-plugin-connectivity": "^7.0.0",
52
- "@atlaskit/editor-plugin-quick-insert": "^7.0.0",
52
+ "@atlaskit/editor-plugin-quick-insert": "^7.1.0",
53
53
  "@atlaskit/editor-plugin-user-preferences": "^5.0.0",
54
54
  "@atlaskit/editor-plugins": "^11.2.0",
55
55
  "@atlaskit/editor-prosemirror": "^7.2.0",
@@ -64,11 +64,11 @@
64
64
  "@atlaskit/mention": "^24.4.0",
65
65
  "@atlaskit/platform-feature-flags": "^1.1.0",
66
66
  "@atlaskit/platform-feature-flags-react": "^0.4.0",
67
- "@atlaskit/react-ufo": "^4.16.0",
67
+ "@atlaskit/react-ufo": "^4.17.0",
68
68
  "@atlaskit/task-decision": "^19.2.0",
69
- "@atlaskit/tmp-editor-statsig": "^16.12.0",
69
+ "@atlaskit/tmp-editor-statsig": "^16.14.0",
70
70
  "@atlaskit/tokens": "^9.1.0",
71
- "@atlaskit/tooltip": "^20.12.0",
71
+ "@atlaskit/tooltip": "^20.13.0",
72
72
  "@atlaskit/width-detector": "^5.0.0",
73
73
  "@babel/runtime": "^7.0.0",
74
74
  "@emotion/react": "^11.7.1",