@draftbit/core 46.2.4-4a23d6.5 → 46.2.4-4bffa4.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/lib/commonjs/components/Config.js +1 -1
  2. package/lib/commonjs/components/SVG.js +4 -5
  3. package/lib/commonjs/components/TabView/TabView.js +102 -0
  4. package/lib/commonjs/components/TabView/TabViewItem.js +26 -0
  5. package/lib/commonjs/components/TabView/index.js +23 -0
  6. package/lib/commonjs/index.js +14 -8
  7. package/lib/commonjs/mappings/SVG.js +2 -1
  8. package/lib/commonjs/mappings/TabView.js +79 -0
  9. package/lib/module/components/Config.js +1 -1
  10. package/lib/module/components/SVG.js +4 -5
  11. package/lib/module/components/TabView/TabView.js +87 -0
  12. package/lib/module/components/TabView/TabViewItem.js +18 -0
  13. package/lib/module/components/TabView/index.js +2 -0
  14. package/lib/module/index.js +2 -2
  15. package/lib/module/mappings/SVG.js +3 -2
  16. package/lib/module/mappings/TabView.js +70 -0
  17. package/lib/typescript/src/components/SVG.d.ts +2 -2
  18. package/lib/typescript/src/components/TabView/TabView.d.ts +19 -0
  19. package/lib/typescript/src/components/TabView/TabViewItem.d.ts +10 -0
  20. package/lib/typescript/src/components/TabView/index.d.ts +2 -0
  21. package/lib/typescript/src/index.d.ts +1 -1
  22. package/lib/typescript/src/mappings/SVG.d.ts +1 -0
  23. package/lib/typescript/src/mappings/TabView.d.ts +111 -0
  24. package/package.json +6 -6
  25. package/src/components/Config.js +1 -1
  26. package/src/components/Config.ts +1 -1
  27. package/src/components/SVG.js +4 -5
  28. package/src/components/SVG.tsx +7 -7
  29. package/src/components/TabView/TabView.js +34 -0
  30. package/src/components/TabView/TabView.tsx +97 -0
  31. package/src/components/TabView/TabViewItem.js +5 -0
  32. package/src/components/TabView/TabViewItem.tsx +21 -0
  33. package/src/components/TabView/index.js +2 -0
  34. package/src/components/TabView/index.tsx +2 -0
  35. package/src/index.js +1 -1
  36. package/src/index.tsx +1 -1
  37. package/src/mappings/SVG.js +8 -2
  38. package/src/mappings/SVG.ts +12 -2
  39. package/src/mappings/TabView.js +73 -0
  40. package/src/mappings/TabView.ts +80 -0
  41. package/lib/commonjs/components/Youtube.js +0 -73
  42. package/lib/commonjs/mappings/Youtube.js +0 -42
  43. package/lib/module/components/Youtube.js +0 -59
  44. package/lib/module/mappings/Youtube.js +0 -33
  45. package/lib/typescript/src/components/Youtube.d.ts +0 -44
  46. package/lib/typescript/src/mappings/Youtube.d.ts +0 -36
  47. package/src/components/Youtube.js +0 -38
  48. package/src/components/Youtube.tsx +0 -66
  49. package/src/mappings/Youtube.js +0 -33
  50. package/src/mappings/Youtube.ts +0 -39
@@ -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-svg.svg",
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: svgSource
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: svgSource
38
+ uri: source
40
39
  })), _reactNative.Platform.OS === "web" && /*#__PURE__*/React.createElement(_reactNative.Image, {
41
40
  style: style,
42
41
  source: {
43
- uri: svgSource
42
+ uri: source
44
43
  }
45
44
  }));
46
45
  };
@@ -0,0 +1,102 @@
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;
@@ -0,0 +1,26 @@
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;
@@ -0,0 +1,23 @@
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 }; }
@@ -369,6 +369,18 @@ 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
+ });
372
384
  Object.defineProperty(exports, "TextField", {
373
385
  enumerable: true,
374
386
  get: function () {
@@ -393,12 +405,6 @@ Object.defineProperty(exports, "Touchable", {
393
405
  return _Touchable.default;
394
406
  }
395
407
  });
396
- Object.defineProperty(exports, "Youtube", {
397
- enumerable: true,
398
- get: function () {
399
- return _Youtube.default;
400
- }
401
- });
402
408
  Object.defineProperty(exports, "injectIcon", {
403
409
  enumerable: true,
404
410
  get: function () {
@@ -478,6 +484,8 @@ var _ActionSheet = require("./components/ActionSheet");
478
484
 
479
485
  var _Swiper = require("./components/Swiper");
480
486
 
487
+ var _TabView = require("./components/TabView");
488
+
481
489
  var _Layout = require("./components/Layout");
482
490
 
483
491
  var _index = require("./components/RadioButton/index");
@@ -518,8 +526,6 @@ var _Stepper = _interopRequireDefault(require("./components/Stepper"));
518
526
 
519
527
  var _useAuthState = require("./components/useAuthState");
520
528
 
521
- var _Youtube = _interopRequireDefault(require("./components/Youtube"));
522
-
523
529
  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); }
524
530
 
525
531
  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.createSvgProp)()
21
+ source: (0, _types.createSVGProp)()
21
22
  }
22
23
  };
