@draftbit/core 47.0.1-ed6e56.2 → 47.1.1-8b0b37.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 (118) hide show
  1. package/lib/commonjs/components/Button.js +3 -3
  2. package/lib/commonjs/components/Checkbox/Checkbox.js +1 -3
  3. package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js +1 -2
  4. package/lib/commonjs/components/Checkbox/CheckboxRow.js +1 -2
  5. package/lib/commonjs/components/DatePicker/DatePicker.js +0 -1
  6. package/lib/commonjs/components/DatePicker/DatePickerComponent.js +9 -3
  7. package/lib/commonjs/components/DatePicker/DatePickerComponent.web.js +1 -0
  8. package/lib/commonjs/components/DeprecatedButton.js +3 -27
  9. package/lib/commonjs/components/DeprecatedFAB.js +1 -2
  10. package/lib/commonjs/components/Pressable.js +37 -0
  11. package/lib/commonjs/components/Swiper/Swiper.js +2 -0
  12. package/lib/commonjs/components/Touchable.js +8 -3
  13. package/lib/commonjs/index.js +7 -0
  14. package/lib/commonjs/mappings/Button.js +39 -10
  15. package/lib/commonjs/mappings/FlashList.js +55 -2
  16. package/lib/commonjs/mappings/FlatList.js +13 -0
  17. package/lib/commonjs/mappings/Swiper.js +2 -0
  18. package/lib/commonjs/mappings/Touchable.js +47 -7
  19. package/lib/module/components/Button.js +3 -3
  20. package/lib/module/components/CardBlock.js +14 -4
  21. package/lib/module/components/Checkbox/Checkbox.js +2 -3
  22. package/lib/module/components/Checkbox/CheckboxGroupRow.js +2 -3
  23. package/lib/module/components/Checkbox/CheckboxRow.js +2 -3
  24. package/lib/module/components/CircularProgress.js +28 -8
  25. package/lib/module/components/DatePicker/DatePicker.js +0 -1
  26. package/lib/module/components/DatePicker/DatePickerComponent.js +9 -3
  27. package/lib/module/components/DatePicker/DatePickerComponent.web.js +1 -0
  28. package/lib/module/components/DeprecatedButton.js +4 -28
  29. package/lib/module/components/DeprecatedFAB.js +2 -3
  30. package/lib/module/components/Image.js +18 -2
  31. package/lib/module/components/Picker/PickerComponent.android.js +21 -3
  32. package/lib/module/components/Pressable.js +30 -0
  33. package/lib/module/components/RadioButton/context.js +1 -1
  34. package/lib/module/components/Swiper/Swiper.js +2 -0
  35. package/lib/module/components/Touchable.js +8 -3
  36. package/lib/module/hooks.js +1 -2
  37. package/lib/module/index.js +1 -0
  38. package/lib/module/mappings/Button.js +40 -11
  39. package/lib/module/mappings/FlashList.js +56 -3
  40. package/lib/module/mappings/FlatList.js +14 -1
  41. package/lib/module/mappings/Swiper.js +3 -1
  42. package/lib/module/mappings/Touchable.js +49 -9
  43. package/lib/typescript/src/components/Button.d.ts.map +1 -1
  44. package/lib/typescript/src/components/Checkbox/Checkbox.d.ts +2 -2
  45. package/lib/typescript/src/components/Checkbox/Checkbox.d.ts.map +1 -1
  46. package/lib/typescript/src/components/Checkbox/CheckboxGroupRow.d.ts.map +1 -1
  47. package/lib/typescript/src/components/Checkbox/CheckboxRow.d.ts.map +1 -1
  48. package/lib/typescript/src/components/DatePicker/DatePicker.d.ts.map +1 -1
  49. package/lib/typescript/src/components/DatePicker/DatePickerComponent.d.ts.map +1 -1
  50. package/lib/typescript/src/components/DatePicker/DatePickerComponent.web.d.ts.map +1 -1
  51. package/lib/typescript/src/components/DatePicker/DatePickerComponentType.d.ts +0 -2
  52. package/lib/typescript/src/components/DatePicker/DatePickerComponentType.d.ts.map +1 -1
  53. package/lib/typescript/src/components/DeprecatedButton.d.ts +2 -2
  54. package/lib/typescript/src/components/DeprecatedButton.d.ts.map +1 -1
  55. package/lib/typescript/src/components/DeprecatedFAB.d.ts +2 -2
  56. package/lib/typescript/src/components/DeprecatedFAB.d.ts.map +1 -1
  57. package/lib/typescript/src/components/Pressable.d.ts +10 -0
  58. package/lib/typescript/src/components/Pressable.d.ts.map +1 -0
  59. package/lib/typescript/src/components/Swiper/Swiper.d.ts +2 -1
  60. package/lib/typescript/src/components/Swiper/Swiper.d.ts.map +1 -1
  61. package/lib/typescript/src/components/Touchable.d.ts +5 -6
  62. package/lib/typescript/src/components/Touchable.d.ts.map +1 -1
  63. package/lib/typescript/src/index.d.ts +1 -0
  64. package/lib/typescript/src/index.d.ts.map +1 -1
  65. package/lib/typescript/src/mappings/Button.d.ts +113 -4
  66. package/lib/typescript/src/mappings/Button.d.ts.map +1 -1
  67. package/lib/typescript/src/mappings/FlashList.d.ts +134 -2
  68. package/lib/typescript/src/mappings/FlashList.d.ts.map +1 -1
  69. package/lib/typescript/src/mappings/FlatList.d.ts +43 -0
  70. package/lib/typescript/src/mappings/FlatList.d.ts.map +1 -1
  71. package/lib/typescript/src/mappings/Swiper.d.ts +11 -0
  72. package/lib/typescript/src/mappings/Swiper.d.ts.map +1 -1
  73. package/lib/typescript/src/mappings/Touchable.d.ts +59 -5
  74. package/lib/typescript/src/mappings/Touchable.d.ts.map +1 -1
  75. package/package.json +6 -6
  76. package/src/components/Button.js +3 -3
  77. package/src/components/Button.tsx +14 -4
  78. package/src/components/Checkbox/Checkbox.js +2 -3
  79. package/src/components/Checkbox/Checkbox.tsx +5 -7
  80. package/src/components/Checkbox/CheckboxGroupRow.js +2 -3
  81. package/src/components/Checkbox/CheckboxGroupRow.tsx +3 -3
  82. package/src/components/Checkbox/CheckboxRow.js +2 -3
  83. package/src/components/Checkbox/CheckboxRow.tsx +3 -3
  84. package/src/components/DatePicker/DatePicker.js +1 -1
  85. package/src/components/DatePicker/DatePicker.tsx +0 -1
  86. package/src/components/DatePicker/DatePickerComponent.js +5 -3
  87. package/src/components/DatePicker/DatePickerComponent.tsx +11 -3
  88. package/src/components/DatePicker/DatePickerComponent.web.js +1 -1
  89. package/src/components/DatePicker/DatePickerComponent.web.tsx +1 -0
  90. package/src/components/DatePicker/DatePickerComponentType.ts +0 -9
  91. package/src/components/DeprecatedButton.js +4 -16
  92. package/src/components/DeprecatedButton.tsx +7 -31
  93. package/src/components/DeprecatedFAB.js +2 -3
  94. package/src/components/DeprecatedFAB.tsx +5 -5
  95. package/src/components/Pressable.js +12 -0
  96. package/src/components/Pressable.tsx +44 -0
  97. package/src/components/Swiper/Swiper.js +2 -2
  98. package/src/components/Swiper/Swiper.tsx +3 -0
  99. package/src/components/Touchable.js +3 -3
  100. package/src/components/Touchable.tsx +11 -7
  101. package/src/index.js +1 -0
  102. package/src/index.tsx +1 -0
  103. package/src/mappings/Button.js +39 -10
  104. package/src/mappings/Button.ts +41 -10
  105. package/src/mappings/FlashList.js +87 -31
  106. package/src/mappings/FlashList.ts +92 -30
  107. package/src/mappings/FlatList.js +14 -1
  108. package/src/mappings/FlatList.ts +17 -0
  109. package/src/mappings/Swiper.js +3 -1
  110. package/src/mappings/Swiper.ts +4 -0
  111. package/src/mappings/Touchable.js +50 -7
  112. package/src/mappings/Touchable.ts +53 -6
  113. package/lib/commonjs/components/DatePicker/DatePickerInput.js +0 -133
  114. package/lib/module/components/DatePicker/DatePickerInput.js +0 -123
  115. package/lib/typescript/src/components/DatePicker/DatePickerInput.d.ts +0 -18
  116. package/lib/typescript/src/components/DatePicker/DatePickerInput.d.ts.map +0 -1
  117. package/src/components/DatePicker/DatePickerInput.js +0 -97
  118. package/src/components/DatePicker/DatePickerInput.tsx +0 -195
