@lodev09/react-native-true-sheet 3.11.8 → 3.11.10
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/android/src/main/java/com/lodev09/truesheet/TrueSheetFooterView.kt +6 -0
- package/android/src/main/java/com/lodev09/truesheet/TrueSheetView.kt +7 -0
- package/android/src/main/java/com/lodev09/truesheet/TrueSheetViewController.kt +21 -3
- package/android/src/main/java/com/lodev09/truesheet/TrueSheetViewManager.kt +20 -0
- package/android/src/main/java/com/lodev09/truesheet/core/TrueSheetBottomSheetView.kt +17 -4
- package/android/src/main/java/com/lodev09/truesheet/core/TrueSheetDetentCalculator.kt +12 -1
- package/android/src/main/java/com/lodev09/truesheet/core/TrueSheetGrabberView.kt +30 -7
- package/android/src/main/java/com/lodev09/truesheet/core/TrueSheetStackManager.kt +52 -0
- package/ios/TrueSheetView.mm +3 -0
- package/ios/TrueSheetViewController.h +8 -0
- package/ios/TrueSheetViewController.mm +43 -5
- package/ios/core/TrueSheetDetentCalculator.h +6 -0
- package/ios/core/TrueSheetGrabberView.h +4 -0
- package/ios/core/TrueSheetGrabberView.mm +15 -5
- package/ios/core/TrueSheetKeyboardObserver.mm +15 -0
- package/lib/module/TrueSheet.js +20 -1
- package/lib/module/TrueSheet.js.map +1 -1
- package/lib/module/TrueSheet.web.js +18 -12
- package/lib/module/TrueSheet.web.js.map +1 -1
- package/lib/module/TrueSheetPeek.web.js +15 -6
- package/lib/module/TrueSheetPeek.web.js.map +1 -1
- package/lib/module/fabric/TrueSheetViewNativeComponent.ts +12 -0
- package/lib/typescript/src/TrueSheet.d.ts.map +1 -1
- package/lib/typescript/src/TrueSheet.types.d.ts +69 -0
- package/lib/typescript/src/TrueSheet.types.d.ts.map +1 -1
- package/lib/typescript/src/TrueSheet.web.d.ts.map +1 -1
- package/lib/typescript/src/TrueSheetPeek.web.d.ts +9 -0
- package/lib/typescript/src/TrueSheetPeek.web.d.ts.map +1 -1
- package/lib/typescript/src/fabric/TrueSheetViewNativeComponent.d.ts +11 -0
- package/lib/typescript/src/fabric/TrueSheetViewNativeComponent.d.ts.map +1 -1
- package/lib/typescript/src/navigation/types.d.ts +1 -1
- package/lib/typescript/src/navigation/types.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/TrueSheet.tsx +22 -1
- package/src/TrueSheet.types.ts +71 -0
- package/src/TrueSheet.web.tsx +27 -18
- package/src/TrueSheetPeek.web.tsx +22 -7
- package/src/fabric/TrueSheetViewNativeComponent.ts +12 -0
- package/src/navigation/types.ts +1 -0
|
@@ -6,9 +6,18 @@ import { View, type ViewProps } from 'react-native';
|
|
|
6
6
|
*/
|
|
7
7
|
export interface TrueSheetPeekContextValue {
|
|
8
8
|
contentRef: RefObject<View | null>;
|
|
9
|
+
peekRef: RefObject<View | null>;
|
|
9
10
|
setPeekContentHeight: (height: number) => void;
|
|
10
11
|
}
|
|
11
12
|
export declare const TrueSheetPeekContext: import("react").Context<TrueSheetPeekContextValue | null>;
|
|
13
|
+
/**
|
|
14
|
+
* Distance from the top of the content view to the bottom of the peek view,
|
|
15
|
+
* so the peek view's offset within the content (padding, views above it)
|
|
16
|
+
* counts toward the peek detent. Both rects live in the drawer's transformed
|
|
17
|
+
* subtree, so an in-flight translate cancels out of the delta.
|
|
18
|
+
* @internal
|
|
19
|
+
*/
|
|
20
|
+
export declare const measurePeekContentHeight: (peekElement: HTMLElement, contentElement: HTMLElement) => number;
|
|
12
21
|
/**
|
|
13
22
|
* Wrapper component that marks its children as the sheet's peek content.
|
|
14
23
|
* When rendered within a `TrueSheet`, the `"peek"` detent reveals everything
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TrueSheetPeek.web.d.ts","sourceRoot":"","sources":["../../../src/TrueSheetPeek.web.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"TrueSheetPeek.web.d.ts","sourceRoot":"","sources":["../../../src/TrueSheetPeek.web.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAiC,MAAM,OAAO,CAAC;AACrF,OAAO,EAA0B,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE5E;;;GAGG;AACH,MAAM,WAAW,yBAAyB;IACxC,UAAU,EAAE,SAAS,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;IACnC,OAAO,EAAE,SAAS,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;IAChC,oBAAoB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAChD;AAED,eAAO,MAAM,oBAAoB,2DAAwD,CAAC;AAE1F;;;;;;GAMG;AACH,eAAO,MAAM,wBAAwB,GACnC,aAAa,WAAW,EACxB,gBAAgB,WAAW,KAC1B,MACsF,CAAC;AAE1F;;;;;GAKG;AACH,eAAO,MAAM,aAAa,GAAI,uBAAuB,SAAS,4CA4B7D,CAAC"}
|
|
@@ -8,6 +8,16 @@ type GrabberOptionsType = Readonly<{
|
|
|
8
8
|
color?: ProcessedColorValue | null;
|
|
9
9
|
adaptive?: WithDefault<boolean, true>;
|
|
10
10
|
}>;
|
|
11
|
+
type AccessibilityOptionsType = Readonly<{
|
|
12
|
+
grabberLabel?: WithDefault<string, 'Sheet Grabber'>;
|
|
13
|
+
grabberHint?: WithDefault<string, 'Double-tap to expand. Swipe up or down to resize the sheet'>;
|
|
14
|
+
expandedValue?: WithDefault<string, 'Expanded'>;
|
|
15
|
+
collapsedValue?: WithDefault<string, 'Collapsed'>;
|
|
16
|
+
detentValue?: WithDefault<string, 'Detent {index} of {count}'>;
|
|
17
|
+
expandActionLabel?: WithDefault<string, 'Expand'>;
|
|
18
|
+
collapseActionLabel?: WithDefault<string, 'Collapse'>;
|
|
19
|
+
paneTitle?: WithDefault<string, 'Bottom sheet'>;
|
|
20
|
+
}>;
|
|
11
21
|
type BlurOptionsType = Readonly<{
|
|
12
22
|
intensity?: WithDefault<Double, -1>;
|
|
13
23
|
interaction?: WithDefault<boolean, true>;
|
|
@@ -49,6 +59,7 @@ export interface NativeProps extends ViewProps {
|
|
|
49
59
|
blurOptions?: BlurOptionsType;
|
|
50
60
|
grabber?: WithDefault<boolean, true>;
|
|
51
61
|
grabberOptions?: GrabberOptionsType;
|
|
62
|
+
accessibilityOptions?: AccessibilityOptionsType;
|
|
52
63
|
dismissible?: WithDefault<boolean, true>;
|
|
53
64
|
draggable?: WithDefault<boolean, true>;
|
|
54
65
|
dimmed?: WithDefault<boolean, true>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TrueSheetViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/fabric/TrueSheetViewNativeComponent.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TrueSheetViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/fabric/TrueSheetViewNativeComponent.ts"],"names":[],"mappings":"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"}
|
|
@@ -101,7 +101,7 @@ export type TrueSheetScreenProps<ParamList extends ParamListBase, RouteName exte
|
|
|
101
101
|
route: RouteProp<ParamList, RouteName>;
|
|
102
102
|
};
|
|
103
103
|
export type TrueSheetNavigationHelpers = NavigationHelpers<ParamListBase, TrueSheetNavigationEventMap>;
|
|
104
|
-
export type TrueSheetNavigationSheetProps = Pick<TrueSheetProps, 'detents' | 'backgroundColor' | 'cornerRadius' | 'dismissible' | 'draggable' | 'grabber' | 'grabberOptions' | 'dimmed' | 'dimmedDetentIndex' | 'backgroundBlur' | 'blurOptions' | 'maxContentHeight' | 'maxContentWidth' | 'scrollable' | 'presentation' | 'header' | 'headerStyle' | 'footer' | 'footerStyle' | 'scrollableOptions' | 'insetAdjustment' | 'anchor' | 'anchorOffset' | 'elevation' | 'detached' | 'detachedOffset'>;
|
|
104
|
+
export type TrueSheetNavigationSheetProps = Pick<TrueSheetProps, 'detents' | 'backgroundColor' | 'cornerRadius' | 'dismissible' | 'draggable' | 'grabber' | 'grabberOptions' | 'accessibilityOptions' | 'dimmed' | 'dimmedDetentIndex' | 'backgroundBlur' | 'blurOptions' | 'maxContentHeight' | 'maxContentWidth' | 'scrollable' | 'presentation' | 'header' | 'headerStyle' | 'footer' | 'footerStyle' | 'scrollableOptions' | 'insetAdjustment' | 'anchor' | 'anchorOffset' | 'elevation' | 'detached' | 'detachedOffset'>;
|
|
105
105
|
/**
|
|
106
106
|
* Screen options for TrueSheet navigator screens.
|
|
107
107
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/navigation/types.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/navigation/types.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
package/src/TrueSheet.tsx
CHANGED
|
@@ -42,6 +42,7 @@ import {
|
|
|
42
42
|
findNodeHandle,
|
|
43
43
|
processColor,
|
|
44
44
|
type NativeEventSubscription,
|
|
45
|
+
type GestureResponderEvent,
|
|
45
46
|
} from 'react-native';
|
|
46
47
|
|
|
47
48
|
const LINKING_ERROR =
|
|
@@ -57,6 +58,13 @@ if (!TrueSheetModule) {
|
|
|
57
58
|
|
|
58
59
|
type NativeRef = ComponentRef<typeof TrueSheetViewNativeComponent>;
|
|
59
60
|
|
|
61
|
+
// Claim touches that no descendant claimed so the responder negotiation
|
|
62
|
+
// doesn't bubble up to touchables outside the sheet
|
|
63
|
+
const absorbUnclaimedTouches = () => true;
|
|
64
|
+
|
|
65
|
+
// Stop raw touch events from bubbling past the sheet to outside ancestors
|
|
66
|
+
const stopTouchPropagation = (event: GestureResponderEvent) => event.stopPropagation();
|
|
67
|
+
|
|
60
68
|
interface TrueSheetState {
|
|
61
69
|
shouldRenderNativeView: boolean;
|
|
62
70
|
}
|
|
@@ -357,12 +365,18 @@ export class TrueSheet
|
|
|
357
365
|
private handleBackPress(): boolean {
|
|
358
366
|
if (!this.isPresented || !this.isSheetVisible) return false;
|
|
359
367
|
|
|
368
|
+
// The native view can be detached (e.g. host screen unmounted by navigation)
|
|
369
|
+
// before onDidDismiss removes this subscription. Treat back press as a no-op
|
|
370
|
+
// instead of throwing from the handle getter.
|
|
371
|
+
const nodeHandle = findNodeHandle(this.nativeRef.current);
|
|
372
|
+
if (nodeHandle == null || nodeHandle === -1) return false;
|
|
373
|
+
|
|
360
374
|
// When not dismissible, let back propagate (e.g. navigation goes back to the previous screen)
|
|
361
375
|
if (this.props.dismissible === false) {
|
|
362
376
|
return this.props.onBackPress?.() ?? false;
|
|
363
377
|
}
|
|
364
378
|
|
|
365
|
-
TrueSheetModule?.handleBackPress(
|
|
379
|
+
TrueSheetModule?.handleBackPress(nodeHandle);
|
|
366
380
|
return this.props.onBackPress?.() ?? true;
|
|
367
381
|
}
|
|
368
382
|
|
|
@@ -446,6 +460,7 @@ export class TrueSheet
|
|
|
446
460
|
draggable = true,
|
|
447
461
|
grabber = true,
|
|
448
462
|
grabberOptions,
|
|
463
|
+
accessibilityOptions,
|
|
449
464
|
dimmed = true,
|
|
450
465
|
initialDetentIndex = -1,
|
|
451
466
|
initialDetentAnimated = true,
|
|
@@ -504,6 +519,7 @@ export class TrueSheet
|
|
|
504
519
|
cornerRadius={cornerRadius}
|
|
505
520
|
grabber={grabber}
|
|
506
521
|
grabberOptions={this.resolvedGrabberOptions}
|
|
522
|
+
accessibilityOptions={accessibilityOptions}
|
|
507
523
|
dimmed={dimmed}
|
|
508
524
|
dimmedDetentIndex={dimmedDetentIndex}
|
|
509
525
|
initialDetentIndex={initialDetentIndex}
|
|
@@ -538,6 +554,11 @@ export class TrueSheet
|
|
|
538
554
|
{this.state.shouldRenderNativeView && (
|
|
539
555
|
<TrueSheetContainerViewNativeComponent
|
|
540
556
|
style={scrollable ? styles.scrollableContainer : undefined}
|
|
557
|
+
onStartShouldSetResponder={absorbUnclaimedTouches}
|
|
558
|
+
onTouchStart={stopTouchPropagation}
|
|
559
|
+
onTouchMove={stopTouchPropagation}
|
|
560
|
+
onTouchEnd={stopTouchPropagation}
|
|
561
|
+
onTouchCancel={stopTouchPropagation}
|
|
541
562
|
>
|
|
542
563
|
{header && (
|
|
543
564
|
<TrueSheetHeaderViewNativeComponent style={[styles.header, headerStyle]}>
|
package/src/TrueSheet.types.ts
CHANGED
|
@@ -88,6 +88,71 @@ export interface GrabberOptions {
|
|
|
88
88
|
adaptive?: boolean;
|
|
89
89
|
}
|
|
90
90
|
|
|
91
|
+
/**
|
|
92
|
+
* Options for customizing (e.g. localizing) the accessibility strings
|
|
93
|
+
* announced by screen readers.
|
|
94
|
+
*
|
|
95
|
+
* On iOS, the grabber strings only apply when `grabberOptions` is provided.
|
|
96
|
+
* Without it, iOS uses the system grabber which is already localized.
|
|
97
|
+
*/
|
|
98
|
+
export interface AccessibilityOptions {
|
|
99
|
+
/**
|
|
100
|
+
* The accessibility label of the grabber.
|
|
101
|
+
*
|
|
102
|
+
* @default iOS: 'Sheet Grabber', Android: 'Drag handle'
|
|
103
|
+
*/
|
|
104
|
+
grabberLabel?: string;
|
|
105
|
+
/**
|
|
106
|
+
* The accessibility hint of the grabber.
|
|
107
|
+
*
|
|
108
|
+
* @platform ios
|
|
109
|
+
* @default 'Double-tap to expand. Swipe up or down to resize the sheet'
|
|
110
|
+
*/
|
|
111
|
+
grabberHint?: string;
|
|
112
|
+
/**
|
|
113
|
+
* The value announced when the sheet is at the last detent.
|
|
114
|
+
*
|
|
115
|
+
* @default 'Expanded'
|
|
116
|
+
*/
|
|
117
|
+
expandedValue?: string;
|
|
118
|
+
/**
|
|
119
|
+
* The value announced when the sheet is at the first detent.
|
|
120
|
+
*
|
|
121
|
+
* @default 'Collapsed'
|
|
122
|
+
*/
|
|
123
|
+
collapsedValue?: string;
|
|
124
|
+
/**
|
|
125
|
+
* The value announced when the sheet is at an intermediate detent.
|
|
126
|
+
* Supports `{index}` and `{count}` placeholders.
|
|
127
|
+
*
|
|
128
|
+
* @default 'Detent {index} of {count}'
|
|
129
|
+
*/
|
|
130
|
+
detentValue?: string;
|
|
131
|
+
/**
|
|
132
|
+
* The label of the expand accessibility action.
|
|
133
|
+
*
|
|
134
|
+
* @platform android
|
|
135
|
+
* @default 'Expand'
|
|
136
|
+
*/
|
|
137
|
+
expandActionLabel?: string;
|
|
138
|
+
/**
|
|
139
|
+
* The label of the collapse accessibility action.
|
|
140
|
+
*
|
|
141
|
+
* @platform android
|
|
142
|
+
* @default 'Collapse'
|
|
143
|
+
*/
|
|
144
|
+
collapseActionLabel?: string;
|
|
145
|
+
/**
|
|
146
|
+
* The title announced when the sheet appears.
|
|
147
|
+
* Sets the accessibility pane title on Android and the
|
|
148
|
+
* hidden dialog title on Web.
|
|
149
|
+
*
|
|
150
|
+
* @platform android, web
|
|
151
|
+
* @default Android: 'Bottom sheet', Web: 'Sheet'
|
|
152
|
+
*/
|
|
153
|
+
paneTitle?: string;
|
|
154
|
+
}
|
|
155
|
+
|
|
91
156
|
/**
|
|
92
157
|
* Scroll edge effect style for iOS 26+.
|
|
93
158
|
* Controls the blur/gradient overlay applied to scroll view edges.
|
|
@@ -354,6 +419,12 @@ export interface TrueSheetProps extends ViewProps {
|
|
|
354
419
|
*/
|
|
355
420
|
grabberOptions?: GrabberOptions;
|
|
356
421
|
|
|
422
|
+
/**
|
|
423
|
+
* Options for customizing (e.g. localizing) the accessibility strings
|
|
424
|
+
* announced by screen readers.
|
|
425
|
+
*/
|
|
426
|
+
accessibilityOptions?: AccessibilityOptions;
|
|
427
|
+
|
|
357
428
|
/**
|
|
358
429
|
* Controls the sheet presentation style on iPad and web (landscape/tablet).
|
|
359
430
|
* - `'page'`: bottom-attached page sheet (full or readable width).
|
package/src/TrueSheet.web.tsx
CHANGED
|
@@ -10,12 +10,9 @@ import {
|
|
|
10
10
|
useRef,
|
|
11
11
|
useState,
|
|
12
12
|
} from 'react';
|
|
13
|
-
import { View, useColorScheme, useWindowDimensions } from 'react-native';
|
|
14
13
|
import type { LayoutChangeEvent } from 'react-native';
|
|
14
|
+
import { useColorScheme, useWindowDimensions, View } from 'react-native';
|
|
15
15
|
|
|
16
|
-
import { Drawer } from './web/vaul';
|
|
17
|
-
import { DEFAULT_PEEK_HEIGHT, TRANSITIONS } from './web/vaul/constants';
|
|
18
|
-
import { TrueSheetPeekContext } from './TrueSheetPeek.web';
|
|
19
16
|
import type {
|
|
20
17
|
DetentChangeEvent,
|
|
21
18
|
DetentInfoEventPayload,
|
|
@@ -37,6 +34,7 @@ import type {
|
|
|
37
34
|
WillFocusEvent,
|
|
38
35
|
WillPresentEvent,
|
|
39
36
|
} from './TrueSheet.types';
|
|
37
|
+
import { measurePeekContentHeight, TrueSheetPeekContext } from './TrueSheetPeek.web';
|
|
40
38
|
import { usePortalContainer, useRegisterSheet, useSheetStack } from './TrueSheetProvider.web';
|
|
41
39
|
import {
|
|
42
40
|
COLOR_SURFACE_CONTAINER_LOW_DARK,
|
|
@@ -44,15 +42,17 @@ import {
|
|
|
44
42
|
DEFAULT_ANCHOR_OFFSET,
|
|
45
43
|
DEFAULT_CORNER_RADIUS,
|
|
46
44
|
DEFAULT_DETACHED_OFFSET,
|
|
45
|
+
DEFAULT_FORM_SHEET_HEIGHT_RATIO,
|
|
46
|
+
DEFAULT_FORM_SHEET_WIDTH,
|
|
47
47
|
DEFAULT_GRABBER_COLOR_DARK,
|
|
48
48
|
DEFAULT_GRABBER_COLOR_LIGHT,
|
|
49
49
|
DEFAULT_GRABBER_HEIGHT,
|
|
50
50
|
DEFAULT_GRABBER_TOP_MARGIN,
|
|
51
51
|
DEFAULT_GRABBER_WIDTH,
|
|
52
|
-
DEFAULT_FORM_SHEET_HEIGHT_RATIO,
|
|
53
|
-
DEFAULT_FORM_SHEET_WIDTH,
|
|
54
52
|
DEFAULT_MAX_WIDTH,
|
|
55
53
|
} from './web/constants';
|
|
54
|
+
import { Drawer } from './web/vaul';
|
|
55
|
+
import { DEFAULT_PEEK_HEIGHT, TRANSITIONS } from './web/vaul/constants';
|
|
56
56
|
|
|
57
57
|
const TrueSheetComponent = forwardRef<TrueSheetMethods, TrueSheetProps>((props, ref) => {
|
|
58
58
|
const {
|
|
@@ -69,6 +69,7 @@ const TrueSheetComponent = forwardRef<TrueSheetMethods, TrueSheetProps>((props,
|
|
|
69
69
|
anchorOffset = DEFAULT_ANCHOR_OFFSET,
|
|
70
70
|
grabber = true,
|
|
71
71
|
grabberOptions,
|
|
72
|
+
accessibilityOptions,
|
|
72
73
|
detents = [0.5, 1],
|
|
73
74
|
dimmed = true,
|
|
74
75
|
dimmedDetentIndex = 0,
|
|
@@ -256,7 +257,8 @@ const TrueSheetComponent = forwardRef<TrueSheetMethods, TrueSheetProps>((props,
|
|
|
256
257
|
// within the content — measured by the peek against `contentRef`.
|
|
257
258
|
const [peekContentHeight, setPeekContentHeight] = useState(0);
|
|
258
259
|
const contentRef = useRef<View>(null);
|
|
259
|
-
const
|
|
260
|
+
const peekElRef = useRef<View>(null);
|
|
261
|
+
const peekContext = useMemo(() => ({ contentRef, peekRef: peekElRef, setPeekContentHeight }), []);
|
|
260
262
|
|
|
261
263
|
const peekHeight =
|
|
262
264
|
(header ? headerHeight : 0) + (footer ? footerHeight : 0) + peekContentHeight ||
|
|
@@ -383,11 +385,14 @@ const TrueSheetComponent = forwardRef<TrueSheetMethods, TrueSheetProps>((props,
|
|
|
383
385
|
// measurable here; fall back to the state value when they're absent.
|
|
384
386
|
const headerEl = headerElRef.current as unknown as HTMLElement | null;
|
|
385
387
|
const footerEl = footerElRef.current as unknown as HTMLElement | null;
|
|
388
|
+
const peekEl = peekElRef.current as unknown as HTMLElement | null;
|
|
389
|
+
const contentEl = contentRef.current as unknown as HTMLElement | null;
|
|
390
|
+
const livePeekContentHeight =
|
|
391
|
+
peekEl && contentEl ? measurePeekContentHeight(peekEl, contentEl) : inputs.peekContentHeight;
|
|
386
392
|
const livePeekHeight =
|
|
387
|
-
headerEl || footerEl
|
|
388
|
-
? (headerEl?.offsetHeight ?? 0) +
|
|
389
|
-
|
|
390
|
-
inputs.peekContentHeight || DEFAULT_PEEK_HEIGHT
|
|
393
|
+
headerEl || footerEl || peekEl
|
|
394
|
+
? (headerEl?.offsetHeight ?? 0) + (footerEl?.offsetHeight ?? 0) + livePeekContentHeight ||
|
|
395
|
+
DEFAULT_PEEK_HEIGHT
|
|
391
396
|
: inputs.peekHeight;
|
|
392
397
|
|
|
393
398
|
const positions: number[] = [];
|
|
@@ -678,10 +683,11 @@ const TrueSheetComponent = forwardRef<TrueSheetMethods, TrueSheetProps>((props,
|
|
|
678
683
|
// own child didn't move (e.g., child skipped its cascade for a page
|
|
679
684
|
// grandchild) — leaving a visible gap between this sheet and its child.
|
|
680
685
|
const computeTargetY = () => {
|
|
681
|
-
const parentSnap =
|
|
686
|
+
const parentSnap =
|
|
687
|
+
Number.parseFloat(parent.style.getPropertyValue('--snap-point-height')) || 0;
|
|
682
688
|
const node = descendants[0]?.nodeRef.current;
|
|
683
689
|
if (!node) return parentSnap;
|
|
684
|
-
const childSnap = parseFloat(node.style.getPropertyValue('--snap-point-height')) || 0;
|
|
690
|
+
const childSnap = Number.parseFloat(node.style.getPropertyValue('--snap-point-height')) || 0;
|
|
685
691
|
return Math.max(parentSnap, childSnap);
|
|
686
692
|
};
|
|
687
693
|
|
|
@@ -700,9 +706,10 @@ const TrueSheetComponent = forwardRef<TrueSheetMethods, TrueSheetProps>((props,
|
|
|
700
706
|
const childDrawer = form.nodeRef.current;
|
|
701
707
|
const childWrapper = childDrawer?.closest<HTMLElement>('[data-vaul-detached-wrapper]');
|
|
702
708
|
if (!parentWrapper || !childDrawer || !childWrapper) return;
|
|
703
|
-
const snapY =
|
|
704
|
-
|
|
705
|
-
const
|
|
709
|
+
const snapY =
|
|
710
|
+
Number.parseFloat(childDrawer.style.getPropertyValue('--snap-point-height')) || 0;
|
|
711
|
+
const childBottomGap = Number.parseFloat(childWrapper.style.bottom) || 0;
|
|
712
|
+
const childMaxW = Number.parseFloat(childWrapper.style.maxWidth) || window.innerWidth;
|
|
706
713
|
const formLeft = (window.innerWidth - childMaxW) / 2;
|
|
707
714
|
const formRight = (window.innerWidth + childMaxW) / 2;
|
|
708
715
|
const formBottom = window.innerHeight - childBottomGap;
|
|
@@ -728,7 +735,7 @@ const TrueSheetComponent = forwardRef<TrueSheetMethods, TrueSheetProps>((props,
|
|
|
728
735
|
}
|
|
729
736
|
const targetY = computeTargetY();
|
|
730
737
|
const match = parent.style.transform.match(/translate3d\([^,]*,\s*(-?\d*\.?\d+)px/);
|
|
731
|
-
const currentY = match ? parseFloat(match[1]!) : 0;
|
|
738
|
+
const currentY = match ? Number.parseFloat(match[1]!) : 0;
|
|
732
739
|
if (Math.abs(currentY - targetY) < 0.5) return;
|
|
733
740
|
parent.style.transition = transition;
|
|
734
741
|
parent.style.transform = `translate3d(0, ${targetY}px, 0)`;
|
|
@@ -993,7 +1000,9 @@ const TrueSheetComponent = forwardRef<TrueSheetMethods, TrueSheetProps>((props,
|
|
|
993
1000
|
) : undefined
|
|
994
1001
|
}
|
|
995
1002
|
>
|
|
996
|
-
<Drawer.Title style={visuallyHiddenStyle}>
|
|
1003
|
+
<Drawer.Title style={visuallyHiddenStyle}>
|
|
1004
|
+
{accessibilityOptions?.paneTitle ?? 'Sheet'}
|
|
1005
|
+
</Drawer.Title>
|
|
997
1006
|
{grabber && <Drawer.Handle style={handleStyle} />}
|
|
998
1007
|
{scrollable ? (
|
|
999
1008
|
// vaul wraps children in `[data-vaul-auto-size-wrapper]` (display:
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { createContext, useContext, useEffect, useRef
|
|
2
|
-
import {
|
|
1
|
+
import { createContext, type RefObject, useContext, useEffect, useRef } from 'react';
|
|
2
|
+
import { type LayoutChangeEvent, View, type ViewProps } from 'react-native';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Reports the measured peek content height to the owning TrueSheet.
|
|
@@ -7,11 +7,25 @@ import { View, type LayoutChangeEvent, type ViewProps } from 'react-native';
|
|
|
7
7
|
*/
|
|
8
8
|
export interface TrueSheetPeekContextValue {
|
|
9
9
|
contentRef: RefObject<View | null>;
|
|
10
|
+
peekRef: RefObject<View | null>;
|
|
10
11
|
setPeekContentHeight: (height: number) => void;
|
|
11
12
|
}
|
|
12
13
|
|
|
13
14
|
export const TrueSheetPeekContext = createContext<TrueSheetPeekContextValue | null>(null);
|
|
14
15
|
|
|
16
|
+
/**
|
|
17
|
+
* Distance from the top of the content view to the bottom of the peek view,
|
|
18
|
+
* so the peek view's offset within the content (padding, views above it)
|
|
19
|
+
* counts toward the peek detent. Both rects live in the drawer's transformed
|
|
20
|
+
* subtree, so an in-flight translate cancels out of the delta.
|
|
21
|
+
* @internal
|
|
22
|
+
*/
|
|
23
|
+
export const measurePeekContentHeight = (
|
|
24
|
+
peekElement: HTMLElement,
|
|
25
|
+
contentElement: HTMLElement
|
|
26
|
+
): number =>
|
|
27
|
+
peekElement.getBoundingClientRect().bottom - contentElement.getBoundingClientRect().top;
|
|
28
|
+
|
|
15
29
|
/**
|
|
16
30
|
* Wrapper component that marks its children as the sheet's peek content.
|
|
17
31
|
* When rendered within a `TrueSheet`, the `"peek"` detent reveals everything
|
|
@@ -20,7 +34,11 @@ export const TrueSheetPeekContext = createContext<TrueSheetPeekContextValue | nu
|
|
|
20
34
|
*/
|
|
21
35
|
export const TrueSheetPeek = ({ onLayout, ...rest }: ViewProps) => {
|
|
22
36
|
const context = useContext(TrueSheetPeekContext);
|
|
23
|
-
const
|
|
37
|
+
const localRef = useRef<View>(null);
|
|
38
|
+
|
|
39
|
+
// Register into the sheet's peek ref so it can measure the peek live
|
|
40
|
+
// during detent geometry computation (state lags the first willPresent).
|
|
41
|
+
const viewRef = context?.peekRef ?? localRef;
|
|
24
42
|
|
|
25
43
|
useEffect(() => () => context?.setPeekContentHeight(0), [context]);
|
|
26
44
|
|
|
@@ -30,12 +48,9 @@ export const TrueSheetPeek = ({ onLayout, ...rest }: ViewProps) => {
|
|
|
30
48
|
const peekElement = viewRef.current as unknown as HTMLElement | null;
|
|
31
49
|
const contentElement = context.contentRef.current as unknown as HTMLElement | null;
|
|
32
50
|
|
|
33
|
-
// Distance from the top of the content view to the bottom of the peek view,
|
|
34
|
-
// so the peek view's offset within the content (padding, views above it)
|
|
35
|
-
// counts toward the peek detent.
|
|
36
51
|
const bottom =
|
|
37
52
|
peekElement && contentElement
|
|
38
|
-
? peekElement
|
|
53
|
+
? measurePeekContentHeight(peekElement, contentElement)
|
|
39
54
|
: event.nativeEvent.layout.height;
|
|
40
55
|
|
|
41
56
|
context.setPeekContentHeight(bottom);
|
|
@@ -16,6 +16,17 @@ type GrabberOptionsType = Readonly<{
|
|
|
16
16
|
adaptive?: WithDefault<boolean, true>;
|
|
17
17
|
}>;
|
|
18
18
|
|
|
19
|
+
type AccessibilityOptionsType = Readonly<{
|
|
20
|
+
grabberLabel?: WithDefault<string, 'Sheet Grabber'>;
|
|
21
|
+
grabberHint?: WithDefault<string, 'Double-tap to expand. Swipe up or down to resize the sheet'>;
|
|
22
|
+
expandedValue?: WithDefault<string, 'Expanded'>;
|
|
23
|
+
collapsedValue?: WithDefault<string, 'Collapsed'>;
|
|
24
|
+
detentValue?: WithDefault<string, 'Detent {index} of {count}'>;
|
|
25
|
+
expandActionLabel?: WithDefault<string, 'Expand'>;
|
|
26
|
+
collapseActionLabel?: WithDefault<string, 'Collapse'>;
|
|
27
|
+
paneTitle?: WithDefault<string, 'Bottom sheet'>;
|
|
28
|
+
}>;
|
|
29
|
+
|
|
19
30
|
type BlurOptionsType = Readonly<{
|
|
20
31
|
intensity?: WithDefault<Double, -1>;
|
|
21
32
|
interaction?: WithDefault<boolean, true>;
|
|
@@ -99,6 +110,7 @@ export interface NativeProps extends ViewProps {
|
|
|
99
110
|
// Boolean properties - match defaults from TrueSheet.types.ts
|
|
100
111
|
grabber?: WithDefault<boolean, true>;
|
|
101
112
|
grabberOptions?: GrabberOptionsType;
|
|
113
|
+
accessibilityOptions?: AccessibilityOptionsType;
|
|
102
114
|
dismissible?: WithDefault<boolean, true>;
|
|
103
115
|
draggable?: WithDefault<boolean, true>;
|
|
104
116
|
dimmed?: WithDefault<boolean, true>;
|