@atlaskit/editor-plugin-block-controls 3.7.0 → 3.7.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 +9 -0
  2. package/dist/cjs/ui/quick-insert-button.js +35 -22
  3. package/dist/es2019/ui/quick-insert-button.js +35 -22
  4. package/dist/esm/ui/quick-insert-button.js +35 -22
  5. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 3.7.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#134680](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/134680)
8
+ [`e031bb5981334`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e031bb5981334) -
9
+ ED-27127 added tests for type ahead control
10
+ - Updated dependencies
11
+
3
12
  ## 3.7.0
4
13
 
5
14
  ### Minor Changes
package/dist/cjs/ui/quick-insert-button.js CHANGED
@@ -49,10 +49,22 @@ var buttonStyles = (0, _primitives.xcss)({
49
49
  outline: "2px solid ".concat("var(--ds-border-focused, #388BFF)")
50
50
  }
51
51
  });
52
+ var disabledStyles = (0, _primitives.xcss)({
53
+ pointerEvents: 'none',
54
+ ':hover': {
55
+ backgroundColor: 'color.background.disabled'
56
+ },
57
+ ':active': {
58
+ backgroundColor: 'color.background.disabled'
59
+ }
60
+ });
52
61
  var containerStaticStyles = (0, _primitives.xcss)({
53
62
  position: 'absolute',
54
63
  zIndex: 'card'
55
64
  });
65
+ var disabledContainerStyles = (0, _primitives.xcss)({
66
+ cursor: 'not-allowed'
67
+ });
56
68
 
57
69
  // TODO: ED-26959 - Share prop types between DragHandle - generic enough to create a type for block control decoration
58
70
 
@@ -64,6 +76,7 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
64
76
  rootAnchorName = _ref.rootAnchorName,
65
77
  rootNodeType = _ref.rootNodeType;
66
78
  var macroInteractionUpdates = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'featureFlags.macroInteractionUpdates');
79
+ var isTypeAheadOpen = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'typeAhead.isOpen');
67
80
  var _useState = (0, _react.useState)({
68
81
  display: 'none'
69
82
  }),
@@ -193,26 +206,26 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
193
206
  });
194
207
  }
195
208
  }, [api, view.state]);
196
- return (
197
- /*#__PURE__*/
198
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
199
- _react.default.createElement(_primitives.Box, {
200
- style: positionStyles,
201
- xcss: [containerStaticStyles]
202
- }, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
203
- position: "top",
204
- content: /*#__PURE__*/_react.default.createElement(_keymaps.ToolTipContent, {
205
- description: formatMessage(_messages.blockControlsMessages.insert)
206
- })
207
- }, /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
208
- type: "button",
209
- "aria-label": formatMessage(_messages.blockControlsMessages.insert),
210
- xcss: [buttonStyles],
211
- onClick: handleQuickInsert,
212
- onMouseDown: handleMouseDown
213
- }, /*#__PURE__*/_react.default.createElement(_add.default, {
214
- label: "add",
215
- color: "var(--ds-icon-subtle, #626F86)"
216
- }))))
217
- );
209
+ return /*#__PURE__*/_react.default.createElement(_primitives.Box
210
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
211
+ , {
212
+ style: positionStyles,
213
+ xcss: [containerStaticStyles, isTypeAheadOpen && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_1') && disabledContainerStyles]
214
+ }, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
215
+ position: "top",
216
+ content: /*#__PURE__*/_react.default.createElement(_keymaps.ToolTipContent, {
217
+ description: formatMessage(_messages.blockControlsMessages.insert)
218
+ })
219
+ }, /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
220
+ testId: "editor-quick-insert-button",
221
+ type: "button",
222
+ "aria-label": formatMessage(_messages.blockControlsMessages.insert),
223
+ xcss: [buttonStyles, isTypeAheadOpen && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_1') && disabledStyles],
224
+ onClick: handleQuickInsert,
225
+ onMouseDown: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_1') ? undefined : handleMouseDown,
226
+ isDisabled: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_1') ? isTypeAheadOpen : undefined
227
+ }, /*#__PURE__*/_react.default.createElement(_add.default, {
228
+ label: "add",
229
+ color: isTypeAheadOpen ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon-subtle, #626F86)"
230
+ }))));
218
231
  };
