@getuserfeedback/react-native 3.0.90 → 3.0.92
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/dist/native-view-presentation-surface.js +19 -8
- package/dist/native-widget-frame-shadow-support.d.ts +16 -0
- package/dist/native-widget-frame-shadow-support.js +54 -0
- package/dist/provider-widget-host-overlay.d.ts +1 -14
- package/dist/provider-widget-host-overlay.js +2 -59
- package/dist/version.js +1 -1
- package/package.json +3 -3
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { createElement, } from "react";
|
|
2
2
|
import { toNativeWidgetCornerRadii } from "./native-widget-corner-radii.js";
|
|
3
3
|
import { toNativeWidgetResolvedBorderStyle } from "./native-widget-frame-border.js";
|
|
4
|
+
import { toNativeWidgetFrameShadow, toNativeWidgetSupportedBoxShadow, } from "./native-widget-frame-shadow.js";
|
|
5
|
+
import { resolveNativeWidgetBoxShadowSupport } from "./native-widget-frame-shadow-support.js";
|
|
4
6
|
const HOST_SURFACE_STYLE = {
|
|
5
7
|
alignItems: "center",
|
|
6
8
|
bottom: 0,
|
|
@@ -29,6 +31,9 @@ const PREPARING_VIEW_FRAME_STYLE = {
|
|
|
29
31
|
const PRESENTED_VIEW_FRAME_STYLE = {
|
|
30
32
|
maxHeight: "100%",
|
|
31
33
|
maxWidth: "100%",
|
|
34
|
+
};
|
|
35
|
+
const VIEW_FRAME_CONTENT_STYLE = {
|
|
36
|
+
flex: 1,
|
|
32
37
|
overflow: "hidden",
|
|
33
38
|
};
|
|
34
39
|
const VIEW_FRAME_BORDER_OVERLAY_STYLE = {
|
|
@@ -45,14 +50,17 @@ const resolveNativeView = () => {
|
|
|
45
50
|
}
|
|
46
51
|
return reactNativeModule.View;
|
|
47
52
|
};
|
|
48
|
-
// TODO(migration): Project shadow appearance onto Core-owned native frames before layering and scoped dismissal.
|
|
49
|
-
// [from=native-frame-border-shadow-projection] [to=native-frame-shadow-projection] [scope=slice] [principle=core-owned-flow-lifecycle] [priority=high] [impact=high] [risk=high] [epic=runtime-neutral-view-host-orchestration] [epic_order=189]
|
|
50
53
|
export function NativeViewPresentationSurface({ children, nativeViewComponent, record, }) {
|
|
51
|
-
var _a, _b, _c, _d, _e, _f;
|
|
54
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
52
55
|
const NativeView = nativeViewComponent !== null && nativeViewComponent !== void 0 ? nativeViewComponent : resolveNativeView();
|
|
53
56
|
const isPresented = record.activationState === "active" && record.size !== null;
|
|
54
57
|
const cornerRadii = toNativeWidgetCornerRadii((_a = record.size) === null || _a === void 0 ? void 0 : _a.frameAppearance);
|
|
55
|
-
const
|
|
58
|
+
const shadow = toNativeWidgetFrameShadow(((_c = (_b = record.size) === null || _b === void 0 ? void 0 : _b.frameAppearance) === null || _c === void 0 ? void 0 : _c.kind) === "page"
|
|
59
|
+
? record.size.frameAppearance.resolvedBoxShadow
|
|
60
|
+
: undefined);
|
|
61
|
+
const nativeBoxShadow = toNativeWidgetSupportedBoxShadow(shadow, resolveNativeWidgetBoxShadowSupport());
|
|
62
|
+
const frameOverlayShadowStyle = nativeBoxShadow === undefined ? {} : { boxShadow: nativeBoxShadow };
|
|
63
|
+
const borderStyle = toNativeWidgetResolvedBorderStyle(((_e = (_d = record.size) === null || _d === void 0 ? void 0 : _d.frameAppearance) === null || _e === void 0 ? void 0 : _e.kind) === "page"
|
|
56
64
|
? record.size.frameAppearance.resolvedBorder
|
|
57
65
|
: undefined);
|
|
58
66
|
const cornerRadiusStyle = {
|
|
@@ -63,7 +71,7 @@ export function NativeViewPresentationSurface({ children, nativeViewComponent, r
|
|
|
63
71
|
};
|
|
64
72
|
return createElement(NativeView, {
|
|
65
73
|
pointerEvents: isPresented ? "box-none" : "none",
|
|
66
|
-
style: Object.assign(Object.assign(Object.assign({}, HOST_SURFACE_STYLE), (((
|
|
74
|
+
style: Object.assign(Object.assign(Object.assign({}, HOST_SURFACE_STYLE), (((_f = record.size) === null || _f === void 0 ? void 0 : _f.placement) === "docked-top"
|
|
67
75
|
? TOP_PLACEMENT_STYLE
|
|
68
76
|
: BOTTOM_PLACEMENT_STYLE)), (isPresented
|
|
69
77
|
? PRESENTED_HOST_SURFACE_STYLE
|
|
@@ -72,11 +80,14 @@ export function NativeViewPresentationSurface({ children, nativeViewComponent, r
|
|
|
72
80
|
}, createElement(NativeView, {
|
|
73
81
|
pointerEvents: isPresented ? "auto" : "none",
|
|
74
82
|
style: isPresented
|
|
75
|
-
? Object.assign(Object.assign(Object.assign({}, PRESENTED_VIEW_FRAME_STYLE), cornerRadiusStyle), { height: (
|
|
83
|
+
? Object.assign(Object.assign(Object.assign({}, PRESENTED_VIEW_FRAME_STYLE), cornerRadiusStyle), { height: (_g = record.size) === null || _g === void 0 ? void 0 : _g.height, width: (_h = record.size) === null || _h === void 0 ? void 0 : _h.width }) : PREPARING_VIEW_FRAME_STYLE,
|
|
76
84
|
testID: `gx-native-view-frame-${record.viewId}`,
|
|
77
|
-
},
|
|
85
|
+
}, createElement(NativeView, {
|
|
86
|
+
style: Object.assign(Object.assign({}, VIEW_FRAME_CONTENT_STYLE), cornerRadiusStyle),
|
|
87
|
+
testID: `gx-native-view-frame-content-${record.viewId}`,
|
|
88
|
+
}, children), createElement(NativeView, {
|
|
78
89
|
pointerEvents: "none",
|
|
79
|
-
style: Object.assign(Object.assign(Object.assign({}, VIEW_FRAME_BORDER_OVERLAY_STYLE), cornerRadiusStyle), borderStyle),
|
|
90
|
+
style: Object.assign(Object.assign(Object.assign(Object.assign({}, VIEW_FRAME_BORDER_OVERLAY_STYLE), cornerRadiusStyle), borderStyle), frameOverlayShadowStyle),
|
|
80
91
|
testID: `gx-native-view-frame-border-${record.viewId}`,
|
|
81
92
|
})));
|
|
82
93
|
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { NativeWidgetBoxShadowSupport } from "./native-widget-frame-shadow.js";
|
|
2
|
+
type NativeReactVersion = {
|
|
3
|
+
major?: unknown;
|
|
4
|
+
minor?: unknown;
|
|
5
|
+
};
|
|
6
|
+
export type NativeWidgetBoxShadowSupportInput = {
|
|
7
|
+
hasFabricUIManager: boolean;
|
|
8
|
+
platform: {
|
|
9
|
+
os?: unknown;
|
|
10
|
+
version?: unknown;
|
|
11
|
+
};
|
|
12
|
+
reactNativeVersion?: NativeReactVersion;
|
|
13
|
+
};
|
|
14
|
+
export declare function toNativeWidgetBoxShadowSupport(input: NativeWidgetBoxShadowSupportInput): NativeWidgetBoxShadowSupport;
|
|
15
|
+
export declare function resolveNativeWidgetBoxShadowSupport(): NativeWidgetBoxShadowSupport;
|
|
16
|
+
export {};
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
export function toNativeWidgetBoxShadowSupport(input) {
|
|
2
|
+
var _a, _b;
|
|
3
|
+
if (!input.hasFabricUIManager) {
|
|
4
|
+
return "none";
|
|
5
|
+
}
|
|
6
|
+
const major = (_a = input.reactNativeVersion) === null || _a === void 0 ? void 0 : _a.major;
|
|
7
|
+
const minor = (_b = input.reactNativeVersion) === null || _b === void 0 ? void 0 : _b.minor;
|
|
8
|
+
const supportsBoxShadow = typeof major === "number" &&
|
|
9
|
+
Number.isInteger(major) &&
|
|
10
|
+
(major > 0 ||
|
|
11
|
+
(major === 0 &&
|
|
12
|
+
typeof minor === "number" &&
|
|
13
|
+
Number.isInteger(minor) &&
|
|
14
|
+
minor >= 76));
|
|
15
|
+
if (!supportsBoxShadow) {
|
|
16
|
+
return "none";
|
|
17
|
+
}
|
|
18
|
+
if (input.platform.os === "ios") {
|
|
19
|
+
return "all";
|
|
20
|
+
}
|
|
21
|
+
if (input.platform.os !== "android") {
|
|
22
|
+
return "none";
|
|
23
|
+
}
|
|
24
|
+
const androidApiLevel = input.platform.version;
|
|
25
|
+
if (typeof androidApiLevel !== "number" ||
|
|
26
|
+
!Number.isInteger(androidApiLevel)) {
|
|
27
|
+
return "none";
|
|
28
|
+
}
|
|
29
|
+
return androidApiLevel >= 29
|
|
30
|
+
? "all"
|
|
31
|
+
: androidApiLevel >= 28
|
|
32
|
+
? "outset"
|
|
33
|
+
: "none";
|
|
34
|
+
}
|
|
35
|
+
export function resolveNativeWidgetBoxShadowSupport() {
|
|
36
|
+
var _a, _b, _c, _d;
|
|
37
|
+
try {
|
|
38
|
+
const reactNativeModule = require("react-native");
|
|
39
|
+
// React Native exposes renderer capability to JavaScript process-wide.
|
|
40
|
+
// There is no stable public API for querying the renderer of one View.
|
|
41
|
+
const fabricUIManager = Reflect.get(globalThis, "nativeFabricUIManager");
|
|
42
|
+
return toNativeWidgetBoxShadowSupport({
|
|
43
|
+
hasFabricUIManager: fabricUIManager !== undefined && fabricUIManager !== null,
|
|
44
|
+
platform: {
|
|
45
|
+
os: (_a = reactNativeModule.Platform) === null || _a === void 0 ? void 0 : _a.OS,
|
|
46
|
+
version: (_b = reactNativeModule.Platform) === null || _b === void 0 ? void 0 : _b.Version,
|
|
47
|
+
},
|
|
48
|
+
reactNativeVersion: (_d = (_c = reactNativeModule.Platform) === null || _c === void 0 ? void 0 : _c.constants) === null || _d === void 0 ? void 0 : _d.reactNativeVersion,
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
catch (_e) {
|
|
52
|
+
return "none";
|
|
53
|
+
}
|
|
54
|
+
}
|
|
@@ -3,11 +3,6 @@ import { type ComponentType, type ReactElement, type ReactNode } from "react";
|
|
|
3
3
|
import { type NativeWidgetBoxShadowSupport } from "./native-widget-frame-shadow.js";
|
|
4
4
|
import type { WidgetHostProps } from "./widget-host.js";
|
|
5
5
|
type NativeViewComponent = ComponentType<Record<string, unknown>>;
|
|
6
|
-
type NativeReactVersion = {
|
|
7
|
-
major?: unknown;
|
|
8
|
-
minor?: unknown;
|
|
9
|
-
};
|
|
10
|
-
export type ProviderWidgetNativeBoxShadowSupport = NativeWidgetBoxShadowSupport;
|
|
11
6
|
export declare function toProviderWidgetResumedTransitionTiming(input: {
|
|
12
7
|
durationMs: number;
|
|
13
8
|
easing: readonly [number, number, number, number];
|
|
@@ -18,14 +13,6 @@ export declare function toProviderWidgetResumedTransitionTiming(input: {
|
|
|
18
13
|
easing: (remainingProgress: number) => number;
|
|
19
14
|
initialProgress: number;
|
|
20
15
|
};
|
|
21
|
-
export declare function toProviderWidgetNativeBoxShadowSupport(input: {
|
|
22
|
-
hasFabricUIManager: boolean;
|
|
23
|
-
platform: {
|
|
24
|
-
os?: unknown;
|
|
25
|
-
version?: unknown;
|
|
26
|
-
};
|
|
27
|
-
reactNativeVersion?: NativeReactVersion;
|
|
28
|
-
}): ProviderWidgetNativeBoxShadowSupport;
|
|
29
16
|
export declare function toProviderWidgetSheetHostViewport(viewport: WidgetHostProps["hostViewport"], flowSize?: {
|
|
30
17
|
height?: number;
|
|
31
18
|
}): WidgetHostProps["hostViewport"];
|
|
@@ -52,7 +39,7 @@ export declare function toProviderWidgetSheetSurfaceStyles(input: {
|
|
|
52
39
|
frameAppearance?: WidgetFrameAppearance;
|
|
53
40
|
isVisible: boolean;
|
|
54
41
|
sheetHostLayoutUpdate: WidgetLayoutComparableSizeUpdate | undefined;
|
|
55
|
-
nativeBoxShadowSupport?:
|
|
42
|
+
nativeBoxShadowSupport?: NativeWidgetBoxShadowSupport;
|
|
56
43
|
}): {
|
|
57
44
|
contentStyle: Record<string, unknown>;
|
|
58
45
|
frameStyle: Record<string, unknown>;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { areWidgetFrameAppearancesEqual, planWidgetLayoutTransition, resolveWidgetLayoutResumedEasing, resolveWidgetLayoutTransitionExecution, toInstantWidgetLayoutSizeUpdate, } from "@getuserfeedback/protocol/host";
|
|
2
2
|
import { createElement, useCallback, useEffect, useMemo, useRef, useState, } from "react";
|
|
3
3
|
import { toNativeWidgetSupportedBoxShadow, } from "./native-widget-frame-shadow.js";
|
|
4
|
+
import { resolveNativeWidgetBoxShadowSupport } from "./native-widget-frame-shadow-support.js";
|
|
4
5
|
import { toProviderWidgetFrameAppearance } from "./provider-widget-frame-appearance.js";
|
|
5
6
|
const HIDDEN_WIDGET_HOST_STYLE = {
|
|
6
7
|
bottom: 0,
|
|
@@ -153,64 +154,6 @@ export function toProviderWidgetResumedTransitionTiming(input) {
|
|
|
153
154
|
initialProgress,
|
|
154
155
|
};
|
|
155
156
|
}
|
|
156
|
-
export function toProviderWidgetNativeBoxShadowSupport(input) {
|
|
157
|
-
var _a, _b;
|
|
158
|
-
if (!input.hasFabricUIManager) {
|
|
159
|
-
return "none";
|
|
160
|
-
}
|
|
161
|
-
const major = (_a = input.reactNativeVersion) === null || _a === void 0 ? void 0 : _a.major;
|
|
162
|
-
const minor = (_b = input.reactNativeVersion) === null || _b === void 0 ? void 0 : _b.minor;
|
|
163
|
-
const supportsBoxShadow = typeof major === "number" &&
|
|
164
|
-
Number.isInteger(major) &&
|
|
165
|
-
(major > 0 ||
|
|
166
|
-
(major === 0 &&
|
|
167
|
-
typeof minor === "number" &&
|
|
168
|
-
Number.isInteger(minor) &&
|
|
169
|
-
minor >= 76));
|
|
170
|
-
if (!supportsBoxShadow) {
|
|
171
|
-
return "none";
|
|
172
|
-
}
|
|
173
|
-
if (input.platform.os === "ios") {
|
|
174
|
-
return "all";
|
|
175
|
-
}
|
|
176
|
-
if (input.platform.os !== "android") {
|
|
177
|
-
return "none";
|
|
178
|
-
}
|
|
179
|
-
const androidApiLevel = input.platform.version;
|
|
180
|
-
if (typeof androidApiLevel !== "number" ||
|
|
181
|
-
!Number.isInteger(androidApiLevel)) {
|
|
182
|
-
return "none";
|
|
183
|
-
}
|
|
184
|
-
return androidApiLevel >= 29
|
|
185
|
-
? "all"
|
|
186
|
-
: androidApiLevel >= 28
|
|
187
|
-
? "outset"
|
|
188
|
-
: "none";
|
|
189
|
-
}
|
|
190
|
-
function resolveNativeBoxShadowSupport() {
|
|
191
|
-
var _a, _b, _c, _d;
|
|
192
|
-
try {
|
|
193
|
-
const reactNativeModule = require("react-native");
|
|
194
|
-
// React Native exposes renderer capability to JavaScript process-wide.
|
|
195
|
-
// There is no stable public API for querying the renderer of this View.
|
|
196
|
-
// TODO(architecture): Extract native box-shadow capability detection to
|
|
197
|
-
// native-widget-frame-shadow-support once the overlay diff fits the small-PR
|
|
198
|
-
// production line gate. [principle=architecture-gardening] [scope=slice]
|
|
199
|
-
// [priority=medium]
|
|
200
|
-
const fabricUIManager = Reflect.get(globalThis, "nativeFabricUIManager");
|
|
201
|
-
return toProviderWidgetNativeBoxShadowSupport({
|
|
202
|
-
hasFabricUIManager: fabricUIManager !== undefined && fabricUIManager !== null,
|
|
203
|
-
platform: {
|
|
204
|
-
os: (_a = reactNativeModule.Platform) === null || _a === void 0 ? void 0 : _a.OS,
|
|
205
|
-
version: (_b = reactNativeModule.Platform) === null || _b === void 0 ? void 0 : _b.Version,
|
|
206
|
-
},
|
|
207
|
-
reactNativeVersion: (_d = (_c = reactNativeModule.Platform) === null || _c === void 0 ? void 0 : _c.constants) === null || _d === void 0 ? void 0 : _d.reactNativeVersion,
|
|
208
|
-
});
|
|
209
|
-
}
|
|
210
|
-
catch (_e) {
|
|
211
|
-
return "none";
|
|
212
|
-
}
|
|
213
|
-
}
|
|
214
157
|
function toResponderPageY(event) {
|
|
215
158
|
var _a, _b, _c;
|
|
216
159
|
const nativeEvent = event === null || event === void 0 ? void 0 : event.nativeEvent;
|
|
@@ -624,7 +567,7 @@ export function ProviderWidgetHostOverlay({ children, frameAppearance, isVisible
|
|
|
624
567
|
const sheetHostViewport = sheetHostLayoutUpdate === null || sheetHostLayoutUpdate === void 0 ? void 0 : sheetHostLayoutUpdate.size;
|
|
625
568
|
const isSheetVisible = isVisible && sheetHostViewport !== undefined;
|
|
626
569
|
const pointerEvents = isSheetVisible ? "auto" : "none";
|
|
627
|
-
const nativeBoxShadowSupport = useMemo(
|
|
570
|
+
const nativeBoxShadowSupport = useMemo(resolveNativeWidgetBoxShadowSupport, []);
|
|
628
571
|
const surfaceStyles = useMemo(() => toProviderWidgetSheetSurfaceStyles({
|
|
629
572
|
frameAppearance,
|
|
630
573
|
isVisible,
|
package/dist/version.js
CHANGED
|
@@ -3,4 +3,4 @@ const reactNativeSdkVersion = typeof __GX_REACT_NATIVE_SDK_VERSION__ === "string
|
|
|
3
3
|
: "";
|
|
4
4
|
// Build scripts patch this fallback to the package version for published artifacts.
|
|
5
5
|
// Source-linked workspace usage keeps the local fallback.
|
|
6
|
-
export const REACT_NATIVE_SDK_VERSION = reactNativeSdkVersion.length > 0 ? reactNativeSdkVersion : "3.0.
|
|
6
|
+
export const REACT_NATIVE_SDK_VERSION = reactNativeSdkVersion.length > 0 ? reactNativeSdkVersion : "3.0.92";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@getuserfeedback/react-native",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.92",
|
|
4
4
|
"description": "getuserfeedback React Native SDK",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"getuserfeedback",
|
|
@@ -44,8 +44,8 @@
|
|
|
44
44
|
"lint": "biome check ."
|
|
45
45
|
},
|
|
46
46
|
"dependencies": {
|
|
47
|
-
"@getuserfeedback/protocol": "^3.21.
|
|
48
|
-
"@getuserfeedback/sdk": "^0.12.
|
|
47
|
+
"@getuserfeedback/protocol": "^3.21.1",
|
|
48
|
+
"@getuserfeedback/sdk": "^0.12.7",
|
|
49
49
|
"robot3": "^1.2.0"
|
|
50
50
|
},
|
|
51
51
|
"peerDependencies": {
|