@atlaskit/editor-common 119.17.0 → 120.0.0
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 +27 -0
- package/dist/cjs/media-insert/rank.js +11 -0
- package/dist/cjs/monitoring/error.js +1 -1
- package/dist/cjs/quick-insert/ElementBrowserQuickInsertMenuItem.js +128 -0
- package/dist/cjs/quick-insert/QuickInsertMenuItem.js +24 -45
- package/dist/cjs/quick-insert/TypeAheadQuickInsertMenuItem.js +56 -0
- package/dist/cjs/quick-insert/quickInsertMenuItemUtils.js +22 -0
- package/dist/cjs/ui/DropList/index.js +1 -1
- package/dist/es2019/media-insert/rank.js +7 -0
- package/dist/es2019/monitoring/error.js +1 -1
- package/dist/es2019/quick-insert/ElementBrowserQuickInsertMenuItem.js +123 -0
- package/dist/es2019/quick-insert/QuickInsertMenuItem.js +24 -38
- package/dist/es2019/quick-insert/TypeAheadQuickInsertMenuItem.js +51 -0
- package/dist/es2019/quick-insert/quickInsertMenuItemUtils.js +13 -0
- package/dist/es2019/ui/DropList/index.js +1 -1
- package/dist/esm/media-insert/rank.js +4 -0
- package/dist/esm/monitoring/error.js +1 -1
- package/dist/esm/quick-insert/ElementBrowserQuickInsertMenuItem.js +121 -0
- package/dist/esm/quick-insert/QuickInsertMenuItem.js +24 -43
- package/dist/esm/quick-insert/TypeAheadQuickInsertMenuItem.js +49 -0
- package/dist/esm/quick-insert/quickInsertMenuItemUtils.js +16 -0
- package/dist/esm/ui/DropList/index.js +1 -1
- package/dist/types/media-insert/rank.d.ts +3 -0
- package/dist/types/quick-insert/ElementBrowserQuickInsertMenuItem.d.ts +3 -0
- package/dist/types/quick-insert/QuickInsertContext.d.ts +1 -0
- package/dist/types/quick-insert/QuickInsertMenuItem.d.ts +8 -8
- package/dist/types/quick-insert/TypeAheadQuickInsertMenuItem.d.ts +3 -0
- package/dist/types/quick-insert/quickInsertMenuItemUtils.d.ts +2 -0
- package/media-insert/rank/package.json +10 -0
- package/package.json +1 -1
- /package/dist/cjs/quick-insert/{QuickInsertMenuItem.compiled.css → TypeAheadQuickInsertMenuItem.compiled.css} +0 -0
- /package/dist/es2019/quick-insert/{QuickInsertMenuItem.compiled.css → TypeAheadQuickInsertMenuItem.compiled.css} +0 -0
- /package/dist/esm/quick-insert/{QuickInsertMenuItem.compiled.css → TypeAheadQuickInsertMenuItem.compiled.css} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,32 @@
|
|
|
1
1
|
# @atlaskit/editor-common
|
|
2
2
|
|
|
3
|
+
## 120.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [`82fd62dcd2841`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/82fd62dcd2841) -
|
|
8
|
+
Add the experiment-gated registry-native Element Browser treatment for
|
|
9
|
+
`platform_editor_slash_command`.
|
|
10
|
+
|
|
11
|
+
`QuickInsertProvider` values must now provide a `surface` of either `typeahead` or
|
|
12
|
+
`element-browser`.
|
|
13
|
+
|
|
14
|
+
Prepare surface-specific Quick Insert item renderers for the `platform_editor_slash_command`
|
|
15
|
+
experiment.
|
|
16
|
+
|
|
17
|
+
Fix the registry Element Browser opening from View more and localize its accessibility labels.
|
|
18
|
+
|
|
19
|
+
### Minor Changes
|
|
20
|
+
|
|
21
|
+
- [`ab79746656fb4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ab79746656fb4) -
|
|
22
|
+
[ux] Add shared media insert tab ranks, allow registered tabs to define a numeric rank, and move
|
|
23
|
+
the AI image generation Create tab to the third position when the
|
|
24
|
+
`platform_editor_ai_image_generation_improvement_ex` experiment is enabled.
|
|
25
|
+
|
|
26
|
+
### Patch Changes
|
|
27
|
+
|
|
28
|
+
- Updated dependencies
|
|
29
|
+
|
|
3
30
|
## 119.17.0
|
|
4
31
|
|
|
5
32
|
### Minor Changes
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.MEDIA_INSERT_TAB_RANK = exports.DEFAULT_MEDIA_INSERT_TAB_RANK = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
+
var _enums = require("../analytics/types/enums");
|
|
10
|
+
var DEFAULT_MEDIA_INSERT_TAB_RANK = exports.DEFAULT_MEDIA_INSERT_TAB_RANK = 0;
|
|
11
|
+
var MEDIA_INSERT_TAB_RANK = exports.MEDIA_INSERT_TAB_RANK = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _enums.MEDIA_INSERT_TAB.UPLOAD, 100), _enums.MEDIA_INSERT_TAB.LINK, 200), _enums.MEDIA_INSERT_TAB.CREATE, 300);
|
|
@@ -28,7 +28,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
|
|
|
28
28
|
var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
|
|
29
29
|
var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
|
|
30
30
|
var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
|
|
31
|
-
var packageVersion = "119.
|
|
31
|
+
var packageVersion = "119.17.0";
|
|
32
32
|
var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
|
|
33
33
|
// Remove URL as it has UGC
|
|
34
34
|
// Ignored via go/ees007
|
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.ElementBrowserQuickInsertMenuItem = void 0;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _primitives = require("@atlaskit/primitives");
|
|
10
|
+
var _quickInsertMenuItemUtils = require("./quickInsertMenuItemUtils");
|
|
11
|
+
var _useQuickInsertContext = require("./useQuickInsertContext");
|
|
12
|
+
// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- Compiled primitives do not provide Pressable.
|
|
13
|
+
|
|
14
|
+
var itemStyles = (0, _primitives.xcss)({
|
|
15
|
+
alignItems: 'start',
|
|
16
|
+
backgroundColor: 'color.background.neutral.subtle',
|
|
17
|
+
borderColor: 'color.border',
|
|
18
|
+
borderRadius: 'radius.medium',
|
|
19
|
+
borderStyle: 'solid',
|
|
20
|
+
borderWidth: 'border.width',
|
|
21
|
+
color: 'color.text',
|
|
22
|
+
cursor: 'pointer',
|
|
23
|
+
display: 'flex',
|
|
24
|
+
gap: 'space.150',
|
|
25
|
+
padding: 'space.150',
|
|
26
|
+
textAlign: 'start',
|
|
27
|
+
width: '100%'
|
|
28
|
+
});
|
|
29
|
+
var selectedItemStyles = (0, _primitives.xcss)({
|
|
30
|
+
alignItems: 'start',
|
|
31
|
+
backgroundColor: 'color.background.selected',
|
|
32
|
+
borderColor: 'color.border.selected',
|
|
33
|
+
borderRadius: 'radius.medium',
|
|
34
|
+
borderStyle: 'solid',
|
|
35
|
+
borderWidth: 'border.width',
|
|
36
|
+
color: 'color.text',
|
|
37
|
+
cursor: 'pointer',
|
|
38
|
+
display: 'flex',
|
|
39
|
+
gap: 'space.150',
|
|
40
|
+
padding: 'space.150',
|
|
41
|
+
textAlign: 'start',
|
|
42
|
+
width: '100%'
|
|
43
|
+
});
|
|
44
|
+
var disabledItemStyles = (0, _primitives.xcss)({
|
|
45
|
+
alignItems: 'start',
|
|
46
|
+
backgroundColor: 'color.background.neutral.subtle',
|
|
47
|
+
borderColor: 'color.border',
|
|
48
|
+
borderRadius: 'radius.medium',
|
|
49
|
+
borderStyle: 'solid',
|
|
50
|
+
borderWidth: 'border.width',
|
|
51
|
+
color: 'color.text.disabled',
|
|
52
|
+
cursor: 'not-allowed',
|
|
53
|
+
display: 'flex',
|
|
54
|
+
gap: 'space.150',
|
|
55
|
+
padding: 'space.150',
|
|
56
|
+
textAlign: 'start',
|
|
57
|
+
width: '100%'
|
|
58
|
+
});
|
|
59
|
+
var iconStyles = (0, _primitives.xcss)({
|
|
60
|
+
alignItems: 'center',
|
|
61
|
+
backgroundColor: 'elevation.surface.overlay',
|
|
62
|
+
borderColor: 'color.border',
|
|
63
|
+
borderRadius: 'radius.medium',
|
|
64
|
+
borderStyle: 'solid',
|
|
65
|
+
borderWidth: 'border.width',
|
|
66
|
+
display: 'flex',
|
|
67
|
+
flexShrink: 0,
|
|
68
|
+
height: '40px',
|
|
69
|
+
justifyContent: 'center',
|
|
70
|
+
overflow: 'hidden',
|
|
71
|
+
width: '40px'
|
|
72
|
+
});
|
|
73
|
+
var descriptionStyles = (0, _primitives.xcss)({
|
|
74
|
+
color: 'color.text.subtle'
|
|
75
|
+
});
|
|
76
|
+
var shortcutStyles = (0, _primitives.xcss)({
|
|
77
|
+
backgroundColor: 'color.background.neutral',
|
|
78
|
+
borderRadius: 'radius.small',
|
|
79
|
+
color: 'color.text.subtle',
|
|
80
|
+
font: 'font.body.small',
|
|
81
|
+
paddingBlock: 'space.025',
|
|
82
|
+
paddingInline: 'space.050'
|
|
83
|
+
});
|
|
84
|
+
var ElementBrowserQuickInsertMenuItem = exports.ElementBrowserQuickInsertMenuItem = function ElementBrowserQuickInsertMenuItem(_ref) {
|
|
85
|
+
var ariaLabel = _ref.ariaLabel,
|
|
86
|
+
description = _ref.description,
|
|
87
|
+
iconBefore = _ref.iconBefore,
|
|
88
|
+
isDisabled = _ref.isDisabled,
|
|
89
|
+
onSelect = _ref.onSelect,
|
|
90
|
+
shortcut = _ref.shortcut,
|
|
91
|
+
_ref$shouldWrapIcon = _ref.shouldWrapIcon,
|
|
92
|
+
shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
|
|
93
|
+
title = _ref.title;
|
|
94
|
+
var _useQuickInsertContex = (0, _useQuickInsertContext.useQuickInsertContext)(),
|
|
95
|
+
item = _useQuickInsertContex.item;
|
|
96
|
+
var _ref2 = item !== null && item !== void 0 ? item : {
|
|
97
|
+
id: undefined,
|
|
98
|
+
isSelected: false
|
|
99
|
+
},
|
|
100
|
+
id = _ref2.id,
|
|
101
|
+
isSelected = _ref2.isSelected;
|
|
102
|
+
var handleClick = (0, _quickInsertMenuItemUtils.useQuickInsertMenuItemSelection)(onSelect);
|
|
103
|
+
return /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
|
|
104
|
+
"aria-label": ariaLabel,
|
|
105
|
+
"aria-selected": isSelected,
|
|
106
|
+
id: id,
|
|
107
|
+
isDisabled: isDisabled,
|
|
108
|
+
onClick: handleClick,
|
|
109
|
+
role: "option",
|
|
110
|
+
xcss: isDisabled ? disabledItemStyles : isSelected ? selectedItemStyles : itemStyles
|
|
111
|
+
}, iconBefore && shouldWrapIcon ? /*#__PURE__*/_react.default.createElement(_primitives.Box, {
|
|
112
|
+
xcss: iconStyles
|
|
113
|
+
}, iconBefore) : iconBefore, /*#__PURE__*/_react.default.createElement(_primitives.Stack, {
|
|
114
|
+
space: "space.050",
|
|
115
|
+
grow: "fill"
|
|
116
|
+
}, /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
|
|
117
|
+
alignBlock: "center",
|
|
118
|
+
spread: "space-between",
|
|
119
|
+
space: "space.100"
|
|
120
|
+
}, /*#__PURE__*/_react.default.createElement(_primitives.Text, {
|
|
121
|
+
weight: "medium"
|
|
122
|
+
}, title), shortcut && /*#__PURE__*/_react.default.createElement(_primitives.Box, {
|
|
123
|
+
as: "span",
|
|
124
|
+
xcss: shortcutStyles
|
|
125
|
+
}, shortcut)), description && /*#__PURE__*/_react.default.createElement(_primitives.Box, {
|
|
126
|
+
xcss: descriptionStyles
|
|
127
|
+
}, /*#__PURE__*/_react.default.createElement(_primitives.Text, null, description))));
|
|
128
|
+
};
|
|
@@ -1,63 +1,42 @@
|
|
|
1
|
-
/* QuickInsertMenuItem.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
1
|
"use strict";
|
|
3
2
|
|
|
4
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
4
|
Object.defineProperty(exports, "__esModule", {
|
|
7
5
|
value: true
|
|
8
6
|
});
|
|
9
7
|
exports.QuickInsertMenuItem = void 0;
|
|
10
|
-
require("
|
|
11
|
-
var
|
|
12
|
-
var
|
|
13
|
-
var _buttonItem = _interopRequireDefault(require("@atlaskit/menu/button-item"));
|
|
14
|
-
var _compiled = require("@atlaskit/primitives/compiled");
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _ElementBrowserQuickInsertMenuItem = require("./ElementBrowserQuickInsertMenuItem");
|
|
10
|
+
var _TypeAheadQuickInsertMenuItem = require("./TypeAheadQuickInsertMenuItem");
|
|
15
11
|
var _useQuickInsertContext = require("./useQuickInsertContext");
|
|
16
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
17
|
-
var styles = {
|
|
18
|
-
icon: "_2rko1qi0 _1reo15vq _18m915vq _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk1bhr _1e0c1txw _4t3izwfg _1bah1h6o _1bsbzwfg",
|
|
19
|
-
shortcut: "_2rko12b0 _11c8wadc _1rjcv77o _18zr1b66 _bfhki8nm _syazazsu"
|
|
20
|
-
};
|
|
21
12
|
var QuickInsertMenuItem = exports.QuickInsertMenuItem = function QuickInsertMenuItem(_ref) {
|
|
22
|
-
var _item$isSelected;
|
|
23
13
|
var ariaLabel = _ref.ariaLabel,
|
|
14
|
+
description = _ref.description,
|
|
24
15
|
iconBefore = _ref.iconBefore,
|
|
25
16
|
isDisabled = _ref.isDisabled,
|
|
26
17
|
onSelect = _ref.onSelect,
|
|
27
18
|
shortcut = _ref.shortcut,
|
|
28
|
-
|
|
29
|
-
shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
|
|
19
|
+
shouldWrapIcon = _ref.shouldWrapIcon,
|
|
30
20
|
title = _ref.title;
|
|
31
21
|
var _useQuickInsertContex = (0, _useQuickInsertContext.useQuickInsertContext)(),
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
return select(function (selectionContext) {
|
|
38
|
-
return onSelect({
|
|
39
|
-
editorView: editorView,
|
|
40
|
-
insert: selectionContext.insert,
|
|
41
|
-
source: selectionContext.source
|
|
42
|
-
});
|
|
43
|
-
});
|
|
44
|
-
}, [editorView, onSelect, select]);
|
|
45
|
-
return /*#__PURE__*/_react.default.createElement(_buttonItem.default, {
|
|
46
|
-
"aria-label": ariaLabel,
|
|
47
|
-
"aria-selected": isSelected,
|
|
48
|
-
iconBefore: iconBefore && shouldWrapIcon ? /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
49
|
-
xcss: styles.icon
|
|
50
|
-
}, iconBefore) : iconBefore,
|
|
51
|
-
id: item === null || item === void 0 ? void 0 : item.id,
|
|
22
|
+
surface = _useQuickInsertContex.surface;
|
|
23
|
+
return surface === 'element-browser' ? /*#__PURE__*/_react.default.createElement(_ElementBrowserQuickInsertMenuItem.ElementBrowserQuickInsertMenuItem, {
|
|
24
|
+
ariaLabel: ariaLabel,
|
|
25
|
+
description: description,
|
|
26
|
+
iconBefore: iconBefore,
|
|
52
27
|
isDisabled: isDisabled,
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
28
|
+
onSelect: onSelect,
|
|
29
|
+
shortcut: shortcut,
|
|
30
|
+
shouldWrapIcon: shouldWrapIcon,
|
|
31
|
+
title: title
|
|
32
|
+
}) : /*#__PURE__*/_react.default.createElement(_TypeAheadQuickInsertMenuItem.TypeAheadQuickInsertMenuItem, {
|
|
33
|
+
ariaLabel: ariaLabel,
|
|
34
|
+
description: description,
|
|
35
|
+
iconBefore: iconBefore,
|
|
36
|
+
isDisabled: isDisabled,
|
|
37
|
+
onSelect: onSelect,
|
|
38
|
+
shortcut: shortcut,
|
|
39
|
+
shouldWrapIcon: shouldWrapIcon,
|
|
40
|
+
title: title
|
|
41
|
+
});
|
|
63
42
|
};
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
/* TypeAheadQuickInsertMenuItem.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
+
"use strict";
|
|
3
|
+
|
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.TypeAheadQuickInsertMenuItem = void 0;
|
|
9
|
+
require("./TypeAheadQuickInsertMenuItem.compiled.css");
|
|
10
|
+
var _runtime = require("@compiled/react/runtime");
|
|
11
|
+
var _react = _interopRequireDefault(require("react"));
|
|
12
|
+
var _buttonItem = _interopRequireDefault(require("@atlaskit/menu/button-item"));
|
|
13
|
+
var _compiled = require("@atlaskit/primitives/compiled");
|
|
14
|
+
var _quickInsertMenuItemUtils = require("./quickInsertMenuItemUtils");
|
|
15
|
+
var _useQuickInsertContext = require("./useQuickInsertContext");
|
|
16
|
+
var styles = {
|
|
17
|
+
icon: "_2rko1qi0 _1reo15vq _18m915vq _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk1bhr _1e0c1txw _4t3izwfg _1bah1h6o _1bsbzwfg",
|
|
18
|
+
shortcut: "_2rko12b0 _11c8wadc _1rjcv77o _18zr1b66 _bfhki8nm _syazazsu"
|
|
19
|
+
};
|
|
20
|
+
var TypeAheadQuickInsertMenuItem = exports.TypeAheadQuickInsertMenuItem = function TypeAheadQuickInsertMenuItem(_ref) {
|
|
21
|
+
var ariaLabel = _ref.ariaLabel,
|
|
22
|
+
iconBefore = _ref.iconBefore,
|
|
23
|
+
isDisabled = _ref.isDisabled,
|
|
24
|
+
onSelect = _ref.onSelect,
|
|
25
|
+
shortcut = _ref.shortcut,
|
|
26
|
+
_ref$shouldWrapIcon = _ref.shouldWrapIcon,
|
|
27
|
+
shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
|
|
28
|
+
title = _ref.title;
|
|
29
|
+
var _useQuickInsertContex = (0, _useQuickInsertContext.useQuickInsertContext)(),
|
|
30
|
+
item = _useQuickInsertContex.item;
|
|
31
|
+
var _ref2 = item !== null && item !== void 0 ? item : {
|
|
32
|
+
id: undefined,
|
|
33
|
+
isSelected: false
|
|
34
|
+
},
|
|
35
|
+
id = _ref2.id,
|
|
36
|
+
isSelected = _ref2.isSelected;
|
|
37
|
+
var handleClick = (0, _quickInsertMenuItemUtils.useQuickInsertMenuItemSelection)(onSelect);
|
|
38
|
+
return /*#__PURE__*/_react.default.createElement(_buttonItem.default, {
|
|
39
|
+
"aria-label": ariaLabel,
|
|
40
|
+
"aria-selected": isSelected,
|
|
41
|
+
iconBefore: iconBefore && shouldWrapIcon ? /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
42
|
+
xcss: styles.icon
|
|
43
|
+
}, iconBefore) : iconBefore,
|
|
44
|
+
id: id,
|
|
45
|
+
isDisabled: isDisabled,
|
|
46
|
+
isSelected: isSelected,
|
|
47
|
+
onClick: handleClick,
|
|
48
|
+
role: "option"
|
|
49
|
+
}, /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
|
|
50
|
+
alignBlock: "center",
|
|
51
|
+
spread: "space-between"
|
|
52
|
+
}, /*#__PURE__*/_react.default.createElement(_compiled.Text, null, title), shortcut && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
53
|
+
as: "span",
|
|
54
|
+
xcss: styles.shortcut
|
|
55
|
+
}, shortcut)));
|
|
56
|
+
};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useQuickInsertMenuItemSelection = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _useQuickInsertContext = require("./useQuickInsertContext");
|
|
9
|
+
var useQuickInsertMenuItemSelection = exports.useQuickInsertMenuItemSelection = function useQuickInsertMenuItemSelection(onSelect) {
|
|
10
|
+
var _useQuickInsertContex = (0, _useQuickInsertContext.useQuickInsertContext)(),
|
|
11
|
+
editorView = _useQuickInsertContex.editorView,
|
|
12
|
+
select = _useQuickInsertContex.select;
|
|
13
|
+
return (0, _react.useCallback)(function () {
|
|
14
|
+
return select(function (selectionContext) {
|
|
15
|
+
return onSelect({
|
|
16
|
+
editorView: editorView,
|
|
17
|
+
insert: selectionContext.insert,
|
|
18
|
+
source: selectionContext.source
|
|
19
|
+
});
|
|
20
|
+
});
|
|
21
|
+
}, [editorView, onSelect, select]);
|
|
22
|
+
};
|
|
@@ -24,7 +24,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
|
|
|
24
24
|
* @jsx jsx
|
|
25
25
|
*/ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
26
26
|
var packageName = "@atlaskit/editor-common";
|
|
27
|
-
var packageVersion = "119.
|
|
27
|
+
var packageVersion = "119.17.0";
|
|
28
28
|
var halfFocusRing = 1;
|
|
29
29
|
var dropOffset = '0, 8';
|
|
30
30
|
var fadeIn = (0, _react2.keyframes)({
|
|
@@ -14,7 +14,7 @@ const NETWORK_FAILURE_REGEX = /^network failure/i;
|
|
|
14
14
|
const RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
|
|
15
15
|
const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
|
|
16
16
|
const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
|
|
17
|
-
const packageVersion = "119.
|
|
17
|
+
const packageVersion = "119.17.0";
|
|
18
18
|
const sanitiseSentryEvents = (data, _hint) => {
|
|
19
19
|
// Remove URL as it has UGC
|
|
20
20
|
// Ignored via go/ees007
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- Compiled primitives do not provide Pressable.
|
|
4
|
+
import { Box, Inline, Pressable, Stack, Text, xcss } from '@atlaskit/primitives';
|
|
5
|
+
import { useQuickInsertMenuItemSelection } from './quickInsertMenuItemUtils';
|
|
6
|
+
import { useQuickInsertContext } from './useQuickInsertContext';
|
|
7
|
+
const itemStyles = xcss({
|
|
8
|
+
alignItems: 'start',
|
|
9
|
+
backgroundColor: 'color.background.neutral.subtle',
|
|
10
|
+
borderColor: 'color.border',
|
|
11
|
+
borderRadius: 'radius.medium',
|
|
12
|
+
borderStyle: 'solid',
|
|
13
|
+
borderWidth: 'border.width',
|
|
14
|
+
color: 'color.text',
|
|
15
|
+
cursor: 'pointer',
|
|
16
|
+
display: 'flex',
|
|
17
|
+
gap: 'space.150',
|
|
18
|
+
padding: 'space.150',
|
|
19
|
+
textAlign: 'start',
|
|
20
|
+
width: '100%'
|
|
21
|
+
});
|
|
22
|
+
const selectedItemStyles = xcss({
|
|
23
|
+
alignItems: 'start',
|
|
24
|
+
backgroundColor: 'color.background.selected',
|
|
25
|
+
borderColor: 'color.border.selected',
|
|
26
|
+
borderRadius: 'radius.medium',
|
|
27
|
+
borderStyle: 'solid',
|
|
28
|
+
borderWidth: 'border.width',
|
|
29
|
+
color: 'color.text',
|
|
30
|
+
cursor: 'pointer',
|
|
31
|
+
display: 'flex',
|
|
32
|
+
gap: 'space.150',
|
|
33
|
+
padding: 'space.150',
|
|
34
|
+
textAlign: 'start',
|
|
35
|
+
width: '100%'
|
|
36
|
+
});
|
|
37
|
+
const disabledItemStyles = xcss({
|
|
38
|
+
alignItems: 'start',
|
|
39
|
+
backgroundColor: 'color.background.neutral.subtle',
|
|
40
|
+
borderColor: 'color.border',
|
|
41
|
+
borderRadius: 'radius.medium',
|
|
42
|
+
borderStyle: 'solid',
|
|
43
|
+
borderWidth: 'border.width',
|
|
44
|
+
color: 'color.text.disabled',
|
|
45
|
+
cursor: 'not-allowed',
|
|
46
|
+
display: 'flex',
|
|
47
|
+
gap: 'space.150',
|
|
48
|
+
padding: 'space.150',
|
|
49
|
+
textAlign: 'start',
|
|
50
|
+
width: '100%'
|
|
51
|
+
});
|
|
52
|
+
const iconStyles = xcss({
|
|
53
|
+
alignItems: 'center',
|
|
54
|
+
backgroundColor: 'elevation.surface.overlay',
|
|
55
|
+
borderColor: 'color.border',
|
|
56
|
+
borderRadius: 'radius.medium',
|
|
57
|
+
borderStyle: 'solid',
|
|
58
|
+
borderWidth: 'border.width',
|
|
59
|
+
display: 'flex',
|
|
60
|
+
flexShrink: 0,
|
|
61
|
+
height: '40px',
|
|
62
|
+
justifyContent: 'center',
|
|
63
|
+
overflow: 'hidden',
|
|
64
|
+
width: '40px'
|
|
65
|
+
});
|
|
66
|
+
const descriptionStyles = xcss({
|
|
67
|
+
color: 'color.text.subtle'
|
|
68
|
+
});
|
|
69
|
+
const shortcutStyles = xcss({
|
|
70
|
+
backgroundColor: 'color.background.neutral',
|
|
71
|
+
borderRadius: 'radius.small',
|
|
72
|
+
color: 'color.text.subtle',
|
|
73
|
+
font: 'font.body.small',
|
|
74
|
+
paddingBlock: 'space.025',
|
|
75
|
+
paddingInline: 'space.050'
|
|
76
|
+
});
|
|
77
|
+
export const ElementBrowserQuickInsertMenuItem = ({
|
|
78
|
+
ariaLabel,
|
|
79
|
+
description,
|
|
80
|
+
iconBefore,
|
|
81
|
+
isDisabled,
|
|
82
|
+
onSelect,
|
|
83
|
+
shortcut,
|
|
84
|
+
shouldWrapIcon = true,
|
|
85
|
+
title
|
|
86
|
+
}) => {
|
|
87
|
+
const {
|
|
88
|
+
item
|
|
89
|
+
} = useQuickInsertContext();
|
|
90
|
+
const {
|
|
91
|
+
id,
|
|
92
|
+
isSelected
|
|
93
|
+
} = item !== null && item !== void 0 ? item : {
|
|
94
|
+
id: undefined,
|
|
95
|
+
isSelected: false
|
|
96
|
+
};
|
|
97
|
+
const handleClick = useQuickInsertMenuItemSelection(onSelect);
|
|
98
|
+
return /*#__PURE__*/React.createElement(Pressable, {
|
|
99
|
+
"aria-label": ariaLabel,
|
|
100
|
+
"aria-selected": isSelected,
|
|
101
|
+
id: id,
|
|
102
|
+
isDisabled: isDisabled,
|
|
103
|
+
onClick: handleClick,
|
|
104
|
+
role: "option",
|
|
105
|
+
xcss: isDisabled ? disabledItemStyles : isSelected ? selectedItemStyles : itemStyles
|
|
106
|
+
}, iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
|
|
107
|
+
xcss: iconStyles
|
|
108
|
+
}, iconBefore) : iconBefore, /*#__PURE__*/React.createElement(Stack, {
|
|
109
|
+
space: "space.050",
|
|
110
|
+
grow: "fill"
|
|
111
|
+
}, /*#__PURE__*/React.createElement(Inline, {
|
|
112
|
+
alignBlock: "center",
|
|
113
|
+
spread: "space-between",
|
|
114
|
+
space: "space.100"
|
|
115
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
116
|
+
weight: "medium"
|
|
117
|
+
}, title), shortcut && /*#__PURE__*/React.createElement(Box, {
|
|
118
|
+
as: "span",
|
|
119
|
+
xcss: shortcutStyles
|
|
120
|
+
}, shortcut)), description && /*#__PURE__*/React.createElement(Box, {
|
|
121
|
+
xcss: descriptionStyles
|
|
122
|
+
}, /*#__PURE__*/React.createElement(Text, null, description))));
|
|
123
|
+
};
|
|
@@ -1,51 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import React, { useCallback } from 'react';
|
|
5
|
-
import ButtonItem from '@atlaskit/menu/button-item';
|
|
6
|
-
import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ElementBrowserQuickInsertMenuItem } from './ElementBrowserQuickInsertMenuItem';
|
|
3
|
+
import { TypeAheadQuickInsertMenuItem } from './TypeAheadQuickInsertMenuItem';
|
|
7
4
|
import { useQuickInsertContext } from './useQuickInsertContext';
|
|
8
|
-
const styles = {
|
|
9
|
-
icon: "_2rko1qi0 _1reo15vq _18m915vq _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk1bhr _1e0c1txw _4t3izwfg _1bah1h6o _1bsbzwfg",
|
|
10
|
-
shortcut: "_2rko12b0 _11c8wadc _1rjcv77o _18zr1b66 _bfhki8nm _syazazsu"
|
|
11
|
-
};
|
|
12
5
|
export const QuickInsertMenuItem = ({
|
|
13
6
|
ariaLabel,
|
|
7
|
+
description,
|
|
14
8
|
iconBefore,
|
|
15
9
|
isDisabled,
|
|
16
10
|
onSelect,
|
|
17
11
|
shortcut,
|
|
18
|
-
shouldWrapIcon
|
|
12
|
+
shouldWrapIcon,
|
|
19
13
|
title
|
|
20
14
|
}) => {
|
|
21
|
-
var _item$isSelected;
|
|
22
15
|
const {
|
|
23
|
-
|
|
24
|
-
item,
|
|
25
|
-
select
|
|
16
|
+
surface
|
|
26
17
|
} = useQuickInsertContext();
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
source: selectionContext.source
|
|
32
|
-
})), [editorView, onSelect, select]);
|
|
33
|
-
return /*#__PURE__*/React.createElement(ButtonItem, {
|
|
34
|
-
"aria-label": ariaLabel,
|
|
35
|
-
"aria-selected": isSelected,
|
|
36
|
-
iconBefore: iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
|
|
37
|
-
xcss: styles.icon
|
|
38
|
-
}, iconBefore) : iconBefore,
|
|
39
|
-
id: item === null || item === void 0 ? void 0 : item.id,
|
|
18
|
+
return surface === 'element-browser' ? /*#__PURE__*/React.createElement(ElementBrowserQuickInsertMenuItem, {
|
|
19
|
+
ariaLabel: ariaLabel,
|
|
20
|
+
description: description,
|
|
21
|
+
iconBefore: iconBefore,
|
|
40
22
|
isDisabled: isDisabled,
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
23
|
+
onSelect: onSelect,
|
|
24
|
+
shortcut: shortcut,
|
|
25
|
+
shouldWrapIcon: shouldWrapIcon,
|
|
26
|
+
title: title
|
|
27
|
+
}) : /*#__PURE__*/React.createElement(TypeAheadQuickInsertMenuItem, {
|
|
28
|
+
ariaLabel: ariaLabel,
|
|
29
|
+
description: description,
|
|
30
|
+
iconBefore: iconBefore,
|
|
31
|
+
isDisabled: isDisabled,
|
|
32
|
+
onSelect: onSelect,
|
|
33
|
+
shortcut: shortcut,
|
|
34
|
+
shouldWrapIcon: shouldWrapIcon,
|
|
35
|
+
title: title
|
|
36
|
+
});
|
|
51
37
|
};
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/* TypeAheadQuickInsertMenuItem.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
+
import "./TypeAheadQuickInsertMenuItem.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import ButtonItem from '@atlaskit/menu/button-item';
|
|
6
|
+
import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
|
|
7
|
+
import { useQuickInsertMenuItemSelection } from './quickInsertMenuItemUtils';
|
|
8
|
+
import { useQuickInsertContext } from './useQuickInsertContext';
|
|
9
|
+
const styles = {
|
|
10
|
+
icon: "_2rko1qi0 _1reo15vq _18m915vq _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk1bhr _1e0c1txw _4t3izwfg _1bah1h6o _1bsbzwfg",
|
|
11
|
+
shortcut: "_2rko12b0 _11c8wadc _1rjcv77o _18zr1b66 _bfhki8nm _syazazsu"
|
|
12
|
+
};
|
|
13
|
+
export const TypeAheadQuickInsertMenuItem = ({
|
|
14
|
+
ariaLabel,
|
|
15
|
+
iconBefore,
|
|
16
|
+
isDisabled,
|
|
17
|
+
onSelect,
|
|
18
|
+
shortcut,
|
|
19
|
+
shouldWrapIcon = true,
|
|
20
|
+
title
|
|
21
|
+
}) => {
|
|
22
|
+
const {
|
|
23
|
+
item
|
|
24
|
+
} = useQuickInsertContext();
|
|
25
|
+
const {
|
|
26
|
+
id,
|
|
27
|
+
isSelected
|
|
28
|
+
} = item !== null && item !== void 0 ? item : {
|
|
29
|
+
id: undefined,
|
|
30
|
+
isSelected: false
|
|
31
|
+
};
|
|
32
|
+
const handleClick = useQuickInsertMenuItemSelection(onSelect);
|
|
33
|
+
return /*#__PURE__*/React.createElement(ButtonItem, {
|
|
34
|
+
"aria-label": ariaLabel,
|
|
35
|
+
"aria-selected": isSelected,
|
|
36
|
+
iconBefore: iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
|
|
37
|
+
xcss: styles.icon
|
|
38
|
+
}, iconBefore) : iconBefore,
|
|
39
|
+
id: id,
|
|
40
|
+
isDisabled: isDisabled,
|
|
41
|
+
isSelected: isSelected,
|
|
42
|
+
onClick: handleClick,
|
|
43
|
+
role: "option"
|
|
44
|
+
}, /*#__PURE__*/React.createElement(Inline, {
|
|
45
|
+
alignBlock: "center",
|
|
46
|
+
spread: "space-between"
|
|
47
|
+
}, /*#__PURE__*/React.createElement(Text, null, title), shortcut && /*#__PURE__*/React.createElement(Box, {
|
|
48
|
+
as: "span",
|
|
49
|
+
xcss: styles.shortcut
|
|
50
|
+
}, shortcut)));
|
|
51
|
+
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { useCallback } from 'react';
|
|
2
|
+
import { useQuickInsertContext } from './useQuickInsertContext';
|
|
3
|
+
export const useQuickInsertMenuItemSelection = onSelect => {
|
|
4
|
+
const {
|
|
5
|
+
editorView,
|
|
6
|
+
select
|
|
7
|
+
} = useQuickInsertContext();
|
|
8
|
+
return useCallback(() => select(selectionContext => onSelect({
|
|
9
|
+
editorView,
|
|
10
|
+
insert: selectionContext.insert,
|
|
11
|
+
source: selectionContext.source
|
|
12
|
+
})), [editorView, onSelect, select]);
|
|
13
|
+
};
|
|
@@ -14,7 +14,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
|
14
14
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
15
15
|
import Layer from '../Layer';
|
|
16
16
|
const packageName = "@atlaskit/editor-common";
|
|
17
|
-
const packageVersion = "119.
|
|
17
|
+
const packageVersion = "119.17.0";
|
|
18
18
|
const halfFocusRing = 1;
|
|
19
19
|
const dropOffset = '0, 8';
|
|
20
20
|
const fadeIn = keyframes({
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
import { MEDIA_INSERT_TAB } from '../analytics/types/enums';
|
|
3
|
+
export var DEFAULT_MEDIA_INSERT_TAB_RANK = 0;
|
|
4
|
+
export var MEDIA_INSERT_TAB_RANK = _defineProperty(_defineProperty(_defineProperty({}, MEDIA_INSERT_TAB.UPLOAD, 100), MEDIA_INSERT_TAB.LINK, 200), MEDIA_INSERT_TAB.CREATE, 300);
|
|
@@ -20,7 +20,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
|
|
|
20
20
|
var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
|
|
21
21
|
var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
|
|
22
22
|
var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
|
|
23
|
-
var packageVersion = "119.
|
|
23
|
+
var packageVersion = "119.17.0";
|
|
24
24
|
var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
|
|
25
25
|
// Remove URL as it has UGC
|
|
26
26
|
// Ignored via go/ees007
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- Compiled primitives do not provide Pressable.
|
|
4
|
+
import { Box, Inline, Pressable, Stack, Text, xcss } from '@atlaskit/primitives';
|
|
5
|
+
import { useQuickInsertMenuItemSelection } from './quickInsertMenuItemUtils';
|
|
6
|
+
import { useQuickInsertContext } from './useQuickInsertContext';
|
|
7
|
+
var itemStyles = xcss({
|
|
8
|
+
alignItems: 'start',
|
|
9
|
+
backgroundColor: 'color.background.neutral.subtle',
|
|
10
|
+
borderColor: 'color.border',
|
|
11
|
+
borderRadius: 'radius.medium',
|
|
12
|
+
borderStyle: 'solid',
|
|
13
|
+
borderWidth: 'border.width',
|
|
14
|
+
color: 'color.text',
|
|
15
|
+
cursor: 'pointer',
|
|
16
|
+
display: 'flex',
|
|
17
|
+
gap: 'space.150',
|
|
18
|
+
padding: 'space.150',
|
|
19
|
+
textAlign: 'start',
|
|
20
|
+
width: '100%'
|
|
21
|
+
});
|
|
22
|
+
var selectedItemStyles = xcss({
|
|
23
|
+
alignItems: 'start',
|
|
24
|
+
backgroundColor: 'color.background.selected',
|
|
25
|
+
borderColor: 'color.border.selected',
|
|
26
|
+
borderRadius: 'radius.medium',
|
|
27
|
+
borderStyle: 'solid',
|
|
28
|
+
borderWidth: 'border.width',
|
|
29
|
+
color: 'color.text',
|
|
30
|
+
cursor: 'pointer',
|
|
31
|
+
display: 'flex',
|
|
32
|
+
gap: 'space.150',
|
|
33
|
+
padding: 'space.150',
|
|
34
|
+
textAlign: 'start',
|
|
35
|
+
width: '100%'
|
|
36
|
+
});
|
|
37
|
+
var disabledItemStyles = xcss({
|
|
38
|
+
alignItems: 'start',
|
|
39
|
+
backgroundColor: 'color.background.neutral.subtle',
|
|
40
|
+
borderColor: 'color.border',
|
|
41
|
+
borderRadius: 'radius.medium',
|
|
42
|
+
borderStyle: 'solid',
|
|
43
|
+
borderWidth: 'border.width',
|
|
44
|
+
color: 'color.text.disabled',
|
|
45
|
+
cursor: 'not-allowed',
|
|
46
|
+
display: 'flex',
|
|
47
|
+
gap: 'space.150',
|
|
48
|
+
padding: 'space.150',
|
|
49
|
+
textAlign: 'start',
|
|
50
|
+
width: '100%'
|
|
51
|
+
});
|
|
52
|
+
var iconStyles = xcss({
|
|
53
|
+
alignItems: 'center',
|
|
54
|
+
backgroundColor: 'elevation.surface.overlay',
|
|
55
|
+
borderColor: 'color.border',
|
|
56
|
+
borderRadius: 'radius.medium',
|
|
57
|
+
borderStyle: 'solid',
|
|
58
|
+
borderWidth: 'border.width',
|
|
59
|
+
display: 'flex',
|
|
60
|
+
flexShrink: 0,
|
|
61
|
+
height: '40px',
|
|
62
|
+
justifyContent: 'center',
|
|
63
|
+
overflow: 'hidden',
|
|
64
|
+
width: '40px'
|
|
65
|
+
});
|
|
66
|
+
var descriptionStyles = xcss({
|
|
67
|
+
color: 'color.text.subtle'
|
|
68
|
+
});
|
|
69
|
+
var shortcutStyles = xcss({
|
|
70
|
+
backgroundColor: 'color.background.neutral',
|
|
71
|
+
borderRadius: 'radius.small',
|
|
72
|
+
color: 'color.text.subtle',
|
|
73
|
+
font: 'font.body.small',
|
|
74
|
+
paddingBlock: 'space.025',
|
|
75
|
+
paddingInline: 'space.050'
|
|
76
|
+
});
|
|
77
|
+
export var ElementBrowserQuickInsertMenuItem = function ElementBrowserQuickInsertMenuItem(_ref) {
|
|
78
|
+
var ariaLabel = _ref.ariaLabel,
|
|
79
|
+
description = _ref.description,
|
|
80
|
+
iconBefore = _ref.iconBefore,
|
|
81
|
+
isDisabled = _ref.isDisabled,
|
|
82
|
+
onSelect = _ref.onSelect,
|
|
83
|
+
shortcut = _ref.shortcut,
|
|
84
|
+
_ref$shouldWrapIcon = _ref.shouldWrapIcon,
|
|
85
|
+
shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
|
|
86
|
+
title = _ref.title;
|
|
87
|
+
var _useQuickInsertContex = useQuickInsertContext(),
|
|
88
|
+
item = _useQuickInsertContex.item;
|
|
89
|
+
var _ref2 = item !== null && item !== void 0 ? item : {
|
|
90
|
+
id: undefined,
|
|
91
|
+
isSelected: false
|
|
92
|
+
},
|
|
93
|
+
id = _ref2.id,
|
|
94
|
+
isSelected = _ref2.isSelected;
|
|
95
|
+
var handleClick = useQuickInsertMenuItemSelection(onSelect);
|
|
96
|
+
return /*#__PURE__*/React.createElement(Pressable, {
|
|
97
|
+
"aria-label": ariaLabel,
|
|
98
|
+
"aria-selected": isSelected,
|
|
99
|
+
id: id,
|
|
100
|
+
isDisabled: isDisabled,
|
|
101
|
+
onClick: handleClick,
|
|
102
|
+
role: "option",
|
|
103
|
+
xcss: isDisabled ? disabledItemStyles : isSelected ? selectedItemStyles : itemStyles
|
|
104
|
+
}, iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
|
|
105
|
+
xcss: iconStyles
|
|
106
|
+
}, iconBefore) : iconBefore, /*#__PURE__*/React.createElement(Stack, {
|
|
107
|
+
space: "space.050",
|
|
108
|
+
grow: "fill"
|
|
109
|
+
}, /*#__PURE__*/React.createElement(Inline, {
|
|
110
|
+
alignBlock: "center",
|
|
111
|
+
spread: "space-between",
|
|
112
|
+
space: "space.100"
|
|
113
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
114
|
+
weight: "medium"
|
|
115
|
+
}, title), shortcut && /*#__PURE__*/React.createElement(Box, {
|
|
116
|
+
as: "span",
|
|
117
|
+
xcss: shortcutStyles
|
|
118
|
+
}, shortcut)), description && /*#__PURE__*/React.createElement(Box, {
|
|
119
|
+
xcss: descriptionStyles
|
|
120
|
+
}, /*#__PURE__*/React.createElement(Text, null, description))));
|
|
121
|
+
};
|
|
@@ -1,54 +1,35 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import React, { useCallback } from 'react';
|
|
5
|
-
import ButtonItem from '@atlaskit/menu/button-item';
|
|
6
|
-
import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ElementBrowserQuickInsertMenuItem } from './ElementBrowserQuickInsertMenuItem';
|
|
3
|
+
import { TypeAheadQuickInsertMenuItem } from './TypeAheadQuickInsertMenuItem';
|
|
7
4
|
import { useQuickInsertContext } from './useQuickInsertContext';
|
|
8
|
-
var styles = {
|
|
9
|
-
icon: "_2rko1qi0 _1reo15vq _18m915vq _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk1bhr _1e0c1txw _4t3izwfg _1bah1h6o _1bsbzwfg",
|
|
10
|
-
shortcut: "_2rko12b0 _11c8wadc _1rjcv77o _18zr1b66 _bfhki8nm _syazazsu"
|
|
11
|
-
};
|
|
12
5
|
export var QuickInsertMenuItem = function QuickInsertMenuItem(_ref) {
|
|
13
|
-
var _item$isSelected;
|
|
14
6
|
var ariaLabel = _ref.ariaLabel,
|
|
7
|
+
description = _ref.description,
|
|
15
8
|
iconBefore = _ref.iconBefore,
|
|
16
9
|
isDisabled = _ref.isDisabled,
|
|
17
10
|
onSelect = _ref.onSelect,
|
|
18
11
|
shortcut = _ref.shortcut,
|
|
19
|
-
|
|
20
|
-
shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
|
|
12
|
+
shouldWrapIcon = _ref.shouldWrapIcon,
|
|
21
13
|
title = _ref.title;
|
|
22
14
|
var _useQuickInsertContex = useQuickInsertContext(),
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
return select(function (selectionContext) {
|
|
29
|
-
return onSelect({
|
|
30
|
-
editorView: editorView,
|
|
31
|
-
insert: selectionContext.insert,
|
|
32
|
-
source: selectionContext.source
|
|
33
|
-
});
|
|
34
|
-
});
|
|
35
|
-
}, [editorView, onSelect, select]);
|
|
36
|
-
return /*#__PURE__*/React.createElement(ButtonItem, {
|
|
37
|
-
"aria-label": ariaLabel,
|
|
38
|
-
"aria-selected": isSelected,
|
|
39
|
-
iconBefore: iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
|
|
40
|
-
xcss: styles.icon
|
|
41
|
-
}, iconBefore) : iconBefore,
|
|
42
|
-
id: item === null || item === void 0 ? void 0 : item.id,
|
|
15
|
+
surface = _useQuickInsertContex.surface;
|
|
16
|
+
return surface === 'element-browser' ? /*#__PURE__*/React.createElement(ElementBrowserQuickInsertMenuItem, {
|
|
17
|
+
ariaLabel: ariaLabel,
|
|
18
|
+
description: description,
|
|
19
|
+
iconBefore: iconBefore,
|
|
43
20
|
isDisabled: isDisabled,
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
21
|
+
onSelect: onSelect,
|
|
22
|
+
shortcut: shortcut,
|
|
23
|
+
shouldWrapIcon: shouldWrapIcon,
|
|
24
|
+
title: title
|
|
25
|
+
}) : /*#__PURE__*/React.createElement(TypeAheadQuickInsertMenuItem, {
|
|
26
|
+
ariaLabel: ariaLabel,
|
|
27
|
+
description: description,
|
|
28
|
+
iconBefore: iconBefore,
|
|
29
|
+
isDisabled: isDisabled,
|
|
30
|
+
onSelect: onSelect,
|
|
31
|
+
shortcut: shortcut,
|
|
32
|
+
shouldWrapIcon: shouldWrapIcon,
|
|
33
|
+
title: title
|
|
34
|
+
});
|
|
54
35
|
};
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
/* TypeAheadQuickInsertMenuItem.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
+
import "./TypeAheadQuickInsertMenuItem.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import ButtonItem from '@atlaskit/menu/button-item';
|
|
6
|
+
import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
|
|
7
|
+
import { useQuickInsertMenuItemSelection } from './quickInsertMenuItemUtils';
|
|
8
|
+
import { useQuickInsertContext } from './useQuickInsertContext';
|
|
9
|
+
var styles = {
|
|
10
|
+
icon: "_2rko1qi0 _1reo15vq _18m915vq _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk1bhr _1e0c1txw _4t3izwfg _1bah1h6o _1bsbzwfg",
|
|
11
|
+
shortcut: "_2rko12b0 _11c8wadc _1rjcv77o _18zr1b66 _bfhki8nm _syazazsu"
|
|
12
|
+
};
|
|
13
|
+
export var TypeAheadQuickInsertMenuItem = function TypeAheadQuickInsertMenuItem(_ref) {
|
|
14
|
+
var ariaLabel = _ref.ariaLabel,
|
|
15
|
+
iconBefore = _ref.iconBefore,
|
|
16
|
+
isDisabled = _ref.isDisabled,
|
|
17
|
+
onSelect = _ref.onSelect,
|
|
18
|
+
shortcut = _ref.shortcut,
|
|
19
|
+
_ref$shouldWrapIcon = _ref.shouldWrapIcon,
|
|
20
|
+
shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
|
|
21
|
+
title = _ref.title;
|
|
22
|
+
var _useQuickInsertContex = useQuickInsertContext(),
|
|
23
|
+
item = _useQuickInsertContex.item;
|
|
24
|
+
var _ref2 = item !== null && item !== void 0 ? item : {
|
|
25
|
+
id: undefined,
|
|
26
|
+
isSelected: false
|
|
27
|
+
},
|
|
28
|
+
id = _ref2.id,
|
|
29
|
+
isSelected = _ref2.isSelected;
|
|
30
|
+
var handleClick = useQuickInsertMenuItemSelection(onSelect);
|
|
31
|
+
return /*#__PURE__*/React.createElement(ButtonItem, {
|
|
32
|
+
"aria-label": ariaLabel,
|
|
33
|
+
"aria-selected": isSelected,
|
|
34
|
+
iconBefore: iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
|
|
35
|
+
xcss: styles.icon
|
|
36
|
+
}, iconBefore) : iconBefore,
|
|
37
|
+
id: id,
|
|
38
|
+
isDisabled: isDisabled,
|
|
39
|
+
isSelected: isSelected,
|
|
40
|
+
onClick: handleClick,
|
|
41
|
+
role: "option"
|
|
42
|
+
}, /*#__PURE__*/React.createElement(Inline, {
|
|
43
|
+
alignBlock: "center",
|
|
44
|
+
spread: "space-between"
|
|
45
|
+
}, /*#__PURE__*/React.createElement(Text, null, title), shortcut && /*#__PURE__*/React.createElement(Box, {
|
|
46
|
+
as: "span",
|
|
47
|
+
xcss: styles.shortcut
|
|
48
|
+
}, shortcut)));
|
|
49
|
+
};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { useCallback } from 'react';
|
|
2
|
+
import { useQuickInsertContext } from './useQuickInsertContext';
|
|
3
|
+
export var useQuickInsertMenuItemSelection = function useQuickInsertMenuItemSelection(onSelect) {
|
|
4
|
+
var _useQuickInsertContex = useQuickInsertContext(),
|
|
5
|
+
editorView = _useQuickInsertContex.editorView,
|
|
6
|
+
select = _useQuickInsertContex.select;
|
|
7
|
+
return useCallback(function () {
|
|
8
|
+
return select(function (selectionContext) {
|
|
9
|
+
return onSelect({
|
|
10
|
+
editorView: editorView,
|
|
11
|
+
insert: selectionContext.insert,
|
|
12
|
+
source: selectionContext.source
|
|
13
|
+
});
|
|
14
|
+
});
|
|
15
|
+
}, [editorView, onSelect, select]);
|
|
16
|
+
};
|
|
@@ -21,7 +21,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
|
21
21
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
22
22
|
import Layer from '../Layer';
|
|
23
23
|
var packageName = "@atlaskit/editor-common";
|
|
24
|
-
var packageVersion = "119.
|
|
24
|
+
var packageVersion = "119.17.0";
|
|
25
25
|
var halfFocusRing = 1;
|
|
26
26
|
var dropOffset = '0, 8';
|
|
27
27
|
var fadeIn = keyframes({
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { QuickInsertMenuItemProps } from './QuickInsertMenuItem';
|
|
3
|
+
export declare const ElementBrowserQuickInsertMenuItem: ({ ariaLabel, description, iconBefore, isDisabled, onSelect, shortcut, shouldWrapIcon, title, }: QuickInsertMenuItemProps) => React.JSX.Element;
|
|
@@ -18,5 +18,6 @@ export type QuickInsertContextValue = {
|
|
|
18
18
|
menuOpenId?: symbol;
|
|
19
19
|
select: (selectionHandler: QuickInsertSelectionHandler) => void;
|
|
20
20
|
surfaceContext?: SurfaceContext;
|
|
21
|
+
surface: 'typeahead' | 'element-browser';
|
|
21
22
|
};
|
|
22
23
|
export declare const QuickInsertContext: Context<QuickInsertContextValue | null>;
|
|
@@ -3,8 +3,14 @@ import type { Transaction } from '@atlaskit/editor-prosemirror/state';
|
|
|
3
3
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
4
4
|
import type { INPUT_METHOD } from '../analytics';
|
|
5
5
|
import type { TypeAheadInsert } from '../types';
|
|
6
|
-
type
|
|
6
|
+
export type OnSelectContext = {
|
|
7
|
+
editorView: EditorView;
|
|
8
|
+
insert: TypeAheadInsert;
|
|
9
|
+
source: INPUT_METHOD.ELEMENT_BROWSER | INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR;
|
|
10
|
+
};
|
|
11
|
+
export type QuickInsertMenuItemProps = {
|
|
7
12
|
ariaLabel?: string;
|
|
13
|
+
description?: string;
|
|
8
14
|
iconBefore?: React.ReactNode;
|
|
9
15
|
isDisabled?: boolean;
|
|
10
16
|
onSelect: (context: OnSelectContext) => Transaction | false | void;
|
|
@@ -12,10 +18,4 @@ type Props = {
|
|
|
12
18
|
shouldWrapIcon?: boolean;
|
|
13
19
|
title: string;
|
|
14
20
|
};
|
|
15
|
-
export
|
|
16
|
-
editorView: EditorView;
|
|
17
|
-
insert: TypeAheadInsert;
|
|
18
|
-
source: INPUT_METHOD.ELEMENT_BROWSER | INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR;
|
|
19
|
-
};
|
|
20
|
-
export declare const QuickInsertMenuItem: ({ ariaLabel, iconBefore, isDisabled, onSelect, shortcut, shouldWrapIcon, title, }: Props) => React.JSX.Element;
|
|
21
|
-
export {};
|
|
21
|
+
export declare const QuickInsertMenuItem: ({ ariaLabel, description, iconBefore, isDisabled, onSelect, shortcut, shouldWrapIcon, title, }: QuickInsertMenuItemProps) => React.JSX.Element;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { QuickInsertMenuItemProps } from './QuickInsertMenuItem';
|
|
3
|
+
export declare const TypeAheadQuickInsertMenuItem: ({ ariaLabel, iconBefore, isDisabled, onSelect, shortcut, shouldWrapIcon, title, }: QuickInsertMenuItemProps) => React.JSX.Element;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@atlaskit/editor-common/media-insert/rank",
|
|
3
|
+
"main": "../../dist/cjs/media-insert/rank.js",
|
|
4
|
+
"module": "../../dist/esm/media-insert/rank.js",
|
|
5
|
+
"module:es2019": "../../dist/es2019/media-insert/rank.js",
|
|
6
|
+
"sideEffects": [
|
|
7
|
+
"**/*.compiled.css"
|
|
8
|
+
],
|
|
9
|
+
"types": "../../dist/types/media-insert/rank.d.ts"
|
|
10
|
+
}
|
package/package.json
CHANGED
|
File without changes
|
|
File without changes
|
|
File without changes
|