@draftbit/core 46.8.2-e0b610.2 → 46.8.2-e916bf.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 (51) hide show
  1. package/lib/commonjs/components/Elevation.js +2 -14
  2. package/lib/commonjs/components/TabView/TabView.js +122 -0
  3. package/lib/commonjs/components/TabView/TabViewItem.js +25 -0
  4. package/lib/commonjs/components/TabView/index.js +20 -0
  5. package/lib/commonjs/index.js +13 -7
  6. package/lib/commonjs/mappings/TabView.js +77 -0
  7. package/lib/commonjs/mappings/TabViewItem.js +37 -0
  8. package/lib/module/components/AspectRatio.js +1 -18
  9. package/lib/module/components/Checkbox/CheckboxGroupRow.js +5 -24
  10. package/lib/module/components/TabView/TabView.js +113 -0
  11. package/lib/module/components/TabView/TabViewItem.js +20 -0
  12. package/lib/module/components/TabView/index.js +2 -0
  13. package/lib/module/index.js +1 -1
  14. package/lib/module/mappings/TabView.js +70 -0
  15. package/lib/module/mappings/TabViewItem.js +30 -0
  16. package/lib/typescript/src/components/TabView/TabView.d.ts +26 -0
  17. package/lib/typescript/src/components/TabView/TabView.d.ts.map +1 -0
  18. package/lib/typescript/src/components/TabView/TabViewItem.d.ts +11 -0
  19. package/lib/typescript/src/components/TabView/TabViewItem.d.ts.map +1 -0
  20. package/lib/typescript/src/components/TabView/index.d.ts +3 -0
  21. package/lib/typescript/src/components/TabView/index.d.ts.map +1 -0
  22. package/lib/typescript/src/index.d.ts +1 -1
  23. package/lib/typescript/src/index.d.ts.map +1 -1
  24. package/lib/typescript/src/mappings/{Shadow.d.ts → TabView.d.ts} +35 -82
  25. package/lib/typescript/src/mappings/TabView.d.ts.map +1 -0
  26. package/lib/typescript/src/mappings/TabViewItem.d.ts +25 -0
  27. package/lib/typescript/src/mappings/TabViewItem.d.ts.map +1 -0
  28. package/package.json +5 -4
  29. package/src/components/TabView/TabView.js +58 -0
  30. package/src/components/TabView/TabView.tsx +151 -0
  31. package/src/components/TabView/TabViewItem.js +11 -0
  32. package/src/components/TabView/TabViewItem.tsx +25 -0
  33. package/src/components/TabView/index.js +2 -0
  34. package/src/components/TabView/index.tsx +2 -0
  35. package/src/index.js +1 -1
  36. package/src/index.tsx +2 -2
  37. package/src/mappings/TabView.js +76 -0
  38. package/src/mappings/TabView.ts +86 -0
  39. package/src/mappings/TabViewItem.js +30 -0
  40. package/src/mappings/TabViewItem.ts +38 -0
  41. package/lib/commonjs/components/Shadow.js +0 -46
  42. package/lib/commonjs/mappings/Shadow.js +0 -94
  43. package/lib/module/components/Shadow.js +0 -38
  44. package/lib/module/mappings/Shadow.js +0 -87
  45. package/lib/typescript/src/components/Shadow.d.ts +0 -24
  46. package/lib/typescript/src/components/Shadow.d.ts.map +0 -1
  47. package/lib/typescript/src/mappings/Shadow.d.ts.map +0 -1
  48. package/src/components/Shadow.js +0 -16
  49. package/src/components/Shadow.tsx +0 -62
  50. package/src/mappings/Shadow.js +0 -87
  51. package/src/mappings/Shadow.ts +0 -95
