@draftbit/core 46.7.9-9ce779.2 → 46.7.9-b47217.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/DeprecatedFAB.js +21 -3
- package/lib/commonjs/components/Divider.js +14 -1
- package/lib/commonjs/components/Portal/PortalManager.js +8 -34
- package/lib/commonjs/index.js +0 -13
- package/lib/commonjs/mappings/DatePickerModal.js +145 -0
- package/lib/commonjs/styles/overlay.js +1 -3
- package/lib/module/components/AnimatedCircularProgress.js +1 -13
- package/lib/module/components/Container.js +4 -17
- package/lib/module/components/Divider.js +1 -18
- package/lib/module/components/Picker/PickerComponent.web.js +3 -21
- package/lib/module/components/Pressable.js +2 -15
- package/lib/module/components/Slider.js +4 -21
- package/lib/module/components/StarRating.js +4 -24
- package/lib/module/components/StepIndicator.js +18 -58
- package/lib/module/components/Switch.js +10 -21
- package/lib/module/constants.js +0 -1
- package/lib/module/hooks.js +2 -1
- package/lib/module/index.js +0 -1
- package/lib/module/mappings/DatePickerModal.js +139 -0
- package/lib/module/styles/overlay.js +3 -1
- package/lib/typescript/src/index.d.ts +0 -1
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/mappings/DatePickerModal.d.ts +241 -0
- package/lib/typescript/src/mappings/DatePickerModal.d.ts.map +1 -0
- package/package.json +3 -4
- package/src/index.js +0 -1
- package/src/index.tsx +0 -2
- package/src/mappings/DatePickerModal.js +146 -0
- package/src/mappings/DatePickerModal.ts +168 -0
- package/lib/commonjs/components/DeckSwiper/DeckSwiper.js +0 -73
- package/lib/commonjs/components/DeckSwiper/DeckSwiperCard.js +0 -35
- package/lib/commonjs/components/DeckSwiper/index.js +0 -20
- package/lib/commonjs/mappings/DeckSwiper.js +0 -52
- package/lib/commonjs/mappings/DeckSwiperCard.js +0 -16
- package/lib/module/components/DeckSwiper/DeckSwiper.js +0 -65
- package/lib/module/components/DeckSwiper/DeckSwiperCard.js +0 -27
- package/lib/module/components/DeckSwiper/index.js +0 -2
- package/lib/module/mappings/DeckSwiper.js +0 -45
- package/lib/module/mappings/DeckSwiperCard.js +0 -9
- package/lib/typescript/src/components/DeckSwiper/DeckSwiper.d.ts +0 -15
- package/lib/typescript/src/components/DeckSwiper/DeckSwiper.d.ts.map +0 -1
- package/lib/typescript/src/components/DeckSwiper/DeckSwiperCard.d.ts +0 -13
- package/lib/typescript/src/components/DeckSwiper/DeckSwiperCard.d.ts.map +0 -1
- package/lib/typescript/src/components/DeckSwiper/index.d.ts +0 -3
- package/lib/typescript/src/components/DeckSwiper/index.d.ts.map +0 -1
- package/lib/typescript/src/mappings/DeckSwiper.d.ts +0 -83
- package/lib/typescript/src/mappings/DeckSwiper.d.ts.map +0 -1
- package/lib/typescript/src/mappings/DeckSwiperCard.d.ts +0 -9
- package/lib/typescript/src/mappings/DeckSwiperCard.d.ts.map +0 -1
- package/src/components/DeckSwiper/DeckSwiper.js +0 -34
- package/src/components/DeckSwiper/DeckSwiper.tsx +0 -93
- package/src/components/DeckSwiper/DeckSwiperCard.js +0 -22
- package/src/components/DeckSwiper/DeckSwiperCard.tsx +0 -42
- package/src/components/DeckSwiper/index.js +0 -2
- package/src/components/DeckSwiper/index.tsx +0 -2
- package/src/mappings/DeckSwiper.js +0 -45
- package/src/mappings/DeckSwiper.ts +0 -54
- package/src/mappings/DeckSwiperCard.js +0 -9
- package/src/mappings/DeckSwiperCard.ts +0 -13
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, Triggers, createActionProp, createStaticNumberProp, createStaticBoolProp, BLOCK_STYLES_SECTIONS } from "@draftbit/types";
|
|
2
|
-
export const SEED_DATA = {
|
|
3
|
-
name: "Deck Swiper",
|
|
4
|
-
tag: "DeckSwiper",
|
|
5
|
-
description: "Deck swiper container",
|
|
6
|
-
category: COMPONENT_TYPES.swiper,
|
|
7
|
-
stylesPanelSections: BLOCK_STYLES_SECTIONS,
|
|
8
|
-
triggers: [Triggers.OnIndexChanged, Triggers.OnEndReached],
|
|
9
|
-
props: {
|
|
10
|
-
onIndexChanged: createActionProp({
|
|
11
|
-
label: "On index changed",
|
|
12
|
-
description: "Action to execute when swipe to new index"
|
|
13
|
-
}),
|
|
14
|
-
onEndReached: createActionProp({
|
|
15
|
-
label: "On end reached",
|
|
16
|
-
description: "Action to execute when end of swiping reached"
|
|
17
|
-
}),
|
|
18
|
-
startCardIndex: createStaticNumberProp({
|
|
19
|
-
label: "Start card index",
|
|
20
|
-
description: "Index of card to start swiping from",
|
|
21
|
-
defaultValue: 0
|
|
22
|
-
}),
|
|
23
|
-
infiniteSwiping: createStaticBoolProp({
|
|
24
|
-
label: "Infinite swiping",
|
|
25
|
-
description: "Whether to infinitley loop through cards or not"
|
|
26
|
-
}),
|
|
27
|
-
verticalEnabled: createStaticBoolProp({
|
|
28
|
-
label: "Vertical swipe enabled",
|
|
29
|
-
description: "Whether cards should be swipeable vertically or not",
|
|
30
|
-
defaultValue: true
|
|
31
|
-
}),
|
|
32
|
-
horizontalEnabled: createStaticBoolProp({
|
|
33
|
-
label: "Horizontal swipe enabled",
|
|
34
|
-
description: "Whether cards should be swipeable horizontally or not",
|
|
35
|
-
defaultValue: true
|
|
36
|
-
}),
|
|
37
|
-
visibleCardCount: createStaticNumberProp({
|
|
38
|
-
label: "Visible card count",
|
|
39
|
-
description: "Number of cards visible behind (and including) the current card",
|
|
40
|
-
defaultValue: 1,
|
|
41
|
-
min: 1,
|
|
42
|
-
step: 1
|
|
43
|
-
})
|
|
44
|
-
}
|
|
45
|
-
};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, CONTAINER_COMPONENT_STYLES_SECTIONS } from "@draftbit/types";
|
|
2
|
-
export const SEED_DATA = {
|
|
3
|
-
name: "Deck Swiper Card",
|
|
4
|
-
tag: "DeckSwiperCard",
|
|
5
|
-
description: "Single Deck Swiper Card item to be used in DeckSwiper",
|
|
6
|
-
category: COMPONENT_TYPES.swiper,
|
|
7
|
-
stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
8
|
-
props: {}
|
|
9
|
-
};
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { StyleProp, ViewStyle } from "react-native";
|
|
3
|
-
export interface DeckSwiperProps {
|
|
4
|
-
onIndexChanged?: (index: number) => void;
|
|
5
|
-
onEndReached?: () => void;
|
|
6
|
-
startCardIndex?: number;
|
|
7
|
-
infiniteSwiping?: boolean;
|
|
8
|
-
verticalEnabled?: boolean;
|
|
9
|
-
horizontalEnabled?: boolean;
|
|
10
|
-
visibleCardCount?: number;
|
|
11
|
-
style?: StyleProp<ViewStyle>;
|
|
12
|
-
}
|
|
13
|
-
declare const DeckSwiper: React.FC<React.PropsWithChildren<DeckSwiperProps>>;
|
|
14
|
-
export default DeckSwiper;
|
|
15
|
-
//# sourceMappingURL=DeckSwiper.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
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;IAC9B,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,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,eAAe,CAAC,CA4DlE,CAAC;AAiBF,eAAe,UAAU,CAAC"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { StyleProp, ViewStyle } from "react-native";
|
|
3
|
-
import type { Theme } from "../../styles/DefaultTheme";
|
|
4
|
-
export interface DeckSwiperCardProps {
|
|
5
|
-
style?: StyleProp<ViewStyle>;
|
|
6
|
-
children: React.ReactNode;
|
|
7
|
-
theme: Theme;
|
|
8
|
-
}
|
|
9
|
-
declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<DeckSwiperCardProps, "theme"> & {
|
|
10
|
-
theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
|
|
11
|
-
}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<DeckSwiperCardProps> & React.FC<DeckSwiperCardProps>, {}>;
|
|
12
|
-
export default _default;
|
|
13
|
-
//# sourceMappingURL=DeckSwiperCard.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
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,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;CACd;;;;AAgCD,wBAAyC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/DeckSwiper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC"}
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
export declare const SEED_DATA: {
|
|
2
|
-
name: string;
|
|
3
|
-
tag: string;
|
|
4
|
-
description: string;
|
|
5
|
-
category: string;
|
|
6
|
-
stylesPanelSections: string[];
|
|
7
|
-
triggers: string[];
|
|
8
|
-
props: {
|
|
9
|
-
onIndexChanged: {
|
|
10
|
-
label: string;
|
|
11
|
-
description: string;
|
|
12
|
-
editable: boolean;
|
|
13
|
-
required: boolean;
|
|
14
|
-
formType: string;
|
|
15
|
-
propType: string;
|
|
16
|
-
defaultValue: null;
|
|
17
|
-
group: string;
|
|
18
|
-
};
|
|
19
|
-
onEndReached: {
|
|
20
|
-
label: string;
|
|
21
|
-
description: string;
|
|
22
|
-
editable: boolean;
|
|
23
|
-
required: boolean;
|
|
24
|
-
formType: string;
|
|
25
|
-
propType: string;
|
|
26
|
-
defaultValue: null;
|
|
27
|
-
group: string;
|
|
28
|
-
};
|
|
29
|
-
startCardIndex: {
|
|
30
|
-
label: string;
|
|
31
|
-
description: string;
|
|
32
|
-
formType: string;
|
|
33
|
-
propType: string;
|
|
34
|
-
group: string;
|
|
35
|
-
defaultValue: null;
|
|
36
|
-
editable: boolean;
|
|
37
|
-
required: boolean;
|
|
38
|
-
step: number;
|
|
39
|
-
};
|
|
40
|
-
infiniteSwiping: {
|
|
41
|
-
label: string;
|
|
42
|
-
description: string;
|
|
43
|
-
formType: string;
|
|
44
|
-
propType: string;
|
|
45
|
-
defaultValue: boolean;
|
|
46
|
-
editable: boolean;
|
|
47
|
-
required: boolean;
|
|
48
|
-
group: string;
|
|
49
|
-
};
|
|
50
|
-
verticalEnabled: {
|
|
51
|
-
label: string;
|
|
52
|
-
description: string;
|
|
53
|
-
formType: string;
|
|
54
|
-
propType: string;
|
|
55
|
-
defaultValue: boolean;
|
|
56
|
-
editable: boolean;
|
|
57
|
-
required: boolean;
|
|
58
|
-
group: string;
|
|
59
|
-
};
|
|
60
|
-
horizontalEnabled: {
|
|
61
|
-
label: string;
|
|
62
|
-
description: string;
|
|
63
|
-
formType: string;
|
|
64
|
-
propType: string;
|
|
65
|
-
defaultValue: boolean;
|
|
66
|
-
editable: boolean;
|
|
67
|
-
required: boolean;
|
|
68
|
-
group: string;
|
|
69
|
-
};
|
|
70
|
-
visibleCardCount: {
|
|
71
|
-
label: string;
|
|
72
|
-
description: string;
|
|
73
|
-
formType: string;
|
|
74
|
-
propType: string;
|
|
75
|
-
group: string;
|
|
76
|
-
defaultValue: null;
|
|
77
|
-
editable: boolean;
|
|
78
|
-
required: boolean;
|
|
79
|
-
step: number;
|
|
80
|
-
};
|
|
81
|
-
};
|
|
82
|
-
};
|
|
83
|
-
//# sourceMappingURL=DeckSwiper.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DeckSwiper.d.ts","sourceRoot":"","sources":["../../../../src/mappings/DeckSwiper.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4CrB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DeckSwiperCard.d.ts","sourceRoot":"","sources":["../../../../src/mappings/DeckSwiperCard.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,SAAS;;;;;;;CAOrB,CAAC"}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { StyleSheet, View } from "react-native";
|
|
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, }) => {
|
|
5
|
-
const childrenArray = React.useMemo(() => React.Children.toArray(children), [children]);
|
|
6
|
-
// an array of indices based on children count
|
|
7
|
-
const cardsFillerData = React.useMemo(() => Array.from(Array(childrenArray.length).keys()), [childrenArray]);
|
|
8
|
-
/**
|
|
9
|
-
* By default react-native-deck-swiper positions everything with absolute position
|
|
10
|
-
* To overcome this, it is wrapped in a View to be able to add the component in any layout structure
|
|
11
|
-
*
|
|
12
|
-
* Since all children of that View are absolutley positioned, the View does not have a height and still looks and behaves weird
|
|
13
|
-
* To fix/mitage this without setting a static height, the first card is rendered in invisible state to take up space
|
|
14
|
-
* This effectivley makes the default height of the container be the height of the first card
|
|
15
|
-
*/
|
|
16
|
-
return (React.createElement(View, null,
|
|
17
|
-
React.createElement(View, { style: styles.containerHeightFiller }, childrenArray.length && childrenArray[0]),
|
|
18
|
-
React.createElement(DeckSwiperComponent, { cards: cardsFillerData, renderCard: (_, i) => React.createElement(React.Fragment, null, childrenArray[i]), keyExtractor: (card) => card === null || card === void 0 ? void 0 : card.toString(), 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 })));
|
|
19
|
-
};
|
|
20
|
-
const styles = StyleSheet.create({
|
|
21
|
-
cardsContainer: {
|
|
22
|
-
width: "100%",
|
|
23
|
-
},
|
|
24
|
-
card: {
|
|
25
|
-
left: 0,
|
|
26
|
-
right: 0,
|
|
27
|
-
width: "auto",
|
|
28
|
-
height: "auto",
|
|
29
|
-
},
|
|
30
|
-
containerHeightFiller: {
|
|
31
|
-
opacity: 0.0,
|
|
32
|
-
},
|
|
33
|
-
});
|
|
34
|
-
export default DeckSwiper;
|
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { StyleProp, ViewStyle, StyleSheet, View } from "react-native";
|
|
3
|
-
import DeckSwiperComponent from "react-native-deck-swiper";
|
|
4
|
-
|
|
5
|
-
export interface DeckSwiperProps {
|
|
6
|
-
onIndexChanged?: (index: number) => void;
|
|
7
|
-
onEndReached?: () => void;
|
|
8
|
-
startCardIndex?: number;
|
|
9
|
-
infiniteSwiping?: boolean;
|
|
10
|
-
verticalEnabled?: boolean;
|
|
11
|
-
horizontalEnabled?: boolean;
|
|
12
|
-
visibleCardCount?: number;
|
|
13
|
-
style?: StyleProp<ViewStyle>;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
const DeckSwiper: React.FC<React.PropsWithChildren<DeckSwiperProps>> = ({
|
|
17
|
-
onIndexChanged,
|
|
18
|
-
onEndReached,
|
|
19
|
-
startCardIndex = 0,
|
|
20
|
-
infiniteSwiping = false,
|
|
21
|
-
verticalEnabled = true,
|
|
22
|
-
horizontalEnabled = true,
|
|
23
|
-
visibleCardCount = 1,
|
|
24
|
-
style,
|
|
25
|
-
children,
|
|
26
|
-
}) => {
|
|
27
|
-
const childrenArray = React.useMemo(
|
|
28
|
-
() => React.Children.toArray(children),
|
|
29
|
-
[children]
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
// an array of indices based on children count
|
|
33
|
-
const cardsFillerData = React.useMemo(
|
|
34
|
-
() => Array.from(Array(childrenArray.length).keys()),
|
|
35
|
-
[childrenArray]
|
|
36
|
-
);
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* By default react-native-deck-swiper positions everything with absolute position
|
|
40
|
-
* To overcome this, it is wrapped in a View to be able to add the component in any layout structure
|
|
41
|
-
*
|
|
42
|
-
* Since all children of that View are absolutley positioned, the View does not have a height and still looks and behaves weird
|
|
43
|
-
* To fix/mitage this without setting a static height, the first card is rendered in invisible state to take up space
|
|
44
|
-
* This effectivley makes the default height of the container be the height of the first card
|
|
45
|
-
*/
|
|
46
|
-
|
|
47
|
-
return (
|
|
48
|
-
<View>
|
|
49
|
-
<View style={styles.containerHeightFiller}>
|
|
50
|
-
{childrenArray.length && childrenArray[0]}
|
|
51
|
-
</View>
|
|
52
|
-
<DeckSwiperComponent
|
|
53
|
-
cards={cardsFillerData}
|
|
54
|
-
renderCard={(_, i) => <>{childrenArray[i]}</>}
|
|
55
|
-
keyExtractor={(card) => card?.toString()}
|
|
56
|
-
containerStyle={
|
|
57
|
-
StyleSheet.flatten([styles.cardsContainer, style]) as
|
|
58
|
-
| object
|
|
59
|
-
| undefined
|
|
60
|
-
}
|
|
61
|
-
cardStyle={styles.card as object | undefined}
|
|
62
|
-
onSwiped={onIndexChanged}
|
|
63
|
-
onSwipedAll={onEndReached}
|
|
64
|
-
cardIndex={startCardIndex}
|
|
65
|
-
infinite={infiniteSwiping}
|
|
66
|
-
verticalSwipe={verticalEnabled}
|
|
67
|
-
horizontalSwipe={horizontalEnabled}
|
|
68
|
-
showSecondCard={visibleCardCount > 1}
|
|
69
|
-
stackSize={visibleCardCount}
|
|
70
|
-
backgroundColor="transparent"
|
|
71
|
-
cardVerticalMargin={0}
|
|
72
|
-
cardHorizontalMargin={0}
|
|
73
|
-
/>
|
|
74
|
-
</View>
|
|
75
|
-
);
|
|
76
|
-
};
|
|
77
|
-
|
|
78
|
-
const styles = StyleSheet.create({
|
|
79
|
-
cardsContainer: {
|
|
80
|
-
width: "100%",
|
|
81
|
-
},
|
|
82
|
-
card: {
|
|
83
|
-
left: 0,
|
|
84
|
-
right: 0,
|
|
85
|
-
width: "auto",
|
|
86
|
-
height: "auto",
|
|
87
|
-
},
|
|
88
|
-
containerHeightFiller: {
|
|
89
|
-
opacity: 0.0,
|
|
90
|
-
},
|
|
91
|
-
});
|
|
92
|
-
|
|
93
|
-
export default DeckSwiper;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { View, StyleSheet } from "react-native";
|
|
3
|
-
import { withTheme } from "../../theming";
|
|
4
|
-
const DeckSwiperCard = ({ style, children, theme, }) => (React.createElement(View, { style: [
|
|
5
|
-
styles.card,
|
|
6
|
-
{
|
|
7
|
-
backgroundColor: theme.colors.background,
|
|
8
|
-
borderRadius: theme.borderRadius.global,
|
|
9
|
-
borderColor: theme.colors.divider,
|
|
10
|
-
},
|
|
11
|
-
style,
|
|
12
|
-
] }, children));
|
|
13
|
-
const styles = StyleSheet.create({
|
|
14
|
-
card: {
|
|
15
|
-
flex: 1,
|
|
16
|
-
alignItems: "center",
|
|
17
|
-
justifyContent: "center",
|
|
18
|
-
padding: 20,
|
|
19
|
-
borderWidth: 2,
|
|
20
|
-
},
|
|
21
|
-
});
|
|
22
|
-
export default withTheme(DeckSwiperCard);
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { View, StyleSheet, StyleProp, ViewStyle } from "react-native";
|
|
3
|
-
import type { Theme } from "../../styles/DefaultTheme";
|
|
4
|
-
import { withTheme } from "../../theming";
|
|
5
|
-
|
|
6
|
-
export interface DeckSwiperCardProps {
|
|
7
|
-
style?: StyleProp<ViewStyle>;
|
|
8
|
-
children: React.ReactNode;
|
|
9
|
-
theme: Theme;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
const DeckSwiperCard: React.FC<DeckSwiperCardProps> = ({
|
|
13
|
-
style,
|
|
14
|
-
children,
|
|
15
|
-
theme,
|
|
16
|
-
}) => (
|
|
17
|
-
<View
|
|
18
|
-
style={[
|
|
19
|
-
styles.card,
|
|
20
|
-
{
|
|
21
|
-
backgroundColor: theme.colors.background,
|
|
22
|
-
borderRadius: theme.borderRadius.global,
|
|
23
|
-
borderColor: theme.colors.divider,
|
|
24
|
-
},
|
|
25
|
-
style,
|
|
26
|
-
]}
|
|
27
|
-
>
|
|
28
|
-
{children}
|
|
29
|
-
</View>
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
const styles = StyleSheet.create({
|
|
33
|
-
card: {
|
|
34
|
-
flex: 1,
|
|
35
|
-
alignItems: "center",
|
|
36
|
-
justifyContent: "center",
|
|
37
|
-
padding: 20,
|
|
38
|
-
borderWidth: 2,
|
|
39
|
-
},
|
|
40
|
-
});
|
|
41
|
-
|
|
42
|
-
export default withTheme(DeckSwiperCard);
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, Triggers, createActionProp, createStaticNumberProp, createStaticBoolProp, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
|
|
2
|
-
export const SEED_DATA = {
|
|
3
|
-
name: "Deck Swiper",
|
|
4
|
-
tag: "DeckSwiper",
|
|
5
|
-
description: "Deck swiper container",
|
|
6
|
-
category: COMPONENT_TYPES.swiper,
|
|
7
|
-
stylesPanelSections: BLOCK_STYLES_SECTIONS,
|
|
8
|
-
triggers: [Triggers.OnIndexChanged, Triggers.OnEndReached],
|
|
9
|
-
props: {
|
|
10
|
-
onIndexChanged: createActionProp({
|
|
11
|
-
label: "On index changed",
|
|
12
|
-
description: "Action to execute when swipe to new index",
|
|
13
|
-
}),
|
|
14
|
-
onEndReached: createActionProp({
|
|
15
|
-
label: "On end reached",
|
|
16
|
-
description: "Action to execute when end of swiping reached",
|
|
17
|
-
}),
|
|
18
|
-
startCardIndex: createStaticNumberProp({
|
|
19
|
-
label: "Start card index",
|
|
20
|
-
description: "Index of card to start swiping from",
|
|
21
|
-
defaultValue: 0,
|
|
22
|
-
}),
|
|
23
|
-
infiniteSwiping: createStaticBoolProp({
|
|
24
|
-
label: "Infinite swiping",
|
|
25
|
-
description: "Whether to infinitley loop through cards or not",
|
|
26
|
-
}),
|
|
27
|
-
verticalEnabled: createStaticBoolProp({
|
|
28
|
-
label: "Vertical swipe enabled",
|
|
29
|
-
description: "Whether cards should be swipeable vertically or not",
|
|
30
|
-
defaultValue: true,
|
|
31
|
-
}),
|
|
32
|
-
horizontalEnabled: createStaticBoolProp({
|
|
33
|
-
label: "Horizontal swipe enabled",
|
|
34
|
-
description: "Whether cards should be swipeable horizontally or not",
|
|
35
|
-
defaultValue: true,
|
|
36
|
-
}),
|
|
37
|
-
visibleCardCount: createStaticNumberProp({
|
|
38
|
-
label: "Visible card count",
|
|
39
|
-
description: "Number of cards visible behind (and including) the current card",
|
|
40
|
-
defaultValue: 1,
|
|
41
|
-
min: 1,
|
|
42
|
-
step: 1,
|
|
43
|
-
}),
|
|
44
|
-
},
|
|
45
|
-
};
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
COMPONENT_TYPES,
|
|
3
|
-
Triggers,
|
|
4
|
-
createActionProp,
|
|
5
|
-
createStaticNumberProp,
|
|
6
|
-
createStaticBoolProp,
|
|
7
|
-
BLOCK_STYLES_SECTIONS,
|
|
8
|
-
} from "@draftbit/types";
|
|
9
|
-
|
|
10
|
-
export const SEED_DATA = {
|
|
11
|
-
name: "Deck Swiper",
|
|
12
|
-
tag: "DeckSwiper",
|
|
13
|
-
description: "Deck swiper container",
|
|
14
|
-
category: COMPONENT_TYPES.swiper,
|
|
15
|
-
stylesPanelSections: BLOCK_STYLES_SECTIONS,
|
|
16
|
-
triggers: [Triggers.OnIndexChanged, Triggers.OnEndReached],
|
|
17
|
-
props: {
|
|
18
|
-
onIndexChanged: createActionProp({
|
|
19
|
-
label: "On index changed",
|
|
20
|
-
description: "Action to execute when swipe to new index",
|
|
21
|
-
}),
|
|
22
|
-
onEndReached: createActionProp({
|
|
23
|
-
label: "On end reached",
|
|
24
|
-
description: "Action to execute when end of swiping reached",
|
|
25
|
-
}),
|
|
26
|
-
startCardIndex: createStaticNumberProp({
|
|
27
|
-
label: "Start card index",
|
|
28
|
-
description: "Index of card to start swiping from",
|
|
29
|
-
defaultValue: 0,
|
|
30
|
-
}),
|
|
31
|
-
infiniteSwiping: createStaticBoolProp({
|
|
32
|
-
label: "Infinite swiping",
|
|
33
|
-
description: "Whether to infinitley loop through cards or not",
|
|
34
|
-
}),
|
|
35
|
-
verticalEnabled: createStaticBoolProp({
|
|
36
|
-
label: "Vertical swipe enabled",
|
|
37
|
-
description: "Whether cards should be swipeable vertically or not",
|
|
38
|
-
defaultValue: true,
|
|
39
|
-
}),
|
|
40
|
-
horizontalEnabled: createStaticBoolProp({
|
|
41
|
-
label: "Horizontal swipe enabled",
|
|
42
|
-
description: "Whether cards should be swipeable horizontally or not",
|
|
43
|
-
defaultValue: true,
|
|
44
|
-
}),
|
|
45
|
-
visibleCardCount: createStaticNumberProp({
|
|
46
|
-
label: "Visible card count",
|
|
47
|
-
description:
|
|
48
|
-
"Number of cards visible behind (and including) the current card",
|
|
49
|
-
defaultValue: 1,
|
|
50
|
-
min: 1,
|
|
51
|
-
step: 1,
|
|
52
|
-
}),
|
|
53
|
-
},
|
|
54
|
-
};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, CONTAINER_COMPONENT_STYLES_SECTIONS, } from "@draftbit/types";
|
|
2
|
-
export const SEED_DATA = {
|
|
3
|
-
name: "Deck Swiper Card",
|
|
4
|
-
tag: "DeckSwiperCard",
|
|
5
|
-
description: "Single Deck Swiper Card item to be used in DeckSwiper",
|
|
6
|
-
category: COMPONENT_TYPES.swiper,
|
|
7
|
-
stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
8
|
-
props: {},
|
|
9
|
-
};
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
COMPONENT_TYPES,
|
|
3
|
-
CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
4
|
-
} from "@draftbit/types";
|
|
5
|
-
|
|
6
|
-
export const SEED_DATA = {
|
|
7
|
-
name: "Deck Swiper Card",
|
|
8
|
-
tag: "DeckSwiperCard",
|
|
9
|
-
description: "Single Deck Swiper Card item to be used in DeckSwiper",
|
|
10
|
-
category: COMPONENT_TYPES.swiper,
|
|
11
|
-
stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
12
|
-
props: {},
|
|
13
|
-
};
|