@atlaskit/editor-common 76.25.1 → 76.25.2
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 +9 -0
- package/afm-cc/tsconfig.json +133 -0
- package/dist/cjs/card/LinkToolbarButtonGroup.js +6 -5
- package/dist/cjs/element-browser/ViewMore.js +4 -3
- package/dist/cjs/element-browser/components/CategoryList.js +5 -4
- package/dist/cjs/element-browser/components/ElementBrowserLoader.js +3 -2
- package/dist/cjs/element-browser/components/ElementList/ElementList.js +21 -20
- package/dist/cjs/element-browser/components/ElementList/EmptyState.js +9 -8
- package/dist/cjs/element-browser/components/ElementList/NotFoundIllustration.js +16 -15
- package/dist/cjs/element-browser/components/ElementSearch.js +7 -6
- package/dist/cjs/element-browser/components/StatelessElementBrowser.js +22 -21
- package/dist/cjs/element-browser/hooks/use-container-width.js +3 -2
- package/dist/cjs/keymaps/index.js +2 -1
- package/dist/cjs/link/LinkPicker/HyperlinkAddToolbar/HyperlinkAddToolbar.js +22 -21
- package/dist/cjs/link/LinkSearch/LinkSearchList.js +6 -5
- package/dist/cjs/link/LinkSearch/LinkSearchListItem.js +11 -9
- package/dist/cjs/media-inline/inline-image-wrapper.js +3 -1
- package/dist/cjs/media-inline/media-inline-image-card.js +22 -13
- package/dist/cjs/media-inline/types.js +5 -0
- package/dist/cjs/media-inline/views/error-view.js +6 -3
- package/dist/cjs/media-inline/views/frame.js +4 -1
- package/dist/cjs/media-inline/views/icon-wrapper.js +3 -1
- package/dist/cjs/media-inline/views/loading-view.js +5 -2
- package/dist/cjs/monitoring/error.js +1 -1
- package/dist/cjs/react-node-view/getInlineNodeViewProducer.js +8 -5
- package/dist/cjs/ui/Caption/index.js +3 -2
- package/dist/cjs/ui/DropList/index.js +6 -6
- package/dist/cjs/ui/Expand/index.js +5 -3
- package/dist/cjs/ui/FloatingToolbar/Separator.js +2 -1
- package/dist/cjs/ui/FloatingToolbar/SmallerEditIcon.js +3 -2
- package/dist/cjs/ui/MediaSingle/index.js +5 -2
- package/dist/cjs/ui/MediaSingle/styled.js +3 -2
- package/dist/cjs/ui/Messages/index.js +8 -7
- package/dist/cjs/ui/PanelTextInput/index.js +3 -2
- package/dist/cjs/ui/UnsupportedBlock/index.js +5 -4
- package/dist/cjs/ui/UnsupportedInline/index.js +5 -4
- package/dist/cjs/ui/WidthProvider/index.js +4 -4
- package/dist/cjs/ui-color/ColorPalette/Color/index.js +6 -5
- package/dist/cjs/ui-color/ColorPalette/index.js +6 -3
- package/dist/cjs/ui-menu/ColorPickerButton/index.js +10 -9
- package/dist/cjs/ui-menu/DropdownContainer/index.js +3 -3
- package/dist/cjs/ui-menu/DropdownMenu/index.js +19 -18
- package/dist/cjs/ui-menu/ToolbarArrowKeyNavigationProvider/index.js +3 -2
- package/dist/cjs/ui-menu/ToolbarButton/index.js +4 -3
- package/dist/es2019/card/LinkToolbarButtonGroup.js +7 -6
- package/dist/es2019/element-browser/ViewMore.js +5 -4
- package/dist/es2019/element-browser/components/CategoryList.js +6 -4
- package/dist/es2019/element-browser/components/ElementBrowserLoader.js +4 -3
- package/dist/es2019/element-browser/components/ElementList/ElementList.js +22 -21
- package/dist/es2019/element-browser/components/ElementList/EmptyState.js +10 -9
- package/dist/es2019/element-browser/components/ElementList/NotFoundIllustration.js +17 -16
- package/dist/es2019/element-browser/components/ElementSearch.js +8 -7
- package/dist/es2019/element-browser/components/StatelessElementBrowser.js +23 -22
- package/dist/es2019/element-browser/hooks/use-container-width.js +4 -3
- package/dist/es2019/keymaps/index.js +3 -2
- package/dist/es2019/link/LinkPicker/HyperlinkAddToolbar/HyperlinkAddToolbar.js +24 -22
- package/dist/es2019/link/LinkSearch/LinkSearchList.js +7 -6
- package/dist/es2019/link/LinkSearch/LinkSearchListItem.js +10 -9
- package/dist/es2019/media-inline/inline-image-wrapper.js +4 -2
- package/dist/es2019/media-inline/media-inline-image-card.js +22 -13
- package/dist/es2019/media-inline/types.js +1 -0
- package/dist/es2019/media-inline/views/error-view.js +6 -3
- package/dist/es2019/media-inline/views/frame.js +4 -1
- package/dist/es2019/media-inline/views/icon-wrapper.js +4 -2
- package/dist/es2019/media-inline/views/loading-view.js +5 -2
- package/dist/es2019/monitoring/error.js +1 -1
- package/dist/es2019/react-node-view/getInlineNodeViewProducer.js +7 -5
- package/dist/es2019/ui/Caption/index.js +4 -3
- package/dist/es2019/ui/DropList/index.js +8 -6
- package/dist/es2019/ui/Expand/index.js +5 -3
- package/dist/es2019/ui/FloatingToolbar/Separator.js +3 -2
- package/dist/es2019/ui/FloatingToolbar/SmallerEditIcon.js +4 -3
- package/dist/es2019/ui/MediaSingle/index.js +4 -2
- package/dist/es2019/ui/MediaSingle/styled.js +5 -3
- package/dist/es2019/ui/Messages/index.js +10 -8
- package/dist/es2019/ui/PanelTextInput/index.js +4 -1
- package/dist/es2019/ui/UnsupportedBlock/index.js +6 -5
- package/dist/es2019/ui/UnsupportedInline/index.js +6 -5
- package/dist/es2019/ui/WidthProvider/index.js +5 -4
- package/dist/es2019/ui-color/ColorPalette/Color/index.js +6 -4
- package/dist/es2019/ui-color/ColorPalette/index.js +4 -2
- package/dist/es2019/ui-menu/ColorPickerButton/index.js +11 -10
- package/dist/es2019/ui-menu/DropdownContainer/index.js +3 -2
- package/dist/es2019/ui-menu/DropdownMenu/index.js +21 -19
- package/dist/es2019/ui-menu/ToolbarArrowKeyNavigationProvider/index.js +4 -3
- package/dist/es2019/ui-menu/ToolbarButton/index.js +5 -5
- package/dist/esm/card/LinkToolbarButtonGroup.js +7 -6
- package/dist/esm/element-browser/ViewMore.js +5 -4
- package/dist/esm/element-browser/components/CategoryList.js +7 -5
- package/dist/esm/element-browser/components/ElementBrowserLoader.js +4 -3
- package/dist/esm/element-browser/components/ElementList/ElementList.js +22 -21
- package/dist/esm/element-browser/components/ElementList/EmptyState.js +10 -9
- package/dist/esm/element-browser/components/ElementList/NotFoundIllustration.js +17 -16
- package/dist/esm/element-browser/components/ElementSearch.js +8 -7
- package/dist/esm/element-browser/components/StatelessElementBrowser.js +23 -22
- package/dist/esm/element-browser/hooks/use-container-width.js +4 -3
- package/dist/esm/keymaps/index.js +3 -2
- package/dist/esm/link/LinkPicker/HyperlinkAddToolbar/HyperlinkAddToolbar.js +24 -22
- package/dist/esm/link/LinkSearch/LinkSearchList.js +7 -6
- package/dist/esm/link/LinkSearch/LinkSearchListItem.js +10 -9
- package/dist/esm/media-inline/inline-image-wrapper.js +4 -2
- package/dist/esm/media-inline/media-inline-image-card.js +22 -13
- package/dist/esm/media-inline/types.js +1 -0
- package/dist/esm/media-inline/views/error-view.js +6 -3
- package/dist/esm/media-inline/views/frame.js +4 -1
- package/dist/esm/media-inline/views/icon-wrapper.js +4 -2
- package/dist/esm/media-inline/views/loading-view.js +5 -2
- package/dist/esm/monitoring/error.js +1 -1
- package/dist/esm/react-node-view/getInlineNodeViewProducer.js +7 -5
- package/dist/esm/ui/Caption/index.js +4 -3
- package/dist/esm/ui/DropList/index.js +8 -6
- package/dist/esm/ui/Expand/index.js +5 -3
- package/dist/esm/ui/FloatingToolbar/Separator.js +3 -2
- package/dist/esm/ui/FloatingToolbar/SmallerEditIcon.js +4 -3
- package/dist/esm/ui/MediaSingle/index.js +4 -2
- package/dist/esm/ui/MediaSingle/styled.js +5 -3
- package/dist/esm/ui/Messages/index.js +10 -8
- package/dist/esm/ui/PanelTextInput/index.js +4 -1
- package/dist/esm/ui/UnsupportedBlock/index.js +6 -5
- package/dist/esm/ui/UnsupportedInline/index.js +6 -5
- package/dist/esm/ui/WidthProvider/index.js +5 -4
- package/dist/esm/ui-color/ColorPalette/Color/index.js +6 -4
- package/dist/esm/ui-color/ColorPalette/index.js +5 -3
- package/dist/esm/ui-menu/ColorPickerButton/index.js +11 -10
- package/dist/esm/ui-menu/DropdownContainer/index.js +3 -2
- package/dist/esm/ui-menu/DropdownMenu/index.js +21 -19
- package/dist/esm/ui-menu/ToolbarArrowKeyNavigationProvider/index.js +4 -3
- package/dist/esm/ui-menu/ToolbarButton/index.js +5 -5
- package/dist/types/media-inline/index.d.ts +1 -0
- package/dist/types/media-inline/media-inline-image-card.d.ts +4 -2
- package/dist/types/media-inline/types.d.ts +6 -0
- package/dist/types/types/floating-toolbar.d.ts +1 -0
- package/dist/types-ts4.5/media-inline/index.d.ts +1 -0
- package/dist/types-ts4.5/media-inline/media-inline-image-card.d.ts +4 -2
- package/dist/types-ts4.5/media-inline/types.d.ts +6 -0
- package/dist/types-ts4.5/types/floating-toolbar.d.ts +1 -0
- package/package.json +2 -2
|
@@ -35,6 +35,7 @@ var _ArrowKeyNavigationProvider = require("../ArrowKeyNavigationProvider");
|
|
|
35
35
|
var _types = require("../ArrowKeyNavigationProvider/types");
|
|
36
36
|
var _excluded = ["children"];
|
|
37
37
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
38
|
+
/** @jsx jsx */
|
|
38
39
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
39
40
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
40
41
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
@@ -159,7 +160,7 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
|
|
|
159
160
|
}
|
|
160
161
|
}
|
|
161
162
|
});
|
|
162
|
-
return
|
|
163
|
+
return (0, _react2.jsx)(_Popup.default, {
|
|
163
164
|
target: isOpen ? target : undefined,
|
|
164
165
|
mountTo: mountTo,
|
|
165
166
|
boundariesElement: boundariesElement,
|
|
@@ -169,10 +170,10 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
|
|
|
169
170
|
fitWidth: fitWidth,
|
|
170
171
|
zIndex: zIndex || _editorSharedStyles.akEditorFloatingPanelZIndex,
|
|
171
172
|
offset: offset
|
|
172
|
-
},
|
|
173
|
+
}, (0, _react2.jsx)(_ArrowKeyNavigationProvider.ArrowKeyNavigationProvider, (0, _extends2.default)({}, navigationProviderProps, {
|
|
173
174
|
handleClose: this.handleCloseAndFocus,
|
|
174
175
|
closeOnTab: true
|
|
175
|
-
}),
|
|
176
|
+
}), (0, _react2.jsx)(DropListWithOutsideListeners, {
|
|
176
177
|
isOpen: true,
|
|
177
178
|
appearance: "tall",
|
|
178
179
|
position: popupPlacement.join(' '),
|
|
@@ -186,23 +187,23 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
|
|
|
186
187
|
e.stopPropagation();
|
|
187
188
|
},
|
|
188
189
|
targetRef: this.state.target
|
|
189
|
-
},
|
|
190
|
+
}, (0, _react2.jsx)("div", {
|
|
190
191
|
style: {
|
|
191
192
|
height: 0,
|
|
192
193
|
minWidth: fitWidth || 0
|
|
193
194
|
}
|
|
194
|
-
}),
|
|
195
|
+
}), (0, _react2.jsx)("div", {
|
|
195
196
|
ref: this.popupRef
|
|
196
|
-
}, (0, _platformFeatureFlags.getBooleanFF)('platform.editor.menu.group-items') &&
|
|
197
|
+
}, (0, _platformFeatureFlags.getBooleanFF)('platform.editor.menu.group-items') && (0, _react2.jsx)(_menu.MenuGroup, {
|
|
197
198
|
role: shouldUseDefaultRole ? 'group' : 'menu'
|
|
198
199
|
}, items.map(function (group, index) {
|
|
199
|
-
return
|
|
200
|
+
return (0, _react2.jsx)(_menu.Section, {
|
|
200
201
|
hasSeparator: (section === null || section === void 0 ? void 0 : section.hasSeparator) && index > 0,
|
|
201
202
|
title: section === null || section === void 0 ? void 0 : section.title,
|
|
202
203
|
key: index
|
|
203
204
|
}, group.items.map(function (item) {
|
|
204
205
|
var _item$key;
|
|
205
|
-
return
|
|
206
|
+
return (0, _react2.jsx)(DropdownMenuItem, {
|
|
206
207
|
key: (_item$key = item.key) !== null && _item$key !== void 0 ? _item$key : String(item.content),
|
|
207
208
|
item: item,
|
|
208
209
|
onItemActivated: _this2.props.onItemActivated,
|
|
@@ -212,12 +213,12 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
|
|
|
212
213
|
});
|
|
213
214
|
}));
|
|
214
215
|
})), !(0, _platformFeatureFlags.getBooleanFF)('platform.editor.menu.group-items') && items.map(function (group, index) {
|
|
215
|
-
return
|
|
216
|
+
return (0, _react2.jsx)(_menu.MenuGroup, {
|
|
216
217
|
key: index,
|
|
217
218
|
role: shouldUseDefaultRole ? 'group' : 'menu'
|
|
218
219
|
}, group.items.map(function (item) {
|
|
219
220
|
var _item$key2;
|
|
220
|
-
return
|
|
221
|
+
return (0, _react2.jsx)(DropdownMenuItem, {
|
|
221
222
|
key: (_item$key2 = item.key) !== null && _item$key2 !== void 0 ? _item$key2 : String(item.content),
|
|
222
223
|
item: item,
|
|
223
224
|
onItemActivated: _this2.props.onItemActivated,
|
|
@@ -234,9 +235,9 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
|
|
|
234
235
|
var _this$props2 = this.props,
|
|
235
236
|
children = _this$props2.children,
|
|
236
237
|
isOpen = _this$props2.isOpen;
|
|
237
|
-
return
|
|
238
|
+
return (0, _react2.jsx)("div", {
|
|
238
239
|
css: wrapper
|
|
239
|
-
},
|
|
240
|
+
}, (0, _react2.jsx)("div", {
|
|
240
241
|
ref: this.handleRef
|
|
241
242
|
}, children), isOpen ? this.renderDropdownMenu() : null);
|
|
242
243
|
}
|
|
@@ -261,7 +262,7 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
|
|
|
261
262
|
var DropdownMenuItemCustomComponent = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
262
263
|
var children = props.children,
|
|
263
264
|
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
264
|
-
return
|
|
265
|
+
return (0, _react2.jsx)("span", (0, _extends2.default)({
|
|
265
266
|
ref: ref
|
|
266
267
|
}, rest, {
|
|
267
268
|
style: {
|
|
@@ -290,14 +291,14 @@ function DropdownMenuItem(_ref) {
|
|
|
290
291
|
// onClick and value.name are the action indicators in the handlers
|
|
291
292
|
// If neither are present, don't wrap in an Item.
|
|
292
293
|
if (!item.onClick && !(item.value && item.value.name)) {
|
|
293
|
-
return
|
|
294
|
+
return (0, _react2.jsx)("span", {
|
|
294
295
|
key: String(item.content)
|
|
295
296
|
}, item.content);
|
|
296
297
|
}
|
|
297
298
|
var _handleSubmenuActive = function _handleSubmenuActive(event) {
|
|
298
299
|
setSubmenuActive(!!event.target.closest(".".concat(_styles.DropdownMenuSharedCssClassName.SUBMENU)));
|
|
299
300
|
};
|
|
300
|
-
var dropListItem =
|
|
301
|
+
var dropListItem = (0, _react2.jsx)("div", {
|
|
301
302
|
css: function css(theme) {
|
|
302
303
|
return buttonStyles(item.isActive, submenuActive)({
|
|
303
304
|
theme: theme
|
|
@@ -306,7 +307,7 @@ function DropdownMenuItem(_ref) {
|
|
|
306
307
|
tabIndex: -1,
|
|
307
308
|
"aria-disabled": item.isDisabled ? 'true' : 'false',
|
|
308
309
|
onMouseDown: _handleSubmenuActive
|
|
309
|
-
},
|
|
310
|
+
}, (0, _react2.jsx)(_menu.CustomItem, {
|
|
310
311
|
item: item,
|
|
311
312
|
key: (_item$key3 = item.key) !== null && _item$key3 !== void 0 ? _item$key3 : String(item.content),
|
|
312
313
|
testId: "dropdown-item__".concat(String(item.content)),
|
|
@@ -339,7 +340,7 @@ function DropdownMenuItem(_ref) {
|
|
|
339
340
|
}, item.content));
|
|
340
341
|
if (item.tooltipDescription) {
|
|
341
342
|
var _item$key4;
|
|
342
|
-
return
|
|
343
|
+
return (0, _react2.jsx)(_tooltip.default, {
|
|
343
344
|
key: (_item$key4 = item.key) !== null && _item$key4 !== void 0 ? _item$key4 : String(item.content),
|
|
344
345
|
content: item.tooltipDescription,
|
|
345
346
|
position: item.tooltipPosition
|
|
@@ -352,7 +353,7 @@ var DropdownMenuWithKeyboardNavigation = exports.DropdownMenuWithKeyboardNavigat
|
|
|
352
353
|
var keyDownHandlerContext = (0, _react.useContext)(_ToolbarArrowKeyNavigationProvider.KeyDownHandlerContext);
|
|
353
354
|
// This context is to handle the tab, Arrow Right/Left key events for dropdown.
|
|
354
355
|
// Default context has the void callbacks for above key events
|
|
355
|
-
return
|
|
356
|
+
return (0, _react2.jsx)(DropdownMenuWrapper, (0, _extends2.default)({
|
|
356
357
|
arrowKeyNavigationProviderOptions: _objectSpread(_objectSpread({}, props.arrowKeyNavigationProviderOptions), {}, {
|
|
357
358
|
keyDownHandlerContext: keyDownHandlerContext
|
|
358
359
|
})
|
|
@@ -12,6 +12,7 @@ var _react2 = require("@emotion/react");
|
|
|
12
12
|
var _messages = require("../../messages");
|
|
13
13
|
var _ui = require("../../ui");
|
|
14
14
|
var _templateObject;
|
|
15
|
+
/** @jsx jsx */
|
|
15
16
|
/* eslint-disable no-console */
|
|
16
17
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
18
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -190,14 +191,14 @@ var ToolbarArrowKeyNavigationProvider = exports.ToolbarArrowKeyNavigationProvide
|
|
|
190
191
|
}
|
|
191
192
|
};
|
|
192
193
|
}, [selectedItemIndex, wrapperRef, editorView, disableArrowKeyNavigation, handleEscape, childComponentSelector, incrementIndex, decrementIndex, isShortcutToFocusToolbar, editorAppearance, useStickyToolbar]);
|
|
193
|
-
return
|
|
194
|
+
return (0, _react2.jsx)("div", {
|
|
194
195
|
css: editorAppearance === 'comment' && centeredToolbarContainer,
|
|
195
196
|
className: "custom-key-handler-wrapper",
|
|
196
197
|
ref: wrapperRef,
|
|
197
198
|
role: "toolbar",
|
|
198
199
|
"aria-label": intl.formatMessage(_messages.fullPageMessages.toolbarLabel),
|
|
199
200
|
"aria-controls": _ui.EDIT_AREA_ID
|
|
200
|
-
},
|
|
201
|
+
}, (0, _react2.jsx)(KeyDownHandlerContext.Provider, {
|
|
201
202
|
value: submenuKeydownHandleContext
|
|
202
203
|
}, children));
|
|
203
204
|
};
|
|
@@ -17,6 +17,7 @@ var _styles = _interopRequireDefault(require("./styles"));
|
|
|
17
17
|
var _templateObject; // This file is copied to `packages/editor/editor-plugin-ai/src/ui/components/AtlassianIntelligenceToolbarButton/ToolbarButton/index.tsx`
|
|
18
18
|
// If you make any change here, copy it to above file as well
|
|
19
19
|
// and notify about the change in #team-fc-editor-ai-dev channel.
|
|
20
|
+
/** @jsx jsx */
|
|
20
21
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
22
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
22
23
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
@@ -71,7 +72,7 @@ var ToolbarButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
71
72
|
}
|
|
72
73
|
}, [disabled, onClick, onItemClick, item, buttonId]);
|
|
73
74
|
var id = buttonId ? "editor-toolbar__".concat(buttonId) : undefined;
|
|
74
|
-
var button =
|
|
75
|
+
var button = (0, _react2.jsx)(_styles.default, {
|
|
75
76
|
id: id,
|
|
76
77
|
ref: ref,
|
|
77
78
|
appearance: "subtle",
|
|
@@ -97,11 +98,11 @@ var ToolbarButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
97
98
|
return button;
|
|
98
99
|
}
|
|
99
100
|
var tooltipContent = !hideTooltip ? title : null;
|
|
100
|
-
return
|
|
101
|
+
return (0, _react2.jsx)(_tooltip.default, {
|
|
101
102
|
content: tooltipContent,
|
|
102
103
|
hideTooltipOnClick: true,
|
|
103
104
|
position: titlePosition
|
|
104
|
-
},
|
|
105
|
+
}, (0, _react2.jsx)("div", {
|
|
105
106
|
css: buttonWrapper
|
|
106
107
|
}, button));
|
|
107
108
|
});
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
/** @jsx jsx */
|
|
1
2
|
import React from 'react';
|
|
2
|
-
import { css } from '@emotion/react';
|
|
3
|
+
import { css, jsx } from '@emotion/react';
|
|
3
4
|
import { ButtonGroup } from '@atlaskit/button';
|
|
4
5
|
import { FloatingToolbarButton as Button } from '../ui';
|
|
5
6
|
|
|
@@ -16,7 +17,7 @@ const DisallowedWrapper = ({
|
|
|
16
17
|
disabled,
|
|
17
18
|
...props
|
|
18
19
|
}) => {
|
|
19
|
-
return
|
|
20
|
+
return jsx("div", props);
|
|
20
21
|
};
|
|
21
22
|
|
|
22
23
|
/**
|
|
@@ -32,7 +33,7 @@ const disallowedWrapperStyle = css`
|
|
|
32
33
|
export const LinkToolbarButtonGroup = ({
|
|
33
34
|
options
|
|
34
35
|
}) => {
|
|
35
|
-
return
|
|
36
|
+
return jsx(ButtonGroup, null, options.map(({
|
|
36
37
|
onClick,
|
|
37
38
|
selected,
|
|
38
39
|
disabled,
|
|
@@ -40,14 +41,14 @@ export const LinkToolbarButtonGroup = ({
|
|
|
40
41
|
tooltipContent,
|
|
41
42
|
title,
|
|
42
43
|
icon: Icon
|
|
43
|
-
}) =>
|
|
44
|
+
}) => jsx(DisallowedWrapper, {
|
|
44
45
|
css: disabled ? disallowedWrapperStyle : defaultWrapperStyle,
|
|
45
46
|
key: testId,
|
|
46
47
|
disabled: disabled
|
|
47
|
-
},
|
|
48
|
+
}, jsx(Button, {
|
|
48
49
|
css: disabled ? buttonStyleNoneEvent : buttonStyle,
|
|
49
50
|
title: title,
|
|
50
|
-
icon:
|
|
51
|
+
icon: jsx(Icon, {
|
|
51
52
|
size: "medium",
|
|
52
53
|
label: title
|
|
53
54
|
}),
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
/** @jsx jsx */
|
|
1
2
|
import { useEffect, useRef } from 'react';
|
|
2
|
-
import { css } from '@emotion/react';
|
|
3
|
+
import { css, jsx } from '@emotion/react';
|
|
3
4
|
import { ButtonItem, Section } from '@atlaskit/menu';
|
|
4
5
|
const itemBefore = css`
|
|
5
6
|
width: 40px;
|
|
@@ -20,11 +21,11 @@ export const ViewMore = ({
|
|
|
20
21
|
ref.current.focus();
|
|
21
22
|
}
|
|
22
23
|
}, [focus]);
|
|
23
|
-
return
|
|
24
|
+
return jsx(Section, {
|
|
24
25
|
hasSeparator: true
|
|
25
|
-
},
|
|
26
|
+
}, jsx(ButtonItem, {
|
|
26
27
|
onClick: item.action,
|
|
27
|
-
iconBefore:
|
|
28
|
+
iconBefore: jsx("div", {
|
|
28
29
|
css: itemBefore
|
|
29
30
|
}, item.icon()),
|
|
30
31
|
"aria-describedby": item.title,
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
/** @jsx jsx */
|
|
3
|
+
|
|
2
4
|
import React, { Fragment, memo, useCallback } from 'react';
|
|
3
|
-
import { css } from '@emotion/react';
|
|
5
|
+
import { css, jsx } from '@emotion/react';
|
|
4
6
|
import { withAnalyticsContext } from '@atlaskit/analytics-next';
|
|
5
7
|
import Button from '@atlaskit/button/custom-theme-button';
|
|
6
8
|
import { B400, B50, N800 } from '@atlaskit/theme/colors';
|
|
@@ -12,7 +14,7 @@ function CategoryList({
|
|
|
12
14
|
...props
|
|
13
15
|
}) {
|
|
14
16
|
const [focusedCategoryIndex, setFocusedCategoryIndex] = React.useState(null);
|
|
15
|
-
return
|
|
17
|
+
return jsx(Fragment, null, categories.map((category, index) => jsx(CategoryListItem, _extends({
|
|
16
18
|
key: category.title,
|
|
17
19
|
index: index,
|
|
18
20
|
category: category,
|
|
@@ -75,9 +77,9 @@ function CategoryListItem({
|
|
|
75
77
|
...rest
|
|
76
78
|
};
|
|
77
79
|
}, [category.name, selectedCategory]);
|
|
78
|
-
return
|
|
80
|
+
return jsx("div", {
|
|
79
81
|
css: buttonWrapper
|
|
80
|
-
},
|
|
82
|
+
}, jsx(Button, {
|
|
81
83
|
appearance: "subtle",
|
|
82
84
|
isSelected: selectedCategory === category.name,
|
|
83
85
|
onClick: onClick,
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
/** @jsx jsx */
|
|
1
2
|
import React from 'react';
|
|
2
|
-
import { css } from '@emotion/react';
|
|
3
|
+
import { css, jsx } from '@emotion/react';
|
|
3
4
|
import Loadable from 'react-loadable';
|
|
4
5
|
import Spinner from '@atlaskit/spinner';
|
|
5
6
|
const spinnerContainer = css`
|
|
@@ -11,9 +12,9 @@ const spinnerContainer = css`
|
|
|
11
12
|
`;
|
|
12
13
|
const ElementBrowserLoader = Loadable({
|
|
13
14
|
loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-element-browser" */'../ElementBrowser').then(module => module.default),
|
|
14
|
-
loading: () =>
|
|
15
|
+
loading: () => jsx("div", {
|
|
15
16
|
css: spinnerContainer
|
|
16
|
-
},
|
|
17
|
+
}, jsx(Spinner, {
|
|
17
18
|
size: "medium"
|
|
18
19
|
}))
|
|
19
20
|
});
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
/** @jsx jsx */
|
|
2
3
|
import React, { Fragment, memo, useCallback, useEffect, useMemo, useState } from 'react';
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
+
import { css, jsx } from '@emotion/react';
|
|
4
5
|
import { AutoSizer } from 'react-virtualized/dist/commonjs/AutoSizer';
|
|
5
6
|
import { Collection } from 'react-virtualized/dist/commonjs/Collection';
|
|
6
7
|
import { withAnalyticsContext } from '@atlaskit/analytics-next';
|
|
@@ -86,12 +87,12 @@ function ElementList({
|
|
|
86
87
|
if (items[index] == null) {
|
|
87
88
|
return;
|
|
88
89
|
}
|
|
89
|
-
return
|
|
90
|
+
return jsx("div", {
|
|
90
91
|
style: style,
|
|
91
92
|
key: key,
|
|
92
93
|
className: "element-item-wrapper",
|
|
93
94
|
css: elementItemWrapper
|
|
94
|
-
},
|
|
95
|
+
}, jsx(MemoizedElementItem, _extends({
|
|
95
96
|
inlineMode: !fullMode,
|
|
96
97
|
index: index,
|
|
97
98
|
item: items[index],
|
|
@@ -99,20 +100,20 @@ function ElementList({
|
|
|
99
100
|
focus: focusedItemIndex === index
|
|
100
101
|
}, props)));
|
|
101
102
|
}, [items, fullMode, selectedItemIndex, focusedItemIndex, props]);
|
|
102
|
-
return
|
|
103
|
+
return jsx(Fragment, null, jsx(ContainerWidthMonitor, null), !items.length ? emptyStateHandler ? emptyStateHandler({
|
|
103
104
|
mode,
|
|
104
105
|
selectedCategory,
|
|
105
106
|
searchTerm
|
|
106
|
-
}) :
|
|
107
|
+
}) : jsx(EmptyState, {
|
|
107
108
|
onExternalLinkClick: onExternalLinkClick
|
|
108
|
-
}) :
|
|
109
|
+
}) : jsx("div", {
|
|
109
110
|
css: elementItemsWrapper,
|
|
110
111
|
"data-testid": "element-items"
|
|
111
|
-
},
|
|
112
|
+
}, jsx(Fragment, null, containerWidth > 0 && jsx(AutoSizer, {
|
|
112
113
|
disableWidth: true
|
|
113
114
|
}, ({
|
|
114
115
|
height
|
|
115
|
-
}) =>
|
|
116
|
+
}) => jsx(Collection, {
|
|
116
117
|
cellCount: items.length,
|
|
117
118
|
cellRenderer: cellRenderer,
|
|
118
119
|
cellSizeAndPositionGetter: cellSizeAndPositionGetter(containerWidth - ELEMENT_LIST_PADDING * 2, scrollbarWidth),
|
|
@@ -174,12 +175,12 @@ export function ElementItem({
|
|
|
174
175
|
description,
|
|
175
176
|
keyshortcut
|
|
176
177
|
} = item;
|
|
177
|
-
return
|
|
178
|
+
return jsx(Tooltip, {
|
|
178
179
|
content: description,
|
|
179
180
|
testId: `element-item-tooltip-${index}`
|
|
180
|
-
},
|
|
181
|
+
}, jsx(ButtonItem, {
|
|
181
182
|
onClick: onClick,
|
|
182
|
-
iconBefore:
|
|
183
|
+
iconBefore: jsx(ElementBefore, {
|
|
183
184
|
icon: icon,
|
|
184
185
|
title: title
|
|
185
186
|
}),
|
|
@@ -187,7 +188,7 @@ export function ElementItem({
|
|
|
187
188
|
"aria-describedby": title,
|
|
188
189
|
ref: ref,
|
|
189
190
|
testId: `element-item-${index}`
|
|
190
|
-
},
|
|
191
|
+
}, jsx(ItemContent, {
|
|
191
192
|
style: inlineMode ? null : itemStyleOverrides,
|
|
192
193
|
tabIndex: 0,
|
|
193
194
|
title: title,
|
|
@@ -205,27 +206,27 @@ const itemStyleOverrides = {
|
|
|
205
206
|
const ElementBefore = /*#__PURE__*/memo(({
|
|
206
207
|
icon,
|
|
207
208
|
title
|
|
208
|
-
}) =>
|
|
209
|
+
}) => jsx("div", {
|
|
209
210
|
css: [itemIcon, itemIconStyle]
|
|
210
|
-
}, icon ? icon() :
|
|
211
|
+
}, icon ? icon() : jsx(IconFallback, null)));
|
|
211
212
|
const ItemContent = /*#__PURE__*/memo(({
|
|
212
213
|
title,
|
|
213
214
|
description,
|
|
214
215
|
keyshortcut
|
|
215
|
-
}) =>
|
|
216
|
+
}) => jsx("div", {
|
|
216
217
|
css: itemBody,
|
|
217
218
|
className: "item-body"
|
|
218
|
-
},
|
|
219
|
+
}, jsx("div", {
|
|
219
220
|
css: itemText
|
|
220
|
-
},
|
|
221
|
+
}, jsx("div", {
|
|
221
222
|
css: itemTitleWrapper
|
|
222
|
-
},
|
|
223
|
+
}, jsx("p", {
|
|
223
224
|
css: itemTitle
|
|
224
|
-
}, title),
|
|
225
|
+
}, title), jsx("div", {
|
|
225
226
|
css: itemAfter
|
|
226
|
-
}, keyshortcut &&
|
|
227
|
+
}, keyshortcut && jsx("div", {
|
|
227
228
|
css: shortcutStyle
|
|
228
|
-
}, keyshortcut))), description &&
|
|
229
|
+
}, keyshortcut))), description && jsx("p", {
|
|
229
230
|
css: itemDescription
|
|
230
231
|
}, description))));
|
|
231
232
|
const elementItemsWrapper = css`
|
|
@@ -1,32 +1,33 @@
|
|
|
1
|
-
|
|
1
|
+
/** @jsx jsx */
|
|
2
|
+
import { css, jsx } from '@emotion/react';
|
|
2
3
|
import { FormattedMessage } from 'react-intl-next';
|
|
3
4
|
import Button from '@atlaskit/button';
|
|
4
5
|
import NotFoundIllustration from './NotFoundIllustration';
|
|
5
6
|
export default function EmptyState({
|
|
6
7
|
onExternalLinkClick
|
|
7
8
|
}) {
|
|
8
|
-
return
|
|
9
|
+
return jsx("div", {
|
|
9
10
|
css: emptyStateWrapper
|
|
10
|
-
},
|
|
11
|
+
}, jsx(NotFoundIllustration, null), jsx("div", {
|
|
11
12
|
css: emptyStateHeading
|
|
12
|
-
},
|
|
13
|
+
}, jsx(FormattedMessage, {
|
|
13
14
|
id: "fabric.editor.elementbrowser.search.empty-state.heading",
|
|
14
15
|
defaultMessage: "Nothing matches your search",
|
|
15
16
|
description: "Empty state heading"
|
|
16
|
-
})),
|
|
17
|
+
})), jsx("div", {
|
|
17
18
|
css: emptyStateSubHeading
|
|
18
|
-
},
|
|
19
|
+
}, jsx("p", null, jsx(FormattedMessage, {
|
|
19
20
|
id: "fabric.editor.elementbrowser.search.empty-state.sub-heading",
|
|
20
21
|
defaultMessage: "Try searching with a different term or discover new apps for Atlassian products.",
|
|
21
22
|
description: "Empty state sub-heading"
|
|
22
|
-
})),
|
|
23
|
+
})), jsx("div", {
|
|
23
24
|
css: externalLinkWrapper
|
|
24
|
-
},
|
|
25
|
+
}, jsx(Button, {
|
|
25
26
|
appearance: "primary",
|
|
26
27
|
target: "_blank",
|
|
27
28
|
href: "https://marketplace.atlassian.com/search?category=Macros&hosting=cloud&product=confluence",
|
|
28
29
|
onClick: onExternalLinkClick
|
|
29
|
-
},
|
|
30
|
+
}, jsx(FormattedMessage, {
|
|
30
31
|
id: "fabric.editor.elementbrowser.search.empty-state.sub-heading.link",
|
|
31
32
|
defaultMessage: "Explore Atlassian Marketplace",
|
|
32
33
|
description: "Empty state sub-heading external link"
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
/** @jsx jsx */
|
|
2
|
+
import { css, jsx } from '@emotion/react';
|
|
2
3
|
const imageContainer = css`
|
|
3
4
|
width: 120px;
|
|
4
5
|
height: 111px;
|
|
@@ -7,56 +8,56 @@ const imageContainer = css`
|
|
|
7
8
|
|
|
8
9
|
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
9
10
|
export default function NotFoundIllustration() {
|
|
10
|
-
return
|
|
11
|
+
return jsx("div", {
|
|
11
12
|
css: imageContainer
|
|
12
|
-
},
|
|
13
|
+
}, jsx("svg", {
|
|
13
14
|
width: "120",
|
|
14
15
|
height: "111",
|
|
15
16
|
fill: "none",
|
|
16
17
|
xmlns: "http://www.w3.org/2000/svg"
|
|
17
|
-
},
|
|
18
|
+
}, jsx("g", {
|
|
18
19
|
clipPath: "url(#clip0)"
|
|
19
|
-
},
|
|
20
|
+
}, jsx("path", {
|
|
20
21
|
fill: "#fff",
|
|
21
22
|
fillOpacity: ".01",
|
|
22
23
|
d: "M0 0h120v110.365H0z"
|
|
23
|
-
}),
|
|
24
|
+
}), jsx("path", {
|
|
24
25
|
opacity: ".3",
|
|
25
26
|
d: "M60.985 110.336c-.539.017-1.078.029-1.616.035a1.359 1.359 0 01-1.367-1.36 1.361 1.361 0 011.314-1.372h.041a50.876 50.876 0 0010.276-1.105 1.367 1.367 0 01.568 2.674 54.422 54.422 0 01-9.216 1.128zM52 109.877c-.075 0-.156 0-.237-.012a52.688 52.688 0 01-10.583-2.61 1.368 1.368 0 01.92-2.575c3.245 1.169 6.616 2 10.034 2.471.747.104 1.268.79 1.164 1.54A1.36 1.36 0 0152 109.877zM77.088 107.162a1.364 1.364 0 01-1.326-.895 1.366 1.366 0 01.805-1.755 50.423 50.423 0 009.274-4.575 1.358 1.358 0 011.877.43c.4.64.208 1.482-.429 1.884a53.25 53.25 0 01-9.772 4.824 1.26 1.26 0 01-.429.087zM34.9 104.32a1.359 1.359 0 01-.683-.157 53.29 53.29 0 01-9.042-6.092 1.369 1.369 0 01-.18-1.924 1.357 1.357 0 011.918-.18 50.483 50.483 0 008.578 5.778c.667.354.916 1.18.562 1.848a1.337 1.337 0 01-1.152.727zM20.732 93.23a1.372 1.372 0 01-1.06-.448 53.223 53.223 0 01-6.436-8.818 1.37 1.37 0 01.487-1.872 1.36 1.36 0 011.865.489 50.724 50.724 0 006.105 8.364 1.366 1.366 0 01-.098 1.93c-.25.226-.556.343-.863.354zM104.093 84.196a1.367 1.367 0 01-1.228-2.046 50.41 50.41 0 004.183-9.48 1.358 1.358 0 011.714-.878 1.365 1.365 0 01.875 1.72 53.17 53.17 0 01-4.414 9.993 1.34 1.34 0 01-1.13.691zM11.18 77.965a1.365 1.365 0 01-1.31-.854 52.827 52.827 0 01-3.029-10.498 1.362 1.362 0 112.682-.483 50.732 50.732 0 002.873 9.958 1.363 1.363 0 01-1.216 1.877zM110.17 67.218a1.362 1.362 0 01-1.39-1.593c.579-3.395.805-6.876.683-10.347l-.006-.116a1.36 1.36 0 011.315-1.412 1.359 1.359 0 011.408 1.32l.006.115a54.054 54.054 0 01-.724 10.905 1.36 1.36 0 01-1.292 1.128zM7.426 60.3c-.753.03-1.384-.534-1.407-1.29v-.058a53.82 53.82 0 01.712-10.846 1.368 1.368 0 011.57-1.122c.741.128 1.24.83 1.118 1.575a51.307 51.307 0 00-.678 10.288c.029.762-.562 1.425-1.315 1.453zM110.06 49.076a1.363 1.363 0 01-1.385-1.122 50.567 50.567 0 00-2.884-9.95c-.284-.698.052-1.5.747-1.785a1.365 1.365 0 011.778.75 53.085 53.085 0 013.041 10.497 1.37 1.37 0 01-1.094 1.593l-.203.017zM9.888 42.462a1.452 1.452 0 01-.47-.065 1.365 1.365 0 01-.874-1.72 53.157 53.157 0 014.402-9.998 1.362 1.362 0 011.86-.511c.655.372.88 1.209.51 1.866a50.68 50.68 0 00-4.177 9.486 1.37 1.37 0 01-1.251.941zM103.815 32.179a1.355 1.355 0 01-1.222-.674 50.958 50.958 0 00-6.117-8.359 1.366 1.366 0 01.099-1.93 1.355 1.355 0 011.923.099 53.449 53.449 0 016.447 8.806 1.37 1.37 0 01-.487 1.872 1.432 1.432 0 01-.643.186zM18.31 26.529a1.372 1.372 0 01-1.124-2.209 53.551 53.551 0 017.537-7.888 1.363 1.363 0 011.923.157 1.375 1.375 0 01-.156 1.93 51.072 51.072 0 00-7.154 7.487 1.343 1.343 0 01-1.025.523zM92.172 18.444a1.352 1.352 0 01-.915-.314 50.861 50.861 0 00-8.59-5.772 1.368 1.368 0 01-.568-1.849 1.364 1.364 0 011.842-.57 53.153 53.153 0 019.048 6.08c.58.483.66 1.343.18 1.925a1.366 1.366 0 01-.997.5zM31.64 14.433a1.368 1.368 0 01-.776-2.523 53.107 53.107 0 019.771-4.836 1.359 1.359 0 011.75.808c.26.71-.099 1.494-.805 1.755a50.203 50.203 0 00-9.269 4.587c-.208.133-.44.203-.672.209zM76.555 9.51a1.257 1.257 0 01-.504-.082A50.06 50.06 0 0066.013 6.97a1.364 1.364 0 01-1.165-1.54 1.364 1.364 0 011.535-1.168 52.623 52.623 0 0110.584 2.592 1.369 1.369 0 01-.412 2.657zM48.287 7.65a1.367 1.367 0 01-.33-2.703 54.261 54.261 0 0110.827-1.18 1.367 1.367 0 011.372 1.36 1.367 1.367 0 01-1.314 1.377H58.8A50.85 50.85 0 0048.525 7.62c-.081.018-.162.024-.238.03z",
|
|
26
27
|
fill: "#B3BAC5"
|
|
27
|
-
}),
|
|
28
|
+
}), jsx("path", {
|
|
28
29
|
opacity: ".3",
|
|
29
30
|
d: "M110.523 19.873a.304.304 0 01-.226-.325l.035-.262c.029-.168.064-.348.11-.534a4.423 4.423 0 01.95-1.796c.458-.53 1.118-.971 1.97-1.314l1.436-.587c.858-.343 1.385-.913 1.593-1.697a2.48 2.48 0 00.07-.878 1.998 1.998 0 00-.273-.849c-.156-.261-.37-.5-.654-.709a3.07 3.07 0 00-1.049-.477c-.451-.116-.851-.133-1.21-.052a2.56 2.56 0 00-.956.43c-.278.204-.51.465-.695.78-.191.313-.33.65-.423.999-.029.104-.052.21-.07.302a.459.459 0 01-.59.355l-2.219-.68a.464.464 0 01-.33-.483c.006-.07.017-.14.029-.21.035-.197.075-.383.121-.569.174-.668.47-1.29.887-1.866a5.14 5.14 0 011.546-1.412c.614-.366 1.31-.605 2.097-.72.788-.117 1.645-.047 2.578.197.967.256 1.778.622 2.433 1.098.66.477 1.176 1.012 1.552 1.599.377.593.614 1.22.707 1.889.093.668.058 1.32-.11 1.953-.261 1-.712 1.796-1.344 2.389a6.773 6.773 0 01-2.288 1.39l-1.211.458c-.341.11-.851.338-1.274.803-.041.046-.214.238-.388.534-.128.221-.22.436-.284.622a.303.303 0 01-.365.192l-2.155-.57zm-1.772 3.412c.145-.552.457-.97.944-1.26a1.942 1.942 0 011.552-.222c.551.146.968.465 1.257.96.29.493.359 1.017.215 1.569a1.966 1.966 0 01-.956 1.25 2.005 2.005 0 01-1.558.203 1.957 1.957 0 01-1.246-.942 1.98 1.98 0 01-.208-1.558zM10.722 12.393a.301.301 0 01-.203-.338l.053-.261c.04-.169.086-.343.15-.523a4.334 4.334 0 011.072-1.727c.492-.5 1.176-.889 2.056-1.18l1.472-.488c.874-.285 1.442-.814 1.703-1.587.092-.279.139-.57.127-.872a2.052 2.052 0 00-.214-.866 2.285 2.285 0 00-.609-.75c-.266-.226-.608-.406-1.013-.546-.44-.151-.846-.192-1.205-.134a2.518 2.518 0 00-1.726 1.099 3.583 3.583 0 00-.585 1.267.461.461 0 01-.615.314L9.02 4.976a.467.467 0 01-.295-.506c.011-.07.029-.14.046-.21a5.65 5.65 0 01.162-.557A5.505 5.505 0 019.946 1.9 5.246 5.246 0 0111.579.593a5.545 5.545 0 012.138-.576c.793-.058 1.645.064 2.554.372.945.32 1.732.739 2.358 1.262.626.523 1.106 1.087 1.442 1.703.336.616.533 1.255.58 1.93a4.97 4.97 0 01-.244 1.941c-.33.982-.828 1.744-1.506 2.29a6.844 6.844 0 01-2.375 1.233l-1.24.372a2.94 2.94 0 00-1.326.715c-.046.046-.232.226-.423.505-.145.215-.249.419-.324.599a.3.3 0 01-.377.168l-2.114-.714zm-1.998 3.284a2 2 0 011.025-1.198 1.957 1.957 0 011.564-.116c.539.18.933.529 1.188 1.04.254.512.29 1.041.11 1.582-.18.54-.528.935-1.037 1.18a2.019 2.019 0 01-1.57.098 1.96 1.96 0 01-1.182-1.029 1.99 1.99 0 01-.098-1.557zM7.177 104.849a.298.298 0 01-.37-.134c-.041-.076-.082-.157-.122-.238a8.207 8.207 0 01-.215-.5 4.405 4.405 0 01-.249-2.017c.076-.698.36-1.436.863-2.215l.84-1.308c.504-.773.614-1.546.33-2.307a2.6 2.6 0 00-.446-.762 2.019 2.019 0 00-.706-.54 2.421 2.421 0 00-.944-.204 3.05 3.05 0 00-1.13.215c-.434.163-.776.378-1.025.657-.25.273-.423.576-.533.901-.11.326-.15.674-.128 1.04.024.367.099.721.226 1.064.04.105.076.198.116.285a.466.466 0 01-.278.634l-2.201.72a.455.455 0 01-.545-.209c-.034-.064-.063-.128-.098-.192a5.595 5.595 0 01-.568-2.575 5.09 5.09 0 01.458-2.046c.29-.65.724-1.25 1.303-1.796.58-.546 1.32-.988 2.225-1.32.938-.348 1.807-.517 2.618-.505.81.012 1.54.151 2.19.413a4.62 4.62 0 011.656 1.139c.458.494.8 1.046 1.025 1.662.36.971.446 1.884.267 2.732-.18.85-.539 1.669-1.078 2.46l-.73 1.075c-.214.29-.503.767-.585 1.389-.005.064-.04.319-.011.657.023.255.07.482.127.668a.309.309 0 01-.19.372l-2.092.785zm.504 3.813a2.026 2.026 0 01.052-1.581 1.958 1.958 0 011.147-1.076 1.986 1.986 0 011.576.064c.521.239.88.628 1.077 1.163a1.947 1.947 0 01-.07 1.569 2.028 2.028 0 01-1.158 1.064 1.977 1.977 0 01-1.564-.052 1.96 1.96 0 01-1.06-1.151z",
|
|
30
31
|
fill: "#C1C7D0"
|
|
31
|
-
}),
|
|
32
|
+
}), jsx("path", {
|
|
32
33
|
d: "M86.519 77.651l-4.142-4.028-5.578 5.784 4.141 4.028a7.812 7.812 0 012.15 3.772 7.858 7.858 0 002.148 3.773l16.816 16.333a6.405 6.405 0 009.077-.145 6.46 6.46 0 00-.144-9.108L94.171 81.726a7.786 7.786 0 00-3.83-2.034 7.9 7.9 0 01-3.822-2.04z",
|
|
33
34
|
fill: "#CFD4DB"
|
|
34
|
-
}),
|
|
35
|
+
}), jsx("path", {
|
|
35
36
|
d: "M90.18 79.64a7.756 7.756 0 01-3.656-1.995l-1.262-1.226a4 4 0 00-5.671.093 4.032 4.032 0 00.092 5.69l1.263 1.227a7.853 7.853 0 012.103 3.598 33.606 33.606 0 003.858-3.435 33.629 33.629 0 003.273-3.953z",
|
|
36
37
|
fill: "#B3BAC5"
|
|
37
|
-
}),
|
|
38
|
+
}), jsx("path", {
|
|
38
39
|
d: "M59.056 90.677c-8.961.146-17.442-3.22-23.877-9.474-13.295-12.91-13.636-34.266-.77-47.606C40.64 27.14 49.01 23.501 57.966 23.35c8.961-.145 17.441 3.22 23.877 9.475 6.441 6.255 10.062 14.654 10.212 23.64.145 8.992-3.209 17.502-9.442 23.96-6.227 6.47-14.597 10.108-23.558 10.253zM58.1 31.388c-6.824.11-13.19 2.883-17.94 7.801-9.795 10.155-9.534 26.413.585 36.242 4.9 4.76 11.36 7.324 18.183 7.213 6.824-.11 13.19-2.883 17.94-7.8 4.744-4.918 7.299-11.399 7.189-18.246-.11-6.847-2.873-13.236-7.774-18.002-4.906-4.755-11.36-7.318-18.183-7.208z",
|
|
39
40
|
fill: "url(#paint0_linear)"
|
|
40
|
-
}),
|
|
41
|
+
}), jsx("path", {
|
|
41
42
|
d: "M68.886 49.535l-3.093-3.051a1.158 1.158 0 00-1.64.017l-5.67 5.796-5.776-5.691a1.158 1.158 0 00-1.64.017l-3.04 3.104c-.446.46-.44 1.192.017 1.645l5.775 5.69-5.67 5.796c-.447.46-.44 1.192.017 1.645l3.093 3.052a1.158 1.158 0 001.64-.018l5.67-5.795 5.775 5.69a1.158 1.158 0 001.64-.017l3.04-3.104c.447-.459.441-1.191-.017-1.645l-5.775-5.69 5.671-5.795c.446-.46.44-1.198-.017-1.645z",
|
|
42
43
|
fill: "#C1C7D0"
|
|
43
|
-
})),
|
|
44
|
+
})), jsx("defs", null, jsx("linearGradient", {
|
|
44
45
|
id: "paint0_linear",
|
|
45
46
|
x1: "34.792",
|
|
46
47
|
y1: "80.822",
|
|
47
48
|
x2: "82.401",
|
|
48
49
|
y2: "33.377",
|
|
49
50
|
gradientUnits: "userSpaceOnUse"
|
|
50
|
-
},
|
|
51
|
+
}, jsx("stop", {
|
|
51
52
|
offset: ".557",
|
|
52
53
|
stopColor: "#C1C7D0"
|
|
53
|
-
}),
|
|
54
|
+
}), jsx("stop", {
|
|
54
55
|
offset: ".966",
|
|
55
56
|
stopColor: "#E9EBEF",
|
|
56
57
|
stopOpacity: ".5"
|
|
57
|
-
})),
|
|
58
|
+
})), jsx("clipPath", {
|
|
58
59
|
id: "clip0"
|
|
59
|
-
},
|
|
60
|
+
}, jsx("path", {
|
|
60
61
|
fill: "#fff",
|
|
61
62
|
d: "M0 0h120v110.365H0z"
|
|
62
63
|
})))));
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
/** @jsx jsx */
|
|
1
2
|
import React, { memo } from 'react';
|
|
2
|
-
import { css } from '@emotion/react';
|
|
3
|
+
import { css, jsx } from '@emotion/react';
|
|
3
4
|
import { injectIntl } from 'react-intl-next';
|
|
4
5
|
import { withAnalyticsContext } from '@atlaskit/analytics-next';
|
|
5
6
|
import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
|
|
@@ -31,27 +32,27 @@ function ElementSearch({
|
|
|
31
32
|
};
|
|
32
33
|
const onFocus = e => {};
|
|
33
34
|
const onBlur = e => {};
|
|
34
|
-
return
|
|
35
|
+
return jsx("div", {
|
|
35
36
|
css: [wrapper, mode === Modes.inline && wrapperInline]
|
|
36
|
-
},
|
|
37
|
+
}, jsx(Textfield, {
|
|
37
38
|
ref: ref,
|
|
38
39
|
onChange: onChange,
|
|
39
40
|
onClick: onClick,
|
|
40
41
|
onFocus: onFocus,
|
|
41
42
|
onKeyDown: onKeyDown,
|
|
42
43
|
onBlur: onBlur,
|
|
43
|
-
elemBeforeInput:
|
|
44
|
+
elemBeforeInput: jsx("div", {
|
|
44
45
|
css: elementBeforeInput,
|
|
45
46
|
"data-testid": "element_search__element_before_input"
|
|
46
|
-
},
|
|
47
|
+
}, jsx(SearchIcon, {
|
|
47
48
|
size: "medium",
|
|
48
49
|
label: "Advanced search",
|
|
49
50
|
primaryColor: "inherit"
|
|
50
51
|
})),
|
|
51
|
-
elemAfterInput:
|
|
52
|
+
elemAfterInput: jsx("div", {
|
|
52
53
|
css: elementAfterInput,
|
|
53
54
|
"data-testid": "element_search__element_after_input"
|
|
54
|
-
},
|
|
55
|
+
}, jsx("div", {
|
|
55
56
|
css: styledShortcut
|
|
56
57
|
}, "\u23CE ", formatMessage(elementAfterInputMessage))),
|
|
57
58
|
placeholder: formatMessage(placeHolderMessage),
|