@draftbit/core 46.8.1-1b6459.2 → 46.8.1-61264d.2

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

@@ -8,54 +8,28 @@ var React = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 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); }
 /**
  * Portal host is the component which actually renders all Portals.
  */
 class PortalManager extends React.PureComponent {
   constructor() {
     super(...arguments);
-    this.state = {
+    _defineProperty(this, "state", {
       portals: []
-    };
-    this.mount = (key, children) => {
+    });
+    _defineProperty(this, "mount", (key, children) => {
       this.setState(state => ({
         portals: [...state.portals, {
           key,
           children
         }]
       }));
-    };
-    this.update = (key, children) => this.setState(state => ({
-      portals: state.portals.map(item => {
-        if (item.key === key) {
-          return {
-            ...item,
-            children
-          };
-        }
-        return item;
-      })
-    }));
-    this.unmount = key => this.setState(state => ({
-      portals: state.portals.filter(item => item.key !== key)
-    }));
-  }
-  render() {
-    return this.state.portals.map(_ref => {
-      let {
-        key,
-        children
-      } = _ref;
-      return /*#__PURE__*/React.createElement(_reactNative.View, {
-        key: key,
-        collapsable: false /* Need collapsable=false here to clip the elevations, otherwise they appear above sibling components */,
-        pointerEvents: "box-none",
-        style: _reactNative.StyleSheet.absoluteFill
-      }, children);
     });
-  }
-}
-exports.default = PortalManager;tate.portals.map(item => {
+    _defineProperty(this, "update", (key, children) => this.setState(state => ({
+      portals: state.portals.map(item => {
         if (item.key === key) {
           return {
             ...item,

package/lib/commonjs/components/ProgressBar.js

@@ -8,12 +8,16 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 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 _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 INDETERMINATE_WIDTH_FACTOR = 0.3;
 const BAR_WIDTH_ZERO_POSITION = INDETERMINATE_WIDTH_FACTOR / (1 + INDETERMINATE_WIDTH_FACTOR);
 class ProgressBar extends _react.Component {
   constructor(props) {
     super(props);
-    this.handleLayout = event => {
+    _defineProperty(this, "handleLayout", event => {
       const {
         width = 150,
         onLayout
@@ -26,7 +30,7 @@ class ProgressBar extends _react.Component {
       if (onLayout) {
         onLayout(event);
       }
-    };
+    });
     const {
       progress: progressP = 0,
       indeterminate = false
@@ -74,6 +78,7 @@ class ProgressBar extends _react.Component {
           ...animationConfig,
           toValue: progress,
           velocity: 0,
+          //adjust this value if animation fails - velocity is required
           useNativeDriver
         }).start();
       } else {
@@ -142,41 +147,6 @@ class ProgressBar extends _react.Component {
         })
       }]
     };
-    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-      style: [containerStyle, style],
-      onLayout: this.handleLayout,
-      ...restProps
-    }, /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
-      style: progressStyle
-    }), children);
-  }
-}
-exports.default = ProgressBar;,
-      overflow: "hidden",
-      backgroundColor: unfilledColor
-    };
-    const progressStyle = {
-      backgroundColor: color,
-      // Always take up full height of container.
-      height: "100%",
-      transform: [{
-        translateX: this.state.animationValue.interpolate({
-          inputRange: [0, 1],
-          outputRange: [innerWidth * -INDETERMINATE_WIDTH_FACTOR, innerWidth]
-        })
-      }, {
-        translateX: this.state.progress.interpolate({
-          inputRange: [0, 1],
-          outputRange: [innerWidth / (_reactNative.I18nManager.isRTL ? 2 : -2), 0]
-        })
-      }, {
-        // Interpolation a temp workaround for https://github.com/facebook/react-native/issues/6278
-        scaleX: this.state.progress.interpolate({
-          inputRange: [0, 1],
-          outputRange: [0.0001, 1]
-        })
-      }]
-    };
     return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
       style: [containerStyle, style],
       onLayout: this.handleLayout

package/lib/commonjs/components/RadioButton/RadioButton.js

@@ -12,6 +12,7 @@ var _context = require("./context");
 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 RadioButton = _ref => {
   let {
     Icon,
@@ -38,19 +39,7 @@ const RadioButton = _ref => {
     onPress === null || onPress === void 0 ? void 0 : onPress(realValue);
     onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(realValue);
   };
-  return /*#__PURE__*/React.createElement(_IconButton.default, {
-    Icon: Icon,
-    icon: isSelected ? selectedIcon : unselectedIcon,
-    color: isSelected ? color : unselectedColor,
-    disabled: disabled,
-    onPress: handlePress,
-    size: size,
-    style: style,
-    ...rest
-  });
-};
-var _default = RadioButton;
-exports.default = _default;turn /*#__PURE__*/React.createElement(_IconButton.default, _extends({
+  return /*#__PURE__*/React.createElement(_IconButton.default, _extends({
     Icon: Icon,
     icon: isSelected ? selectedIcon : unselectedIcon,
     color: isSelected ? color : unselectedColor,

package/lib/commonjs/components/RadioButton/RadioButtonGroup.js

@@ -10,6 +10,7 @@ var _utilities = require("../../utilities");
 var _context = require("./context");
 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 {
   Provider
 } = _context.radioButtonGroupContext;
@@ -49,23 +50,9 @@ const RadioButtonGroup = _ref => {
       alignItems: "center"
     });
   }
-  return /*#__PURE__*/React.createElement(_reactNative.View, {
+  return /*#__PURE__*/React.createElement(_reactNative.View, _extends({
     style: [{
       minHeight: 40
-    }, style],
-    ...rest
-  }, /*#__PURE__*/React.createElement(Provider, {
-    value: {
-      value: internalValue,
-      onValueChange: handleValueChange,
-      direction
-    }
-  }, /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: _containerStyle
-  }, children)));
-};
-var _default = RadioButtonGroup;
-exports.default = _default;0
     }, style]
   }, rest), /*#__PURE__*/React.createElement(Provider, {
     value: {

package/lib/commonjs/components/Table/Table.js

@@ -0,0 +1,65 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _theming = require("../../theming");
+var _TableCommon = require("./TableCommon");
+var _TableRow = _interopRequireDefault(require("./TableRow"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const Table = _ref => {
+  let {
+    theme,
+    borderWidth = 1,
+    borderColor = theme.colors.divider,
+    borderStyle = "solid",
+    drawTopBorder = true,
+    drawBottomBorder = false,
+    drawStartBorder = false,
+    drawEndBorder = false,
+    cellVerticalPadding = 10,
+    callHorizontalPadding = 10,
+    children,
+    style
+  } = _ref;
+  //Populate each TableRow props with default values provided here
+  const populatedTableRows = _react.default.useMemo(() => _react.default.Children.map(children, child => {
+    if ( /*#__PURE__*/_react.default.isValidElement(child) && child.type === _TableRow.default) {
+      const oldProps = {
+        ...child.props
+      };
+      const newProps = {
+        cellVerticalPadding: oldProps.cellVerticalPadding || cellVerticalPadding,
+        callHorizontalPadding: oldProps.callHorizontalPadding || callHorizontalPadding,
+        borderWidth: oldProps.borderWidth || borderWidth,
+        borderColor: oldProps.borderColor || borderColor,
+        borderStyle: oldProps.borderStyle || borderStyle
+      };
+      return /*#__PURE__*/_react.default.cloneElement(child, newProps);
+    }
+    return child;
+  }), [children, borderColor, borderWidth, borderStyle, cellVerticalPadding, callHorizontalPadding]);
+  const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
+    borderColor,
+    borderWidth,
+    borderStyle,
+    drawTopBorder,
+    drawBottomBorder,
+    drawStartBorder,
+    drawEndBorder
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.container, borderViewStyle, style]
+  }, populatedTableRows);
+};
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    display: "flex",
+    flexDirection: "column"
+  }
+});
+var _default = (0, _theming.withTheme)(Table);
+exports.default = _default;

package/lib/commonjs/components/Table/TableCell.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _TableCommon = require("./TableCommon");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const TableCell = _ref => {
+  let {
+    borderWidth,
+    borderColor,
+    borderStyle,
+    drawTopBorder = false,
+    drawBottomBorder = false,
+    drawStartBorder = false,
+    drawEndBorder = true,
+    verticalPadding,
+    horizontalPadding,
+    children,
+    style
+  } = _ref;
+  const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
+    borderColor,
+    borderWidth,
+    borderStyle,
+    drawTopBorder,
+    drawBottomBorder,
+    drawStartBorder,
+    drawEndBorder
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.cellContainer, borderViewStyle, {
+      paddingVertical: verticalPadding,
+      paddingHorizontal: horizontalPadding
+    }, style]
+  }, children);
+};
+const styles = _reactNative.StyleSheet.create({
+  cellContainer: {
+    flex: 1,
+    flexDirection: "row"
+  }
+});
+var _default = TableCell;
+exports.default = _default;

package/lib/commonjs/components/Table/TableCommon.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateBorderStyles = generateBorderStyles;
+function generateBorderStyles(_ref) {
+  let {
+    borderColor,
+    borderWidth,
+    borderStyle,
+    drawTopBorder,
+    drawBottomBorder,
+    drawStartBorder,
+    drawEndBorder
+  } = _ref;
+  return {
+    borderColor,
+    borderStyle,
+    borderTopWidth: drawTopBorder ? borderWidth : 0,
+    borderBottomWidth: drawBottomBorder ? borderWidth : 0,
+    borderStartWidth: drawStartBorder ? borderWidth : 0,
+    borderEndWidth: drawEndBorder ? borderWidth : 0
+  };
+}

package/lib/commonjs/components/Table/TableRow.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _TableCommon = require("./TableCommon");
+var _TableCell = _interopRequireDefault(require("./TableCell"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const TableRow = _ref => {
+  let {
+    borderWidth,
+    borderColor,
+    borderStyle,
+    drawTopBorder = false,
+    drawBottomBorder = true,
+    drawStartBorder = true,
+    drawEndBorder = false,
+    cellVerticalPadding,
+    callHorizontalPadding,
+    children,
+    style
+  } = _ref;
+  //Populate each TableCell props with default values provided here
+  const populatedTableCells = _react.default.useMemo(() => _react.default.Children.map(children, child => {
+    if ( /*#__PURE__*/_react.default.isValidElement(child) && child.type === _TableCell.default) {
+      const oldProps = {
+        ...child.props
+      };
+      const newProps = {
+        verticalPadding: oldProps.verticalPadding || cellVerticalPadding,
+        horizontalPadding: oldProps.horizontalPadding || callHorizontalPadding,
+        borderWidth: oldProps.borderWidth || borderWidth,
+        borderColor: oldProps.borderColor || borderColor,
+        borderStyle: oldProps.borderStyle || borderStyle
+      };
+      return /*#__PURE__*/_react.default.cloneElement(child, newProps);
+    }
+    return child;
+  }), [children, borderColor, borderWidth, borderStyle, cellVerticalPadding, callHorizontalPadding]);
+  const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
+    borderColor,
+    borderWidth,
+    borderStyle,
+    drawTopBorder,
+    drawBottomBorder,
+    drawStartBorder,
+    drawEndBorder
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [borderViewStyle, style, styles.cellsContainer]
+  }, populatedTableCells);
+};
+const styles = _reactNative.StyleSheet.create({
+  cellsContainer: {
+    flex: 1,
+    flexDirection: "row"
+  }
+});
+var _default = TableRow;
+exports.default = _default;

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

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Table", {
+  enumerable: true,
+  get: function () {
+    return _Table.default;
+  }
+});
+Object.defineProperty(exports, "TableCell", {
+  enumerable: true,
+  get: function () {
+    return _TableCell.default;
+  }
+});
+Object.defineProperty(exports, "TableRow", {
+  enumerable: true,
+  get: function () {
+    return _TableRow.default;
+  }
+});
+var _Table = _interopRequireDefault(require("./Table"));
+var _TableRow = _interopRequireDefault(require("./TableRow"));
+var _TableCell = _interopRequireDefault(require("./TableCell"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/commonjs/index.js

@@ -339,6 +339,24 @@ Object.defineProperty(exports, "SwitchRow", {
     return _Switch.SwitchRow;
   }
 });
+Object.defineProperty(exports, "Table", {
+  enumerable: true,
+  get: function () {
+    return _Table.Table;
+  }
+});
+Object.defineProperty(exports, "TableCell", {
+  enumerable: true,
+  get: function () {
+    return _Table.TableCell;
+  }
+});
+Object.defineProperty(exports, "TableRow", {
+  enumerable: true,
+  get: function () {
+    return _Table.TableRow;
+  }
+});
 Object.defineProperty(exports, "TextField", {
   enumerable: true,
   get: function () {
@@ -414,6 +432,7 @@ var _Swiper = require("./components/Swiper");
 var _Layout = require("./components/Layout");
 var _index = require("./components/RadioButton/index");
 var _DeckSwiper = require("./components/DeckSwiper");
+var _Table = require("./components/Table");
 var _DatePicker = _interopRequireDefault(require("./components/DatePicker/DatePicker"));
 var _Picker = _interopRequireDefault(require("./components/Picker/Picker"));
 var _ProgressBar = _interopRequireDefault(require("./components/ProgressBar"));

package/lib/commonjs/mappings/Table.js

@@ -0,0 +1,143 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SEED_DATA = void 0;
+var _types = require("@draftbit/types");
+const SHARED_SEED_DATA_PROPS = {
+  borderWidth: (0, _types.createStaticNumberProp)({
+    label: "Border Width",
+    description: "Specifies the width of the border. Passed down to child Table(Row/Cell) components unless overridden",
+    required: false,
+    defaultValue: null
+  }),
+  borderColor: (0, _types.createColorProp)({
+    label: "Border Color",
+    description: "Specifies the color of the border. Passed down to child Table(Row/Cell) components unless overridden",
+    defaultValue: null
+  }),
+  borderStyle: (0, _types.createTextEnumProp)({
+    label: "Border Style",
+    description: "Specifies the style of the border. Passed down to child Table(Row/Cell) components unless overridden",
+    options: ["solid", "dotted", "dashed"],
+    defaultValue: null
+  }),
+  drawTopBorder: (0, _types.createStaticBoolProp)({
+    label: "Draw Top Border",
+    description: "Whether to draw the top border at this layer of the Table tree or not",
+    defaultValue: false
+  }),
+  drawBottomBorder: (0, _types.createStaticBoolProp)({
+    label: "Draw Bottom Border",
+    description: "Whether to draw the bottom border at this layer of the Table tree or not",
+    defaultValue: false
+  }),
+  drawStartBorder: (0, _types.createStaticBoolProp)({
+    label: "Draw Start Border",
+    description: "Whether to draw the start border at this layer of the Table tree or not",
+    defaultValue: false
+  }),
+  drawEndBorder: (0, _types.createStaticBoolProp)({
+    label: "Draw End Border",
+    description: "Whether to draw the end border at this layer of the Table tree or not",
+    defaultValue: false
+  })
+};
+const SEED_DATA = [{
+  name: "Table",
+  tag: "Table",
+  description: "Top level table container",
+  category: _types.COMPONENT_TYPES.table,
+  stylesPanelSections: _types.BLOCK_STYLES_SECTIONS,
+  props: {
+    ...SHARED_SEED_DATA_PROPS,
+    borderWidth: {
+      ...SHARED_SEED_DATA_PROPS.borderWidth,
+      defaultValue: 1
+    },
+    borderColor: {
+      ...SHARED_SEED_DATA_PROPS.borderColor,
+      defaultValue: "divider"
+    },
+    borderStyle: {
+      ...SHARED_SEED_DATA_PROPS.borderStyle,
+      defaultValue: "solid"
+    },
+    drawTopBorder: {
+      ...SHARED_SEED_DATA_PROPS.drawTopBorder,
+      defaultValue: true
+    },
+    cellVerticalPadding: (0, _types.createStaticNumberProp)({
+      label: "Cell Vertical Padding",
+      description: "Specifies the vertical padding of the cell. Passed down to child Table Row components unless overridden",
+      required: false,
+      defaultValue: 10
+    }),
+    callHorizontalPadding: (0, _types.createStaticNumberProp)({
+      label: "Cell Horizontal Padding",
+      description: "Specifies the horizontal padding of the cell. Passed down to child Table Row components unless overridden",
+      required: false,
+      defaultValue: 10
+    })
+  }
+}, {
+  name: "Table Row",
+  tag: "TableRow",
+  description: "Table Row container",
+  category: _types.COMPONENT_TYPES.table,
+  stylesPanelSections: [_types.StylesPanelSections.Background],
+  props: {
+    ...SHARED_SEED_DATA_PROPS,
+    drawStartBorder: {
+      ...SHARED_SEED_DATA_PROPS.drawStartBorder,
+      defaultValue: true
+    },
+    drawBottomBorder: {
+      ...SHARED_SEED_DATA_PROPS.drawBottomBorder,
+      defaultValue: true
+    },
+    cellVerticalPadding: (0, _types.createStaticNumberProp)({
+      label: "Cell Vertical Padding",
+      description: "Specifies the vertical padding of the cell. Passed down to child Table Cell components unless overridden",
+      required: false,
+      defaultValue: null
+    }),
+    callHorizontalPadding: (0, _types.createStaticNumberProp)({
+      label: "Cell Horizontal Padding",
+      description: "Specifies the horizontal padding of the cell. Passed down to child Table Cell components unless overridden",
+      required: false,
+      defaultValue: null
+    })
+  }
+}, {
+  name: "Table Cell",
+  tag: "TableCell",
+  description: "Table Cell container",
+  category: _types.COMPONENT_TYPES.table,
+  stylesPanelSections: _types.CONTAINER_COMPONENT_STYLES_SECTIONS.filter(item => item !== _types.StylesPanelSections.Borders),
+  layout: {
+    flex: 1,
+    flexDirection: "row"
+  },
+  props: {
+    ...SHARED_SEED_DATA_PROPS,
+    drawEndBorder: {
+      ...SHARED_SEED_DATA_PROPS.drawEndBorder,
+      defaultValue: true
+    },
+    verticalPadding: (0, _types.createStaticNumberProp)({
+      label: "Vertical Padding",
+      description: "Specifies the vertical padding of the cell",
+      required: false,
+      defaultValue: null
+    }),
+    horizontalPadding: (0, _types.createStaticNumberProp)({
+      label: "Horizontal Padding",
+      description: "Specifies the horizontal padding of the cell",
+      required: false,
+      defaultValue: null
+    })
+  }
+}];
+exports.SEED_DATA = SEED_DATA;

package/lib/module/components/Table/Table.js

@@ -0,0 +1,57 @@
+import React from "react";
+import { View, StyleSheet } from "react-native";
+import { withTheme } from "../../theming";
+import { generateBorderStyles } from "./TableCommon";
+import TableRow from "./TableRow";
+const Table = _ref => {
+  let {
+    theme,
+    borderWidth = 1,
+    borderColor = theme.colors.divider,
+    borderStyle = "solid",
+    drawTopBorder = true,
+    drawBottomBorder = false,
+    drawStartBorder = false,
+    drawEndBorder = false,
+    cellVerticalPadding = 10,
+    callHorizontalPadding = 10,
+    children,
+    style
+  } = _ref;
+  //Populate each TableRow props with default values provided here
+  const populatedTableRows = React.useMemo(() => React.Children.map(children, child => {
+    if ( /*#__PURE__*/React.isValidElement(child) && child.type === TableRow) {
+      const oldProps = {
+        ...child.props
+      };
+      const newProps = {
+        cellVerticalPadding: oldProps.cellVerticalPadding || cellVerticalPadding,
+        callHorizontalPadding: oldProps.callHorizontalPadding || callHorizontalPadding,
+        borderWidth: oldProps.borderWidth || borderWidth,
+        borderColor: oldProps.borderColor || borderColor,
+        borderStyle: oldProps.borderStyle || borderStyle
+      };
+      return /*#__PURE__*/React.cloneElement(child, newProps);
+    }
+    return child;
+  }), [children, borderColor, borderWidth, borderStyle, cellVerticalPadding, callHorizontalPadding]);
+  const borderViewStyle = generateBorderStyles({
+    borderColor,
+    borderWidth,
+    borderStyle,
+    drawTopBorder,
+    drawBottomBorder,
+    drawStartBorder,
+    drawEndBorder
+  });
+  return /*#__PURE__*/React.createElement(View, {
+    style: [styles.container, borderViewStyle, style]
+  }, populatedTableRows);
+};
+const styles = StyleSheet.create({
+  container: {
+    display: "flex",
+    flexDirection: "column"
+  }
+});
+export default withTheme(Table);