@tamagui/sheet 2.1.0 → 2.2.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/.turbo/turbo-build.log +3 -2
- package/dist/cjs/GestureDetectorWrapper.native.js.map +1 -1
- package/dist/cjs/GestureSheetContext.native.js.map +1 -1
- package/dist/cjs/Sheet.native.js.map +1 -1
- package/dist/cjs/SheetContext.native.js.map +1 -1
- package/dist/cjs/SheetController.native.js.map +1 -1
- package/dist/cjs/SheetImplementationCustom.cjs +41 -64
- package/dist/cjs/SheetImplementationCustom.native.js +56 -69
- package/dist/cjs/SheetImplementationCustom.native.js.map +1 -1
- package/dist/cjs/SheetScrollView.cjs +57 -5
- package/dist/cjs/SheetScrollView.native.js +60 -5
- package/dist/cjs/SheetScrollView.native.js.map +1 -1
- package/dist/cjs/constants.native.js.map +1 -1
- package/dist/cjs/contexts.native.js.map +1 -1
- package/dist/cjs/controller.native.js.map +1 -1
- package/dist/cjs/createSheet.cjs +5 -2
- package/dist/cjs/createSheet.native.js +5 -2
- package/dist/cjs/createSheet.native.js.map +1 -1
- package/dist/cjs/gestureState.native.js.map +1 -1
- package/dist/cjs/helpers.native.js.map +1 -1
- package/dist/cjs/index.native.js.map +1 -1
- package/dist/cjs/keyboardAvoidance.cjs +52 -1
- package/dist/cjs/keyboardAvoidance.native.js +54 -1
- package/dist/cjs/keyboardAvoidance.native.js.map +1 -1
- package/dist/cjs/nativeSheet.cjs +0 -1
- package/dist/cjs/nativeSheet.native.js +0 -1
- package/dist/cjs/nativeSheet.native.js.map +1 -1
- package/dist/cjs/setupGestureHandler.native.js.map +1 -1
- package/dist/cjs/types.native.js.map +1 -1
- package/dist/cjs/useGestureHandlerPan.cjs +25 -10
- package/dist/cjs/useGestureHandlerPan.native.js +27 -10
- package/dist/cjs/useGestureHandlerPan.native.js.map +1 -1
- package/dist/cjs/useKeyboardControllerSheet.cjs +10 -4
- package/dist/cjs/useSafeAreaInsets.cjs +44 -0
- package/dist/cjs/useSafeAreaInsets.native.js +48 -0
- package/dist/cjs/useSafeAreaInsets.native.js.map +1 -0
- package/dist/cjs/useSheet.native.js.map +1 -1
- package/dist/cjs/useSheetController.native.js.map +1 -1
- package/dist/cjs/useSheetOffscreenSize.native.js.map +1 -1
- package/dist/cjs/useSheetOpenState.native.js.map +1 -1
- package/dist/cjs/useSheetProviderProps.native.js.map +1 -1
- package/dist/cjs/useSheetScrollViewGestures.cjs +12 -2
- package/dist/cjs/useSheetScrollViewGestures.native.js +4 -0
- package/dist/cjs/useSheetScrollViewGestures.native.js.map +1 -1
- package/dist/cjs/webViewport.cjs +26 -1
- package/dist/cjs/webViewport.native.js +28 -1
- package/dist/cjs/webViewport.native.js.map +1 -1
- package/dist/esm/SheetImplementationCustom.mjs +48 -73
- package/dist/esm/SheetImplementationCustom.mjs.map +1 -1
- package/dist/esm/SheetImplementationCustom.native.js +70 -89
- package/dist/esm/SheetImplementationCustom.native.js.map +1 -1
- package/dist/esm/SheetScrollView.mjs +58 -6
- package/dist/esm/SheetScrollView.mjs.map +1 -1
- package/dist/esm/SheetScrollView.native.js +61 -6
- package/dist/esm/SheetScrollView.native.js.map +1 -1
- package/dist/esm/createSheet.mjs +7 -5
- package/dist/esm/createSheet.mjs.map +1 -1
- package/dist/esm/createSheet.native.js +17 -14
- package/dist/esm/createSheet.native.js.map +1 -1
- package/dist/esm/keyboardAvoidance.mjs +50 -1
- package/dist/esm/keyboardAvoidance.mjs.map +1 -1
- package/dist/esm/keyboardAvoidance.native.js +52 -1
- package/dist/esm/keyboardAvoidance.native.js.map +1 -1
- package/dist/esm/nativeSheet.mjs +0 -1
- package/dist/esm/nativeSheet.mjs.map +1 -1
- package/dist/esm/nativeSheet.native.js +0 -1
- package/dist/esm/nativeSheet.native.js.map +1 -1
- package/dist/esm/useGestureHandlerPan.mjs +25 -10
- package/dist/esm/useGestureHandlerPan.mjs.map +1 -1
- package/dist/esm/useGestureHandlerPan.native.js +27 -10
- package/dist/esm/useGestureHandlerPan.native.js.map +1 -1
- package/dist/esm/useKeyboardControllerSheet.mjs +11 -5
- package/dist/esm/useKeyboardControllerSheet.mjs.map +1 -1
- package/dist/esm/useSafeAreaInsets.mjs +7 -0
- package/dist/esm/useSafeAreaInsets.mjs.map +1 -0
- package/dist/esm/useSafeAreaInsets.native.js +8 -0
- package/dist/esm/useSafeAreaInsets.native.js.map +1 -0
- package/dist/esm/useSheetProviderProps.mjs.map +1 -1
- package/dist/esm/useSheetProviderProps.native.js.map +1 -1
- package/dist/esm/useSheetScrollViewGestures.mjs +12 -2
- package/dist/esm/useSheetScrollViewGestures.mjs.map +1 -1
- package/dist/esm/useSheetScrollViewGestures.native.js +4 -0
- package/dist/esm/useSheetScrollViewGestures.native.js.map +1 -1
- package/dist/esm/webViewport.mjs +23 -2
- package/dist/esm/webViewport.mjs.map +1 -1
- package/dist/esm/webViewport.native.js +25 -2
- package/dist/esm/webViewport.native.js.map +1 -1
- package/dist/jsx/SheetImplementationCustom.mjs +48 -73
- package/dist/jsx/SheetImplementationCustom.mjs.map +1 -1
- package/dist/jsx/SheetImplementationCustom.native.js +56 -69
- package/dist/jsx/SheetImplementationCustom.native.js.map +1 -1
- package/dist/jsx/SheetScrollView.mjs +58 -6
- package/dist/jsx/SheetScrollView.mjs.map +1 -1
- package/dist/jsx/SheetScrollView.native.js +60 -5
- package/dist/jsx/SheetScrollView.native.js.map +1 -1
- package/dist/jsx/createSheet.mjs +7 -5
- package/dist/jsx/createSheet.mjs.map +1 -1
- package/dist/jsx/createSheet.native.js +5 -2
- package/dist/jsx/createSheet.native.js.map +1 -1
- package/dist/jsx/keyboardAvoidance.mjs +50 -1
- package/dist/jsx/keyboardAvoidance.mjs.map +1 -1
- package/dist/jsx/keyboardAvoidance.native.js +54 -1
- package/dist/jsx/keyboardAvoidance.native.js.map +1 -1
- package/dist/jsx/nativeSheet.mjs +0 -1
- package/dist/jsx/nativeSheet.mjs.map +1 -1
- package/dist/jsx/nativeSheet.native.js +0 -1
- package/dist/jsx/nativeSheet.native.js.map +1 -1
- package/dist/jsx/useGestureHandlerPan.mjs +25 -10
- package/dist/jsx/useGestureHandlerPan.mjs.map +1 -1
- package/dist/jsx/useGestureHandlerPan.native.js +27 -10
- package/dist/jsx/useGestureHandlerPan.native.js.map +1 -1
- package/dist/jsx/useKeyboardControllerSheet.mjs +11 -5
- package/dist/jsx/useKeyboardControllerSheet.mjs.map +1 -1
- package/dist/jsx/useSafeAreaInsets.mjs +7 -0
- package/dist/jsx/useSafeAreaInsets.mjs.map +1 -0
- package/dist/jsx/useSafeAreaInsets.native.js +48 -0
- package/dist/jsx/useSafeAreaInsets.native.js.map +1 -0
- package/dist/jsx/useSheetProviderProps.mjs.map +1 -1
- package/dist/jsx/useSheetProviderProps.native.js.map +1 -1
- package/dist/jsx/useSheetScrollViewGestures.mjs +12 -2
- package/dist/jsx/useSheetScrollViewGestures.mjs.map +1 -1
- package/dist/jsx/useSheetScrollViewGestures.native.js +4 -0
- package/dist/jsx/useSheetScrollViewGestures.native.js.map +1 -1
- package/dist/jsx/webViewport.mjs +23 -2
- package/dist/jsx/webViewport.mjs.map +1 -1
- package/dist/jsx/webViewport.native.js +28 -1
- package/dist/jsx/webViewport.native.js.map +1 -1
- package/package.json +24 -25
- package/src/SheetImplementationCustom.tsx +147 -212
- package/src/SheetScrollView.tsx +81 -21
- package/src/createSheet.tsx +18 -6
- package/src/keyboardAvoidance.ts +91 -0
- package/src/nativeSheet.tsx +0 -1
- package/src/useGestureHandlerPan.tsx +29 -12
- package/src/useKeyboardControllerSheet.ts +35 -14
- package/src/useSafeAreaInsets.native.ts +29 -0
- package/src/useSafeAreaInsets.ts +19 -0
- package/src/useSheetProviderProps.tsx +4 -10
- package/src/useSheetScrollViewGestures.native.ts +4 -0
- package/src/useSheetScrollViewGestures.ts +19 -8
- package/src/webViewport.ts +56 -8
- package/test/keyboardAvoidance.test.ts +218 -2
- package/types/SheetContext.d.ts +0 -1
- package/types/SheetContext.d.ts.map +1 -1
- package/types/SheetImplementationCustom.d.ts.map +1 -1
- package/types/SheetScrollView.d.ts.map +1 -1
- package/types/createSheet.d.ts +12 -12
- package/types/createSheet.d.ts.map +1 -1
- package/types/keyboardAvoidance.d.ts +18 -0
- package/types/keyboardAvoidance.d.ts.map +1 -1
- package/types/nativeSheet.d.ts.map +1 -1
- package/types/useGestureHandlerPan.d.ts +4 -1
- package/types/useGestureHandlerPan.d.ts.map +1 -1
- package/types/useKeyboardControllerSheet.d.ts +5 -5
- package/types/useKeyboardControllerSheet.d.ts.map +1 -1
- package/types/useSafeAreaInsets.d.ts +10 -0
- package/types/useSafeAreaInsets.d.ts.map +1 -0
- package/types/useSafeAreaInsets.native.d.ts +20 -0
- package/types/useSafeAreaInsets.native.d.ts.map +1 -0
- package/types/useSheetProviderProps.d.ts +0 -1
- package/types/useSheetProviderProps.d.ts.map +1 -1
- package/types/useSheetScrollViewGestures.d.ts.map +1 -1
- package/types/useSheetScrollViewGestures.native.d.ts.map +1 -1
- package/types/webViewport.d.ts +13 -7
- package/types/webViewport.d.ts.map +1 -1
package/src/webViewport.ts
CHANGED
|
@@ -8,11 +8,13 @@
|
|
|
8
8
|
* `document.documentElement.clientHeight` holds rock-steady at 714 the whole
|
|
9
9
|
* time (open, mid-keyboard, and close). So clientHeight IS the stable layout
|
|
10
10
|
* viewport, and we derive everything from it:
|
|
11
|
-
* -
|
|
12
|
-
* even as innerHeight drifts), so
|
|
13
|
-
* -
|
|
14
|
-
*
|
|
15
|
-
*
|
|
11
|
+
* - keyboard resize height = clientHeight - visualViewport.height (stays
|
|
12
|
+
* correct even as innerHeight drifts), so keyboard detection is stable.
|
|
13
|
+
* - keyboard bottom inset = clientHeight - (visualViewport.offsetTop +
|
|
14
|
+
* visualViewport.height), so Safari's focus pan doesn't over-lift the sheet.
|
|
15
|
+
* - the sheet's fit-mode position math reads clientHeight, so it never
|
|
16
|
+
* re-measures against a shrunk value; the frame can translate with the
|
|
17
|
+
* keyboard while keeping its natural fit height.
|
|
16
18
|
*/
|
|
17
19
|
|
|
18
20
|
// ignore small viewport changes (URL bar collapse, accessory bars) so they
|
|
@@ -41,12 +43,58 @@ export function getStableLayoutViewportHeight(): number {
|
|
|
41
43
|
}
|
|
42
44
|
|
|
43
45
|
/**
|
|
44
|
-
*
|
|
45
|
-
*
|
|
46
|
+
* the largest the visible viewport can ever become on this device.
|
|
47
|
+
*
|
|
48
|
+
* iOS Safari grows the visible area as its top/bottom chrome (URL bar, toolbar,
|
|
49
|
+
* the dynamic bottom safe area) retracts on scroll, so the current layout
|
|
50
|
+
* viewport — document.documentElement.clientHeight — is not an upper bound: the
|
|
51
|
+
* chrome can collapse and reveal area BELOW it. A sheet whose hidden/below-fold
|
|
52
|
+
* region is sized against the current viewport then peeks back into view as the
|
|
53
|
+
* page scrolls and Safari reveals more.
|
|
54
|
+
*
|
|
55
|
+
* So we track a session high-water mark across every measured viewport signal,
|
|
56
|
+
* floored at the device screen height, so we never under-shoot even before any
|
|
57
|
+
* chrome collapse has been observed. Used to push hidden/minimized sheet content
|
|
58
|
+
* fully past the maximum the viewport could ever expose.
|
|
46
59
|
*/
|
|
47
|
-
|
|
60
|
+
let _maxViewportHeight = 0
|
|
61
|
+
export function getMaxViewportHeight(): number {
|
|
62
|
+
if (typeof window === 'undefined') return 0
|
|
63
|
+
const ch = typeof document !== 'undefined' ? document.documentElement?.clientHeight : 0
|
|
64
|
+
_maxViewportHeight = Math.max(
|
|
65
|
+
_maxViewportHeight,
|
|
66
|
+
ch || 0,
|
|
67
|
+
window.innerHeight || 0,
|
|
68
|
+
window.visualViewport?.height || 0,
|
|
69
|
+
window.screen?.height || 0
|
|
70
|
+
)
|
|
71
|
+
return _maxViewportHeight
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
export function getWebKeyboardResizeHeight(): number {
|
|
48
75
|
if (typeof window === 'undefined') return 0
|
|
49
76
|
const vv = window.visualViewport
|
|
50
77
|
if (!vv) return 0
|
|
51
78
|
return Math.max(0, Math.round(getStableLayoutViewportHeight() - vv.height))
|
|
52
79
|
}
|
|
80
|
+
|
|
81
|
+
export function getWebVisualViewportOffsetTop(): number {
|
|
82
|
+
if (typeof window === 'undefined') return 0
|
|
83
|
+
return Math.max(0, Math.round(window.visualViewport?.offsetTop || 0))
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
/**
|
|
87
|
+
* bottom layout inset hidden below the visual viewport. When Safari pans the
|
|
88
|
+
* visual viewport during focus, offsetTop reduces the bottom-hidden area.
|
|
89
|
+
*/
|
|
90
|
+
export function getWebKeyboardBottomInset(): number {
|
|
91
|
+
if (typeof window === 'undefined') return 0
|
|
92
|
+
const vv = window.visualViewport
|
|
93
|
+
if (!vv) return 0
|
|
94
|
+
const visibleBottom = getWebVisualViewportOffsetTop() + vv.height
|
|
95
|
+
return Math.max(0, Math.round(getStableLayoutViewportHeight() - visibleBottom))
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
export function getWebKeyboardHeight(): number {
|
|
99
|
+
return getWebKeyboardResizeHeight()
|
|
100
|
+
}
|
|
@@ -1,6 +1,113 @@
|
|
|
1
|
-
import { describe, expect, test } from 'vitest'
|
|
1
|
+
import { afterEach, describe, expect, test } from 'vitest'
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import {
|
|
4
|
+
getKeyboardAdjustedSheetY,
|
|
5
|
+
getKeyboardOccludedHeight,
|
|
6
|
+
getSheetReleasePosition,
|
|
7
|
+
} from '../src/keyboardAvoidance'
|
|
8
|
+
import {
|
|
9
|
+
getWebKeyboardBottomInset,
|
|
10
|
+
getWebKeyboardResizeHeight,
|
|
11
|
+
getWebVisualViewportOffsetTop,
|
|
12
|
+
} from '../src/webViewport'
|
|
13
|
+
|
|
14
|
+
const originalWindow = globalThis.window
|
|
15
|
+
const originalDocument = globalThis.document
|
|
16
|
+
|
|
17
|
+
function setWebViewport({
|
|
18
|
+
clientHeight,
|
|
19
|
+
visualViewportHeight,
|
|
20
|
+
offsetTop = 0,
|
|
21
|
+
}: {
|
|
22
|
+
clientHeight: number
|
|
23
|
+
visualViewportHeight: number
|
|
24
|
+
offsetTop?: number
|
|
25
|
+
}) {
|
|
26
|
+
Object.defineProperty(globalThis, 'document', {
|
|
27
|
+
configurable: true,
|
|
28
|
+
value: {
|
|
29
|
+
documentElement: {
|
|
30
|
+
clientHeight,
|
|
31
|
+
},
|
|
32
|
+
},
|
|
33
|
+
})
|
|
34
|
+
Object.defineProperty(globalThis, 'window', {
|
|
35
|
+
configurable: true,
|
|
36
|
+
value: {
|
|
37
|
+
innerHeight: clientHeight,
|
|
38
|
+
visualViewport: {
|
|
39
|
+
height: visualViewportHeight,
|
|
40
|
+
offsetTop,
|
|
41
|
+
},
|
|
42
|
+
},
|
|
43
|
+
})
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
afterEach(() => {
|
|
47
|
+
Object.defineProperty(globalThis, 'window', {
|
|
48
|
+
configurable: true,
|
|
49
|
+
value: originalWindow,
|
|
50
|
+
})
|
|
51
|
+
Object.defineProperty(globalThis, 'document', {
|
|
52
|
+
configurable: true,
|
|
53
|
+
value: originalDocument,
|
|
54
|
+
})
|
|
55
|
+
})
|
|
56
|
+
|
|
57
|
+
describe('getKeyboardAdjustedSheetY', () => {
|
|
58
|
+
const base = {
|
|
59
|
+
sheetY: 320,
|
|
60
|
+
screenSize: 844,
|
|
61
|
+
isKeyboardVisible: true,
|
|
62
|
+
keyboardHeight: 300,
|
|
63
|
+
safeAreaTop: 44,
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
test('keeps the original position when translation is disabled', () => {
|
|
67
|
+
expect(
|
|
68
|
+
getKeyboardAdjustedSheetY({
|
|
69
|
+
...base,
|
|
70
|
+
shouldTranslate: false,
|
|
71
|
+
})
|
|
72
|
+
).toBe(base.sheetY)
|
|
73
|
+
})
|
|
74
|
+
|
|
75
|
+
test('shifts sheets up by keyboard height and caps at safe area', () => {
|
|
76
|
+
expect(
|
|
77
|
+
getKeyboardAdjustedSheetY({
|
|
78
|
+
...base,
|
|
79
|
+
shouldTranslate: true,
|
|
80
|
+
})
|
|
81
|
+
).toBe(44)
|
|
82
|
+
})
|
|
83
|
+
|
|
84
|
+
test('keeps a smaller fit sheet at its natural height and moves it with the keyboard', () => {
|
|
85
|
+
expect(
|
|
86
|
+
getKeyboardAdjustedSheetY({
|
|
87
|
+
...base,
|
|
88
|
+
sheetY: 500,
|
|
89
|
+
shouldTranslate: true,
|
|
90
|
+
})
|
|
91
|
+
).toBe(200)
|
|
92
|
+
})
|
|
93
|
+
|
|
94
|
+
test('does not shift hidden keyboard or offscreen close positions', () => {
|
|
95
|
+
expect(
|
|
96
|
+
getKeyboardAdjustedSheetY({
|
|
97
|
+
...base,
|
|
98
|
+
isKeyboardVisible: false,
|
|
99
|
+
shouldTranslate: true,
|
|
100
|
+
})
|
|
101
|
+
).toBe(base.sheetY)
|
|
102
|
+
expect(
|
|
103
|
+
getKeyboardAdjustedSheetY({
|
|
104
|
+
...base,
|
|
105
|
+
sheetY: base.screenSize,
|
|
106
|
+
shouldTranslate: true,
|
|
107
|
+
})
|
|
108
|
+
).toBe(base.screenSize)
|
|
109
|
+
})
|
|
110
|
+
})
|
|
4
111
|
|
|
5
112
|
describe('getKeyboardOccludedHeight', () => {
|
|
6
113
|
const base = {
|
|
@@ -51,3 +158,112 @@ describe('getKeyboardOccludedHeight', () => {
|
|
|
51
158
|
).toBe(120)
|
|
52
159
|
})
|
|
53
160
|
})
|
|
161
|
+
|
|
162
|
+
describe('getSheetReleasePosition', () => {
|
|
163
|
+
// WEB keyboard-fit-dismiss threshold (the 75de9c9694 web keyboard-handoff fix):
|
|
164
|
+
// when the keyboard is up, a fit+dismiss sheet only dismisses after enough
|
|
165
|
+
// ACTUAL travel, ignoring a velocity-projected short drag.
|
|
166
|
+
test('web: keeps a keyboard-fit sheet open when velocity projects a short drag to dismiss', () => {
|
|
167
|
+
expect(
|
|
168
|
+
getSheetReleasePosition({
|
|
169
|
+
positions: [0, 844],
|
|
170
|
+
projectedEnd: 480,
|
|
171
|
+
currentPosition: 150,
|
|
172
|
+
frameSize: 591,
|
|
173
|
+
dismissOnSnapToBottom: true,
|
|
174
|
+
snapPointsMode: 'fit',
|
|
175
|
+
isKeyboardVisible: true,
|
|
176
|
+
isWeb: true,
|
|
177
|
+
})
|
|
178
|
+
).toBe(0)
|
|
179
|
+
})
|
|
180
|
+
|
|
181
|
+
test('web: allows a keyboard-fit sheet to dismiss after enough actual travel', () => {
|
|
182
|
+
expect(
|
|
183
|
+
getSheetReleasePosition({
|
|
184
|
+
positions: [0, 844],
|
|
185
|
+
projectedEnd: 560,
|
|
186
|
+
currentPosition: 225,
|
|
187
|
+
frameSize: 591,
|
|
188
|
+
dismissOnSnapToBottom: true,
|
|
189
|
+
snapPointsMode: 'fit',
|
|
190
|
+
isKeyboardVisible: true,
|
|
191
|
+
isWeb: true,
|
|
192
|
+
})
|
|
193
|
+
).toBe(1)
|
|
194
|
+
})
|
|
195
|
+
|
|
196
|
+
// NATIVE must NOT apply the web threshold — it snaps purely by projected
|
|
197
|
+
// position (the pre-rework v2.1.0 behavior). regression guard: with the
|
|
198
|
+
// threshold leaking into native, this short-projected drag wrongly stayed open
|
|
199
|
+
// (0); native should snap to the nearest point (here: dismiss, index 1).
|
|
200
|
+
test('native: snaps a keyboard-fit sheet by projected position, ignoring the web threshold', () => {
|
|
201
|
+
expect(
|
|
202
|
+
getSheetReleasePosition({
|
|
203
|
+
positions: [0, 844],
|
|
204
|
+
projectedEnd: 480,
|
|
205
|
+
currentPosition: 150,
|
|
206
|
+
frameSize: 591,
|
|
207
|
+
dismissOnSnapToBottom: true,
|
|
208
|
+
snapPointsMode: 'fit',
|
|
209
|
+
isKeyboardVisible: true,
|
|
210
|
+
isWeb: false,
|
|
211
|
+
})
|
|
212
|
+
).toBe(1)
|
|
213
|
+
})
|
|
214
|
+
|
|
215
|
+
test('native: a projected-open drag snaps back open', () => {
|
|
216
|
+
expect(
|
|
217
|
+
getSheetReleasePosition({
|
|
218
|
+
positions: [0, 844],
|
|
219
|
+
projectedEnd: 200,
|
|
220
|
+
currentPosition: 300,
|
|
221
|
+
frameSize: 591,
|
|
222
|
+
dismissOnSnapToBottom: true,
|
|
223
|
+
snapPointsMode: 'fit',
|
|
224
|
+
isKeyboardVisible: true,
|
|
225
|
+
isWeb: false,
|
|
226
|
+
})
|
|
227
|
+
).toBe(0)
|
|
228
|
+
})
|
|
229
|
+
|
|
230
|
+
test('keeps normal multi-snap release behavior outside keyboard-fit dismiss', () => {
|
|
231
|
+
expect(
|
|
232
|
+
getSheetReleasePosition({
|
|
233
|
+
positions: [0, 360, 844],
|
|
234
|
+
projectedEnd: 310,
|
|
235
|
+
currentPosition: 90,
|
|
236
|
+
frameSize: 591,
|
|
237
|
+
dismissOnSnapToBottom: true,
|
|
238
|
+
snapPointsMode: 'percent',
|
|
239
|
+
isKeyboardVisible: true,
|
|
240
|
+
isWeb: true,
|
|
241
|
+
})
|
|
242
|
+
).toBe(1)
|
|
243
|
+
})
|
|
244
|
+
})
|
|
245
|
+
|
|
246
|
+
describe('web viewport keyboard metrics', () => {
|
|
247
|
+
test('separates keyboard resize height from bottom inset when Safari pans the visual viewport', () => {
|
|
248
|
+
setWebViewport({
|
|
249
|
+
clientHeight: 678,
|
|
250
|
+
visualViewportHeight: 452,
|
|
251
|
+
offsetTop: 158,
|
|
252
|
+
})
|
|
253
|
+
|
|
254
|
+
expect(getWebKeyboardResizeHeight()).toBe(226)
|
|
255
|
+
expect(getWebVisualViewportOffsetTop()).toBe(158)
|
|
256
|
+
expect(getWebKeyboardBottomInset()).toBe(68)
|
|
257
|
+
})
|
|
258
|
+
|
|
259
|
+
test('matches resize height and bottom inset when the visual viewport is not panned', () => {
|
|
260
|
+
setWebViewport({
|
|
261
|
+
clientHeight: 678,
|
|
262
|
+
visualViewportHeight: 452,
|
|
263
|
+
})
|
|
264
|
+
|
|
265
|
+
expect(getWebKeyboardResizeHeight()).toBe(226)
|
|
266
|
+
expect(getWebVisualViewportOffsetTop()).toBe(0)
|
|
267
|
+
expect(getWebKeyboardBottomInset()).toBe(226)
|
|
268
|
+
})
|
|
269
|
+
})
|
package/types/SheetContext.d.ts
CHANGED
|
@@ -35,7 +35,6 @@ export declare const SheetProvider: (props: {
|
|
|
35
35
|
keyboardOccludedHeight: number;
|
|
36
36
|
isKeyboardVisible: boolean;
|
|
37
37
|
keyboardStableFrameHeight: number;
|
|
38
|
-
isKeyboardSeeding: boolean;
|
|
39
38
|
setHasScrollView: (val: boolean) => void;
|
|
40
39
|
} & {
|
|
41
40
|
scope: import("@tamagui/create-context").Scope<SheetContextValue>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SheetContext.d.ts","sourceRoot":"","sources":["../src/SheetContext.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAEhE,eAAO,MAAO,kBAAkB;;;2JAM4rB,CAAC;QAAS,CAAC;YAAoB,CAAC;yBAN1tB,gBAAgB,+CAAkC,CAAA;AAEpF,eAAO,MAAO,aAAa
|
|
1
|
+
{"version":3,"file":"SheetContext.d.ts","sourceRoot":"","sources":["../src/SheetContext.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAEhE,eAAO,MAAO,kBAAkB;;;2JAM4rB,CAAC;QAAS,CAAC;YAAoB,CAAC;yBAN1tB,gBAAgB,+CAAkC,CAAA;AAEpF,eAAO,MAAO,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+CAAE,eAAe;;;mCAG3C,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SheetImplementationCustom.d.ts","sourceRoot":"","sources":["../src/SheetImplementationCustom.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SheetImplementationCustom.d.ts","sourceRoot":"","sources":["../src/SheetImplementationCustom.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAOvC,OAAO,EAA4B,IAAI,EAAE,MAAM,cAAc,CAAA;AAmB7D,OAAO,KAAK,EAAc,cAAc,EAAE,MAAM,SAAS,CAAA;AAmCzD,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;8BAo9BrC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SheetScrollView.d.ts","sourceRoot":"","sources":["../src/SheetScrollView.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAsC,MAAM,OAAO,CAAA;AAC1D,OAAO,KAAK,EAAE,UAAU,IAAI,YAAY,EAAE,MAAM,cAAc,CAAA;
|
|
1
|
+
{"version":3,"file":"SheetScrollView.d.ts","sourceRoot":"","sources":["../src/SheetScrollView.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAsC,MAAM,OAAO,CAAA;AAC1D,OAAO,KAAK,EAAE,UAAU,IAAI,YAAY,EAAE,MAAM,cAAc,CAAA;AAgB9D,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAyS3B,CAAA"}
|
package/types/createSheet.d.ts
CHANGED
|
@@ -46,9 +46,9 @@ export declare function createSheet<H extends TamaguiComponent | SheetStyledComp
|
|
|
46
46
|
Controlled: FunctionComponent<Omit<SheetProps, "open" | "onOpenChange"> & RefAttributes<RNView>> & {
|
|
47
47
|
Frame: ForwardRefExoticComponent<SheetScopedProps<Omit<GetProps<F>, keyof {
|
|
48
48
|
/**
|
|
49
|
-
*
|
|
50
|
-
*
|
|
51
|
-
*
|
|
49
|
+
* by default the sheet adds a view below its bottom that extends past the
|
|
50
|
+
* largest visible viewport height. this covers spring overshoot when opening
|
|
51
|
+
* so page content never shows through below the sheet.
|
|
52
52
|
*/
|
|
53
53
|
disableHideBottomOverflow?: boolean;
|
|
54
54
|
/**
|
|
@@ -59,9 +59,9 @@ export declare function createSheet<H extends TamaguiComponent | SheetStyledComp
|
|
|
59
59
|
adjustPaddingForOffscreenContent?: boolean;
|
|
60
60
|
}> & {
|
|
61
61
|
/**
|
|
62
|
-
*
|
|
63
|
-
*
|
|
64
|
-
*
|
|
62
|
+
* by default the sheet adds a view below its bottom that extends past the
|
|
63
|
+
* largest visible viewport height. this covers spring overshoot when opening
|
|
64
|
+
* so page content never shows through below the sheet.
|
|
65
65
|
*/
|
|
66
66
|
disableHideBottomOverflow?: boolean;
|
|
67
67
|
/**
|
|
@@ -119,9 +119,9 @@ export declare function createSheet<H extends TamaguiComponent | SheetStyledComp
|
|
|
119
119
|
};
|
|
120
120
|
Frame: ForwardRefExoticComponent<SheetScopedProps<Omit<GetProps<F>, keyof {
|
|
121
121
|
/**
|
|
122
|
-
*
|
|
123
|
-
*
|
|
124
|
-
*
|
|
122
|
+
* by default the sheet adds a view below its bottom that extends past the
|
|
123
|
+
* largest visible viewport height. this covers spring overshoot when opening
|
|
124
|
+
* so page content never shows through below the sheet.
|
|
125
125
|
*/
|
|
126
126
|
disableHideBottomOverflow?: boolean;
|
|
127
127
|
/**
|
|
@@ -132,9 +132,9 @@ export declare function createSheet<H extends TamaguiComponent | SheetStyledComp
|
|
|
132
132
|
adjustPaddingForOffscreenContent?: boolean;
|
|
133
133
|
}> & {
|
|
134
134
|
/**
|
|
135
|
-
*
|
|
136
|
-
*
|
|
137
|
-
*
|
|
135
|
+
* by default the sheet adds a view below its bottom that extends past the
|
|
136
|
+
* largest visible viewport height. this covers spring overshoot when opening
|
|
137
|
+
* so page content never shows through below the sheet.
|
|
138
138
|
*/
|
|
139
139
|
disableHideBottomOverflow?: boolean;
|
|
140
140
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createSheet.d.ts","sourceRoot":"","sources":["../src/createSheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,iCAAiC,EAElC,MAAM,eAAe,CAAA;AAOtB,OAAO,KAAK,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAExF,OAAO,KAAK,EAAE,IAAI,IAAI,MAAM,EAAE,MAAM,cAAc,CAAA;AAOlD,OAAO,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"createSheet.d.ts","sourceRoot":"","sources":["../src/createSheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,iCAAiC,EAElC,MAAM,eAAe,CAAA;AAOtB,OAAO,KAAK,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAExF,OAAO,KAAK,EAAE,IAAI,IAAI,MAAM,EAAE,MAAM,cAAc,CAAA;AAOlD,OAAO,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAK3D,KAAK,gBAAgB,GAAG;IACtB,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,KAAK,SAAS,GAAG,SAAS,GAAG,gBAAgB,CAAA;AAE7C,KAAK,oBAAoB,GAAG,iCAAiC,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAA;AAE1F,wBAAgB,WAAW,CACzB,CAAC,SAAS,gBAAgB,GAAG,oBAAoB,EACjD,CAAC,SAAS,gBAAgB,GAAG,oBAAoB,EACjD,CAAC,SAAS,gBAAgB,GAAG,oBAAoB,EACjD,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE;IAAE,MAAM,EAAE,CAAC,CAAC;IAAC,KAAK,EAAE,CAAC,CAAC;IAAC,OAAO,EAAE,CAAC,CAAA;CAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAiG7D;;;;eAIG;wCACyB,OAAO;YAEnC;;;;eAIG;+CACgC,OAAO;;YAZ1C;;;;eAIG;wCACyB,OAAO;YAEnC;;;;eAIG;+CACgC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAZ1C;;;;WAIG;oCACyB,OAAO;QAEnC;;;;WAIG;2CACgC,OAAO;;QAZ1C;;;;WAIG;oCACyB,OAAO;QAEnC;;;;WAIG;2CACgC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2J7C"}
|
|
@@ -1,3 +1,21 @@
|
|
|
1
|
+
export declare function getKeyboardAdjustedSheetY({ sheetY, screenSize, isKeyboardVisible, keyboardHeight, shouldTranslate, safeAreaTop, }: {
|
|
2
|
+
sheetY: number;
|
|
3
|
+
screenSize: number;
|
|
4
|
+
isKeyboardVisible: boolean;
|
|
5
|
+
keyboardHeight: number;
|
|
6
|
+
shouldTranslate: boolean;
|
|
7
|
+
safeAreaTop: number;
|
|
8
|
+
}): number;
|
|
9
|
+
export declare function getSheetReleasePosition({ positions, projectedEnd, currentPosition, frameSize, dismissOnSnapToBottom, snapPointsMode, isKeyboardVisible, isWeb, }: {
|
|
10
|
+
positions: number[];
|
|
11
|
+
projectedEnd: number;
|
|
12
|
+
currentPosition: number;
|
|
13
|
+
frameSize: number;
|
|
14
|
+
dismissOnSnapToBottom: boolean;
|
|
15
|
+
snapPointsMode: 'percent' | 'constant' | 'fit' | 'mixed';
|
|
16
|
+
isKeyboardVisible: boolean;
|
|
17
|
+
isWeb: boolean;
|
|
18
|
+
}): number;
|
|
1
19
|
export declare function getKeyboardOccludedHeight({ frameSize, isKeyboardVisible, keyboardHeight, screenSize, sheetY, }: {
|
|
2
20
|
frameSize: number;
|
|
3
21
|
isKeyboardVisible: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"keyboardAvoidance.d.ts","sourceRoot":"","sources":["../src/keyboardAvoidance.ts"],"names":[],"mappings":"AAAA,wBAAgB,yBAAyB,CAAC,EACxC,SAAS,EACT,iBAAiB,EACjB,cAAc,EACd,UAAU,EACV,MAAM,GACP,EAAE;IACD,SAAS,EAAE,MAAM,CAAA;IACjB,iBAAiB,EAAE,OAAO,CAAA;IAC1B,cAAc,EAAE,MAAM,CAAA;IACtB,UAAU,EAAE,MAAM,CAAA;IAClB,MAAM,EAAE,MAAM,GAAG,SAAS,CAAA;CAC3B,UAiBA"}
|
|
1
|
+
{"version":3,"file":"keyboardAvoidance.d.ts","sourceRoot":"","sources":["../src/keyboardAvoidance.ts"],"names":[],"mappings":"AAAA,wBAAgB,yBAAyB,CAAC,EACxC,MAAM,EACN,UAAU,EACV,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,WAAW,GACZ,EAAE;IACD,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,EAAE,MAAM,CAAA;IAClB,iBAAiB,EAAE,OAAO,CAAA;IAC1B,cAAc,EAAE,MAAM,CAAA;IACtB,eAAe,EAAE,OAAO,CAAA;IACxB,WAAW,EAAE,MAAM,CAAA;CACpB,UAYA;AAED,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,YAAY,EACZ,eAAe,EACf,SAAS,EACT,qBAAqB,EACrB,cAAc,EACd,iBAAiB,EACjB,KAAK,GACN,EAAE;IACD,SAAS,EAAE,MAAM,EAAE,CAAA;IACnB,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,MAAM,CAAA;IACvB,SAAS,EAAE,MAAM,CAAA;IACjB,qBAAqB,EAAE,OAAO,CAAA;IAC9B,cAAc,EAAE,SAAS,GAAG,UAAU,GAAG,KAAK,GAAG,OAAO,CAAA;IACxD,iBAAiB,EAAE,OAAO,CAAA;IAC1B,KAAK,EAAE,OAAO,CAAA;CACf,UA2CA;AAED,wBAAgB,yBAAyB,CAAC,EACxC,SAAS,EACT,iBAAiB,EACjB,cAAc,EACd,UAAU,EACV,MAAM,GACP,EAAE;IACD,SAAS,EAAE,MAAM,CAAA;IACjB,iBAAiB,EAAE,OAAO,CAAA;IAC1B,cAAc,EAAE,MAAM,CAAA;IACtB,UAAU,EAAE,MAAM,CAAA;IAClB,MAAM,EAAE,MAAM,GAAG,SAAS,CAAA;CAC3B,UAiBA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nativeSheet.d.ts","sourceRoot":"","sources":["../src/nativeSheet.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAI9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAMzC,KAAK,oBAAoB,GAAG,KAAK,CAAA;AAMjC,wBAAgB,cAAc,CAAC,QAAQ,EAAE,oBAAoB,wCAE5D;AAED,wBAAgB,gBAAgB,CAC9B,QAAQ,EAAE,oBAAoB,EAC9B,UAAU,EAAE;IAAE,cAAc,EAAE,GAAG,CAAC;IAAC,yBAAyB,EAAE,GAAG,CAAA;CAAE,
|
|
1
|
+
{"version":3,"file":"nativeSheet.d.ts","sourceRoot":"","sources":["../src/nativeSheet.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAI9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAMzC,KAAK,oBAAoB,GAAG,KAAK,CAAA;AAMjC,wBAAgB,cAAc,CAAC,QAAQ,EAAE,oBAAoB,wCAE5D;AAED,wBAAgB,gBAAgB,CAC9B,QAAQ,EAAE,oBAAoB,EAC9B,UAAU,EAAE;IAAE,cAAc,EAAE,GAAG,CAAC;IAAC,yBAAyB,EAAE,GAAG,CAAA;CAAE,QAoEpE"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type RefObject } from 'react';
|
|
2
|
-
import type { ScrollBridge } from './types';
|
|
2
|
+
import type { ScrollBridge, SnapPointsMode } from './types';
|
|
3
3
|
interface GesturePanConfig {
|
|
4
4
|
positions: number[];
|
|
5
5
|
frameSize: number;
|
|
@@ -12,6 +12,9 @@ interface GesturePanConfig {
|
|
|
12
12
|
resisted: (val: number, minY: number) => number;
|
|
13
13
|
disableDrag?: boolean;
|
|
14
14
|
isShowingInnerSheet?: boolean;
|
|
15
|
+
dismissOnSnapToBottom?: boolean;
|
|
16
|
+
snapPointsMode?: SnapPointsMode;
|
|
17
|
+
isKeyboardVisible?: boolean;
|
|
15
18
|
setAnimatedPosition: (val: number) => void;
|
|
16
19
|
scrollGestureRef?: RefObject<any> | null;
|
|
17
20
|
pauseKeyboardHandler?: RefObject<boolean>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGestureHandlerPan.d.ts","sourceRoot":"","sources":["../src/useGestureHandlerPan.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useGestureHandlerPan.d.ts","sourceRoot":"","sources":["../src/useGestureHandlerPan.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAGpE,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAM3D,UAAU,gBAAgB;IACxB,SAAS,EAAE,MAAM,EAAE,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,iBAAiB,CAAC,EAAE,GAAG,KAAK,IAAI,CAAA;IACzD,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,YAAY,EAAE,YAAY,CAAA;IAC1B,aAAa,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,kBAAkB,EAAE,MAAM,MAAM,CAAA;IAChC,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,MAAM,CAAA;IAC/C,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,cAAc,CAAC,EAAE,cAAc,CAAA;IAC/B,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAE3B,mBAAmB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;IAE1C,gBAAgB,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,IAAI,CAAA;IAExC,oBAAoB,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAA;CAC1C;AAED,UAAU,gBAAgB;IACxB,UAAU,EAAE,GAAG,GAAG,IAAI,CAAA;IACtB,aAAa,EAAE,SAAS,CAAC,GAAG,CAAC,CAAA;IAC7B,qBAAqB,EAAE,OAAO,CAAA;CAC/B;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,gBAAgB,GAAG,gBAAgB,CAuT/E"}
|
|
@@ -2,11 +2,11 @@
|
|
|
2
2
|
* Web implementation of the keyboard controller sheet hook.
|
|
3
3
|
*
|
|
4
4
|
* Mobile browsers don't expose a keyboard API, but they do resize the
|
|
5
|
-
* VisualViewport when the soft keyboard opens. We
|
|
6
|
-
* `
|
|
7
|
-
*
|
|
8
|
-
*
|
|
9
|
-
*
|
|
5
|
+
* VisualViewport when the soft keyboard opens. We use the viewport shrink
|
|
6
|
+
* (`clientHeight - visualViewport.height`) to detect the keyboard, then feed the
|
|
7
|
+
* bottom layout inset (`clientHeight - (offsetTop + height)`) into
|
|
8
|
+
* SheetImplementationCustom. The bottom inset accounts for iOS Safari panning
|
|
9
|
+
* the visual viewport during focus, so the sheet doesn't over-lift.
|
|
10
10
|
*
|
|
11
11
|
* Without this, a bottom sheet on mobile web stays pinned behind the keyboard:
|
|
12
12
|
* react-native-web's Dimensions tracks the (shrinking) VisualViewport, so any
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useKeyboardControllerSheet.d.ts","sourceRoot":"","sources":["../src/useKeyboardControllerSheet.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,OAAO,KAAK,EACV,8BAA8B,EAC9B,6BAA6B,EAC9B,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"useKeyboardControllerSheet.d.ts","sourceRoot":"","sources":["../src/useKeyboardControllerSheet.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,OAAO,KAAK,EACV,8BAA8B,EAC9B,6BAA6B,EAC9B,MAAM,SAAS,CAAA;AAQhB,wBAAgB,0BAA0B,CACxC,OAAO,EAAE,8BAA8B,GACtC,6BAA6B,CA+G/B"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface SafeAreaInsets {
|
|
3
|
+
top: number;
|
|
4
|
+
right: number;
|
|
5
|
+
bottom: number;
|
|
6
|
+
left: number;
|
|
7
|
+
}
|
|
8
|
+
export declare const SafeAreaInsetsContext: React.Context<SafeAreaInsets | null>;
|
|
9
|
+
export declare function useSafeAreaInsets(): SafeAreaInsets | null;
|
|
10
|
+
//# sourceMappingURL=useSafeAreaInsets.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSafeAreaInsets.d.ts","sourceRoot":"","sources":["../src/useSafeAreaInsets.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,MAAM,WAAW,cAAc;IAC7B,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;CACb;AAOD,eAAO,MAAM,qBAAqB,sCAAmD,CAAA;AAErF,wBAAgB,iBAAiB,IAAI,cAAc,GAAG,IAAI,CAEzD"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { SafeAreaInsets } from './useSafeAreaInsets';
|
|
3
|
+
export declare const SafeAreaInsetsContext: React.Context<SafeAreaInsets | null>;
|
|
4
|
+
/**
|
|
5
|
+
* Live safe-area insets (notch / status bar / home indicator) read from the
|
|
6
|
+
* context the app's SafeAreaProvider provides.
|
|
7
|
+
*
|
|
8
|
+
* Read this in a component BODY that renders inside the provider. The Sheet does
|
|
9
|
+
* exactly that — only its modal CONTENT is teleported out through the portal, so
|
|
10
|
+
* the body still sees the real insets. This is the one read that works in real
|
|
11
|
+
* native bundles:
|
|
12
|
+
* - `getSafeArea()` (the @tamagui/native abstraction) is frequently NOT enabled
|
|
13
|
+
* against the instance a component reads, so it returns 0.
|
|
14
|
+
* - a dynamic `require('react-native-safe-area-context')` throws "Unknown named
|
|
15
|
+
* module" in metro/rolldown bundles where the package isn't in the importing
|
|
16
|
+
* module's graph.
|
|
17
|
+
* A static import + context read avoids both.
|
|
18
|
+
*/
|
|
19
|
+
export declare function useSafeAreaInsets(): SafeAreaInsets | null;
|
|
20
|
+
//# sourceMappingURL=useSafeAreaInsets.native.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSafeAreaInsets.native.d.ts","sourceRoot":"","sources":["../src/useSafeAreaInsets.native.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAKzD,eAAO,MAAM,qBAAqB,EACM,KAAK,CAAC,OAAO,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;AAE5E;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,iBAAiB,IAAI,cAAc,GAAG,IAAI,CAEzD"}
|
|
@@ -6,7 +6,6 @@ export type SheetContextValue = ReturnType<typeof useSheetProviderProps> & {
|
|
|
6
6
|
keyboardOccludedHeight: number;
|
|
7
7
|
isKeyboardVisible: boolean;
|
|
8
8
|
keyboardStableFrameHeight: number;
|
|
9
|
-
isKeyboardSeeding: boolean;
|
|
10
9
|
setHasScrollView: (val: boolean) => void;
|
|
11
10
|
};
|
|
12
11
|
export declare function useSheetProviderProps(props: SheetProps, state: SheetOpenState, options?: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSheetProviderProps.d.ts","sourceRoot":"","sources":["../src/useSheetProviderProps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAKnD,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEzD,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,qBAAqB,CAAC,GAAG;IACzE,sBAAsB,EAAE,MAAM,CAAA;IAK9B,iBAAiB,EAAE,OAAO,CAAA;IAK1B,yBAAyB,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"useSheetProviderProps.d.ts","sourceRoot":"","sources":["../src/useSheetProviderProps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAKnD,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEzD,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,qBAAqB,CAAC,GAAG;IACzE,sBAAsB,EAAE,MAAM,CAAA;IAK9B,iBAAiB,EAAE,OAAO,CAAA;IAK1B,yBAAyB,EAAE,MAAM,CAAA;IACjC,gBAAgB,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAA;CACzC,CAAA;AAED,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,cAAc,EACrB,OAAO,GAAE;IACP,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAA;CACpC;;;;;;;;;;;;;;;gCADwB,GAAG,KAAK,IAAI;;;;;;;wBAoCjC,MAAM;;;EAyKhB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSheetScrollViewGestures.d.ts","sourceRoot":"","sources":["../src/useSheetScrollViewGestures.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,IAAI,YAAY,EAAE,MAAM,cAAc,CAAA;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"useSheetScrollViewGestures.d.ts","sourceRoot":"","sources":["../src/useSheetScrollViewGestures.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,IAAI,YAAY,EAAE,MAAM,cAAc,CAAA;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAc3C,UAAU,+BAA+B;IACvC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,CAAA;IAC/C,YAAY,EAAE,YAAY,CAAA;IAC1B,oBAAoB,EAAE,OAAO,CAAA;IAC7B,aAAa,EAAE,OAAO,CAAA;IACtB,gBAAgB,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9D;AAED,wBAAgB,0BAA0B,CAAC,EACzC,SAAS,EACT,YAAY,EACZ,oBAAoB,GACrB,EAAE,+BAA+B,MAqMjC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSheetScrollViewGestures.native.d.ts","sourceRoot":"","sources":["../src/useSheetScrollViewGestures.native.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,UAAU,IAAI,YAAY,EAAE,MAAM,cAAc,CAAA;AACrF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAc3C,UAAU,+BAA+B;IACvC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,CAAA;IAC/C,YAAY,EAAE,YAAY,CAAA;IAC1B,oBAAoB,EAAE,OAAO,CAAA;IAC7B,aAAa,EAAE,OAAO,CAAA;IACtB,gBAAgB,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9D;AAED;;;GAGG;AACH,wBAAgB,0BAA0B,CAAC,EACzC,YAAY,EACZ,oBAAoB,EACpB,aAAa,EACb,gBAAgB,GACjB,EAAE,+BAA+B;;;kCAiDK,qBAAqB;yBAW9B,qBAAqB;
|
|
1
|
+
{"version":3,"file":"useSheetScrollViewGestures.native.d.ts","sourceRoot":"","sources":["../src/useSheetScrollViewGestures.native.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,UAAU,IAAI,YAAY,EAAE,MAAM,cAAc,CAAA;AACrF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAc3C,UAAU,+BAA+B;IACvC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,CAAA;IAC/C,YAAY,EAAE,YAAY,CAAA;IAC1B,oBAAoB,EAAE,OAAO,CAAA;IAC7B,aAAa,EAAE,OAAO,CAAA;IACtB,gBAAgB,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9D;AAED;;;GAGG;AACH,wBAAgB,0BAA0B,CAAC,EACzC,YAAY,EACZ,oBAAoB,EACpB,aAAa,EACb,gBAAgB,GACjB,EAAE,+BAA+B;;;kCAiDK,qBAAqB;yBAW9B,qBAAqB;EAyElD"}
|
package/types/webViewport.d.ts
CHANGED
|
@@ -8,11 +8,13 @@
|
|
|
8
8
|
* `document.documentElement.clientHeight` holds rock-steady at 714 the whole
|
|
9
9
|
* time (open, mid-keyboard, and close). So clientHeight IS the stable layout
|
|
10
10
|
* viewport, and we derive everything from it:
|
|
11
|
-
* -
|
|
12
|
-
* even as innerHeight drifts), so
|
|
13
|
-
* -
|
|
14
|
-
*
|
|
15
|
-
*
|
|
11
|
+
* - keyboard resize height = clientHeight - visualViewport.height (stays
|
|
12
|
+
* correct even as innerHeight drifts), so keyboard detection is stable.
|
|
13
|
+
* - keyboard bottom inset = clientHeight - (visualViewport.offsetTop +
|
|
14
|
+
* visualViewport.height), so Safari's focus pan doesn't over-lift the sheet.
|
|
15
|
+
* - the sheet's fit-mode position math reads clientHeight, so it never
|
|
16
|
+
* re-measures against a shrunk value; the frame can translate with the
|
|
17
|
+
* keyboard while keeping its natural fit height.
|
|
16
18
|
*/
|
|
17
19
|
export declare const MIN_KEYBOARD_HEIGHT = 80;
|
|
18
20
|
export declare function isEditableElement(el: Element | null): boolean;
|
|
@@ -22,9 +24,13 @@ export declare function isEditableElement(el: Element | null): boolean;
|
|
|
22
24
|
* visualViewport), so it stays constant while the keyboard animates in/out.
|
|
23
25
|
*/
|
|
24
26
|
export declare function getStableLayoutViewportHeight(): number;
|
|
27
|
+
export declare function getMaxViewportHeight(): number;
|
|
28
|
+
export declare function getWebKeyboardResizeHeight(): number;
|
|
29
|
+
export declare function getWebVisualViewportOffsetTop(): number;
|
|
25
30
|
/**
|
|
26
|
-
*
|
|
27
|
-
* viewport
|
|
31
|
+
* bottom layout inset hidden below the visual viewport. When Safari pans the
|
|
32
|
+
* visual viewport during focus, offsetTop reduces the bottom-hidden area.
|
|
28
33
|
*/
|
|
34
|
+
export declare function getWebKeyboardBottomInset(): number;
|
|
29
35
|
export declare function getWebKeyboardHeight(): number;
|
|
30
36
|
//# sourceMappingURL=webViewport.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"webViewport.d.ts","sourceRoot":"","sources":["../src/webViewport.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"webViewport.d.ts","sourceRoot":"","sources":["../src/webViewport.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAIH,eAAO,MAAM,mBAAmB,KAAK,CAAA;AAErC,wBAAgB,iBAAiB,CAAC,EAAE,EAAE,OAAO,GAAG,IAAI,GAAG,OAAO,CAM7D;AAED;;;;GAIG;AACH,wBAAgB,6BAA6B,IAAI,MAAM,CAMtD;AAkBD,wBAAgB,oBAAoB,IAAI,MAAM,CAW7C;AAED,wBAAgB,0BAA0B,IAAI,MAAM,CAKnD;AAED,wBAAgB,6BAA6B,IAAI,MAAM,CAGtD;AAED;;;GAGG;AACH,wBAAgB,yBAAyB,IAAI,MAAM,CAMlD;AAED,wBAAgB,oBAAoB,IAAI,MAAM,CAE7C"}
|