@draftbit/core 46.4.4-229578.2 → 46.4.4-535477.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/Container.js +5 -17
- package/lib/commonjs/index.js +0 -14
- package/lib/commonjs/mappings/AudioPlayer.js +32 -2
- package/lib/module/components/Divider.js +2 -20
- package/lib/module/components/Image.js +3 -18
- package/lib/module/index.js +0 -1
- package/lib/module/mappings/AudioPlayer.js +33 -3
- package/lib/typescript/src/index.d.ts +0 -1
- package/lib/typescript/src/mappings/AudioPlayer.d.ts +62 -1
- package/package.json +4 -6
- package/src/index.js +0 -1
- package/src/index.tsx +0 -1
- package/src/mappings/AudioPlayer.js +39 -2
- package/src/mappings/AudioPlayer.ts +41 -1
- package/lib/commonjs/components/TabView/TabView.js +0 -102
- package/lib/commonjs/components/TabView/TabViewItem.js +0 -26
- package/lib/commonjs/components/TabView/index.js +0 -23
- package/lib/commonjs/mappings/TabView.js +0 -79
- package/lib/module/components/TabView/TabView.js +0 -87
- package/lib/module/components/TabView/TabViewItem.js +0 -18
- package/lib/module/components/TabView/index.js +0 -2
- package/lib/module/mappings/TabView.js +0 -70
- package/lib/typescript/src/components/TabView/TabView.d.ts +0 -19
- package/lib/typescript/src/components/TabView/TabViewItem.d.ts +0 -10
- package/lib/typescript/src/components/TabView/index.d.ts +0 -2
- package/lib/typescript/src/mappings/TabView.d.ts +0 -111
- package/src/components/TabView/TabView.js +0 -34
- package/src/components/TabView/TabView.tsx +0 -97
- package/src/components/TabView/TabViewItem.js +0 -5
- package/src/components/TabView/TabViewItem.tsx +0 -21
- package/src/components/TabView/index.js +0 -2
- package/src/components/TabView/index.tsx +0 -2
- package/src/mappings/TabView.js +0 -73
- package/src/mappings/TabView.ts +0 -80
|
@@ -19,6 +19,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
19
19
|
|
|
20
20
|
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; }
|
|
21
21
|
|
|
22
|
+
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); }
|
|
23
|
+
|
|
22
24
|
const Container = _ref => {
|
|
23
25
|
let {
|
|
24
26
|
useThemeGutterPadding,
|
|
@@ -80,10 +82,9 @@ const Container = _ref => {
|
|
|
80
82
|
};
|
|
81
83
|
const Wrap = elevation ? _Elevation.default : _reactNative.View;
|
|
82
84
|
if (elevation) containerStyle.elevation = elevation;
|
|
83
|
-
return /*#__PURE__*/React.createElement(Wrap, {
|
|
84
|
-
style: [containerStyle, style]
|
|
85
|
-
|
|
86
|
-
}, backgroundImage ? /*#__PURE__*/React.createElement(_reactNative.ImageBackground, {
|
|
85
|
+
return /*#__PURE__*/React.createElement(Wrap, _extends({
|
|
86
|
+
style: [containerStyle, style]
|
|
87
|
+
}, rest), backgroundImage ? /*#__PURE__*/React.createElement(_reactNative.ImageBackground, {
|
|
87
88
|
source: typeof backgroundImage === "string" ? {
|
|
88
89
|
uri: backgroundImage
|
|
89
90
|
} : backgroundImage,
|
|
@@ -100,17 +101,4 @@ const Container = _ref => {
|
|
|
100
101
|
|
|
101
102
|
var _default = (0, _theming.withTheme)(Container);
|
|
102
103
|
|
|
103
|
-
exports.default = _default;izeMode: backgroundImageResizeMode,
|
|
104
|
-
style: {
|
|
105
|
-
flex: 1
|
|
106
|
-
}
|
|
107
|
-
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
108
|
-
style: innerStyle
|
|
109
|
-
}, children)) : /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
110
|
-
style: innerStyle
|
|
111
|
-
}, children));
|
|
112
|
-
};
|
|
113
|
-
|
|
114
|
-
var _default = (0, _theming.withTheme)(Container);
|
|
115
|
-
|
|
116
104
|
exports.default = _default;
|
package/lib/commonjs/index.js
CHANGED
|
@@ -369,18 +369,6 @@ Object.defineProperty(exports, "SwitchRow", {
|
|
|
369
369
|
return _Switch.SwitchRow;
|
|
370
370
|
}
|
|
371
371
|
});
|
|
372
|
-
Object.defineProperty(exports, "TabView", {
|
|
373
|
-
enumerable: true,
|
|
374
|
-
get: function () {
|
|
375
|
-
return _TabView.TabView;
|
|
376
|
-
}
|
|
377
|
-
});
|
|
378
|
-
Object.defineProperty(exports, "TabViewItem", {
|
|
379
|
-
enumerable: true,
|
|
380
|
-
get: function () {
|
|
381
|
-
return _TabView.TabViewItem;
|
|
382
|
-
}
|
|
383
|
-
});
|
|
384
372
|
Object.defineProperty(exports, "TextField", {
|
|
385
373
|
enumerable: true,
|
|
386
374
|
get: function () {
|
|
@@ -484,8 +472,6 @@ var _ActionSheet = require("./components/ActionSheet");
|
|
|
484
472
|
|
|
485
473
|
var _Swiper = require("./components/Swiper");
|
|
486
474
|
|
|
487
|
-
var _TabView = require("./components/TabView");
|
|
488
|
-
|
|
489
475
|
var _Layout = require("./components/Layout");
|
|
490
476
|
|
|
491
477
|
var _index = require("./components/RadioButton/index");
|
|
@@ -12,7 +12,17 @@ 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
|
-
|
|
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
|
+
},
|
|
16
26
|
props: {
|
|
17
27
|
source: {
|
|
18
28
|
group: _types.GROUPS.data,
|
|
@@ -23,7 +33,27 @@ const SEED_DATA = {
|
|
|
23
33
|
defaultValue: "https://static.draftbit.com/audio/intro-to-draftbit-audio.mp3",
|
|
24
34
|
formType: _types.FORM_TYPES.sourceUrl,
|
|
25
35
|
propType: _types.PROP_TYPES.OBJECT
|
|
26
|
-
}
|
|
36
|
+
},
|
|
37
|
+
sliderColor: (0, _types.createColorProp)({
|
|
38
|
+
label: "Thumb Color",
|
|
39
|
+
defaultValue: "strong"
|
|
40
|
+
}),
|
|
41
|
+
completedTrackColor: (0, _types.createColorProp)({
|
|
42
|
+
label: "Completed Track Color",
|
|
43
|
+
defaultValue: "background"
|
|
44
|
+
}),
|
|
45
|
+
remainingTrackColor: (0, _types.createColorProp)({
|
|
46
|
+
label: "Remaining Track Color",
|
|
47
|
+
defaultValue: "light"
|
|
48
|
+
}),
|
|
49
|
+
trackThumbSize: (0, _types.createNumberProp)({
|
|
50
|
+
label: "Thumb Size",
|
|
51
|
+
defaultValue: 24
|
|
52
|
+
}),
|
|
53
|
+
playIconColor: (0, _types.createColorProp)({
|
|
54
|
+
label: "Play Icon Color",
|
|
55
|
+
defaultValue: "strong"
|
|
56
|
+
})
|
|
27
57
|
}
|
|
28
58
|
};
|
|
29
59
|
exports.SEED_DATA = SEED_DATA;
|
|
@@ -1,27 +1,9 @@
|
|
|
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 { StyleSheet, View } from "react-native";
|
|
3
5
|
import { withTheme } from "../theming";
|
|
4
6
|
|
|
5
|
-
const Divider = _ref => {
|
|
6
|
-
let {
|
|
7
|
-
style,
|
|
8
|
-
color,
|
|
9
|
-
theme: {
|
|
10
|
-
colors
|
|
11
|
-
},
|
|
12
|
-
...rest
|
|
13
|
-
} = _ref;
|
|
14
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
15
|
-
style: [{
|
|
16
|
-
backgroundColor: color || colors.divider,
|
|
17
|
-
height: StyleSheet.hairlineWidth
|
|
18
|
-
}, style],
|
|
19
|
-
...rest
|
|
20
|
-
});
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
export default withTheme(Divider);ng";
|
|
24
|
-
|
|
25
7
|
const Divider = _ref => {
|
|
26
8
|
let {
|
|
27
9
|
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
|
/* 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, {
|
package/lib/module/index.js
CHANGED
|
@@ -29,7 +29,6 @@ export { default as Touchable } from "./components/Touchable";
|
|
|
29
29
|
export { AccordionGroup, AccordionItem } from "./components/Accordion";
|
|
30
30
|
export { ActionSheet, ActionSheetItem, ActionSheetCancel } from "./components/ActionSheet";
|
|
31
31
|
export { Swiper, SwiperItem } from "./components/Swiper";
|
|
32
|
-
export { TabView, TabViewItem } from "./components/TabView";
|
|
33
32
|
export { Center, Circle, Square, Row, Stack, Spacer } from "./components/Layout";
|
|
34
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup } from "./components/RadioButton/index";
|
|
35
34
|
/* Deprecated: Fix or Delete! */
|
|
@@ -1,10 +1,20 @@
|
|
|
1
|
-
import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES } from "@draftbit/types";
|
|
1
|
+
import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, StylesPanelSections, createColorProp, createNumberProp } 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
|
-
|
|
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
|
+
},
|
|
8
18
|
props: {
|
|
9
19
|
source: {
|
|
10
20
|
group: GROUPS.data,
|
|
@@ -15,6 +25,26 @@ export const SEED_DATA = {
|
|
|
15
25
|
defaultValue: "https://static.draftbit.com/audio/intro-to-draftbit-audio.mp3",
|
|
16
26
|
formType: FORM_TYPES.sourceUrl,
|
|
17
27
|
propType: PROP_TYPES.OBJECT
|
|
18
|
-
}
|
|
28
|
+
},
|
|
29
|
+
sliderColor: createColorProp({
|
|
30
|
+
label: "Thumb Color",
|
|
31
|
+
defaultValue: "strong"
|
|
32
|
+
}),
|
|
33
|
+
completedTrackColor: createColorProp({
|
|
34
|
+
label: "Completed Track Color",
|
|
35
|
+
defaultValue: "background"
|
|
36
|
+
}),
|
|
37
|
+
remainingTrackColor: createColorProp({
|
|
38
|
+
label: "Remaining Track Color",
|
|
39
|
+
defaultValue: "light"
|
|
40
|
+
}),
|
|
41
|
+
trackThumbSize: createNumberProp({
|
|
42
|
+
label: "Thumb Size",
|
|
43
|
+
defaultValue: 24
|
|
44
|
+
}),
|
|
45
|
+
playIconColor: createColorProp({
|
|
46
|
+
label: "Play Icon Color",
|
|
47
|
+
defaultValue: "strong"
|
|
48
|
+
})
|
|
19
49
|
}
|
|
20
50
|
};
|
|
@@ -29,7 +29,6 @@ export { default as Touchable } from "./components/Touchable";
|
|
|
29
29
|
export { AccordionGroup, AccordionItem } from "./components/Accordion";
|
|
30
30
|
export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/ActionSheet";
|
|
31
31
|
export { Swiper, SwiperItem } from "./components/Swiper";
|
|
32
|
-
export { TabView, TabViewItem } from "./components/TabView";
|
|
33
32
|
export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
|
|
34
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
|
|
35
34
|
export { default as CardBlock } from "./components/CardBlock";
|
|
@@ -3,7 +3,17 @@ export declare const SEED_DATA: {
|
|
|
3
3
|
tag: string;
|
|
4
4
|
description: string;
|
|
5
5
|
category: string;
|
|
6
|
-
|
|
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
|
+
};
|
|
7
17
|
props: {
|
|
8
18
|
source: {
|
|
9
19
|
group: string;
|
|
@@ -15,5 +25,56 @@ export declare const SEED_DATA: {
|
|
|
15
25
|
formType: string;
|
|
16
26
|
propType: string;
|
|
17
27
|
};
|
|
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
|
+
playIconColor: {
|
|
70
|
+
group: string;
|
|
71
|
+
label: string;
|
|
72
|
+
description: string;
|
|
73
|
+
editable: boolean;
|
|
74
|
+
required: boolean;
|
|
75
|
+
defaultValue: null;
|
|
76
|
+
formType: string;
|
|
77
|
+
propType: string;
|
|
78
|
+
};
|
|
18
79
|
};
|
|
19
80
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@draftbit/core",
|
|
3
|
-
"version": "46.4.4-
|
|
3
|
+
"version": "46.4.4-535477.2+5354772",
|
|
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-
|
|
44
|
+
"@draftbit/types": "^46.4.4-535477.2+5354772",
|
|
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",
|
|
@@ -54,9 +54,7 @@
|
|
|
54
54
|
"lodash.omit": "^4.5.0",
|
|
55
55
|
"lodash.tonumber": "^4.0.3",
|
|
56
56
|
"react-native-modal-datetime-picker": "^13.0.0",
|
|
57
|
-
"react-native-
|
|
58
|
-
"react-native-svg": "^12.3.0",
|
|
59
|
-
"react-native-tab-view": "^3.3.0",
|
|
57
|
+
"react-native-svg": "12.3.0",
|
|
60
58
|
"react-native-typography": "^1.4.1",
|
|
61
59
|
"react-native-web-swiper": "^2.2.3"
|
|
62
60
|
},
|
|
@@ -83,5 +81,5 @@
|
|
|
83
81
|
]
|
|
84
82
|
]
|
|
85
83
|
},
|
|
86
|
-
"gitHead": "
|
|
84
|
+
"gitHead": "5354772b33cfab42f028943a8a73638bec646c09"
|
|
87
85
|
}
|
package/src/index.js
CHANGED
|
@@ -29,7 +29,6 @@ export { default as Touchable } from "./components/Touchable";
|
|
|
29
29
|
export { AccordionGroup, AccordionItem } from "./components/Accordion";
|
|
30
30
|
export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/ActionSheet";
|
|
31
31
|
export { Swiper, SwiperItem } from "./components/Swiper";
|
|
32
|
-
export { TabView, TabViewItem } from "./components/TabView";
|
|
33
32
|
export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
|
|
34
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
|
|
35
34
|
/* Deprecated: Fix or Delete! */
|
package/src/index.tsx
CHANGED
|
@@ -1,10 +1,27 @@
|
|
|
1
|
-
import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, } from "@draftbit/types";
|
|
1
|
+
import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, StylesPanelSections, createColorProp, createNumberProp, } 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
|
-
|
|
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
|
+
},
|
|
8
25
|
props: {
|
|
9
26
|
source: {
|
|
10
27
|
group: GROUPS.data,
|
|
@@ -16,5 +33,25 @@ export const SEED_DATA = {
|
|
|
16
33
|
formType: FORM_TYPES.sourceUrl,
|
|
17
34
|
propType: PROP_TYPES.OBJECT,
|
|
18
35
|
},
|
|
36
|
+
sliderColor: createColorProp({
|
|
37
|
+
label: "Thumb Color",
|
|
38
|
+
defaultValue: "strong",
|
|
39
|
+
}),
|
|
40
|
+
completedTrackColor: createColorProp({
|
|
41
|
+
label: "Completed Track Color",
|
|
42
|
+
defaultValue: "background",
|
|
43
|
+
}),
|
|
44
|
+
remainingTrackColor: createColorProp({
|
|
45
|
+
label: "Remaining Track Color",
|
|
46
|
+
defaultValue: "light",
|
|
47
|
+
}),
|
|
48
|
+
trackThumbSize: createNumberProp({
|
|
49
|
+
label: "Thumb Size",
|
|
50
|
+
defaultValue: 24,
|
|
51
|
+
}),
|
|
52
|
+
playIconColor: createColorProp({
|
|
53
|
+
label: "Play Icon Color",
|
|
54
|
+
defaultValue: "strong",
|
|
55
|
+
}),
|
|
19
56
|
},
|
|
20
57
|
};
|
|
@@ -3,6 +3,9 @@ import {
|
|
|
3
3
|
COMPONENT_TYPES,
|
|
4
4
|
FORM_TYPES,
|
|
5
5
|
PROP_TYPES,
|
|
6
|
+
StylesPanelSections,
|
|
7
|
+
createColorProp,
|
|
8
|
+
createNumberProp,
|
|
6
9
|
} from "@draftbit/types";
|
|
7
10
|
|
|
8
11
|
export const SEED_DATA = {
|
|
@@ -10,7 +13,24 @@ export const SEED_DATA = {
|
|
|
10
13
|
tag: "AudioPlayer",
|
|
11
14
|
description: "Given a source URL, plays sounds & audio!",
|
|
12
15
|
category: COMPONENT_TYPES.media,
|
|
13
|
-
|
|
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
|
+
},
|
|
14
34
|
props: {
|
|
15
35
|
source: {
|
|
16
36
|
group: GROUPS.data,
|
|
@@ -23,5 +43,25 @@ export const SEED_DATA = {
|
|
|
23
43
|
formType: FORM_TYPES.sourceUrl,
|
|
24
44
|
propType: PROP_TYPES.OBJECT,
|
|
25
45
|
},
|
|
46
|
+
sliderColor: createColorProp({
|
|
47
|
+
label: "Thumb Color",
|
|
48
|
+
defaultValue: "strong",
|
|
49
|
+
}),
|
|
50
|
+
completedTrackColor: createColorProp({
|
|
51
|
+
label: "Completed Track Color",
|
|
52
|
+
defaultValue: "background",
|
|
53
|
+
}),
|
|
54
|
+
remainingTrackColor: createColorProp({
|
|
55
|
+
label: "Remaining Track Color",
|
|
56
|
+
defaultValue: "light",
|
|
57
|
+
}),
|
|
58
|
+
trackThumbSize: createNumberProp({
|
|
59
|
+
label: "Thumb Size",
|
|
60
|
+
defaultValue: 24,
|
|
61
|
+
}),
|
|
62
|
+
playIconColor: createColorProp({
|
|
63
|
+
label: "Play Icon Color",
|
|
64
|
+
defaultValue: "strong",
|
|
65
|
+
}),
|
|
26
66
|
},
|
|
27
67
|
};
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
var React = _interopRequireWildcard(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactNativeTabView = require("react-native-tab-view");
|
|
11
|
-
|
|
12
|
-
var _TabViewItem = _interopRequireDefault(require("./TabViewItem"));
|
|
13
|
-
|
|
14
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
|
-
|
|
18
|
-
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; }
|
|
19
|
-
|
|
20
|
-
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); }
|
|
21
|
-
|
|
22
|
-
const TabViewComponent = _ref => {
|
|
23
|
-
let {
|
|
24
|
-
Icon,
|
|
25
|
-
tabBarPosition,
|
|
26
|
-
keyboardDismissMode,
|
|
27
|
-
swipeEnabled,
|
|
28
|
-
scrollEnabled,
|
|
29
|
-
activeColor,
|
|
30
|
-
inactiveColor,
|
|
31
|
-
pressColor,
|
|
32
|
-
indicatorColor,
|
|
33
|
-
style,
|
|
34
|
-
children
|
|
35
|
-
} = _ref;
|
|
36
|
-
const [index, setIndex] = React.useState(0);
|
|
37
|
-
const [routes, setRoutes] = React.useState([]);
|
|
38
|
-
const [tabScenes, setTabScenes] = React.useState({});
|
|
39
|
-
React.useEffect(() => {
|
|
40
|
-
const newRoutes = [];
|
|
41
|
-
const scenes = {};
|
|
42
|
-
React.Children.toArray(children).filter(child => child.type === _TabViewItem.default).forEach(child => {
|
|
43
|
-
var _child$props;
|
|
44
|
-
|
|
45
|
-
if (child !== null && child !== void 0 && (_child$props = child.props) !== null && _child$props !== void 0 && _child$props.id) {
|
|
46
|
-
var _child$props2, _child$props3;
|
|
47
|
-
|
|
48
|
-
newRoutes.push({
|
|
49
|
-
key: child === null || child === void 0 ? void 0 : (_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.id,
|
|
50
|
-
...(child === null || child === void 0 ? void 0 : child.props)
|
|
51
|
-
});
|
|
52
|
-
|
|
53
|
-
scenes[child === null || child === void 0 ? void 0 : (_child$props3 = child.props) === null || _child$props3 === void 0 ? void 0 : _child$props3.id] = () => child;
|
|
54
|
-
}
|
|
55
|
-
});
|
|
56
|
-
setRoutes(newRoutes);
|
|
57
|
-
setTabScenes(scenes);
|
|
58
|
-
}, [children]);
|
|
59
|
-
|
|
60
|
-
const indexChangeHandler = i => setIndex(i);
|
|
61
|
-
|
|
62
|
-
const renderTabBar = props => {
|
|
63
|
-
console.log(props);
|
|
64
|
-
return /*#__PURE__*/React.createElement(_reactNativeTabView.TabBar, _extends({}, props, {
|
|
65
|
-
activeColor: activeColor,
|
|
66
|
-
inactiveColor: inactiveColor,
|
|
67
|
-
pressColor: pressColor,
|
|
68
|
-
scrollEnabled: scrollEnabled,
|
|
69
|
-
indicatorStyle: {
|
|
70
|
-
backgroundColor: indicatorColor
|
|
71
|
-
},
|
|
72
|
-
renderIcon: _ref2 => {
|
|
73
|
-
let {
|
|
74
|
-
route,
|
|
75
|
-
color
|
|
76
|
-
} = _ref2;
|
|
77
|
-
return route !== null && route !== void 0 && route.icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
78
|
-
name: route.icon,
|
|
79
|
-
color: color,
|
|
80
|
-
size: 36
|
|
81
|
-
}) : null;
|
|
82
|
-
},
|
|
83
|
-
style: style
|
|
84
|
-
}));
|
|
85
|
-
};
|
|
86
|
-
|
|
87
|
-
return /*#__PURE__*/React.createElement(_reactNativeTabView.TabView, {
|
|
88
|
-
navigationState: {
|
|
89
|
-
index,
|
|
90
|
-
routes
|
|
91
|
-
},
|
|
92
|
-
renderScene: (0, _reactNativeTabView.SceneMap)(tabScenes),
|
|
93
|
-
renderTabBar: renderTabBar,
|
|
94
|
-
onIndexChange: indexChangeHandler,
|
|
95
|
-
tabBarPosition: tabBarPosition,
|
|
96
|
-
keyboardDismissMode: keyboardDismissMode,
|
|
97
|
-
swipeEnabled: swipeEnabled
|
|
98
|
-
});
|
|
99
|
-
};
|
|
100
|
-
|
|
101
|
-
var _default = TabViewComponent;
|
|
102
|
-
exports.default = _default;
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
const TabViewItem = _ref => {
|
|
9
|
-
let {
|
|
10
|
-
title,
|
|
11
|
-
id,
|
|
12
|
-
icon,
|
|
13
|
-
children,
|
|
14
|
-
accessibilityLabel
|
|
15
|
-
} = _ref;
|
|
16
|
-
console.log({
|
|
17
|
-
title,
|
|
18
|
-
id,
|
|
19
|
-
icon,
|
|
20
|
-
accessibilityLabel
|
|
21
|
-
});
|
|
22
|
-
return children;
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
var _default = TabViewItem;
|
|
26
|
-
exports.default = _default;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "TabView", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function () {
|
|
9
|
-
return _TabView.default;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
Object.defineProperty(exports, "TabViewItem", {
|
|
13
|
-
enumerable: true,
|
|
14
|
-
get: function () {
|
|
15
|
-
return _TabViewItem.default;
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
|
|
19
|
-
var _TabView = _interopRequireDefault(require("./TabView"));
|
|
20
|
-
|
|
21
|
-
var _TabViewItem = _interopRequireDefault(require("./TabViewItem"));
|
|
22
|
-
|
|
23
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|