@draftbit/core 47.0.1-17098e.2 → 47.0.1-2f600c.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/AspectRatio.js +17 -1
- package/lib/commonjs/components/Button.js +17 -29
- package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js +1 -2
- package/lib/commonjs/components/Checkbox/CheckboxRow.js +1 -2
- package/lib/commonjs/components/DeprecatedButton.js +127 -0
- package/lib/commonjs/components/DeprecatedCardWrapper.js +2 -2
- package/lib/commonjs/components/Picker/Picker.js +4 -3
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +2 -2
- package/lib/commonjs/components/Pressable.js +12 -23
- package/lib/commonjs/components/Touchable.js +13 -24
- package/lib/commonjs/components/Touchable.web.js +9 -0
- package/lib/commonjs/constants.js +1 -1
- package/lib/commonjs/mappings/Button.js +31 -6
- package/lib/commonjs/mappings/{Pressable.js → Touchable.js} +18 -10
- package/lib/module/components/Accordion/AccordionItem.js +25 -4
- package/lib/module/components/AnimatedCircularProgress.js +13 -1
- package/lib/module/components/Button.js +11 -23
- package/lib/module/components/Checkbox/Checkbox.js +3 -4
- package/lib/module/components/Checkbox/CheckboxGroupRow.js +25 -7
- package/lib/module/components/Checkbox/CheckboxRow.js +25 -8
- package/lib/module/components/DeprecatedButton.js +117 -0
- package/lib/module/components/DeprecatedCardWrapper.js +20 -3
- package/lib/module/components/NumberInput.js +12 -3
- package/lib/module/components/Picker/Picker.js +4 -3
- package/lib/module/components/Picker/PickerComponent.ios.js +1 -1
- package/lib/module/components/Portal/Portal.js +2 -6
- package/lib/module/components/Pressable.js +11 -21
- package/lib/module/components/ProgressBar.js +39 -7
- package/lib/module/components/Switch.js +21 -10
- package/lib/module/components/Touchable.js +12 -22
- package/lib/module/components/Touchable.web.js +2 -0
- package/lib/module/constants.js +1 -0
- package/lib/module/mappings/Button.js +32 -7
- package/lib/module/mappings/{Pressable.js → Touchable.js} +19 -11
- 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 +1 -1
- package/lib/typescript/src/components/Checkbox/Checkbox.d.ts.map +1 -1
- package/lib/typescript/src/components/Checkbox/CheckboxGroupRow.d.ts.map +1 -1
- package/lib/typescript/src/components/Checkbox/CheckboxRow.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/Picker/Picker.d.ts.map +1 -1
- package/lib/typescript/src/components/Pressable.d.ts +2 -4
- package/lib/typescript/src/components/Pressable.d.ts.map +1 -1
- package/lib/typescript/src/components/Touchable.d.ts +2 -4
- 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 +1 -114
- package/lib/typescript/src/mappings/Button.d.ts.map +1 -1
- package/lib/typescript/src/mappings/{Pressable.d.ts → Touchable.d.ts} +1 -1
- 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 +12 -36
- package/src/components/Checkbox/Checkbox.tsx +2 -2
- package/src/components/Checkbox/CheckboxGroupRow.js +2 -3
- package/src/components/Checkbox/CheckboxGroupRow.tsx +3 -3
- package/src/components/Checkbox/CheckboxRow.js +2 -3
- package/src/components/Checkbox/CheckboxRow.tsx +3 -3
- package/src/components/DeprecatedButton.js +83 -0
- package/src/components/DeprecatedButton.tsx +190 -0
- package/src/components/DeprecatedCardWrapper.js +2 -2
- package/src/components/DeprecatedCardWrapper.tsx +4 -3
- 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/Pressable.js +10 -15
- package/src/components/Pressable.tsx +11 -28
- package/src/components/Touchable.js +11 -16
- package/src/components/Touchable.tsx +13 -34
- package/src/components/Touchable.web.js +2 -0
- package/src/components/Touchable.web.tsx +3 -0
- package/src/mappings/Button.js +32 -7
- package/src/mappings/Button.ts +34 -7
- package/src/mappings/{Pressable.js → Touchable.js} +19 -11
- package/src/mappings/{Pressable.ts → Touchable.ts} +19 -12
- package/lib/typescript/src/mappings/Pressable.d.ts.map +0 -1
|
@@ -7,7 +7,6 @@ exports.default = void 0;
|
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
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); }
|
|
11
10
|
const AspectRatio = props => {
|
|
12
11
|
const [layout, setLayout] = _react.default.useState(null);
|
|
13
12
|
const {
|
|
@@ -34,6 +33,23 @@ const AspectRatio = props => {
|
|
|
34
33
|
});
|
|
35
34
|
}
|
|
36
35
|
}
|
|
36
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
37
|
+
...props,
|
|
38
|
+
style: style,
|
|
39
|
+
onLayout: _ref => {
|
|
40
|
+
let {
|
|
41
|
+
nativeEvent: {
|
|
42
|
+
layout: l
|
|
43
|
+
}
|
|
44
|
+
} = _ref;
|
|
45
|
+
return setLayout(l);
|
|
46
|
+
}
|
|
47
|
+
}, props.children);
|
|
48
|
+
};
|
|
49
|
+
var _default = AspectRatio;
|
|
50
|
+
exports.default = _default; });
|
|
51
|
+
}
|
|
52
|
+
}
|
|
37
53
|
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({}, props, {
|
|
38
54
|
style: style,
|
|
39
55
|
onLayout: _ref => {
|
|
@@ -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); }
|
|
@@ -21,13 +21,11 @@ function Base(_ref) {
|
|
|
21
21
|
Icon,
|
|
22
22
|
icon,
|
|
23
23
|
title,
|
|
24
|
-
onPress,
|
|
25
|
-
onLongPress,
|
|
26
|
-
activeOpacity,
|
|
27
|
-
disabledOpacity,
|
|
28
24
|
loading,
|
|
29
25
|
disabled,
|
|
30
26
|
style,
|
|
27
|
+
activeOpacity,
|
|
28
|
+
disabledOpacity,
|
|
31
29
|
...props
|
|
32
30
|
} = _ref;
|
|
33
31
|
const {
|
|
@@ -63,36 +61,26 @@ function Base(_ref) {
|
|
|
63
61
|
if (textAlign === "right") {
|
|
64
62
|
buttonStyles.justifyContent = "flex-end";
|
|
65
63
|
}
|
|
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({
|
|
82
|
-
onPress: onPress,
|
|
83
|
-
onLongPress: onLongPress,
|
|
64
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({
|
|
84
65
|
disabled: disabled || loading,
|
|
85
|
-
style:
|
|
86
|
-
|
|
66
|
+
style: _ref2 => {
|
|
67
|
+
let {
|
|
68
|
+
pressed
|
|
69
|
+
} = _ref2;
|
|
70
|
+
return [styles.base, {
|
|
71
|
+
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 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,
|
|
@@ -9,7 +9,6 @@ var _reactNative = require("react-native");
|
|
|
9
9
|
var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
|
10
10
|
var _Text = _interopRequireDefault(require("../Text"));
|
|
11
11
|
var _context = require("./context");
|
|
12
|
-
var _Touchable = _interopRequireDefault(require("../Touchable"));
|
|
13
12
|
var _utilities = require("../../utilities");
|
|
14
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
14
|
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); }
|
|
@@ -73,7 +72,7 @@ const CheckboxGroupRow = _ref => {
|
|
|
73
72
|
textStyles,
|
|
74
73
|
viewStyles
|
|
75
74
|
} = (0, _utilities.extractStyles)(style);
|
|
76
|
-
return /*#__PURE__*/React.createElement(
|
|
75
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({
|
|
77
76
|
onPress: handlePress,
|
|
78
77
|
style: [styles.mainParent, {
|
|
79
78
|
flexDirection: direction
|
|
@@ -10,7 +10,6 @@ var _lodash = require("lodash");
|
|
|
10
10
|
var _utilities = require("../../utilities");
|
|
11
11
|
var _hooks = require("../../hooks");
|
|
12
12
|
var _Text = _interopRequireDefault(require("../Text"));
|
|
13
|
-
var _Touchable = _interopRequireDefault(require("../Touchable"));
|
|
14
13
|
var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
|
15
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
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); }
|
|
@@ -83,7 +82,7 @@ const CheckboxRow = _ref => {
|
|
|
83
82
|
textStyles,
|
|
84
83
|
viewStyles
|
|
85
84
|
} = (0, _utilities.extractStyles)(style);
|
|
86
|
-
return /*#__PURE__*/React.createElement(
|
|
85
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({
|
|
87
86
|
onPress: handlePress,
|
|
88
87
|
style: [viewStyles, styles.mainParent, {
|
|
89
88
|
flexDirection: direction
|
|
@@ -0,0 +1,127 @@
|
|
|
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 _Elevation = _interopRequireDefault(require("./Elevation"));
|
|
12
|
+
var _theming = require("../theming");
|
|
13
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
|
+
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); }
|
|
15
|
+
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; }
|
|
16
|
+
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); }
|
|
17
|
+
const Button = _ref => {
|
|
18
|
+
let {
|
|
19
|
+
Icon,
|
|
20
|
+
icon,
|
|
21
|
+
disabled = false,
|
|
22
|
+
type = "solid",
|
|
23
|
+
loading = false,
|
|
24
|
+
labelColor,
|
|
25
|
+
color: colorOverride,
|
|
26
|
+
children,
|
|
27
|
+
onPress,
|
|
28
|
+
elevation = 0,
|
|
29
|
+
theme: {
|
|
30
|
+
colors,
|
|
31
|
+
disabledOpacity,
|
|
32
|
+
roundness,
|
|
33
|
+
typography
|
|
34
|
+
},
|
|
35
|
+
...rest
|
|
36
|
+
} = _ref;
|
|
37
|
+
let backgroundColor, borderColor, textColor, borderWidth;
|
|
38
|
+
const buttonColor = colorOverride || colors.primary;
|
|
39
|
+
if (type === "solid") {
|
|
40
|
+
backgroundColor = buttonColor;
|
|
41
|
+
if (disabled) {
|
|
42
|
+
textColor = (0, _color.default)(colors.surface).alpha(disabledOpacity).rgb().string();
|
|
43
|
+
} else {
|
|
44
|
+
textColor = labelColor || colors.surface;
|
|
45
|
+
}
|
|
46
|
+
} else {
|
|
47
|
+
backgroundColor = "transparent";
|
|
48
|
+
if (disabled) {
|
|
49
|
+
textColor = (0, _color.default)(buttonColor).alpha(disabledOpacity).rgb().string();
|
|
50
|
+
} else {
|
|
51
|
+
textColor = labelColor || buttonColor;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
if (type === "outline") {
|
|
55
|
+
if (disabled) {
|
|
56
|
+
borderColor = (0, _color.default)(buttonColor).alpha(disabledOpacity).rgb().string();
|
|
57
|
+
} else {
|
|
58
|
+
borderColor = buttonColor;
|
|
59
|
+
}
|
|
60
|
+
borderWidth = _reactNative.StyleSheet.hairlineWidth;
|
|
61
|
+
} else {
|
|
62
|
+
borderColor = "transparent";
|
|
63
|
+
borderWidth = 0;
|
|
64
|
+
}
|
|
65
|
+
const buttonStyle = {
|
|
66
|
+
backgroundColor,
|
|
67
|
+
borderColor,
|
|
68
|
+
borderWidth,
|
|
69
|
+
borderRadius: roundness
|
|
70
|
+
};
|
|
71
|
+
const textStyle = {
|
|
72
|
+
textAlign: "center",
|
|
73
|
+
color: textColor,
|
|
74
|
+
marginVertical: 16,
|
|
75
|
+
marginHorizontal: 16
|
|
76
|
+
};
|
|
77
|
+
const iconStyle = [styles.icon, {
|
|
78
|
+
marginLeft: 16,
|
|
79
|
+
marginRight: -8,
|
|
80
|
+
width: _Config.default.buttonIconSize
|
|
81
|
+
}];
|
|
82
|
+
return /*#__PURE__*/React.createElement(_Elevation.default, {
|
|
83
|
+
style: {
|
|
84
|
+
elevation,
|
|
85
|
+
alignSelf: "stretch"
|
|
86
|
+
}
|
|
87
|
+
}, /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({}, rest, {
|
|
88
|
+
onPress: onPress,
|
|
89
|
+
accessibilityState: {
|
|
90
|
+
disabled
|
|
91
|
+
},
|
|
92
|
+
accessibilityRole: "button",
|
|
93
|
+
disabled: disabled || loading,
|
|
94
|
+
style: [styles.button, buttonStyle]
|
|
95
|
+
}), /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
96
|
+
style: styles.content
|
|
97
|
+
}, icon && loading !== true ? /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
98
|
+
style: iconStyle
|
|
99
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
100
|
+
name: icon,
|
|
101
|
+
size: _Config.default.buttonIconSize,
|
|
102
|
+
color: textColor
|
|
103
|
+
})) : null, loading ? /*#__PURE__*/React.createElement(_reactNative.ActivityIndicator, {
|
|
104
|
+
size: "small",
|
|
105
|
+
color: textColor,
|
|
106
|
+
style: iconStyle
|
|
107
|
+
}) : null, /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
108
|
+
numberOfLines: 1,
|
|
109
|
+
style: [textStyle, typography.button]
|
|
110
|
+
}, children))));
|
|
111
|
+
};
|
|
112
|
+
const styles = _reactNative.StyleSheet.create({
|
|
113
|
+
button: {
|
|
114
|
+
minWidth: 64,
|
|
115
|
+
borderStyle: "solid"
|
|
116
|
+
},
|
|
117
|
+
content: {
|
|
118
|
+
flexDirection: "row",
|
|
119
|
+
alignItems: "center",
|
|
120
|
+
justifyContent: "center"
|
|
121
|
+
},
|
|
122
|
+
icon: {
|
|
123
|
+
width: _Config.default.buttonIconSize
|
|
124
|
+
}
|
|
125
|
+
});
|
|
126
|
+
var _default = (0, _theming.withTheme)(Button);
|
|
127
|
+
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, {
|
|
@@ -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,34 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = Pressable;
|
|
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 Pressable(_ref) {
|
|
13
12
|
let {
|
|
14
13
|
children,
|
|
15
14
|
disabled,
|
|
16
15
|
onPress,
|
|
17
|
-
onLongPress,
|
|
18
|
-
hitSlop,
|
|
19
|
-
delayLongPress,
|
|
20
16
|
activeOpacity,
|
|
21
17
|
disabledOpacity,
|
|
18
|
+
delayLongPress,
|
|
19
|
+
hitSlop,
|
|
22
20
|
style,
|
|
23
21
|
...props
|
|
24
22
|
} = _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
23
|
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
|
|
41
24
|
onPress: onPress,
|
|
42
|
-
onLongPress: onLongPress,
|
|
43
25
|
disabled: disabled,
|
|
44
26
|
delayLongPress: delayLongPress ? delayLongPress : 500,
|
|
45
27
|
hitSlop: hitSlop ? hitSlop : 8,
|
|
46
|
-
style:
|
|
28
|
+
style: _ref2 => {
|
|
29
|
+
let {
|
|
30
|
+
pressed
|
|
31
|
+
} = _ref2;
|
|
32
|
+
return [{
|
|
33
|
+
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1
|
|
34
|
+
}, style];
|
|
35
|
+
}
|
|
47
36
|
}, props), children);
|
|
48
37
|
}
|
|
@@ -4,45 +4,34 @@ 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
16
|
activeOpacity,
|
|
21
17
|
disabledOpacity,
|
|
18
|
+
delayLongPress,
|
|
19
|
+
hitSlop,
|
|
22
20
|
style,
|
|
23
21
|
...props
|
|
24
22
|
} = _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
23
|
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
|
|
41
|
-
onPress: onPress,
|
|
42
|
-
onLongPress: onLongPress,
|
|
43
24
|
disabled: disabled,
|
|
25
|
+
onPress: onPress,
|
|
44
26
|
delayLongPress: delayLongPress ? delayLongPress : 500,
|
|
45
27
|
hitSlop: hitSlop ? hitSlop : 8,
|
|
46
|
-
style:
|
|
28
|
+
style: _ref2 => {
|
|
29
|
+
let {
|
|
30
|
+
pressed
|
|
31
|
+
} = _ref2;
|
|
32
|
+
return [{
|
|
33
|
+
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1
|
|
34
|
+
}, style];
|
|
35
|
+
}
|
|
47
36
|
}, props), children);
|
|
48
37
|
}
|
|
@@ -12,4 +12,4 @@ const APPROX_STATUSBAR_HEIGHT = _reactNative.Platform.select({
|
|
|
12
12
|
android: DEFAULT_STATUSBAR_HEIGHT_EXPO,
|
|
13
13
|
ios: _reactNative.Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0
|
|
14
14
|
});
|
|
15
|
-
exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;
|
|
15
|
+
exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;AR_HEIGHT;
|
|
@@ -20,10 +20,36 @@ const SEED_DATA_PROPS = {
|
|
|
20
20
|
}),
|
|
21
21
|
disabled: (0, _types.createDisabledProp)(),
|
|
22
22
|
loading: (0, _types.createLoadingProp)(),
|
|
23
|
-
activeOpacity: (0, _types.
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
23
|
+
activeOpacity: (0, _types.createStaticNumberProp)({
|
|
24
|
+
label: "Active Opacity",
|
|
25
|
+
description: "Opacity of the button when active.",
|
|
26
|
+
defaultValue: 0.8,
|
|
27
|
+
min: 0,
|
|
28
|
+
max: 1,
|
|
29
|
+
step: 0.01,
|
|
30
|
+
precision: 2,
|
|
31
|
+
required: false
|
|
32
|
+
}),
|
|
33
|
+
disabledOpacity: (0, _types.createStaticNumberProp)({
|
|
34
|
+
label: "Disabled Opacity",
|
|
35
|
+
description: "Opacity of the button when disabled.",
|
|
36
|
+
defaultValue: 0.8,
|
|
37
|
+
min: 0,
|
|
38
|
+
max: 1,
|
|
39
|
+
step: 0.01,
|
|
40
|
+
precision: 2,
|
|
41
|
+
required: false
|
|
42
|
+
}),
|
|
43
|
+
delayLongPress: (0, _types.createStaticNumberProp)({
|
|
44
|
+
label: "Delay Long Press",
|
|
45
|
+
description: "Duration (in milliseconds) from onPressIn before onLongPress is called.",
|
|
46
|
+
required: false
|
|
47
|
+
}),
|
|
48
|
+
hitSlop: (0, _types.createStaticNumberProp)({
|
|
49
|
+
label: "Hit Slop",
|
|
50
|
+
description: "Sets additional distance outside of element in which a press can be detected",
|
|
51
|
+
required: false
|
|
52
|
+
})
|
|
27
53
|
};
|
|
28
54
|
const SEED_DATA = [{
|
|
29
55
|
name: "Button Outline",
|
|
@@ -31,9 +57,9 @@ const SEED_DATA = [{
|
|
|
31
57
|
category: _types.COMPONENT_TYPES.deprecated,
|
|
32
58
|
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
33
59
|
layout: {
|
|
34
|
-
backgroundColor: "transparent",
|
|
35
60
|
borderRadius: 8,
|
|
36
61
|
fontFamily: "system-700",
|
|
62
|
+
backgroundColor: "transparent",
|
|
37
63
|
borderWidth: 1,
|
|
38
64
|
textAlign: "center"
|
|
39
65
|
},
|
|
@@ -59,7 +85,6 @@ const SEED_DATA = [{
|
|
|
59
85
|
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
60
86
|
layout: {
|
|
61
87
|
borderRadius: 8,
|
|
62
|
-
height: 42,
|
|
63
88
|
fontFamily: "system-700",
|
|
64
89
|
backgroundColor: "primary",
|
|
65
90
|
textAlign: "center"
|
|
@@ -12,27 +12,35 @@ const SEED_DATA_PROPS = {
|
|
|
12
12
|
props: {
|
|
13
13
|
onPress: (0, _types.createActionProp)(),
|
|
14
14
|
onLongPress: (0, _types.createActionProp)(),
|
|
15
|
-
activeOpacity: (0, _types.
|
|
15
|
+
activeOpacity: (0, _types.createStaticNumberProp)({
|
|
16
16
|
label: "Active Opacity",
|
|
17
17
|
description: "The opacity when the button is pressed.",
|
|
18
18
|
defaultValue: 0.8,
|
|
19
|
-
|
|
19
|
+
min: 0,
|
|
20
|
+
max: 1,
|
|
21
|
+
step: 0.01,
|
|
22
|
+
precision: 2,
|
|
23
|
+
required: false
|
|
20
24
|
}),
|
|
21
|
-
disabledOpacity: (0, _types.
|
|
25
|
+
disabledOpacity: (0, _types.createStaticNumberProp)({
|
|
22
26
|
label: "Disabled Opacity",
|
|
23
27
|
description: "The opacity when the button is disabled.",
|
|
24
28
|
defaultValue: 0.8,
|
|
25
|
-
|
|
29
|
+
min: 0,
|
|
30
|
+
max: 1,
|
|
31
|
+
step: 0.01,
|
|
32
|
+
precision: 2,
|
|
33
|
+
required: false
|
|
26
34
|
}),
|
|
27
|
-
delayLongPress: (0, _types.
|
|
35
|
+
delayLongPress: (0, _types.createStaticNumberProp)({
|
|
28
36
|
label: "Delay Long Press",
|
|
29
37
|
description: "Duration (in milliseconds) from onPressIn before onLongPress is called.",
|
|
30
|
-
|
|
38
|
+
required: false
|
|
31
39
|
}),
|
|
32
|
-
hitSlop: (0, _types.
|
|
40
|
+
hitSlop: (0, _types.createStaticNumberProp)({
|
|
33
41
|
label: "Hit Slop",
|
|
34
42
|
description: "Sets additional distance outside of element in which a press can be detected.",
|
|
35
|
-
|
|
43
|
+
required: false
|
|
36
44
|
})
|
|
37
45
|
}
|
|
38
46
|
};
|
|
@@ -40,13 +48,13 @@ const SEED_DATA = [{
|
|
|
40
48
|
name: "Touchable",
|
|
41
49
|
tag: "Touchable",
|
|
42
50
|
description: "An interactive view with no styles",
|
|
43
|
-
category: _types.COMPONENT_TYPES.
|
|
51
|
+
category: _types.COMPONENT_TYPES.deprecated,
|
|
44
52
|
...SEED_DATA_PROPS
|
|
45
53
|
}, {
|
|
46
54
|
name: "Pressable",
|
|
47
55
|
tag: "Pressable",
|
|
48
56
|
description: "An interactive view with no styles",
|
|
49
|
-
category: _types.COMPONENT_TYPES.
|
|
57
|
+
category: _types.COMPONENT_TYPES.button,
|
|
50
58
|
...SEED_DATA_PROPS
|
|
51
59
|
}];
|
|
52
60
|
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 { Pressable, StyleSheet, View } from "react-native";
|
|
4
3
|
import Text from "../Text";
|
|
@@ -18,9 +17,10 @@ const AccordionItem = _ref => {
|
|
|
18
17
|
textStyles,
|
|
19
18
|
viewStyles
|
|
20
19
|
} = extractStyles(style);
|
|
21
|
-
return /*#__PURE__*/React.createElement(Pressable,
|
|
22
|
-
style: [styles.container, viewStyles]
|
|
23
|
-
|
|
20
|
+
return /*#__PURE__*/React.createElement(Pressable, {
|
|
21
|
+
style: [styles.container, viewStyles],
|
|
22
|
+
...rest
|
|
23
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
24
24
|
style: styles.row
|
|
25
25
|
}, icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
26
26
|
name: icon,
|
|
@@ -51,4 +51,25 @@ const styles = StyleSheet.create({
|
|
|
51
51
|
justifyContent: "center"
|
|
52
52
|
}
|
|
53
53
|
});
|
|
54
|
+
export default withTheme(AccordionItem);xtStyles
|
|
55
|
+
}, label))));
|
|
56
|
+
};
|
|
57
|
+
const styles = StyleSheet.create({
|
|
58
|
+
container: {
|
|
59
|
+
padding: 8
|
|
60
|
+
},
|
|
61
|
+
row: {
|
|
62
|
+
flexDirection: "row",
|
|
63
|
+
alignItems: "center",
|
|
64
|
+
paddingLeft: 8
|
|
65
|
+
},
|
|
66
|
+
item: {
|
|
67
|
+
marginVertical: 6,
|
|
68
|
+
paddingLeft: 8
|
|
69
|
+
},
|
|
70
|
+
content: {
|
|
71
|
+
flex: 1,
|
|
72
|
+
justifyContent: "center"
|
|
73
|
+
}
|
|
74
|
+
});
|
|
54
75
|
export default withTheme(AccordionItem);
|