@umituz/react-native-bottom-sheet 1.0.0 → 1.0.1
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/package.json +6 -7
- package/src/presentation/components/BottomSheet.tsx +1 -1
- package/lib/domain/entities/BottomSheet.d.ts +0 -113
- package/lib/domain/entities/BottomSheet.d.ts.map +0 -1
- package/lib/domain/entities/BottomSheet.js +0 -125
- package/lib/domain/entities/BottomSheet.js.map +0 -1
- package/lib/index.d.ts +0 -75
- package/lib/index.d.ts.map +0 -1
- package/lib/index.js +0 -76
- package/lib/index.js.map +0 -1
- package/lib/presentation/components/BottomSheet.d.ts +0 -107
- package/lib/presentation/components/BottomSheet.d.ts.map +0 -1
- package/lib/presentation/components/BottomSheet.js +0 -108
- package/lib/presentation/components/BottomSheet.js.map +0 -1
- package/lib/presentation/hooks/useBottomSheet.d.ts +0 -70
- package/lib/presentation/hooks/useBottomSheet.d.ts.map +0 -1
- package/lib/presentation/hooks/useBottomSheet.js +0 -84
- package/lib/presentation/hooks/useBottomSheet.js.map +0 -1
package/package.json
CHANGED
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umituz/react-native-bottom-sheet",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1",
|
|
4
4
|
"description": "Modern, performant bottom sheets for React Native with preset configurations, keyboard handling, and smooth animations",
|
|
5
|
-
"main": "./
|
|
6
|
-
"types": "./
|
|
5
|
+
"main": "./src/index.ts",
|
|
6
|
+
"types": "./src/index.ts",
|
|
7
7
|
"scripts": {
|
|
8
8
|
"build": "tsc",
|
|
9
9
|
"typecheck": "tsc --noEmit",
|
|
10
10
|
"lint": "tsc --noEmit",
|
|
11
11
|
"clean": "rm -rf lib",
|
|
12
12
|
"prebuild": "npm run clean",
|
|
13
|
-
"prepublishOnly": "npm run build",
|
|
14
13
|
"version:patch": "npm version patch -m 'chore: release v%s'",
|
|
15
14
|
"version:minor": "npm version minor -m 'chore: release v%s'",
|
|
16
15
|
"version:major": "npm version major -m 'chore: release v%s'"
|
|
@@ -23,7 +22,7 @@
|
|
|
23
22
|
"reanimated",
|
|
24
23
|
"gesture-handler"
|
|
25
24
|
],
|
|
26
|
-
"author": "
|
|
25
|
+
"author": "\u00dcmit UZ <umit@umituz.com>",
|
|
27
26
|
"license": "MIT",
|
|
28
27
|
"repository": {
|
|
29
28
|
"type": "git",
|
|
@@ -32,6 +31,7 @@
|
|
|
32
31
|
"peerDependencies": {
|
|
33
32
|
"@gorhom/bottom-sheet": ">=5.0.0",
|
|
34
33
|
"@umituz/react-native-design-system": "*",
|
|
34
|
+
"@umituz/react-native-theme": "*",
|
|
35
35
|
"react": ">=18.2.0",
|
|
36
36
|
"react-native": ">=0.74.0",
|
|
37
37
|
"react-native-gesture-handler": ">=2.16.0",
|
|
@@ -42,6 +42,7 @@
|
|
|
42
42
|
"@types/react": "^18.2.45",
|
|
43
43
|
"@types/react-native": "^0.73.0",
|
|
44
44
|
"@umituz/react-native-design-system": "latest",
|
|
45
|
+
"@umituz/react-native-theme": "latest",
|
|
45
46
|
"react": "^18.2.0",
|
|
46
47
|
"react-native": "^0.74.0",
|
|
47
48
|
"react-native-gesture-handler": "~2.16.1",
|
|
@@ -52,10 +53,8 @@
|
|
|
52
53
|
"access": "public"
|
|
53
54
|
},
|
|
54
55
|
"files": [
|
|
55
|
-
"lib",
|
|
56
56
|
"src",
|
|
57
57
|
"README.md",
|
|
58
58
|
"LICENSE"
|
|
59
59
|
]
|
|
60
60
|
}
|
|
61
|
-
|
|
@@ -36,7 +36,7 @@ import GorhomBottomSheet, {
|
|
|
36
36
|
BottomSheetBackdrop,
|
|
37
37
|
type BottomSheetBackdropProps,
|
|
38
38
|
} from '@gorhom/bottom-sheet';
|
|
39
|
-
import { useAppDesignTokens } from '@umituz/react-native-
|
|
39
|
+
import { useAppDesignTokens } from '@umituz/react-native-theme';
|
|
40
40
|
import type {
|
|
41
41
|
BottomSheetConfig,
|
|
42
42
|
BottomSheetPreset,
|
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Bottom Sheet Domain - Entity
|
|
3
|
-
*
|
|
4
|
-
* Defines bottom sheet types, snap point configurations, and utilities.
|
|
5
|
-
* Provides a clean abstraction over @gorhom/bottom-sheet library.
|
|
6
|
-
*
|
|
7
|
-
* Features:
|
|
8
|
-
* - Snap point types (percentage, fixed, dynamic)
|
|
9
|
-
* - Pre-built configs (small, medium, large, full)
|
|
10
|
-
* - Backdrop configurations
|
|
11
|
-
* - Animation timing configs
|
|
12
|
-
* - Keyboard behavior options
|
|
13
|
-
*
|
|
14
|
-
* Architecture:
|
|
15
|
-
* - Domain Layer: Pure business logic, no UI dependencies
|
|
16
|
-
* - Factory pattern for config creation
|
|
17
|
-
* - Type-safe snap points and options
|
|
18
|
-
*/
|
|
19
|
-
/**
|
|
20
|
-
* Snap point types for bottom sheet positioning
|
|
21
|
-
*/
|
|
22
|
-
export type SnapPoint = string | number;
|
|
23
|
-
/**
|
|
24
|
-
* Keyboard behavior strategies
|
|
25
|
-
*/
|
|
26
|
-
export type KeyboardBehavior = 'interactive' | 'fillParent' | 'extend';
|
|
27
|
-
/**
|
|
28
|
-
* Bottom sheet preset sizes
|
|
29
|
-
*/
|
|
30
|
-
export type BottomSheetPreset = 'small' | 'medium' | 'large' | 'full';
|
|
31
|
-
/**
|
|
32
|
-
* Bottom sheet configuration interface
|
|
33
|
-
*/
|
|
34
|
-
export interface BottomSheetConfig {
|
|
35
|
-
/**
|
|
36
|
-
* Snap points for the bottom sheet
|
|
37
|
-
* - Percentage: '25%', '50%', '75%'
|
|
38
|
-
* - Fixed: 200, 400, 600
|
|
39
|
-
* - Dynamic: 'CONTENT_HEIGHT'
|
|
40
|
-
*/
|
|
41
|
-
snapPoints: SnapPoint[];
|
|
42
|
-
/**
|
|
43
|
-
* Initial snap point index (default: 0)
|
|
44
|
-
*/
|
|
45
|
-
initialIndex?: number;
|
|
46
|
-
/**
|
|
47
|
-
* Enable backdrop (darkens background)
|
|
48
|
-
*/
|
|
49
|
-
enableBackdrop?: boolean;
|
|
50
|
-
/**
|
|
51
|
-
* Backdrop appears at this snap index (default: 0)
|
|
52
|
-
*/
|
|
53
|
-
backdropAppearsOnIndex?: number;
|
|
54
|
-
/**
|
|
55
|
-
* Backdrop disappears at this snap index (default: -1)
|
|
56
|
-
*/
|
|
57
|
-
backdropDisappearsOnIndex?: number;
|
|
58
|
-
/**
|
|
59
|
-
* Keyboard behavior strategy
|
|
60
|
-
*/
|
|
61
|
-
keyboardBehavior?: KeyboardBehavior;
|
|
62
|
-
/**
|
|
63
|
-
* Enable handle indicator (default: true)
|
|
64
|
-
*/
|
|
65
|
-
enableHandleIndicator?: boolean;
|
|
66
|
-
/**
|
|
67
|
-
* Enable pan down to close (default: true)
|
|
68
|
-
*/
|
|
69
|
-
enablePanDownToClose?: boolean;
|
|
70
|
-
/**
|
|
71
|
-
* Enable dynamic sizing
|
|
72
|
-
*/
|
|
73
|
-
enableDynamicSizing?: boolean;
|
|
74
|
-
}
|
|
75
|
-
/**
|
|
76
|
-
* Backdrop configuration
|
|
77
|
-
*/
|
|
78
|
-
export interface BackdropConfig {
|
|
79
|
-
appearsOnIndex: number;
|
|
80
|
-
disappearsOnIndex: number;
|
|
81
|
-
opacity?: number;
|
|
82
|
-
pressBehavior?: 'none' | 'close' | 'collapse';
|
|
83
|
-
}
|
|
84
|
-
/**
|
|
85
|
-
* Pre-built bottom sheet configurations
|
|
86
|
-
*/
|
|
87
|
-
export declare const BOTTOM_SHEET_PRESETS: Record<BottomSheetPreset, BottomSheetConfig>;
|
|
88
|
-
/**
|
|
89
|
-
* Default bottom sheet configuration
|
|
90
|
-
*/
|
|
91
|
-
export declare const DEFAULT_BOTTOM_SHEET_CONFIG: BottomSheetConfig;
|
|
92
|
-
/**
|
|
93
|
-
* Bottom sheet utilities
|
|
94
|
-
*/
|
|
95
|
-
export declare const BottomSheetUtils: {
|
|
96
|
-
/**
|
|
97
|
-
* Create custom bottom sheet config
|
|
98
|
-
*/
|
|
99
|
-
createConfig: (overrides: Partial<BottomSheetConfig>) => BottomSheetConfig;
|
|
100
|
-
/**
|
|
101
|
-
* Get preset configuration
|
|
102
|
-
*/
|
|
103
|
-
getPreset: (preset: BottomSheetPreset) => BottomSheetConfig;
|
|
104
|
-
/**
|
|
105
|
-
* Validate snap points
|
|
106
|
-
*/
|
|
107
|
-
validateSnapPoints: (snapPoints: SnapPoint[]) => boolean;
|
|
108
|
-
/**
|
|
109
|
-
* Create backdrop config
|
|
110
|
-
*/
|
|
111
|
-
createBackdropConfig: (appearsOnIndex?: number, disappearsOnIndex?: number, opacity?: number) => BackdropConfig;
|
|
112
|
-
};
|
|
113
|
-
//# sourceMappingURL=BottomSheet.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../../src/domain/entities/BottomSheet.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAIH;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAExC;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,aAAa,GAAG,YAAY,GAAG,QAAQ,CAAC;AAEvE;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AAEtE;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;;;;OAKG;IACH,UAAU,EAAE,SAAS,EAAE,CAAC;IAExB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAEhC;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IAEnC;;OAEG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,CAAC;CAC/C;AAED;;GAEG;AACH,eAAO,MAAM,oBAAoB,EAAE,MAAM,CAAC,iBAAiB,EAAE,iBAAiB,CAqC7E,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,2BAA2B,EAAE,iBAUzC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,gBAAgB;IAC3B;;OAEG;8BACuB,OAAO,CAAC,iBAAiB,CAAC,KAAG,iBAAiB;IAOxE;;OAEG;wBACiB,iBAAiB,KAAG,iBAAiB;IAIzD;;OAEG;qCAC8B,SAAS,EAAE,KAAG,OAAO;IAgBtD;;OAEG;4CAEe,MAAM,sBACH,MAAM,YAChB,MAAM,KACd,cAAc;CAQlB,CAAC"}
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Bottom Sheet Domain - Entity
|
|
3
|
-
*
|
|
4
|
-
* Defines bottom sheet types, snap point configurations, and utilities.
|
|
5
|
-
* Provides a clean abstraction over @gorhom/bottom-sheet library.
|
|
6
|
-
*
|
|
7
|
-
* Features:
|
|
8
|
-
* - Snap point types (percentage, fixed, dynamic)
|
|
9
|
-
* - Pre-built configs (small, medium, large, full)
|
|
10
|
-
* - Backdrop configurations
|
|
11
|
-
* - Animation timing configs
|
|
12
|
-
* - Keyboard behavior options
|
|
13
|
-
*
|
|
14
|
-
* Architecture:
|
|
15
|
-
* - Domain Layer: Pure business logic, no UI dependencies
|
|
16
|
-
* - Factory pattern for config creation
|
|
17
|
-
* - Type-safe snap points and options
|
|
18
|
-
*/
|
|
19
|
-
/**
|
|
20
|
-
* Pre-built bottom sheet configurations
|
|
21
|
-
*/
|
|
22
|
-
export const BOTTOM_SHEET_PRESETS = {
|
|
23
|
-
small: {
|
|
24
|
-
snapPoints: ['25%'],
|
|
25
|
-
initialIndex: 0,
|
|
26
|
-
enableBackdrop: true,
|
|
27
|
-
backdropAppearsOnIndex: 0,
|
|
28
|
-
backdropDisappearsOnIndex: -1,
|
|
29
|
-
enableHandleIndicator: true,
|
|
30
|
-
enablePanDownToClose: true,
|
|
31
|
-
},
|
|
32
|
-
medium: {
|
|
33
|
-
snapPoints: ['50%'],
|
|
34
|
-
initialIndex: 0,
|
|
35
|
-
enableBackdrop: true,
|
|
36
|
-
backdropAppearsOnIndex: 0,
|
|
37
|
-
backdropDisappearsOnIndex: -1,
|
|
38
|
-
enableHandleIndicator: true,
|
|
39
|
-
enablePanDownToClose: true,
|
|
40
|
-
},
|
|
41
|
-
large: {
|
|
42
|
-
snapPoints: ['75%'],
|
|
43
|
-
initialIndex: 0,
|
|
44
|
-
enableBackdrop: true,
|
|
45
|
-
backdropAppearsOnIndex: 0,
|
|
46
|
-
backdropDisappearsOnIndex: -1,
|
|
47
|
-
enableHandleIndicator: true,
|
|
48
|
-
enablePanDownToClose: true,
|
|
49
|
-
},
|
|
50
|
-
full: {
|
|
51
|
-
snapPoints: ['25%', '50%', '90%'],
|
|
52
|
-
initialIndex: 1,
|
|
53
|
-
enableBackdrop: true,
|
|
54
|
-
backdropAppearsOnIndex: 2,
|
|
55
|
-
backdropDisappearsOnIndex: 1,
|
|
56
|
-
enableHandleIndicator: true,
|
|
57
|
-
enablePanDownToClose: true,
|
|
58
|
-
},
|
|
59
|
-
};
|
|
60
|
-
/**
|
|
61
|
-
* Default bottom sheet configuration
|
|
62
|
-
*/
|
|
63
|
-
export const DEFAULT_BOTTOM_SHEET_CONFIG = {
|
|
64
|
-
snapPoints: ['50%'],
|
|
65
|
-
initialIndex: 0,
|
|
66
|
-
enableBackdrop: true,
|
|
67
|
-
backdropAppearsOnIndex: 0,
|
|
68
|
-
backdropDisappearsOnIndex: -1,
|
|
69
|
-
keyboardBehavior: 'interactive',
|
|
70
|
-
enableHandleIndicator: true,
|
|
71
|
-
enablePanDownToClose: true,
|
|
72
|
-
enableDynamicSizing: false,
|
|
73
|
-
};
|
|
74
|
-
/**
|
|
75
|
-
* Bottom sheet utilities
|
|
76
|
-
*/
|
|
77
|
-
export const BottomSheetUtils = {
|
|
78
|
-
/**
|
|
79
|
-
* Create custom bottom sheet config
|
|
80
|
-
*/
|
|
81
|
-
createConfig: (overrides) => {
|
|
82
|
-
return {
|
|
83
|
-
...DEFAULT_BOTTOM_SHEET_CONFIG,
|
|
84
|
-
...overrides,
|
|
85
|
-
};
|
|
86
|
-
},
|
|
87
|
-
/**
|
|
88
|
-
* Get preset configuration
|
|
89
|
-
*/
|
|
90
|
-
getPreset: (preset) => {
|
|
91
|
-
return BOTTOM_SHEET_PRESETS[preset];
|
|
92
|
-
},
|
|
93
|
-
/**
|
|
94
|
-
* Validate snap points
|
|
95
|
-
*/
|
|
96
|
-
validateSnapPoints: (snapPoints) => {
|
|
97
|
-
if (snapPoints.length === 0)
|
|
98
|
-
return false;
|
|
99
|
-
return snapPoints.every(point => {
|
|
100
|
-
if (typeof point === 'number')
|
|
101
|
-
return point > 0;
|
|
102
|
-
if (typeof point === 'string') {
|
|
103
|
-
if (point === 'CONTENT_HEIGHT')
|
|
104
|
-
return true;
|
|
105
|
-
if (point.endsWith('%')) {
|
|
106
|
-
const value = parseInt(point);
|
|
107
|
-
return value > 0 && value <= 100;
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
return false;
|
|
111
|
-
});
|
|
112
|
-
},
|
|
113
|
-
/**
|
|
114
|
-
* Create backdrop config
|
|
115
|
-
*/
|
|
116
|
-
createBackdropConfig: (appearsOnIndex = 0, disappearsOnIndex = -1, opacity = 0.5) => {
|
|
117
|
-
return {
|
|
118
|
-
appearsOnIndex,
|
|
119
|
-
disappearsOnIndex,
|
|
120
|
-
opacity,
|
|
121
|
-
pressBehavior: 'close',
|
|
122
|
-
};
|
|
123
|
-
},
|
|
124
|
-
};
|
|
125
|
-
//# sourceMappingURL=BottomSheet.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BottomSheet.js","sourceRoot":"","sources":["../../../src/domain/entities/BottomSheet.ts"],"names":[],"mappings":"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"}
|
package/lib/index.d.ts
DELETED
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Bottom Sheet Domain - Barrel Export
|
|
3
|
-
*
|
|
4
|
-
* Public API for the bottom-sheet domain.
|
|
5
|
-
* Provides modern, performant bottom sheets for React Native.
|
|
6
|
-
*
|
|
7
|
-
* Features:
|
|
8
|
-
* - Preset configurations (small, medium, large, full)
|
|
9
|
-
* - Custom snap points (percentage, fixed, dynamic)
|
|
10
|
-
* - Backdrop with tap-to-close
|
|
11
|
-
* - Keyboard handling (interactive, fillParent, extend)
|
|
12
|
-
* - Theme-aware colors
|
|
13
|
-
* - Handle indicator
|
|
14
|
-
* - Pan down to close
|
|
15
|
-
* - Smooth animations with Reanimated v3
|
|
16
|
-
* - Offline-compatible (100% client-side)
|
|
17
|
-
*
|
|
18
|
-
* Usage:
|
|
19
|
-
* ```tsx
|
|
20
|
-
* import { BottomSheet, useBottomSheet } from '@umituz/react-native-bottom-sheet';
|
|
21
|
-
*
|
|
22
|
-
* const MyScreen = () => {
|
|
23
|
-
* const { sheetRef, open, close } = useBottomSheet();
|
|
24
|
-
*
|
|
25
|
-
* return (
|
|
26
|
-
* <>
|
|
27
|
-
* <Button onPress={open}>Open Sheet</Button>
|
|
28
|
-
* <BottomSheet
|
|
29
|
-
* ref={sheetRef}
|
|
30
|
-
* preset="medium"
|
|
31
|
-
* onClose={() => console.log('Closed')}
|
|
32
|
-
* >
|
|
33
|
-
* <View>
|
|
34
|
-
* <Text>Bottom Sheet Content</Text>
|
|
35
|
-
* </View>
|
|
36
|
-
* </BottomSheet>
|
|
37
|
-
* </>
|
|
38
|
-
* );
|
|
39
|
-
* };
|
|
40
|
-
*
|
|
41
|
-
* // Custom snap points
|
|
42
|
-
* <BottomSheet
|
|
43
|
-
* snapPoints={['25%', '50%', '90%']}
|
|
44
|
-
* initialIndex={1}
|
|
45
|
-
* enableBackdrop
|
|
46
|
-
* >
|
|
47
|
-
* <FilterForm />
|
|
48
|
-
* </BottomSheet>
|
|
49
|
-
*
|
|
50
|
-
* // Keyboard-aware sheet
|
|
51
|
-
* <BottomSheet
|
|
52
|
-
* preset="large"
|
|
53
|
-
* keyboardBehavior="fillParent"
|
|
54
|
-
* >
|
|
55
|
-
* <CommentForm />
|
|
56
|
-
* </BottomSheet>
|
|
57
|
-
* ```
|
|
58
|
-
*
|
|
59
|
-
* Presets:
|
|
60
|
-
* - small: 25% height
|
|
61
|
-
* - medium: 50% height
|
|
62
|
-
* - large: 75% height
|
|
63
|
-
* - full: Multi-snap (25%, 50%, 90%)
|
|
64
|
-
*
|
|
65
|
-
* Technical:
|
|
66
|
-
* - Uses @gorhom/bottom-sheet library
|
|
67
|
-
* - Animated with react-native-reanimated v3
|
|
68
|
-
* - Gesture handling with react-native-gesture-handler
|
|
69
|
-
* - Zero backend dependencies
|
|
70
|
-
*/
|
|
71
|
-
export type { BottomSheetConfig, BottomSheetPreset, SnapPoint, KeyboardBehavior, BackdropConfig, } from './domain/entities/BottomSheet';
|
|
72
|
-
export { BOTTOM_SHEET_PRESETS, DEFAULT_BOTTOM_SHEET_CONFIG, BottomSheetUtils, } from './domain/entities/BottomSheet';
|
|
73
|
-
export { BottomSheet, type BottomSheetProps, type BottomSheetRef, } from './presentation/components/BottomSheet';
|
|
74
|
-
export { useBottomSheet, type UseBottomSheetReturn, } from './presentation/hooks/useBottomSheet';
|
|
75
|
-
//# sourceMappingURL=index.d.ts.map
|
package/lib/index.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqEG;AAGH,YAAY,EACV,iBAAiB,EACjB,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EAChB,cAAc,GACf,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EACL,oBAAoB,EACpB,2BAA2B,EAC3B,gBAAgB,GACjB,MAAM,+BAA+B,CAAC;AAGvC,OAAO,EACL,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,cAAc,GACpB,MAAM,uCAAuC,CAAC;AAG/C,OAAO,EACL,cAAc,EACd,KAAK,oBAAoB,GAC1B,MAAM,qCAAqC,CAAC"}
|
package/lib/index.js
DELETED
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Bottom Sheet Domain - Barrel Export
|
|
3
|
-
*
|
|
4
|
-
* Public API for the bottom-sheet domain.
|
|
5
|
-
* Provides modern, performant bottom sheets for React Native.
|
|
6
|
-
*
|
|
7
|
-
* Features:
|
|
8
|
-
* - Preset configurations (small, medium, large, full)
|
|
9
|
-
* - Custom snap points (percentage, fixed, dynamic)
|
|
10
|
-
* - Backdrop with tap-to-close
|
|
11
|
-
* - Keyboard handling (interactive, fillParent, extend)
|
|
12
|
-
* - Theme-aware colors
|
|
13
|
-
* - Handle indicator
|
|
14
|
-
* - Pan down to close
|
|
15
|
-
* - Smooth animations with Reanimated v3
|
|
16
|
-
* - Offline-compatible (100% client-side)
|
|
17
|
-
*
|
|
18
|
-
* Usage:
|
|
19
|
-
* ```tsx
|
|
20
|
-
* import { BottomSheet, useBottomSheet } from '@umituz/react-native-bottom-sheet';
|
|
21
|
-
*
|
|
22
|
-
* const MyScreen = () => {
|
|
23
|
-
* const { sheetRef, open, close } = useBottomSheet();
|
|
24
|
-
*
|
|
25
|
-
* return (
|
|
26
|
-
* <>
|
|
27
|
-
* <Button onPress={open}>Open Sheet</Button>
|
|
28
|
-
* <BottomSheet
|
|
29
|
-
* ref={sheetRef}
|
|
30
|
-
* preset="medium"
|
|
31
|
-
* onClose={() => console.log('Closed')}
|
|
32
|
-
* >
|
|
33
|
-
* <View>
|
|
34
|
-
* <Text>Bottom Sheet Content</Text>
|
|
35
|
-
* </View>
|
|
36
|
-
* </BottomSheet>
|
|
37
|
-
* </>
|
|
38
|
-
* );
|
|
39
|
-
* };
|
|
40
|
-
*
|
|
41
|
-
* // Custom snap points
|
|
42
|
-
* <BottomSheet
|
|
43
|
-
* snapPoints={['25%', '50%', '90%']}
|
|
44
|
-
* initialIndex={1}
|
|
45
|
-
* enableBackdrop
|
|
46
|
-
* >
|
|
47
|
-
* <FilterForm />
|
|
48
|
-
* </BottomSheet>
|
|
49
|
-
*
|
|
50
|
-
* // Keyboard-aware sheet
|
|
51
|
-
* <BottomSheet
|
|
52
|
-
* preset="large"
|
|
53
|
-
* keyboardBehavior="fillParent"
|
|
54
|
-
* >
|
|
55
|
-
* <CommentForm />
|
|
56
|
-
* </BottomSheet>
|
|
57
|
-
* ```
|
|
58
|
-
*
|
|
59
|
-
* Presets:
|
|
60
|
-
* - small: 25% height
|
|
61
|
-
* - medium: 50% height
|
|
62
|
-
* - large: 75% height
|
|
63
|
-
* - full: Multi-snap (25%, 50%, 90%)
|
|
64
|
-
*
|
|
65
|
-
* Technical:
|
|
66
|
-
* - Uses @gorhom/bottom-sheet library
|
|
67
|
-
* - Animated with react-native-reanimated v3
|
|
68
|
-
* - Gesture handling with react-native-gesture-handler
|
|
69
|
-
* - Zero backend dependencies
|
|
70
|
-
*/
|
|
71
|
-
export { BOTTOM_SHEET_PRESETS, DEFAULT_BOTTOM_SHEET_CONFIG, BottomSheetUtils, } from './domain/entities/BottomSheet';
|
|
72
|
-
// Presentation Components
|
|
73
|
-
export { BottomSheet, } from './presentation/components/BottomSheet';
|
|
74
|
-
// Presentation Hooks
|
|
75
|
-
export { useBottomSheet, } from './presentation/hooks/useBottomSheet';
|
|
76
|
-
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqEG;AAWH,OAAO,EACL,oBAAoB,EACpB,2BAA2B,EAC3B,gBAAgB,GACjB,MAAM,+BAA+B,CAAC;AAEvC,0BAA0B;AAC1B,OAAO,EACL,WAAW,GAGZ,MAAM,uCAAuC,CAAC;AAE/C,qBAAqB;AACrB,OAAO,EACL,cAAc,GAEf,MAAM,qCAAqC,CAAC"}
|
|
@@ -1,107 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Bottom Sheet Component
|
|
3
|
-
*
|
|
4
|
-
* Main bottom sheet wrapper using @gorhom/bottom-sheet library.
|
|
5
|
-
* Provides a clean, theme-aware API for bottom sheets across the app.
|
|
6
|
-
*
|
|
7
|
-
* Features:
|
|
8
|
-
* - Snap point support (percentage, fixed, dynamic)
|
|
9
|
-
* - Backdrop with tap-to-close
|
|
10
|
-
* - Keyboard handling (interactive, fillParent, extend)
|
|
11
|
-
* - Theme-aware colors
|
|
12
|
-
* - Handle indicator
|
|
13
|
-
* - Pan down to close
|
|
14
|
-
* - Smooth animations with Reanimated v3
|
|
15
|
-
*
|
|
16
|
-
* Usage:
|
|
17
|
-
* ```tsx
|
|
18
|
-
* const sheetRef = useRef<BottomSheetRef>(null);
|
|
19
|
-
*
|
|
20
|
-
* <BottomSheet
|
|
21
|
-
* ref={sheetRef}
|
|
22
|
-
* preset="medium"
|
|
23
|
-
* onClose={() => console.log('Closed')}
|
|
24
|
-
* >
|
|
25
|
-
* <View>
|
|
26
|
-
* <Text>Bottom Sheet Content</Text>
|
|
27
|
-
* </View>
|
|
28
|
-
* </BottomSheet>
|
|
29
|
-
* ```
|
|
30
|
-
*/
|
|
31
|
-
import React from 'react';
|
|
32
|
-
import type { BottomSheetPreset, SnapPoint, KeyboardBehavior } from '../../domain/entities/BottomSheet';
|
|
33
|
-
/**
|
|
34
|
-
* Bottom sheet ref methods
|
|
35
|
-
*/
|
|
36
|
-
export interface BottomSheetRef {
|
|
37
|
-
snapToIndex: (index: number) => void;
|
|
38
|
-
snapToPosition: (position: string | number) => void;
|
|
39
|
-
expand: () => void;
|
|
40
|
-
collapse: () => void;
|
|
41
|
-
close: () => void;
|
|
42
|
-
}
|
|
43
|
-
/**
|
|
44
|
-
* Bottom sheet component props
|
|
45
|
-
*/
|
|
46
|
-
export interface BottomSheetProps {
|
|
47
|
-
/**
|
|
48
|
-
* Bottom sheet content
|
|
49
|
-
*/
|
|
50
|
-
children: React.ReactNode;
|
|
51
|
-
/**
|
|
52
|
-
* Preset configuration (small, medium, large, full)
|
|
53
|
-
*/
|
|
54
|
-
preset?: BottomSheetPreset;
|
|
55
|
-
/**
|
|
56
|
-
* Custom snap points (overrides preset)
|
|
57
|
-
*/
|
|
58
|
-
snapPoints?: SnapPoint[];
|
|
59
|
-
/**
|
|
60
|
-
* Initial snap point index
|
|
61
|
-
*/
|
|
62
|
-
initialIndex?: number;
|
|
63
|
-
/**
|
|
64
|
-
* Enable backdrop
|
|
65
|
-
*/
|
|
66
|
-
enableBackdrop?: boolean;
|
|
67
|
-
/**
|
|
68
|
-
* Backdrop appears at this snap index
|
|
69
|
-
*/
|
|
70
|
-
backdropAppearsOnIndex?: number;
|
|
71
|
-
/**
|
|
72
|
-
* Backdrop disappears at this snap index
|
|
73
|
-
*/
|
|
74
|
-
backdropDisappearsOnIndex?: number;
|
|
75
|
-
/**
|
|
76
|
-
* Keyboard behavior strategy
|
|
77
|
-
*/
|
|
78
|
-
keyboardBehavior?: KeyboardBehavior;
|
|
79
|
-
/**
|
|
80
|
-
* Enable handle indicator
|
|
81
|
-
*/
|
|
82
|
-
enableHandleIndicator?: boolean;
|
|
83
|
-
/**
|
|
84
|
-
* Enable pan down to close
|
|
85
|
-
*/
|
|
86
|
-
enablePanDownToClose?: boolean;
|
|
87
|
-
/**
|
|
88
|
-
* Enable dynamic sizing
|
|
89
|
-
*/
|
|
90
|
-
enableDynamicSizing?: boolean;
|
|
91
|
-
/**
|
|
92
|
-
* Callback when sheet changes position
|
|
93
|
-
*/
|
|
94
|
-
onChange?: (index: number) => void;
|
|
95
|
-
/**
|
|
96
|
-
* Callback when sheet closes
|
|
97
|
-
*/
|
|
98
|
-
onClose?: () => void;
|
|
99
|
-
}
|
|
100
|
-
/**
|
|
101
|
-
* Bottom Sheet Component
|
|
102
|
-
*
|
|
103
|
-
* Modern, performant bottom sheet for React Native.
|
|
104
|
-
* Uses @gorhom/bottom-sheet with Reanimated v3.
|
|
105
|
-
*/
|
|
106
|
-
export declare const BottomSheet: React.ForwardRefExoticComponent<BottomSheetProps & React.RefAttributes<BottomSheetRef>>;
|
|
107
|
-
//# sourceMappingURL=BottomSheet.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../../src/presentation/components/BottomSheet.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AAEH,OAAO,KAA2C,MAAM,OAAO,CAAC;AAQhE,OAAO,KAAK,EAEV,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EACjB,MAAM,mCAAmC,CAAC;AAG3C;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,cAAc,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IACpD,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;OAEG;IACH,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAE3B;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,EAAE,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAEhC;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IAEnC;;OAEG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEnC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;;GAKG;AACH,eAAO,MAAM,WAAW,yFAsGvB,CAAC"}
|
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Bottom Sheet Component
|
|
3
|
-
*
|
|
4
|
-
* Main bottom sheet wrapper using @gorhom/bottom-sheet library.
|
|
5
|
-
* Provides a clean, theme-aware API for bottom sheets across the app.
|
|
6
|
-
*
|
|
7
|
-
* Features:
|
|
8
|
-
* - Snap point support (percentage, fixed, dynamic)
|
|
9
|
-
* - Backdrop with tap-to-close
|
|
10
|
-
* - Keyboard handling (interactive, fillParent, extend)
|
|
11
|
-
* - Theme-aware colors
|
|
12
|
-
* - Handle indicator
|
|
13
|
-
* - Pan down to close
|
|
14
|
-
* - Smooth animations with Reanimated v3
|
|
15
|
-
*
|
|
16
|
-
* Usage:
|
|
17
|
-
* ```tsx
|
|
18
|
-
* const sheetRef = useRef<BottomSheetRef>(null);
|
|
19
|
-
*
|
|
20
|
-
* <BottomSheet
|
|
21
|
-
* ref={sheetRef}
|
|
22
|
-
* preset="medium"
|
|
23
|
-
* onClose={() => console.log('Closed')}
|
|
24
|
-
* >
|
|
25
|
-
* <View>
|
|
26
|
-
* <Text>Bottom Sheet Content</Text>
|
|
27
|
-
* </View>
|
|
28
|
-
* </BottomSheet>
|
|
29
|
-
* ```
|
|
30
|
-
*/
|
|
31
|
-
import React, { forwardRef, useCallback, useMemo } from 'react';
|
|
32
|
-
import { StyleSheet } from 'react-native';
|
|
33
|
-
import GorhomBottomSheet, { BottomSheetView, BottomSheetBackdrop, } from '@gorhom/bottom-sheet';
|
|
34
|
-
import { useAppDesignTokens } from '@umituz/react-native-design-system';
|
|
35
|
-
import { BottomSheetUtils } from '../../domain/entities/BottomSheet';
|
|
36
|
-
/**
|
|
37
|
-
* Bottom Sheet Component
|
|
38
|
-
*
|
|
39
|
-
* Modern, performant bottom sheet for React Native.
|
|
40
|
-
* Uses @gorhom/bottom-sheet with Reanimated v3.
|
|
41
|
-
*/
|
|
42
|
-
export const BottomSheet = forwardRef(({ children, preset = 'medium', snapPoints: customSnapPoints, initialIndex, enableBackdrop = true, backdropAppearsOnIndex, backdropDisappearsOnIndex, keyboardBehavior = 'interactive', enableHandleIndicator = true, enablePanDownToClose = true, enableDynamicSizing = false, onChange, onClose, }, ref) => {
|
|
43
|
-
const tokens = useAppDesignTokens();
|
|
44
|
-
// Get configuration from preset or custom
|
|
45
|
-
const config = useMemo(() => {
|
|
46
|
-
if (customSnapPoints) {
|
|
47
|
-
return BottomSheetUtils.createConfig({
|
|
48
|
-
snapPoints: customSnapPoints,
|
|
49
|
-
initialIndex,
|
|
50
|
-
enableBackdrop,
|
|
51
|
-
backdropAppearsOnIndex,
|
|
52
|
-
backdropDisappearsOnIndex,
|
|
53
|
-
keyboardBehavior,
|
|
54
|
-
enableHandleIndicator,
|
|
55
|
-
enablePanDownToClose,
|
|
56
|
-
enableDynamicSizing,
|
|
57
|
-
});
|
|
58
|
-
}
|
|
59
|
-
return BottomSheetUtils.getPreset(preset);
|
|
60
|
-
}, [
|
|
61
|
-
preset,
|
|
62
|
-
customSnapPoints,
|
|
63
|
-
initialIndex,
|
|
64
|
-
enableBackdrop,
|
|
65
|
-
backdropAppearsOnIndex,
|
|
66
|
-
backdropDisappearsOnIndex,
|
|
67
|
-
keyboardBehavior,
|
|
68
|
-
enableHandleIndicator,
|
|
69
|
-
enablePanDownToClose,
|
|
70
|
-
enableDynamicSizing,
|
|
71
|
-
]);
|
|
72
|
-
// Render backdrop component
|
|
73
|
-
const renderBackdrop = useCallback((props) => enableBackdrop ? (<BottomSheetBackdrop {...props} appearsOnIndex={config.backdropAppearsOnIndex ?? 0} disappearsOnIndex={config.backdropDisappearsOnIndex ?? -1} opacity={0.5} pressBehavior="close"/>) : null, [enableBackdrop, config.backdropAppearsOnIndex, config.backdropDisappearsOnIndex]);
|
|
74
|
-
// Handle sheet changes
|
|
75
|
-
const handleSheetChange = useCallback((index) => {
|
|
76
|
-
onChange?.(index);
|
|
77
|
-
if (index === -1) {
|
|
78
|
-
onClose?.();
|
|
79
|
-
}
|
|
80
|
-
}, [onChange, onClose]);
|
|
81
|
-
return (<GorhomBottomSheet ref={ref} index={config.initialIndex ?? 0} snapPoints={config.snapPoints} enableDynamicSizing={config.enableDynamicSizing} backdropComponent={renderBackdrop} keyboardBehavior={config.keyboardBehavior} enableHandlePanningGesture={config.enableHandleIndicator} enablePanDownToClose={config.enablePanDownToClose} onChange={handleSheetChange} backgroundStyle={[
|
|
82
|
-
styles.background,
|
|
83
|
-
{ backgroundColor: tokens.colors.surface },
|
|
84
|
-
]} handleIndicatorStyle={[
|
|
85
|
-
styles.handleIndicator,
|
|
86
|
-
{ backgroundColor: tokens.colors.border },
|
|
87
|
-
]}>
|
|
88
|
-
<BottomSheetView style={styles.contentContainer}>
|
|
89
|
-
{children}
|
|
90
|
-
</BottomSheetView>
|
|
91
|
-
</GorhomBottomSheet>);
|
|
92
|
-
});
|
|
93
|
-
BottomSheet.displayName = 'BottomSheet';
|
|
94
|
-
const styles = StyleSheet.create({
|
|
95
|
-
background: {
|
|
96
|
-
borderTopLeftRadius: 16,
|
|
97
|
-
borderTopRightRadius: 16,
|
|
98
|
-
},
|
|
99
|
-
handleIndicator: {
|
|
100
|
-
width: 40,
|
|
101
|
-
height: 4,
|
|
102
|
-
borderRadius: 2,
|
|
103
|
-
},
|
|
104
|
-
contentContainer: {
|
|
105
|
-
flex: 1,
|
|
106
|
-
},
|
|
107
|
-
});
|
|
108
|
-
//# sourceMappingURL=BottomSheet.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BottomSheet.js","sourceRoot":"","sources":["../../../src/presentation/components/BottomSheet.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* useBottomSheet Hook
|
|
3
|
-
*
|
|
4
|
-
* React hook for managing bottom sheet state and interactions.
|
|
5
|
-
* Provides a clean API for common bottom sheet operations.
|
|
6
|
-
*
|
|
7
|
-
* Features:
|
|
8
|
-
* - Open/close bottom sheet
|
|
9
|
-
* - Snap to specific index
|
|
10
|
-
* - Expand to max height
|
|
11
|
-
* - Collapse to min height
|
|
12
|
-
* - Track current position
|
|
13
|
-
* - Preset configurations
|
|
14
|
-
*
|
|
15
|
-
* Usage:
|
|
16
|
-
* ```tsx
|
|
17
|
-
* const { sheetRef, open, close, expand, collapse } = useBottomSheet();
|
|
18
|
-
*
|
|
19
|
-
* return (
|
|
20
|
-
* <>
|
|
21
|
-
* <Button onPress={open}>Open Sheet</Button>
|
|
22
|
-
* <BottomSheet ref={sheetRef} preset="medium">
|
|
23
|
-
* <Text>Content</Text>
|
|
24
|
-
* </BottomSheet>
|
|
25
|
-
* </>
|
|
26
|
-
* );
|
|
27
|
-
* ```
|
|
28
|
-
*/
|
|
29
|
-
import type { BottomSheetRef } from '../components/BottomSheet';
|
|
30
|
-
/**
|
|
31
|
-
* Return type for useBottomSheet hook
|
|
32
|
-
*/
|
|
33
|
-
export interface UseBottomSheetReturn {
|
|
34
|
-
/**
|
|
35
|
-
* Ref to attach to BottomSheet component
|
|
36
|
-
*/
|
|
37
|
-
sheetRef: React.RefObject<BottomSheetRef>;
|
|
38
|
-
/**
|
|
39
|
-
* Open bottom sheet to initial index
|
|
40
|
-
*/
|
|
41
|
-
open: () => void;
|
|
42
|
-
/**
|
|
43
|
-
* Close bottom sheet completely
|
|
44
|
-
*/
|
|
45
|
-
close: () => void;
|
|
46
|
-
/**
|
|
47
|
-
* Expand to maximum height
|
|
48
|
-
*/
|
|
49
|
-
expand: () => void;
|
|
50
|
-
/**
|
|
51
|
-
* Collapse to minimum height
|
|
52
|
-
*/
|
|
53
|
-
collapse: () => void;
|
|
54
|
-
/**
|
|
55
|
-
* Snap to specific index
|
|
56
|
-
*/
|
|
57
|
-
snapToIndex: (index: number) => void;
|
|
58
|
-
/**
|
|
59
|
-
* Snap to specific position
|
|
60
|
-
*/
|
|
61
|
-
snapToPosition: (position: string | number) => void;
|
|
62
|
-
}
|
|
63
|
-
/**
|
|
64
|
-
* useBottomSheet Hook
|
|
65
|
-
*
|
|
66
|
-
* Hook for managing bottom sheet state and interactions.
|
|
67
|
-
* Provides imperative methods for controlling the sheet.
|
|
68
|
-
*/
|
|
69
|
-
export declare const useBottomSheet: () => UseBottomSheetReturn;
|
|
70
|
-
//# sourceMappingURL=useBottomSheet.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useBottomSheet.d.ts","sourceRoot":"","sources":["../../../src/presentation/hooks/useBottomSheet.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAGH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAEhE;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAE1C;;OAEG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB;;OAEG;IACH,KAAK,EAAE,MAAM,IAAI,CAAC;IAElB;;OAEG;IACH,MAAM,EAAE,MAAM,IAAI,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAErC;;OAEG;IACH,cAAc,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;CACrD;AAED;;;;;GAKG;AACH,eAAO,MAAM,cAAc,QAAO,oBAsDjC,CAAC"}
|
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* useBottomSheet Hook
|
|
3
|
-
*
|
|
4
|
-
* React hook for managing bottom sheet state and interactions.
|
|
5
|
-
* Provides a clean API for common bottom sheet operations.
|
|
6
|
-
*
|
|
7
|
-
* Features:
|
|
8
|
-
* - Open/close bottom sheet
|
|
9
|
-
* - Snap to specific index
|
|
10
|
-
* - Expand to max height
|
|
11
|
-
* - Collapse to min height
|
|
12
|
-
* - Track current position
|
|
13
|
-
* - Preset configurations
|
|
14
|
-
*
|
|
15
|
-
* Usage:
|
|
16
|
-
* ```tsx
|
|
17
|
-
* const { sheetRef, open, close, expand, collapse } = useBottomSheet();
|
|
18
|
-
*
|
|
19
|
-
* return (
|
|
20
|
-
* <>
|
|
21
|
-
* <Button onPress={open}>Open Sheet</Button>
|
|
22
|
-
* <BottomSheet ref={sheetRef} preset="medium">
|
|
23
|
-
* <Text>Content</Text>
|
|
24
|
-
* </BottomSheet>
|
|
25
|
-
* </>
|
|
26
|
-
* );
|
|
27
|
-
* ```
|
|
28
|
-
*/
|
|
29
|
-
import { useRef, useCallback } from 'react';
|
|
30
|
-
/**
|
|
31
|
-
* useBottomSheet Hook
|
|
32
|
-
*
|
|
33
|
-
* Hook for managing bottom sheet state and interactions.
|
|
34
|
-
* Provides imperative methods for controlling the sheet.
|
|
35
|
-
*/
|
|
36
|
-
export const useBottomSheet = () => {
|
|
37
|
-
const sheetRef = useRef(null);
|
|
38
|
-
/**
|
|
39
|
-
* Open bottom sheet to first snap point
|
|
40
|
-
*/
|
|
41
|
-
const open = useCallback(() => {
|
|
42
|
-
sheetRef.current?.snapToIndex(0);
|
|
43
|
-
}, []);
|
|
44
|
-
/**
|
|
45
|
-
* Close bottom sheet completely
|
|
46
|
-
*/
|
|
47
|
-
const close = useCallback(() => {
|
|
48
|
-
sheetRef.current?.close();
|
|
49
|
-
}, []);
|
|
50
|
-
/**
|
|
51
|
-
* Expand to maximum height (last snap point)
|
|
52
|
-
*/
|
|
53
|
-
const expand = useCallback(() => {
|
|
54
|
-
sheetRef.current?.expand();
|
|
55
|
-
}, []);
|
|
56
|
-
/**
|
|
57
|
-
* Collapse to minimum height (first snap point)
|
|
58
|
-
*/
|
|
59
|
-
const collapse = useCallback(() => {
|
|
60
|
-
sheetRef.current?.collapse();
|
|
61
|
-
}, []);
|
|
62
|
-
/**
|
|
63
|
-
* Snap to specific index
|
|
64
|
-
*/
|
|
65
|
-
const snapToIndex = useCallback((index) => {
|
|
66
|
-
sheetRef.current?.snapToIndex(index);
|
|
67
|
-
}, []);
|
|
68
|
-
/**
|
|
69
|
-
* Snap to specific position (percentage or fixed)
|
|
70
|
-
*/
|
|
71
|
-
const snapToPosition = useCallback((position) => {
|
|
72
|
-
sheetRef.current?.snapToPosition(position);
|
|
73
|
-
}, []);
|
|
74
|
-
return {
|
|
75
|
-
sheetRef,
|
|
76
|
-
open,
|
|
77
|
-
close,
|
|
78
|
-
expand,
|
|
79
|
-
collapse,
|
|
80
|
-
snapToIndex,
|
|
81
|
-
snapToPosition,
|
|
82
|
-
};
|
|
83
|
-
};
|
|
84
|
-
//# sourceMappingURL=useBottomSheet.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useBottomSheet.js","sourceRoot":"","sources":["../../../src/presentation/hooks/useBottomSheet.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEH,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AA2C5C;;;;;GAKG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,GAAyB,EAAE;IACvD,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE9C;;OAEG;IACH,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;IACnC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP;;OAEG;IACH,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7B,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAC5B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP;;OAEG;IACH,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,QAAQ,CAAC,OAAO,EAAE,MAAM,EAAE,CAAC;IAC7B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP;;OAEG;IACH,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;QAChC,QAAQ,CAAC,OAAO,EAAE,QAAQ,EAAE,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP;;OAEG;IACH,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,KAAa,EAAE,EAAE;QAChD,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC;IACvC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP;;OAEG;IACH,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,QAAyB,EAAE,EAAE;QAC/D,QAAQ,CAAC,OAAO,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAC7C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,QAAQ;QACR,IAAI;QACJ,KAAK;QACL,MAAM;QACN,QAAQ;QACR,WAAW;QACX,cAAc;KACf,CAAC;AACJ,CAAC,CAAC"}
|