@draftbit/core 46.4.4-3bb5e5.2 → 46.4.4-7f27fb.2

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

@@ -0,0 +1,102 @@
+"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"));
+
+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,
+    tabBarPosition,
+    keyboardDismissMode,
+    swipeEnabled,
+    scrollEnabled,
+    activeColor,
+    inactiveColor,
+    pressColor,
+    indicatorColor,
+    style,
+    children
+  } = _ref;
+  const [index, setIndex] = React.useState(0);
+  const [routes, setRoutes] = React.useState([]);
+  const [tabScenes, setTabScenes] = React.useState({});
+  React.useEffect(() => {
+    const newRoutes = [];
+    const scenes = {};
+    React.Children.toArray(children).filter(child => child.type === _TabViewItem.default).forEach(child => {
+      var _child$props;
+
+      if (child !== null && child !== void 0 && (_child$props = child.props) !== null && _child$props !== void 0 && _child$props.id) {
+        var _child$props2, _child$props3;
+
+        newRoutes.push({
+          key: child === null || child === void 0 ? void 0 : (_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.id,
+          ...(child === null || child === void 0 ? void 0 : child.props)
+        });
+
+        scenes[child === null || child === void 0 ? void 0 : (_child$props3 = child.props) === null || _child$props3 === void 0 ? void 0 : _child$props3.id] = () => child;
+      }
+    });
+    setRoutes(newRoutes);
+    setTabScenes(scenes);
+  }, [children]);
+
+  const indexChangeHandler = i => setIndex(i);
+
+  const renderTabBar = props => {
+    console.log(props);
+    return /*#__PURE__*/React.createElement(_reactNativeTabView.TabBar, _extends({}, props, {
+      activeColor: activeColor,
+      inactiveColor: inactiveColor,
+      pressColor: pressColor,
+      scrollEnabled: scrollEnabled,
+      indicatorStyle: {
+        backgroundColor: indicatorColor
+      },
+      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: 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 = TabViewComponent;
+exports.default = _default;

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

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+const TabViewItem = _ref => {
+  let {
+    title,
+    id,
+    icon,
+    children,
+    accessibilityLabel
+  } = _ref;
+  console.log({
+    title,
+    id,
+    icon,
+    accessibilityLabel
+  });
+  return children;
+};
+
+var _default = TabViewItem;
+exports.default = _default;

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

@@ -0,0 +1,23 @@
+"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

@@ -369,40 +369,16 @@ Object.defineProperty(exports, "SwitchRow", {
     return _Switch.SwitchRow;
   }
 });
-Object.defineProperty(exports, "Table", {
+Object.defineProperty(exports, "TabView", {
   enumerable: true,
   get: function () {
-    return _Table.Table;
+    return _TabView.TabView;
   }
 });
-Object.defineProperty(exports, "TableCell", {
+Object.defineProperty(exports, "TabViewItem", {
   enumerable: true,
   get: function () {
-    return _Table.TableCell;
-  }
-});
-Object.defineProperty(exports, "TableHeader", {
-  enumerable: true,
-  get: function () {
-    return _Table.TableHeader;
-  }
-});
-Object.defineProperty(exports, "TablePaginator", {
-  enumerable: true,
-  get: function () {
-    return _Table.TablePaginator;
-  }
-});
-Object.defineProperty(exports, "TableRow", {
-  enumerable: true,
-  get: function () {
-    return _Table.TableRow;
-  }
-});
-Object.defineProperty(exports, "TableTitle", {
-  enumerable: true,
-  get: function () {
-    return _Table.TableTitle;
+    return _TabView.TabViewItem;
   }
 });
 Object.defineProperty(exports, "TextField", {
@@ -508,12 +484,12 @@ var _ActionSheet = require("./components/ActionSheet");
 
 var _Swiper = require("./components/Swiper");
 
+var _TabView = require("./components/TabView");
+
 var _Layout = require("./components/Layout");
 
 var _index = require("./components/RadioButton/index");
 
-var _Table = require("./components/Table");
-
 var _CardBlock = _interopRequireDefault(require("./components/CardBlock"));
 
 var _CardContainer = _interopRequireDefault(require("./components/CardContainer"));

package/lib/commonjs/mappings/TabView.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SEED_DATA = void 0;
+
+var _types = require("@draftbit/types");
+
+const SEED_DATA = [{
+  name: "TabView",
+  tag: "TabView",
+  category: _types.COMPONENT_TYPES.container,
+  layout: {},
+  props: {
+    tabBarPosition: (0, _types.createTextEnumProp)({
+      label: "Tab Bar Position",
+      description: "Tab Bar Position",
+      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.createBoolProp)({
+      label: "Swipe Enabled",
+      description: "Swipe Enabled",
+      defaultValue: true
+    }),
+    scrollEnabled: (0, _types.createBoolProp)({
+      label: "Scroll Enabled",
+      description: "Scroll Enabled",
+      defaultValue: true
+    }),
+    activeColor: (0, _types.createColorProp)({
+      label: "Active Color",
+      description: "Active Color",
+      defaultValue: "primary"
+    }),
+    inactiveColor: (0, _types.createColorProp)({
+      label: "Inactive Color",
+      description: "Inactive Color",
+      defaultValue: null
+    }),
+    pressColor: (0, _types.createColorProp)({
+      label: "Press Color",
+      description: "Press Color",
+      defaultValue: null
+    }),
+    indicatorColor: (0, _types.createColorProp)({
+      label: "Indicator Color",
+      description: "Indicator Color",
+      defaultValue: null
+    })
+  }
+}, {
+  name: "TabViewItem",
+  tag: "TabViewItem",
+  category: _types.COMPONENT_TYPES.container,
+  layout: {},
+  props: {
+    title: (0, _types.createTextProp)({
+      label: "Title",
+      description: "Tab Title"
+    }),
+    id: (0, _types.createTextProp)({
+      label: "Id",
+      description: "Tab Id"
+    }),
+    accessibilityLabel: (0, _types.createTextProp)({
+      label: "Accessibility Label",
+      description: "Accessibility Label"
+    })
+  }
+}];
+exports.SEED_DATA = SEED_DATA;

package/lib/commonjs/utilities.js

@@ -44,8 +44,8 @@ function extractStyles(style) {
     textDecorationStyle
   };
   return {
-    viewStyles: (0, _lodash.omitBy)(viewStyles, _lodash.isNil),
-    textStyles: (0, _lodash.omitBy)(textStyles, _lodash.isNil)
+    viewStyles,
+    textStyles
   };
 }
 

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

@@ -0,0 +1,87 @@
+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 { withTheme } from "../../theming";
+
+import TabViewItem from "./TabViewItem";
+
+const TabViewComponent = _ref => {
+  let {
+    Icon,
+    tabBarPosition,
+    keyboardDismissMode,
+    swipeEnabled,
+    scrollEnabled,
+    activeColor,
+    inactiveColor,
+    pressColor,
+    indicatorColor,
+    style,
+    children
+  } = _ref;
+  const [index, setIndex] = React.useState(0);
+  const [routes, setRoutes] = React.useState([]);
+  const [tabScenes, setTabScenes] = React.useState({});
+  React.useEffect(() => {
+    const newRoutes = [];
+    const scenes = {};
+    React.Children.toArray(children).filter(child => child.type === TabViewItem).forEach(child => {
+      var _child$props;
+
+      if (child !== null && child !== void 0 && (_child$props = child.props) !== null && _child$props !== void 0 && _child$props.id) {
+        var _child$props2, _child$props3;
+
+        newRoutes.push({
+          key: child === null || child === void 0 ? void 0 : (_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.id,
+          ...(child === null || child === void 0 ? void 0 : child.props)
+        });
+
+        scenes[child === null || child === void 0 ? void 0 : (_child$props3 = child.props) === null || _child$props3 === void 0 ? void 0 : _child$props3.id] = () => child;
+      }
+    });
+    setRoutes(newRoutes);
+    setTabScenes(scenes);
+  }, [children]);
+
+  const indexChangeHandler = i => setIndex(i);
+
+  const renderTabBar = props => {
+    console.log(props);
+    return /*#__PURE__*/React.createElement(TabBar, _extends({}, props, {
+      activeColor: activeColor,
+      inactiveColor: inactiveColor,
+      pressColor: pressColor,
+      scrollEnabled: scrollEnabled,
+      indicatorStyle: {
+        backgroundColor: indicatorColor
+      },
+      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: style
+    }));
+  };
+
+  return /*#__PURE__*/React.createElement(TabView, {
+    navigationState: {
+      index,
+      routes
+    },
+    renderScene: SceneMap(tabScenes),
+    renderTabBar: renderTabBar,
+    onIndexChange: indexChangeHandler,
+    tabBarPosition: tabBarPosition,
+    keyboardDismissMode: keyboardDismissMode,
+    swipeEnabled: swipeEnabled
+  });
+};
+
+export default TabViewComponent;

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

@@ -0,0 +1,18 @@
+const TabViewItem = _ref => {
+  let {
+    title,
+    id,
+    icon,
+    children,
+    accessibilityLabel
+  } = _ref;
+  console.log({
+    title,
+    id,
+    icon,
+    accessibilityLabel
+  });
+  return children;
+};
+
+export default TabViewItem;

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

@@ -0,0 +1,2 @@
+export { default as TabView } from "./TabView";
+export { default as TabViewItem } from "./TabViewItem";

package/lib/module/components/ToggleButton.js

@@ -1,5 +1,3 @@
-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 { withTheme } from "../theming";
 import { StyleSheet } from "react-native";
@@ -42,13 +40,29 @@ const ToggleButton = _ref => {
     onPress(!internalValue);
   };
 
-  return /*#__PURE__*/React.createElement(IconButton, _extends({
+  return /*#__PURE__*/React.createElement(IconButton, {
     Icon: Icon,
     icon: icon,
     size: iconSize,
     color: internalValue ? colors[color] : colors[colorSecondary],
     onPress: handlePress,
     disabled: disabled,
+    style: [styles.mainContainer, {
+      width,
+      height,
+      backgroundColor: internalValue ? colors[colorSecondary] : colors[color],
+      borderColor: colors[borderColor]
+    }, style],
+    ...rest
+  });
+};
+
+const styles = StyleSheet.create({
+  mainContainer: {
+    borderWidth: 1
+  }
+});
+export default withTheme(ToggleButton);: disabled,
     style: [styles.mainContainer, {
       width,
       height,

package/lib/module/index.js

@@ -29,9 +29,9 @@ export { default as Touchable } from "./components/Touchable";
 export { AccordionGroup, AccordionItem } from "./components/Accordion";
 export { ActionSheet, ActionSheetItem, ActionSheetCancel } from "./components/ActionSheet";
 export { Swiper, SwiperItem } from "./components/Swiper";
+export { TabView, TabViewItem } from "./components/TabView";
 export { Center, Circle, Square, Row, Stack, Spacer } from "./components/Layout";
 export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup } from "./components/RadioButton/index";
-export { Table, TableRow, TablePaginator, TableHeader, TableCell, TableTitle } from "./components/Table";
 /* Deprecated: Fix or Delete!  */
 
 export { default as CardBlock } from "./components/CardBlock";

package/lib/module/mappings/TabView.js

@@ -0,0 +1,70 @@
+import { COMPONENT_TYPES, createTextProp, createTextEnumProp, createBoolProp, createColorProp } from "@draftbit/types";
+export const SEED_DATA = [{
+  name: "TabView",
+  tag: "TabView",
+  category: COMPONENT_TYPES.container,
+  layout: {},
+  props: {
+    tabBarPosition: createTextEnumProp({
+      label: "Tab Bar Position",
+      description: "Tab Bar Position",
+      options: ["top", "bottom"],
+      defaultValue: "top"
+    }),
+    keyboardDismissMode: createTextEnumProp({
+      label: "Keyboard Dismiss Mode",
+      description: "Keyboard Dismiss Mode",
+      options: ["auto", "on-drag", "none"],
+      defaultValue: "auto"
+    }),
+    swipeEnabled: createBoolProp({
+      label: "Swipe Enabled",
+      description: "Swipe Enabled",
+      defaultValue: true
+    }),
+    scrollEnabled: createBoolProp({
+      label: "Scroll Enabled",
+      description: "Scroll Enabled",
+      defaultValue: true
+    }),
+    activeColor: createColorProp({
+      label: "Active Color",
+      description: "Active Color",
+      defaultValue: "primary"
+    }),
+    inactiveColor: createColorProp({
+      label: "Inactive Color",
+      description: "Inactive Color",
+      defaultValue: null
+    }),
+    pressColor: createColorProp({
+      label: "Press Color",
+      description: "Press Color",
+      defaultValue: null
+    }),
+    indicatorColor: createColorProp({
+      label: "Indicator Color",
+      description: "Indicator Color",
+      defaultValue: null
+    })
+  }
+}, {
+  name: "TabViewItem",
+  tag: "TabViewItem",
+  category: COMPONENT_TYPES.container,
+  layout: {},
+  props: {
+    title: createTextProp({
+      label: "Title",
+      description: "Tab Title"
+    }),
+    id: createTextProp({
+      label: "Id",
+      description: "Tab Id"
+    }),
+    accessibilityLabel: createTextProp({
+      label: "Accessibility Label",
+      description: "Accessibility Label"
+    })
+  }
+}];

package/lib/module/utilities.js

@@ -1,5 +1,5 @@
 import { StyleSheet } from "react-native";
-import { isString, isNumber, pick, pickBy, identity, omitBy, isNil } from "lodash";
+import { isString, isNumber, pick, pickBy, identity } from "lodash";
 export function extractStyles(style) {
   const {
     color,
@@ -29,8 +29,8 @@ export function extractStyles(style) {
     textDecorationStyle
   };
   return {
-    viewStyles: omitBy(viewStyles, isNil),
-    textStyles: omitBy(textStyles, isNil)
+    viewStyles,
+    textStyles
   };
 }
 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"];

package/lib/typescript/src/components/TabView/TabView.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { StyleProp, TextStyle, ViewStyle } from "react-native";
+import type { IconSlot } from "../../interfaces/Icon";
+declare type TabBarPosition = "top" | "bottom";
+declare type KeyboardDismissMode = "none" | "auto" | "on-drag";
+declare type TabViewProps = {
+    tabBarPosition?: TabBarPosition;
+    keyboardDismissMode?: KeyboardDismissMode;
+    swipeEnabled?: boolean;
+    scrollEnabled?: boolean;
+    activeColor?: string;
+    inactiveColor?: string;
+    pressColor?: string;
+    indicatorColor?: string;
+    style?: StyleProp<TextStyle | ViewStyle>;
+    children: React.ReactNode;
+} & IconSlot;
+declare const TabViewComponent: ({ Icon, tabBarPosition, keyboardDismissMode, swipeEnabled, scrollEnabled, activeColor, inactiveColor, pressColor, indicatorColor, style, children, }: TabViewProps) => JSX.Element;
+export default TabViewComponent;

package/lib/typescript/src/components/TabView/TabViewItem.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+interface TabViewItemProps {
+    title: string;
+    id: string;
+    icon: string;
+    accessibilityLabel: string;
+    children: React.ReactNode;
+}
+declare const TabViewItem: ({ title, id, icon, children, accessibilityLabel, }: TabViewItemProps) => React.ReactNode;
+export default TabViewItem;

package/lib/typescript/src/components/TabView/index.d.ts

@@ -0,0 +1,2 @@
+export { default as TabView } from "./TabView";
+export { default as TabViewItem } from "./TabViewItem";

package/lib/typescript/src/index.d.ts

@@ -29,9 +29,9 @@ export { default as Touchable } from "./components/Touchable";
 export { AccordionGroup, AccordionItem } from "./components/Accordion";
 export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/ActionSheet";
 export { Swiper, SwiperItem } from "./components/Swiper";
+export { TabView, TabViewItem } from "./components/TabView";
 export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
 export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
-export { Table, TableRow, TablePaginator, TableHeader, TableCell, TableTitle, } from "./components/Table";
 export { default as CardBlock } from "./components/CardBlock";
 export { default as CardContainer } from "./components/CardContainer";
 export { default as CardContainerRating } from "./components/CardContainerRating";