@draftbit/core 46.10.3-106fd0.2 → 46.10.3-17bcb4.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/AvatarEdit.js +15 -4
- package/lib/commonjs/components/Banner.js +23 -4
- package/lib/commonjs/components/Checkbox/Checkbox.js +3 -4
- package/lib/commonjs/components/Checkbox/CheckboxGroup.js +17 -2
- package/lib/commonjs/components/CircularProgress.js +26 -8
- package/lib/commonjs/components/DeprecatedButton.js +20 -3
- package/lib/commonjs/components/DeprecatedCardWrapper.js +54 -0
- package/lib/commonjs/components/DeprecatedFAB.js +157 -0
- package/lib/commonjs/components/Elevation.js +14 -2
- package/lib/commonjs/components/FormRow.js +16 -2
- package/lib/commonjs/components/IconButton.js +19 -4
- package/lib/commonjs/components/Layout.js +40 -19
- package/lib/commonjs/components/NumberInput.js +12 -3
- package/lib/commonjs/components/Picker/Picker.js +9 -6
- package/lib/commonjs/components/Picker/PickerComponent.web.js +20 -3
- package/lib/commonjs/components/Portal/Portal.js +27 -3
- package/lib/commonjs/components/Portal/PortalHost.js +44 -15
- package/lib/commonjs/components/Pressable.js +15 -2
- package/lib/commonjs/components/ProgressIndicator.js +55 -0
- package/lib/commonjs/components/RadioButton/RadioButton.js +13 -2
- package/lib/commonjs/components/RadioButton/RadioButtonGroup.js +15 -2
- package/lib/commonjs/components/RadioButton/context.js +1 -1
- package/lib/commonjs/components/ResizeMode.js +5 -0
- package/lib/commonjs/components/ScreenContainer.js +24 -6
- package/lib/commonjs/components/Slider.js +21 -4
- package/lib/commonjs/components/StarRating.js +23 -4
- package/lib/commonjs/components/StepIndicator.js +57 -18
- package/lib/commonjs/components/Surface.js +14 -2
- package/lib/commonjs/components/Switch.js +19 -10
- package/lib/commonjs/components/Table/Table.js +11 -10
- package/lib/commonjs/components/Table/TableCell.js +3 -3
- package/lib/commonjs/components/Table/TableCommon.js +30 -0
- package/lib/commonjs/components/Table/TableRow.js +4 -4
- package/lib/commonjs/components/Table/index.js +3 -27
- package/lib/commonjs/components/ToggleButton.js +15 -2
- package/lib/commonjs/constants.js +1 -1
- package/lib/commonjs/hooks.js +1 -2
- package/lib/commonjs/mappings/CardBlock.js +126 -0
- package/lib/commonjs/mappings/CardContainer.js +108 -0
- package/lib/commonjs/mappings/CardContainerRating.js +130 -0
- package/lib/commonjs/mappings/CardContainerShortImage.js +124 -0
- package/lib/commonjs/mappings/CardInline.js +59 -0
- package/lib/commonjs/mappings/ProgressIndicator.js +188 -0
- package/lib/commonjs/styles/overlay.js +1 -3
- package/lib/module/components/AnimatedCircularProgress.js +13 -1
- package/lib/module/components/AspectRatio.js +1 -18
- package/lib/module/components/AvatarEdit.js +15 -4
- package/lib/module/components/Banner.js +25 -4
- package/lib/module/components/Button.js +33 -10
- 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 +1 -16
- package/lib/module/components/DatePicker/DatePicker.js +27 -13
- package/lib/module/components/DeprecatedButton.js +3 -21
- package/lib/module/components/DeprecatedCardWrapper.js +32 -0
- package/lib/module/components/DeprecatedFAB.js +167 -0
- package/lib/module/components/Divider.js +18 -1
- package/lib/module/components/IconButton.js +4 -21
- package/lib/module/components/Layout.js +42 -21
- package/lib/module/components/Picker/PickerComponent.android.js +21 -3
- package/lib/module/components/Portal/PortalConsumer.js +22 -7
- package/lib/module/components/Pressable.js +2 -15
- package/lib/module/components/ProgressIndicator.js +45 -0
- package/lib/module/components/RadioButton/RadioButton.js +13 -1
- package/lib/module/components/RadioButton/RadioButtonFieldGroup.js +10 -1
- package/lib/module/components/RadioButton/context.js +1 -1
- package/lib/module/components/ResizeMode.js +1 -0
- package/lib/module/components/Shadow.js +2 -15
- package/lib/module/components/StepIndicator.js +58 -18
- package/lib/module/components/Surface.js +15 -1
- package/lib/module/components/Switch.js +21 -10
- package/lib/module/components/TabView/TabView.js +17 -7
- package/lib/module/components/TabView/TabViewItem.js +4 -3
- package/lib/module/components/Table/Table.js +12 -11
- package/lib/module/components/Table/TableCell.js +1 -1
- package/lib/module/components/Table/TableCommon.js +21 -0
- package/lib/module/components/Table/TableRow.js +3 -2
- package/lib/module/components/Table/index.js +1 -22
- package/lib/module/components/TextField.js +78 -28
- package/lib/module/mappings/CardBlock.js +119 -0
- package/lib/module/mappings/CardContainer.js +101 -0
- package/lib/module/mappings/CardContainerRating.js +123 -0
- package/lib/module/mappings/CardContainerShortImage.js +117 -0
- package/lib/module/mappings/CardInline.js +52 -0
- package/lib/module/mappings/ProgressIndicator.js +181 -0
- package/lib/typescript/src/components/DeprecatedCardWrapper.d.ts +15 -0
- package/lib/typescript/src/components/DeprecatedCardWrapper.d.ts.map +1 -0
- package/lib/typescript/src/components/DeprecatedFAB.d.ts +56 -0
- package/lib/typescript/src/components/DeprecatedFAB.d.ts.map +1 -0
- package/lib/typescript/src/components/ProgressIndicator.d.ts +24 -0
- package/lib/typescript/src/components/ProgressIndicator.d.ts.map +1 -0
- package/lib/typescript/src/components/ResizeMode.d.ts +2 -0
- package/lib/typescript/src/components/ResizeMode.d.ts.map +1 -0
- package/lib/typescript/src/components/Table/Table.d.ts +7 -2
- package/lib/typescript/src/components/Table/Table.d.ts.map +1 -1
- package/lib/typescript/src/components/Table/TableCell.d.ts +1 -1
- package/lib/typescript/src/components/Table/TableCell.d.ts.map +1 -1
- package/lib/typescript/src/components/Table/TableCommon.d.ts +20 -0
- package/lib/typescript/src/components/Table/TableCommon.d.ts.map +1 -0
- package/lib/typescript/src/components/Table/TableRow.d.ts +1 -1
- package/lib/typescript/src/components/Table/TableRow.d.ts.map +1 -1
- package/lib/typescript/src/components/Table/index.d.ts +1 -19
- package/lib/typescript/src/components/Table/index.d.ts.map +1 -1
- package/lib/typescript/src/mappings/CardBlock.d.ts +289 -0
- package/lib/typescript/src/mappings/CardBlock.d.ts.map +1 -0
- package/lib/typescript/src/mappings/CardContainer.d.ts +102 -0
- package/lib/typescript/src/mappings/CardContainer.d.ts.map +1 -0
- package/lib/typescript/src/mappings/CardContainerRating.d.ts +108 -0
- package/lib/typescript/src/mappings/CardContainerRating.d.ts.map +1 -0
- package/lib/typescript/src/mappings/CardContainerShortImage.d.ts +139 -0
- package/lib/typescript/src/mappings/CardContainerShortImage.d.ts.map +1 -0
- package/lib/typescript/src/mappings/CardInline.d.ts +62 -0
- package/lib/typescript/src/mappings/CardInline.d.ts.map +1 -0
- package/lib/typescript/src/mappings/ProgressIndicator.d.ts +181 -0
- package/lib/typescript/src/mappings/ProgressIndicator.d.ts.map +1 -0
- package/package.json +3 -3
- package/src/components/DeprecatedCardWrapper.js +18 -0
- package/src/components/DeprecatedCardWrapper.tsx +46 -0
- package/src/components/DeprecatedFAB.js +114 -0
- package/src/components/DeprecatedFAB.tsx +231 -0
- package/src/components/ProgressIndicator.js +27 -0
- package/src/components/ProgressIndicator.tsx +71 -0
- package/src/components/ResizeMode.js +1 -0
- package/src/components/ResizeMode.ts +7 -0
- package/src/components/Table/Table.js +4 -2
- package/src/components/Table/Table.tsx +9 -3
- package/src/components/Table/TableCell.js +1 -1
- package/src/components/Table/TableCell.tsx +5 -1
- package/src/components/Table/TableCommon.js +12 -0
- package/src/components/Table/TableCommon.ts +40 -0
- package/src/components/Table/TableRow.js +1 -1
- package/src/components/Table/TableRow.tsx +1 -1
- package/src/components/Table/index.js +1 -13
- package/src/components/Table/index.tsx +1 -42
- package/src/mappings/CardBlock.js +123 -0
- package/src/mappings/CardBlock.ts +136 -0
- package/src/mappings/CardContainer.js +104 -0
- package/src/mappings/CardContainer.ts +116 -0
- package/src/mappings/CardContainerRating.js +126 -0
- package/src/mappings/CardContainerRating.ts +137 -0
- package/src/mappings/CardContainerShortImage.js +120 -0
- package/src/mappings/CardContainerShortImage.ts +130 -0
- package/src/mappings/CardInline.js +52 -0
- package/src/mappings/CardInline.ts +61 -0
- package/src/mappings/ProgressIndicator.js +181 -0
- package/src/mappings/ProgressIndicator.ts +190 -0
|
@@ -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, Animated, Text, StyleSheet, I18nManager, TextInput as NativeTextInput, Keyboard } from "react-native";
|
|
4
3
|
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
|
@@ -83,24 +82,20 @@ const DatePicker = _ref => {
|
|
|
83
82
|
focused ? _handleBlur() : _handleFocus();
|
|
84
83
|
};
|
|
85
84
|
const insets = useSafeAreaInsets();
|
|
86
|
-
|
|
87
85
|
// const _restoreLabel = () =>
|
|
88
86
|
// Animated.timing(labeled, {
|
|
89
87
|
// toValue: 1,
|
|
90
88
|
// duration: FOCUS_ANIMATION_DURATION,
|
|
91
89
|
// useNativeDriver: true,
|
|
92
90
|
// }).start();
|
|
93
|
-
|
|
94
91
|
// const _minmizeLabel = () =>
|
|
95
92
|
// Animated.timing(labeled, {
|
|
96
93
|
// toValue: 0,
|
|
97
94
|
// duration: BLUR_ANIMATION_DURATION,
|
|
98
95
|
// useNativeDriver: true,
|
|
99
96
|
// }).start();
|
|
100
|
-
|
|
101
97
|
// const _showPlaceholder = () =>
|
|
102
98
|
// setTimeout(() => setPlaceholder1(placeholder || ""), 50);
|
|
103
|
-
|
|
104
99
|
const _hidePlaceholder = () => {
|
|
105
100
|
setPlaceholder1("");
|
|
106
101
|
};
|
|
@@ -255,9 +250,7 @@ const DatePicker = _ref => {
|
|
|
255
250
|
const inputStyles = [styles.input, inputStyle, type === "solid" ? {
|
|
256
251
|
marginHorizontal: 12
|
|
257
252
|
} : {}];
|
|
258
|
-
|
|
259
253
|
// const render = (props) => <NativeTextInput {...props} />;
|
|
260
|
-
|
|
261
254
|
return /*#__PURE__*/React.createElement(View, {
|
|
262
255
|
style: [styles.container, style]
|
|
263
256
|
}, /*#__PURE__*/React.createElement(Touchable, {
|
|
@@ -267,9 +260,10 @@ const DatePicker = _ref => {
|
|
|
267
260
|
pointerEvents: "none"
|
|
268
261
|
}, /*#__PURE__*/React.createElement(View, {
|
|
269
262
|
style: [styles.container, style]
|
|
270
|
-
}, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon,
|
|
263
|
+
}, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, {
|
|
264
|
+
...leftIconProps,
|
|
271
265
|
style: leftIconStyle
|
|
272
|
-
})
|
|
266
|
+
}) : null, /*#__PURE__*/React.createElement(View, {
|
|
273
267
|
style: [containerStyle, style ? {
|
|
274
268
|
height: style.height
|
|
275
269
|
} : {}, viewStyles]
|
|
@@ -318,12 +312,13 @@ const DatePicker = _ref => {
|
|
|
318
312
|
opacity: hasActiveOutline ? labeled : 1
|
|
319
313
|
}],
|
|
320
314
|
numberOfLines: 1
|
|
321
|
-
}, label)) : null, leftIconName && leftIconMode === "inset" ? /*#__PURE__*/React.createElement(Icon,
|
|
315
|
+
}, label)) : null, leftIconName && leftIconMode === "inset" ? /*#__PURE__*/React.createElement(Icon, {
|
|
316
|
+
...leftIconProps,
|
|
322
317
|
style: {
|
|
323
318
|
...leftIconStyle,
|
|
324
319
|
marginLeft: type === "solid" ? 16 : 0
|
|
325
320
|
}
|
|
326
|
-
})
|
|
321
|
+
}) : null, /*#__PURE__*/React.createElement(NativeTextInput, {
|
|
327
322
|
value: formatDate(),
|
|
328
323
|
placeholder: label ? placeholder1 : placeholder,
|
|
329
324
|
editable: !disabled,
|
|
@@ -332,8 +327,9 @@ const DatePicker = _ref => {
|
|
|
332
327
|
onFocus: _handleFocus,
|
|
333
328
|
onBlur: _handleBlur,
|
|
334
329
|
underlineColorAndroid: "transparent",
|
|
335
|
-
style: [inputStyles, textStyles]
|
|
336
|
-
|
|
330
|
+
style: [inputStyles, textStyles],
|
|
331
|
+
...props
|
|
332
|
+
})), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
|
|
337
333
|
name: rightIconName,
|
|
338
334
|
size: ICON_SIZE,
|
|
339
335
|
color: colors.light,
|
|
@@ -404,4 +400,22 @@ const styles = StyleSheet.create({
|
|
|
404
400
|
alignSelf: "flex-end"
|
|
405
401
|
}
|
|
406
402
|
});
|
|
403
|
+
export default withTheme(DatePicker);yContent: "center",
|
|
404
|
+
textAlignVertical: "center",
|
|
405
|
+
margin: 0,
|
|
406
|
+
textAlign: I18nManager.isRTL ? "right" : "left"
|
|
407
|
+
},
|
|
408
|
+
placeholder: {
|
|
409
|
+
position: "absolute",
|
|
410
|
+
left: 0
|
|
411
|
+
},
|
|
412
|
+
pickerContainer: {
|
|
413
|
+
flexDirection: "column",
|
|
414
|
+
width: "100%",
|
|
415
|
+
zIndex: 100
|
|
416
|
+
},
|
|
417
|
+
closeButton: {
|
|
418
|
+
alignSelf: "flex-end"
|
|
419
|
+
}
|
|
420
|
+
});
|
|
407
421
|
export default withTheme(DatePicker);
|
|
@@ -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 { ActivityIndicator, View, Text, StyleSheet, Pressable } from "react-native";
|
|
3
4
|
import color from "color";
|
|
@@ -74,8 +75,7 @@ const Button = _ref => {
|
|
|
74
75
|
elevation,
|
|
75
76
|
alignSelf: "stretch"
|
|
76
77
|
}
|
|
77
|
-
}, /*#__PURE__*/React.createElement(Pressable, {
|
|
78
|
-
...rest,
|
|
78
|
+
}, /*#__PURE__*/React.createElement(Pressable, _extends({}, rest, {
|
|
79
79
|
onPress: onPress,
|
|
80
80
|
accessibilityState: {
|
|
81
81
|
disabled
|
|
@@ -83,7 +83,7 @@ const Button = _ref => {
|
|
|
83
83
|
accessibilityRole: "button",
|
|
84
84
|
disabled: disabled || loading,
|
|
85
85
|
style: [styles.button, buttonStyle]
|
|
86
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
86
|
+
}), /*#__PURE__*/React.createElement(View, {
|
|
87
87
|
style: styles.content
|
|
88
88
|
}, icon && loading !== true ? /*#__PURE__*/React.createElement(View, {
|
|
89
89
|
style: iconStyle
|
|
@@ -114,22 +114,4 @@ const styles = StyleSheet.create({
|
|
|
114
114
|
width: Config.buttonIconSize
|
|
115
115
|
}
|
|
116
116
|
});
|
|
117
|
-
export default withTheme(Button);: 1,
|
|
118
|
-
style: [textStyle, typography.button]
|
|
119
|
-
}, children))));
|
|
120
|
-
};
|
|
121
|
-
const styles = StyleSheet.create({
|
|
122
|
-
button: {
|
|
123
|
-
minWidth: 64,
|
|
124
|
-
borderStyle: "solid"
|
|
125
|
-
},
|
|
126
|
-
content: {
|
|
127
|
-
flexDirection: "row",
|
|
128
|
-
alignItems: "center",
|
|
129
|
-
justifyContent: "center"
|
|
130
|
-
},
|
|
131
|
-
icon: {
|
|
132
|
-
width: Config.buttonIconSize
|
|
133
|
-
}
|
|
134
|
-
});
|
|
135
117
|
export default withTheme(Button);
|
|
@@ -0,0 +1,32 @@
|
|
|
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
|
+
import React from "react";
|
|
3
|
+
import { withTheme } from "../theming";
|
|
4
|
+
import Touchable from "./Touchable";
|
|
5
|
+
const getWidth = numColumns => {
|
|
6
|
+
switch (numColumns) {
|
|
7
|
+
case 1:
|
|
8
|
+
return "33%";
|
|
9
|
+
case 2:
|
|
10
|
+
return "50%";
|
|
11
|
+
default:
|
|
12
|
+
return "100%";
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
const Card = _ref => {
|
|
16
|
+
let {
|
|
17
|
+
numColumns = 3,
|
|
18
|
+
children,
|
|
19
|
+
onPress,
|
|
20
|
+
style,
|
|
21
|
+
...rest
|
|
22
|
+
} = _ref;
|
|
23
|
+
const width = getWidth(numColumns);
|
|
24
|
+
return /*#__PURE__*/React.createElement(Touchable, _extends({
|
|
25
|
+
disabled: !onPress,
|
|
26
|
+
onPress: onPress,
|
|
27
|
+
style: [style, {
|
|
28
|
+
width
|
|
29
|
+
}]
|
|
30
|
+
}, rest), children);
|
|
31
|
+
};
|
|
32
|
+
export default withTheme(Card);
|
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { ActivityIndicator, View, StyleSheet, Pressable } from "react-native";
|
|
3
|
+
import color from "color";
|
|
4
|
+
import Config from "./Config";
|
|
5
|
+
import Text from "./Text";
|
|
6
|
+
import Elevation from "./Elevation";
|
|
7
|
+
import { withTheme } from "../theming";
|
|
8
|
+
const FAB = _ref => {
|
|
9
|
+
let {
|
|
10
|
+
Icon,
|
|
11
|
+
icon,
|
|
12
|
+
disabled = false,
|
|
13
|
+
type = "solid",
|
|
14
|
+
loading = false,
|
|
15
|
+
color: colorOverride,
|
|
16
|
+
label,
|
|
17
|
+
onPress,
|
|
18
|
+
elevation = 0,
|
|
19
|
+
style,
|
|
20
|
+
theme: {
|
|
21
|
+
colors,
|
|
22
|
+
disabledOpacity,
|
|
23
|
+
roundness,
|
|
24
|
+
typography
|
|
25
|
+
},
|
|
26
|
+
...rest
|
|
27
|
+
} = _ref;
|
|
28
|
+
let backgroundColor, borderColor, textColor, borderWidth;
|
|
29
|
+
const buttonColor = colorOverride || colors.primary;
|
|
30
|
+
if (type === "standard" || type === "extended" || type === "fixed") {
|
|
31
|
+
backgroundColor = buttonColor;
|
|
32
|
+
if (disabled) {
|
|
33
|
+
textColor = color(colors.surface).alpha(disabledOpacity).rgb().string();
|
|
34
|
+
} else {
|
|
35
|
+
textColor = colors.surface;
|
|
36
|
+
}
|
|
37
|
+
} else {
|
|
38
|
+
backgroundColor = "transparent";
|
|
39
|
+
if (disabled) {
|
|
40
|
+
textColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
|
|
41
|
+
} else {
|
|
42
|
+
textColor = buttonColor;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
if (type === "outline") {
|
|
46
|
+
if (disabled) {
|
|
47
|
+
borderColor = color(buttonColor).alpha(disabledOpacity).rgb().string();
|
|
48
|
+
} else {
|
|
49
|
+
borderColor = buttonColor;
|
|
50
|
+
}
|
|
51
|
+
borderWidth = StyleSheet.hairlineWidth;
|
|
52
|
+
} else {
|
|
53
|
+
borderColor = "transparent";
|
|
54
|
+
borderWidth = 0;
|
|
55
|
+
}
|
|
56
|
+
const buttonStyle = {
|
|
57
|
+
backgroundColor,
|
|
58
|
+
borderColor,
|
|
59
|
+
borderWidth,
|
|
60
|
+
borderRadius: roundness,
|
|
61
|
+
alignItems: "center",
|
|
62
|
+
justifyContent: "center"
|
|
63
|
+
};
|
|
64
|
+
const buttonStyles = [styles.button, buttonStyle];
|
|
65
|
+
const contentStyle = [styles.content];
|
|
66
|
+
const textStyle = {
|
|
67
|
+
textAlign: "center",
|
|
68
|
+
color: textColor
|
|
69
|
+
};
|
|
70
|
+
const iconStyle = [styles.icon, {
|
|
71
|
+
width: Config.buttonIconSize
|
|
72
|
+
}];
|
|
73
|
+
if (type === "standard" || type === "outline") {
|
|
74
|
+
buttonStyle.width = Config.FABSize;
|
|
75
|
+
buttonStyle.height = Config.FABSize;
|
|
76
|
+
buttonStyle.borderRadius = Config.FABBorderRadius;
|
|
77
|
+
contentStyle.push({
|
|
78
|
+
width: Config.FABSize,
|
|
79
|
+
height: Config.FABSize
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
if (type === "extended" || type === "fixed") {
|
|
83
|
+
iconStyle.push({
|
|
84
|
+
marginLeft: 16,
|
|
85
|
+
marginRight: -8
|
|
86
|
+
});
|
|
87
|
+
textStyle.margin = 16;
|
|
88
|
+
}
|
|
89
|
+
if (type === "fixed") {
|
|
90
|
+
buttonStyles.push({
|
|
91
|
+
height: Config.FABFixedHeight,
|
|
92
|
+
alignSelf: "stretch"
|
|
93
|
+
});
|
|
94
|
+
}
|
|
95
|
+
return /*#__PURE__*/React.createElement(Elevation, {
|
|
96
|
+
style: [{
|
|
97
|
+
elevation
|
|
98
|
+
}, style]
|
|
99
|
+
}, /*#__PURE__*/React.createElement(Pressable, {
|
|
100
|
+
...rest,
|
|
101
|
+
onPress: onPress,
|
|
102
|
+
accessibilityState: {
|
|
103
|
+
disabled
|
|
104
|
+
},
|
|
105
|
+
accessibilityRole: "button",
|
|
106
|
+
disabled: disabled || loading,
|
|
107
|
+
style: buttonStyles
|
|
108
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
109
|
+
style: styles.content
|
|
110
|
+
}, icon && loading !== true ? /*#__PURE__*/React.createElement(View, {
|
|
111
|
+
style: iconStyle
|
|
112
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
113
|
+
name: icon,
|
|
114
|
+
size: Config.buttonIconSize,
|
|
115
|
+
color: textColor
|
|
116
|
+
})) : null, loading ? /*#__PURE__*/React.createElement(ActivityIndicator, {
|
|
117
|
+
size: "small",
|
|
118
|
+
color: textColor,
|
|
119
|
+
style: iconStyle
|
|
120
|
+
}) : null, label ? /*#__PURE__*/React.createElement(Text, {
|
|
121
|
+
numberOfLines: 1,
|
|
122
|
+
style: [textStyle, typography.button]
|
|
123
|
+
}, label) : null)));
|
|
124
|
+
};
|
|
125
|
+
const styles = StyleSheet.create({
|
|
126
|
+
button: {
|
|
127
|
+
borderStyle: "solid"
|
|
128
|
+
},
|
|
129
|
+
content: {
|
|
130
|
+
flexDirection: "row",
|
|
131
|
+
alignItems: "center",
|
|
132
|
+
justifyContent: "center"
|
|
133
|
+
},
|
|
134
|
+
icon: {
|
|
135
|
+
alignItems: "center",
|
|
136
|
+
justifyContent: "center",
|
|
137
|
+
width: Config.buttonIconSize
|
|
138
|
+
},
|
|
139
|
+
fixed: {
|
|
140
|
+
left: 0,
|
|
141
|
+
right: 0,
|
|
142
|
+
bottom: 0,
|
|
143
|
+
height: 64,
|
|
144
|
+
borderRadius: 0
|
|
145
|
+
}
|
|
146
|
+
});
|
|
147
|
+
export default withTheme(FAB);le: "solid"
|
|
148
|
+
},
|
|
149
|
+
content: {
|
|
150
|
+
flexDirection: "row",
|
|
151
|
+
alignItems: "center",
|
|
152
|
+
justifyContent: "center"
|
|
153
|
+
},
|
|
154
|
+
icon: {
|
|
155
|
+
alignItems: "center",
|
|
156
|
+
justifyContent: "center",
|
|
157
|
+
width: Config.buttonIconSize
|
|
158
|
+
},
|
|
159
|
+
fixed: {
|
|
160
|
+
left: 0,
|
|
161
|
+
right: 0,
|
|
162
|
+
bottom: 0,
|
|
163
|
+
height: 64,
|
|
164
|
+
borderRadius: 0
|
|
165
|
+
}
|
|
166
|
+
});
|
|
167
|
+
export default withTheme(FAB);
|
|
@@ -1,7 +1,24 @@
|
|
|
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 } from "react-native";
|
|
4
3
|
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";
|
|
5
22
|
const Divider = _ref => {
|
|
6
23
|
let {
|
|
7
24
|
style,
|
|
@@ -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, ActivityIndicator, Pressable, Platform } from "react-native";
|
|
3
4
|
import { withTheme } from "../theming";
|
|
@@ -17,7 +18,7 @@ const IconButton = _ref => {
|
|
|
17
18
|
...props
|
|
18
19
|
} = _ref;
|
|
19
20
|
const iconColor = customColor || theme.colors.primary;
|
|
20
|
-
return /*#__PURE__*/React.createElement(Pressable, {
|
|
21
|
+
return /*#__PURE__*/React.createElement(Pressable, _extends({
|
|
21
22
|
onPress: onPress,
|
|
22
23
|
disabled: disabled || loading,
|
|
23
24
|
style: _ref2 => {
|
|
@@ -31,9 +32,8 @@ const IconButton = _ref => {
|
|
|
31
32
|
alignItems: "center",
|
|
32
33
|
justifyContent: "center"
|
|
33
34
|
}, style];
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
}, /*#__PURE__*/React.createElement(View, null, icon && !loading ? /*#__PURE__*/React.createElement(Icon, {
|
|
35
|
+
}
|
|
36
|
+
}, props), /*#__PURE__*/React.createElement(View, null, icon && !loading ? /*#__PURE__*/React.createElement(Icon, {
|
|
37
37
|
name: icon,
|
|
38
38
|
size: size - 2,
|
|
39
39
|
color: iconColor
|
|
@@ -54,21 +54,4 @@ const styles = StyleSheet.create({
|
|
|
54
54
|
})
|
|
55
55
|
}
|
|
56
56
|
});
|
|
57
|
-
export default withTheme(IconButton);ement(ActivityIndicator, {
|
|
58
|
-
size: "small",
|
|
59
|
-
color: iconColor
|
|
60
|
-
}) : null));
|
|
61
|
-
};
|
|
62
|
-
const styles = StyleSheet.create({
|
|
63
|
-
container: {
|
|
64
|
-
alignItems: "center",
|
|
65
|
-
justifyContent: "center",
|
|
66
|
-
...Platform.select({
|
|
67
|
-
web: {
|
|
68
|
-
cursor: "pointer",
|
|
69
|
-
userSelect: "none"
|
|
70
|
-
}
|
|
71
|
-
})
|
|
72
|
-
}
|
|
73
|
-
});
|
|
74
57
|
export default withTheme(IconButton);
|
|
@@ -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 omit from "lodash.omit";
|
|
@@ -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,
|
|
@@ -84,6 +83,25 @@ const Picker = _ref => {
|
|
|
84
83
|
label: o.label,
|
|
85
84
|
value: o.value,
|
|
86
85
|
key: o.value
|
|
86
|
+
}))), /*#__PURE__*/React.createElement(View, {
|
|
87
|
+
pointerEvents: "none"
|
|
88
|
+
}, /*#__PURE__*/React.createElement(TextField, {
|
|
89
|
+
...props,
|
|
90
|
+
value: selectedLabel,
|
|
91
|
+
placeholder: placeholder,
|
|
92
|
+
// @ts-ignore
|
|
93
|
+
ref: textField,
|
|
94
|
+
disabled: disabled,
|
|
95
|
+
// @ts-expect-error
|
|
96
|
+
style: stylesWithoutMargin
|
|
97
|
+
}))));
|
|
98
|
+
};
|
|
99
|
+
const styles = StyleSheet.create({
|
|
100
|
+
container: {
|
|
101
|
+
alignSelf: "stretch"
|
|
102
|
+
}
|
|
103
|
+
});
|
|
104
|
+
export default withTheme(Picker);y: o.value
|
|
87
105
|
}))), /*#__PURE__*/React.createElement(View, {
|
|
88
106
|
pointerEvents: "none"
|
|
89
107
|
}, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
|
|
@@ -1,14 +1,29 @@
|
|
|
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
|
export default class PortalConsumer extends React.Component {
|
|
6
|
-
constructor() {
|
|
7
|
-
super(...arguments);
|
|
8
|
-
_defineProperty(this, "key", void 0);
|
|
9
|
-
}
|
|
10
3
|
async componentDidMount() {
|
|
11
4
|
this.checkManager();
|
|
5
|
+
// Delay updating to prevent React from going to infinite loop
|
|
6
|
+
await Promise.resolve();
|
|
7
|
+
this.key = this.props.manager.mount(this.props.children);
|
|
8
|
+
}
|
|
9
|
+
componentDidUpdate() {
|
|
10
|
+
this.checkManager();
|
|
11
|
+
this.props.manager.update(this.key, this.props.children);
|
|
12
|
+
}
|
|
13
|
+
componentWillUnmount() {
|
|
14
|
+
this.checkManager();
|
|
15
|
+
this.props.manager.unmount(this.key);
|
|
16
|
+
}
|
|
17
|
+
checkManager() {
|
|
18
|
+
if (!this.props.manager) {
|
|
19
|
+
throw new Error("Looks like you forgot to wrap your root component with `Provider` component from `react-native-paper`.\n\n" + "Please read our getting-started guide and make sure you've followed all the required steps.\n\n" + "https://callstack.github.io/react-native-paper/getting-started.html");
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
render() {
|
|
23
|
+
return null;
|
|
24
|
+
}
|
|
25
|
+
}sync componentDidMount() {
|
|
26
|
+
this.checkManager();
|
|
12
27
|
|
|
13
28
|
// Delay updating to prevent React from going to infinite loop
|
|
14
29
|
await Promise.resolve();
|
|
@@ -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,
|