@atlaskit/editor-plugin-list 5.1.12 → 5.1.13
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.
- package/CHANGELOG.md +10 -0
- package/dist/cjs/listPlugin.js +1 -1
- package/dist/cjs/ui/BulletedListBlockMenuItem.js +42 -0
- package/dist/cjs/ui/NumberedListBlockMenuItem.js +40 -0
- package/dist/cjs/ui/index.js +9 -11
- package/dist/es2019/listPlugin.js +1 -1
- package/dist/es2019/ui/BulletedListBlockMenuItem.js +36 -0
- package/dist/es2019/ui/NumberedListBlockMenuItem.js +34 -0
- package/dist/es2019/ui/index.js +9 -6
- package/dist/esm/listPlugin.js +1 -1
- package/dist/esm/ui/BulletedListBlockMenuItem.js +35 -0
- package/dist/esm/ui/NumberedListBlockMenuItem.js +33 -0
- package/dist/esm/ui/index.js +9 -10
- package/dist/types/ui/BulletedListBlockMenuItem.d.ts +8 -0
- package/dist/types/ui/NumberedListBlockMenuItem.d.ts +8 -0
- package/dist/types/ui/index.d.ts +3 -1
- package/dist/types-ts4.5/ui/BulletedListBlockMenuItem.d.ts +8 -0
- package/dist/types-ts4.5/ui/NumberedListBlockMenuItem.d.ts +8 -0
- package/dist/types-ts4.5/ui/index.d.ts +3 -1
- package/package.json +2 -2
- package/dist/cjs/ui/BulletedListMenuItem.js +0 -21
- package/dist/cjs/ui/NumberedListMenuItem.js +0 -21
- package/dist/es2019/ui/BulletedListMenuItem.js +0 -15
- package/dist/es2019/ui/NumberedListMenuItem.js +0 -15
- package/dist/esm/ui/BulletedListMenuItem.js +0 -14
- package/dist/esm/ui/NumberedListMenuItem.js +0 -14
- package/dist/types/ui/BulletedListMenuItem.d.ts +0 -2
- package/dist/types/ui/NumberedListMenuItem.d.ts +0 -2
- package/dist/types-ts4.5/ui/BulletedListMenuItem.d.ts +0 -2
- package/dist/types-ts4.5/ui/NumberedListMenuItem.d.ts +0 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-list
|
|
2
2
|
|
|
3
|
+
## 5.1.13
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`652bf219a308e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/652bf219a308e) -
|
|
8
|
+
[ux] ED-28581: Added isSelected state for block type and lists"
|
|
9
|
+
- [`652bf219a308e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/652bf219a308e) -
|
|
10
|
+
[ux] ED-28581: isSelected for block type and list
|
|
11
|
+
- Updated dependencies
|
|
12
|
+
|
|
3
13
|
## 5.1.12
|
|
4
14
|
|
|
5
15
|
### Patch Changes
|
package/dist/cjs/listPlugin.js
CHANGED
|
@@ -44,7 +44,7 @@ var listPlugin = exports.listPlugin = function listPlugin(_ref) {
|
|
|
44
44
|
var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
|
|
45
45
|
if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)) {
|
|
46
46
|
var _api$blockMenu;
|
|
47
|
-
api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents((0, _ui.getListComponents)());
|
|
47
|
+
api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents((0, _ui.getListComponents)(api));
|
|
48
48
|
}
|
|
49
49
|
return {
|
|
50
50
|
name: 'list',
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.createBulletedListBlockMenuItem = void 0;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _reactIntlNext = require("react-intl-next");
|
|
10
|
+
var _messages = require("@atlaskit/editor-common/messages");
|
|
11
|
+
var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
|
|
12
|
+
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
13
|
+
var _listBulleted = _interopRequireDefault(require("@atlaskit/icon/core/list-bulleted"));
|
|
14
|
+
// BulletedListBlockMenuItem.tsx
|
|
15
|
+
|
|
16
|
+
var BulletedListBlockMenuItem = function BulletedListBlockMenuItem(_ref) {
|
|
17
|
+
var api = _ref.api;
|
|
18
|
+
var _useIntl = (0, _reactIntlNext.useIntl)(),
|
|
19
|
+
formatMessage = _useIntl.formatMessage;
|
|
20
|
+
var bulletListActive = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.bulletListActive');
|
|
21
|
+
var handleClick = function handleClick() {
|
|
22
|
+
if (!bulletListActive) {
|
|
23
|
+
var _api$blockMenu;
|
|
24
|
+
api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("bulletList"));
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
|
|
28
|
+
onClick: handleClick,
|
|
29
|
+
isSelected: bulletListActive,
|
|
30
|
+
elemBefore: /*#__PURE__*/_react.default.createElement(_listBulleted.default, {
|
|
31
|
+
label: ""
|
|
32
|
+
})
|
|
33
|
+
}, formatMessage(_messages.listMessages.bulletedList));
|
|
34
|
+
};
|
|
35
|
+
var createBulletedListBlockMenuItem = exports.createBulletedListBlockMenuItem = function createBulletedListBlockMenuItem(_ref2) {
|
|
36
|
+
var api = _ref2.api;
|
|
37
|
+
return function () {
|
|
38
|
+
return /*#__PURE__*/_react.default.createElement(BulletedListBlockMenuItem, {
|
|
39
|
+
api: api
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
};
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.createNumberedListBlockMenuItem = void 0;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _reactIntlNext = require("react-intl-next");
|
|
10
|
+
var _messages = require("@atlaskit/editor-common/messages");
|
|
11
|
+
var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
|
|
12
|
+
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
13
|
+
var _listNumbered = _interopRequireDefault(require("@atlaskit/icon/core/list-numbered"));
|
|
14
|
+
var NumberedListBlockMenuItem = function NumberedListBlockMenuItem(_ref) {
|
|
15
|
+
var api = _ref.api;
|
|
16
|
+
var _useIntl = (0, _reactIntlNext.useIntl)(),
|
|
17
|
+
formatMessage = _useIntl.formatMessage;
|
|
18
|
+
var orderedListActive = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.orderedListActive');
|
|
19
|
+
var handleClick = function handleClick() {
|
|
20
|
+
if (!orderedListActive) {
|
|
21
|
+
var _api$blockMenu;
|
|
22
|
+
api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("orderedList"));
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
|
|
26
|
+
onClick: handleClick,
|
|
27
|
+
isSelected: orderedListActive,
|
|
28
|
+
elemBefore: /*#__PURE__*/_react.default.createElement(_listNumbered.default, {
|
|
29
|
+
label: ""
|
|
30
|
+
})
|
|
31
|
+
}, formatMessage(_messages.listMessages.orderedList));
|
|
32
|
+
};
|
|
33
|
+
var createNumberedListBlockMenuItem = exports.createNumberedListBlockMenuItem = function createNumberedListBlockMenuItem(_ref2) {
|
|
34
|
+
var api = _ref2.api;
|
|
35
|
+
return function () {
|
|
36
|
+
return /*#__PURE__*/_react.default.createElement(NumberedListBlockMenuItem, {
|
|
37
|
+
api: api
|
|
38
|
+
});
|
|
39
|
+
};
|
|
40
|
+
};
|
package/dist/cjs/ui/index.js
CHANGED
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
6
|
exports.getListComponents = void 0;
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
7
|
var _blockMenu = require("@atlaskit/editor-common/block-menu");
|
|
10
|
-
var
|
|
11
|
-
var
|
|
12
|
-
var getListComponents = exports.getListComponents = function getListComponents() {
|
|
8
|
+
var _BulletedListBlockMenuItem = require("./BulletedListBlockMenuItem");
|
|
9
|
+
var _NumberedListBlockMenuItem = require("./NumberedListBlockMenuItem");
|
|
10
|
+
var getListComponents = exports.getListComponents = function getListComponents(api) {
|
|
13
11
|
return [{
|
|
14
12
|
type: 'block-menu-item',
|
|
15
13
|
key: _blockMenu.FORMAT_BULLETED_LIST_MENU_ITEM.key,
|
|
@@ -18,9 +16,9 @@ var getListComponents = exports.getListComponents = function getListComponents()
|
|
|
18
16
|
key: 'nested-menu-format-section-primary',
|
|
19
17
|
rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_BULLETED_LIST_MENU_ITEM.key]
|
|
20
18
|
},
|
|
21
|
-
component:
|
|
22
|
-
|
|
23
|
-
}
|
|
19
|
+
component: (0, _BulletedListBlockMenuItem.createBulletedListBlockMenuItem)({
|
|
20
|
+
api: api
|
|
21
|
+
})
|
|
24
22
|
}, {
|
|
25
23
|
type: 'block-menu-item',
|
|
26
24
|
key: _blockMenu.FORMAT_NUMBERED_LIST_MENU_ITEM.key,
|
|
@@ -29,8 +27,8 @@ var getListComponents = exports.getListComponents = function getListComponents()
|
|
|
29
27
|
key: 'nested-menu-format-section-primary',
|
|
30
28
|
rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_NUMBERED_LIST_MENU_ITEM.key]
|
|
31
29
|
},
|
|
32
|
-
component:
|
|
33
|
-
|
|
34
|
-
}
|
|
30
|
+
component: (0, _NumberedListBlockMenuItem.createNumberedListBlockMenuItem)({
|
|
31
|
+
api: api
|
|
32
|
+
})
|
|
35
33
|
}];
|
|
36
34
|
};
|
|
@@ -37,7 +37,7 @@ export const listPlugin = ({
|
|
|
37
37
|
const editorAnalyticsAPI = api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
|
|
38
38
|
if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
|
|
39
39
|
var _api$blockMenu;
|
|
40
|
-
api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.registerBlockMenuComponents(getListComponents());
|
|
40
|
+
api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.registerBlockMenuComponents(getListComponents(api));
|
|
41
41
|
}
|
|
42
42
|
return {
|
|
43
43
|
name: 'list',
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
// BulletedListBlockMenuItem.tsx
|
|
2
|
+
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { useIntl } from 'react-intl-next';
|
|
5
|
+
import { listMessages } from '@atlaskit/editor-common/messages';
|
|
6
|
+
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
7
|
+
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
8
|
+
import ListBulletedIcon from '@atlaskit/icon/core/list-bulleted';
|
|
9
|
+
const BulletedListBlockMenuItem = ({
|
|
10
|
+
api
|
|
11
|
+
}) => {
|
|
12
|
+
const {
|
|
13
|
+
formatMessage
|
|
14
|
+
} = useIntl();
|
|
15
|
+
const bulletListActive = useSharedPluginStateSelector(api, 'list.bulletListActive');
|
|
16
|
+
const handleClick = () => {
|
|
17
|
+
if (!bulletListActive) {
|
|
18
|
+
var _api$blockMenu;
|
|
19
|
+
api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode(`bulletList`));
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
23
|
+
onClick: handleClick,
|
|
24
|
+
isSelected: bulletListActive,
|
|
25
|
+
elemBefore: /*#__PURE__*/React.createElement(ListBulletedIcon, {
|
|
26
|
+
label: ""
|
|
27
|
+
})
|
|
28
|
+
}, formatMessage(listMessages.bulletedList));
|
|
29
|
+
};
|
|
30
|
+
export const createBulletedListBlockMenuItem = ({
|
|
31
|
+
api
|
|
32
|
+
}) => {
|
|
33
|
+
return () => /*#__PURE__*/React.createElement(BulletedListBlockMenuItem, {
|
|
34
|
+
api: api
|
|
35
|
+
});
|
|
36
|
+
};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { useIntl } from 'react-intl-next';
|
|
3
|
+
import { listMessages } from '@atlaskit/editor-common/messages';
|
|
4
|
+
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
5
|
+
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
6
|
+
import ListNumberedIcon from '@atlaskit/icon/core/list-numbered';
|
|
7
|
+
const NumberedListBlockMenuItem = ({
|
|
8
|
+
api
|
|
9
|
+
}) => {
|
|
10
|
+
const {
|
|
11
|
+
formatMessage
|
|
12
|
+
} = useIntl();
|
|
13
|
+
const orderedListActive = useSharedPluginStateSelector(api, 'list.orderedListActive');
|
|
14
|
+
const handleClick = () => {
|
|
15
|
+
if (!orderedListActive) {
|
|
16
|
+
var _api$blockMenu;
|
|
17
|
+
api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode(`orderedList`));
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
21
|
+
onClick: handleClick,
|
|
22
|
+
isSelected: orderedListActive,
|
|
23
|
+
elemBefore: /*#__PURE__*/React.createElement(ListNumberedIcon, {
|
|
24
|
+
label: ""
|
|
25
|
+
})
|
|
26
|
+
}, formatMessage(listMessages.orderedList));
|
|
27
|
+
};
|
|
28
|
+
export const createNumberedListBlockMenuItem = ({
|
|
29
|
+
api
|
|
30
|
+
}) => {
|
|
31
|
+
return () => /*#__PURE__*/React.createElement(NumberedListBlockMenuItem, {
|
|
32
|
+
api: api
|
|
33
|
+
});
|
|
34
|
+
};
|
package/dist/es2019/ui/index.js
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { FORMAT_BULLETED_LIST_MENU_ITEM, FORMAT_NESTED_MENU_RANK, FORMAT_NUMBERED_LIST_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
export const getListComponents =
|
|
2
|
+
import { createBulletedListBlockMenuItem } from './BulletedListBlockMenuItem';
|
|
3
|
+
import { createNumberedListBlockMenuItem } from './NumberedListBlockMenuItem';
|
|
4
|
+
export const getListComponents = api => {
|
|
6
5
|
return [{
|
|
7
6
|
type: 'block-menu-item',
|
|
8
7
|
key: FORMAT_BULLETED_LIST_MENU_ITEM.key,
|
|
@@ -11,7 +10,9 @@ export const getListComponents = () => {
|
|
|
11
10
|
key: 'nested-menu-format-section-primary',
|
|
12
11
|
rank: FORMAT_NESTED_MENU_RANK[FORMAT_BULLETED_LIST_MENU_ITEM.key]
|
|
13
12
|
},
|
|
14
|
-
component: (
|
|
13
|
+
component: createBulletedListBlockMenuItem({
|
|
14
|
+
api
|
|
15
|
+
})
|
|
15
16
|
}, {
|
|
16
17
|
type: 'block-menu-item',
|
|
17
18
|
key: FORMAT_NUMBERED_LIST_MENU_ITEM.key,
|
|
@@ -20,6 +21,8 @@ export const getListComponents = () => {
|
|
|
20
21
|
key: 'nested-menu-format-section-primary',
|
|
21
22
|
rank: FORMAT_NESTED_MENU_RANK[FORMAT_NUMBERED_LIST_MENU_ITEM.key]
|
|
22
23
|
},
|
|
23
|
-
component: (
|
|
24
|
+
component: createNumberedListBlockMenuItem({
|
|
25
|
+
api
|
|
26
|
+
})
|
|
24
27
|
}];
|
|
25
28
|
};
|
package/dist/esm/listPlugin.js
CHANGED
|
@@ -39,7 +39,7 @@ export var listPlugin = function listPlugin(_ref) {
|
|
|
39
39
|
var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
|
|
40
40
|
if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
|
|
41
41
|
var _api$blockMenu;
|
|
42
|
-
api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents(getListComponents());
|
|
42
|
+
api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents(getListComponents(api));
|
|
43
43
|
}
|
|
44
44
|
return {
|
|
45
45
|
name: 'list',
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
// BulletedListBlockMenuItem.tsx
|
|
2
|
+
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { useIntl } from 'react-intl-next';
|
|
5
|
+
import { listMessages } from '@atlaskit/editor-common/messages';
|
|
6
|
+
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
7
|
+
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
8
|
+
import ListBulletedIcon from '@atlaskit/icon/core/list-bulleted';
|
|
9
|
+
var BulletedListBlockMenuItem = function BulletedListBlockMenuItem(_ref) {
|
|
10
|
+
var api = _ref.api;
|
|
11
|
+
var _useIntl = useIntl(),
|
|
12
|
+
formatMessage = _useIntl.formatMessage;
|
|
13
|
+
var bulletListActive = useSharedPluginStateSelector(api, 'list.bulletListActive');
|
|
14
|
+
var handleClick = function handleClick() {
|
|
15
|
+
if (!bulletListActive) {
|
|
16
|
+
var _api$blockMenu;
|
|
17
|
+
api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("bulletList"));
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
21
|
+
onClick: handleClick,
|
|
22
|
+
isSelected: bulletListActive,
|
|
23
|
+
elemBefore: /*#__PURE__*/React.createElement(ListBulletedIcon, {
|
|
24
|
+
label: ""
|
|
25
|
+
})
|
|
26
|
+
}, formatMessage(listMessages.bulletedList));
|
|
27
|
+
};
|
|
28
|
+
export var createBulletedListBlockMenuItem = function createBulletedListBlockMenuItem(_ref2) {
|
|
29
|
+
var api = _ref2.api;
|
|
30
|
+
return function () {
|
|
31
|
+
return /*#__PURE__*/React.createElement(BulletedListBlockMenuItem, {
|
|
32
|
+
api: api
|
|
33
|
+
});
|
|
34
|
+
};
|
|
35
|
+
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { useIntl } from 'react-intl-next';
|
|
3
|
+
import { listMessages } from '@atlaskit/editor-common/messages';
|
|
4
|
+
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
5
|
+
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
6
|
+
import ListNumberedIcon from '@atlaskit/icon/core/list-numbered';
|
|
7
|
+
var NumberedListBlockMenuItem = function NumberedListBlockMenuItem(_ref) {
|
|
8
|
+
var api = _ref.api;
|
|
9
|
+
var _useIntl = useIntl(),
|
|
10
|
+
formatMessage = _useIntl.formatMessage;
|
|
11
|
+
var orderedListActive = useSharedPluginStateSelector(api, 'list.orderedListActive');
|
|
12
|
+
var handleClick = function handleClick() {
|
|
13
|
+
if (!orderedListActive) {
|
|
14
|
+
var _api$blockMenu;
|
|
15
|
+
api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("orderedList"));
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
19
|
+
onClick: handleClick,
|
|
20
|
+
isSelected: orderedListActive,
|
|
21
|
+
elemBefore: /*#__PURE__*/React.createElement(ListNumberedIcon, {
|
|
22
|
+
label: ""
|
|
23
|
+
})
|
|
24
|
+
}, formatMessage(listMessages.orderedList));
|
|
25
|
+
};
|
|
26
|
+
export var createNumberedListBlockMenuItem = function createNumberedListBlockMenuItem(_ref2) {
|
|
27
|
+
var api = _ref2.api;
|
|
28
|
+
return function () {
|
|
29
|
+
return /*#__PURE__*/React.createElement(NumberedListBlockMenuItem, {
|
|
30
|
+
api: api
|
|
31
|
+
});
|
|
32
|
+
};
|
|
33
|
+
};
|
package/dist/esm/ui/index.js
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { FORMAT_BULLETED_LIST_MENU_ITEM, FORMAT_NESTED_MENU_RANK, FORMAT_NUMBERED_LIST_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
export var getListComponents = function getListComponents() {
|
|
2
|
+
import { createBulletedListBlockMenuItem } from './BulletedListBlockMenuItem';
|
|
3
|
+
import { createNumberedListBlockMenuItem } from './NumberedListBlockMenuItem';
|
|
4
|
+
export var getListComponents = function getListComponents(api) {
|
|
6
5
|
return [{
|
|
7
6
|
type: 'block-menu-item',
|
|
8
7
|
key: FORMAT_BULLETED_LIST_MENU_ITEM.key,
|
|
@@ -11,9 +10,9 @@ export var getListComponents = function getListComponents() {
|
|
|
11
10
|
key: 'nested-menu-format-section-primary',
|
|
12
11
|
rank: FORMAT_NESTED_MENU_RANK[FORMAT_BULLETED_LIST_MENU_ITEM.key]
|
|
13
12
|
},
|
|
14
|
-
component:
|
|
15
|
-
|
|
16
|
-
}
|
|
13
|
+
component: createBulletedListBlockMenuItem({
|
|
14
|
+
api: api
|
|
15
|
+
})
|
|
17
16
|
}, {
|
|
18
17
|
type: 'block-menu-item',
|
|
19
18
|
key: FORMAT_NUMBERED_LIST_MENU_ITEM.key,
|
|
@@ -22,8 +21,8 @@ export var getListComponents = function getListComponents() {
|
|
|
22
21
|
key: 'nested-menu-format-section-primary',
|
|
23
22
|
rank: FORMAT_NESTED_MENU_RANK[FORMAT_NUMBERED_LIST_MENU_ITEM.key]
|
|
24
23
|
},
|
|
25
|
-
component:
|
|
26
|
-
|
|
27
|
-
}
|
|
24
|
+
component: createNumberedListBlockMenuItem({
|
|
25
|
+
api: api
|
|
26
|
+
})
|
|
28
27
|
}];
|
|
29
28
|
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
3
|
+
import type { ListPlugin } from '../listPluginType';
|
|
4
|
+
type BulletedListBlockMenuItemProps = {
|
|
5
|
+
api: ExtractInjectionAPI<ListPlugin> | undefined;
|
|
6
|
+
};
|
|
7
|
+
export declare const createBulletedListBlockMenuItem: ({ api }: BulletedListBlockMenuItemProps) => () => React.JSX.Element;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
3
|
+
import type { ListPlugin } from '../listPluginType';
|
|
4
|
+
type NumberedListBlockMenuItemProps = {
|
|
5
|
+
api: ExtractInjectionAPI<ListPlugin> | undefined;
|
|
6
|
+
};
|
|
7
|
+
export declare const createNumberedListBlockMenuItem: ({ api }: NumberedListBlockMenuItemProps) => () => React.JSX.Element;
|
|
8
|
+
export {};
|
package/dist/types/ui/index.d.ts
CHANGED
|
@@ -1,2 +1,4 @@
|
|
|
1
|
+
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
1
2
|
import type { RegisterBlockMenuComponent } from '@atlaskit/editor-plugin-block-menu';
|
|
2
|
-
|
|
3
|
+
import type { ListPlugin } from '../listPluginType';
|
|
4
|
+
export declare const getListComponents: (api: ExtractInjectionAPI<ListPlugin> | undefined) => RegisterBlockMenuComponent[];
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
3
|
+
import type { ListPlugin } from '../listPluginType';
|
|
4
|
+
type BulletedListBlockMenuItemProps = {
|
|
5
|
+
api: ExtractInjectionAPI<ListPlugin> | undefined;
|
|
6
|
+
};
|
|
7
|
+
export declare const createBulletedListBlockMenuItem: ({ api }: BulletedListBlockMenuItemProps) => () => React.JSX.Element;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
3
|
+
import type { ListPlugin } from '../listPluginType';
|
|
4
|
+
type NumberedListBlockMenuItemProps = {
|
|
5
|
+
api: ExtractInjectionAPI<ListPlugin> | undefined;
|
|
6
|
+
};
|
|
7
|
+
export declare const createNumberedListBlockMenuItem: ({ api }: NumberedListBlockMenuItemProps) => () => React.JSX.Element;
|
|
8
|
+
export {};
|
|
@@ -1,2 +1,4 @@
|
|
|
1
|
+
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
1
2
|
import type { RegisterBlockMenuComponent } from '@atlaskit/editor-plugin-block-menu';
|
|
2
|
-
|
|
3
|
+
import type { ListPlugin } from '../listPluginType';
|
|
4
|
+
export declare const getListComponents: (api: ExtractInjectionAPI<ListPlugin> | undefined) => RegisterBlockMenuComponent[];
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-list",
|
|
3
|
-
"version": "5.1.
|
|
3
|
+
"version": "5.1.13",
|
|
4
4
|
"description": "List plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"dependencies": {
|
|
30
30
|
"@atlaskit/adf-schema": "^50.2.3",
|
|
31
31
|
"@atlaskit/editor-plugin-analytics": "^3.0.0",
|
|
32
|
-
"@atlaskit/editor-plugin-block-menu": "^0.0.
|
|
32
|
+
"@atlaskit/editor-plugin-block-menu": "^0.0.20",
|
|
33
33
|
"@atlaskit/editor-plugin-feature-flags": "^2.0.0",
|
|
34
34
|
"@atlaskit/editor-prosemirror": "7.0.0",
|
|
35
35
|
"@atlaskit/editor-toolbar": "^0.6.0",
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.BulletedListMenuItem = void 0;
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _reactIntlNext = require("react-intl-next");
|
|
10
|
-
var _messages = require("@atlaskit/editor-common/messages");
|
|
11
|
-
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
12
|
-
var _listBulleted = _interopRequireDefault(require("@atlaskit/icon/core/list-bulleted"));
|
|
13
|
-
var BulletedListMenuItem = exports.BulletedListMenuItem = function BulletedListMenuItem() {
|
|
14
|
-
var _useIntl = (0, _reactIntlNext.useIntl)(),
|
|
15
|
-
formatMessage = _useIntl.formatMessage;
|
|
16
|
-
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
|
|
17
|
-
elemBefore: /*#__PURE__*/_react.default.createElement(_listBulleted.default, {
|
|
18
|
-
label: formatMessage(_messages.listMessages.bulletedList)
|
|
19
|
-
})
|
|
20
|
-
}, formatMessage(_messages.listMessages.bulletedList));
|
|
21
|
-
};
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.NumberedListMenuItem = void 0;
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _reactIntlNext = require("react-intl-next");
|
|
10
|
-
var _messages = require("@atlaskit/editor-common/messages");
|
|
11
|
-
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
12
|
-
var _listNumbered = _interopRequireDefault(require("@atlaskit/icon/core/list-numbered"));
|
|
13
|
-
var NumberedListMenuItem = exports.NumberedListMenuItem = function NumberedListMenuItem() {
|
|
14
|
-
var _useIntl = (0, _reactIntlNext.useIntl)(),
|
|
15
|
-
formatMessage = _useIntl.formatMessage;
|
|
16
|
-
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
|
|
17
|
-
elemBefore: /*#__PURE__*/_react.default.createElement(_listNumbered.default, {
|
|
18
|
-
label: formatMessage(_messages.listMessages.orderedList)
|
|
19
|
-
})
|
|
20
|
-
}, formatMessage(_messages.listMessages.orderedList));
|
|
21
|
-
};
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { useIntl } from 'react-intl-next';
|
|
3
|
-
import { listMessages } from '@atlaskit/editor-common/messages';
|
|
4
|
-
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
5
|
-
import ListBulletedIcon from '@atlaskit/icon/core/list-bulleted';
|
|
6
|
-
export const BulletedListMenuItem = () => {
|
|
7
|
-
const {
|
|
8
|
-
formatMessage
|
|
9
|
-
} = useIntl();
|
|
10
|
-
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
11
|
-
elemBefore: /*#__PURE__*/React.createElement(ListBulletedIcon, {
|
|
12
|
-
label: formatMessage(listMessages.bulletedList)
|
|
13
|
-
})
|
|
14
|
-
}, formatMessage(listMessages.bulletedList));
|
|
15
|
-
};
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { useIntl } from 'react-intl-next';
|
|
3
|
-
import { listMessages } from '@atlaskit/editor-common/messages';
|
|
4
|
-
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
5
|
-
import ListNumberedIcon from '@atlaskit/icon/core/list-numbered';
|
|
6
|
-
export const NumberedListMenuItem = () => {
|
|
7
|
-
const {
|
|
8
|
-
formatMessage
|
|
9
|
-
} = useIntl();
|
|
10
|
-
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
11
|
-
elemBefore: /*#__PURE__*/React.createElement(ListNumberedIcon, {
|
|
12
|
-
label: formatMessage(listMessages.orderedList)
|
|
13
|
-
})
|
|
14
|
-
}, formatMessage(listMessages.orderedList));
|
|
15
|
-
};
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { useIntl } from 'react-intl-next';
|
|
3
|
-
import { listMessages } from '@atlaskit/editor-common/messages';
|
|
4
|
-
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
5
|
-
import ListBulletedIcon from '@atlaskit/icon/core/list-bulleted';
|
|
6
|
-
export var BulletedListMenuItem = function BulletedListMenuItem() {
|
|
7
|
-
var _useIntl = useIntl(),
|
|
8
|
-
formatMessage = _useIntl.formatMessage;
|
|
9
|
-
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
10
|
-
elemBefore: /*#__PURE__*/React.createElement(ListBulletedIcon, {
|
|
11
|
-
label: formatMessage(listMessages.bulletedList)
|
|
12
|
-
})
|
|
13
|
-
}, formatMessage(listMessages.bulletedList));
|
|
14
|
-
};
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { useIntl } from 'react-intl-next';
|
|
3
|
-
import { listMessages } from '@atlaskit/editor-common/messages';
|
|
4
|
-
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
5
|
-
import ListNumberedIcon from '@atlaskit/icon/core/list-numbered';
|
|
6
|
-
export var NumberedListMenuItem = function NumberedListMenuItem() {
|
|
7
|
-
var _useIntl = useIntl(),
|
|
8
|
-
formatMessage = _useIntl.formatMessage;
|
|
9
|
-
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
10
|
-
elemBefore: /*#__PURE__*/React.createElement(ListNumberedIcon, {
|
|
11
|
-
label: formatMessage(listMessages.orderedList)
|
|
12
|
-
})
|
|
13
|
-
}, formatMessage(listMessages.orderedList));
|
|
14
|
-
};
|