@atlaskit/editor-plugin-insert-block 1.9.2 → 1.10.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 +19 -0
- package/dist/cjs/assets/expand.js +4 -3
- package/dist/cjs/assets/switch.js +15 -19
- package/dist/cjs/plugin.js +22 -6
- package/dist/cjs/ui/ToolbarInsertBlock/dropdown-button.js +9 -23
- package/dist/cjs/ui/ToolbarInsertBlock/item.js +23 -36
- package/dist/cjs/ui/transformOptions.js +5 -1
- package/dist/es2019/assets/expand.js +5 -3
- package/dist/es2019/assets/switch.js +14 -19
- package/dist/es2019/plugin.js +24 -10
- package/dist/es2019/ui/ToolbarInsertBlock/dropdown-button.js +7 -21
- package/dist/es2019/ui/ToolbarInsertBlock/item.js +20 -33
- package/dist/es2019/ui/transformOptions.js +5 -1
- package/dist/esm/assets/expand.js +4 -3
- package/dist/esm/assets/switch.js +14 -19
- package/dist/esm/plugin.js +22 -6
- package/dist/esm/ui/ToolbarInsertBlock/dropdown-button.js +7 -21
- package/dist/esm/ui/ToolbarInsertBlock/item.js +20 -33
- package/dist/esm/ui/transformOptions.js +5 -1
- package/dist/types/assets/expand.d.ts +3 -1
- package/dist/types/assets/switch.d.ts +6 -2
- package/dist/types/ui/transformOptions.d.ts +4 -1
- package/dist/types-ts4.5/assets/expand.d.ts +3 -1
- package/dist/types-ts4.5/assets/switch.d.ts +6 -2
- package/dist/types-ts4.5/ui/transformOptions.d.ts +4 -1
- package/package.json +4 -10
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,24 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-insert-block
|
|
2
2
|
|
|
3
|
+
## 1.10.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#133191](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/133191)
|
|
8
|
+
[`78a1927084934`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/78a1927084934) -
|
|
9
|
+
[ux] Remove icon migration feature gate and migrate new icons on primary toolbar
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`193f8c85e1a39`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/193f8c85e1a39) -
|
|
14
|
+
[ux] [ED-24635]
|
|
15
|
+
|
|
16
|
+
- Disable Turn into dropdown options when wrapping is not supported
|
|
17
|
+
- Update expand icon so that it can show disabled status
|
|
18
|
+
- Update Turn into icon to show active status when dropdown is open
|
|
19
|
+
|
|
20
|
+
- Updated dependencies
|
|
21
|
+
|
|
3
22
|
## 1.9.2
|
|
4
23
|
|
|
5
24
|
### Patch Changes
|
|
@@ -18,7 +18,8 @@ var iconContainer = (0, _react.css)({
|
|
|
18
18
|
width: '24px',
|
|
19
19
|
height: '24px'
|
|
20
20
|
});
|
|
21
|
-
function ExpandIcon() {
|
|
21
|
+
function ExpandIcon(_ref) {
|
|
22
|
+
var disabled = _ref.disabled;
|
|
22
23
|
return (0, _react.jsx)("span", {
|
|
23
24
|
css: iconContainer
|
|
24
25
|
}, (0, _react.jsx)("svg", {
|
|
@@ -29,11 +30,11 @@ function ExpandIcon() {
|
|
|
29
30
|
fill: "none"
|
|
30
31
|
}, (0, _react.jsx)("path", {
|
|
31
32
|
d: "M2 2V14H16V2H2ZM2 0H16C16.5304 0 17.0391 0.210714 17.4142 0.585786C17.7893 0.960859 18 1.46957 18 2V14C18 14.5304 17.7893 15.0391 17.4142 15.4142C17.0391 15.7893 16.5304 16 16 16H2C1.46957 16 0.960859 15.7893 0.585786 15.4142C0.210714 15.0391 0 14.5304 0 14V2C0 1.46957 0.210714 0.960859 0.585786 0.585786C0.960859 0.210714 1.46957 0 2 0Z",
|
|
32
|
-
fill: "var(--ds-icon, #44546F)"
|
|
33
|
+
fill: disabled ? "var(--ds-icon-disabled, #B3B9C4)" : "var(--ds-icon, #44546F)"
|
|
33
34
|
}), (0, _react.jsx)("path", {
|
|
34
35
|
fillRule: "evenodd",
|
|
35
36
|
clipRule: "evenodd",
|
|
36
37
|
d: "M5.29158 6.29294C5.10477 6.48183 5 6.73678 5 7.00244C5 7.2681 5.10477 7.52305 5.29158 7.71194L8.23058 10.6769C8.44858 10.8919 8.73058 10.9989 9.00958 10.9989C9.28858 10.9989 9.56558 10.8919 9.77858 10.6769L12.7086 7.72194C12.8951 7.53292 12.9998 7.27803 12.9998 7.01244C12.9998 6.74686 12.8951 6.49196 12.7086 6.30294C12.6167 6.20976 12.5073 6.13576 12.3866 6.08525C12.2659 6.03474 12.1364 6.00873 12.0056 6.00873C11.8748 6.00873 11.7452 6.03474 11.6245 6.08525C11.5039 6.13576 11.3944 6.20976 11.3026 6.30294L9.00458 8.61994L6.69758 6.29294C6.60554 6.20012 6.49604 6.12644 6.37538 6.07617C6.25472 6.02589 6.1253 6 5.99458 6C5.86386 6 5.73444 6.02589 5.61378 6.07617C5.49312 6.12644 5.38362 6.20012 5.29158 6.29294Z",
|
|
37
|
-
fill: "var(--ds-icon, #44546F)"
|
|
38
|
+
fill: disabled ? "var(--ds-icon-disabled, #B3B9C4)" : "var(--ds-icon, #44546F)"
|
|
38
39
|
})));
|
|
39
40
|
}
|
|
@@ -5,26 +5,22 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = SwitchIcon;
|
|
8
|
-
var _react =
|
|
9
|
-
var
|
|
8
|
+
var _react = require("@emotion/react");
|
|
9
|
+
var _refresh = _interopRequireDefault(require("@atlaskit/icon/glyph/refresh"));
|
|
10
|
+
/**
|
|
11
|
+
* @jsxRuntime classic
|
|
12
|
+
* @jsx jsx
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
16
|
+
|
|
17
|
+
var iconStyle = (0, _react.css)({
|
|
18
|
+
transform: 'rotate(-90deg)'
|
|
19
|
+
});
|
|
10
20
|
function SwitchIcon() {
|
|
11
|
-
return
|
|
21
|
+
return (0, _react.jsx)("span", {
|
|
22
|
+
css: iconStyle
|
|
23
|
+
}, (0, _react.jsx)(_refresh.default, {
|
|
12
24
|
label: ""
|
|
13
|
-
}, /*#__PURE__*/_react.default.createElement("path", {
|
|
14
|
-
d: "M6.003 16H8.998C9.26322 16 9.51757 15.8947 9.70511 15.7071C9.89264 15.5196 9.998 15.2652 9.998 15C9.998 14.7348 9.89264 14.4805 9.70511 14.2929C9.51757 14.1054 9.26322 14 8.998 14H5.102C4.494 14 4 14.493 4 15.1V19C4 19.2656 4.10551 19.5204 4.29333 19.7082C4.48115 19.896 4.73589 20.0015 5.0015 20.0015C5.26711 20.0015 5.52185 19.896 5.70967 19.7082C5.89748 19.5204 6.003 19.2656 6.003 19V16Z",
|
|
15
|
-
fill: "var(--ds-icon, #44546F)"
|
|
16
|
-
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
17
|
-
d: "M18.018 14.572C16.989 16.649 14.807 18 12.37 18C10.104 18 8.051 16.833 6.945 14.98C6.659 14.5 6.023 14.334 5.524 14.609C5.40677 14.6709 5.30331 14.7559 5.21991 14.8589C5.13651 14.9619 5.0749 15.0808 5.0388 15.2083C5.00271 15.3359 4.99289 15.4694 5.00994 15.6009C5.027 15.7323 5.07056 15.8589 5.138 15.973C6.611 18.443 9.35 20 12.37 20C15.618 20 18.528 18.198 19.899 15.43C20.146 14.932 19.925 14.335 19.406 14.098C18.886 13.861 18.265 14.073 18.018 14.572Z",
|
|
18
|
-
fill: "var(--ds-icon, #44546F)"
|
|
19
|
-
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
20
|
-
fillRule: "evenodd",
|
|
21
|
-
clipRule: "evenodd",
|
|
22
|
-
d: "M15.002 10L18.898 10C19.506 10 20 9.50703 20 8.90003V5.00003C20 4.73441 19.8945 4.47968 19.7067 4.29186C19.5188 4.10404 19.2641 3.99853 18.9985 3.99853C18.7329 3.99853 18.4782 4.10404 18.2903 4.29186C18.1025 4.47968 17.997 4.73441 17.997 5.00003V8.00003H15.002C14.7368 8.00003 14.4824 8.10538 14.2949 8.29292C14.1074 8.48046 14.002 8.73481 14.002 9.00003C14.002 9.26524 14.1074 9.5196 14.2949 9.70713C14.4824 9.89467 14.7368 10 15.002 10Z",
|
|
23
|
-
fill: "var(--ds-icon, #44546F)"
|
|
24
|
-
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
25
|
-
fillRule: "evenodd",
|
|
26
|
-
clipRule: "evenodd",
|
|
27
|
-
d: "M4.596 9.90303C5.116 10.14 5.736 9.92803 5.983 9.42903C7.012 7.35203 9.193 6.00103 11.63 6.00103C13.896 6.00103 15.95 7.16803 17.055 9.02203C17.1988 9.25438 17.4265 9.42245 17.6909 9.49135C17.9553 9.56024 18.2361 9.52468 18.475 9.39203C18.975 9.11803 19.148 8.50703 18.862 8.02803C17.389 5.55803 14.65 4.00103 11.63 4.00103C8.382 4.00103 5.472 5.80303 4.102 8.57103C4.03537 8.70353 4.00045 8.84971 4 8.99803C4.00188 9.1902 4.05909 9.37775 4.16479 9.53825C4.27049 9.69875 4.4202 9.8254 4.596 9.90303Z",
|
|
28
|
-
fill: "var(--ds-icon, #44546F)"
|
|
29
25
|
}));
|
|
30
26
|
}
|
package/dist/cjs/plugin.js
CHANGED
|
@@ -9,9 +9,11 @@ exports.insertBlockPlugin = void 0;
|
|
|
9
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
10
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
11
11
|
var _hooks = require("@atlaskit/editor-common/hooks");
|
|
12
|
+
var _insert = require("@atlaskit/editor-common/insert");
|
|
12
13
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
13
14
|
var _providerFactory = require("@atlaskit/editor-common/provider-factory");
|
|
14
15
|
var _types = require("@atlaskit/editor-common/types");
|
|
16
|
+
var _utils = require("@atlaskit/editor-common/utils");
|
|
15
17
|
var _consts = require("@atlaskit/editor-plugin-block-type/consts");
|
|
16
18
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
17
19
|
var _switch = _interopRequireDefault(require("./assets/switch"));
|
|
@@ -126,10 +128,8 @@ var insertBlockPlugin = exports.insertBlockPlugin = function insertBlockPlugin(_
|
|
|
126
128
|
// Experiment one-pager: https://hello.atlassian.net/wiki/spaces/ETM/pages/3931754727/Experiment+Elements+Basic+Text+Transformations
|
|
127
129
|
selectionToolbar: function selectionToolbar(state, intl) {
|
|
128
130
|
var _api$featureFlags;
|
|
129
|
-
var
|
|
130
|
-
|
|
131
|
-
// basicTextTransformations is used to present AI enablement status to avoid adding editor props
|
|
132
|
-
(api === null || api === void 0 || (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 || (_api$featureFlags = _api$featureFlags.sharedState.currentState()) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.basicTextTransformations) && $from.depth === 1;
|
|
131
|
+
var isEligible = // basicTextTransformations is used to present AI enablement status to avoid adding editor props
|
|
132
|
+
api === null || api === void 0 || (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 || (_api$featureFlags = _api$featureFlags.sharedState.currentState()) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.basicTextTransformations;
|
|
133
133
|
if (!isEligible) {
|
|
134
134
|
return;
|
|
135
135
|
}
|
|
@@ -137,13 +137,29 @@ var insertBlockPlugin = exports.insertBlockPlugin = function insertBlockPlugin(_
|
|
|
137
137
|
exposure: true
|
|
138
138
|
})) {
|
|
139
139
|
var formatMessage = intl.formatMessage;
|
|
140
|
-
var _options = (0, _transformOptions.transformationOptions)(api).map(function (option) {
|
|
140
|
+
var _options = (0, _transformOptions.transformationOptions)(api, state.schema).map(function (option) {
|
|
141
|
+
var canWrap;
|
|
142
|
+
if (option.type.name === 'codeBlock') {
|
|
143
|
+
var _$from$node;
|
|
144
|
+
var $from = state.selection.$from;
|
|
145
|
+
var grandParentNodeType = (_$from$node = $from.node(-1)) === null || _$from$node === void 0 ? void 0 : _$from$node.type;
|
|
146
|
+
var parentNodeType = $from.parent.type;
|
|
147
|
+
canWrap = (0, _insert.shouldSplitSelectedNodeOnNodeInsertion)({
|
|
148
|
+
parentNodeType: parentNodeType,
|
|
149
|
+
grandParentNodeType: grandParentNodeType,
|
|
150
|
+
content: option.type.createAndFill()
|
|
151
|
+
}) && (0, _insert.contentAllowedInCodeBlock)(state);
|
|
152
|
+
} else {
|
|
153
|
+
canWrap = !!(0, _utils.getWrappingOptions)(state, option.type).wrapping;
|
|
154
|
+
}
|
|
141
155
|
var IconBefore = option.icon;
|
|
142
156
|
return {
|
|
143
157
|
title: formatMessage(option.title),
|
|
144
158
|
icon: /*#__PURE__*/_react.default.createElement(IconBefore, {
|
|
145
|
-
label: ""
|
|
159
|
+
label: "",
|
|
160
|
+
disabled: !canWrap
|
|
146
161
|
}),
|
|
162
|
+
disabled: !canWrap,
|
|
147
163
|
onClick: function onClick(state, dispatch) {
|
|
148
164
|
var _option$command;
|
|
149
165
|
(_option$command = option.command) === null || _option$command === void 0 || _option$command.call(option, _analytics.INPUT_METHOD.FLOATING_TB)(state, dispatch);
|
|
@@ -8,14 +8,10 @@ exports.DropDownButton = void 0;
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
var _react2 = require("@emotion/react");
|
|
10
10
|
var _keymaps = require("@atlaskit/editor-common/keymaps");
|
|
11
|
-
var _styles = require("@atlaskit/editor-common/styles");
|
|
12
11
|
var _uiMenu = require("@atlaskit/editor-common/ui-menu");
|
|
13
12
|
var _addEditorAdd = _interopRequireDefault(require("@atlaskit/icon/core/migration/add--editor-add"));
|
|
14
|
-
var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/
|
|
15
|
-
var
|
|
16
|
-
var _chevronDown2 = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
|
|
17
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
18
|
-
var _styles2 = require("./styles");
|
|
13
|
+
var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
|
|
14
|
+
var _styles = require("./styles");
|
|
19
15
|
/**
|
|
20
16
|
* @jsxRuntime classic
|
|
21
17
|
* @jsx jsx
|
|
@@ -27,25 +23,15 @@ var DropDownButtonIcon = /*#__PURE__*/_react.default.memo(function (props) {
|
|
|
27
23
|
return (
|
|
28
24
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
29
25
|
(0, _react2.jsx)("span", {
|
|
30
|
-
css:
|
|
31
|
-
}, (0,
|
|
26
|
+
css: _styles.triggerWrapper
|
|
27
|
+
}, (0, _react2.jsx)(_addEditorAdd.default, {
|
|
32
28
|
label: props.label,
|
|
33
|
-
color: "currentColor"
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
}), (0, _platformFeatureFlags.fg)('platform_editor_migration_icon_and_typography') ?
|
|
37
|
-
//eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
38
|
-
(0, _react2.jsx)("span", {
|
|
39
|
-
css: _styles2.expandWrapperStyle
|
|
40
|
-
}, (0, _react2.jsx)(_chevronDown2.default, {
|
|
29
|
+
color: "currentColor",
|
|
30
|
+
spacing: "spacious"
|
|
31
|
+
}), (0, _react2.jsx)("span", null, (0, _react2.jsx)(_chevronDown.default, {
|
|
41
32
|
label: "",
|
|
42
|
-
color: "currentColor"
|
|
43
|
-
|
|
44
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
45
|
-
(0, _react2.jsx)("span", {
|
|
46
|
-
css: _styles.expandIconWrapperStyle
|
|
47
|
-
}, (0, _react2.jsx)(_chevronDown.default, {
|
|
48
|
-
label: ""
|
|
33
|
+
color: "currentColor",
|
|
34
|
+
LEGACY_margin: "0 0 0 -8px"
|
|
49
35
|
})))
|
|
50
36
|
);
|
|
51
37
|
});
|
|
@@ -15,32 +15,19 @@ var _calendarEditorDate = _interopRequireDefault(require("@atlaskit/icon/core/mi
|
|
|
15
15
|
var _checkboxCheckedEditorTask = _interopRequireDefault(require("@atlaskit/icon/core/migration/checkbox-checked--editor-task"));
|
|
16
16
|
var _decisionEditorDecision = _interopRequireDefault(require("@atlaskit/icon/core/migration/decision--editor-decision"));
|
|
17
17
|
var _emojiEditorEmoji = _interopRequireDefault(require("@atlaskit/icon/core/migration/emoji--editor-emoji"));
|
|
18
|
+
var _gridEditorTable = _interopRequireDefault(require("@atlaskit/icon/core/migration/grid--editor-table"));
|
|
18
19
|
var _imageEditorImage = _interopRequireDefault(require("@atlaskit/icon/core/migration/image--editor-image"));
|
|
19
20
|
var _informationEditorInfo = _interopRequireDefault(require("@atlaskit/icon/core/migration/information--editor-info"));
|
|
20
21
|
var _linkEditorLink = _interopRequireDefault(require("@atlaskit/icon/core/migration/link--editor-link"));
|
|
21
22
|
var _mentionEditorMention = _interopRequireDefault(require("@atlaskit/icon/core/migration/mention--editor-mention"));
|
|
22
23
|
var _quotationMarkQuote = _interopRequireDefault(require("@atlaskit/icon/core/migration/quotation-mark--quote"));
|
|
23
24
|
var _showMoreHorizontalEditorMore = _interopRequireDefault(require("@atlaskit/icon/core/migration/show-more-horizontal--editor-more"));
|
|
24
|
-
var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
|
|
25
|
-
var _chevronRightCircle = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-right-circle"));
|
|
26
|
-
var _code = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/code"));
|
|
27
|
-
var _date = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/date"));
|
|
28
|
-
var _decision = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/decision"));
|
|
29
|
-
var _emoji = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/emoji"));
|
|
30
25
|
var _horizontalRule = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/horizontal-rule"));
|
|
31
|
-
var _image = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/image"));
|
|
32
|
-
var _info = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/info"));
|
|
33
26
|
var _layoutTwoEqual = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/layout-two-equal"));
|
|
34
|
-
var _link = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/link"));
|
|
35
|
-
var _mention = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/mention"));
|
|
36
|
-
var _more = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/more"));
|
|
37
|
-
var _table = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/table"));
|
|
38
|
-
var _task = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/task"));
|
|
39
27
|
var _text = _interopRequireDefault(require("@atlaskit/icon/glyph/media-services/text"));
|
|
40
|
-
var _quote = _interopRequireDefault(require("@atlaskit/icon/glyph/quote"));
|
|
41
28
|
var _status = _interopRequireDefault(require("@atlaskit/icon/glyph/status"));
|
|
42
|
-
var
|
|
43
|
-
var
|
|
29
|
+
var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
|
|
30
|
+
var _chevronRightChevronRightCircle = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-right--chevron-right-circle"));
|
|
44
31
|
var _shallowEquals = require("./shallow-equals");
|
|
45
32
|
/**
|
|
46
33
|
* @jsxRuntime classic
|
|
@@ -57,7 +44,9 @@ var from = function from(init) {
|
|
|
57
44
|
name: init.name
|
|
58
45
|
},
|
|
59
46
|
elemBefore: (0, _react2.jsx)(init.Icon, {
|
|
60
|
-
label: ""
|
|
47
|
+
label: "",
|
|
48
|
+
color: "currentColor",
|
|
49
|
+
spacing: "spacious"
|
|
61
50
|
}),
|
|
62
51
|
elemAfter: init.shortcut ?
|
|
63
52
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
@@ -81,7 +70,7 @@ var action = exports.action = mem(function (init) {
|
|
|
81
70
|
disabled: init.disabled,
|
|
82
71
|
name: 'action',
|
|
83
72
|
shortcut: '[]',
|
|
84
|
-
Icon:
|
|
73
|
+
Icon: _checkboxCheckedEditorTask.default,
|
|
85
74
|
'aria-keyshortcuts': '[ ] Space'
|
|
86
75
|
});
|
|
87
76
|
});
|
|
@@ -92,7 +81,7 @@ var link = exports.link = mem(function (init) {
|
|
|
92
81
|
disabled: init.disabled,
|
|
93
82
|
name: 'link',
|
|
94
83
|
shortcut: (0, _keymaps.tooltip)(_keymaps.addLink),
|
|
95
|
-
Icon:
|
|
84
|
+
Icon: _linkEditorLink.default,
|
|
96
85
|
'aria-haspopup': init['aria-haspopup'],
|
|
97
86
|
'aria-keyshortcuts': (0, _keymaps.getAriaKeyshortcuts)(_keymaps.addLink)
|
|
98
87
|
});
|
|
@@ -103,7 +92,7 @@ var media = exports.media = mem(function (init) {
|
|
|
103
92
|
tooltipDescription: init.tooltipDescription,
|
|
104
93
|
disabled: init.disabled,
|
|
105
94
|
name: 'media',
|
|
106
|
-
Icon:
|
|
95
|
+
Icon: _imageEditorImage.default
|
|
107
96
|
});
|
|
108
97
|
});
|
|
109
98
|
var imageUpload = exports.imageUpload = mem(function (init) {
|
|
@@ -112,7 +101,7 @@ var imageUpload = exports.imageUpload = mem(function (init) {
|
|
|
112
101
|
tooltipDescription: init.tooltipDescription,
|
|
113
102
|
disabled: init.disabled,
|
|
114
103
|
name: 'image upload',
|
|
115
|
-
Icon:
|
|
104
|
+
Icon: _imageEditorImage.default
|
|
116
105
|
});
|
|
117
106
|
});
|
|
118
107
|
var mention = exports.mention = mem(function (init) {
|
|
@@ -121,7 +110,7 @@ var mention = exports.mention = mem(function (init) {
|
|
|
121
110
|
tooltipDescription: init.tooltipDescription,
|
|
122
111
|
disabled: init.disabled,
|
|
123
112
|
name: 'mention',
|
|
124
|
-
Icon:
|
|
113
|
+
Icon: _mentionEditorMention.default,
|
|
125
114
|
shortcut: '@',
|
|
126
115
|
'aria-haspopup': init['aria-haspopup'],
|
|
127
116
|
'aria-keyshortcuts': 'Shift+2 Space'
|
|
@@ -133,7 +122,7 @@ var emoji = exports.emoji = mem(function (init) {
|
|
|
133
122
|
tooltipDescription: init.tooltipDescription,
|
|
134
123
|
disabled: init.disabled,
|
|
135
124
|
name: 'emoji',
|
|
136
|
-
Icon:
|
|
125
|
+
Icon: _emojiEditorEmoji.default,
|
|
137
126
|
shortcut: ':',
|
|
138
127
|
'aria-haspopup': init['aria-haspopup'],
|
|
139
128
|
'aria-keyshortcuts': 'Shift+;'
|
|
@@ -145,7 +134,7 @@ var table = exports.table = mem(function (init) {
|
|
|
145
134
|
tooltipDescription: init.tooltipDescription,
|
|
146
135
|
disabled: init.disabled,
|
|
147
136
|
name: 'table',
|
|
148
|
-
Icon:
|
|
137
|
+
Icon: _gridEditorTable.default,
|
|
149
138
|
shortcut: (0, _keymaps.tooltip)(_keymaps.toggleTable),
|
|
150
139
|
'aria-keyshortcuts': (0, _keymaps.getAriaKeyshortcuts)(_keymaps.toggleTable)
|
|
151
140
|
});
|
|
@@ -156,12 +145,12 @@ var tableSelector = exports.tableSelector = mem(function (init) {
|
|
|
156
145
|
tooltipDescription: init.tooltipDescription,
|
|
157
146
|
disabled: init.disabled,
|
|
158
147
|
name: 'table selector',
|
|
159
|
-
Icon:
|
|
160
|
-
return (0, _react2.jsx)(
|
|
148
|
+
Icon: function Icon() {
|
|
149
|
+
return (0, _react2.jsx)(_chevronDown.default, {
|
|
161
150
|
label: "",
|
|
162
151
|
color: "currentColor"
|
|
163
152
|
});
|
|
164
|
-
}
|
|
153
|
+
}
|
|
165
154
|
});
|
|
166
155
|
});
|
|
167
156
|
var layout = exports.layout = mem(function (init) {
|
|
@@ -179,7 +168,7 @@ var codeblock = exports.codeblock = mem(function (init) {
|
|
|
179
168
|
tooltipDescription: init.tooltipDescription,
|
|
180
169
|
disabled: init.disabled,
|
|
181
170
|
name: 'codeblock',
|
|
182
|
-
Icon:
|
|
171
|
+
Icon: _angleBracketsEditorCode.default,
|
|
183
172
|
shortcut: init.shortcut,
|
|
184
173
|
'aria-keyshortcuts': (0, _keymaps.getAriaKeyshortcuts)(init.shortcut)
|
|
185
174
|
});
|
|
@@ -190,7 +179,7 @@ var panel = exports.panel = mem(function (init) {
|
|
|
190
179
|
tooltipDescription: init.tooltipDescription,
|
|
191
180
|
disabled: init.disabled,
|
|
192
181
|
name: 'panel',
|
|
193
|
-
Icon:
|
|
182
|
+
Icon: _informationEditorInfo.default,
|
|
194
183
|
shortcut: init.shortcut,
|
|
195
184
|
'aria-keyshortcuts': (0, _keymaps.getAriaKeyshortcuts)(init.shortcut)
|
|
196
185
|
});
|
|
@@ -201,7 +190,7 @@ var blockquote = exports.blockquote = mem(function (init) {
|
|
|
201
190
|
tooltipDescription: init.tooltipDescription,
|
|
202
191
|
disabled: init.disabled,
|
|
203
192
|
name: 'blockquote',
|
|
204
|
-
Icon:
|
|
193
|
+
Icon: _quotationMarkQuote.default,
|
|
205
194
|
shortcut: init.shortcut,
|
|
206
195
|
'aria-keyshortcuts': 'Shift+. Space'
|
|
207
196
|
});
|
|
@@ -212,7 +201,7 @@ var decision = exports.decision = mem(function (init) {
|
|
|
212
201
|
tooltipDescription: init.tooltipDescription,
|
|
213
202
|
disabled: init.disabled,
|
|
214
203
|
name: 'decision',
|
|
215
|
-
Icon:
|
|
204
|
+
Icon: _decisionEditorDecision.default,
|
|
216
205
|
shortcut: '<>',
|
|
217
206
|
'aria-keyshortcuts': 'Shift+, Shift+. Space'
|
|
218
207
|
});
|
|
@@ -234,7 +223,7 @@ var expand = exports.expand = mem(function (init) {
|
|
|
234
223
|
tooltipDescription: init.tooltipDescription,
|
|
235
224
|
disabled: init.disabled,
|
|
236
225
|
name: 'expand',
|
|
237
|
-
Icon:
|
|
226
|
+
Icon: _chevronRightChevronRightCircle.default
|
|
238
227
|
});
|
|
239
228
|
});
|
|
240
229
|
var date = exports.date = mem(function (init) {
|
|
@@ -243,7 +232,7 @@ var date = exports.date = mem(function (init) {
|
|
|
243
232
|
tooltipDescription: init.tooltipDescription,
|
|
244
233
|
disabled: init.disabled,
|
|
245
234
|
name: 'date',
|
|
246
|
-
Icon:
|
|
235
|
+
Icon: _calendarEditorDate.default,
|
|
247
236
|
shortcut: '//',
|
|
248
237
|
'aria-keyshortcuts': '/ / Enter'
|
|
249
238
|
});
|
|
@@ -277,11 +266,9 @@ var more = exports.more = mem(function (init) {
|
|
|
277
266
|
disabled: init.disabled,
|
|
278
267
|
name: 'macro',
|
|
279
268
|
Icon: function Icon() {
|
|
280
|
-
return (0,
|
|
269
|
+
return (0, _react2.jsx)(_showMoreHorizontalEditorMore.default, {
|
|
281
270
|
label: "",
|
|
282
271
|
color: "currentColor"
|
|
283
|
-
}) : (0, _react2.jsx)(_more.default, {
|
|
284
|
-
label: ""
|
|
285
272
|
});
|
|
286
273
|
}
|
|
287
274
|
});
|
|
@@ -10,21 +10,25 @@ var _code = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/code"));
|
|
|
10
10
|
var _info = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/info"));
|
|
11
11
|
var _quote = _interopRequireDefault(require("@atlaskit/icon/glyph/quote"));
|
|
12
12
|
var _expand = _interopRequireDefault(require("../assets/expand"));
|
|
13
|
-
var transformationOptions = exports.transformationOptions = function transformationOptions(api) {
|
|
13
|
+
var transformationOptions = exports.transformationOptions = function transformationOptions(api, schema) {
|
|
14
14
|
var _api$panel, _api$expand, _api$codeBlock, _api$blockType;
|
|
15
15
|
return [{
|
|
16
|
+
type: schema.nodes.panel,
|
|
16
17
|
title: _messages.blockTypeMessages.panel,
|
|
17
18
|
icon: _info.default,
|
|
18
19
|
command: api === null || api === void 0 || (_api$panel = api.panel) === null || _api$panel === void 0 ? void 0 : _api$panel.actions.insertPanel
|
|
19
20
|
}, {
|
|
21
|
+
type: schema.nodes.expand,
|
|
20
22
|
title: _messages.toolbarInsertBlockMessages.expand,
|
|
21
23
|
icon: _expand.default,
|
|
22
24
|
command: api === null || api === void 0 || (_api$expand = api.expand) === null || _api$expand === void 0 ? void 0 : _api$expand.actions.insertExpandWithInputMethod
|
|
23
25
|
}, {
|
|
26
|
+
type: schema.nodes.codeBlock,
|
|
24
27
|
title: _messages.blockTypeMessages.codeblock,
|
|
25
28
|
icon: _code.default,
|
|
26
29
|
command: api === null || api === void 0 || (_api$codeBlock = api.codeBlock) === null || _api$codeBlock === void 0 ? void 0 : _api$codeBlock.actions.insertCodeBlock
|
|
27
30
|
}, {
|
|
31
|
+
type: schema.nodes.blockquote,
|
|
28
32
|
title: _messages.blockTypeMessages.blockquote,
|
|
29
33
|
icon: _quote.default,
|
|
30
34
|
command: api === null || api === void 0 || (_api$blockType = api.blockType) === null || _api$blockType === void 0 ? void 0 : _api$blockType.actions.insertBlockQuote
|
|
@@ -11,7 +11,9 @@ const iconContainer = css({
|
|
|
11
11
|
width: '24px',
|
|
12
12
|
height: '24px'
|
|
13
13
|
});
|
|
14
|
-
export default function ExpandIcon(
|
|
14
|
+
export default function ExpandIcon({
|
|
15
|
+
disabled
|
|
16
|
+
}) {
|
|
15
17
|
return jsx("span", {
|
|
16
18
|
css: iconContainer
|
|
17
19
|
}, jsx("svg", {
|
|
@@ -22,11 +24,11 @@ export default function ExpandIcon() {
|
|
|
22
24
|
fill: "none"
|
|
23
25
|
}, jsx("path", {
|
|
24
26
|
d: "M2 2V14H16V2H2ZM2 0H16C16.5304 0 17.0391 0.210714 17.4142 0.585786C17.7893 0.960859 18 1.46957 18 2V14C18 14.5304 17.7893 15.0391 17.4142 15.4142C17.0391 15.7893 16.5304 16 16 16H2C1.46957 16 0.960859 15.7893 0.585786 15.4142C0.210714 15.0391 0 14.5304 0 14V2C0 1.46957 0.210714 0.960859 0.585786 0.585786C0.960859 0.210714 1.46957 0 2 0Z",
|
|
25
|
-
fill: "var(--ds-icon, #44546F)"
|
|
27
|
+
fill: disabled ? "var(--ds-icon-disabled, #B3B9C4)" : "var(--ds-icon, #44546F)"
|
|
26
28
|
}), jsx("path", {
|
|
27
29
|
fillRule: "evenodd",
|
|
28
30
|
clipRule: "evenodd",
|
|
29
31
|
d: "M5.29158 6.29294C5.10477 6.48183 5 6.73678 5 7.00244C5 7.2681 5.10477 7.52305 5.29158 7.71194L8.23058 10.6769C8.44858 10.8919 8.73058 10.9989 9.00958 10.9989C9.28858 10.9989 9.56558 10.8919 9.77858 10.6769L12.7086 7.72194C12.8951 7.53292 12.9998 7.27803 12.9998 7.01244C12.9998 6.74686 12.8951 6.49196 12.7086 6.30294C12.6167 6.20976 12.5073 6.13576 12.3866 6.08525C12.2659 6.03474 12.1364 6.00873 12.0056 6.00873C11.8748 6.00873 11.7452 6.03474 11.6245 6.08525C11.5039 6.13576 11.3944 6.20976 11.3026 6.30294L9.00458 8.61994L6.69758 6.29294C6.60554 6.20012 6.49604 6.12644 6.37538 6.07617C6.25472 6.02589 6.1253 6 5.99458 6C5.86386 6 5.73444 6.02589 5.61378 6.07617C5.49312 6.12644 5.38362 6.20012 5.29158 6.29294Z",
|
|
30
|
-
fill: "var(--ds-icon, #44546F)"
|
|
32
|
+
fill: disabled ? "var(--ds-icon-disabled, #B3B9C4)" : "var(--ds-icon, #44546F)"
|
|
31
33
|
})));
|
|
32
34
|
}
|
|
@@ -1,23 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
* @jsx jsx
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
7
|
+
import { css, jsx } from '@emotion/react';
|
|
8
|
+
import RefreshIcon from '@atlaskit/icon/glyph/refresh';
|
|
9
|
+
const iconStyle = css({
|
|
10
|
+
transform: 'rotate(-90deg)'
|
|
11
|
+
});
|
|
3
12
|
export default function SwitchIcon() {
|
|
4
|
-
return
|
|
13
|
+
return jsx("span", {
|
|
14
|
+
css: iconStyle
|
|
15
|
+
}, jsx(RefreshIcon, {
|
|
5
16
|
label: ""
|
|
6
|
-
}, /*#__PURE__*/React.createElement("path", {
|
|
7
|
-
d: "M6.003 16H8.998C9.26322 16 9.51757 15.8947 9.70511 15.7071C9.89264 15.5196 9.998 15.2652 9.998 15C9.998 14.7348 9.89264 14.4805 9.70511 14.2929C9.51757 14.1054 9.26322 14 8.998 14H5.102C4.494 14 4 14.493 4 15.1V19C4 19.2656 4.10551 19.5204 4.29333 19.7082C4.48115 19.896 4.73589 20.0015 5.0015 20.0015C5.26711 20.0015 5.52185 19.896 5.70967 19.7082C5.89748 19.5204 6.003 19.2656 6.003 19V16Z",
|
|
8
|
-
fill: "var(--ds-icon, #44546F)"
|
|
9
|
-
}), /*#__PURE__*/React.createElement("path", {
|
|
10
|
-
d: "M18.018 14.572C16.989 16.649 14.807 18 12.37 18C10.104 18 8.051 16.833 6.945 14.98C6.659 14.5 6.023 14.334 5.524 14.609C5.40677 14.6709 5.30331 14.7559 5.21991 14.8589C5.13651 14.9619 5.0749 15.0808 5.0388 15.2083C5.00271 15.3359 4.99289 15.4694 5.00994 15.6009C5.027 15.7323 5.07056 15.8589 5.138 15.973C6.611 18.443 9.35 20 12.37 20C15.618 20 18.528 18.198 19.899 15.43C20.146 14.932 19.925 14.335 19.406 14.098C18.886 13.861 18.265 14.073 18.018 14.572Z",
|
|
11
|
-
fill: "var(--ds-icon, #44546F)"
|
|
12
|
-
}), /*#__PURE__*/React.createElement("path", {
|
|
13
|
-
fillRule: "evenodd",
|
|
14
|
-
clipRule: "evenodd",
|
|
15
|
-
d: "M15.002 10L18.898 10C19.506 10 20 9.50703 20 8.90003V5.00003C20 4.73441 19.8945 4.47968 19.7067 4.29186C19.5188 4.10404 19.2641 3.99853 18.9985 3.99853C18.7329 3.99853 18.4782 4.10404 18.2903 4.29186C18.1025 4.47968 17.997 4.73441 17.997 5.00003V8.00003H15.002C14.7368 8.00003 14.4824 8.10538 14.2949 8.29292C14.1074 8.48046 14.002 8.73481 14.002 9.00003C14.002 9.26524 14.1074 9.5196 14.2949 9.70713C14.4824 9.89467 14.7368 10 15.002 10Z",
|
|
16
|
-
fill: "var(--ds-icon, #44546F)"
|
|
17
|
-
}), /*#__PURE__*/React.createElement("path", {
|
|
18
|
-
fillRule: "evenodd",
|
|
19
|
-
clipRule: "evenodd",
|
|
20
|
-
d: "M4.596 9.90303C5.116 10.14 5.736 9.92803 5.983 9.42903C7.012 7.35203 9.193 6.00103 11.63 6.00103C13.896 6.00103 15.95 7.16803 17.055 9.02203C17.1988 9.25438 17.4265 9.42245 17.6909 9.49135C17.9553 9.56024 18.2361 9.52468 18.475 9.39203C18.975 9.11803 19.148 8.50703 18.862 8.02803C17.389 5.55803 14.65 4.00103 11.63 4.00103C8.382 4.00103 5.472 5.80303 4.102 8.57103C4.03537 8.70353 4.00045 8.84971 4 8.99803C4.00188 9.1902 4.05909 9.37775 4.16479 9.53825C4.27049 9.69875 4.4202 9.8254 4.596 9.90303Z",
|
|
21
|
-
fill: "var(--ds-icon, #44546F)"
|
|
22
17
|
}));
|
|
23
18
|
}
|
package/dist/es2019/plugin.js
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import React, { useLayoutEffect } from 'react';
|
|
2
2
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
3
3
|
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
4
|
+
import { contentAllowedInCodeBlock, shouldSplitSelectedNodeOnNodeInsertion } from '@atlaskit/editor-common/insert';
|
|
4
5
|
import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
|
|
5
6
|
import { WithProviders } from '@atlaskit/editor-common/provider-factory';
|
|
6
7
|
import { ToolbarSize } from '@atlaskit/editor-common/types';
|
|
8
|
+
import { getWrappingOptions } from '@atlaskit/editor-common/utils';
|
|
7
9
|
import { BLOCK_QUOTE, CODE_BLOCK, PANEL } from '@atlaskit/editor-plugin-block-type/consts';
|
|
8
10
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
9
11
|
import SwitchIcon from './assets/switch';
|
|
@@ -115,14 +117,8 @@ export const insertBlockPlugin = ({
|
|
|
115
117
|
// Experiment one-pager: https://hello.atlassian.net/wiki/spaces/ETM/pages/3931754727/Experiment+Elements+Basic+Text+Transformations
|
|
116
118
|
selectionToolbar: (state, intl) => {
|
|
117
119
|
var _api$featureFlags, _api$featureFlags$sha;
|
|
118
|
-
const
|
|
119
|
-
|
|
120
|
-
$from
|
|
121
|
-
}
|
|
122
|
-
} = state;
|
|
123
|
-
const isEligible =
|
|
124
|
-
// basicTextTransformations is used to present AI enablement status to avoid adding editor props
|
|
125
|
-
(api === null || api === void 0 ? void 0 : (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : (_api$featureFlags$sha = _api$featureFlags.sharedState.currentState()) === null || _api$featureFlags$sha === void 0 ? void 0 : _api$featureFlags$sha.basicTextTransformations) && $from.depth === 1;
|
|
120
|
+
const isEligible = // basicTextTransformations is used to present AI enablement status to avoid adding editor props
|
|
121
|
+
api === null || api === void 0 ? void 0 : (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : (_api$featureFlags$sha = _api$featureFlags.sharedState.currentState()) === null || _api$featureFlags$sha === void 0 ? void 0 : _api$featureFlags$sha.basicTextTransformations;
|
|
126
122
|
if (!isEligible) {
|
|
127
123
|
return;
|
|
128
124
|
}
|
|
@@ -132,13 +128,31 @@ export const insertBlockPlugin = ({
|
|
|
132
128
|
const {
|
|
133
129
|
formatMessage
|
|
134
130
|
} = intl;
|
|
135
|
-
const options = transformationOptions(api).map(option => {
|
|
131
|
+
const options = transformationOptions(api, state.schema).map(option => {
|
|
132
|
+
let canWrap;
|
|
133
|
+
if (option.type.name === 'codeBlock') {
|
|
134
|
+
var _$from$node;
|
|
135
|
+
const {
|
|
136
|
+
$from
|
|
137
|
+
} = state.selection;
|
|
138
|
+
const grandParentNodeType = (_$from$node = $from.node(-1)) === null || _$from$node === void 0 ? void 0 : _$from$node.type;
|
|
139
|
+
const parentNodeType = $from.parent.type;
|
|
140
|
+
canWrap = shouldSplitSelectedNodeOnNodeInsertion({
|
|
141
|
+
parentNodeType,
|
|
142
|
+
grandParentNodeType,
|
|
143
|
+
content: option.type.createAndFill()
|
|
144
|
+
}) && contentAllowedInCodeBlock(state);
|
|
145
|
+
} else {
|
|
146
|
+
canWrap = !!getWrappingOptions(state, option.type).wrapping;
|
|
147
|
+
}
|
|
136
148
|
const IconBefore = option.icon;
|
|
137
149
|
return {
|
|
138
150
|
title: formatMessage(option.title),
|
|
139
151
|
icon: /*#__PURE__*/React.createElement(IconBefore, {
|
|
140
|
-
label: ""
|
|
152
|
+
label: "",
|
|
153
|
+
disabled: !canWrap
|
|
141
154
|
}),
|
|
155
|
+
disabled: !canWrap,
|
|
142
156
|
onClick: (state, dispatch) => {
|
|
143
157
|
var _option$command;
|
|
144
158
|
(_option$command = option.command) === null || _option$command === void 0 ? void 0 : _option$command.call(option, INPUT_METHOD.FLOATING_TB)(state, dispatch);
|
|
@@ -7,36 +7,22 @@ import React from 'react';
|
|
|
7
7
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
8
8
|
import { jsx } from '@emotion/react';
|
|
9
9
|
import { ToolTipContent } from '@atlaskit/editor-common/keymaps';
|
|
10
|
-
import { expandIconWrapperStyle } from '@atlaskit/editor-common/styles';
|
|
11
10
|
import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
|
|
12
11
|
import AddIcon from '@atlaskit/icon/core/migration/add--editor-add';
|
|
13
|
-
import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
|
|
14
|
-
import { default as AddIconLegacy } from '@atlaskit/icon/glyph/editor/add';
|
|
15
12
|
import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
|
|
16
|
-
import {
|
|
17
|
-
import { expandWrapperStyle, triggerWrapper } from './styles';
|
|
13
|
+
import { triggerWrapper } from './styles';
|
|
18
14
|
const DropDownButtonIcon = /*#__PURE__*/React.memo(props =>
|
|
19
15
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
20
16
|
jsx("span", {
|
|
21
17
|
css: triggerWrapper
|
|
22
|
-
},
|
|
18
|
+
}, jsx(AddIcon, {
|
|
23
19
|
label: props.label,
|
|
24
|
-
color: "currentColor"
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
}), fg('platform_editor_migration_icon_and_typography') ?
|
|
28
|
-
//eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
29
|
-
jsx("span", {
|
|
30
|
-
css: expandWrapperStyle
|
|
31
|
-
}, jsx(ChevronDownIcon, {
|
|
20
|
+
color: "currentColor",
|
|
21
|
+
spacing: "spacious"
|
|
22
|
+
}), jsx("span", null, jsx(ChevronDownIcon, {
|
|
32
23
|
label: "",
|
|
33
|
-
color: "currentColor"
|
|
34
|
-
|
|
35
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
36
|
-
jsx("span", {
|
|
37
|
-
css: expandIconWrapperStyle
|
|
38
|
-
}, jsx(ExpandIcon, {
|
|
39
|
-
label: ""
|
|
24
|
+
color: "currentColor",
|
|
25
|
+
LEGACY_margin: "0 0 0 -8px"
|
|
40
26
|
}))));
|
|
41
27
|
export const DropDownButton = /*#__PURE__*/React.memo(props => jsx(ToolbarButton, {
|
|
42
28
|
ref: props.handleRef,
|