23
24
  exports.SEED_DATA = SEED_DATA;
@@ -0,0 +1,79 @@
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: "TabView",
12
+ tag: "TabView",
13
+ category: _types.COMPONENT_TYPES.container,
14
+ layout: {},
15
+ props: {
16
+ tabBarPosition: (0, _types.createTextEnumProp)({
17
+ label: "Tab Bar Position",
18
+ description: "Tab Bar Position",
19
+ options: ["top", "bottom"],
20
+ defaultValue: "top"
21
+ }),
22
+ keyboardDismissMode: (0, _types.createTextEnumProp)({
23
+ label: "Keyboard Dismiss Mode",
24
+ description: "Keyboard Dismiss Mode",
25
+ options: ["auto", "on-drag", "none"],
26
+ defaultValue: "auto"
27
+ }),
28
+ swipeEnabled: (0, _types.createBoolProp)({
29
+ label: "Swipe Enabled",
30
+ description: "Swipe Enabled",
31
+ defaultValue: true
32
+ }),
33
+ scrollEnabled: (0, _types.createBoolProp)({
34
+ label: "Scroll Enabled",
35
+ description: "Scroll Enabled",
36
+ defaultValue: true
37
+ }),
38
+ activeColor: (0, _types.createColorProp)({
39
+ label: "Active Color",
40
+ description: "Active Color",
41
+ defaultValue: "primary"
42
+ }),
43
+ inactiveColor: (0, _types.createColorProp)({
44
+ label: "Inactive Color",
45
+ description: "Inactive Color",
46
+ defaultValue: null
47
+ }),
48
+ pressColor: (0, _types.createColorProp)({
49
+ label: "Press Color",
50
+ description: "Press Color",
51
+ defaultValue: null
52
+ }),
53
+ indicatorColor: (0, _types.createColorProp)({
54
+ label: "Indicator Color",
55
+ description: "Indicator Color",
56
+ defaultValue: null
57
+ })
58
+ }
59
+ }, {
60
+ name: "TabViewItem",
61
+ tag: "TabViewItem",
62
+ category: _types.COMPONENT_TYPES.container,
63
+ layout: {},
64
+ props: {
65
+ title: (0, _types.createTextProp)({
66
+ label: "Title",
67
+ description: "Tab Title"
68
+ }),
69
+ id: (0, _types.createTextProp)({
70
+ label: "Id",
71
+ description: "Tab Id"
72
+ }),
73
+ accessibilityLabel: (0, _types.createTextProp)({
74
+ label: "Accessibility Label",
75
+ description: "Accessibility Label"
76
+ })
77
+ }
78
+ }];
79
+ 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-svg.svg",
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: svgSource
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: svgSource
22
+ uri: source
24
23
  })), Platform.OS === "web" && /*#__PURE__*/React.createElement(Image, {
25
24
  style: style,
26
25
  source: {
27
- uri: svgSource
26
+ uri: source
28
27
  }
29
28
  }));
30
29
  };
