@draftbit/core 46.10.3-1ab4b6.2 → 46.10.3-258cfa.2

package/lib/typescript/src/mappings/Layout.d.ts

@@ -1,133 +1,169 @@
 export declare const SEED_DATA: ({
+    name: string;
+    tag: string;
+    category: string;
+    stylesPanelSections: string[];
     props: {
-        ratio: {
+        justifyContent: {
             label: string;
+            group: string;
             description: string;
             formType: string;
             propType: string;
+            defaultValue: string;
+            editable: boolean;
+            required: boolean;
+        };
+        alignItems: {
+            label: string;
             group: string;
-            defaultValue: null;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: string;
             editable: boolean;
             required: boolean;
-            step: number;
         };
-        centerContent?: undefined;
-        isDisabled?: undefined;
-        isInvalid?: undefined;
-        reversed?: undefined;
+        top?: undefined;
+        right?: undefined;
+        bottom?: undefined;
+        left?: undefined;
+        width?: undefined;
+        height?: undefined;
+        bgColor?: undefined;
+        size?: undefined;
     };
-    stylesPanelSections: string[];
-    category: string;
-    packageName: string;
-    name: string;
-    tag: string;
-    description: string;
 } | {
-    category: string;
-    packageName: string;
-    stylesPanelSections: string[];
     name: string;
     tag: string;
-    description: string;
-} | {
     category: string;
-    packageName: string;
-    stylesPanelSections: string[];
-    name: string;
-    tag: string;
-    description: string;
     props: {
-        centerContent: {
+        top: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: number;
+            editable: boolean;
+            required: boolean;
+        };
+        right: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: number;
+            editable: boolean;
+            required: boolean;
+        };
+        bottom: {
             label: string;
             description: string;
             formType: string;
             propType: string;
-            defaultValue: boolean;
+            group: string;
+            defaultValue: number;
             editable: boolean;
             required: boolean;
+        };
+        left: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
             group: string;
+            defaultValue: number;
+            editable: boolean;
+            required: boolean;
         };
-        ratio?: undefined;
-        isDisabled?: undefined;
-        isInvalid?: undefined;
-        reversed?: undefined;
+        justifyContent?: undefined;
+        alignItems?: undefined;
+        width?: undefined;
+        height?: undefined;
+        bgColor?: undefined;
+        size?: undefined;
     };
+    stylesPanelSections?: undefined;
 } | {
-    category: string;
-    packageName: string;
-    stylesPanelSections: string[];
     name: string;
     tag: string;
-    description: string;
-    layout: {
-        flexDirection: string;
-        flex?: undefined;
-    };
-} | {
-    stylesPanelSections: string[];
     category: string;
-    packageName: string;
-    name: string;
-    tag: string;
-    description: string;
-    layout: {
-        flex: number;
-        flexDirection?: undefined;
-    };
-} | {
+    stylesPanelSections: string[];
     props: {
-        isDisabled: {
+        width: {
             label: string;
             description: string;
             formType: string;
             propType: string;
-            defaultValue: boolean;
+            group: string;
+            defaultValue: number;
             editable: boolean;
             required: boolean;
+        };
+        height: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
             group: string;
+            defaultValue: number;
+            editable: boolean;
+            required: boolean;
         };
-        isInvalid: {
+        bgColor: {
             label: string;
             description: string;
             formType: string;
             propType: string;
-            defaultValue: boolean;
             editable: boolean;
             required: boolean;
+            defaultValue: string;
             group: string;
         };
-        ratio?: undefined;
-        centerContent?: undefined;
-        reversed?: undefined;
+        justifyContent?: undefined;
+        alignItems?: undefined;
+        top?: undefined;
+        right?: undefined;
+        bottom?: undefined;
+        left?: undefined;
+        size?: undefined;
     };
-    category: string;
-    packageName: string;
-    stylesPanelSections: string[];
+} | {
     name: string;
     tag: string;
-    description: string;
-} | {
+    category: string;
+    stylesPanelSections: string[];
     props: {
-        reversed: {
+        size: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: number;
+            editable: boolean;
+            required: boolean;
+        };
+        bgColor: {
             label: string;
             description: string;
             formType: string;
             propType: string;
-            defaultValue: boolean;
             editable: boolean;
             required: boolean;
+            defaultValue: string;
             group: string;
         };
-        ratio?: undefined;
-        centerContent?: undefined;
-        isDisabled?: undefined;
-        isInvalid?: undefined;
+        justifyContent?: undefined;
+        alignItems?: undefined;
+        top?: undefined;
+        right?: undefined;
+        bottom?: undefined;
+        left?: undefined;
+        width?: undefined;
+        height?: undefined;
     };
-    category: string;
-    packageName: string;
-    stylesPanelSections: string[];
-    name: string;
-    tag: string;
-    description: string;
 })[];
 //# sourceMappingURL=Layout.d.ts.map

