@atlaskit/editor-common 105.2.1 → 105.2.3
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 +20 -0
- package/dist/cjs/analytics/types/enums.js +4 -0
- package/dist/cjs/analytics/types/offline-editing-event.js +5 -0
- package/dist/cjs/monitoring/error.js +1 -1
- package/dist/cjs/resizer/BreakoutResizer.js +13 -0
- package/dist/cjs/ui/DropList/index.js +1 -1
- package/dist/cjs/ui/MediaSingle/index.js +23 -1
- package/dist/cjs/ui/MediaSingle/styled.js +33 -2
- package/dist/cjs/user-preferences/hooks.js +5 -0
- package/dist/cjs/user-preferences/user-preferences-provider.js +21 -0
- package/dist/cjs/utils/imageLoader.js +62 -27
- package/dist/es2019/analytics/types/enums.js +4 -0
- package/dist/es2019/analytics/types/offline-editing-event.js +1 -0
- package/dist/es2019/monitoring/error.js +1 -1
- package/dist/es2019/resizer/BreakoutResizer.js +13 -0
- package/dist/es2019/ui/DropList/index.js +1 -1
- package/dist/es2019/ui/MediaSingle/index.js +23 -1
- package/dist/es2019/ui/MediaSingle/styled.js +33 -2
- package/dist/es2019/user-preferences/hooks.js +5 -0
- package/dist/es2019/user-preferences/user-preferences-provider.js +21 -0
- package/dist/es2019/utils/imageLoader.js +58 -25
- package/dist/esm/analytics/types/enums.js +4 -0
- package/dist/esm/analytics/types/offline-editing-event.js +1 -0
- package/dist/esm/monitoring/error.js +1 -1
- package/dist/esm/resizer/BreakoutResizer.js +13 -0
- package/dist/esm/ui/DropList/index.js +1 -1
- package/dist/esm/ui/MediaSingle/index.js +23 -1
- package/dist/esm/ui/MediaSingle/styled.js +33 -2
- package/dist/esm/user-preferences/hooks.js +5 -0
- package/dist/esm/user-preferences/user-preferences-provider.js +21 -0
- package/dist/esm/utils/imageLoader.js +62 -27
- package/dist/types/analytics/types/alignment-events.d.ts +1 -1
- package/dist/types/analytics/types/enums.d.ts +5 -1
- package/dist/types/analytics/types/events.d.ts +3 -2
- package/dist/types/analytics/types/offline-editing-event.d.ts +13 -0
- package/dist/types/card/MediaAndEmbedsToolbar/index.d.ts +1 -1
- package/dist/types/collab/index.d.ts +1 -0
- package/dist/types/resizer/BreakoutResizer.d.ts +14 -1
- package/dist/types/resizer/ResizerBreakoutModeLabel.d.ts +1 -1
- package/dist/types/ui/MediaSingle/index.d.ts +21 -0
- package/dist/types/ui/MediaSingle/styled.d.ts +32 -1
- package/dist/types/user-preferences/hooks.d.ts +5 -0
- package/dist/types/user-preferences/persistence-api.d.ts +1 -1
- package/dist/types/user-preferences/user-preferences-provider.d.ts +21 -2
- package/dist/types-ts4.5/analytics/types/alignment-events.d.ts +1 -1
- package/dist/types-ts4.5/analytics/types/enums.d.ts +5 -1
- package/dist/types-ts4.5/analytics/types/events.d.ts +3 -2
- package/dist/types-ts4.5/analytics/types/offline-editing-event.d.ts +13 -0
- package/dist/types-ts4.5/card/MediaAndEmbedsToolbar/index.d.ts +1 -1
- package/dist/types-ts4.5/collab/index.d.ts +1 -0
- package/dist/types-ts4.5/resizer/BreakoutResizer.d.ts +14 -1
- package/dist/types-ts4.5/resizer/ResizerBreakoutModeLabel.d.ts +1 -1
- package/dist/types-ts4.5/ui/MediaSingle/index.d.ts +21 -0
- package/dist/types-ts4.5/ui/MediaSingle/styled.d.ts +32 -1
- package/dist/types-ts4.5/user-preferences/hooks.d.ts +5 -0
- package/dist/types-ts4.5/user-preferences/persistence-api.d.ts +1 -1
- package/dist/types-ts4.5/user-preferences/user-preferences-provider.d.ts +21 -2
- package/package.json +9 -9
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
import { useEffect, useState } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
* @param userPreferencesProvider
|
|
5
|
+
* @example
|
|
6
|
+
*/
|
|
2
7
|
export function useResolvedUserPreferences(userPreferencesProvider) {
|
|
3
8
|
const [resolvedUserPreferences, setResolvedUserPreferences] = useState(userPreferencesProvider.getPreferences());
|
|
4
9
|
useEffect(() => {
|
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
*/
|
|
2
5
|
export class UserPreferencesProvider {
|
|
3
6
|
/**
|
|
4
7
|
* @param persistenceAPI - The persistence API to use for loading and updating user preferences
|
|
5
8
|
* @param defaultPreferences - The default user preferences to use
|
|
6
9
|
* @param initialUserPreferences - The initial user preferences to use (optional)
|
|
10
|
+
* @example
|
|
7
11
|
*/
|
|
8
12
|
constructor(persistenceAPI, defaultPreferences) {
|
|
9
13
|
var _this$persistenceAPI$, _this$persistenceAPI;
|
|
@@ -20,6 +24,10 @@ export class UserPreferencesProvider {
|
|
|
20
24
|
this.loadPreferences();
|
|
21
25
|
}
|
|
22
26
|
}
|
|
27
|
+
|
|
28
|
+
/**
|
|
29
|
+
*
|
|
30
|
+
*/
|
|
23
31
|
get isInitialized() {
|
|
24
32
|
return this.initialized;
|
|
25
33
|
}
|
|
@@ -28,6 +36,7 @@ export class UserPreferencesProvider {
|
|
|
28
36
|
* This method fetches the latest user preferences
|
|
29
37
|
* @returns a promise that resolves with the user preferences, or rejects if error occurs
|
|
30
38
|
* @throws Error if there is an error loading user preferences
|
|
39
|
+
* @example
|
|
31
40
|
*/
|
|
32
41
|
async loadPreferences() {
|
|
33
42
|
const userPreferences = await this.persistenceAPI.loadUserPreferences();
|
|
@@ -40,6 +49,7 @@ export class UserPreferencesProvider {
|
|
|
40
49
|
* @param value
|
|
41
50
|
* @returns a promise that resolves when the user preference is updated
|
|
42
51
|
* @throws Error if there is an error updating user preferences
|
|
52
|
+
* @example
|
|
43
53
|
*/
|
|
44
54
|
async updatePreference(key, value) {
|
|
45
55
|
const userPreferences = await this.persistenceAPI.updateUserPreference(key, value);
|
|
@@ -50,6 +60,7 @@ export class UserPreferencesProvider {
|
|
|
50
60
|
* get a user preference, Note that this function is a not async function,
|
|
51
61
|
* meaning that consumers should prefetch the user preference and make it available initially
|
|
52
62
|
* @param key
|
|
63
|
+
* @example
|
|
53
64
|
*/
|
|
54
65
|
getPreference(key) {
|
|
55
66
|
return this.resolvedUserPreferences[key];
|
|
@@ -57,6 +68,7 @@ export class UserPreferencesProvider {
|
|
|
57
68
|
|
|
58
69
|
/**
|
|
59
70
|
* get all user preferences
|
|
71
|
+
* @example
|
|
60
72
|
*/
|
|
61
73
|
getPreferences() {
|
|
62
74
|
return this.resolvedUserPreferences;
|
|
@@ -64,7 +76,9 @@ export class UserPreferencesProvider {
|
|
|
64
76
|
|
|
65
77
|
/**
|
|
66
78
|
* This method fetches the latest user preferences
|
|
79
|
+
* @param onUpdate
|
|
67
80
|
* @returns a function to unsubscribe from the updates
|
|
81
|
+
* @example
|
|
68
82
|
*/
|
|
69
83
|
onUpdate(onUpdate) {
|
|
70
84
|
this.callbacks.push(onUpdate);
|
|
@@ -80,6 +94,7 @@ export class UserPreferencesProvider {
|
|
|
80
94
|
* setting the default user preferences will also trigger an update
|
|
81
95
|
* This is useful when the default user preferences dynamically based on the context
|
|
82
96
|
* @param preferences
|
|
97
|
+
* @example
|
|
83
98
|
*/
|
|
84
99
|
setDefaultPreferences(preferences) {
|
|
85
100
|
this.defaultPreferences = preferences;
|
|
@@ -98,6 +113,11 @@ export class UserPreferencesProvider {
|
|
|
98
113
|
this.initialized = true;
|
|
99
114
|
}
|
|
100
115
|
}
|
|
116
|
+
|
|
117
|
+
/**
|
|
118
|
+
*
|
|
119
|
+
* @example
|
|
120
|
+
*/
|
|
101
121
|
notifyUserPreferencesUpdated() {
|
|
102
122
|
this.callbacks.forEach(callback => {
|
|
103
123
|
callback(this.resolvedUserPreferences);
|
|
@@ -109,6 +129,7 @@ export class UserPreferencesProvider {
|
|
|
109
129
|
* with the user preferences and filtering out any undefined or null values
|
|
110
130
|
* to avoid overwriting default preferences with null values
|
|
111
131
|
* @returns true if the user preferences were updated, false otherwise
|
|
132
|
+
* @example
|
|
112
133
|
*/
|
|
113
134
|
resolveUserPreferences() {
|
|
114
135
|
// Merge default preferences with user preferences
|
|
@@ -28,10 +28,19 @@ export const withImageLoaderOld = Wrapped => class WithImageLoader extends Compo
|
|
|
28
28
|
});
|
|
29
29
|
});
|
|
30
30
|
}
|
|
31
|
+
/**
|
|
32
|
+
*
|
|
33
|
+
* @example
|
|
34
|
+
*/
|
|
31
35
|
componentDidMount() {
|
|
32
36
|
this.fetchImage(this.props);
|
|
33
37
|
}
|
|
34
38
|
|
|
39
|
+
/**
|
|
40
|
+
*
|
|
41
|
+
* @param nextProps
|
|
42
|
+
* @example
|
|
43
|
+
*/
|
|
35
44
|
// Ignored via go/ees005
|
|
36
45
|
// eslint-disable-next-line react/no-unsafe
|
|
37
46
|
UNSAFE_componentWillReceiveProps(nextProps) {
|
|
@@ -42,33 +51,53 @@ export const withImageLoaderOld = Wrapped => class WithImageLoader extends Compo
|
|
|
42
51
|
this.fetchImage(nextProps);
|
|
43
52
|
}
|
|
44
53
|
}
|
|
54
|
+
|
|
55
|
+
/**
|
|
56
|
+
*
|
|
57
|
+
* @example
|
|
58
|
+
*/
|
|
45
59
|
componentWillUnmount() {
|
|
46
60
|
if (this.img) {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
61
|
+
if (!process.env.REACT_SSR) {
|
|
62
|
+
// Ignored via go/ees005
|
|
63
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
64
|
+
this.img.removeEventListener('load', this.onLoad);
|
|
65
|
+
// Ignored via go/ees005
|
|
66
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
67
|
+
this.img.removeEventListener('error', this.onError);
|
|
68
|
+
this.img = null;
|
|
69
|
+
}
|
|
54
70
|
}
|
|
55
71
|
}
|
|
72
|
+
|
|
73
|
+
/**
|
|
74
|
+
*
|
|
75
|
+
* @param root0
|
|
76
|
+
* @param root0.url
|
|
77
|
+
* @example
|
|
78
|
+
*/
|
|
56
79
|
fetchImage({
|
|
57
80
|
url
|
|
58
81
|
}) {
|
|
59
82
|
if (url) {
|
|
60
83
|
if (!this.img) {
|
|
61
84
|
this.img = new Image();
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
85
|
+
if (!process.env.REACT_SSR) {
|
|
86
|
+
// Ignored via go/ees005
|
|
87
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
88
|
+
this.img.addEventListener('load', this.onLoad);
|
|
89
|
+
// Ignored via go/ees005
|
|
90
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
91
|
+
this.img.addEventListener('error', this.onError);
|
|
92
|
+
}
|
|
68
93
|
}
|
|
69
94
|
this.img.src = url;
|
|
70
95
|
}
|
|
71
96
|
}
|
|
97
|
+
/**
|
|
98
|
+
*
|
|
99
|
+
* @example
|
|
100
|
+
*/
|
|
72
101
|
render() {
|
|
73
102
|
const {
|
|
74
103
|
imageStatus
|
|
@@ -119,12 +148,14 @@ const withImageLoaderNew = Wrapped => class WithImageLoader extends Component {
|
|
|
119
148
|
}
|
|
120
149
|
componentWillUnmount() {
|
|
121
150
|
if (this.img) {
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
151
|
+
if (!process.env.REACT_SSR) {
|
|
152
|
+
// Ignored via go/ees005
|
|
153
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
154
|
+
this.img.removeEventListener('load', this.onLoad);
|
|
155
|
+
// Ignored via go/ees005
|
|
156
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
157
|
+
this.img.removeEventListener('error', this.onError);
|
|
158
|
+
}
|
|
128
159
|
this.img = null;
|
|
129
160
|
}
|
|
130
161
|
}
|
|
@@ -134,12 +165,14 @@ const withImageLoaderNew = Wrapped => class WithImageLoader extends Component {
|
|
|
134
165
|
if (url) {
|
|
135
166
|
if (!this.img) {
|
|
136
167
|
this.img = new Image();
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
168
|
+
if (!process.env.REACT_SSR) {
|
|
169
|
+
// Ignored via go/ees005
|
|
170
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
171
|
+
this.img.addEventListener('load', this.onLoad);
|
|
172
|
+
// Ignored via go/ees005
|
|
173
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
174
|
+
this.img.addEventListener('error', this.onError);
|
|
175
|
+
}
|
|
143
176
|
}
|
|
144
177
|
this.img.src = url;
|
|
145
178
|
}
|
|
@@ -84,6 +84,8 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
|
|
|
84
84
|
ACTION["MATCHED"] = "matched";
|
|
85
85
|
ACTION["MEDIA_LINK_TRANSFORMED"] = "mediaLinkTransformed";
|
|
86
86
|
ACTION["NODE_CONTENT_SANITIZED"] = "nodeContentSanitized";
|
|
87
|
+
ACTION["OFFLINE_STORAGE_TOO_MANY_RETRIES_ERROR"] = "offlineStorageTooManyRetriesError";
|
|
88
|
+
ACTION["OFFLINE_STORAGE_STEPS_DATABASE_ERROR"] = "offlineStorageStepsDatabaseError";
|
|
87
89
|
ACTION["OPENED"] = "opened";
|
|
88
90
|
ACTION["OUTDENTED"] = "outdented";
|
|
89
91
|
ACTION["PASTED"] = "pasted";
|
|
@@ -311,6 +313,7 @@ export var ACTION_SUBJECT = /*#__PURE__*/function (ACTION_SUBJECT) {
|
|
|
311
313
|
ACTION_SUBJECT["AI_DEFINITIONS"] = "aiDefinitions";
|
|
312
314
|
ACTION_SUBJECT["USER_PREFERENCES"] = "userPreferences";
|
|
313
315
|
ACTION_SUBJECT["ALIGNMENT"] = "alignment";
|
|
316
|
+
ACTION_SUBJECT["OFFLINE_EDITING"] = "offlineEditing";
|
|
314
317
|
return ACTION_SUBJECT;
|
|
315
318
|
}({});
|
|
316
319
|
export var ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
|
|
@@ -399,6 +402,7 @@ export var ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
|
|
|
399
402
|
ACTION_SUBJECT_ID["NESTED_EXPAND"] = "nestedExpand";
|
|
400
403
|
ACTION_SUBJECT_ID["NODE"] = "node";
|
|
401
404
|
ACTION_SUBJECT_ID["OPEN_LINK"] = "openLink";
|
|
405
|
+
ACTION_SUBJECT_ID["OFFLINE_EDITING"] = "offlineEditing";
|
|
402
406
|
ACTION_SUBJECT_ID["PANEL"] = "panel";
|
|
403
407
|
ACTION_SUBJECT_ID["PASTE_BLOCK_CARD"] = "blockCard";
|
|
404
408
|
ACTION_SUBJECT_ID["PASTE_BLOCKQUOTE"] = "blockQuote";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
7
7
|
import { isFedRamp } from './environment';
|
|
8
8
|
var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
|
|
9
9
|
var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
|
|
10
|
-
var packageVersion = "105.2.
|
|
10
|
+
var packageVersion = "105.2.3";
|
|
11
11
|
var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
|
|
12
12
|
// Remove URL as it has UGC
|
|
13
13
|
// Ignored via go/ees007
|
|
@@ -71,6 +71,19 @@ var RESIZE_STEP_VALUE = 10;
|
|
|
71
71
|
* correct ADF support.
|
|
72
72
|
*
|
|
73
73
|
* use experiment platform_editor_advanced_layouts
|
|
74
|
+
* @param root0
|
|
75
|
+
* @param root0.editorView
|
|
76
|
+
* @param root0.nodeType
|
|
77
|
+
* @param root0.getPos
|
|
78
|
+
* @param root0.getRef
|
|
79
|
+
* @param root0.disabled
|
|
80
|
+
* @param root0.getEditorWidth
|
|
81
|
+
* @param root0.parentRef
|
|
82
|
+
* @param root0.displayGuidelines
|
|
83
|
+
* @param root0.editorAnalyticsApi
|
|
84
|
+
* @param root0.displayGapCursor
|
|
85
|
+
* @param root0.onResizeStart
|
|
86
|
+
* @example
|
|
74
87
|
*/
|
|
75
88
|
var BreakoutResizer = function BreakoutResizer(_ref) {
|
|
76
89
|
var editorView = _ref.editorView,
|
|
@@ -20,7 +20,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
|
|
|
20
20
|
import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
21
21
|
import Layer from '../Layer';
|
|
22
22
|
var packageName = "@atlaskit/editor-common";
|
|
23
|
-
var packageVersion = "105.2.
|
|
23
|
+
var packageVersion = "105.2.3";
|
|
24
24
|
var halfFocusRing = 1;
|
|
25
25
|
var dropOffset = '0, 8';
|
|
26
26
|
// Ignored via go/ees005
|
|
@@ -16,6 +16,27 @@ import { MEDIA_SINGLE_GUTTER_SIZE } from '../../media-single/constants';
|
|
|
16
16
|
import { getMediaSinglePixelWidth } from '../../media-single/utils';
|
|
17
17
|
import { shouldAddDefaultWrappedWidth } from '../../utils/rich-media-utils';
|
|
18
18
|
import { MediaSingleDimensionHelper, MediaWrapper } from './styled';
|
|
19
|
+
/**
|
|
20
|
+
* MediaSingle
|
|
21
|
+
* @param root0
|
|
22
|
+
* @param root0.layout
|
|
23
|
+
* @param root0.width
|
|
24
|
+
* @param root0.height
|
|
25
|
+
* @param root0.containerWidth
|
|
26
|
+
* @param root0.isLoading
|
|
27
|
+
* @param root0.pctWidth
|
|
28
|
+
* @param root0.size
|
|
29
|
+
* @param root0.className
|
|
30
|
+
* @param root0.children
|
|
31
|
+
* @param root0.nodeType
|
|
32
|
+
* @param root0.fullWidthMode
|
|
33
|
+
* @param root0.lineLength
|
|
34
|
+
* @param root0.hasFallbackContainer
|
|
35
|
+
* @param root0.handleMediaSingleRef
|
|
36
|
+
* @param root0.isInsideOfInlineExtension
|
|
37
|
+
* @param root0.dataAttributes
|
|
38
|
+
* @example
|
|
39
|
+
*/
|
|
19
40
|
export default function MediaSingle(_ref) {
|
|
20
41
|
var layout = _ref.layout,
|
|
21
42
|
width = _ref.width,
|
|
@@ -99,7 +120,8 @@ export default function MediaSingle(_ref) {
|
|
|
99
120
|
mediaSingleWidth: mediaSingleWidth,
|
|
100
121
|
fullWidthMode: fullWidthMode,
|
|
101
122
|
isExtendedResizeExperienceOn: isPixelWidth,
|
|
102
|
-
isInsideOfInlineExtension: isInsideOfInlineExtension
|
|
123
|
+
isInsideOfInlineExtension: isInsideOfInlineExtension,
|
|
124
|
+
nodeType: nodeType
|
|
103
125
|
})
|
|
104
126
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
105
127
|
}, fg('platform_fix_media_image_resizing') || fg('platform_editor_fix_image_size_diff_during_ssr') ? {} : {
|
|
@@ -45,6 +45,13 @@ function getWidthIfDefaultMode(originalWidth, containerWidth, isInsideOfInlineEx
|
|
|
45
45
|
* If an image has not been resized using the pctWidth attribute,
|
|
46
46
|
* then an image in wide or full-width can not be wider than the image's
|
|
47
47
|
* original width.
|
|
48
|
+
* @param layout
|
|
49
|
+
* @param width
|
|
50
|
+
* @param containerWidth
|
|
51
|
+
* @param fullWidthMode
|
|
52
|
+
* @param isResized
|
|
53
|
+
* @param isInsideOfInlineExtension
|
|
54
|
+
* @example
|
|
48
55
|
*/
|
|
49
56
|
export function calcLegacyWidth(layout, width) {
|
|
50
57
|
var containerWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
@@ -72,6 +79,12 @@ export function calcLegacyWidth(layout, width) {
|
|
|
72
79
|
* If an image has not been resized using the pctWidth attribute,
|
|
73
80
|
* then an image in wide or full-width can not be wider than the image's
|
|
74
81
|
* original width.
|
|
82
|
+
* @param layout
|
|
83
|
+
* @param width
|
|
84
|
+
* @param containerWidth
|
|
85
|
+
* @param fullWidthMode
|
|
86
|
+
* @param isResized
|
|
87
|
+
* @example
|
|
75
88
|
*/
|
|
76
89
|
export function calcLegacyWidthForInline(layout, width) {
|
|
77
90
|
var containerWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
@@ -97,6 +110,10 @@ export function calcLegacyWidthForInline(layout, width) {
|
|
|
97
110
|
*
|
|
98
111
|
* Wide and full-width images are always that size (960px and 100%); there is
|
|
99
112
|
* no distinction between max-width and width.
|
|
113
|
+
* @param layout
|
|
114
|
+
* @param width
|
|
115
|
+
* @param containerWidth
|
|
116
|
+
* @example
|
|
100
117
|
*/
|
|
101
118
|
export function calcResizedWidth(layout, width) {
|
|
102
119
|
var containerWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
@@ -146,6 +163,7 @@ function isImageAligned(layout) {
|
|
|
146
163
|
*
|
|
147
164
|
* @param widthValue CSS width value to be rounded
|
|
148
165
|
* @returns Reduced CSS width value where px value given, or otherwise the original value
|
|
166
|
+
* @example
|
|
149
167
|
*/
|
|
150
168
|
// Ignored via go/ees005
|
|
151
169
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -163,6 +181,18 @@ export function roundToClosestEvenPxValue(widthValue) {
|
|
|
163
181
|
/**
|
|
164
182
|
* Can't use `.attrs` to handle highly dynamic styles because we are still
|
|
165
183
|
* supporting `styled-components` v1.
|
|
184
|
+
* @param root0
|
|
185
|
+
* @param root0.containerWidth
|
|
186
|
+
* @param root0.fullWidthMode
|
|
187
|
+
* @param root0.isResized
|
|
188
|
+
* @param root0.layout
|
|
189
|
+
* @param root0.mediaSingleWidth
|
|
190
|
+
* @param root0.width
|
|
191
|
+
* @param root0.isExtendedResizeExperienceOn
|
|
192
|
+
* @param root0.isNestedNode
|
|
193
|
+
* @param root0.isInsideOfInlineExtension
|
|
194
|
+
* @param root0.nodeType
|
|
195
|
+
* @example
|
|
166
196
|
*/
|
|
167
197
|
export var MediaSingleDimensionHelper = function MediaSingleDimensionHelper(_ref) {
|
|
168
198
|
var _ref$containerWidth = _ref.containerWidth,
|
|
@@ -176,7 +206,8 @@ export var MediaSingleDimensionHelper = function MediaSingleDimensionHelper(_ref
|
|
|
176
206
|
_ref$isNestedNode = _ref.isNestedNode,
|
|
177
207
|
isNestedNode = _ref$isNestedNode === void 0 ? false : _ref$isNestedNode,
|
|
178
208
|
_ref$isInsideOfInline = _ref.isInsideOfInlineExtension,
|
|
179
|
-
isInsideOfInlineExtension = _ref$isInsideOfInline === void 0 ? false : _ref$isInsideOfInline
|
|
209
|
+
isInsideOfInlineExtension = _ref$isInsideOfInline === void 0 ? false : _ref$isInsideOfInline,
|
|
210
|
+
nodeType = _ref.nodeType;
|
|
180
211
|
var calculatedWidth = roundToClosestEvenPxValue(isExtendedResizeExperienceOn ? "".concat(mediaSingleWidth || width, "px") : mediaSingleWidth ? calcResizedWidth(layout, width || 0, containerWidth) : calcLegacyWidth(layout, width || 0, containerWidth, fullWidthMode, isResized, isInsideOfInlineExtension));
|
|
181
212
|
var calculatedMaxWidth = roundToClosestEvenPxValue(isExtendedResizeExperienceOn ? "".concat(containerWidth, "px") : calcMaxWidth(layout, containerWidth));
|
|
182
213
|
|
|
@@ -193,7 +224,7 @@ export var MediaSingleDimensionHelper = function MediaSingleDimensionHelper(_ref
|
|
|
193
224
|
'@container view-page-content (min-width: 1px)': {
|
|
194
225
|
maxWidth: '100cqw'
|
|
195
226
|
}
|
|
196
|
-
}) : '', isSSR() && fg('platform_editor_fix_image_size_diff_during_ssr') ? Math.max(parseInt(calculatedWidth.replace('px', '')), parseInt(calculatedMaxWidth.replace('px', ''))) + 'px' : calculatedMaxWidth, isExtendedResizeExperienceOn && "&[class*='is-resizing'] {\n .new-file-experience-wrapper {\n box-shadow: none !important;\n }\n\n ".concat(!isNestedNode && nonWrappedLayouts.includes(layout) && "margin-left: 50%;\n transform: translateX(-50%);", "\n }"), float(layout), calcMargin(layout), isNestedNode ? /* Make nested node appear responsive when resizing table cell */"max-width: 100%;" : nonWrappedLayouts.includes(layout) && "margin-left: 50%;\n transform: translateX(-50%);", isImageAligned(layout));
|
|
227
|
+
}) : '', isSSR() && !calculatedMaxWidth.endsWith('%') && fg('platform_editor_fix_image_size_diff_during_ssr') ? Math.max(parseInt(calculatedWidth.replace('px', '')), parseInt(calculatedMaxWidth.replace('px', ''))) + 'px' : calculatedMaxWidth, isExtendedResizeExperienceOn && "&[class*='is-resizing'] {\n .new-file-experience-wrapper {\n box-shadow: none !important;\n }\n\n ".concat(!isNestedNode && nonWrappedLayouts.includes(layout) && "margin-left: 50%;\n transform: translateX(-50%);", "\n }"), float(layout), calcMargin(layout), isNestedNode ? /* Make nested node appear responsive when resizing table cell */"max-width: 100%;" : nonWrappedLayouts.includes(layout) && "margin-left: 50%;\n transform: translateX(-50%);", isImageAligned(layout));
|
|
197
228
|
};
|
|
198
229
|
var RenderFallbackContainer = function RenderFallbackContainer(_ref2) {
|
|
199
230
|
var hasFallbackContainer = _ref2.hasFallbackContainer,
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
2
|
import { useEffect, useState } from 'react';
|
|
3
|
+
/**
|
|
4
|
+
*
|
|
5
|
+
* @param userPreferencesProvider
|
|
6
|
+
* @example
|
|
7
|
+
*/
|
|
3
8
|
export function useResolvedUserPreferences(userPreferencesProvider) {
|
|
4
9
|
var _useState = useState(userPreferencesProvider.getPreferences()),
|
|
5
10
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -6,11 +6,15 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
6
6
|
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; }
|
|
7
7
|
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; }
|
|
8
8
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
9
|
+
/**
|
|
10
|
+
*
|
|
11
|
+
*/
|
|
9
12
|
export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
10
13
|
/**
|
|
11
14
|
* @param persistenceAPI - The persistence API to use for loading and updating user preferences
|
|
12
15
|
* @param defaultPreferences - The default user preferences to use
|
|
13
16
|
* @param initialUserPreferences - The initial user preferences to use (optional)
|
|
17
|
+
* @example
|
|
14
18
|
*/
|
|
15
19
|
function UserPreferencesProvider(persistenceAPI, defaultPreferences) {
|
|
16
20
|
var _this$persistenceAPI$, _this$persistenceAPI;
|
|
@@ -28,6 +32,10 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
28
32
|
this.loadPreferences();
|
|
29
33
|
}
|
|
30
34
|
}
|
|
35
|
+
|
|
36
|
+
/**
|
|
37
|
+
*
|
|
38
|
+
*/
|
|
31
39
|
return _createClass(UserPreferencesProvider, [{
|
|
32
40
|
key: "isInitialized",
|
|
33
41
|
get: function get() {
|
|
@@ -38,6 +46,7 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
38
46
|
* This method fetches the latest user preferences
|
|
39
47
|
* @returns a promise that resolves with the user preferences, or rejects if error occurs
|
|
40
48
|
* @throws Error if there is an error loading user preferences
|
|
49
|
+
* @example
|
|
41
50
|
*/
|
|
42
51
|
}, {
|
|
43
52
|
key: "loadPreferences",
|
|
@@ -69,6 +78,7 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
69
78
|
* @param value
|
|
70
79
|
* @returns a promise that resolves when the user preference is updated
|
|
71
80
|
* @throws Error if there is an error updating user preferences
|
|
81
|
+
* @example
|
|
72
82
|
*/
|
|
73
83
|
)
|
|
74
84
|
}, {
|
|
@@ -99,6 +109,7 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
99
109
|
* get a user preference, Note that this function is a not async function,
|
|
100
110
|
* meaning that consumers should prefetch the user preference and make it available initially
|
|
101
111
|
* @param key
|
|
112
|
+
* @example
|
|
102
113
|
*/
|
|
103
114
|
)
|
|
104
115
|
}, {
|
|
@@ -109,6 +120,7 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
109
120
|
|
|
110
121
|
/**
|
|
111
122
|
* get all user preferences
|
|
123
|
+
* @example
|
|
112
124
|
*/
|
|
113
125
|
}, {
|
|
114
126
|
key: "getPreferences",
|
|
@@ -118,7 +130,9 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
118
130
|
|
|
119
131
|
/**
|
|
120
132
|
* This method fetches the latest user preferences
|
|
133
|
+
* @param onUpdate
|
|
121
134
|
* @returns a function to unsubscribe from the updates
|
|
135
|
+
* @example
|
|
122
136
|
*/
|
|
123
137
|
}, {
|
|
124
138
|
key: "onUpdate",
|
|
@@ -139,6 +153,7 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
139
153
|
* setting the default user preferences will also trigger an update
|
|
140
154
|
* This is useful when the default user preferences dynamically based on the context
|
|
141
155
|
* @param preferences
|
|
156
|
+
* @example
|
|
142
157
|
*/
|
|
143
158
|
}, {
|
|
144
159
|
key: "setDefaultPreferences",
|
|
@@ -161,6 +176,11 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
161
176
|
this.initialized = true;
|
|
162
177
|
}
|
|
163
178
|
}
|
|
179
|
+
|
|
180
|
+
/**
|
|
181
|
+
*
|
|
182
|
+
* @example
|
|
183
|
+
*/
|
|
164
184
|
}, {
|
|
165
185
|
key: "notifyUserPreferencesUpdated",
|
|
166
186
|
value: function notifyUserPreferencesUpdated() {
|
|
@@ -175,6 +195,7 @@ export var UserPreferencesProvider = /*#__PURE__*/function () {
|
|
|
175
195
|
* with the user preferences and filtering out any undefined or null values
|
|
176
196
|
* to avoid overwriting default preferences with null values
|
|
177
197
|
* @returns true if the user preferences were updated, false otherwise
|
|
198
|
+
* @example
|
|
178
199
|
*/
|
|
179
200
|
}, {
|
|
180
201
|
key: "resolveUserPreferences",
|
|
@@ -43,10 +43,20 @@ export var withImageLoaderOld = function withImageLoaderOld(Wrapped) {
|
|
|
43
43
|
_inherits(WithImageLoader, _Component);
|
|
44
44
|
return _createClass(WithImageLoader, [{
|
|
45
45
|
key: "componentDidMount",
|
|
46
|
-
value:
|
|
46
|
+
value:
|
|
47
|
+
/**
|
|
48
|
+
*
|
|
49
|
+
* @example
|
|
50
|
+
*/
|
|
51
|
+
function componentDidMount() {
|
|
47
52
|
this.fetchImage(this.props);
|
|
48
53
|
}
|
|
49
54
|
|
|
55
|
+
/**
|
|
56
|
+
*
|
|
57
|
+
* @param nextProps
|
|
58
|
+
* @example
|
|
59
|
+
*/
|
|
50
60
|
// Ignored via go/ees005
|
|
51
61
|
// eslint-disable-next-line react/no-unsafe
|
|
52
62
|
}, {
|
|
@@ -59,19 +69,33 @@ export var withImageLoaderOld = function withImageLoaderOld(Wrapped) {
|
|
|
59
69
|
this.fetchImage(nextProps);
|
|
60
70
|
}
|
|
61
71
|
}
|
|
72
|
+
|
|
73
|
+
/**
|
|
74
|
+
*
|
|
75
|
+
* @example
|
|
76
|
+
*/
|
|
62
77
|
}, {
|
|
63
78
|
key: "componentWillUnmount",
|
|
64
79
|
value: function componentWillUnmount() {
|
|
65
80
|
if (this.img) {
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
81
|
+
if (!process.env.REACT_SSR) {
|
|
82
|
+
// Ignored via go/ees005
|
|
83
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
84
|
+
this.img.removeEventListener('load', this.onLoad);
|
|
85
|
+
// Ignored via go/ees005
|
|
86
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
87
|
+
this.img.removeEventListener('error', this.onError);
|
|
88
|
+
this.img = null;
|
|
89
|
+
}
|
|
73
90
|
}
|
|
74
91
|
}
|
|
92
|
+
|
|
93
|
+
/**
|
|
94
|
+
*
|
|
95
|
+
* @param root0
|
|
96
|
+
* @param root0.url
|
|
97
|
+
* @example
|
|
98
|
+
*/
|
|
75
99
|
}, {
|
|
76
100
|
key: "fetchImage",
|
|
77
101
|
value: function fetchImage(_ref) {
|
|
@@ -79,19 +103,26 @@ export var withImageLoaderOld = function withImageLoaderOld(Wrapped) {
|
|
|
79
103
|
if (url) {
|
|
80
104
|
if (!this.img) {
|
|
81
105
|
this.img = new Image();
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
106
|
+
if (!process.env.REACT_SSR) {
|
|
107
|
+
// Ignored via go/ees005
|
|
108
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
109
|
+
this.img.addEventListener('load', this.onLoad);
|
|
110
|
+
// Ignored via go/ees005
|
|
111
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
112
|
+
this.img.addEventListener('error', this.onError);
|
|
113
|
+
}
|
|
88
114
|
}
|
|
89
115
|
this.img.src = url;
|
|
90
116
|
}
|
|
91
117
|
}
|
|
92
118
|
}, {
|
|
93
119
|
key: "render",
|
|
94
|
-
value:
|
|
120
|
+
value:
|
|
121
|
+
/**
|
|
122
|
+
*
|
|
123
|
+
* @example
|
|
124
|
+
*/
|
|
125
|
+
function render() {
|
|
95
126
|
var imageStatus = this.state.imageStatus;
|
|
96
127
|
// Ignored via go/ees005
|
|
97
128
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
@@ -153,12 +184,14 @@ var withImageLoaderNew = function withImageLoaderNew(Wrapped) {
|
|
|
153
184
|
key: "componentWillUnmount",
|
|
154
185
|
value: function componentWillUnmount() {
|
|
155
186
|
if (this.img) {
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
187
|
+
if (!process.env.REACT_SSR) {
|
|
188
|
+
// Ignored via go/ees005
|
|
189
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
190
|
+
this.img.removeEventListener('load', this.onLoad);
|
|
191
|
+
// Ignored via go/ees005
|
|
192
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
193
|
+
this.img.removeEventListener('error', this.onError);
|
|
194
|
+
}
|
|
162
195
|
this.img = null;
|
|
163
196
|
}
|
|
164
197
|
}
|
|
@@ -169,12 +202,14 @@ var withImageLoaderNew = function withImageLoaderNew(Wrapped) {
|
|
|
169
202
|
if (url) {
|
|
170
203
|
if (!this.img) {
|
|
171
204
|
this.img = new Image();
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
205
|
+
if (!process.env.REACT_SSR) {
|
|
206
|
+
// Ignored via go/ees005
|
|
207
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
208
|
+
this.img.addEventListener('load', this.onLoad);
|
|
209
|
+
// Ignored via go/ees005
|
|
210
|
+
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
|
|
211
|
+
this.img.addEventListener('error', this.onError);
|
|
212
|
+
}
|
|
178
213
|
}
|
|
179
214
|
this.img.src = url;
|
|
180
215
|
}
|