@@ -0,0 +1,87 @@
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
+ import * as React from "react";
4
+ import { TabView, TabBar, SceneMap } from "react-native-tab-view"; // import { withTheme } from "../../theming";
5
+
6
+ import TabViewItem from "./TabViewItem";
7
+
8
+ const TabViewComponent = _ref => {
9
+ let {
10
+ Icon,
11
+ tabBarPosition,
12
+ keyboardDismissMode,
13
+ swipeEnabled,
14
+ scrollEnabled,
15
+ activeColor,
16
+ inactiveColor,
17
+ pressColor,
18
+ indicatorColor,
19
+ style,
20
+ children
21
+ } = _ref;
22
+ const [index, setIndex] = React.useState(0);
23
+ const [routes, setRoutes] = React.useState([]);
24
+ const [tabScenes, setTabScenes] = React.useState({});
25
+ React.useEffect(() => {
26
+ const newRoutes = [];
27
+ const scenes = {};
28
+ React.Children.toArray(children).filter(child => child.type === TabViewItem).forEach(child => {
29
+ var _child$props;
30
+
31
+ if (child !== null && child !== void 0 && (_child$props = child.props) !== null && _child$props !== void 0 && _child$props.id) {
32
+ var _child$props2, _child$props3;
33
+
34
+ newRoutes.push({
35
+ key: child === null || child === void 0 ? void 0 : (_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.id,
36
+ ...(child === null || child === void 0 ? void 0 : child.props)
37
+ });
38
+
39
+ scenes[child === null || child === void 0 ? void 0 : (_child$props3 = child.props) === null || _child$props3 === void 0 ? void 0 : _child$props3.id] = () => child;
40
+ }
41
+ });
42
+ setRoutes(newRoutes);
43
+ setTabScenes(scenes);
44
+ }, [children]);
45
+
46
+ const indexChangeHandler = i => setIndex(i);
47
+
48
+ const renderTabBar = props => {
49
+ console.log(props);
50
+ return /*#__PURE__*/React.createElement(TabBar, _extends({}, props, {
51
+ activeColor: activeColor,
52
+ inactiveColor: inactiveColor,
53
+ pressColor: pressColor,
54
+ scrollEnabled: scrollEnabled,
55
+ indicatorStyle: {
56
+ backgroundColor: indicatorColor
57
+ },
58
+ renderIcon: _ref2 => {
59
+ let {
60
+ route,
61
+ color
62
+ } = _ref2;
63
+ return route !== null && route !== void 0 && route.icon ? /*#__PURE__*/React.createElement(Icon, {
64
+ name: route.icon,
65
+ color: color,
66
+ size: 36
67
+ }) : null;
68
+ },
69
+ style: style
70
+ }));
71
+ };
72
+
73
+ return /*#__PURE__*/React.createElement(TabView, {
74
+ navigationState: {
75
+ index,
76
+ routes
77
+ },
78
+ renderScene: SceneMap(tabScenes),
79
+ renderTabBar: renderTabBar,
80
+ onIndexChange: indexChangeHandler,
81
+ tabBarPosition: tabBarPosition,
82
+ keyboardDismissMode: keyboardDismissMode,
83
+ swipeEnabled: swipeEnabled
84
+ });
85
+ };
86
+
87
+ export default TabViewComponent;
@@ -0,0 +1,18 @@
1
+ const TabViewItem = _ref => {
2
+ let {
3
+ title,
4
+ id,
5
+ icon,
6
+ children,
7
+ accessibilityLabel
8
+ } = _ref;
9
+ console.log({
10
+ title,
11
+ id,
12
+ icon,
13
+ accessibilityLabel
14
+ });
15
+ return children;
16
+ };
17
+
18
+ export default TabViewItem;
@@ -0,0 +1,2 @@
1
+ export { default as TabView } from "./TabView";
2
+ export { default as TabViewItem } from "./TabViewItem";
@@ -29,6 +29,7 @@ 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";
32
33
  export { Center, Circle, Square, Row, Stack, Spacer } from "./components/Layout";
33
34
  export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup } from "./components/RadioButton/index";
34
35
  /* Deprecated: Fix or Delete! */
@@ -50,5 +51,4 @@ export { default as RowHeadlineImageCaption } from "./components/RowHeadlineImag
50
51
  export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIcon";
51
52
  export { default as Slider } from "./components/Slider";
52
53
  export { default as Stepper } from "./components/Stepper";
53
- export { useAuthState } from "./components/useAuthState";
54
- export { default as Youtube } from "./components/Youtube"; // a comment to fix sourcemap comment issue
54
+ export { useAuthState } from "./components/useAuthState"; // a comment to fix sourcemap comment issue
@@ -1,4 +1,4 @@
1
- import { COMPONENT_TYPES, createSvgProp } from "@draftbit/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: createSvgProp()
13
+ source: createSVGProp()
13
14
  }
14
15
  };