@@ -7,7 +7,28 @@ export declare const SEED_DATA: {
7
7
  layout: {
8
8
  flex: number;
9
9
  };
10
+ triggers: string[];
10
11
  props: {
12
+ onRefresh: {
13
+ label: string;
14
+ description: string;
15
+ editable: boolean;
16
+ required: boolean;
17
+ formType: string;
18
+ propType: string;
19
+ defaultValue: null;
20
+ group: string;
21
+ };
22
+ onEndReached: {
23
+ label: string;
24
+ description: string;
25
+ editable: boolean;
26
+ required: boolean;
27
+ formType: string;
28
+ propType: string;
29
+ defaultValue: null;
30
+ group: string;
31
+ };
11
32
  horizontal: {
12
33
  label: string;
13
34
  description: string;
@@ -38,6 +59,28 @@ export declare const SEED_DATA: {
38
59
  editable: boolean;
39
60
  required: boolean;
40
61
  };
62
+ initialNumToRender: {
63
+ label: string;
64
+ description: string;
65
+ formType: string;
66
+ propType: string;
67
+ group: string;
68
+ defaultValue: null;
69
+ editable: boolean;
70
+ required: boolean;
71
+ step: number;
72
+ };
73
+ onEndReachedThreshold: {
74
+ label: string;
75
+ description: string;
76
+ formType: string;
77
+ propType: string;
78
+ group: string;
79
+ defaultValue: null;
80
+ editable: boolean;
81
+ required: boolean;
82
+ step: number;
83
+ };
41
84
  };
42
85
  };
43
86
  //# sourceMappingURL=FlatList.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"FlatList.d.ts","sourceRoot":"","sources":["../../../../src/mappings/FlatList.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsBrB,CAAC"}
1
+ {"version":3,"file":"FlatList.d.ts","sourceRoot":"","sources":["../../../../src/mappings/FlatList.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCrB,CAAC"}
@@ -7,7 +7,18 @@ export declare const SEED_DATA: {
7
7
  height: number;
8
8
  width: string;
9
9
  };
10
+ triggers: string[];
10
11
  props: {
12
+ onIndexChanged: {
13
+ label: string;
14
+ description: string;
15
+ editable: boolean;
16
+ required: boolean;
17
+ formType: string;
18
+ propType: string;
19
+ defaultValue: null;
20
+ group: string;
21
+ };
11
22
  from: {
12
23
  label: string;
13
24
  description: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Swiper.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Swiper.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0DrB,CAAC"}
1
+ {"version":3,"file":"Swiper.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Swiper.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DrB,CAAC"}
@@ -1,8 +1,4 @@
1
1
  export declare const SEED_DATA: {
2
- name: string;
3
- tag: string;
4
- description: string;
5
- category: string;
6
2
  stylesPanelSections: string[];
7
3
  layout: {};
8
4
  triggers: string[];
@@ -17,6 +13,64 @@ export declare const SEED_DATA: {
17
13
  defaultValue: null;
18
14
  group: string;
19
15
  };
16
+ onLongPress: {
17
+ label: string;
18
+ description: string;
19
+ editable: boolean;
20
+ required: boolean;
21
+ formType: string;
22
+ propType: string;
23
+ defaultValue: null;
24
+ group: string;
25
+ };
26
+ activeOpacity: {
27
+ label: string;
28
+ description: string;
29
+ formType: string;
30
+ propType: string;
31
+ group: string;
32
+ defaultValue: null;
33
+ editable: boolean;
34
+ required: boolean;
35
+ step: number;
36
+ };
37
+ disabledOpacity: {
38
+ label: string;
39
+ description: string;
40
+ formType: string;
41
+ propType: string;
42
+ group: string;
43
+ defaultValue: null;
44
+ editable: boolean;
45
+ required: boolean;
46
+ step: number;
47
+ };
48
+ delayLongPress: {
49
+ label: string;
50
+ description: string;
51
+ formType: string;
52
+ propType: string;
53
+ group: string;
54
+ defaultValue: null;
55
+ editable: boolean;
56
+ required: boolean;
57
+ step: number;
58
+ };
59
+ hitSlop: {
60
+ label: string;
61
+ description: string;
62
+ formType: string;
63
+ propType: string;
64
+ group: string;
65
+ defaultValue: null;
66
+ editable: boolean;
67
+ required: boolean;
68
+ step: number;
69
+ };
20
70
  };
21
- };
71
+ name: string;
72
+ tag: string;
73
+ description: string;
74
+ category: string;
75
+ }[];
22
76
  //# sourceMappingURL=Touchable.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Touchable.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Touchable.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;CAerB,CAAC"}
1
+ {"version":3,"file":"Touchable.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Touchable.ts"],"names":[],"mappings":"AAsDA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAerB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "47.0.1-ed6e56.2+ed6e56c",
3
+ "version": "47.1.1-8b0b37.2+8b0b37c",
4
4
  "description": "Core (non-native) Components",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "module": "lib/module/index.js",
@@ -41,9 +41,9 @@
41
41
  "dependencies": {
42
42
  "@date-io/date-fns": "^1.3.13",
43
43
  "@draftbit/react-theme-provider": "^2.1.1",
44
- "@draftbit/types": "^47.0.1-ed6e56.2+ed6e56c",
45
- "@material-ui/core": "^4.12.4",
46
- "@material-ui/pickers": "^3.3.10",
44
+ "@draftbit/types": "^47.1.1-8b0b37.2+8b0b37c",
45
+ "@material-ui/core": "^4.11.0",
46
+ "@material-ui/pickers": "^3.2.10",
47
47
  "@react-native-community/slider": "4.2.4",
48
48
  "@react-native-picker/picker": "2.4.8",
49
49
  "@shopify/flash-list": "1.3.1",
@@ -53,7 +53,7 @@
53
53
  "lodash.isnumber": "^3.0.3",
54
54
  "lodash.omit": "^4.5.0",
55
55
  "lodash.tonumber": "^4.0.3",
56
- "react-native-modal-datetime-picker": "^14.0.1",
56
+ "react-native-modal-datetime-picker": "^13.0.0",
57
57
  "react-native-svg": "13.4.0",
58
58
  "react-native-typography": "^1.4.1",
59
59
  "react-native-web-swiper": "^2.2.3"
@@ -91,5 +91,5 @@
91
91
  ]
92
92
  ]
93
93
  },
