@atlaskit/editor-common 131.2.2 → 131.4.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 +31 -0
- package/dist/cjs/analytics/types/enums.js +1 -0
- package/dist/cjs/extensibility/Extension/Extension/index.js +15 -1
- package/dist/cjs/monitoring/error.js +1 -1
- package/dist/cjs/quick-insert/QuickInsertEmptyState.compiled.css +11 -0
- package/dist/cjs/quick-insert/QuickInsertEmptyState.js +61 -0
- package/dist/cjs/quick-insert/assets/no-results.js +36 -0
- package/dist/cjs/quick-insert/messages.js +5 -0
- package/dist/cjs/quick-insert/useQuickInsertSearchAnalytics.js +100 -0
- package/dist/cjs/ui/DropList/index.js +1 -1
- package/dist/cjs/ui/OverflowShadow/index.js +14 -2
- package/dist/es2019/analytics/types/enums.js +1 -0
- package/dist/es2019/extensibility/Extension/Extension/index.js +13 -1
- package/dist/es2019/monitoring/error.js +1 -1
- package/dist/es2019/quick-insert/QuickInsertEmptyState.compiled.css +11 -0
- package/dist/es2019/quick-insert/QuickInsertEmptyState.js +47 -0
- package/dist/es2019/quick-insert/assets/no-results.js +30 -0
- package/dist/es2019/quick-insert/messages.js +5 -0
- package/dist/es2019/quick-insert/useQuickInsertSearchAnalytics.js +91 -0
- package/dist/es2019/ui/DropList/index.js +1 -1
- package/dist/es2019/ui/OverflowShadow/index.js +12 -2
- package/dist/esm/analytics/types/enums.js +1 -0
- package/dist/esm/extensibility/Extension/Extension/index.js +15 -1
- package/dist/esm/monitoring/error.js +1 -1
- package/dist/esm/quick-insert/QuickInsertEmptyState.compiled.css +11 -0
- package/dist/esm/quick-insert/QuickInsertEmptyState.js +50 -0
- package/dist/esm/quick-insert/assets/no-results.js +29 -0
- package/dist/esm/quick-insert/messages.js +5 -0
- package/dist/esm/quick-insert/useQuickInsertSearchAnalytics.js +93 -0
- package/dist/esm/ui/DropList/index.js +1 -1
- package/dist/esm/ui/OverflowShadow/index.js +14 -2
- package/dist/types/analytics/types/enums.d.ts +1 -0
- package/dist/types/analytics/types/events.d.ts +2 -2
- package/dist/types/analytics/types/quick-insert-events.d.ts +11 -1
- package/dist/types/quick-insert/QuickInsertEmptyState.d.ts +7 -0
- package/dist/types/quick-insert/assets/no-results.d.ts +7 -0
- package/dist/types/quick-insert/messages.d.ts +1 -1
- package/dist/types/quick-insert/useQuickInsertSearchAnalytics.d.ts +12 -0
- package/dist/types/ui/OverflowShadow/index.d.ts +5 -0
- package/package.json +7 -7
- package/quick-insert/empty-state/package.json +10 -0
- package/quick-insert/use-search-analytics/package.json +10 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,36 @@
|
|
|
1
1
|
# @atlaskit/editor-common
|
|
2
2
|
|
|
3
|
+
## 131.4.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`f93da47c0d069`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f93da47c0d069) -
|
|
8
|
+
Add shared illustrated empty states and search outcome analytics for registered slash, Plus and
|
|
9
|
+
Element Browser searches under platform_editor_slash_command. Refresh resolved registrations on
|
|
10
|
+
search edits and retain eligible Ask Rovo and host Marketplace recovery. Remove duplicate top
|
|
11
|
+
spacing in the Plus menu and show its previews only for directly hovered or keyboard-selected
|
|
12
|
+
items. Subscribe all three registered entry points to live registry updates and rebuild their
|
|
13
|
+
models on search changes, keeping selection and category state valid as items arrive or disappear.
|
|
14
|
+
Omit the Plus footer divider when only the generic empty state is shown.
|
|
15
|
+
|
|
16
|
+
### Patch Changes
|
|
17
|
+
|
|
18
|
+
- Updated dependencies
|
|
19
|
+
|
|
20
|
+
## 131.3.0
|
|
21
|
+
|
|
22
|
+
### Minor Changes
|
|
23
|
+
|
|
24
|
+
- [`50bd552f7a17f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/50bd552f7a17f) -
|
|
25
|
+
[ux] Use CSS scroll-driven overflow shadows for extensions when the
|
|
26
|
+
`platform_editor_reduce_forced_layout_2` experiment is enabled, reducing forced layout while
|
|
27
|
+
preserving the JavaScript fallback in unsupported browsers. Add an optional `isDisabled` setting
|
|
28
|
+
to `overflowShadow` so consumers can disable its JavaScript behavior.
|
|
29
|
+
|
|
30
|
+
### Patch Changes
|
|
31
|
+
|
|
32
|
+
- Updated dependencies
|
|
33
|
+
|
|
3
34
|
## 131.2.2
|
|
4
35
|
|
|
5
36
|
### Patch Changes
|
|
@@ -129,6 +129,7 @@ var ACTION = exports.ACTION = /*#__PURE__*/function (ACTION) {
|
|
|
129
129
|
ACTION["REPLACED_ALL"] = "replacedAll";
|
|
130
130
|
ACTION["REPLACED_ONE"] = "replacedOne";
|
|
131
131
|
ACTION["RESOLVED"] = "resolved";
|
|
132
|
+
ACTION["SEARCHED"] = "searched";
|
|
132
133
|
ACTION["REQUEST_TO_EDIT"] = "requestToEdit";
|
|
133
134
|
ACTION["SELECTED"] = "selected";
|
|
134
135
|
ACTION["SHOWN"] = "shown";
|
|
@@ -13,6 +13,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
13
13
|
var _react = _interopRequireWildcard(require("react"));
|
|
14
14
|
var _react2 = require("@emotion/react");
|
|
15
15
|
var _classnames2 = _interopRequireDefault(require("classnames"));
|
|
16
|
+
var _memoizeOne = _interopRequireDefault(require("memoize-one"));
|
|
16
17
|
var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
|
|
17
18
|
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
18
19
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
@@ -43,6 +44,15 @@ var hoverStyles = (0, _react2.css)({
|
|
|
43
44
|
var containerStyle = (0, _react2.css)({
|
|
44
45
|
containerType: 'inline-size'
|
|
45
46
|
});
|
|
47
|
+
|
|
48
|
+
// Keep these checks in sync with the extensionScrollInlineShadowStyles @supports condition in
|
|
49
|
+
// editor-core/src/ui/EditorContentContainer/EditorContentContainer-compiled.tsx.
|
|
50
|
+
var isCssScrollTimelineSupported = (0, _memoizeOne.default)(function (browserCSS) {
|
|
51
|
+
if (!browserCSS || typeof browserCSS.supports !== 'function') {
|
|
52
|
+
return false;
|
|
53
|
+
}
|
|
54
|
+
return browserCSS.supports('animation-timeline', '--test-timeline') && browserCSS.supports('scroll-timeline-name', '--test-timeline') && browserCSS.supports('timeline-scope', '--test-timeline') && browserCSS.supports('animation-range', '0% 101%');
|
|
55
|
+
});
|
|
46
56
|
function ExtensionWithPluginState(props) {
|
|
47
57
|
var _node$attrs;
|
|
48
58
|
var node = props.node,
|
|
@@ -113,6 +123,7 @@ function ExtensionWithPluginState(props) {
|
|
|
113
123
|
'without-frame': removeBorder
|
|
114
124
|
}, _styles2.widerLayoutClassName, shouldBreakout));
|
|
115
125
|
var overflowClassNames = (0, _classnames2.default)('extension-overflow-wrapper', {
|
|
126
|
+
'extension-scroll-inline-shadow': (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_reduce_forced_layout_2') && !hasBody && node.attrs.extensionType !== 'com.atlassian.ai-blocks',
|
|
116
127
|
'with-body': hasBody,
|
|
117
128
|
'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
|
|
118
129
|
// Adding extra padding for renderer view so users can have a touch target to click on the extension
|
|
@@ -269,6 +280,9 @@ var Extension = function Extension(props) {
|
|
|
269
280
|
}, props));
|
|
270
281
|
};
|
|
271
282
|
var _default_1 = (0, _ui.overflowShadow)(Extension, {
|
|
272
|
-
overflowSelector: '.extension-overflow-wrapper'
|
|
283
|
+
overflowSelector: '.extension-overflow-wrapper',
|
|
284
|
+
isDisabled: function isDisabled() {
|
|
285
|
+
return (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_reduce_forced_layout_2') && isCssScrollTimelineSupported(globalThis.CSS);
|
|
286
|
+
}
|
|
273
287
|
});
|
|
274
288
|
var _default = exports.default = _default_1;
|
|
@@ -27,7 +27,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
|
|
|
27
27
|
var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
|
|
28
28
|
var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
|
|
29
29
|
var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
|
|
30
|
-
var packageVersion = "131.
|
|
30
|
+
var packageVersion = "131.3.0";
|
|
31
31
|
var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
|
|
32
32
|
// Remove URL as it has UGC
|
|
33
33
|
// Ignored via go/ees007
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
._zulp1ejb{gap:var(--ds-space-300,24px)}
|
|
2
|
+
._1rjcoahv{padding-block:var(--ds-space-600,3pc)}
|
|
3
|
+
._1rjcxy5q{padding-block:var(--ds-space-400,2pc)}._1bah1h6o{justify-content:center}
|
|
4
|
+
._1bsb1mcy{width:57px}
|
|
5
|
+
._1bsb1osq{width:100%}
|
|
6
|
+
._1bsbtudo{width:76px}
|
|
7
|
+
._1e0c1txw{display:flex}
|
|
8
|
+
._2lx21bp4{flex-direction:column}
|
|
9
|
+
._4cvr1h6o{align-items:center}
|
|
10
|
+
._4t3i1h39{height:63px}
|
|
11
|
+
._4t3io7ol{height:84px}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
/* QuickInsertEmptyState.tsx generated by @compiled/babel-plugin v3.0.2 */
|
|
2
|
+
"use strict";
|
|
3
|
+
|
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.QuickInsertEmptyState = void 0;
|
|
9
|
+
require("./QuickInsertEmptyState.compiled.css");
|
|
10
|
+
var _runtime = require("@compiled/react/runtime");
|
|
11
|
+
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
12
|
+
var _react = _interopRequireDefault(require("react"));
|
|
13
|
+
var _reactIntl = require("react-intl");
|
|
14
|
+
var _reactLooselyLazy = require("react-loosely-lazy");
|
|
15
|
+
var _css = require("@atlaskit/css");
|
|
16
|
+
var _box = require("@atlaskit/primitives/compiled/box");
|
|
17
|
+
var _text = require("@atlaskit/primitives/compiled/text");
|
|
18
|
+
var _messages = require("./messages");
|
|
19
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != (0, _typeof2.default)(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
20
|
+
var NoResultsIllustration = (0, _reactLooselyLazy.lazy)(function () {
|
|
21
|
+
return Promise.resolve().then(function () {
|
|
22
|
+
return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_editor-quick-insert-no-results" */
|
|
23
|
+
'./assets/no-results'));
|
|
24
|
+
}).then(function (module) {
|
|
25
|
+
return module.default;
|
|
26
|
+
});
|
|
27
|
+
});
|
|
28
|
+
var styles = {
|
|
29
|
+
base: "_zulp1ejb _4cvr1h6o _1e0c1txw _2lx21bp4 _1bah1h6o _1bsb1osq",
|
|
30
|
+
compact: "_1rjcxy5q",
|
|
31
|
+
spacious: "_1rjcoahv",
|
|
32
|
+
inlineIllustration: "_4t3i1h39 _1bsb1mcy",
|
|
33
|
+
fullIllustration: "_4t3io7ol _1bsbtudo"
|
|
34
|
+
};
|
|
35
|
+
var QuickInsertEmptyState = exports.QuickInsertEmptyState = function QuickInsertEmptyState(_ref) {
|
|
36
|
+
var mode = _ref.mode,
|
|
37
|
+
_ref$spacing = _ref.spacing,
|
|
38
|
+
spacing = _ref$spacing === void 0 ? mode === 'full' ? 'spacious' : 'compact' : _ref$spacing;
|
|
39
|
+
var _useIntl = (0, _reactIntl.useIntl)(),
|
|
40
|
+
formatMessage = _useIntl.formatMessage;
|
|
41
|
+
var illustrationSize = mode === 'full' ? {
|
|
42
|
+
width: 76,
|
|
43
|
+
height: 84
|
|
44
|
+
} : {
|
|
45
|
+
width: 57,
|
|
46
|
+
height: 63
|
|
47
|
+
};
|
|
48
|
+
return /*#__PURE__*/_react.default.createElement(_box.Box, {
|
|
49
|
+
testId: "quick-insert-empty-state",
|
|
50
|
+
xcss: (0, _css.cx)(styles.base, styles[spacing])
|
|
51
|
+
}, /*#__PURE__*/_react.default.createElement(_box.Box, {
|
|
52
|
+
xcss: mode === 'full' ? styles.fullIllustration : styles.inlineIllustration
|
|
53
|
+
}, /*#__PURE__*/_react.default.createElement(_reactLooselyLazy.LazySuspense, {
|
|
54
|
+
fallback: null
|
|
55
|
+
}, /*#__PURE__*/_react.default.createElement(NoResultsIllustration, {
|
|
56
|
+
width: illustrationSize.width,
|
|
57
|
+
height: illustrationSize.height
|
|
58
|
+
}))), /*#__PURE__*/_react.default.createElement(_text.Text, {
|
|
59
|
+
align: "center"
|
|
60
|
+
}, formatMessage(_messages.messages.noSearchResults)));
|
|
61
|
+
};
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = NoResultsIllustration;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
function NoResultsIllustration(_ref) {
|
|
10
|
+
var height = _ref.height,
|
|
11
|
+
width = _ref.width;
|
|
12
|
+
return /*#__PURE__*/_react.default.createElement("svg", {
|
|
13
|
+
width: width,
|
|
14
|
+
height: height,
|
|
15
|
+
viewBox: "0 0 57 63",
|
|
16
|
+
fill: "none",
|
|
17
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
18
|
+
"aria-hidden": "true",
|
|
19
|
+
focusable: "false"
|
|
20
|
+
}, /*#__PURE__*/_react.default.createElement("path", {
|
|
21
|
+
fill: "#dddee1",
|
|
22
|
+
d: "M23.5 49.223c-5.196 0-10.166-1.955-14.442-5.814a30 30 0 0 1-3.545-3.85 29.6 29.6 0 0 1-2.868-4.456c-4.56-8.775-3.179-18.124 3.79-25.647a32.6 32.6 0 0 1 3.942-3.593 32 32 0 0 1 4.287-2.81c9.017-4.89 18.424-3.869 25.803 2.8a30.3 30.3 0 0 1 3.59 3.897 29.7 29.7 0 0 1 2.837 4.396C51.5 22.96 50.12 32.324 43.106 39.83a31.5 31.5 0 0 1-3.797 3.442 33 33 0 0 1-4.468 2.912c-3.777 2.03-7.62 3.036-11.341 3.036zm2.478-44.539c-2.957 0-6.02.824-9.082 2.489a28 28 0 0 0-3.658 2.396 27.5 27.5 0 0 0-3.37 3.07C4.24 18.711 3.15 25.92 6.798 32.941a25 25 0 0 0 2.42 3.75 25 25 0 0 0 2.981 3.24c5.866 5.299 13.119 6.054 20.427 2.13a27.4 27.4 0 0 0 3.818-2.492 27.5 27.5 0 0 0 3.24-2.936c5.658-6.054 6.741-13.27 3.06-20.318a25 25 0 0 0-2.39-3.698 25.3 25.3 0 0 0-3.021-3.289c-3.418-3.086-7.288-4.645-11.348-4.645z"
|
|
23
|
+
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
24
|
+
fill: "#dddee1",
|
|
25
|
+
d: "M42.822 42.291c-1.21-1.685-2.509-1.675-3.777-.694-1.19.92-1.507 2.164-.24 3.801l1.45 1.873 4.017-3.107z"
|
|
26
|
+
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
27
|
+
fill: "#dddee1",
|
|
28
|
+
d: "m45.28 43.385-6.03 4.663 11.332 14.657 6.03-4.663z"
|
|
29
|
+
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
30
|
+
fill: "#b7b9be",
|
|
31
|
+
d: "m44.31 44.134-4.091 3.163 3.843 4.97 4.091-3.163z"
|
|
32
|
+
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
33
|
+
fill: "#dddee1",
|
|
34
|
+
d: "M26.834 30.328h-3.42v-.217c-.116-2.432 1.264-5.066 3.227-6.143l.037-.02q.08-.042.154-.093c1.071-.69 1.68-1.88 1.643-3.189-.037-1.298-.707-2.439-1.791-3.052a4.5 4.5 0 0 0-2.21-.592c-2.315 0-4.198 1.897-4.198 4.229h-3.42c0-4.23 3.417-7.672 7.618-7.672a7.9 7.9 0 0 1 3.884 1.033c2.14 1.211 3.462 3.437 3.534 5.955.073 2.53-1.125 4.84-3.203 6.18q-.211.139-.424.251c-.815.458-1.497 1.868-1.434 2.97zM24.795 32.303a3.4 3.4 0 0 1 1.096-.004c1.115.183 2.021.965 2.241 2.182l.002.01.002.009a3.4 3.4 0 0 1-.002 1.103v.004c-.216 1.23-1.136 2.009-2.247 2.19a3.417 3.417 0 0 1-1.085-.003c-1.117-.18-2.027-.961-2.249-2.179l-.002-.01-.001-.01a3.3 3.3 0 0 1 0-1.095l.002-.01.001-.01c.223-1.223 1.137-1.992 2.24-2.177z"
|
|
35
|
+
}));
|
|
36
|
+
}
|
|
@@ -146,6 +146,11 @@ var messages = exports.messages = (0, _reactIntl.defineMessages)({
|
|
|
146
146
|
defaultMessage: 'Search results',
|
|
147
147
|
description: 'Heading shown above the matching items when searching in the Quick Insert menu.'
|
|
148
148
|
},
|
|
149
|
+
noSearchResults: {
|
|
150
|
+
id: 'editor-common.quick-insert.noSearchResults',
|
|
151
|
+
defaultMessage: "We couldn't find any results.",
|
|
152
|
+
description: 'Message shown when a Quick Insert search has no matching results.'
|
|
153
|
+
},
|
|
149
154
|
previewAttributionBy: {
|
|
150
155
|
id: 'editor-common.quick-insert.previewAttributionBy',
|
|
151
156
|
defaultMessage: 'By {name}',
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.useQuickInsertSearchAnalytics = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
var _enums = require("../analytics/types/enums");
|
|
11
|
+
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; }
|
|
12
|
+
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) { (0, _defineProperty2.default)(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; }
|
|
13
|
+
var SEARCH_DEBOUNCE_MS = 1000;
|
|
14
|
+
var useQuickInsertSearchAnalytics = exports.useQuickInsertSearchAnalytics = function useQuickInsertSearchAnalytics(_ref) {
|
|
15
|
+
var query = _ref.query,
|
|
16
|
+
resultCount = _ref.resultCount,
|
|
17
|
+
surface = _ref.surface,
|
|
18
|
+
category = _ref.category,
|
|
19
|
+
_ref$isOpen = _ref.isOpen,
|
|
20
|
+
isOpen = _ref$isOpen === void 0 ? true : _ref$isOpen,
|
|
21
|
+
fireAnalyticsEvent = _ref.fireAnalyticsEvent;
|
|
22
|
+
var latestOptions = (0, _react.useRef)({
|
|
23
|
+
query: query,
|
|
24
|
+
resultCount: resultCount,
|
|
25
|
+
surface: surface,
|
|
26
|
+
category: category,
|
|
27
|
+
fireAnalyticsEvent: fireAnalyticsEvent
|
|
28
|
+
});
|
|
29
|
+
latestOptions.current = {
|
|
30
|
+
query: query,
|
|
31
|
+
resultCount: resultCount,
|
|
32
|
+
surface: surface,
|
|
33
|
+
category: category,
|
|
34
|
+
fireAnalyticsEvent: fireAnalyticsEvent
|
|
35
|
+
};
|
|
36
|
+
var pendingSearch = (0, _react.useRef)(null);
|
|
37
|
+
var effectVersion = (0, _react.useRef)(0);
|
|
38
|
+
var flush = (0, _react.useCallback)(function () {
|
|
39
|
+
var pending = pendingSearch.current;
|
|
40
|
+
if (!pending) {
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
clearTimeout(pending.timer);
|
|
44
|
+
pendingSearch.current = null;
|
|
45
|
+
var current = latestOptions.current;
|
|
46
|
+
if (current.query.trim() !== pending.query || !current.fireAnalyticsEvent) {
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
49
|
+
var attributes = _objectSpread(_objectSpread({}, current.surface === 'element-browser' && current.category !== undefined ? {
|
|
50
|
+
category: current.category
|
|
51
|
+
} : {}), {}, {
|
|
52
|
+
isEmpty: current.resultCount === 0,
|
|
53
|
+
queryLength: current.query.trim().length,
|
|
54
|
+
resultCount: current.resultCount,
|
|
55
|
+
surface: current.surface
|
|
56
|
+
});
|
|
57
|
+
var payload = {
|
|
58
|
+
action: _enums.ACTION.SEARCHED,
|
|
59
|
+
actionSubject: _enums.ACTION_SUBJECT.QUICK_INSERT,
|
|
60
|
+
eventType: _enums.EVENT_TYPE.TRACK,
|
|
61
|
+
attributes: attributes
|
|
62
|
+
};
|
|
63
|
+
current.fireAnalyticsEvent(payload);
|
|
64
|
+
}, []);
|
|
65
|
+
(0, _react.useEffect)(function () {
|
|
66
|
+
var currentVersion = ++effectVersion.current;
|
|
67
|
+
if (!isOpen) {
|
|
68
|
+
flush();
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
var trimmedQuery = query.trim();
|
|
72
|
+
if (!trimmedQuery) {
|
|
73
|
+
if (pendingSearch.current) {
|
|
74
|
+
clearTimeout(pendingSearch.current.timer);
|
|
75
|
+
pendingSearch.current = null;
|
|
76
|
+
}
|
|
77
|
+
return;
|
|
78
|
+
}
|
|
79
|
+
if (pendingSearch.current) {
|
|
80
|
+
clearTimeout(pendingSearch.current.timer);
|
|
81
|
+
}
|
|
82
|
+
var timer = setTimeout(flush, SEARCH_DEBOUNCE_MS);
|
|
83
|
+
pendingSearch.current = {
|
|
84
|
+
query: trimmedQuery,
|
|
85
|
+
timer: timer
|
|
86
|
+
};
|
|
87
|
+
return function () {
|
|
88
|
+
if (pendingSearch.current) {
|
|
89
|
+
clearTimeout(pendingSearch.current.timer);
|
|
90
|
+
}
|
|
91
|
+
Promise.resolve().then(function () {
|
|
92
|
+
// oxlint-disable-next-line react-hooks/exhaustive-deps -- The live effect version distinguishes dependency cleanup from a real unmount.
|
|
93
|
+
if (effectVersion.current === currentVersion) {
|
|
94
|
+
flush();
|
|
95
|
+
}
|
|
96
|
+
});
|
|
97
|
+
};
|
|
98
|
+
}, [query, surface, category, isOpen, flush]);
|
|
99
|
+
return flush;
|
|
100
|
+
};
|
|
@@ -24,7 +24,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
|
|
|
24
24
|
* @jsx jsx
|
|
25
25
|
*/ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
26
26
|
var packageName = "@atlaskit/editor-common";
|
|
27
|
-
var packageVersion = "131.
|
|
27
|
+
var packageVersion = "131.3.0";
|
|
28
28
|
var halfFocusRing = 1;
|
|
29
29
|
var dropOffset = '0, 8';
|
|
30
30
|
var fadeIn = (0, _react2.keyframes)({
|
|
@@ -44,7 +44,7 @@ function overflowShadow(Component, options) {
|
|
|
44
44
|
_this.updateShadows();
|
|
45
45
|
});
|
|
46
46
|
(0, _defineProperty2.default)(_this, "updateShadows", function () {
|
|
47
|
-
if (options.useShadowObserver) {
|
|
47
|
+
if (_this.isDisabled || options.useShadowObserver) {
|
|
48
48
|
return;
|
|
49
49
|
}
|
|
50
50
|
_this.setState(function (prevState) {
|
|
@@ -98,6 +98,9 @@ function overflowShadow(Component, options) {
|
|
|
98
98
|
if (!_this.overflowContainer) {
|
|
99
99
|
_this.overflowContainer = container;
|
|
100
100
|
}
|
|
101
|
+
if (_this.isDisabled) {
|
|
102
|
+
return;
|
|
103
|
+
}
|
|
101
104
|
if (options.useShadowObserver) {
|
|
102
105
|
_this.initShadowObserver();
|
|
103
106
|
return;
|
|
@@ -111,6 +114,15 @@ function overflowShadow(Component, options) {
|
|
|
111
114
|
}
|
|
112
115
|
(0, _inherits2.default)(OverflowShadow, _React$Component);
|
|
113
116
|
return (0, _createClass2.default)(OverflowShadow, [{
|
|
117
|
+
key: "isDisabled",
|
|
118
|
+
get: function get() {
|
|
119
|
+
if (this.disabled === undefined) {
|
|
120
|
+
var _options$isDisabled, _options$isDisabled2;
|
|
121
|
+
this.disabled = (_options$isDisabled = (_options$isDisabled2 = options.isDisabled) === null || _options$isDisabled2 === void 0 ? void 0 : _options$isDisabled2.call(options)) !== null && _options$isDisabled !== void 0 ? _options$isDisabled : false;
|
|
122
|
+
}
|
|
123
|
+
return this.disabled;
|
|
124
|
+
}
|
|
125
|
+
}, {
|
|
114
126
|
key: "componentWillUnmount",
|
|
115
127
|
value: function componentWillUnmount() {
|
|
116
128
|
if (options.useShadowObserver) {
|
|
@@ -161,7 +173,7 @@ function overflowShadow(Component, options) {
|
|
|
161
173
|
var _this$state = this.state,
|
|
162
174
|
showLeftShadow = _this$state.showLeftShadow,
|
|
163
175
|
showRightShadow = _this$state.showRightShadow;
|
|
164
|
-
var classNames = [!((_this$props = this.props) !== null && _this$props !== void 0 && _this$props.disableTableOverflowShadow) && showRightShadow && shadowClassNames.RIGHT_SHADOW, !((_this$props2 = this.props) !== null && _this$props2 !== void 0 && _this$props2.disableTableOverflowShadow) && showLeftShadow && shadowClassNames.LEFT_SHADOW, options.useShadowObserver && _shadowObserverClassNames.shadowObserverClassNames.SHADOW_CONTAINER].filter(Boolean).join(' ');
|
|
176
|
+
var classNames = this.isDisabled ? '' : [!((_this$props = this.props) !== null && _this$props !== void 0 && _this$props.disableTableOverflowShadow) && showRightShadow && shadowClassNames.RIGHT_SHADOW, !((_this$props2 = this.props) !== null && _this$props2 !== void 0 && _this$props2.disableTableOverflowShadow) && showLeftShadow && shadowClassNames.LEFT_SHADOW, options.useShadowObserver && _shadowObserverClassNames.shadowObserverClassNames.SHADOW_CONTAINER].filter(Boolean).join(' ');
|
|
165
177
|
|
|
166
178
|
/**
|
|
167
179
|
* The widths have already been calculated to determine
|
|
@@ -125,6 +125,7 @@ export let ACTION = /*#__PURE__*/function (ACTION) {
|
|
|
125
125
|
ACTION["REPLACED_ALL"] = "replacedAll";
|
|
126
126
|
ACTION["REPLACED_ONE"] = "replacedOne";
|
|
127
127
|
ACTION["RESOLVED"] = "resolved";
|
|
128
|
+
ACTION["SEARCHED"] = "searched";
|
|
128
129
|
ACTION["REQUEST_TO_EDIT"] = "requestToEdit";
|
|
129
130
|
ACTION["SELECTED"] = "selected";
|
|
130
131
|
ACTION["SHOWN"] = "shown";
|
|
@@ -9,6 +9,7 @@ import React, { Fragment, useCallback, useState } from 'react';
|
|
|
9
9
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
10
10
|
import { css, jsx } from '@emotion/react';
|
|
11
11
|
import classnames from 'classnames';
|
|
12
|
+
import memoizeOne from 'memoize-one';
|
|
12
13
|
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
13
14
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
14
15
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
@@ -30,6 +31,15 @@ const hoverStyles = css({
|
|
|
30
31
|
const containerStyle = css({
|
|
31
32
|
containerType: 'inline-size'
|
|
32
33
|
});
|
|
34
|
+
|
|
35
|
+
// Keep these checks in sync with the extensionScrollInlineShadowStyles @supports condition in
|
|
36
|
+
// editor-core/src/ui/EditorContentContainer/EditorContentContainer-compiled.tsx.
|
|
37
|
+
const isCssScrollTimelineSupported = memoizeOne(browserCSS => {
|
|
38
|
+
if (!browserCSS || typeof browserCSS.supports !== 'function') {
|
|
39
|
+
return false;
|
|
40
|
+
}
|
|
41
|
+
return browserCSS.supports('animation-timeline', '--test-timeline') && browserCSS.supports('scroll-timeline-name', '--test-timeline') && browserCSS.supports('timeline-scope', '--test-timeline') && browserCSS.supports('animation-range', '0% 101%');
|
|
42
|
+
});
|
|
33
43
|
function ExtensionWithPluginState(props) {
|
|
34
44
|
var _node$attrs, _node$attrs$parameter, _node$attrs$parameter2, _node$attrs$parameter3;
|
|
35
45
|
const {
|
|
@@ -103,6 +113,7 @@ function ExtensionWithPluginState(props) {
|
|
|
103
113
|
[widerLayoutClassName]: shouldBreakout
|
|
104
114
|
});
|
|
105
115
|
const overflowClassNames = classnames('extension-overflow-wrapper', {
|
|
116
|
+
'extension-scroll-inline-shadow': isExperimentEnabled('platform_editor_reduce_forced_layout_2') && !hasBody && node.attrs.extensionType !== 'com.atlassian.ai-blocks',
|
|
106
117
|
'with-body': hasBody,
|
|
107
118
|
'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
|
|
108
119
|
// Adding extra padding for renderer view so users can have a touch target to click on the extension
|
|
@@ -262,6 +273,7 @@ const Extension = props => {
|
|
|
262
273
|
}, props));
|
|
263
274
|
};
|
|
264
275
|
const _default_1 = overflowShadow(Extension, {
|
|
265
|
-
overflowSelector: '.extension-overflow-wrapper'
|
|
276
|
+
overflowSelector: '.extension-overflow-wrapper',
|
|
277
|
+
isDisabled: () => isExperimentEnabled('platform_editor_reduce_forced_layout_2') && isCssScrollTimelineSupported(globalThis.CSS)
|
|
266
278
|
});
|
|
267
279
|
export default _default_1;
|
|
@@ -13,7 +13,7 @@ const NETWORK_FAILURE_REGEX = /^network failure/i;
|
|
|
13
13
|
const RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
|
|
14
14
|
const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
|
|
15
15
|
const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
|
|
16
|
-
const packageVersion = "131.
|
|
16
|
+
const packageVersion = "131.3.0";
|
|
17
17
|
const sanitiseSentryEvents = (data, _hint) => {
|
|
18
18
|
// Remove URL as it has UGC
|
|
19
19
|
// Ignored via go/ees007
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
._zulp1ejb{gap:var(--ds-space-300,24px)}
|
|
2
|
+
._1rjcoahv{padding-block:var(--ds-space-600,3pc)}
|
|
3
|
+
._1rjcxy5q{padding-block:var(--ds-space-400,2pc)}._1bah1h6o{justify-content:center}
|
|
4
|
+
._1bsb1mcy{width:57px}
|
|
5
|
+
._1bsb1osq{width:100%}
|
|
6
|
+
._1bsbtudo{width:76px}
|
|
7
|
+
._1e0c1txw{display:flex}
|
|
8
|
+
._2lx21bp4{flex-direction:column}
|
|
9
|
+
._4cvr1h6o{align-items:center}
|
|
10
|
+
._4t3i1h39{height:63px}
|
|
11
|
+
._4t3io7ol{height:84px}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
/* QuickInsertEmptyState.tsx generated by @compiled/babel-plugin v3.0.2 */
|
|
2
|
+
import "./QuickInsertEmptyState.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import { useIntl } from 'react-intl';
|
|
6
|
+
import { lazy, LazySuspense } from 'react-loosely-lazy';
|
|
7
|
+
import { cx } from '@atlaskit/css';
|
|
8
|
+
import { Box } from '@atlaskit/primitives/compiled/box';
|
|
9
|
+
import { Text } from '@atlaskit/primitives/compiled/text';
|
|
10
|
+
import { messages } from './messages';
|
|
11
|
+
const NoResultsIllustration = lazy(() => import( /* webpackChunkName: "@atlaskit-internal_editor-quick-insert-no-results" */
|
|
12
|
+
'./assets/no-results').then(module => module.default));
|
|
13
|
+
const styles = {
|
|
14
|
+
base: "_zulp1ejb _4cvr1h6o _1e0c1txw _2lx21bp4 _1bah1h6o _1bsb1osq",
|
|
15
|
+
compact: "_1rjcxy5q",
|
|
16
|
+
spacious: "_1rjcoahv",
|
|
17
|
+
inlineIllustration: "_4t3i1h39 _1bsb1mcy",
|
|
18
|
+
fullIllustration: "_4t3io7ol _1bsbtudo"
|
|
19
|
+
};
|
|
20
|
+
export const QuickInsertEmptyState = ({
|
|
21
|
+
mode,
|
|
22
|
+
spacing = mode === 'full' ? 'spacious' : 'compact'
|
|
23
|
+
}) => {
|
|
24
|
+
const {
|
|
25
|
+
formatMessage
|
|
26
|
+
} = useIntl();
|
|
27
|
+
const illustrationSize = mode === 'full' ? {
|
|
28
|
+
width: 76,
|
|
29
|
+
height: 84
|
|
30
|
+
} : {
|
|
31
|
+
width: 57,
|
|
32
|
+
height: 63
|
|
33
|
+
};
|
|
34
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
35
|
+
testId: "quick-insert-empty-state",
|
|
36
|
+
xcss: cx(styles.base, styles[spacing])
|
|
37
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
38
|
+
xcss: mode === 'full' ? styles.fullIllustration : styles.inlineIllustration
|
|
39
|
+
}, /*#__PURE__*/React.createElement(LazySuspense, {
|
|
40
|
+
fallback: null
|
|
41
|
+
}, /*#__PURE__*/React.createElement(NoResultsIllustration, {
|
|
42
|
+
width: illustrationSize.width,
|
|
43
|
+
height: illustrationSize.height
|
|
44
|
+
}))), /*#__PURE__*/React.createElement(Text, {
|
|
45
|
+
align: "center"
|
|
46
|
+
}, formatMessage(messages.noSearchResults)));
|
|
47
|
+
};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export default function NoResultsIllustration({
|
|
3
|
+
height,
|
|
4
|
+
width
|
|
5
|
+
}) {
|
|
6
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
7
|
+
width: width,
|
|
8
|
+
height: height,
|
|
9
|
+
viewBox: "0 0 57 63",
|
|
10
|
+
fill: "none",
|
|
11
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
12
|
+
"aria-hidden": "true",
|
|
13
|
+
focusable: "false"
|
|
14
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
15
|
+
fill: "#dddee1",
|
|
16
|
+
d: "M23.5 49.223c-5.196 0-10.166-1.955-14.442-5.814a30 30 0 0 1-3.545-3.85 29.6 29.6 0 0 1-2.868-4.456c-4.56-8.775-3.179-18.124 3.79-25.647a32.6 32.6 0 0 1 3.942-3.593 32 32 0 0 1 4.287-2.81c9.017-4.89 18.424-3.869 25.803 2.8a30.3 30.3 0 0 1 3.59 3.897 29.7 29.7 0 0 1 2.837 4.396C51.5 22.96 50.12 32.324 43.106 39.83a31.5 31.5 0 0 1-3.797 3.442 33 33 0 0 1-4.468 2.912c-3.777 2.03-7.62 3.036-11.341 3.036zm2.478-44.539c-2.957 0-6.02.824-9.082 2.489a28 28 0 0 0-3.658 2.396 27.5 27.5 0 0 0-3.37 3.07C4.24 18.711 3.15 25.92 6.798 32.941a25 25 0 0 0 2.42 3.75 25 25 0 0 0 2.981 3.24c5.866 5.299 13.119 6.054 20.427 2.13a27.4 27.4 0 0 0 3.818-2.492 27.5 27.5 0 0 0 3.24-2.936c5.658-6.054 6.741-13.27 3.06-20.318a25 25 0 0 0-2.39-3.698 25.3 25.3 0 0 0-3.021-3.289c-3.418-3.086-7.288-4.645-11.348-4.645z"
|
|
17
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18
|
+
fill: "#dddee1",
|
|
19
|
+
d: "M42.822 42.291c-1.21-1.685-2.509-1.675-3.777-.694-1.19.92-1.507 2.164-.24 3.801l1.45 1.873 4.017-3.107z"
|
|
20
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
21
|
+
fill: "#dddee1",
|
|
22
|
+
d: "m45.28 43.385-6.03 4.663 11.332 14.657 6.03-4.663z"
|
|
23
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
24
|
+
fill: "#b7b9be",
|
|
25
|
+
d: "m44.31 44.134-4.091 3.163 3.843 4.97 4.091-3.163z"
|
|
26
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
27
|
+
fill: "#dddee1",
|
|
28
|
+
d: "M26.834 30.328h-3.42v-.217c-.116-2.432 1.264-5.066 3.227-6.143l.037-.02q.08-.042.154-.093c1.071-.69 1.68-1.88 1.643-3.189-.037-1.298-.707-2.439-1.791-3.052a4.5 4.5 0 0 0-2.21-.592c-2.315 0-4.198 1.897-4.198 4.229h-3.42c0-4.23 3.417-7.672 7.618-7.672a7.9 7.9 0 0 1 3.884 1.033c2.14 1.211 3.462 3.437 3.534 5.955.073 2.53-1.125 4.84-3.203 6.18q-.211.139-.424.251c-.815.458-1.497 1.868-1.434 2.97zM24.795 32.303a3.4 3.4 0 0 1 1.096-.004c1.115.183 2.021.965 2.241 2.182l.002.01.002.009a3.4 3.4 0 0 1-.002 1.103v.004c-.216 1.23-1.136 2.009-2.247 2.19a3.417 3.417 0 0 1-1.085-.003c-1.117-.18-2.027-.961-2.249-2.179l-.002-.01-.001-.01a3.3 3.3 0 0 1 0-1.095l.002-.01.001-.01c.223-1.223 1.137-1.992 2.24-2.177z"
|
|
29
|
+
}));
|
|
30
|
+
}
|
|
@@ -140,6 +140,11 @@ export const messages = defineMessages({
|
|
|
140
140
|
defaultMessage: 'Search results',
|
|
141
141
|
description: 'Heading shown above the matching items when searching in the Quick Insert menu.'
|
|
142
142
|
},
|
|
143
|
+
noSearchResults: {
|
|
144
|
+
id: 'editor-common.quick-insert.noSearchResults',
|
|
145
|
+
defaultMessage: "We couldn't find any results.",
|
|
146
|
+
description: 'Message shown when a Quick Insert search has no matching results.'
|
|
147
|
+
},
|
|
143
148
|
previewAttributionBy: {
|
|
144
149
|
id: 'editor-common.quick-insert.previewAttributionBy',
|
|
145
150
|
defaultMessage: 'By {name}',
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import { useCallback, useEffect, useRef } from 'react';
|
|
2
|
+
import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../analytics/types/enums';
|
|
3
|
+
const SEARCH_DEBOUNCE_MS = 1000;
|
|
4
|
+
export const useQuickInsertSearchAnalytics = ({
|
|
5
|
+
query,
|
|
6
|
+
resultCount,
|
|
7
|
+
surface,
|
|
8
|
+
category,
|
|
9
|
+
isOpen = true,
|
|
10
|
+
fireAnalyticsEvent
|
|
11
|
+
}) => {
|
|
12
|
+
const latestOptions = useRef({
|
|
13
|
+
query,
|
|
14
|
+
resultCount,
|
|
15
|
+
surface,
|
|
16
|
+
category,
|
|
17
|
+
fireAnalyticsEvent
|
|
18
|
+
});
|
|
19
|
+
latestOptions.current = {
|
|
20
|
+
query,
|
|
21
|
+
resultCount,
|
|
22
|
+
surface,
|
|
23
|
+
category,
|
|
24
|
+
fireAnalyticsEvent
|
|
25
|
+
};
|
|
26
|
+
const pendingSearch = useRef(null);
|
|
27
|
+
const effectVersion = useRef(0);
|
|
28
|
+
const flush = useCallback(() => {
|
|
29
|
+
const pending = pendingSearch.current;
|
|
30
|
+
if (!pending) {
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
clearTimeout(pending.timer);
|
|
34
|
+
pendingSearch.current = null;
|
|
35
|
+
const current = latestOptions.current;
|
|
36
|
+
if (current.query.trim() !== pending.query || !current.fireAnalyticsEvent) {
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
const attributes = {
|
|
40
|
+
...(current.surface === 'element-browser' && current.category !== undefined ? {
|
|
41
|
+
category: current.category
|
|
42
|
+
} : {}),
|
|
43
|
+
isEmpty: current.resultCount === 0,
|
|
44
|
+
queryLength: current.query.trim().length,
|
|
45
|
+
resultCount: current.resultCount,
|
|
46
|
+
surface: current.surface
|
|
47
|
+
};
|
|
48
|
+
const payload = {
|
|
49
|
+
action: ACTION.SEARCHED,
|
|
50
|
+
actionSubject: ACTION_SUBJECT.QUICK_INSERT,
|
|
51
|
+
eventType: EVENT_TYPE.TRACK,
|
|
52
|
+
attributes
|
|
53
|
+
};
|
|
54
|
+
current.fireAnalyticsEvent(payload);
|
|
55
|
+
}, []);
|
|
56
|
+
useEffect(() => {
|
|
57
|
+
const currentVersion = ++effectVersion.current;
|
|
58
|
+
if (!isOpen) {
|
|
59
|
+
flush();
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
const trimmedQuery = query.trim();
|
|
63
|
+
if (!trimmedQuery) {
|
|
64
|
+
if (pendingSearch.current) {
|
|
65
|
+
clearTimeout(pendingSearch.current.timer);
|
|
66
|
+
pendingSearch.current = null;
|
|
67
|
+
}
|
|
68
|
+
return;
|
|
69
|
+
}
|
|
70
|
+
if (pendingSearch.current) {
|
|
71
|
+
clearTimeout(pendingSearch.current.timer);
|
|
72
|
+
}
|
|
73
|
+
const timer = setTimeout(flush, SEARCH_DEBOUNCE_MS);
|
|
74
|
+
pendingSearch.current = {
|
|
75
|
+
query: trimmedQuery,
|
|
76
|
+
timer
|
|
77
|
+
};
|
|
78
|
+
return () => {
|
|
79
|
+
if (pendingSearch.current) {
|
|
80
|
+
clearTimeout(pendingSearch.current.timer);
|
|
81
|
+
}
|
|
82
|
+
Promise.resolve().then(() => {
|
|
83
|
+
// oxlint-disable-next-line react-hooks/exhaustive-deps -- The live effect version distinguishes dependency cleanup from a real unmount.
|
|
84
|
+
if (effectVersion.current === currentVersion) {
|
|
85
|
+
flush();
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
};
|
|
89
|
+
}, [query, surface, category, isOpen, flush]);
|
|
90
|
+
return flush;
|
|
91
|
+
};
|
|
@@ -14,7 +14,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
|
14
14
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
15
15
|
import Layer from '../Layer';
|
|
16
16
|
const packageName = "@atlaskit/editor-common";
|
|
17
|
-
const packageVersion = "131.
|
|
17
|
+
const packageVersion = "131.3.0";
|
|
18
18
|
const halfFocusRing = 1;
|
|
19
19
|
const dropOffset = '0, 8';
|
|
20
20
|
const fadeIn = keyframes({
|
|
@@ -24,7 +24,7 @@ export default function overflowShadow(Component, options) {
|
|
|
24
24
|
this.updateShadows();
|
|
25
25
|
});
|
|
26
26
|
_defineProperty(this, "updateShadows", () => {
|
|
27
|
-
if (options.useShadowObserver) {
|
|
27
|
+
if (this.isDisabled || options.useShadowObserver) {
|
|
28
28
|
return;
|
|
29
29
|
}
|
|
30
30
|
this.setState(prevState => {
|
|
@@ -78,6 +78,9 @@ export default function overflowShadow(Component, options) {
|
|
|
78
78
|
if (!this.overflowContainer) {
|
|
79
79
|
this.overflowContainer = container;
|
|
80
80
|
}
|
|
81
|
+
if (this.isDisabled) {
|
|
82
|
+
return;
|
|
83
|
+
}
|
|
81
84
|
if (options.useShadowObserver) {
|
|
82
85
|
this.initShadowObserver();
|
|
83
86
|
return;
|
|
@@ -88,6 +91,13 @@ export default function overflowShadow(Component, options) {
|
|
|
88
91
|
this.overflowContainer.addEventListener('scroll', this.handleScroll);
|
|
89
92
|
});
|
|
90
93
|
}
|
|
94
|
+
get isDisabled() {
|
|
95
|
+
if (this.disabled === undefined) {
|
|
96
|
+
var _options$isDisabled, _options$isDisabled2;
|
|
97
|
+
this.disabled = (_options$isDisabled = (_options$isDisabled2 = options.isDisabled) === null || _options$isDisabled2 === void 0 ? void 0 : _options$isDisabled2.call(options)) !== null && _options$isDisabled !== void 0 ? _options$isDisabled : false;
|
|
98
|
+
}
|
|
99
|
+
return this.disabled;
|
|
100
|
+
}
|
|
91
101
|
componentWillUnmount() {
|
|
92
102
|
if (options.useShadowObserver) {
|
|
93
103
|
return this.shadowObserver && this.shadowObserver.dispose();
|
|
@@ -133,7 +143,7 @@ export default function overflowShadow(Component, options) {
|
|
|
133
143
|
showLeftShadow,
|
|
134
144
|
showRightShadow
|
|
135
145
|
} = this.state;
|
|
136
|
-
const classNames = [!((_this$props = this.props) !== null && _this$props !== void 0 && _this$props.disableTableOverflowShadow) && showRightShadow && shadowClassNames.RIGHT_SHADOW, !((_this$props2 = this.props) !== null && _this$props2 !== void 0 && _this$props2.disableTableOverflowShadow) && showLeftShadow && shadowClassNames.LEFT_SHADOW, options.useShadowObserver && shadowObserverClassNames.SHADOW_CONTAINER].filter(Boolean).join(' ');
|
|
146
|
+
const classNames = this.isDisabled ? '' : [!((_this$props = this.props) !== null && _this$props !== void 0 && _this$props.disableTableOverflowShadow) && showRightShadow && shadowClassNames.RIGHT_SHADOW, !((_this$props2 = this.props) !== null && _this$props2 !== void 0 && _this$props2.disableTableOverflowShadow) && showLeftShadow && shadowClassNames.LEFT_SHADOW, options.useShadowObserver && shadowObserverClassNames.SHADOW_CONTAINER].filter(Boolean).join(' ');
|
|
137
147
|
|
|
138
148
|
/**
|
|
139
149
|
* The widths have already been calculated to determine
|
|
@@ -125,6 +125,7 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
|
|
|
125
125
|
ACTION["REPLACED_ALL"] = "replacedAll";
|
|
126
126
|
ACTION["REPLACED_ONE"] = "replacedOne";
|
|
127
127
|
ACTION["RESOLVED"] = "resolved";
|
|
128
|
+
ACTION["SEARCHED"] = "searched";
|
|
128
129
|
ACTION["REQUEST_TO_EDIT"] = "requestToEdit";
|
|
129
130
|
ACTION["SELECTED"] = "selected";
|
|
130
131
|
ACTION["SHOWN"] = "shown";
|
|
@@ -15,6 +15,7 @@ import React, { Fragment, useCallback, useState } from 'react';
|
|
|
15
15
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
16
16
|
import { css, jsx } from '@emotion/react';
|
|
17
17
|
import classnames from 'classnames';
|
|
18
|
+
import memoizeOne from 'memoize-one';
|
|
18
19
|
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
19
20
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
20
21
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
@@ -36,6 +37,15 @@ var hoverStyles = css({
|
|
|
36
37
|
var containerStyle = css({
|
|
37
38
|
containerType: 'inline-size'
|
|
38
39
|
});
|
|
40
|
+
|
|
41
|
+
// Keep these checks in sync with the extensionScrollInlineShadowStyles @supports condition in
|
|
42
|
+
// editor-core/src/ui/EditorContentContainer/EditorContentContainer-compiled.tsx.
|
|
43
|
+
var isCssScrollTimelineSupported = memoizeOne(function (browserCSS) {
|
|
44
|
+
if (!browserCSS || typeof browserCSS.supports !== 'function') {
|
|
45
|
+
return false;
|
|
46
|
+
}
|
|
47
|
+
return browserCSS.supports('animation-timeline', '--test-timeline') && browserCSS.supports('scroll-timeline-name', '--test-timeline') && browserCSS.supports('timeline-scope', '--test-timeline') && browserCSS.supports('animation-range', '0% 101%');
|
|
48
|
+
});
|
|
39
49
|
function ExtensionWithPluginState(props) {
|
|
40
50
|
var _node$attrs;
|
|
41
51
|
var node = props.node,
|
|
@@ -106,6 +116,7 @@ function ExtensionWithPluginState(props) {
|
|
|
106
116
|
'without-frame': removeBorder
|
|
107
117
|
}, widerLayoutClassName, shouldBreakout));
|
|
108
118
|
var overflowClassNames = classnames('extension-overflow-wrapper', {
|
|
119
|
+
'extension-scroll-inline-shadow': isExperimentEnabled('platform_editor_reduce_forced_layout_2') && !hasBody && node.attrs.extensionType !== 'com.atlassian.ai-blocks',
|
|
109
120
|
'with-body': hasBody,
|
|
110
121
|
'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
|
|
111
122
|
// Adding extra padding for renderer view so users can have a touch target to click on the extension
|
|
@@ -262,6 +273,9 @@ var Extension = function Extension(props) {
|
|
|
262
273
|
}, props));
|
|
263
274
|
};
|
|
264
275
|
var _default_1 = overflowShadow(Extension, {
|
|
265
|
-
overflowSelector: '.extension-overflow-wrapper'
|
|
276
|
+
overflowSelector: '.extension-overflow-wrapper',
|
|
277
|
+
isDisabled: function isDisabled() {
|
|
278
|
+
return isExperimentEnabled('platform_editor_reduce_forced_layout_2') && isCssScrollTimelineSupported(globalThis.CSS);
|
|
279
|
+
}
|
|
266
280
|
});
|
|
267
281
|
export default _default_1;
|
|
@@ -19,7 +19,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
|
|
|
19
19
|
var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
|
|
20
20
|
var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
|
|
21
21
|
var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
|
|
22
|
-
var packageVersion = "131.
|
|
22
|
+
var packageVersion = "131.3.0";
|
|
23
23
|
var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
|
|
24
24
|
// Remove URL as it has UGC
|
|
25
25
|
// Ignored via go/ees007
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
._zulp1ejb{gap:var(--ds-space-300,24px)}
|
|
2
|
+
._1rjcoahv{padding-block:var(--ds-space-600,3pc)}
|
|
3
|
+
._1rjcxy5q{padding-block:var(--ds-space-400,2pc)}._1bah1h6o{justify-content:center}
|
|
4
|
+
._1bsb1mcy{width:57px}
|
|
5
|
+
._1bsb1osq{width:100%}
|
|
6
|
+
._1bsbtudo{width:76px}
|
|
7
|
+
._1e0c1txw{display:flex}
|
|
8
|
+
._2lx21bp4{flex-direction:column}
|
|
9
|
+
._4cvr1h6o{align-items:center}
|
|
10
|
+
._4t3i1h39{height:63px}
|
|
11
|
+
._4t3io7ol{height:84px}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
/* QuickInsertEmptyState.tsx generated by @compiled/babel-plugin v3.0.2 */
|
|
2
|
+
import "./QuickInsertEmptyState.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import { useIntl } from 'react-intl';
|
|
6
|
+
import { lazy, LazySuspense } from 'react-loosely-lazy';
|
|
7
|
+
import { cx } from '@atlaskit/css';
|
|
8
|
+
import { Box } from '@atlaskit/primitives/compiled/box';
|
|
9
|
+
import { Text } from '@atlaskit/primitives/compiled/text';
|
|
10
|
+
import { messages } from './messages';
|
|
11
|
+
var NoResultsIllustration = lazy(function () {
|
|
12
|
+
return import( /* webpackChunkName: "@atlaskit-internal_editor-quick-insert-no-results" */
|
|
13
|
+
'./assets/no-results').then(function (module) {
|
|
14
|
+
return module.default;
|
|
15
|
+
});
|
|
16
|
+
});
|
|
17
|
+
var styles = {
|
|
18
|
+
base: "_zulp1ejb _4cvr1h6o _1e0c1txw _2lx21bp4 _1bah1h6o _1bsb1osq",
|
|
19
|
+
compact: "_1rjcxy5q",
|
|
20
|
+
spacious: "_1rjcoahv",
|
|
21
|
+
inlineIllustration: "_4t3i1h39 _1bsb1mcy",
|
|
22
|
+
fullIllustration: "_4t3io7ol _1bsbtudo"
|
|
23
|
+
};
|
|
24
|
+
export var QuickInsertEmptyState = function QuickInsertEmptyState(_ref) {
|
|
25
|
+
var mode = _ref.mode,
|
|
26
|
+
_ref$spacing = _ref.spacing,
|
|
27
|
+
spacing = _ref$spacing === void 0 ? mode === 'full' ? 'spacious' : 'compact' : _ref$spacing;
|
|
28
|
+
var _useIntl = useIntl(),
|
|
29
|
+
formatMessage = _useIntl.formatMessage;
|
|
30
|
+
var illustrationSize = mode === 'full' ? {
|
|
31
|
+
width: 76,
|
|
32
|
+
height: 84
|
|
33
|
+
} : {
|
|
34
|
+
width: 57,
|
|
35
|
+
height: 63
|
|
36
|
+
};
|
|
37
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
38
|
+
testId: "quick-insert-empty-state",
|
|
39
|
+
xcss: cx(styles.base, styles[spacing])
|
|
40
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
41
|
+
xcss: mode === 'full' ? styles.fullIllustration : styles.inlineIllustration
|
|
42
|
+
}, /*#__PURE__*/React.createElement(LazySuspense, {
|
|
43
|
+
fallback: null
|
|
44
|
+
}, /*#__PURE__*/React.createElement(NoResultsIllustration, {
|
|
45
|
+
width: illustrationSize.width,
|
|
46
|
+
height: illustrationSize.height
|
|
47
|
+
}))), /*#__PURE__*/React.createElement(Text, {
|
|
48
|
+
align: "center"
|
|
49
|
+
}, formatMessage(messages.noSearchResults)));
|
|
50
|
+
};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export default function NoResultsIllustration(_ref) {
|
|
3
|
+
var height = _ref.height,
|
|
4
|
+
width = _ref.width;
|
|
5
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
6
|
+
width: width,
|
|
7
|
+
height: height,
|
|
8
|
+
viewBox: "0 0 57 63",
|
|
9
|
+
fill: "none",
|
|
10
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
11
|
+
"aria-hidden": "true",
|
|
12
|
+
focusable: "false"
|
|
13
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
14
|
+
fill: "#dddee1",
|
|
15
|
+
d: "M23.5 49.223c-5.196 0-10.166-1.955-14.442-5.814a30 30 0 0 1-3.545-3.85 29.6 29.6 0 0 1-2.868-4.456c-4.56-8.775-3.179-18.124 3.79-25.647a32.6 32.6 0 0 1 3.942-3.593 32 32 0 0 1 4.287-2.81c9.017-4.89 18.424-3.869 25.803 2.8a30.3 30.3 0 0 1 3.59 3.897 29.7 29.7 0 0 1 2.837 4.396C51.5 22.96 50.12 32.324 43.106 39.83a31.5 31.5 0 0 1-3.797 3.442 33 33 0 0 1-4.468 2.912c-3.777 2.03-7.62 3.036-11.341 3.036zm2.478-44.539c-2.957 0-6.02.824-9.082 2.489a28 28 0 0 0-3.658 2.396 27.5 27.5 0 0 0-3.37 3.07C4.24 18.711 3.15 25.92 6.798 32.941a25 25 0 0 0 2.42 3.75 25 25 0 0 0 2.981 3.24c5.866 5.299 13.119 6.054 20.427 2.13a27.4 27.4 0 0 0 3.818-2.492 27.5 27.5 0 0 0 3.24-2.936c5.658-6.054 6.741-13.27 3.06-20.318a25 25 0 0 0-2.39-3.698 25.3 25.3 0 0 0-3.021-3.289c-3.418-3.086-7.288-4.645-11.348-4.645z"
|
|
16
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
17
|
+
fill: "#dddee1",
|
|
18
|
+
d: "M42.822 42.291c-1.21-1.685-2.509-1.675-3.777-.694-1.19.92-1.507 2.164-.24 3.801l1.45 1.873 4.017-3.107z"
|
|
19
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
20
|
+
fill: "#dddee1",
|
|
21
|
+
d: "m45.28 43.385-6.03 4.663 11.332 14.657 6.03-4.663z"
|
|
22
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
23
|
+
fill: "#b7b9be",
|
|
24
|
+
d: "m44.31 44.134-4.091 3.163 3.843 4.97 4.091-3.163z"
|
|
25
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
26
|
+
fill: "#dddee1",
|
|
27
|
+
d: "M26.834 30.328h-3.42v-.217c-.116-2.432 1.264-5.066 3.227-6.143l.037-.02q.08-.042.154-.093c1.071-.69 1.68-1.88 1.643-3.189-.037-1.298-.707-2.439-1.791-3.052a4.5 4.5 0 0 0-2.21-.592c-2.315 0-4.198 1.897-4.198 4.229h-3.42c0-4.23 3.417-7.672 7.618-7.672a7.9 7.9 0 0 1 3.884 1.033c2.14 1.211 3.462 3.437 3.534 5.955.073 2.53-1.125 4.84-3.203 6.18q-.211.139-.424.251c-.815.458-1.497 1.868-1.434 2.97zM24.795 32.303a3.4 3.4 0 0 1 1.096-.004c1.115.183 2.021.965 2.241 2.182l.002.01.002.009a3.4 3.4 0 0 1-.002 1.103v.004c-.216 1.23-1.136 2.009-2.247 2.19a3.417 3.417 0 0 1-1.085-.003c-1.117-.18-2.027-.961-2.249-2.179l-.002-.01-.001-.01a3.3 3.3 0 0 1 0-1.095l.002-.01.001-.01c.223-1.223 1.137-1.992 2.24-2.177z"
|
|
28
|
+
}));
|
|
29
|
+
}
|
|
@@ -140,6 +140,11 @@ export var messages = defineMessages({
|
|
|
140
140
|
defaultMessage: 'Search results',
|
|
141
141
|
description: 'Heading shown above the matching items when searching in the Quick Insert menu.'
|
|
142
142
|
},
|
|
143
|
+
noSearchResults: {
|
|
144
|
+
id: 'editor-common.quick-insert.noSearchResults',
|
|
145
|
+
defaultMessage: "We couldn't find any results.",
|
|
146
|
+
description: 'Message shown when a Quick Insert search has no matching results.'
|
|
147
|
+
},
|
|
143
148
|
previewAttributionBy: {
|
|
144
149
|
id: 'editor-common.quick-insert.previewAttributionBy',
|
|
145
150
|
defaultMessage: 'By {name}',
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
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; }
|
|
3
|
+
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; }
|
|
4
|
+
import { useCallback, useEffect, useRef } from 'react';
|
|
5
|
+
import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../analytics/types/enums';
|
|
6
|
+
var SEARCH_DEBOUNCE_MS = 1000;
|
|
7
|
+
export var useQuickInsertSearchAnalytics = function useQuickInsertSearchAnalytics(_ref) {
|
|
8
|
+
var query = _ref.query,
|
|
9
|
+
resultCount = _ref.resultCount,
|
|
10
|
+
surface = _ref.surface,
|
|
11
|
+
category = _ref.category,
|
|
12
|
+
_ref$isOpen = _ref.isOpen,
|
|
13
|
+
isOpen = _ref$isOpen === void 0 ? true : _ref$isOpen,
|
|
14
|
+
fireAnalyticsEvent = _ref.fireAnalyticsEvent;
|
|
15
|
+
var latestOptions = useRef({
|
|
16
|
+
query: query,
|
|
17
|
+
resultCount: resultCount,
|
|
18
|
+
surface: surface,
|
|
19
|
+
category: category,
|
|
20
|
+
fireAnalyticsEvent: fireAnalyticsEvent
|
|
21
|
+
});
|
|
22
|
+
latestOptions.current = {
|
|
23
|
+
query: query,
|
|
24
|
+
resultCount: resultCount,
|
|
25
|
+
surface: surface,
|
|
26
|
+
category: category,
|
|
27
|
+
fireAnalyticsEvent: fireAnalyticsEvent
|
|
28
|
+
};
|
|
29
|
+
var pendingSearch = useRef(null);
|
|
30
|
+
var effectVersion = useRef(0);
|
|
31
|
+
var flush = useCallback(function () {
|
|
32
|
+
var pending = pendingSearch.current;
|
|
33
|
+
if (!pending) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
clearTimeout(pending.timer);
|
|
37
|
+
pendingSearch.current = null;
|
|
38
|
+
var current = latestOptions.current;
|
|
39
|
+
if (current.query.trim() !== pending.query || !current.fireAnalyticsEvent) {
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
var attributes = _objectSpread(_objectSpread({}, current.surface === 'element-browser' && current.category !== undefined ? {
|
|
43
|
+
category: current.category
|
|
44
|
+
} : {}), {}, {
|
|
45
|
+
isEmpty: current.resultCount === 0,
|
|
46
|
+
queryLength: current.query.trim().length,
|
|
47
|
+
resultCount: current.resultCount,
|
|
48
|
+
surface: current.surface
|
|
49
|
+
});
|
|
50
|
+
var payload = {
|
|
51
|
+
action: ACTION.SEARCHED,
|
|
52
|
+
actionSubject: ACTION_SUBJECT.QUICK_INSERT,
|
|
53
|
+
eventType: EVENT_TYPE.TRACK,
|
|
54
|
+
attributes: attributes
|
|
55
|
+
};
|
|
56
|
+
current.fireAnalyticsEvent(payload);
|
|
57
|
+
}, []);
|
|
58
|
+
useEffect(function () {
|
|
59
|
+
var currentVersion = ++effectVersion.current;
|
|
60
|
+
if (!isOpen) {
|
|
61
|
+
flush();
|
|
62
|
+
return;
|
|
63
|
+
}
|
|
64
|
+
var trimmedQuery = query.trim();
|
|
65
|
+
if (!trimmedQuery) {
|
|
66
|
+
if (pendingSearch.current) {
|
|
67
|
+
clearTimeout(pendingSearch.current.timer);
|
|
68
|
+
pendingSearch.current = null;
|
|
69
|
+
}
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
if (pendingSearch.current) {
|
|
73
|
+
clearTimeout(pendingSearch.current.timer);
|
|
74
|
+
}
|
|
75
|
+
var timer = setTimeout(flush, SEARCH_DEBOUNCE_MS);
|
|
76
|
+
pendingSearch.current = {
|
|
77
|
+
query: trimmedQuery,
|
|
78
|
+
timer: timer
|
|
79
|
+
};
|
|
80
|
+
return function () {
|
|
81
|
+
if (pendingSearch.current) {
|
|
82
|
+
clearTimeout(pendingSearch.current.timer);
|
|
83
|
+
}
|
|
84
|
+
Promise.resolve().then(function () {
|
|
85
|
+
// oxlint-disable-next-line react-hooks/exhaustive-deps -- The live effect version distinguishes dependency cleanup from a real unmount.
|
|
86
|
+
if (effectVersion.current === currentVersion) {
|
|
87
|
+
flush();
|
|
88
|
+
}
|
|
89
|
+
});
|
|
90
|
+
};
|
|
91
|
+
}, [query, surface, category, isOpen, flush]);
|
|
92
|
+
return flush;
|
|
93
|
+
};
|
|
@@ -21,7 +21,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
|
21
21
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
22
22
|
import Layer from '../Layer';
|
|
23
23
|
var packageName = "@atlaskit/editor-common";
|
|
24
|
-
var packageVersion = "131.
|
|
24
|
+
var packageVersion = "131.3.0";
|
|
25
25
|
var halfFocusRing = 1;
|
|
26
26
|
var dropOffset = '0, 8';
|
|
27
27
|
var fadeIn = keyframes({
|
|
@@ -36,7 +36,7 @@ export default function overflowShadow(Component, options) {
|
|
|
36
36
|
_this.updateShadows();
|
|
37
37
|
});
|
|
38
38
|
_defineProperty(_this, "updateShadows", function () {
|
|
39
|
-
if (options.useShadowObserver) {
|
|
39
|
+
if (_this.isDisabled || options.useShadowObserver) {
|
|
40
40
|
return;
|
|
41
41
|
}
|
|
42
42
|
_this.setState(function (prevState) {
|
|
@@ -90,6 +90,9 @@ export default function overflowShadow(Component, options) {
|
|
|
90
90
|
if (!_this.overflowContainer) {
|
|
91
91
|
_this.overflowContainer = container;
|
|
92
92
|
}
|
|
93
|
+
if (_this.isDisabled) {
|
|
94
|
+
return;
|
|
95
|
+
}
|
|
93
96
|
if (options.useShadowObserver) {
|
|
94
97
|
_this.initShadowObserver();
|
|
95
98
|
return;
|
|
@@ -103,6 +106,15 @@ export default function overflowShadow(Component, options) {
|
|
|
103
106
|
}
|
|
104
107
|
_inherits(OverflowShadow, _React$Component);
|
|
105
108
|
return _createClass(OverflowShadow, [{
|
|
109
|
+
key: "isDisabled",
|
|
110
|
+
get: function get() {
|
|
111
|
+
if (this.disabled === undefined) {
|
|
112
|
+
var _options$isDisabled, _options$isDisabled2;
|
|
113
|
+
this.disabled = (_options$isDisabled = (_options$isDisabled2 = options.isDisabled) === null || _options$isDisabled2 === void 0 ? void 0 : _options$isDisabled2.call(options)) !== null && _options$isDisabled !== void 0 ? _options$isDisabled : false;
|
|
114
|
+
}
|
|
115
|
+
return this.disabled;
|
|
116
|
+
}
|
|
117
|
+
}, {
|
|
106
118
|
key: "componentWillUnmount",
|
|
107
119
|
value: function componentWillUnmount() {
|
|
108
120
|
if (options.useShadowObserver) {
|
|
@@ -153,7 +165,7 @@ export default function overflowShadow(Component, options) {
|
|
|
153
165
|
var _this$state = this.state,
|
|
154
166
|
showLeftShadow = _this$state.showLeftShadow,
|
|
155
167
|
showRightShadow = _this$state.showRightShadow;
|
|
156
|
-
var classNames = [!((_this$props = this.props) !== null && _this$props !== void 0 && _this$props.disableTableOverflowShadow) && showRightShadow && shadowClassNames.RIGHT_SHADOW, !((_this$props2 = this.props) !== null && _this$props2 !== void 0 && _this$props2.disableTableOverflowShadow) && showLeftShadow && shadowClassNames.LEFT_SHADOW, options.useShadowObserver && shadowObserverClassNames.SHADOW_CONTAINER].filter(Boolean).join(' ');
|
|
168
|
+
var classNames = this.isDisabled ? '' : [!((_this$props = this.props) !== null && _this$props !== void 0 && _this$props.disableTableOverflowShadow) && showRightShadow && shadowClassNames.RIGHT_SHADOW, !((_this$props2 = this.props) !== null && _this$props2 !== void 0 && _this$props2.disableTableOverflowShadow) && showLeftShadow && shadowClassNames.LEFT_SHADOW, options.useShadowObserver && shadowObserverClassNames.SHADOW_CONTAINER].filter(Boolean).join(' ');
|
|
157
169
|
|
|
158
170
|
/**
|
|
159
171
|
* The widths have already been calculated to determine
|
|
@@ -52,7 +52,7 @@ import type { NestedTableActionsEventPayload } from './nested-table-events';
|
|
|
52
52
|
import type { NodeEventPayload } from './node-events';
|
|
53
53
|
import type { OfflineEditingEventPayload } from './offline-editing-event';
|
|
54
54
|
import type { PasteActionsMenuEventPayload, PasteEventPayload } from './paste-events';
|
|
55
|
-
import type { QuickInsertInformationEventPayload } from './quick-insert-events';
|
|
55
|
+
import type { QuickInsertInformationEventPayload, QuickInsertSearchOutcomeEventPayload } from './quick-insert-events';
|
|
56
56
|
import type { ReferentialityEventPayload } from './referentiality-events';
|
|
57
57
|
import type { SelectionEventPayload } from './selection-events';
|
|
58
58
|
import type { SelectionExtensionEventPayload } from './selection-extension-events';
|
|
@@ -73,7 +73,7 @@ export type SimplifiedNode = {
|
|
|
73
73
|
pos: number;
|
|
74
74
|
type: string;
|
|
75
75
|
};
|
|
76
|
-
export type AnalyticsEventPayload<T = void> = AvatarEventPayload | GeneralEventPayload<T> | FormatEventPayload | SubstituteEventPayload | InsertEventPayload | NodeEventPayload | MoveContentEventPayload | MediaEventPayload | TableEventPayload | PasteEventPayload | PasteActionsMenuEventPayload | QuickInsertInformationEventPayload | CutCopyEventPayload | ErrorEventPayload | TextColorEventPayload | FindReplaceEventPayload | DateEventPayload | SelectionEventPayload | ListEventPayload | ConfigPanelEventPayload | ElementBrowserEventPayload | CreateLinkInlineDialogEventPayload | HighlightActionsEventPayload | UnsupportedContentPayload | ExtensionEventPayload | TypeAheadPayload | UnlinkToolbarAEP | EditLinkToolbarAEP | PreviewItemClickedAEP | OpenLinkToolbarAEP | OpenSettingsToolbarAEP | CustomPanelEventPayload | FeatureExposureAEP | NewCollabSyncUpErrorAEP | UnsupportedContentTooltipPayload | ReferentialityEventPayload | LoomEventPayload | MBEEventPayload | HighlightEventPayload | DatasourceClickedPayload | ElementEventPayload | VisitedLinkAEP | ViewEventPayload | MediaUploadEventPayload | MentionEventPayload | EngagementPlatformEventPayload | NestedTableActionsEventPayload | ContainerNodeActionsEventPayload | AICommandPaletteEventPayload | AIDefinitionsEventPayload | AIEventPayload | AIStreamingEventPayload | AIProactiveEventPayload | AiAutocompleteEventPayload | AiSuggestionsEventPayload | ContextualTypeaheadEventPayload | AIQuickPromptEventPayload | AIUnifiedEventPayload | BreakoutEventPayload | BlockMenuEventPayload | ActiveSessionEventPayload | AIInlineSuggestionPayload | SelectionExtensionEventPayload | TelepointerClickPayload | SelectionToolbarEventPayload | ExperienceEventPayload | AlignmentEventPayload | UndoRedoAEP | OfflineEditingEventPayload | AgentEditShimmerNotShownAEP | FloatingToolbarOverflowEventPayload | SyncBlockEventPayload | FloatingToolbarEventPayload;
|
|
76
|
+
export type AnalyticsEventPayload<T = void> = AvatarEventPayload | GeneralEventPayload<T> | FormatEventPayload | SubstituteEventPayload | InsertEventPayload | NodeEventPayload | MoveContentEventPayload | MediaEventPayload | TableEventPayload | PasteEventPayload | PasteActionsMenuEventPayload | QuickInsertInformationEventPayload | QuickInsertSearchOutcomeEventPayload | CutCopyEventPayload | ErrorEventPayload | TextColorEventPayload | FindReplaceEventPayload | DateEventPayload | SelectionEventPayload | ListEventPayload | ConfigPanelEventPayload | ElementBrowserEventPayload | CreateLinkInlineDialogEventPayload | HighlightActionsEventPayload | UnsupportedContentPayload | ExtensionEventPayload | TypeAheadPayload | UnlinkToolbarAEP | EditLinkToolbarAEP | PreviewItemClickedAEP | OpenLinkToolbarAEP | OpenSettingsToolbarAEP | CustomPanelEventPayload | FeatureExposureAEP | NewCollabSyncUpErrorAEP | UnsupportedContentTooltipPayload | ReferentialityEventPayload | LoomEventPayload | MBEEventPayload | HighlightEventPayload | DatasourceClickedPayload | ElementEventPayload | VisitedLinkAEP | ViewEventPayload | MediaUploadEventPayload | MentionEventPayload | EngagementPlatformEventPayload | NestedTableActionsEventPayload | ContainerNodeActionsEventPayload | AICommandPaletteEventPayload | AIDefinitionsEventPayload | AIEventPayload | AIStreamingEventPayload | AIProactiveEventPayload | AiAutocompleteEventPayload | AiSuggestionsEventPayload | ContextualTypeaheadEventPayload | AIQuickPromptEventPayload | AIUnifiedEventPayload | BreakoutEventPayload | BlockMenuEventPayload | ActiveSessionEventPayload | AIInlineSuggestionPayload | SelectionExtensionEventPayload | TelepointerClickPayload | SelectionToolbarEventPayload | ExperienceEventPayload | AlignmentEventPayload | UndoRedoAEP | OfflineEditingEventPayload | AgentEditShimmerNotShownAEP | FloatingToolbarOverflowEventPayload | SyncBlockEventPayload | FloatingToolbarEventPayload;
|
|
77
77
|
type CustomPanelEventPayload = TrackAEP<ACTION.CHANGED_BACKGROUND_COLOR | ACTION.CHANGED_ICON | ACTION.REMOVE_ICON, ACTION_SUBJECT.PANEL, ACTION_SUBJECT_ID.PANEL, {
|
|
78
78
|
newColor: string;
|
|
79
79
|
previousColor: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { ACTION, ACTION_SUBJECT } from './enums';
|
|
2
|
-
import type { OperationalAEP } from './utils';
|
|
2
|
+
import type { OperationalAEP, TrackAEP } from './utils';
|
|
3
3
|
export type CategoryInformation = {
|
|
4
4
|
allAppCount: number;
|
|
5
5
|
allAppMacroMax: number;
|
|
@@ -20,3 +20,13 @@ export type QuickInsertInformationAttributes = {
|
|
|
20
20
|
};
|
|
21
21
|
export type QuickInsertInformationAEP = OperationalAEP<ACTION.QUICK_INSERT_INFORMATION, ACTION_SUBJECT.QUICK_INSERT, undefined, QuickInsertInformationAttributes>;
|
|
22
22
|
export type QuickInsertInformationEventPayload = QuickInsertInformationAEP;
|
|
23
|
+
export type QuickInsertSearchSurface = 'typeahead' | 'toolbar' | 'element-browser';
|
|
24
|
+
export type QuickInsertSearchOutcomeAttributes = {
|
|
25
|
+
category?: string;
|
|
26
|
+
isEmpty: boolean;
|
|
27
|
+
queryLength: number;
|
|
28
|
+
resultCount: number;
|
|
29
|
+
surface: QuickInsertSearchSurface;
|
|
30
|
+
};
|
|
31
|
+
export type QuickInsertSearchOutcomeAEP = TrackAEP<ACTION.SEARCHED, ACTION_SUBJECT.QUICK_INSERT, undefined, QuickInsertSearchOutcomeAttributes, undefined>;
|
|
32
|
+
export type QuickInsertSearchOutcomeEventPayload = QuickInsertSearchOutcomeAEP;
|
|
@@ -3,5 +3,5 @@ type Messages<Keys extends string> = Record<Keys, MessageDescriptor & {
|
|
|
3
3
|
defaultMessage: string;
|
|
4
4
|
id: string;
|
|
5
5
|
}>;
|
|
6
|
-
export declare const messages: Messages<'admin' | 'AI' | 'all' | 'browse' | 'categoryBlockTemplates' | 'categoryCreate' | 'categoryDataAndCharts' | 'categoryEmbed' | 'categoryMedia' | 'categoryOther' | 'categoryRecommended' | 'categoryRovo' | 'categoryStructure' | 'categoryTextFormatting' | 'searchResults' | 'previewAttributionBy' | 'previewAttributionAtlassian' | 'previewAttributionAssets' | 'previewAttributionConfluence' | 'previewAttributionFeedback' | 'previewAttributionFocus' | 'previewAttributionJira' | 'previewAttributionJiraServiceManagement' | 'previewAttributionMicrosoft' | 'previewAttributionStudio' | 'previewAttributionTalent' | 'previewAttributionTrello' | 'close' | 'communication' | 'confluence-content' | 'development' | 'external-content' | 'featuredWhiteboardDescription' | 'formatting' | 'help' | 'insert' | 'media' | 'navigation' | 'reporting' | 'visuals'>;
|
|
6
|
+
export declare const messages: Messages<'admin' | 'AI' | 'all' | 'browse' | 'categoryBlockTemplates' | 'categoryCreate' | 'categoryDataAndCharts' | 'categoryEmbed' | 'categoryMedia' | 'categoryOther' | 'categoryRecommended' | 'categoryRovo' | 'categoryStructure' | 'categoryTextFormatting' | 'searchResults' | 'noSearchResults' | 'previewAttributionBy' | 'previewAttributionAtlassian' | 'previewAttributionAssets' | 'previewAttributionConfluence' | 'previewAttributionFeedback' | 'previewAttributionFocus' | 'previewAttributionJira' | 'previewAttributionJiraServiceManagement' | 'previewAttributionMicrosoft' | 'previewAttributionStudio' | 'previewAttributionTalent' | 'previewAttributionTrello' | 'close' | 'communication' | 'confluence-content' | 'development' | 'external-content' | 'featuredWhiteboardDescription' | 'formatting' | 'help' | 'insert' | 'media' | 'navigation' | 'reporting' | 'visuals'>;
|
|
7
7
|
export {};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { EditorAnalyticsAPI } from '../analytics/api';
|
|
2
|
+
import type { QuickInsertSearchSurface } from '../analytics/types/quick-insert-events';
|
|
3
|
+
type Options = {
|
|
4
|
+
category?: string;
|
|
5
|
+
fireAnalyticsEvent?: EditorAnalyticsAPI['fireAnalyticsEvent'];
|
|
6
|
+
isOpen?: boolean;
|
|
7
|
+
query: string;
|
|
8
|
+
resultCount: number;
|
|
9
|
+
surface: QuickInsertSearchSurface;
|
|
10
|
+
};
|
|
11
|
+
export declare const useQuickInsertSearchAnalytics: ({ query, resultCount, surface, category, isOpen, fireAnalyticsEvent, }: Options) => (() => void);
|
|
12
|
+
export {};
|
|
@@ -14,6 +14,11 @@ export interface OverflowShadowState {
|
|
|
14
14
|
showRightShadow: boolean;
|
|
15
15
|
}
|
|
16
16
|
export interface OverflowShadowOptions {
|
|
17
|
+
/**
|
|
18
|
+
* Opts the wrapped component out of the JavaScript driven shadows entirely: no scroll listeners
|
|
19
|
+
* or intersection observers are registered
|
|
20
|
+
*/
|
|
21
|
+
isDisabled?: () => boolean;
|
|
17
22
|
overflowSelector: string;
|
|
18
23
|
useShadowObserver?: boolean;
|
|
19
24
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-common",
|
|
3
|
-
"version": "131.
|
|
3
|
+
"version": "131.4.0",
|
|
4
4
|
"description": "A package that contains common classes and components for editor and renderer",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -54,15 +54,15 @@
|
|
|
54
54
|
"@atlaskit/feature-gate-js-client": "^7.0.0",
|
|
55
55
|
"@atlaskit/icon": "^38.0.0",
|
|
56
56
|
"@atlaskit/link": "^5.1.0",
|
|
57
|
-
"@atlaskit/link-datasource": "^7.
|
|
58
|
-
"@atlaskit/link-picker": "^6.
|
|
57
|
+
"@atlaskit/link-datasource": "^7.5.0",
|
|
58
|
+
"@atlaskit/link-picker": "^6.13.0",
|
|
59
59
|
"@atlaskit/logo": "^23.3.0",
|
|
60
60
|
"@atlaskit/media-card": "^82.1.0",
|
|
61
61
|
"@atlaskit/media-client": "^39.2.0",
|
|
62
62
|
"@atlaskit/media-client-react": "^7.0.0",
|
|
63
63
|
"@atlaskit/media-common": "^14.7.0",
|
|
64
64
|
"@atlaskit/media-file-preview": "^2.0.0",
|
|
65
|
-
"@atlaskit/media-picker": "^73.
|
|
65
|
+
"@atlaskit/media-picker": "^73.2.0",
|
|
66
66
|
"@atlaskit/media-ui": "^31.3.0",
|
|
67
67
|
"@atlaskit/media-viewer": "^54.11.0",
|
|
68
68
|
"@atlaskit/mention": "^30.2.0",
|
|
@@ -73,14 +73,14 @@
|
|
|
73
73
|
"@atlaskit/platform-feature-flags": "^2.2.0",
|
|
74
74
|
"@atlaskit/platform-feature-flags-react": "^1.2.0",
|
|
75
75
|
"@atlaskit/popper": "^9.4.0",
|
|
76
|
-
"@atlaskit/primitives": "^22.
|
|
76
|
+
"@atlaskit/primitives": "^22.6.0",
|
|
77
77
|
"@atlaskit/profilecard": "^27.1.0",
|
|
78
78
|
"@atlaskit/prosemirror-history": "^1.3.0",
|
|
79
79
|
"@atlaskit/react-compiler-gating": "^0.2.0",
|
|
80
80
|
"@atlaskit/react-ufo": "^8.1.0",
|
|
81
81
|
"@atlaskit/section-message": "^10.2.0",
|
|
82
|
-
"@atlaskit/smart-card": "^46.
|
|
83
|
-
"@atlaskit/smart-user-picker": "^12.
|
|
82
|
+
"@atlaskit/smart-card": "^46.7.0",
|
|
83
|
+
"@atlaskit/smart-user-picker": "^12.5.0",
|
|
84
84
|
"@atlaskit/spinner": "^20.4.0",
|
|
85
85
|
"@atlaskit/task-decision": "^21.12.0",
|
|
86
86
|
"@atlaskit/teams-app-config": "^3.1.0",
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@atlaskit/editor-common/quick-insert/empty-state",
|
|
3
|
+
"main": "../../dist/cjs/quick-insert/QuickInsertEmptyState.js",
|
|
4
|
+
"module": "../../dist/esm/quick-insert/QuickInsertEmptyState.js",
|
|
5
|
+
"module:es2019": "../../dist/es2019/quick-insert/QuickInsertEmptyState.js",
|
|
6
|
+
"sideEffects": [
|
|
7
|
+
"**/*.compiled.css"
|
|
8
|
+
],
|
|
9
|
+
"types": "../../dist/types/quick-insert/QuickInsertEmptyState.d.ts"
|
|
10
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@atlaskit/editor-common/quick-insert/use-search-analytics",
|
|
3
|
+
"main": "../../dist/cjs/quick-insert/useQuickInsertSearchAnalytics.js",
|
|
4
|
+
"module": "../../dist/esm/quick-insert/useQuickInsertSearchAnalytics.js",
|
|
5
|
+
"module:es2019": "../../dist/es2019/quick-insert/useQuickInsertSearchAnalytics.js",
|
|
6
|
+
"sideEffects": [
|
|
7
|
+
"**/*.compiled.css"
|
|
8
|
+
],
|
|
9
|
+
"types": "../../dist/types/quick-insert/useQuickInsertSearchAnalytics.d.ts"
|
|
10
|
+
}
|