@atlaskit/editor-plugin-block-controls 3.3.18 → 3.3.19

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 (8) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/cjs/ui/drag-handle.js +7 -1
  3. package/dist/cjs/ui/quick-insert-button.js +3 -3
  4. package/dist/es2019/ui/drag-handle.js +7 -1
  5. package/dist/es2019/ui/quick-insert-button.js +3 -3
  6. package/dist/esm/ui/drag-handle.js +7 -1
  7. package/dist/esm/ui/quick-insert-button.js +3 -3
  8. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 3.3.19
4
+
5
+ ### Patch Changes
6
+
7
+ - [#128787](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/128787)
8
+ [`8d3d8163602e9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8d3d8163602e9) -
9
+ use color.icon.subtle pallette for both block control widgets, which includes drag handle and
10
+ quick insert
11
+ - Updated dependencies
12
+
3
13
  ## 3.3.18
4
14
 
5
15
  ### Patch Changes
package/dist/cjs/ui/drag-handle.js CHANGED
@@ -43,6 +43,11 @@ var iconWrapperStyles = (0, _primitives.xcss)({
43
43
  justifyContent: 'center',
44
44
  alignItems: 'center'
45
45
  });
46
+
47
+ // update color to match quick insert button for new editor controls
48
+ var dragHandleColor = (0, _react2.css)({
49
+ color: "var(--ds-icon-subtle, #626F86)"
50
+ });
46
51
  var dragHandleButtonStyles = (0, _react2.css)({
47
52
  position: 'absolute',
48
53
  padding: "var(--ds-space-025, 2px)".concat(" 0"),
@@ -59,6 +64,7 @@ var dragHandleButtonStyles = (0, _react2.css)({
59
64
  background: 'transparent',
60
65
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
61
66
  borderRadius: _consts.DRAG_HANDLE_BORDER_RADIUS,
67
+ // when platform_editor_controls is enabled, the drag handle color is overridden. Update color here when experiment is cleaned up.
62
68
  color: "var(--ds-icon, #44546F)",
63
69
  cursor: 'grab',
64
70
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -632,7 +638,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
632
638
  // eslint-disable-next-line @atlaskit/design-system/no-html-button
633
639
  (0, _react2.jsx)("button", {
634
640
  type: "button",
635
- css: [dragHandleButtonStyles,
641
+ css: [dragHandleButtonStyles, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && dragHandleColor,
636
642
  // ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
637
643
  // See https://product-fabric.atlassian.net/browse/ED-26266
638
644
  _browser.browser.gecko && (0, _platformFeatureFlags.fg)('platform_editor_dnd_handle_highlight_fix_firefox') && dragHandleMultiLineSelectionFixFirefox, (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && selectedStyles],
package/dist/cjs/ui/quick-insert-button.js CHANGED
@@ -37,10 +37,10 @@ var buttonStyles = (0, _primitives.xcss)({
37
37
  zIndex: 'card',
38
38
  outline: 'none',
39
39
  ':hover': {
40
- backgroundColor: 'color.background.neutral.hovered'
40
+ backgroundColor: 'color.background.neutral.subtle.hovered'
41
41
  },
42
42
  ':active': {
43
- backgroundColor: 'color.background.neutral.pressed'
43
+ backgroundColor: 'color.background.neutral.subtle.pressed'
44
44
  },
45
45
  ':focus': {
46
46
  outline: "2px solid ".concat("var(--ds-border-focused, #388BFF)")
@@ -179,7 +179,7 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
179
179
  onClick: handleQuickInsert
180
180
  }, /*#__PURE__*/_react.default.createElement(_add.default, {
181
181
  label: "add",
182
- color: "var(--ds-icon, #44546F)"
182
+ color: "var(--ds-icon-subtle, #626F86)"
183
183
  }))))
184
184
  );
185
185
  };
package/dist/es2019/ui/drag-handle.js CHANGED
@@ -35,6 +35,11 @@ const iconWrapperStyles = xcss({
35
35
  justifyContent: 'center',
36
36
  alignItems: 'center'
37
37
  });
38
+
39
+ // update color to match quick insert button for new editor controls
40
+ const dragHandleColor = css({
41
+ color: "var(--ds-icon-subtle, #626F86)"
42
+ });
38
43
  const dragHandleButtonStyles = css({
39
44
  position: 'absolute',
40
45
  padding: `${"var(--ds-space-025, 2px)"} 0`,
@@ -51,6 +56,7 @@ const dragHandleButtonStyles = css({
51
56
  background: 'transparent',
52
57
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
53
58
  borderRadius: DRAG_HANDLE_BORDER_RADIUS,
59
+ // when platform_editor_controls is enabled, the drag handle color is overridden. Update color here when experiment is cleaned up.
54
60
  color: "var(--ds-icon, #44546F)",
55
61
  cursor: 'grab',
56
62
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -617,7 +623,7 @@ export const DragHandle = ({
617
623
  // eslint-disable-next-line @atlaskit/design-system/no-html-button
618
624
  jsx("button", {
619
625
  type: "button",
620
- css: [dragHandleButtonStyles,
626
+ css: [dragHandleButtonStyles, editorExperiment('platform_editor_controls', 'variant1') && dragHandleColor,
621
627
  // ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
622
628
  // See https://product-fabric.atlassian.net/browse/ED-26266
623
629
  browser.gecko && fg('platform_editor_dnd_handle_highlight_fix_firefox') && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && selectedStyles],
package/dist/es2019/ui/quick-insert-button.js CHANGED
@@ -26,10 +26,10 @@ const buttonStyles = xcss({
26
26
  zIndex: 'card',
27
27
  outline: 'none',
28
28
  ':hover': {
29
- backgroundColor: 'color.background.neutral.hovered'
29
+ backgroundColor: 'color.background.neutral.subtle.hovered'
30
30
  },
31
31
  ':active': {
32
- backgroundColor: 'color.background.neutral.pressed'
32
+ backgroundColor: 'color.background.neutral.subtle.pressed'
33
33
  },
34
34
  ':focus': {
35
35
  outline: `2px solid ${"var(--ds-border-focused, #388BFF)"}`
@@ -167,7 +167,7 @@ export const TypeAheadControl = ({
167
167
  onClick: handleQuickInsert
168
168
  }, /*#__PURE__*/React.createElement(AddIcon, {
169
169
  label: "add",
170
- color: "var(--ds-icon, #44546F)"
170
+ color: "var(--ds-icon-subtle, #626F86)"
171
171
  }))))
172
172
  );
173
173
  };
package/dist/esm/ui/drag-handle.js CHANGED
@@ -40,6 +40,11 @@ var iconWrapperStyles = xcss({
40
40
  justifyContent: 'center',
41
41
  alignItems: 'center'
42
42
  });
43
+
44
+ // update color to match quick insert button for new editor controls
45
+ var dragHandleColor = css({
46
+ color: "var(--ds-icon-subtle, #626F86)"
47
+ });
43
48
  var dragHandleButtonStyles = css({
44
49
  position: 'absolute',
45
50
  padding: "var(--ds-space-025, 2px)".concat(" 0"),
@@ -56,6 +61,7 @@ var dragHandleButtonStyles = css({
56
61
  background: 'transparent',
57
62
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
58
63
  borderRadius: DRAG_HANDLE_BORDER_RADIUS,
64
+ // when platform_editor_controls is enabled, the drag handle color is overridden. Update color here when experiment is cleaned up.
59
65
  color: "var(--ds-icon, #44546F)",
60
66
  cursor: 'grab',
61
67
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -629,7 +635,7 @@ export var DragHandle = function DragHandle(_ref) {
629
635
  // eslint-disable-next-line @atlaskit/design-system/no-html-button
630
636
  jsx("button", {
631
637
  type: "button",
632
- css: [dragHandleButtonStyles,
638
+ css: [dragHandleButtonStyles, editorExperiment('platform_editor_controls', 'variant1') && dragHandleColor,
633
639
  // ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
634
640
  // See https://product-fabric.atlassian.net/browse/ED-26266
635
641
  browser.gecko && fg('platform_editor_dnd_handle_highlight_fix_firefox') && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && selectedStyles],
package/dist/esm/ui/quick-insert-button.js CHANGED
@@ -27,10 +27,10 @@ var buttonStyles = xcss({
27
27
  zIndex: 'card',
28
28
  outline: 'none',
29
29
  ':hover': {
30
- backgroundColor: 'color.background.neutral.hovered'
30
+ backgroundColor: 'color.background.neutral.subtle.hovered'
31
31
  },
32
32
  ':active': {
33
- backgroundColor: 'color.background.neutral.pressed'
33
+ backgroundColor: 'color.background.neutral.subtle.pressed'
34
34
  },
35
35
  ':focus': {
36
36
  outline: "2px solid ".concat("var(--ds-border-focused, #388BFF)")
@@ -169,7 +169,7 @@ export var TypeAheadControl = function TypeAheadControl(_ref) {
169
169
  onClick: handleQuickInsert
170
170
  }, /*#__PURE__*/React.createElement(AddIcon, {
171
171
  label: "add",
172
- color: "var(--ds-icon, #44546F)"
172
+ color: "var(--ds-icon-subtle, #626F86)"
173
173
  }))))
174
174
  );
175
175
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "3.3.18",
3
+ "version": "3.3.19",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -33,7 +33,7 @@
33
33
  },
34
34
  "dependencies": {
35
35
  "@atlaskit/adf-schema": "^47.6.0",
36
- "@atlaskit/editor-common": "^102.10.0",
36
+ "@atlaskit/editor-common": "^102.11.0",
37
37
  "@atlaskit/editor-plugin-accessibility-utils": "^2.0.0",
38
38
  "@atlaskit/editor-plugin-analytics": "^2.2.0",
39
39
  "@atlaskit/editor-plugin-editor-disabled": "^2.0.0",