@lodev09/react-native-true-sheet 0.4.5 → 0.5.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/README.md +141 -4
- package/android/src/main/java/com/lodev09/truesheet/TrueSheetView.kt +57 -53
- package/android/src/main/java/com/lodev09/truesheet/core/Events.kt +8 -2
- package/android/src/main/java/com/lodev09/truesheet/core/{SheetBehavior.kt → TrueSheetBehavior.kt} +35 -29
- package/ios/Extensions/UIBlurEffect+withStyle.swift +62 -0
- package/ios/TrueSheetView.swift +48 -13
- package/ios/TrueSheetViewController.swift +51 -6
- package/ios/TrueSheetViewManager.m +3 -0
- package/lib/commonjs/TrueSheet.js +41 -14
- package/lib/commonjs/TrueSheet.js.map +1 -1
- package/lib/module/TrueSheet.js +41 -14
- package/lib/module/TrueSheet.js.map +1 -1
- package/lib/typescript/src/TrueSheet.d.ts +1 -1
- package/lib/typescript/src/TrueSheet.d.ts.map +1 -1
- package/lib/typescript/src/types.d.ts +44 -14
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/package.json +5 -2
- package/src/TrueSheet.tsx +48 -20
- package/src/types.ts +70 -15
|
@@ -18,7 +18,7 @@ struct SizeInfo {
|
|
|
18
18
|
protocol TrueSheetViewControllerDelegate: AnyObject {
|
|
19
19
|
func viewControllerDidChangeWidth(_ width: CGFloat)
|
|
20
20
|
func viewControllerDidDismiss()
|
|
21
|
-
func viewControllerSheetDidChangeSize(_
|
|
21
|
+
func viewControllerSheetDidChangeSize(_ sizeInfo: SizeInfo)
|
|
22
22
|
func viewControllerWillAppear()
|
|
23
23
|
}
|
|
24
24
|
|
|
@@ -32,6 +32,23 @@ class TrueSheetViewController: UIViewController, UISheetPresentationControllerDe
|
|
|
32
32
|
var sizes: [Any] = ["medium", "large"]
|
|
33
33
|
var maxHeight: CGFloat?
|
|
34
34
|
|
|
35
|
+
var cornerRadius: CGFloat? {
|
|
36
|
+
didSet {
|
|
37
|
+
if #available(iOS 15.0, *) {
|
|
38
|
+
sheet?.preferredCornerRadius = cornerRadius
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
var grabber = true {
|
|
44
|
+
didSet {
|
|
45
|
+
if #available(iOS 15.0, *) {
|
|
46
|
+
sheet?.prefersGrabberVisible = grabber
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
var blurView: UIVisualEffectView
|
|
35
52
|
var lastViewWidth: CGFloat = 0
|
|
36
53
|
var detentValues: [String: SizeInfo] = [:]
|
|
37
54
|
|
|
@@ -40,13 +57,41 @@ class TrueSheetViewController: UIViewController, UISheetPresentationControllerDe
|
|
|
40
57
|
return sheetPresentationController
|
|
41
58
|
}
|
|
42
59
|
|
|
60
|
+
@available(iOS 15.0, *)
|
|
61
|
+
var selectedSizeInfo: SizeInfo? {
|
|
62
|
+
guard let rawValue = sheet?.selectedDetentIdentifier?.rawValue else {
|
|
63
|
+
return nil
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
return detentValues[rawValue]
|
|
67
|
+
}
|
|
68
|
+
|
|
43
69
|
// MARK: - Setup
|
|
44
70
|
|
|
71
|
+
init() {
|
|
72
|
+
blurView = UIVisualEffectView()
|
|
73
|
+
|
|
74
|
+
super.init(nibName: nil, bundle: nil)
|
|
75
|
+
|
|
76
|
+
view.addSubview(blurView)
|
|
77
|
+
view.autoresizingMask = [.flexibleHeight, .flexibleWidth]
|
|
78
|
+
|
|
79
|
+
let blurEffect = UIBlurEffect(style: .light)
|
|
80
|
+
blurView.effect = blurEffect
|
|
81
|
+
blurView.frame = view.bounds
|
|
82
|
+
blurView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
@available(*, unavailable)
|
|
86
|
+
required init?(coder _: NSCoder) {
|
|
87
|
+
fatalError("init(coder:) has not been implemented")
|
|
88
|
+
}
|
|
89
|
+
|
|
45
90
|
@available(iOS 15.0, *)
|
|
46
91
|
func sheetPresentationControllerDidChangeSelectedDetentIdentifier(_ sheet: UISheetPresentationController) {
|
|
47
|
-
if let
|
|
48
|
-
let
|
|
49
|
-
delegate?.viewControllerSheetDidChangeSize(
|
|
92
|
+
if let rawValue = sheet.selectedDetentIdentifier?.rawValue,
|
|
93
|
+
let sizeInfo = detentValues[rawValue] {
|
|
94
|
+
delegate?.viewControllerSheetDidChangeSize(sizeInfo)
|
|
50
95
|
}
|
|
51
96
|
}
|
|
52
97
|
|
|
@@ -90,9 +135,9 @@ class TrueSheetViewController: UIViewController, UISheetPresentationControllerDe
|
|
|
90
135
|
}
|
|
91
136
|
|
|
92
137
|
sheet.detents = detents
|
|
93
|
-
sheet.prefersGrabberVisible = true
|
|
94
138
|
sheet.prefersEdgeAttachedInCompactHeight = true
|
|
95
|
-
|
|
139
|
+
sheet.prefersGrabberVisible = grabber
|
|
140
|
+
sheet.preferredCornerRadius = cornerRadius
|
|
96
141
|
|
|
97
142
|
sheet.delegate = self
|
|
98
143
|
|
|
@@ -31,5 +31,8 @@ RCT_EXPORT_VIEW_PROPERTY(onSizeChange, RCTDirectEventBlock)
|
|
|
31
31
|
RCT_EXPORT_VIEW_PROPERTY(scrollableHandle, NSNumber)
|
|
32
32
|
RCT_EXPORT_VIEW_PROPERTY(maxHeight, NSNumber)
|
|
33
33
|
RCT_EXPORT_VIEW_PROPERTY(sizes, NSArray)
|
|
34
|
+
RCT_EXPORT_VIEW_PROPERTY(blurStyle, NSString)
|
|
35
|
+
RCT_EXPORT_VIEW_PROPERTY(cornerRadius, NSNumber)
|
|
36
|
+
RCT_EXPORT_VIEW_PROPERTY(grabber, BOOL)
|
|
34
37
|
|
|
35
38
|
@end
|
|
@@ -9,6 +9,7 @@ var _reactNative = require("react-native");
|
|
|
9
9
|
var _TrueSheetModule = require("./TrueSheetModule");
|
|
10
10
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
11
11
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
12
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
12
13
|
const LINKING_ERROR = `The package '@lodev09/react-native-true-sheet' doesn't seem to be linked. Make sure: \n\n` + _reactNative.Platform.select({
|
|
13
14
|
ios: "- You have run 'pod install'\n",
|
|
14
15
|
default: ''
|
|
@@ -46,8 +47,8 @@ class TrueSheet extends _react.PureComponent {
|
|
|
46
47
|
onSizeChange(event) {
|
|
47
48
|
this.props.onSizeChange?.(event.nativeEvent);
|
|
48
49
|
}
|
|
49
|
-
onPresent() {
|
|
50
|
-
this.props.onPresent?.();
|
|
50
|
+
onPresent(event) {
|
|
51
|
+
this.props.onPresent?.(event.nativeEvent);
|
|
51
52
|
}
|
|
52
53
|
onDismiss() {
|
|
53
54
|
this.props.onDismiss?.();
|
|
@@ -71,31 +72,53 @@ class TrueSheet extends _react.PureComponent {
|
|
|
71
72
|
}
|
|
72
73
|
|
|
73
74
|
/**
|
|
74
|
-
*
|
|
75
|
+
* Dismisses the Sheet
|
|
75
76
|
*/
|
|
76
77
|
async dismiss() {
|
|
77
78
|
await _TrueSheetModule.TrueSheetModule.dismiss(this.handle);
|
|
78
79
|
}
|
|
79
80
|
render() {
|
|
80
|
-
const
|
|
81
|
+
const {
|
|
82
|
+
sizes,
|
|
83
|
+
backgroundColor,
|
|
84
|
+
blurStyle,
|
|
85
|
+
cornerRadius,
|
|
86
|
+
grabber,
|
|
87
|
+
maxHeight,
|
|
88
|
+
FooterComponent,
|
|
89
|
+
testID,
|
|
90
|
+
style,
|
|
91
|
+
children,
|
|
92
|
+
...rest
|
|
93
|
+
} = this.props;
|
|
81
94
|
return /*#__PURE__*/_react.default.createElement(TrueSheetNativeView, {
|
|
82
95
|
ref: this.ref,
|
|
83
96
|
style: $nativeSheet,
|
|
84
97
|
scrollableHandle: this.state.scrollableHandle,
|
|
85
|
-
sizes:
|
|
86
|
-
|
|
98
|
+
sizes: sizes ?? ['medium', 'large'],
|
|
99
|
+
blurStyle: blurStyle,
|
|
100
|
+
cornerRadius: cornerRadius,
|
|
101
|
+
grabber: grabber ?? true,
|
|
102
|
+
maxHeight: maxHeight,
|
|
87
103
|
onPresent: this.onPresent,
|
|
88
104
|
onDismiss: this.onDismiss,
|
|
89
|
-
onSizeChange: this.onSizeChange
|
|
90
|
-
|
|
105
|
+
onSizeChange: this.onSizeChange,
|
|
106
|
+
testID: testID
|
|
107
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
|
|
91
108
|
collapsable: false,
|
|
92
|
-
style: {
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
109
|
+
style: [$sheetWrapper, {
|
|
110
|
+
borderTopLeftRadius: cornerRadius,
|
|
111
|
+
borderTopRightRadius: cornerRadius,
|
|
112
|
+
// Remove backgroundColor if `blurStyle` is set on iOS
|
|
113
|
+
backgroundColor: _reactNative.Platform.select({
|
|
114
|
+
ios: blurStyle ? undefined : backgroundColor ?? 'white',
|
|
115
|
+
android: backgroundColor ?? 'white'
|
|
116
|
+
})
|
|
117
|
+
}]
|
|
118
|
+
}, rest), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
96
119
|
collapsable: false,
|
|
97
|
-
style:
|
|
98
|
-
},
|
|
120
|
+
style: style
|
|
121
|
+
}, children), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
99
122
|
collapsable: false
|
|
100
123
|
}, !!FooterComponent && /*#__PURE__*/_react.default.createElement(FooterComponent, null))));
|
|
101
124
|
}
|
|
@@ -103,6 +126,10 @@ class TrueSheet extends _react.PureComponent {
|
|
|
103
126
|
exports.TrueSheet = TrueSheet;
|
|
104
127
|
const $nativeSheet = {
|
|
105
128
|
position: 'absolute',
|
|
129
|
+
width: 0,
|
|
106
130
|
zIndex: -9999
|
|
107
131
|
};
|
|
132
|
+
const $sheetWrapper = {
|
|
133
|
+
overflow: 'hidden'
|
|
134
|
+
};
|
|
108
135
|
//# sourceMappingURL=TrueSheet.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_TrueSheetModule","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","LINKING_ERROR","Platform","select","ios","ComponentName","TrueSheetNativeView","requireNativeComponent","Error","TrueSheet","PureComponent","displayName","constructor","props","ref","createRef","onDismiss","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_TrueSheetModule","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_extends","assign","bind","target","arguments","length","source","key","apply","LINKING_ERROR","Platform","select","ios","ComponentName","TrueSheetNativeView","requireNativeComponent","Error","TrueSheet","PureComponent","displayName","constructor","props","ref","createRef","onDismiss","onPresent","onSizeChange","state","scrollableHandle","handle","nodeHandle","findNodeHandle","current","updateState","scrollRef","setState","event","nativeEvent","componentDidMount","sizes","console","warn","componentDidUpdate","present","index","TrueSheetModule","dismiss","render","backgroundColor","blurStyle","cornerRadius","grabber","maxHeight","FooterComponent","testID","style","children","rest","createElement","$nativeSheet","View","collapsable","$sheetWrapper","borderTopLeftRadius","borderTopRightRadius","undefined","android","exports","position","width","zIndex","overflow"],"sourceRoot":"../../src","sources":["TrueSheet.tsx"],"mappings":"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","ignoreList":[]}
|
package/lib/module/TrueSheet.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
1
2
|
import React, { PureComponent, createRef } from 'react';
|
|
2
3
|
import { requireNativeComponent, Platform, findNodeHandle, View } from 'react-native';
|
|
3
4
|
import { TrueSheetModule } from './TrueSheetModule';
|
|
@@ -38,8 +39,8 @@ export class TrueSheet extends PureComponent {
|
|
|
38
39
|
onSizeChange(event) {
|
|
39
40
|
this.props.onSizeChange?.(event.nativeEvent);
|
|
40
41
|
}
|
|
41
|
-
onPresent() {
|
|
42
|
-
this.props.onPresent?.();
|
|
42
|
+
onPresent(event) {
|
|
43
|
+
this.props.onPresent?.(event.nativeEvent);
|
|
43
44
|
}
|
|
44
45
|
onDismiss() {
|
|
45
46
|
this.props.onDismiss?.();
|
|
@@ -63,37 +64,63 @@ export class TrueSheet extends PureComponent {
|
|
|
63
64
|
}
|
|
64
65
|
|
|
65
66
|
/**
|
|
66
|
-
*
|
|
67
|
+
* Dismisses the Sheet
|
|
67
68
|
*/
|
|
68
69
|
async dismiss() {
|
|
69
70
|
await TrueSheetModule.dismiss(this.handle);
|
|
70
71
|
}
|
|
71
72
|
render() {
|
|
72
|
-
const
|
|
73
|
+
const {
|
|
74
|
+
sizes,
|
|
75
|
+
backgroundColor,
|
|
76
|
+
blurStyle,
|
|
77
|
+
cornerRadius,
|
|
78
|
+
grabber,
|
|
79
|
+
maxHeight,
|
|
80
|
+
FooterComponent,
|
|
81
|
+
testID,
|
|
82
|
+
style,
|
|
83
|
+
children,
|
|
84
|
+
...rest
|
|
85
|
+
} = this.props;
|
|
73
86
|
return /*#__PURE__*/React.createElement(TrueSheetNativeView, {
|
|
74
87
|
ref: this.ref,
|
|
75
88
|
style: $nativeSheet,
|
|
76
89
|
scrollableHandle: this.state.scrollableHandle,
|
|
77
|
-
sizes:
|
|
78
|
-
|
|
90
|
+
sizes: sizes ?? ['medium', 'large'],
|
|
91
|
+
blurStyle: blurStyle,
|
|
92
|
+
cornerRadius: cornerRadius,
|
|
93
|
+
grabber: grabber ?? true,
|
|
94
|
+
maxHeight: maxHeight,
|
|
79
95
|
onPresent: this.onPresent,
|
|
80
96
|
onDismiss: this.onDismiss,
|
|
81
|
-
onSizeChange: this.onSizeChange
|
|
82
|
-
|
|
97
|
+
onSizeChange: this.onSizeChange,
|
|
98
|
+
testID: testID
|
|
99
|
+
}, /*#__PURE__*/React.createElement(View, _extends({
|
|
83
100
|
collapsable: false,
|
|
84
|
-
style: {
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
101
|
+
style: [$sheetWrapper, {
|
|
102
|
+
borderTopLeftRadius: cornerRadius,
|
|
103
|
+
borderTopRightRadius: cornerRadius,
|
|
104
|
+
// Remove backgroundColor if `blurStyle` is set on iOS
|
|
105
|
+
backgroundColor: Platform.select({
|
|
106
|
+
ios: blurStyle ? undefined : backgroundColor ?? 'white',
|
|
107
|
+
android: backgroundColor ?? 'white'
|
|
108
|
+
})
|
|
109
|
+
}]
|
|
110
|
+
}, rest), /*#__PURE__*/React.createElement(View, {
|
|
88
111
|
collapsable: false,
|
|
89
|
-
style:
|
|
90
|
-
},
|
|
112
|
+
style: style
|
|
113
|
+
}, children), /*#__PURE__*/React.createElement(View, {
|
|
91
114
|
collapsable: false
|
|
92
115
|
}, !!FooterComponent && /*#__PURE__*/React.createElement(FooterComponent, null))));
|
|
93
116
|
}
|
|
94
117
|
}
|
|
95
118
|
const $nativeSheet = {
|
|
96
119
|
position: 'absolute',
|
|
120
|
+
width: 0,
|
|
97
121
|
zIndex: -9999
|
|
98
122
|
};
|
|
123
|
+
const $sheetWrapper = {
|
|
124
|
+
overflow: 'hidden'
|
|
125
|
+
};
|
|
99
126
|
//# sourceMappingURL=TrueSheet.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","PureComponent","createRef","requireNativeComponent","Platform","findNodeHandle","View","TrueSheetModule","LINKING_ERROR","select","ios","default","ComponentName","TrueSheetNativeView","Error","TrueSheet","displayName","constructor","props","ref","onDismiss","bind","onPresent","onSizeChange","state","scrollableHandle","handle","nodeHandle","current","updateState","scrollRef","setState","event","nativeEvent","componentDidMount","sizes","length","console","warn","componentDidUpdate","present","index","dismiss","render","FooterComponent","
|
|
1
|
+
{"version":3,"names":["React","PureComponent","createRef","requireNativeComponent","Platform","findNodeHandle","View","TrueSheetModule","LINKING_ERROR","select","ios","default","ComponentName","TrueSheetNativeView","Error","TrueSheet","displayName","constructor","props","ref","onDismiss","bind","onPresent","onSizeChange","state","scrollableHandle","handle","nodeHandle","current","updateState","scrollRef","setState","event","nativeEvent","componentDidMount","sizes","length","console","warn","componentDidUpdate","present","index","dismiss","render","backgroundColor","blurStyle","cornerRadius","grabber","maxHeight","FooterComponent","testID","style","children","rest","createElement","$nativeSheet","_extends","collapsable","$sheetWrapper","borderTopLeftRadius","borderTopRightRadius","undefined","android","position","width","zIndex","overflow"],"sourceRoot":"../../src","sources":["TrueSheet.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TrueSheet.d.ts","sourceRoot":"","sources":["../../../src/TrueSheet.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAwC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"TrueSheet.d.ts","sourceRoot":"","sources":["../../../src/TrueSheet.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAwC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAWlG,OAAO,KAAK,EAAE,cAAc,EAAY,MAAM,SAAS,CAAA;AAyBvD,UAAU,cAAc;IACtB,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAA;CAChC;AAED,qBAAa,SAAU,SAAQ,aAAa,CAAC,cAAc,EAAE,cAAc,CAAC;IAC1E,WAAW,SAAc;IAEzB,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAsB;gBAE9B,KAAK,EAAE,cAAc;IAcjC,OAAO,KAAK,MAAM,GAOjB;IAED,OAAO,CAAC,WAAW;IAUnB,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,SAAS;IAIjB,iBAAiB,IAAI,IAAI;IAUzB,kBAAkB,IAAI,IAAI;IAI1B;;;OAGG;IACU,OAAO,CAAC,KAAK,GAAE,MAAU;IAItC;;OAEG;IACU,OAAO;IAIpB,MAAM,IAAI,SAAS;CAuDpB"}
|
|
@@ -1,12 +1,20 @@
|
|
|
1
1
|
import type { Component, ComponentType, RefObject } from 'react';
|
|
2
2
|
import type { ColorValue, ViewProps } from 'react-native';
|
|
3
|
-
export interface
|
|
3
|
+
export interface SizeInfo {
|
|
4
4
|
index: number;
|
|
5
5
|
value: number;
|
|
6
6
|
}
|
|
7
|
+
/**
|
|
8
|
+
* Blur style mapped to native values in IOS.
|
|
9
|
+
*
|
|
10
|
+
* @platform ios
|
|
11
|
+
*/
|
|
12
|
+
export type BlurStyle = 'light' | 'dark' | 'default' | 'extraLight' | 'regular' | 'prominent' | 'systemUltraThinMaterial' | 'systemThinMaterial' | 'systemMaterial' | 'systemThickMaterial' | 'systemChromeMaterial' | 'systemUltraThinMaterialLight' | 'systemThinMaterialLight' | 'systemMaterialLight' | 'systemThickMaterialLight' | 'systemChromeMaterialLight' | 'systemUltraThinMaterialDark' | 'systemThinMaterialDark' | 'systemMaterialDark' | 'systemThickMaterialDark' | 'systemChromeMaterialDark';
|
|
7
13
|
/**
|
|
8
14
|
* Supported Sheet size.
|
|
9
|
-
*
|
|
15
|
+
*
|
|
16
|
+
* @platform android
|
|
17
|
+
* @platform ios 15+
|
|
10
18
|
*/
|
|
11
19
|
export type SheetSize =
|
|
12
20
|
/**
|
|
@@ -52,15 +60,6 @@ export type SheetSize =
|
|
|
52
60
|
*/
|
|
53
61
|
| 'large';
|
|
54
62
|
export interface TrueSheetProps extends ViewProps {
|
|
55
|
-
/**
|
|
56
|
-
* Main sheet background color
|
|
57
|
-
*/
|
|
58
|
-
backgroundColor?: ColorValue;
|
|
59
|
-
/**
|
|
60
|
-
* The main scrollable ref that Sheet should handle on IOS.
|
|
61
|
-
* @platform ios
|
|
62
|
-
*/
|
|
63
|
-
scrollRef?: RefObject<Component<unknown>>;
|
|
64
63
|
/**
|
|
65
64
|
* The sizes you want the Sheet to support.
|
|
66
65
|
* Maximum of 3 sizes only; collapsed, half-expanded, expanded.
|
|
@@ -73,6 +72,37 @@ export interface TrueSheetProps extends ViewProps {
|
|
|
73
72
|
* @default ['medium', 'large']
|
|
74
73
|
*/
|
|
75
74
|
sizes?: SheetSize[];
|
|
75
|
+
/**
|
|
76
|
+
* Main sheet background color
|
|
77
|
+
*/
|
|
78
|
+
backgroundColor?: ColorValue;
|
|
79
|
+
/**
|
|
80
|
+
* The sheet corner radius.
|
|
81
|
+
*
|
|
82
|
+
* @platform android
|
|
83
|
+
* @platform ios 15+
|
|
84
|
+
*/
|
|
85
|
+
cornerRadius?: number;
|
|
86
|
+
/**
|
|
87
|
+
* Shows native grabber (or handle) on IOS
|
|
88
|
+
*
|
|
89
|
+
* @platform ios
|
|
90
|
+
* @default true
|
|
91
|
+
*/
|
|
92
|
+
grabber?: boolean;
|
|
93
|
+
/**
|
|
94
|
+
* The blur effect style on iOS.
|
|
95
|
+
* Overrides `backgroundColor` if set.
|
|
96
|
+
*
|
|
97
|
+
* @platform ios
|
|
98
|
+
*/
|
|
99
|
+
blurStyle?: BlurStyle;
|
|
100
|
+
/**
|
|
101
|
+
* The main scrollable ref that Sheet should handle on IOS.
|
|
102
|
+
*
|
|
103
|
+
* @platform ios
|
|
104
|
+
*/
|
|
105
|
+
scrollRef?: RefObject<Component<unknown>>;
|
|
76
106
|
/**
|
|
77
107
|
* Overrides `large` or `100%` height.
|
|
78
108
|
*/
|
|
@@ -83,9 +113,9 @@ export interface TrueSheetProps extends ViewProps {
|
|
|
83
113
|
FooterComponent?: ComponentType<unknown>;
|
|
84
114
|
/**
|
|
85
115
|
* Called when the Sheet has been presented.
|
|
86
|
-
* Comes with the size
|
|
116
|
+
* Comes with the size info.
|
|
87
117
|
*/
|
|
88
|
-
onPresent?: () => void;
|
|
118
|
+
onPresent?: (info: SizeInfo) => void;
|
|
89
119
|
/**
|
|
90
120
|
* Called when the Sheet has been dismissed
|
|
91
121
|
*/
|
|
@@ -94,6 +124,6 @@ export interface TrueSheetProps extends ViewProps {
|
|
|
94
124
|
* Called when the size of the sheet has changed.
|
|
95
125
|
* Either by dragging or programatically.
|
|
96
126
|
*/
|
|
97
|
-
onSizeChange?: (
|
|
127
|
+
onSizeChange?: (info: SizeInfo) => void;
|
|
98
128
|
}
|
|
99
129
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAChE,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAEzD,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAChE,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAEzD,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd;AAED;;;;GAIG;AACH,MAAM,MAAM,SAAS,GACjB,OAAO,GACP,MAAM,GACN,SAAS,GACT,YAAY,GACZ,SAAS,GACT,WAAW,GACX,yBAAyB,GACzB,oBAAoB,GACpB,gBAAgB,GAChB,qBAAqB,GACrB,sBAAsB,GACtB,8BAA8B,GAC9B,yBAAyB,GACzB,qBAAqB,GACrB,0BAA0B,GAC1B,2BAA2B,GAC3B,6BAA6B,GAC7B,wBAAwB,GACxB,oBAAoB,GACpB,yBAAyB,GACzB,0BAA0B,CAAA;AAE9B;;;;;GAKG;AACH,MAAM,MAAM,SAAS;AACnB;;;;;GAKG;AACD,MAAM;AAER;;;;;GAKG;GACD,MAAM;AAER;;;;;GAKG;GACD,GAAG,MAAM,GAAG;AAEd;;;;;GAKG;GACD,OAAO;AAET;;;;;GAKG;GACD,QAAQ;AAEV;;;;;GAKG;GACD,OAAO,CAAA;AAEX,MAAM,WAAW,cAAe,SAAQ,SAAS;IAC/C;;;;;;;;;;OAUG;IACH,KAAK,CAAC,EAAE,SAAS,EAAE,CAAA;IAEnB;;OAEG;IACH,eAAe,CAAC,EAAE,UAAU,CAAA;IAE5B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IAEjB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAA;IAErB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAA;IAEzC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAExC;;;OAGG;IACH,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAA;IAEpC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IAEtB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAA;CACxC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lodev09/react-native-true-sheet",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.5.0",
|
|
4
4
|
"description": "The true native bottom sheet. 💩",
|
|
5
5
|
"main": "lib/commonjs/index",
|
|
6
6
|
"module": "lib/module/index",
|
|
@@ -38,7 +38,10 @@
|
|
|
38
38
|
"keywords": [
|
|
39
39
|
"react-native",
|
|
40
40
|
"ios",
|
|
41
|
-
"android"
|
|
41
|
+
"android",
|
|
42
|
+
"bottom-sheet",
|
|
43
|
+
"native-sheet",
|
|
44
|
+
"sheet"
|
|
42
45
|
],
|
|
43
46
|
"repository": {
|
|
44
47
|
"type": "git",
|
package/src/TrueSheet.tsx
CHANGED
|
@@ -7,10 +7,9 @@ import {
|
|
|
7
7
|
type NativeMethods,
|
|
8
8
|
type ViewStyle,
|
|
9
9
|
type NativeSyntheticEvent,
|
|
10
|
-
type StyleProp,
|
|
11
10
|
} from 'react-native'
|
|
12
11
|
|
|
13
|
-
import type { TrueSheetProps,
|
|
12
|
+
import type { TrueSheetProps, SizeInfo } from './types'
|
|
14
13
|
import { TrueSheetModule } from './TrueSheetModule'
|
|
15
14
|
|
|
16
15
|
const LINKING_ERROR =
|
|
@@ -21,15 +20,10 @@ const LINKING_ERROR =
|
|
|
21
20
|
|
|
22
21
|
const ComponentName = 'TrueSheetView'
|
|
23
22
|
|
|
24
|
-
interface TrueSheetNativeViewProps {
|
|
23
|
+
interface TrueSheetNativeViewProps extends Omit<TrueSheetProps, 'onPresent' | 'onSizeChange'> {
|
|
25
24
|
scrollableHandle: number | null
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
maxHeight?: TrueSheetProps['maxHeight']
|
|
29
|
-
children: ReactNode
|
|
30
|
-
onDismiss: () => void
|
|
31
|
-
onPresent: (event: NativeSyntheticEvent<{ index: number }>) => void
|
|
32
|
-
onSizeChange: (event: NativeSyntheticEvent<SizeChangeEvent>) => void
|
|
25
|
+
onPresent: (event: NativeSyntheticEvent<SizeInfo>) => void
|
|
26
|
+
onSizeChange: (event: NativeSyntheticEvent<SizeInfo>) => void
|
|
33
27
|
}
|
|
34
28
|
|
|
35
29
|
const TrueSheetNativeView = requireNativeComponent<TrueSheetNativeViewProps>(ComponentName)
|
|
@@ -82,12 +76,12 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
|
|
|
82
76
|
})
|
|
83
77
|
}
|
|
84
78
|
|
|
85
|
-
private onSizeChange(event: NativeSyntheticEvent<
|
|
79
|
+
private onSizeChange(event: NativeSyntheticEvent<SizeInfo>) {
|
|
86
80
|
this.props.onSizeChange?.(event.nativeEvent)
|
|
87
81
|
}
|
|
88
82
|
|
|
89
|
-
private onPresent(): void {
|
|
90
|
-
this.props.onPresent?.()
|
|
83
|
+
private onPresent(event: NativeSyntheticEvent<SizeInfo>): void {
|
|
84
|
+
this.props.onPresent?.(event.nativeEvent)
|
|
91
85
|
}
|
|
92
86
|
|
|
93
87
|
private onDismiss(): void {
|
|
@@ -117,32 +111,61 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
|
|
|
117
111
|
}
|
|
118
112
|
|
|
119
113
|
/**
|
|
120
|
-
*
|
|
114
|
+
* Dismisses the Sheet
|
|
121
115
|
*/
|
|
122
116
|
public async dismiss() {
|
|
123
117
|
await TrueSheetModule.dismiss(this.handle)
|
|
124
118
|
}
|
|
125
119
|
|
|
126
120
|
render(): ReactNode {
|
|
127
|
-
const
|
|
121
|
+
const {
|
|
122
|
+
sizes,
|
|
123
|
+
backgroundColor,
|
|
124
|
+
blurStyle,
|
|
125
|
+
cornerRadius,
|
|
126
|
+
grabber,
|
|
127
|
+
maxHeight,
|
|
128
|
+
FooterComponent,
|
|
129
|
+
testID,
|
|
130
|
+
style,
|
|
131
|
+
children,
|
|
132
|
+
...rest
|
|
133
|
+
} = this.props
|
|
128
134
|
|
|
129
135
|
return (
|
|
130
136
|
<TrueSheetNativeView
|
|
131
137
|
ref={this.ref}
|
|
132
138
|
style={$nativeSheet}
|
|
133
139
|
scrollableHandle={this.state.scrollableHandle}
|
|
134
|
-
sizes={
|
|
135
|
-
|
|
140
|
+
sizes={sizes ?? ['medium', 'large']}
|
|
141
|
+
blurStyle={blurStyle}
|
|
142
|
+
cornerRadius={cornerRadius}
|
|
143
|
+
grabber={grabber ?? true}
|
|
144
|
+
maxHeight={maxHeight}
|
|
136
145
|
onPresent={this.onPresent}
|
|
137
146
|
onDismiss={this.onDismiss}
|
|
138
147
|
onSizeChange={this.onSizeChange}
|
|
148
|
+
testID={testID}
|
|
139
149
|
>
|
|
140
150
|
<View
|
|
141
151
|
collapsable={false}
|
|
142
|
-
style={
|
|
152
|
+
style={[
|
|
153
|
+
$sheetWrapper,
|
|
154
|
+
{
|
|
155
|
+
borderTopLeftRadius: cornerRadius,
|
|
156
|
+
borderTopRightRadius: cornerRadius,
|
|
157
|
+
|
|
158
|
+
// Remove backgroundColor if `blurStyle` is set on iOS
|
|
159
|
+
backgroundColor: Platform.select({
|
|
160
|
+
ios: blurStyle ? undefined : backgroundColor ?? 'white',
|
|
161
|
+
android: backgroundColor ?? 'white',
|
|
162
|
+
}),
|
|
163
|
+
},
|
|
164
|
+
]}
|
|
165
|
+
{...rest}
|
|
143
166
|
>
|
|
144
|
-
<View collapsable={false} style={
|
|
145
|
-
{
|
|
167
|
+
<View collapsable={false} style={style}>
|
|
168
|
+
{children}
|
|
146
169
|
</View>
|
|
147
170
|
<View collapsable={false}>{!!FooterComponent && <FooterComponent />}</View>
|
|
148
171
|
</View>
|
|
@@ -153,5 +176,10 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
|
|
|
153
176
|
|
|
154
177
|
const $nativeSheet: ViewStyle = {
|
|
155
178
|
position: 'absolute',
|
|
179
|
+
width: 0,
|
|
156
180
|
zIndex: -9999,
|
|
157
181
|
}
|
|
182
|
+
|
|
183
|
+
const $sheetWrapper: ViewStyle = {
|
|
184
|
+
overflow: 'hidden',
|
|
185
|
+
}
|