@atlaskit/editor-common 122.3.3 → 122.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 +24 -0
- package/dist/cjs/ai-messages/ai-suggestions.js +5 -0
- package/dist/cjs/compiled-migration/withCompiledMigration.js +18 -20
- package/dist/cjs/extensibility/ExtensionNodeWrapper.js +13 -0
- package/dist/cjs/extensibility/GeneratedContentReveal.compiled.css +53 -0
- package/dist/cjs/extensibility/GeneratedContentReveal.js +146 -0
- package/dist/cjs/extensibility/extensionNodeView.js +6 -2
- package/dist/cjs/extensibility/nativeEmbedExtension.js +19 -0
- package/dist/cjs/extensibility/useNativeEmbedSettled.js +56 -0
- package/dist/cjs/monitoring/error.js +1 -1
- package/dist/cjs/react-node-view/getInlineNodeViewProducer.js +10 -12
- package/dist/cjs/ui/DropList/index.js +1 -1
- package/dist/es2019/ai-messages/ai-suggestions.js +5 -0
- package/dist/es2019/compiled-migration/withCompiledMigration.js +17 -17
- package/dist/es2019/extensibility/ExtensionNodeWrapper.js +12 -0
- package/dist/es2019/extensibility/GeneratedContentReveal.compiled.css +53 -0
- package/dist/es2019/extensibility/GeneratedContentReveal.js +121 -0
- package/dist/es2019/extensibility/extensionNodeView.js +6 -2
- package/dist/es2019/extensibility/nativeEmbedExtension.js +14 -0
- package/dist/es2019/extensibility/useNativeEmbedSettled.js +49 -0
- package/dist/es2019/monitoring/error.js +1 -1
- package/dist/es2019/react-node-view/getInlineNodeViewProducer.js +9 -14
- package/dist/es2019/ui/DropList/index.js +1 -1
- package/dist/esm/ai-messages/ai-suggestions.js +5 -0
- package/dist/esm/compiled-migration/withCompiledMigration.js +18 -16
- package/dist/esm/extensibility/ExtensionNodeWrapper.js +13 -0
- package/dist/esm/extensibility/GeneratedContentReveal.compiled.css +53 -0
- package/dist/esm/extensibility/GeneratedContentReveal.js +138 -0
- package/dist/esm/extensibility/extensionNodeView.js +6 -2
- package/dist/esm/extensibility/nativeEmbedExtension.js +14 -0
- package/dist/esm/extensibility/useNativeEmbedSettled.js +51 -0
- package/dist/esm/monitoring/error.js +1 -1
- package/dist/esm/react-node-view/getInlineNodeViewProducer.js +9 -14
- package/dist/esm/ui/DropList/index.js +1 -1
- package/dist/types/ai-messages/ai-suggestions.d.ts +5 -0
- package/dist/types/compiled-migration/withCompiledMigration.d.ts +8 -6
- package/dist/types/extensibility/ExtensionNodeWrapper.d.ts +7 -1
- package/dist/types/extensibility/GeneratedContentReveal.d.ts +13 -0
- package/dist/types/extensibility/extensionNodeView.d.ts +2 -0
- package/dist/types/extensibility/nativeEmbedExtension.d.ts +10 -0
- package/dist/types/extensibility/useNativeEmbedSettled.d.ts +12 -0
- package/dist/types/react-node-view/getInlineNodeViewProducer.d.ts +0 -4
- package/extensibility/native-embed/package.json +10 -0
- package/package.json +5 -5
|
@@ -0,0 +1,138 @@
|
|
|
1
|
+
/* GeneratedContentReveal.tsx generated by @compiled/babel-plugin v3.0.1 */
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
|
+
import "./GeneratedContentReveal.compiled.css";
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
5
|
+
import React, { useCallback, useEffect, useState } from 'react';
|
|
6
|
+
import { ExtensionSSRReactContextsProvider } from './ExtensionSSRReactContextsProvider';
|
|
7
|
+
import { useNativeEmbedSettled } from './useNativeEmbedSettled';
|
|
8
|
+
|
|
9
|
+
/*
|
|
10
|
+
* Animates a native embed into the document once it has loaded.
|
|
11
|
+
*
|
|
12
|
+
* 1. `collapsed` — clipped to zero height and `inert`. The embed loads behind it, full size but
|
|
13
|
+
* unseen, with its own loading overlay hidden.
|
|
14
|
+
* 2. `useNativeEmbedSettled` calls back once the embed has finished loading.
|
|
15
|
+
* 3. `revealing` — the measured height goes into `--extension-reveal-height` and the node animates
|
|
16
|
+
* open (400ms).
|
|
17
|
+
* 4. The embed fades in (200ms), delayed so it follows the opening instead of overlapping it.
|
|
18
|
+
* 5. `open` — on `animationend`, when the content first becomes visible, `inert` is dropped.
|
|
19
|
+
*
|
|
20
|
+
* Failure paths: never settles → `READY_TIMEOUT_MS` opens it and the embed's overlay reappears;
|
|
21
|
+
* fails with no frame → still settles and opens; no `animationend` → `REVEAL_TIMEOUT_MS`. Reduced
|
|
22
|
+
* motion runs the same steps with zero-length animations, so `animationend` still fires.
|
|
23
|
+
*
|
|
24
|
+
* Renders the wrapper span itself, in place of the default one in `ExtensionNodeWrapper`, so the
|
|
25
|
+
* reveal styles sit on the element editor-core reaches through `> span >` chains from the node view
|
|
26
|
+
* root. It therefore carries the default span's `relative` class and hover chrome as well.
|
|
27
|
+
*/
|
|
28
|
+
|
|
29
|
+
/** Long, because a MAUI app has to boot and render first. Reaching it means the signal is broken. */
|
|
30
|
+
var READY_TIMEOUT_MS = 30000;
|
|
31
|
+
|
|
32
|
+
/** For when no `animationend` arrives. Must exceed the reveal. */
|
|
33
|
+
var REVEAL_TIMEOUT_MS = 1000;
|
|
34
|
+
|
|
35
|
+
/** Set inline from the measured content height just before the animation runs. */
|
|
36
|
+
var REVEAL_HEIGHT_VARIABLE = '--extension-reveal-height';
|
|
37
|
+
var relativeStyles = null;
|
|
38
|
+
|
|
39
|
+
// Mirrors the default span's hover chrome in `ExtensionNodeWrapper`; keep the two in step.
|
|
40
|
+
var hoverStyles = null;
|
|
41
|
+
|
|
42
|
+
/**
|
|
43
|
+
* Animates `max-height`, so the rendered height is `min(content, max-height)` and overshooting is
|
|
44
|
+
* harmless — the measurement is taken before the embed has settled on its size. A measurement is
|
|
45
|
+
* needed because the embed writes a definite inline `height` onto `.extension-container`.
|
|
46
|
+
*/
|
|
47
|
+
var openHeight = null;
|
|
48
|
+
|
|
49
|
+
// `display: block` because `overflow` and `max-height` do not apply to an inline span.
|
|
50
|
+
var clippedStyles = null;
|
|
51
|
+
|
|
52
|
+
/**
|
|
53
|
+
* Shut, and with the embed's own loading overlay hidden, so only one loading state shows. Only while
|
|
54
|
+
* closed: once open the embed shows its own progress again, which a node opened by the fail-safe
|
|
55
|
+
* timeout needs. Hiding the overlay here keeps `data-native-embed-loading` set, which is the signal
|
|
56
|
+
* the reveal waits on.
|
|
57
|
+
*/
|
|
58
|
+
var collapsedStyles = null;
|
|
59
|
+
var revealingStyles = null;
|
|
60
|
+
|
|
61
|
+
// Two selectors because MAUI renders a bare iframe and others nest theirs in the card wrapper; the
|
|
62
|
+
// second excludes that nested case so the same content is not faded twice.
|
|
63
|
+
var embedContentEnteringStyles = null;
|
|
64
|
+
|
|
65
|
+
/** Mirrored onto `data-extension-reveal`. */
|
|
66
|
+
|
|
67
|
+
export var GeneratedContentReveal = function GeneratedContentReveal(_ref) {
|
|
68
|
+
var children = _ref.children,
|
|
69
|
+
intl = _ref.intl,
|
|
70
|
+
showMacroInteractionDesignUpdates = _ref.showMacroInteractionDesignUpdates;
|
|
71
|
+
// Held in state so the effects below run once the span exists.
|
|
72
|
+
var _useState = useState(null),
|
|
73
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
74
|
+
wrapperElement = _useState2[0],
|
|
75
|
+
setWrapperElement = _useState2[1];
|
|
76
|
+
var _useState3 = useState('collapsed'),
|
|
77
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
78
|
+
state = _useState4[0],
|
|
79
|
+
setState = _useState4[1];
|
|
80
|
+
|
|
81
|
+
// Only a collapsed node opens, so whichever of the readiness signal and the fail-safe timer
|
|
82
|
+
// comes second changes nothing. The measurement is repeated harmlessly in that case.
|
|
83
|
+
var startRevealing = useCallback(function () {
|
|
84
|
+
// The clipped wrapper's `scrollHeight` is the height its content wants.
|
|
85
|
+
wrapperElement === null || wrapperElement === void 0 || wrapperElement.style.setProperty(REVEAL_HEIGHT_VARIABLE, "".concat(wrapperElement.scrollHeight, "px"));
|
|
86
|
+
setState(function (current) {
|
|
87
|
+
return current === 'collapsed' ? 'revealing' : current;
|
|
88
|
+
});
|
|
89
|
+
}, [wrapperElement]);
|
|
90
|
+
|
|
91
|
+
// Step 2 → 3.
|
|
92
|
+
useNativeEmbedSettled(wrapperElement, startRevealing);
|
|
93
|
+
|
|
94
|
+
// Set once the span exists; `startRevealing` only changes with it.
|
|
95
|
+
useEffect(function () {
|
|
96
|
+
var timer = setTimeout(startRevealing, READY_TIMEOUT_MS);
|
|
97
|
+
return function () {
|
|
98
|
+
return clearTimeout(timer);
|
|
99
|
+
};
|
|
100
|
+
}, [startRevealing]);
|
|
101
|
+
useEffect(function () {
|
|
102
|
+
if (state !== 'revealing') {
|
|
103
|
+
return;
|
|
104
|
+
}
|
|
105
|
+
var timer = setTimeout(function () {
|
|
106
|
+
return setState('open');
|
|
107
|
+
}, REVEAL_TIMEOUT_MS);
|
|
108
|
+
return function () {
|
|
109
|
+
return clearTimeout(timer);
|
|
110
|
+
};
|
|
111
|
+
}, [state]);
|
|
112
|
+
|
|
113
|
+
// Clipped content, and content waiting out the fade's delay, are invisible but still focusable.
|
|
114
|
+
// Set as an attribute because `inert` is absent from the React 18 JSX types.
|
|
115
|
+
useEffect(function () {
|
|
116
|
+
wrapperElement === null || wrapperElement === void 0 || wrapperElement.toggleAttribute('inert', state !== 'open');
|
|
117
|
+
}, [state, wrapperElement]);
|
|
118
|
+
var onAnimationEnd = useCallback(function (event) {
|
|
119
|
+
// The extension's own content animates too, and those events bubble.
|
|
120
|
+
if (event.target === event.currentTarget) {
|
|
121
|
+
setState('open');
|
|
122
|
+
}
|
|
123
|
+
}, []);
|
|
124
|
+
return /*#__PURE__*/React.createElement(ExtensionSSRReactContextsProvider, {
|
|
125
|
+
intl: intl
|
|
126
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
127
|
+
"data-testid": "extension-node-wrapper",
|
|
128
|
+
"data-extension-reveal": state,
|
|
129
|
+
ref: setWrapperElement
|
|
130
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- the block controls and the SSR cleanup find the wrapper by `span.relative`
|
|
131
|
+
,
|
|
132
|
+
className: ax(["_1tr2ynbm _xajsynbm _1tmrkb7n _bcikkb7n _2z44kb7n _dmn9ysee _1ghxysee _okd3ysee _1er3glyw _d1oeglyw _15k3glyw _1ql7tlke _1nuetlke _decvtlke _1fdfidpf _1pfgidpf _y7o7idpf _mi5m1wug _1si41wug _17sh1wug _x3ro1j9a _1i8c1j9a _1a2e1j9a _26lx1tsb _ks721tsb _jl0d1tsb _1qac1nu9 _54r11nu9 _1vs61nu9 _10pdkb7n _1kr5kb7n _10t9kb7n", showMacroInteractionDesignUpdates && "_kqswh2mm", state !== 'open' && "_1reo15vq _18m915vq _1e0c1ule", state === 'collapsed' && "_c71lidpf _114yglyw", state === 'revealing' && "", state === 'revealing' && "_j7hq1umn _5sag15uc _1pglindk _2hwzru3m", state !== 'collapsed' && "_10i01bym _9sz11bym _147ai9qs _lwlpi9qs _lbjpindk _17w9indk _1p7l15uc _1jbo15uc _pjh31hrf _gp9p1hrf _dxfxru3m _log5ru3m _1pz3ru3m _9hrrru3m", showMacroInteractionDesignUpdates ? 'relative' : undefined]),
|
|
133
|
+
onAnimationEnd: onAnimationEnd,
|
|
134
|
+
style: {
|
|
135
|
+
"--_1wl3sa9": ix("var(".concat(REVEAL_HEIGHT_VARIABLE, ")"))
|
|
136
|
+
}
|
|
137
|
+
}, children));
|
|
138
|
+
};
|
|
@@ -15,6 +15,7 @@ import { isSSR } from '../core-utils';
|
|
|
15
15
|
import ReactNodeView from '../react-node-view';
|
|
16
16
|
import { Extension } from './Extension';
|
|
17
17
|
import { ExtensionNodeWrapper } from './ExtensionNodeWrapper';
|
|
18
|
+
import { isNativeEmbedExtension } from './nativeEmbedExtension';
|
|
18
19
|
/**
|
|
19
20
|
* Allowlists of extension keys + layout
|
|
20
21
|
* Currently, only toc with default layout allows to skip React render.
|
|
@@ -290,7 +291,7 @@ export var ExtensionNode = /*#__PURE__*/function (_ReactNodeView) {
|
|
|
290
291
|
}, {
|
|
291
292
|
key: "render",
|
|
292
293
|
value: function render(props, forwardRef) {
|
|
293
|
-
var _props$extensionNodeV;
|
|
294
|
+
var _props$extensionNodeV, _props$extensionNodeV2;
|
|
294
295
|
// While sitting on SSR DOM, skip the React portal — see {@link didReuseSsrDom}.
|
|
295
296
|
if (this.didReuseSsrDom) {
|
|
296
297
|
return null;
|
|
@@ -299,6 +300,9 @@ export var ExtensionNode = /*#__PURE__*/function (_ReactNodeView) {
|
|
|
299
300
|
intl: props.intl,
|
|
300
301
|
nodeType: this.node.type.name,
|
|
301
302
|
macroInteractionDesignFeatureFlags: props.macroInteractionDesignFeatureFlags
|
|
303
|
+
// Only native embeds animate in; the reveal waits on the embed's own loading state.
|
|
304
|
+
,
|
|
305
|
+
generatedContentMotion: !!((_props$extensionNodeV = props.extensionNodeViewOptions) !== null && _props$extensionNodeV !== void 0 && _props$extensionNodeV.allowAIGeneratedContentMotion) && isNativeEmbedExtension(this.node)
|
|
302
306
|
}, /*#__PURE__*/React.createElement(Extension, {
|
|
303
307
|
editorView: this.view,
|
|
304
308
|
node: this.node,
|
|
@@ -315,7 +319,7 @@ export var ExtensionNode = /*#__PURE__*/function (_ReactNodeView) {
|
|
|
315
319
|
handleContentDOMRef: forwardRef,
|
|
316
320
|
extensionHandlers: props.extensionHandlers,
|
|
317
321
|
extensionLoadingHandlers: props.extensionLoadingHandlers,
|
|
318
|
-
editorAppearance: (_props$
|
|
322
|
+
editorAppearance: (_props$extensionNodeV2 = props.extensionNodeViewOptions) === null || _props$extensionNodeV2 === void 0 ? void 0 : _props$extensionNodeV2.appearance,
|
|
319
323
|
pluginInjectionApi: props.pluginInjectionApi,
|
|
320
324
|
macroInteractionDesignFeatureFlags: props.macroInteractionDesignFeatureFlags,
|
|
321
325
|
showLivePagesBodiedMacrosRendererView: props.showLivePagesBodiedMacrosRendererView,
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { NATIVE_EMBED_EXTENSION_KEY, NATIVE_EMBED_EXTENSION_TYPE } from '../extensions/manifest-helpers';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Whether a node is a native embed: the block `extension` that `editor-plugin-native-embeds` renders
|
|
5
|
+
* as an iframe. Bodied, multi-bodied and inline extensions do not qualify.
|
|
6
|
+
*
|
|
7
|
+
* The key can carry leading segments (`…:native-embed:database`), so it is matched with `includes`.
|
|
8
|
+
* `editor-plugin-native-embeds` and `editor-plugin-card` hold equivalent predicates; neither can be
|
|
9
|
+
* imported here, as both depend on this package.
|
|
10
|
+
*/
|
|
11
|
+
export var isNativeEmbedExtension = function isNativeEmbedExtension(node) {
|
|
12
|
+
var _node$attrs, _node$attrs2;
|
|
13
|
+
return node.type.name === 'extension' && ((_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.extensionType) === NATIVE_EMBED_EXTENSION_TYPE && typeof ((_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.extensionKey) === 'string' && node.attrs.extensionKey.includes(NATIVE_EMBED_EXTENSION_KEY);
|
|
14
|
+
};
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { useEffect } from 'react';
|
|
2
|
+
|
|
3
|
+
/** Set to `"true"` by the embed frame while loading, then removed — never set to `"false"`. */
|
|
4
|
+
var NATIVE_EMBED_LOADING_ATTRIBUTE = 'data-native-embed-loading';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Calls `onSettled` once the native embed inside `container` has finished loading, successfully or
|
|
8
|
+
* not. The extension handler mounts the embed asynchronously, so the subtree is observed rather
|
|
9
|
+
* than a known element.
|
|
10
|
+
*
|
|
11
|
+
* Two signals, because neither alone catches every embed: the attribute having been seen and gone,
|
|
12
|
+
* which covers a failure that renders no frame; or a frame with no attribute, which covers an embed
|
|
13
|
+
* that never advertises loading. The frame is present either way, so the attribute comes first.
|
|
14
|
+
*
|
|
15
|
+
* `onSettled` must be stable, and runs at most once per container.
|
|
16
|
+
*/
|
|
17
|
+
export var useNativeEmbedSettled = function useNativeEmbedSettled(container, onSettled) {
|
|
18
|
+
useEffect(function () {
|
|
19
|
+
if (!container || typeof MutationObserver === 'undefined') {
|
|
20
|
+
return;
|
|
21
|
+
}
|
|
22
|
+
var hasBeenLoading = false;
|
|
23
|
+
var settled = false;
|
|
24
|
+
var read = function read() {
|
|
25
|
+
if (settled) {
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
if (container.querySelector("[".concat(NATIVE_EMBED_LOADING_ATTRIBUTE, "=\"true\"]"))) {
|
|
29
|
+
hasBeenLoading = true;
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
if (hasBeenLoading || container.querySelector('iframe')) {
|
|
33
|
+
settled = true;
|
|
34
|
+
onSettled();
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
var observer = new MutationObserver(read);
|
|
38
|
+
observer.observe(container, {
|
|
39
|
+
attributes: true,
|
|
40
|
+
attributeFilter: [NATIVE_EMBED_LOADING_ATTRIBUTE],
|
|
41
|
+
childList: true,
|
|
42
|
+
subtree: true
|
|
43
|
+
});
|
|
44
|
+
|
|
45
|
+
// After `observe`, so a change landing in between is either read here or queued.
|
|
46
|
+
read();
|
|
47
|
+
return function () {
|
|
48
|
+
return observer.disconnect();
|
|
49
|
+
};
|
|
50
|
+
}, [container, onSettled]);
|
|
51
|
+
};
|
|
@@ -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 = "122.3.
|
|
22
|
+
var packageVersion = "122.3.3";
|
|
23
23
|
var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
|
|
24
24
|
// Remove URL as it has UGC
|
|
25
25
|
// Ignored via go/ees007
|
|
@@ -2,14 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
3
|
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; }
|
|
4
4
|
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; }
|
|
5
|
-
/**
|
|
6
|
-
* @jsxRuntime classic
|
|
7
|
-
* @jsx jsx
|
|
8
|
-
*/
|
|
9
5
|
import React from 'react';
|
|
10
|
-
|
|
11
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
12
|
-
import { jsx } from '@emotion/react';
|
|
13
6
|
import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
|
|
14
7
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
15
8
|
import { ACTION_SUBJECT, ACTION_SUBJECT_ID } from '../analytics';
|
|
@@ -336,15 +329,15 @@ function getPortalChildren(_ref3) {
|
|
|
336
329
|
// refactor. A test suite to catch any instances of this is ideal however
|
|
337
330
|
// the refactor required is currently out of scope for https://product-fabric.atlassian.net/browse/ED-14176
|
|
338
331
|
|
|
339
|
-
return
|
|
332
|
+
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
340
333
|
component: ACTION_SUBJECT.REACT_NODE_VIEW,
|
|
341
334
|
componentId: (_currentNode$type$nam = currentNode === null || currentNode === void 0 || (_currentNode$type2 = currentNode.type) === null || _currentNode$type2 === void 0 ? void 0 : _currentNode$type2.name) !== null && _currentNode$type$nam !== void 0 ? _currentNode$type$nam : ACTION_SUBJECT_ID.UNKNOWN_NODE,
|
|
342
335
|
dispatchAnalyticsEvent: dispatchAnalyticsEvent
|
|
343
|
-
},
|
|
336
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
344
337
|
className: "zeroWidthSpaceContainer"
|
|
345
|
-
},
|
|
338
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
346
339
|
className: "".concat(inlineNodeViewClassname, "AddZeroWidthSpace")
|
|
347
|
-
}), ZERO_WIDTH_SPACE),
|
|
340
|
+
}), ZERO_WIDTH_SPACE), /*#__PURE__*/React.createElement(Component, _extends({
|
|
348
341
|
view: nodeViewParams.view
|
|
349
342
|
// TODO: ED-13910 - Remove the boolean to fix the prosemirror view type
|
|
350
343
|
// Ignored via go/ees005
|
|
@@ -354,15 +347,17 @@ function getPortalChildren(_ref3) {
|
|
|
354
347
|
node: currentNode
|
|
355
348
|
// eslint-disable-next-line react/jsx-props-no-spreading -- Spreading props to pass through dynamic component props
|
|
356
349
|
}, extraComponentProps)), getBrowserInfo().android ?
|
|
350
|
+
/*#__PURE__*/
|
|
357
351
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
358
|
-
|
|
352
|
+
React.createElement("span", {
|
|
359
353
|
className: "zeroWidthSpaceContainer",
|
|
360
354
|
contentEditable: "false"
|
|
361
|
-
},
|
|
355
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
362
356
|
className: "".concat(inlineNodeViewClassname, "AddZeroWidthSpace")
|
|
363
357
|
}), ZERO_WIDTH_SPACE) :
|
|
358
|
+
/*#__PURE__*/
|
|
364
359
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
365
|
-
|
|
360
|
+
React.createElement("span", {
|
|
366
361
|
className: "".concat(inlineNodeViewClassname, "AddZeroWidthSpace")
|
|
367
362
|
}));
|
|
368
363
|
};
|
|
@@ -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 = "122.3.
|
|
24
|
+
var packageVersion = "122.3.3";
|
|
25
25
|
var halfFocusRing = 1;
|
|
26
26
|
var dropOffset = '0, 8';
|
|
27
27
|
var fadeIn = keyframes({
|
|
@@ -233,6 +233,11 @@ export declare const aiSuggestionsMessages: {
|
|
|
233
233
|
description: string;
|
|
234
234
|
id: string;
|
|
235
235
|
};
|
|
236
|
+
suggestEditsButtonTooltip: {
|
|
237
|
+
defaultMessage: string;
|
|
238
|
+
description: string;
|
|
239
|
+
id: string;
|
|
240
|
+
};
|
|
236
241
|
suggestEditsPromptPrefix: {
|
|
237
242
|
defaultMessage: string;
|
|
238
243
|
description: string;
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*
|
|
5
|
-
* IMPORTANT: This file MUST keep the emotion JSX pragma (@jsx jsx from @emotion/react).
|
|
2
|
+
* IMPORTANT: This file MUST keep using emotion's `jsx` factory (from @emotion/react).
|
|
6
3
|
* This is intentional — it allows the HOC to apply emotion styles via the css prop
|
|
7
|
-
*
|
|
8
|
-
*
|
|
4
|
+
* without requiring the wrapped component to use the emotion pragma itself.
|
|
5
|
+
*
|
|
6
|
+
* Note: `jsx` is called directly rather than via the `@jsx jsx` pragma. The two are
|
|
7
|
+
* equivalent (the pragma just compiles JSX down to these calls), but the direct form
|
|
8
|
+
* avoids emotion's `EmotionJSX.LibraryManagedAttributes`, which since @emotion/react
|
|
9
|
+
* 11.13 is a distributive conditional type that TypeScript cannot resolve when the
|
|
10
|
+
* element's props are an uninstantiated generic parameter such as `P` below.
|
|
9
11
|
*
|
|
10
12
|
* This file is part of the Emotion → Compiled CSS-in-JS migration infrastructure.
|
|
11
13
|
* It is temporary and should be removed once the migration is complete.
|
|
@@ -9,6 +9,12 @@ import type { IntlShape } from 'react-intl';
|
|
|
9
9
|
import type { MacroInteractionDesignFeatureFlags } from './types';
|
|
10
10
|
type Props = {
|
|
11
11
|
children: React.ReactNode;
|
|
12
|
+
/**
|
|
13
|
+
* Renders the node through `GeneratedContentReveal`, which holds it closed while its embed loads
|
|
14
|
+
* and then animates it in. Set by the node view for native embeds only; see
|
|
15
|
+
* `allowAIGeneratedContentMotion` on the extension plugin's options.
|
|
16
|
+
*/
|
|
17
|
+
generatedContentMotion?: boolean;
|
|
12
18
|
intl: IntlShape | undefined;
|
|
13
19
|
macroInteractionDesignFeatureFlags?: MacroInteractionDesignFeatureFlags;
|
|
14
20
|
nodeType: string;
|
|
@@ -21,5 +27,5 @@ type Props = {
|
|
|
21
27
|
* @param param0
|
|
22
28
|
* @returns
|
|
23
29
|
*/
|
|
24
|
-
export declare const ExtensionNodeWrapper: ({ children, nodeType, macroInteractionDesignFeatureFlags, intl, }: Props) => jsx.JSX.Element;
|
|
30
|
+
export declare const ExtensionNodeWrapper: ({ children, nodeType, macroInteractionDesignFeatureFlags, generatedContentMotion, intl, }: Props) => jsx.JSX.Element;
|
|
25
31
|
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
* @jsx jsx
|
|
4
|
+
*/
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import type { IntlShape } from 'react-intl';
|
|
7
|
+
type Props = {
|
|
8
|
+
children: React.ReactNode;
|
|
9
|
+
intl: IntlShape | undefined;
|
|
10
|
+
showMacroInteractionDesignUpdates: boolean | undefined;
|
|
11
|
+
};
|
|
12
|
+
export declare const GeneratedContentReveal: ({ children, intl, showMacroInteractionDesignUpdates, }: Props) => React.JSX.Element;
|
|
13
|
+
export {};
|
|
@@ -12,6 +12,8 @@ import ReactNodeView from '../react-node-view';
|
|
|
12
12
|
import type { EditorAppearance } from '../types';
|
|
13
13
|
import type { ExtensionsPluginInjectionAPI, MacroInteractionDesignFeatureFlags, GetPMNodeHeight } from './types';
|
|
14
14
|
interface ExtensionNodeViewOptions {
|
|
15
|
+
/** See `allowAIGeneratedContentMotion` on the extension plugin's options. */
|
|
16
|
+
allowAIGeneratedContentMotion?: boolean;
|
|
15
17
|
appearance?: EditorAppearance;
|
|
16
18
|
getExtensionHeight?: GetPMNodeHeight;
|
|
17
19
|
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
|
|
2
|
+
/**
|
|
3
|
+
* Whether a node is a native embed: the block `extension` that `editor-plugin-native-embeds` renders
|
|
4
|
+
* as an iframe. Bodied, multi-bodied and inline extensions do not qualify.
|
|
5
|
+
*
|
|
6
|
+
* The key can carry leading segments (`…:native-embed:database`), so it is matched with `includes`.
|
|
7
|
+
* `editor-plugin-native-embeds` and `editor-plugin-card` hold equivalent predicates; neither can be
|
|
8
|
+
* imported here, as both depend on this package.
|
|
9
|
+
*/
|
|
10
|
+
export declare const isNativeEmbedExtension: (node: PMNode) => boolean;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Calls `onSettled` once the native embed inside `container` has finished loading, successfully or
|
|
3
|
+
* not. The extension handler mounts the embed asynchronously, so the subtree is observed rather
|
|
4
|
+
* than a known element.
|
|
5
|
+
*
|
|
6
|
+
* Two signals, because neither alone catches every embed: the attribute having been seen and gone,
|
|
7
|
+
* which covers a failure that renders no frame; or a frame with no attribute, which covers an embed
|
|
8
|
+
* that never advertises loading. The frame is present either way, so the attribute comes first.
|
|
9
|
+
*
|
|
10
|
+
* `onSettled` must be stable, and runs at most once per container.
|
|
11
|
+
*/
|
|
12
|
+
export declare const useNativeEmbedSettled: (container: HTMLElement | null, onSettled: () => void) => void;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@atlaskit/editor-common/extensibility/native-embed",
|
|
3
|
+
"main": "../../dist/cjs/extensibility/nativeEmbedExtension.js",
|
|
4
|
+
"module": "../../dist/esm/extensibility/nativeEmbedExtension.js",
|
|
5
|
+
"module:es2019": "../../dist/es2019/extensibility/nativeEmbedExtension.js",
|
|
6
|
+
"sideEffects": [
|
|
7
|
+
"**/*.compiled.css"
|
|
8
|
+
],
|
|
9
|
+
"types": "../../dist/types/extensibility/nativeEmbedExtension.d.ts"
|
|
10
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-common",
|
|
3
|
-
"version": "122.
|
|
3
|
+
"version": "122.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/"
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"@atlaskit/analytics-listeners": "^11.3.0",
|
|
36
36
|
"@atlaskit/analytics-namespaced-context": "^8.2.0",
|
|
37
37
|
"@atlaskit/analytics-next": "^12.5.0",
|
|
38
|
-
"@atlaskit/atlassian-context": "^1.
|
|
38
|
+
"@atlaskit/atlassian-context": "^1.2.0",
|
|
39
39
|
"@atlaskit/browser-apis": "^1.2.0",
|
|
40
40
|
"@atlaskit/button": "^25.3.0",
|
|
41
41
|
"@atlaskit/codemod-utils": "^5.1.0",
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"@atlaskit/editor-ui-control-model": "^2.9.0",
|
|
53
53
|
"@atlaskit/emoji": "^72.4.0",
|
|
54
54
|
"@atlaskit/feature-gate-js-client": "^6.0.0",
|
|
55
|
-
"@atlaskit/icon": "^37.
|
|
55
|
+
"@atlaskit/icon": "^37.7.0",
|
|
56
56
|
"@atlaskit/link": "^5.1.0",
|
|
57
57
|
"@atlaskit/link-datasource": "^6.13.0",
|
|
58
58
|
"@atlaskit/link-picker": "^6.8.0",
|
|
@@ -73,12 +73,12 @@
|
|
|
73
73
|
"@atlaskit/platform-feature-flags-react": "^1.2.0",
|
|
74
74
|
"@atlaskit/popper": "^9.4.0",
|
|
75
75
|
"@atlaskit/primitives": "^22.5.0",
|
|
76
|
-
"@atlaskit/profilecard": "^26.
|
|
76
|
+
"@atlaskit/profilecard": "^26.24.0",
|
|
77
77
|
"@atlaskit/prosemirror-history": "^1.2.0",
|
|
78
78
|
"@atlaskit/react-compiler-gating": "^0.2.0",
|
|
79
79
|
"@atlaskit/react-ufo": "^7.10.0",
|
|
80
80
|
"@atlaskit/section-message": "^10.2.0",
|
|
81
|
-
"@atlaskit/smart-card": "^45.
|
|
81
|
+
"@atlaskit/smart-card": "^45.23.0",
|
|
82
82
|
"@atlaskit/smart-user-picker": "^11.8.0",
|
|
83
83
|
"@atlaskit/spinner": "^20.4.0",
|
|
84
84
|
"@atlaskit/task-decision": "^21.10.0",
|