@draftbit/core 46.2.4-7028ac.5 → 46.2.4-70e86e.10

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.
Files changed (49) hide show
  1. package/lib/commonjs/components/CardContainer.js +5 -15
  2. package/lib/commonjs/components/CircleImage.js +2 -16
  3. package/lib/commonjs/components/DeprecatedButton.js +4 -22
  4. package/lib/commonjs/components/IconButton.js +5 -22
  5. package/lib/commonjs/components/Image.js +3 -16
  6. package/lib/commonjs/components/Markdown.js +78 -0
  7. package/lib/commonjs/components/Portal/Portal.js +3 -12
  8. package/lib/commonjs/components/Portal/PortalConsumer.js +8 -10
  9. package/lib/commonjs/components/RadioButton/RadioButtonRow.js +6 -24
  10. package/lib/commonjs/components/RadioButton/context.js +1 -1
  11. package/lib/commonjs/components/StarRating.js +0 -1
  12. package/lib/commonjs/components/Switch.js +10 -23
  13. package/lib/commonjs/constants.js +1 -1
  14. package/lib/commonjs/index.js +8 -0
  15. package/lib/commonjs/mappings/Markdown.js +23 -0
  16. package/lib/commonjs/mappings/SVG.js +0 -1
  17. package/lib/module/components/Banner.js +4 -24
  18. package/lib/module/components/CardBlock.js +5 -15
  19. package/lib/module/components/Checkbox/CheckboxGroup.js +3 -17
  20. package/lib/module/components/DeprecatedCardWrapper.js +2 -19
  21. package/lib/module/components/IconButton.js +5 -22
  22. package/lib/module/components/Markdown.js +63 -0
  23. package/lib/module/components/Picker/PickerComponent.android.js +5 -23
  24. package/lib/module/components/Picker/PickerComponent.web.js +5 -23
  25. package/lib/module/components/ProgressBar.js +7 -23
  26. package/lib/module/components/StarRating.js +5 -25
  27. package/lib/module/components/Surface.js +2 -16
  28. package/lib/module/components/Text.js +10 -33
  29. package/lib/module/components/TextField.js +30 -62
  30. package/lib/module/components/Touchable.js +2 -18
  31. package/lib/module/constants.js +0 -1
  32. package/lib/module/index.js +2 -1
  33. package/lib/module/mappings/Markdown.js +14 -0
  34. package/lib/module/mappings/SVG.js +0 -1
  35. package/lib/typescript/src/components/Markdown.d.ts +6 -0
  36. package/lib/typescript/src/index.d.ts +1 -0
  37. package/lib/typescript/src/mappings/Markdown.d.ts +9 -0
  38. package/lib/typescript/src/mappings/SVG.d.ts +0 -1
  39. package/package.json +6 -4
  40. package/src/components/Markdown.js +57 -0
  41. package/src/components/Markdown.tsx +70 -0
  42. package/src/components/StarRating.js +0 -1
  43. package/src/components/StarRating.tsx +0 -1
  44. package/src/index.js +1 -0
  45. package/src/index.tsx +1 -0
  46. package/src/mappings/Markdown.js +14 -0
  47. package/src/mappings/Markdown.ts +15 -0
  48. package/src/mappings/SVG.js +0 -1
  49. package/src/mappings/SVG.ts +0 -1
@@ -1,3 +1,5 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
1
3
  import * as React from "react";
2
4
  import { View } from "react-native";
3
5
  import { checkboxGroupContext, Direction } from "./context";
@@ -25,23 +27,7 @@ const CheckboxGroup = _ref => {
25
27
  });
26
28
  }
27
29
 
28
- return /*#__PURE__*/React.createElement(View, {
29
- style: [{
30
- minHeight: 40
31
- }, style],
32
- ...rest
33
- }, /*#__PURE__*/React.createElement(Provider, {
34
- value: {
35
- values,
36
- onValueChange,
37
- direction
38
- }
39
- }, /*#__PURE__*/React.createElement(View, {
40
- style: _containerStyle
41
- }, children)));
42
- };
43
-
44
- export default CheckboxGroup;PURE__*/React.createElement(View, _extends({
30
+ return /*#__PURE__*/React.createElement(View, _extends({
45
31
  style: [{
46
32
  minHeight: 40
47
33
  }, style]
@@ -1,3 +1,5 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
1
3
  import React from "react";
2
4
  import { withTheme } from "../theming";
3
5
  import Touchable from "./Touchable";
@@ -16,25 +18,6 @@ const getWidth = numColumns => {
16
18
  };
17
19
 
18
20
  const Card = _ref => {
19
- let {
20
- numColumns = 3,
21
- children,
22
- onPress,
23
- style,
24
- ...rest
25
- } = _ref;
26
- const width = getWidth(numColumns);
27
- return /*#__PURE__*/React.createElement(Touchable, {
28
- disabled: !onPress,
29
- onPress: onPress,
30
- style: [style, {
31
- width
32
- }],
33
- ...rest
34
- }, children);
35
- };
36
-
37
- export default withTheme(Card);ef => {
38
21
  let {
39
22
  numColumns = 3,
40
23
  children,
@@ -1,3 +1,5 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
1
3
  import * as React from "react";
2
4
  import { View, StyleSheet, ActivityIndicator, Pressable, Platform } from "react-native";
3
5
  import { withTheme } from "../theming";
@@ -16,7 +18,7 @@ const IconButton = _ref => {
16
18
  ...props
17
19
  } = _ref;
18
20
  const iconColor = customColor || theme.colors.primary;
19
- return /*#__PURE__*/React.createElement(Pressable, {
21
+ return /*#__PURE__*/React.createElement(Pressable, _extends({
20
22
  onPress: onPress,
21
23
  disabled: disabled || loading,
22
24
  style: _ref2 => {
@@ -30,9 +32,8 @@ const IconButton = _ref => {
30
32
  alignItems: "center",
31
33
  justifyContent: "center"
32
34
  }, style];
33
- },
34
- ...props
35
- }, /*#__PURE__*/React.createElement(View, null, icon && !loading ? /*#__PURE__*/React.createElement(Icon, {
35
+ }
36
+ }, props), /*#__PURE__*/React.createElement(View, null, icon && !loading ? /*#__PURE__*/React.createElement(Icon, {
36
37
  name: icon,
37
38
  size: size - 2,
38
39
  color: iconColor
@@ -42,24 +43,6 @@ const IconButton = _ref => {
42
43
  }) : null));
43
44
  };
44
45
 
45
- const styles = StyleSheet.create({
46
- container: {
47
- alignItems: "center",
48
- justifyContent: "center",
49
- ...Platform.select({
50
- web: {
51
- cursor: "pointer",
52
- userSelect: "none"
53
- }
54
- })
55
- }
56
- });
57
- export default withTheme(IconButton);ement(ActivityIndicator, {
58
- size: "small",
59
- color: iconColor
60
- }) : null));
61
- };
62
-
63
46
  const styles = StyleSheet.create({
64
47
  container: {
65
48
  alignItems: "center",
@@ -0,0 +1,63 @@
1
+ import * as React from "react"; // @ts-ignore
2
+
3
+ import Markdown from "react-native-markdown-package";
4
+
5
+ const MarkdownComponent = _ref => {
6
+ let {
7
+ content
8
+ } = _ref;
9
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Markdown, {
10
+ styles: markdownStyle.collectiveMd
11
+ }, content));
12
+ };
13
+
14
+ const markdownStyle = {
15
+ singleLineMd: {
16
+ text: {
17
+ color: "blue",
18
+ textAlign: "right"
19
+ },
20
+ view: {
21
+ alignSelf: "stretch"
22
+ }
23
+ },
24
+ collectiveMd: {
25
+ heading1: {
26
+ color: "red"
27
+ },
28
+ heading2: {
29
+ color: "green",
30
+ textAlign: "right"
31
+ },
32
+ strong: {
33
+ color: "blue"
34
+ },
35
+ em: {
36
+ color: "cyan"
37
+ },
38
+ text: {
39
+ color: "black"
40
+ },
41
+ blockQuoteText: {
42
+ color: "grey"
43
+ },
44
+ blockQuoteSection: {
45
+ flexDirection: "row"
46
+ },
47
+ blockQuoteSectionBar: {
48
+ width: 3,
49
+ height: null,
50
+ backgroundColor: "#DDDDDD",
51
+ marginRight: 15
52
+ },
53
+ codeBlock: {
54
+ fontFamily: "Courier",
55
+ fontWeight: "500",
56
+ backgroundColor: "#DDDDDD"
57
+ },
58
+ tableHeader: {
59
+ backgroundColor: "grey"
60
+ }
61
+ }
62
+ };
63
+ export default MarkdownComponent;
@@ -1,3 +1,5 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
1
3
  import * as React from "react";
2
4
  import { View, StyleSheet } from "react-native";
3
5
  import omit from "lodash.omit";
@@ -8,6 +10,8 @@ import TextField from "../TextField";
8
10
  import Touchable from "../Touchable";
9
11
 
10
12
  const Picker = _ref => {
13
+ var _options$find$label, _options$find;
14
+
11
15
  let {
12
16
  style,
13
17
  options,
@@ -17,9 +21,6 @@ const Picker = _ref => {
17
21
  onValueChange: onValueChangeOverride = () => {},
18
22
  ...props
19
23
  } = _ref;
20
-
21
- var _a, _b;
22
-
23
24
  const {
24
25
  viewStyles: {
25
26
  borderRadius,
@@ -66,7 +67,7 @@ const Picker = _ref => {
66
67
  };
67
68
 
68
69
  const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
69
- 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);
70
+ const selectedLabel = selectedValue && ((_options$find$label = (_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) !== null && _options$find$label !== void 0 ? _options$find$label : selectedValue);
70
71
  return /*#__PURE__*/React.createElement(Touchable, {
71
72
  disabled: disabled,
72
73
  onPress: toggleFocus,
@@ -88,25 +89,6 @@ const Picker = _ref => {
88
89
  label: o.label,
89
90
  value: o.value,
90
91
  key: o.value
91
- }))), /*#__PURE__*/React.createElement(View, {
92
- pointerEvents: "none"
93
- }, /*#__PURE__*/React.createElement(TextField, { ...props,
94
- value: selectedLabel,
95
- placeholder: placeholder,
96
- // @ts-ignore
97
- ref: textField,
98
- disabled: disabled,
99
- // @ts-expect-error
100
- style: stylesWithoutMargin
101
- }))));
102
- };
103
-
104
- const styles = StyleSheet.create({
105
- container: {
106
- alignSelf: "stretch"
107
- }
108
- });
109
- export default withTheme(Picker); key: o.value
110
92
  }))), /*#__PURE__*/React.createElement(View, {
111
93
  pointerEvents: "none"
112
94
  }, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
@@ -1,3 +1,5 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
1
3
  import * as React from "react";
2
4
  import { View, StyleSheet } from "react-native";
3
5
  import { Picker as NativePicker } from "@react-native-picker/picker";
@@ -8,6 +10,8 @@ import TextField from "../TextField";
8
10
  import Touchable from "../Touchable";
9
11
 
10
12
  const Picker = _ref => {
13
+ var _options$find$label, _options$find;
14
+
11
15
  let {
12
16
  style,
13
17
  options,
@@ -17,9 +21,6 @@ const Picker = _ref => {
17
21
  onValueChange: onValueChangeOverride = () => {},
18
22
  ...props
19
23
  } = _ref;
20
-
21
- var _a, _b;
22
-
23
24
  const {
24
25
  viewStyles: {
25
26
  borderRadius,
@@ -66,7 +67,7 @@ const Picker = _ref => {
66
67
  };
67
68
 
68
69
  const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
69
- 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);
70
+ const selectedLabel = selectedValue && ((_options$find$label = (_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) !== null && _options$find$label !== void 0 ? _options$find$label : selectedValue);
70
71
  return /*#__PURE__*/React.createElement(Touchable, {
71
72
  disabled: disabled,
72
73
  onPress: toggleFocus,
@@ -89,25 +90,6 @@ const Picker = _ref => {
89
90
  label: o.label,
90
91
  value: o.value,
91
92
  key: o.value
92
- }))), /*#__PURE__*/React.createElement(View, {
93
- pointerEvents: "none"
94
- }, /*#__PURE__*/React.createElement(TextField, { ...props,
95
- value: selectedLabel,
96
- placeholder: placeholder,
97
- // @ts-ignore
98
- ref: textField,
99
- disabled: disabled,
100
- // @ts-expect-error
101
- style: stylesWithoutMargin
102
- }))));
103
- };
104
-
105
- const styles = StyleSheet.create({
106
- container: {
107
- alignSelf: "stretch"
108
- }
109
- });
110
- export default withTheme(Picker); key: o.value
111
93
  }))), /*#__PURE__*/React.createElement(View, {
112
94
  pointerEvents: "none"
113
95
  }, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
@@ -1,3 +1,7 @@
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
+
3
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
4
+
1
5
  import React, { Component } from "react";
2
6
  import { Animated, Easing, View, I18nManager } from "react-native";
3
7
  const INDETERMINATE_WIDTH_FACTOR = 0.3;
@@ -6,7 +10,7 @@ export default class ProgressBar extends Component {
6
10
  constructor(props) {
7
11
  super(props);
8
12
 
9
- this.handleLayout = event => {
13
+ _defineProperty(this, "handleLayout", event => {
10
14
  const {
11
15
  width = 150,
12
16
  onLayout
@@ -21,7 +25,7 @@ export default class ProgressBar extends Component {
21
25
  if (onLayout) {
22
26
  onLayout(event);
23
27
  }
24
- };
28
+ });
25
29
 
26
30
  const {
27
31
  progress: progressP = 0,
@@ -75,6 +79,7 @@ export default class ProgressBar extends Component {
75
79
  Animated[animationType](this.state.progress, { ...animationConfig,
76
80
  toValue: progress,
77
81
  velocity: 0,
82
+ //adjust this value if animation fails - velocity is required
78
83
  useNativeDriver
79
84
  }).start();
80
85
  } else {
@@ -145,27 +150,6 @@ export default class ProgressBar extends Component {
145
150
  })
146
151
  }]
147
152
  };
148
- return /*#__PURE__*/React.createElement(View, {
149
- style: [containerStyle, style],
150
- onLayout: this.handleLayout,
151
- ...restProps
152
- }, /*#__PURE__*/React.createElement(Animated.View, {
153
- style: progressStyle
154
- }), children);
155
- }
156
-
157
- }te.progress.interpolate({
158
- inputRange: [0, 1],
159
- outputRange: [innerWidth / (I18nManager.isRTL ? 2 : -2), 0]
160
- })
161
- }, {
162
- // Interpolation a temp workaround for https://github.com/facebook/react-native/issues/6278
163
- scaleX: this.state.progress.interpolate({
164
- inputRange: [0, 1],
165
- outputRange: [0.0001, 1]
166
- })
167
- }]
168
- };
169
153
  return /*#__PURE__*/React.createElement(View, _extends({
170
154
  style: [containerStyle, style],
171
155
  onLayout: this.handleLayout
@@ -1,3 +1,5 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
1
3
  import * as React from "react";
2
4
  import { View, StyleSheet, Pressable } from "react-native";
3
5
  import { withTheme } from "../theming";
@@ -32,10 +34,9 @@ const StarRating = _ref => {
32
34
  !!onPress && onPress(r);
33
35
  }, [onPress]);
34
36
  const ratingRounded = Math.round(localRating * 2) / 2;
35
- return /*#__PURE__*/React.createElement(View, {
36
- style: [styles.container, style],
37
- ...rest
38
- }, [...Array(maxStars)].map((_, i) => /*#__PURE__*/React.createElement(View, {
37
+ return /*#__PURE__*/React.createElement(View, _extends({
38
+ style: [styles.container, style]
39
+ }, rest), [...Array(maxStars)].map((_, i) => /*#__PURE__*/React.createElement(View, {
39
40
  key: i,
40
41
  style: {
41
42
  display: "flex"
@@ -56,7 +57,6 @@ const StarRating = _ref => {
56
57
  };
57
58
 
58
59
  const styles = StyleSheet.create({
59
- //comment!
60
60
  container: {
61
61
  flexDirection: "row",
62
62
  alignItems: "center"
@@ -77,24 +77,4 @@ const styles = StyleSheet.create({
77
77
  width: "50%"
78
78
  }
79
79
  });
80
- export default withTheme(StarRating);ontainer: {
81
- flexDirection: "row",
82
- alignItems: "center"
83
- },
84
- touchContainer: {
85
- display: "flex",
86
- flexDirection: "row",
87
- position: "absolute",
88
- top: 0,
89
- right: 0,
90
- left: 0,
91
- bottom: 0,
92
- zIndex: 1
93
- },
94
- pressable: {
95
- flex: 1,
96
- height: "100%",
97
- width: "50%"
98
- }
99
- });
100
80
  export default withTheme(StarRating);
@@ -1,3 +1,5 @@
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
1
3
  /* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */
2
4
  import * as React from "react";
3
5
  import { Animated, StyleSheet } from "react-native";
@@ -36,22 +38,6 @@ const Surface = _ref => {
36
38
  }
37
39
  };
38
40
 
39
- return /*#__PURE__*/React.createElement(Animated.View, { ...rest,
40
- style: [{
41
- backgroundColor: getBackgroundColor(),
42
- elevation,
43
- ...evalationStyles,
44
- ...restStyle
45
- }]
46
- }, children);
47
- };
48
-
49
- export default withTheme(Surface); overlay(elevation, colors.surface);
50
- } else {
51
- return colors.surface;
52
- }
53
- };
54
-
55
41
  return /*#__PURE__*/React.createElement(Animated.View, _extends({}, rest, {
56
42
  style: [{
57
43
  backgroundColor: getBackgroundColor(),
@@ -1,8 +1,18 @@
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
+
3
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
4
+
1
5
  import * as React from "react";
2
6
  import { Text as NativeText, I18nManager } from "react-native";
3
7
  import { withTheme } from "../theming";
4
8
 
5
9
  class Text extends React.Component {
10
+ constructor() {
11
+ super(...arguments);
12
+
13
+ _defineProperty(this, "_root", void 0);
14
+ }
15
+
6
16
  setNativeProps(args) {
7
17
  return this._root && this._root.setNativeProps(args);
8
18
  }
@@ -12,39 +22,6 @@ class Text extends React.Component {
12
22
  style,
13
23
  ...rest
14
24
  } = this.props;
15
- const writingDirection = I18nManager.isRTL ? "rtl" : "ltr";
16
- return /*#__PURE__*/React.createElement(NativeText, { ...rest,
17
- ref: c => {
18
- this._root = c;
19
- },
20
- style: [{
21
- textAlign: "left",
22
- writingDirection
23
- }, style]
24
- });
25
- }
26
-
27
- }
28
-
29
- export const BaseLink = _ref => {
30
- let {
31
- style,
32
- theme,
33
- title,
34
- ...props
35
- } = _ref;
36
- return /*#__PURE__*/React.createElement(Text, {
37
- hitSlop: 8,
38
- style: [{
39
- color: theme.colors.primary
40
- }, style],
41
- theme: theme,
42
- ...props
43
- }, title);
44
- };
45
- const Link = withTheme(BaseLink);
46
- export { Link };
47
- export default withTheme(Text);ops;
48
25
  const writingDirection = I18nManager.isRTL ? "rtl" : "ltr";
49
26
  return /*#__PURE__*/React.createElement(NativeText, _extends({}, rest, {
50
27
  ref: c => {
@@ -1,3 +1,7 @@
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
+
3
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
4
+
1
5
  import * as React from "react";
2
6
  import { View, Animated, TextInput as NativeTextInput, StyleSheet, Text, I18nManager } from "react-native";
3
7
  import { withTheme } from "../theming";
@@ -10,7 +14,8 @@ const ICON_SIZE = 24;
10
14
  class TextField extends React.Component {
11
15
  constructor() {
12
16
  super(...arguments);
13
- this.state = {
17
+
18
+ _defineProperty(this, "state", {
14
19
  labeled: new Animated.Value(this.props.value || this.props.error ? 0 : 1),
15
20
  focused: false,
16
21
  placeholder: this.props.error ? this.props.placeholder : "",
@@ -18,35 +23,36 @@ class TextField extends React.Component {
18
23
  measured: false,
19
24
  width: 0
20
25
  }
21
- };
22
- this._timer = setTimeout(() => {}, 0);
26
+ });
27
+
28
+ _defineProperty(this, "_timer", setTimeout(() => {}, 0));
23
29
 
24
- this._showPlaceholder = () => {
30
+ _defineProperty(this, "_showPlaceholder", () => {
25
31
  clearTimeout(this._timer); // Set the placeholder in a delay to offset the label animation
26
32
  // If we show it immediately, they'll overlap and look ugly
27
33
 
28
34
  this._timer = setTimeout(() => this.setState({
29
35
  placeholder: this.props.placeholder
30
36
  }), 50);
31
- };
37
+ });
32
38
 
33
- this._hidePlaceholder = () => this.setState({
39
+ _defineProperty(this, "_hidePlaceholder", () => this.setState({
34
40
  placeholder: ""
35
- });
41
+ }));
36
42
 
37
- this._restoreLabel = () => Animated.timing(this.state.labeled, {
43
+ _defineProperty(this, "_restoreLabel", () => Animated.timing(this.state.labeled, {
38
44
  toValue: 1,
39
45
  duration: FOCUS_ANIMATION_DURATION,
40
46
  useNativeDriver: true
41
- }).start();
47
+ }).start());
42
48
 
43
- this._minmizeLabel = () => Animated.timing(this.state.labeled, {
49
+ _defineProperty(this, "_minmizeLabel", () => Animated.timing(this.state.labeled, {
44
50
  toValue: 0,
45
51
  duration: BLUR_ANIMATION_DURATION,
46
52
  useNativeDriver: true
47
- }).start();
53
+ }).start());
48
54
 
49
- this._handleFocus = () => {
55
+ _defineProperty(this, "_handleFocus", () => {
50
56
  if (this.props.disabled) {
51
57
  return;
52
58
  }
@@ -54,9 +60,9 @@ class TextField extends React.Component {
54
60
  this.setState({
55
61
  focused: true
56
62
  });
57
- };
63
+ });
58
64
 
59
- this._handleBlur = () => {
65
+ _defineProperty(this, "_handleBlur", () => {
60
66
  if (this.props.disabled) {
61
67
  return;
62
68
  }
@@ -64,9 +70,9 @@ class TextField extends React.Component {
64
70
  this.setState({
65
71
  focused: false
66
72
  });
67
- };
73
+ });
68
74
 
69
- this._handleChangeText = value => {
75
+ _defineProperty(this, "_handleChangeText", value => {
70
76
  if (this.props.disabled) {
71
77
  return;
72
78
  }
@@ -82,9 +88,9 @@ class TextField extends React.Component {
82
88
  });
83
89
  this.props.onChangeText && this.props.onChangeText(value.nativeEvent.text);
84
90
  }
85
- };
91
+ });
86
92
 
87
- this._root = undefined;
93
+ _defineProperty(this, "_root", undefined);
88
94
  }
89
95
 
90
96
  static getDerivedStateFromProps(nextProps, prevState) {
@@ -135,11 +141,10 @@ class TextField extends React.Component {
135
141
  focused: !prevState.focused
136
142
  }));
137
143
  }
144
+
138
145
  /**
139
146
  * @internal
140
147
  */
141
-
142
-
143
148
  setNativeProps(args) {
144
149
  return this._root && this._root.setNativeProps(args);
145
150
  }
@@ -182,8 +187,7 @@ class TextField extends React.Component {
182
187
  roundness,
183
188
  disabledOpacity
184
189
  },
185
- render = props => /*#__PURE__*/React.createElement(NativeTextInput, { ...props
186
- }),
190
+ render = props => /*#__PURE__*/React.createElement(NativeTextInput, props),
187
191
  ...rest
188
192
  } = this.props;
189
193
  const MINIMIZED_LABEL_Y_OFFSET = -(typography.caption.lineHeight + 4);
@@ -335,9 +339,9 @@ class TextField extends React.Component {
335
339
  } = StyleSheet.flatten(style || {});
336
340
  return /*#__PURE__*/React.createElement(View, {
337
341
  style: [styles.container, styleProp]
338
- }, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, { ...leftIconProps,
342
+ }, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, _extends({}, leftIconProps, {
339
343
  style: leftIconStyle
340
- }) : null, /*#__PURE__*/React.createElement(View, {
344
+ })) : null, /*#__PURE__*/React.createElement(View, {
341
345
  style: applyStyles([containerStyle], {
342
346
  height: style === null || style === void 0 ? void 0 : style.height,
343
347
  backgroundColor: bgColor,
@@ -404,9 +408,9 @@ class TextField extends React.Component {
404
408
  style: {
405
409
  justifyContent: type === "solid" ? "center" : undefined
406
410
  }
407
- }, /*#__PURE__*/React.createElement(Icon, { ...leftIconProps,
411
+ }, /*#__PURE__*/React.createElement(Icon, _extends({}, leftIconProps, {
408
412
  style: leftIconStyle
409
- })) : null, render({
413
+ }))) : null, render({
410
414
  ref: c => {
411
415
  this._root = c;
412
416
  },
@@ -443,42 +447,6 @@ class TextField extends React.Component {
443
447
 
444
448
  }
445
449
 
446
- export default withTheme(TextField);
447
- const styles = StyleSheet.create({
448
- container: {
449
- alignSelf: "stretch"
450
- },
451
- placeholder: {
452
- position: "absolute",
453
- left: 0
454
- },
455
- underline: {
456
- position: "absolute",
457
- left: 0,
458
- right: 0,
459
- bottom: 0,
460
- height: 2
461
- },
462
- input: {
463
- flexGrow: 1,
464
- justifyContent: "center",
465
- textAlignVertical: "center",
466
- margin: 0,
467
- textAlign: I18nManager.isRTL ? "right" : "left"
468
- }
469
- }); "solid" ? MINIMIZED_LABEL_FONT_SIZE + 4 : 16
470
- }
471
- }) : null, assistiveText ? /*#__PURE__*/React.createElement(Text, {
472
- style: [{
473
- color: error ? colors.error : colors.light,
474
- marginTop: 8,
475
- marginLeft: assistiveTextLeftMargin
476
- }]
477
- }, assistiveText) : null);
478
- }
479
-
480
- }
481
-
482
450
  export default withTheme(TextField);
483
451
  const styles = StyleSheet.create({
484
452
  container: {