@draftbit/core 46.7.1 → 46.7.3
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/AnimatedCircularProgress.js +12 -1
- package/lib/commonjs/components/AvatarEdit.js +15 -4
- package/lib/commonjs/components/Button.js +33 -10
- package/lib/commonjs/components/CardBlock.js +13 -4
- package/lib/commonjs/components/CardContainer.js +13 -4
- package/lib/commonjs/components/Checkbox/Checkbox.js +22 -4
- 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/Image.js +17 -2
- package/lib/commonjs/components/Picker/Picker.js +9 -4
- package/lib/commonjs/components/Portal/PortalHost.js +44 -15
- package/lib/commonjs/components/Portal/PortalManager.js +34 -8
- package/lib/commonjs/components/ProgressBar.js +37 -7
- package/lib/commonjs/components/Slider.js +21 -4
- package/lib/commonjs/components/Surface.js +14 -2
- package/lib/commonjs/components/TextField.js +76 -28
- package/lib/commonjs/components/Touchable.js +15 -2
- package/lib/commonjs/constants.js +1 -1
- package/lib/commonjs/hooks.js +1 -2
- package/lib/commonjs/mappings/StarRating.js +6 -2
- package/lib/commonjs/utilities.js +1 -2
- package/lib/module/components/Accordion/AccordionItem.js +4 -25
- package/lib/module/components/Button.js +33 -10
- package/lib/module/components/CardBlock.js +14 -4
- package/lib/module/components/CardContainerRating.js +14 -4
- package/lib/module/components/CardContainerShortImage.js +18 -4
- package/lib/module/components/Checkbox/CheckboxGroupRow.js +24 -5
- package/lib/module/components/Checkbox/context.js +1 -1
- package/lib/module/components/CircleImage.js +16 -1
- package/lib/module/components/DeprecatedCardWrapper.js +18 -1
- package/lib/module/components/Divider.js +18 -1
- package/lib/module/components/Elevation.js +14 -2
- package/lib/module/components/FieldSearchBarFull.js +1 -2
- package/lib/module/components/FormRow.js +17 -2
- package/lib/module/components/Image.js +18 -2
- package/lib/module/components/Layout.js +42 -21
- package/lib/module/components/NumberInput.js +12 -3
- package/lib/module/components/Picker/PickerComponent.ios.js +36 -11
- package/lib/module/components/Portal/PortalConsumer.js +22 -7
- package/lib/module/components/RadioButton/RadioButton.js +13 -1
- package/lib/module/components/RadioButton/RadioButtonGroup.js +16 -2
- package/lib/module/components/RadioButton/RadioButtonRow.js +24 -5
- package/lib/module/components/Slider.js +21 -4
- package/lib/module/components/StepIndicator.js +58 -18
- package/lib/module/components/TextField.js +78 -28
- package/lib/module/components/ToggleButton.js +16 -2
- package/lib/module/components/Touchable.js +15 -2
- package/lib/module/constants.js +1 -2
- package/lib/module/mappings/FieldSearchBarFull.js +4 -1
- package/lib/module/styles/overlay.js +1 -3
- package/lib/module/utilities.js +1 -2
- package/package.json +3 -3
|
@@ -10,11 +10,7 @@ var _PortalManager = _interopRequireDefault(require("./PortalManager"));
|
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
11
|
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
12
|
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
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
14
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
15
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
16
13
|
const PortalContext = /*#__PURE__*/React.createContext(null);
|
|
17
|
-
|
|
18
14
|
/**
|
|
19
15
|
* Portal host renders all of its children `Portal` elements.
|
|
20
16
|
* For example, you can wrap a screen in `Portal.Host` to render items above the screen.
|
|
@@ -43,10 +39,10 @@ exports.PortalContext = PortalContext;
|
|
|
43
39
|
class PortalHost extends React.Component {
|
|
44
40
|
constructor() {
|
|
45
41
|
super(...arguments);
|
|
46
|
-
|
|
42
|
+
this.setManager = manager => {
|
|
47
43
|
this.manager = manager;
|
|
48
|
-
}
|
|
49
|
-
|
|
44
|
+
};
|
|
45
|
+
this.mount = children => {
|
|
50
46
|
const key = this.nextKey++;
|
|
51
47
|
if (this.manager) {
|
|
52
48
|
this.manager.mount(key, children);
|
|
@@ -58,8 +54,8 @@ class PortalHost extends React.Component {
|
|
|
58
54
|
});
|
|
59
55
|
}
|
|
60
56
|
return key;
|
|
61
|
-
}
|
|
62
|
-
|
|
57
|
+
};
|
|
58
|
+
this.update = (key, children) => {
|
|
63
59
|
if (this.manager) {
|
|
64
60
|
this.manager.update(key, children);
|
|
65
61
|
} else {
|
|
@@ -76,8 +72,8 @@ class PortalHost extends React.Component {
|
|
|
76
72
|
this.queue.push(op);
|
|
77
73
|
}
|
|
78
74
|
}
|
|
79
|
-
}
|
|
80
|
-
|
|
75
|
+
};
|
|
76
|
+
this.unmount = key => {
|
|
81
77
|
if (this.manager) {
|
|
82
78
|
this.manager.unmount(key);
|
|
83
79
|
} else {
|
|
@@ -86,10 +82,9 @@ class PortalHost extends React.Component {
|
|
|
86
82
|
key
|
|
87
83
|
});
|
|
88
84
|
}
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
_defineProperty(this, "manager", void 0);
|
|
85
|
+
};
|
|
86
|
+
this.nextKey = 0;
|
|
87
|
+
this.queue = [];
|
|
93
88
|
}
|
|
94
89
|
componentDidMount() {
|
|
95
90
|
const manager = this.manager;
|
|
@@ -128,6 +123,40 @@ class PortalHost extends React.Component {
|
|
|
128
123
|
}
|
|
129
124
|
}
|
|
130
125
|
exports.default = PortalHost;
|
|
126
|
+
PortalHost.displayName = "Portal.Host";
|
|
127
|
+
const styles = _reactNative.StyleSheet.create({
|
|
128
|
+
container: {
|
|
129
|
+
flex: 1
|
|
130
|
+
}
|
|
131
|
+
});nager.mount(action.key, action.children);
|
|
132
|
+
break;
|
|
133
|
+
case "update":
|
|
134
|
+
manager.update(action.key, action.children);
|
|
135
|
+
break;
|
|
136
|
+
case "unmount":
|
|
137
|
+
manager.unmount(action.key);
|
|
138
|
+
break;
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
render() {
|
|
144
|
+
return /*#__PURE__*/React.createElement(PortalContext.Provider, {
|
|
145
|
+
value: {
|
|
146
|
+
mount: this.mount,
|
|
147
|
+
update: this.update,
|
|
148
|
+
unmount: this.unmount
|
|
149
|
+
}
|
|
150
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
151
|
+
style: styles.container,
|
|
152
|
+
collapsable: false,
|
|
153
|
+
pointerEvents: "box-none"
|
|
154
|
+
}, this.props.children), /*#__PURE__*/React.createElement(_PortalManager.default, {
|
|
155
|
+
ref: this.setManager
|
|
156
|
+
}));
|
|
157
|
+
}
|
|
158
|
+
}
|
|
159
|
+
exports.default = PortalHost;
|
|
131
160
|
_defineProperty(PortalHost, "displayName", "Portal.Host");
|
|
132
161
|
const styles = _reactNative.StyleSheet.create({
|
|
133
162
|
container: {
|
|
@@ -8,27 +8,24 @@ var React = _interopRequireWildcard(require("react"));
|
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
9
|
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); }
|
|
10
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; }
|
|
11
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
12
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
13
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
14
11
|
/**
|
|
15
12
|
* Portal host is the component which actually renders all Portals.
|
|
16
13
|
*/
|
|
17
14
|
class PortalManager extends React.PureComponent {
|
|
18
15
|
constructor() {
|
|
19
16
|
super(...arguments);
|
|
20
|
-
|
|
17
|
+
this.state = {
|
|
21
18
|
portals: []
|
|
22
|
-
}
|
|
23
|
-
|
|
19
|
+
};
|
|
20
|
+
this.mount = (key, children) => {
|
|
24
21
|
this.setState(state => ({
|
|
25
22
|
portals: [...state.portals, {
|
|
26
23
|
key,
|
|
27
24
|
children
|
|
28
25
|
}]
|
|
29
26
|
}));
|
|
30
|
-
}
|
|
31
|
-
|
|
27
|
+
};
|
|
28
|
+
this.update = (key, children) => this.setState(state => ({
|
|
32
29
|
portals: state.portals.map(item => {
|
|
33
30
|
if (item.key === key) {
|
|
34
31
|
return {
|
|
@@ -38,6 +35,35 @@ class PortalManager extends React.PureComponent {
|
|
|
38
35
|
}
|
|
39
36
|
return item;
|
|
40
37
|
})
|
|
38
|
+
}));
|
|
39
|
+
this.unmount = key => this.setState(state => ({
|
|
40
|
+
portals: state.portals.filter(item => item.key !== key)
|
|
41
|
+
}));
|
|
42
|
+
}
|
|
43
|
+
render() {
|
|
44
|
+
return this.state.portals.map(_ref => {
|
|
45
|
+
let {
|
|
46
|
+
key,
|
|
47
|
+
children
|
|
48
|
+
} = _ref;
|
|
49
|
+
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
50
|
+
key: key,
|
|
51
|
+
collapsable: false /* Need collapsable=false here to clip the elevations, otherwise they appear above sibling components */,
|
|
52
|
+
pointerEvents: "box-none",
|
|
53
|
+
style: _reactNative.StyleSheet.absoluteFill
|
|
54
|
+
}, children);
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
exports.default = PortalManager;tate.portals.map(item => {
|
|
59
|
+
if (item.key === key) {
|
|
60
|
+
return {
|
|
61
|
+
...item,
|
|
62
|
+
children
|
|
63
|
+
};
|
|
64
|
+
}
|
|
65
|
+
return item;
|
|
66
|
+
})
|
|
41
67
|
})));
|
|
42
68
|
_defineProperty(this, "unmount", key => this.setState(state => ({
|
|
43
69
|
portals: state.portals.filter(item => item.key !== key)
|
|
@@ -8,16 +8,12 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
9
|
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); }
|
|
10
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; }
|
|
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
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
13
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
14
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
15
11
|
const INDETERMINATE_WIDTH_FACTOR = 0.3;
|
|
16
12
|
const BAR_WIDTH_ZERO_POSITION = INDETERMINATE_WIDTH_FACTOR / (1 + INDETERMINATE_WIDTH_FACTOR);
|
|
17
13
|
class ProgressBar extends _react.Component {
|
|
18
14
|
constructor(props) {
|
|
19
15
|
super(props);
|
|
20
|
-
|
|
16
|
+
this.handleLayout = event => {
|
|
21
17
|
const {
|
|
22
18
|
width = 150,
|
|
23
19
|
onLayout
|
|
@@ -30,7 +26,7 @@ class ProgressBar extends _react.Component {
|
|
|
30
26
|
if (onLayout) {
|
|
31
27
|
onLayout(event);
|
|
32
28
|
}
|
|
33
|
-
}
|
|
29
|
+
};
|
|
34
30
|
const {
|
|
35
31
|
progress: progressP = 0,
|
|
36
32
|
indeterminate = false
|
|
@@ -78,7 +74,6 @@ class ProgressBar extends _react.Component {
|
|
|
78
74
|
...animationConfig,
|
|
79
75
|
toValue: progress,
|
|
80
76
|
velocity: 0,
|
|
81
|
-
//adjust this value if animation fails - velocity is required
|
|
82
77
|
useNativeDriver
|
|
83
78
|
}).start();
|
|
84
79
|
} else {
|
|
@@ -147,6 +142,41 @@ class ProgressBar extends _react.Component {
|
|
|
147
142
|
})
|
|
148
143
|
}]
|
|
149
144
|
};
|
|
145
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
146
|
+
style: [containerStyle, style],
|
|
147
|
+
onLayout: this.handleLayout,
|
|
148
|
+
...restProps
|
|
149
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
|
|
150
|
+
style: progressStyle
|
|
151
|
+
}), children);
|
|
152
|
+
}
|
|
153
|
+
}
|
|
154
|
+
exports.default = ProgressBar;,
|
|
155
|
+
overflow: "hidden",
|
|
156
|
+
backgroundColor: unfilledColor
|
|
157
|
+
};
|
|
158
|
+
const progressStyle = {
|
|
159
|
+
backgroundColor: color,
|
|
160
|
+
// Always take up full height of container.
|
|
161
|
+
height: "100%",
|
|
162
|
+
transform: [{
|
|
163
|
+
translateX: this.state.animationValue.interpolate({
|
|
164
|
+
inputRange: [0, 1],
|
|
165
|
+
outputRange: [innerWidth * -INDETERMINATE_WIDTH_FACTOR, innerWidth]
|
|
166
|
+
})
|
|
167
|
+
}, {
|
|
168
|
+
translateX: this.state.progress.interpolate({
|
|
169
|
+
inputRange: [0, 1],
|
|
170
|
+
outputRange: [innerWidth / (_reactNative.I18nManager.isRTL ? 2 : -2), 0]
|
|
171
|
+
})
|
|
172
|
+
}, {
|
|
173
|
+
// Interpolation a temp workaround for https://github.com/facebook/react-native/issues/6278
|
|
174
|
+
scaleX: this.state.progress.interpolate({
|
|
175
|
+
inputRange: [0, 1],
|
|
176
|
+
outputRange: [0.0001, 1]
|
|
177
|
+
})
|
|
178
|
+
}]
|
|
179
|
+
};
|
|
150
180
|
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
|
|
151
181
|
style: [containerStyle, style],
|
|
152
182
|
onLayout: this.handleLayout
|
|
@@ -13,7 +13,6 @@ var _theming = require("../theming");
|
|
|
13
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
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
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
16
|
function maybeParseValue(value) {
|
|
18
17
|
if (value === undefined) {
|
|
19
18
|
return undefined;
|
|
@@ -73,9 +72,10 @@ function Slider(_ref) {
|
|
|
73
72
|
setInternalValue(newValue);
|
|
74
73
|
onValueChange(newValue);
|
|
75
74
|
};
|
|
76
|
-
return /*#__PURE__*/React.createElement(_reactNative.View,
|
|
77
|
-
style: [styles.container, style]
|
|
78
|
-
|
|
75
|
+
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
76
|
+
style: [styles.container, style],
|
|
77
|
+
...rest
|
|
78
|
+
}, leftIcon ? /*#__PURE__*/React.createElement(Icon, {
|
|
79
79
|
color: leftIconThemeColor,
|
|
80
80
|
name: leftIcon,
|
|
81
81
|
size: 24
|
|
@@ -108,4 +108,21 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
108
108
|
}
|
|
109
109
|
});
|
|
110
110
|
var _default = (0, _theming.withTheme)(Slider);
|
|
111
|
+
exports.default = _default;or: rightIconThemeColor,
|
|
112
|
+
name: rightIcon,
|
|
113
|
+
size: 24
|
|
114
|
+
}) : null);
|
|
115
|
+
}
|
|
116
|
+
const styles = _reactNative.StyleSheet.create({
|
|
117
|
+
container: {
|
|
118
|
+
height: 40,
|
|
119
|
+
flexDirection: "row",
|
|
120
|
+
alignItems: "center"
|
|
121
|
+
},
|
|
122
|
+
slider: {
|
|
123
|
+
flex: 1,
|
|
124
|
+
marginHorizontal: 12
|
|
125
|
+
}
|
|
126
|
+
});
|
|
127
|
+
var _default = (0, _theming.withTheme)(Slider);
|
|
111
128
|
exports.default = _default;
|
|
@@ -12,7 +12,8 @@ var _theming = require("../theming");
|
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
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); }
|
|
14
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; }
|
|
15
|
-
|
|
15
|
+
/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */
|
|
16
|
+
|
|
16
17
|
const Surface = _ref => {
|
|
17
18
|
let {
|
|
18
19
|
elevation: propElevation,
|
|
@@ -42,7 +43,18 @@ const Surface = _ref => {
|
|
|
42
43
|
return colors.surface;
|
|
43
44
|
}
|
|
44
45
|
};
|
|
45
|
-
return /*#__PURE__*/React.createElement(_reactNative.Animated.View,
|
|
46
|
+
return /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
47
|
+
...rest,
|
|
48
|
+
style: [{
|
|
49
|
+
backgroundColor: getBackgroundColor(),
|
|
50
|
+
elevation,
|
|
51
|
+
...evalationStyles,
|
|
52
|
+
...restStyle
|
|
53
|
+
}]
|
|
54
|
+
}, children);
|
|
55
|
+
};
|
|
56
|
+
var _default = (0, _theming.withTheme)(Surface);
|
|
57
|
+
exports.default = _default;xtends({}, rest, {
|
|
46
58
|
style: [{
|
|
47
59
|
backgroundColor: getBackgroundColor(),
|
|
48
60
|
elevation,
|
|
@@ -10,10 +10,6 @@ var _theming = require("../theming");
|
|
|
10
10
|
var _utilities = require("../utilities");
|
|
11
11
|
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
12
|
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
|
-
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); }
|
|
14
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
15
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
16
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
17
13
|
const AnimatedText = _reactNative.Animated.createAnimatedComponent(_reactNative.Text);
|
|
18
14
|
const FOCUS_ANIMATION_DURATION = 150;
|
|
19
15
|
const BLUR_ANIMATION_DURATION = 180;
|
|
@@ -21,7 +17,7 @@ const ICON_SIZE = 24;
|
|
|
21
17
|
class TextField extends React.Component {
|
|
22
18
|
constructor() {
|
|
23
19
|
super(...arguments);
|
|
24
|
-
|
|
20
|
+
this.state = {
|
|
25
21
|
nativeProps: {},
|
|
26
22
|
labeled: new _reactNative.Animated.Value(this.props.value || this.props.error ? 0 : 1),
|
|
27
23
|
focused: false,
|
|
@@ -30,47 +26,46 @@ class TextField extends React.Component {
|
|
|
30
26
|
measured: false,
|
|
31
27
|
width: 0
|
|
32
28
|
}
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
|
|
29
|
+
};
|
|
30
|
+
this._timer = setTimeout(() => {}, 0);
|
|
31
|
+
this._showPlaceholder = () => {
|
|
36
32
|
clearTimeout(this._timer);
|
|
37
|
-
|
|
38
33
|
// Set the placeholder in a delay to offset the label animation
|
|
39
34
|
// If we show it immediately, they'll overlap and look ugly
|
|
40
35
|
this._timer = setTimeout(() => this.setState({
|
|
41
36
|
placeholder: this.props.placeholder
|
|
42
37
|
}), 50);
|
|
43
|
-
}
|
|
44
|
-
|
|
38
|
+
};
|
|
39
|
+
this._hidePlaceholder = () => this.setState({
|
|
45
40
|
placeholder: ""
|
|
46
|
-
})
|
|
47
|
-
|
|
41
|
+
});
|
|
42
|
+
this._restoreLabel = () => _reactNative.Animated.timing(this.state.labeled, {
|
|
48
43
|
toValue: 1,
|
|
49
44
|
duration: FOCUS_ANIMATION_DURATION,
|
|
50
45
|
useNativeDriver: true
|
|
51
|
-
}).start()
|
|
52
|
-
|
|
46
|
+
}).start();
|
|
47
|
+
this._minmizeLabel = () => _reactNative.Animated.timing(this.state.labeled, {
|
|
53
48
|
toValue: 0,
|
|
54
49
|
duration: BLUR_ANIMATION_DURATION,
|
|
55
50
|
useNativeDriver: true
|
|
56
|
-
}).start()
|
|
57
|
-
|
|
51
|
+
}).start();
|
|
52
|
+
this._handleFocus = () => {
|
|
58
53
|
if (this.props.disabled) {
|
|
59
54
|
return;
|
|
60
55
|
}
|
|
61
56
|
this.setState({
|
|
62
57
|
focused: true
|
|
63
58
|
});
|
|
64
|
-
}
|
|
65
|
-
|
|
59
|
+
};
|
|
60
|
+
this._handleBlur = () => {
|
|
66
61
|
if (this.props.disabled) {
|
|
67
62
|
return;
|
|
68
63
|
}
|
|
69
64
|
this.setState({
|
|
70
65
|
focused: false
|
|
71
66
|
});
|
|
72
|
-
}
|
|
73
|
-
|
|
67
|
+
};
|
|
68
|
+
this._handleChangeText = value => {
|
|
74
69
|
if (this.props.disabled) {
|
|
75
70
|
return;
|
|
76
71
|
}
|
|
@@ -85,8 +80,8 @@ class TextField extends React.Component {
|
|
|
85
80
|
});
|
|
86
81
|
this.props.onChangeText && this.props.onChangeText(value.nativeEvent.text);
|
|
87
82
|
}
|
|
88
|
-
}
|
|
89
|
-
|
|
83
|
+
};
|
|
84
|
+
this._root = undefined;
|
|
90
85
|
}
|
|
91
86
|
static getDerivedStateFromProps(nextProps, prevState) {
|
|
92
87
|
return {
|
|
@@ -173,7 +168,9 @@ class TextField extends React.Component {
|
|
|
173
168
|
roundness,
|
|
174
169
|
disabledOpacity
|
|
175
170
|
},
|
|
176
|
-
render = props => /*#__PURE__*/React.createElement(_reactNative.TextInput,
|
|
171
|
+
render = props => /*#__PURE__*/React.createElement(_reactNative.TextInput, {
|
|
172
|
+
...props
|
|
173
|
+
}),
|
|
177
174
|
...rest
|
|
178
175
|
} = this.props;
|
|
179
176
|
const MINIMIZED_LABEL_Y_OFFSET = -(typography.caption.lineHeight + 4);
|
|
@@ -313,9 +310,10 @@ class TextField extends React.Component {
|
|
|
313
310
|
} = _reactNative.StyleSheet.flatten(style || {});
|
|
314
311
|
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
315
312
|
style: [styles.container, styleProp]
|
|
316
|
-
}, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon,
|
|
313
|
+
}, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, {
|
|
314
|
+
...leftIconProps,
|
|
317
315
|
style: leftIconStyle
|
|
318
|
-
})
|
|
316
|
+
}) : null, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
319
317
|
style: (0, _utilities.applyStyles)([containerStyle], {
|
|
320
318
|
height: style === null || style === void 0 ? void 0 : style.height,
|
|
321
319
|
backgroundColor: bgColor,
|
|
@@ -383,9 +381,10 @@ class TextField extends React.Component {
|
|
|
383
381
|
style: {
|
|
384
382
|
justifyContent: type === "solid" ? "center" : undefined
|
|
385
383
|
}
|
|
386
|
-
}, /*#__PURE__*/React.createElement(Icon,
|
|
384
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
385
|
+
...leftIconProps,
|
|
387
386
|
style: leftIconStyle
|
|
388
|
-
}))
|
|
387
|
+
})) : null, render({
|
|
389
388
|
ref: c => {
|
|
390
389
|
this._root = c;
|
|
391
390
|
},
|
|
@@ -423,6 +422,55 @@ class TextField extends React.Component {
|
|
|
423
422
|
}
|
|
424
423
|
var _default = (0, _theming.withTheme)(TextField);
|
|
425
424
|
exports.default = _default;
|
|
425
|
+
const styles = _reactNative.StyleSheet.create({
|
|
426
|
+
container: {
|
|
427
|
+
alignSelf: "stretch"
|
|
428
|
+
},
|
|
429
|
+
placeholder: {
|
|
430
|
+
position: "absolute",
|
|
431
|
+
left: 0
|
|
432
|
+
},
|
|
433
|
+
underline: {
|
|
434
|
+
position: "absolute",
|
|
435
|
+
left: 0,
|
|
436
|
+
right: 0,
|
|
437
|
+
bottom: 0,
|
|
438
|
+
height: 2
|
|
439
|
+
},
|
|
440
|
+
input: {
|
|
441
|
+
flexGrow: 1,
|
|
442
|
+
justifyContent: "center",
|
|
443
|
+
textAlignVertical: "center",
|
|
444
|
+
margin: 0,
|
|
445
|
+
textAlign: _reactNative.I18nManager.isRTL ? "right" : "left"
|
|
446
|
+
}
|
|
447
|
+
});_handleFocus,
|
|
448
|
+
onBlur: this._handleBlur,
|
|
449
|
+
underlineColorAndroid: "transparent",
|
|
450
|
+
style: inputStyles,
|
|
451
|
+
...rest,
|
|
452
|
+
...this.state.nativeProps,
|
|
453
|
+
value: this.state.value
|
|
454
|
+
})), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
|
|
455
|
+
name: rightIconName,
|
|
456
|
+
size: ICON_SIZE,
|
|
457
|
+
color: colors.light,
|
|
458
|
+
style: {
|
|
459
|
+
position: "absolute",
|
|
460
|
+
right: 16,
|
|
461
|
+
marginTop: type === "solid" ? MINIMIZED_LABEL_FONT_SIZE + 4 : 16
|
|
462
|
+
}
|
|
463
|
+
}) : null, assistiveText ? /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
464
|
+
style: [{
|
|
465
|
+
color: error ? colors.error : colors.light,
|
|
466
|
+
marginTop: 8,
|
|
467
|
+
marginLeft: assistiveTextLeftMargin
|
|
468
|
+
}]
|
|
469
|
+
}, assistiveText) : null);
|
|
470
|
+
}
|
|
471
|
+
}
|
|
472
|
+
var _default = (0, _theming.withTheme)(TextField);
|
|
473
|
+
exports.default = _default;
|
|
426
474
|
const styles = _reactNative.StyleSheet.create({
|
|
427
475
|
container: {
|
|
428
476
|
alignSelf: "stretch"
|
|
@@ -7,7 +7,6 @@ exports.default = Touchable;
|
|
|
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
|
function Touchable(_ref) {
|
|
12
11
|
let {
|
|
13
12
|
children,
|
|
@@ -20,8 +19,22 @@ function Touchable(_ref) {
|
|
|
20
19
|
style,
|
|
21
20
|
...props
|
|
22
21
|
} = _ref;
|
|
23
|
-
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable,
|
|
22
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, {
|
|
24
23
|
disabled: disabled,
|
|
24
|
+
onPress: onPress,
|
|
25
|
+
delayLongPress: delayLongPress ? delayLongPress : 500,
|
|
26
|
+
hitSlop: hitSlop ? hitSlop : 8,
|
|
27
|
+
style: _ref2 => {
|
|
28
|
+
let {
|
|
29
|
+
pressed
|
|
30
|
+
} = _ref2;
|
|
31
|
+
return [{
|
|
32
|
+
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1
|
|
33
|
+
}, style];
|
|
34
|
+
},
|
|
35
|
+
...props
|
|
36
|
+
}, children);
|
|
37
|
+
} disabled: disabled,
|
|
25
38
|
onPress: onPress,
|
|
26
39
|
delayLongPress: delayLongPress ? delayLongPress : 500,
|
|
27
40
|
hitSlop: hitSlop ? hitSlop : 8,
|
|
@@ -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;
|
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,9 +23,7 @@ const SEED_DATA = {
|
|
|
23
23
|
}),
|
|
24
24
|
fieldName: (0, _types.createFieldNameProp)({
|
|
25
25
|
defaultValue: "ratingValue",
|
|
26
|
-
// this is the name of the variable declared on the screen in Draftbit
|
|
27
26
|
handlerPropName: "onPress",
|
|
28
|
-
// the change handler prop in this component
|
|
29
27
|
valuePropName: "rating" // the value prop in this component
|
|
30
28
|
}),
|
|
31
29
|
|
|
@@ -50,4 +48,10 @@ const SEED_DATA = {
|
|
|
50
48
|
})
|
|
51
49
|
}
|
|
52
50
|
};
|
|
51
|
+
exports.SEED_DATA = SEED_DATA;pes.createColorProp)({
|
|
52
|
+
label: "Inactive Color",
|
|
53
|
+
defaultValue: "divider"
|
|
54
|
+
})
|
|
55
|
+
}
|
|
56
|
+
};
|
|
53
57
|
exports.SEED_DATA = SEED_DATA;
|
|
@@ -57,7 +57,6 @@ function extractBorderAndMarginStyles(style, additionalBorderStyles, additionalM
|
|
|
57
57
|
marginStyles
|
|
58
58
|
};
|
|
59
59
|
}
|
|
60
|
-
|
|
61
60
|
/**
|
|
62
61
|
* Merges a style object on top of another style object. In React Native,
|
|
63
62
|
* keys with undefined values in a style object will still override styles
|
|
@@ -90,4 +89,4 @@ function getValueForRadioButton(value) {
|
|
|
90
89
|
} else {
|
|
91
90
|
throw new Error("Invalid value: ".concat(value));
|
|
92
91
|
}
|
|
93
|
-
}
|
|
92
|
+
}}
|
|
@@ -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 { Pressable, StyleSheet, View } from "react-native";
|
|
3
4
|
import Text from "../Text";
|
|
@@ -17,10 +18,9 @@ const AccordionItem = _ref => {
|
|
|
17
18
|
textStyles,
|
|
18
19
|
viewStyles
|
|
19
20
|
} = extractStyles(style);
|
|
20
|
-
return /*#__PURE__*/React.createElement(Pressable, {
|
|
21
|
-
style: [styles.container, viewStyles]
|
|
22
|
-
|
|
23
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
21
|
+
return /*#__PURE__*/React.createElement(Pressable, _extends({
|
|
22
|
+
style: [styles.container, viewStyles]
|
|
23
|
+
}, rest), /*#__PURE__*/React.createElement(View, {
|
|
24
24
|
style: styles.row
|
|
25
25
|
}, icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
26
26
|
name: icon,
|
|
@@ -51,25 +51,4 @@ 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
|
-
});
|
|
75
54
|
export default withTheme(AccordionItem);
|