@@ -0,0 +1,30 @@
1
+ import { COMPONENT_TYPES, createTextProp, createIconProp, CONTAINER_COMPONENT_STYLES_SECTIONS, GROUPS } from "@draftbit/types";
2
+ export const SEED_DATA = {
3
+ name: "Tab View Item",
4
+ tag: "TabViewItem",
5
+ description: "Single Tab View item to be used in TabView. Each item represents a single tab and its content",
6
+ category: COMPONENT_TYPES.swiper,
7
+ stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
8
+ layout: {
9
+ flex: 1
10
+ },
11
+ props: {
12
+ title: createTextProp({
13
+ label: "Title",
14
+ description: "Title of tab item",
15
+ defaultValue: "Title",
16
+ required: true,
17
+ group: GROUPS.basic
18
+ }),
19
+ icon: createIconProp({
20
+ defaultValue: null,
21
+ required: false
22
+ }),
23
+ accessibilityLabel: createTextProp({
24
+ label: "Accessibility Label",
25
+ description: "Accessibility Label",
26
+ defaultValue: null,
27
+ group: GROUPS.accessibility
28
+ })
29
+ }
30
+ };
@@ -0,0 +1,26 @@
1
+ import * as React from "react";
2
+ import { StyleProp, ViewStyle } from "react-native";
3
+ import type { IconSlot } from "../../interfaces/Icon";
4
+ import type { Theme } from "../../styles/DefaultTheme";
5
+ declare type TabBarPosition = "top" | "bottom";
6
+ declare type KeyboardDismissMode = "none" | "auto" | "on-drag";
7
+ declare type TabViewProps = {
8
+ onIndexChanged?: (index: number) => void;
9
+ onEndReached?: () => void;
10
+ tabBarPosition?: TabBarPosition;
11
+ keyboardDismissMode?: KeyboardDismissMode;
12
+ swipeEnabled?: boolean;
13
+ scrollEnabled?: boolean;
14
+ activeColor?: string;
15
+ inactiveColor?: string;
16
+ pressColor?: string;
17
+ indicatorColor?: string;
18
+ tabsBackgroundColor?: string;
19
+ style?: StyleProp<ViewStyle>;
20
+ theme: Theme;
21
+ } & IconSlot;
22
+ declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<React.PropsWithChildren<TabViewProps>, "theme"> & {
23
+ theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
24
+ }> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<React.PropsWithChildren<TabViewProps>> & React.FC<React.PropsWithChildren<TabViewProps>>, {}>;
25
+ export default _default;
26
+ //# sourceMappingURL=TabView.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabView.d.ts","sourceRoot":"","sources":["../../../../../src/components/TabView/TabView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,SAAS,EAAc,MAAM,cAAc,CAAC;AAWhE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEtD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAMvD,aAAK,cAAc,GAAG,KAAK,GAAG,QAAQ,CAAC;AACvC,aAAK,mBAAmB,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;AAEvD,aAAK,YAAY,GAAG;IAClB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,KAAK,EAAE,KAAK,CAAC;CACd,GAAG,QAAQ,CAAC;;;;AAiHb,wBAA2C"}
@@ -0,0 +1,11 @@
1
+ import React from "react";
2
+ import { StyleProp, ViewStyle } from "react-native";
3
+ export interface TabViewItemProps {
4
+ title: string;
5
+ icon?: string;
6
+ accessibilityLabel?: string;
7
+ style?: StyleProp<ViewStyle>;
8
+ }
9
+ declare const TabViewItem: React.FC<React.PropsWithChildren<TabViewItemProps>>;
10
+ export default TabViewItem;
11
+ //# sourceMappingURL=TabViewItem.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabViewItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/TabView/TabViewItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,SAAS,EAAoB,MAAM,cAAc,CAAC;AAGtE,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;AAED,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAKpE,CAAC;AAQF,eAAe,WAAW,CAAC"}
@@ -0,0 +1,3 @@
1
+ export { default as TabView } from "./TabView";
2
+ export { default as TabViewItem } from "./TabViewItem";
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/TabView/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC"}
@@ -31,8 +31,8 @@ export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/A
31
31
  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
