@atlaskit/editor-plugin-floating-toolbar 3.1.0 → 3.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/ui/Toolbar.js +19 -7
  3. package/dist/es2019/ui/Toolbar.js +19 -7
  4. package/dist/esm/ui/Toolbar.js +19 -7
  5. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/editor-plugin-floating-toolbar
2
2
 
3
+ ## 3.1.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
3
9
  ## 3.1.0
4
10
 
5
11
  ### Minor Changes
package/dist/cjs/ui/Toolbar.js CHANGED
@@ -352,16 +352,19 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
352
352
  var groupedItems = groupItems(items.filter(function (item) {
353
353
  return !item.hidden;
354
354
  }));
355
- return (0, _react2.jsx)(_buttonGroup.default, null, groupedItems.map(function (element, index) {
355
+ return (0, _react2.jsx)(_buttonGroup.default, {
356
+ testId: "editor-floating-toolbar-items"
357
+ }, groupedItems.map(function (element, index) {
356
358
  var isGroup = Array.isArray(element);
357
359
  if (isGroup) {
358
360
  return (0, _react2.jsx)("div", {
359
361
  // Ignored via go/ees005
360
362
  // eslint-disable-next-line react/no-array-index-key
361
363
  key: index,
362
- css: buttonGroupStyles,
364
+ css: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? buttonGroupStylesNew : buttonGroupStyles,
363
365
  role: "radiogroup",
364
- "aria-label": groupLabel !== null && groupLabel !== void 0 ? groupLabel : undefined
366
+ "aria-label": groupLabel !== null && groupLabel !== void 0 ? groupLabel : undefined,
367
+ "data-testid": "editor-floating-toolbar-grouped-buttons"
365
368
  }, element.map(function (element) {
366
369
  var indexInAllItems = items.findIndex(function (item) {
367
370
  return item === element;
@@ -387,6 +390,10 @@ var buttonGroupStyles = (0, _react2.css)({
387
390
  display: 'flex',
388
391
  gap: "var(--ds-space-050, 4px)"
389
392
  });
393
+ var buttonGroupStylesNew = (0, _react2.css)({
394
+ display: 'flex',
395
+ gap: "var(--ds-space-075, 6px)"
396
+ });
390
397
 
391
398
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
392
399
  var toolbarContainer = function toolbarContainer(scrollable, hasSelect, firstElementIsSelect) {
@@ -485,13 +492,18 @@ var toolbarOverflow = function toolbarOverflow(_ref2) {
485
492
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
486
493
  (0, _react2.css)({
487
494
  // 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)"),
495
+ padding: "var(--ds-space-0, 0)".concat(" 4px ", "var(--ds-space-600, 48px)", " 4px"),
489
496
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
490
497
  '> div': {
491
498
  minHeight: "var(--ds-space-500, 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)"
499
+ gap: "var(--ds-space-075, 6px)",
500
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
501
+ '> div:first-child': {
502
+ marginLeft: 0
503
+ },
504
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
505
+ '> div:last-child': {
506
+ marginRight: 0
495
507
  }
496
508
  }
497
509
  }) : undefined) :
package/dist/es2019/ui/Toolbar.js CHANGED
@@ -319,16 +319,19 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
319
319
  }
320
320
  };
321
321
  const groupedItems = groupItems(items.filter(item => !item.hidden));
322
- return jsx(ButtonGroup, null, groupedItems.map((element, index) => {
322
+ return jsx(ButtonGroup, {
323
+ testId: "editor-floating-toolbar-items"
324
+ }, groupedItems.map((element, index) => {
323
325
  const isGroup = Array.isArray(element);
324
326
  if (isGroup) {
325
327
  return jsx("div", {
326
328
  // Ignored via go/ees005
327
329
  // eslint-disable-next-line react/no-array-index-key
328
330
  key: index,
329
- css: buttonGroupStyles,
331
+ css: editorExperiment('platform_editor_controls', 'variant1') ? buttonGroupStylesNew : buttonGroupStyles,
330
332
  role: "radiogroup",
331
- "aria-label": groupLabel !== null && groupLabel !== void 0 ? groupLabel : undefined
333
+ "aria-label": groupLabel !== null && groupLabel !== void 0 ? groupLabel : undefined,
334
+ "data-testid": "editor-floating-toolbar-grouped-buttons"
332
335
  }, element.map(element => {
333
336
  const indexInAllItems = items.findIndex(item => item === element);
334
337
  return renderItem(element, indexInAllItems);
@@ -350,6 +353,10 @@ const buttonGroupStyles = css({
350
353
  display: 'flex',
351
354
  gap: "var(--ds-space-050, 4px)"
352
355
  });
356
+ const buttonGroupStylesNew = css({
357
+ display: 'flex',
358
+ gap: "var(--ds-space-075, 6px)"
359
+ });
353
360
 
354
361
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
355
362
  const toolbarContainer = (scrollable, hasSelect, firstElementIsSelect) => css({
@@ -446,13 +453,18 @@ editorExperiment('platform_editor_controls', 'variant1') ?
446
453
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
447
454
  css({
448
455
  // 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)"}`,
456
+ padding: `${"var(--ds-space-0, 0)"} 4px ${"var(--ds-space-600, 48px)"} 4px`,
450
457
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
451
458
  '> div': {
452
459
  minHeight: "var(--ds-space-500, 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)"
460
+ gap: "var(--ds-space-075, 6px)",
461
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
462
+ '> div:first-child': {
463
+ marginLeft: 0
464
+ },
465
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
466
+ '> div:last-child': {
467
+ marginRight: 0
456
468
  }
457
469
  }
458
470
  }) : undefined) :
package/dist/esm/ui/Toolbar.js CHANGED
@@ -345,16 +345,19 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
345
345
  var groupedItems = groupItems(items.filter(function (item) {
346
346
  return !item.hidden;
347
347
  }));
348
- return jsx(ButtonGroup, null, groupedItems.map(function (element, index) {
348
+ return jsx(ButtonGroup, {
349
+ testId: "editor-floating-toolbar-items"
350
+ }, groupedItems.map(function (element, index) {
349
351
  var isGroup = Array.isArray(element);
350
352
  if (isGroup) {
351
353
  return jsx("div", {
352
354
  // Ignored via go/ees005
353
355
  // eslint-disable-next-line react/no-array-index-key
354
356
  key: index,
355
- css: buttonGroupStyles,
357
+ css: editorExperiment('platform_editor_controls', 'variant1') ? buttonGroupStylesNew : buttonGroupStyles,
356
358
  role: "radiogroup",
357
- "aria-label": groupLabel !== null && groupLabel !== void 0 ? groupLabel : undefined
359
+ "aria-label": groupLabel !== null && groupLabel !== void 0 ? groupLabel : undefined,
360
+ "data-testid": "editor-floating-toolbar-grouped-buttons"
358
361
  }, element.map(function (element) {
359
362
  var indexInAllItems = items.findIndex(function (item) {
360
363
  return item === element;
@@ -380,6 +383,10 @@ var buttonGroupStyles = css({
380
383
  display: 'flex',
381
384
  gap: "var(--ds-space-050, 4px)"
382
385
  });
386
+ var buttonGroupStylesNew = css({
387
+ display: 'flex',
388
+ gap: "var(--ds-space-075, 6px)"
389
+ });
383
390
 
384
391
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
385
392
  var toolbarContainer = function toolbarContainer(scrollable, hasSelect, firstElementIsSelect) {
@@ -478,13 +485,18 @@ var toolbarOverflow = function toolbarOverflow(_ref2) {
478
485
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
479
486
  css({
480
487
  // 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)"),
488
+ padding: "var(--ds-space-0, 0)".concat(" 4px ", "var(--ds-space-600, 48px)", " 4px"),
482
489
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
483
490
  '> div': {
484
491
  minHeight: "var(--ds-space-500, 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)"
492
+ gap: "var(--ds-space-075, 6px)",
493
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
494
+ '> div:first-child': {
495
+ marginLeft: 0
496
+ },
497
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
498
+ '> div:last-child': {
499
+ marginRight: 0
488
500
  }
489
501
  }
490
502
  }) : undefined) :
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-floating-toolbar",
3
- "version": "3.1.0",
3
+ "version": "3.1.1",
4
4
  "description": "Floating toolbar plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -28,7 +28,7 @@
28
28
  "@atlaskit/adf-utils": "^19.19.0",
29
29
  "@atlaskit/button": "^21.1.0",
30
30
  "@atlaskit/checkbox": "^17.0.0",
31
- "@atlaskit/editor-common": "^100.5.0",
31
+ "@atlaskit/editor-common": "^101.0.0",
32
32
  "@atlaskit/editor-palette": "2.0.0",
33
33
  "@atlaskit/editor-plugin-block-controls": "^3.2.0",
34
34
  "@atlaskit/editor-plugin-context-panel": "^3.0.0",