@atlaskit/editor-plugin-insert-block 2.4.29 → 2.4.31
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 +14 -0
- package/dist/cjs/ui/ToolbarInsertBlock/index.js +97 -95
- package/dist/cjs/ui/ToolbarInsertBlock/table-selector-popup.js +1 -0
- package/dist/es2019/ui/ToolbarInsertBlock/index.js +98 -93
- package/dist/es2019/ui/ToolbarInsertBlock/table-selector-popup.js +1 -0
- package/dist/esm/ui/ToolbarInsertBlock/index.js +98 -93
- package/dist/esm/ui/ToolbarInsertBlock/table-selector-popup.js +1 -0
- package/package.json +13 -13
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-insert-block
|
|
2
2
|
|
|
3
|
+
## 2.4.31
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 2.4.30
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#100162](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100162)
|
|
14
|
+
[`e80e57fc37719`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e80e57fc37719) -
|
|
15
|
+
[ux] ED-26089: Add 4px gap to main nav bar items
|
|
16
|
+
|
|
3
17
|
## 2.4.29
|
|
4
18
|
|
|
5
19
|
### Patch Changes
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
@@ -26,13 +25,15 @@ var _uiMenu = require("@atlaskit/editor-common/ui-menu");
|
|
|
26
25
|
var _uiReact = require("@atlaskit/editor-common/ui-react");
|
|
27
26
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
28
27
|
var _picker = require("@atlaskit/emoji/picker");
|
|
29
|
-
var
|
|
28
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
29
|
+
var _colors = require("@atlaskit/theme/colors");
|
|
30
30
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
31
31
|
var _commands = require("../../pm-plugins/commands");
|
|
32
32
|
var _blockInsertMenu = require("./block-insert-menu");
|
|
33
33
|
var _createItems3 = require("./create-items");
|
|
34
34
|
var _tableSelectorPopupWithListeners = _interopRequireDefault(require("./table-selector-popup-with-listeners"));
|
|
35
35
|
var _templateObject;
|
|
36
|
+
/* eslint-disable @atlaskit/ui-styling-standard/no-imported-style-values */
|
|
36
37
|
/**
|
|
37
38
|
* @jsxRuntime classic
|
|
38
39
|
* @jsx jsx
|
|
@@ -42,8 +43,6 @@ var _templateObject;
|
|
|
42
43
|
// eslint-disable-next-line import/no-namespace
|
|
43
44
|
// Ignored via go/ees005
|
|
44
45
|
// eslint-disable-next-line import/no-named-as-default
|
|
45
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
46
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
47
46
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
|
|
48
47
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
49
48
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
@@ -61,7 +60,7 @@ var TABLE_SELECTOR_STRING = 'table selector';
|
|
|
61
60
|
|
|
62
61
|
// TODO: Jenga team will create a component for a split button using this css
|
|
63
62
|
var getHoverStyles = function getHoverStyles(selector) {
|
|
64
|
-
return "&:hover ".concat(selector, " {\n background: ", "var(--ds-background-neutral-subtle-hovered, ".concat(
|
|
63
|
+
return "&:hover ".concat(selector, " {\n background: ", "var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N20A, ")"), ";\n\n &:hover {\n background: ", "var(--ds-background-neutral-hovered, ".concat(_colors.N30A, ")"), ";\n }\n }");
|
|
65
64
|
};
|
|
66
65
|
var EmojiPicker = function EmojiPicker(props) {
|
|
67
66
|
var setOutsideClickTargetRef = _react.default.useContext(_uiReact.OutsideClickTargetRefContext);
|
|
@@ -735,97 +734,100 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
|
|
|
735
734
|
_iterator.f();
|
|
736
735
|
}
|
|
737
736
|
var isFullPageAppearance = ['full-page', 'full-width'].includes(editorAppearance !== null && editorAppearance !== void 0 ? editorAppearance : '');
|
|
738
|
-
return (
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
title: btn.title,
|
|
753
|
-
"aria-label": btn['aria-label'],
|
|
754
|
-
"aria-haspopup": btn['aria-haspopup'],
|
|
755
|
-
"aria-keyshortcuts": btn['aria-keyshortcuts'],
|
|
756
|
-
onItemClick: _this3.insertToolbarMenuItem
|
|
757
|
-
});
|
|
758
|
-
}), this.props.tableSelectorSupported && (isTableButtonVisible || isTableSizeVisible) && (0, _react2.jsx)("div", {
|
|
759
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
760
|
-
css: tableButtonWrapper({
|
|
761
|
-
isTableSelectorOpen: isTableSelectorOpen,
|
|
762
|
-
isButtonDisabled: (_tableButton = tableButton) === null || _tableButton === void 0 ? void 0 : _tableButton.isDisabled
|
|
763
|
-
})
|
|
764
|
-
}, isTableButtonVisible && (0, _react2.jsx)(_uiMenu.ToolbarButton
|
|
765
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
766
|
-
, {
|
|
767
|
-
className: "table-toolbar-btn",
|
|
768
|
-
item: tableButton,
|
|
769
|
-
ref: this.tableButtonRef,
|
|
770
|
-
testId: String((_tableButton2 = tableButton) === null || _tableButton2 === void 0 ? void 0 : _tableButton2.content),
|
|
771
|
-
key: (_tableButton3 = tableButton) === null || _tableButton3 === void 0 ? void 0 : _tableButton3.value.name,
|
|
772
|
-
spacing: isReducedSpacing ? 'none' : 'default',
|
|
773
|
-
disabled: isDisabled || ((_tableButton4 = tableButton) === null || _tableButton4 === void 0 ? void 0 : _tableButton4.isDisabled),
|
|
774
|
-
iconBefore: (_tableButton5 = tableButton) === null || _tableButton5 === void 0 ? void 0 : _tableButton5.elemBefore,
|
|
775
|
-
selected: ((_tableButton6 = tableButton) === null || _tableButton6 === void 0 ? void 0 : _tableButton6.isActive) || isTableSelectorOpen,
|
|
776
|
-
title: (_tableButton7 = tableButton) === null || _tableButton7 === void 0 ? void 0 : _tableButton7.title,
|
|
777
|
-
"aria-label": tableButton ? tableButton['aria-label'] : undefined,
|
|
778
|
-
"aria-haspopup": tableButton ? tableButton['aria-haspopup'] : undefined,
|
|
779
|
-
"aria-keyshortcuts": tableButton ? tableButton['aria-keyshortcuts'] : undefined,
|
|
780
|
-
onItemClick: this.insertToolbarMenuItem
|
|
781
|
-
}), isTableButtonVisible && (0, _react2.jsx)(_uiMenu.ToolbarButton
|
|
782
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
783
|
-
, {
|
|
784
|
-
className: "table-selector-toolbar-btn",
|
|
785
|
-
item: tableSelectorButton,
|
|
786
|
-
testId: String((_tableSelectorButton = tableSelectorButton) === null || _tableSelectorButton === void 0 ? void 0 : _tableSelectorButton.content),
|
|
787
|
-
key: (_tableSelectorButton2 = tableSelectorButton) === null || _tableSelectorButton2 === void 0 ? void 0 : _tableSelectorButton2.value.name,
|
|
788
|
-
ref: this.tableSelectorButtonRef,
|
|
737
|
+
return (0, _react2.jsx)("span", {
|
|
738
|
+
css:
|
|
739
|
+
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration, @atlaskit/platform/ensure-feature-flag-prefix
|
|
740
|
+
(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ?
|
|
741
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
|
|
742
|
+
_styles.buttonGroupStyle :
|
|
743
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
744
|
+
_styles.buttonGroupStyleBeforeVisualRefresh
|
|
745
|
+
}, toolbarButtons.map(function (btn) {
|
|
746
|
+
return (0, _react2.jsx)(_uiMenu.ToolbarButton, {
|
|
747
|
+
item: btn,
|
|
748
|
+
testId: String(btn.content),
|
|
749
|
+
ref: _this3.handleToolbarRef(btn.value.name),
|
|
750
|
+
key: btn.value.name,
|
|
789
751
|
spacing: isReducedSpacing ? 'none' : 'default',
|
|
790
|
-
disabled: isDisabled ||
|
|
791
|
-
iconBefore:
|
|
792
|
-
selected:
|
|
793
|
-
title:
|
|
794
|
-
"aria-label":
|
|
795
|
-
"aria-haspopup":
|
|
796
|
-
"aria-keyshortcuts":
|
|
797
|
-
onItemClick:
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
752
|
+
disabled: isDisabled || btn.isDisabled,
|
|
753
|
+
iconBefore: btn.elemBefore,
|
|
754
|
+
selected: btn.value.name === 'emoji' && emojiPickerOpen || btn.isActive,
|
|
755
|
+
title: btn.title,
|
|
756
|
+
"aria-label": btn['aria-label'],
|
|
757
|
+
"aria-haspopup": btn['aria-haspopup'],
|
|
758
|
+
"aria-keyshortcuts": btn['aria-keyshortcuts'],
|
|
759
|
+
onItemClick: _this3.insertToolbarMenuItem
|
|
760
|
+
});
|
|
761
|
+
}), this.props.tableSelectorSupported && (isTableButtonVisible || isTableSizeVisible) && (0, _react2.jsx)("div", {
|
|
762
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
763
|
+
css: tableButtonWrapper({
|
|
764
|
+
isTableSelectorOpen: isTableSelectorOpen,
|
|
765
|
+
isButtonDisabled: (_tableButton = tableButton) === null || _tableButton === void 0 ? void 0 : _tableButton.isDisabled
|
|
766
|
+
})
|
|
767
|
+
}, isTableButtonVisible && (0, _react2.jsx)(_uiMenu.ToolbarButton
|
|
768
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
|
|
769
|
+
, {
|
|
770
|
+
className: "table-toolbar-btn",
|
|
771
|
+
item: tableButton,
|
|
772
|
+
ref: this.tableButtonRef,
|
|
773
|
+
testId: String((_tableButton2 = tableButton) === null || _tableButton2 === void 0 ? void 0 : _tableButton2.content),
|
|
774
|
+
key: (_tableButton3 = tableButton) === null || _tableButton3 === void 0 ? void 0 : _tableButton3.value.name,
|
|
775
|
+
spacing: isReducedSpacing ? 'none' : 'default',
|
|
776
|
+
disabled: isDisabled || ((_tableButton4 = tableButton) === null || _tableButton4 === void 0 ? void 0 : _tableButton4.isDisabled),
|
|
777
|
+
iconBefore: (_tableButton5 = tableButton) === null || _tableButton5 === void 0 ? void 0 : _tableButton5.elemBefore,
|
|
778
|
+
selected: ((_tableButton6 = tableButton) === null || _tableButton6 === void 0 ? void 0 : _tableButton6.isActive) || isTableSelectorOpen,
|
|
779
|
+
title: (_tableButton7 = tableButton) === null || _tableButton7 === void 0 ? void 0 : _tableButton7.title,
|
|
780
|
+
"aria-label": tableButton ? tableButton['aria-label'] : undefined,
|
|
781
|
+
"aria-haspopup": tableButton ? tableButton['aria-haspopup'] : undefined,
|
|
782
|
+
"aria-keyshortcuts": tableButton ? tableButton['aria-keyshortcuts'] : undefined,
|
|
783
|
+
onItemClick: this.insertToolbarMenuItem
|
|
784
|
+
}), isTableButtonVisible && (0, _react2.jsx)(_uiMenu.ToolbarButton
|
|
785
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
|
|
786
|
+
, {
|
|
787
|
+
className: "table-selector-toolbar-btn",
|
|
788
|
+
item: tableSelectorButton,
|
|
789
|
+
testId: String((_tableSelectorButton = tableSelectorButton) === null || _tableSelectorButton === void 0 ? void 0 : _tableSelectorButton.content),
|
|
790
|
+
key: (_tableSelectorButton2 = tableSelectorButton) === null || _tableSelectorButton2 === void 0 ? void 0 : _tableSelectorButton2.value.name,
|
|
791
|
+
ref: this.tableSelectorButtonRef,
|
|
792
|
+
spacing: isReducedSpacing ? 'none' : 'default',
|
|
793
|
+
disabled: isDisabled || ((_tableSelectorButton3 = tableSelectorButton) === null || _tableSelectorButton3 === void 0 ? void 0 : _tableSelectorButton3.isDisabled),
|
|
794
|
+
iconBefore: (_tableSelectorButton4 = tableSelectorButton) === null || _tableSelectorButton4 === void 0 ? void 0 : _tableSelectorButton4.elemBefore,
|
|
795
|
+
selected: ((_tableSelectorButton5 = tableSelectorButton) === null || _tableSelectorButton5 === void 0 ? void 0 : _tableSelectorButton5.isActive) || isTableSelectorOpen,
|
|
796
|
+
title: (_tableSelectorButton6 = tableSelectorButton) === null || _tableSelectorButton6 === void 0 ? void 0 : _tableSelectorButton6.title,
|
|
797
|
+
"aria-label": tableSelectorButton ? tableSelectorButton['aria-label'] : undefined,
|
|
798
|
+
"aria-haspopup": tableSelectorButton ? tableSelectorButton['aria-haspopup'] : undefined,
|
|
799
|
+
"aria-keyshortcuts": tableSelectorButton ? tableSelectorButton['aria-keyshortcuts'] : undefined,
|
|
800
|
+
onItemClick: this.insertToolbarMenuItem,
|
|
801
|
+
onKeyDown: this.handleTableSelectorOpenByKeyboard
|
|
802
|
+
})), (0, _react2.jsx)("span", {
|
|
803
|
+
css: _styles.wrapperStyle
|
|
804
|
+
}, this.renderPopup(), this.renderTableSelectorPopup(), (0, _react2.jsx)(_blockInsertMenu.BlockInsertMenu, {
|
|
805
|
+
popupsMountPoint: this.props.popupsMountPoint,
|
|
806
|
+
popupsBoundariesElement: this.props.popupsBoundariesElement,
|
|
807
|
+
popupsScrollableElement: this.props.popupsScrollableElement,
|
|
808
|
+
disabled: (_this$props$isDisable = this.props.isDisabled) !== null && _this$props$isDisable !== void 0 ? _this$props$isDisable : false,
|
|
809
|
+
editorView: this.props.editorView,
|
|
810
|
+
spacing: this.props.isReducedSpacing ? 'none' : 'default',
|
|
811
|
+
label: this.props.intl.formatMessage(_messages.toolbarInsertBlockMessages.insertMenu),
|
|
812
|
+
open: (0, _experiments.editorExperiment)('insert-menu-in-right-rail', true) ? !isFullPageAppearance && this.state.isPlusMenuOpen : this.state.isPlusMenuOpen,
|
|
813
|
+
plusButtonRef: (_this$plusButtonRef = this.plusButtonRef) === null || _this$plusButtonRef === void 0 ? void 0 : _this$plusButtonRef.deref(),
|
|
814
|
+
items: this.state.dropdownItems,
|
|
815
|
+
onRef: this.handleDropDownButtonRef,
|
|
816
|
+
onPlusButtonRef: this.handlePlusButtonRef,
|
|
817
|
+
onClick: this.handleClick,
|
|
818
|
+
onKeyDown: this.handleOpenByKeyboard,
|
|
819
|
+
onItemActivated: this.insertInsertMenuItem,
|
|
820
|
+
onInsert: this.insertInsertMenuItem,
|
|
821
|
+
onOpenChange: this.onOpenChange,
|
|
822
|
+
togglePlusMenuVisibility: this.togglePlusMenuVisibility,
|
|
823
|
+
showElementBrowserLink: this.props.showElementBrowserLink || false,
|
|
824
|
+
pluginInjectionApi: this.props.pluginInjectionApi,
|
|
825
|
+
isFullPageAppearance: isFullPageAppearance
|
|
826
|
+
})), !((_this$props$pluginInj3 = this.props.pluginInjectionApi) !== null && _this$props$pluginInj3 !== void 0 && _this$props$pluginInj3.primaryToolbar) && this.props.showSeparator && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */
|
|
827
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
828
|
+
(0, _react2.jsx)("span", {
|
|
829
|
+
css: _styles.separatorStyles
|
|
830
|
+
}));
|
|
829
831
|
}
|
|
830
832
|
}], [{
|
|
831
833
|
key: "getDerivedStateFromProps",
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
/* eslint-disable @atlaskit/ui-styling-standard/no-imported-style-values */
|
|
3
4
|
/**
|
|
4
5
|
* @jsxRuntime classic
|
|
5
6
|
* @jsx jsx
|
|
@@ -11,7 +12,7 @@ import { css, jsx } from '@emotion/react';
|
|
|
11
12
|
import { injectIntl } from 'react-intl-next';
|
|
12
13
|
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
13
14
|
import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
|
|
14
|
-
import { buttonGroupStyle, separatorStyles, wrapperStyle } from '@atlaskit/editor-common/styles';
|
|
15
|
+
import { buttonGroupStyle, buttonGroupStyleBeforeVisualRefresh, separatorStyles, wrapperStyle } from '@atlaskit/editor-common/styles';
|
|
15
16
|
import { Popup } from '@atlaskit/editor-common/ui';
|
|
16
17
|
import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
|
|
17
18
|
import { OutsideClickTargetRefContext, withReactEditorViewOuterListeners as withOuterListeners } from '@atlaskit/editor-common/ui-react';
|
|
@@ -19,7 +20,8 @@ import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
|
|
|
19
20
|
import { EmojiPicker as AkEmojiPicker } from '@atlaskit/emoji/picker';
|
|
20
21
|
// Ignored via go/ees005
|
|
21
22
|
// eslint-disable-next-line import/no-namespace
|
|
22
|
-
import
|
|
23
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
24
|
+
import { N20A, N30A } from '@atlaskit/theme/colors';
|
|
23
25
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
24
26
|
import { toggleInsertMenuRightRail } from '../../pm-plugins/commands';
|
|
25
27
|
import { BlockInsertMenu } from './block-insert-menu';
|
|
@@ -35,10 +37,10 @@ const TABLE_SELECTOR_STRING = 'table selector';
|
|
|
35
37
|
|
|
36
38
|
// TODO: Jenga team will create a component for a split button using this css
|
|
37
39
|
const getHoverStyles = selector => `&:hover ${selector} {
|
|
38
|
-
background: ${`var(--ds-background-neutral-subtle-hovered, ${
|
|
40
|
+
background: ${`var(--ds-background-neutral-subtle-hovered, ${N20A})`};
|
|
39
41
|
|
|
40
42
|
&:hover {
|
|
41
|
-
background: ${`var(--ds-background-neutral-hovered, ${
|
|
43
|
+
background: ${`var(--ds-background-neutral-hovered, ${N30A})`};
|
|
42
44
|
}
|
|
43
45
|
}`;
|
|
44
46
|
const EmojiPicker = props => {
|
|
@@ -771,97 +773,100 @@ export class ToolbarInsertBlock extends React.PureComponent {
|
|
|
771
773
|
}
|
|
772
774
|
}
|
|
773
775
|
const isFullPageAppearance = ['full-page', 'full-width'].includes(editorAppearance !== null && editorAppearance !== void 0 ? editorAppearance : '');
|
|
774
|
-
return (
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
title: btn.title,
|
|
789
|
-
"aria-label": btn['aria-label'],
|
|
790
|
-
"aria-haspopup": btn['aria-haspopup'],
|
|
791
|
-
"aria-keyshortcuts": btn['aria-keyshortcuts'],
|
|
792
|
-
onItemClick: this.insertToolbarMenuItem
|
|
793
|
-
});
|
|
794
|
-
}), this.props.tableSelectorSupported && (isTableButtonVisible || isTableSizeVisible) && jsx("div", {
|
|
795
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
796
|
-
css: tableButtonWrapper({
|
|
797
|
-
isTableSelectorOpen,
|
|
798
|
-
isButtonDisabled: (_tableButton = tableButton) === null || _tableButton === void 0 ? void 0 : _tableButton.isDisabled
|
|
799
|
-
})
|
|
800
|
-
}, isTableButtonVisible && jsx(ToolbarButton
|
|
801
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
802
|
-
, {
|
|
803
|
-
className: "table-toolbar-btn",
|
|
804
|
-
item: tableButton,
|
|
805
|
-
ref: this.tableButtonRef,
|
|
806
|
-
testId: String((_tableButton2 = tableButton) === null || _tableButton2 === void 0 ? void 0 : _tableButton2.content),
|
|
807
|
-
key: (_tableButton3 = tableButton) === null || _tableButton3 === void 0 ? void 0 : _tableButton3.value.name,
|
|
776
|
+
return jsx("span", {
|
|
777
|
+
css:
|
|
778
|
+
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration, @atlaskit/platform/ensure-feature-flag-prefix
|
|
779
|
+
fg('platform-visual-refresh-icons') ?
|
|
780
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
|
|
781
|
+
buttonGroupStyle :
|
|
782
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
783
|
+
buttonGroupStyleBeforeVisualRefresh
|
|
784
|
+
}, toolbarButtons.map(btn => {
|
|
785
|
+
return jsx(ToolbarButton, {
|
|
786
|
+
item: btn,
|
|
787
|
+
testId: String(btn.content),
|
|
788
|
+
ref: this.handleToolbarRef(btn.value.name),
|
|
789
|
+
key: btn.value.name,
|
|
808
790
|
spacing: isReducedSpacing ? 'none' : 'default',
|
|
809
|
-
disabled: isDisabled ||
|
|
810
|
-
iconBefore:
|
|
811
|
-
selected:
|
|
812
|
-
title:
|
|
813
|
-
"aria-label":
|
|
814
|
-
"aria-haspopup":
|
|
815
|
-
"aria-keyshortcuts":
|
|
791
|
+
disabled: isDisabled || btn.isDisabled,
|
|
792
|
+
iconBefore: btn.elemBefore,
|
|
793
|
+
selected: btn.value.name === 'emoji' && emojiPickerOpen || btn.isActive,
|
|
794
|
+
title: btn.title,
|
|
795
|
+
"aria-label": btn['aria-label'],
|
|
796
|
+
"aria-haspopup": btn['aria-haspopup'],
|
|
797
|
+
"aria-keyshortcuts": btn['aria-keyshortcuts'],
|
|
816
798
|
onItemClick: this.insertToolbarMenuItem
|
|
817
|
-
})
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
864
|
-
|
|
799
|
+
});
|
|
800
|
+
}), this.props.tableSelectorSupported && (isTableButtonVisible || isTableSizeVisible) && jsx("div", {
|
|
801
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
802
|
+
css: tableButtonWrapper({
|
|
803
|
+
isTableSelectorOpen,
|
|
804
|
+
isButtonDisabled: (_tableButton = tableButton) === null || _tableButton === void 0 ? void 0 : _tableButton.isDisabled
|
|
805
|
+
})
|
|
806
|
+
}, isTableButtonVisible && jsx(ToolbarButton
|
|
807
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
|
|
808
|
+
, {
|
|
809
|
+
className: "table-toolbar-btn",
|
|
810
|
+
item: tableButton,
|
|
811
|
+
ref: this.tableButtonRef,
|
|
812
|
+
testId: String((_tableButton2 = tableButton) === null || _tableButton2 === void 0 ? void 0 : _tableButton2.content),
|
|
813
|
+
key: (_tableButton3 = tableButton) === null || _tableButton3 === void 0 ? void 0 : _tableButton3.value.name,
|
|
814
|
+
spacing: isReducedSpacing ? 'none' : 'default',
|
|
815
|
+
disabled: isDisabled || ((_tableButton4 = tableButton) === null || _tableButton4 === void 0 ? void 0 : _tableButton4.isDisabled),
|
|
816
|
+
iconBefore: (_tableButton5 = tableButton) === null || _tableButton5 === void 0 ? void 0 : _tableButton5.elemBefore,
|
|
817
|
+
selected: ((_tableButton6 = tableButton) === null || _tableButton6 === void 0 ? void 0 : _tableButton6.isActive) || isTableSelectorOpen,
|
|
818
|
+
title: (_tableButton7 = tableButton) === null || _tableButton7 === void 0 ? void 0 : _tableButton7.title,
|
|
819
|
+
"aria-label": tableButton ? tableButton['aria-label'] : undefined,
|
|
820
|
+
"aria-haspopup": tableButton ? tableButton['aria-haspopup'] : undefined,
|
|
821
|
+
"aria-keyshortcuts": tableButton ? tableButton['aria-keyshortcuts'] : undefined,
|
|
822
|
+
onItemClick: this.insertToolbarMenuItem
|
|
823
|
+
}), isTableButtonVisible && jsx(ToolbarButton
|
|
824
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
|
|
825
|
+
, {
|
|
826
|
+
className: "table-selector-toolbar-btn",
|
|
827
|
+
item: tableSelectorButton,
|
|
828
|
+
testId: String((_tableSelectorButton = tableSelectorButton) === null || _tableSelectorButton === void 0 ? void 0 : _tableSelectorButton.content),
|
|
829
|
+
key: (_tableSelectorButton2 = tableSelectorButton) === null || _tableSelectorButton2 === void 0 ? void 0 : _tableSelectorButton2.value.name,
|
|
830
|
+
ref: this.tableSelectorButtonRef,
|
|
831
|
+
spacing: isReducedSpacing ? 'none' : 'default',
|
|
832
|
+
disabled: isDisabled || ((_tableSelectorButton3 = tableSelectorButton) === null || _tableSelectorButton3 === void 0 ? void 0 : _tableSelectorButton3.isDisabled),
|
|
833
|
+
iconBefore: (_tableSelectorButton4 = tableSelectorButton) === null || _tableSelectorButton4 === void 0 ? void 0 : _tableSelectorButton4.elemBefore,
|
|
834
|
+
selected: ((_tableSelectorButton5 = tableSelectorButton) === null || _tableSelectorButton5 === void 0 ? void 0 : _tableSelectorButton5.isActive) || isTableSelectorOpen,
|
|
835
|
+
title: (_tableSelectorButton6 = tableSelectorButton) === null || _tableSelectorButton6 === void 0 ? void 0 : _tableSelectorButton6.title,
|
|
836
|
+
"aria-label": tableSelectorButton ? tableSelectorButton['aria-label'] : undefined,
|
|
837
|
+
"aria-haspopup": tableSelectorButton ? tableSelectorButton['aria-haspopup'] : undefined,
|
|
838
|
+
"aria-keyshortcuts": tableSelectorButton ? tableSelectorButton['aria-keyshortcuts'] : undefined,
|
|
839
|
+
onItemClick: this.insertToolbarMenuItem,
|
|
840
|
+
onKeyDown: this.handleTableSelectorOpenByKeyboard
|
|
841
|
+
})), jsx("span", {
|
|
842
|
+
css: wrapperStyle
|
|
843
|
+
}, this.renderPopup(), this.renderTableSelectorPopup(), jsx(BlockInsertMenu, {
|
|
844
|
+
popupsMountPoint: this.props.popupsMountPoint,
|
|
845
|
+
popupsBoundariesElement: this.props.popupsBoundariesElement,
|
|
846
|
+
popupsScrollableElement: this.props.popupsScrollableElement,
|
|
847
|
+
disabled: (_this$props$isDisable = this.props.isDisabled) !== null && _this$props$isDisable !== void 0 ? _this$props$isDisable : false,
|
|
848
|
+
editorView: this.props.editorView,
|
|
849
|
+
spacing: this.props.isReducedSpacing ? 'none' : 'default',
|
|
850
|
+
label: this.props.intl.formatMessage(messages.insertMenu),
|
|
851
|
+
open: editorExperiment('insert-menu-in-right-rail', true) ? !isFullPageAppearance && this.state.isPlusMenuOpen : this.state.isPlusMenuOpen,
|
|
852
|
+
plusButtonRef: (_this$plusButtonRef = this.plusButtonRef) === null || _this$plusButtonRef === void 0 ? void 0 : _this$plusButtonRef.deref(),
|
|
853
|
+
items: this.state.dropdownItems,
|
|
854
|
+
onRef: this.handleDropDownButtonRef,
|
|
855
|
+
onPlusButtonRef: this.handlePlusButtonRef,
|
|
856
|
+
onClick: this.handleClick,
|
|
857
|
+
onKeyDown: this.handleOpenByKeyboard,
|
|
858
|
+
onItemActivated: this.insertInsertMenuItem,
|
|
859
|
+
onInsert: this.insertInsertMenuItem,
|
|
860
|
+
onOpenChange: this.onOpenChange,
|
|
861
|
+
togglePlusMenuVisibility: this.togglePlusMenuVisibility,
|
|
862
|
+
showElementBrowserLink: this.props.showElementBrowserLink || false,
|
|
863
|
+
pluginInjectionApi: this.props.pluginInjectionApi,
|
|
864
|
+
isFullPageAppearance: isFullPageAppearance
|
|
865
|
+
})), !((_this$props$pluginInj7 = this.props.pluginInjectionApi) !== null && _this$props$pluginInj7 !== void 0 && _this$props$pluginInj7.primaryToolbar) && this.props.showSeparator && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */
|
|
866
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
867
|
+
jsx("span", {
|
|
868
|
+
css: separatorStyles
|
|
869
|
+
}));
|
|
865
870
|
}
|
|
866
871
|
}
|
|
867
872
|
export default injectIntl(ToolbarInsertBlock);
|
|
@@ -15,6 +15,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
|
|
|
15
15
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
16
16
|
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
|
|
17
17
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
18
|
+
/* eslint-disable @atlaskit/ui-styling-standard/no-imported-style-values */
|
|
18
19
|
/**
|
|
19
20
|
* @jsxRuntime classic
|
|
20
21
|
* @jsx jsx
|
|
@@ -26,7 +27,7 @@ import { css, jsx } from '@emotion/react';
|
|
|
26
27
|
import { injectIntl } from 'react-intl-next';
|
|
27
28
|
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
28
29
|
import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
|
|
29
|
-
import { buttonGroupStyle, separatorStyles, wrapperStyle } from '@atlaskit/editor-common/styles';
|
|
30
|
+
import { buttonGroupStyle, buttonGroupStyleBeforeVisualRefresh, separatorStyles, wrapperStyle } from '@atlaskit/editor-common/styles';
|
|
30
31
|
import { Popup } from '@atlaskit/editor-common/ui';
|
|
31
32
|
import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
|
|
32
33
|
import { OutsideClickTargetRefContext, withReactEditorViewOuterListeners as withOuterListeners } from '@atlaskit/editor-common/ui-react';
|
|
@@ -34,7 +35,8 @@ import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
|
|
|
34
35
|
import { EmojiPicker as AkEmojiPicker } from '@atlaskit/emoji/picker';
|
|
35
36
|
// Ignored via go/ees005
|
|
36
37
|
// eslint-disable-next-line import/no-namespace
|
|
37
|
-
import
|
|
38
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
39
|
+
import { N20A, N30A } from '@atlaskit/theme/colors';
|
|
38
40
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
39
41
|
import { toggleInsertMenuRightRail } from '../../pm-plugins/commands';
|
|
40
42
|
import { BlockInsertMenu } from './block-insert-menu';
|
|
@@ -52,7 +54,7 @@ var TABLE_SELECTOR_STRING = 'table selector';
|
|
|
52
54
|
|
|
53
55
|
// TODO: Jenga team will create a component for a split button using this css
|
|
54
56
|
var getHoverStyles = function getHoverStyles(selector) {
|
|
55
|
-
return "&:hover ".concat(selector, " {\n background: ", "var(--ds-background-neutral-subtle-hovered, ".concat(
|
|
57
|
+
return "&:hover ".concat(selector, " {\n background: ", "var(--ds-background-neutral-subtle-hovered, ".concat(N20A, ")"), ";\n\n &:hover {\n background: ", "var(--ds-background-neutral-hovered, ".concat(N30A, ")"), ";\n }\n }");
|
|
56
58
|
};
|
|
57
59
|
var EmojiPicker = function EmojiPicker(props) {
|
|
58
60
|
var setOutsideClickTargetRef = React.useContext(OutsideClickTargetRefContext);
|
|
@@ -726,97 +728,100 @@ export var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
726
728
|
_iterator.f();
|
|
727
729
|
}
|
|
728
730
|
var isFullPageAppearance = ['full-page', 'full-width'].includes(editorAppearance !== null && editorAppearance !== void 0 ? editorAppearance : '');
|
|
729
|
-
return (
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
title: btn.title,
|
|
744
|
-
"aria-label": btn['aria-label'],
|
|
745
|
-
"aria-haspopup": btn['aria-haspopup'],
|
|
746
|
-
"aria-keyshortcuts": btn['aria-keyshortcuts'],
|
|
747
|
-
onItemClick: _this3.insertToolbarMenuItem
|
|
748
|
-
});
|
|
749
|
-
}), this.props.tableSelectorSupported && (isTableButtonVisible || isTableSizeVisible) && jsx("div", {
|
|
750
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
751
|
-
css: tableButtonWrapper({
|
|
752
|
-
isTableSelectorOpen: isTableSelectorOpen,
|
|
753
|
-
isButtonDisabled: (_tableButton = tableButton) === null || _tableButton === void 0 ? void 0 : _tableButton.isDisabled
|
|
754
|
-
})
|
|
755
|
-
}, isTableButtonVisible && jsx(ToolbarButton
|
|
756
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
757
|
-
, {
|
|
758
|
-
className: "table-toolbar-btn",
|
|
759
|
-
item: tableButton,
|
|
760
|
-
ref: this.tableButtonRef,
|
|
761
|
-
testId: String((_tableButton2 = tableButton) === null || _tableButton2 === void 0 ? void 0 : _tableButton2.content),
|
|
762
|
-
key: (_tableButton3 = tableButton) === null || _tableButton3 === void 0 ? void 0 : _tableButton3.value.name,
|
|
763
|
-
spacing: isReducedSpacing ? 'none' : 'default',
|
|
764
|
-
disabled: isDisabled || ((_tableButton4 = tableButton) === null || _tableButton4 === void 0 ? void 0 : _tableButton4.isDisabled),
|
|
765
|
-
iconBefore: (_tableButton5 = tableButton) === null || _tableButton5 === void 0 ? void 0 : _tableButton5.elemBefore,
|
|
766
|
-
selected: ((_tableButton6 = tableButton) === null || _tableButton6 === void 0 ? void 0 : _tableButton6.isActive) || isTableSelectorOpen,
|
|
767
|
-
title: (_tableButton7 = tableButton) === null || _tableButton7 === void 0 ? void 0 : _tableButton7.title,
|
|
768
|
-
"aria-label": tableButton ? tableButton['aria-label'] : undefined,
|
|
769
|
-
"aria-haspopup": tableButton ? tableButton['aria-haspopup'] : undefined,
|
|
770
|
-
"aria-keyshortcuts": tableButton ? tableButton['aria-keyshortcuts'] : undefined,
|
|
771
|
-
onItemClick: this.insertToolbarMenuItem
|
|
772
|
-
}), isTableButtonVisible && jsx(ToolbarButton
|
|
773
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
774
|
-
, {
|
|
775
|
-
className: "table-selector-toolbar-btn",
|
|
776
|
-
item: tableSelectorButton,
|
|
777
|
-
testId: String((_tableSelectorButton = tableSelectorButton) === null || _tableSelectorButton === void 0 ? void 0 : _tableSelectorButton.content),
|
|
778
|
-
key: (_tableSelectorButton2 = tableSelectorButton) === null || _tableSelectorButton2 === void 0 ? void 0 : _tableSelectorButton2.value.name,
|
|
779
|
-
ref: this.tableSelectorButtonRef,
|
|
731
|
+
return jsx("span", {
|
|
732
|
+
css:
|
|
733
|
+
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration, @atlaskit/platform/ensure-feature-flag-prefix
|
|
734
|
+
fg('platform-visual-refresh-icons') ?
|
|
735
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
|
|
736
|
+
buttonGroupStyle :
|
|
737
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
738
|
+
buttonGroupStyleBeforeVisualRefresh
|
|
739
|
+
}, toolbarButtons.map(function (btn) {
|
|
740
|
+
return jsx(ToolbarButton, {
|
|
741
|
+
item: btn,
|
|
742
|
+
testId: String(btn.content),
|
|
743
|
+
ref: _this3.handleToolbarRef(btn.value.name),
|
|
744
|
+
key: btn.value.name,
|
|
780
745
|
spacing: isReducedSpacing ? 'none' : 'default',
|
|
781
|
-
disabled: isDisabled ||
|
|
782
|
-
iconBefore:
|
|
783
|
-
selected:
|
|
784
|
-
title:
|
|
785
|
-
"aria-label":
|
|
786
|
-
"aria-haspopup":
|
|
787
|
-
"aria-keyshortcuts":
|
|
788
|
-
onItemClick:
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
746
|
+
disabled: isDisabled || btn.isDisabled,
|
|
747
|
+
iconBefore: btn.elemBefore,
|
|
748
|
+
selected: btn.value.name === 'emoji' && emojiPickerOpen || btn.isActive,
|
|
749
|
+
title: btn.title,
|
|
750
|
+
"aria-label": btn['aria-label'],
|
|
751
|
+
"aria-haspopup": btn['aria-haspopup'],
|
|
752
|
+
"aria-keyshortcuts": btn['aria-keyshortcuts'],
|
|
753
|
+
onItemClick: _this3.insertToolbarMenuItem
|
|
754
|
+
});
|
|
755
|
+
}), this.props.tableSelectorSupported && (isTableButtonVisible || isTableSizeVisible) && jsx("div", {
|
|
756
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
757
|
+
css: tableButtonWrapper({
|
|
758
|
+
isTableSelectorOpen: isTableSelectorOpen,
|
|
759
|
+
isButtonDisabled: (_tableButton = tableButton) === null || _tableButton === void 0 ? void 0 : _tableButton.isDisabled
|
|
760
|
+
})
|
|
761
|
+
}, isTableButtonVisible && jsx(ToolbarButton
|
|
762
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
|
|
763
|
+
, {
|
|
764
|
+
className: "table-toolbar-btn",
|
|
765
|
+
item: tableButton,
|
|
766
|
+
ref: this.tableButtonRef,
|
|
767
|
+
testId: String((_tableButton2 = tableButton) === null || _tableButton2 === void 0 ? void 0 : _tableButton2.content),
|
|
768
|
+
key: (_tableButton3 = tableButton) === null || _tableButton3 === void 0 ? void 0 : _tableButton3.value.name,
|
|
769
|
+
spacing: isReducedSpacing ? 'none' : 'default',
|
|
770
|
+
disabled: isDisabled || ((_tableButton4 = tableButton) === null || _tableButton4 === void 0 ? void 0 : _tableButton4.isDisabled),
|
|
771
|
+
iconBefore: (_tableButton5 = tableButton) === null || _tableButton5 === void 0 ? void 0 : _tableButton5.elemBefore,
|
|
772
|
+
selected: ((_tableButton6 = tableButton) === null || _tableButton6 === void 0 ? void 0 : _tableButton6.isActive) || isTableSelectorOpen,
|
|
773
|
+
title: (_tableButton7 = tableButton) === null || _tableButton7 === void 0 ? void 0 : _tableButton7.title,
|
|
774
|
+
"aria-label": tableButton ? tableButton['aria-label'] : undefined,
|
|
775
|
+
"aria-haspopup": tableButton ? tableButton['aria-haspopup'] : undefined,
|
|
776
|
+
"aria-keyshortcuts": tableButton ? tableButton['aria-keyshortcuts'] : undefined,
|
|
777
|
+
onItemClick: this.insertToolbarMenuItem
|
|
778
|
+
}), isTableButtonVisible && jsx(ToolbarButton
|
|
779
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
|
|
780
|
+
, {
|
|
781
|
+
className: "table-selector-toolbar-btn",
|
|
782
|
+
item: tableSelectorButton,
|
|
783
|
+
testId: String((_tableSelectorButton = tableSelectorButton) === null || _tableSelectorButton === void 0 ? void 0 : _tableSelectorButton.content),
|
|
784
|
+
key: (_tableSelectorButton2 = tableSelectorButton) === null || _tableSelectorButton2 === void 0 ? void 0 : _tableSelectorButton2.value.name,
|
|
785
|
+
ref: this.tableSelectorButtonRef,
|
|
786
|
+
spacing: isReducedSpacing ? 'none' : 'default',
|
|
787
|
+
disabled: isDisabled || ((_tableSelectorButton3 = tableSelectorButton) === null || _tableSelectorButton3 === void 0 ? void 0 : _tableSelectorButton3.isDisabled),
|
|
788
|
+
iconBefore: (_tableSelectorButton4 = tableSelectorButton) === null || _tableSelectorButton4 === void 0 ? void 0 : _tableSelectorButton4.elemBefore,
|
|
789
|
+
selected: ((_tableSelectorButton5 = tableSelectorButton) === null || _tableSelectorButton5 === void 0 ? void 0 : _tableSelectorButton5.isActive) || isTableSelectorOpen,
|
|
790
|
+
title: (_tableSelectorButton6 = tableSelectorButton) === null || _tableSelectorButton6 === void 0 ? void 0 : _tableSelectorButton6.title,
|
|
791
|
+
"aria-label": tableSelectorButton ? tableSelectorButton['aria-label'] : undefined,
|
|
792
|
+
"aria-haspopup": tableSelectorButton ? tableSelectorButton['aria-haspopup'] : undefined,
|
|
793
|
+
"aria-keyshortcuts": tableSelectorButton ? tableSelectorButton['aria-keyshortcuts'] : undefined,
|
|
794
|
+
onItemClick: this.insertToolbarMenuItem,
|
|
795
|
+
onKeyDown: this.handleTableSelectorOpenByKeyboard
|
|
796
|
+
})), jsx("span", {
|
|
797
|
+
css: wrapperStyle
|
|
798
|
+
}, this.renderPopup(), this.renderTableSelectorPopup(), jsx(BlockInsertMenu, {
|
|
799
|
+
popupsMountPoint: this.props.popupsMountPoint,
|
|
800
|
+
popupsBoundariesElement: this.props.popupsBoundariesElement,
|
|
801
|
+
popupsScrollableElement: this.props.popupsScrollableElement,
|
|
802
|
+
disabled: (_this$props$isDisable = this.props.isDisabled) !== null && _this$props$isDisable !== void 0 ? _this$props$isDisable : false,
|
|
803
|
+
editorView: this.props.editorView,
|
|
804
|
+
spacing: this.props.isReducedSpacing ? 'none' : 'default',
|
|
805
|
+
label: this.props.intl.formatMessage(messages.insertMenu),
|
|
806
|
+
open: editorExperiment('insert-menu-in-right-rail', true) ? !isFullPageAppearance && this.state.isPlusMenuOpen : this.state.isPlusMenuOpen,
|
|
807
|
+
plusButtonRef: (_this$plusButtonRef = this.plusButtonRef) === null || _this$plusButtonRef === void 0 ? void 0 : _this$plusButtonRef.deref(),
|
|
808
|
+
items: this.state.dropdownItems,
|
|
809
|
+
onRef: this.handleDropDownButtonRef,
|
|
810
|
+
onPlusButtonRef: this.handlePlusButtonRef,
|
|
811
|
+
onClick: this.handleClick,
|
|
812
|
+
onKeyDown: this.handleOpenByKeyboard,
|
|
813
|
+
onItemActivated: this.insertInsertMenuItem,
|
|
814
|
+
onInsert: this.insertInsertMenuItem,
|
|
815
|
+
onOpenChange: this.onOpenChange,
|
|
816
|
+
togglePlusMenuVisibility: this.togglePlusMenuVisibility,
|
|
817
|
+
showElementBrowserLink: this.props.showElementBrowserLink || false,
|
|
818
|
+
pluginInjectionApi: this.props.pluginInjectionApi,
|
|
819
|
+
isFullPageAppearance: isFullPageAppearance
|
|
820
|
+
})), !((_this$props$pluginInj3 = this.props.pluginInjectionApi) !== null && _this$props$pluginInj3 !== void 0 && _this$props$pluginInj3.primaryToolbar) && this.props.showSeparator && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */
|
|
821
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
822
|
+
jsx("span", {
|
|
823
|
+
css: separatorStyles
|
|
824
|
+
}));
|
|
820
825
|
}
|
|
821
826
|
}], [{
|
|
822
827
|
key: "getDerivedStateFromProps",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-insert-block",
|
|
3
|
-
"version": "2.4.
|
|
3
|
+
"version": "2.4.31",
|
|
4
4
|
"description": "Insert block plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@atlaskit/button": "^20.3.0",
|
|
35
|
-
"@atlaskit/editor-common": "^
|
|
35
|
+
"@atlaskit/editor-common": "^99.0.0",
|
|
36
36
|
"@atlaskit/editor-plugin-analytics": "^1.10.0",
|
|
37
37
|
"@atlaskit/editor-plugin-block-type": "^4.1.0",
|
|
38
38
|
"@atlaskit/editor-plugin-code-block": "^3.5.0",
|
|
@@ -45,30 +45,30 @@
|
|
|
45
45
|
"@atlaskit/editor-plugin-hyperlink": "^3.2.0",
|
|
46
46
|
"@atlaskit/editor-plugin-image-upload": "^1.2.0",
|
|
47
47
|
"@atlaskit/editor-plugin-layout": "^1.12.0",
|
|
48
|
-
"@atlaskit/editor-plugin-media": "^1.
|
|
49
|
-
"@atlaskit/editor-plugin-media-insert": "^
|
|
50
|
-
"@atlaskit/editor-plugin-mentions": "^2.
|
|
48
|
+
"@atlaskit/editor-plugin-media": "^1.44.0",
|
|
49
|
+
"@atlaskit/editor-plugin-media-insert": "^5.0.0",
|
|
50
|
+
"@atlaskit/editor-plugin-mentions": "^2.11.0",
|
|
51
51
|
"@atlaskit/editor-plugin-panel": "^3.2.0",
|
|
52
52
|
"@atlaskit/editor-plugin-placeholder-text": "^1.9.0",
|
|
53
53
|
"@atlaskit/editor-plugin-primary-toolbar": "^2.1.0",
|
|
54
54
|
"@atlaskit/editor-plugin-quick-insert": "^1.8.0",
|
|
55
55
|
"@atlaskit/editor-plugin-rule": "^1.9.0",
|
|
56
56
|
"@atlaskit/editor-plugin-status": "^2.6.0",
|
|
57
|
-
"@atlaskit/editor-plugin-table": "^9.
|
|
57
|
+
"@atlaskit/editor-plugin-table": "^9.1.0",
|
|
58
58
|
"@atlaskit/editor-plugin-tasks-and-decisions": "^2.12.0",
|
|
59
59
|
"@atlaskit/editor-plugin-type-ahead": "^1.11.0",
|
|
60
60
|
"@atlaskit/editor-prosemirror": "6.2.1",
|
|
61
61
|
"@atlaskit/editor-shared-styles": "^3.2.0",
|
|
62
|
-
"@atlaskit/emoji": "^67.
|
|
63
|
-
"@atlaskit/heading": "4.0.
|
|
64
|
-
"@atlaskit/icon": "^23.
|
|
65
|
-
"@atlaskit/icon-lab": "^2.
|
|
62
|
+
"@atlaskit/emoji": "^67.12.0",
|
|
63
|
+
"@atlaskit/heading": "4.0.1",
|
|
64
|
+
"@atlaskit/icon": "^23.3.0",
|
|
65
|
+
"@atlaskit/icon-lab": "^2.1.0",
|
|
66
66
|
"@atlaskit/platform-feature-flags": "^0.3.0",
|
|
67
67
|
"@atlaskit/primitives": "^13.3.0",
|
|
68
68
|
"@atlaskit/theme": "^14.0.0",
|
|
69
|
-
"@atlaskit/tmp-editor-statsig": "^2.
|
|
70
|
-
"@atlaskit/tokens": "^
|
|
71
|
-
"@atlaskit/tooltip": "19.0.
|
|
69
|
+
"@atlaskit/tmp-editor-statsig": "^2.33.0",
|
|
70
|
+
"@atlaskit/tokens": "^3.0.0",
|
|
71
|
+
"@atlaskit/tooltip": "19.0.1",
|
|
72
72
|
"@babel/runtime": "^7.0.0",
|
|
73
73
|
"@emotion/react": "^11.7.1",
|
|
74
74
|
"bind-event-listener": "^3.0.0",
|