@draftbit/core 46.8.2-799d91.2 → 46.8.2-81337b.2

package/lib/commonjs/components/DeprecatedCardWrapper.js

@@ -8,7 +8,6 @@ var _react = _interopRequireDefault(require("react"));
 var _theming = require("../theming");
 var _Touchable = _interopRequireDefault(require("./Touchable"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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); }
 const getWidth = numColumns => {
   switch (numColumns) {
     case 1:
@@ -28,6 +27,21 @@ const Card = _ref => {
     ...rest
   } = _ref;
   const width = getWidth(numColumns);
+  return /*#__PURE__*/_react.default.createElement(_Touchable.default, {
+    disabled: !onPress,
+    onPress: onPress,
+    style: [style, {
+      width
+    }],
+    ...rest
+  }, children);
+};
+var _default = (0, _theming.withTheme)(Card);
+exports.default = _default;s,
+    style,
+    ...rest
+  } = _ref;
+  const width = getWidth(numColumns);
   return /*#__PURE__*/_react.default.createElement(_Touchable.default, _extends({
     disabled: !onPress,
     onPress: onPress,

package/lib/commonjs/components/Image.js

@@ -9,8 +9,7 @@ var _reactNative = require("react-native");
 var _Config = _interopRequireDefault(require("./Config"));
 var _AspectRatio = _interopRequireDefault(require("./AspectRatio"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-/* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
-
+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); }
 const generateDimensions = _ref => {
   let {
     aspectRatio,
@@ -63,27 +62,13 @@ const Image = _ref2 => {
         height,
         aspectRatio
       }]
-    }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
-      ...props,
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, _extends({}, props, {
       source: imageSource,
       resizeMode: resizeMode,
       style: [style, {
         height: "100%",
         width: "100%"
       }]
-    }));
-  }
-  return /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
-    ...props,
-    source: source,
-    resizeMode: resizeMode,
-    style: style
-  });
-};
-var _default = Image;
-exports.default = _default; "100%",
-        width: "100%"
-      }]
     })));
   }
   return /*#__PURE__*/_react.default.createElement(_reactNative.Image, _extends({}, props, {

package/lib/commonjs/components/Portal/PortalHost.js

@@ -10,7 +10,11 @@ var _PortalManager = _interopRequireDefault(require("./PortalManager"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
 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; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 const PortalContext = /*#__PURE__*/React.createContext(null);
+
 /**
  * Portal host renders all of its children `Portal` elements.
  * For example, you can wrap a screen in `Portal.Host` to render items above the screen.
@@ -39,10 +43,10 @@ exports.PortalContext = PortalContext;
 class PortalHost extends React.Component {
   constructor() {
     super(...arguments);
-    this.setManager = manager => {
+    _defineProperty(this, "setManager", manager => {
       this.manager = manager;
-    };
-    this.mount = children => {
+    });
+    _defineProperty(this, "mount", children => {
       const key = this.nextKey++;
       if (this.manager) {
         this.manager.mount(key, children);
@@ -54,8 +58,8 @@ class PortalHost extends React.Component {
         });
       }
       return key;
-    };
-    this.update = (key, children) => {
+    });
+    _defineProperty(this, "update", (key, children) => {
       if (this.manager) {
         this.manager.update(key, children);
       } else {
@@ -72,8 +76,8 @@ class PortalHost extends React.Component {
           this.queue.push(op);
         }
       }
-    };
-    this.unmount = key => {
+    });
+    _defineProperty(this, "unmount", key => {
       if (this.manager) {
         this.manager.unmount(key);
       } else {
@@ -82,9 +86,10 @@ class PortalHost extends React.Component {
           key
         });
       }
-    };
-    this.nextKey = 0;
-    this.queue = [];
+    });
+    _defineProperty(this, "nextKey", 0);
+    _defineProperty(this, "queue", []);
+    _defineProperty(this, "manager", void 0);
   }
   componentDidMount() {
     const manager = this.manager;
@@ -123,40 +128,6 @@ class PortalHost extends React.Component {
   }
 }
 exports.default = PortalHost;
-PortalHost.displayName = "Portal.Host";
-const styles = _reactNative.StyleSheet.create({
-  container: {
-    flex: 1
-  }
-});nager.mount(action.key, action.children);
-            break;
-          case "update":
-            manager.update(action.key, action.children);
-            break;
-          case "unmount":
-            manager.unmount(action.key);
-            break;
-        }
-      }
-    }
-  }
-  render() {
-    return /*#__PURE__*/React.createElement(PortalContext.Provider, {
-      value: {
-        mount: this.mount,
-        update: this.update,
-        unmount: this.unmount
-      }
-    }, /*#__PURE__*/React.createElement(_reactNative.View, {
-      style: styles.container,
-      collapsable: false,
-      pointerEvents: "box-none"
-    }, this.props.children), /*#__PURE__*/React.createElement(_PortalManager.default, {
-      ref: this.setManager
-    }));
-  }
-}
-exports.default = PortalHost;
 _defineProperty(PortalHost, "displayName", "Portal.Host");
 const styles = _reactNative.StyleSheet.create({
   container: {

package/lib/commonjs/components/ScreenContainer.js

@@ -10,7 +10,9 @@ var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
 var _theming = require("../theming");
 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); }
 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; }
+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); }
 function ScreenContainer(_ref) {
+  var _StyleSheet$flatten;
   let {
     scrollable = false,
     hasSafeArea = false,
@@ -21,8 +23,7 @@ function ScreenContainer(_ref) {
     children,
     ...rest
   } = _ref;
-  var _a;
-  const backgroundColor = ((_a = _reactNative.StyleSheet.flatten(style)) === null || _a === void 0 ? void 0 : _a.backgroundColor) || theme.colors.background;
+  const backgroundColor = ((_StyleSheet$flatten = _reactNative.StyleSheet.flatten(style)) === null || _StyleSheet$flatten === void 0 ? void 0 : _StyleSheet$flatten.backgroundColor) || theme.colors.background;
   const edges = ["left", "right"];
   if (hasSafeArea || hasTopSafeArea) {
     edges.push("top");
@@ -30,13 +31,12 @@ function ScreenContainer(_ref) {
   if (hasSafeArea || hasBottomSafeArea) {
     edges.push("bottom");
   }
-  return /*#__PURE__*/React.createElement(_reactNativeSafeAreaContext.SafeAreaView, {
+  return /*#__PURE__*/React.createElement(_reactNativeSafeAreaContext.SafeAreaView, _extends({
     edges: edges,
     style: [styles.container, {
       backgroundColor
-    }],
-    ...rest
-  }, scrollable ? /*#__PURE__*/React.createElement(_reactNative.ScrollView, {
+    }]
+  }, rest), scrollable ? /*#__PURE__*/React.createElement(_reactNative.ScrollView, {
     contentContainerStyle: [styles.scrollViewContainer, {
       backgroundColor
     }, style]
@@ -56,22 +56,4 @@ const styles = _reactNative.StyleSheet.create({
   }
 });
 var _default = (0, _theming.withTheme)(ScreenContainer);
-exports.default = _default;olor
-    }, style]
-  }, children) : /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: [styles.container, {
-      backgroundColor
-    }, style]
-  }, children));
-}
-const styles = _reactNative.StyleSheet.create({
-  container: {
-    flex: 1
-  },
-  scrollViewContainer: {
-    flexGrow: 1,
-    flex: undefined
-  }
-});
-var _default = (0, _theming.withTheme)(ScreenContainer);
 exports.default = _default;

package/lib/commonjs/components/TabView/TabView.js

@@ -0,0 +1,100 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _reactNativeTabView = require("react-native-tab-view");
+var _TabViewItem = _interopRequireDefault(require("./TabViewItem"));
+var _theming = require("../../theming");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
+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; }
+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); }
+const TabViewComponent = _ref => {
+  let {
+    Icon,
+    onIndexChanged,
+    onEndReached,
+    tabBarPosition,
+    keyboardDismissMode,
+    swipeEnabled,
+    scrollEnabled,
+    activeColor,
+    inactiveColor,
+    pressColor,
+    indicatorColor,
+    tabsBackgroundColor,
+    style,
+    theme,
+    children
+  } = _ref;
+  const [index, setIndex] = React.useState(0);
+  const [routes, setRoutes] = React.useState([]);
+  const [tabScenes, setTabScenes] = React.useState({});
+
+  //Populate routes and scenes based on children
+  React.useEffect(() => {
+    const newRoutes = [];
+    const scenes = {};
+    React.Children.toArray(children).filter(child => /*#__PURE__*/React.isValidElement(child) && child.type === _TabViewItem.default).forEach((item, idx) => {
+      const child = item;
+      newRoutes.push({
+        key: idx.toString(),
+        title: child.props.title,
+        icon: child.props.icon,
+        accessibilityLabel: child.props.accessibilityLabel
+      });
+      scenes[idx] = () => child;
+    });
+    setRoutes(newRoutes);
+    setTabScenes(scenes);
+  }, [children]);
+  const indexChangeHandler = i => {
+    setIndex(i);
+    onIndexChanged === null || onIndexChanged === void 0 ? void 0 : onIndexChanged(i);
+    if (i === routes.length) {
+      onEndReached === null || onEndReached === void 0 ? void 0 : onEndReached();
+    }
+  };
+  const renderTabBar = props => {
+    return /*#__PURE__*/React.createElement(_reactNativeTabView.TabBar, _extends({}, props, {
+      activeColor: activeColor || theme.colors.primary,
+      inactiveColor: inactiveColor || theme.colors.divider,
+      pressColor: pressColor || theme.colors.primary,
+      scrollEnabled: scrollEnabled,
+      indicatorStyle: {
+        backgroundColor: indicatorColor || theme.colors.primary
+      },
+      renderIcon: _ref2 => {
+        let {
+          route,
+          color
+        } = _ref2;
+        return route !== null && route !== void 0 && route.icon ? /*#__PURE__*/React.createElement(Icon, {
+          name: route.icon,
+          color: color,
+          size: 36
+        }) : null;
+      },
+      style: [{
+        backgroundColor: tabsBackgroundColor || theme.colors.background
+      }, style]
+    }));
+  };
+  return /*#__PURE__*/React.createElement(_reactNativeTabView.TabView, {
+    navigationState: {
+      index,
+      routes
+    },
+    renderScene: (0, _reactNativeTabView.SceneMap)(tabScenes),
+    renderTabBar: renderTabBar,
+    onIndexChange: indexChangeHandler,
+    tabBarPosition: tabBarPosition,
+    keyboardDismissMode: keyboardDismissMode,
+    swipeEnabled: swipeEnabled
+  });
+};
+var _default = (0, _theming.withTheme)(TabViewComponent);
+exports.default = _default;

package/lib/commonjs/components/TabView/TabViewItem.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const TabViewItem = _ref => {
+  let {
+    style,
+    children
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.parentContainer, style]
+  }, children);
+};
+const styles = _reactNative.StyleSheet.create({
+  parentContainer: {
+    flex: 1
+  }
+});
+var _default = TabViewItem;
+exports.default = _default;

