@draftbit/core 46.5.2-13b65f.2 → 46.5.2-5f6e91.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/Button.js +15 -27
- package/lib/commonjs/components/CardBlock.js +13 -4
- package/lib/commonjs/components/CardContainerRating.js +13 -4
- package/lib/commonjs/components/CardContainerShortImage.js +15 -4
- package/lib/commonjs/components/Carousel.js +30 -8
- package/lib/commonjs/components/Checkbox/Checkbox.js +3 -1
- package/lib/commonjs/components/Checkbox/CheckboxGroup.js +17 -2
- package/lib/commonjs/components/Checkbox/CheckboxRow.js +23 -6
- package/lib/commonjs/components/CircleImage.js +15 -1
- package/lib/commonjs/components/CircularProgress.js +26 -8
- package/lib/commonjs/components/DatePicker/DatePicker.js +4 -0
- package/lib/commonjs/components/DatePicker/DatePickerComponent.js +6 -0
- package/lib/commonjs/components/DeprecatedButton.js +151 -0
- package/lib/commonjs/components/DeprecatedCardWrapper.js +2 -2
- package/lib/commonjs/components/DeprecatedFAB.js +2 -1
- package/lib/commonjs/components/Elevation.js +14 -2
- package/lib/commonjs/components/FieldSearchBarFull.js +1 -2
- package/lib/commonjs/components/FormRow.js +16 -2
- package/lib/commonjs/components/IconButton.js +19 -4
- package/lib/commonjs/components/Image.js +17 -2
- package/lib/commonjs/components/Layout.js +40 -19
- package/lib/commonjs/components/Picker/Picker.js +13 -7
- package/lib/commonjs/components/Picker/PickerComponent.android.js +20 -3
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +38 -13
- package/lib/commonjs/components/Portal/PortalConsumer.js +22 -7
- package/lib/commonjs/components/Portal/PortalHost.js +44 -15
- package/lib/commonjs/components/ProgressBar.js +37 -7
- package/lib/commonjs/components/RadioButton/RadioButtonRow.js +23 -5
- package/lib/commonjs/components/Slider.js +21 -4
- package/lib/commonjs/components/Surface.js +14 -2
- package/lib/commonjs/components/Switch.js +19 -10
- package/lib/commonjs/components/Text.js +50 -4
- package/lib/commonjs/components/Touchable.js +27 -28
- package/lib/commonjs/components/Touchable.web.js +9 -0
- package/lib/commonjs/constants.js +1 -1
- package/lib/commonjs/hooks.js +1 -2
- package/lib/commonjs/mappings/Button.js +10 -13
- package/lib/commonjs/mappings/Touchable.js +20 -0
- package/lib/commonjs/styles/overlay.js +1 -3
- package/lib/module/components/AnimatedCircularProgress.js +13 -1
- package/lib/module/components/Button.js +9 -21
- package/lib/module/components/CardContainer.js +14 -4
- package/lib/module/components/Checkbox/Checkbox.js +3 -2
- package/lib/module/components/Checkbox/CheckboxGroupRow.js +24 -5
- package/lib/module/components/Checkbox/CheckboxRow.js +24 -6
- package/lib/module/components/Checkbox/context.js +1 -1
- package/lib/module/components/CircleImage.js +16 -1
- package/lib/module/components/DatePicker/DatePicker.js +4 -0
- package/lib/module/components/DatePicker/DatePickerComponent.js +6 -0
- package/lib/module/components/DeprecatedButton.js +141 -0
- package/lib/module/components/DeprecatedCardWrapper.js +2 -2
- package/lib/module/components/DeprecatedFAB.js +25 -4
- package/lib/module/components/Divider.js +18 -1
- package/lib/module/components/Elevation.js +14 -2
- package/lib/module/components/IconButton.js +21 -4
- package/lib/module/components/Layout.js +42 -21
- package/lib/module/components/Picker/Picker.js +4 -3
- package/lib/module/components/Picker/PickerComponent.ios.js +1 -1
- package/lib/module/components/Picker/PickerComponent.web.js +21 -3
- package/lib/module/components/Portal/PortalHost.js +45 -15
- package/lib/module/components/Portal/PortalManager.js +33 -7
- package/lib/module/components/ProgressBar.js +39 -7
- package/lib/module/components/RadioButton/RadioButtonFieldGroup.js +10 -1
- package/lib/module/components/RadioButton/RadioButtonRow.js +24 -5
- package/lib/module/components/ScreenContainer.js +21 -4
- package/lib/module/components/Slider.js +21 -4
- package/lib/module/components/StepIndicator.js +58 -18
- package/lib/module/components/Surface.js +15 -1
- package/lib/module/components/TextField.js +78 -28
- package/lib/module/components/ToggleButton.js +16 -2
- package/lib/module/components/Touchable.js +10 -25
- package/lib/module/components/Touchable.web.js +2 -0
- package/lib/module/constants.js +1 -2
- package/lib/module/hooks.js +1 -2
- package/lib/module/index.js +1 -3
- package/lib/module/mappings/Button.js +11 -14
- package/lib/module/mappings/FieldSearchBarFull.js +4 -1
- package/lib/module/mappings/StarRating.js +7 -2
- package/lib/module/mappings/Touchable.js +13 -0
- package/lib/module/styles/overlay.js +1 -3
- package/lib/typescript/src/components/Button.d.ts +0 -2
- package/lib/typescript/src/components/Button.d.ts.map +1 -1
- package/lib/typescript/src/components/Checkbox/Checkbox.d.ts +2 -2
- package/lib/typescript/src/components/Checkbox/Checkbox.d.ts.map +1 -1
- package/lib/typescript/src/components/DatePicker/DatePicker.d.ts +2 -0
- package/lib/typescript/src/components/DatePicker/DatePicker.d.ts.map +1 -1
- package/lib/typescript/src/components/DatePicker/DatePickerComponent.d.ts.map +1 -1
- package/lib/typescript/src/components/DatePicker/DatePickerComponentType.d.ts +2 -0
- package/lib/typescript/src/components/DatePicker/DatePickerComponentType.d.ts.map +1 -1
- package/lib/typescript/src/components/DeprecatedButton.d.ts +54 -0
- package/lib/typescript/src/components/DeprecatedButton.d.ts.map +1 -0
- package/lib/typescript/src/components/DeprecatedCardWrapper.d.ts.map +1 -1
- package/lib/typescript/src/components/DeprecatedFAB.d.ts +2 -2
- package/lib/typescript/src/components/DeprecatedFAB.d.ts.map +1 -1
- package/lib/typescript/src/components/Picker/Picker.d.ts.map +1 -1
- package/lib/typescript/src/components/Touchable.d.ts +2 -9
- package/lib/typescript/src/components/Touchable.d.ts.map +1 -1
- package/lib/typescript/src/components/Touchable.web.d.ts +3 -0
- package/lib/typescript/src/components/Touchable.web.d.ts.map +1 -0
- package/lib/typescript/src/mappings/Button.d.ts +4 -113
- package/lib/typescript/src/mappings/Button.d.ts.map +1 -1
- package/lib/typescript/src/mappings/Touchable.d.ts +22 -0
- package/lib/typescript/src/mappings/Touchable.d.ts.map +1 -0
- package/package.json +3 -3
- package/src/components/Button.js +11 -18
- package/src/components/Button.tsx +11 -45
- package/src/components/Checkbox/Checkbox.js +3 -2
- package/src/components/Checkbox/Checkbox.tsx +7 -5
- package/src/components/DatePicker/DatePicker.js +2 -2
- package/src/components/DatePicker/DatePicker.tsx +6 -0
- package/src/components/DatePicker/DatePickerComponent.js +3 -3
- package/src/components/DatePicker/DatePickerComponent.tsx +6 -0
- package/src/components/DatePicker/DatePickerComponentType.ts +2 -0
- package/src/components/DeprecatedButton.js +95 -0
- package/src/components/DeprecatedButton.tsx +214 -0
- package/src/components/DeprecatedCardWrapper.js +2 -2
- package/src/components/DeprecatedCardWrapper.tsx +4 -3
- package/src/components/DeprecatedFAB.js +3 -2
- package/src/components/DeprecatedFAB.tsx +5 -5
- package/src/components/Picker/Picker.js +4 -3
- package/src/components/Picker/Picker.tsx +4 -4
- package/src/components/Picker/PickerComponent.ios.js +1 -1
- package/src/components/Picker/PickerComponent.ios.tsx +1 -1
- package/src/components/Touchable.js +11 -16
- package/src/components/Touchable.tsx +11 -42
- package/src/components/Touchable.web.js +2 -0
- package/src/components/Touchable.web.tsx +3 -0
- package/src/mappings/Button.js +10 -13
- package/src/mappings/Button.ts +10 -13
- package/src/mappings/Touchable.js +17 -0
- package/src/mappings/Touchable.ts +23 -0
- package/lib/commonjs/components/Pressable.js +0 -48
- package/lib/commonjs/mappings/Pressable.js +0 -34
- package/lib/module/components/Pressable.js +0 -40
- package/lib/module/mappings/Pressable.js +0 -27
- package/lib/typescript/src/components/Pressable.d.ts +0 -18
- package/lib/typescript/src/components/Pressable.d.ts.map +0 -1
- package/lib/typescript/src/mappings/Pressable.d.ts +0 -76
- package/lib/typescript/src/mappings/Pressable.d.ts.map +0 -1
- package/src/components/Pressable.js +0 -17
- package/src/components/Pressable.tsx +0 -67
- package/src/mappings/Pressable.js +0 -34
- package/src/mappings/Pressable.ts +0 -42
|
@@ -1,6 +1,3 @@
|
|
|
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); }
|
|
4
1
|
import * as React from "react";
|
|
5
2
|
import { View, StyleSheet } from "react-native";
|
|
6
3
|
/**
|
|
@@ -9,18 +6,47 @@ import { View, StyleSheet } from "react-native";
|
|
|
9
6
|
export default class PortalManager extends React.PureComponent {
|
|
10
7
|
constructor() {
|
|
11
8
|
super(...arguments);
|
|
12
|
-
|
|
9
|
+
this.state = {
|
|
13
10
|
portals: []
|
|
14
|
-
}
|
|
15
|
-
|
|
11
|
+
};
|
|
12
|
+
this.mount = (key, children) => {
|
|
16
13
|
this.setState(state => ({
|
|
17
14
|
portals: [...state.portals, {
|
|
18
15
|
key,
|
|
19
16
|
children
|
|
20
17
|
}]
|
|
21
18
|
}));
|
|
19
|
+
};
|
|
20
|
+
this.update = (key, children) => this.setState(state => ({
|
|
21
|
+
portals: state.portals.map(item => {
|
|
22
|
+
if (item.key === key) {
|
|
23
|
+
return {
|
|
24
|
+
...item,
|
|
25
|
+
children
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
return item;
|
|
29
|
+
})
|
|
30
|
+
}));
|
|
31
|
+
this.unmount = key => this.setState(state => ({
|
|
32
|
+
portals: state.portals.filter(item => item.key !== key)
|
|
33
|
+
}));
|
|
34
|
+
}
|
|
35
|
+
render() {
|
|
36
|
+
return this.state.portals.map(_ref => {
|
|
37
|
+
let {
|
|
38
|
+
key,
|
|
39
|
+
children
|
|
40
|
+
} = _ref;
|
|
41
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
42
|
+
key: key,
|
|
43
|
+
collapsable: false /* Need collapsable=false here to clip the elevations, otherwise they appear above sibling components */,
|
|
44
|
+
pointerEvents: "box-none",
|
|
45
|
+
style: StyleSheet.absoluteFill
|
|
46
|
+
}, children);
|
|
22
47
|
});
|
|
23
|
-
|
|
48
|
+
}
|
|
49
|
+
}ey, children) => this.setState(state => ({
|
|
24
50
|
portals: state.portals.map(item => {
|
|
25
51
|
if (item.key === key) {
|
|
26
52
|
return {
|
|
@@ -1,7 +1,3 @@
|
|
|
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
|
-
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; }
|
|
3
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
4
|
-
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); }
|
|
5
1
|
import React, { Component } from "react";
|
|
6
2
|
import { Animated, Easing, View, I18nManager } from "react-native";
|
|
7
3
|
const INDETERMINATE_WIDTH_FACTOR = 0.3;
|
|
@@ -9,7 +5,7 @@ const BAR_WIDTH_ZERO_POSITION = INDETERMINATE_WIDTH_FACTOR / (1 + INDETERMINATE_
|
|
|
9
5
|
export default class ProgressBar extends Component {
|
|
10
6
|
constructor(props) {
|
|
11
7
|
super(props);
|
|
12
|
-
|
|
8
|
+
this.handleLayout = event => {
|
|
13
9
|
const {
|
|
14
10
|
width = 150,
|
|
15
11
|
onLayout
|
|
@@ -22,7 +18,7 @@ export default class ProgressBar extends Component {
|
|
|
22
18
|
if (onLayout) {
|
|
23
19
|
onLayout(event);
|
|
24
20
|
}
|
|
25
|
-
}
|
|
21
|
+
};
|
|
26
22
|
const {
|
|
27
23
|
progress: progressP = 0,
|
|
28
24
|
indeterminate = false
|
|
@@ -70,7 +66,6 @@ export default class ProgressBar extends Component {
|
|
|
70
66
|
...animationConfig,
|
|
71
67
|
toValue: progress,
|
|
72
68
|
velocity: 0,
|
|
73
|
-
//adjust this value if animation fails - velocity is required
|
|
74
69
|
useNativeDriver
|
|
75
70
|
}).start();
|
|
76
71
|
} else {
|
|
@@ -139,6 +134,43 @@ export default class ProgressBar extends Component {
|
|
|
139
134
|
})
|
|
140
135
|
}]
|
|
141
136
|
};
|
|
137
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
138
|
+
style: [containerStyle, style],
|
|
139
|
+
onLayout: this.handleLayout,
|
|
140
|
+
...restProps
|
|
141
|
+
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
142
|
+
style: progressStyle
|
|
143
|
+
}), children);
|
|
144
|
+
}
|
|
145
|
+
} width,
|
|
146
|
+
borderWidth,
|
|
147
|
+
borderColor: borderColor || color,
|
|
148
|
+
borderRadius,
|
|
149
|
+
overflow: "hidden",
|
|
150
|
+
backgroundColor: unfilledColor
|
|
151
|
+
};
|
|
152
|
+
const progressStyle = {
|
|
153
|
+
backgroundColor: color,
|
|
154
|
+
// Always take up full height of container.
|
|
155
|
+
height: "100%",
|
|
156
|
+
transform: [{
|
|
157
|
+
translateX: this.state.animationValue.interpolate({
|
|
158
|
+
inputRange: [0, 1],
|
|
159
|
+
outputRange: [innerWidth * -INDETERMINATE_WIDTH_FACTOR, innerWidth]
|
|
160
|
+
})
|
|
161
|
+
}, {
|
|
162
|
+
translateX: this.state.progress.interpolate({
|
|
163
|
+
inputRange: [0, 1],
|
|
164
|
+
outputRange: [innerWidth / (I18nManager.isRTL ? 2 : -2), 0]
|
|
165
|
+
})
|
|
166
|
+
}, {
|
|
167
|
+
// Interpolation a temp workaround for https://github.com/facebook/react-native/issues/6278
|
|
168
|
+
scaleX: this.state.progress.interpolate({
|
|
169
|
+
inputRange: [0, 1],
|
|
170
|
+
outputRange: [0.0001, 1]
|
|
171
|
+
})
|
|
172
|
+
}]
|
|
173
|
+
};
|
|
142
174
|
return /*#__PURE__*/React.createElement(View, _extends({
|
|
143
175
|
style: [containerStyle, style],
|
|
144
176
|
onLayout: this.handleLayout
|
|
@@ -1,4 +1,3 @@
|
|
|
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
1
|
import React from "react";
|
|
3
2
|
import { View } from "react-native";
|
|
4
3
|
import Text from "../Text";
|
|
@@ -20,6 +19,16 @@ const RadioButtonFieldGroup = _ref => {
|
|
|
20
19
|
fontSize: theme.typography.headline4.fontSize,
|
|
21
20
|
color: theme.typography.headline4.color
|
|
22
21
|
}, labelStyle]
|
|
22
|
+
}, label), /*#__PURE__*/React.createElement(RadioButtonGroup, {
|
|
23
|
+
theme: theme,
|
|
24
|
+
...rest
|
|
25
|
+
}, children));
|
|
26
|
+
};
|
|
27
|
+
export default withTheme(RadioButtonFieldGroup);}, /*#__PURE__*/React.createElement(Text, {
|
|
28
|
+
style: [{
|
|
29
|
+
fontSize: theme.typography.headline4.fontSize,
|
|
30
|
+
color: theme.typography.headline4.color
|
|
31
|
+
}, labelStyle]
|
|
23
32
|
}, label), /*#__PURE__*/React.createElement(RadioButtonGroup, _extends({
|
|
24
33
|
theme: theme
|
|
25
34
|
}, rest), children));
|
|
@@ -1,4 +1,3 @@
|
|
|
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
1
|
import * as React from "react";
|
|
3
2
|
import { StyleSheet, View, Platform } from "react-native";
|
|
4
3
|
import RadioButton from "./RadioButton";
|
|
@@ -7,7 +6,7 @@ import { useRadioButtonGroupContext } from "./context";
|
|
|
7
6
|
import { Direction as GroupDirection } from "./context";
|
|
8
7
|
import Touchable from "../Touchable";
|
|
9
8
|
import { extractStyles, getValueForRadioButton } from "../../utilities";
|
|
10
|
-
export
|
|
9
|
+
export var Direction;
|
|
11
10
|
(function (Direction) {
|
|
12
11
|
Direction["Row"] = "row";
|
|
13
12
|
Direction["RowReverse"] = "row-reverse";
|
|
@@ -63,13 +62,14 @@ const RadioButtonRow = _ref => {
|
|
|
63
62
|
textStyles,
|
|
64
63
|
viewStyles
|
|
65
64
|
} = extractStyles(style);
|
|
66
|
-
return /*#__PURE__*/React.createElement(Touchable,
|
|
65
|
+
return /*#__PURE__*/React.createElement(Touchable, {
|
|
67
66
|
onPress: handlePress,
|
|
68
67
|
style: [styles.mainParent, {
|
|
69
68
|
flexDirection: direction
|
|
70
69
|
}, viewStyles],
|
|
71
|
-
disabled: disabled
|
|
72
|
-
|
|
70
|
+
disabled: disabled,
|
|
71
|
+
...rest
|
|
72
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
73
73
|
style: [styles.label, {
|
|
74
74
|
alignItems: direction === Direction.Row ? "flex-start" : "flex-end"
|
|
75
75
|
}, labelContainerStyle]
|
|
@@ -106,4 +106,23 @@ const styles = StyleSheet.create({
|
|
|
106
106
|
flex: 3
|
|
107
107
|
}
|
|
108
108
|
});
|
|
109
|
+
export default RadioButtonRow;.create({
|
|
110
|
+
mainParent: {
|
|
111
|
+
alignItems: "center",
|
|
112
|
+
justifyContent: "space-around",
|
|
113
|
+
paddingStart: 20,
|
|
114
|
+
minHeight: 50,
|
|
115
|
+
paddingEnd: 20,
|
|
116
|
+
display: "flex",
|
|
117
|
+
...Platform.select({
|
|
118
|
+
web: {
|
|
119
|
+
cursor: "pointer",
|
|
120
|
+
userSelect: "none"
|
|
121
|
+
}
|
|
122
|
+
})
|
|
123
|
+
},
|
|
124
|
+
label: {
|
|
125
|
+
flex: 3
|
|
126
|
+
}
|
|
127
|
+
});
|
|
109
128
|
export default RadioButtonRow;
|
|
@@ -1,4 +1,3 @@
|
|
|
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
1
|
import * as React from "react";
|
|
3
2
|
import { StyleSheet, ScrollView, View } from "react-native";
|
|
4
3
|
import { SafeAreaView } from "react-native-safe-area-context";
|
|
@@ -22,12 +21,13 @@ function ScreenContainer(_ref) {
|
|
|
22
21
|
if (hasSafeArea || hasBottomSafeArea) {
|
|
23
22
|
edges.push("bottom");
|
|
24
23
|
}
|
|
25
|
-
return /*#__PURE__*/React.createElement(SafeAreaView,
|
|
24
|
+
return /*#__PURE__*/React.createElement(SafeAreaView, {
|
|
26
25
|
edges: edges,
|
|
27
26
|
style: [styles.container, {
|
|
28
27
|
backgroundColor
|
|
29
|
-
}]
|
|
30
|
-
|
|
28
|
+
}],
|
|
29
|
+
...rest
|
|
30
|
+
}, scrollable ? /*#__PURE__*/React.createElement(ScrollView, {
|
|
31
31
|
contentContainerStyle: [styles.scrollViewContainer, {
|
|
32
32
|
backgroundColor
|
|
33
33
|
}, style]
|
|
@@ -46,4 +46,21 @@ const styles = StyleSheet.create({
|
|
|
46
46
|
flex: undefined
|
|
47
47
|
}
|
|
48
48
|
});
|
|
49
|
+
export default withTheme(ScreenContainer);olor
|
|
50
|
+
}, style]
|
|
51
|
+
}, children) : /*#__PURE__*/React.createElement(View, {
|
|
52
|
+
style: [styles.container, {
|
|
53
|
+
backgroundColor
|
|
54
|
+
}, style]
|
|
55
|
+
}, children));
|
|
56
|
+
}
|
|
57
|
+
const styles = StyleSheet.create({
|
|
58
|
+
container: {
|
|
59
|
+
flex: 1
|
|
60
|
+
},
|
|
61
|
+
scrollViewContainer: {
|
|
62
|
+
flexGrow: 1,
|
|
63
|
+
flex: undefined
|
|
64
|
+
}
|
|
65
|
+
});
|
|
49
66
|
export default withTheme(ScreenContainer);
|
|
@@ -1,4 +1,3 @@
|
|
|
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
1
|
import * as React from "react";
|
|
3
2
|
import { View, StyleSheet } from "react-native";
|
|
4
3
|
import NativeSlider from "@react-native-community/slider";
|
|
@@ -64,9 +63,10 @@ function Slider(_ref) {
|
|
|
64
63
|
setInternalValue(newValue);
|
|
65
64
|
onValueChange(newValue);
|
|
66
65
|
};
|
|
67
|
-
return /*#__PURE__*/React.createElement(View,
|
|
68
|
-
style: [styles.container, style]
|
|
69
|
-
|
|
66
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
67
|
+
style: [styles.container, style],
|
|
68
|
+
...rest
|
|
69
|
+
}, leftIcon ? /*#__PURE__*/React.createElement(Icon, {
|
|
70
70
|
color: leftIconThemeColor,
|
|
71
71
|
name: leftIcon,
|
|
72
72
|
size: 24
|
|
@@ -98,4 +98,21 @@ 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
|
+
});
|
|
101
118
|
export default withTheme(Slider);
|
|
@@ -1,6 +1,3 @@
|
|
|
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); }
|
|
4
1
|
// @ts-nocheck
|
|
5
2
|
import React, { Component } from "react";
|
|
6
3
|
import { View, Text, StyleSheet, Animated, TouchableWithoutFeedback } from "react-native";
|
|
@@ -12,7 +9,7 @@ const STEP_STATUS = {
|
|
|
12
9
|
export default class StepIndicator extends Component {
|
|
13
10
|
constructor(props) {
|
|
14
11
|
super(props);
|
|
15
|
-
|
|
12
|
+
this.renderProgressBarBackground = () => {
|
|
16
13
|
const {
|
|
17
14
|
stepCount,
|
|
18
15
|
direction
|
|
@@ -55,8 +52,8 @@ export default class StepIndicator extends Component {
|
|
|
55
52
|
},
|
|
56
53
|
style: progressBarBackgroundStyle
|
|
57
54
|
});
|
|
58
|
-
}
|
|
59
|
-
|
|
55
|
+
};
|
|
56
|
+
this.renderProgressBar = () => {
|
|
60
57
|
const {
|
|
61
58
|
stepCount,
|
|
62
59
|
direction
|
|
@@ -86,8 +83,8 @@ export default class StepIndicator extends Component {
|
|
|
86
83
|
return /*#__PURE__*/React.createElement(Animated.View, {
|
|
87
84
|
style: progressBarStyle
|
|
88
85
|
});
|
|
89
|
-
}
|
|
90
|
-
|
|
86
|
+
};
|
|
87
|
+
this.renderStepIndicator = () => {
|
|
91
88
|
let steps = [];
|
|
92
89
|
const {
|
|
93
90
|
stepCount,
|
|
@@ -118,8 +115,8 @@ export default class StepIndicator extends Component {
|
|
|
118
115
|
height: this.state.customStyles.currentStepIndicatorSize
|
|
119
116
|
}]
|
|
120
117
|
}, steps);
|
|
121
|
-
}
|
|
122
|
-
|
|
118
|
+
};
|
|
119
|
+
this.renderStepLabels = () => {
|
|
123
120
|
const {
|
|
124
121
|
labels,
|
|
125
122
|
direction,
|
|
@@ -161,8 +158,8 @@ export default class StepIndicator extends Component {
|
|
|
161
158
|
alignItems: this.state.customStyles.labelAlign
|
|
162
159
|
}]
|
|
163
160
|
}, labelViews);
|
|
164
|
-
}
|
|
165
|
-
|
|
161
|
+
};
|
|
162
|
+
this.renderStep = position => {
|
|
166
163
|
const {
|
|
167
164
|
renderStepIndicator
|
|
168
165
|
} = this.props;
|
|
@@ -229,8 +226,8 @@ export default class StepIndicator extends Component {
|
|
|
229
226
|
}) : /*#__PURE__*/React.createElement(Text, {
|
|
230
227
|
style: indicatorLabelStyle
|
|
231
228
|
}, "".concat(position + 1)));
|
|
232
|
-
}
|
|
233
|
-
|
|
229
|
+
};
|
|
230
|
+
this.getStepStatus = stepPosition => {
|
|
234
231
|
const {
|
|
235
232
|
currentPosition
|
|
236
233
|
} = this.props;
|
|
@@ -241,8 +238,8 @@ export default class StepIndicator extends Component {
|
|
|
241
238
|
} else {
|
|
242
239
|
return STEP_STATUS.UNFINISHED;
|
|
243
240
|
}
|
|
244
|
-
}
|
|
245
|
-
|
|
241
|
+
};
|
|
242
|
+
this.onCurrentPositionChanged = position => {
|
|
246
243
|
let {
|
|
247
244
|
stepCount
|
|
248
245
|
} = this.props;
|
|
@@ -262,7 +259,7 @@ export default class StepIndicator extends Component {
|
|
|
262
259
|
toValue: this.state.customStyles.currentStepIndicatorSize / 2,
|
|
263
260
|
duration: 100
|
|
264
261
|
})])]).start();
|
|
265
|
-
}
|
|
262
|
+
};
|
|
266
263
|
const defaultStyles = {
|
|
267
264
|
stepIndicatorSize: 30,
|
|
268
265
|
currentStepIndicatorSize: 40,
|
|
@@ -328,7 +325,6 @@ export default class StepIndicator extends Component {
|
|
|
328
325
|
// ),
|
|
329
326
|
// }));
|
|
330
327
|
// }
|
|
331
|
-
|
|
332
328
|
if (prevProps.currentPosition !== this.props.currentPosition) {
|
|
333
329
|
this.onCurrentPositionChanged(this.props.currentPosition);
|
|
334
330
|
}
|
|
@@ -369,6 +365,50 @@ const styles = StyleSheet.create({
|
|
|
369
365
|
justifyContent: "center"
|
|
370
366
|
}
|
|
371
367
|
});
|
|
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
|
+
});
|
|
372
412
|
StepIndicator.defaultProps = {
|
|
373
413
|
currentPosition: 0,
|
|
374
414
|
stepCount: 5,
|
|
@@ -1,4 +1,3 @@
|
|
|
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
1
|
/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */
|
|
3
2
|
import * as React from "react";
|
|
4
3
|
import { Animated, StyleSheet } from "react-native";
|
|
@@ -34,6 +33,21 @@ const Surface = _ref => {
|
|
|
34
33
|
return colors.surface;
|
|
35
34
|
}
|
|
36
35
|
};
|
|
36
|
+
return /*#__PURE__*/React.createElement(Animated.View, {
|
|
37
|
+
...rest,
|
|
38
|
+
style: [{
|
|
39
|
+
backgroundColor: getBackgroundColor(),
|
|
40
|
+
elevation,
|
|
41
|
+
...evalationStyles,
|
|
42
|
+
...restStyle
|
|
43
|
+
}]
|
|
44
|
+
}, children);
|
|
45
|
+
};
|
|
46
|
+
export default withTheme(Surface);erlay(elevation, colors.surface);
|
|
47
|
+
} else {
|
|
48
|
+
return colors.surface;
|
|
49
|
+
}
|
|
50
|
+
};
|
|
37
51
|
return /*#__PURE__*/React.createElement(Animated.View, _extends({}, rest, {
|
|
38
52
|
style: [{
|
|
39
53
|
backgroundColor: getBackgroundColor(),
|
|
@@ -1,7 +1,3 @@
|
|
|
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
|
-
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; }
|
|
3
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
4
|
-
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); }
|
|
5
1
|
import * as React from "react";
|
|
6
2
|
import { View, Animated, TextInput as NativeTextInput, StyleSheet, Text, I18nManager } from "react-native";
|
|
7
3
|
import { withTheme } from "../theming";
|
|
@@ -13,7 +9,7 @@ const ICON_SIZE = 24;
|
|
|
13
9
|
class TextField extends React.Component {
|
|
14
10
|
constructor() {
|
|
15
11
|
super(...arguments);
|
|
16
|
-
|
|
12
|
+
this.state = {
|
|
17
13
|
nativeProps: {},
|
|
18
14
|
labeled: new Animated.Value(this.props.value || this.props.error ? 0 : 1),
|
|
19
15
|
focused: false,
|
|
@@ -22,47 +18,46 @@ class TextField extends React.Component {
|
|
|
22
18
|
measured: false,
|
|
23
19
|
width: 0
|
|
24
20
|
}
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
|
|
21
|
+
};
|
|
22
|
+
this._timer = setTimeout(() => {}, 0);
|
|
23
|
+
this._showPlaceholder = () => {
|
|
28
24
|
clearTimeout(this._timer);
|
|
29
|
-
|
|
30
25
|
// Set the placeholder in a delay to offset the label animation
|
|
31
26
|
// If we show it immediately, they'll overlap and look ugly
|
|
32
27
|
this._timer = setTimeout(() => this.setState({
|
|
33
28
|
placeholder: this.props.placeholder
|
|
34
29
|
}), 50);
|
|
35
|
-
}
|
|
36
|
-
|
|
30
|
+
};
|
|
31
|
+
this._hidePlaceholder = () => this.setState({
|
|
37
32
|
placeholder: ""
|
|
38
|
-
})
|
|
39
|
-
|
|
33
|
+
});
|
|
34
|
+
this._restoreLabel = () => Animated.timing(this.state.labeled, {
|
|
40
35
|
toValue: 1,
|
|
41
36
|
duration: FOCUS_ANIMATION_DURATION,
|
|
42
37
|
useNativeDriver: true
|
|
43
|
-
}).start()
|
|
44
|
-
|
|
38
|
+
}).start();
|
|
39
|
+
this._minmizeLabel = () => Animated.timing(this.state.labeled, {
|
|
45
40
|
toValue: 0,
|
|
46
41
|
duration: BLUR_ANIMATION_DURATION,
|
|
47
42
|
useNativeDriver: true
|
|
48
|
-
}).start()
|
|
49
|
-
|
|
43
|
+
}).start();
|
|
44
|
+
this._handleFocus = () => {
|
|
50
45
|
if (this.props.disabled) {
|
|
51
46
|
return;
|
|
52
47
|
}
|
|
53
48
|
this.setState({
|
|
54
49
|
focused: true
|
|
55
50
|
});
|
|
56
|
-
}
|
|
57
|
-
|
|
51
|
+
};
|
|
52
|
+
this._handleBlur = () => {
|
|
58
53
|
if (this.props.disabled) {
|
|
59
54
|
return;
|
|
60
55
|
}
|
|
61
56
|
this.setState({
|
|
62
57
|
focused: false
|
|
63
58
|
});
|
|
64
|
-
}
|
|
65
|
-
|
|
59
|
+
};
|
|
60
|
+
this._handleChangeText = value => {
|
|
66
61
|
if (this.props.disabled) {
|
|
67
62
|
return;
|
|
68
63
|
}
|
|
@@ -77,8 +72,8 @@ class TextField extends React.Component {
|
|
|
77
72
|
});
|
|
78
73
|
this.props.onChangeText && this.props.onChangeText(value.nativeEvent.text);
|
|
79
74
|
}
|
|
80
|
-
}
|
|
81
|
-
|
|
75
|
+
};
|
|
76
|
+
this._root = undefined;
|
|
82
77
|
}
|
|
83
78
|
static getDerivedStateFromProps(nextProps, prevState) {
|
|
84
79
|
return {
|
|
@@ -165,7 +160,9 @@ class TextField extends React.Component {
|
|
|
165
160
|
roundness,
|
|
166
161
|
disabledOpacity
|
|
167
162
|
},
|
|
168
|
-
render = props => /*#__PURE__*/React.createElement(NativeTextInput,
|
|
163
|
+
render = props => /*#__PURE__*/React.createElement(NativeTextInput, {
|
|
164
|
+
...props
|
|
165
|
+
}),
|
|
169
166
|
...rest
|
|
170
167
|
} = this.props;
|
|
171
168
|
const MINIMIZED_LABEL_Y_OFFSET = -(typography.caption.lineHeight + 4);
|
|
@@ -305,9 +302,10 @@ class TextField extends React.Component {
|
|
|
305
302
|
} = StyleSheet.flatten(style || {});
|
|
306
303
|
return /*#__PURE__*/React.createElement(View, {
|
|
307
304
|
style: [styles.container, styleProp]
|
|
308
|
-
}, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon,
|
|
305
|
+
}, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, {
|
|
306
|
+
...leftIconProps,
|
|
309
307
|
style: leftIconStyle
|
|
310
|
-
})
|
|
308
|
+
}) : null, /*#__PURE__*/React.createElement(View, {
|
|
311
309
|
style: applyStyles([containerStyle], {
|
|
312
310
|
height: style === null || style === void 0 ? void 0 : style.height,
|
|
313
311
|
backgroundColor: bgColor,
|
|
@@ -375,9 +373,10 @@ class TextField extends React.Component {
|
|
|
375
373
|
style: {
|
|
376
374
|
justifyContent: type === "solid" ? "center" : undefined
|
|
377
375
|
}
|
|
378
|
-
}, /*#__PURE__*/React.createElement(Icon,
|
|
376
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
377
|
+
...leftIconProps,
|
|
379
378
|
style: leftIconStyle
|
|
380
|
-
}))
|
|
379
|
+
})) : null, render({
|
|
381
380
|
ref: c => {
|
|
382
381
|
this._root = c;
|
|
383
382
|
},
|
|
@@ -414,6 +413,57 @@ class TextField extends React.Component {
|
|
|
414
413
|
}
|
|
415
414
|
}
|
|
416
415
|
export default withTheme(TextField);
|
|
416
|
+
const styles = StyleSheet.create({
|
|
417
|
+
container: {
|
|
418
|
+
alignSelf: "stretch"
|
|
419
|
+
},
|
|
420
|
+
placeholder: {
|
|
421
|
+
position: "absolute",
|
|
422
|
+
left: 0
|
|
423
|
+
},
|
|
424
|
+
underline: {
|
|
425
|
+
position: "absolute",
|
|
426
|
+
left: 0,
|
|
427
|
+
right: 0,
|
|
428
|
+
bottom: 0,
|
|
429
|
+
height: 2
|
|
430
|
+
},
|
|
431
|
+
input: {
|
|
432
|
+
flexGrow: 1,
|
|
433
|
+
justifyContent: "center",
|
|
434
|
+
textAlignVertical: "center",
|
|
435
|
+
margin: 0,
|
|
436
|
+
textAlign: I18nManager.isRTL ? "right" : "left"
|
|
437
|
+
}
|
|
438
|
+
});ionColor: activeColor,
|
|
439
|
+
multiline,
|
|
440
|
+
numberOfLines,
|
|
441
|
+
onFocus: this._handleFocus,
|
|
442
|
+
onBlur: this._handleBlur,
|
|
443
|
+
underlineColorAndroid: "transparent",
|
|
444
|
+
style: inputStyles,
|
|
445
|
+
...rest,
|
|
446
|
+
...this.state.nativeProps,
|
|
447
|
+
value: this.state.value
|
|
448
|
+
})), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
|
|
449
|
+
name: rightIconName,
|
|
450
|
+
size: ICON_SIZE,
|
|
451
|
+
color: colors.light,
|
|
452
|
+
style: {
|
|
453
|
+
position: "absolute",
|
|
454
|
+
right: 16,
|
|
455
|
+
marginTop: type === "solid" ? MINIMIZED_LABEL_FONT_SIZE + 4 : 16
|
|
456
|
+
}
|
|
457
|
+
}) : null, assistiveText ? /*#__PURE__*/React.createElement(Text, {
|
|
458
|
+
style: [{
|
|
459
|
+
color: error ? colors.error : colors.light,
|
|
460
|
+
marginTop: 8,
|
|
461
|
+
marginLeft: assistiveTextLeftMargin
|
|
462
|
+
}]
|
|
463
|
+
}, assistiveText) : null);
|
|
464
|
+
}
|
|
465
|
+
}
|
|
466
|
+
export default withTheme(TextField);
|
|
417
467
|
const styles = StyleSheet.create({
|
|
418
468
|
container: {
|
|
419
469
|
alignSelf: "stretch"
|