@draftbit/core 46.2.4-a6c053.5 → 46.2.4-b5dfee.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.
- package/lib/commonjs/components/Config.js +1 -1
- package/lib/commonjs/components/SVG.js +4 -5
- package/lib/commonjs/components/Youtube.js +73 -0
- package/lib/commonjs/index.js +8 -38
- package/lib/commonjs/mappings/SVG.js +2 -1
- package/lib/commonjs/mappings/Youtube.js +42 -0
- package/lib/commonjs/utilities.js +2 -2
- package/lib/module/components/Config.js +1 -1
- package/lib/module/components/SVG.js +4 -5
- package/lib/module/components/Youtube.js +59 -0
- package/lib/module/constants.js +1 -0
- package/lib/module/index.js +2 -2
- package/lib/module/mappings/SVG.js +3 -2
- package/lib/module/mappings/Youtube.js +33 -0
- package/lib/module/utilities.js +3 -3
- package/lib/typescript/src/components/SVG.d.ts +2 -2
- package/lib/typescript/src/components/Youtube.d.ts +44 -0
- package/lib/typescript/src/index.d.ts +1 -1
- package/lib/typescript/src/mappings/SVG.d.ts +1 -0
- package/lib/typescript/src/mappings/Youtube.d.ts +36 -0
- package/lib/typescript/src/utilities.d.ts +3 -3
- package/package.json +7 -5
- package/src/components/Config.js +1 -1
- package/src/components/Config.ts +1 -1
- package/src/components/SVG.js +4 -5
- package/src/components/SVG.tsx +7 -7
- package/src/components/Youtube.js +38 -0
- package/src/components/Youtube.tsx +66 -0
- package/src/index.js +1 -1
- package/src/index.tsx +1 -9
- package/src/mappings/SVG.js +8 -2
- package/src/mappings/SVG.ts +12 -2
- package/src/mappings/Youtube.js +33 -0
- package/src/mappings/Youtube.ts +39 -0
- package/src/utilities.js +2 -5
- package/src/utilities.ts +2 -13
- package/lib/commonjs/components/Table/Table.js +0 -35
- package/lib/commonjs/components/Table/TableCell.js +0 -50
- package/lib/commonjs/components/Table/TableHeader.js +0 -41
- package/lib/commonjs/components/Table/TablePaginator.js +0 -17
- package/lib/commonjs/components/Table/TableRow.js +0 -47
- package/lib/commonjs/components/Table/TableTitle.js +0 -60
- package/lib/commonjs/components/Table/index.js +0 -55
- package/lib/commonjs/mappings/Table.js +0 -103
- package/lib/module/components/Table/Table.js +0 -23
- package/lib/module/components/Table/TableCell.js +0 -37
- package/lib/module/components/Table/TableHeader.js +0 -27
- package/lib/module/components/Table/TablePaginator.js +0 -6
- package/lib/module/components/Table/TableRow.js +0 -33
- package/lib/module/components/Table/TableTitle.js +0 -47
- package/lib/module/components/Table/index.js +0 -6
- package/lib/module/mappings/Table.js +0 -94
- package/lib/typescript/src/components/Table/Table.d.ts +0 -8
- package/lib/typescript/src/components/Table/TableCell.d.ts +0 -10
- package/lib/typescript/src/components/Table/TableHeader.d.ts +0 -12
- package/lib/typescript/src/components/Table/TablePaginator.d.ts +0 -3
- package/lib/typescript/src/components/Table/TableRow.d.ts +0 -12
- package/lib/typescript/src/components/Table/TableTitle.d.ts +0 -12
- package/lib/typescript/src/components/Table/index.d.ts +0 -6
- package/lib/typescript/src/mappings/Table.d.ts +0 -153
- package/src/components/Table/Table.js +0 -10
- package/src/components/Table/Table.tsx +0 -22
- package/src/components/Table/TableCell.js +0 -21
- package/src/components/Table/TableCell.tsx +0 -44
- package/src/components/Table/TableHeader.js +0 -11
- package/src/components/Table/TableHeader.tsx +0 -28
- package/src/components/Table/TablePaginator.js +0 -5
- package/src/components/Table/TablePaginator.tsx +0 -10
- package/src/components/Table/TableRow.js +0 -16
- package/src/components/Table/TableRow.tsx +0 -31
- package/src/components/Table/TableTitle.js +0 -28
- package/src/components/Table/TableTitle.tsx +0 -58
- package/src/components/Table/index.js +0 -6
- package/src/components/Table/index.tsx +0 -6
- package/src/mappings/Table.js +0 -137
- package/src/mappings/Table.ts +0 -145
|
@@ -62,7 +62,7 @@ var _default = {
|
|
|
62
62
|
width: size.width,
|
|
63
63
|
height: size.height
|
|
64
64
|
}, "image-placeholder_1"),
|
|
65
|
-
placeholderSvgURL: "https://static.draftbit.com/images/placeholder-
|
|
65
|
+
placeholderSvgURL: "https://static.draftbit.com/images/placeholder-image.svg",
|
|
66
66
|
squareImageUrl: buildImageUrl({
|
|
67
67
|
width: 100,
|
|
68
68
|
height: 100
|
|
@@ -21,26 +21,25 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
21
21
|
|
|
22
22
|
const SVG = _ref => {
|
|
23
23
|
let {
|
|
24
|
-
source,
|
|
24
|
+
source = _Config.default.placeholderSvgURL,
|
|
25
25
|
style
|
|
26
26
|
} = _ref;
|
|
27
|
-
let svgSource = source === null || source === undefined ? _Config.default.placeholderSvgURL : source;
|
|
28
27
|
return /*#__PURE__*/React.createElement(React.Fragment, null, _reactNative.Platform.OS === "ios" && /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
29
28
|
style: style
|
|
30
29
|
}, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgUri, {
|
|
31
30
|
width: "100%",
|
|
32
31
|
height: "100%",
|
|
33
|
-
uri:
|
|
32
|
+
uri: source
|
|
34
33
|
})), _reactNative.Platform.OS === "android" && /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
35
34
|
style: style
|
|
36
35
|
}, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgUri, {
|
|
37
36
|
width: "100%",
|
|
38
37
|
height: "100%",
|
|
39
|
-
uri:
|
|
38
|
+
uri: source
|
|
40
39
|
})), _reactNative.Platform.OS === "web" && /*#__PURE__*/React.createElement(_reactNative.Image, {
|
|
41
40
|
style: style,
|
|
42
41
|
source: {
|
|
43
|
-
uri:
|
|
42
|
+
uri: source
|
|
44
43
|
}
|
|
45
44
|
}));
|
|
46
45
|
};
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = exports.SEED_DATA = void 0;
|
|
7
|
+
|
|
8
|
+
var _types = require("@draftbit/types");
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
var _reactNativeYoutubeIframe = _interopRequireDefault(require("react-native-youtube-iframe"));
|
|
13
|
+
|
|
14
|
+
var _utilities = require("../utilities");
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
|
|
18
|
+
const Youtube = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
videoId,
|
|
21
|
+
playlist,
|
|
22
|
+
style,
|
|
23
|
+
mute,
|
|
24
|
+
autoplay
|
|
25
|
+
} = _ref;
|
|
26
|
+
const {
|
|
27
|
+
viewStyles: {
|
|
28
|
+
height,
|
|
29
|
+
width
|
|
30
|
+
}
|
|
31
|
+
} = (0, _utilities.extractStyles)(style);
|
|
32
|
+
return /*#__PURE__*/_react.default.createElement(_reactNativeYoutubeIframe.default, {
|
|
33
|
+
height: height,
|
|
34
|
+
width: width,
|
|
35
|
+
play: autoplay,
|
|
36
|
+
videoId: videoId,
|
|
37
|
+
playList: playlist,
|
|
38
|
+
mute: mute
|
|
39
|
+
});
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
var _default = Youtube;
|
|
43
|
+
exports.default = _default;
|
|
44
|
+
const SEED_DATA = {
|
|
45
|
+
name: "Youtube",
|
|
46
|
+
tag: "Youtube",
|
|
47
|
+
description: "Youtube Component",
|
|
48
|
+
category: _types.COMPONENT_TYPES.media,
|
|
49
|
+
layout: {
|
|
50
|
+
width: "100%"
|
|
51
|
+
},
|
|
52
|
+
props: {
|
|
53
|
+
videoId: (0, _types.createTextProp)({
|
|
54
|
+
label: "VideoId",
|
|
55
|
+
description: "Youtube Video ID"
|
|
56
|
+
}),
|
|
57
|
+
playlist: (0, _types.createTextProp)({
|
|
58
|
+
label: "PlayList",
|
|
59
|
+
description: "Playlist ID"
|
|
60
|
+
}),
|
|
61
|
+
mute: (0, _types.createBoolProp)({
|
|
62
|
+
label: "Mute",
|
|
63
|
+
description: "Whether to mute video",
|
|
64
|
+
defaultValue: false
|
|
65
|
+
}),
|
|
66
|
+
autoplay: (0, _types.createBoolProp)({
|
|
67
|
+
label: "Autoplay",
|
|
68
|
+
description: "Whether to Autoplay video",
|
|
69
|
+
defaultValue: false
|
|
70
|
+
})
|
|
71
|
+
}
|
|
72
|
+
};
|
|
73
|
+
exports.SEED_DATA = SEED_DATA;
|
package/lib/commonjs/index.js
CHANGED
|
@@ -369,42 +369,6 @@ Object.defineProperty(exports, "SwitchRow", {
|
|
|
369
369
|
return _Switch.SwitchRow;
|
|
370
370
|
}
|
|
371
371
|
});
|
|
372
|
-
Object.defineProperty(exports, "Table", {
|
|
373
|
-
enumerable: true,
|
|
374
|
-
get: function () {
|
|
375
|
-
return _Table.Table;
|
|
376
|
-
}
|
|
377
|
-
});
|
|
378
|
-
Object.defineProperty(exports, "TableCell", {
|
|
379
|
-
enumerable: true,
|
|
380
|
-
get: function () {
|
|
381
|
-
return _Table.TableCell;
|
|
382
|
-
}
|
|
383
|
-
});
|
|
384
|
-
Object.defineProperty(exports, "TableHeader", {
|
|
385
|
-
enumerable: true,
|
|
386
|
-
get: function () {
|
|
387
|
-
return _Table.TableHeader;
|
|
388
|
-
}
|
|
389
|
-
});
|
|
390
|
-
Object.defineProperty(exports, "TablePaginator", {
|
|
391
|
-
enumerable: true,
|
|
392
|
-
get: function () {
|
|
393
|
-
return _Table.TablePaginator;
|
|
394
|
-
}
|
|
395
|
-
});
|
|
396
|
-
Object.defineProperty(exports, "TableRow", {
|
|
397
|
-
enumerable: true,
|
|
398
|
-
get: function () {
|
|
399
|
-
return _Table.TableRow;
|
|
400
|
-
}
|
|
401
|
-
});
|
|
402
|
-
Object.defineProperty(exports, "TableTitle", {
|
|
403
|
-
enumerable: true,
|
|
404
|
-
get: function () {
|
|
405
|
-
return _Table.TableTitle;
|
|
406
|
-
}
|
|
407
|
-
});
|
|
408
372
|
Object.defineProperty(exports, "TextField", {
|
|
409
373
|
enumerable: true,
|
|
410
374
|
get: function () {
|
|
@@ -429,6 +393,12 @@ Object.defineProperty(exports, "Touchable", {
|
|
|
429
393
|
return _Touchable.default;
|
|
430
394
|
}
|
|
431
395
|
});
|
|
396
|
+
Object.defineProperty(exports, "Youtube", {
|
|
397
|
+
enumerable: true,
|
|
398
|
+
get: function () {
|
|
399
|
+
return _Youtube.default;
|
|
400
|
+
}
|
|
401
|
+
});
|
|
432
402
|
Object.defineProperty(exports, "injectIcon", {
|
|
433
403
|
enumerable: true,
|
|
434
404
|
get: function () {
|
|
@@ -512,8 +482,6 @@ var _Layout = require("./components/Layout");
|
|
|
512
482
|
|
|
513
483
|
var _index = require("./components/RadioButton/index");
|
|
514
484
|
|
|
515
|
-
var _Table = require("./components/Table");
|
|
516
|
-
|
|
517
485
|
var _DeprecatedButton = _interopRequireDefault(require("./components/DeprecatedButton"));
|
|
518
486
|
|
|
519
487
|
var _CardBlock = _interopRequireDefault(require("./components/CardBlock"));
|
|
@@ -550,6 +518,8 @@ var _Stepper = _interopRequireDefault(require("./components/Stepper"));
|
|
|
550
518
|
|
|
551
519
|
var _useAuthState = require("./components/useAuthState");
|
|
552
520
|
|
|
521
|
+
var _Youtube = _interopRequireDefault(require("./components/Youtube"));
|
|
522
|
+
|
|
553
523
|
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); }
|
|
554
524
|
|
|
555
525
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -16,8 +16,9 @@ const SEED_DATA = {
|
|
|
16
16
|
width: 100,
|
|
17
17
|
height: 100
|
|
18
18
|
},
|
|
19
|
+
stylesPanelSections: [_types.StylesPanelSections.Size, _types.StylesPanelSections.Margins, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
19
20
|
props: {
|
|
20
|
-
source: (0, _types.
|
|
21
|
+
source: (0, _types.createSVGProp)()
|
|
21
22
|
}
|
|
22
23
|
};
|
|
23
24
|
exports.SEED_DATA = SEED_DATA;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SEED_DATA = void 0;
|
|
7
|
+
|
|
8
|
+
var _types = require("@draftbit/types");
|
|
9
|
+
|
|
10
|
+
const SEED_DATA = {
|
|
11
|
+
name: "Youtube",
|
|
12
|
+
tag: "Youtube",
|
|
13
|
+
description: "Given a VideoId orPlaylist and play Youtube video",
|
|
14
|
+
doc_link: "https://lonelycpp.github.io/react-native-youtube-iframe",
|
|
15
|
+
code_link: "https://github.com/LonelyCpp/react-native-youtube-iframe",
|
|
16
|
+
category: _types.COMPONENT_TYPES.media,
|
|
17
|
+
stylesPanelSections: [_types.StylesPanelSections.Size],
|
|
18
|
+
layout: {
|
|
19
|
+
height: 250
|
|
20
|
+
},
|
|
21
|
+
props: {
|
|
22
|
+
videoId: (0, _types.createTextProp)({
|
|
23
|
+
label: "Video ID",
|
|
24
|
+
description: "VideoId of the Youtube video.",
|
|
25
|
+
defaultValue: "nwMUpDESXrI"
|
|
26
|
+
}),
|
|
27
|
+
playlist: (0, _types.createTextProp)({
|
|
28
|
+
label: "Playlist",
|
|
29
|
+
description: "Playlist of the Youtube videos.",
|
|
30
|
+
defaultValue: "PLUa6TiXzjIrwowt6P-uGCJm8ovm-9S1Ks"
|
|
31
|
+
}),
|
|
32
|
+
mute: (0, _types.createStaticBoolProp)({
|
|
33
|
+
label: "Mute Audio",
|
|
34
|
+
description: "Mute the audio of the video."
|
|
35
|
+
}),
|
|
36
|
+
autoplay: (0, _types.createStaticBoolProp)({
|
|
37
|
+
label: "Auto Play",
|
|
38
|
+
description: "Autoplay the video on load."
|
|
39
|
+
})
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
exports.SEED_DATA = SEED_DATA;
|
|
@@ -54,7 +54,7 @@ export default {
|
|
|
54
54
|
width: size.width,
|
|
55
55
|
height: size.height
|
|
56
56
|
}, "image-placeholder_1"),
|
|
57
|
-
placeholderSvgURL: "https://static.draftbit.com/images/placeholder-
|
|
57
|
+
placeholderSvgURL: "https://static.draftbit.com/images/placeholder-image.svg",
|
|
58
58
|
squareImageUrl: buildImageUrl({
|
|
59
59
|
width: 100,
|
|
60
60
|
height: 100
|
|
@@ -5,26 +5,25 @@ import Config from "./Config";
|
|
|
5
5
|
|
|
6
6
|
const SVG = _ref => {
|
|
7
7
|
let {
|
|
8
|
-
source,
|
|
8
|
+
source = Config.placeholderSvgURL,
|
|
9
9
|
style
|
|
10
10
|
} = _ref;
|
|
11
|
-
let svgSource = source === null || source === undefined ? Config.placeholderSvgURL : source;
|
|
12
11
|
return /*#__PURE__*/React.createElement(React.Fragment, null, Platform.OS === "ios" && /*#__PURE__*/React.createElement(View, {
|
|
13
12
|
style: style
|
|
14
13
|
}, /*#__PURE__*/React.createElement(SvgUri, {
|
|
15
14
|
width: "100%",
|
|
16
15
|
height: "100%",
|
|
17
|
-
uri:
|
|
16
|
+
uri: source
|
|
18
17
|
})), Platform.OS === "android" && /*#__PURE__*/React.createElement(View, {
|
|
19
18
|
style: style
|
|
20
19
|
}, /*#__PURE__*/React.createElement(SvgUri, {
|
|
21
20
|
width: "100%",
|
|
22
21
|
height: "100%",
|
|
23
|
-
uri:
|
|
22
|
+
uri: source
|
|
24
23
|
})), Platform.OS === "web" && /*#__PURE__*/React.createElement(Image, {
|
|
25
24
|
style: style,
|
|
26
25
|
source: {
|
|
27
|
-
uri:
|
|
26
|
+
uri: source
|
|
28
27
|
}
|
|
29
28
|
}));
|
|
30
29
|
};
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { COMPONENT_TYPES, createBoolProp, createTextProp } from "@draftbit/types";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import YoutubePlayer from "react-native-youtube-iframe";
|
|
4
|
+
import { extractStyles } from "../utilities";
|
|
5
|
+
|
|
6
|
+
const Youtube = _ref => {
|
|
7
|
+
let {
|
|
8
|
+
videoId,
|
|
9
|
+
playlist,
|
|
10
|
+
style,
|
|
11
|
+
mute,
|
|
12
|
+
autoplay
|
|
13
|
+
} = _ref;
|
|
14
|
+
const {
|
|
15
|
+
viewStyles: {
|
|
16
|
+
height,
|
|
17
|
+
width
|
|
18
|
+
}
|
|
19
|
+
} = extractStyles(style);
|
|
20
|
+
return /*#__PURE__*/React.createElement(YoutubePlayer, {
|
|
21
|
+
height: height,
|
|
22
|
+
width: width,
|
|
23
|
+
play: autoplay,
|
|
24
|
+
videoId: videoId,
|
|
25
|
+
playList: playlist,
|
|
26
|
+
mute: mute
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
export default Youtube;
|
|
31
|
+
export const SEED_DATA = {
|
|
32
|
+
name: "Youtube",
|
|
33
|
+
tag: "Youtube",
|
|
34
|
+
description: "Youtube Component",
|
|
35
|
+
category: COMPONENT_TYPES.media,
|
|
36
|
+
layout: {
|
|
37
|
+
width: "100%"
|
|
38
|
+
},
|
|
39
|
+
props: {
|
|
40
|
+
videoId: createTextProp({
|
|
41
|
+
label: "VideoId",
|
|
42
|
+
description: "Youtube Video ID"
|
|
43
|
+
}),
|
|
44
|
+
playlist: createTextProp({
|
|
45
|
+
label: "PlayList",
|
|
46
|
+
description: "Playlist ID"
|
|
47
|
+
}),
|
|
48
|
+
mute: createBoolProp({
|
|
49
|
+
label: "Mute",
|
|
50
|
+
description: "Whether to mute video",
|
|
51
|
+
defaultValue: false
|
|
52
|
+
}),
|
|
53
|
+
autoplay: createBoolProp({
|
|
54
|
+
label: "Autoplay",
|
|
55
|
+
description: "Whether to Autoplay video",
|
|
56
|
+
defaultValue: false
|
|
57
|
+
})
|
|
58
|
+
}
|
|
59
|
+
};
|
package/lib/module/constants.js
CHANGED
package/lib/module/index.js
CHANGED
|
@@ -31,7 +31,6 @@ export { ActionSheet, ActionSheetItem, ActionSheetCancel } from "./components/Ac
|
|
|
31
31
|
export { Swiper, SwiperItem } from "./components/Swiper";
|
|
32
32
|
export { Center, Circle, Square, Row, Stack, Spacer } from "./components/Layout";
|
|
33
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup } from "./components/RadioButton/index";
|
|
34
|
-
export { Table, TableRow, TablePaginator, TableHeader, TableCell, TableTitle } from "./components/Table";
|
|
35
34
|
/* Deprecated: Fix or Delete! */
|
|
36
35
|
|
|
37
36
|
export { default as Button } from "./components/DeprecatedButton";
|
|
@@ -51,4 +50,5 @@ export { default as RowHeadlineImageCaption } from "./components/RowHeadlineImag
|
|
|
51
50
|
export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIcon";
|
|
52
51
|
export { default as Slider } from "./components/Slider";
|
|
53
52
|
export { default as Stepper } from "./components/Stepper";
|
|
54
|
-
export { useAuthState } from "./components/useAuthState";
|
|
53
|
+
export { useAuthState } from "./components/useAuthState";
|
|
54
|
+
export { default as Youtube } from "./components/Youtube"; // a comment to fix sourcemap comment issue
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { COMPONENT_TYPES,
|
|
1
|
+
import { COMPONENT_TYPES, createSVGProp, StylesPanelSections } from "@draftbit/types";
|
|
2
2
|
export const SEED_DATA = {
|
|
3
3
|
name: "SVG",
|
|
4
4
|
tag: "SVG",
|
|
@@ -8,7 +8,8 @@ export const SEED_DATA = {
|
|
|
8
8
|
width: 100,
|
|
9
9
|
height: 100
|
|
10
10
|
},
|
|
11
|
+
stylesPanelSections: [StylesPanelSections.Size, StylesPanelSections.Margins, StylesPanelSections.Position, StylesPanelSections.Effects],
|
|
11
12
|
props: {
|
|
12
|
-
source:
|
|
13
|
+
source: createSVGProp()
|
|
13
14
|
}
|
|
14
15
|
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { COMPONENT_TYPES, createStaticBoolProp, createTextProp, StylesPanelSections } from "@draftbit/types";
|
|
2
|
+
export const SEED_DATA = {
|
|
3
|
+
name: "Youtube",
|
|
4
|
+
tag: "Youtube",
|
|
5
|
+
description: "Given a VideoId orPlaylist and play Youtube video",
|
|
6
|
+
doc_link: "https://lonelycpp.github.io/react-native-youtube-iframe",
|
|
7
|
+
code_link: "https://github.com/LonelyCpp/react-native-youtube-iframe",
|
|
8
|
+
category: COMPONENT_TYPES.media,
|
|
9
|
+
stylesPanelSections: [StylesPanelSections.Size],
|
|
10
|
+
layout: {
|
|
11
|
+
height: 250
|
|
12
|
+
},
|
|
13
|
+
props: {
|
|
14
|
+
videoId: createTextProp({
|
|
15
|
+
label: "Video ID",
|
|
16
|
+
description: "VideoId of the Youtube video.",
|
|
17
|
+
defaultValue: "nwMUpDESXrI"
|
|
18
|
+
}),
|
|
19
|
+
playlist: createTextProp({
|
|
20
|
+
label: "Playlist",
|
|
21
|
+
description: "Playlist of the Youtube videos.",
|
|
22
|
+
defaultValue: "PLUa6TiXzjIrwowt6P-uGCJm8ovm-9S1Ks"
|
|
23
|
+
}),
|
|
24
|
+
mute: createStaticBoolProp({
|
|
25
|
+
label: "Mute Audio",
|
|
26
|
+
description: "Mute the audio of the video."
|
|
27
|
+
}),
|
|
28
|
+
autoplay: createStaticBoolProp({
|
|
29
|
+
label: "Auto Play",
|
|
30
|
+
description: "Autoplay the video on load."
|
|
31
|
+
})
|
|
32
|
+
}
|
|
33
|
+
};
|
package/lib/module/utilities.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { StyleSheet } from "react-native";
|
|
2
|
-
import { isString, isNumber, pick, pickBy, identity
|
|
2
|
+
import { isString, isNumber, pick, pickBy, identity } from "lodash";
|
|
3
3
|
export function extractStyles(style) {
|
|
4
4
|
const {
|
|
5
5
|
color,
|
|
@@ -29,8 +29,8 @@ export function extractStyles(style) {
|
|
|
29
29
|
textDecorationStyle
|
|
30
30
|
};
|
|
31
31
|
return {
|
|
32
|
-
viewStyles
|
|
33
|
-
textStyles
|
|
32
|
+
viewStyles,
|
|
33
|
+
textStyles
|
|
34
34
|
};
|
|
35
35
|
}
|
|
36
36
|
export const borderStyleNames = ["borderRadius", "borderBottomColor", "borderBottomEndRadius", "borderBottomLeftRadius", "borderBottomRightRadius", "borderBottomStartRadius", "borderBottomWidth", "borderColor", "borderEndColor", "borderLeftColor", "borderLeftWidth", "borderRadius", "borderRightColor", "borderRightWidth", "borderStartColor", "borderStyle", "borderTopColor", "borderTopEndRadius", "borderTopLeftRadius", "borderTopRightRadius", "borderTopStartRadius", "borderTopWidth", "borderWidth"];
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
2
|
import { StyleProp, ImageStyle } from "react-native";
|
|
3
3
|
declare type SVGComponentProps = {
|
|
4
4
|
source: string;
|
|
5
5
|
style?: StyleProp<ImageStyle>;
|
|
6
6
|
};
|
|
7
|
-
declare const SVG:
|
|
7
|
+
declare const SVG: React.FC<React.PropsWithChildren<SVGComponentProps>>;
|
|
8
8
|
export default SVG;
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { StyleProp, ViewStyle } from "react-native";
|
|
3
|
+
declare type Props = {
|
|
4
|
+
videoId: string;
|
|
5
|
+
playlist: string;
|
|
6
|
+
style: StyleProp<ViewStyle>;
|
|
7
|
+
mute: boolean;
|
|
8
|
+
autoplay: boolean;
|
|
9
|
+
};
|
|
10
|
+
declare const Youtube: ({ videoId, playlist, style, mute, autoplay }: Props) => JSX.Element;
|
|
11
|
+
export default Youtube;
|
|
12
|
+
export declare const SEED_DATA: {
|
|
13
|
+
name: string;
|
|
14
|
+
tag: string;
|
|
15
|
+
description: string;
|
|
16
|
+
category: string;
|
|
17
|
+
layout: {
|
|
18
|
+
width: string;
|
|
19
|
+
};
|
|
20
|
+
props: {
|
|
21
|
+
videoId: any;
|
|
22
|
+
playlist: any;
|
|
23
|
+
mute: {
|
|
24
|
+
label: string;
|
|
25
|
+
description: string;
|
|
26
|
+
formType: string;
|
|
27
|
+
propType: string;
|
|
28
|
+
defaultValue: boolean;
|
|
29
|
+
editable: boolean;
|
|
30
|
+
required: boolean;
|
|
31
|
+
group: string;
|
|
32
|
+
};
|
|
33
|
+
autoplay: {
|
|
34
|
+
label: string;
|
|
35
|
+
description: string;
|
|
36
|
+
formType: string;
|
|
37
|
+
propType: string;
|
|
38
|
+
defaultValue: boolean;
|
|
39
|
+
editable: boolean;
|
|
40
|
+
required: boolean;
|
|
41
|
+
group: string;
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
};
|
|
@@ -31,7 +31,6 @@ export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/A
|
|
|
31
31
|
export { Swiper, SwiperItem } from "./components/Swiper";
|
|
32
32
|
export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
|
|
33
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
|
|
34
|
-
export { Table, TableRow, TablePaginator, TableHeader, TableCell, TableTitle, } from "./components/Table";
|
|
35
34
|
export { default as Button } from "./components/DeprecatedButton";
|
|
36
35
|
export { default as CardBlock } from "./components/CardBlock";
|
|
37
36
|
export { default as CardContainer } from "./components/CardContainer";
|
|
@@ -50,3 +49,4 @@ export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIc
|
|
|
50
49
|
export { default as Slider } from "./components/Slider";
|
|
51
50
|
export { default as Stepper } from "./components/Stepper";
|
|
52
51
|
export { useAuthState } from "./components/useAuthState";
|
|
52
|
+
export { default as Youtube } from "./components/Youtube";
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
export declare const SEED_DATA: {
|
|
2
|
+
name: string;
|
|
3
|
+
tag: string;
|
|
4
|
+
description: string;
|
|
5
|
+
doc_link: string;
|
|
6
|
+
code_link: string;
|
|
7
|
+
category: string;
|
|
8
|
+
stylesPanelSections: string[];
|
|
9
|
+
layout: {
|
|
10
|
+
height: number;
|
|
11
|
+
};
|
|
12
|
+
props: {
|
|
13
|
+
videoId: any;
|
|
14
|
+
playlist: any;
|
|
15
|
+
mute: {
|
|
16
|
+
label: string;
|
|
17
|
+
description: string;
|
|
18
|
+
formType: string;
|
|
19
|
+
propType: string;
|
|
20
|
+
defaultValue: boolean;
|
|
21
|
+
editable: boolean;
|
|
22
|
+
required: boolean;
|
|
23
|
+
group: string;
|
|
24
|
+
};
|
|
25
|
+
autoplay: {
|
|
26
|
+
label: string;
|
|
27
|
+
description: string;
|
|
28
|
+
formType: string;
|
|
29
|
+
propType: string;
|
|
30
|
+
defaultValue: boolean;
|
|
31
|
+
editable: boolean;
|
|
32
|
+
required: boolean;
|
|
33
|
+
group: string;
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/// <reference types="lodash" />
|
|
2
|
-
import { StyleProp } from "react-native";
|
|
2
|
+
import { StyleProp, TextStyle } from "react-native";
|
|
3
3
|
export declare function extractStyles(style: StyleProp<any>): {
|
|
4
|
-
viewStyles:
|
|
5
|
-
textStyles:
|
|
4
|
+
viewStyles: any;
|
|
5
|
+
textStyles: TextStyle;
|
|
6
6
|
};
|
|
7
7
|
export declare const borderStyleNames: string[];
|
|
8
8
|
export declare const marginStyleNames: string[];
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@draftbit/core",
|
|
3
|
-
"version": "46.2.4-
|
|
3
|
+
"version": "46.2.4-b5dfee.10+b5dfee80",
|
|
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.
|
|
44
|
+
"@draftbit/types": "^46.3.0",
|
|
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",
|
|
@@ -53,9 +53,11 @@
|
|
|
53
53
|
"lodash.omit": "^4.5.0",
|
|
54
54
|
"lodash.tonumber": "^4.0.3",
|
|
55
55
|
"react-native-modal-datetime-picker": "^13.0.0",
|
|
56
|
-
"react-native-svg": "
|
|
56
|
+
"react-native-svg": "12.3.0",
|
|
57
57
|
"react-native-typography": "^1.4.1",
|
|
58
|
-
"react-native-web-swiper": "^2.2.3"
|
|
58
|
+
"react-native-web-swiper": "^2.2.3",
|
|
59
|
+
"react-native-web-webview": "^1.0.2",
|
|
60
|
+
"react-native-youtube-iframe": "^2.2.2"
|
|
59
61
|
},
|
|
60
62
|
"devDependencies": {
|
|
61
63
|
"@types/color": "^3.0.1",
|
|
@@ -80,5 +82,5 @@
|
|
|
80
82
|
]
|
|
81
83
|
]
|
|
82
84
|
},
|
|
83
|
-
"gitHead": "
|
|
85
|
+
"gitHead": "b5dfee808223661ce6bf04e5b62102ccb1831b82"
|
|
84
86
|
}
|
package/src/components/Config.js
CHANGED
|
@@ -42,7 +42,7 @@ export default {
|
|
|
42
42
|
cardIconElevation: 1,
|
|
43
43
|
placeholderImageURL: "https://static.draftbit.com/images/placeholder-image" + getExtension(),
|
|
44
44
|
getPlaceholderImageUrl: (size) => buildImageUrl({ width: size.width, height: size.height }, "image-placeholder_1"),
|
|
45
|
-
placeholderSvgURL: "https://static.draftbit.com/images/placeholder-
|
|
45
|
+
placeholderSvgURL: "https://static.draftbit.com/images/placeholder-image.svg",
|
|
46
46
|
squareImageUrl: buildImageUrl({ width: 100, height: 100 }, "Avatar"),
|
|
47
47
|
FABSize: 40,
|
|
48
48
|
FABBorderRadius: 20,
|
package/src/components/Config.ts
CHANGED
|
@@ -60,7 +60,7 @@ export default {
|
|
|
60
60
|
{ width: size.width, height: size.height },
|
|
61
61
|
"image-placeholder_1"
|
|
62
62
|
),
|
|
63
|
-
placeholderSvgURL: "https://static.draftbit.com/images/placeholder-
|
|
63
|
+
placeholderSvgURL: "https://static.draftbit.com/images/placeholder-image.svg",
|
|
64
64
|
squareImageUrl: buildImageUrl({ width: 100, height: 100 }, "Avatar"),
|
|
65
65
|
FABSize: 40,
|
|
66
66
|
FABBorderRadius: 20,
|
package/src/components/SVG.js
CHANGED
|
@@ -2,13 +2,12 @@ import * as React from "react";
|
|
|
2
2
|
import { View, Platform, Image } from "react-native";
|
|
3
3
|
import { SvgUri } from "react-native-svg";
|
|
4
4
|
import Config from "./Config";
|
|
5
|
-
const SVG = ({ source, style }) => {
|
|
6
|
-
let svgSource = source === null || source === undefined ? Config.placeholderSvgURL : source;
|
|
5
|
+
const SVG = ({ source = Config.placeholderSvgURL, style, }) => {
|
|
7
6
|
return (React.createElement(React.Fragment, null,
|
|
8
7
|
Platform.OS === "ios" && (React.createElement(View, { style: style },
|
|
9
|
-
React.createElement(SvgUri, { width: "100%", height: "100%", uri:
|
|
8
|
+
React.createElement(SvgUri, { width: "100%", height: "100%", uri: source }))),
|
|
10
9
|
Platform.OS === "android" && (React.createElement(View, { style: style },
|
|
11
|
-
React.createElement(SvgUri, { width: "100%", height: "100%", uri:
|
|
12
|
-
Platform.OS === "web" && (React.createElement(Image, { style: style, source: { uri:
|
|
10
|
+
React.createElement(SvgUri, { width: "100%", height: "100%", uri: source }))),
|
|
11
|
+
Platform.OS === "web" && (React.createElement(Image, { style: style, source: { uri: source } }))));
|
|
13
12
|
};
|
|
14
13
|
export default SVG;
|