package/lib/commonjs/components/TabView/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "TabView", {
+  enumerable: true,
+  get: function () {
+    return _TabView.default;
+  }
+});
+Object.defineProperty(exports, "TabViewItem", {
+  enumerable: true,
+  get: function () {
+    return _TabViewItem.default;
+  }
+});
+var _TabView = _interopRequireDefault(require("./TabView"));
+var _TabViewItem = _interopRequireDefault(require("./TabViewItem"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/commonjs/index.js

@@ -177,12 +177,6 @@ Object.defineProperty(exports, "Link", {
     return _Text.Link;
   }
 });
-Object.defineProperty(exports, "Markdown", {
-  enumerable: true,
-  get: function () {
-    return _Markdown.default;
-  }
-});
 Object.defineProperty(exports, "NumberInput", {
   enumerable: true,
   get: function () {
@@ -345,6 +339,18 @@ Object.defineProperty(exports, "SwitchRow", {
     return _Switch.SwitchRow;
   }
 });
+Object.defineProperty(exports, "TabView", {
+  enumerable: true,
+  get: function () {
+    return _TabView.TabView;
+  }
+});
+Object.defineProperty(exports, "TabViewItem", {
+  enumerable: true,
+  get: function () {
+    return _TabView.TabViewItem;
+  }
+});
 Object.defineProperty(exports, "TextField", {
   enumerable: true,
   get: function () {
@@ -420,7 +426,7 @@ var _Swiper = require("./components/Swiper");
 var _Layout = require("./components/Layout");
 var _index = require("./components/RadioButton/index");
 var _DeckSwiper = require("./components/DeckSwiper");
-var _Markdown = _interopRequireDefault(require("./components/Markdown"));
+var _TabView = require("./components/TabView");
 var _DatePicker = _interopRequireDefault(require("./components/DatePicker/DatePicker"));
 var _Picker = _interopRequireDefault(require("./components/Picker/Picker"));
 var _ProgressBar = _interopRequireDefault(require("./components/ProgressBar"));

package/lib/commonjs/mappings/TabView.js

@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SEED_DATA = void 0;
+var _types = require("@draftbit/types");
+const SEED_DATA = {
+  name: "Tab View",
+  tag: "TabView",
+  description: "Tab view container",
+  category: _types.COMPONENT_TYPES.swiper,
+  stylesPanelSections: [..._types.BLOCK_STYLES_SECTIONS, _types.StylesPanelSections.Background],
+  triggers: [_types.Triggers.OnIndexChanged, _types.Triggers.OnEndReached],
+  props: {
+    onIndexChanged: (0, _types.createActionProp)({
+      label: "On index changed",
+      description: "Action to execute when swipe to new index"
+    }),
+    onEndReached: (0, _types.createActionProp)({
+      label: "On end reached",
+      description: "Action to execute when end of swiping reached"
+    }),
+    tabBarPosition: (0, _types.createTextEnumProp)({
+      label: "Tab Bar Position",
+      description: "Position of tab bar",
+      options: ["top", "bottom"],
+      defaultValue: "top"
+    }),
+    keyboardDismissMode: (0, _types.createTextEnumProp)({
+      label: "Keyboard Dismiss Mode",
+      description: "Keyboard Dismiss Mode",
+      options: ["auto", "on-drag", "none"],
+      defaultValue: "auto"
+    }),
+    swipeEnabled: (0, _types.createStaticBoolProp)({
+      label: "Swipe Enabled",
+      description: "Whether swiping is enabled or not",
+      defaultValue: true
+    }),
+    scrollEnabled: (0, _types.createStaticBoolProp)({
+      label: "Scroll Enabled",
+      description: "Whether scrolling of tabs is enabled or not",
+      defaultValue: false
+    }),
+    activeColor: (0, _types.createColorProp)({
+      label: "Active Color",
+      description: "Color of icon and text of active tab",
+      defaultValue: "primary"
+    }),
+    inactiveColor: (0, _types.createColorProp)({
+      label: "Inactive Color",
+      description: "Color of icon and text of inactive tab(s)",
+      defaultValue: null
+    }),
+    pressColor: (0, _types.createColorProp)({
+      label: "Press Color",
+      description: "Color of ripple when pressed",
+      defaultValue: "primary",
+      group: _types.GROUPS.android
+    }),
+    indicatorColor: (0, _types.createColorProp)({
+      label: "Indicator Color",
+      description: "Color of indicator",
+      defaultValue: "primary"
+    }),
+    tabsBackgroundColor: (0, _types.createColorProp)({
+      label: "Tabs Background Color",
+      description: "Background color of tabs container",
+      defaultValue: "background"
+    })
+  }
+};
+exports.SEED_DATA = SEED_DATA;

package/lib/commonjs/mappings/TabViewItem.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SEED_DATA = void 0;
+var _types = require("@draftbit/types");
+const SEED_DATA = {
+  name: "Tab View Item",
+  tag: "TabViewItem",
+  description: "Single Tab View item to be used in TabView. Each item represents a single tab and its content",
+  category: _types.COMPONENT_TYPES.swiper,
+  stylesPanelSections: _types.CONTAINER_COMPONENT_STYLES_SECTIONS,
+  layout: {
+    flex: 1
+  },
+  props: {
+    title: (0, _types.createTextProp)({
+      label: "Title",
+      description: "Title of tab item",
+      defaultValue: "Title",
+      required: true,
+      group: _types.GROUPS.basic
+    }),
+    icon: (0, _types.createIconProp)({
+      defaultValue: null,
+      required: false
+    }),
+    accessibilityLabel: (0, _types.createTextProp)({
+      label: "Accessibility Label",
+      description: "Accessibility Label",
+      defaultValue: null,
+      group: _types.GROUPS.accessibility
+    })
+  }
+};
+exports.SEED_DATA = SEED_DATA;

package/lib/commonjs/styles/overlay.js

@@ -15,7 +15,6 @@ function overlay(elevation) {
   let surfaceColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _DarkTheme.default.colors.surface;
   if (isAnimatedValue(elevation)) {
     const inputRange = [0, 1, 2, 3, 8, 24];
-
     // @ts-expect-error: TS doesn't seem to refine the type correctly
     return elevation.interpolate({
       inputRange,
@@ -24,7 +23,6 @@ function overlay(elevation) {
       })
     });
   }
-
   // @ts-expect-error: TS doesn't seem to refine the type correctly
   return calculateColor(surfaceColor, elevation);
 }
@@ -65,4 +63,4 @@ const elevationOverlayTransparency = {
   22: 15.72,
   23: 15.84,
   24: 16
-};
+};};

package/lib/commonjs/utilities.js

@@ -57,7 +57,6 @@ function extractBorderAndMarginStyles(style, additionalBorderStyles, additionalM
     marginStyles
   };
 }
-
 /**
  * Merges a style object on top of another style object. In React Native,
  * keys with undefined values in a style object will still override styles
@@ -90,4 +89,4 @@ function getValueForRadioButton(value) {
   } else {
     throw new Error("Invalid value: ".concat(value));
   }
-}
+}}

package/lib/module/components/TabView/TabView.js

@@ -0,0 +1,90 @@
+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); }
+import * as React from "react";
+import { TabView, TabBar, SceneMap } from "react-native-tab-view";
+import TabViewItem from "./TabViewItem";
+import { withTheme } from "../../theming";
+const TabViewComponent = _ref => {
+  let {
+    Icon,
+    onIndexChanged,
+    onEndReached,
+    tabBarPosition,
+    keyboardDismissMode,
+    swipeEnabled,
+    scrollEnabled,
+    activeColor,
+    inactiveColor,
+    pressColor,
+    indicatorColor,
+    tabsBackgroundColor,
+    style,
+    theme,
+    children
+  } = _ref;
+  const [index, setIndex] = React.useState(0);
+  const [routes, setRoutes] = React.useState([]);
+  const [tabScenes, setTabScenes] = React.useState({});
+
+  //Populate routes and scenes based on children
+  React.useEffect(() => {
+    const newRoutes = [];
+    const scenes = {};
+    React.Children.toArray(children).filter(child => /*#__PURE__*/React.isValidElement(child) && child.type === TabViewItem).forEach((item, idx) => {
+      const child = item;
+      newRoutes.push({
+        key: idx.toString(),
+        title: child.props.title,
+        icon: child.props.icon,
+        accessibilityLabel: child.props.accessibilityLabel
+      });
+      scenes[idx] = () => child;
+    });
+    setRoutes(newRoutes);
+    setTabScenes(scenes);
+  }, [children]);
+  const indexChangeHandler = i => {
+    setIndex(i);
+    onIndexChanged === null || onIndexChanged === void 0 ? void 0 : onIndexChanged(i);
+    if (i === routes.length) {
+      onEndReached === null || onEndReached === void 0 ? void 0 : onEndReached();
+    }
+  };
+  const renderTabBar = props => {
+    return /*#__PURE__*/React.createElement(TabBar, _extends({}, props, {
+      activeColor: activeColor || theme.colors.primary,
+      inactiveColor: inactiveColor || theme.colors.divider,
+      pressColor: pressColor || theme.colors.primary,
+      scrollEnabled: scrollEnabled,
+      indicatorStyle: {
+        backgroundColor: indicatorColor || theme.colors.primary
+      },
+      renderIcon: _ref2 => {
+        let {
+          route,
+          color
+        } = _ref2;
+        return route !== null && route !== void 0 && route.icon ? /*#__PURE__*/React.createElement(Icon, {
+          name: route.icon,
+          color: color,
+          size: 36
+        }) : null;
+      },
+      style: [{
+        backgroundColor: tabsBackgroundColor || theme.colors.background
+      }, style]
+    }));
+  };
+  return /*#__PURE__*/React.createElement(TabView, {
+    navigationState: {
+      index,
+      routes
+    },
+    renderScene: SceneMap(tabScenes),
+    renderTabBar: renderTabBar,
+    onIndexChange: indexChangeHandler,
+    tabBarPosition: tabBarPosition,
+    keyboardDismissMode: keyboardDismissMode,
+    swipeEnabled: swipeEnabled
+  });
+};
+export default withTheme(TabViewComponent);