@draftbit/core 43.2.4-aa029f.0 → 43.2.5-0c3aa5.3

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 (92) hide show
  1. package/lib/commonjs/components/Carousel.js +0 -3
  2. package/lib/commonjs/components/Carousel.js.map +1 -1
  3. package/lib/commonjs/components/DeprecatedCardWrapper.js +2 -14
  4. package/lib/commonjs/components/DeprecatedCardWrapper.js.map +1 -1
  5. package/lib/commonjs/components/DeprecatedFAB.js +20 -4
  6. package/lib/commonjs/components/DeprecatedFAB.js.map +1 -1
  7. package/lib/commonjs/components/Divider.js +13 -3
  8. package/lib/commonjs/components/Divider.js.map +1 -1
  9. package/lib/commonjs/components/NumberInput.js +25 -17
  10. package/lib/commonjs/components/NumberInput.js.map +1 -1
  11. package/lib/commonjs/components/Stepper.js +28 -19
  12. package/lib/commonjs/components/Stepper.js.map +1 -1
  13. package/lib/commonjs/components/ToggleButton.js +3 -3
  14. package/lib/commonjs/components/ToggleButton.js.map +1 -1
  15. package/lib/commonjs/index.js +0 -14
  16. package/lib/commonjs/index.js.map +1 -1
  17. package/lib/commonjs/mappings/Carousel.js +3 -1
  18. package/lib/commonjs/mappings/Carousel.js.map +1 -1
  19. package/lib/commonjs/mappings/FAB.js +1 -1
  20. package/lib/commonjs/mappings/FAB.js.map +1 -1
  21. package/lib/commonjs/mappings/Stepper.js +9 -0
  22. package/lib/commonjs/mappings/Stepper.js.map +1 -1
  23. package/lib/module/components/Accordion/AccordionItem.js +5 -22
  24. package/lib/module/components/Carousel.js +0 -3
  25. package/lib/module/components/Carousel.js.map +1 -1
  26. package/lib/module/components/Header.js.map +1 -1
  27. package/lib/module/components/NumberInput.js +27 -19
  28. package/lib/module/components/NumberInput.js.map +1 -1
  29. package/lib/module/components/Stepper.js +27 -19
  30. package/lib/module/components/Stepper.js.map +1 -1
  31. package/lib/module/components/ToggleButton.js +3 -3
  32. package/lib/module/components/ToggleButton.js.map +1 -1
  33. package/lib/module/index.js +0 -1
  34. package/lib/module/index.js.map +1 -1
  35. package/lib/module/mappings/Carousel.js +3 -1
  36. package/lib/module/mappings/Carousel.js.map +1 -1
  37. package/lib/module/mappings/FAB.js +1 -1
  38. package/lib/module/mappings/FAB.js.map +1 -1
  39. package/lib/module/mappings/MapMarker.js.map +1 -1
  40. package/lib/module/mappings/Stepper.js +10 -1
  41. package/lib/module/mappings/Stepper.js.map +1 -1
  42. package/lib/typescript/src/components/NumberInput.d.ts +2 -1
  43. package/lib/typescript/src/components/Stepper.d.ts +2 -0
  44. package/lib/typescript/src/index.d.ts +0 -1
  45. package/lib/typescript/src/mappings/Carousel.d.ts +3 -1
  46. package/lib/typescript/src/mappings/FAB.d.ts +1 -1
  47. package/lib/typescript/src/mappings/Stepper.d.ts +22 -0
  48. package/package.json +3 -5
  49. package/src/components/Carousel.js +0 -3
  50. package/src/components/Carousel.tsx +0 -3
  51. package/src/components/NumberInput.js +19 -14
  52. package/src/components/NumberInput.tsx +28 -19
  53. package/src/components/Stepper.js +23 -21
  54. package/src/components/Stepper.tsx +27 -19
  55. package/src/components/ToggleButton.js +5 -3
  56. package/src/components/ToggleButton.tsx +5 -3
  57. package/src/index.js +0 -1
  58. package/src/index.tsx +0 -1
  59. package/src/mappings/Carousel.js +3 -1
  60. package/src/mappings/Carousel.ts +3 -1
  61. package/src/mappings/FAB.js +1 -1
  62. package/src/mappings/FAB.ts +1 -1
  63. package/src/mappings/Stepper.js +10 -1
  64. package/src/mappings/Stepper.ts +10 -0
  65. package/lib/commonjs/components/TabView/TabView.js +0 -103
  66. package/lib/commonjs/components/TabView/TabView.js.map +0 -1
  67. package/lib/commonjs/components/TabView/TabViewItem.js +0 -27
  68. package/lib/commonjs/components/TabView/TabViewItem.js.map +0 -1
  69. package/lib/commonjs/components/TabView/index.js +0 -24
  70. package/lib/commonjs/components/TabView/index.js.map +0 -1
  71. package/lib/commonjs/mappings/TabView.js +0 -80
  72. package/lib/commonjs/mappings/TabView.js.map +0 -1
  73. package/lib/module/components/TabView/TabView.js +0 -88
  74. package/lib/module/components/TabView/TabView.js.map +0 -1
  75. package/lib/module/components/TabView/TabViewItem.js +0 -19
  76. package/lib/module/components/TabView/TabViewItem.js.map +0 -1
  77. package/lib/module/components/TabView/index.js +0 -3
  78. package/lib/module/components/TabView/index.js.map +0 -1
  79. package/lib/module/mappings/TabView.js +0 -71
  80. package/lib/module/mappings/TabView.js.map +0 -1
  81. package/lib/typescript/src/components/TabView/TabView.d.ts +0 -19
  82. package/lib/typescript/src/components/TabView/TabViewItem.d.ts +0 -10
  83. package/lib/typescript/src/components/TabView/index.d.ts +0 -2
  84. package/lib/typescript/src/mappings/TabView.d.ts +0 -111
  85. package/src/components/TabView/TabView.js +0 -33
  86. package/src/components/TabView/TabView.tsx +0 -97
  87. package/src/components/TabView/TabViewItem.js +0 -5
  88. package/src/components/TabView/TabViewItem.tsx +0 -21
  89. package/src/components/TabView/index.js +0 -2
  90. package/src/components/TabView/index.ts +0 -2
  91. package/src/mappings/TabView.js +0 -73
  92. package/src/mappings/TabView.ts +0 -80
