@draftbit/core 46.8.1-e9e820.2 → 46.8.1-f215dc.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.
- package/lib/commonjs/components/Accordion/AccordionItem.js +4 -23
- package/lib/commonjs/components/DeckSwiper/DeckSwiper.js +38 -4
- package/lib/commonjs/components/ScreenContainer.js +2 -1
- package/lib/commonjs/index.js +0 -13
- package/lib/module/components/Accordion/AccordionItem.js +4 -25
- package/lib/module/components/DeckSwiper/DeckSwiper.js +38 -4
- package/lib/module/components/ScreenContainer.js +2 -1
- package/lib/module/constants.js +0 -1
- package/lib/module/index.js +0 -1
- package/lib/typescript/src/components/DeckSwiper/DeckSwiper.d.ts +8 -2
- package/lib/typescript/src/components/DeckSwiper/DeckSwiper.d.ts.map +1 -1
- package/lib/typescript/src/components/DeckSwiper/DeckSwiperCard.d.ts +2 -3
- package/lib/typescript/src/components/DeckSwiper/DeckSwiperCard.d.ts.map +1 -1
- package/lib/typescript/src/components/ScreenContainer.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +0 -1
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/package.json +3 -5
- package/src/components/DeckSwiper/DeckSwiper.js +33 -3
- package/src/components/DeckSwiper/DeckSwiper.tsx +51 -9
- package/src/components/DeckSwiper/DeckSwiperCard.js +1 -1
- package/src/components/DeckSwiper/DeckSwiperCard.tsx +3 -6
- package/src/components/ScreenContainer.js +2 -1
- package/src/components/ScreenContainer.tsx +2 -1
- package/src/index.js +0 -1
- package/src/index.tsx +0 -2
- package/lib/commonjs/components/TabView/TabView.js +0 -100
- package/lib/commonjs/components/TabView/TabViewItem.js +0 -25
- package/lib/commonjs/components/TabView/index.js +0 -20
- package/lib/commonjs/mappings/TabView.js +0 -73
- package/lib/commonjs/mappings/TabViewItem.js +0 -35
- package/lib/module/components/TabView/TabView.js +0 -90
- package/lib/module/components/TabView/TabViewItem.js +0 -20
- package/lib/module/components/TabView/index.js +0 -2
- package/lib/module/mappings/TabView.js +0 -66
- package/lib/module/mappings/TabViewItem.js +0 -28
- package/lib/typescript/src/components/TabView/TabView.d.ts +0 -26
- package/lib/typescript/src/components/TabView/TabView.d.ts.map +0 -1
- package/lib/typescript/src/components/TabView/TabViewItem.d.ts +0 -11
- package/lib/typescript/src/components/TabView/TabViewItem.d.ts.map +0 -1
- package/lib/typescript/src/components/TabView/index.d.ts +0 -3
- package/lib/typescript/src/components/TabView/index.d.ts.map +0 -1
- package/lib/typescript/src/mappings/TabView.d.ts +0 -123
- package/lib/typescript/src/mappings/TabView.d.ts.map +0 -1
- package/lib/typescript/src/mappings/TabViewItem.d.ts +0 -25
- package/lib/typescript/src/mappings/TabViewItem.d.ts.map +0 -1
- package/src/components/TabView/TabView.js +0 -45
- package/src/components/TabView/TabView.tsx +0 -129
- package/src/components/TabView/TabViewItem.js +0 -11
- package/src/components/TabView/TabViewItem.tsx +0 -25
- package/src/components/TabView/index.js +0 -2
- package/src/components/TabView/index.tsx +0 -2
- package/src/mappings/TabView.js +0 -69
- package/src/mappings/TabView.ts +0 -79
- package/src/mappings/TabViewItem.js +0 -28
- package/src/mappings/TabViewItem.ts +0 -35
|
@@ -12,6 +12,7 @@ var _theming = require("../../theming");
|
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
13
|
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); }
|
|
14
14
|
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; }
|
|
15
|
+
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); }
|
|
15
16
|
const AccordionItem = _ref => {
|
|
16
17
|
let {
|
|
17
18
|
Icon,
|
|
@@ -26,10 +27,9 @@ const AccordionItem = _ref => {
|
|
|
26
27
|
textStyles,
|
|
27
28
|
viewStyles
|
|
28
29
|
} = (0, _utilities.extractStyles)(style);
|
|
29
|
-
return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
|
|
30
|
-
style: [styles.container, viewStyles]
|
|
31
|
-
|
|
32
|
-
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
30
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({
|
|
31
|
+
style: [styles.container, viewStyles]
|
|
32
|
+
}, rest), /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
33
33
|
style: styles.row
|
|
34
34
|
}, icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
35
35
|
name: icon,
|
|
@@ -61,23 +61,4 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
61
61
|
}
|
|
62
62
|
});
|
|
63
63
|
var _default = (0, _theming.withTheme)(AccordionItem);
|
|
64
|
-
exports.default = _default;.StyleSheet.create({
|
|
65
|
-
container: {
|
|
66
|
-
padding: 8
|
|
67
|
-
},
|
|
68
|
-
row: {
|
|
69
|
-
flexDirection: "row",
|
|
70
|
-
alignItems: "center",
|
|
71
|
-
paddingLeft: 8
|
|
72
|
-
},
|
|
73
|
-
item: {
|
|
74
|
-
marginVertical: 6,
|
|
75
|
-
paddingLeft: 8
|
|
76
|
-
},
|
|
77
|
-
content: {
|
|
78
|
-
flex: 1,
|
|
79
|
-
justifyContent: "center"
|
|
80
|
-
}
|
|
81
|
-
});
|
|
82
|
-
var _default = (0, _theming.withTheme)(AccordionItem);
|
|
83
64
|
exports.default = _default;
|
|
@@ -17,13 +17,47 @@ const DeckSwiper = _ref => {
|
|
|
17
17
|
verticalEnabled = true,
|
|
18
18
|
horizontalEnabled = true,
|
|
19
19
|
visibleCardCount = 1,
|
|
20
|
+
data,
|
|
21
|
+
keyExtractor,
|
|
22
|
+
renderItem,
|
|
20
23
|
style,
|
|
21
24
|
children
|
|
22
25
|
} = _ref;
|
|
26
|
+
//Both 'renderItem' and 'data' are optional to allow direct children. But if one is included, both need to be included
|
|
27
|
+
if (data && !renderItem || renderItem && !data) {
|
|
28
|
+
throw new Error("'renderItem' and 'data' need to both be provided to lazily render. Either remove them entirley or include both");
|
|
29
|
+
}
|
|
30
|
+
if (data && renderItem && children) {
|
|
31
|
+
console.warn("'children' of DeckSwiper ignored due to usage of 'data' and 'renderItem'");
|
|
32
|
+
}
|
|
23
33
|
const childrenArray = _react.default.useMemo(() => _react.default.Children.toArray(children), [children]);
|
|
24
34
|
|
|
25
35
|
// an array of indices based on children count
|
|
26
36
|
const cardsFillerData = _react.default.useMemo(() => Array.from(Array(childrenArray.length).keys()), [childrenArray]);
|
|
37
|
+
const cardsData = data || cardsFillerData;
|
|
38
|
+
const renderCard = (card, index) => {
|
|
39
|
+
if (renderItem) {
|
|
40
|
+
return renderItem({
|
|
41
|
+
item: card,
|
|
42
|
+
index
|
|
43
|
+
});
|
|
44
|
+
} else {
|
|
45
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, childrenArray[index]);
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
const renderFirstCard = () => {
|
|
49
|
+
if (cardsData.length) {
|
|
50
|
+
return renderCard(cardsData[0], 0);
|
|
51
|
+
}
|
|
52
|
+
return undefined;
|
|
53
|
+
};
|
|
54
|
+
const cardKeyExtractor = card => {
|
|
55
|
+
if (keyExtractor) {
|
|
56
|
+
return keyExtractor(card);
|
|
57
|
+
} else {
|
|
58
|
+
return card === null || card === void 0 ? void 0 : card.toString();
|
|
59
|
+
}
|
|
60
|
+
};
|
|
27
61
|
|
|
28
62
|
/**
|
|
29
63
|
* By default react-native-deck-swiper positions everything with absolute position.
|
|
@@ -37,10 +71,10 @@ const DeckSwiper = _ref => {
|
|
|
37
71
|
|
|
38
72
|
return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
39
73
|
style: styles.containerHeightFiller
|
|
40
|
-
},
|
|
41
|
-
cards:
|
|
42
|
-
renderCard:
|
|
43
|
-
keyExtractor:
|
|
74
|
+
}, renderFirstCard()), /*#__PURE__*/_react.default.createElement(_reactNativeDeckSwiper.default, {
|
|
75
|
+
cards: cardsData,
|
|
76
|
+
renderCard: renderCard,
|
|
77
|
+
keyExtractor: cardKeyExtractor,
|
|
44
78
|
containerStyle: _reactNative.StyleSheet.flatten([styles.cardsContainer, style]),
|
|
45
79
|
cardStyle: styles.card,
|
|
46
80
|
onSwiped: onIndexChanged,
|
|
@@ -12,6 +12,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
12
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
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
14
|
function ScreenContainer(_ref) {
|
|
15
|
+
var _StyleSheet$flatten;
|
|
15
16
|
let {
|
|
16
17
|
scrollable = false,
|
|
17
18
|
hasSafeArea = false,
|
|
@@ -22,7 +23,7 @@ function ScreenContainer(_ref) {
|
|
|
22
23
|
children,
|
|
23
24
|
...rest
|
|
24
25
|
} = _ref;
|
|
25
|
-
const backgroundColor = theme.colors.background;
|
|
26
|
+
const backgroundColor = ((_StyleSheet$flatten = _reactNative.StyleSheet.flatten(style)) === null || _StyleSheet$flatten === void 0 ? void 0 : _StyleSheet$flatten.backgroundColor) || theme.colors.background;
|
|
26
27
|
const edges = ["left", "right"];
|
|
27
28
|
if (hasSafeArea || hasTopSafeArea) {
|
|
28
29
|
edges.push("top");
|
package/lib/commonjs/index.js
CHANGED
|
@@ -339,18 +339,6 @@ Object.defineProperty(exports, "SwitchRow", {
|
|
|
339
339
|
return _Switch.SwitchRow;
|
|
340
340
|
}
|
|
341
341
|
});
|
|
342
|
-
Object.defineProperty(exports, "TabView", {
|
|
343
|
-
enumerable: true,
|
|
344
|
-
get: function () {
|
|
345
|
-
return _TabView.TabView;
|
|
346
|
-
}
|
|
347
|
-
});
|
|
348
|
-
Object.defineProperty(exports, "TabViewItem", {
|
|
349
|
-
enumerable: true,
|
|
350
|
-
get: function () {
|
|
351
|
-
return _TabView.TabViewItem;
|
|
352
|
-
}
|
|
353
|
-
});
|
|
354
342
|
Object.defineProperty(exports, "TextField", {
|
|
355
343
|
enumerable: true,
|
|
356
344
|
get: function () {
|
|
@@ -426,7 +414,6 @@ var _Swiper = require("./components/Swiper");
|
|
|
426
414
|
var _Layout = require("./components/Layout");
|
|
427
415
|
var _index = require("./components/RadioButton/index");
|
|
428
416
|
var _DeckSwiper = require("./components/DeckSwiper");
|
|
429
|
-
var _TabView = require("./components/TabView");
|
|
430
417
|
var _DatePicker = _interopRequireDefault(require("./components/DatePicker/DatePicker"));
|
|
431
418
|
var _Picker = _interopRequireDefault(require("./components/Picker/Picker"));
|
|
432
419
|
var _ProgressBar = _interopRequireDefault(require("./components/ProgressBar"));
|
|
@@ -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 * as React from "react";
|
|
2
3
|
import { Pressable, StyleSheet, View } from "react-native";
|
|
3
4
|
import Text from "../Text";
|
|
@@ -17,10 +18,9 @@ const AccordionItem = _ref => {
|
|
|
17
18
|
textStyles,
|
|
18
19
|
viewStyles
|
|
19
20
|
} = extractStyles(style);
|
|
20
|
-
return /*#__PURE__*/React.createElement(Pressable, {
|
|
21
|
-
style: [styles.container, viewStyles]
|
|
22
|
-
|
|
23
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
21
|
+
return /*#__PURE__*/React.createElement(Pressable, _extends({
|
|
22
|
+
style: [styles.container, viewStyles]
|
|
23
|
+
}, rest), /*#__PURE__*/React.createElement(View, {
|
|
24
24
|
style: styles.row
|
|
25
25
|
}, icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
26
26
|
name: icon,
|
|
@@ -51,25 +51,4 @@ const styles = StyleSheet.create({
|
|
|
51
51
|
justifyContent: "center"
|
|
52
52
|
}
|
|
53
53
|
});
|
|
54
|
-
export default withTheme(AccordionItem);xtStyles
|
|
55
|
-
}, label))));
|
|
56
|
-
};
|
|
57
|
-
const styles = StyleSheet.create({
|
|
58
|
-
container: {
|
|
59
|
-
padding: 8
|
|
60
|
-
},
|
|
61
|
-
row: {
|
|
62
|
-
flexDirection: "row",
|
|
63
|
-
alignItems: "center",
|
|
64
|
-
paddingLeft: 8
|
|
65
|
-
},
|
|
66
|
-
item: {
|
|
67
|
-
marginVertical: 6,
|
|
68
|
-
paddingLeft: 8
|
|
69
|
-
},
|
|
70
|
-
content: {
|
|
71
|
-
flex: 1,
|
|
72
|
-
justifyContent: "center"
|
|
73
|
-
}
|
|
74
|
-
});
|
|
75
54
|
export default withTheme(AccordionItem);
|
|
@@ -10,13 +10,47 @@ const DeckSwiper = _ref => {
|
|
|
10
10
|
verticalEnabled = true,
|
|
11
11
|
horizontalEnabled = true,
|
|
12
12
|
visibleCardCount = 1,
|
|
13
|
+
data,
|
|
14
|
+
keyExtractor,
|
|
15
|
+
renderItem,
|
|
13
16
|
style,
|
|
14
17
|
children
|
|
15
18
|
} = _ref;
|
|
19
|
+
//Both 'renderItem' and 'data' are optional to allow direct children. But if one is included, both need to be included
|
|
20
|
+
if (data && !renderItem || renderItem && !data) {
|
|
21
|
+
throw new Error("'renderItem' and 'data' need to both be provided to lazily render. Either remove them entirley or include both");
|
|
22
|
+
}
|
|
23
|
+
if (data && renderItem && children) {
|
|
24
|
+
console.warn("'children' of DeckSwiper ignored due to usage of 'data' and 'renderItem'");
|
|
25
|
+
}
|
|
16
26
|
const childrenArray = React.useMemo(() => React.Children.toArray(children), [children]);
|
|
17
27
|
|
|
18
28
|
// an array of indices based on children count
|
|
19
29
|
const cardsFillerData = React.useMemo(() => Array.from(Array(childrenArray.length).keys()), [childrenArray]);
|
|
30
|
+
const cardsData = data || cardsFillerData;
|
|
31
|
+
const renderCard = (card, index) => {
|
|
32
|
+
if (renderItem) {
|
|
33
|
+
return renderItem({
|
|
34
|
+
item: card,
|
|
35
|
+
index
|
|
36
|
+
});
|
|
37
|
+
} else {
|
|
38
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, childrenArray[index]);
|
|
39
|
+
}
|
|
40
|
+
};
|
|
41
|
+
const renderFirstCard = () => {
|
|
42
|
+
if (cardsData.length) {
|
|
43
|
+
return renderCard(cardsData[0], 0);
|
|
44
|
+
}
|
|
45
|
+
return undefined;
|
|
46
|
+
};
|
|
47
|
+
const cardKeyExtractor = card => {
|
|
48
|
+
if (keyExtractor) {
|
|
49
|
+
return keyExtractor(card);
|
|
50
|
+
} else {
|
|
51
|
+
return card === null || card === void 0 ? void 0 : card.toString();
|
|
52
|
+
}
|
|
53
|
+
};
|
|
20
54
|
|
|
21
55
|
/**
|
|
22
56
|
* By default react-native-deck-swiper positions everything with absolute position.
|
|
@@ -30,10 +64,10 @@ const DeckSwiper = _ref => {
|
|
|
30
64
|
|
|
31
65
|
return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
|
|
32
66
|
style: styles.containerHeightFiller
|
|
33
|
-
},
|
|
34
|
-
cards:
|
|
35
|
-
renderCard:
|
|
36
|
-
keyExtractor:
|
|
67
|
+
}, renderFirstCard()), /*#__PURE__*/React.createElement(DeckSwiperComponent, {
|
|
68
|
+
cards: cardsData,
|
|
69
|
+
renderCard: renderCard,
|
|
70
|
+
keyExtractor: cardKeyExtractor,
|
|
37
71
|
containerStyle: StyleSheet.flatten([styles.cardsContainer, style]),
|
|
38
72
|
cardStyle: styles.card,
|
|
39
73
|
onSwiped: onIndexChanged,
|
|
@@ -4,6 +4,7 @@ import { StyleSheet, ScrollView, View } from "react-native";
|
|
|
4
4
|
import { SafeAreaView } from "react-native-safe-area-context";
|
|
5
5
|
import { withTheme } from "../theming";
|
|
6
6
|
function ScreenContainer(_ref) {
|
|
7
|
+
var _StyleSheet$flatten;
|
|
7
8
|
let {
|
|
8
9
|
scrollable = false,
|
|
9
10
|
hasSafeArea = false,
|
|
@@ -14,7 +15,7 @@ function ScreenContainer(_ref) {
|
|
|
14
15
|
children,
|
|
15
16
|
...rest
|
|
16
17
|
} = _ref;
|
|
17
|
-
const backgroundColor = theme.colors.background;
|
|
18
|
+
const backgroundColor = ((_StyleSheet$flatten = StyleSheet.flatten(style)) === null || _StyleSheet$flatten === void 0 ? void 0 : _StyleSheet$flatten.backgroundColor) || theme.colors.background;
|
|
18
19
|
const edges = ["left", "right"];
|
|
19
20
|
if (hasSafeArea || hasTopSafeArea) {
|
|
20
21
|
edges.push("top");
|
package/lib/module/constants.js
CHANGED
package/lib/module/index.js
CHANGED
|
@@ -32,7 +32,6 @@ export { Swiper, SwiperItem } from "./components/Swiper";
|
|
|
32
32
|
export { Center, Circle, Square, Row, Stack, Spacer } from "./components/Layout";
|
|
33
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup } from "./components/RadioButton/index";
|
|
34
34
|
export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
|
|
35
|
-
export { TabView, TabViewItem } from "./components/TabView";
|
|
36
35
|
|
|
37
36
|
/* Deprecated: Fix or Delete! */
|
|
38
37
|
export { default as DatePicker } from "./components/DatePicker/DatePicker";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { StyleProp, ViewStyle } from "react-native";
|
|
3
|
-
export interface DeckSwiperProps {
|
|
3
|
+
export interface DeckSwiperProps<T> {
|
|
4
4
|
onIndexChanged?: (index: number) => void;
|
|
5
5
|
onEndReached?: () => void;
|
|
6
6
|
startCardIndex?: number;
|
|
@@ -8,8 +8,14 @@ export interface DeckSwiperProps {
|
|
|
8
8
|
verticalEnabled?: boolean;
|
|
9
9
|
horizontalEnabled?: boolean;
|
|
10
10
|
visibleCardCount?: number;
|
|
11
|
+
data?: Array<T>;
|
|
12
|
+
keyExtractor?: (item: T) => string;
|
|
13
|
+
renderItem?: ({ item, index }: {
|
|
14
|
+
item: T;
|
|
15
|
+
index: number;
|
|
16
|
+
}) => JSX.Element;
|
|
11
17
|
style?: StyleProp<ViewStyle>;
|
|
12
18
|
}
|
|
13
|
-
declare const DeckSwiper:
|
|
19
|
+
declare const DeckSwiper: <T extends object>({ onIndexChanged, onEndReached, startCardIndex, infiniteSwiping, verticalEnabled, horizontalEnabled, visibleCardCount, data, keyExtractor, renderItem, style, children, }: React.PropsWithChildren<DeckSwiperProps<T>>) => JSX.Element;
|
|
14
20
|
export default DeckSwiper;
|
|
15
21
|
//# sourceMappingURL=DeckSwiper.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DeckSwiper.d.ts","sourceRoot":"","sources":["../../../../../src/components/DeckSwiper/DeckSwiper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,SAAS,EAAoB,MAAM,cAAc,CAAC;AAGtE,MAAM,WAAW,eAAe;
|
|
1
|
+
{"version":3,"file":"DeckSwiper.d.ts","sourceRoot":"","sources":["../../../../../src/components/DeckSwiper/DeckSwiper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,SAAS,EAAoB,MAAM,cAAc,CAAC;AAGtE,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;IAChB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE;QAAE,IAAI,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAC1E,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;AAED,QAAA,MAAM,UAAU,2PAoGf,CAAC;AAiBF,eAAe,UAAU,CAAC"}
|
|
@@ -3,11 +3,10 @@ import { StyleProp, ViewStyle } from "react-native";
|
|
|
3
3
|
import type { Theme } from "../../styles/DefaultTheme";
|
|
4
4
|
export interface DeckSwiperCardProps {
|
|
5
5
|
style?: StyleProp<ViewStyle>;
|
|
6
|
-
children: React.ReactNode;
|
|
7
6
|
theme: Theme;
|
|
8
7
|
}
|
|
9
|
-
declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<DeckSwiperCardProps
|
|
8
|
+
declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<React.PropsWithChildren<DeckSwiperCardProps>, "theme"> & {
|
|
10
9
|
theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
|
|
11
|
-
}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<DeckSwiperCardProps
|
|
10
|
+
}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<React.PropsWithChildren<DeckSwiperCardProps>> & React.FC<React.PropsWithChildren<DeckSwiperCardProps>>, {}>;
|
|
12
11
|
export default _default;
|
|
13
12
|
//# sourceMappingURL=DeckSwiperCard.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DeckSwiperCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/DeckSwiper/DeckSwiperCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAoB,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACtE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAGvD,MAAM,WAAW,mBAAmB;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,
|
|
1
|
+
{"version":3,"file":"DeckSwiperCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/DeckSwiper/DeckSwiperCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAoB,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACtE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAGvD,MAAM,WAAW,mBAAmB;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,KAAK,EAAE,KAAK,CAAC;CACd;;;;AA6BD,wBAAyC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScreenContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/ScreenContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,SAAS,EACT,SAAS,EAEV,MAAM,cAAc,CAAC;AAItB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAEpD,aAAK,oBAAoB,GAAG;IAC1B,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,iBAAS,eAAe,CAAC,EACvB,UAAkB,EAClB,WAAmB,EACnB,iBAAyB,EACzB,cAAsB,EACtB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,oBAAoB,
|
|
1
|
+
{"version":3,"file":"ScreenContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/ScreenContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,SAAS,EACT,SAAS,EAEV,MAAM,cAAc,CAAC;AAItB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAEpD,aAAK,oBAAoB,GAAG;IAC1B,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,iBAAS,eAAe,CAAC,EACvB,UAAkB,EAClB,WAAmB,EACnB,iBAAyB,EACzB,cAAsB,EACtB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,oBAAoB,eAyCtB;;;;AAYD,wBAA0C"}
|
|
@@ -32,7 +32,6 @@ export { Swiper, SwiperItem } from "./components/Swiper";
|
|
|
32
32
|
export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
|
|
33
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
|
|
34
34
|
export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
|
|
35
|
-
export { TabView, TabViewItem } from "./components/TabView";
|
|
36
35
|
export { default as DatePicker } from "./components/DatePicker/DatePicker";
|
|
37
36
|
export { default as Picker } from "./components/Picker/Picker";
|
|
38
37
|
export { default as ProgressBar } from "./components/ProgressBar";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAEhE,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAChF,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC1E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvE,OAAO,EACL,WAAW,EACX,eAAe,EACf,iBAAiB,GAClB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAEzD,OAAO,EACL,MAAM,EACN,MAAM,EACN,MAAM,EACN,GAAG,EACH,KAAK,EACL,MAAM,GACP,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,qBAAqB,GACtB,MAAM,gCAAgC,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@draftbit/core",
|
|
3
|
-
"version": "46.8.1-
|
|
3
|
+
"version": "46.8.1-f215dc.2+f215dc9",
|
|
4
4
|
"description": "Core (non-native) Components",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"module": "lib/module/index.js",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"dependencies": {
|
|
42
42
|
"@date-io/date-fns": "^1.3.13",
|
|
43
43
|
"@draftbit/react-theme-provider": "^2.1.1",
|
|
44
|
-
"@draftbit/types": "^46.8.1-
|
|
44
|
+
"@draftbit/types": "^46.8.1-f215dc.2+f215dc9",
|
|
45
45
|
"@material-ui/core": "^4.11.0",
|
|
46
46
|
"@material-ui/pickers": "^3.2.10",
|
|
47
47
|
"@react-native-community/slider": "4.2.3",
|
|
@@ -55,9 +55,7 @@
|
|
|
55
55
|
"lodash.tonumber": "^4.0.3",
|
|
56
56
|
"react-native-deck-swiper": "^2.0.12",
|
|
57
57
|
"react-native-modal-datetime-picker": "^13.0.0",
|
|
58
|
-
"react-native-pager-view": "5.4.24",
|
|
59
58
|
"react-native-svg": "12.3.0",
|
|
60
|
-
"react-native-tab-view": "^3.4.0",
|
|
61
59
|
"react-native-typography": "^1.4.1",
|
|
62
60
|
"react-native-web-swiper": "^2.2.3"
|
|
63
61
|
},
|
|
@@ -94,5 +92,5 @@
|
|
|
94
92
|
]
|
|
95
93
|
]
|
|
96
94
|
},
|
|
97
|
-
"gitHead": "
|
|
95
|
+
"gitHead": "f215dc9ddb10509759b18ce9c02b3a3ba100f3be"
|
|
98
96
|
}
|
|
@@ -1,10 +1,40 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { StyleSheet, View } from "react-native";
|
|
3
3
|
import DeckSwiperComponent from "react-native-deck-swiper";
|
|
4
|
-
const DeckSwiper = ({ onIndexChanged, onEndReached, startCardIndex = 0, infiniteSwiping = false, verticalEnabled = true, horizontalEnabled = true, visibleCardCount = 1, style, children, }) => {
|
|
4
|
+
const DeckSwiper = ({ onIndexChanged, onEndReached, startCardIndex = 0, infiniteSwiping = false, verticalEnabled = true, horizontalEnabled = true, visibleCardCount = 1, data, keyExtractor, renderItem, style, children, }) => {
|
|
5
|
+
//Both 'renderItem' and 'data' are optional to allow direct children. But if one is included, both need to be included
|
|
6
|
+
if ((data && !renderItem) || (renderItem && !data)) {
|
|
7
|
+
throw new Error("'renderItem' and 'data' need to both be provided to lazily render. Either remove them entirley or include both");
|
|
8
|
+
}
|
|
9
|
+
if (data && renderItem && children) {
|
|
10
|
+
console.warn("'children' of DeckSwiper ignored due to usage of 'data' and 'renderItem'");
|
|
11
|
+
}
|
|
5
12
|
const childrenArray = React.useMemo(() => React.Children.toArray(children), [children]);
|
|
6
13
|
// an array of indices based on children count
|
|
7
14
|
const cardsFillerData = React.useMemo(() => Array.from(Array(childrenArray.length).keys()), [childrenArray]);
|
|
15
|
+
const cardsData = data || cardsFillerData;
|
|
16
|
+
const renderCard = (card, index) => {
|
|
17
|
+
if (renderItem) {
|
|
18
|
+
return renderItem({ item: card, index });
|
|
19
|
+
}
|
|
20
|
+
else {
|
|
21
|
+
return React.createElement(React.Fragment, null, childrenArray[index]);
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
const renderFirstCard = () => {
|
|
25
|
+
if (cardsData.length) {
|
|
26
|
+
return renderCard(cardsData[0], 0);
|
|
27
|
+
}
|
|
28
|
+
return undefined;
|
|
29
|
+
};
|
|
30
|
+
const cardKeyExtractor = (card) => {
|
|
31
|
+
if (keyExtractor) {
|
|
32
|
+
return keyExtractor(card);
|
|
33
|
+
}
|
|
34
|
+
else {
|
|
35
|
+
return card === null || card === void 0 ? void 0 : card.toString();
|
|
36
|
+
}
|
|
37
|
+
};
|
|
8
38
|
/**
|
|
9
39
|
* By default react-native-deck-swiper positions everything with absolute position.
|
|
10
40
|
* To overcome this, it is wrapped in a View to be able to add the component in any layout structure.
|
|
@@ -15,8 +45,8 @@ const DeckSwiper = ({ onIndexChanged, onEndReached, startCardIndex = 0, infinite
|
|
|
15
45
|
* This effectivley makes the default height of the container be the height of the first card.
|
|
16
46
|
*/
|
|
17
47
|
return (React.createElement(View, null,
|
|
18
|
-
React.createElement(View, { style: styles.containerHeightFiller },
|
|
19
|
-
React.createElement(DeckSwiperComponent, { cards:
|
|
48
|
+
React.createElement(View, { style: styles.containerHeightFiller }, renderFirstCard()),
|
|
49
|
+
React.createElement(DeckSwiperComponent, { cards: cardsData, renderCard: renderCard, keyExtractor: cardKeyExtractor, containerStyle: StyleSheet.flatten([styles.cardsContainer, style]), cardStyle: styles.card, onSwiped: onIndexChanged, onSwipedAll: onEndReached, cardIndex: startCardIndex, infinite: infiniteSwiping, verticalSwipe: verticalEnabled, horizontalSwipe: horizontalEnabled, showSecondCard: visibleCardCount > 1, stackSize: visibleCardCount, backgroundColor: "transparent", cardVerticalMargin: 0, cardHorizontalMargin: 0 })));
|
|
20
50
|
};
|
|
21
51
|
const styles = StyleSheet.create({
|
|
22
52
|
cardsContainer: {
|
|
@@ -2,7 +2,7 @@ import React from "react";
|
|
|
2
2
|
import { StyleProp, ViewStyle, StyleSheet, View } from "react-native";
|
|
3
3
|
import DeckSwiperComponent from "react-native-deck-swiper";
|
|
4
4
|
|
|
5
|
-
export interface DeckSwiperProps {
|
|
5
|
+
export interface DeckSwiperProps<T> {
|
|
6
6
|
onIndexChanged?: (index: number) => void;
|
|
7
7
|
onEndReached?: () => void;
|
|
8
8
|
startCardIndex?: number;
|
|
@@ -10,10 +10,13 @@ export interface DeckSwiperProps {
|
|
|
10
10
|
verticalEnabled?: boolean;
|
|
11
11
|
horizontalEnabled?: boolean;
|
|
12
12
|
visibleCardCount?: number;
|
|
13
|
+
data?: Array<T>;
|
|
14
|
+
keyExtractor?: (item: T) => string;
|
|
15
|
+
renderItem?: ({ item, index }: { item: T; index: number }) => JSX.Element;
|
|
13
16
|
style?: StyleProp<ViewStyle>;
|
|
14
17
|
}
|
|
15
18
|
|
|
16
|
-
const DeckSwiper
|
|
19
|
+
const DeckSwiper = <T extends object>({
|
|
17
20
|
onIndexChanged,
|
|
18
21
|
onEndReached,
|
|
19
22
|
startCardIndex = 0,
|
|
@@ -21,9 +24,25 @@ const DeckSwiper: React.FC<React.PropsWithChildren<DeckSwiperProps>> = ({
|
|
|
21
24
|
verticalEnabled = true,
|
|
22
25
|
horizontalEnabled = true,
|
|
23
26
|
visibleCardCount = 1,
|
|
27
|
+
data,
|
|
28
|
+
keyExtractor,
|
|
29
|
+
renderItem,
|
|
24
30
|
style,
|
|
25
31
|
children,
|
|
26
|
-
}) => {
|
|
32
|
+
}: React.PropsWithChildren<DeckSwiperProps<T>>) => {
|
|
33
|
+
//Both 'renderItem' and 'data' are optional to allow direct children. But if one is included, both need to be included
|
|
34
|
+
if ((data && !renderItem) || (renderItem && !data)) {
|
|
35
|
+
throw new Error(
|
|
36
|
+
"'renderItem' and 'data' need to both be provided to lazily render. Either remove them entirley or include both"
|
|
37
|
+
);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
if (data && renderItem && children) {
|
|
41
|
+
console.warn(
|
|
42
|
+
"'children' of DeckSwiper ignored due to usage of 'data' and 'renderItem'"
|
|
43
|
+
);
|
|
44
|
+
}
|
|
45
|
+
|
|
27
46
|
const childrenArray = React.useMemo(
|
|
28
47
|
() => React.Children.toArray(children),
|
|
29
48
|
[children]
|
|
@@ -35,6 +54,31 @@ const DeckSwiper: React.FC<React.PropsWithChildren<DeckSwiperProps>> = ({
|
|
|
35
54
|
[childrenArray]
|
|
36
55
|
);
|
|
37
56
|
|
|
57
|
+
const cardsData = data || cardsFillerData;
|
|
58
|
+
|
|
59
|
+
const renderCard = (card: any, index: number): JSX.Element => {
|
|
60
|
+
if (renderItem) {
|
|
61
|
+
return renderItem({ item: card, index });
|
|
62
|
+
} else {
|
|
63
|
+
return <>{childrenArray[index]}</>;
|
|
64
|
+
}
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
const renderFirstCard = (): JSX.Element | undefined => {
|
|
68
|
+
if (cardsData.length) {
|
|
69
|
+
return renderCard(cardsData[0], 0);
|
|
70
|
+
}
|
|
71
|
+
return undefined;
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
const cardKeyExtractor = (card: any) => {
|
|
75
|
+
if (keyExtractor) {
|
|
76
|
+
return keyExtractor(card);
|
|
77
|
+
} else {
|
|
78
|
+
return card?.toString();
|
|
79
|
+
}
|
|
80
|
+
};
|
|
81
|
+
|
|
38
82
|
/**
|
|
39
83
|
* By default react-native-deck-swiper positions everything with absolute position.
|
|
40
84
|
* To overcome this, it is wrapped in a View to be able to add the component in any layout structure.
|
|
@@ -47,13 +91,11 @@ const DeckSwiper: React.FC<React.PropsWithChildren<DeckSwiperProps>> = ({
|
|
|
47
91
|
|
|
48
92
|
return (
|
|
49
93
|
<View>
|
|
50
|
-
<View style={styles.containerHeightFiller}>
|
|
51
|
-
{childrenArray.length && childrenArray[0]}
|
|
52
|
-
</View>
|
|
94
|
+
<View style={styles.containerHeightFiller}>{renderFirstCard()}</View>
|
|
53
95
|
<DeckSwiperComponent
|
|
54
|
-
cards={
|
|
55
|
-
renderCard={
|
|
56
|
-
keyExtractor={
|
|
96
|
+
cards={cardsData as any[]}
|
|
97
|
+
renderCard={renderCard}
|
|
98
|
+
keyExtractor={cardKeyExtractor}
|
|
57
99
|
containerStyle={
|
|
58
100
|
StyleSheet.flatten([styles.cardsContainer, style]) as
|
|
59
101
|
| object
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { View, StyleSheet } from "react-native";
|
|
3
3
|
import { withTheme } from "../../theming";
|
|
4
|
-
const DeckSwiperCard = ({ style, children, theme
|
|
4
|
+
const DeckSwiperCard = ({ style, children, theme }) => (React.createElement(View, { style: [
|
|
5
5
|
styles.card,
|
|
6
6
|
{
|
|
7
7
|
backgroundColor: theme.colors.background,
|
|
@@ -5,15 +5,12 @@ import { withTheme } from "../../theming";
|
|
|
5
5
|
|
|
6
6
|
export interface DeckSwiperCardProps {
|
|
7
7
|
style?: StyleProp<ViewStyle>;
|
|
8
|
-
children: React.ReactNode;
|
|
9
8
|
theme: Theme;
|
|
10
9
|
}
|
|
11
10
|
|
|
12
|
-
const DeckSwiperCard: React.FC<
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
theme,
|
|
16
|
-
}) => (
|
|
11
|
+
const DeckSwiperCard: React.FC<
|
|
12
|
+
React.PropsWithChildren<DeckSwiperCardProps>
|
|
13
|
+
> = ({ style, children, theme }) => (
|
|
17
14
|
<View
|
|
18
15
|
style={[
|
|
19
16
|
styles.card,
|
|
@@ -3,7 +3,8 @@ import { StyleSheet, ScrollView, View, } from "react-native";
|
|
|
3
3
|
import { SafeAreaView } from "react-native-safe-area-context";
|
|
4
4
|
import { withTheme } from "../theming";
|
|
5
5
|
function ScreenContainer({ scrollable = false, hasSafeArea = false, hasBottomSafeArea = false, hasTopSafeArea = false, theme, style, children, ...rest }) {
|
|
6
|
-
|
|
6
|
+
var _a;
|
|
7
|
+
const backgroundColor = ((_a = StyleSheet.flatten(style)) === null || _a === void 0 ? void 0 : _a.backgroundColor) || theme.colors.background;
|
|
7
8
|
const edges = ["left", "right"];
|
|
8
9
|
if (hasSafeArea || hasTopSafeArea) {
|
|
9
10
|
edges.push("top");
|
|
@@ -31,7 +31,8 @@ function ScreenContainer({
|
|
|
31
31
|
children,
|
|
32
32
|
...rest
|
|
33
33
|
}: ScreenContainerProps) {
|
|
34
|
-
const backgroundColor =
|
|
34
|
+
const backgroundColor =
|
|
35
|
+
StyleSheet.flatten(style)?.backgroundColor || theme.colors.background;
|
|
35
36
|
|
|
36
37
|
const edges: Edge[] = ["left", "right"];
|
|
37
38
|
if (hasSafeArea || hasTopSafeArea) {
|
package/src/index.js
CHANGED
|
@@ -32,7 +32,6 @@ export { Swiper, SwiperItem } from "./components/Swiper";
|
|
|
32
32
|
export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
|
|
33
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
|
|
34
34
|
export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
|
|
35
|
-
export { TabView, TabViewItem } from "./components/TabView";
|
|
36
35
|
/* Deprecated: Fix or Delete! */
|
|
37
36
|
export { default as DatePicker } from "./components/DatePicker/DatePicker";
|
|
38
37
|
export { default as Picker } from "./components/Picker/Picker";
|
package/src/index.tsx
CHANGED
|
@@ -53,8 +53,6 @@ export {
|
|
|
53
53
|
|
|
54
54
|
export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
|
|
55
55
|
|
|
56
|
-
export { TabView, TabViewItem } from "./components/TabView";
|
|
57
|
-
|
|
58
56
|
/* Deprecated: Fix or Delete! */
|
|
59
57
|
export { default as DatePicker } from "./components/DatePicker/DatePicker";
|
|
60
58
|
export { default as Picker } from "./components/Picker/Picker";
|