@atlaskit/react-ufo 4.15.3 → 4.15.5
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 +16 -0
- package/dist/cjs/segment/segment.js +10 -1
- package/dist/cjs/segment/ssr-render-profiler.js +79 -0
- package/dist/cjs/vc/vc-observer/observers/ssr-placeholders/index.js +7 -0
- package/dist/cjs/vc/vc-observer-new/metric-calculator/vcnext/index.js +4 -1
- package/dist/cjs/vc/vc-observer-new/viewport-observer/index.js +290 -191
- package/dist/cjs/vc/vc-observer-new/viewport-observer/intersection-observer/index.js +45 -2
- package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/get-mutated-elements.js +15 -4
- package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/is-zero-dimension-rectangle.js +9 -0
- package/dist/es2019/segment/segment.js +10 -1
- package/dist/es2019/segment/ssr-render-profiler.js +68 -0
- package/dist/es2019/vc/vc-observer/observers/ssr-placeholders/index.js +5 -0
- package/dist/es2019/vc/vc-observer-new/metric-calculator/vcnext/index.js +4 -1
- package/dist/es2019/vc/vc-observer-new/viewport-observer/index.js +158 -81
- package/dist/es2019/vc/vc-observer-new/viewport-observer/intersection-observer/index.js +33 -2
- package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/get-mutated-elements.js +15 -4
- package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/is-zero-dimension-rectangle.js +3 -0
- package/dist/esm/segment/segment.js +10 -1
- package/dist/esm/segment/ssr-render-profiler.js +72 -0
- package/dist/esm/vc/vc-observer/observers/ssr-placeholders/index.js +7 -0
- package/dist/esm/vc/vc-observer-new/metric-calculator/vcnext/index.js +4 -1
- package/dist/esm/vc/vc-observer-new/viewport-observer/index.js +288 -189
- package/dist/esm/vc/vc-observer-new/viewport-observer/intersection-observer/index.js +45 -2
- package/dist/esm/vc/vc-observer-new/viewport-observer/utils/get-mutated-elements.js +15 -4
- package/dist/esm/vc/vc-observer-new/viewport-observer/utils/is-zero-dimension-rectangle.js +3 -0
- package/dist/types/segment/ssr-render-profiler.d.ts +9 -0
- package/dist/types/vc/vc-observer/observers/ssr-placeholders/index.d.ts +1 -0
- package/dist/types/vc/vc-observer-new/types.d.ts +1 -1
- package/dist/types/vc/vc-observer-new/viewport-observer/utils/is-zero-dimension-rectangle.d.ts +1 -0
- package/dist/types-ts4.5/segment/ssr-render-profiler.d.ts +9 -0
- package/dist/types-ts4.5/vc/vc-observer/observers/ssr-placeholders/index.d.ts +1 -0
- package/dist/types-ts4.5/vc/vc-observer-new/types.d.ts +1 -1
- package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/is-zero-dimension-rectangle.d.ts +1 -0
- package/package.json +10 -1
|
@@ -3,9 +3,21 @@ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol
|
|
|
3
3
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
4
4
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
5
5
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
|
+
function isElementStyledWithDisplayContents(element) {
|
|
7
|
+
var _window2;
|
|
8
|
+
// To minimise calling `getComputedStyle`, we are making an assumption that if an element is from the Entrypoints framework, then it will have `display: contents` styling
|
|
9
|
+
// as per https://bitbucket.org/atlassian/atlassian-frontend-monorepo/src/e4ccf437262ef4c0fd3c651ffb7ad4770b15aed4/jira/src/packages/platform/entry-points/entry-point-placeholder/src/index.tsx#lines-136
|
|
10
|
+
if (fg('platform_ufo_detect_entrypoint_parent')) {
|
|
11
|
+
var _window;
|
|
12
|
+
if (element.hasAttribute('data-ep-placeholder-id')) {
|
|
13
|
+
return true;
|
|
14
|
+
}
|
|
15
|
+
return ((_window = window) === null || _window === void 0 || (_window = _window.getComputedStyle(element)) === null || _window === void 0 ? void 0 : _window.display) === 'contents';
|
|
16
|
+
}
|
|
17
|
+
return ((_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.getComputedStyle(element)) === null || _window2 === void 0 ? void 0 : _window2.display) === 'contents';
|
|
18
|
+
}
|
|
6
19
|
var MAX_NESTED_LEVELS_OF_DISPLAY_CONTENT_ELEMENTS_HANDLED = 3;
|
|
7
20
|
export function getMutatedElements(element) {
|
|
8
|
-
var _window;
|
|
9
21
|
var depthLevel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
10
22
|
if (fg('platform_ufo_disable_vcnext_observations')) {
|
|
11
23
|
return [{
|
|
@@ -13,16 +25,15 @@ export function getMutatedElements(element) {
|
|
|
13
25
|
isDisplayContentsElementChildren: false
|
|
14
26
|
}];
|
|
15
27
|
}
|
|
16
|
-
if ((
|
|
28
|
+
if (isElementStyledWithDisplayContents(element)) {
|
|
17
29
|
var mutatedElements = [];
|
|
18
30
|
var nestedDisplayContentsElementChildren = [];
|
|
19
31
|
var _iterator = _createForOfIteratorHelper(element.children),
|
|
20
32
|
_step;
|
|
21
33
|
try {
|
|
22
34
|
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
23
|
-
var _window2;
|
|
24
35
|
var child = _step.value;
|
|
25
|
-
if ((
|
|
36
|
+
if (isElementStyledWithDisplayContents(child)) {
|
|
26
37
|
nestedDisplayContentsElementChildren.push(child);
|
|
27
38
|
}
|
|
28
39
|
mutatedElements.push({
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React, { type ReactNode } from 'react';
|
|
2
|
+
import type { EnhancedUFOInteractionContextType, ReactProfilerTiming } from '../common';
|
|
3
|
+
export declare const SsrRenderProfilerInner: ({ children, labelStack, onRender, }: {
|
|
4
|
+
children?: ReactNode | undefined;
|
|
5
|
+
labelStack: ReactProfilerTiming["labelStack"];
|
|
6
|
+
onRender: EnhancedUFOInteractionContextType["onRender"];
|
|
7
|
+
}) => React.JSX.Element;
|
|
8
|
+
declare const SsrRenderProfiler: (props: Parameters<typeof SsrRenderProfilerInner>[0]) => React.JSX.Element;
|
|
9
|
+
export default SsrRenderProfiler;
|
|
@@ -33,6 +33,7 @@ export declare class SSRPlaceholderHandlers {
|
|
|
33
33
|
checkIfExistedAndSizeMatchingV3(el: HTMLElement): boolean;
|
|
34
34
|
getSize(el: HTMLElement): Promise<Rect>;
|
|
35
35
|
validateReactComponentMatchToPlaceholder(el: HTMLElement): Promise<boolean>;
|
|
36
|
+
validateReactComponentMatchToPlaceholderV4(el: HTMLElement): boolean;
|
|
36
37
|
hasSameSizePosition(rect: Rect | undefined, boundingClientRect: DOMRectReadOnly): boolean;
|
|
37
38
|
/**
|
|
38
39
|
* Gets the effective bounding rectangle for an element, handling display: contents elements
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { AbortReasonType, InteractionType } from '../../common/common/types';
|
|
2
2
|
import type { ObservedWindowEvent } from './window-event-observer';
|
|
3
|
-
export type VCObserverEntryType = 'mutation:child-element' | 'mutation:remount' | 'mutation:element' | 'mutation:element-replacement' | 'mutation:display-contents-children-element' | 'mutation:attribute:no-layout-shift' | 'mutation:attribute:non-visual-style' | 'mutation:attribute' | 'mutation:media' | 'mutation:rll-placeholder' | 'mutation:third-party-element' | 'mutation:third-party-attribute' | 'mutation:ssr-placeholder' | 'layout-shift' | 'layout-shift:same-rect' | 'window:event' | 'ssr-hydration' | 'unknown';
|
|
3
|
+
export type VCObserverEntryType = 'mutation:child-element' | 'mutation:remount' | 'mutation:element' | 'mutation:element-replacement' | 'mutation:display-contents-children-element' | 'mutation:display-contents-children-attribute' | 'mutation:attribute:no-layout-shift' | 'mutation:attribute:non-visual-style' | 'mutation:attribute' | 'mutation:media' | 'mutation:rll-placeholder' | 'mutation:third-party-element' | 'mutation:third-party-attribute' | 'mutation:ssr-placeholder' | 'layout-shift' | 'layout-shift:same-rect' | 'window:event' | 'ssr-hydration' | 'unknown';
|
|
4
4
|
export type ViewportEntryData = {
|
|
5
5
|
readonly type: VCObserverEntryType;
|
|
6
6
|
readonly elementName: string;
|
package/dist/types/vc/vc-observer-new/viewport-observer/utils/is-zero-dimension-rectangle.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function isZeroDimensionRectangle(rect: DOMRectReadOnly): boolean;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React, { type ReactNode } from 'react';
|
|
2
|
+
import type { EnhancedUFOInteractionContextType, ReactProfilerTiming } from '../common';
|
|
3
|
+
export declare const SsrRenderProfilerInner: ({ children, labelStack, onRender, }: {
|
|
4
|
+
children?: ReactNode | undefined;
|
|
5
|
+
labelStack: ReactProfilerTiming["labelStack"];
|
|
6
|
+
onRender: EnhancedUFOInteractionContextType["onRender"];
|
|
7
|
+
}) => React.JSX.Element;
|
|
8
|
+
declare const SsrRenderProfiler: (props: Parameters<typeof SsrRenderProfilerInner>[0]) => React.JSX.Element;
|
|
9
|
+
export default SsrRenderProfiler;
|
|
@@ -33,6 +33,7 @@ export declare class SSRPlaceholderHandlers {
|
|
|
33
33
|
checkIfExistedAndSizeMatchingV3(el: HTMLElement): boolean;
|
|
34
34
|
getSize(el: HTMLElement): Promise<Rect>;
|
|
35
35
|
validateReactComponentMatchToPlaceholder(el: HTMLElement): Promise<boolean>;
|
|
36
|
+
validateReactComponentMatchToPlaceholderV4(el: HTMLElement): boolean;
|
|
36
37
|
hasSameSizePosition(rect: Rect | undefined, boundingClientRect: DOMRectReadOnly): boolean;
|
|
37
38
|
/**
|
|
38
39
|
* Gets the effective bounding rectangle for an element, handling display: contents elements
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { AbortReasonType, InteractionType } from '../../common/common/types';
|
|
2
2
|
import type { ObservedWindowEvent } from './window-event-observer';
|
|
3
|
-
export type VCObserverEntryType = 'mutation:child-element' | 'mutation:remount' | 'mutation:element' | 'mutation:element-replacement' | 'mutation:display-contents-children-element' | 'mutation:attribute:no-layout-shift' | 'mutation:attribute:non-visual-style' | 'mutation:attribute' | 'mutation:media' | 'mutation:rll-placeholder' | 'mutation:third-party-element' | 'mutation:third-party-attribute' | 'mutation:ssr-placeholder' | 'layout-shift' | 'layout-shift:same-rect' | 'window:event' | 'ssr-hydration' | 'unknown';
|
|
3
|
+
export type VCObserverEntryType = 'mutation:child-element' | 'mutation:remount' | 'mutation:element' | 'mutation:element-replacement' | 'mutation:display-contents-children-element' | 'mutation:display-contents-children-attribute' | 'mutation:attribute:no-layout-shift' | 'mutation:attribute:non-visual-style' | 'mutation:attribute' | 'mutation:media' | 'mutation:rll-placeholder' | 'mutation:third-party-element' | 'mutation:third-party-attribute' | 'mutation:ssr-placeholder' | 'layout-shift' | 'layout-shift:same-rect' | 'window:event' | 'ssr-hydration' | 'unknown';
|
|
4
4
|
export type ViewportEntryData = {
|
|
5
5
|
readonly type: VCObserverEntryType;
|
|
6
6
|
readonly elementName: string;
|
package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/is-zero-dimension-rectangle.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function isZeroDimensionRectangle(rect: DOMRectReadOnly): boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/react-ufo",
|
|
3
|
-
"version": "4.15.
|
|
3
|
+
"version": "4.15.5",
|
|
4
4
|
"description": "Parts of React UFO that are publicly available",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -92,6 +92,9 @@
|
|
|
92
92
|
"platform_ufo_remove_deprecated_config_fields": {
|
|
93
93
|
"type": "boolean"
|
|
94
94
|
},
|
|
95
|
+
"platform_ufo_detect_entrypoint_parent": {
|
|
96
|
+
"type": "boolean"
|
|
97
|
+
},
|
|
95
98
|
"enable_ufo_devtools_api_for_extra_events": {
|
|
96
99
|
"type": "boolean"
|
|
97
100
|
},
|
|
@@ -149,6 +152,9 @@
|
|
|
149
152
|
"platform_editor_exclude_dnd_anchor_name_from_ttvc": {
|
|
150
153
|
"type": "boolean"
|
|
151
154
|
},
|
|
155
|
+
"platform_ufo_ssr_render_profiler": {
|
|
156
|
+
"type": "boolean"
|
|
157
|
+
},
|
|
152
158
|
"platform_ufo_enable_finish_interaction_transition": {
|
|
153
159
|
"type": "boolean"
|
|
154
160
|
},
|
|
@@ -179,6 +185,9 @@
|
|
|
179
185
|
"platform_ufo_enable_vc_raw_data": {
|
|
180
186
|
"type": "boolean"
|
|
181
187
|
},
|
|
188
|
+
"platform_ufo_detect_zero_dimension_rectangles": {
|
|
189
|
+
"type": "boolean"
|
|
190
|
+
},
|
|
182
191
|
"platform_mark_ufo_segment_first_load": {
|
|
183
192
|
"type": "boolean"
|
|
184
193
|
}
|