@draftbit/core 46.9.1-c1e2bf.2 → 46.9.1-e06549.2

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.
Files changed (65) hide show
  1. package/lib/commonjs/components/Accordion/AccordionItem.js +23 -4
  2. package/lib/commonjs/components/AnimatedCircularProgress.js +12 -1
  3. package/lib/commonjs/components/CircleImage.js +1 -15
  4. package/lib/commonjs/components/Container.js +15 -4
  5. package/lib/commonjs/index.js +0 -7
  6. package/lib/commonjs/mappings/ActionSheet.js +1 -1
  7. package/lib/commonjs/mappings/ActionSheetCancel.js +1 -1
  8. package/lib/commonjs/mappings/ActionSheetItem.js +1 -1
  9. package/lib/commonjs/mappings/HtmlElements.js +160 -0
  10. package/lib/commonjs/mappings/MapCallout.js +1 -1
  11. package/lib/commonjs/mappings/MapMarker.js +1 -1
  12. package/lib/module/index.js +0 -1
  13. package/lib/module/mappings/ActionSheet.js +1 -1
  14. package/lib/module/mappings/ActionSheetCancel.js +1 -1
  15. package/lib/module/mappings/ActionSheetItem.js +1 -1
  16. package/lib/module/mappings/HtmlElements.js +153 -0
  17. package/lib/module/mappings/MapCallout.js +2 -2
  18. package/lib/module/mappings/MapMarker.js +2 -2
  19. package/lib/typescript/src/index.d.ts +0 -1
  20. package/lib/typescript/src/index.d.ts.map +1 -1
  21. package/lib/typescript/src/mappings/ActionSheet.d.ts.map +1 -1
  22. package/lib/typescript/src/mappings/ActionSheetCancel.d.ts.map +1 -1
  23. package/lib/typescript/src/mappings/ActionSheetItem.d.ts.map +1 -1
  24. package/lib/typescript/src/mappings/{BottomSheet.d.ts → HtmlElements.d.ts} +51 -61
  25. package/lib/typescript/src/mappings/HtmlElements.d.ts.map +1 -0
  26. package/lib/typescript/src/mappings/MapCallout.d.ts.map +1 -1
  27. package/lib/typescript/src/mappings/MapMarker.d.ts.map +1 -1
  28. package/package.json +4 -5
  29. package/src/index.js +0 -1
  30. package/src/index.tsx +0 -2
  31. package/src/mappings/ActionSheet.js +4 -1
  32. package/src/mappings/ActionSheet.ts +4 -1
  33. package/src/mappings/ActionSheetCancel.js +4 -1
  34. package/src/mappings/ActionSheetCancel.ts +4 -1
  35. package/src/mappings/ActionSheetItem.js +4 -1
  36. package/src/mappings/ActionSheetItem.ts +4 -1
  37. package/src/mappings/HtmlElements.js +180 -0
  38. package/src/mappings/HtmlElements.ts +194 -0
  39. package/src/mappings/MapCallout.js +6 -2
  40. package/src/mappings/MapCallout.ts +6 -2
  41. package/src/mappings/MapMarker.js +6 -2
  42. package/src/mappings/MapMarker.ts +6 -2
  43. package/lib/commonjs/components/BottomSheet/BottomSheet.js +0 -88
  44. package/lib/commonjs/components/BottomSheet/BottomSheetComponent.js +0 -464
  45. package/lib/commonjs/components/BottomSheet/index.js +0 -13
  46. package/lib/commonjs/mappings/BottomSheet.js +0 -74
  47. package/lib/module/components/BottomSheet/BottomSheet.js +0 -80
  48. package/lib/module/components/BottomSheet/BottomSheetComponent.js +0 -470
  49. package/lib/module/components/BottomSheet/index.js +0 -1
  50. package/lib/module/mappings/BottomSheet.js +0 -67
  51. package/lib/typescript/src/components/BottomSheet/BottomSheet.d.ts +0 -20
  52. package/lib/typescript/src/components/BottomSheet/BottomSheet.d.ts.map +0 -1
  53. package/lib/typescript/src/components/BottomSheet/BottomSheetComponent.d.ts +0 -170
  54. package/lib/typescript/src/components/BottomSheet/BottomSheetComponent.d.ts.map +0 -1
  55. package/lib/typescript/src/components/BottomSheet/index.d.ts +0 -2
  56. package/lib/typescript/src/components/BottomSheet/index.d.ts.map +0 -1
  57. package/lib/typescript/src/mappings/BottomSheet.d.ts.map +0 -1
  58. package/src/components/BottomSheet/BottomSheet.js +0 -56
  59. package/src/components/BottomSheet/BottomSheet.tsx +0 -120
  60. package/src/components/BottomSheet/BottomSheetComponent.js +0 -437
  61. package/src/components/BottomSheet/BottomSheetComponent.tsx +0 -895
  62. package/src/components/BottomSheet/index.js +0 -1
  63. package/src/components/BottomSheet/index.ts +0 -1
  64. package/src/mappings/BottomSheet.js +0 -64
  65. package/src/mappings/BottomSheet.ts +0 -78