@@ -66,7 +66,7 @@ export declare const SEED_DATA: {
66
66
  formType: string;
67
67
  propType: string;
68
68
  };
69
- iconSize: {
69
+ size: {
70
70
  group: string;
71
71
  label: string;
72
72
  description: string;
@@ -39,5 +39,27 @@ export declare const SEED_DATA: {
39
39
  formType: string;
40
40
  propType: string;
41
41
  };
42
+ min: {
43
+ label: string;
44
+ description: string;
45
+ formType: string;
46
+ propType: string;
47
+ group: string;
48
+ defaultValue: null;
49
+ editable: boolean;
50
+ required: boolean;
51
+ step: number;
52
+ };
53
+ max: {
54
+ label: string;
55
+ description: string;
56
+ formType: string;
57
+ propType: string;
58
+ group: string;
59
+ defaultValue: null;
60
+ editable: boolean;
61
+ required: boolean;
62
+ step: number;
63
+ };
42
64
  };
43
65
  }[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "43.2.4-aa029f.0+aa029f8e",
3
+ "version": "43.2.5-0c3aa5.3+0c3aa508",
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": "^43.2.0",
44
+ "@draftbit/types": "^43.2.4",
45
45
  "@material-ui/core": "^4.11.0",
46
46
  "@material-ui/pickers": "^3.2.10",
47
47
  "@react-native-community/slider": "4.1.7",
@@ -53,8 +53,6 @@
53
53
  "lodash.omit": "^4.5.0",
54
54
  "lodash.tonumber": "^4.0.3",
55
55
  "react-native-modal-datetime-picker": "^13.0.0",
56
- "react-native-pager-view": "^5.4.9",
57
- "react-native-tab-view": "^3.1.1",
58
56
  "react-native-typography": "^1.4.1",
59
57
  "react-native-web-swiper": "^2.2.1"
60
58
  },
@@ -81,5 +79,5 @@
81
79
  ]
82
80
  ]
