@draftbit/core 47.1.1-cbba04.2 → 47.1.1-da35d1.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/Accordion/AccordionItem.js +23 -4
- package/lib/commonjs/components/Button.js +2 -2
- package/lib/commonjs/components/CardBlock.js +13 -4
- package/lib/commonjs/components/CardContainer.js +13 -4
- package/lib/commonjs/components/CardContainerRating.js +13 -4
- package/lib/commonjs/components/CardContainerShortImage.js +15 -4
- package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js +23 -5
- package/lib/commonjs/components/Checkbox/CheckboxRow.js +23 -6
- package/lib/commonjs/components/Checkbox/context.js +1 -1
- package/lib/commonjs/components/CircleImage.js +15 -1
- package/lib/commonjs/components/Container.js +15 -4
- package/lib/commonjs/components/DeprecatedButton.js +20 -3
- package/lib/commonjs/components/DeprecatedCardWrapper.js +15 -1
- package/lib/commonjs/components/Divider.js +14 -1
- package/lib/commonjs/components/Elevation.js +14 -2
- package/lib/commonjs/components/FieldSearchBarFull.js +1 -2
- package/lib/commonjs/components/FormRow.js +16 -2
- package/lib/commonjs/components/IconButton.js +23 -6
- package/lib/commonjs/components/Image.js +17 -2
- package/lib/commonjs/components/NumberInput.js +1 -1
- package/lib/commonjs/components/Picker/PickerComponent.web.js +20 -3
- package/lib/commonjs/components/Pressable.js +2 -2
- package/lib/commonjs/components/Touchable.js +2 -2
- package/lib/commonjs/hooks.js +1 -2
- package/lib/commonjs/mappings/Button.js +2 -2
- package/lib/commonjs/mappings/FlashList.js +3 -3
- package/lib/commonjs/mappings/FlatList.js +2 -2
- package/lib/commonjs/mappings/IconButton.js +4 -6
- package/lib/commonjs/mappings/MapView.js +3 -1
- package/lib/commonjs/mappings/ScrollView.js +1 -1
- package/lib/commonjs/mappings/Touchable.js +9 -2
- package/lib/module/components/Banner.js +4 -25
- package/lib/module/components/Button.js +2 -2
- package/lib/module/components/Checkbox/context.js +1 -1
- package/lib/module/components/DeprecatedButton.js +3 -21
- package/lib/module/components/DeprecatedCardWrapper.js +1 -18
- package/lib/module/components/IconButton.js +4 -2
- package/lib/module/components/Layout.js +21 -42
- package/lib/module/components/NumberInput.js +1 -1
- package/lib/module/components/Pressable.js +4 -17
- package/lib/module/components/ProgressBar.js +7 -39
- package/lib/module/components/StarRating.js +4 -24
- package/lib/module/components/StepIndicator.js +18 -58
- package/lib/module/components/Touchable.js +2 -2
- package/lib/module/mappings/Button.js +2 -2
- package/lib/module/mappings/FlashList.js +3 -3
- package/lib/module/mappings/FlatList.js +2 -2
- package/lib/module/mappings/IconButton.js +5 -7
- package/lib/module/mappings/MapView.js +3 -1
- package/lib/module/mappings/ScrollView.js +1 -1
- package/lib/module/mappings/Touchable.js +10 -3
- package/lib/typescript/src/components/IconButton.d.ts +2 -0
- package/lib/typescript/src/components/IconButton.d.ts.map +1 -1
- package/lib/typescript/src/components/Pressable.d.ts.map +1 -1
- package/lib/typescript/src/components/Touchable.d.ts.map +1 -1
- package/lib/typescript/src/mappings/IconButton.d.ts +20 -10
- package/lib/typescript/src/mappings/IconButton.d.ts.map +1 -1
- package/lib/typescript/src/mappings/MapView.d.ts +2 -0
- package/lib/typescript/src/mappings/MapView.d.ts.map +1 -1
- package/lib/typescript/src/mappings/Touchable.d.ts +20 -0
- package/lib/typescript/src/mappings/Touchable.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/components/Button.js +1 -1
- package/src/components/Button.tsx +2 -2
- package/src/components/IconButton.js +2 -2
- package/src/components/IconButton.tsx +6 -2
- package/src/components/NumberInput.js +1 -1
- package/src/components/NumberInput.tsx +1 -1
- package/src/components/Pressable.js +1 -1
- package/src/components/Pressable.tsx +2 -2
- package/src/components/Touchable.js +1 -1
- package/src/components/Touchable.tsx +2 -2
- package/src/mappings/Button.js +2 -2
- package/src/mappings/Button.ts +2 -2
- package/src/mappings/FlashList.js +3 -3
- package/src/mappings/FlashList.ts +3 -3
- package/src/mappings/FlatList.js +2 -2
- package/src/mappings/FlatList.ts +2 -2
- package/src/mappings/IconButton.js +5 -7
- package/src/mappings/IconButton.ts +5 -7
- package/src/mappings/MapView.js +2 -0
- package/src/mappings/MapView.ts +2 -0
- package/src/mappings/ScrollView.js +1 -1
- package/src/mappings/ScrollView.ts +1 -1
- package/src/mappings/Touchable.js +10 -3
- package/src/mappings/Touchable.ts +12 -2
|
@@ -9,22 +9,23 @@ 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); }
|
|
11
11
|
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; }
|
|
12
|
-
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); }
|
|
13
12
|
const IconButton = _ref => {
|
|
14
13
|
let {
|
|
15
14
|
Icon,
|
|
16
15
|
icon,
|
|
17
16
|
color: customColor,
|
|
18
17
|
size = 32,
|
|
19
|
-
disabled
|
|
18
|
+
disabled,
|
|
20
19
|
loading = false,
|
|
21
20
|
onPress,
|
|
22
21
|
theme,
|
|
23
22
|
style,
|
|
23
|
+
activeOpacity = 0.8,
|
|
24
|
+
disabledOpacity = 0.8,
|
|
24
25
|
...props
|
|
25
26
|
} = _ref;
|
|
26
27
|
const iconColor = customColor || theme.colors.primary;
|
|
27
|
-
return /*#__PURE__*/React.createElement(_reactNative.Pressable,
|
|
28
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
|
|
28
29
|
onPress: onPress,
|
|
29
30
|
disabled: disabled || loading,
|
|
30
31
|
style: _ref2 => {
|
|
@@ -32,14 +33,15 @@ const IconButton = _ref => {
|
|
|
32
33
|
pressed
|
|
33
34
|
} = _ref2;
|
|
34
35
|
return [styles.container, {
|
|
35
|
-
opacity: pressed
|
|
36
|
+
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
|
|
36
37
|
width: size,
|
|
37
38
|
height: size,
|
|
38
39
|
alignItems: "center",
|
|
39
40
|
justifyContent: "center"
|
|
40
41
|
}, style];
|
|
41
|
-
}
|
|
42
|
-
|
|
42
|
+
},
|
|
43
|
+
...props
|
|
44
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, null, icon && !loading ? /*#__PURE__*/React.createElement(Icon, {
|
|
43
45
|
name: icon,
|
|
44
46
|
size: size - 2,
|
|
45
47
|
color: iconColor
|
|
@@ -61,4 +63,19 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
61
63
|
}
|
|
62
64
|
});
|
|
63
65
|
var _default = (0, _theming.withTheme)(IconButton);
|
|
66
|
+
exports.default = _default; }) : null));
|
|
67
|
+
};
|
|
68
|
+
const styles = _reactNative.StyleSheet.create({
|
|
69
|
+
container: {
|
|
70
|
+
alignItems: "center",
|
|
71
|
+
justifyContent: "center",
|
|
72
|
+
..._reactNative.Platform.select({
|
|
73
|
+
web: {
|
|
74
|
+
cursor: "pointer",
|
|
75
|
+
userSelect: "none"
|
|
76
|
+
}
|
|
77
|
+
})
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
var _default = (0, _theming.withTheme)(IconButton);
|
|
64
81
|
exports.default = _default;
|
|
@@ -9,7 +9,8 @@ var _reactNative = require("react-native");
|
|
|
9
9
|
var _Config = _interopRequireDefault(require("./Config"));
|
|
10
10
|
var _AspectRatio = _interopRequireDefault(require("./AspectRatio"));
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
|
|
12
|
+
/* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
|
|
13
|
+
|
|
13
14
|
const generateDimensions = _ref => {
|
|
14
15
|
let {
|
|
15
16
|
aspectRatio,
|
|
@@ -62,13 +63,27 @@ const Image = _ref2 => {
|
|
|
62
63
|
height,
|
|
63
64
|
aspectRatio
|
|
64
65
|
}]
|
|
65
|
-
}, /*#__PURE__*/_react.default.createElement(_reactNative.Image,
|
|
66
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
|
|
67
|
+
...props,
|
|
66
68
|
source: imageSource,
|
|
67
69
|
resizeMode: resizeMode,
|
|
68
70
|
style: [style, {
|
|
69
71
|
height: "100%",
|
|
70
72
|
width: "100%"
|
|
71
73
|
}]
|
|
74
|
+
}));
|
|
75
|
+
}
|
|
76
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
|
|
77
|
+
...props,
|
|
78
|
+
source: source,
|
|
79
|
+
resizeMode: resizeMode,
|
|
80
|
+
style: style
|
|
81
|
+
});
|
|
82
|
+
};
|
|
83
|
+
var _default = Image;
|
|
84
|
+
exports.default = _default; "100%",
|
|
85
|
+
width: "100%"
|
|
86
|
+
}]
|
|
72
87
|
})));
|
|
73
88
|
}
|
|
74
89
|
return /*#__PURE__*/_react.default.createElement(_reactNative.Image, _extends({}, props, {
|
|
@@ -17,7 +17,7 @@ const NumberInput = _ref => {
|
|
|
17
17
|
defaultValue,
|
|
18
18
|
...props
|
|
19
19
|
} = _ref;
|
|
20
|
-
const [currentStringNumberValue, setCurrentStringNumberValue] = (0, _react.useState)("
|
|
20
|
+
const [currentStringNumberValue, setCurrentStringNumberValue] = (0, _react.useState)("");
|
|
21
21
|
const formatValueToStringNumber = valueToFormat => {
|
|
22
22
|
if (valueToFormat != null) {
|
|
23
23
|
if ((0, _lodash.isString)(valueToFormat) && valueToFormat !== "") {
|
|
@@ -15,9 +15,7 @@ var _Touchable = _interopRequireDefault(require("../Touchable"));
|
|
|
15
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
16
|
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); }
|
|
17
17
|
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; }
|
|
18
|
-
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); }
|
|
19
18
|
const Picker = _ref => {
|
|
20
|
-
var _options$find$label, _options$find;
|
|
21
19
|
let {
|
|
22
20
|
style,
|
|
23
21
|
options,
|
|
@@ -27,6 +25,7 @@ const Picker = _ref => {
|
|
|
27
25
|
onValueChange: onValueChangeOverride = () => {},
|
|
28
26
|
...props
|
|
29
27
|
} = _ref;
|
|
28
|
+
var _a, _b;
|
|
30
29
|
const {
|
|
31
30
|
viewStyles: {
|
|
32
31
|
borderRadius,
|
|
@@ -71,7 +70,7 @@ const Picker = _ref => {
|
|
|
71
70
|
};
|
|
72
71
|
|
|
73
72
|
const stylesWithoutMargin = style && (0, _lodash.default)(_reactNative.StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
|
|
74
|
-
const selectedLabel = selectedValue && ((
|
|
73
|
+
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);
|
|
75
74
|
return /*#__PURE__*/React.createElement(_Touchable.default, {
|
|
76
75
|
disabled: disabled,
|
|
77
76
|
onPress: toggleFocus,
|
|
@@ -96,6 +95,24 @@ const Picker = _ref => {
|
|
|
96
95
|
key: o.value
|
|
97
96
|
}))), /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
98
97
|
pointerEvents: "none"
|
|
98
|
+
}, /*#__PURE__*/React.createElement(_TextField.default, {
|
|
99
|
+
...props,
|
|
100
|
+
value: selectedLabel,
|
|
101
|
+
placeholder: placeholder,
|
|
102
|
+
// @ts-ignore
|
|
103
|
+
ref: textField,
|
|
104
|
+
disabled: disabled,
|
|
105
|
+
// @ts-expect-error
|
|
106
|
+
style: stylesWithoutMargin
|
|
107
|
+
}))));
|
|
108
|
+
};
|
|
109
|
+
const styles = _reactNative.StyleSheet.create({
|
|
110
|
+
container: {
|
|
111
|
+
alignSelf: "stretch"
|
|
112
|
+
}
|
|
113
|
+
});
|
|
114
|
+
var _default = (0, _theming.withTheme)(Picker);
|
|
115
|
+
exports.default = _default;pointerEvents: "none"
|
|
99
116
|
}, /*#__PURE__*/React.createElement(_TextField.default, _extends({}, props, {
|
|
100
117
|
value: selectedLabel,
|
|
101
118
|
placeholder: placeholder
|
package/lib/commonjs/hooks.js
CHANGED
|
@@ -10,12 +10,11 @@ function usePrevious(value) {
|
|
|
10
10
|
// The ref object is a generic container whose current property is mutable
|
|
11
11
|
// and can hold any value, similar to an instance property on a class
|
|
12
12
|
const ref = _react.default.useRef();
|
|
13
|
-
|
|
14
13
|
// Store current value in ref
|
|
15
14
|
_react.default.useEffect(() => {
|
|
16
15
|
ref.current = value;
|
|
17
16
|
}, [value]);
|
|
18
|
-
|
|
19
17
|
// Return previous value (happens before update in useEffect above)
|
|
20
18
|
return ref.current;
|
|
19
|
+
}
|
|
21
20
|
}
|
|
@@ -23,7 +23,7 @@ const SEED_DATA_PROPS = {
|
|
|
23
23
|
activeOpacity: (0, _types.createStaticNumberProp)({
|
|
24
24
|
label: "Active Opacity",
|
|
25
25
|
description: "Opacity of the button when active.",
|
|
26
|
-
defaultValue:
|
|
26
|
+
defaultValue: null,
|
|
27
27
|
min: 0,
|
|
28
28
|
max: 1,
|
|
29
29
|
step: 0.01,
|
|
@@ -33,7 +33,7 @@ const SEED_DATA_PROPS = {
|
|
|
33
33
|
disabledOpacity: (0, _types.createStaticNumberProp)({
|
|
34
34
|
label: "Disabled Opacity",
|
|
35
35
|
description: "Opacity of the button when disabled.",
|
|
36
|
-
defaultValue:
|
|
36
|
+
defaultValue: null,
|
|
37
37
|
min: 0,
|
|
38
38
|
max: 1,
|
|
39
39
|
step: 0.01,
|
|
@@ -46,8 +46,8 @@ const SEED_DATA = [{
|
|
|
46
46
|
}),
|
|
47
47
|
showsHorizontalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
48
48
|
label: "Show Horizontal Scroll Indicator",
|
|
49
|
-
description: "When true, shows a horizontal scroll indicator. The default value is
|
|
50
|
-
defaultValue:
|
|
49
|
+
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
50
|
+
defaultValue: true
|
|
51
51
|
}),
|
|
52
52
|
showsVerticalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
53
53
|
label: "Show Vertical Scroll Indicator",
|
|
@@ -105,7 +105,7 @@ const SEED_DATA = [{
|
|
|
105
105
|
showsHorizontalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
106
106
|
label: "Show Horizontal Scroll Indicator",
|
|
107
107
|
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
108
|
-
defaultValue:
|
|
108
|
+
defaultValue: true
|
|
109
109
|
}),
|
|
110
110
|
showsVerticalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
111
111
|
label: "Show Vertical Scroll Indicator",
|
|
@@ -45,8 +45,8 @@ const SEED_DATA = {
|
|
|
45
45
|
}),
|
|
46
46
|
showsHorizontalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
47
47
|
label: "Show Horizontal Scroll Indicator",
|
|
48
|
-
description: "When true, shows a horizontal scroll indicator. The default value is
|
|
49
|
-
defaultValue:
|
|
48
|
+
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
49
|
+
defaultValue: true
|
|
50
50
|
}),
|
|
51
51
|
showsVerticalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
52
52
|
label: "Show Vertical Scroll Indicator",
|
|
@@ -10,26 +10,24 @@ const SEED_DATA = {
|
|
|
10
10
|
tag: "IconButton",
|
|
11
11
|
category: _types.COMPONENT_TYPES.button,
|
|
12
12
|
layout: {},
|
|
13
|
-
triggers: [_types.Triggers.OnPress],
|
|
13
|
+
triggers: [_types.Triggers.OnPress, _types.Triggers.OnLongPress],
|
|
14
14
|
stylesPanelSections: [_types.StylesPanelSections.Margins, _types.StylesPanelSections.Effects, _types.StylesPanelSections.Position],
|
|
15
15
|
props: {
|
|
16
16
|
onPress: (0, _types.createActionProp)(),
|
|
17
|
+
onLongPress: (0, _types.createActionProp)(),
|
|
18
|
+
disabled: (0, _types.createDisabledProp)(),
|
|
17
19
|
icon: (0, _types.createIconProp)(),
|
|
18
20
|
color: (0, _types.createColorProp)({
|
|
19
21
|
label: "Color",
|
|
20
22
|
group: _types.GROUPS.basic
|
|
21
23
|
}),
|
|
22
|
-
disabled: (0, _types.createBoolProp)({
|
|
23
|
-
label: "Disabled",
|
|
24
|
-
group: _types.GROUPS.basic
|
|
25
|
-
}),
|
|
26
24
|
size: (0, _types.createNumberProp)({
|
|
27
25
|
group: _types.GROUPS.basic,
|
|
28
26
|
label: "Size",
|
|
29
27
|
description: "Width and height of your icon",
|
|
30
28
|
defaultValue: 32,
|
|
31
29
|
min: 16,
|
|
32
|
-
max:
|
|
30
|
+
max: 256,
|
|
33
31
|
step: 1,
|
|
34
32
|
precision: 0
|
|
35
33
|
})
|
|
@@ -23,7 +23,7 @@ const SEED_DATA = {
|
|
|
23
23
|
showsHorizontalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
24
24
|
label: "Show Horizontal Scroll Indicator",
|
|
25
25
|
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
26
|
-
defaultValue:
|
|
26
|
+
defaultValue: true
|
|
27
27
|
}),
|
|
28
28
|
showsVerticalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
29
29
|
label: "Show Vertical Scroll Indicator",
|
|
@@ -12,10 +12,11 @@ const SEED_DATA_PROPS = {
|
|
|
12
12
|
props: {
|
|
13
13
|
onPress: (0, _types.createActionProp)(),
|
|
14
14
|
onLongPress: (0, _types.createActionProp)(),
|
|
15
|
+
disabled: (0, _types.createDisabledProp)(),
|
|
15
16
|
activeOpacity: (0, _types.createStaticNumberProp)({
|
|
16
17
|
label: "Active Opacity",
|
|
17
18
|
description: "The opacity when the button is pressed.",
|
|
18
|
-
defaultValue:
|
|
19
|
+
defaultValue: null,
|
|
19
20
|
min: 0,
|
|
20
21
|
max: 1,
|
|
21
22
|
step: 0.01,
|
|
@@ -25,7 +26,7 @@ const SEED_DATA_PROPS = {
|
|
|
25
26
|
disabledOpacity: (0, _types.createStaticNumberProp)({
|
|
26
27
|
label: "Disabled Opacity",
|
|
27
28
|
description: "The opacity when the button is disabled.",
|
|
28
|
-
defaultValue:
|
|
29
|
+
defaultValue: null,
|
|
29
30
|
min: 0,
|
|
30
31
|
max: 1,
|
|
31
32
|
step: 0.01,
|
|
@@ -41,6 +42,12 @@ const SEED_DATA_PROPS = {
|
|
|
41
42
|
label: "Hit Slop",
|
|
42
43
|
description: "Sets additional distance outside of element in which a press can be detected.",
|
|
43
44
|
required: false
|
|
45
|
+
}),
|
|
46
|
+
android_disableSound: (0, _types.createStaticBoolProp)({
|
|
47
|
+
label: "Disable Sound",
|
|
48
|
+
description: "Disable the Android sound effect.",
|
|
49
|
+
defaultValue: null,
|
|
50
|
+
group: _types.GROUPS.android
|
|
44
51
|
})
|
|
45
52
|
}
|
|
46
53
|
};
|
|
@@ -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 { Button, Text, View, StyleSheet, Animated } from "react-native";
|
|
3
4
|
import Surface from "./Surface";
|
|
@@ -60,6 +61,7 @@ const Banner = _ref => {
|
|
|
60
61
|
measured: true
|
|
61
62
|
});
|
|
62
63
|
};
|
|
64
|
+
|
|
63
65
|
// The banner animation has 2 parts:
|
|
64
66
|
// 1. Blank spacer element which animates its height to move the content
|
|
65
67
|
// 2. Actual banner which animates its translateY
|
|
@@ -69,10 +71,9 @@ const Banner = _ref => {
|
|
|
69
71
|
// However we can't animated banner's height directly as it'll also resize the content inside
|
|
70
72
|
const height = Animated.multiply(position, layout.height);
|
|
71
73
|
const translateY = Animated.multiply(Animated.add(position, -1), layout.height);
|
|
72
|
-
return /*#__PURE__*/React.createElement(Surface, {
|
|
73
|
-
...rest,
|
|
74
|
+
return /*#__PURE__*/React.createElement(Surface, _extends({}, rest, {
|
|
74
75
|
style: [styles.container, shadow(ELEVATION), style]
|
|
75
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
76
|
+
}), /*#__PURE__*/React.createElement(View, {
|
|
76
77
|
style: [styles.wrapper, contentStyle]
|
|
77
78
|
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
78
79
|
style: {
|
|
@@ -153,26 +154,4 @@ const styles = StyleSheet.create({
|
|
|
153
154
|
margin: 8
|
|
154
155
|
}
|
|
155
156
|
});
|
|
156
|
-
export default withTheme(Banner);
|
|
157
|
-
},
|
|
158
|
-
content: {
|
|
159
|
-
flexDirection: "row",
|
|
160
|
-
justifyContent: "flex-start",
|
|
161
|
-
marginHorizontal: 8,
|
|
162
|
-
marginTop: 16,
|
|
163
|
-
marginBottom: 0
|
|
164
|
-
},
|
|
165
|
-
icon: {
|
|
166
|
-
margin: 8
|
|
167
|
-
},
|
|
168
|
-
message: {
|
|
169
|
-
flex: 1,
|
|
170
|
-
margin: 8
|
|
171
|
-
},
|
|
172
|
-
actions: {
|
|
173
|
-
flexDirection: "row",
|
|
174
|
-
justifyContent: "flex-end",
|
|
175
|
-
margin: 8
|
|
176
|
-
}
|
|
177
|
-
});
|
|
178
157
|
export default withTheme(Banner);
|
|
@@ -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);
|
|
@@ -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 { withTheme } from "../theming";
|
|
3
4
|
import Touchable from "./Touchable";
|
|
@@ -12,24 +13,6 @@ const getWidth = numColumns => {
|
|
|
12
13
|
}
|
|
13
14
|
};
|
|
14
15
|
const Card = _ref => {
|
|
15
|
-
let {
|
|
16
|
-
numColumns = 3,
|
|
17
|
-
children,
|
|
18
|
-
onPress,
|
|
19
|
-
style,
|
|
20
|
-
...rest
|
|
21
|
-
} = _ref;
|
|
22
|
-
const width = getWidth(numColumns);
|
|
23
|
-
return /*#__PURE__*/React.createElement(Touchable, {
|
|
24
|
-
disabled: !onPress,
|
|
25
|
-
onPress: onPress,
|
|
26
|
-
style: [style, {
|
|
27
|
-
width
|
|
28
|
-
}],
|
|
29
|
-
...rest
|
|
30
|
-
}, children);
|
|
31
|
-
};
|
|
32
|
-
export default withTheme(Card);ef => {
|
|
33
16
|
let {
|
|
34
17
|
numColumns = 3,
|
|
35
18
|
children,
|
|
@@ -8,11 +8,13 @@ const IconButton = _ref => {
|
|
|
8
8
|
icon,
|
|
9
9
|
color: customColor,
|
|
10
10
|
size = 32,
|
|
11
|
-
disabled
|
|
11
|
+
disabled,
|
|
12
12
|
loading = false,
|
|
13
13
|
onPress,
|
|
14
14
|
theme,
|
|
15
15
|
style,
|
|
16
|
+
activeOpacity = 0.8,
|
|
17
|
+
disabledOpacity = 0.8,
|
|
16
18
|
...props
|
|
17
19
|
} = _ref;
|
|
18
20
|
const iconColor = customColor || theme.colors.primary;
|
|
@@ -24,7 +26,7 @@ const IconButton = _ref => {
|
|
|
24
26
|
pressed
|
|
25
27
|
} = _ref2;
|
|
26
28
|
return [styles.container, {
|
|
27
|
-
opacity: pressed
|
|
29
|
+
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
|
|
28
30
|
width: size,
|
|
29
31
|
height: size,
|
|
30
32
|
alignItems: "center",
|
|
@@ -1,5 +1,8 @@
|
|
|
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 } from "react-native";
|
|
4
|
+
// @ts-ignore
|
|
5
|
+
|
|
3
6
|
export function Center(_ref) {
|
|
4
7
|
let {
|
|
5
8
|
width = 240,
|
|
@@ -9,16 +12,15 @@ export function Center(_ref) {
|
|
|
9
12
|
style,
|
|
10
13
|
...rest
|
|
11
14
|
} = _ref;
|
|
12
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
15
|
+
return /*#__PURE__*/React.createElement(View, _extends({
|
|
13
16
|
style: [{
|
|
14
17
|
justifyContent: "center",
|
|
15
18
|
alignItems: "center",
|
|
16
19
|
width,
|
|
17
20
|
height,
|
|
18
21
|
backgroundColor: bgColor
|
|
19
|
-
}, style]
|
|
20
|
-
|
|
21
|
-
}, children);
|
|
22
|
+
}, style]
|
|
23
|
+
}, rest), children);
|
|
22
24
|
}
|
|
23
25
|
export function Circle(_ref2) {
|
|
24
26
|
let {
|
|
@@ -29,7 +31,7 @@ export function Circle(_ref2) {
|
|
|
29
31
|
...rest
|
|
30
32
|
} = _ref2;
|
|
31
33
|
const borderRadius = 1000;
|
|
32
|
-
return /*#__PURE__*/React.createElement(Center, {
|
|
34
|
+
return /*#__PURE__*/React.createElement(Center, _extends({
|
|
33
35
|
width: size,
|
|
34
36
|
height: size,
|
|
35
37
|
bgColor: bgColor,
|
|
@@ -37,9 +39,8 @@ export function Circle(_ref2) {
|
|
|
37
39
|
backgroundColor: bgColor,
|
|
38
40
|
borderRadius,
|
|
39
41
|
overflow: "hidden"
|
|
40
|
-
}]
|
|
41
|
-
|
|
42
|
-
}, children);
|
|
42
|
+
}]
|
|
43
|
+
}, rest), children);
|
|
43
44
|
}
|
|
44
45
|
export function Square(_ref3) {
|
|
45
46
|
let {
|
|
@@ -49,13 +50,12 @@ export function Square(_ref3) {
|
|
|
49
50
|
style,
|
|
50
51
|
...rest
|
|
51
52
|
} = _ref3;
|
|
52
|
-
return /*#__PURE__*/React.createElement(Center, {
|
|
53
|
+
return /*#__PURE__*/React.createElement(Center, _extends({
|
|
53
54
|
style: style,
|
|
54
55
|
width: size,
|
|
55
56
|
height: size,
|
|
56
|
-
bgColor: bgColor
|
|
57
|
-
|
|
58
|
-
}, children);
|
|
57
|
+
bgColor: bgColor
|
|
58
|
+
}, rest), children);
|
|
59
59
|
}
|
|
60
60
|
export function Row(_ref4) {
|
|
61
61
|
let {
|
|
@@ -65,14 +65,15 @@ export function Row(_ref4) {
|
|
|
65
65
|
style,
|
|
66
66
|
...rest
|
|
67
67
|
} = _ref4;
|
|
68
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
69
|
-
style: [style,
|
|
68
|
+
return /*#__PURE__*/React.createElement(View, _extends({
|
|
69
|
+
style: [style,
|
|
70
|
+
// style goes first b/c we can't override these
|
|
71
|
+
{
|
|
70
72
|
alignItems,
|
|
71
73
|
flexDirection: "row",
|
|
72
74
|
justifyContent: justifyContent
|
|
73
|
-
}]
|
|
74
|
-
|
|
75
|
-
}, children);
|
|
75
|
+
}]
|
|
76
|
+
}, rest), children);
|
|
76
77
|
}
|
|
77
78
|
export function Spacer(_ref5) {
|
|
78
79
|
let {
|
|
@@ -84,36 +85,14 @@ export function Spacer(_ref5) {
|
|
|
84
85
|
style,
|
|
85
86
|
...rest
|
|
86
87
|
} = _ref5;
|
|
87
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
88
|
+
return /*#__PURE__*/React.createElement(View, _extends({
|
|
88
89
|
style: [style, {
|
|
89
90
|
paddingRight: right,
|
|
90
91
|
paddingTop: top,
|
|
91
92
|
paddingLeft: left,
|
|
92
93
|
paddingBottom: bottom
|
|
93
|
-
}]
|
|
94
|
-
|
|
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);
|
|
94
|
+
}]
|
|
95
|
+
}, rest), children);
|
|
117
96
|
}
|
|
118
97
|
export function Stack(_ref6) {
|
|
119
98
|
let {
|
|
@@ -9,7 +9,7 @@ const NumberInput = _ref => {
|
|
|
9
9
|
defaultValue,
|
|
10
10
|
...props
|
|
11
11
|
} = _ref;
|
|
12
|
-
const [currentStringNumberValue, setCurrentStringNumberValue] = useState("
|
|
12
|
+
const [currentStringNumberValue, setCurrentStringNumberValue] = useState("");
|
|
13
13
|
const formatValueToStringNumber = valueToFormat => {
|
|
14
14
|
if (valueToFormat != null) {
|
|
15
15
|
if (isString(valueToFormat) && valueToFormat !== "") {
|