@draftbit/core 46.4.4-9d4d9a.2 → 46.4.4-a3a3f6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/components/Accordion/AccordionItem.js +25 -5
- package/lib/commonjs/components/DatePicker/DatePicker.js +2 -1
- package/lib/commonjs/components/DatePicker/DatePickerComponent.js +2 -0
- package/lib/commonjs/components/DatePicker/DatePickerComponent.web.js +2 -0
- package/lib/commonjs/components/Text.js +40 -10
- package/lib/commonjs/mappings/StarRating.js +6 -2
- package/lib/commonjs/mappings/TextArea.js +14 -3
- package/lib/commonjs/mappings/TextField.js +14 -4
- package/lib/commonjs/mappings/TextInput.js +14 -3
- package/lib/module/components/Checkbox/context.js +1 -1
- package/lib/module/components/DatePicker/DatePicker.js +2 -1
- package/lib/module/components/DatePicker/DatePickerComponent.js +2 -0
- package/lib/module/components/DatePicker/DatePickerComponent.web.js +2 -0
- package/lib/module/components/DeprecatedButton.js +4 -21
- package/lib/module/components/DeprecatedCardWrapper.js +2 -19
- package/lib/module/components/IconButton.js +5 -22
- package/lib/module/components/Image.js +3 -18
- package/lib/module/components/ProgressBar.js +7 -23
- package/lib/module/components/Surface.js +2 -16
- package/lib/module/mappings/TextArea.js +15 -4
- package/lib/module/mappings/TextField.js +14 -4
- package/lib/module/mappings/TextInput.js +15 -4
- package/lib/typescript/src/components/DatePicker/DatePicker.d.ts.map +1 -1
- package/lib/typescript/src/components/DatePicker/DatePickerComponent.d.ts.map +1 -1
- package/lib/typescript/src/components/DatePicker/DatePickerComponent.web.d.ts.map +1 -1
- package/lib/typescript/src/components/DatePicker/DatePickerComponentType.d.ts +1 -0
- package/lib/typescript/src/components/DatePicker/DatePickerComponentType.d.ts.map +1 -1
- package/lib/typescript/src/mappings/TextArea.d.ts +21 -1
- package/lib/typescript/src/mappings/TextArea.d.ts.map +1 -1
- package/lib/typescript/src/mappings/TextField.d.ts +22 -2
- package/lib/typescript/src/mappings/TextField.d.ts.map +1 -1
- package/lib/typescript/src/mappings/TextInput.d.ts +21 -1
- package/lib/typescript/src/mappings/TextInput.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/components/DatePicker/DatePicker.js +2 -1
- package/src/components/DatePicker/DatePicker.tsx +2 -0
- package/src/components/DatePicker/DatePickerComponent.js +2 -2
- package/src/components/DatePicker/DatePickerComponent.tsx +2 -0
- package/src/components/DatePicker/DatePickerComponent.web.js +2 -2
- package/src/components/DatePicker/DatePickerComponent.web.tsx +2 -0
- package/src/components/DatePicker/DatePickerComponentType.ts +1 -0
- package/src/mappings/TextArea.js +15 -4
- package/src/mappings/TextArea.ts +15 -3
- package/src/mappings/TextField.js +14 -4
- package/src/mappings/TextField.ts +14 -4
- package/src/mappings/TextInput.js +15 -4
- package/src/mappings/TextInput.ts +15 -3
|
@@ -21,8 +21,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
21
21
|
|
|
22
22
|
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; }
|
|
23
23
|
|
|
24
|
-
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); }
|
|
25
|
-
|
|
26
24
|
const AccordionItem = _ref => {
|
|
27
25
|
let {
|
|
28
26
|
Icon,
|
|
@@ -37,9 +35,10 @@ const AccordionItem = _ref => {
|
|
|
37
35
|
textStyles,
|
|
38
36
|
viewStyles
|
|
39
37
|
} = (0, _utilities.extractStyles)(style);
|
|
40
|
-
return /*#__PURE__*/React.createElement(_reactNative.Pressable,
|
|
41
|
-
style: [styles.container, viewStyles]
|
|
42
|
-
|
|
38
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
|
|
39
|
+
style: [styles.container, viewStyles],
|
|
40
|
+
...rest
|
|
41
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
43
42
|
style: styles.row
|
|
44
43
|
}, icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
45
44
|
name: icon,
|
|
@@ -74,4 +73,25 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
74
73
|
|
|
75
74
|
var _default = (0, _theming.withTheme)(AccordionItem);
|
|
76
75
|
|
|
76
|
+
exports.default = _default;StyleSheet.create({
|
|
77
|
+
container: {
|
|
78
|
+
padding: 8
|
|
79
|
+
},
|
|
80
|
+
row: {
|
|
81
|
+
flexDirection: "row",
|
|
82
|
+
alignItems: "center",
|
|
83
|
+
paddingLeft: 8
|
|
84
|
+
},
|
|
85
|
+
item: {
|
|
86
|
+
marginVertical: 6,
|
|
87
|
+
paddingLeft: 8
|
|
88
|
+
},
|
|
89
|
+
content: {
|
|
90
|
+
flex: 1,
|
|
91
|
+
justifyContent: "center"
|
|
92
|
+
}
|
|
93
|
+
});
|
|
94
|
+
|
|
95
|
+
var _default = (0, _theming.withTheme)(AccordionItem);
|
|
96
|
+
|
|
77
97
|
exports.default = _default;
|
|
@@ -284,7 +284,7 @@ const DatePicker = _ref => {
|
|
|
284
284
|
};
|
|
285
285
|
const inputStyles = [styles.input, inputStyle, type === "solid" ? {
|
|
286
286
|
marginHorizontal: 12
|
|
287
|
-
} : {}, textStyles]; // const render = (props) => <NativeTextInput {...props} />;
|
|
287
|
+
} : {}, textStyles, style]; // const render = (props) => <NativeTextInput {...props} />;
|
|
288
288
|
|
|
289
289
|
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
290
290
|
style: [styles.container, style]
|
|
@@ -380,6 +380,7 @@ const DatePicker = _ref => {
|
|
|
380
380
|
}, /*#__PURE__*/React.createElement(_DatePickerComponent.default, {
|
|
381
381
|
value: getValidDate(),
|
|
382
382
|
mode: mode,
|
|
383
|
+
style: inputStyles,
|
|
383
384
|
isVisible: pickerVisible,
|
|
384
385
|
toggleVisibility: toggleVisibility,
|
|
385
386
|
onChange: (_event, data) => {
|
|
@@ -19,6 +19,7 @@ const DatePickerComponent = _ref => {
|
|
|
19
19
|
let {
|
|
20
20
|
value,
|
|
21
21
|
onChange,
|
|
22
|
+
style,
|
|
22
23
|
mode,
|
|
23
24
|
toggleVisibility
|
|
24
25
|
} = _ref;
|
|
@@ -35,6 +36,7 @@ const DatePickerComponent = _ref => {
|
|
|
35
36
|
onChange(null, data);
|
|
36
37
|
}
|
|
37
38
|
}) : /*#__PURE__*/_react.default.createElement(_datetimepicker.default, {
|
|
39
|
+
style: style,
|
|
38
40
|
value: value,
|
|
39
41
|
mode: mode,
|
|
40
42
|
onChange: onChange,
|
|
@@ -24,6 +24,7 @@ const DatePickerComponent = _ref => {
|
|
|
24
24
|
value,
|
|
25
25
|
onChange,
|
|
26
26
|
mode,
|
|
27
|
+
style,
|
|
27
28
|
toggleVisibility,
|
|
28
29
|
isVisible,
|
|
29
30
|
theme
|
|
@@ -52,6 +53,7 @@ const DatePickerComponent = _ref => {
|
|
|
52
53
|
},
|
|
53
54
|
onClose: () => toggleVisibility(),
|
|
54
55
|
variant: "dialog",
|
|
56
|
+
style: style,
|
|
55
57
|
TextFieldComponent: () => null
|
|
56
58
|
})));
|
|
57
59
|
};
|
|
@@ -15,19 +15,12 @@ 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
|
-
|
|
20
|
-
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; }
|
|
21
|
-
|
|
22
18
|
class Text extends React.Component {
|
|
23
19
|
constructor() {
|
|
24
20
|
super(...arguments);
|
|
25
|
-
|
|
26
|
-
_defineProperty(this, "_root", void 0);
|
|
27
|
-
|
|
28
|
-
_defineProperty(this, "state", {
|
|
21
|
+
this.state = {
|
|
29
22
|
nativeProps: {}
|
|
30
|
-
}
|
|
23
|
+
};
|
|
31
24
|
}
|
|
32
25
|
|
|
33
26
|
setNativeProps(args) {
|
|
@@ -40,7 +33,44 @@ class Text extends React.Component {
|
|
|
40
33
|
...rest
|
|
41
34
|
} = this.props;
|
|
42
35
|
const writingDirection = _reactNative.I18nManager.isRTL ? "rtl" : "ltr";
|
|
43
|
-
return /*#__PURE__*/React.createElement(_reactNative.Text,
|
|
36
|
+
return /*#__PURE__*/React.createElement(_reactNative.Text, { ...rest,
|
|
37
|
+
...this.state.nativeProps,
|
|
38
|
+
ref: c => {
|
|
39
|
+
this._root = c;
|
|
40
|
+
},
|
|
41
|
+
style: [{
|
|
42
|
+
textAlign: "left",
|
|
43
|
+
writingDirection
|
|
44
|
+
}, style]
|
|
45
|
+
});
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
const BaseLink = _ref => {
|
|
51
|
+
let {
|
|
52
|
+
style,
|
|
53
|
+
theme,
|
|
54
|
+
title,
|
|
55
|
+
...props
|
|
56
|
+
} = _ref;
|
|
57
|
+
return /*#__PURE__*/React.createElement(Text, {
|
|
58
|
+
hitSlop: 8,
|
|
59
|
+
style: [{
|
|
60
|
+
color: theme.colors.primary
|
|
61
|
+
}, style],
|
|
62
|
+
theme: theme,
|
|
63
|
+
...props
|
|
64
|
+
}, title);
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
exports.BaseLink = BaseLink;
|
|
68
|
+
const Link = (0, _theming.withTheme)(BaseLink);
|
|
69
|
+
exports.Link = Link;
|
|
70
|
+
|
|
71
|
+
var _default = (0, _theming.withTheme)(Text);
|
|
72
|
+
|
|
73
|
+
exports.default = _default;is.state.nativeProps, {
|
|
44
74
|
ref: c => {
|
|
45
75
|
this._root = c;
|
|
46
76
|
},
|
|
@@ -25,9 +25,7 @@ const SEED_DATA = {
|
|
|
25
25
|
}),
|
|
26
26
|
fieldName: (0, _types.createFieldNameProp)({
|
|
27
27
|
defaultValue: "ratingValue",
|
|
28
|
-
// this is the name of the variable declared on the screen in Draftbit
|
|
29
28
|
handlerPropName: "onPress",
|
|
30
|
-
// the change handler prop in this component
|
|
31
29
|
valuePropName: "rating" // the value prop in this component
|
|
32
30
|
|
|
33
31
|
}),
|
|
@@ -52,4 +50,10 @@ const SEED_DATA = {
|
|
|
52
50
|
})
|
|
53
51
|
}
|
|
54
52
|
};
|
|
53
|
+
exports.SEED_DATA = SEED_DATA;pes.createColorProp)({
|
|
54
|
+
label: "Inactive Color",
|
|
55
|
+
defaultValue: "divider"
|
|
56
|
+
})
|
|
57
|
+
}
|
|
58
|
+
};
|
|
55
59
|
exports.SEED_DATA = SEED_DATA;
|
|
@@ -67,6 +67,17 @@ const SEED_DATA = {
|
|
|
67
67
|
formType: _types.FORM_TYPES.boolean,
|
|
68
68
|
propType: _types.PROP_TYPES.BOOLEAN
|
|
69
69
|
},
|
|
70
|
+
blurOnSubmit: {
|
|
71
|
+
group: _types.GROUPS.advanced,
|
|
72
|
+
label: "Blur On Submit",
|
|
73
|
+
description: "If true, the text field will blur when submitted. ",
|
|
74
|
+
editable: true,
|
|
75
|
+
required: false,
|
|
76
|
+
defaultValue: null,
|
|
77
|
+
formType: _types.FORM_TYPES.boolean,
|
|
78
|
+
propType: _types.PROP_TYPES.BOOLEAN
|
|
79
|
+
},
|
|
80
|
+
disabled: (0, _types.createDisabledProp)(),
|
|
70
81
|
caretHidden: {
|
|
71
82
|
group: _types.GROUPS.advanced,
|
|
72
83
|
label: "Hide Caret",
|
|
@@ -88,12 +99,12 @@ const SEED_DATA = {
|
|
|
88
99
|
propType: _types.PROP_TYPES.BOOLEAN
|
|
89
100
|
},
|
|
90
101
|
editable: {
|
|
91
|
-
group: _types.GROUPS.
|
|
92
|
-
label: "Editable",
|
|
102
|
+
group: _types.GROUPS.data,
|
|
103
|
+
label: "Editable?",
|
|
93
104
|
description: "If false, the text is not editable",
|
|
94
105
|
editable: true,
|
|
95
106
|
required: false,
|
|
96
|
-
defaultValue:
|
|
107
|
+
defaultValue: null,
|
|
97
108
|
formType: _types.FORM_TYPES.boolean,
|
|
98
109
|
propType: _types.PROP_TYPES.BOOLEAN
|
|
99
110
|
},
|
|
@@ -70,7 +70,7 @@ const SEED_DATA_PROPS = {
|
|
|
70
70
|
propType: _types.PROP_TYPES.BOOLEAN
|
|
71
71
|
},
|
|
72
72
|
disabled: {
|
|
73
|
-
group: _types.GROUPS.
|
|
73
|
+
group: _types.GROUPS.data,
|
|
74
74
|
label: "Disabled",
|
|
75
75
|
description: "Whether the input should be disabled. Will prevent input and show a greyed out state.",
|
|
76
76
|
formType: _types.FORM_TYPES.boolean,
|
|
@@ -80,12 +80,22 @@ const SEED_DATA_PROPS = {
|
|
|
80
80
|
required: false
|
|
81
81
|
},
|
|
82
82
|
editable: {
|
|
83
|
-
group: _types.GROUPS.
|
|
84
|
-
label: "Editable",
|
|
83
|
+
group: _types.GROUPS.data,
|
|
84
|
+
label: "Editable?",
|
|
85
85
|
description: "If false, the text is not editable",
|
|
86
86
|
editable: true,
|
|
87
87
|
required: false,
|
|
88
|
-
defaultValue:
|
|
88
|
+
defaultValue: null,
|
|
89
|
+
formType: _types.FORM_TYPES.boolean,
|
|
90
|
+
propType: _types.PROP_TYPES.BOOLEAN
|
|
91
|
+
},
|
|
92
|
+
blurOnSubmit: {
|
|
93
|
+
group: _types.GROUPS.advanced,
|
|
94
|
+
label: "Blur On Submit",
|
|
95
|
+
description: "If true, the text field will blur when submitted. ",
|
|
96
|
+
editable: true,
|
|
97
|
+
required: false,
|
|
98
|
+
defaultValue: null,
|
|
89
99
|
formType: _types.FORM_TYPES.boolean,
|
|
90
100
|
propType: _types.PROP_TYPES.BOOLEAN
|
|
91
101
|
},
|
|
@@ -149,12 +149,12 @@ const SEED_DATA = [{
|
|
|
149
149
|
propType: _types.PROP_TYPES.BOOLEAN
|
|
150
150
|
},
|
|
151
151
|
editable: {
|
|
152
|
-
group: _types.GROUPS.
|
|
153
|
-
label: "Editable",
|
|
152
|
+
group: _types.GROUPS.data,
|
|
153
|
+
label: "Editable?",
|
|
154
154
|
description: "If false, the text is not editable",
|
|
155
155
|
editable: true,
|
|
156
156
|
required: false,
|
|
157
|
-
defaultValue:
|
|
157
|
+
defaultValue: null,
|
|
158
158
|
formType: _types.FORM_TYPES.boolean,
|
|
159
159
|
propType: _types.PROP_TYPES.BOOLEAN
|
|
160
160
|
},
|
|
@@ -223,6 +223,16 @@ const SEED_DATA = [{
|
|
|
223
223
|
formType: _types.FORM_TYPES.string,
|
|
224
224
|
propType: _types.PROP_TYPES.STRING
|
|
225
225
|
},
|
|
226
|
+
blurOnSubmit: {
|
|
227
|
+
group: _types.GROUPS.advanced,
|
|
228
|
+
label: "Blur On Submit",
|
|
229
|
+
description: "If true, the text field will blur when submitted. ",
|
|
230
|
+
editable: true,
|
|
231
|
+
required: false,
|
|
232
|
+
defaultValue: null,
|
|
233
|
+
formType: _types.FORM_TYPES.boolean,
|
|
234
|
+
propType: _types.PROP_TYPES.BOOLEAN
|
|
235
|
+
},
|
|
226
236
|
returnKeyType: {
|
|
227
237
|
group: _types.GROUPS.advanced,
|
|
228
238
|
label: "Return Key Type",
|
|
@@ -288,6 +298,7 @@ const SEED_DATA = [{
|
|
|
288
298
|
formType: _types.FORM_TYPES.number,
|
|
289
299
|
propType: _types.PROP_TYPES.NUMBER
|
|
290
300
|
},
|
|
301
|
+
disabled: (0, _types.createDisabledProp)(),
|
|
291
302
|
scrollEnabled: {
|
|
292
303
|
group: _types.GROUPS.basic,
|
|
293
304
|
label: "Scroll Enabled",
|
|
@@ -261,7 +261,7 @@ const DatePicker = _ref => {
|
|
|
261
261
|
};
|
|
262
262
|
const inputStyles = [styles.input, inputStyle, type === "solid" ? {
|
|
263
263
|
marginHorizontal: 12
|
|
264
|
-
} : {}, textStyles]; // const render = (props) => <NativeTextInput {...props} />;
|
|
264
|
+
} : {}, textStyles, style]; // const render = (props) => <NativeTextInput {...props} />;
|
|
265
265
|
|
|
266
266
|
return /*#__PURE__*/React.createElement(View, {
|
|
267
267
|
style: [styles.container, style]
|
|
@@ -357,6 +357,7 @@ const DatePicker = _ref => {
|
|
|
357
357
|
}, /*#__PURE__*/React.createElement(DateTimePicker, {
|
|
358
358
|
value: getValidDate(),
|
|
359
359
|
mode: mode,
|
|
360
|
+
style: inputStyles,
|
|
360
361
|
isVisible: pickerVisible,
|
|
361
362
|
toggleVisibility: toggleVisibility,
|
|
362
363
|
onChange: (_event, data) => {
|
|
@@ -7,6 +7,7 @@ const DatePickerComponent = _ref => {
|
|
|
7
7
|
let {
|
|
8
8
|
value,
|
|
9
9
|
onChange,
|
|
10
|
+
style,
|
|
10
11
|
mode,
|
|
11
12
|
toggleVisibility
|
|
12
13
|
} = _ref;
|
|
@@ -23,6 +24,7 @@ const DatePickerComponent = _ref => {
|
|
|
23
24
|
onChange(null, data);
|
|
24
25
|
}
|
|
25
26
|
}) : /*#__PURE__*/React.createElement(DateTimePicker, {
|
|
27
|
+
style: style,
|
|
26
28
|
value: value,
|
|
27
29
|
mode: mode,
|
|
28
30
|
onChange: onChange,
|
|
@@ -10,6 +10,7 @@ const DatePickerComponent = _ref => {
|
|
|
10
10
|
value,
|
|
11
11
|
onChange,
|
|
12
12
|
mode,
|
|
13
|
+
style,
|
|
13
14
|
toggleVisibility,
|
|
14
15
|
isVisible,
|
|
15
16
|
theme
|
|
@@ -38,6 +39,7 @@ const DatePickerComponent = _ref => {
|
|
|
38
39
|
},
|
|
39
40
|
onClose: () => toggleVisibility(),
|
|
40
41
|
variant: "dialog",
|
|
42
|
+
style: style,
|
|
41
43
|
TextFieldComponent: () => null
|
|
42
44
|
})));
|
|
43
45
|
};
|
|
@@ -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 { ActivityIndicator, View, Text, StyleSheet } from "react-native";
|
|
3
5
|
import color from "color";
|
|
@@ -105,7 +107,7 @@ const Button = _ref => {
|
|
|
105
107
|
alignSelf: "stretch",
|
|
106
108
|
...margins
|
|
107
109
|
}
|
|
108
|
-
}, /*#__PURE__*/React.createElement(Touchable, {
|
|
110
|
+
}, /*#__PURE__*/React.createElement(Touchable, _extends({}, rest, {
|
|
109
111
|
onPress: onPress,
|
|
110
112
|
accessibilityState: {
|
|
111
113
|
disabled
|
|
@@ -113,7 +115,7 @@ const Button = _ref => {
|
|
|
113
115
|
accessibilityRole: "button",
|
|
114
116
|
disabled: disabled || loading,
|
|
115
117
|
style: [styles.button, buttonStyle, innerStyles]
|
|
116
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
118
|
+
}), /*#__PURE__*/React.createElement(View, {
|
|
117
119
|
style: styles.content
|
|
118
120
|
}, icon && loading !== true ? /*#__PURE__*/React.createElement(View, {
|
|
119
121
|
style: iconStyle
|
|
@@ -131,25 +133,6 @@ const Button = _ref => {
|
|
|
131
133
|
}, children))));
|
|
132
134
|
};
|
|
133
135
|
|
|
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
|
-
|
|
153
136
|
const styles = StyleSheet.create({
|
|
154
137
|
button: {
|
|
155
138
|
minWidth: 64,
|
|
@@ -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
|
-
|
|
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",
|
|
@@ -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
|
/* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
|
|
2
4
|
import React from "react";
|
|
3
5
|
import { Image as NativeImage, StyleSheet } from "react-native";
|
|
@@ -62,24 +64,7 @@ const Image = _ref2 => {
|
|
|
62
64
|
height,
|
|
63
65
|
aspectRatio
|
|
64
66
|
}]
|
|
65
|
-
}, /*#__PURE__*/React.createElement(NativeImage, {
|
|
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, {
|
|
67
|
+
}, /*#__PURE__*/React.createElement(NativeImage, _extends({}, props, {
|
|
83
68
|
source: imageSource,
|
|
84
69
|
resizeMode: resizeMode,
|
|
85
70
|
style: [style, {
|
|
@@ -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
|
|
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
|
/* 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,4 +1,4 @@
|
|
|
1
|
-
import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, Triggers } from "@draftbit/types";
|
|
1
|
+
import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, Triggers, createDisabledProp } from "@draftbit/types";
|
|
2
2
|
export const SEED_DATA = {
|
|
3
3
|
name: "Text Area",
|
|
4
4
|
tag: "TextInput",
|
|
@@ -59,6 +59,17 @@ export const SEED_DATA = {
|
|
|
59
59
|
formType: FORM_TYPES.boolean,
|
|
60
60
|
propType: PROP_TYPES.BOOLEAN
|
|
61
61
|
},
|
|
62
|
+
blurOnSubmit: {
|
|
63
|
+
group: GROUPS.advanced,
|
|
64
|
+
label: "Blur On Submit",
|
|
65
|
+
description: "If true, the text field will blur when submitted. ",
|
|
66
|
+
editable: true,
|
|
67
|
+
required: false,
|
|
68
|
+
defaultValue: null,
|
|
69
|
+
formType: FORM_TYPES.boolean,
|
|
70
|
+
propType: PROP_TYPES.BOOLEAN
|
|
71
|
+
},
|
|
72
|
+
disabled: createDisabledProp(),
|
|
62
73
|
caretHidden: {
|
|
63
74
|
group: GROUPS.advanced,
|
|
64
75
|
label: "Hide Caret",
|
|
@@ -80,12 +91,12 @@ export const SEED_DATA = {
|
|
|
80
91
|
propType: PROP_TYPES.BOOLEAN
|
|
81
92
|
},
|
|
82
93
|
editable: {
|
|
83
|
-
group: GROUPS.
|
|
84
|
-
label: "Editable",
|
|
94
|
+
group: GROUPS.data,
|
|
95
|
+
label: "Editable?",
|
|
85
96
|
description: "If false, the text is not editable",
|
|
86
97
|
editable: true,
|
|
87
98
|
required: false,
|
|
88
|
-
defaultValue:
|
|
99
|
+
defaultValue: null,
|
|
89
100
|
formType: FORM_TYPES.boolean,
|
|
90
101
|
propType: PROP_TYPES.BOOLEAN
|
|
91
102
|
},
|