package/dist/es2019/ui/quick-insert-button.js CHANGED
@@ -38,10 +38,22 @@ const buttonStyles = xcss({
38
38
  outline: `2px solid ${"var(--ds-border-focused, #388BFF)"}`
39
39
  }
40
40
  });
41
+ const disabledStyles = xcss({
42
+ pointerEvents: 'none',
43
+ ':hover': {
44
+ backgroundColor: 'color.background.disabled'
45
+ },
46
+ ':active': {
47
+ backgroundColor: 'color.background.disabled'
48
+ }
49
+ });
41
50
  const containerStaticStyles = xcss({
42
51
  position: 'absolute',
43
52
  zIndex: 'card'
44
53
  });
54
+ const disabledContainerStyles = xcss({
55
+ cursor: 'not-allowed'
56
+ });
45
57
 
46
58
  // TODO: ED-26959 - Share prop types between DragHandle - generic enough to create a type for block control decoration
47
59
 
@@ -54,6 +66,7 @@ export const TypeAheadControl = ({
54
66
  rootNodeType
55
67
  }) => {
56
68
  const macroInteractionUpdates = useSharedPluginStateSelector(api, 'featureFlags.macroInteractionUpdates');
69
+ const isTypeAheadOpen = useSharedPluginStateSelector(api, 'typeAhead.isOpen');
57
70
  const [positionStyles, setPositionStyles] = useState({
58
71
  display: 'none'
59
72
  });
@@ -180,26 +193,26 @@ export const TypeAheadControl = ({
180
193
  });
181
194
  }
182
195
  }, [api, view.state]);
183
- return (
184
- /*#__PURE__*/
185
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
186
- React.createElement(Box, {
187
- style: positionStyles,
188
- xcss: [containerStaticStyles]
189
- }, /*#__PURE__*/React.createElement(Tooltip, {
190
- position: "top",
191
- content: /*#__PURE__*/React.createElement(ToolTipContent, {
192
- description: formatMessage(messages.insert)
193
- })
194
- }, /*#__PURE__*/React.createElement(Pressable, {
195
- type: "button",
196
- "aria-label": formatMessage(messages.insert),
197
- xcss: [buttonStyles],
198
- onClick: handleQuickInsert,
199
- onMouseDown: handleMouseDown
200
- }, /*#__PURE__*/React.createElement(AddIcon, {
201
- label: "add",
202
- color: "var(--ds-icon-subtle, #626F86)"
203
- }))))
204
- );
196
+ return /*#__PURE__*/React.createElement(Box
197
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
198
+ , {
199
+ style: positionStyles,
200
+ xcss: [containerStaticStyles, isTypeAheadOpen && fg('platform_editor_controls_patch_1') && disabledContainerStyles]
201
+ }, /*#__PURE__*/React.createElement(Tooltip, {
202
+ position: "top",
203
+ content: /*#__PURE__*/React.createElement(ToolTipContent, {
204
+ description: formatMessage(messages.insert)
205
+ })
206
+ }, /*#__PURE__*/React.createElement(Pressable, {
207
+ testId: "editor-quick-insert-button",
208
+ type: "button",
209
+ "aria-label": formatMessage(messages.insert),
210
+ xcss: [buttonStyles, isTypeAheadOpen && fg('platform_editor_controls_patch_1') && disabledStyles],
211
+ onClick: handleQuickInsert,
212
+ onMouseDown: fg('platform_editor_controls_patch_1') ? undefined : handleMouseDown,
213
+ isDisabled: fg('platform_editor_controls_patch_1') ? isTypeAheadOpen : undefined
214
+ }, /*#__PURE__*/React.createElement(AddIcon, {
215
+ label: "add",
216
+ color: isTypeAheadOpen ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon-subtle, #626F86)"
217
+ }))));
205
218
  };
package/dist/esm/ui/quick-insert-button.js CHANGED
@@ -39,10 +39,22 @@ var buttonStyles = xcss({
39
39
  outline: "2px solid ".concat("var(--ds-border-focused, #388BFF)")
40
40
  }
41
41
  });
