@lodev09/react-native-true-sheet 0.5.2 → 0.6.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 +12 -11
- package/ios/Extensions/{UIBlurEffect+withStyle.swift → UIBlurEffect+withTint.swift} +2 -2
- package/ios/TrueSheetView.swift +3 -3
- package/ios/TrueSheetViewController.swift +1 -1
- package/ios/TrueSheetViewManager.m +1 -1
- package/lib/commonjs/TrueSheet.js +21 -13
- package/lib/commonjs/TrueSheet.js.map +1 -1
- package/lib/module/TrueSheet.js +21 -13
- package/lib/module/TrueSheet.js.map +1 -1
- package/lib/typescript/src/TrueSheet.d.ts +6 -1
- package/lib/typescript/src/TrueSheet.d.ts.map +1 -1
- package/lib/typescript/src/types.d.ts +7 -3
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/package.json +2 -2
- package/src/TrueSheet.tsx +34 -22
- package/src/types.ts +8 -3
package/README.md
CHANGED
|
@@ -24,7 +24,7 @@ yarn add @lodev09/react-native-true-sheet
|
|
|
24
24
|
## Usage
|
|
25
25
|
|
|
26
26
|
```ts
|
|
27
|
-
import { TrueSheet } from "@lodev09/react-native-true-sheet"
|
|
27
|
+
import { TrueSheet } from "@lodev09/react-native-true-sheet"
|
|
28
28
|
|
|
29
29
|
// ...
|
|
30
30
|
|
|
@@ -58,9 +58,10 @@ Extended from `ViewProps`
|
|
|
58
58
|
| backgroundColor | `ColorValue` | - | Main sheet background color. | ✅ | ✅ |
|
|
59
59
|
| cornerRadius | `number` | - | The sheet corner radius. | ✅ | ✅ |
|
|
60
60
|
| maxHeight | `number` | - | Overrides `large` or `100%` height. | ✅ | ✅ |
|
|
61
|
+
| contentContainerStyle | `StyleProp<ViewStyle>` | - | Optional content container styles. | ✅ | ✅ |
|
|
61
62
|
| FooterComponent | `ReactNode` | - | A component that floats at the bottom of the Sheet. | ✅ | ✅ |
|
|
62
63
|
| grabber | `boolean` | - | Shows native grabber (or handle) on IOS. | ✅ | |
|
|
63
|
-
|
|
|
64
|
+
| blurTint | [`BlurTint`](#blurTint) | - | The blur effect style on iOS. Overrides `backgroundColor` if set. Example: `light`, `dark`, etc. | ✅ | |
|
|
64
65
|
| scrollRef | `RefObject<...>` | - | The main scrollable ref that Sheet should handle on IOS. | ✅ | |
|
|
65
66
|
|
|
66
67
|
## Methods
|
|
@@ -68,9 +69,8 @@ Extended from `ViewProps`
|
|
|
68
69
|
```ts
|
|
69
70
|
const sheet = useRef<TrueSheet>(null)
|
|
70
71
|
|
|
71
|
-
const
|
|
72
|
-
|
|
73
|
-
sheet.current?.present(1)
|
|
72
|
+
const resize = () => {
|
|
73
|
+
sheet.current?.resize(1)
|
|
74
74
|
}
|
|
75
75
|
|
|
76
76
|
const dismiss = () => {
|
|
@@ -79,7 +79,7 @@ const dismiss = () => {
|
|
|
79
79
|
|
|
80
80
|
return (
|
|
81
81
|
<View>
|
|
82
|
-
<Button onPress={
|
|
82
|
+
<Button onPress={resize} title="Resize to 80%" />
|
|
83
83
|
<Button onPress={dismiss} title="Dimiss" />
|
|
84
84
|
<TrueSheet sizes={['auto', '80%']} ref={sheet}>
|
|
85
85
|
// ...
|
|
@@ -90,7 +90,8 @@ return (
|
|
|
90
90
|
|
|
91
91
|
| Name | Parameters | Description |
|
|
92
92
|
| - | - | - |
|
|
93
|
-
| present | `index: number = 0` | Present the modal sheet
|
|
93
|
+
| present | `index: number = 0` | Present the modal sheet. Optionally accepts a size `index`. See `sizes` prop. |
|
|
94
|
+
| resize | `index: number` | Resizes the Sheet programmatically by `index`. This is an alias of the `present(index)` method. |
|
|
94
95
|
| dismiss | - | Dismisses the Sheet. |
|
|
95
96
|
|
|
96
97
|
## Events
|
|
@@ -109,9 +110,9 @@ return (
|
|
|
109
110
|
|
|
110
111
|
| Name | Parameters | Description |
|
|
111
112
|
| - | - | - |
|
|
112
|
-
| onPresent |
|
|
113
|
+
| onPresent | [`SizeInfo`](#sizeinfo) | Called when the Sheet has been presented. Comes with the size index and value. |
|
|
113
114
|
| onDismiss | - | Called when the Sheet has been dismissed. |
|
|
114
|
-
| onSizeChange | [`SizeInfo`](#sizeinfo) | Called when the size of the sheet has changed. Either by dragging or programatically. |
|
|
115
|
+
| onSizeChange | [`SizeInfo`](#sizeinfo) | Called when the size of the sheet has changed. Either by dragging or presenting programatically. Comes with the size index and value. |
|
|
115
116
|
|
|
116
117
|
## Types
|
|
117
118
|
|
|
@@ -132,12 +133,12 @@ return (
|
|
|
132
133
|
| `${number}%` | Fixed height in % | **_16+_** | ✅ |
|
|
133
134
|
| `small` | Translates to 25% | **_16+_** | ✅ |
|
|
134
135
|
|
|
135
|
-
### `
|
|
136
|
+
### `BlurTint`
|
|
136
137
|
|
|
137
138
|
Blur style mapped to native values in IOS.
|
|
138
139
|
|
|
139
140
|
```ts
|
|
140
|
-
<TrueSheet
|
|
141
|
+
<TrueSheet blurTint="dark">
|
|
141
142
|
// ...
|
|
142
143
|
</TrueSheet>
|
|
143
144
|
```
|
package/ios/TrueSheetView.swift
CHANGED
|
@@ -162,13 +162,13 @@ class TrueSheetView: UIView, RCTInvalidating, TrueSheetViewControllerDelegate {
|
|
|
162
162
|
}
|
|
163
163
|
|
|
164
164
|
@objc
|
|
165
|
-
func
|
|
166
|
-
guard let
|
|
165
|
+
func setBlurTint(_ tint: NSString?) {
|
|
166
|
+
guard let tint else {
|
|
167
167
|
viewController.blurView.effect = nil
|
|
168
168
|
return
|
|
169
169
|
}
|
|
170
170
|
|
|
171
|
-
viewController.blurView.effect = UIBlurEffect(with:
|
|
171
|
+
viewController.blurView.effect = UIBlurEffect(with: tint as String)
|
|
172
172
|
}
|
|
173
173
|
|
|
174
174
|
@objc
|
|
@@ -75,7 +75,7 @@ class TrueSheetViewController: UIViewController, UISheetPresentationControllerDe
|
|
|
75
75
|
|
|
76
76
|
blurView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
|
|
77
77
|
blurView.frame = view.bounds
|
|
78
|
-
|
|
78
|
+
|
|
79
79
|
view.autoresizingMask = [.flexibleHeight, .flexibleWidth]
|
|
80
80
|
view.insertSubview(blurView, at: 0)
|
|
81
81
|
}
|
|
@@ -31,7 +31,7 @@ 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(
|
|
34
|
+
RCT_EXPORT_VIEW_PROPERTY(blurTint, NSString)
|
|
35
35
|
RCT_EXPORT_VIEW_PROPERTY(cornerRadius, NSNumber)
|
|
36
36
|
RCT_EXPORT_VIEW_PROPERTY(grabber, BOOL)
|
|
37
37
|
|
|
@@ -64,13 +64,21 @@ class TrueSheet extends _react.PureComponent {
|
|
|
64
64
|
}
|
|
65
65
|
|
|
66
66
|
/**
|
|
67
|
-
* Present the modal sheet
|
|
67
|
+
* Present the modal sheet. Optionally accepts a size `index`.
|
|
68
68
|
* See `sizes` prop
|
|
69
69
|
*/
|
|
70
70
|
async present(index = 0) {
|
|
71
71
|
await _TrueSheetModule.TrueSheetModule.present(this.handle, index);
|
|
72
72
|
}
|
|
73
73
|
|
|
74
|
+
/**
|
|
75
|
+
* Resizes the Sheet programmatically by `index`.
|
|
76
|
+
* This is an alias of the `present(index)` method.
|
|
77
|
+
*/
|
|
78
|
+
async resize(index) {
|
|
79
|
+
await this.present(index);
|
|
80
|
+
}
|
|
81
|
+
|
|
74
82
|
/**
|
|
75
83
|
* Dismisses the Sheet
|
|
76
84
|
*/
|
|
@@ -81,47 +89,47 @@ class TrueSheet extends _react.PureComponent {
|
|
|
81
89
|
const {
|
|
82
90
|
sizes,
|
|
83
91
|
backgroundColor,
|
|
84
|
-
|
|
92
|
+
blurTint,
|
|
85
93
|
cornerRadius,
|
|
86
94
|
grabber,
|
|
87
95
|
maxHeight,
|
|
88
96
|
FooterComponent,
|
|
89
|
-
testID,
|
|
90
97
|
style,
|
|
98
|
+
contentContainerStyle,
|
|
91
99
|
children,
|
|
92
100
|
...rest
|
|
93
101
|
} = this.props;
|
|
102
|
+
const wrapperBackgroundColor = backgroundColor ?? 'white';
|
|
94
103
|
return /*#__PURE__*/_react.default.createElement(TrueSheetNativeView, {
|
|
95
104
|
ref: this.ref,
|
|
96
105
|
style: $nativeSheet,
|
|
97
106
|
scrollableHandle: this.state.scrollableHandle,
|
|
98
107
|
sizes: sizes ?? ['medium', 'large'],
|
|
99
|
-
|
|
108
|
+
blurTint: blurTint,
|
|
100
109
|
cornerRadius: cornerRadius,
|
|
101
110
|
grabber: grabber ?? true,
|
|
102
111
|
maxHeight: maxHeight,
|
|
103
112
|
onPresent: this.onPresent,
|
|
104
113
|
onDismiss: this.onDismiss,
|
|
105
|
-
onSizeChange: this.onSizeChange
|
|
106
|
-
testID: testID
|
|
114
|
+
onSizeChange: this.onSizeChange
|
|
107
115
|
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
|
|
108
116
|
collapsable: false,
|
|
109
|
-
style: {
|
|
117
|
+
style: [{
|
|
110
118
|
overflow: _reactNative.Platform.select({
|
|
111
119
|
ios: undefined,
|
|
112
120
|
android: 'hidden'
|
|
113
121
|
}),
|
|
114
122
|
borderTopLeftRadius: cornerRadius,
|
|
115
123
|
borderTopRightRadius: cornerRadius,
|
|
116
|
-
// Remove backgroundColor if `
|
|
124
|
+
// Remove backgroundColor if `blurTint` is set on iOS
|
|
117
125
|
backgroundColor: _reactNative.Platform.select({
|
|
118
|
-
ios:
|
|
119
|
-
android:
|
|
126
|
+
ios: blurTint ? undefined : wrapperBackgroundColor,
|
|
127
|
+
android: wrapperBackgroundColor
|
|
120
128
|
})
|
|
121
|
-
}
|
|
129
|
+
}, style]
|
|
122
130
|
}, rest), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
123
131
|
collapsable: false,
|
|
124
|
-
style:
|
|
132
|
+
style: contentContainerStyle
|
|
125
133
|
}, children), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
126
134
|
collapsable: false
|
|
127
135
|
}, !!FooterComponent && /*#__PURE__*/_react.default.createElement(FooterComponent, null))));
|
|
@@ -130,7 +138,7 @@ class TrueSheet extends _react.PureComponent {
|
|
|
130
138
|
exports.TrueSheet = TrueSheet;
|
|
131
139
|
const $nativeSheet = {
|
|
132
140
|
position: 'absolute',
|
|
133
|
-
|
|
141
|
+
left: -9999,
|
|
134
142
|
zIndex: -9999
|
|
135
143
|
};
|
|
136
144
|
//# 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","_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","
|
|
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","resize","dismiss","render","backgroundColor","blurTint","cornerRadius","grabber","maxHeight","FooterComponent","style","contentContainerStyle","children","rest","wrapperBackgroundColor","createElement","$nativeSheet","View","collapsable","overflow","undefined","android","borderTopLeftRadius","borderTopRightRadius","exports","position","left","zIndex"],"sourceRoot":"../../src","sources":["TrueSheet.tsx"],"mappings":"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","ignoreList":[]}
|
package/lib/module/TrueSheet.js
CHANGED
|
@@ -56,13 +56,21 @@ export class TrueSheet extends PureComponent {
|
|
|
56
56
|
}
|
|
57
57
|
|
|
58
58
|
/**
|
|
59
|
-
* Present the modal sheet
|
|
59
|
+
* Present the modal sheet. Optionally accepts a size `index`.
|
|
60
60
|
* See `sizes` prop
|
|
61
61
|
*/
|
|
62
62
|
async present(index = 0) {
|
|
63
63
|
await TrueSheetModule.present(this.handle, index);
|
|
64
64
|
}
|
|
65
65
|
|
|
66
|
+
/**
|
|
67
|
+
* Resizes the Sheet programmatically by `index`.
|
|
68
|
+
* This is an alias of the `present(index)` method.
|
|
69
|
+
*/
|
|
70
|
+
async resize(index) {
|
|
71
|
+
await this.present(index);
|
|
72
|
+
}
|
|
73
|
+
|
|
66
74
|
/**
|
|
67
75
|
* Dismisses the Sheet
|
|
68
76
|
*/
|
|
@@ -73,47 +81,47 @@ export class TrueSheet extends PureComponent {
|
|
|
73
81
|
const {
|
|
74
82
|
sizes,
|
|
75
83
|
backgroundColor,
|
|
76
|
-
|
|
84
|
+
blurTint,
|
|
77
85
|
cornerRadius,
|
|
78
86
|
grabber,
|
|
79
87
|
maxHeight,
|
|
80
88
|
FooterComponent,
|
|
81
|
-
testID,
|
|
82
89
|
style,
|
|
90
|
+
contentContainerStyle,
|
|
83
91
|
children,
|
|
84
92
|
...rest
|
|
85
93
|
} = this.props;
|
|
94
|
+
const wrapperBackgroundColor = backgroundColor ?? 'white';
|
|
86
95
|
return /*#__PURE__*/React.createElement(TrueSheetNativeView, {
|
|
87
96
|
ref: this.ref,
|
|
88
97
|
style: $nativeSheet,
|
|
89
98
|
scrollableHandle: this.state.scrollableHandle,
|
|
90
99
|
sizes: sizes ?? ['medium', 'large'],
|
|
91
|
-
|
|
100
|
+
blurTint: blurTint,
|
|
92
101
|
cornerRadius: cornerRadius,
|
|
93
102
|
grabber: grabber ?? true,
|
|
94
103
|
maxHeight: maxHeight,
|
|
95
104
|
onPresent: this.onPresent,
|
|
96
105
|
onDismiss: this.onDismiss,
|
|
97
|
-
onSizeChange: this.onSizeChange
|
|
98
|
-
testID: testID
|
|
106
|
+
onSizeChange: this.onSizeChange
|
|
99
107
|
}, /*#__PURE__*/React.createElement(View, _extends({
|
|
100
108
|
collapsable: false,
|
|
101
|
-
style: {
|
|
109
|
+
style: [{
|
|
102
110
|
overflow: Platform.select({
|
|
103
111
|
ios: undefined,
|
|
104
112
|
android: 'hidden'
|
|
105
113
|
}),
|
|
106
114
|
borderTopLeftRadius: cornerRadius,
|
|
107
115
|
borderTopRightRadius: cornerRadius,
|
|
108
|
-
// Remove backgroundColor if `
|
|
116
|
+
// Remove backgroundColor if `blurTint` is set on iOS
|
|
109
117
|
backgroundColor: Platform.select({
|
|
110
|
-
ios:
|
|
111
|
-
android:
|
|
118
|
+
ios: blurTint ? undefined : wrapperBackgroundColor,
|
|
119
|
+
android: wrapperBackgroundColor
|
|
112
120
|
})
|
|
113
|
-
}
|
|
121
|
+
}, style]
|
|
114
122
|
}, rest), /*#__PURE__*/React.createElement(View, {
|
|
115
123
|
collapsable: false,
|
|
116
|
-
style:
|
|
124
|
+
style: contentContainerStyle
|
|
117
125
|
}, children), /*#__PURE__*/React.createElement(View, {
|
|
118
126
|
collapsable: false
|
|
119
127
|
}, !!FooterComponent && /*#__PURE__*/React.createElement(FooterComponent, null))));
|
|
@@ -121,7 +129,7 @@ export class TrueSheet extends PureComponent {
|
|
|
121
129
|
}
|
|
122
130
|
const $nativeSheet = {
|
|
123
131
|
position: 'absolute',
|
|
124
|
-
|
|
132
|
+
left: -9999,
|
|
125
133
|
zIndex: -9999
|
|
126
134
|
};
|
|
127
135
|
//# 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","backgroundColor","
|
|
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","resize","dismiss","render","backgroundColor","blurTint","cornerRadius","grabber","maxHeight","FooterComponent","style","contentContainerStyle","children","rest","wrapperBackgroundColor","createElement","$nativeSheet","_extends","collapsable","overflow","undefined","android","borderTopLeftRadius","borderTopRightRadius","position","left","zIndex"],"sourceRoot":"../../src","sources":["TrueSheet.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -15,10 +15,15 @@ export declare class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetSt
|
|
|
15
15
|
componentDidMount(): void;
|
|
16
16
|
componentDidUpdate(): void;
|
|
17
17
|
/**
|
|
18
|
-
* Present the modal sheet
|
|
18
|
+
* Present the modal sheet. Optionally accepts a size `index`.
|
|
19
19
|
* See `sizes` prop
|
|
20
20
|
*/
|
|
21
21
|
present(index?: number): Promise<void>;
|
|
22
|
+
/**
|
|
23
|
+
* Resizes the Sheet programmatically by `index`.
|
|
24
|
+
* This is an alias of the `present(index)` method.
|
|
25
|
+
*/
|
|
26
|
+
resize(index: number): Promise<void>;
|
|
22
27
|
/**
|
|
23
28
|
* Dismisses the Sheet
|
|
24
29
|
*/
|
|
@@ -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;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;
|
|
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,GAAG,OAAO,CAAC,IAAI,CAAC;IAItD;;;OAGG;IACU,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAIjD;;OAEG;IACU,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC;IAIrC,MAAM,IAAI,SAAS;CAyDpB"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { Component, ComponentType, RefObject } from 'react';
|
|
2
|
-
import type { ColorValue, ViewProps } from 'react-native';
|
|
2
|
+
import type { ColorValue, StyleProp, ViewProps, ViewStyle } from 'react-native';
|
|
3
3
|
export interface SizeInfo {
|
|
4
4
|
index: number;
|
|
5
5
|
value: number;
|
|
@@ -9,7 +9,7 @@ export interface SizeInfo {
|
|
|
9
9
|
*
|
|
10
10
|
* @platform ios
|
|
11
11
|
*/
|
|
12
|
-
export type
|
|
12
|
+
export type BlurTint = 'light' | 'dark' | 'default' | 'extraLight' | 'regular' | 'prominent' | 'systemUltraThinMaterial' | 'systemThinMaterial' | 'systemMaterial' | 'systemThickMaterial' | 'systemChromeMaterial' | 'systemUltraThinMaterialLight' | 'systemThinMaterialLight' | 'systemMaterialLight' | 'systemThickMaterialLight' | 'systemChromeMaterialLight' | 'systemUltraThinMaterialDark' | 'systemThinMaterialDark' | 'systemMaterialDark' | 'systemThickMaterialDark' | 'systemChromeMaterialDark';
|
|
13
13
|
/**
|
|
14
14
|
* Supported Sheet size.
|
|
15
15
|
*
|
|
@@ -96,7 +96,11 @@ export interface TrueSheetProps extends ViewProps {
|
|
|
96
96
|
*
|
|
97
97
|
* @platform ios
|
|
98
98
|
*/
|
|
99
|
-
|
|
99
|
+
blurTint?: BlurTint;
|
|
100
|
+
/**
|
|
101
|
+
* Optional content container styles.
|
|
102
|
+
*/
|
|
103
|
+
contentContainerStyle?: StyleProp<ViewStyle>;
|
|
100
104
|
/**
|
|
101
105
|
* The main scrollable ref that Sheet should handle on IOS.
|
|
102
106
|
*
|
|
@@ -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;
|
|
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,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE/E,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd;AAED;;;;GAIG;AACH,MAAM,MAAM,QAAQ,GAChB,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,QAAQ,CAAC,EAAE,QAAQ,CAAA;IAEnB;;OAEG;IACH,qBAAqB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAE5C;;;;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.6.0",
|
|
4
4
|
"description": "The true native bottom sheet. 💩",
|
|
5
5
|
"main": "lib/commonjs/index",
|
|
6
6
|
"module": "lib/module/index",
|
|
@@ -131,7 +131,7 @@
|
|
|
131
131
|
"root": true,
|
|
132
132
|
"ignorePatterns": [
|
|
133
133
|
"lib",
|
|
134
|
-
"__mocks__"
|
|
134
|
+
"src/__mocks__"
|
|
135
135
|
],
|
|
136
136
|
"extends": [
|
|
137
137
|
"plugin:@typescript-eslint/recommended",
|
package/src/TrueSheet.tsx
CHANGED
|
@@ -66,7 +66,7 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
|
|
|
66
66
|
return nodeHandle
|
|
67
67
|
}
|
|
68
68
|
|
|
69
|
-
private updateState() {
|
|
69
|
+
private updateState(): void {
|
|
70
70
|
const scrollableHandle = this.props.scrollRef?.current
|
|
71
71
|
? findNodeHandle(this.props.scrollRef.current)
|
|
72
72
|
: null
|
|
@@ -76,7 +76,7 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
|
|
|
76
76
|
})
|
|
77
77
|
}
|
|
78
78
|
|
|
79
|
-
private onSizeChange(event: NativeSyntheticEvent<SizeInfo>) {
|
|
79
|
+
private onSizeChange(event: NativeSyntheticEvent<SizeInfo>): void {
|
|
80
80
|
this.props.onSizeChange?.(event.nativeEvent)
|
|
81
81
|
}
|
|
82
82
|
|
|
@@ -103,17 +103,25 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
|
|
|
103
103
|
}
|
|
104
104
|
|
|
105
105
|
/**
|
|
106
|
-
* Present the modal sheet
|
|
106
|
+
* Present the modal sheet. Optionally accepts a size `index`.
|
|
107
107
|
* See `sizes` prop
|
|
108
108
|
*/
|
|
109
|
-
public async present(index: number = 0) {
|
|
109
|
+
public async present(index: number = 0): Promise<void> {
|
|
110
110
|
await TrueSheetModule.present(this.handle, index)
|
|
111
111
|
}
|
|
112
112
|
|
|
113
|
+
/**
|
|
114
|
+
* Resizes the Sheet programmatically by `index`.
|
|
115
|
+
* This is an alias of the `present(index)` method.
|
|
116
|
+
*/
|
|
117
|
+
public async resize(index: number): Promise<void> {
|
|
118
|
+
await this.present(index)
|
|
119
|
+
}
|
|
120
|
+
|
|
113
121
|
/**
|
|
114
122
|
* Dismisses the Sheet
|
|
115
123
|
*/
|
|
116
|
-
public async dismiss() {
|
|
124
|
+
public async dismiss(): Promise<void> {
|
|
117
125
|
await TrueSheetModule.dismiss(this.handle)
|
|
118
126
|
}
|
|
119
127
|
|
|
@@ -121,48 +129,52 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
|
|
|
121
129
|
const {
|
|
122
130
|
sizes,
|
|
123
131
|
backgroundColor,
|
|
124
|
-
|
|
132
|
+
blurTint,
|
|
125
133
|
cornerRadius,
|
|
126
134
|
grabber,
|
|
127
135
|
maxHeight,
|
|
128
136
|
FooterComponent,
|
|
129
|
-
testID,
|
|
130
137
|
style,
|
|
138
|
+
contentContainerStyle,
|
|
131
139
|
children,
|
|
132
140
|
...rest
|
|
133
141
|
} = this.props
|
|
134
142
|
|
|
143
|
+
const wrapperBackgroundColor = backgroundColor ?? 'white'
|
|
144
|
+
|
|
135
145
|
return (
|
|
136
146
|
<TrueSheetNativeView
|
|
137
147
|
ref={this.ref}
|
|
138
148
|
style={$nativeSheet}
|
|
139
149
|
scrollableHandle={this.state.scrollableHandle}
|
|
140
150
|
sizes={sizes ?? ['medium', 'large']}
|
|
141
|
-
|
|
151
|
+
blurTint={blurTint}
|
|
142
152
|
cornerRadius={cornerRadius}
|
|
143
153
|
grabber={grabber ?? true}
|
|
144
154
|
maxHeight={maxHeight}
|
|
145
155
|
onPresent={this.onPresent}
|
|
146
156
|
onDismiss={this.onDismiss}
|
|
147
157
|
onSizeChange={this.onSizeChange}
|
|
148
|
-
testID={testID}
|
|
149
158
|
>
|
|
150
159
|
<View
|
|
151
160
|
collapsable={false}
|
|
152
|
-
style={
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
161
|
+
style={[
|
|
162
|
+
{
|
|
163
|
+
overflow: Platform.select({ ios: undefined, android: 'hidden' }),
|
|
164
|
+
borderTopLeftRadius: cornerRadius,
|
|
165
|
+
borderTopRightRadius: cornerRadius,
|
|
166
|
+
|
|
167
|
+
// Remove backgroundColor if `blurTint` is set on iOS
|
|
168
|
+
backgroundColor: Platform.select({
|
|
169
|
+
ios: blurTint ? undefined : wrapperBackgroundColor,
|
|
170
|
+
android: wrapperBackgroundColor,
|
|
171
|
+
}),
|
|
172
|
+
},
|
|
173
|
+
style,
|
|
174
|
+
]}
|
|
163
175
|
{...rest}
|
|
164
176
|
>
|
|
165
|
-
<View collapsable={false} style={
|
|
177
|
+
<View collapsable={false} style={contentContainerStyle}>
|
|
166
178
|
{children}
|
|
167
179
|
</View>
|
|
168
180
|
<View collapsable={false}>{!!FooterComponent && <FooterComponent />}</View>
|
|
@@ -174,6 +186,6 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
|
|
|
174
186
|
|
|
175
187
|
const $nativeSheet: ViewStyle = {
|
|
176
188
|
position: 'absolute',
|
|
177
|
-
|
|
189
|
+
left: -9999,
|
|
178
190
|
zIndex: -9999,
|
|
179
191
|
}
|
package/src/types.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { Component, ComponentType, RefObject } from 'react'
|
|
2
|
-
import type { ColorValue, ViewProps } from 'react-native'
|
|
2
|
+
import type { ColorValue, StyleProp, ViewProps, ViewStyle } from 'react-native'
|
|
3
3
|
|
|
4
4
|
export interface SizeInfo {
|
|
5
5
|
index: number
|
|
@@ -11,7 +11,7 @@ export interface SizeInfo {
|
|
|
11
11
|
*
|
|
12
12
|
* @platform ios
|
|
13
13
|
*/
|
|
14
|
-
export type
|
|
14
|
+
export type BlurTint =
|
|
15
15
|
| 'light'
|
|
16
16
|
| 'dark'
|
|
17
17
|
| 'default'
|
|
@@ -130,7 +130,12 @@ export interface TrueSheetProps extends ViewProps {
|
|
|
130
130
|
*
|
|
131
131
|
* @platform ios
|
|
132
132
|
*/
|
|
133
|
-
|
|
133
|
+
blurTint?: BlurTint
|
|
134
|
+
|
|
135
|
+
/**
|
|
136
|
+
* Optional content container styles.
|
|
137
|
+
*/
|
|
138
|
+
contentContainerStyle?: StyleProp<ViewStyle>
|
|
134
139
|
|
|
135
140
|
/**
|
|
136
141
|
* The main scrollable ref that Sheet should handle on IOS.
|