@draftbit/core 43.3.3 → 43.3.4-1b7a99.0
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/Stepper.js +28 -19
- package/lib/commonjs/components/Stepper.js.map +1 -1
- package/lib/commonjs/components/Swiper/Swiper.js.map +1 -1
- package/lib/commonjs/mappings/ActionSheetItem.js.map +1 -1
- package/lib/commonjs/mappings/DeprecatedButton.js.map +1 -1
- package/lib/commonjs/mappings/Stepper.js +9 -0
- package/lib/commonjs/mappings/Stepper.js.map +1 -1
- package/lib/module/components/Picker/PickerComponent.android.js +17 -3
- package/lib/module/components/Picker/PickerComponent.android.js.map +1 -1
- package/lib/module/components/Portal/PortalHost.js.map +1 -1
- package/lib/module/components/Stepper.js +27 -19
- package/lib/module/components/Stepper.js.map +1 -1
- package/lib/module/mappings/BlurView.js.map +1 -1
- package/lib/module/mappings/Stepper.js +10 -1
- package/lib/module/mappings/Stepper.js.map +1 -1
- package/lib/typescript/src/components/Stepper.d.ts +2 -0
- package/lib/typescript/src/mappings/Stepper.d.ts +22 -0
- package/package.json +2 -2
- package/src/components/Stepper.js +23 -21
- package/src/components/Stepper.tsx +27 -19
- package/src/mappings/Stepper.js +10 -1
- package/src/mappings/Stepper.ts +10 -0
|
@@ -13,6 +13,8 @@ var _theming = require("../theming");
|
|
|
13
13
|
|
|
14
14
|
var _IconButton = _interopRequireDefault(require("./IconButton"));
|
|
15
15
|
|
|
16
|
+
var _lodash = _interopRequireDefault(require("lodash.isnumber"));
|
|
17
|
+
|
|
16
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
19
|
|
|
18
20
|
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); }
|
|
@@ -23,6 +25,8 @@ const Stepper = _ref => {
|
|
|
23
25
|
let {
|
|
24
26
|
Icon,
|
|
25
27
|
value,
|
|
28
|
+
min,
|
|
29
|
+
max,
|
|
26
30
|
style,
|
|
27
31
|
onChange,
|
|
28
32
|
defaultValue,
|
|
@@ -38,32 +42,37 @@ const Stepper = _ref => {
|
|
|
38
42
|
} = _ref;
|
|
39
43
|
const [stateValue, setStateValue] = React.useState(value || defaultValue || 0);
|
|
40
44
|
React.useEffect(() => {
|
|
41
|
-
if (value
|
|
42
|
-
|
|
45
|
+
if (value || value === 0) {
|
|
46
|
+
onChange && onChange(stateValue);
|
|
43
47
|
}
|
|
44
|
-
}, [value]);
|
|
48
|
+
}, [onChange, stateValue, value]);
|
|
45
49
|
React.useEffect(() => {
|
|
46
|
-
|
|
47
|
-
|
|
50
|
+
let newValue = value || defaultValue || 0;
|
|
51
|
+
|
|
52
|
+
if ((0, _lodash.default)(max) && newValue > max) {
|
|
53
|
+
newValue = max;
|
|
48
54
|
}
|
|
49
|
-
}, [defaultValue]);
|
|
50
55
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
onChange && onChange(value - 1);
|
|
54
|
-
} else {
|
|
55
|
-
setStateValue(stateValue - 1);
|
|
56
|
+
if ((0, _lodash.default)(min) && newValue < min) {
|
|
57
|
+
newValue = min;
|
|
56
58
|
}
|
|
57
|
-
};
|
|
58
59
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
60
|
+
setStateValue(newValue);
|
|
61
|
+
}, [defaultValue, value, min, max]);
|
|
62
|
+
const handleMinus = React.useCallback(() => {
|
|
63
|
+
if ((0, _lodash.default)(min) && value === min) {
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
setStateValue(stateValue - 1);
|
|
68
|
+
}, [min, stateValue, value]);
|
|
69
|
+
const handlePlus = React.useCallback(() => {
|
|
70
|
+
if ((0, _lodash.default)(max) && value === max) {
|
|
71
|
+
return;
|
|
64
72
|
}
|
|
65
|
-
};
|
|
66
73
|
|
|
74
|
+
setStateValue(stateValue + 1);
|
|
75
|
+
}, [max, stateValue, value]);
|
|
67
76
|
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
68
77
|
style: [{
|
|
69
78
|
flexDirection: "row"
|
|
@@ -76,7 +85,7 @@ const Stepper = _ref => {
|
|
|
76
85
|
onPress: handleMinus,
|
|
77
86
|
size: iconSize,
|
|
78
87
|
color: iconColor,
|
|
79
|
-
disabled:
|
|
88
|
+
disabled: stateValue === 0
|
|
80
89
|
}), /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
81
90
|
style: [typography.body1, {
|
|
82
91
|
textAlign: "center",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Stepper.tsx"],"names":["Stepper","Icon","value","style","onChange","defaultValue","theme","colors","typography","roundness","iconSize","iconColor","strong","borderRadius","typeStyle","stateValue","setStateValue","React","useState","useEffect","handleMinus","handlePlus","flexDirection","body1","textAlign","alignSelf","color","medium","marginHorizontal"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAIA;;;;;;;;
|
|
1
|
+
{"version":3,"sources":["Stepper.tsx"],"names":["Stepper","Icon","value","min","max","style","onChange","defaultValue","theme","colors","typography","roundness","iconSize","iconColor","strong","borderRadius","typeStyle","stateValue","setStateValue","React","useState","useEffect","newValue","handleMinus","useCallback","handlePlus","flexDirection","body1","textAlign","alignSelf","color","medium","marginHorizontal"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { View, Text, StyleProp, ViewStyle, TextStyle } from \"react-native\";\nimport { withTheme } from \"../theming\";\nimport type { Theme } from \"../styles/DefaultTheme\";\nimport type { IconSlot } from \"../interfaces/Icon\";\n\nimport IconButton from \"./IconButton\";\nimport isNumber from \"lodash.isnumber\";\n\ntype Props = {\n value?: number;\n min?: number;\n max?: number;\n theme: Theme;\n style?: StyleProp<ViewStyle>;\n onChange?: (value: number) => void;\n defaultValue?: number;\n iconSize?: number;\n iconColor?: string;\n borderRadius?: number;\n typeStyle?: StyleProp<TextStyle>;\n} & IconSlot;\n\nconst Stepper: React.FC<Props> = ({\n Icon,\n value,\n min,\n max,\n style,\n onChange,\n defaultValue,\n theme: { colors, typography, roundness },\n iconSize = 24,\n iconColor = colors.strong,\n borderRadius = roundness,\n typeStyle,\n}) => {\n const [stateValue, setStateValue] = React.useState(\n value || defaultValue || 0\n );\n\n React.useEffect(() => {\n if (value || value === 0) {\n onChange && onChange(stateValue);\n }\n }, [onChange, stateValue, value]);\n\n React.useEffect(() => {\n let newValue = value || defaultValue || 0;\n if (isNumber(max) && newValue > max) {\n newValue = max;\n }\n if (isNumber(min) && newValue < min) {\n newValue = min;\n }\n setStateValue(newValue);\n }, [defaultValue, value, min, max]);\n\n const handleMinus = React.useCallback(() => {\n if (isNumber(min) && value === min) {\n return;\n }\n setStateValue(stateValue - 1);\n }, [min, stateValue, value]);\n\n const handlePlus = React.useCallback(() => {\n if (isNumber(max) && value === max) {\n return;\n }\n setStateValue(stateValue + 1);\n }, [max, stateValue, value]);\n\n return (\n <View\n style={[\n { flexDirection: \"row\" },\n style,\n borderRadius ? { borderRadius } : {},\n ]}\n >\n <IconButton\n Icon={Icon}\n icon=\"MaterialIcons/remove\"\n onPress={handleMinus}\n size={iconSize}\n color={iconColor}\n disabled={stateValue === 0}\n />\n <Text\n style={[\n typography.body1,\n {\n textAlign: \"center\",\n alignSelf: \"center\",\n color: colors.medium,\n marginHorizontal: 8,\n },\n typeStyle,\n ]}\n >\n {value || stateValue}\n </Text>\n <IconButton\n Icon={Icon}\n icon=\"MaterialIcons/add\"\n onPress={handlePlus}\n size={iconSize}\n color={iconColor}\n />\n </View>\n );\n};\n\nexport default withTheme(Stepper);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Swiper.
|
|
1
|
+
{"version":3,"sources":["Swiper.tsx"],"names":["Swiper","vertical","loop","timeout","from","prevTitle","nextTitle","dotsTouchable","children","style"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAcA,MAAMA,MAAM,GAAG;AAAA,MAAC;AACdC,IAAAA,QAAQ,GAAG,KADG;AAEdC,IAAAA,IAAI,GAAG,KAFO;AAGdC,IAAAA,OAAO,GAAG,CAHI;AAIdC,IAAAA,IAAI,GAAG,CAJO;AAKdC,IAAAA,SAAS,GAAG,EALE;AAMdC,IAAAA,SAAS,GAAG,EANE;AAOdC,IAAAA,aAAa,GAAG,IAPF;AAQdC,IAAAA,QARc;AASdC,IAAAA;AATc,GAAD;AAAA,sBAWb,6BAAC,iBAAD;AAAM,IAAA,KAAK,EAAEA;AAAb,kBACE,6BAAC,6BAAD;AACE,IAAA,IAAI,EAAEL,IADR;AAEE,IAAA,IAAI,EAAEF,IAFR;AAGE,IAAA,OAAO,EAAEC,OAHX;AAIE,IAAA,QAAQ,EAAEF,QAJZ;AAKE,IAAA,aAAa,EAAE;AACbI,MAAAA,SADa;AAEbC,MAAAA,SAFa;AAGbC,MAAAA;AAHa;AALjB,KAWGC,QAXH,CADF,CAXa;AAAA,CAAf;;eA4BeR,M","sourcesContent":["import React from \"react\";\nimport { View, StyleProp, ViewStyle } from \"react-native\";\nimport SwiperComponent from \"react-native-web-swiper\";\n\nexport interface SwiperProps {\n vertical?: boolean;\n loop?: boolean;\n from?: number;\n timeout?: number;\n prevTitle?: string;\n nextTitle?: string;\n dotsTouchable?: boolean;\n children: React.ReactNode;\n style?: StyleProp<ViewStyle>;\n}\n\nconst Swiper = ({\n vertical = false,\n loop = false,\n timeout = 0,\n from = 0,\n prevTitle = \"\",\n nextTitle = \"\",\n dotsTouchable = true,\n children,\n style,\n}: SwiperProps) => (\n <View style={style}>\n <SwiperComponent\n from={from}\n loop={loop}\n timeout={timeout}\n vertical={vertical}\n controlsProps={{\n prevTitle,\n nextTitle,\n dotsTouchable,\n }}\n >\n {children}\n </SwiperComponent>\n </View>\n);\n\nexport default Swiper;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ActionSheetItem.
|
|
1
|
+
{"version":3,"sources":["ActionSheetItem.ts"],"names":["SEED_DATA","name","tag","description","category","COMPONENT_TYPES","button","triggers","Triggers","OnPress","layout","textAlign","props","onPress","label","group","GROUPS","basic","defaultValue","color"],"mappings":";;;;;;;AAAA;;AASO,MAAMA,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,mBADiB;AAEvBC,EAAAA,GAAG,EAAE,iBAFkB;AAGvBC,EAAAA,WAAW,EAAE,mBAHU;AAIvBC,EAAAA,QAAQ,EAAEC,uBAAgBC,MAJH;AAKvBC,EAAAA,QAAQ,EAAE,CAACC,gBAASC,OAAV,CALa;AAMvBC,EAAAA,MAAM,EAAE;AACNC,IAAAA,SAAS,EAAE;AADL,GANe;AASvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAE,8BADJ;AAELC,IAAAA,KAAK,EAAE,2BAAe;AACpBC,MAAAA,KAAK,EAAEC,cAAOC,KADM;AAEpBH,MAAAA,KAAK,EAAE,OAFa;AAGpBI,MAAAA,YAAY,EAAE;AAHM,KAAf,CAFF;AAOLC,IAAAA,KAAK,EAAE,4BAAgB;AACrBL,MAAAA,KAAK,EAAE;AADc,KAAhB;AAPF;AATgB,CAAlB","sourcesContent":["import {\n COMPONENT_TYPES,\n createActionProp,\n createColorProp,\n createTextProp,\n GROUPS,\n Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n name: \"Action Sheet Item\",\n tag: \"ActionSheetItem\",\n description: \"Action Sheet item\",\n category: COMPONENT_TYPES.button,\n triggers: [Triggers.OnPress],\n layout: {\n textAlign: \"center\",\n },\n props: {\n onPress: createActionProp(),\n label: createTextProp({\n group: GROUPS.basic,\n label: \"Label\",\n defaultValue: \"Option\",\n }),\n color: createColorProp({\n label: \"Font Color\",\n }),\n },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["DeprecatedButton.
|
|
1
|
+
{"version":3,"sources":["DeprecatedButton.ts"],"names":["SEED_DATA_PROPS","onPress","icon","group","GROUPS","basic","label","description","editable","required","formType","FORM_TYPES","propType","PROP_TYPES","STRING","defaultValue","children","data","string","color","THEME","labelColor","disabled","boolean","BOOLEAN","loading","SEED_DATA","name","tag","category","COMPONENT_TYPES","deprecated","triggers","Triggers","OnPress","props","type","uncategorized","layout"],"mappings":"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","sourcesContent":["import {\n GROUPS,\n FORM_TYPES,\n PROP_TYPES,\n COMPONENT_TYPES,\n createActionProp,\n Triggers,\n} from \"@draftbit/types\";\n\nconst SEED_DATA_PROPS = {\n onPress: createActionProp(),\n icon: {\n group: GROUPS.basic,\n label: \"Icon Name\",\n description: \"Name of the icon\",\n editable: true,\n required: true,\n formType: FORM_TYPES.icon,\n propType: PROP_TYPES.STRING,\n defaultValue: null,\n },\n children: {\n group: GROUPS.data,\n label: \"Label\",\n description: \"Button label\",\n required: true,\n editable: true,\n formType: FORM_TYPES.string,\n propType: PROP_TYPES.STRING,\n defaultValue: \"Get Started\",\n },\n color: {\n group: GROUPS.basic,\n label: \"Color Override\",\n description: \"Override the background color of the button\",\n editable: true,\n required: false,\n formType: FORM_TYPES.color,\n propType: PROP_TYPES.THEME,\n defaultValue: null,\n },\n labelColor: {\n group: GROUPS.basic,\n label: \"Label Color Override\",\n description: \"Override the label color of the button\",\n editable: true,\n required: false,\n formType: FORM_TYPES.color,\n propType: PROP_TYPES.THEME,\n defaultValue: null,\n },\n disabled: {\n group: GROUPS.basic,\n label: \"Disabled\",\n description: \"Whether the button should be disabled\",\n editable: true,\n required: false,\n formType: FORM_TYPES.boolean,\n propType: PROP_TYPES.BOOLEAN,\n defaultValue: null,\n },\n loading: {\n group: GROUPS.data,\n label: \"Loading\",\n description: \"Whether to show a loading indicator\",\n editable: true,\n required: false,\n formType: FORM_TYPES.boolean,\n propType: PROP_TYPES.BOOLEAN,\n defaultValue: null,\n },\n};\n\nexport const SEED_DATA = [\n {\n name: \"Button Outline\",\n tag: \"Button\",\n category: COMPONENT_TYPES.deprecated,\n triggers: [Triggers.OnPress],\n props: {\n ...SEED_DATA_PROPS,\n type: {\n group: GROUPS.uncategorized,\n label: \"Type\",\n description: \"Button type\",\n editable: false,\n required: true,\n formType: FORM_TYPES.string,\n propType: PROP_TYPES.STRING,\n defaultValue: \"outline\",\n },\n },\n layout: {},\n },\n {\n name: \"Button Solid\",\n tag: \"Button\",\n category: COMPONENT_TYPES.deprecated,\n triggers: [Triggers.OnPress],\n props: {\n ...SEED_DATA_PROPS,\n type: {\n group: GROUPS.uncategorized,\n label: \"Type\",\n description: \"Button type\",\n editable: false,\n required: true,\n formType: FORM_TYPES.string,\n propType: PROP_TYPES.STRING,\n defaultValue: \"solid\",\n },\n },\n layout: {},\n },\n];\n"]}
|
|
@@ -25,6 +25,15 @@ const SEED_DATA = [{
|
|
|
25
25
|
}),
|
|
26
26
|
iconColor: (0, _types.createColorProp)({
|
|
27
27
|
defaultValue: "strong"
|
|
28
|
+
}),
|
|
29
|
+
min: (0, _types.createStaticNumberProp)({
|
|
30
|
+
label: "Minimum",
|
|
31
|
+
description: "Minimum Number",
|
|
32
|
+
defaultValue: 0
|
|
33
|
+
}),
|
|
34
|
+
max: (0, _types.createStaticNumberProp)({
|
|
35
|
+
label: "Maximum",
|
|
36
|
+
description: "Maximum Number"
|
|
28
37
|
})
|
|
29
38
|
}
|
|
30
39
|
}];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Stepper.ts"],"names":["SEED_DATA","name","tag","description","category","COMPONENT_TYPES","input","layout","triggers","Triggers","OnChange","props","fieldName","defaultValue","handlerPropName","valuePropName","iconSize","iconColor"],"mappings":";;;;;;;AAAA;;
|
|
1
|
+
{"version":3,"sources":["Stepper.ts"],"names":["SEED_DATA","name","tag","description","category","COMPONENT_TYPES","input","layout","triggers","Triggers","OnChange","props","fieldName","defaultValue","handlerPropName","valuePropName","iconSize","iconColor","min","label","max"],"mappings":";;;;;;;AAAA;;AASO,MAAMA,SAAS,GAAG,CACvB;AACEC,EAAAA,IAAI,EAAE,SADR;AAEEC,EAAAA,GAAG,EAAE,SAFP;AAGEC,EAAAA,WAAW,EAAE,uDAHf;AAIEC,EAAAA,QAAQ,EAAEC,uBAAgBC,KAJ5B;AAKEC,EAAAA,MAAM,EAAE,EALV;AAMEC,EAAAA,QAAQ,EAAE,CAACC,gBAASC,QAAV,CANZ;AAOEC,EAAAA,KAAK,EAAE;AACLC,IAAAA,SAAS,EAAE,gCAAoB;AAC7BC,MAAAA,YAAY,EAAE,cADe;AAE7BC,MAAAA,eAAe,EAAE,UAFY;AAG7BC,MAAAA,aAAa,EAAE;AAHc,KAApB,CADN;AAMLC,IAAAA,QAAQ,EAAE,+BAAmB;AAAEH,MAAAA,YAAY,EAAE;AAAhB,KAAnB,CANL;AAOLI,IAAAA,SAAS,EAAE,4BAAgB;AAAEJ,MAAAA,YAAY,EAAE;AAAhB,KAAhB,CAPN;AAQLK,IAAAA,GAAG,EAAE,mCAAuB;AAC1BC,MAAAA,KAAK,EAAE,SADmB;AAE1BhB,MAAAA,WAAW,EAAE,gBAFa;AAG1BU,MAAAA,YAAY,EAAE;AAHY,KAAvB,CARA;AAaLO,IAAAA,GAAG,EAAE,mCAAuB;AAC1BD,MAAAA,KAAK,EAAE,SADmB;AAE1BhB,MAAAA,WAAW,EAAE;AAFa,KAAvB;AAbA;AAPT,CADuB,CAAlB","sourcesContent":["import {\n COMPONENT_TYPES,\n createIconSizeProp,\n createColorProp,\n createFieldNameProp,\n createStaticNumberProp,\n Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n {\n name: \"Stepper\",\n tag: \"Stepper\",\n description: \"A component used to control the quantity of something\",\n category: COMPONENT_TYPES.input,\n layout: {},\n triggers: [Triggers.OnChange],\n props: {\n fieldName: createFieldNameProp({\n defaultValue: \"stepperValue\",\n handlerPropName: \"onChange\",\n valuePropName: \"value\",\n }),\n iconSize: createIconSizeProp({ defaultValue: 24 }),\n iconColor: createColorProp({ defaultValue: \"strong\" }),\n min: createStaticNumberProp({\n label: \"Minimum\",\n description: \"Minimum Number\",\n defaultValue: 0,\n }),\n max: createStaticNumberProp({\n label: \"Maximum\",\n description: \"Maximum Number\",\n }),\n },\n },\n];\n"]}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
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); }
|
|
2
|
-
|
|
3
1
|
import * as React from "react";
|
|
4
2
|
import { View, StyleSheet } from "react-native";
|
|
5
3
|
import omit from "lodash.omit";
|
|
@@ -91,8 +89,24 @@ const Picker = _ref => {
|
|
|
91
89
|
key: o.value
|
|
92
90
|
}))), /*#__PURE__*/React.createElement(View, {
|
|
93
91
|
pointerEvents: "none"
|
|
94
|
-
}, /*#__PURE__*/React.createElement(TextField,
|
|
92
|
+
}, /*#__PURE__*/React.createElement(TextField, { ...props,
|
|
95
93
|
value: selectedLabel,
|
|
94
|
+
placeholder: placeholder,
|
|
95
|
+
// @ts-ignore
|
|
96
|
+
ref: textField,
|
|
97
|
+
disabled: disabled,
|
|
98
|
+
// @ts-expect-error
|
|
99
|
+
style: stylesWithoutMargin
|
|
100
|
+
}))));
|
|
101
|
+
};
|
|
102
|
+
|
|
103
|
+
const styles = StyleSheet.create({
|
|
104
|
+
container: {
|
|
105
|
+
alignSelf: "stretch"
|
|
106
|
+
}
|
|
107
|
+
});
|
|
108
|
+
export default withTheme(Picker);
|
|
109
|
+
//# sourceMappingURL=PickerComponent.android.js.map
|
|
96
110
|
placeholder: placeholder // @ts-ignore
|
|
97
111
|
,
|
|
98
112
|
ref: textField // cannot determine if ref is of correct type due to component being wrapped in a withTheme()
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["PickerComponent.android.
|
|
1
|
+
{"version":3,"sources":["PickerComponent.android.js"],"names":["React","View","StyleSheet","omit","withTheme","Picker","NativePicker","extractStyles","TextField","Touchable","style","options","placeholder","selectedValue","disabled","onValueChange","onValueChangeOverride","props","viewStyles","borderRadius","borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderColor","backgroundColor","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","textField","useRef","undefined","itemValue","itemIndex","toggleFocus","current","stylesWithoutMargin","flatten","selectedLabel","find","o","value","label","createElement","onPress","styles","container","enabled","opacity","position","top","left","right","bottom","width","map","Item","key","pointerEvents","ref","create","alignSelf"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { View, StyleSheet } from \"react-native\";\nimport omit from \"lodash.omit\";\nimport { withTheme } from \"../../theming\";\nimport { Picker as NativePicker } from \"@react-native-picker/picker\";\nimport { extractStyles } from \"../../utilities\";\nimport TextField from \"../TextField\";\nimport Touchable from \"../Touchable\";\nconst Picker = ({ style, options, placeholder, selectedValue, disabled = false, onValueChange: onValueChangeOverride = () => { }, ...props }) => {\n const { viewStyles: { borderRadius, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderTopWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderRightWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderBottomWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderLeftWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderColor, // eslint-disable-line @typescript-eslint/no-unused-vars\n backgroundColor, // eslint-disable-line @typescript-eslint/no-unused-vars\n padding, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingTop, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingRight, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingBottom, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingLeft, // eslint-disable-line @typescript-eslint/no-unused-vars\n ...viewStyles }, } = extractStyles(style);\n const textField = React.useRef(undefined);\n const onValueChange = (itemValue, itemIndex) => {\n toggleFocus();\n onValueChangeOverride(itemValue, itemIndex);\n };\n const toggleFocus = () => {\n if (!disabled) {\n // @ts-ignore\n textField.current.toggleFocus(); // cannot determine if method exists due to component being wrapped in a withTheme()\n }\n };\n const stylesWithoutMargin = style &&\n omit(StyleSheet.flatten(style), [\n \"margin\",\n \"marginTop\",\n \"marginRight\",\n \"marginBottom\",\n \"marginLeft\",\n ]);\n const selectedLabel = selectedValue &&\n (options.find((o) => o.value === selectedValue)?.label ?? selectedValue);\n return (React.createElement(Touchable, { disabled: disabled, onPress: toggleFocus, style: [styles.container, viewStyles] },\n React.createElement(View, null,\n React.createElement(NativePicker, { enabled: !disabled, selectedValue: selectedValue, onValueChange: onValueChange, style: {\n opacity: 0,\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n width: \"100%\",\n } }, options.map((o) => (React.createElement(NativePicker.Item, { label: o.label, value: o.value, key: o.value })))),\n React.createElement(View, { pointerEvents: \"none\" },\n React.createElement(TextField, { ...props, value: selectedLabel, placeholder: placeholder, \n // @ts-ignore\n ref: textField, disabled: disabled, \n // @ts-expect-error\n style: stylesWithoutMargin })))));\n};\nconst styles = StyleSheet.create({\n container: {\n alignSelf: \"stretch\",\n },\n});\nexport default withTheme(Picker);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["PortalHost.
|
|
1
|
+
{"version":3,"sources":["PortalHost.tsx"],"names":["React","View","StyleSheet","PortalManager","PortalContext","createContext","PortalHost","Component","manager","children","key","nextKey","mount","queue","push","type","update","op","index","findIndex","o","unmount","componentDidMount","length","action","pop","render","styles","container","props","setManager","create","flex"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { View, StyleSheet } from \"react-native\";\nimport PortalManager from \"./PortalManager\";\n\ntype Props = {\n children: React.ReactNode;\n};\n\ntype Operation =\n | { type: \"mount\"; key: number; children: React.ReactNode }\n | { type: \"update\"; key: number; children: React.ReactNode }\n | { type: \"unmount\"; key: number };\n\nexport type PortalMethods = {\n mount: (children: React.ReactNode) => number;\n update: (key: number, children: React.ReactNode) => void;\n unmount: (key: number) => void;\n};\n\nexport const PortalContext = React.createContext<PortalMethods>(null as any);\n\n/**\n * Portal host renders all of its children `Portal` elements.\n * For example, you can wrap a screen in `Portal.Host` to render items above the screen.\n * If you're using the `Provider` component, it already includes `Portal.Host`.\n *\n * ## Usage\n * ```js\n * import * as React from 'react';\n * import { Text } from 'react-native';\n * import { Portal } from 'react-native-paper';\n *\n * export default class MyComponent extends React.Component {\n * render() {\n * return (\n * <Portal.Host>\n * <Text>Content of the app</Text>\n * </Portal.Host>\n * );\n * }\n * }\n * ```\n *\n * Here any `Portal` elements under `<App />` are rendered alongside `<App />` and will appear above `<App />` like a `Modal`.\n */\nexport default class PortalHost extends React.Component<Props> {\n static displayName = \"Portal.Host\";\n\n componentDidMount() {\n const manager = this.manager;\n const queue = this.queue;\n\n while (queue.length && manager) {\n const action = queue.pop();\n if (action) {\n switch (action.type) {\n case \"mount\":\n manager.mount(action.key, action.children);\n break;\n case \"update\":\n manager.update(action.key, action.children);\n break;\n case \"unmount\":\n manager.unmount(action.key);\n break;\n }\n }\n }\n }\n\n private setManager = (manager: PortalManager | undefined | null) => {\n this.manager = manager;\n };\n\n private mount = (children: React.ReactNode) => {\n const key = this.nextKey++;\n\n if (this.manager) {\n this.manager.mount(key, children);\n } else {\n this.queue.push({ type: \"mount\", key, children });\n }\n\n return key;\n };\n\n private update = (key: number, children: React.ReactNode) => {\n if (this.manager) {\n this.manager.update(key, children);\n } else {\n const op = { type: \"mount\", key, children };\n const index = this.queue.findIndex(\n (o) => o.type === \"mount\" || (o.type === \"update\" && o.key === key)\n );\n\n if (index > -1) {\n // @ts-ignore\n this.queue[index] = op;\n } else {\n this.queue.push(op as Operation);\n }\n }\n };\n\n private unmount = (key: number) => {\n if (this.manager) {\n this.manager.unmount(key);\n } else {\n this.queue.push({ type: \"unmount\", key });\n }\n };\n\n private nextKey = 0;\n private queue: Operation[] = [];\n private manager: PortalManager | null | undefined;\n\n render() {\n return (\n <PortalContext.Provider\n value={{\n mount: this.mount,\n update: this.update,\n unmount: this.unmount,\n }}\n >\n {/* Need collapsable=false here to clip the elevations, otherwise they appear above Portal components */}\n <View\n style={styles.container}\n collapsable={false}\n pointerEvents=\"box-none\"\n >\n {this.props.children}\n </View>\n <PortalManager ref={this.setManager} />\n </PortalContext.Provider>\n );\n }\n}\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n },\n});\n"]}
|
|
@@ -2,11 +2,14 @@ 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
|
+
import isNumber from "lodash.isnumber";
|
|
5
6
|
|
|
6
7
|
const Stepper = _ref => {
|
|
7
8
|
let {
|
|
8
9
|
Icon,
|
|
9
10
|
value,
|
|
11
|
+
min,
|
|
12
|
+
max,
|
|
10
13
|
style,
|
|
11
14
|
onChange,
|
|
12
15
|
defaultValue,
|
|
@@ -22,32 +25,37 @@ const Stepper = _ref => {
|
|
|
22
25
|
} = _ref;
|
|
23
26
|
const [stateValue, setStateValue] = React.useState(value || defaultValue || 0);
|
|
24
27
|
React.useEffect(() => {
|
|
25
|
-
if (value
|
|
26
|
-
|
|
28
|
+
if (value || value === 0) {
|
|
29
|
+
onChange && onChange(stateValue);
|
|
27
30
|
}
|
|
28
|
-
}, [value]);
|
|
31
|
+
}, [onChange, stateValue, value]);
|
|
29
32
|
React.useEffect(() => {
|
|
30
|
-
|
|
31
|
-
|
|
33
|
+
let newValue = value || defaultValue || 0;
|
|
34
|
+
|
|
35
|
+
if (isNumber(max) && newValue > max) {
|
|
36
|
+
newValue = max;
|
|
32
37
|
}
|
|
33
|
-
}, [defaultValue]);
|
|
34
38
|
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
onChange && onChange(value - 1);
|
|
38
|
-
} else {
|
|
39
|
-
setStateValue(stateValue - 1);
|
|
39
|
+
if (isNumber(min) && newValue < min) {
|
|
40
|
+
newValue = min;
|
|
40
41
|
}
|
|
41
|
-
};
|
|
42
42
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
43
|
+
setStateValue(newValue);
|
|
44
|
+
}, [defaultValue, value, min, max]);
|
|
45
|
+
const handleMinus = React.useCallback(() => {
|
|
46
|
+
if (isNumber(min) && value === min) {
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
setStateValue(stateValue - 1);
|
|
51
|
+
}, [min, stateValue, value]);
|
|
52
|
+
const handlePlus = React.useCallback(() => {
|
|
53
|
+
if (isNumber(max) && value === max) {
|
|
54
|
+
return;
|
|
48
55
|
}
|
|
49
|
-
};
|
|
50
56
|
|
|
57
|
+
setStateValue(stateValue + 1);
|
|
58
|
+
}, [max, stateValue, value]);
|
|
51
59
|
return /*#__PURE__*/React.createElement(View, {
|
|
52
60
|
style: [{
|
|
53
61
|
flexDirection: "row"
|
|
@@ -60,7 +68,7 @@ const Stepper = _ref => {
|
|
|
60
68
|
onPress: handleMinus,
|
|
61
69
|
size: iconSize,
|
|
62
70
|
color: iconColor,
|
|
63
|
-
disabled:
|
|
71
|
+
disabled: stateValue === 0
|
|
64
72
|
}), /*#__PURE__*/React.createElement(Text, {
|
|
65
73
|
style: [typography.body1, {
|
|
66
74
|
textAlign: "center",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Stepper.tsx"],"names":["React","View","Text","withTheme","IconButton","Stepper","Icon","value","style","onChange","defaultValue","theme","colors","typography","roundness","iconSize","iconColor","strong","borderRadius","typeStyle","stateValue","setStateValue","useState","useEffect","handleMinus","handlePlus","flexDirection","body1","textAlign","alignSelf","color","medium","marginHorizontal"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,IAAT,EAAeC,IAAf,QAA4D,cAA5D;AACA,SAASC,SAAT,QAA0B,YAA1B;AAIA,OAAOC,UAAP,MAAuB,cAAvB;;
|
|
1
|
+
{"version":3,"sources":["Stepper.tsx"],"names":["React","View","Text","withTheme","IconButton","isNumber","Stepper","Icon","value","min","max","style","onChange","defaultValue","theme","colors","typography","roundness","iconSize","iconColor","strong","borderRadius","typeStyle","stateValue","setStateValue","useState","useEffect","newValue","handleMinus","useCallback","handlePlus","flexDirection","body1","textAlign","alignSelf","color","medium","marginHorizontal"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { View, Text, StyleProp, ViewStyle, TextStyle } from \"react-native\";\nimport { withTheme } from \"../theming\";\nimport type { Theme } from \"../styles/DefaultTheme\";\nimport type { IconSlot } from \"../interfaces/Icon\";\n\nimport IconButton from \"./IconButton\";\nimport isNumber from \"lodash.isnumber\";\n\ntype Props = {\n value?: number;\n min?: number;\n max?: number;\n theme: Theme;\n style?: StyleProp<ViewStyle>;\n onChange?: (value: number) => void;\n defaultValue?: number;\n iconSize?: number;\n iconColor?: string;\n borderRadius?: number;\n typeStyle?: StyleProp<TextStyle>;\n} & IconSlot;\n\nconst Stepper: React.FC<Props> = ({\n Icon,\n value,\n min,\n max,\n style,\n onChange,\n defaultValue,\n theme: { colors, typography, roundness },\n iconSize = 24,\n iconColor = colors.strong,\n borderRadius = roundness,\n typeStyle,\n}) => {\n const [stateValue, setStateValue] = React.useState(\n value || defaultValue || 0\n );\n\n React.useEffect(() => {\n if (value || value === 0) {\n onChange && onChange(stateValue);\n }\n }, [onChange, stateValue, value]);\n\n React.useEffect(() => {\n let newValue = value || defaultValue || 0;\n if (isNumber(max) && newValue > max) {\n newValue = max;\n }\n if (isNumber(min) && newValue < min) {\n newValue = min;\n }\n setStateValue(newValue);\n }, [defaultValue, value, min, max]);\n\n const handleMinus = React.useCallback(() => {\n if (isNumber(min) && value === min) {\n return;\n }\n setStateValue(stateValue - 1);\n }, [min, stateValue, value]);\n\n const handlePlus = React.useCallback(() => {\n if (isNumber(max) && value === max) {\n return;\n }\n setStateValue(stateValue + 1);\n }, [max, stateValue, value]);\n\n return (\n <View\n style={[\n { flexDirection: \"row\" },\n style,\n borderRadius ? { borderRadius } : {},\n ]}\n >\n <IconButton\n Icon={Icon}\n icon=\"MaterialIcons/remove\"\n onPress={handleMinus}\n size={iconSize}\n color={iconColor}\n disabled={stateValue === 0}\n />\n <Text\n style={[\n typography.body1,\n {\n textAlign: \"center\",\n alignSelf: \"center\",\n color: colors.medium,\n marginHorizontal: 8,\n },\n typeStyle,\n ]}\n >\n {value || stateValue}\n </Text>\n <IconButton\n Icon={Icon}\n icon=\"MaterialIcons/add\"\n onPress={handlePlus}\n size={iconSize}\n color={iconColor}\n />\n </View>\n );\n};\n\nexport default withTheme(Stepper);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["BlurView.
|
|
1
|
+
{"version":3,"sources":["BlurView.js"],"names":["COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","GROUPS","SEED_DATA","name","tag","description","doc_link","code_link","category","layout","flexGrow","flexShrink","flexBasis","props","tint","label","editable","required","defaultValue","formType","flatArray","propType","STRING","options","group","basic","intensity","number","NUMBER","min","max","step","precision"],"mappings":"AAAA,SAASA,eAAT,EAA0BC,UAA1B,EAAsCC,UAAtC,EAAkDC,MAAlD,QAAiE,iBAAjE;AACA,OAAO,MAAMC,SAAS,GAAG;AACrBC,EAAAA,IAAI,EAAE,WADe;AAErBC,EAAAA,GAAG,EAAE,UAFgB;AAGrBC,EAAAA,WAAW,EAAE,gBAHQ;AAIrBC,EAAAA,QAAQ,EAAE,qDAJW;AAKrBC,EAAAA,SAAS,EAAE,kFALU;AAMrBC,EAAAA,QAAQ,EAAEV,eAAe,CAACW,MANL;AAOrBA,EAAAA,MAAM,EAAE;AACJC,IAAAA,QAAQ,EAAE,CADN;AAEJC,IAAAA,UAAU,EAAE,CAFR;AAGJC,IAAAA,SAAS,EAAE;AAHP,GAPa;AAYrBC,EAAAA,KAAK,EAAE;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,KAAK,EAAE,MADL;AAEFV,MAAAA,WAAW,EAAE,2BAFX;AAGFW,MAAAA,QAAQ,EAAE,IAHR;AAIFC,MAAAA,QAAQ,EAAE,IAJR;AAKFC,MAAAA,YAAY,EAAE,SALZ;AAMFC,MAAAA,QAAQ,EAAEpB,UAAU,CAACqB,SANnB;AAOFC,MAAAA,QAAQ,EAAErB,UAAU,CAACsB,MAPnB;AAQFC,MAAAA,OAAO,EAAE,CAAC,SAAD,EAAY,OAAZ,EAAqB,MAArB,CARP;AASFC,MAAAA,KAAK,EAAEvB,MAAM,CAACwB;AATZ,KADH;AAYHC,IAAAA,SAAS,EAAE;AACPX,MAAAA,KAAK,EAAE,WADA;AAEPV,MAAAA,WAAW,EAAE,uEAFN;AAGPW,MAAAA,QAAQ,EAAE,IAHH;AAIPC,MAAAA,QAAQ,EAAE,IAJH;AAKPC,MAAAA,YAAY,EAAE,EALP;AAMPC,MAAAA,QAAQ,EAAEpB,UAAU,CAAC4B,MANd;AAOPN,MAAAA,QAAQ,EAAErB,UAAU,CAAC4B,MAPd;AAQPC,MAAAA,GAAG,EAAE,CARE;AASPC,MAAAA,GAAG,EAAE,GATE;AAUPC,MAAAA,IAAI,EAAE,CAVC;AAWPC,MAAAA,SAAS,EAAE,CAXJ;AAYPR,MAAAA,KAAK,EAAEvB,MAAM,CAACwB;AAZP;AAZR;AAZc,CAAlB","sourcesContent":["import { COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, GROUPS, } from \"@draftbit/types\";\nexport const SEED_DATA = {\n name: \"Blur View\",\n tag: \"BlurView\",\n description: \"Expo Blur View\",\n doc_link: \"https://docs.expo.io/versions/latest/sdk/blur-view/\",\n code_link: \"https://github.com/expo/expo/blob/master/packages/expo/src/effects/BlurView.d.ts\",\n category: COMPONENT_TYPES.layout,\n layout: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: 0,\n },\n props: {\n tint: {\n label: \"Tint\",\n description: \"The tint of the blur view\",\n editable: true,\n required: true,\n defaultValue: \"default\",\n formType: FORM_TYPES.flatArray,\n propType: PROP_TYPES.STRING,\n options: [\"default\", \"light\", \"dark\"],\n group: GROUPS.basic,\n },\n intensity: {\n label: \"Intensity\",\n description: \"A number from 1 to 100 that controls the intensity of the blur effect\",\n editable: true,\n required: true,\n defaultValue: 50,\n formType: FORM_TYPES.number,\n propType: PROP_TYPES.NUMBER,\n min: 0,\n max: 100,\n step: 1,\n precision: 0,\n group: GROUPS.basic,\n },\n },\n};\n"]}
|
|
@@ -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
|
name: "Stepper",
|
|
4
4
|
tag: "Stepper",
|
|
@@ -17,6 +17,15 @@ export const SEED_DATA = [{
|
|
|
17
17
|
}),
|
|
18
18
|
iconColor: createColorProp({
|
|
19
19
|
defaultValue: "strong"
|
|
20
|
+
}),
|
|
21
|
+
min: createStaticNumberProp({
|
|
22
|
+
label: "Minimum",
|
|
23
|
+
description: "Minimum Number",
|
|
24
|
+
defaultValue: 0
|
|
25
|
+
}),
|
|
26
|
+
max: createStaticNumberProp({
|
|
27
|
+
label: "Maximum",
|
|
28
|
+
description: "Maximum Number"
|
|
20
29
|
})
|
|
21
30
|
}
|
|
22
31
|
}];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Stepper.ts"],"names":["COMPONENT_TYPES","createIconSizeProp","createColorProp","createFieldNameProp","Triggers","SEED_DATA","name","tag","description","category","input","layout","triggers","OnChange","props","fieldName","defaultValue","handlerPropName","valuePropName","iconSize","iconColor"],"mappings":"AAAA,SACEA,eADF,EAEEC,kBAFF,EAGEC,eAHF,EAIEC,mBAJF,EAKEC,
|
|
1
|
+
{"version":3,"sources":["Stepper.ts"],"names":["COMPONENT_TYPES","createIconSizeProp","createColorProp","createFieldNameProp","createStaticNumberProp","Triggers","SEED_DATA","name","tag","description","category","input","layout","triggers","OnChange","props","fieldName","defaultValue","handlerPropName","valuePropName","iconSize","iconColor","min","label","max"],"mappings":"AAAA,SACEA,eADF,EAEEC,kBAFF,EAGEC,eAHF,EAIEC,mBAJF,EAKEC,sBALF,EAMEC,QANF,QAOO,iBAPP;AASA,OAAO,MAAMC,SAAS,GAAG,CACvB;AACEC,EAAAA,IAAI,EAAE,SADR;AAEEC,EAAAA,GAAG,EAAE,SAFP;AAGEC,EAAAA,WAAW,EAAE,uDAHf;AAIEC,EAAAA,QAAQ,EAAEV,eAAe,CAACW,KAJ5B;AAKEC,EAAAA,MAAM,EAAE,EALV;AAMEC,EAAAA,QAAQ,EAAE,CAACR,QAAQ,CAACS,QAAV,CANZ;AAOEC,EAAAA,KAAK,EAAE;AACLC,IAAAA,SAAS,EAAEb,mBAAmB,CAAC;AAC7Bc,MAAAA,YAAY,EAAE,cADe;AAE7BC,MAAAA,eAAe,EAAE,UAFY;AAG7BC,MAAAA,aAAa,EAAE;AAHc,KAAD,CADzB;AAMLC,IAAAA,QAAQ,EAAEnB,kBAAkB,CAAC;AAAEgB,MAAAA,YAAY,EAAE;AAAhB,KAAD,CANvB;AAOLI,IAAAA,SAAS,EAAEnB,eAAe,CAAC;AAAEe,MAAAA,YAAY,EAAE;AAAhB,KAAD,CAPrB;AAQLK,IAAAA,GAAG,EAAElB,sBAAsB,CAAC;AAC1BmB,MAAAA,KAAK,EAAE,SADmB;AAE1Bd,MAAAA,WAAW,EAAE,gBAFa;AAG1BQ,MAAAA,YAAY,EAAE;AAHY,KAAD,CARtB;AAaLO,IAAAA,GAAG,EAAEpB,sBAAsB,CAAC;AAC1BmB,MAAAA,KAAK,EAAE,SADmB;AAE1Bd,MAAAA,WAAW,EAAE;AAFa,KAAD;AAbtB;AAPT,CADuB,CAAlB","sourcesContent":["import {\n COMPONENT_TYPES,\n createIconSizeProp,\n createColorProp,\n createFieldNameProp,\n createStaticNumberProp,\n Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n {\n name: \"Stepper\",\n tag: \"Stepper\",\n description: \"A component used to control the quantity of something\",\n category: COMPONENT_TYPES.input,\n layout: {},\n triggers: [Triggers.OnChange],\n props: {\n fieldName: createFieldNameProp({\n defaultValue: \"stepperValue\",\n handlerPropName: \"onChange\",\n valuePropName: \"value\",\n }),\n iconSize: createIconSizeProp({ defaultValue: 24 }),\n iconColor: createColorProp({ defaultValue: \"strong\" }),\n min: createStaticNumberProp({\n label: \"Minimum\",\n description: \"Minimum Number\",\n defaultValue: 0,\n }),\n max: createStaticNumberProp({\n label: \"Maximum\",\n description: \"Maximum Number\",\n }),\n },\n },\n];\n"]}
|
|
@@ -4,6 +4,8 @@ import type { Theme } from "../styles/DefaultTheme";
|
|
|
4
4
|
import type { IconSlot } from "../interfaces/Icon";
|
|
5
5
|
declare type Props = {
|
|
6
6
|
value?: number;
|
|
7
|
+
min?: number;
|
|
8
|
+
max?: number;
|
|
7
9
|
theme: Theme;
|
|
8
10
|
style?: StyleProp<ViewStyle>;
|
|
9
11
|
onChange?: (value: number) => void;
|
|
@@ -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.3.
|
|
3
|
+
"version": "43.3.4-1b7a99.0+1b7a995a",
|
|
4
4
|
"description": "Core (non-native) Components",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"module": "lib/module/index.js",
|
|
@@ -79,5 +79,5 @@
|
|
|
79
79
|
]
|
|
80
80
|
]
|
|
81
81
|
},
|
|
82
|
-
"gitHead": "
|
|
82
|
+
"gitHead": "1b7a995a60652d8e6e5f9799de66fd8e381b3869"
|
|
83
83
|
}
|
|
@@ -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
|
-
|
|
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
|
|
9
|
-
|
|
9
|
+
if (value || value === 0) {
|
|
10
|
+
onChange && onChange(stateValue);
|
|
10
11
|
}
|
|
11
|
-
}, [value]);
|
|
12
|
+
}, [onChange, stateValue, value]);
|
|
12
13
|
React.useEffect(() => {
|
|
13
|
-
|
|
14
|
-
|
|
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
|
-
|
|
22
|
-
|
|
18
|
+
if (isNumber(min) && newValue < min) {
|
|
19
|
+
newValue = min;
|
|
23
20
|
}
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
21
|
+
setStateValue(newValue);
|
|
22
|
+
}, [defaultValue, value, min, max]);
|
|
23
|
+
const handleMinus = React.useCallback(() => {
|
|
24
|
+
if (isNumber(min) && value === min) {
|
|
25
|
+
return;
|
|
28
26
|
}
|
|
29
|
-
|
|
30
|
-
|
|
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:
|
|
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
|
|
39
|
-
|
|
43
|
+
if (value || value === 0) {
|
|
44
|
+
onChange && onChange(stateValue);
|
|
40
45
|
}
|
|
41
|
-
}, [value]);
|
|
46
|
+
}, [onChange, stateValue, value]);
|
|
42
47
|
|
|
43
48
|
React.useEffect(() => {
|
|
44
|
-
|
|
45
|
-
|
|
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
|
-
|
|
56
|
+
setStateValue(newValue);
|
|
57
|
+
}, [defaultValue, value, min, max]);
|
|
48
58
|
|
|
49
|
-
const handleMinus = () => {
|
|
50
|
-
if (
|
|
51
|
-
|
|
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 (
|
|
59
|
-
|
|
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={
|
|
87
|
+
disabled={stateValue === 0}
|
|
80
88
|
/>
|
|
81
89
|
<Text
|
|
82
90
|
style={[
|
package/src/mappings/Stepper.js
CHANGED
|
@@ -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
|
];
|
package/src/mappings/Stepper.ts
CHANGED
|
@@ -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
|
];
|