@draftbit/core 46.5.2-404403.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/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/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/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 +9 -4
- package/lib/commonjs/components/Picker/PickerComponent.android.js +20 -3
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +36 -11
- 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 +16 -1
- package/lib/commonjs/hooks.js +1 -2
- package/lib/commonjs/styles/overlay.js +1 -3
- package/lib/module/components/AnimatedCircularProgress.js +13 -1
- package/lib/module/components/CardContainer.js +14 -4
- 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/DeprecatedFAB.js +23 -3
- 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/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/constants.js +1 -2
- package/lib/module/hooks.js +1 -2
- package/lib/module/index.js +1 -3
- package/lib/module/mappings/FieldSearchBarFull.js +4 -1
- package/lib/module/mappings/StarRating.js +7 -2
- package/lib/module/styles/overlay.js +1 -3
- 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/package.json +7 -7
- 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
|
@@ -1,8 +1,5 @@
|
|
|
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 } from "react-native";
|
|
4
|
-
// @ts-ignore
|
|
5
|
-
|
|
6
3
|
export function Center(_ref) {
|
|
7
4
|
let {
|
|
8
5
|
width = 240,
|
|
@@ -12,15 +9,16 @@ export function Center(_ref) {
|
|
|
12
9
|
style,
|
|
13
10
|
...rest
|
|
14
11
|
} = _ref;
|
|
15
|
-
return /*#__PURE__*/React.createElement(View,
|
|
12
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
16
13
|
style: [{
|
|
17
14
|
justifyContent: "center",
|
|
18
15
|
alignItems: "center",
|
|
19
16
|
width,
|
|
20
17
|
height,
|
|
21
18
|
backgroundColor: bgColor
|
|
22
|
-
}, style]
|
|
23
|
-
|
|
19
|
+
}, style],
|
|
20
|
+
...rest
|
|
21
|
+
}, children);
|
|
24
22
|
}
|
|
25
23
|
export function Circle(_ref2) {
|
|
26
24
|
let {
|
|
@@ -31,7 +29,7 @@ export function Circle(_ref2) {
|
|
|
31
29
|
...rest
|
|
32
30
|
} = _ref2;
|
|
33
31
|
const borderRadius = 1000;
|
|
34
|
-
return /*#__PURE__*/React.createElement(Center,
|
|
32
|
+
return /*#__PURE__*/React.createElement(Center, {
|
|
35
33
|
width: size,
|
|
36
34
|
height: size,
|
|
37
35
|
bgColor: bgColor,
|
|
@@ -39,8 +37,9 @@ export function Circle(_ref2) {
|
|
|
39
37
|
backgroundColor: bgColor,
|
|
40
38
|
borderRadius,
|
|
41
39
|
overflow: "hidden"
|
|
42
|
-
}]
|
|
43
|
-
|
|
40
|
+
}],
|
|
41
|
+
...rest
|
|
42
|
+
}, children);
|
|
44
43
|
}
|
|
45
44
|
export function Square(_ref3) {
|
|
46
45
|
let {
|
|
@@ -50,12 +49,13 @@ export function Square(_ref3) {
|
|
|
50
49
|
style,
|
|
51
50
|
...rest
|
|
52
51
|
} = _ref3;
|
|
53
|
-
return /*#__PURE__*/React.createElement(Center,
|
|
52
|
+
return /*#__PURE__*/React.createElement(Center, {
|
|
54
53
|
style: style,
|
|
55
54
|
width: size,
|
|
56
55
|
height: size,
|
|
57
|
-
bgColor: bgColor
|
|
58
|
-
|
|
56
|
+
bgColor: bgColor,
|
|
57
|
+
...rest
|
|
58
|
+
}, children);
|
|
59
59
|
}
|
|
60
60
|
export function Row(_ref4) {
|
|
61
61
|
let {
|
|
@@ -65,15 +65,14 @@ export function Row(_ref4) {
|
|
|
65
65
|
style,
|
|
66
66
|
...rest
|
|
67
67
|
} = _ref4;
|
|
68
|
-
return /*#__PURE__*/React.createElement(View,
|
|
69
|
-
style: [style,
|
|
70
|
-
// style goes first b/c we can't override these
|
|
71
|
-
{
|
|
68
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
69
|
+
style: [style, {
|
|
72
70
|
alignItems,
|
|
73
71
|
flexDirection: "row",
|
|
74
72
|
justifyContent: justifyContent
|
|
75
|
-
}]
|
|
76
|
-
|
|
73
|
+
}],
|
|
74
|
+
...rest
|
|
75
|
+
}, children);
|
|
77
76
|
}
|
|
78
77
|
export function Spacer(_ref5) {
|
|
79
78
|
let {
|
|
@@ -85,14 +84,36 @@ export function Spacer(_ref5) {
|
|
|
85
84
|
style,
|
|
86
85
|
...rest
|
|
87
86
|
} = _ref5;
|
|
88
|
-
return /*#__PURE__*/React.createElement(View,
|
|
87
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
89
88
|
style: [style, {
|
|
90
89
|
paddingRight: right,
|
|
91
90
|
paddingTop: top,
|
|
92
91
|
paddingLeft: left,
|
|
93
92
|
paddingBottom: bottom
|
|
94
|
-
}]
|
|
95
|
-
|
|
93
|
+
}],
|
|
94
|
+
...rest
|
|
95
|
+
}, children);
|
|
96
|
+
}
|
|
97
|
+
export function Stack(_ref6) {
|
|
98
|
+
let {
|
|
99
|
+
children,
|
|
100
|
+
justifyContent = "flex-start",
|
|
101
|
+
alignItems = "flex-start",
|
|
102
|
+
style,
|
|
103
|
+
...rest
|
|
104
|
+
} = _ref6;
|
|
105
|
+
return (
|
|
106
|
+
/*#__PURE__*/
|
|
107
|
+
// style must go first since we don't want justifyContent, alignItems overridden
|
|
108
|
+
React.createElement(View, {
|
|
109
|
+
style: [style, {
|
|
110
|
+
justifyContent,
|
|
111
|
+
alignItems
|
|
112
|
+
}],
|
|
113
|
+
...rest
|
|
114
|
+
}, children)
|
|
115
|
+
);
|
|
116
|
+
}hildren);
|
|
96
117
|
}
|
|
97
118
|
export function Stack(_ref6) {
|
|
98
119
|
let {
|
|
@@ -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 { Picker as NativePicker } from "@react-native-picker/picker";
|
|
@@ -8,7 +7,6 @@ import { extractStyles } from "../../utilities";
|
|
|
8
7
|
import TextField from "../TextField";
|
|
9
8
|
import Touchable from "../Touchable";
|
|
10
9
|
const Picker = _ref => {
|
|
11
|
-
var _options$find$label, _options$find;
|
|
12
10
|
let {
|
|
13
11
|
style,
|
|
14
12
|
options,
|
|
@@ -18,6 +16,7 @@ const Picker = _ref => {
|
|
|
18
16
|
onValueChange: onValueChangeOverride = () => {},
|
|
19
17
|
...props
|
|
20
18
|
} = _ref;
|
|
19
|
+
var _a, _b;
|
|
21
20
|
const {
|
|
22
21
|
viewStyles: {
|
|
23
22
|
borderRadius,
|
|
@@ -62,7 +61,7 @@ const Picker = _ref => {
|
|
|
62
61
|
};
|
|
63
62
|
|
|
64
63
|
const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
|
|
65
|
-
const selectedLabel = selectedValue && ((
|
|
64
|
+
const selectedLabel = selectedValue && ((_b = (_a = options.find(o => o.value === selectedValue)) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : selectedValue);
|
|
66
65
|
return /*#__PURE__*/React.createElement(Touchable, {
|
|
67
66
|
disabled: disabled,
|
|
68
67
|
onPress: toggleFocus,
|
|
@@ -85,6 +84,25 @@ const Picker = _ref => {
|
|
|
85
84
|
label: o.label,
|
|
86
85
|
value: o.value,
|
|
87
86
|
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
|
|
88
106
|
}))), /*#__PURE__*/React.createElement(View, {
|
|
89
107
|
pointerEvents: "none"
|
|
90
108
|
}, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
|
|
@@ -1,11 +1,7 @@
|
|
|
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
|
import PortalManager from "./PortalManager";
|
|
7
4
|
export const PortalContext = /*#__PURE__*/React.createContext(null);
|
|
8
|
-
|
|
9
5
|
/**
|
|
10
6
|
* Portal host renders all of its children `Portal` elements.
|
|
11
7
|
* For example, you can wrap a screen in `Portal.Host` to render items above the screen.
|
|
@@ -33,10 +29,10 @@ export const PortalContext = /*#__PURE__*/React.createContext(null);
|
|
|
33
29
|
export default class PortalHost extends React.Component {
|
|
34
30
|
constructor() {
|
|
35
31
|
super(...arguments);
|
|
36
|
-
|
|
32
|
+
this.setManager = manager => {
|
|
37
33
|
this.manager = manager;
|
|
38
|
-
}
|
|
39
|
-
|
|
34
|
+
};
|
|
35
|
+
this.mount = children => {
|
|
40
36
|
const key = this.nextKey++;
|
|
41
37
|
if (this.manager) {
|
|
42
38
|
this.manager.mount(key, children);
|
|
@@ -48,8 +44,8 @@ export default class PortalHost extends React.Component {
|
|
|
48
44
|
});
|
|
49
45
|
}
|
|
50
46
|
return key;
|
|
51
|
-
}
|
|
52
|
-
|
|
47
|
+
};
|
|
48
|
+
this.update = (key, children) => {
|
|
53
49
|
if (this.manager) {
|
|
54
50
|
this.manager.update(key, children);
|
|
55
51
|
} else {
|
|
@@ -66,8 +62,8 @@ export default class PortalHost extends React.Component {
|
|
|
66
62
|
this.queue.push(op);
|
|
67
63
|
}
|
|
68
64
|
}
|
|
69
|
-
}
|
|
70
|
-
|
|
65
|
+
};
|
|
66
|
+
this.unmount = key => {
|
|
71
67
|
if (this.manager) {
|
|
72
68
|
this.manager.unmount(key);
|
|
73
69
|
} else {
|
|
@@ -76,10 +72,9 @@ export default class PortalHost extends React.Component {
|
|
|
76
72
|
key
|
|
77
73
|
});
|
|
78
74
|
}
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
_defineProperty(this, "manager", void 0);
|
|
75
|
+
};
|
|
76
|
+
this.nextKey = 0;
|
|
77
|
+
this.queue = [];
|
|
83
78
|
}
|
|
84
79
|
componentDidMount() {
|
|
85
80
|
const manager = this.manager;
|
|
@@ -117,6 +112,41 @@ export default class PortalHost extends React.Component {
|
|
|
117
112
|
}));
|
|
118
113
|
}
|
|
119
114
|
}
|
|
115
|
+
PortalHost.displayName = "Portal.Host";
|
|
116
|
+
const styles = StyleSheet.create({
|
|
117
|
+
container: {
|
|
118
|
+
flex: 1
|
|
119
|
+
}
|
|
120
|
+
}); switch (action.type) {
|
|
121
|
+
case "mount":
|
|
122
|
+
manager.mount(action.key, action.children);
|
|
123
|
+
break;
|
|
124
|
+
case "update":
|
|
125
|
+
manager.update(action.key, action.children);
|
|
126
|
+
break;
|
|
127
|
+
case "unmount":
|
|
128
|
+
manager.unmount(action.key);
|
|
129
|
+
break;
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
render() {
|
|
135
|
+
return /*#__PURE__*/React.createElement(PortalContext.Provider, {
|
|
136
|
+
value: {
|
|
137
|
+
mount: this.mount,
|
|
138
|
+
update: this.update,
|
|
139
|
+
unmount: this.unmount
|
|
140
|
+
}
|
|
141
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
142
|
+
style: styles.container,
|
|
143
|
+
collapsable: false,
|
|
144
|
+
pointerEvents: "box-none"
|
|
145
|
+
}, this.props.children), /*#__PURE__*/React.createElement(PortalManager, {
|
|
146
|
+
ref: this.setManager
|
|
147
|
+
}));
|
|
148
|
+
}
|
|
149
|
+
}
|
|
120
150
|
_defineProperty(PortalHost, "displayName", "Portal.Host");
|
|
121
151
|
const styles = StyleSheet.create({
|
|
122
152
|
container: {
|
|
@@ -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);
|