@atlaskit/editor-plugin-text-formatting 3.0.9 → 3.0.10

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 (10) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/ui/Toolbar/components/Component.js +16 -12
  3. package/dist/cjs/ui/Toolbar/components/utils.js +13 -5
  4. package/dist/es2019/ui/Toolbar/components/Component.js +16 -12
  5. package/dist/es2019/ui/Toolbar/components/utils.js +14 -6
  6. package/dist/esm/ui/Toolbar/components/Component.js +16 -12
  7. package/dist/esm/ui/Toolbar/components/utils.js +14 -6
  8. package/dist/types/ui/Toolbar/components/utils.d.ts +1 -1
  9. package/dist/types-ts4.5/ui/Toolbar/components/utils.d.ts +1 -1
  10. package/package.json +6 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-text-formatting
2
2
 
3
+ ## 3.0.10
4
+
5
+ ### Patch Changes
6
+
7
+ - [`5f5ead7ec9a6c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5f5ead7ec9a6c) -
8
+ [ED-28682] Add text format mark schema check for isHidden state of format button options
9
+ - Updated dependencies
10
+
3
11
  ## 3.0.9
4
12
 
5
13
  ### Patch Changes
package/dist/cjs/ui/Toolbar/components/Component.js CHANGED
@@ -78,18 +78,22 @@ var FormatButton = exports.FormatButton = function FormatButton(_ref2) {
78
78
  ariaLabel = _useComponentInfo2.ariaLabel,
79
79
  formatTitle = _useComponentInfo2.formatTitle;
80
80
  var Icon = icon;
81
- return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarTooltip, {
82
- content: formatTitle
83
- }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarButton, {
84
- iconBefore: /*#__PURE__*/_react.default.createElement(Icon, {
85
- label: ariaLabel
86
- }),
87
- onClick: onClick,
88
- isSelected: isActive,
89
- isDisabled: isDisabled,
90
- groupLocation: groupLocation,
91
- ariaKeyshortcuts: (0, _keymaps.getAriaKeyshortcuts)(shortcut)
92
- }));
81
+ return (
82
+ /*#__PURE__*/
83
+ // TODO: ED-28743 - add keyboard shortcut here
84
+ _react.default.createElement(_editorToolbar.ToolbarTooltip, {
85
+ content: formatTitle
86
+ }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarButton, {
87
+ iconBefore: /*#__PURE__*/_react.default.createElement(Icon, {
88
+ label: ariaLabel
89
+ }),
90
+ onClick: onClick,
91
+ isSelected: isActive,
92
+ isDisabled: isDisabled,
93
+ groupLocation: groupLocation,
94
+ ariaKeyshortcuts: (0, _keymaps.getAriaKeyshortcuts)(shortcut)
95
+ }))
96
+ );
93
97
  };
94
98
  var ClearFormatMenuItem = exports.ClearFormatMenuItem = function ClearFormatMenuItem(_ref3) {
95
99
  var api = _ref3.api,
package/dist/cjs/ui/Toolbar/components/utils.js CHANGED
@@ -19,11 +19,19 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
19
19
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
20
20
  var getInputMethodFromParentKeys = exports.getInputMethodFromParentKeys = function getInputMethodFromParentKeys(parentKeys) {
21
21
  var _parentKeys$at;
22
- return (0, _inputMethodUtils.getInputMethod)(
23
- // TODO: ED-28682 - replace with const
24
- ((_parentKeys$at = parentKeys.at(-1)) === null || _parentKeys$at === void 0 ? void 0 : _parentKeys$at.key) === 'inline-text-toolbar' ? _types.ToolbarType.FLOATING : _types.ToolbarType.PRIMARY);
22
+ return (0, _inputMethodUtils.getInputMethod)(((_parentKeys$at = parentKeys.at(-1)) === null || _parentKeys$at === void 0 ? void 0 : _parentKeys$at.key) === _toolbar.TOOLBARS.INLINE_TEXT_TOOLBAR ? _types.ToolbarType.FLOATING : _types.ToolbarType.PRIMARY);
23
+ };
24
+ var FormatMarkSchema = {
25
+ strong: 'strong',
26
+ em: 'em',
27
+ underline: 'underline',
28
+ strike: 'strike',
29
+ code: 'code',
30
+ subscript: 'subsup',
31
+ superscript: 'subsup'
25
32
  };
26
33
  var useComponentInfo = exports.useComponentInfo = function useComponentInfo(_ref) {
34
+ var _api$core;
27
35
  var api = _ref.api,
28
36
  optionType = _ref.optionType,
29
37
  title = _ref.title,
@@ -43,6 +51,7 @@ var useComponentInfo = exports.useComponentInfo = function useComponentInfo(_ref
43
51
  isDisabled = _useSharedPluginState.isDisabled,
44
52
  isHidden = _useSharedPluginState.isHidden,
45
53
  isPluginInitialised = _useSharedPluginState.isPluginInitialised;
54
+ var hasMarkSchema = api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || (_api$core = _api$core.sharedState.currentState()) === null || _api$core === void 0 || (_api$core = _api$core.schema) === null || _api$core === void 0 ? void 0 : _api$core.marks[FormatMarkSchema[optionType]];
46
55
  var formatOptionState;
47
56
  if (!isPluginInitialised) {
48
57
  formatOptionState = {
@@ -54,8 +63,7 @@ var useComponentInfo = exports.useComponentInfo = function useComponentInfo(_ref
54
63
  formatOptionState = {
55
64
  isActive: Boolean(isActive),
56
65
  isDisabled: Boolean(isDisabled),
57
- // TODO: ED-28682 - also need to check if mark is present in the schema
58
- isHidden: Boolean(isHidden)
66
+ isHidden: Boolean(!hasMarkSchema || isHidden)
59
67
  };
60
68
  }
61
69
  var _useIntl = (0, _reactIntlNext.useIntl)(),
package/dist/es2019/ui/Toolbar/components/Component.js CHANGED
@@ -74,18 +74,22 @@ export const FormatButton = ({
74
74
  parents
75
75
  });
76
76
  const Icon = icon;
77
- return /*#__PURE__*/React.createElement(ToolbarTooltip, {
78
- content: formatTitle
79
- }, /*#__PURE__*/React.createElement(ToolbarButton, {
80
- iconBefore: /*#__PURE__*/React.createElement(Icon, {
81
- label: ariaLabel
82
- }),
83
- onClick: onClick,
84
- isSelected: isActive,
85
- isDisabled: isDisabled,
86
- groupLocation: groupLocation,
87
- ariaKeyshortcuts: getAriaKeyshortcuts(shortcut)
88
- }));
77
+ return (
78
+ /*#__PURE__*/
79
+ // TODO: ED-28743 - add keyboard shortcut here
80
+ React.createElement(ToolbarTooltip, {
81
+ content: formatTitle
82
+ }, /*#__PURE__*/React.createElement(ToolbarButton, {
83
+ iconBefore: /*#__PURE__*/React.createElement(Icon, {
84
+ label: ariaLabel
85
+ }),
86
+ onClick: onClick,
87
+ isSelected: isActive,
88
+ isDisabled: isDisabled,
89
+ groupLocation: groupLocation,
90
+ ariaKeyshortcuts: getAriaKeyshortcuts(shortcut)
91
+ }))
92
+ );
89
93
  };
90
94
  export const ClearFormatMenuItem = ({
91
95
  api,
package/dist/es2019/ui/Toolbar/components/utils.js CHANGED
@@ -2,16 +2,23 @@ import { useIntl } from 'react-intl-next';
2
2
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
3
3
  import { toggleBold, toggleCode, toggleItalic, toggleStrikethrough, toggleSubscript, toggleSuperscript, toggleUnderline, tooltip } from '@atlaskit/editor-common/keymaps';
4
4
  import { toolbarMessages } from '@atlaskit/editor-common/messages';
5
- import { BOLD_MENU_ITEM, CODE_MENU_ITEM, ITALIC_MENU_ITEM, STRIKE_MENU_ITEM, SUBSCRIPT_MENU_ITEM, SUPERSCRIPT_MENU_ITEM, TEXT_FORMATTING_MENU_SECTION_RANK, UNDERLINE_MENU_ITEM } from '@atlaskit/editor-common/toolbar';
5
+ import { BOLD_MENU_ITEM, CODE_MENU_ITEM, ITALIC_MENU_ITEM, STRIKE_MENU_ITEM, SUBSCRIPT_MENU_ITEM, SUPERSCRIPT_MENU_ITEM, TEXT_FORMATTING_MENU_SECTION_RANK, TOOLBARS, UNDERLINE_MENU_ITEM } from '@atlaskit/editor-common/toolbar';
6
6
  import { BoldIcon, ItalicIcon, UnderlineIcon, CodeIcon, StrikeThroughIcon, SubscriptIcon, SuperscriptIcon } from '@atlaskit/editor-toolbar';
7
7
  import { toggleStrongWithAnalytics, toggleEmWithAnalytics, toggleUnderlineWithAnalytics, toggleCodeWithAnalytics, toggleStrikeWithAnalytics, toggleSubscriptWithAnalytics, toggleSuperscriptWithAnalytics } from '../../../editor-commands/toggle-mark';
8
8
  import { getInputMethod } from '../input-method-utils';
9
9
  import { ToolbarType } from '../types';
10
10
  export const getInputMethodFromParentKeys = parentKeys => {
11
11
  var _parentKeys$at;
12
- return getInputMethod(
13
- // TODO: ED-28682 - replace with const
14
- ((_parentKeys$at = parentKeys.at(-1)) === null || _parentKeys$at === void 0 ? void 0 : _parentKeys$at.key) === 'inline-text-toolbar' ? ToolbarType.FLOATING : ToolbarType.PRIMARY);
12
+ return getInputMethod(((_parentKeys$at = parentKeys.at(-1)) === null || _parentKeys$at === void 0 ? void 0 : _parentKeys$at.key) === TOOLBARS.INLINE_TEXT_TOOLBAR ? ToolbarType.FLOATING : ToolbarType.PRIMARY);
13
+ };
14
+ const FormatMarkSchema = {
15
+ strong: 'strong',
16
+ em: 'em',
17
+ underline: 'underline',
18
+ strike: 'strike',
19
+ code: 'code',
20
+ subscript: 'subsup',
21
+ superscript: 'subsup'
15
22
  };
16
23
  export const useComponentInfo = ({
17
24
  api,
@@ -21,6 +28,7 @@ export const useComponentInfo = ({
21
28
  toggleMarkWithAnalyticsCallback,
22
29
  parents
23
30
  }) => {
31
+ var _api$core, _api$core$sharedState, _api$core$sharedState2;
24
32
  const {
25
33
  isActive,
26
34
  isDisabled,
@@ -35,6 +43,7 @@ export const useComponentInfo = ({
35
43
  isPluginInitialised: (_states$textFormattin4 = states.textFormattingState) === null || _states$textFormattin4 === void 0 ? void 0 : _states$textFormattin4.isInitialised
36
44
  };
37
45
  });
46
+ const hasMarkSchema = api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : (_api$core$sharedState = _api$core.sharedState.currentState()) === null || _api$core$sharedState === void 0 ? void 0 : (_api$core$sharedState2 = _api$core$sharedState.schema) === null || _api$core$sharedState2 === void 0 ? void 0 : _api$core$sharedState2.marks[FormatMarkSchema[optionType]];
38
47
  let formatOptionState;
39
48
  if (!isPluginInitialised) {
40
49
  formatOptionState = {
@@ -46,8 +55,7 @@ export const useComponentInfo = ({
46
55
  formatOptionState = {
47
56
  isActive: Boolean(isActive),
48
57
  isDisabled: Boolean(isDisabled),
49
- // TODO: ED-28682 - also need to check if mark is present in the schema
50
- isHidden: Boolean(isHidden)
58
+ isHidden: Boolean(!hasMarkSchema || isHidden)
51
59
  };
52
60
  }
53
61
  const {
package/dist/esm/ui/Toolbar/components/Component.js CHANGED
@@ -71,18 +71,22 @@ export var FormatButton = function FormatButton(_ref2) {
71
71
  ariaLabel = _useComponentInfo2.ariaLabel,
72
72
  formatTitle = _useComponentInfo2.formatTitle;
73
73
  var Icon = icon;
74
- return /*#__PURE__*/React.createElement(ToolbarTooltip, {
75
- content: formatTitle
76
- }, /*#__PURE__*/React.createElement(ToolbarButton, {
77
- iconBefore: /*#__PURE__*/React.createElement(Icon, {
78
- label: ariaLabel
79
- }),
80
- onClick: onClick,
81
- isSelected: isActive,
82
- isDisabled: isDisabled,
83
- groupLocation: groupLocation,
84
- ariaKeyshortcuts: getAriaKeyshortcuts(shortcut)
85
- }));
74
+ return (
75
+ /*#__PURE__*/
76
+ // TODO: ED-28743 - add keyboard shortcut here
77
+ React.createElement(ToolbarTooltip, {
78
+ content: formatTitle
79
+ }, /*#__PURE__*/React.createElement(ToolbarButton, {
80
+ iconBefore: /*#__PURE__*/React.createElement(Icon, {
81
+ label: ariaLabel
82
+ }),
83
+ onClick: onClick,
84
+ isSelected: isActive,
85
+ isDisabled: isDisabled,
86
+ groupLocation: groupLocation,
87
+ ariaKeyshortcuts: getAriaKeyshortcuts(shortcut)
88
+ }))
89
+ );
86
90
  };
87
91
  export var ClearFormatMenuItem = function ClearFormatMenuItem(_ref3) {
88
92
  var api = _ref3.api,
package/dist/esm/ui/Toolbar/components/utils.js CHANGED
@@ -5,18 +5,26 @@ import { useIntl } from 'react-intl-next';
5
5
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
6
6
  import { toggleBold, toggleCode, toggleItalic, toggleStrikethrough, toggleSubscript, toggleSuperscript, toggleUnderline, tooltip } from '@atlaskit/editor-common/keymaps';
7
7
  import { toolbarMessages } from '@atlaskit/editor-common/messages';
8
- import { BOLD_MENU_ITEM, CODE_MENU_ITEM, ITALIC_MENU_ITEM, STRIKE_MENU_ITEM, SUBSCRIPT_MENU_ITEM, SUPERSCRIPT_MENU_ITEM, TEXT_FORMATTING_MENU_SECTION_RANK, UNDERLINE_MENU_ITEM } from '@atlaskit/editor-common/toolbar';
8
+ import { BOLD_MENU_ITEM, CODE_MENU_ITEM, ITALIC_MENU_ITEM, STRIKE_MENU_ITEM, SUBSCRIPT_MENU_ITEM, SUPERSCRIPT_MENU_ITEM, TEXT_FORMATTING_MENU_SECTION_RANK, TOOLBARS, UNDERLINE_MENU_ITEM } from '@atlaskit/editor-common/toolbar';
9
9
  import { BoldIcon, ItalicIcon, UnderlineIcon, CodeIcon, StrikeThroughIcon, SubscriptIcon, SuperscriptIcon } from '@atlaskit/editor-toolbar';
10
10
  import { toggleStrongWithAnalytics, toggleEmWithAnalytics, toggleUnderlineWithAnalytics, toggleCodeWithAnalytics, toggleStrikeWithAnalytics, toggleSubscriptWithAnalytics, toggleSuperscriptWithAnalytics } from '../../../editor-commands/toggle-mark';
11
11
  import { getInputMethod } from '../input-method-utils';
12
12
  import { ToolbarType } from '../types';
13
13
  export var getInputMethodFromParentKeys = function getInputMethodFromParentKeys(parentKeys) {
14
14
  var _parentKeys$at;
15
- return getInputMethod(
16
- // TODO: ED-28682 - replace with const
17
- ((_parentKeys$at = parentKeys.at(-1)) === null || _parentKeys$at === void 0 ? void 0 : _parentKeys$at.key) === 'inline-text-toolbar' ? ToolbarType.FLOATING : ToolbarType.PRIMARY);
15
+ return getInputMethod(((_parentKeys$at = parentKeys.at(-1)) === null || _parentKeys$at === void 0 ? void 0 : _parentKeys$at.key) === TOOLBARS.INLINE_TEXT_TOOLBAR ? ToolbarType.FLOATING : ToolbarType.PRIMARY);
16
+ };
17
+ var FormatMarkSchema = {
18
+ strong: 'strong',
19
+ em: 'em',
20
+ underline: 'underline',
21
+ strike: 'strike',
22
+ code: 'code',
23
+ subscript: 'subsup',
24
+ superscript: 'subsup'
18
25
  };
19
26
  export var useComponentInfo = function useComponentInfo(_ref) {
27
+ var _api$core;
20
28
  var api = _ref.api,
21
29
  optionType = _ref.optionType,
22
30
  title = _ref.title,
@@ -36,6 +44,7 @@ export var useComponentInfo = function useComponentInfo(_ref) {
36
44
  isDisabled = _useSharedPluginState.isDisabled,
37
45
  isHidden = _useSharedPluginState.isHidden,
38
46
  isPluginInitialised = _useSharedPluginState.isPluginInitialised;
47
+ var hasMarkSchema = api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || (_api$core = _api$core.sharedState.currentState()) === null || _api$core === void 0 || (_api$core = _api$core.schema) === null || _api$core === void 0 ? void 0 : _api$core.marks[FormatMarkSchema[optionType]];
39
48
  var formatOptionState;
40
49
  if (!isPluginInitialised) {
41
50
  formatOptionState = {
@@ -47,8 +56,7 @@ export var useComponentInfo = function useComponentInfo(_ref) {
47
56
  formatOptionState = {
48
57
  isActive: Boolean(isActive),
49
58
  isDisabled: Boolean(isDisabled),
50
- // TODO: ED-28682 - also need to check if mark is present in the schema
51
- isHidden: Boolean(isHidden)
59
+ isHidden: Boolean(!hasMarkSchema || isHidden)
52
60
  };
53
61
  }
54
62
  var _useIntl = useIntl(),
package/dist/types/ui/Toolbar/components/utils.d.ts CHANGED
@@ -12,7 +12,7 @@ export type FormatComponentProps = {
12
12
  icon: IconComponent;
13
13
  shortcut: Keymap;
14
14
  title: MessageDescriptor;
15
- optionType: string;
15
+ optionType: FormatOptions;
16
16
  toggleMarkWithAnalyticsCallback: ToggleMarkWithAnalyticsEditorCommand | ClearFormattingWithAnalyticsEditorCommand;
17
17
  ariaLabel?: string;
18
18
  groupLocation?: ToolbarButtonGroupLocation;
package/dist/types-ts4.5/ui/Toolbar/components/utils.d.ts CHANGED
@@ -12,7 +12,7 @@ export type FormatComponentProps = {
12
12
  icon: IconComponent;
13
13
  shortcut: Keymap;
14
14
  title: MessageDescriptor;
15
- optionType: string;
15
+ optionType: FormatOptions;
16
16
  toggleMarkWithAnalyticsCallback: ToggleMarkWithAnalyticsEditorCommand | ClearFormattingWithAnalyticsEditorCommand;
17
17
  ariaLabel?: string;
18
18
  groupLocation?: ToolbarButtonGroupLocation;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-text-formatting",
3
- "version": "3.0.9",
3
+ "version": "3.0.10",
4
4
  "description": "Text-formatting plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -36,14 +36,14 @@
36
36
  "@atlaskit/editor-plugin-analytics": "^3.0.0",
37
37
  "@atlaskit/editor-plugin-base": "^4.1.0",
38
38
  "@atlaskit/editor-plugin-primary-toolbar": "^4.1.0",
39
- "@atlaskit/editor-plugin-selection-toolbar": "^4.2.0",
40
- "@atlaskit/editor-plugin-toolbar": "^0.0.6",
39
+ "@atlaskit/editor-plugin-selection-toolbar": "^4.3.0",
40
+ "@atlaskit/editor-plugin-toolbar": "^0.1.0",
41
41
  "@atlaskit/editor-prosemirror": "7.0.0",
42
42
  "@atlaskit/editor-shared-styles": "^3.5.0",
43
43
  "@atlaskit/editor-tables": "^2.9.0",
44
- "@atlaskit/editor-toolbar": "^0.0.10",
44
+ "@atlaskit/editor-toolbar": "^0.1.0",
45
45
  "@atlaskit/editor-toolbar-model": "^0.0.4",
46
- "@atlaskit/icon": "^27.9.0",
46
+ "@atlaskit/icon": "^27.10.0",
47
47
  "@atlaskit/platform-feature-flags": "^1.1.0",
48
48
  "@atlaskit/prosemirror-input-rules": "^3.4.0",
49
49
  "@atlaskit/tmp-editor-statsig": "^9.25.0",
@@ -53,7 +53,7 @@
53
53
  "react-intl-next": "npm:react-intl@^5.18.1"
54
54
  },
55
55
  "peerDependencies": {
56
- "@atlaskit/editor-common": "^107.18.0",
56
+ "@atlaskit/editor-common": "^107.19.0",
57
57
  "react": "^18.2.0"
58
58
  },
59
59
  "devDependencies": {