@@ -0,0 +1,70 @@
1
+ import { COMPONENT_TYPES, createTextProp, createTextEnumProp, createBoolProp, createColorProp } from "@draftbit/types";
2
+ export const SEED_DATA = [{
3
+ name: "TabView",
4
+ tag: "TabView",
5
+ category: COMPONENT_TYPES.container,
6
+ layout: {},
7
+ props: {
8
+ tabBarPosition: createTextEnumProp({
9
+ label: "Tab Bar Position",
10
+ description: "Tab Bar Position",
11
+ options: ["top", "bottom"],
12
+ defaultValue: "top"
13
+ }),
14
+ keyboardDismissMode: createTextEnumProp({
15
+ label: "Keyboard Dismiss Mode",
16
+ description: "Keyboard Dismiss Mode",
17
+ options: ["auto", "on-drag", "none"],
18
+ defaultValue: "auto"
19
+ }),
20
+ swipeEnabled: createBoolProp({
21
+ label: "Swipe Enabled",
22
+ description: "Swipe Enabled",
23
+ defaultValue: true
24
+ }),
25
+ scrollEnabled: createBoolProp({
26
+ label: "Scroll Enabled",
27
+ description: "Scroll Enabled",
28
+ defaultValue: true
29
+ }),
30
+ activeColor: createColorProp({
31
+ label: "Active Color",
32
+ description: "Active Color",
33
+ defaultValue: "primary"
34
+ }),
35
+ inactiveColor: createColorProp({
36
+ label: "Inactive Color",
37
+ description: "Inactive Color",
38
+ defaultValue: null
39
+ }),
40
+ pressColor: createColorProp({
41
+ label: "Press Color",
42
+ description: "Press Color",
43
+ defaultValue: null
44
+ }),
45
+ indicatorColor: createColorProp({
46
+ label: "Indicator Color",
47
+ description: "Indicator Color",
48
+ defaultValue: null
49
+ })
50
+ }
51
+ }, {
52
+ name: "TabViewItem",
53
+ tag: "TabViewItem",
54
+ category: COMPONENT_TYPES.container,
55
+ layout: {},
56
+ props: {
57
+ title: createTextProp({
58
+ label: "Title",
59
+ description: "Tab Title"
60
+ }),
61
+ id: createTextProp({
62
+ label: "Id",
63
+ description: "Tab Id"
64
+ }),
65
+ accessibilityLabel: createTextProp({
66
+ label: "Accessibility Label",
67
+ description: "Accessibility Label"
68
+ })
69
+ }
70
+ }];
@@ -1,8 +1,8 @@
1
- /// <reference types="react" />
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: ({ source, style }: SVGComponentProps) => JSX.Element;
7
+ declare const SVG: React.FC<React.PropsWithChildren<SVGComponentProps>>;
8
8
  export default SVG;
@@ -0,0 +1,19 @@
1
+ import * as React from "react";
2
+ import { StyleProp, TextStyle, ViewStyle } from "react-native";
3
+ import type { IconSlot } from "../../interfaces/Icon";
4
+ declare type TabBarPosition = "top" | "bottom";
5
+ declare type KeyboardDismissMode = "none" | "auto" | "on-drag";
6
+ declare type TabViewProps = {
7
+ tabBarPosition?: TabBarPosition;
8
+ keyboardDismissMode?: KeyboardDismissMode;
9
+ swipeEnabled?: boolean;
10
+ scrollEnabled?: boolean;
11
+ activeColor?: string;
12
+ inactiveColor?: string;
13
+ pressColor?: string;
14
+ indicatorColor?: string;
15
+ style?: StyleProp<TextStyle | ViewStyle>;
16
+ children: React.ReactNode;
17
+ } & IconSlot;
18
+ declare const TabViewComponent: ({ Icon, tabBarPosition, keyboardDismissMode, swipeEnabled, scrollEnabled, activeColor, inactiveColor, pressColor, indicatorColor, style, children, }: TabViewProps) => JSX.Element;
19
+ export default TabViewComponent;
@@ -0,0 +1,10 @@
1
+ import React from "react";
2
+ interface TabViewItemProps {
3
+ title: string;
4
+ id: string;
5
+ icon: string;
6
+ accessibilityLabel: string;
7
+ children: React.ReactNode;
8
+ }
9
+ declare const TabViewItem: ({ title, id, icon, children, accessibilityLabel, }: TabViewItemProps) => React.ReactNode;
10
+ export default TabViewItem;
@@ -0,0 +1,2 @@
1
+ export { default as TabView } from "./TabView";
2
+ export { default as TabViewItem } from "./TabViewItem";
@@ -29,6 +29,7 @@ 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";
32
33
  export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
33
34
  export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
34
35
  export { default as Button } from "./components/DeprecatedButton";
@@ -49,4 +50,3 @@ export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIc
49
50
  export { default as Slider } from "./components/Slider";
50
51
  export { default as Stepper } from "./components/Stepper";
51
52
  export { useAuthState } from "./components/useAuthState";
52
- export { default as Youtube } from "./components/Youtube";
@@ -7,6 +7,7 @@ export declare const SEED_DATA: {
7
7
  width: number;
8
8
  height: number;
9
9
  };
10
+ stylesPanelSections: string[];
10
11
  props: {
11
12
  source: {
12
13
  label: string;