83
81
  },
84
- "gitHead": "aa029f8e3934e3717bc10f06e86131e0d9ef175d"
82
+ "gitHead": "0c3aa50807c45f385d40d0367a7b44ec4e6cd1ba"
85
83
  }
@@ -44,9 +44,6 @@ function Carousel({ data, children, dotColor = "strong", style, ...rest }) {
44
44
  }
45
45
  const styles = StyleSheet.create({
46
46
  container: {
47
- height: 250,
48
- position: "relative",
49
- width: screenWidth,
50
47
  backgroundColor: "#eee",
51
48
  },
52
49
  pager: {
@@ -110,9 +110,6 @@ function Carousel({
110
110
 
111
111
  const styles = StyleSheet.create({
112
112
  container: {
113
- height: 250,
114
- position: "relative",
115
- width: screenWidth,
116
113
  backgroundColor: "#eee",
117
114
  },
118
115
  pager: {
@@ -1,23 +1,28 @@
1
1
  import React from "react";
2
- import { TextInput as NativeNumberInput } from "react-native";
3
- const NumberInput = ({ defaultValue, onChangeText, ...props }) => {
4
- const [internalValue, setInternalValue] = React.useState(defaultValue);
2
+ import { TextInput } from "react-native";
3
+ const NumberInput = ({ onChangeText, value, defaultValue, ...props }) => {
4
+ const [isDecimal, setIsDecimal] = React.useState(value && !Number.isInteger(value));
5
5
  React.useEffect(() => {
6
- if (defaultValue != null) {
7
- setInternalValue(defaultValue);
6
+ if (value) {
7
+ setIsDecimal(value.toString().includes("."));
8
8
  }
9
- }, [defaultValue]);
10
- const handleChangeText = (value) => {
11
- setInternalValue(value);
9
+ }, [value]);
10
+ const handleChangeText = (newValue) => {
12
11
  if (onChangeText) {
13
- onChangeText(stringToInteger(value));
12
+ const parsedNumber = parseFloat(newValue);
13
+ const number = isNaN(parsedNumber) ? 0 : parsedNumber;
14
+ setIsDecimal(newValue.includes("."));
15
+ onChangeText(number);
14
16
  }
15
17
  };
16
- return (React.createElement(NativeNumberInput, { keyboardType: "numeric", onChangeText: handleChangeText, ...props, value: internalValue }));
17
- };
18
- const stringToInteger = (str) => {
19
- const number = parseFloat(str);
20
- return isNaN(number) ? 0 : number;
18
+ let strValue;
19
+ if (value != undefined) {
20
+ strValue = value.toString();
21
+ if (isDecimal && !strValue.includes(".")) {
22
+ strValue = `${strValue}.`;
23
+ }
24
+ }
25
+ return (React.createElement(TextInput, { keyboardType: "numeric", ...props, value: strValue, defaultValue: defaultValue?.toString(), onChangeText: handleChangeText }));
21
26
  };
22
27
  export default NumberInput;
23
28
  // comment to try to fix sourcemap issue
@@ -1,46 +1,55 @@
1
1
  import React from "react";
2
- import { TextInput as NativeNumberInput } from "react-native";
2
+ import { TextInput } from "react-native";
3
3
 
4
4
  interface Props {
5
- defaultValue?: string;
5
+ value?: number;
6
+ defaultValue?: number;
6
7
  onChangeText: (value?: number) => void;
7
8
  }
8
9
 
9
10
  const NumberInput: React.FC<Props> = ({
10
- defaultValue,
11
11
  onChangeText,
12
+ value,
13
+ defaultValue,
12
14
  ...props
13
15
  }) => {
14
- const [internalValue, setInternalValue] = React.useState(defaultValue);
15
-
16
+ const [isDecimal, setIsDecimal] = React.useState(
17
+ value && !Number.isInteger(value)
18
+ );
16
19
  React.useEffect(() => {
17
- if (defaultValue != null) {
18
- setInternalValue(defaultValue);
20
+ if (value) {
21
+ setIsDecimal(value.toString().includes("."));
19
22
  }
20
- }, [defaultValue]);
23
+ }, [value]);
21
24
 
22
- const handleChangeText = (value: string) => {
23
- setInternalValue(value);
25
+ const handleChangeText = (newValue: string) => {
24
26
  if (onChangeText) {
25
- onChangeText(stringToInteger(value));
27
+ const parsedNumber = parseFloat(newValue);
28
+ const number = isNaN(parsedNumber) ? 0 : parsedNumber;
29
+ setIsDecimal(newValue.includes("."));
30
+ onChangeText(number);
26
31
  }
27
32
  };
28
33
 
34
+ let strValue;
35
+ if (value != undefined) {
36
+ strValue = value.toString();
37
+ if (isDecimal && !strValue.includes(".")) {
38
+ strValue = `${strValue}.`;
39
+ }
40
+ }
41
+
29
42
  return (
30
- <NativeNumberInput
43
+ <TextInput
31
44
  keyboardType="numeric"
32
- onChangeText={handleChangeText}
33
45
  {...props}
34
- value={internalValue}
46
+ value={strValue}
47
+ defaultValue={defaultValue?.toString()}
48
+ onChangeText={handleChangeText}
35
49
  />
36
50
  );
37
51
  };
38
52
 
39
- const stringToInteger = (str: string | undefined): number => {
40
- const number = parseFloat(str as string);
41
- return isNaN(number) ? 0 : number;
42
- };
43
-
44
53
  export default NumberInput;
45
54
 
46
55
  // comment to try to fix sourcemap issue
@@ -2,40 +2,42 @@ import * as React from "react";
2
2
  import { View, Text } from "react-native";
3
3
  import { withTheme } from "../theming";
4
4
  import IconButton from "./IconButton";
5
- const Stepper = ({ Icon, value, style, onChange, defaultValue, theme: { colors, typography, roundness }, iconSize = 24, iconColor = colors.strong, borderRadius = roundness, typeStyle, }) => {
5
+ import isNumber from "lodash.isnumber";
6
+ const Stepper = ({ Icon, value, min, max, style, onChange, defaultValue, theme: { colors, typography, roundness }, iconSize = 24, iconColor = colors.strong, borderRadius = roundness, typeStyle, }) => {
6
7
  const [stateValue, setStateValue] = React.useState(value || defaultValue || 0);
7
8
  React.useEffect(() => {
8
- if (value != null) {
9
- setStateValue(value);
9
+ if (value || value === 0) {
10
+ onChange && onChange(stateValue);
10
11
  }
11
- }, [value]);
12
+ }, [onChange, stateValue, value]);
12
13
  React.useEffect(() => {
13
- if (defaultValue != null) {
14
- setStateValue(defaultValue);
15
- }
16
- }, [defaultValue]);
17
- const handleMinus = () => {
18
- if (value || value === 0) {
19
- onChange && onChange(value - 1);
14
+ let newValue = value || defaultValue || 0;
15
+ if (isNumber(max) && newValue > max) {
16
+ newValue = max;
20
17
  }
21
- else {
22
- setStateValue(stateValue - 1);
18
+ if (isNumber(min) && newValue < min) {
19
+ newValue = min;
23
20
  }
24
- };
25
- const handlePlus = () => {
26
- if (value || value === 0) {
27
- onChange && onChange(value + 1);
21
+ setStateValue(newValue);
22
+ }, [defaultValue, value, min, max]);
23
+ const handleMinus = React.useCallback(() => {
24
+ if (isNumber(min) && value === min) {
25
+ return;
28
26
  }
29
- else {
30
- setStateValue(stateValue + 1);
27
+ setStateValue(stateValue - 1);
28
+ }, [min, stateValue, value]);
29
+ const handlePlus = React.useCallback(() => {
30
+ if (isNumber(max) && value === max) {
31
+ return;
31
32
  }
32
- };
33
+ setStateValue(stateValue + 1);
34
+ }, [max, stateValue, value]);
33
35
  return (React.createElement(View, { style: [
34
36
  { flexDirection: "row" },
35
37
  style,
36
38
  borderRadius ? { borderRadius } : {},
37
39
  ] },
38
- React.createElement(IconButton, { Icon: Icon, icon: "MaterialIcons/remove", onPress: handleMinus, size: iconSize, color: iconColor, disabled: value ? value === 0 : stateValue === 0 }),
40
+ React.createElement(IconButton, { Icon: Icon, icon: "MaterialIcons/remove", onPress: handleMinus, size: iconSize, color: iconColor, disabled: stateValue === 0 }),
39
41
  React.createElement(Text, { style: [
40
42
  typography.body1,
41
43
  {
@@ -5,9 +5,12 @@ import type { Theme } from "../styles/DefaultTheme";
5
5
  import type { IconSlot } from "../interfaces/Icon";
6
6
 
7
7
  import IconButton from "./IconButton";
8
+ import isNumber from "lodash.isnumber";
8
9
 
9
10
  type Props = {
10
11
  value?: number;
12
+ min?: number;
13
+ max?: number;
11
14
  theme: Theme;
12
15
  style?: StyleProp<ViewStyle>;
13
16
  onChange?: (value: number) => void;
@@ -21,6 +24,8 @@ type Props = {
21
24
  const Stepper: React.FC<Props> = ({
22
25
  Icon,
23
26
  value,
27
+ min,
28
+ max,
24
29
  style,
25
30
  onChange,
26
31
  defaultValue,
@@ -35,32 +40,35 @@ const Stepper: React.FC<Props> = ({
35
40
  );
36
41
 
37
42
  React.useEffect(() => {
38
- if (value != null) {
39
- setStateValue(value);
43
+ if (value || value === 0) {
44
+ onChange && onChange(stateValue);
40
45
  }
41
- }, [value]);
46
+ }, [onChange, stateValue, value]);
42
47
 
43
48
  React.useEffect(() => {
44
- if (defaultValue != null) {
45
- setStateValue(defaultValue);
49
+ let newValue = value || defaultValue || 0;
50
+ if (isNumber(max) && newValue > max) {
51
+ newValue = max;
52
+ }
53
+ if (isNumber(min) && newValue < min) {
54
+ newValue = min;
46
55
  }
47
- }, [defaultValue]);
56
+ setStateValue(newValue);
57
+ }, [defaultValue, value, min, max]);
48
58
 
49
- const handleMinus = () => {
50
- if (value || value === 0) {
51
- onChange && onChange(value - 1);
52
- } else {
53
- setStateValue(stateValue - 1);
59
+ const handleMinus = React.useCallback(() => {
60
+ if (isNumber(min) && value === min) {
61
+ return;
54
62
  }
55
- };
63
+ setStateValue(stateValue - 1);
64
+ }, [min, stateValue, value]);
56
65
 
57
- const handlePlus = () => {
58
- if (value || value === 0) {
59
- onChange && onChange(value + 1);
60
- } else {
61
- setStateValue(stateValue + 1);
66
+ const handlePlus = React.useCallback(() => {
67
+ if (isNumber(max) && value === max) {
68
+ return;
62
69
  }
63
- };
70
+ setStateValue(stateValue + 1);
71
+ }, [max, stateValue, value]);
64
72
 
65
73
  return (
66
74
  <View
@@ -76,7 +84,7 @@ const Stepper: React.FC<Props> = ({
76
84
  onPress={handleMinus}
77
85
  size={iconSize}
78
86
  color={iconColor}
79
- disabled={value ? value === 0 : stateValue === 0}
87
+ disabled={stateValue === 0}
80
88
  />
81
89
  <Text
82
90
  style={[
@@ -15,15 +15,17 @@ const ToggleButton = ({ Icon, icon, toggled = false, onPress = () => { }, defaul
15
15
  }
16
16
  }, [defaultValue]);
17
17
  const handlePress = () => {
18
- setInternalValue(!toggled);
19
- onPress(!toggled);
18
+ setInternalValue(!internalValue);
19
+ onPress(!internalValue);
20
20
  };
21
21
  return (React.createElement(IconButton, { Icon: Icon, icon: icon, size: iconSize, color: internalValue ? colors[color] : colors[colorSecondary], onPress: handlePress, disabled: disabled, style: [
22
22
  styles.mainContainer,
23
23
  {
24
24
  width,
25
25
  height,
26
- backgroundColor: toggled ? colors[colorSecondary] : colors[color],
26
+ backgroundColor: internalValue
27
+ ? colors[colorSecondary]
28
+ : colors[color],
27
29
  borderColor: colors[borderColor],
28
30
  },
29
31
  style,
@@ -56,8 +56,8 @@ const ToggleButton: React.FC<Props> = ({
56
56
  }, [defaultValue]);
57
57
 
58
58
  const handlePress = () => {
59
- setInternalValue(!toggled);
60
- onPress(!toggled);
59
+ setInternalValue(!internalValue);
60
+ onPress(!internalValue);
61
61
  };
62
62
 
63
63
  return (
@@ -73,7 +73,9 @@ const ToggleButton: React.FC<Props> = ({
73
73
  {
74
74
  width,
75
75
  height,
76
- backgroundColor: toggled ? colors[colorSecondary] : colors[color],
76
+ backgroundColor: internalValue
77
+ ? colors[colorSecondary]
78
+ : colors[color],
77
79
  borderColor: colors[borderColor],
78
80
  },
79
81
  style,
package/src/index.js CHANGED
@@ -27,7 +27,6 @@ export { default as Touchable } from "./components/Touchable";
27
27
  export { AccordionGroup, AccordionItem } from "./components/Accordion";
28
28
  export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/ActionSheet";
29
29
  export { Swiper, SwiperItem } from "./components/Swiper";
30
- export { TabView, TabViewItem } from "./components/TabView";
31
30
  export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
32
31
  export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
33
32
  /* Deprecated: Fix or Delete! */
package/src/index.tsx CHANGED
@@ -32,7 +32,6 @@ export {
32
32
  ActionSheetCancel,
33
33
  } from "./components/ActionSheet";
34
34
  export { Swiper, SwiperItem } from "./components/Swiper";
35
- export { TabView, TabViewItem } from "./components/TabView";
36
35
 
37
36
  export {
38
37
  Center,
@@ -5,7 +5,9 @@ export const SEED_DATA = [
5
5
  tag: "Carousel",
6
6
  category: COMPONENT_TYPES.media,
7
7
  description: "A horizontal scrolling carousel of images",
8
- layout: {},
8
+ layout: {
9
+ height: 250,
10
+ },
9
11
  props: {
10
12
  resizeMode: createResizeModeProp(),
11
13
  dotColor: createColorProp({
@@ -10,7 +10,9 @@ export const SEED_DATA = [
10
10
  tag: "Carousel",
11
11
  category: COMPONENT_TYPES.media,
12
12
  description: "A horizontal scrolling carousel of images",
13
- layout: {},
13
+ layout: {
14
+ height: 250,
15
+ },
14
16
  props: {
15
17
  resizeMode: createResizeModeProp(),
16
18
  dotColor: createColorProp({
@@ -31,6 +31,6 @@ export const SEED_DATA = {
31
31
  defaultValue: null,
32
32
  group: GROUPS.basic,
33
33
  }),
34
- iconSize: createIconSizeProp(),
34
+ size: createIconSizeProp(),
35
35
  },
36
36
  };
@@ -41,6 +41,6 @@ export const SEED_DATA = {
41
41
  defaultValue: null,
42
42
  group: GROUPS.basic,
43
43
  }),
44
- iconSize: createIconSizeProp(),
44
+ size: createIconSizeProp(),
45
45
  },
46
46
  };
@@ -1,4 +1,4 @@
1
- import { COMPONENT_TYPES, createIconSizeProp, createColorProp, createFieldNameProp, Triggers, } from "@draftbit/types";
1
+ import { COMPONENT_TYPES, createIconSizeProp, createColorProp, createFieldNameProp, createStaticNumberProp, Triggers, } from "@draftbit/types";
2
2
  export const SEED_DATA = [
3
3
  {
4
4
  name: "Stepper",
@@ -15,6 +15,15 @@ export const SEED_DATA = [
15
15
  }),
16
16
  iconSize: createIconSizeProp({ defaultValue: 24 }),
17
17
  iconColor: createColorProp({ defaultValue: "strong" }),
18
+ min: createStaticNumberProp({
19
+ label: "Minimum",
20
+ description: "Minimum Number",
21
+ defaultValue: 0,
22
+ }),
23
+ max: createStaticNumberProp({
24
+ label: "Maximum",
25
+ description: "Maximum Number",
26
+ }),
18
27
  },
19
28
  },
20
29
  ];
@@ -3,6 +3,7 @@ import {
3
3
  createIconSizeProp,
4
4
  createColorProp,
5
5
  createFieldNameProp,
6
+ createStaticNumberProp,
6
7
  Triggers,
7
8
  } from "@draftbit/types";
8
9
 
@@ -22,6 +23,15 @@ export const SEED_DATA = [
22
23
  }),
23
24
  iconSize: createIconSizeProp({ defaultValue: 24 }),
24
25
  iconColor: createColorProp({ defaultValue: "strong" }),
26
+ min: createStaticNumberProp({
27
+ label: "Minimum",
28
+ description: "Minimum Number",
29
+ defaultValue: 0,
30
+ }),
31
+ max: createStaticNumberProp({
32
+ label: "Maximum",
33
+ description: "Maximum Number",
34
+ }),
25
35
  },
26
36
  },
27
37
  ];
@@ -1,103 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var React = _interopRequireWildcard(require("react"));
9
-
10
- var _reactNativeTabView = require("react-native-tab-view");
11
-
12
- var _TabViewItem = _interopRequireDefault(require("./TabViewItem"));
13
-
14
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- 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); }
17
-
18
- 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; }
19
-
20
- function _extends() { _extends = Object.assign || 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); }
21
-
22
- const TabViewComponent = _ref => {
23
- let {
24
- Icon,
25
- tabBarPosition,
26
- keyboardDismissMode,
27
- swipeEnabled,
28
- scrollEnabled,
29
- activeColor,
30
- inactiveColor,
31
- pressColor,
32
- indicatorColor,
33
- style,
34
- children
35
- } = _ref;
36
- const [index, setIndex] = React.useState(0);
37
- const [routes, setRoutes] = React.useState([]);
38
- const [tabScenes, setTabScenes] = React.useState({});
39
- React.useEffect(() => {
40
- const newRoutes = [];
41
- const scenes = {};
42
- React.Children.toArray(children).filter(child => child.type === _TabViewItem.default).forEach(child => {
43
- var _child$props;
44
-
45
- if (child !== null && child !== void 0 && (_child$props = child.props) !== null && _child$props !== void 0 && _child$props.id) {
46
- var _child$props2, _child$props3;
47
-
48
- newRoutes.push({
49
- key: child === null || child === void 0 ? void 0 : (_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.id,
50
- ...(child === null || child === void 0 ? void 0 : child.props)
51
- });
52
-
53
- scenes[child === null || child === void 0 ? void 0 : (_child$props3 = child.props) === null || _child$props3 === void 0 ? void 0 : _child$props3.id] = () => child;
54
- }
55
- });
56
- setRoutes(newRoutes);
57
- setTabScenes(scenes);
58
- }, [children]);
59
-
60
- const indexChangeHandler = i => setIndex(i);
61
-
62
- const renderTabBar = props => {
63
- console.log(props);
64
- return /*#__PURE__*/React.createElement(_reactNativeTabView.TabBar, _extends({}, props, {
65
- activeColor: activeColor,
66
- inactiveColor: inactiveColor,
67
- pressColor: pressColor,
68
- scrollEnabled: scrollEnabled,
69
- indicatorStyle: {
70
- backgroundColor: indicatorColor
71
- },
72
- renderIcon: _ref2 => {
73
- let {
74
- route,
75
- color
76
- } = _ref2;
77
- return route !== null && route !== void 0 && route.icon ? /*#__PURE__*/React.createElement(Icon, {
78
- name: route.icon,
79
- color: color,
80
- size: 36
81
- }) : null;
82
- },
83
- style: style
84
- }));
85
- };
86
-
87
- return /*#__PURE__*/React.createElement(_reactNativeTabView.TabView, {
88
- navigationState: {
89
- index,
90
- routes
91
- },
92
- renderScene: (0, _reactNativeTabView.SceneMap)(tabScenes),
93
- renderTabBar: renderTabBar,
94
- onIndexChange: indexChangeHandler,
95
- tabBarPosition: tabBarPosition,
96
- keyboardDismissMode: keyboardDismissMode,
97
- swipeEnabled: swipeEnabled
98
- });
99
- };
100
-
101
- var _default = TabViewComponent;
102
- exports.default = _default;
103
- //# sourceMappingURL=TabView.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["TabView.tsx"],"names":["TabViewComponent","Icon","tabBarPosition","keyboardDismissMode","swipeEnabled","scrollEnabled","activeColor","inactiveColor","pressColor","indicatorColor","style","children","index","setIndex","React","useState","routes","setRoutes","tabScenes","setTabScenes","useEffect","newRoutes","scenes","Children","toArray","filter","child","type","TabViewItem","forEach","props","id","push","key","indexChangeHandler","i","renderTabBar","console","log","backgroundColor","route","color","icon"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { StyleProp, TextStyle, ViewStyle } from \"react-native\";\nimport { TabView, TabBar, SceneMap } from \"react-native-tab-view\";\n\n// import { withTheme } from \"../../theming\";\nimport TabViewItem from \"./TabViewItem\";\nimport type { IconSlot } from \"../../interfaces/Icon\";\n\ntype TabBarPosition = \"top\" | \"bottom\";\ntype KeyboardDismissMode = \"none\" | \"auto\" | \"on-drag\";\n\ntype TabViewProps = {\n tabBarPosition?: TabBarPosition;\n keyboardDismissMode?: KeyboardDismissMode;\n swipeEnabled?: boolean;\n scrollEnabled?: boolean;\n activeColor?: string;\n inactiveColor?: string;\n pressColor?: string;\n indicatorColor?: string;\n style?: StyleProp<TextStyle | ViewStyle>;\n children: React.ReactNode;\n} & IconSlot;\n\nconst TabViewComponent = ({\n Icon,\n tabBarPosition,\n keyboardDismissMode,\n swipeEnabled,\n scrollEnabled,\n activeColor,\n inactiveColor,\n pressColor,\n indicatorColor,\n style,\n children,\n}: TabViewProps) => {\n const [index, setIndex] = React.useState(0);\n const [routes, setRoutes] = React.useState([]);\n const [tabScenes, setTabScenes] = React.useState({});\n\n React.useEffect(() => {\n const newRoutes: any = [];\n const scenes: any = {};\n\n React.Children.toArray(children)\n .filter((child: any) => child.type === TabViewItem)\n .forEach((child: any) => {\n if (child?.props?.id) {\n newRoutes.push({\n key: child?.props?.id,\n ...child?.props,\n });\n scenes[child?.props?.id] = () => child;\n }\n });\n\n setRoutes(newRoutes);\n setTabScenes(scenes);\n }, [children]);\n\n const indexChangeHandler = (i: any) => setIndex(i);\n\n const renderTabBar = (props: any) => {\n console.log(props);\n return (\n <TabBar\n {...props}\n activeColor={activeColor}\n inactiveColor={inactiveColor}\n pressColor={pressColor}\n scrollEnabled={scrollEnabled}\n indicatorStyle={{ backgroundColor: indicatorColor }}\n renderIcon={({ route, color }) =>\n route?.icon ? (\n <Icon name={route.icon} color={color} size={36} />\n ) : null\n }\n style={style}\n />\n );\n };\n\n return (\n <TabView\n navigationState={{ index, routes }}\n renderScene={SceneMap(tabScenes)}\n renderTabBar={renderTabBar}\n onIndexChange={indexChangeHandler}\n tabBarPosition={tabBarPosition}\n keyboardDismissMode={keyboardDismissMode}\n swipeEnabled={swipeEnabled}\n />\n );\n};\n\nexport default TabViewComponent;\n"]}
@@ -1,27 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- const TabViewItem = _ref => {
9
- let {
10
- title,
11
- id,
12
- icon,
13
- children,
14
- accessibilityLabel
15
- } = _ref;
16
- console.log({
17
- title,
18
- id,
19
- icon,
20
- accessibilityLabel
21
- });
22
- return children;
23
- };
24
-
25
- var _default = TabViewItem;
26
- exports.default = _default;
27
- //# sourceMappingURL=TabViewItem.js.map