@@ -1,9 +1,13 @@
1
- import { COMPONENT_TYPES, createActionProp, createBoolProp, GROUPS, Triggers, CONTAINER_COMPONENT_STYLES_SECTIONS, } from "@draftbit/types";
1
+ import { COMPONENT_TYPES, createActionProp, createBoolProp, GROUPS, Triggers, StylesPanelSections, } from "@draftbit/types";
2
2
  export const SEED_DATA = {
3
3
  name: "Map Callout",
4
4
  tag: "MapCallout",
5
5
  packageName: "@draftbit/maps",
6
- stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
6
+ stylesPanelSections: [
7
+ StylesPanelSections.Size,
8
+ StylesPanelSections.Margins,
9
+ StylesPanelSections.Effects,
10
+ ],
7
11
  description: "An info window to display on top of a marker when it is clicked",
8
12
  category: COMPONENT_TYPES.map,
9
13
  triggers: [Triggers.OnPress],
@@ -4,14 +4,18 @@ import {
4
4
  createBoolProp,
5
5
  GROUPS,
6
6
  Triggers,
7
- CONTAINER_COMPONENT_STYLES_SECTIONS,
7
+ StylesPanelSections,
8
8
  } from "@draftbit/types";
9
9
 
10
10
  export const SEED_DATA = {
11
11
  name: "Map Callout",
12
12
  tag: "MapCallout",
13
13
  packageName: "@draftbit/maps",
14
- stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
14
+ stylesPanelSections: [
15
+ StylesPanelSections.Size,
16
+ StylesPanelSections.Margins,
17
+ StylesPanelSections.Effects,
18
+ ],
15
19
  description:
16
20
  "An info window to display on top of a marker when it is clicked",
17
21
  category: COMPONENT_TYPES.map,
@@ -1,11 +1,15 @@
1
- import { COMPONENT_TYPES, createBoolProp, createColorProp, createNumberProp, createTextProp, GROUPS, CONTAINER_COMPONENT_STYLES_SECTIONS, } from "@draftbit/types";
1
+ import { COMPONENT_TYPES, createBoolProp, createColorProp, createNumberProp, createTextProp, GROUPS, StylesPanelSections, } from "@draftbit/types";
2
2
  export const SEED_DATA = {
3
3
  name: "Map Marker",
4
4
  tag: "MapMarker",
5
5
  packageName: "@draftbit/maps",
6
6
  description: "A marker to show inside map view",
7
7
  category: COMPONENT_TYPES.map,
8
- stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
8
+ stylesPanelSections: [
9
+ StylesPanelSections.Size,
10
+ StylesPanelSections.Margins,
11
+ StylesPanelSections.Effects,
12
+ ],
9
13
  layout: {},
10
14
  props: {
11
15
  latitude: createNumberProp({
@@ -5,7 +5,7 @@ import {
5
5
  createNumberProp,
6
6
  createTextProp,
7
7
  GROUPS,
8
- CONTAINER_COMPONENT_STYLES_SECTIONS,
8
+ StylesPanelSections,
9
9
  } from "@draftbit/types";
10
10
 
11
11
  export const SEED_DATA = {
@@ -14,7 +14,11 @@ export const SEED_DATA = {
14
14
  packageName: "@draftbit/maps",
15
15
  description: "A marker to show inside map view",
16
16
  category: COMPONENT_TYPES.map,
17
- stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
17
+ stylesPanelSections: [
18
+ StylesPanelSections.Size,
19
+ StylesPanelSections.Margins,
20
+ StylesPanelSections.Effects,
21
+ ],
18
22
  layout: {},
19
23
  props: {
20
24
  latitude: createNumberProp({
@@ -1,88 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _reactNative = require("react-native");
9
- var _BottomSheetComponent = _interopRequireDefault(require("./BottomSheetComponent"));
10
- var _theming = require("../../theming");
11
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
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); }
13
- const BottomSheet = _ref => {
14
- let {
15
- theme,
16
- snapPoints = ["10%", "50%", "80%"],
17
- initialSnapIndex = 0,
18
- showHandle = true,
19
- handleColor = theme.colors.divider,
20
- topBorderRadius = 20,
21
- borderWidth = 1,
22
- borderColor = theme.colors.divider,
23
- onSettle,
24
- style,
25
- children,
26
- ...rest
27
- } = _ref;
28
- const backgroundColor = (style === null || style === void 0 ? void 0 : style.backgroundColor) || theme.colors.background;
29
- return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
30
- style: styles.parentContainer,
31
- pointerEvents: "box-none"
32
- }, /*#__PURE__*/_react.default.createElement(_BottomSheetComponent.default, _extends({
33
- componentType: "ScrollView",
34
- snapPoints: snapPoints,
35
- initialSnapIndex: initialSnapIndex,
36
- renderHandle: () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showHandle && /*#__PURE__*/_react.default.createElement(_reactNative.View, {
37
- style: [styles.handleContainer, {
38
- backgroundColor,
39
- borderTopLeftRadius: topBorderRadius,
40
- borderTopRightRadius: topBorderRadius
41
- }]
42
- }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
43
- style: [styles.handle, {
44
- backgroundColor: handleColor
45
- }]
46
- }))),
47
- contentContainerStyle: [styles.contentContainerStyle, style],
48
- containerStyle: _reactNative.StyleSheet.flatten([styles.containerStyle, {
49
- backgroundColor,
50
- borderTopLeftRadius: topBorderRadius,
51
- borderTopRightRadius: topBorderRadius,
52
- borderWidth,
53
- borderColor
54
- }]),
55
- onSettle: onSettle
56
- }, rest), children));
57
- };
58
- const styles = _reactNative.StyleSheet.create({
59
- //Render on top of everything
60
- parentContainer: {
61
- position: "absolute",
62
- left: 0,
63
- right: 0,
64
- top: 0,
65
- bottom: 0,
66
- zIndex: 10,
67
- overflow: "hidden"
68
- },
69
- contentContainerStyle: {
70
- paddingHorizontal: 16,
71
- paddingVertical: 10
72
- },
73
- containerStyle: {
74
- flex: 1,
75
- overflow: "hidden"
76
- },
77
- handleContainer: {
78
- alignItems: "center",
79
- paddingVertical: 20
80
- },
81
- handle: {
82
- width: 40,
83
- height: 2,
84
- borderRadius: 4
85
- }
86
- });
87
- var _default = (0, _theming.withTheme)(BottomSheet);
88
- exports.default = _default;
@@ -1,464 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.ScrollBottomSheet = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _reactNative = require("react-native");
9
- var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
10
- var _reactNativeGestureHandler = require("react-native-gesture-handler");
11
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
12
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
13
- 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); }
14
- function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
15
- function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
16
- function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
17
- const {
18
- //@ts-ignore
19
- interpolate: interpolateDeprecated,
20
- // @ts-ignore: this property is only present in Reanimated 2
21
- interpolateNode
22
- } = _reactNativeReanimated.default;
23
- const interpolate = interpolateNode !== null && interpolateNode !== void 0 ? interpolateNode : interpolateDeprecated;
24
- //@ts-ignore
25
- const Easing = _reactNativeReanimated.EasingNode !== null && _reactNativeReanimated.EasingNode !== void 0 ? _reactNativeReanimated.EasingNode : _reactNativeReanimated.Easing;
26
- const FlatListComponentType = "FlatList";
27
- const ScrollViewComponentType = "ScrollView";
28
- const SectionListComponentType = "SectionList";
29
- const TimingAnimationType = "timing";
30
- const SpringAnimationType = "spring";
31
- const DEFAULT_SPRING_PARAMS = {
32
- damping: 50,
33
- mass: 0.3,
34
- stiffness: 121.6,
35
- overshootClamping: true,
36
- restSpeedThreshold: 0.3,
37
- restDisplacementThreshold: 0.3
38
- };
39
- const {
40
- height: windowHeight
41
- } = _reactNative.Dimensions.get("window");
42
- const IOS_NORMAL_DECELERATION_RATE = 0.998;
43
- const ANDROID_NORMAL_DECELERATION_RATE = 0.985;
44
- const DEFAULT_ANIMATION_DURATION = 250;
45
- const DEFAULT_EASING = Easing.inOut(Easing.linear);
46
- const imperativeScrollOptions = {
47
- [FlatListComponentType]: {
48
- method: "scrollToIndex",
49
- args: {
50
- index: 0,
51
- viewPosition: 0,
52
- viewOffset: 1000,
53
- animated: true
54
- }
55
- },
56
- [ScrollViewComponentType]: {
57
- method: "scrollTo",
58
- args: {
59
- x: 0,
60
- y: 0,
61
- animated: true
62
- }
63
- },
64
- [SectionListComponentType]: {
65
- method: "scrollToLocation",
66
- args: {
67
- itemIndex: 0,
68
- sectionIndex: 0,
69
- viewPosition: 0,
70
- viewOffset: 1000,
71
- animated: true
72
- }
73
- }
74
- };
75
- class ScrollBottomSheet extends _react.Component {
76
- /**
77
- * Gesture Handler references
78
- */
79
-
80
- /**
81
- * ScrollView prop
82
- */
83
-
84
- /**
85
- * Pan gesture handler events for drawer handle and content
86
- */
87
-
88
- /**
89
- * Main Animated Value that drives the top position of the UI drawer at any point in time
90
- */
91
-
92
- /**
93
- * Animated value that keeps track of the position: 0 => closed, 1 => opened
94
- */
95
-
96
- /**
97
- * Flag to indicate imperative snapping
98
- */
99
-
100
- /**
101
- * Manual snapping amount
102
- */
103
-
104
- /**
105
- * Keeps track of the current index
106
- */
107
-
108
- /**
109
- * Deceleration rate of the scroll component. This is used only on Android to
110
- * compensate the unexpected glide it gets sometimes.
111
- */
112
-
113
- constructor(props) {
114
- var _props$animationConfi, _this;
115
- super(props);
116
- _this = this;
117
- _defineProperty(this, "masterDrawer", /*#__PURE__*/_react.default.createRef());
118
- _defineProperty(this, "drawerHandleRef", /*#__PURE__*/_react.default.createRef());
119
- _defineProperty(this, "drawerContentRef", /*#__PURE__*/_react.default.createRef());
120
- _defineProperty(this, "scrollComponentRef", /*#__PURE__*/_react.default.createRef());
121
- _defineProperty(this, "onScrollBeginDrag", void 0);
122
- _defineProperty(this, "onHandleGestureEvent", void 0);
123
- _defineProperty(this, "onDrawerGestureEvent", void 0);
124
- _defineProperty(this, "translateY", void 0);
125
- _defineProperty(this, "position", void 0);
126
- _defineProperty(this, "isManuallySetValue", new _reactNativeReanimated.Value(0));
127
- _defineProperty(this, "manualYOffset", new _reactNativeReanimated.Value(0));
128
- _defineProperty(this, "nextSnapIndex", void 0);
129
- _defineProperty(this, "decelerationRate", void 0);
130
- _defineProperty(this, "prevSnapIndex", -1);
131
- _defineProperty(this, "dragY", new _reactNativeReanimated.Value(0));
132
- _defineProperty(this, "prevDragY", new _reactNativeReanimated.Value(0));
133
- _defineProperty(this, "tempDestSnapPoint", new _reactNativeReanimated.Value(0));
134
- _defineProperty(this, "isAndroid", new _reactNativeReanimated.Value(Number(_reactNative.Platform.OS === "android")));
135
- _defineProperty(this, "animationClock", new _reactNativeReanimated.Clock());
136
- _defineProperty(this, "animationPosition", new _reactNativeReanimated.Value(0));
137
- _defineProperty(this, "animationFinished", new _reactNativeReanimated.Value(0));
138
- _defineProperty(this, "animationFrameTime", new _reactNativeReanimated.Value(0));
139
- _defineProperty(this, "velocityY", new _reactNativeReanimated.Value(0));
140
- _defineProperty(this, "lastStartScrollY", new _reactNativeReanimated.Value(0));
141
- _defineProperty(this, "prevTranslateYOffset", void 0);
142
- _defineProperty(this, "translationY", void 0);
143
- _defineProperty(this, "destSnapPoint", new _reactNativeReanimated.Value(0));
144
- _defineProperty(this, "lastSnap", void 0);
145
- _defineProperty(this, "dragWithHandle", new _reactNativeReanimated.Value(0));
146
- _defineProperty(this, "scrollUpAndPullDown", new _reactNativeReanimated.Value(0));
147
- _defineProperty(this, "didGestureFinish", void 0);
148
- _defineProperty(this, "didScrollUpAndPullDown", void 0);
149
- _defineProperty(this, "setTranslationY", void 0);
150
- _defineProperty(this, "extraOffset", void 0);
151
- _defineProperty(this, "calculateNextSnapPoint", void 0);
152
- _defineProperty(this, "scrollComponent", void 0);
153
- _defineProperty(this, "convertPercentageToDp", str => Number(str.split("%")[0]) * (windowHeight - this.props.topInset) / 100);
154
- _defineProperty(this, "getNormalisedSnapPoints", () => {
155
- return this.props.snapPoints.map(p => {
156
- if (typeof p === "string") {
157
- return this.convertPercentageToDp(p);
158
- } else if (typeof p === "number") {
159
- return p;
160
- }
161
- throw new Error("Invalid type for value ".concat(p, ": ").concat(typeof p, ". It should be either a percentage string or a number"));
162
- });
163
- });
164
- _defineProperty(this, "getScrollComponent", () => {
165
- switch (this.props.componentType) {
166
- case "FlatList":
167
- return _reactNative.FlatList;
168
- case "ScrollView":
169
- return _reactNative.ScrollView;
170
- case "SectionList":
171
- return _reactNative.SectionList;
172
- default:
173
- throw new Error("Component type not supported: it should be one of `FlatList`, `ScrollView` or `SectionList`");
174
- }
175
- });
176
- _defineProperty(this, "snapTo", index => {
177
- const snapPoints = this.getNormalisedSnapPoints();
178
- this.isManuallySetValue.setValue(1);
179
- this.manualYOffset.setValue(snapPoints[index]);
180
- this.nextSnapIndex.setValue(index);
181
- });
182
- const {
183
- initialSnapIndex,
184
- animationType
185
- } = props;
186
- const animationDriver = animationType === "timing" ? 0 : 1;
187
- const animationDuration = props.animationType === "timing" && ((_props$animationConfi = props.animationConfig) === null || _props$animationConfi === void 0 ? void 0 : _props$animationConfi.duration) || DEFAULT_ANIMATION_DURATION;
188
- const ScrollComponent = this.getScrollComponent();
189
- // @ts-ignore
190
- this.scrollComponent = _reactNativeReanimated.default.createAnimatedComponent(ScrollComponent);
191
- const _snapPoints = this.getNormalisedSnapPoints();
192
- const openPosition = _snapPoints[0];
193
- const closedPosition = this.props.enableOverScroll ? windowHeight : _snapPoints[_snapPoints.length - 1];
194
- const initialSnap = _snapPoints[initialSnapIndex];
195
- this.nextSnapIndex = new _reactNativeReanimated.Value(initialSnapIndex);
196
- const initialDecelerationRate = _reactNative.Platform.select({
197
- android: props.initialSnapIndex === 0 ? ANDROID_NORMAL_DECELERATION_RATE : 0,
198
- ios: IOS_NORMAL_DECELERATION_RATE
199
- });
200
- this.decelerationRate = new _reactNativeReanimated.Value(initialDecelerationRate);
201
-
202
- //@ts-ignore
203
- const handleGestureState = new _reactNativeReanimated.Value(-1);
204
- //@ts-ignore
205
- const handleOldGestureState = new _reactNativeReanimated.Value(-1);
206
- //@ts-ignore
207
- const drawerGestureState = new _reactNativeReanimated.Value(-1);
208
- //@ts-ignore
209
- const drawerOldGestureState = new _reactNativeReanimated.Value(-1);
210
- const lastSnapInRange = new _reactNativeReanimated.Value(1);
211
- this.prevTranslateYOffset = new _reactNativeReanimated.Value(initialSnap);
212
- this.translationY = new _reactNativeReanimated.Value(initialSnap);
213
- this.lastSnap = new _reactNativeReanimated.Value(initialSnap);
214
- this.onHandleGestureEvent = (0, _reactNativeReanimated.event)([{
215
- nativeEvent: {
216
- translationY: this.dragY,
217
- oldState: handleOldGestureState,
218
- state: handleGestureState,
219
- velocityY: this.velocityY
220
- }
221
- }]);
222
- this.onDrawerGestureEvent = (0, _reactNativeReanimated.event)([{
223
- nativeEvent: {
224
- translationY: this.dragY,
225
- oldState: drawerOldGestureState,
226
- state: drawerGestureState,
227
- velocityY: this.velocityY
228
- }
229
- }]);
230
- this.onScrollBeginDrag = (0, _reactNativeReanimated.event)([{
231
- nativeEvent: {
232
- contentOffset: {
233
- y: this.lastStartScrollY
234
- }
235
- }
236
- }]);
237
- const didHandleGestureBegin = (0, _reactNativeReanimated.eq)(handleGestureState, _reactNativeGestureHandler.State.ACTIVE);
238
- const isAnimationInterrupted = (0, _reactNativeReanimated.and)((0, _reactNativeReanimated.or)((0, _reactNativeReanimated.eq)(handleGestureState, _reactNativeGestureHandler.State.BEGAN), (0, _reactNativeReanimated.eq)(drawerGestureState, _reactNativeGestureHandler.State.BEGAN), (0, _reactNativeReanimated.and)((0, _reactNativeReanimated.eq)(this.isAndroid, 0), (0, _reactNativeReanimated.eq)(animationDriver, 1), (0, _reactNativeReanimated.or)((0, _reactNativeReanimated.eq)(drawerGestureState, _reactNativeGestureHandler.State.ACTIVE), (0, _reactNativeReanimated.eq)(handleGestureState, _reactNativeGestureHandler.State.ACTIVE)))), (0, _reactNativeReanimated.clockRunning)(this.animationClock));
239
- this.didGestureFinish = (0, _reactNativeReanimated.or)((0, _reactNativeReanimated.and)((0, _reactNativeReanimated.eq)(handleOldGestureState, _reactNativeGestureHandler.State.ACTIVE), (0, _reactNativeReanimated.eq)(handleGestureState, _reactNativeGestureHandler.State.END)), (0, _reactNativeReanimated.and)((0, _reactNativeReanimated.eq)(drawerOldGestureState, _reactNativeGestureHandler.State.ACTIVE), (0, _reactNativeReanimated.eq)(drawerGestureState, _reactNativeGestureHandler.State.END)));
240
-
241
- // Function that determines if the last snap point is in the range {snapPoints}
242
- // In the case of interruptions in the middle of an animation, we'll get
243
- // lastSnap values outside the range
244
- const isLastSnapPointInRange = function () {
245
- let i = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
246
- return i === _snapPoints.length ? lastSnapInRange : (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(_this.lastSnap, _snapPoints[i]), [(0, _reactNativeReanimated.set)(lastSnapInRange, 1)], isLastSnapPointInRange(i + 1));
247
- };
248
- const scrollY = [(0, _reactNativeReanimated.set)(lastSnapInRange, 0), isLastSnapPointInRange(), (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.or)(didHandleGestureBegin, (0, _reactNativeReanimated.and)(this.isManuallySetValue, (0, _reactNativeReanimated.not)((0, _reactNativeReanimated.eq)(this.manualYOffset, _snapPoints[0])))), [(0, _reactNativeReanimated.set)(this.dragWithHandle, 1), 0]), (0, _reactNativeReanimated.cond)(
249
- // This is to account for a continuous scroll on the drawer from a snap point
250
- // Different than top, bringing the drawer to the top position, so that if we
251
- // change scroll direction without releasing the gesture, it doesn't pull down the drawer again
252
- (0, _reactNativeReanimated.and)((0, _reactNativeReanimated.eq)(this.dragWithHandle, 1), (0, _reactNativeReanimated.greaterThan)(_snapPoints[0], (0, _reactNativeReanimated.add)(this.lastSnap, this.dragY)), (0, _reactNativeReanimated.and)((0, _reactNativeReanimated.not)((0, _reactNativeReanimated.eq)(this.lastSnap, _snapPoints[0])), lastSnapInRange)), [(0, _reactNativeReanimated.set)(this.lastSnap, _snapPoints[0]), (0, _reactNativeReanimated.set)(this.dragWithHandle, 0), this.lastStartScrollY], (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(this.dragWithHandle, 1), 0, this.lastStartScrollY))];
253
- this.didScrollUpAndPullDown = (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.and)((0, _reactNativeReanimated.greaterOrEq)(this.dragY, this.lastStartScrollY), (0, _reactNativeReanimated.greaterThan)(this.lastStartScrollY, 0)), (0, _reactNativeReanimated.set)(this.scrollUpAndPullDown, 1));
254
- this.setTranslationY = (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.and)((0, _reactNativeReanimated.not)(this.dragWithHandle), (0, _reactNativeReanimated.not)((0, _reactNativeReanimated.greaterOrEq)(this.dragY, this.lastStartScrollY))), (0, _reactNativeReanimated.set)(this.translationY, (0, _reactNativeReanimated.sub)(this.dragY, this.lastStartScrollY)), (0, _reactNativeReanimated.set)(this.translationY, this.dragY));
255
- this.extraOffset = (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(this.scrollUpAndPullDown, 1), this.lastStartScrollY, 0);
256
- const endOffsetY = (0, _reactNativeReanimated.add)(this.lastSnap, this.translationY, (0, _reactNativeReanimated.multiply)(1 - props.friction, this.velocityY));
257
- this.calculateNextSnapPoint = function () {
258
- let i = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
259
- return i === _snapPoints.length ? _this.tempDestSnapPoint : (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.greaterThan)((0, _reactNativeReanimated.abs)((0, _reactNativeReanimated.sub)(_this.tempDestSnapPoint, endOffsetY)), (0, _reactNativeReanimated.abs)((0, _reactNativeReanimated.sub)((0, _reactNativeReanimated.add)(_snapPoints[i], _this.extraOffset), endOffsetY))), [(0, _reactNativeReanimated.set)(_this.tempDestSnapPoint, (0, _reactNativeReanimated.add)(_snapPoints[i], _this.extraOffset)), (0, _reactNativeReanimated.set)(_this.nextSnapIndex, i), _this.calculateNextSnapPoint(i + 1)], _this.calculateNextSnapPoint(i + 1));
260
- };
261
- const runAnimation = _ref => {
262
- var _props$animationConfi2;
263
- let {
264
- clock,
265
- from,
266
- to,
267
- position,
268
- finished,
269
- velocity,
270
- frameTime
271
- } = _ref;
272
- const state = {
273
- finished,
274
- velocity: new _reactNativeReanimated.Value(0),
275
- position,
276
- time: new _reactNativeReanimated.Value(0),
277
- frameTime
278
- };
279
- const timingConfig = {
280
- duration: animationDuration,
281
- easing: props.animationType === "timing" && ((_props$animationConfi2 = props.animationConfig) === null || _props$animationConfi2 === void 0 ? void 0 : _props$animationConfi2.easing) || DEFAULT_EASING,
282
- toValue: new _reactNativeReanimated.Value(0)
283
- };
284
- const springConfig = {
285
- ...DEFAULT_SPRING_PARAMS,
286
- ...(props.animationType === "spring" && props.animationConfig || {}),
287
- toValue: new _reactNativeReanimated.Value(0)
288
- };
289
- return [(0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.and)((0, _reactNativeReanimated.not)((0, _reactNativeReanimated.clockRunning)(clock)), (0, _reactNativeReanimated.not)((0, _reactNativeReanimated.eq)(finished, 1))), [
290
- // If the clock isn't running, we reset all the animation params and start the clock
291
- (0, _reactNativeReanimated.set)(state.finished, 0), (0, _reactNativeReanimated.set)(state.velocity, velocity), (0, _reactNativeReanimated.set)(state.time, 0), (0, _reactNativeReanimated.set)(state.position, from), (0, _reactNativeReanimated.set)(state.frameTime, 0), (0, _reactNativeReanimated.set)(timingConfig.toValue, to), (0, _reactNativeReanimated.set)(springConfig.toValue, to), (0, _reactNativeReanimated.startClock)(clock)]),
292
- // We run the step here that is going to update position
293
- (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(animationDriver, 0),
294
- //@ts-ignore
295
- (0, _reactNativeReanimated.timing)(clock, state, timingConfig), (0, _reactNativeReanimated.spring)(clock, state, springConfig)), (0, _reactNativeReanimated.cond)(state.finished, [(0, _reactNativeReanimated.call)([this.nextSnapIndex], _ref2 => {
296
- let [value] = _ref2;
297
- if (value !== this.prevSnapIndex) {
298
- var _this$props$onSettle, _this$props;
299
- (_this$props$onSettle = (_this$props = this.props).onSettle) === null || _this$props$onSettle === void 0 ? void 0 : _this$props$onSettle.call(_this$props, value);
300
- }
301
- this.prevSnapIndex = value;
302
- }),
303
- // Resetting appropriate values
304
- (0, _reactNativeReanimated.set)(drawerOldGestureState, _reactNativeGestureHandler.State.END), (0, _reactNativeReanimated.set)(handleOldGestureState, _reactNativeGestureHandler.State.END), (0, _reactNativeReanimated.set)(this.prevTranslateYOffset, state.position), (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(this.scrollUpAndPullDown, 1), [(0, _reactNativeReanimated.set)(this.prevTranslateYOffset, (0, _reactNativeReanimated.sub)(this.prevTranslateYOffset, this.lastStartScrollY)), (0, _reactNativeReanimated.set)(this.lastStartScrollY, 0), (0, _reactNativeReanimated.set)(this.scrollUpAndPullDown, 0)]), (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(this.destSnapPoint, _snapPoints[0]), [(0, _reactNativeReanimated.set)(this.dragWithHandle, 0)]), (0, _reactNativeReanimated.set)(this.isManuallySetValue, 0), (0, _reactNativeReanimated.set)(this.manualYOffset, 0), (0, _reactNativeReanimated.stopClock)(clock), this.prevTranslateYOffset],
305
- // We made the block return the updated position,
306
- state.position)];
307
- };
308
- const translateYOffset = (0, _reactNativeReanimated.cond)(isAnimationInterrupted, [
309
- // set(prevTranslateYOffset, animationPosition) should only run if we are
310
- // interrupting an animation when the drawer is currently in a different
311
- // position than the top
312
- (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.or)(this.dragWithHandle, (0, _reactNativeReanimated.greaterOrEq)((0, _reactNativeReanimated.abs)(this.prevDragY), this.lastStartScrollY)), (0, _reactNativeReanimated.set)(this.prevTranslateYOffset, this.animationPosition)), (0, _reactNativeReanimated.set)(this.animationFinished, 1), (0, _reactNativeReanimated.set)(this.translationY, 0),
313
- // Resetting appropriate values
314
- (0, _reactNativeReanimated.set)(drawerOldGestureState, _reactNativeGestureHandler.State.END), (0, _reactNativeReanimated.set)(handleOldGestureState, _reactNativeGestureHandler.State.END),
315
- // By forcing that frameTime exceeds duration, it has the effect of stopping the animation
316
- (0, _reactNativeReanimated.set)(this.animationFrameTime, (0, _reactNativeReanimated.add)(animationDuration, 1000)), (0, _reactNativeReanimated.set)(this.velocityY, 0), (0, _reactNativeReanimated.stopClock)(this.animationClock), this.prevTranslateYOffset], (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.or)(this.didGestureFinish, this.isManuallySetValue, (0, _reactNativeReanimated.clockRunning)(this.animationClock)), [runAnimation({
317
- clock: this.animationClock,
318
- from: (0, _reactNativeReanimated.cond)(this.isManuallySetValue, this.prevTranslateYOffset, (0, _reactNativeReanimated.add)(this.prevTranslateYOffset, this.translationY)),
319
- to: this.destSnapPoint,
320
- position: this.animationPosition,
321
- finished: this.animationFinished,
322
- frameTime: this.animationFrameTime,
323
- velocity: this.velocityY
324
- })], [(0, _reactNativeReanimated.set)(this.animationFrameTime, 0), (0, _reactNativeReanimated.set)(this.animationFinished, 0),
325
- // @ts-ignore
326
- this.prevTranslateYOffset]));
327
- this.translateY = interpolate((0, _reactNativeReanimated.add)(translateYOffset, this.dragY, (0, _reactNativeReanimated.multiply)(scrollY, -1)), {
328
- inputRange: [openPosition, closedPosition],
329
- outputRange: [openPosition, closedPosition],
330
- extrapolate: _reactNativeReanimated.Extrapolate.CLAMP
331
- });
332
- this.position = interpolate(this.translateY, {
333
- inputRange: [openPosition, _snapPoints[_snapPoints.length - 1]],
334
- outputRange: [1, 0],
335
- extrapolate: _reactNativeReanimated.Extrapolate.CLAMP
336
- });
337
- }
338
- render() {
339
- const {
340
- renderHandle,
341
- initialSnapIndex,
342
- containerStyle,
343
- ...rest
344
- } = this.props;
345
- const AnimatedScrollableComponent = this.scrollComponent;
346
- const normalisedSnapPoints = this.getNormalisedSnapPoints();
347
- const initialSnap = normalisedSnapPoints[initialSnapIndex];
348
- const Content = /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
349
- style: [_reactNative.StyleSheet.absoluteFillObject, containerStyle,
350
- // @ts-ignore
351
- {
352
- transform: [{
353
- translateY: this.translateY
354
- }]
355
- }]
356
- }, /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.PanGestureHandler, {
357
- ref: this.drawerHandleRef,
358
- shouldCancelWhenOutside: false,
359
- simultaneousHandlers: this.masterDrawer,
360
- onGestureEvent: this.onHandleGestureEvent,
361
- onHandlerStateChange: this.onHandleGestureEvent
362
- }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, null, renderHandle())), /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.PanGestureHandler, {
363
- ref: this.drawerContentRef,
364
- simultaneousHandlers: [this.scrollComponentRef, this.masterDrawer],
365
- shouldCancelWhenOutside: false,
366
- onGestureEvent: this.onDrawerGestureEvent,
367
- onHandlerStateChange: this.onDrawerGestureEvent
368
- }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
369
- style: styles.container
370
- }, /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.NativeViewGestureHandler, {
371
- ref: this.scrollComponentRef,
372
- waitFor: this.masterDrawer,
373
- simultaneousHandlers: this.drawerContentRef
374
- }, /*#__PURE__*/_react.default.createElement(AnimatedScrollableComponent, _extends({
375
- overScrollMode: "never",
376
- bounces: false
377
- }, rest, {
378
- ref: this.props.innerRef
379
- // @ts-ignore
380
- ,
381
- decelerationRate: this.decelerationRate,
382
- onScrollBeginDrag: this.onScrollBeginDrag,
383
- scrollEventThrottle: 1,
384
- contentContainerStyle: [rest.contentContainerStyle, {
385
- paddingBottom: this.getNormalisedSnapPoints()[0]
386
- }]
387
- }))))), this.props.animatedPosition && /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.Code, {
388
- exec: (0, _reactNativeReanimated.onChange)(this.position, (0, _reactNativeReanimated.set)(this.props.animatedPosition, this.position))
389
- }), /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.Code, {
390
- exec: (0, _reactNativeReanimated.onChange)(this.dragY, (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.not)((0, _reactNativeReanimated.eq)(this.dragY, 0)), (0, _reactNativeReanimated.set)(this.prevDragY, this.dragY)))
391
- }), /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.Code, {
392
- exec: (0, _reactNativeReanimated.onChange)(this.didGestureFinish, (0, _reactNativeReanimated.cond)(this.didGestureFinish, [this.didScrollUpAndPullDown, this.setTranslationY, (0, _reactNativeReanimated.set)(this.tempDestSnapPoint, (0, _reactNativeReanimated.add)(normalisedSnapPoints[0], this.extraOffset)), (0, _reactNativeReanimated.set)(this.nextSnapIndex, 0), (0, _reactNativeReanimated.set)(this.destSnapPoint, this.calculateNextSnapPoint()), (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.and)((0, _reactNativeReanimated.greaterThan)(this.dragY, this.lastStartScrollY), this.isAndroid, (0, _reactNativeReanimated.not)(this.dragWithHandle)), (0, _reactNativeReanimated.call)([], () => {
393
- var _this$props2, _this$props2$data;
394
- // This prevents the scroll glide from happening on Android when pulling down with inertia.
395
- // It's not perfect, but does the job for now
396
- const {
397
- method,
398
- args
399
- } = imperativeScrollOptions[this.props.componentType];
400
- // @ts-ignore
401
- const node = this.props.innerRef.current;
402
- if (node && node[method] && (this.props.componentType === "FlatList" && (((_this$props2 = this.props) === null || _this$props2 === void 0 ? void 0 : (_this$props2$data = _this$props2.data) === null || _this$props2$data === void 0 ? void 0 : _this$props2$data.length) || 0) > 0 || this.props.componentType === "SectionList" && this.props.sections.length > 0 || this.props.componentType === "ScrollView")) {
403
- node[method](args);
404
- }
405
- })), (0, _reactNativeReanimated.set)(this.dragY, 0), (0, _reactNativeReanimated.set)(this.velocityY, 0), (0, _reactNativeReanimated.set)(this.lastSnap, (0, _reactNativeReanimated.sub)(this.destSnapPoint, (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(this.scrollUpAndPullDown, 1), this.lastStartScrollY, 0))), (0, _reactNativeReanimated.call)([this.lastSnap], _ref3 => {
406
- var _this$masterDrawer, _this$masterDrawer$cu;
407
- let [value] = _ref3;
408
- // This is the TapGHandler trick
409
- // @ts-ignore
410
- (_this$masterDrawer = this.masterDrawer) === null || _this$masterDrawer === void 0 ? void 0 : (_this$masterDrawer$cu = _this$masterDrawer.current) === null || _this$masterDrawer$cu === void 0 ? void 0 : _this$masterDrawer$cu.setNativeProps({
411
- maxDeltaY: value - this.getNormalisedSnapPoints()[0]
412
- });
413
- }), (0, _reactNativeReanimated.set)(this.decelerationRate, (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(this.isAndroid, 1), (0, _reactNativeReanimated.cond)((0, _reactNativeReanimated.eq)(this.lastSnap, normalisedSnapPoints[0]), ANDROID_NORMAL_DECELERATION_RATE, 0), IOS_NORMAL_DECELERATION_RATE))]))
414
- }), /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.Code, {
415
- exec: (0, _reactNativeReanimated.onChange)(this.isManuallySetValue, [(0, _reactNativeReanimated.cond)(this.isManuallySetValue, [(0, _reactNativeReanimated.set)(this.destSnapPoint, this.manualYOffset), (0, _reactNativeReanimated.set)(this.animationFinished, 0), (0, _reactNativeReanimated.set)(this.lastSnap, this.manualYOffset), (0, _reactNativeReanimated.call)([this.lastSnap], _ref4 => {
416
- var _this$masterDrawer2, _this$masterDrawer2$c;
417
- let [value] = _ref4;
418
- // This is the TapGHandler trick
419
- // @ts-ignore
420
- (_this$masterDrawer2 = this.masterDrawer) === null || _this$masterDrawer2 === void 0 ? void 0 : (_this$masterDrawer2$c = _this$masterDrawer2.current) === null || _this$masterDrawer2$c === void 0 ? void 0 : _this$masterDrawer2$c.setNativeProps({
421
- maxDeltaY: value - this.getNormalisedSnapPoints()[0]
422
- });
423
- })], [(0, _reactNativeReanimated.set)(this.nextSnapIndex, 0)])])
424
- }));
425
-
426
- // On Android, having an intermediary view with pointerEvents="box-none", breaks the
427
- // waitFor logic
428
- if (_reactNative.Platform.OS === "android") {
429
- return /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.TapGestureHandler, {
430
- maxDurationMs: 100000,
431
- ref: this.masterDrawer,
432
- maxDeltaY: initialSnap - this.getNormalisedSnapPoints()[0],
433
- shouldCancelWhenOutside: false
434
- }, Content);
435
- }
436
-
437
- // On iOS, We need to wrap the content on a view with PointerEvents box-none
438
- // So that we can start scrolling automatically when reaching the top without
439
- // Stopping the gesture
440
- return /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.TapGestureHandler, {
441
- maxDurationMs: 100000,
442
- ref: this.masterDrawer,
443
- maxDeltaY: initialSnap - this.getNormalisedSnapPoints()[0]
444
- }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
445
- style: _reactNative.StyleSheet.absoluteFillObject,
446
- pointerEvents: "box-none"
447
- }, Content));
448
- }
449
- }
450
- exports.ScrollBottomSheet = ScrollBottomSheet;
451
- _defineProperty(ScrollBottomSheet, "defaultProps", {
452
- topInset: 0,
453
- friction: 0.95,
454
- animationType: "timing",
455
- innerRef: /*#__PURE__*/_react.default.createRef(),
456
- enableOverScroll: false
457
- });
458
- var _default = ScrollBottomSheet;
459
- exports.default = _default;
460
- const styles = _reactNative.StyleSheet.create({
461
- container: {
462
- flex: 1
463
- }
464
- });
@@ -1,13 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "BottomSheet", {
7
- enumerable: true,
8
- get: function () {
9
- return _BottomSheet.default;
10
- }
11
- });
12
- var _BottomSheet = _interopRequireDefault(require("./BottomSheet"));
13
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }