@draftbit/core 46.4.4-64c11a.2 → 46.4.4-682e48.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.
@@ -15,6 +15,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
15
15
 
16
16
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
17
 
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
20
  const CONSTANTS = {
19
21
  baseHeight: 42,
20
22
  borderRadius: 4,
@@ -71,7 +73,7 @@ function Base(_ref) {
71
73
  buttonStyles.justifyContent = "flex-end";
72
74
  }
73
75
 
74
- return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
76
+ return /*#__PURE__*/React.createElement(_reactNative.Pressable, _extends({
75
77
  onPress: onPress,
76
78
  disabled: disabled || loading,
77
79
  style: _ref2 => {
@@ -81,9 +83,8 @@ function Base(_ref) {
81
83
  return [styles.base, {
82
84
  opacity: pressed || disabled ? 0.75 : 1
83
85
  }, buttonStyles];
84
- },
85
- ...props
86
- }, loading ? /*#__PURE__*/React.createElement(_reactNative.ActivityIndicator, {
86
+ }
87
+ }, props), loading ? /*#__PURE__*/React.createElement(_reactNative.ActivityIndicator, {
87
88
  size: "small",
88
89
  color: color,
89
90
  style: styles.loading
@@ -103,14 +104,13 @@ const Solid = _ref3 => {
103
104
  theme,
104
105
  ...props
105
106
  } = _ref3;
106
- return /*#__PURE__*/React.createElement(Base, {
107
+ return /*#__PURE__*/React.createElement(Base, _extends({
107
108
  style: [{
108
109
  color: "#FFF",
109
110
  borderRadius: theme.roundness,
110
111
  backgroundColor: theme.colors.primary
111
- }, style],
112
- ...props
113
- });
112
+ }, style]
113
+ }, props));
114
114
  };
115
115
 
116
116
  const ButtonSolid = (0, _theming.withTheme)(Solid);
@@ -124,14 +124,13 @@ const Outline = _ref4 => {
124
124
  theme,
125
125
  ...props
126
126
  } = _ref4;
127
- return /*#__PURE__*/React.createElement(Base, {
127
+ return /*#__PURE__*/React.createElement(Base, _extends({
128
128
  style: [styles.outline, {
129
129
  borderRadius: theme.roundness,
130
130
  borderColor: theme.colors.primary,
131
131
  color: theme.colors.primary
132
- }, style],
133
- ...props
134
- });
132
+ }, style]
133
+ }, props));
135
134
  };
136
135
 
137
136
  const ButtonOutline = (0, _theming.withTheme)(Outline);
@@ -179,24 +178,4 @@ const styles = _reactNative.StyleSheet.create({
179
178
  }
180
179
  })
181
180
  }
182
- });nsparent",
183
- padding: 0,
184
- minHeight: undefined
185
- },
186
- loading: {
187
- marginRight: 6
188
- },
189
- icon: { ..._reactNative.Platform.select({
190
- web: {
191
- marginTop: 1,
192
- marginRight: 4,
193
- alignSelf: "center"
194
- },
195
- default: {
196
- marginBottom: 2,
197
- marginRight: 4,
198
- alignSelf: "center"
199
- }
200
- })
201
- }
202
181
  });
@@ -24,10 +24,14 @@ class Text extends React.Component {
24
24
  super(...arguments);
25
25
 
26
26
  _defineProperty(this, "_root", void 0);
27
+
28
+ _defineProperty(this, "state", {
29
+ nativeProps: {}
30
+ });
27
31
  }
28
32
 
29
33
  setNativeProps(args) {
30
- return this._root && this._root.setNativeProps(args);
34
+ this.state.nativeProps = args || {};
31
35
  }
32
36
 