package/lib/typescript/src/mappings/Layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Layout.ts"],"names":[],"mappings":"AAsBA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA0HrB,CAAC"}
+{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Layout.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAsMrB,CAAC"}

package/lib/typescript/src/mappings/NativeBase/Layout.d.ts

@@ -0,0 +1,133 @@
+export declare const SEED_DATA: ({
+    props: {
+        ratio: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        centerContent?: undefined;
+        isDisabled?: undefined;
+        isInvalid?: undefined;
+        reversed?: undefined;
+    };
+    stylesPanelSections: string[];
+    category: string;
+    packageName: string;
+    name: string;
+    tag: string;
+    description: string;
+} | {
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+} | {
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+    props: {
+        centerContent: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        ratio?: undefined;
+        isDisabled?: undefined;
+        isInvalid?: undefined;
+        reversed?: undefined;
+    };
+} | {
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+    layout: {
+        flexDirection: string;
+        flex?: undefined;
+    };
+} | {
+    stylesPanelSections: string[];
+    category: string;
+    packageName: string;
+    name: string;
+    tag: string;
+    description: string;
+    layout: {
+        flex: number;
+        flexDirection?: undefined;
+    };
+} | {
+    props: {
+        isDisabled: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        isInvalid: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        ratio?: undefined;
+        centerContent?: undefined;
+        reversed?: undefined;
+    };
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+} | {
+    props: {
+        reversed: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        ratio?: undefined;
+        centerContent?: undefined;
+        isDisabled?: undefined;
+        isInvalid?: undefined;
+    };
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+})[];
+//# sourceMappingURL=Layout.d.ts.map

package/lib/typescript/src/mappings/NativeBase/Layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../../../../../src/mappings/NativeBase/Layout.ts"],"names":[],"mappings":"AAsBA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA0HrB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@draftbit/core",
-  "version": "46.10.3-1ab4b6.2+1ab4b61",
+  "version": "46.10.3-258cfa.2+258cfa9",
   "description": "Core (non-native) Components",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -41,7 +41,7 @@
   "dependencies": {
     "@date-io/date-fns": "^1.3.13",
     "@draftbit/react-theme-provider": "^2.1.1",
-    "@draftbit/types": "^46.10.3-1ab4b6.2+1ab4b61",
+    "@draftbit/types": "^46.10.3-258cfa.2+258cfa9",
     "@material-ui/core": "^4.11.0",
     "@material-ui/pickers": "^3.2.10",
     "@react-native-community/slider": "4.2.3",
@@ -100,5 +100,5 @@
       ]
     ]
   },
-  "gitHead": "1ab4b613a7ec9e7917fd10087e0d8b672e2641b2"
+  "gitHead": "258cfa910e2606db46e99152e4499d8fb6e17174"
 }

package/src/components/Table/Table.js

@@ -1,8 +1,7 @@
 import React from "react";
 import { ScrollView, View, StyleSheet, } from "react-native";
