@draftbit/core 46.7.9-9ce779.2 → 46.7.9-cfda7d.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/components/Accordion/AccordionItem.js +23 -4
- package/lib/commonjs/components/AnimatedCircularProgress.js +12 -1
- package/lib/commonjs/components/Banner.js +23 -4
- package/lib/commonjs/components/Checkbox/context.js +1 -1
- package/lib/commonjs/components/CircleImage.js +15 -1
- package/lib/commonjs/components/DatePicker/DatePicker.js +6 -0
- package/lib/commonjs/components/DeprecatedCardWrapper.js +15 -1
- package/lib/commonjs/components/Elevation.js +14 -2
- package/lib/commonjs/components/Image.js +17 -2
- package/lib/commonjs/components/Picker/Picker.js +7 -1
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +36 -11
- package/lib/commonjs/components/Picker/PickerComponent.web.js +20 -3
- package/lib/commonjs/components/Portal/PortalManager.js +8 -34
- package/lib/commonjs/components/ProgressBar.js +37 -7
- package/lib/commonjs/components/RadioButton/context.js +1 -1
- package/lib/commonjs/constants.js +1 -1
- package/lib/commonjs/index.js +0 -13
- package/lib/commonjs/mappings/DatePicker.js +6 -1
- package/lib/commonjs/mappings/Picker.js +5 -0
- package/lib/module/components/AnimatedCircularProgress.js +1 -13
- package/lib/module/components/Container.js +4 -17
- package/lib/module/components/DatePicker/DatePicker.js +7 -1
- package/lib/module/components/Divider.js +1 -18
- package/lib/module/components/Picker/Picker.js +8 -2
- package/lib/module/components/Picker/PickerComponent.web.js +3 -21
- package/lib/module/components/Pressable.js +2 -15
- package/lib/module/components/Slider.js +4 -21
- package/lib/module/components/StarRating.js +4 -24
- package/lib/module/components/StepIndicator.js +18 -58
- package/lib/module/components/Switch.js +10 -21
- package/lib/module/constants.js +0 -1
- package/lib/module/hooks.js +2 -1
- package/lib/module/index.js +0 -1
- package/lib/module/mappings/DatePicker.js +7 -2
- package/lib/module/mappings/Picker.js +6 -1
- package/lib/module/styles/overlay.js +3 -1
- package/lib/typescript/src/components/DatePicker/DatePicker.d.ts +1 -0
- package/lib/typescript/src/components/DatePicker/DatePicker.d.ts.map +1 -1
- package/lib/typescript/src/components/Picker/Picker.d.ts +1 -0
- package/lib/typescript/src/components/Picker/Picker.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +0 -1
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/mappings/DatePicker.d.ts +10 -0
- package/lib/typescript/src/mappings/DatePicker.d.ts.map +1 -1
- package/lib/typescript/src/mappings/Picker.d.ts +10 -0
- package/lib/typescript/src/mappings/Picker.d.ts.map +1 -1
- package/package.json +3 -4
- package/src/components/DatePicker/DatePicker.js +7 -2
- package/src/components/DatePicker/DatePicker.tsx +9 -0
- package/src/components/Picker/Picker.js +7 -2
- package/src/components/Picker/Picker.tsx +9 -0
- package/src/index.js +0 -1
- package/src/index.tsx +0 -2
- package/src/mappings/DatePicker.js +6 -1
- package/src/mappings/DatePicker.ts +6 -0
- package/src/mappings/Picker.js +6 -1
- package/src/mappings/Picker.ts +6 -0
- package/lib/commonjs/components/DeckSwiper/DeckSwiper.js +0 -73
- package/lib/commonjs/components/DeckSwiper/DeckSwiperCard.js +0 -35
- package/lib/commonjs/components/DeckSwiper/index.js +0 -20
- package/lib/commonjs/mappings/DeckSwiper.js +0 -52
- package/lib/commonjs/mappings/DeckSwiperCard.js +0 -16
- package/lib/module/components/DeckSwiper/DeckSwiper.js +0 -65
- package/lib/module/components/DeckSwiper/DeckSwiperCard.js +0 -27
- package/lib/module/components/DeckSwiper/index.js +0 -2
- package/lib/module/mappings/DeckSwiper.js +0 -45
- package/lib/module/mappings/DeckSwiperCard.js +0 -9
- package/lib/typescript/src/components/DeckSwiper/DeckSwiper.d.ts +0 -15
- package/lib/typescript/src/components/DeckSwiper/DeckSwiper.d.ts.map +0 -1
- package/lib/typescript/src/components/DeckSwiper/DeckSwiperCard.d.ts +0 -13
- package/lib/typescript/src/components/DeckSwiper/DeckSwiperCard.d.ts.map +0 -1
- package/lib/typescript/src/components/DeckSwiper/index.d.ts +0 -3
- package/lib/typescript/src/components/DeckSwiper/index.d.ts.map +0 -1
- package/lib/typescript/src/mappings/DeckSwiper.d.ts +0 -83
- package/lib/typescript/src/mappings/DeckSwiper.d.ts.map +0 -1
- package/lib/typescript/src/mappings/DeckSwiperCard.d.ts +0 -9
- package/lib/typescript/src/mappings/DeckSwiperCard.d.ts.map +0 -1
- package/src/components/DeckSwiper/DeckSwiper.js +0 -34
- package/src/components/DeckSwiper/DeckSwiper.tsx +0 -93
- package/src/components/DeckSwiper/DeckSwiperCard.js +0 -22
- package/src/components/DeckSwiper/DeckSwiperCard.tsx +0 -42
- package/src/components/DeckSwiper/index.js +0 -2
- package/src/components/DeckSwiper/index.tsx +0 -2
- package/src/mappings/DeckSwiper.js +0 -45
- package/src/mappings/DeckSwiper.ts +0 -54
- package/src/mappings/DeckSwiperCard.js +0 -9
- package/src/mappings/DeckSwiperCard.ts +0 -13
|
@@ -169,7 +169,12 @@ const SEED_DATA = [{
|
|
|
169
169
|
editable: true,
|
|
170
170
|
required: true,
|
|
171
171
|
group: _types.GROUPS.basic
|
|
172
|
-
}
|
|
172
|
+
},
|
|
173
|
+
autoDismissKeyboard: (0, _types.createStaticBoolProp)({
|
|
174
|
+
label: "Auto dismiss keyboard",
|
|
175
|
+
description: "Automatically dismiss keyboard when DatePicker is opened",
|
|
176
|
+
defaultValue: true
|
|
177
|
+
})
|
|
173
178
|
}
|
|
174
179
|
}];
|
|
175
180
|
exports.SEED_DATA = SEED_DATA;
|
|
@@ -142,6 +142,11 @@ const SEED_DATA = [{
|
|
|
142
142
|
}),
|
|
143
143
|
iconColor: (0, _types.createColorProp)({
|
|
144
144
|
label: "Icon Color"
|
|
145
|
+
}),
|
|
146
|
+
autoDismissKeyboard: (0, _types.createStaticBoolProp)({
|
|
147
|
+
label: "Auto dismiss keyboard",
|
|
148
|
+
description: "Automatically dismiss keyboard when Picker is opened",
|
|
149
|
+
defaultValue: true
|
|
145
150
|
})
|
|
146
151
|
},
|
|
147
152
|
layout: {}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
1
2
|
import * as React from "react";
|
|
2
3
|
import { Animated, Easing } from "react-native";
|
|
3
4
|
import CircularProgress from "./CircularProgress";
|
|
@@ -45,19 +46,6 @@ const AnimatedCircularProgress = _ref => {
|
|
|
45
46
|
React.useEffect(() => {
|
|
46
47
|
animate();
|
|
47
48
|
}, [fill, animate]);
|
|
48
|
-
return /*#__PURE__*/React.createElement(AnimatedProgress, {
|
|
49
|
-
...other,
|
|
50
|
-
style: other.style,
|
|
51
|
-
childrenContainerStyle: other.childrenContainerStyle,
|
|
52
|
-
fill: fillAnimation,
|
|
53
|
-
tintColor: animateColor()
|
|
54
|
-
});
|
|
55
|
-
};
|
|
56
|
-
export default AnimatedCircularProgress;imation;
|
|
57
|
-
};
|
|
58
|
-
React.useEffect(() => {
|
|
59
|
-
animate();
|
|
60
|
-
}, [fill, animate]);
|
|
61
49
|
return /*#__PURE__*/React.createElement(AnimatedProgress, _extends({}, other, {
|
|
62
50
|
style: other.style,
|
|
63
51
|
childrenContainerStyle: other.childrenContainerStyle,
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
1
2
|
import * as React from "react";
|
|
2
3
|
import { View, ImageBackground, StyleSheet } from "react-native";
|
|
3
4
|
import { withTheme } from "../theming";
|
|
@@ -63,10 +64,9 @@ const Container = _ref => {
|
|
|
63
64
|
};
|
|
64
65
|
const Wrap = elevation ? Elevation : View;
|
|
65
66
|
if (elevation) containerStyle.elevation = elevation;
|
|
66
|
-
return /*#__PURE__*/React.createElement(Wrap, {
|
|
67
|
-
style: [containerStyle, style]
|
|
68
|
-
|
|
69
|
-
}, backgroundImage ? /*#__PURE__*/React.createElement(ImageBackground, {
|
|
67
|
+
return /*#__PURE__*/React.createElement(Wrap, _extends({
|
|
68
|
+
style: [containerStyle, style]
|
|
69
|
+
}, rest), backgroundImage ? /*#__PURE__*/React.createElement(ImageBackground, {
|
|
70
70
|
source: typeof backgroundImage === "string" ? {
|
|
71
71
|
uri: backgroundImage
|
|
72
72
|
} : backgroundImage,
|
|
@@ -80,17 +80,4 @@ const Container = _ref => {
|
|
|
80
80
|
style: innerStyle
|
|
81
81
|
}, children));
|
|
82
82
|
};
|
|
83
|
-
export default withTheme(Container);ring" ? {
|
|
84
|
-
uri: backgroundImage
|
|
85
|
-
} : backgroundImage,
|
|
86
|
-
resizeMode: backgroundImageResizeMode,
|
|
87
|
-
style: {
|
|
88
|
-
flex: 1
|
|
89
|
-
}
|
|
90
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
91
|
-
style: innerStyle
|
|
92
|
-
}, children)) : /*#__PURE__*/React.createElement(View, {
|
|
93
|
-
style: innerStyle
|
|
94
|
-
}, children));
|
|
95
|
-
};
|
|
96
83
|
export default withTheme(Container);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
2
|
import * as React from "react";
|
|
3
|
-
import { View, Animated, Text, StyleSheet, I18nManager, TextInput as NativeTextInput } from "react-native";
|
|
3
|
+
import { View, Animated, Text, StyleSheet, I18nManager, TextInput as NativeTextInput, Keyboard } from "react-native";
|
|
4
4
|
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
|
5
5
|
import dateFormat from "dateformat";
|
|
6
6
|
import { withTheme } from "../../theming";
|
|
@@ -39,6 +39,7 @@ const DatePicker = _ref => {
|
|
|
39
39
|
placeholder,
|
|
40
40
|
borderColor: inputBorderColor,
|
|
41
41
|
borderColorActive: inputBorderColorActive,
|
|
42
|
+
autoDismissKeyboard = true,
|
|
42
43
|
...props
|
|
43
44
|
} = _ref;
|
|
44
45
|
const [value, setValue] = React.useState(date || defaultValue);
|
|
@@ -134,6 +135,11 @@ const DatePicker = _ref => {
|
|
|
134
135
|
clearTimeout(_showPlaceholder());
|
|
135
136
|
};
|
|
136
137
|
}, [focused, label, placeholder]);
|
|
138
|
+
React.useEffect(() => {
|
|
139
|
+
if (pickerVisible && autoDismissKeyboard) {
|
|
140
|
+
Keyboard.dismiss();
|
|
141
|
+
}
|
|
142
|
+
}, [pickerVisible, autoDismissKeyboard]);
|
|
137
143
|
const _handleFocus = () => {
|
|
138
144
|
if (disabled) {
|
|
139
145
|
return;
|
|
@@ -1,24 +1,7 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
1
2
|
import * as React from "react";
|
|
2
3
|
import { StyleSheet, View } from "react-native";
|
|
3
4
|
import { withTheme } from "../theming";
|
|
4
|
-
const Divider = _ref => {
|
|
5
|
-
let {
|
|
6
|
-
style,
|
|
7
|
-
color,
|
|
8
|
-
theme: {
|
|
9
|
-
colors
|
|
10
|
-
},
|
|
11
|
-
...rest
|
|
12
|
-
} = _ref;
|
|
13
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
14
|
-
style: [{
|
|
15
|
-
backgroundColor: color || colors.divider,
|
|
16
|
-
height: StyleSheet.hairlineWidth
|
|
17
|
-
}, style],
|
|
18
|
-
...rest
|
|
19
|
-
});
|
|
20
|
-
};
|
|
21
|
-
export default withTheme(Divider);ing";
|
|
22
5
|
const Divider = _ref => {
|
|
23
6
|
let {
|
|
24
7
|
style,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { View, StyleSheet, Text, Platform, Dimensions } from "react-native";
|
|
2
|
+
import { View, StyleSheet, Text, Platform, Dimensions, Keyboard } from "react-native";
|
|
3
3
|
import { omit, pickBy, identity, isObject } from "lodash";
|
|
4
4
|
import { SafeAreaView } from "react-native-safe-area-context";
|
|
5
5
|
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
@@ -56,7 +56,8 @@ const Picker = _ref => {
|
|
|
56
56
|
leftIconName,
|
|
57
57
|
placeholderTextColor = unstyledColor,
|
|
58
58
|
rightIconName,
|
|
59
|
-
type = "solid"
|
|
59
|
+
type = "solid",
|
|
60
|
+
autoDismissKeyboard = true
|
|
60
61
|
} = _ref;
|
|
61
62
|
const androidPickerRef = React.useRef(undefined);
|
|
62
63
|
const [internalValue, setInternalValue] = React.useState(value || defaultValue);
|
|
@@ -80,6 +81,11 @@ const Picker = _ref => {
|
|
|
80
81
|
androidPickerRef === null || androidPickerRef === void 0 ? void 0 : (_androidPickerRef$cur = androidPickerRef.current) === null || _androidPickerRef$cur === void 0 ? void 0 : _androidPickerRef$cur.focus();
|
|
81
82
|
}
|
|
82
83
|
}, [pickerVisible, androidPickerRef]);
|
|
84
|
+
React.useEffect(() => {
|
|
85
|
+
if (pickerVisible && autoDismissKeyboard) {
|
|
86
|
+
Keyboard.dismiss();
|
|
87
|
+
}
|
|
88
|
+
}, [pickerVisible, autoDismissKeyboard]);
|
|
83
89
|
const normalizedOptions = normalizeOptions(options);
|
|
84
90
|
const pickerOptions = placeholder ? [{
|
|
85
91
|
value: placeholder,
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
1
2
|
import * as React from "react";
|
|
2
3
|
import { View, StyleSheet } from "react-native";
|
|
3
4
|
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
@@ -7,6 +8,7 @@ import { extractStyles } from "../../utilities";
|
|
|
7
8
|
import TextField from "../TextField";
|
|
8
9
|
import Touchable from "../Touchable";
|
|
9
10
|
const Picker = _ref => {
|
|
11
|
+
var _options$find$label, _options$find;
|
|
10
12
|
let {
|
|
11
13
|
style,
|
|
12
14
|
options,
|
|
@@ -16,7 +18,6 @@ const Picker = _ref => {
|
|
|
16
18
|
onValueChange: onValueChangeOverride = () => {},
|
|
17
19
|
...props
|
|
18
20
|
} = _ref;
|
|
19
|
-
var _a, _b;
|
|
20
21
|
const {
|
|
21
22
|
viewStyles: {
|
|
22
23
|
borderRadius,
|
|
@@ -61,7 +62,7 @@ const Picker = _ref => {
|
|
|
61
62
|
};
|
|
62
63
|
|
|
63
64
|
const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
|
|
64
|
-
const selectedLabel = selectedValue && ((
|
|
65
|
+
const selectedLabel = selectedValue && ((_options$find$label = (_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) !== null && _options$find$label !== void 0 ? _options$find$label : selectedValue);
|
|
65
66
|
return /*#__PURE__*/React.createElement(Touchable, {
|
|
66
67
|
disabled: disabled,
|
|
67
68
|
onPress: toggleFocus,
|
|
@@ -84,25 +85,6 @@ const Picker = _ref => {
|
|
|
84
85
|
label: o.label,
|
|
85
86
|
value: o.value,
|
|
86
87
|
key: o.value
|
|
87
|
-
}))), /*#__PURE__*/React.createElement(View, {
|
|
88
|
-
pointerEvents: "none"
|
|
89
|
-
}, /*#__PURE__*/React.createElement(TextField, {
|
|
90
|
-
...props,
|
|
91
|
-
value: selectedLabel,
|
|
92
|
-
placeholder: placeholder,
|
|
93
|
-
// @ts-ignore
|
|
94
|
-
ref: textField,
|
|
95
|
-
disabled: disabled,
|
|
96
|
-
// @ts-expect-error
|
|
97
|
-
style: stylesWithoutMargin
|
|
98
|
-
}))));
|
|
99
|
-
};
|
|
100
|
-
const styles = StyleSheet.create({
|
|
101
|
-
container: {
|
|
102
|
-
alignSelf: "stretch"
|
|
103
|
-
}
|
|
104
|
-
});
|
|
105
|
-
export default withTheme(Picker);y: o.value
|
|
106
88
|
}))), /*#__PURE__*/React.createElement(View, {
|
|
107
89
|
pointerEvents: "none"
|
|
108
90
|
}, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
1
2
|
import React from "react";
|
|
2
3
|
import { Pressable as NativePressable } from "react-native";
|
|
3
4
|
export default function Pressable(_ref) {
|
|
@@ -12,22 +13,8 @@ export default function Pressable(_ref) {
|
|
|
12
13
|
style,
|
|
13
14
|
...props
|
|
14
15
|
} = _ref;
|
|
15
|
-
return /*#__PURE__*/React.createElement(NativePressable, {
|
|
16
|
+
return /*#__PURE__*/React.createElement(NativePressable, _extends({
|
|
16
17
|
onPress: onPress,
|
|
17
|
-
disabled: disabled,
|
|
18
|
-
delayLongPress: delayLongPress ? delayLongPress : 500,
|
|
19
|
-
hitSlop: hitSlop ? hitSlop : 8,
|
|
20
|
-
style: _ref2 => {
|
|
21
|
-
let {
|
|
22
|
-
pressed
|
|
23
|
-
} = _ref2;
|
|
24
|
-
return [{
|
|
25
|
-
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1
|
|
26
|
-
}, style];
|
|
27
|
-
},
|
|
28
|
-
...props
|
|
29
|
-
}, children);
|
|
30
|
-
} onPress: onPress,
|
|
31
18
|
disabled: disabled,
|
|
32
19
|
delayLongPress: delayLongPress ? delayLongPress : 500,
|
|
33
20
|
hitSlop: hitSlop ? hitSlop : 8,
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
1
2
|
import * as React from "react";
|
|
2
3
|
import { View, StyleSheet } from "react-native";
|
|
3
4
|
import NativeSlider from "@react-native-community/slider";
|
|
@@ -63,10 +64,9 @@ function Slider(_ref) {
|
|
|
63
64
|
setInternalValue(newValue);
|
|
64
65
|
onValueChange(newValue);
|
|
65
66
|
};
|
|
66
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
67
|
-
style: [styles.container, style]
|
|
68
|
-
|
|
69
|
-
}, leftIcon ? /*#__PURE__*/React.createElement(Icon, {
|
|
67
|
+
return /*#__PURE__*/React.createElement(View, _extends({
|
|
68
|
+
style: [styles.container, style]
|
|
69
|
+
}, rest), leftIcon ? /*#__PURE__*/React.createElement(Icon, {
|
|
70
70
|
color: leftIconThemeColor,
|
|
71
71
|
name: leftIcon,
|
|
72
72
|
size: 24
|
|
@@ -98,21 +98,4 @@ const styles = StyleSheet.create({
|
|
|
98
98
|
marginHorizontal: 12
|
|
99
99
|
}
|
|
100
100
|
});
|
|
101
|
-
export default withTheme(Slider);Icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
102
|
-
color: rightIconThemeColor,
|
|
103
|
-
name: rightIcon,
|
|
104
|
-
size: 24
|
|
105
|
-
}) : null);
|
|
106
|
-
}
|
|
107
|
-
const styles = StyleSheet.create({
|
|
108
|
-
container: {
|
|
109
|
-
height: 40,
|
|
110
|
-
flexDirection: "row",
|
|
111
|
-
alignItems: "center"
|
|
112
|
-
},
|
|
113
|
-
slider: {
|
|
114
|
-
flex: 1,
|
|
115
|
-
marginHorizontal: 12
|
|
116
|
-
}
|
|
117
|
-
});
|
|
118
101
|
export default withTheme(Slider);
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
1
2
|
import * as React from "react";
|
|
2
3
|
import { View, StyleSheet, Pressable } from "react-native";
|
|
3
4
|
import { withTheme } from "../theming";
|
|
@@ -31,10 +32,9 @@ const StarRating = _ref => {
|
|
|
31
32
|
!!onPress && onPress(r);
|
|
32
33
|
}, [onPress]);
|
|
33
34
|
const ratingRounded = Math.round(localRating * 2) / 2;
|
|
34
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
35
|
-
style: [styles.container, style]
|
|
36
|
-
|
|
37
|
-
}, [...Array(maxStars)].map((_, i) => /*#__PURE__*/React.createElement(View, {
|
|
35
|
+
return /*#__PURE__*/React.createElement(View, _extends({
|
|
36
|
+
style: [styles.container, style]
|
|
37
|
+
}, rest), [...Array(maxStars)].map((_, i) => /*#__PURE__*/React.createElement(View, {
|
|
38
38
|
key: i,
|
|
39
39
|
style: {
|
|
40
40
|
display: "flex"
|
|
@@ -74,24 +74,4 @@ const styles = StyleSheet.create({
|
|
|
74
74
|
width: "50%"
|
|
75
75
|
}
|
|
76
76
|
});
|
|
77
|
-
export default withTheme(StarRating);ntainer: {
|
|
78
|
-
flexDirection: "row",
|
|
79
|
-
alignItems: "center"
|
|
80
|
-
},
|
|
81
|
-
touchContainer: {
|
|
82
|
-
display: "flex",
|
|
83
|
-
flexDirection: "row",
|
|
84
|
-
position: "absolute",
|
|
85
|
-
top: 0,
|
|
86
|
-
right: 0,
|
|
87
|
-
left: 0,
|
|
88
|
-
bottom: 0,
|
|
89
|
-
zIndex: 1
|
|
90
|
-
},
|
|
91
|
-
pressable: {
|
|
92
|
-
flex: 1,
|
|
93
|
-
height: "100%",
|
|
94
|
-
width: "50%"
|
|
95
|
-
}
|
|
96
|
-
});
|
|
97
77
|
export default withTheme(StarRating);
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
3
|
+
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
1
4
|
// @ts-nocheck
|
|
2
5
|
import React, { Component } from "react";
|
|
3
6
|
import { View, Text, StyleSheet, Animated, TouchableWithoutFeedback } from "react-native";
|
|
@@ -9,7 +12,7 @@ const STEP_STATUS = {
|
|
|
9
12
|
export default class StepIndicator extends Component {
|
|
10
13
|
constructor(props) {
|
|
11
14
|
super(props);
|
|
12
|
-
this
|
|
15
|
+
_defineProperty(this, "renderProgressBarBackground", () => {
|
|
13
16
|
const {
|
|
14
17
|
stepCount,
|
|
15
18
|
direction
|
|
@@ -52,8 +55,8 @@ export default class StepIndicator extends Component {
|
|
|
52
55
|
},
|
|
53
56
|
style: progressBarBackgroundStyle
|
|
54
57
|
});
|
|
55
|
-
};
|
|
56
|
-
this
|
|
58
|
+
});
|
|
59
|
+
_defineProperty(this, "renderProgressBar", () => {
|
|
57
60
|
const {
|
|
58
61
|
stepCount,
|
|
59
62
|
direction
|
|
@@ -83,8 +86,8 @@ export default class StepIndicator extends Component {
|
|
|
83
86
|
return /*#__PURE__*/React.createElement(Animated.View, {
|
|
84
87
|
style: progressBarStyle
|
|
85
88
|
});
|
|
86
|
-
};
|
|
87
|
-
this
|
|
89
|
+
});
|
|
90
|
+
_defineProperty(this, "renderStepIndicator", () => {
|
|
88
91
|
let steps = [];
|
|
89
92
|
const {
|
|
90
93
|
stepCount,
|
|
@@ -115,8 +118,8 @@ export default class StepIndicator extends Component {
|
|
|
115
118
|
height: this.state.customStyles.currentStepIndicatorSize
|
|
116
119
|
}]
|
|
117
120
|
}, steps);
|
|
118
|
-
};
|
|
119
|
-
this
|
|
121
|
+
});
|
|
122
|
+
_defineProperty(this, "renderStepLabels", () => {
|
|
120
123
|
const {
|
|
121
124
|
labels,
|
|
122
125
|
direction,
|
|
@@ -158,8 +161,8 @@ export default class StepIndicator extends Component {
|
|
|
158
161
|
alignItems: this.state.customStyles.labelAlign
|
|
159
162
|
}]
|
|
160
163
|
}, labelViews);
|
|
161
|
-
};
|
|
162
|
-
this
|
|
164
|
+
});
|
|
165
|
+
_defineProperty(this, "renderStep", position => {
|
|
163
166
|
const {
|
|
164
167
|
renderStepIndicator
|
|
165
168
|
} = this.props;
|
|
@@ -226,8 +229,8 @@ export default class StepIndicator extends Component {
|
|
|
226
229
|
}) : /*#__PURE__*/React.createElement(Text, {
|
|
227
230
|
style: indicatorLabelStyle
|
|
228
231
|
}, "".concat(position + 1)));
|
|
229
|
-
};
|
|
230
|
-
this
|
|
232
|
+
});
|
|
233
|
+
_defineProperty(this, "getStepStatus", stepPosition => {
|
|
231
234
|
const {
|
|
232
235
|
currentPosition
|
|
233
236
|
} = this.props;
|
|
@@ -238,8 +241,8 @@ export default class StepIndicator extends Component {
|
|
|
238
241
|
} else {
|
|
239
242
|
return STEP_STATUS.UNFINISHED;
|
|
240
243
|
}
|
|
241
|
-
};
|
|
242
|
-
this
|
|
244
|
+
});
|
|
245
|
+
_defineProperty(this, "onCurrentPositionChanged", position => {
|
|
243
246
|
let {
|
|
244
247
|
stepCount
|
|
245
248
|
} = this.props;
|
|
@@ -259,7 +262,7 @@ export default class StepIndicator extends Component {
|
|
|
259
262
|
toValue: this.state.customStyles.currentStepIndicatorSize / 2,
|
|
260
263
|
duration: 100
|
|
261
264
|
})])]).start();
|
|
262
|
-
};
|
|
265
|
+
});
|
|
263
266
|
const defaultStyles = {
|
|
264
267
|
stepIndicatorSize: 30,
|
|
265
268
|
currentStepIndicatorSize: 40,
|
|
@@ -325,6 +328,7 @@ export default class StepIndicator extends Component {
|
|
|
325
328
|
// ),
|
|
326
329
|
// }));
|
|
327
330
|
// }
|
|
331
|
+
|
|
328
332
|
if (prevProps.currentPosition !== this.props.currentPosition) {
|
|
329
333
|
this.onCurrentPositionChanged(this.props.currentPosition);
|
|
330
334
|
}
|
|
@@ -365,50 +369,6 @@ const styles = StyleSheet.create({
|
|
|
365
369
|
justifyContent: "center"
|
|
366
370
|
}
|
|
367
371
|
});
|
|
368
|
-
StepIndicator.defaultProps = {
|
|
369
|
-
currentPosition: 0,
|
|
370
|
-
stepCount: 5,
|
|
371
|
-
customStyles: {},
|
|
372
|
-
direction: "horizontal"
|
|
373
|
-
};rrentPositionChanged(this.props.currentPosition);
|
|
374
|
-
}
|
|
375
|
-
}
|
|
376
|
-
}
|
|
377
|
-
const styles = StyleSheet.create({
|
|
378
|
-
container: {
|
|
379
|
-
backgroundColor: "transparent"
|
|
380
|
-
},
|
|
381
|
-
stepIndicatorContainer: {
|
|
382
|
-
flexDirection: "row",
|
|
383
|
-
alignItems: "center",
|
|
384
|
-
justifyContent: "space-around",
|
|
385
|
-
backgroundColor: "transparent"
|
|
386
|
-
},
|
|
387
|
-
stepLabelsContainer: {
|
|
388
|
-
justifyContent: "space-around"
|
|
389
|
-
},
|
|
390
|
-
step: {
|
|
391
|
-
alignItems: "center",
|
|
392
|
-
justifyContent: "center",
|
|
393
|
-
zIndex: 2
|
|
394
|
-
},
|
|
395
|
-
stepContainer: {
|
|
396
|
-
flex: 1,
|
|
397
|
-
flexDirection: "row",
|
|
398
|
-
alignItems: "center",
|
|
399
|
-
justifyContent: "center"
|
|
400
|
-
},
|
|
401
|
-
stepLabel: {
|
|
402
|
-
fontSize: 12,
|
|
403
|
-
textAlign: "center",
|
|
404
|
-
fontWeight: "500"
|
|
405
|
-
},
|
|
406
|
-
stepLabelItem: {
|
|
407
|
-
flex: 1,
|
|
408
|
-
alignItems: "center",
|
|
409
|
-
justifyContent: "center"
|
|
410
|
-
}
|
|
411
|
-
});
|
|
412
372
|
StepIndicator.defaultProps = {
|
|
413
373
|
currentPosition: 0,
|
|
414
374
|
stepCount: 5,
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
1
2
|
import * as React from "react";
|
|
2
3
|
import { Switch as NativeSwitch } from "react-native";
|
|
3
4
|
import { withTheme } from "../theming";
|
|
@@ -28,6 +29,7 @@ function Switch(_ref) {
|
|
|
28
29
|
setChecked(value);
|
|
29
30
|
}
|
|
30
31
|
}, [value, checked]);
|
|
32
|
+
|
|
31
33
|
// This special logic is to handle weird APIs like Airtable that return
|
|
32
34
|
// true or undefined for a boolean
|
|
33
35
|
const previousDefaultValue = usePrevious(defaultValue);
|
|
@@ -36,24 +38,24 @@ function Switch(_ref) {
|
|
|
36
38
|
setChecked(Boolean(defaultValue));
|
|
37
39
|
}
|
|
38
40
|
}, [defaultValue, previousDefaultValue]);
|
|
39
|
-
return /*#__PURE__*/React.createElement(NativeSwitch, {
|
|
41
|
+
return /*#__PURE__*/React.createElement(NativeSwitch, _extends({
|
|
40
42
|
value: checked,
|
|
41
43
|
disabled: disabled,
|
|
42
44
|
trackColor: {
|
|
43
45
|
false: inactiveTrackThemeColor,
|
|
44
46
|
true: activeTrackThemeColor
|
|
45
47
|
},
|
|
46
|
-
thumbColor: value ? activeThumbThemeColor : inactiveThumbThemeColor
|
|
48
|
+
thumbColor: value ? activeThumbThemeColor : inactiveThumbThemeColor
|
|
47
49
|
// @ts-ignore react-native-web only
|
|
50
|
+
,
|
|
48
51
|
activeThumbColor: activeThumbThemeColor,
|
|
49
52
|
ios_backgroundColor: inactiveTrackThemeColor,
|
|
50
53
|
style: style,
|
|
51
54
|
onValueChange: bool => {
|
|
52
55
|
setChecked(bool);
|
|
53
56
|
onValueChange && onValueChange(bool);
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
});
|
|
57
|
+
}
|
|
58
|
+
}, rest));
|
|
57
59
|
}
|
|
58
60
|
function Row(_ref2) {
|
|
59
61
|
let {
|
|
@@ -82,7 +84,7 @@ function Row(_ref2) {
|
|
|
82
84
|
setChecked(defaultValue);
|
|
83
85
|
}
|
|
84
86
|
}, [defaultValue]);
|
|
85
|
-
return /*#__PURE__*/React.createElement(FormRow, {
|
|
87
|
+
return /*#__PURE__*/React.createElement(FormRow, _extends({
|
|
86
88
|
disabled: disabled,
|
|
87
89
|
onPress: () => {
|
|
88
90
|
setChecked(!checked);
|
|
@@ -90,9 +92,8 @@ function Row(_ref2) {
|
|
|
90
92
|
},
|
|
91
93
|
label: label,
|
|
92
94
|
direction: direction,
|
|
93
|
-
style: style
|
|
94
|
-
|
|
95
|
-
}, /*#__PURE__*/React.createElement(Switch, {
|
|
95
|
+
style: style
|
|
96
|
+
}, rest), /*#__PURE__*/React.createElement(Switch, {
|
|
96
97
|
theme: theme,
|
|
97
98
|
value: checked,
|
|
98
99
|
disabled: disabled,
|
|
@@ -105,16 +106,4 @@ function Row(_ref2) {
|
|
|
105
106
|
}
|
|
106
107
|
const SwitchRow = withTheme(Row);
|
|
107
108
|
export { SwitchRow };
|
|
108
|
-
export default withTheme(Switch);: theme,
|
|
109
|
-
value: checked,
|
|
110
|
-
disabled: disabled,
|
|
111
|
-
onValueChange: onValueChange,
|
|
112
|
-
activeTrackColor: activeTrackColor,
|
|
113
|
-
inactiveTrackColor: inactiveTrackColor,
|
|
114
|
-
activeThumbColor: activeThumbColor,
|
|
115
|
-
inactiveThumbColor: inactiveThumbColor
|
|
116
|
-
}));
|
|
117
|
-
}
|
|
118
|
-
const SwitchRow = withTheme(Row);
|
|
119
|
-
export { SwitchRow };
|
|
120
109
|
export default withTheme(Switch);
|
package/lib/module/constants.js
CHANGED
package/lib/module/hooks.js
CHANGED
|
@@ -3,11 +3,12 @@ export function usePrevious(value) {
|
|
|
3
3
|
// The ref object is a generic container whose current property is mutable
|
|
4
4
|
// and can hold any value, similar to an instance property on a class
|
|
5
5
|
const ref = React.useRef();
|
|
6
|
+
|
|
6
7
|
// Store current value in ref
|
|
7
8
|
React.useEffect(() => {
|
|
8
9
|
ref.current = value;
|
|
9
10
|
}, [value]);
|
|
11
|
+
|
|
10
12
|
// Return previous value (happens before update in useEffect above)
|
|
11
13
|
return ref.current;
|
|
12
|
-
}
|
|
13
14
|
}
|
package/lib/module/index.js
CHANGED
|
@@ -31,7 +31,6 @@ export { ActionSheet, ActionSheetItem, ActionSheetCancel } from "./components/Ac
|
|
|
31
31
|
export { Swiper, SwiperItem } from "./components/Swiper";
|
|
32
32
|
export { Center, Circle, Square, Row, Stack, Spacer } from "./components/Layout";
|
|
33
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup } from "./components/RadioButton/index";
|
|
34
|
-
export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
|
|
35
34
|
|
|
36
35
|
/* Deprecated: Fix or Delete! */
|
|
37
36
|
export { default as DatePicker } from "./components/DatePicker/DatePicker";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, GROUPS, Triggers, StylesPanelSections, createNumberProp, createColorProp } from "@draftbit/types";
|
|
1
|
+
import { COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, GROUPS, Triggers, StylesPanelSections, createNumberProp, createColorProp, createStaticBoolProp } from "@draftbit/types";
|
|
2
2
|
const SEED_DATA_PROPS = {
|
|
3
3
|
mode: {
|
|
4
4
|
label: "Mode",
|
|
@@ -163,6 +163,11 @@ export const SEED_DATA = [{
|
|
|
163
163
|
editable: true,
|
|
164
164
|
required: true,
|
|
165
165
|
group: GROUPS.basic
|
|
166
|
-
}
|
|
166
|
+
},
|
|
167
|
+
autoDismissKeyboard: createStaticBoolProp({
|
|
168
|
+
label: "Auto dismiss keyboard",
|
|
169
|
+
description: "Automatically dismiss keyboard when DatePicker is opened",
|
|
170
|
+
defaultValue: true
|
|
171
|
+
})
|
|
167
172
|
}
|
|
168
173
|
}];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, Triggers, GROUPS, FORM_TYPES, PROP_TYPES, FIELD_NAME, createIconSizeProp, createColorProp, StylesPanelSections } from "@draftbit/types";
|
|
1
|
+
import { COMPONENT_TYPES, Triggers, GROUPS, FORM_TYPES, PROP_TYPES, FIELD_NAME, createIconSizeProp, createColorProp, StylesPanelSections, createStaticBoolProp } from "@draftbit/types";
|
|
2
2
|
const SEED_DATA_PROPS = {
|
|
3
3
|
label: {
|
|
4
4
|
group: GROUPS.data,
|
|
@@ -136,6 +136,11 @@ export const SEED_DATA = [{
|
|
|
136
136
|
}),
|
|
137
137
|
iconColor: createColorProp({
|
|
138
138
|
label: "Icon Color"
|
|
139
|
+
}),
|
|
140
|
+
autoDismissKeyboard: createStaticBoolProp({
|
|
141
|
+
label: "Auto dismiss keyboard",
|
|
142
|
+
description: "Automatically dismiss keyboard when Picker is opened",
|
|
143
|
+
defaultValue: true
|
|
139
144
|
})
|
|
140
145
|
},
|
|
141
146
|
layout: {}
|
|
@@ -7,6 +7,7 @@ export default function overlay(elevation) {
|
|
|
7
7
|
let surfaceColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DarkTheme.colors.surface;
|
|
8
8
|
if (isAnimatedValue(elevation)) {
|
|
9
9
|
const inputRange = [0, 1, 2, 3, 8, 24];
|
|
10
|
+
|
|
10
11
|
// @ts-expect-error: TS doesn't seem to refine the type correctly
|
|
11
12
|
return elevation.interpolate({
|
|
12
13
|
inputRange,
|
|
@@ -15,6 +16,7 @@ export default function overlay(elevation) {
|
|
|
15
16
|
})
|
|
16
17
|
});
|
|
17
18
|
}
|
|
19
|
+
|
|
18
20
|
// @ts-expect-error: TS doesn't seem to refine the type correctly
|
|
19
21
|
return calculateColor(surfaceColor, elevation);
|
|
20
22
|
}
|
|
@@ -55,4 +57,4 @@ const elevationOverlayTransparency = {
|
|
|
55
57
|
22: 15.72,
|
|
56
58
|
23: 15.84,
|
|
57
59
|
24: 16
|
|
58
|
-
};
|
|
60
|
+
};
|
|
@@ -23,6 +23,7 @@ declare type Props = {
|
|
|
23
23
|
rightIconName?: string;
|
|
24
24
|
borderColor?: string;
|
|
25
25
|
borderColorActive?: string;
|
|
26
|
+
autoDismissKeyboard?: boolean;
|
|
26
27
|
} & IconSlot & TextInputProps;
|
|
27
28
|
declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<React.PropsWithChildren<Props>, "theme"> & {
|
|
28
29
|
theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
|