33
37
  render() {
@@ -36,7 +40,7 @@ class Text extends React.Component {
36
40
  ...rest
37
41
  } = this.props;
38
42
  const writingDirection = _reactNative.I18nManager.isRTL ? "rtl" : "ltr";
39
- return /*#__PURE__*/React.createElement(_reactNative.Text, _extends({}, rest, {
43
+ return /*#__PURE__*/React.createElement(_reactNative.Text, _extends({}, rest, this.state.nativeProps, {
40
44
  ref: c => {
41
45
  this._root = c;
42
46
  },
@@ -32,6 +32,7 @@ class TextField extends React.Component {
32
32
  super(...arguments);
33
33
 
34
34
  _defineProperty(this, "state", {
35
+ nativeProps: {},
35
36
  labeled: new _reactNative.Animated.Value(this.props.value || this.props.error ? 0 : 1),
36
37
  focused: false,
37
38
  placeholder: this.props.error ? this.props.placeholder : "",
@@ -162,7 +163,9 @@ class TextField extends React.Component {
162
163
  * @internal
163
164
  */
164
165
  setNativeProps(args) {
165
- return this._root && this._root.setNativeProps(args);
166
+ this.setState(state => ({ ...state,
167
+ nativeState: args || {}
168
+ }));
166
169
  }
167
170
 
168
171
  isFocused() {
@@ -444,6 +447,7 @@ class TextField extends React.Component {
444
447
  underlineColorAndroid: "transparent",
445
448
  style: inputStyles,
446
449
  ...rest,
450
+ ...this.state.nativeProps,
447
451
  value: this.state.value
448
452
  })), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
449
453
  name: rightIconName,
@@ -12,17 +12,7 @@ const SEED_DATA = {
12
12
  tag: "AudioPlayer",
13
13
  description: "Given a source URL, plays sounds & audio!",
14
14
  category: _types.COMPONENT_TYPES.media,
15
- stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position],
16
- layout: {
17
- backgroundColor: "#eee",
18
- paddingLeft: 16,
19
- paddingRight: 16,
20
- paddingTop: 8,
21
- paddingBottom: 8,
22
- borderRadius: 24,
23
- flexDirection: "row",
24
- alignItems: "center"
25
- },
15
+ layout: {},
26
16
  props: {
27
17
  source: {
28
18
  group: _types.GROUPS.data,
@@ -33,23 +23,7 @@ const SEED_DATA = {
33
23
  defaultValue: "https://static.draftbit.com/audio/intro-to-draftbit-audio.mp3",
34
24
  formType: _types.FORM_TYPES.sourceUrl,
35
25
  propType: _types.PROP_TYPES.OBJECT
36
- },
37
- sliderColor: (0, _types.createColorProp)({
38
- label: "Thumb Color",
39
- defaultValue: "black"
40
- }),
41
- completedTrackColor: (0, _types.createColorProp)({
42
- label: "Completed Track Color",
43
- defaultValue: "white"
44
- }),
45
- remainingTrackColor: (0, _types.createColorProp)({
46
- label: "Remaining Track Color",
47
- defaultValue: "#333333"
48
- }),
49
- trackThumbSize: (0, _types.createNumberProp)({
50
- label: "Thumb Size",
51
- defaultValue: 24
52
- })
26
+ }
53
27
  }
54
28
  };
55
29
  exports.SEED_DATA = SEED_DATA;
@@ -24,7 +24,7 @@ const SEED_DATA_PROPS = {
24
24
  description: "Can automatically capitalize sentences, words, and characters (Default: none).",
25
25
  editable: true,
26
26
  required: false,
27
- defaultValue: null,
27
+ defaultValue: "none",
28
28
  options: ["none", "sentences", "words", "characters"],
29
29
  formType: _types.FORM_TYPES.flatArray,
30
30
  propType: _types.PROP_TYPES.STRING
@@ -103,7 +103,7 @@ const SEED_DATA = [{
103
103
  description: "Can automatically capitalize sentences, words, and characters (Default: none).",
104
104
  editable: true,
105
105
  required: false,
106
- defaultValue: null,
106
+ defaultValue: "none",
107
107
  options: ["none", "sentences", "words", "characters"],
108
108
  formType: _types.FORM_TYPES.flatArray,
109
109
  propType: _types.PROP_TYPES.STRING
@@ -1,5 +1,3 @@
1
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
-
3
1
  import * as React from "react";
4
2
  import { ActivityIndicator, View, Text, StyleSheet } from "react-native";
5
3
  import color from "color";
@@ -107,7 +105,7 @@ const Button = _ref => {
107
105
  alignSelf: "stretch",
108
106
  ...margins
109
107
  }
110
- }, /*#__PURE__*/React.createElement(Touchable, _extends({}, rest, {
108
+ }, /*#__PURE__*/React.createElement(Touchable, { ...rest,
111
109
  onPress: onPress,
112
110
  accessibilityState: {
113
111
  disabled
@@ -115,7 +113,7 @@ const Button = _ref => {
115
113
  accessibilityRole: "button",
116
114
  disabled: disabled || loading,
117
115
  style: [styles.button, buttonStyle, innerStyles]
118
- }), /*#__PURE__*/React.createElement(View, {
116
+ }, /*#__PURE__*/React.createElement(View, {
119
117
  style: styles.content
120
118
  }, icon && loading !== true ? /*#__PURE__*/React.createElement(View, {
121
119
  style: iconStyle
@@ -133,6 +131,25 @@ const Button = _ref => {
133
131
  }, children))));
134
132
  };
135
133
 
134
+ const styles = StyleSheet.create({
135
+ button: {
136
+ minWidth: 64,
137
+ borderStyle: "solid"
138
+ },
139
+ content: {
140
+ flexDirection: "row",
141
+ alignItems: "center",
142
+ justifyContent: "center"
143
+ },
144
+ icon: {
145
+ width: Config.buttonIconSize
146
+ }
147
+ });
148
+ export default withTheme(Button);ines: 1,
149
+ style: [textStyle, typography.button]
150
+ }, children))));
151
+ };
152
+
136
153
  const styles = StyleSheet.create({
137
154
  button: {
138
155
  minWidth: 64,
@@ -1,5 +1,3 @@
1
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
-
3
1
  /* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
4
2
  import React from "react";
5
3
  import { Image as NativeImage, StyleSheet } from "react-native";
@@ -64,7 +62,24 @@ const Image = _ref2 => {
64
62
  height,
65
63
  aspectRatio
66
64
  }]
67
- }, /*#__PURE__*/React.createElement(NativeImage, _extends({}, props, {
65
+ }, /*#__PURE__*/React.createElement(NativeImage, { ...props,
66
+ source: imageSource,
67
+ resizeMode: resizeMode,
68
+ style: [style, {
69
+ height: "100%",
70
+ width: "100%"
71
+ }]
72
+ }));
73
+ }
74
+
75
+ return /*#__PURE__*/React.createElement(NativeImage, { ...props,
76
+ source: source,
77
+ resizeMode: resizeMode,
78
+ style: style
79
+ });
80
+ };
81
+
82
+ export default Image;ent(NativeImage, _extends({}, props, {
68
83
  source: imageSource,
69
84
  resizeMode: resizeMode,
70
85
  style: [style, {
@@ -11,10 +11,14 @@ class Text extends React.Component {
11
11
  super(...arguments);
12
12
 
13
13
  _defineProperty(this, "_root", void 0);
14
+
15
+ _defineProperty(this, "state", {
16
+ nativeProps: {}
17
+ });
14
18
  }
15
19
 
16
20
  setNativeProps(args) {
17
- return this._root && this._root.setNativeProps(args);
21
+ this.state.nativeProps = args || {};
18
22
  }
19
23
 
20
24
  render() {
@@ -23,7 +27,7 @@ class Text extends React.Component {
23
27
  ...rest
24
28
  } = this.props;
25
29
  const writingDirection = I18nManager.isRTL ? "rtl" : "ltr";
26
- return /*#__PURE__*/React.createElement(NativeText, _extends({}, rest, {
30
+ return /*#__PURE__*/React.createElement(NativeText, _extends({}, rest, this.state.nativeProps, {
27
31
  ref: c => {
28
32
  this._root = c;
29
33
  },
@@ -16,6 +16,7 @@ class TextField extends React.Component {
16
16
  super(...arguments);
17
17
 
18
18
  _defineProperty(this, "state", {
19
+ nativeProps: {},
19
20
  labeled: new Animated.Value(this.props.value || this.props.error ? 0 : 1),
20
21
  focused: false,
21
22
  placeholder: this.props.error ? this.props.placeholder : "",
@@ -146,7 +147,9 @@ class TextField extends React.Component {
146
147
  * @internal
147
148
  */
148
149
  setNativeProps(args) {
149
- return this._root && this._root.setNativeProps(args);
150
+ this.setState(state => ({ ...state,
151
+ nativeState: args || {}
152
+ }));
150
153
  }
151
154
 
152
155
  isFocused() {
@@ -426,6 +429,7 @@ class TextField extends React.Component {
426
429
  underlineColorAndroid: "transparent",
427
430
  style: inputStyles,
428
431
  ...rest,
432
+ ...this.state.nativeProps,
429
433
  value: this.state.value
430
434
  })), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
431
435
  name: rightIconName,
@@ -1,20 +1,10 @@
1
- import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, StylesPanelSections, createColorProp, createNumberProp } from "@draftbit/types";
1
+ import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES } from "@draftbit/types";
2
2
  export const SEED_DATA = {
3
3
  name: "Audio Player",
4
4
  tag: "AudioPlayer",
5
5
  description: "Given a source URL, plays sounds & audio!",
6
6
  category: COMPONENT_TYPES.media,
7
- stylesPanelSections: [StylesPanelSections.Typography, StylesPanelSections.Background, StylesPanelSections.Borders, StylesPanelSections.Size, StylesPanelSections.MarginsAndPaddings, StylesPanelSections.Position],
8
- layout: {
9
- backgroundColor: "#eee",
10
- paddingLeft: 16,
11
- paddingRight: 16,
12
- paddingTop: 8,
13
- paddingBottom: 8,
14
- borderRadius: 24,
15
- flexDirection: "row",
16
- alignItems: "center"
17
- },
7
+ layout: {},
18
8
  props: {
19
9
  source: {
20
10
  group: GROUPS.data,
@@ -25,22 +15,6 @@ export const SEED_DATA = {
25
15
  defaultValue: "https://static.draftbit.com/audio/intro-to-draftbit-audio.mp3",
26
16
  formType: FORM_TYPES.sourceUrl,
27
17
  propType: PROP_TYPES.OBJECT
28
- },
29
- sliderColor: createColorProp({
30
- label: "Thumb Color",
31
- defaultValue: "black"
32
- }),
33
- completedTrackColor: createColorProp({
34
- label: "Completed Track Color",
35
- defaultValue: "white"
36
- }),
37
- remainingTrackColor: createColorProp({
38
- label: "Remaining Track Color",
39
- defaultValue: "#333333"
40
- }),
41
- trackThumbSize: createNumberProp({
42
- label: "Thumb Size",
43
- defaultValue: 24
44
- })
18
+ }
45
19
  }
46
20
  };
@@ -16,7 +16,7 @@ const SEED_DATA_PROPS = {
16
16
  description: "Can automatically capitalize sentences, words, and characters (Default: none).",
17
17
  editable: true,
18
18
  required: false,
19
- defaultValue: null,
19
+ defaultValue: "none",
20
20
  options: ["none", "sentences", "words", "characters"],
21
21
  formType: FORM_TYPES.flatArray,
22
22
  propType: PROP_TYPES.STRING
@@ -94,7 +94,7 @@ export const SEED_DATA = [{
94
94
  description: "Can automatically capitalize sentences, words, and characters (Default: none).",
95
95
  editable: true,
96
96
  required: false,
97
- defaultValue: null,
97
+ defaultValue: "none",
98
98
  options: ["none", "sentences", "words", "characters"],
99
99
  formType: FORM_TYPES.flatArray,
100
100
  propType: PROP_TYPES.STRING
@@ -6,7 +6,8 @@ declare type Props = {
6
6
  } & TextProps;
7
7
  declare class Text extends React.Component<Props> {
8
8
  _root: any;
9
- setNativeProps(args: TextProps): any;
9
+ state: any;
10
+ setNativeProps(args: TextProps): void;
10
11
  render(): JSX.Element;
11
12
  }
12
13
  export declare const BaseLink: ({ style, theme, title, ...props }: any) => JSX.Element;
@@ -27,6 +27,7 @@ export declare type Props = {
27
27
  }) => React.ReactNode;
28
28
  } & TextInputProps & IconSlot;
29
29
  interface State {
30
+ nativeProps: any;
30
31
  labeled: Animated.Value;
31
32
  focused?: boolean;
32
33
  placeholder?: string | undefined;
@@ -57,7 +58,7 @@ declare class TextField extends React.Component<Props, State> {
57
58
  /**
58
59
  * @internal
59
60
  */
60
- setNativeProps(args: Props): void | undefined;
61
+ setNativeProps(args: Props): void;
61
62
  isFocused(): boolean | undefined;
62
63
  clear(): void | undefined;
63
64
  focus(): void | undefined;
@@ -3,17 +3,7 @@ export declare const SEED_DATA: {
3
3
  tag: string;
4
4
  description: string;
5
5
  category: string;
6
- stylesPanelSections: string[];
7
- layout: {
8
- backgroundColor: string;
9
- paddingLeft: number;
10
- paddingRight: number;
11
- paddingTop: number;
12
- paddingBottom: number;
13
- borderRadius: number;
14
- flexDirection: string;
15
- alignItems: string;
16
- };
6
+ layout: {};
17
7
  props: {
18
8
  source: {
19
9
  group: string;
@@ -25,46 +15,5 @@ export declare const SEED_DATA: {
25
15
  formType: string;
26
16
  propType: string;
27
17
  };
28
- sliderColor: {
29
- group: string;
30
- label: string;
31
- description: string;
32
- editable: boolean;
33
- required: boolean;
34
- defaultValue: null;
35
- formType: string;
36
- propType: string;
37
- };
38
- completedTrackColor: {
39
- group: string;
40
- label: string;
41
- description: string;
42
- editable: boolean;
43
- required: boolean;
44
- defaultValue: null;
45
- formType: string;
46
- propType: string;
47
- };
48
- remainingTrackColor: {
49
- group: string;
50
- label: string;
51
- description: string;
52
- editable: boolean;
53
- required: boolean;
54
- defaultValue: null;
55
- formType: string;
56
- propType: string;
57
- };
58
- trackThumbSize: {
59
- label: string;
60
- description: string;
61
- formType: string;
62
- propType: string;
63
- group: string;
64
- defaultValue: null;
65
- editable: boolean;
66
- required: boolean;
67
- step: number;
68
- };
69
18
  };
70
19
  };
@@ -64,7 +64,7 @@ export declare const SEED_DATA: ({
64
64
  description: string;
65
65
  editable: boolean;
66
66
  required: boolean;
67
- defaultValue: null;
67
+ defaultValue: string;
68
68
  options: string[];
69
69
  formType: string;
70
70
  propType: string;
@@ -371,7 +371,7 @@ export declare const SEED_DATA: ({
371
371
  description: string;
372
372
  editable: boolean;
373
373
  required: boolean;
374
- defaultValue: null;
374
+ defaultValue: string;
375
375
  options: string[];
376
376
  formType: string;
377
377
  propType: string;
@@ -229,7 +229,7 @@ export declare const SEED_DATA: {
229
229
  description: string;
230
230
  editable: boolean;
231
231
  required: boolean;
232
- defaultValue: null;
232
+ defaultValue: string;
233
233
  options: string[];
234
234
  formType: string;
235
235
  propType: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "46.4.4-64c11a.2+64c11a6",
3
+ "version": "46.4.4-682e48.2+682e481",
4
4
  "description": "Core (non-native) Components",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "module": "lib/module/index.js",
@@ -41,7 +41,7 @@
41
41
  "dependencies": {
42
42
  "@date-io/date-fns": "^1.3.13",
43
43
  "@draftbit/react-theme-provider": "^2.1.1",
44
- "@draftbit/types": "^46.4.4-64c11a.2+64c11a6",
44
+ "@draftbit/types": "^46.4.4-682e48.2+682e481",
45
45
  "@material-ui/core": "^4.11.0",
46
46
  "@material-ui/pickers": "^3.2.10",
47
47
  "@react-native-community/slider": "4.2.3",
@@ -81,5 +81,5 @@
81
81
  ]
82
82
  ]
83
83
  },
84
- "gitHead": "64c11a6d42bef20b500a03e6ca52f5ad693d569f"
84
+ "gitHead": "682e481a60b8c266d9f8ecdbe5154da512dff3ec"
85
85
  }
@@ -2,13 +2,19 @@ import * as React from "react";
2
2
  import { Text as NativeText, I18nManager } from "react-native";
3
3
  import { withTheme } from "../theming";
4
4
  class Text extends React.Component {
5
+ constructor() {
6
+ super(...arguments);
7
+ this.state = {
8
+ nativeProps: {},
9
+ };
10
+ }
5
11
  setNativeProps(args) {
6
- return this._root && this._root.setNativeProps(args);
12
+ this.state.nativeProps = args || {};
7
13
  }
8
14
  render() {
9
15
  const { style, ...rest } = this.props;
10
16
  const writingDirection = I18nManager.isRTL ? "rtl" : "ltr";
11
- return (React.createElement(NativeText, { ...rest, ref: (c) => {
17
+ return (React.createElement(NativeText, { ...rest, ...this.state.nativeProps, ref: (c) => {
12
18
  this._root = c;
13
19
  }, style: [
14
20
  {
@@ -10,8 +10,12 @@ type Props = {
10
10
  class Text extends React.Component<Props> {
11
11
  _root: any;
12
12
 
13
+ state: any = {
14
+ nativeProps: {},
15
+ };
16
+
13
17
  setNativeProps(args: TextProps) {
14
- return this._root && this._root.setNativeProps(args);
18
+ this.state.nativeProps = args || {};
15
19
  }
16
20
 
17
21
  render() {
@@ -21,6 +25,7 @@ class Text extends React.Component<Props> {
21
25
  return (
22
26
  <NativeText
23
27
  {...rest}
28
+ {...this.state.nativeProps}
24
29
  ref={(c) => {
25
30
  this._root = c;
26
31
  }}
@@ -10,6 +10,7 @@ class TextField extends React.Component {
10
10
  constructor() {
11
11
  super(...arguments);
12
12
  this.state = {
13
+ nativeProps: {},
13
14
  labeled: new Animated.Value(this.props.value || this.props.error ? 0 : 1),
14
15
  focused: false,
15
16
  placeholder: this.props.error ? this.props.placeholder : "",
@@ -121,7 +122,10 @@ class TextField extends React.Component {
121
122
  * @internal
122
123
  */
123
124
  setNativeProps(args) {
124
- return this._root && this._root.setNativeProps(args);
125
+ this.setState((state) => ({
126
+ ...state,
127
+ nativeState: args || {},
128
+ }));
125
129
  }
126
130
  isFocused() {
127
131
  return this._root && this._root.isFocused();
@@ -381,6 +385,7 @@ class TextField extends React.Component {
381
385
  underlineColorAndroid: "transparent",
382
386
  style: inputStyles,
383
387
  ...rest,
388
+ ...this.state.nativeProps,
384
389
  value: this.state.value,
385
390
  })),
386
391
  rightIconName ? (React.createElement(Icon, { name: rightIconName, size: ICON_SIZE, color: colors.light, style: {
@@ -52,6 +52,7 @@ export type Props = {
52
52
  IconSlot;
53
53
 
54
54
  interface State {
55
+ nativeProps: any;
55
56
  labeled: Animated.Value;
56
57
  focused?: boolean;
57
58
  placeholder?: string | undefined;
@@ -73,6 +74,7 @@ class TextField extends React.Component<Props, State> {
73
74
  }
74
75
 
75
76
  state: State = {
77
+ nativeProps: {},
76
78
  labeled: new Animated.Value(this.props.value || this.props.error ? 0 : 1),
77
79
  focused: false,
78
80
  placeholder: this.props.error ? this.props.placeholder : "",
@@ -207,7 +209,10 @@ class TextField extends React.Component<Props, State> {
207
209
  * @internal
208
210
  */
209
211
  setNativeProps(args: Props) {
210
- return this._root && this._root.setNativeProps(args);
212
+ this.setState((state) => ({
213
+ ...state,
214
+ nativeState: args || {},
215
+ }));
211
216
  }
212
217
 
213
218
  isFocused() {
@@ -566,6 +571,7 @@ class TextField extends React.Component<Props, State> {
566
571
  underlineColorAndroid: "transparent",
567
572
  style: inputStyles,
568
573
  ...rest,
574
+ ...this.state.nativeProps,
569
575
  value: this.state.value,
570
576
  })}
571
577
  </View>
@@ -1,27 +1,10 @@
1
- import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, StylesPanelSections, createColorProp, createNumberProp, } from "@draftbit/types";
1
+ import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, } from "@draftbit/types";
2
2
  export const SEED_DATA = {
3
3
  name: "Audio Player",
4
4
  tag: "AudioPlayer",
5
5
  description: "Given a source URL, plays sounds & audio!",
6
6
  category: COMPONENT_TYPES.media,
7
- stylesPanelSections: [
8
- StylesPanelSections.Typography,
9
- StylesPanelSections.Background,
10
- StylesPanelSections.Borders,
11
- StylesPanelSections.Size,
12
- StylesPanelSections.MarginsAndPaddings,
13
- StylesPanelSections.Position,
14
- ],
15
- layout: {
16
- backgroundColor: "#eee",
17
- paddingLeft: 16,
18
- paddingRight: 16,
19
- paddingTop: 8,
20
- paddingBottom: 8,
21
- borderRadius: 24,
22
- flexDirection: "row",
23
- alignItems: "center",
24
- },
7
+ layout: {},
25
8
  props: {
26
9
  source: {
27
10
  group: GROUPS.data,
@@ -33,21 +16,5 @@ export const SEED_DATA = {
33
16
  formType: FORM_TYPES.sourceUrl,
34
17
  propType: PROP_TYPES.OBJECT,
35
18
  },
36
- sliderColor: createColorProp({
37
- label: "Thumb Color",
38
- defaultValue: "black",
39
- }),
40
- completedTrackColor: createColorProp({
41
- label: "Completed Track Color",
42
- defaultValue: "white",
43
- }),
44
- remainingTrackColor: createColorProp({
45
- label: "Remaining Track Color",
46
- defaultValue: "#333333",
47
- }),
48
- trackThumbSize: createNumberProp({
49
- label: "Thumb Size",
50
- defaultValue: 24,
51
- }),
52
19
  },
53
20
  };
@@ -3,9 +3,6 @@ import {
3
3
  COMPONENT_TYPES,
4
4
  FORM_TYPES,
5
5
  PROP_TYPES,
6
- StylesPanelSections,
7
- createColorProp,
8
- createNumberProp,
9
6
  } from "@draftbit/types";
10
7
 
11
8
  export const SEED_DATA = {
@@ -13,24 +10,7 @@ export const SEED_DATA = {
13
10
  tag: "AudioPlayer",
14
11
  description: "Given a source URL, plays sounds & audio!",
15
12
  category: COMPONENT_TYPES.media,
16
- stylesPanelSections: [
17
- StylesPanelSections.Typography,
18
- StylesPanelSections.Background,
19
- StylesPanelSections.Borders,
20
- StylesPanelSections.Size,
21
- StylesPanelSections.MarginsAndPaddings,
22
- StylesPanelSections.Position,
23
- ],
24
- layout: {
25
- backgroundColor: "#eee",
26
- paddingLeft: 16,
27
- paddingRight: 16,
28
- paddingTop: 8,
29
- paddingBottom: 8,
30
- borderRadius: 24,
31
- flexDirection: "row",
32
- alignItems: "center",
33
- },
13
+ layout: {},
34
14
  props: {
35
15
  source: {
36
16
  group: GROUPS.data,
@@ -43,21 +23,5 @@ export const SEED_DATA = {
43
23
  formType: FORM_TYPES.sourceUrl,
44
24
  propType: PROP_TYPES.OBJECT,
45
25
  },
46
- sliderColor: createColorProp({
47
- label: "Thumb Color",
48
- defaultValue: "black",
49
- }),
50
- completedTrackColor: createColorProp({
51
- label: "Completed Track Color",
52
- defaultValue: "white",
53
- }),
54
- remainingTrackColor: createColorProp({
55
- label: "Remaining Track Color",
56
- defaultValue: "#333333",
57
- }),
58
- trackThumbSize: createNumberProp({
59
- label: "Thumb Size",
60
- defaultValue: 24,
61
- }),
62
26
  },
63
27
  };
@@ -16,7 +16,7 @@ const SEED_DATA_PROPS = {
16
16
  description: "Can automatically capitalize sentences, words, and characters (Default: none).",
17
17
  editable: true,
18
18
  required: false,
19
- defaultValue: null,
19
+ defaultValue: "none",
20
20
  options: ["none", "sentences", "words", "characters"],
21
21
  formType: FORM_TYPES.flatArray,
22
22
  propType: PROP_TYPES.STRING,
@@ -30,7 +30,7 @@ const SEED_DATA_PROPS = {
30
30
  "Can automatically capitalize sentences, words, and characters (Default: none).",
31
31
  editable: true,
32
32
  required: false,
33
- defaultValue: null,
33
+ defaultValue: "none",
34
34
  options: ["none", "sentences", "words", "characters"],
35
35
  formType: FORM_TYPES.flatArray,
36
36
  propType: PROP_TYPES.STRING,
@@ -104,7 +104,7 @@ export const SEED_DATA = [
104
104
  description: "Can automatically capitalize sentences, words, and characters (Default: none).",
105
105
  editable: true,
106
106
  required: false,
107
- defaultValue: null,
107
+ defaultValue: "none",
108
108
  options: ["none", "sentences", "words", "characters"],
109
109
  formType: FORM_TYPES.flatArray,
110
110
  propType: PROP_TYPES.STRING,
@@ -121,7 +121,7 @@ export const SEED_DATA = [
121
121
  "Can automatically capitalize sentences, words, and characters (Default: none).",
122
122
  editable: true,
123
123
  required: false,
124
- defaultValue: null,
124
+ defaultValue: "none",
125
125
  options: ["none", "sentences", "words", "characters"],
126
126
  formType: FORM_TYPES.flatArray,
127
127
  propType: PROP_TYPES.STRING,