42
+ var disabledStyles = xcss({
43
+ pointerEvents: 'none',
44
+ ':hover': {
45
+ backgroundColor: 'color.background.disabled'
46
+ },
47
+ ':active': {
48
+ backgroundColor: 'color.background.disabled'
49
+ }
50
+ });
42
51
  var containerStaticStyles = xcss({
43
52
  position: 'absolute',
44
53
  zIndex: 'card'
45
54
  });
55
+ var disabledContainerStyles = xcss({
56
+ cursor: 'not-allowed'
57
+ });
46
58
 
47
59
  // TODO: ED-26959 - Share prop types between DragHandle - generic enough to create a type for block control decoration
48
60
 
@@ -54,6 +66,7 @@ export var TypeAheadControl = function TypeAheadControl(_ref) {
54
66
  rootAnchorName = _ref.rootAnchorName,
55
67
  rootNodeType = _ref.rootNodeType;
56
68
  var macroInteractionUpdates = useSharedPluginStateSelector(api, 'featureFlags.macroInteractionUpdates');
69
+ var isTypeAheadOpen = useSharedPluginStateSelector(api, 'typeAhead.isOpen');
57
70
  var _useState = useState({
58
71
  display: 'none'
59
72
  }),
@@ -183,26 +196,26 @@ export var TypeAheadControl = function TypeAheadControl(_ref) {
183
196
  });
184
197
  }
185
198
  }, [api, view.state]);
186
- return (
187
- /*#__PURE__*/
188
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
189
- React.createElement(Box, {
190
- style: positionStyles,
191
- xcss: [containerStaticStyles]
192
- }, /*#__PURE__*/React.createElement(Tooltip, {
193
- position: "top",
194
- content: /*#__PURE__*/React.createElement(ToolTipContent, {
195
- description: formatMessage(messages.insert)
196
- })
197
- }, /*#__PURE__*/React.createElement(Pressable, {
198
- type: "button",
199
- "aria-label": formatMessage(messages.insert),
200
- xcss: [buttonStyles],
201
- onClick: handleQuickInsert,
202
- onMouseDown: handleMouseDown
203
- }, /*#__PURE__*/React.createElement(AddIcon, {
204
- label: "add",
205
- color: "var(--ds-icon-subtle, #626F86)"
206
- }))))
207
- );
199
+ return /*#__PURE__*/React.createElement(Box
200
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
201
+ , {
202
+ style: positionStyles,
203
+ xcss: [containerStaticStyles, isTypeAheadOpen && fg('platform_editor_controls_patch_1') && disabledContainerStyles]
204
+ }, /*#__PURE__*/React.createElement(Tooltip, {
205
+ position: "top",
206
+ content: /*#__PURE__*/React.createElement(ToolTipContent, {
207
+ description: formatMessage(messages.insert)
208
+ })
209
+ }, /*#__PURE__*/React.createElement(Pressable, {
210
+ testId: "editor-quick-insert-button",
211
+ type: "button",
212
+ "aria-label": formatMessage(messages.insert),
213
+ xcss: [buttonStyles, isTypeAheadOpen && fg('platform_editor_controls_patch_1') && disabledStyles],
214
+ onClick: handleQuickInsert,
215
+ onMouseDown: fg('platform_editor_controls_patch_1') ? undefined : handleMouseDown,
216
+ isDisabled: fg('platform_editor_controls_patch_1') ? isTypeAheadOpen : undefined
217
+ }, /*#__PURE__*/React.createElement(AddIcon, {
218
+ label: "add",
219
+ color: isTypeAheadOpen ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon-subtle, #626F86)"
220
+ }))));
208
221
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "3.7.0",
3
+ "version": "3.7.1",
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.15.0",
36
+ "@atlaskit/editor-common": "^102.16.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",
@@ -46,7 +46,7 @@
46
46
  "@atlaskit/editor-prosemirror": "7.0.0",
47
47
  "@atlaskit/editor-shared-styles": "^3.4.0",
48
48
  "@atlaskit/editor-tables": "^2.9.0",
49
- "@atlaskit/icon": "^25.3.0",
49
+ "@atlaskit/icon": "^25.4.0",
50
50
  "@atlaskit/platform-feature-flags": "^1.1.0",
51
51
  "@atlaskit/pragmatic-drag-and-drop": "^1.5.0",
52
52
  "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^2.1.0",