94
- "gitHead": "ed6e56cc6bfd9104faf3be1257309cbd08796cf5"
94
+ "gitHead": "8b0b37c98ab2f221cb58abe7f1af4db21f506711"
95
95
  }
@@ -7,7 +7,7 @@ const CONSTANTS = {
7
7
  padding: 8,
8
8
  icon: 24,
9
9
  };
10
- function Base({ Icon, icon, title, onPress, loading, disabled, style, ...props }) {
10
+ function Base({ Icon, icon, title, loading, disabled, style, activeOpacity, disabledOpacity, ...props }) {
11
11
  const { color, fontFamily, fontWeight, fontSize, lineHeight, letterSpacing, textTransform, textAlign, textDecorationLine, textDecorationColor, textDecorationStyle, ...buttonStyles } = StyleSheet.flatten(style || {});
12
12
  const titleStyles = {
13
13
  color,
@@ -28,11 +28,11 @@ function Base({ Icon, icon, title, onPress, loading, disabled, style, ...props }
28
28
  if (textAlign === "right") {
29
29
  buttonStyles.justifyContent = "flex-end";
30
30
  }
31
- return (React.createElement(Pressable, { onPress: onPress, disabled: disabled || loading, style: ({ pressed }) => {
31
+ return (React.createElement(Pressable, { disabled: disabled || loading, style: ({ pressed }) => {
32
32
  return [
33
33
  styles.base,
34
34
  {
35
- opacity: pressed || disabled ? 0.75 : 1,
35
+ opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
36
36
  },
37
37
  buttonStyles,
38
38
  ];
@@ -2,10 +2,10 @@ import * as React from "react";
2
2
  import {
3
3
  Text,
4
4
  Pressable,
5
+ PressableProps,
5
6
  Platform,
6
7
  StyleSheet,
7
8
  TextStyle,
8
- PressableProps,
9
9
  ActivityIndicator,
10
10
  } from "react-native";
11
11
 
@@ -27,6 +27,11 @@ type BaseProps = {
27
27
  loading: boolean;
28
28
  style?: TextStyle;
29
29
  onPress: () => void;
30
+ onLongPress?: () => void;
31
+ activeOpacity?: number;
32
+ disabledOpacity?: number;
33
+ delayLongPress?: number;
34
+ hitSlop?: number;
30
35
  icon?: string;
31
36
  } & PressableProps &
32
37
  IconSlot;
@@ -37,6 +42,11 @@ type Props = {
37
42
  loading: boolean;
38
43
  style?: TextStyle;
39
44
  onPress: () => void;
45
+ onLongPress?: () => void;
46
+ activeOpacity?: number;
47
+ disabledOpacity?: number;
48
+ delayLongPress?: number;
49
+ hitSlop?: number;
40
50
  icon?: string;
41
51
  theme: Theme;
42
52
  } & PressableProps &
@@ -46,10 +56,11 @@ function Base({
46
56
  Icon,
47
57
  icon,
48
58
  title,
49
- onPress,
50
59
  loading,
51
60
  disabled,
52
61
  style,
62
+ activeOpacity,
63
+ disabledOpacity,
53
64
  ...props
54
65
  }: BaseProps): JSX.Element {
55
66
  const {
@@ -91,13 +102,12 @@ function Base({
91
102
 
92
103
  return (
93
104
  <Pressable
94
- onPress={onPress}
95
105
  disabled={disabled || loading}
96
106
  style={({ pressed }) => {
97
107
  return [
98
108
  styles.base,
99
109
  {
100
- opacity: pressed || disabled ? 0.75 : 1,
110
+ opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
101
111
  },
102
112
  buttonStyles,
103
113
  ];
@@ -1,7 +1,6 @@
1
1
  import * as React from "react";
2
- import { View, StyleSheet, } from "react-native";
2
+ import { View, StyleSheet, Pressable, } from "react-native";
3
3
  import { useTheme } from "../../theming";
4
- import Touchable from "../Touchable";
5
4
  import { usePrevious } from "../../hooks";
6
5
  const Checkbox = ({ Icon, status, disabled = false, onPress, onCheck, onUncheck, color, uncheckedColor, defaultValue, checkedIcon = "MaterialCommunityIcons/checkbox-marked", uncheckedIcon = "MaterialCommunityIcons/checkbox-blank-outline", size = 24, style, ...rest }) => {
7
6
  const [internalValue, setInternalValue] = React.useState(status || defaultValue || false);
@@ -33,7 +32,7 @@ const Checkbox = ({ Icon, status, disabled = false, onPress, onCheck, onUncheck,
33
32
  onUncheck === null || onUncheck === void 0 ? void 0 : onUncheck();
34
33
  }
35
34
  };
36
- return (React.createElement(Touchable, { ...rest, onPress: handlePress, disabled: disabled, accessibilityState: { disabled }, accessibilityRole: "button", accessibilityLiveRegion: "polite", style: [styles.container, style, { width: size, height: size }] },
35
+ return (React.createElement(Pressable, { ...rest, onPress: handlePress, disabled: disabled, accessibilityState: { disabled }, accessibilityRole: "button", accessibilityLiveRegion: "polite", style: [styles.container, style, { width: size, height: size }] },
37
36
  React.createElement(Icon, { style: styles.icon, name: internalValue ? checkedIcon : uncheckedIcon, size: size, color: checkboxColor }),
38
37
  React.createElement(View, { style: [StyleSheet.absoluteFill, styles.fillContainer] },
39
38
  React.createElement(View, { style: [
@@ -2,14 +2,14 @@ import * as React from "react";
2
2
  import {
3
3
  View,
4
4
  StyleSheet,
5
- TouchableHighlightProps,
5
+ Pressable,
6
+ PressableProps,
6
7
  StyleProp,
7
8
  ViewStyle,
8
9
  } from "react-native";
9
10
  import { useTheme } from "../../theming";
10
11
  import type { IconSlot } from "../../interfaces/Icon";
11
12
 
12
- import Touchable from "../Touchable";
13
13
  import { usePrevious } from "../../hooks";
14
14
 
15
15
  export interface CheckboxProps {
@@ -27,9 +27,7 @@ export interface CheckboxProps {
27
27
  style?: StyleProp<ViewStyle>;
28
28
  }
29
29
 
30
- const Checkbox: React.FC<
31
- CheckboxProps & TouchableHighlightProps & IconSlot
32
- > = ({
30
+ const Checkbox: React.FC<CheckboxProps & PressableProps & IconSlot> = ({
33
31
  Icon,
34
32
  status,
35
33
  disabled = false,
@@ -87,7 +85,7 @@ const Checkbox: React.FC<
87
85
  };
88
86
 
89
87
  return (
90
- <Touchable
88
+ <Pressable
91
89
  {...rest}
92
90
  onPress={handlePress}
93
91
  disabled={disabled}
@@ -111,7 +109,7 @@ const Checkbox: React.FC<
111
109
  ]}
112
110
  />
113
111
  </View>
114
- </Touchable>
112
+ </Pressable>
115
113
  );
116
114
  };
117
115
 
@@ -1,10 +1,9 @@
1
1
  import * as React from "react";
2
- import { StyleSheet, View, Platform, } from "react-native";
2
+ import { StyleSheet, View, Platform, Pressable, } from "react-native";
3
3
  import Checkbox from "./Checkbox";
4
4
  import Text from "../Text";
5
5
  import { useCheckboxGroupContext } from "./context";
6
6
  import { Direction as GroupDirection } from "./context";
7
- import Touchable from "../Touchable";
8
7
  import { extractStyles } from "../../utilities";
9
8
  export var Direction;
10
9
  (function (Direction) {
@@ -41,7 +40,7 @@ const CheckboxGroupRow = ({ Icon, label = "Label", status, value, onPress, label
41
40
  }
42
41
  };
43
42
  const { textStyles, viewStyles } = extractStyles(style);
44
- return (React.createElement(Touchable, { onPress: handlePress, style: [styles.mainParent, { flexDirection: direction }, viewStyles], disabled: disabled, ...rest },
43
+ return (React.createElement(Pressable, { onPress: handlePress, style: [styles.mainParent, { flexDirection: direction }, viewStyles], disabled: disabled, ...rest },
45
44
  React.createElement(View, { style: [
46
45
  styles.label,
47
46
  {
@@ -6,13 +6,13 @@ import {
6
6
  TextStyle,
7
7
  View,
8
8
  Platform,
9
+ Pressable,
9
10
  } from "react-native";
10
11
  import Checkbox, { CheckboxProps } from "./Checkbox";
11
12
  import Text from "../Text";
12
13
  import { useCheckboxGroupContext } from "./context";
13
14
  import type { IconSlot } from "../../interfaces/Icon";
14
15
  import { Direction as GroupDirection } from "./context";
15
- import Touchable from "../Touchable";
16
16
  import { extractStyles } from "../../utilities";
17
17
 
18
18
  export enum Direction {
@@ -92,7 +92,7 @@ const CheckboxGroupRow: React.FC<CheckboxGroupRowProps & IconSlot> = ({
92
92
  const { textStyles, viewStyles } = extractStyles(style);
93
93
 
94
94
  return (
95
- <Touchable
95
+ <Pressable
96
96
  onPress={handlePress}
97
97
  style={[styles.mainParent, { flexDirection: direction }, viewStyles]}
98
98
  disabled={disabled}
@@ -125,7 +125,7 @@ const CheckboxGroupRow: React.FC<CheckboxGroupRowProps & IconSlot> = ({
125
125
  uncheckedColor={uncheckedColor}
126
126
  />
127
127
  </View>
128
- </Touchable>
128
+ </Pressable>
129
129
  );
130
130
  };
131
131
 
@@ -1,10 +1,9 @@
1
1
  import * as React from "react";
2
- import { StyleSheet, View, Platform, } from "react-native";
2
+ import { StyleSheet, View, Platform, Pressable, } from "react-native";
3
3
  import { isString } from "lodash";
4
4
  import { extractStyles } from "../../utilities";
5
5
  import { usePrevious } from "../../hooks";
6
6
  import Text from "../Text";
7
- import Touchable from "../Touchable";
8
7
  import Checkbox from "./Checkbox";
9
8
  export var Direction;
10
9
  (function (Direction) {
@@ -46,7 +45,7 @@ const CheckboxRow = ({ label = "Label", labelStyle, labelContainerStyle, checkbo
46
45
  }
47
46
  };
48
47
  const { textStyles, viewStyles } = extractStyles(style);
49
- return (React.createElement(Touchable, { onPress: handlePress, style: [viewStyles, styles.mainParent, { flexDirection: direction }], disabled: disabled, ...rest },
48
+ return (React.createElement(Pressable, { onPress: handlePress, style: [viewStyles, styles.mainParent, { flexDirection: direction }], disabled: disabled, ...rest },
50
49
  React.createElement(View, { style: [
51
50
  styles.label,
52
51
  {
@@ -6,6 +6,7 @@ import {
6
6
  TextStyle,
7
7
  View,
8
8
  Platform,
9
+ Pressable,
9
10
  } from "react-native";
10
11
  import { isString } from "lodash";
11
12
 
@@ -13,7 +14,6 @@ import type { IconSlot } from "../../interfaces/Icon";
13
14
  import { extractStyles } from "../../utilities";
14
15
  import { usePrevious } from "../../hooks";
15
16
  import Text from "../Text";
16
- import Touchable from "../Touchable";
17
17
  import Checkbox, { CheckboxProps } from "./Checkbox";
18
18
 
19
19
  export enum Direction {
@@ -100,7 +100,7 @@ const CheckboxRow: React.FC<CheckboxRowProps & IconSlot> = ({
100
100
  const { textStyles, viewStyles } = extractStyles(style);
101
101
 
102
102
  return (
103
- <Touchable
103
+ <Pressable
104
104
  onPress={handlePress}
105
105
  style={[viewStyles, styles.mainParent, { flexDirection: direction }]}
106
106
  disabled={disabled}
@@ -130,7 +130,7 @@ const CheckboxRow: React.FC<CheckboxRowProps & IconSlot> = ({
130
130
  uncheckedIcon={uncheckedIcon}
131
131
  size={size}
132
132
  />
133
- </Touchable>
133
+ </Pressable>
134
134
  );
135
135
  };
136
136
 
@@ -333,7 +333,7 @@ const DatePicker = ({ Icon, style, theme: { colors, typography, roundness, disab
333
333
  paddingRight: insets.right,
334
334
  },
335
335
  ] },
336
- React.createElement(DateTimePicker, { value: getValidDate(), mode: mode, displayMode: "default", isVisible: pickerVisible, toggleVisibility: toggleVisibility, onChange: (_event, data) => {
336
+ React.createElement(DateTimePicker, { value: getValidDate(), mode: mode, isVisible: pickerVisible, toggleVisibility: toggleVisibility, onChange: (_event, data) => {
337
337
  toggleVisibility();
338
338
  setValue(data);
339
339
  onDateChange(data);
@@ -515,7 +515,6 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
515
515
  <DateTimePicker
516
516
  value={getValidDate()}
517
517
  mode={mode}
518
- displayMode="default"
519
518
  isVisible={pickerVisible}
520
519
  toggleVisibility={toggleVisibility}
521
520
  onChange={(_event: any, data: any) => {
@@ -1,11 +1,13 @@
1
1
  import React from "react";
2
+ import { Platform } from "react-native";
3
+ import DateTimePicker from "@react-native-community/datetimepicker";
2
4
  import DateTimePickerModal from "react-native-modal-datetime-picker";
3
- const DatePickerComponent = ({ value, onChange, displayMode = "default", mode, toggleVisibility, }) => {
4
- return (React.createElement(DateTimePickerModal, { date: value, mode: mode, isVisible: true, display: displayMode, onCancel: () => {
5
+ const DatePickerComponent = ({ value, onChange, mode, toggleVisibility, }) => {
6
+ return Platform.OS === "ios" || Platform.OS === "android" ? (React.createElement(DateTimePickerModal, { date: value, mode: mode, isVisible: true, display: Platform.OS === "ios" ? "spinner" : "default", onCancel: () => {
5
7
  console.log("Picker cancelled before selecting anything.");
6
8
  toggleVisibility();
7
9
  }, onConfirm: (data) => {
8
10
  onChange(null, data);
9
- } }));
11
+ } })) : (React.createElement(DateTimePicker, { value: value, mode: mode, onChange: onChange, display: "default" }));
10
12
  };
11
13
  export default DatePickerComponent;
@@ -1,20 +1,21 @@
1
1
  import React from "react";
2
+ import { Platform } from "react-native";
3
+ import DateTimePicker from "@react-native-community/datetimepicker";
2
4
  import DateTimePickerModal from "react-native-modal-datetime-picker";
3
5
  import { DatePickerComponentProps as Props } from "./DatePickerComponentType";
4
6
 
5
7
  const DatePickerComponent: React.FC<React.PropsWithChildren<Props>> = ({
6
8
  value,
7
9
  onChange,
8
- displayMode = "default",
9
10
  mode,
10
11
  toggleVisibility,
11
12
  }) => {
12
- return (
13
+ return Platform.OS === "ios" || Platform.OS === "android" ? (
13
14
  <DateTimePickerModal
14
15
  date={value}
15
16
  mode={mode}
16
17
  isVisible={true}
17
- display={displayMode}
18
+ display={Platform.OS === "ios" ? "spinner" : "default"}
18
19
  onCancel={() => {
19
20
  console.log("Picker cancelled before selecting anything.");
20
21
  toggleVisibility();
@@ -23,6 +24,13 @@ const DatePickerComponent: React.FC<React.PropsWithChildren<Props>> = ({
23
24
  onChange(null, data);
24
25
  }}
25
26
  />
27
+ ) : (
28
+ <DateTimePicker
29
+ value={value}
30
+ mode={mode}
31
+ onChange={onChange}
32
+ display={"default"}
33
+ />
26
34
  );
27
35
  };
28
36
 
@@ -25,6 +25,6 @@ const DatePickerComponent = ({ value, onChange, mode, toggleVisibility, isVisibl
25
25
  React.createElement(Picker, { value: value, open: isVisible, onChange: (d) => {
26
26
  toggleVisibility();
27
27
  onChange(null, d);
28
- }, onClose: () => toggleVisibility(), TextFieldComponent: () => null }))));
28
+ }, onClose: () => toggleVisibility(), variant: "dialog", TextFieldComponent: () => null }))));
29
29
  };
30
30
  export default withTheme(DatePickerComponent);
@@ -48,6 +48,7 @@ const DatePickerComponent: React.FC<Props & { theme: typeof Theme }> = ({
48
48
  onChange(null, d);
49
49
  }}
50
50
  onClose={() => toggleVisibility()}
51
+ variant="dialog"
51
52
  TextFieldComponent={() => null}
52
53
  />
53
54
  </ThemeProvider>
@@ -6,14 +6,5 @@ export interface DatePickerComponentProps {
6
6
  mode: "date" | "time" | "datetime";
7
7
  toggleVisibility: () => void;
8
8
  isVisible?: boolean;
9
- displayMode?:
10
- | "default"
11
- | "compact"
12
- | "inline"
13
- | "spinner"
14
- | "clock"
15
- | "calendar"
16
- | undefined;
17
- variant?: "dialog" | "inline" | undefined;
18
9
  theme?: typeof theme;
19
10
  }
@@ -1,11 +1,10 @@
1
1
  import * as React from "react";
2
- import { ActivityIndicator, View, Text, StyleSheet, } from "react-native";
2
+ import { ActivityIndicator, View, Text, StyleSheet, Pressable, } from "react-native";
3
3
  import color from "color";
4
4
  import Config from "./Config";
5
- import Touchable from "./Touchable";
6
5
  import Elevation from "./Elevation";
7
6
  import { withTheme } from "../theming";
8
- const Button = ({ Icon, icon, disabled = false, type = "solid", loading = false, labelColor, color: colorOverride, children, onPress, elevation = 0, style, theme: { colors, disabledOpacity, roundness, typography }, ...rest }) => {
7
+ const Button = ({ Icon, icon, disabled = false, type = "solid", loading = false, labelColor, color: colorOverride, children, onPress, elevation = 0, theme: { colors, disabledOpacity, roundness, typography }, ...rest }) => {
9
8
  let backgroundColor, borderColor, textColor, borderWidth;
10
9
  const buttonColor = colorOverride || colors.primary;
11
10
  if (type === "solid") {
@@ -59,19 +58,8 @@ const Button = ({ Icon, icon, disabled = false, type = "solid", loading = false,
59
58
  width: Config.buttonIconSize,
60
59
  },
61
60
  ];
62
- const { margin, marginEnd, marginTop, marginLeft, marginRight, marginBottom, marginHorizontal, marginVertical, ...innerStyles } = StyleSheet.flatten(style || {});
63
- const margins = {
64
- margin,
65
- marginEnd,
66
- marginTop,
67
- marginLeft,
68
- marginRight,
69
- marginBottom,
70
- marginHorizontal,
71
- marginVertical,
72
- };
73
- return (React.createElement(Elevation, { style: { elevation, alignSelf: "stretch", ...margins } },
74
- React.createElement(Touchable, { ...rest, onPress: onPress, accessibilityState: { disabled }, accessibilityRole: "button", disabled: disabled || loading, style: [styles.button, buttonStyle, innerStyles] },
61
+ return (React.createElement(Elevation, { style: { elevation, alignSelf: "stretch" } },
62
+ React.createElement(Pressable, { ...rest, onPress: onPress, accessibilityState: { disabled }, accessibilityRole: "button", disabled: disabled || loading, style: [styles.button, buttonStyle] },
75
63
  React.createElement(View, { style: styles.content },
76
64
  icon && loading !== true ? (React.createElement(View, { style: iconStyle },
77
65
  React.createElement(Icon, { name: icon, size: Config.buttonIconSize, color: textColor }))) : null,