- export { default as Shadow } from "./components/Shadow";
35
34
  export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
35
+ export { TabView, TabViewItem } from "./components/TabView";
36
36
  export { default as DatePicker } from "./components/DatePicker/DatePicker";
37
37
  export { default as Picker } from "./components/Picker/Picker";
38
38
  export { default as ProgressBar } from "./components/ProgressBar";
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"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"}
@@ -4,49 +4,54 @@ export declare const SEED_DATA: {
4
4
  description: string;
5
5
  category: string;
6
6
  stylesPanelSections: string[];
7
+ layout: {
8
+ flex: number;
9
+ };
10
+ triggers: string[];
7
11
  props: {
8
- disabled: {
12
+ onIndexChanged: {
9
13
  label: string;
10
14
  description: string;
11
- group: string;
12
15
  editable: boolean;
13
16
  required: boolean;
14
17
  formType: string;
15
18
  propType: string;
16
19
  defaultValue: null;
17
- };
18
- startColor: {
19
20
  group: string;
21
+ };
22
+ onEndReached: {
20
23
  label: string;
21
24
  description: string;
22
25
  editable: boolean;
23
26
  required: boolean;
24
- defaultValue: null;
25
27
  formType: string;
26
28
  propType: string;
29
+ defaultValue: null;
30
+ group: string;
27
31
  };
28
- endColor: {
32
+ tabBarPosition: {
29
33
  group: string;
30
34
  label: string;
31
35
  description: string;
32
36
  editable: boolean;
33
37
  required: boolean;
34
- defaultValue: null;
35
38
  formType: string;
36
39
  propType: string;
40
+ defaultValue: null;
41
+ options: never[];
37
42
  };
38
- distance: {
43
+ keyboardDismissMode: {
44
+ group: string;
39
45
  label: string;
40
46
  description: string;
47
+ editable: boolean;
48
+ required: boolean;
41
49
  formType: string;
42
50
  propType: string;
43
- group: string;
44
51
  defaultValue: null;
45
- editable: boolean;
46
- required: boolean;
47
- step: number;
52
+ options: never[];
48
53
  };
49
- paintInside: {
54
+ swipeEnabled: {
50
55
  label: string;
51
56
  description: string;
52
57
  formType: string;
@@ -56,7 +61,7 @@ export declare const SEED_DATA: {
56
61
  required: boolean;
57
62
  group: string;
58
63
  };
59
- stretch: {
64
+ scrollEnabled: {
60
65
  label: string;
61
66
  description: string;
62
67
  formType: string;
@@ -66,108 +71,56 @@ export declare const SEED_DATA: {
66
71
  required: boolean;
67
72
  group: string;
68
73
  };
69
- offsetX: {
74
+ activeColor: {
75
+ group: string;
70
76
  label: string;
71
77
  description: string;
72
- formType: string;
73
- propType: string;
74
- group: string;
75
- defaultValue: null;
76
78
  editable: boolean;
77
79
  required: boolean;
78
- step: number;
79
- };
80
- offsetY: {
81
- label: string;
82
- description: string;
80
+ defaultValue: null;
83
81
  formType: string;
84
82
  propType: string;
85
- group: string;
86
- defaultValue: null;
87
- editable: boolean;
88
- required: boolean;
89
- step: number;
90
83
  };
91
- showShadowSideStart: {
84
+ inactiveColor: {
85
+ group: string;
92
86
  label: string;
93
87
  description: string;
94
- formType: string;
95
- propType: string;
96
- defaultValue: boolean;
97
88
  editable: boolean;
98
89
  required: boolean;
99
- group: string;
100
- };
101
- showShadowSideEnd: {
102
- label: string;
103
- description: string;
90
+ defaultValue: null;
104
91
  formType: string;
105
92
  propType: string;
106
- defaultValue: boolean;
107
- editable: boolean;
108
- required: boolean;
109
- group: string;
110
93
  };
111
- showShadowSideTop: {
94
+ pressColor: {
95
+ group: string;
112
96
  label: string;
113
97
  description: string;
114
- formType: string;
115
- propType: string;
116
- defaultValue: boolean;
117
98
  editable: boolean;
118
99
  required: boolean;
119
- group: string;
120
- };
121
- showShadowSideBottom: {
122
- label: string;
123
- description: string;
100
+ defaultValue: null;
124
101
  formType: string;
125
102
  propType: string;
126
- defaultValue: boolean;
127
- editable: boolean;
128
- required: boolean;
129
- group: string;
130
103
  };
131
- showShadowCornerTopStart: {
104
+ indicatorColor: {
105
+ group: string;
132
106
  label: string;
133
107
  description: string;
134
- formType: string;
135
- propType: string;
136
- defaultValue: boolean;
137
108
  editable: boolean;
138
109
  required: boolean;
139
- group: string;
140
- };
141
- showShadowCornerTopEnd: {
142
- label: string;
143
- description: string;
110
+ defaultValue: null;
144
111
  formType: string;
145
112
  propType: string;
146
- defaultValue: boolean;
147
- editable: boolean;
148
- required: boolean;
149
- group: string;
150
113
  };
151
- showShadowCornerBottomStart: {
114
+ tabsBackgroundColor: {
115
+ group: string;
152
116
  label: string;
153
117
  description: string;
154
- formType: string;
155
- propType: string;
156
- defaultValue: boolean;
157
118
  editable: boolean;
158
119
  required: boolean;
159
- group: string;
160
- };
161
- showShadowCornerBottomEnd: {
162
- label: string;
163
- description: string;
120
+ defaultValue: null;
164
121
  formType: string;
165
122
  propType: string;
166
- defaultValue: boolean;
167
- editable: boolean;
168
- required: boolean;
169
- group: string;
170
123
  };
171
124
  };
172
125
  };
173
- //# sourceMappingURL=Shadow.d.ts.map
126
+ //# sourceMappingURL=TabView.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabView.d.ts","sourceRoot":"","sources":["../../../../src/mappings/TabView.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ErB,CAAC"}
@@ -0,0 +1,25 @@
1
+ export declare const SEED_DATA: {
2
+ name: string;
3
+ tag: string;
4
+ description: string;
5
+ category: string;
6
+ stylesPanelSections: string[];
7
+ layout: {
8
+ flex: number;
9
+ };
10
+ props: {
11
+ title: any;
12
+ icon: {
13
+ label: string;
14
+ description: string;
15
+ formType: string;
16
+ propType: string;
17
+ defaultValue: string;
18
+ required: boolean;
19
+ editable: boolean;
20
+ group: string;
21
+ };
22
+ accessibilityLabel: any;
23
+ };
24
+ };
25
+ //# sourceMappingURL=TabViewItem.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabViewItem.d.ts","sourceRoot":"","sources":["../../../../src/mappings/TabViewItem.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;CA6BrB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "46.8.2-e0b610.2+e0b6100",
3
+ "version": "46.8.2-e916bf.2+e916bf3",
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.2-e0b610.2+e0b6100",
44
+ "@draftbit/types": "^46.8.2-e916bf.2+e916bf3",
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,8 +55,9 @@
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-shadow-2": "^7.0.6",
58
+ "react-native-pager-view": "5.4.24",
59
59
  "react-native-svg": "12.3.0",
60
+ "react-native-tab-view": "^3.4.0",
60
61
  "react-native-typography": "^1.4.1",
61
62
  "react-native-web-swiper": "^2.2.3"
62
63
  },
@@ -93,5 +94,5 @@
93
94
  ]
94
95
  ]
95
96
  },
96
- "gitHead": "e0b61000d1889f05058ae29887cfb22e6cf0e3bd"
97
+ "gitHead": "e916bf330335c3bd9d1a4bd1046b4f7a3bcd30fa"
97
98
  }
@@ -0,0 +1,58 @@
1
+ import * as React from "react";
2
+ import { StyleSheet } from "react-native";
3
+ import { TabView, TabBar, SceneMap, } from "react-native-tab-view";
4
+ import { withTheme } from "../../theming";
5
+ import { extractStyles } from "../../utilities";
6
+ const TabViewComponent = ({ Icon, onIndexChanged, onEndReached, tabBarPosition, keyboardDismissMode, swipeEnabled, scrollEnabled, activeColor, inactiveColor, pressColor, indicatorColor, tabsBackgroundColor, style, theme, children, }) => {
7
+ const [index, setIndex] = React.useState(0);
8
+ const [routes, setRoutes] = React.useState([]);
9
+ const [tabScenes, setTabScenes] = React.useState({});
10
+ const { textStyles, viewStyles } = extractStyles(style);
11
+ //Check type of child using props
12
+ //Regular '.type' cannot work because Draftbit strips the type in Draft view
13
+ const instanceOfTabViewItemProps = (object) => {
14
+ return "title" in object;
15
+ };
16
+ //Populate routes and scenes based on children
17
+ React.useEffect(() => {
18
+ const newRoutes = [];
19
+ const scenes = {};
20
+ React.Children.toArray(children)
21
+ .filter((child) => React.isValidElement(child) && instanceOfTabViewItemProps(child.props))
22
+ .forEach((item, idx) => {
23
+ const child = item;
24
+ newRoutes.push({
25
+ key: idx.toString(),
26
+ title: child.props.title,
27
+ icon: child.props.icon,
28
+ accessibilityLabel: child.props.accessibilityLabel,
29
+ });
30
+ scenes[idx] = () => child;
31
+ });
32
+ setRoutes(newRoutes);
33
+ setTabScenes(scenes);
34
+ }, [children]);
35
+ const indexChangeHandler = (i) => {
36
+ setIndex(i);
37
+ onIndexChanged === null || onIndexChanged === void 0 ? void 0 : onIndexChanged(i);
38
+ if (i === routes.length) {
39
+ onEndReached === null || onEndReached === void 0 ? void 0 : onEndReached();
40
+ }
41
+ };
42
+ const renderTabBar = (props) => {
43
+ return (React.createElement(TabBar, { ...props, activeColor: activeColor || theme.colors.primary, inactiveColor: inactiveColor || theme.colors.divider, pressColor: pressColor || theme.colors.primary, scrollEnabled: scrollEnabled, indicatorStyle: {
44
+ backgroundColor: indicatorColor || theme.colors.primary,
45
+ }, labelStyle: textStyles, renderIcon: ({ route, color }) => (route === null || route === void 0 ? void 0 : route.icon) ? (React.createElement(Icon, { name: route.icon, color: color, size: 16 })) : null, style: {
46
+ backgroundColor: tabsBackgroundColor || theme.colors.background,
47
+ } }));
48
+ };
49
+ //Cannot render TabView without at least one tab
50
+ if (!routes.length) {
51
+ return React.createElement(React.Fragment, null);
52
+ }
53
+ return (React.createElement(TabView, { style: [styles.tabView, viewStyles], navigationState: { index, routes }, renderScene: SceneMap(tabScenes), renderTabBar: renderTabBar, onIndexChange: indexChangeHandler, tabBarPosition: tabBarPosition, keyboardDismissMode: keyboardDismissMode, swipeEnabled: swipeEnabled }));
54
+ };
55
+ const styles = StyleSheet.create({
56
+ tabView: { flex: 1 },
57
+ });
58
+ export default withTheme(TabViewComponent);
@@ -0,0 +1,151 @@
1
+ import * as React from "react";
2
+ import { StyleProp, ViewStyle, StyleSheet } from "react-native";
3
+ import {
4
+ TabView,
5
+ TabBar,
6
+ SceneMap,
7
+ SceneRendererProps,
8
+ NavigationState,
9
+ Route,
10
+ } from "react-native-tab-view";
11
+
12
+ import { TabViewItemProps } from "./TabViewItem";
13
+ import type { IconSlot } from "../../interfaces/Icon";
14
+ import { withTheme } from "../../theming";
15
+ import type { Theme } from "../../styles/DefaultTheme";
16
+ import { extractStyles } from "../../utilities";
17
+
18
+ type TabBarProps = SceneRendererProps & {
19
+ navigationState: NavigationState<any>;
20
+ };
21
+ type TabBarPosition = "top" | "bottom";
22
+ type KeyboardDismissMode = "none" | "auto" | "on-drag";
23
+
24
+ type TabViewProps = {
25
+ onIndexChanged?: (index: number) => void;
26
+ onEndReached?: () => void;
27
+ tabBarPosition?: TabBarPosition;
28
+ keyboardDismissMode?: KeyboardDismissMode;
29
+ swipeEnabled?: boolean;
30
+ scrollEnabled?: boolean;
31
+ activeColor?: string;
32
+ inactiveColor?: string;
33
+ pressColor?: string;
34
+ indicatorColor?: string;
35
+ tabsBackgroundColor?: string;
36
+ style?: StyleProp<ViewStyle>;
37
+ theme: Theme;
38
+ } & IconSlot;
39
+
40
+ const TabViewComponent: React.FC<React.PropsWithChildren<TabViewProps>> = ({
41
+ Icon,
42
+ onIndexChanged,
43
+ onEndReached,
44
+ tabBarPosition,
45
+ keyboardDismissMode,
46
+ swipeEnabled,
47
+ scrollEnabled,
48
+ activeColor,
49
+ inactiveColor,
50
+ pressColor,
51
+ indicatorColor,
52
+ tabsBackgroundColor,
53
+ style,
54
+ theme,
55
+ children,
56
+ }) => {
57
+ const [index, setIndex] = React.useState(0);
58
+ const [routes, setRoutes] = React.useState<Route[]>([]);
59
+ const [tabScenes, setTabScenes] = React.useState({});
60
+
61
+ const { textStyles, viewStyles } = extractStyles(style);
62
+
63
+ //Check type of child using props
64
+ //Regular '.type' cannot work because Draftbit strips the type in Draft view
65
+ const instanceOfTabViewItemProps = (
66
+ object: any
67
+ ): object is TabViewItemProps => {
68
+ return "title" in object;
69
+ };
70
+
71
+ //Populate routes and scenes based on children
72
+ React.useEffect(() => {
73
+ const newRoutes: Route[] = [];
74
+ const scenes: any = {};
75
+
76
+ React.Children.toArray(children)
77
+ .filter(
78
+ (child) =>
79
+ React.isValidElement(child) && instanceOfTabViewItemProps(child.props)
80
+ )
81
+ .forEach((item: any, idx) => {
82
+ const child = item as React.ReactElement;
83
+ newRoutes.push({
84
+ key: idx.toString(),
85
+ title: child.props.title,
86
+ icon: child.props.icon,
87
+ accessibilityLabel: child.props.accessibilityLabel,
88
+ });
89
+ scenes[idx] = () => child;
90
+ });
91
+
92
+ setRoutes(newRoutes);
93
+ setTabScenes(scenes);
94
+ }, [children]);
95
+
96
+ const indexChangeHandler = (i: number) => {
97
+ setIndex(i);
98
+ onIndexChanged?.(i);
99
+ if (i === routes.length) {
100
+ onEndReached?.();
101
+ }
102
+ };
103
+
104
+ const renderTabBar: React.FC<TabBarProps> = (props) => {
105
+ return (
106
+ <TabBar
107
+ {...props}
108
+ activeColor={activeColor || theme.colors.primary}
109
+ inactiveColor={inactiveColor || theme.colors.divider}
110
+ pressColor={pressColor || theme.colors.primary}
111
+ scrollEnabled={scrollEnabled}
112
+ indicatorStyle={{
113
+ backgroundColor: indicatorColor || theme.colors.primary,
114
+ }}
115
+ labelStyle={textStyles}
116
+ renderIcon={({ route, color }) =>
117
+ route?.icon ? (
118
+ <Icon name={route.icon} color={color} size={16} />
119
+ ) : null
120
+ }
121
+ style={{
122
+ backgroundColor: tabsBackgroundColor || theme.colors.background,
123
+ }}
124
+ />
125
+ );
126
+ };
127
+
128
+ //Cannot render TabView without at least one tab
129
+ if (!routes.length) {
130
+ return <></>;
131
+ }
132
+
133
+ return (
134
+ <TabView
135
+ style={[styles.tabView, viewStyles]}
136
+ navigationState={{ index, routes }}
137
+ renderScene={SceneMap(tabScenes)}
138
+ renderTabBar={renderTabBar}
139
+ onIndexChange={indexChangeHandler}
140
+ tabBarPosition={tabBarPosition}
141
+ keyboardDismissMode={keyboardDismissMode}
142
+ swipeEnabled={swipeEnabled}
143
+ />
144
+ );
145
+ };
146
+
147
+ const styles = StyleSheet.create({
148
+ tabView: { flex: 1 },
149
+ });
150
+
151
+ export default withTheme(TabViewComponent);
@@ -0,0 +1,11 @@
1
+ import React from "react";
2
+ import { StyleSheet, View } from "react-native";
3
+ const TabViewItem = ({ style, children, }) => {
4
+ return React.createElement(View, { style: [styles.parentContainer, style] }, children);
5
+ };
6
+ const styles = StyleSheet.create({
7
+ parentContainer: {
8
+ flex: 1,
9
+ },
10
+ });
11
+ export default TabViewItem;
@@ -0,0 +1,25 @@
1
+ import React from "react";
2
+ import { StyleProp, ViewStyle, StyleSheet, View } from "react-native";
3
+
4
+ //Props used by parent (TabView) to create tabs
5
+ export interface TabViewItemProps {
6
+ title: string;
7
+ icon?: string;
8
+ accessibilityLabel?: string;
9
+ style?: StyleProp<ViewStyle>;
10
+ }
11
+
12
+ const TabViewItem: React.FC<React.PropsWithChildren<TabViewItemProps>> = ({
13
+ style,
14
+ children,
15
+ }) => {
16
+ return <View style={[styles.parentContainer, style]}>{children}</View>;
17
+ };
18
+
19
+ const styles = StyleSheet.create({
20
+ parentContainer: {
21
+ flex: 1,
22
+ },
23
+ });
24
+
25
+ export default TabViewItem;
@@ -0,0 +1,2 @@
1
+ export { default as TabView } from "./TabView";
2
+ export { default as TabViewItem } from "./TabViewItem";
@@ -0,0 +1,2 @@
1
+ export { default as TabView } from "./TabView";
2
+ export { default as TabViewItem } from "./TabViewItem";
package/src/index.js CHANGED
@@ -31,8 +31,8 @@ export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/A
31
31
  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
- export { default as Shadow } from "./components/Shadow";
35
34
  export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
35
+ export { TabView, TabViewItem } from "./components/TabView";
36
36
  /* Deprecated: Fix or Delete! */
37
37
  export { default as DatePicker } from "./components/DatePicker/DatePicker";
38
38
  export { default as Picker } from "./components/Picker/Picker";
package/src/index.tsx CHANGED
@@ -51,10 +51,10 @@ export {
51
51
  RadioButtonFieldGroup,
52
52
  } from "./components/RadioButton/index";
53
53
 
54
- export { default as Shadow } from "./components/Shadow";
55
-
56
54
  export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
57
55
 
56
+ export { TabView, TabViewItem } from "./components/TabView";
57
+
58
58
  /* Deprecated: Fix or Delete! */
59
59
  export { default as DatePicker } from "./components/DatePicker/DatePicker";
60
60
  export { default as Picker } from "./components/Picker/Picker";