@atlaskit/editor-plugin-floating-toolbar 3.0.0 → 3.0.2

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 (5) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/cjs/ui/Toolbar.js +25 -3
  3. package/dist/es2019/ui/Toolbar.js +25 -3
  4. package/dist/esm/ui/Toolbar.js +25 -3
  5. package/package.json +6 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,28 @@
1
1
  # @atlaskit/editor-plugin-floating-toolbar
2
2
 
3
+ ## 3.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#121092](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/121092)
8
+ [`8cd08b738070d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8cd08b738070d) -
9
+ [ux] Implemented full height separator as per design for media and card
10
+ - [#121249](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/121249)
11
+ [`d14ccaecc153a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d14ccaecc153a) -
12
+ ED-26862 contextual toolbar minor updates
13
+
14
+ ## 3.0.1
15
+
16
+ ### Patch Changes
17
+
18
+ - [#120533](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/120533)
19
+ [`f1bec731e278f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f1bec731e278f) -
20
+ Adds a `sideEffects` field to ensure this package does not have Compiled styles tree-shaken in the
21
+ future to avoid an accidental regression.
22
+
23
+ This is related to
24
+ https://community.developer.atlassian.com/t/rfc-73-migrating-our-components-to-compiled-css-in-js/85953
25
+
3
26
  ## 3.0.0
4
27
 
5
28
  ### Major Changes
package/dist/cjs/ui/Toolbar.js CHANGED
@@ -344,7 +344,8 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
344
344
  });
345
345
  case 'separator':
346
346
  return (0, _react2.jsx)(_ui.FloatingToolbarSeparator, {
347
- key: idx
347
+ key: idx,
348
+ fullHeight: item.fullHeight
348
349
  });
349
350
  }
350
351
  };
@@ -478,7 +479,22 @@ var toolbarOverflow = function toolbarOverflow(_ref2) {
478
479
  marginRight: "var(--ds-space-100, 8px)"
479
480
  }
480
481
  }
481
- }) :
482
+ },
483
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
484
+ (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ?
485
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
486
+ (0, _react2.css)({
487
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
488
+ padding: paddingFeatureFlag ? "var(--ds-space-0, 0)".concat(" 0 ", "var(--ds-space-050, 4px)") : "var(--ds-space-0, 0)".concat(" 0 ", "var(--ds-space-600, 48px)"),
489
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
490
+ '> div': {
491
+ height: '40px',
492
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
493
+ '> div:has(+ [data-editor-popup="true"]:last-of-type)': {
494
+ marginRight: "var(--ds-space-100, 8px)"
495
+ }
496
+ }
497
+ }) : undefined) :
482
498
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
483
499
  (0, _react2.css)({
484
500
  display: 'flex'
@@ -513,6 +529,11 @@ var Toolbar = /*#__PURE__*/function (_Component) {
513
529
  event.preventDefault();
514
530
  event.stopPropagation();
515
531
  });
532
+ (0, _defineProperty2.default)(_this, "handleMouseDown", function (event) {
533
+ // Prevents selection toolbar from closing when clicking on the toolbar
534
+ event.stopPropagation();
535
+ event.preventDefault();
536
+ });
516
537
  _this.scrollContainerRef = /*#__PURE__*/_react.default.createRef();
517
538
  _this.mountRef = /*#__PURE__*/_react.default.createRef();
518
539
  _this.toolbarContainerRef = /*#__PURE__*/_react.default.createRef();
@@ -628,7 +649,8 @@ var Toolbar = /*#__PURE__*/function (_Component) {
628
649
  "data-testid": "editor-floating-toolbar"
629
650
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
630
651
  ,
631
- className: className
652
+ className: className,
653
+ onMouseDown: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? this.handleMouseDown : undefined
632
654
  }, (0, _react2.jsx)(_ui.Announcer, {
633
655
  text: mediaAssistiveMessage ? "".concat(mediaAssistiveMessage, ", ").concat(intl.formatMessage(_floatingToolbar.messages.floatingToolbarAnnouncer)) : intl.formatMessage(_floatingToolbar.messages.floatingToolbarAnnouncer),
634
656
  delay: 250
package/dist/es2019/ui/Toolbar.js CHANGED
@@ -313,7 +313,8 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
313
313
  });
314
314
  case 'separator':
315
315
  return jsx(Separator, {
316
- key: idx
316
+ key: idx,
317
+ fullHeight: item.fullHeight
317
318
  });
318
319
  }
319
320
  };
@@ -439,7 +440,22 @@ css({
439
440
  marginRight: "var(--ds-space-100, 8px)"
440
441
  }
441
442
  }
442
- }) :
443
+ },
444
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
445
+ editorExperiment('platform_editor_controls', 'variant1') ?
446
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
447
+ css({
448
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
449
+ padding: paddingFeatureFlag ? `${"var(--ds-space-0, 0)"} 0 ${"var(--ds-space-050, 4px)"}` : `${"var(--ds-space-0, 0)"} 0 ${"var(--ds-space-600, 48px)"}`,
450
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
451
+ '> div': {
452
+ height: '40px',
453
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
454
+ '> div:has(+ [data-editor-popup="true"]:last-of-type)': {
455
+ marginRight: "var(--ds-space-100, 8px)"
456
+ }
457
+ }
458
+ }) : undefined) :
443
459
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
444
460
  css({
445
461
  display: 'flex'
@@ -469,6 +485,11 @@ class Toolbar extends Component {
469
485
  event.preventDefault();
470
486
  event.stopPropagation();
471
487
  });
488
+ _defineProperty(this, "handleMouseDown", event => {
489
+ // Prevents selection toolbar from closing when clicking on the toolbar
490
+ event.stopPropagation();
491
+ event.preventDefault();
492
+ });
472
493
  this.scrollContainerRef = /*#__PURE__*/React.createRef();
473
494
  this.mountRef = /*#__PURE__*/React.createRef();
474
495
  this.toolbarContainerRef = /*#__PURE__*/React.createRef();
@@ -574,7 +595,8 @@ class Toolbar extends Component {
574
595
  "data-testid": "editor-floating-toolbar"
575
596
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
576
597
  ,
577
- className: className
598
+ className: className,
599
+ onMouseDown: editorExperiment('platform_editor_controls', 'variant1') ? this.handleMouseDown : undefined
578
600
  }, jsx(Announcer, {
579
601
  text: mediaAssistiveMessage ? `${mediaAssistiveMessage}, ${intl.formatMessage(messages.floatingToolbarAnnouncer)}` : intl.formatMessage(messages.floatingToolbarAnnouncer),
580
602
  delay: 250
package/dist/esm/ui/Toolbar.js CHANGED
@@ -337,7 +337,8 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
337
337
  });
338
338
  case 'separator':
339
339
  return jsx(Separator, {
340
- key: idx
340
+ key: idx,
341
+ fullHeight: item.fullHeight
341
342
  });
342
343
  }
343
344
  };
@@ -471,7 +472,22 @@ var toolbarOverflow = function toolbarOverflow(_ref2) {
471
472
  marginRight: "var(--ds-space-100, 8px)"
472
473
  }
473
474
  }
474
- }) :
475
+ },
476
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
477
+ editorExperiment('platform_editor_controls', 'variant1') ?
478
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
479
+ css({
480
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
481
+ padding: paddingFeatureFlag ? "var(--ds-space-0, 0)".concat(" 0 ", "var(--ds-space-050, 4px)") : "var(--ds-space-0, 0)".concat(" 0 ", "var(--ds-space-600, 48px)"),
482
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
483
+ '> div': {
484
+ height: '40px',
485
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
486
+ '> div:has(+ [data-editor-popup="true"]:last-of-type)': {
487
+ marginRight: "var(--ds-space-100, 8px)"
488
+ }
489
+ }
490
+ }) : undefined) :
475
491
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
476
492
  css({
477
493
  display: 'flex'
@@ -506,6 +522,11 @@ var Toolbar = /*#__PURE__*/function (_Component) {
506
522
  event.preventDefault();
507
523
  event.stopPropagation();
508
524
  });
525
+ _defineProperty(_this, "handleMouseDown", function (event) {
526
+ // Prevents selection toolbar from closing when clicking on the toolbar
527
+ event.stopPropagation();
528
+ event.preventDefault();
529
+ });
509
530
  _this.scrollContainerRef = /*#__PURE__*/React.createRef();
510
531
  _this.mountRef = /*#__PURE__*/React.createRef();
511
532
  _this.toolbarContainerRef = /*#__PURE__*/React.createRef();
@@ -621,7 +642,8 @@ var Toolbar = /*#__PURE__*/function (_Component) {
621
642
  "data-testid": "editor-floating-toolbar"
622
643
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
623
644
  ,
624
- className: className
645
+ className: className,
646
+ onMouseDown: editorExperiment('platform_editor_controls', 'variant1') ? this.handleMouseDown : undefined
625
647
  }, jsx(Announcer, {
626
648
  text: mediaAssistiveMessage ? "".concat(mediaAssistiveMessage, ", ").concat(intl.formatMessage(messages.floatingToolbarAnnouncer)) : intl.formatMessage(messages.floatingToolbarAnnouncer),
627
649
  delay: 250
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-floating-toolbar",
3
- "version": "3.0.0",
3
+ "version": "3.0.2",
4
4
  "description": "Floating toolbar plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -17,7 +17,9 @@
17
17
  "module": "dist/esm/index.js",
18
18
  "module:es2019": "dist/es2019/index.js",
19
19
  "types": "dist/types/index.d.ts",
20
- "sideEffects": false,
20
+ "sideEffects": [
21
+ "*.compiled.css"
22
+ ],
21
23
  "atlaskit:src": "src/index.ts",
22
24
  "af:exports": {
23
25
  ".": "./src/index.ts"
@@ -26,7 +28,7 @@
26
28
  "@atlaskit/adf-utils": "^19.18.0",
27
29
  "@atlaskit/button": "^21.1.0",
28
30
  "@atlaskit/checkbox": "^17.0.0",
29
- "@atlaskit/editor-common": "^100.3.0",
31
+ "@atlaskit/editor-common": "^100.4.0",
30
32
  "@atlaskit/editor-palette": "2.0.0",
31
33
  "@atlaskit/editor-plugin-block-controls": "^3.1.0",
32
34
  "@atlaskit/editor-plugin-context-panel": "^3.0.0",
@@ -47,7 +49,7 @@
47
49
  "@atlaskit/select": "^20.0.0",
48
50
  "@atlaskit/theme": "^17.0.0",
49
51
  "@atlaskit/tmp-editor-statsig": "^3.3.0",
50
- "@atlaskit/tokens": "^4.2.0",
52
+ "@atlaskit/tokens": "^4.3.0",
51
53
  "@atlaskit/tooltip": "^20.0.0",
52
54
  "@babel/runtime": "^7.0.0",
53
55
  "@emotion/react": "^11.7.1",