@onekeyfe/react-native-native-sheet 3.0.129 → 3.0.131
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/NativeSheet.podspec +1 -0
- package/README.md +41 -8
- package/android/src/main/java/com/onekey/nativesheet/NativeSheetView.kt +610 -41
- package/ios/NativeSheetContainerView.swift +355 -46
- package/lib/module/NativeSheetHeight.js +43 -0
- package/lib/module/NativeSheetHeight.js.map +1 -0
- package/lib/module/NativeSheetRegistry.js +181 -0
- package/lib/module/NativeSheetRegistry.js.map +1 -0
- package/lib/module/index.js +180 -21
- package/lib/module/index.js.map +1 -1
- package/lib/typescript/src/NativeSheetHeight.d.ts +20 -0
- package/lib/typescript/src/NativeSheetHeight.d.ts.map +1 -0
- package/lib/typescript/src/NativeSheetRegistry.d.ts +22 -0
- package/lib/typescript/src/NativeSheetRegistry.d.ts.map +1 -0
- package/lib/typescript/src/index.d.ts +38 -12
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/NativeSheetHeight.ts +66 -0
- package/src/NativeSheetRegistry.ts +210 -0
- package/src/index.tsx +294 -20
package/NativeSheet.podspec
CHANGED
package/README.md
CHANGED
|
@@ -6,12 +6,13 @@ Native owns the sheet body. No action-row or icon schema is required.
|
|
|
6
6
|
|
|
7
7
|
## Behavior
|
|
8
8
|
|
|
9
|
-
- iOS uses `UISheetPresentationController` with a
|
|
9
|
+
- iOS uses `UISheetPresentationController` with a custom detent.
|
|
10
10
|
- Android uses `BottomSheetDialog` and `BottomSheetBehavior`.
|
|
11
11
|
- Multiple sheets form a native presentation stack. Closing a lower sheet also
|
|
12
12
|
closes its descendants in top-to-bottom order.
|
|
13
|
-
- `height`
|
|
14
|
-
|
|
13
|
+
- Explicit `height` changes and settled auto-content measurements animate the
|
|
14
|
+
native surface with its bottom edge fixed. Growth moves the top edge upward;
|
|
15
|
+
shrinkage moves it downward. Both directions remain clamped by `maxHeight`.
|
|
15
16
|
- `NativeSheetSecurityProvider` force-dismisses descendant sheets without an
|
|
16
17
|
animation while the app lock is active, so native windows never cover the
|
|
17
18
|
security surface.
|
|
@@ -21,6 +22,7 @@ Native owns the sheet body. No action-row or icon schema is required.
|
|
|
21
22
|
```tsx
|
|
22
23
|
import {
|
|
23
24
|
NativeSheet,
|
|
25
|
+
NativeSheetHost,
|
|
24
26
|
NativeSheetSecurityProvider,
|
|
25
27
|
} from '@onekeyfe/react-native-native-sheet';
|
|
26
28
|
|
|
@@ -28,28 +30,59 @@ function AppRoot({ isLocked, children }) {
|
|
|
28
30
|
return (
|
|
29
31
|
<NativeSheetSecurityProvider blocked={isLocked}>
|
|
30
32
|
{children}
|
|
33
|
+
<NativeSheetHost />
|
|
31
34
|
</NativeSheetSecurityProvider>
|
|
32
35
|
);
|
|
33
36
|
}
|
|
34
37
|
|
|
35
|
-
function RenameSheet({ open,
|
|
38
|
+
function RenameSheet({ open, onOpenChange }) {
|
|
36
39
|
return (
|
|
37
40
|
<NativeSheet
|
|
38
41
|
open={open}
|
|
42
|
+
onOpenChange={onOpenChange}
|
|
39
43
|
height={360}
|
|
40
44
|
backgroundColor="#fff"
|
|
41
|
-
|
|
45
|
+
dismissOnOverlayPress
|
|
42
46
|
>
|
|
43
47
|
{/* Any React Native subtree: form fields, lists, QR codes, WebViews, etc. */}
|
|
44
48
|
<RenameForm />
|
|
45
49
|
</NativeSheet>
|
|
46
50
|
);
|
|
47
51
|
}
|
|
52
|
+
|
|
53
|
+
function showScannerSheet() {
|
|
54
|
+
const handle = NativeSheet.show({
|
|
55
|
+
height: 480,
|
|
56
|
+
dismissOnOverlayPress: true,
|
|
57
|
+
renderContent: ({ close }) => <Scanner onDone={close} />,
|
|
58
|
+
});
|
|
59
|
+
return handle;
|
|
60
|
+
}
|
|
48
61
|
```
|
|
49
62
|
|
|
50
|
-
The caller owns `open` and
|
|
51
|
-
|
|
52
|
-
|
|
63
|
+
The caller owns `open` and should update it from `onOpenChange`. The interaction
|
|
64
|
+
names match the existing React Native Sheet API: `dismissOnOverlayPress` controls
|
|
65
|
+
overlay taps and `dismissOnSnapToBottom` controls drag dismissal. The legacy
|
|
66
|
+
`dismissOnBackdropPress` and `dismissOnPanDown` names remain as aliases.
|
|
67
|
+
|
|
68
|
+
The native backdrop fades with the platform presentation transition. Keyboard
|
|
69
|
+
avoidance is owned by `UISheetPresentationController` on iOS and the dialog
|
|
70
|
+
window's resize mode on Android; callers should not translate the sheet in JS.
|
|
71
|
+
Update `height` after asynchronously loaded content settles when the outer
|
|
72
|
+
surface needs more room. Keep scrolling content inside the current height when
|
|
73
|
+
the outer surface should remain fixed.
|
|
74
|
+
|
|
75
|
+
Mount one `NativeSheetHost` inside `NativeSheetSecurityProvider` at the app
|
|
76
|
+
root before calling `NativeSheet.show()`. The imperative call returns a handle
|
|
77
|
+
with `close()` and keeps its React subtree mounted until the native exit
|
|
78
|
+
transition completes. `onOpenChange`, `onDismiss`, and
|
|
79
|
+
`onAnimationComplete({ open })` are each delivered once per transition.
|
|
80
|
+
|
|
81
|
+
NativeSheet intentionally does not accept JavaScript-only Sheet props such as
|
|
82
|
+
`transition`, `transitionConfig`, `portalProps`, `zIndex`, or scroll-lock
|
|
83
|
+
options. Presentation order, transitions, overlay level, and keyboard avoidance
|
|
84
|
+
are platform-owned. Use `height` for a caller-controlled animated detent, or
|
|
85
|
+
omit it to keep measuring intrinsic React content while the sheet is open.
|
|
53
86
|
|
|
54
87
|
## License
|
|
55
88
|
|