-import { withTheme } from "../../theming";
-import { generateBorderStyles, TableStyleContext, } from "./TableCommon";
-const Table = ({ theme, borderWidth = 1, borderColor = theme.colors.divider, borderStyle = "solid", drawTopBorder = true, drawBottomBorder = false, drawStartBorder = false, drawEndBorder = false, cellVerticalPadding = 10, cellHorizontalPadding = 10, data, keyExtractor, renderItem, children: childrenProp, style, ...rest }) => {
+import { generateBorderStyles, TableStyleContext, } from "./index";
+const Table = ({ borderWidth = 1, borderColor = "rgba(200, 200, 200, 1)", borderStyle = "solid", drawTopBorder = true, drawBottomBorder = false, drawStartBorder = false, drawEndBorder = false, cellVerticalPadding = 10, cellHorizontalPadding = 10, data, keyExtractor, renderItem, children: childrenProp, style, ...rest }) => {
     //Both 'renderItem' and 'data' are optional to allow direct children. But if one is included, both need to be included
     if ((data && !renderItem) || (renderItem && !data)) {
         throw new Error("'renderItem' and 'data' need to both be provided to render from 'data'. Either remove them entirley or include both");
@@ -90,4 +89,4 @@ const styles = StyleSheet.create({
         flex: 1,
     },
 });
-export default withTheme(Table);
+export default Table;

package/src/components/Table/Table.tsx

@@ -7,27 +7,23 @@ import {
   StyleSheet,
   ScrollViewProps,
 } from "react-native";
-import { Theme } from "../../styles/DefaultTheme";
-import { withTheme } from "../../theming";
 import {
   generateBorderStyles,
   TableProps,
   TableStyleContext,
   TableStyleProps,
-} from "./TableCommon";
+} from "./index";
 
 export interface Props<T> extends TableProps, ScrollViewProps {
   data?: Array<T>;
   keyExtractor?: (item: T, index: number) => string;
   renderItem?: ({ item, index }: { item: T; index: number }) => JSX.Element;
   style?: StyleProp<ViewStyle>;
-  theme: Theme;
 }
 
 const Table = <T extends object>({
-  theme,
   borderWidth = 1,
-  borderColor = theme.colors.divider,
+  borderColor = "rgba(200, 200, 200, 1)",
   borderStyle = "solid",
   drawTopBorder = true,
   drawBottomBorder = false,
@@ -173,4 +169,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default withTheme(Table);
+export default Table;

package/src/components/Table/TableCell.js

@@ -1,6 +1,6 @@
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import { generateBorderStyles, TableStyleContext, } from "./TableCommon";
+import { generateBorderStyles, TableStyleContext } from "./index";
 const TableCell = ({ borderWidth, borderColor, borderStyle, drawTopBorder = false, drawBottomBorder = false, drawStartBorder = false, drawEndBorder = true, cellVerticalPadding, cellHorizontalPadding, children, style, }) => {
     const parentContextValue = React.useContext(TableStyleContext);
     const borderViewStyle = generateBorderStyles({

package/src/components/Table/TableCell.tsx

@@ -1,10 +1,6 @@
 import React from "react";
 import { View, StyleProp, ViewStyle, StyleSheet } from "react-native";
-import {
-  generateBorderStyles,
-  TableProps,
-  TableStyleContext,
-} from "./TableCommon";
+import { generateBorderStyles, TableProps, TableStyleContext } from "./index";
 
 export interface Props extends TableProps {
   style?: StyleProp<ViewStyle>;

package/src/components/Table/TableRow.js

@@ -1,6 +1,6 @@
 import React from "react";
 import { View, StyleSheet } from "react-native";
-import { generateBorderStyles, TableStyleContext, } from "./TableCommon";
+import { generateBorderStyles, TableStyleContext, } from "./index";
 import { withTheme } from "../../theming";
 const TableRow = ({ borderWidth, borderColor, borderStyle, drawTopBorder = false, drawBottomBorder = true, drawStartBorder = true, drawEndBorder = false, cellVerticalPadding, cellHorizontalPadding, isTableHeader = false, children, style, theme, }) => {
     const parentContextValue = React.useContext(TableStyleContext);

package/src/components/Table/TableRow.tsx

@@ -5,7 +5,7 @@ import {
   TableProps,
   TableStyleContext,
   TableStyleProps,
-} from "./TableCommon";
+} from "./index";
 import { Theme } from "../../styles/DefaultTheme";
 import { withTheme } from "../../theming";
 

package/src/components/Table/index.js

@@ -1,3 +1,15 @@
+import React from "react";
+export const TableStyleContext = React.createContext({});
+export function generateBorderStyles({ borderColor, borderWidth, borderStyle, drawTopBorder, drawBottomBorder, drawStartBorder, drawEndBorder, }) {
+    return {
+        borderColor,
+        borderStyle,
+        borderTopWidth: drawTopBorder ? borderWidth : 0,
+        borderBottomWidth: drawBottomBorder ? borderWidth : 0,
+        borderStartWidth: drawStartBorder ? borderWidth : 0,
+        borderEndWidth: drawEndBorder ? borderWidth : 0,
+    };
+}
 export { default as Table } from "./Table";
 export { default as TableRow } from "./TableRow";
 export { default as TableCell } from "./TableCell";

package/src/components/Table/index.tsx

@@ -1,3 +1,44 @@
+import React from "react";
+import { ViewStyle } from "react-native";
+
+type BorderStyle = "solid" | "dotted" | "dashed";
+
+export const TableStyleContext = React.createContext<TableStyleProps>({});
+
+export interface TableStyleProps {
+  borderWidth?: number;
+  borderColor?: string;
+  borderStyle?: BorderStyle;
+  cellVerticalPadding?: number;
+  cellHorizontalPadding?: number;
+}
+
+export interface TableProps extends TableStyleProps {
+  drawTopBorder?: boolean;
+  drawBottomBorder?: boolean;
+  drawStartBorder?: boolean;
+  drawEndBorder?: boolean;
+}
+
+export function generateBorderStyles({
+  borderColor,
+  borderWidth,
+  borderStyle,
+  drawTopBorder,
+  drawBottomBorder,
+  drawStartBorder,
+  drawEndBorder,
+}: TableProps): ViewStyle {
+  return {
+    borderColor,
+    borderStyle,
+    borderTopWidth: drawTopBorder ? borderWidth : 0,
+    borderBottomWidth: drawBottomBorder ? borderWidth : 0,
+    borderStartWidth: drawStartBorder ? borderWidth : 0,
+    borderEndWidth: drawEndBorder ? borderWidth : 0,
+  };
+}
+
 export { default as Table } from "./Table";
 export { default as TableRow } from "./TableRow";
 export { default as TableCell } from "./TableCell";