@draftbit/core 47.0.1-cc5ccc.2 → 47.0.1-df014a.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/Button.js +15 -27
- package/lib/commonjs/components/Checkbox/Checkbox.js +3 -1
- 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/Picker/Picker.js +4 -3
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +2 -2
- package/lib/commonjs/components/Touchable.js +11 -27
- package/lib/commonjs/components/Touchable.web.js +9 -0
- package/lib/commonjs/mappings/Button.js +10 -13
- package/lib/commonjs/mappings/DatePickerModal.js +74 -0
- package/lib/commonjs/mappings/Touchable.js +20 -0
- package/lib/module/components/AvatarEdit.js +15 -4
- package/lib/module/components/Button.js +9 -21
- package/lib/module/components/CardBlock.js +14 -4
- package/lib/module/components/Checkbox/Checkbox.js +3 -2
- package/lib/module/components/CircleImage.js +16 -1
- package/lib/module/components/DeprecatedButton.js +141 -0
- package/lib/module/components/DeprecatedCardWrapper.js +20 -3
- package/lib/module/components/DeprecatedFAB.js +3 -2
- package/lib/module/components/FAB.js +22 -4
- package/lib/module/components/Picker/Picker.js +4 -3
- package/lib/module/components/Picker/PickerComponent.ios.js +37 -12
- package/lib/module/components/Picker/PickerComponent.web.js +21 -3
- package/lib/module/components/Switch.js +21 -10
- package/lib/module/components/TextField.js +78 -28
- package/lib/module/components/Touchable.js +28 -26
- package/lib/module/components/Touchable.web.js +2 -0
- package/lib/module/mappings/Button.js +11 -14
- package/lib/module/mappings/DatePickerModal.js +65 -0
- package/lib/module/mappings/Touchable.js +13 -0
- 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/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/DatePickerModal.d.ts +153 -0
- package/lib/typescript/src/mappings/DatePickerModal.d.ts.map +1 -0
- 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/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/DatePickerModal.js +73 -0
- package/src/mappings/DatePickerModal.ts +91 -0
- 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 -52
- package/lib/module/components/Pressable.js +0 -40
- package/lib/module/mappings/Pressable.js +0 -45
- 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 -52
- package/src/mappings/Pressable.ts +0 -63
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.ButtonSolid = exports.ButtonOutline = exports.Button = void 0;
|
|
7
|
-
var
|
|
7
|
+
var React = _interopRequireWildcard(require("react"));
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
9
|
var _theming = require("../theming");
|
|
10
10
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
@@ -22,9 +22,6 @@ function Base(_ref) {
|
|
|
22
22
|
icon,
|
|
23
23
|
title,
|
|
24
24
|
onPress,
|
|
25
|
-
onLongPress,
|
|
26
|
-
activeOpacity,
|
|
27
|
-
disabledOpacity,
|
|
28
25
|
loading,
|
|
29
26
|
disabled,
|
|
30
27
|
style,
|
|
@@ -63,36 +60,27 @@ function Base(_ref) {
|
|
|
63
60
|
if (textAlign === "right") {
|
|
64
61
|
buttonStyles.justifyContent = "flex-end";
|
|
65
62
|
}
|
|
66
|
-
|
|
67
|
-
if (disabled) {
|
|
68
|
-
return disabledOpacity;
|
|
69
|
-
} else {
|
|
70
|
-
if (pressed) return activeOpacity;else return 1;
|
|
71
|
-
}
|
|
72
|
-
}, [activeOpacity, disabled, disabledOpacity]);
|
|
73
|
-
const _style = (0, _react.useCallback)(_ref2 => {
|
|
74
|
-
let {
|
|
75
|
-
pressed
|
|
76
|
-
} = _ref2;
|
|
77
|
-
return [buttonStyles, {
|
|
78
|
-
opacity: getOpacity(pressed)
|
|
79
|
-
}];
|
|
80
|
-
}, [getOpacity, buttonStyles]);
|
|
81
|
-
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
|
|
63
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({
|
|
82
64
|
onPress: onPress,
|
|
83
|
-
onLongPress: onLongPress,
|
|
84
65
|
disabled: disabled || loading,
|
|
85
|
-
style:
|
|
86
|
-
|
|
66
|
+
style: _ref2 => {
|
|
67
|
+
let {
|
|
68
|
+
pressed
|
|
69
|
+
} = _ref2;
|
|
70
|
+
return [styles.base, {
|
|
71
|
+
opacity: pressed || disabled ? 0.75 : 1
|
|
72
|
+
}, buttonStyles];
|
|
73
|
+
}
|
|
74
|
+
}, props), loading ? /*#__PURE__*/React.createElement(_reactNative.ActivityIndicator, {
|
|
87
75
|
size: "small",
|
|
88
76
|
color: color,
|
|
89
77
|
style: styles.loading
|
|
90
|
-
}) : null, icon && !loading ? /*#__PURE__*/
|
|
78
|
+
}) : null, icon && !loading ? /*#__PURE__*/React.createElement(Icon, {
|
|
91
79
|
name: icon,
|
|
92
80
|
color: color,
|
|
93
81
|
style: styles.icon,
|
|
94
82
|
size: CONSTANTS.icon
|
|
95
|
-
}) : null, /*#__PURE__*/
|
|
83
|
+
}) : null, /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
96
84
|
style: titleStyles
|
|
97
85
|
}, title));
|
|
98
86
|
}
|
|
@@ -102,7 +90,7 @@ const Solid = _ref3 => {
|
|
|
102
90
|
theme,
|
|
103
91
|
...props
|
|
104
92
|
} = _ref3;
|
|
105
|
-
return /*#__PURE__*/
|
|
93
|
+
return /*#__PURE__*/React.createElement(Base, _extends({
|
|
106
94
|
style: [{
|
|
107
95
|
color: "#FFF",
|
|
108
96
|
borderRadius: theme.roundness,
|
|
@@ -120,7 +108,7 @@ const Outline = _ref4 => {
|
|
|
120
108
|
theme,
|
|
121
109
|
...props
|
|
122
110
|
} = _ref4;
|
|
123
|
-
return /*#__PURE__*/
|
|
111
|
+
return /*#__PURE__*/React.createElement(Base, _extends({
|
|
124
112
|
style: [styles.outline, {
|
|
125
113
|
borderRadius: theme.roundness,
|
|
126
114
|
borderColor: theme.colors.primary,
|
|
@@ -7,7 +7,9 @@ exports.default = void 0;
|
|
|
7
7
|
var React = _interopRequireWildcard(require("react"));
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
9
|
var _theming = require("../../theming");
|
|
10
|
+
var _Touchable = _interopRequireDefault(require("../Touchable"));
|
|
10
11
|
var _hooks = require("../../hooks");
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
13
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
12
14
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
13
15
|
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); }
|
|
@@ -58,7 +60,7 @@ const Checkbox = _ref => {
|
|
|
58
60
|
onUncheck === null || onUncheck === void 0 ? void 0 : onUncheck();
|
|
59
61
|
}
|
|
60
62
|
};
|
|
61
|
-
return /*#__PURE__*/React.createElement(
|
|
63
|
+
return /*#__PURE__*/React.createElement(_Touchable.default, _extends({}, rest, {
|
|
62
64
|
onPress: handlePress,
|
|
63
65
|
disabled: disabled,
|
|
64
66
|
accessibilityState: {
|
|
@@ -0,0 +1,151 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var React = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _color = _interopRequireDefault(require("color"));
|
|
10
|
+
var _Config = _interopRequireDefault(require("./Config"));
|
|
11
|
+
var _Touchable = _interopRequireDefault(require("./Touchable"));
|
|
12
|
+
var _Elevation = _interopRequireDefault(require("./Elevation"));
|
|
13
|
+
var _theming = require("../theming");
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
16
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
17
|
+
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); }
|
|
18
|
+
const Button = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
Icon,
|
|
21
|
+
icon,
|
|
22
|
+
disabled = false,
|
|
23
|
+
type = "solid",
|
|
24
|
+
loading = false,
|
|
25
|
+
labelColor,
|
|
26
|
+
color: colorOverride,
|
|
27
|
+
children,
|
|
28
|
+
onPress,
|
|
29
|
+
elevation = 0,
|
|
30
|
+
style,
|
|
31
|
+
theme: {
|
|
32
|
+
colors,
|
|
33
|
+
disabledOpacity,
|
|
34
|
+
roundness,
|
|
35
|
+
typography
|
|
36
|
+
},
|
|
37
|
+
...rest
|
|
38
|
+
} = _ref;
|
|
39
|
+
let backgroundColor, borderColor, textColor, borderWidth;
|
|
40
|
+
const buttonColor = colorOverride || colors.primary;
|
|
41
|
+
if (type === "solid") {
|
|
42
|
+
backgroundColor = buttonColor;
|
|
43
|
+
if (disabled) {
|
|
44
|
+
textColor = (0, _color.default)(colors.surface).alpha(disabledOpacity).rgb().string();
|
|
45
|
+
} else {
|
|
46
|
+
textColor = labelColor || colors.surface;
|
|
47
|
+
}
|
|
48
|
+
} else {
|
|
49
|
+
backgroundColor = "transparent";
|
|
50
|
+
if (disabled) {
|
|
51
|
+
textColor = (0, _color.default)(buttonColor).alpha(disabledOpacity).rgb().string();
|
|
52
|
+
} else {
|
|
53
|
+
textColor = labelColor || buttonColor;
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
if (type === "outline") {
|
|
57
|
+
if (disabled) {
|
|
58
|
+
borderColor = (0, _color.default)(buttonColor).alpha(disabledOpacity).rgb().string();
|
|
59
|
+
} else {
|
|
60
|
+
borderColor = buttonColor;
|
|
61
|
+
}
|
|
62
|
+
borderWidth = _reactNative.StyleSheet.hairlineWidth;
|
|
63
|
+
} else {
|
|
64
|
+
borderColor = "transparent";
|
|
65
|
+
borderWidth = 0;
|
|
66
|
+
}
|
|
67
|
+
const buttonStyle = {
|
|
68
|
+
backgroundColor,
|
|
69
|
+
borderColor,
|
|
70
|
+
borderWidth,
|
|
71
|
+
borderRadius: roundness
|
|
72
|
+
};
|
|
73
|
+
const textStyle = {
|
|
74
|
+
textAlign: "center",
|
|
75
|
+
color: textColor,
|
|
76
|
+
marginVertical: 16,
|
|
77
|
+
marginHorizontal: 16
|
|
78
|
+
};
|
|
79
|
+
const iconStyle = [styles.icon, {
|
|
80
|
+
marginLeft: 16,
|
|
81
|
+
marginRight: -8,
|
|
82
|
+
width: _Config.default.buttonIconSize
|
|
83
|
+
}];
|
|
84
|
+
const {
|
|
85
|
+
margin,
|
|
86
|
+
marginEnd,
|
|
87
|
+
marginTop,
|
|
88
|
+
marginLeft,
|
|
89
|
+
marginRight,
|
|
90
|
+
marginBottom,
|
|
91
|
+
marginHorizontal,
|
|
92
|
+
marginVertical,
|
|
93
|
+
...innerStyles
|
|
94
|
+
} = _reactNative.StyleSheet.flatten(style || {});
|
|
95
|
+
const margins = {
|
|
96
|
+
margin,
|
|
97
|
+
marginEnd,
|
|
98
|
+
marginTop,
|
|
99
|
+
marginLeft,
|
|
100
|
+
marginRight,
|
|
101
|
+
marginBottom,
|
|
102
|
+
marginHorizontal,
|
|
103
|
+
marginVertical
|
|
104
|
+
};
|
|
105
|
+
return /*#__PURE__*/React.createElement(_Elevation.default, {
|
|
106
|
+
style: {
|
|
107
|
+
elevation,
|
|
108
|
+
alignSelf: "stretch",
|
|
109
|
+
...margins
|
|
110
|
+
}
|
|
111
|
+
}, /*#__PURE__*/React.createElement(_Touchable.default, _extends({}, rest, {
|
|
112
|
+
onPress: onPress,
|
|
113
|
+
accessibilityState: {
|
|
114
|
+
disabled
|
|
115
|
+
},
|
|
116
|
+
accessibilityRole: "button",
|
|
117
|
+
disabled: disabled || loading,
|
|
118
|
+
style: [styles.button, buttonStyle, innerStyles]
|
|
119
|
+
}), /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
120
|
+
style: styles.content
|
|
121
|
+
}, icon && loading !== true ? /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
122
|
+
style: iconStyle
|
|
123
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
124
|
+
name: icon,
|
|
125
|
+
size: _Config.default.buttonIconSize,
|
|
126
|
+
color: textColor
|
|
127
|
+
})) : null, loading ? /*#__PURE__*/React.createElement(_reactNative.ActivityIndicator, {
|
|
128
|
+
size: "small",
|
|
129
|
+
color: textColor,
|
|
130
|
+
style: iconStyle
|
|
131
|
+
}) : null, /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
132
|
+
numberOfLines: 1,
|
|
133
|
+
style: [textStyle, typography.button]
|
|
134
|
+
}, children))));
|
|
135
|
+
};
|
|
136
|
+
const styles = _reactNative.StyleSheet.create({
|
|
137
|
+
button: {
|
|
138
|
+
minWidth: 64,
|
|
139
|
+
borderStyle: "solid"
|
|
140
|
+
},
|
|
141
|
+
content: {
|
|
142
|
+
flexDirection: "row",
|
|
143
|
+
alignItems: "center",
|
|
144
|
+
justifyContent: "center"
|
|
145
|
+
},
|
|
146
|
+
icon: {
|
|
147
|
+
width: _Config.default.buttonIconSize
|
|
148
|
+
}
|
|
149
|
+
});
|
|
150
|
+
var _default = (0, _theming.withTheme)(Button);
|
|
151
|
+
exports.default = _default;
|
|
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _theming = require("../theming");
|
|
9
|
-
var
|
|
9
|
+
var _Touchable = _interopRequireDefault(require("./Touchable"));
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
11
|
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); }
|
|
12
12
|
const getWidth = numColumns => {
|
|
@@ -28,7 +28,7 @@ const Card = _ref => {
|
|
|
28
28
|
...rest
|
|
29
29
|
} = _ref;
|
|
30
30
|
const width = getWidth(numColumns);
|
|
31
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
31
|
+
return /*#__PURE__*/_react.default.createElement(_Touchable.default, _extends({
|
|
32
32
|
disabled: !onPress,
|
|
33
33
|
onPress: onPress,
|
|
34
34
|
style: [style, {
|
|
@@ -9,6 +9,7 @@ var _reactNative = require("react-native");
|
|
|
9
9
|
var _color = _interopRequireDefault(require("color"));
|
|
10
10
|
var _Config = _interopRequireDefault(require("./Config"));
|
|
11
11
|
var _Text = _interopRequireDefault(require("./Text"));
|
|
12
|
+
var _Touchable = _interopRequireDefault(require("./Touchable"));
|
|
12
13
|
var _Elevation = _interopRequireDefault(require("./Elevation"));
|
|
13
14
|
var _theming = require("../theming");
|
|
14
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -106,7 +107,7 @@ const FAB = _ref => {
|
|
|
106
107
|
style: [{
|
|
107
108
|
elevation
|
|
108
109
|
}, style]
|
|
109
|
-
}, /*#__PURE__*/React.createElement(
|
|
110
|
+
}, /*#__PURE__*/React.createElement(_Touchable.default, _extends({}, rest, {
|
|
110
111
|
onPress: onPress,
|
|
111
112
|
accessibilityState: {
|
|
112
113
|
disabled
|
|
@@ -11,7 +11,8 @@ var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
|
|
|
11
11
|
var _picker = require("@react-native-picker/picker");
|
|
12
12
|
var _theming = require("../../theming");
|
|
13
13
|
var _Portal = _interopRequireDefault(require("../Portal/Portal"));
|
|
14
|
-
var
|
|
14
|
+
var _DeprecatedButton = _interopRequireDefault(require("../DeprecatedButton"));
|
|
15
|
+
var _Touchable = _interopRequireDefault(require("../Touchable"));
|
|
15
16
|
var _utilities = require("../../utilities");
|
|
16
17
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
18
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
@@ -206,7 +207,7 @@ const Picker = _ref => {
|
|
|
206
207
|
/* marginsContainer */
|
|
207
208
|
React.createElement(_reactNative.View, {
|
|
208
209
|
style: [styles.marginsContainer, marginStyles]
|
|
209
|
-
}, /*#__PURE__*/React.createElement(
|
|
210
|
+
}, /*#__PURE__*/React.createElement(_Touchable.default, {
|
|
210
211
|
disabled: disabled,
|
|
211
212
|
onPress: togglePickerVisible,
|
|
212
213
|
style: styles.touchableContainer
|
|
@@ -225,7 +226,7 @@ const Picker = _ref => {
|
|
|
225
226
|
}]
|
|
226
227
|
}, /*#__PURE__*/React.createElement(_reactNativeSafeAreaContext.SafeAreaView, {
|
|
227
228
|
style: styles.iosSafeArea
|
|
228
|
-
}, /*#__PURE__*/React.createElement(
|
|
229
|
+
}, /*#__PURE__*/React.createElement(_DeprecatedButton.default, {
|
|
229
230
|
Icon: Icon,
|
|
230
231
|
type: "text",
|
|
231
232
|
onPress: togglePickerVisible,
|
|
@@ -11,7 +11,7 @@ var _lodash = _interopRequireDefault(require("lodash.omit"));
|
|
|
11
11
|
var _picker = require("@react-native-picker/picker");
|
|
12
12
|
var _theming = require("../../theming");
|
|
13
13
|
var _Portal = _interopRequireDefault(require("../Portal/Portal"));
|
|
14
|
-
var
|
|
14
|
+
var _DeprecatedButton = _interopRequireDefault(require("../DeprecatedButton"));
|
|
15
15
|
var _TextField = _interopRequireDefault(require("../TextField"));
|
|
16
16
|
var _Touchable = _interopRequireDefault(require("../Touchable"));
|
|
17
17
|
var _utilities = require("../../utilities");
|
|
@@ -99,7 +99,7 @@ const Picker = _ref => {
|
|
|
99
99
|
}]
|
|
100
100
|
}, /*#__PURE__*/React.createElement(_reactNativeSafeAreaContext.SafeAreaView, {
|
|
101
101
|
style: styles.pickerContainer
|
|
102
|
-
}, /*#__PURE__*/React.createElement(
|
|
102
|
+
}, /*#__PURE__*/React.createElement(_DeprecatedButton.default, {
|
|
103
103
|
Icon: Icon,
|
|
104
104
|
type: "text",
|
|
105
105
|
onPress: toggleVisibility,
|
|
@@ -4,45 +4,29 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = Touchable;
|
|
7
|
-
var _react =
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
|
-
function
|
|
10
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
9
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
10
|
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); }
|
|
12
11
|
function Touchable(_ref) {
|
|
13
12
|
let {
|
|
14
13
|
children,
|
|
15
14
|
disabled,
|
|
16
15
|
onPress,
|
|
17
|
-
onLongPress,
|
|
18
|
-
hitSlop,
|
|
19
|
-
delayLongPress,
|
|
20
|
-
activeOpacity,
|
|
21
|
-
disabledOpacity,
|
|
22
16
|
style,
|
|
23
17
|
...props
|
|
24
18
|
} = _ref;
|
|
25
|
-
const getOpacity = (0, _react.useCallback)(pressed => {
|
|
26
|
-
if (disabled) {
|
|
27
|
-
return disabledOpacity;
|
|
28
|
-
} else {
|
|
29
|
-
if (pressed) return activeOpacity;else return 1;
|
|
30
|
-
}
|
|
31
|
-
}, [activeOpacity, disabled, disabledOpacity]);
|
|
32
|
-
const _style = (0, _react.useCallback)(_ref2 => {
|
|
33
|
-
let {
|
|
34
|
-
pressed
|
|
35
|
-
} = _ref2;
|
|
36
|
-
return [style, {
|
|
37
|
-
opacity: getOpacity(pressed)
|
|
38
|
-
}];
|
|
39
|
-
}, [getOpacity, style]);
|
|
40
19
|
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
|
|
41
20
|
onPress: onPress,
|
|
42
|
-
onLongPress: onLongPress,
|
|
43
21
|
disabled: disabled,
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
22
|
+
hitSlop: 8,
|
|
23
|
+
style: _ref2 => {
|
|
24
|
+
let {
|
|
25
|
+
pressed
|
|
26
|
+
} = _ref2;
|
|
27
|
+
return [{
|
|
28
|
+
opacity: pressed || disabled ? 0.75 : 1
|
|
29
|
+
}, style];
|
|
30
|
+
}
|
|
47
31
|
}, props), children);
|
|
48
32
|
}
|
|
@@ -5,10 +5,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.SEED_DATA = void 0;
|
|
7
7
|
var _types = require("@draftbit/types");
|
|
8
|
-
const SEED_DATA_TRIGGERS = [_types.Triggers.OnPress
|
|
8
|
+
const SEED_DATA_TRIGGERS = [_types.Triggers.OnPress];
|
|
9
9
|
const SEED_DATA_PROPS = {
|
|
10
10
|
onPress: (0, _types.createActionProp)(),
|
|
11
|
-
onLongPress: (0, _types.createActionProp)(),
|
|
12
11
|
icon: (0, _types.createIconProp)({
|
|
13
12
|
defaultValue: null,
|
|
14
13
|
required: false
|
|
@@ -19,11 +18,12 @@ const SEED_DATA_PROPS = {
|
|
|
19
18
|
defaultValue: "Get Started"
|
|
20
19
|
}),
|
|
21
20
|
disabled: (0, _types.createDisabledProp)(),
|
|
22
|
-
loading: (0, _types.createLoadingProp)()
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
21
|
+
loading: (0, _types.createLoadingProp)()
|
|
22
|
+
};
|
|
23
|
+
const LAYOUT = {
|
|
24
|
+
backgroundColor: "transparent",
|
|
25
|
+
borderRadius: 8,
|
|
26
|
+
fontFamily: "system-700"
|
|
27
27
|
};
|
|
28
28
|
const SEED_DATA = [{
|
|
29
29
|
name: "Button Outline",
|
|
@@ -31,9 +31,8 @@ const SEED_DATA = [{
|
|
|
31
31
|
category: _types.COMPONENT_TYPES.deprecated,
|
|
32
32
|
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
33
33
|
layout: {
|
|
34
|
+
...LAYOUT,
|
|
34
35
|
backgroundColor: "transparent",
|
|
35
|
-
borderRadius: 8,
|
|
36
|
-
fontFamily: "system-700",
|
|
37
36
|
borderWidth: 1,
|
|
38
37
|
textAlign: "center"
|
|
39
38
|
},
|
|
@@ -45,8 +44,7 @@ const SEED_DATA = [{
|
|
|
45
44
|
category: _types.COMPONENT_TYPES.deprecated,
|
|
46
45
|
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
47
46
|
layout: {
|
|
48
|
-
|
|
49
|
-
fontFamily: "system-700",
|
|
47
|
+
...LAYOUT,
|
|
50
48
|
backgroundColor: "primary",
|
|
51
49
|
textAlign: "center"
|
|
52
50
|
},
|
|
@@ -58,8 +56,7 @@ const SEED_DATA = [{
|
|
|
58
56
|
category: _types.COMPONENT_TYPES.button,
|
|
59
57
|
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
60
58
|
layout: {
|
|
61
|
-
|
|
62
|
-
fontFamily: "system-700",
|
|
59
|
+
...LAYOUT,
|
|
63
60
|
backgroundColor: "primary",
|
|
64
61
|
textAlign: "center"
|
|
65
62
|
},
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SHARED_SEED_DATA_PROPS = exports.SHARED_SEED_DATA = exports.SEED_DATA = void 0;
|
|
7
|
+
var _types = require("@draftbit/types");
|
|
8
|
+
const SHARED_SEED_DATA = {
|
|
9
|
+
triggers: [_types.Triggers.OnDismiss, _types.Triggers.OnConfirm, _types.Triggers.OnChange],
|
|
10
|
+
category: _types.COMPONENT_TYPES.input,
|
|
11
|
+
StylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position],
|
|
12
|
+
layout: null
|
|
13
|
+
};
|
|
14
|
+
exports.SHARED_SEED_DATA = SHARED_SEED_DATA;
|
|
15
|
+
const SHARED_SEED_DATA_PROPS = {
|
|
16
|
+
locale: {},
|
|
17
|
+
visible: (0, _types.createBoolProp)({
|
|
18
|
+
label: "Visible",
|
|
19
|
+
description: "If true, show the modal. If false, hide the modal.",
|
|
20
|
+
required: true
|
|
21
|
+
}),
|
|
22
|
+
label: (0, _types.createTextProp)({
|
|
23
|
+
label: "Label",
|
|
24
|
+
description: "Label used as the header in the component, defaults to `Select Date`"
|
|
25
|
+
}),
|
|
26
|
+
saveLabel: (0, _types.createTextProp)({
|
|
27
|
+
label: "Save Label",
|
|
28
|
+
description: "Label used to confirm a date selection. Defaults to `Save`."
|
|
29
|
+
}),
|
|
30
|
+
saveLabelDisabled: (0, _types.createStaticBoolProp)({
|
|
31
|
+
label: "Disable Save Label",
|
|
32
|
+
description: "Flag indicating if the save label should be disabled and unable to receive events"
|
|
33
|
+
}),
|
|
34
|
+
uppercase: (0, _types.createStaticBoolProp)({
|
|
35
|
+
label: "Uppercase",
|
|
36
|
+
description: "Flag indicating if the text in the component should be uppercase. Defaults to true."
|
|
37
|
+
}),
|
|
38
|
+
startYear: (0, _types.createStaticNumberProp)({
|
|
39
|
+
label: "Start Year",
|
|
40
|
+
description: "The start year when the component is rendered. Defaults to 1800.",
|
|
41
|
+
required: false
|
|
42
|
+
}),
|
|
43
|
+
endYear: (0, _types.createStaticNumberProp)({
|
|
44
|
+
label: "End Year",
|
|
45
|
+
description: "The end year when the component is rendered. Defaults to 2200.",
|
|
46
|
+
required: false
|
|
47
|
+
})
|
|
48
|
+
};
|
|
49
|
+
exports.SHARED_SEED_DATA_PROPS = SHARED_SEED_DATA_PROPS;
|
|
50
|
+
const SEED_DATA = [{
|
|
51
|
+
name: "Single Date Picker Modal",
|
|
52
|
+
tag: "SingleDatePickerModal",
|
|
53
|
+
description: "A modal allowing date selection.",
|
|
54
|
+
...SHARED_SEED_DATA,
|
|
55
|
+
props: {
|
|
56
|
+
mode: (0, _types.createTextEnumProp)({
|
|
57
|
+
label: "Mode",
|
|
58
|
+
description: "The selection mode of the date picker",
|
|
59
|
+
required: true,
|
|
60
|
+
options: ["single", "multiple", "range"],
|
|
61
|
+
editable: false,
|
|
62
|
+
defaultValue: "single",
|
|
63
|
+
formType: _types.FORM_TYPES.flatArray
|
|
64
|
+
}),
|
|
65
|
+
fieldName: {
|
|
66
|
+
..._types.FIELD_NAME,
|
|
67
|
+
handlerPropName: "onConfirm",
|
|
68
|
+
valuePropName: "date",
|
|
69
|
+
defaultValue: "date"
|
|
70
|
+
},
|
|
71
|
+
...SHARED_SEED_DATA_PROPS
|
|
72
|
+
}
|
|
73
|
+
}];
|
|
74
|
+
exports.SEED_DATA = SEED_DATA;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SEED_DATA = void 0;
|
|
7
|
+
var _types = require("@draftbit/types");
|
|
8
|
+
const SEED_DATA = {
|
|
9
|
+
name: "Touchable",
|
|
10
|
+
tag: "Touchable",
|
|
11
|
+
description: "Simple button with no styles",
|
|
12
|
+
category: _types.COMPONENT_TYPES.button,
|
|
13
|
+
stylesPanelSections: [_types.StylesPanelSections.Size, _types.StylesPanelSections.Margins, _types.StylesPanelSections.Borders],
|
|
14
|
+
layout: {},
|
|
15
|
+
triggers: [_types.Triggers.OnPress],
|
|
16
|
+
props: {
|
|
17
|
+
onPress: (0, _types.createActionProp)()
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
exports.SEED_DATA = SEED_DATA;
|
|
@@ -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 } from "react-native";
|
|
4
3
|
import Touchable from "./Touchable";
|
|
@@ -23,9 +22,10 @@ const AvatarEdit = _ref => {
|
|
|
23
22
|
width: size,
|
|
24
23
|
height: size
|
|
25
24
|
};
|
|
26
|
-
return /*#__PURE__*/React.createElement(View,
|
|
27
|
-
style: [style, dimensions]
|
|
28
|
-
|
|
25
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
26
|
+
style: [style, dimensions],
|
|
27
|
+
...rest
|
|
28
|
+
}, /*#__PURE__*/React.createElement(Touchable, {
|
|
29
29
|
onPress: onPress
|
|
30
30
|
}, /*#__PURE__*/React.createElement(CircleImage, {
|
|
31
31
|
source: image,
|
|
@@ -46,4 +46,15 @@ const AvatarEdit = _ref => {
|
|
|
46
46
|
size: size * (3 / 16)
|
|
47
47
|
}))));
|
|
48
48
|
};
|
|
49
|
+
export default withTheme(AvatarEdit);yles.editBorderColor,
|
|
50
|
+
backgroundColor: colorStyles.editBackgroundColor,
|
|
51
|
+
borderRadius: size * (3 / 16),
|
|
52
|
+
padding: size * (3 / 32)
|
|
53
|
+
}
|
|
54
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
55
|
+
name: "MaterialIcons/edit",
|
|
56
|
+
color: colorStyles.editIconColor,
|
|
57
|
+
size: size * (3 / 16)
|
|
58
|
+
}))));
|
|
59
|
+
};
|
|
49
60
|
export default withTheme(AvatarEdit);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
import
|
|
2
|
+
import * as React from "react";
|
|
3
3
|
import { Text, Pressable, Platform, StyleSheet, ActivityIndicator } from "react-native";
|
|
4
4
|
import { withTheme } from "../theming";
|
|
5
5
|
const CONSTANTS = {
|
|
@@ -14,9 +14,6 @@ function Base(_ref) {
|
|
|
14
14
|
icon,
|
|
15
15
|
title,
|
|
16
16
|
onPress,
|
|
17
|
-
onLongPress,
|
|
18
|
-
activeOpacity,
|
|
19
|
-
disabledOpacity,
|
|
20
17
|
loading,
|
|
21
18
|
disabled,
|
|
22
19
|
style,
|
|
@@ -55,26 +52,17 @@ function Base(_ref) {
|
|
|
55
52
|
if (textAlign === "right") {
|
|
56
53
|
buttonStyles.justifyContent = "flex-end";
|
|
57
54
|
}
|
|
58
|
-
const getOpacity = useCallback(pressed => {
|
|
59
|
-
if (disabled) {
|
|
60
|
-
return disabledOpacity;
|
|
61
|
-
} else {
|
|
62
|
-
if (pressed) return activeOpacity;else return 1;
|
|
63
|
-
}
|
|
64
|
-
}, [activeOpacity, disabled, disabledOpacity]);
|
|
65
|
-
const _style = useCallback(_ref2 => {
|
|
66
|
-
let {
|
|
67
|
-
pressed
|
|
68
|
-
} = _ref2;
|
|
69
|
-
return [buttonStyles, {
|
|
70
|
-
opacity: getOpacity(pressed)
|
|
71
|
-
}];
|
|
72
|
-
}, [getOpacity, buttonStyles]);
|
|
73
55
|
return /*#__PURE__*/React.createElement(Pressable, _extends({
|
|
74
56
|
onPress: onPress,
|
|
75
|
-
onLongPress: onLongPress,
|
|
76
57
|
disabled: disabled || loading,
|
|
77
|
-
style:
|
|
58
|
+
style: _ref2 => {
|
|
59
|
+
let {
|
|
60
|
+
pressed
|
|
61
|
+
} = _ref2;
|
|
62
|
+
return [styles.base, {
|
|
63
|
+
opacity: pressed || disabled ? 0.75 : 1
|
|
64
|
+
}, buttonStyles];
|
|
65
|
+
}
|
|
78
66
|
}, props), loading ? /*#__PURE__*/React.createElement(ActivityIndicator, {
|
|
79
67
|
size: "small",
|
|
80
68
|
color: color,
|