ferns-ui 0.2.0

package/dist/SplitPage.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/SplitPage.stories.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { SplitPage } from "./SplitPage";
+import { Text } from "./Text";
+import { storiesOf } from "@storybook/react-native";
+import { Box } from "./Box";
+storiesOf("Split Page", module).add("Split", () => (React.createElement(SplitPage, { navigation: {}, listViewWidth: 250, renderListViewItem: (item) => (React.createElement(Box, { color: "blue", padding: 2 },
+        React.createElement(Text, null,
+            "name: ",
+            item.item.name))), renderListViewHeader: () => (React.createElement(Box, { padding: 2, color: "red" },
+        React.createElement(Text, { weight: "bold" }, "Users:"))), listViewData: Array.from(Array(100).keys()).map((i) => ({ name: `user${i}` })), renderContent: (index) => (React.createElement(Box, { padding: 2, color: "lightGray" },
+        index === undefined && React.createElement(Text, { weight: "bold" }, "Nothing selected"),
+        index !== undefined && React.createElement(Text, { weight: "bold" },
+            "User ",
+            index))) })));
+//# sourceMappingURL=SplitPage.stories.js.map

package/dist/SplitPage.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitPage.stories.js","sourceRoot":"","sources":["../unifier/SplitPage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AACtC,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAC,SAAS,EAAC,MAAM,yBAAyB,CAAC;AAClD,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAE1B,SAAS,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,CACjD,oBAAC,SAAS,IACR,UAAU,EAAE,EAAE,EACd,aAAa,EAAE,GAAG,EAClB,kBAAkB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAC5B,oBAAC,GAAG,IAAC,KAAK,EAAC,MAAM,EAAC,OAAO,EAAE,CAAC;QAC1B,oBAAC,IAAI;;YAAQ,IAAI,CAAC,IAAI,CAAC,IAAI,CAAQ,CAC/B,CACP,EACD,oBAAoB,EAAE,GAAG,EAAE,CAAC,CAC1B,oBAAC,GAAG,IAAC,OAAO,EAAE,CAAC,EAAE,KAAK,EAAC,KAAK;QAC1B,oBAAC,IAAI,IAAC,MAAM,EAAC,MAAM,aAAc,CAC7B,CACP,EACD,YAAY,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,OAAO,CAAC,EAAE,EAAC,CAAC,CAAC,EAC5E,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CACxB,oBAAC,GAAG,IAAC,OAAO,EAAE,CAAC,EAAE,KAAK,EAAC,WAAW;QAC/B,KAAK,KAAK,SAAS,IAAI,oBAAC,IAAI,IAAC,MAAM,EAAC,MAAM,uBAAwB;QAClE,KAAK,KAAK,SAAS,IAAI,oBAAC,IAAI,IAAC,MAAM,EAAC,MAAM;;YAAO,KAAK,CAAQ,CAC3D,CACP,GACD,CACH,CAAC,CAAC"}

package/dist/StorybookContainer.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+export declare class StorybookContainer extends React.Component<any, any> {
+    render(): JSX.Element;
+}

package/dist/StorybookContainer.js

@@ -0,0 +1,8 @@
+import { Box } from "./Box";
+import React from "react";
+export class StorybookContainer extends React.Component {
+    render() {
+        return (React.createElement(Box, { width: "100%", height: "100%", display: "flex", direction: "column", padding: 8, scroll: true }, this.props.children));
+    }
+}
+//# sourceMappingURL=StorybookContainer.js.map

package/dist/StorybookContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StorybookContainer.js","sourceRoot":"","sources":["../src/StorybookContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,OAAO,kBAAmB,SAAQ,KAAK,CAAC,SAAmB;IAC/D,MAAM;QACJ,OAAO,CACL,oBAAC,GAAG,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,IAAI,IACvF,IAAI,CAAC,KAAK,CAAC,QAAQ,CAChB,CACP,CAAC;IACJ,CAAC;CACF"}

package/dist/Switch.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { SwitchProps } from "./Common";
+export declare class Switch extends React.Component<SwitchProps, {}> {
+    render(): JSX.Element;
+}

package/dist/Switch.js

@@ -0,0 +1,10 @@
+import React from "react";
+import { Switch as NativeSwitch } from "react-native";
+import { WithLabel } from "./WithLabel";
+export class Switch extends React.Component {
+    render() {
+        return (React.createElement(WithLabel, Object.assign({ labelInline: true, labelJustifyContent: "between" }, this.props),
+            React.createElement(NativeSwitch, { disabled: this.props.disabled, value: this.props.switched, onValueChange: this.props.onChange })));
+    }
+}
+//# sourceMappingURL=Switch.js.map

package/dist/Switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../src/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,cAAc,CAAC;AAGpD,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAEtC,MAAM,OAAO,MAAO,SAAQ,KAAK,CAAC,SAA0B;IAC1D,MAAM;QACJ,OAAO,CACL,oBAAC,SAAS,kBAAC,WAAW,QAAC,mBAAmB,EAAC,SAAS,IAAK,IAAI,CAAC,KAAK;YACjE,oBAAC,YAAY,IACX,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC1B,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,GAClC,CACQ,CACb,CAAC;IACJ,CAAC;CACF"}

package/dist/Switch.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Switch.stories.js

@@ -0,0 +1,34 @@
+import { Switch } from "./Switch";
+import { storiesOf } from "@storybook/react-native";
+import React from "react";
+import { Box } from "./Box";
+import { WithLabel } from "./WithLabel";
+import { StorybookContainer } from "./StorybookContainer";
+class SwitchForms extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            boolean: false,
+            withLabel: false,
+            primary: false,
+            small: false,
+        };
+    }
+    render() {
+        return (React.createElement(StorybookContainer, null,
+            React.createElement(Box, { width: "100%", height: "100%", display: "flex", direction: "column" },
+                React.createElement(Switch, { id: "check", switched: this.state.boolean, onChange: (result) => this.setState({ boolean: result }) }),
+                React.createElement(WithLabel, { label: "With A Label" },
+                    React.createElement(Switch, { id: "withLabel", switched: this.state.withLabel, onChange: (result) => this.setState({ withLabel: result }) })),
+                React.createElement(WithLabel, { label: "Primary Color" },
+                    React.createElement(Switch, { id: "primary", switched: this.state.primary, label: "Primary Color", 
+                        // color="primary"
+                        labelColor: "primary", onChange: (result) => this.setState({ primary: result }) })),
+                React.createElement(WithLabel, { label: "Small" },
+                    React.createElement(Switch, { id: "small", switched: this.state.small, label: "Small", 
+                        // size="sm"
+                        onChange: (result) => this.setState({ small: result }) })))));
+    }
+}
+storiesOf("Switch", module).add("Switch", () => React.createElement(SwitchForms, null));
+//# sourceMappingURL=Switch.stories.js.map

package/dist/Switch.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.stories.js","sourceRoot":"","sources":["../unifier/Switch.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAChC,OAAO,EAAC,SAAS,EAAC,MAAM,yBAAyB,CAAC;AAClD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AACtC,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AASxD,MAAM,WAAY,SAAQ,KAAK,CAAC,SAAoB;IAClD,YAAY,KAAU;QACpB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACX,OAAO,EAAE,KAAK;YACd,SAAS,EAAE,KAAK;YAChB,OAAO,EAAE,KAAK;YACd,KAAK,EAAE,KAAK;SACb,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,oBAAC,kBAAkB;YACjB,oBAAC,GAAG,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,QAAQ;gBAC/D,oBAAC,MAAM,IACL,EAAE,EAAC,OAAO,EACV,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAC5B,QAAQ,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,OAAO,EAAE,MAAM,EAAC,CAAC,GACtD;gBACF,oBAAC,SAAS,IAAC,KAAK,EAAC,cAAc;oBAC7B,oBAAC,MAAM,IACL,EAAE,EAAC,WAAW,EACd,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC9B,QAAQ,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,SAAS,EAAE,MAAM,EAAC,CAAC,GACxD,CACQ;gBAEZ,oBAAC,SAAS,IAAC,KAAK,EAAC,eAAe;oBAC9B,oBAAC,MAAM,IACL,EAAE,EAAC,SAAS,EACZ,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAC5B,KAAK,EAAC,eAAe;wBACrB,kBAAkB;wBAClB,UAAU,EAAC,SAAS,EACpB,QAAQ,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,OAAO,EAAE,MAAM,EAAC,CAAC,GACtD,CACQ;gBACZ,oBAAC,SAAS,IAAC,KAAK,EAAC,OAAO;oBACtB,oBAAC,MAAM,IACL,EAAE,EAAC,OAAO,EACV,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAC1B,KAAK,EAAC,OAAO;wBACb,YAAY;wBACZ,QAAQ,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,KAAK,EAAE,MAAM,EAAC,CAAC,GACpD,CACQ,CACR,CACa,CACtB,CAAC;IACJ,CAAC;CACF;AAED,SAAS,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,oBAAC,WAAW,OAAG,CAAC,CAAC"}

package/dist/TapToEdit.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { TextFieldProps } from "./Common";
+interface TapToEditState {
+    showEdit: boolean;
+}
+export declare class TapToEdit extends React.Component<TextFieldProps, TapToEditState> {
+    state: {
+        showEdit: boolean;
+    };
+    render(): JSX.Element;
+}
+export {};

package/dist/TapToEdit.js

@@ -0,0 +1,32 @@
+import React from "react";
+import { Box } from "./Box";
+import { Button } from "./Button";
+import { Icon } from "./Icon";
+import { Text } from "./Text";
+import { TextField } from "./TextField";
+export class TapToEdit extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.state = { showEdit: false };
+    }
+    render() {
+        if (!this.state.showEdit) {
+            return (React.createElement(Box, { direction: "row", display: "flex", onClick: () => this.setState({ showEdit: true }) },
+                React.createElement(Box, { marginRight: 2 },
+                    React.createElement(Icon, { color: "primaryDark", name: "edit", prefix: "far", size: 20 })),
+                React.createElement(Text, null, this.props.children)));
+        }
+        else {
+            return (React.createElement(Box, null,
+                React.createElement(TextField, Object.assign({}, this.props)),
+                React.createElement(Box, { paddingY: 1, width: 100 },
+                    React.createElement(Button, { color: "primary", inline: true, text: "Save", onClick: () => {
+                            this.setState({ showEdit: false });
+                            if (this.props.onSubmitEditing) {
+                                this.props.onSubmitEditing();
+                            }
+                        } }))));
+        }
+    }
+}
+//# sourceMappingURL=TapToEdit.js.map

package/dist/TapToEdit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TapToEdit.js","sourceRoot":"","sources":["../src/TapToEdit.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAMtC,MAAM,OAAO,SAAU,SAAQ,KAAK,CAAC,SAAyC;IAA9E;;QACE,UAAK,GAAG,EAAC,QAAQ,EAAE,KAAK,EAAC,CAAC;IAiC5B,CAAC;IA/BC,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;YACxB,OAAO,CACL,oBAAC,GAAG,IAAC,SAAS,EAAC,KAAK,EAAC,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAC,CAAC;gBAChF,oBAAC,GAAG,IAAC,WAAW,EAAE,CAAC;oBACjB,oBAAC,IAAI,IAAC,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,IAAI,EAAE,EAAE,GAAI,CAC3D;gBACN,oBAAC,IAAI,QAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAQ,CAC9B,CACP,CAAC;SACH;aAAM;YACL,OAAO,CACL,oBAAC,GAAG;gBACF,oBAAC,SAAS,oBAAK,IAAI,CAAC,KAAK,EAAI;gBAC7B,oBAAC,GAAG,IAAC,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,GAAG;oBAC1B,oBAAC,MAAM,IACL,KAAK,EAAC,SAAS,EACf,MAAM,QACN,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,GAAG,EAAE;4BACZ,IAAI,CAAC,QAAQ,CAAC,EAAC,QAAQ,EAAE,KAAK,EAAC,CAAC,CAAC;4BACjC,IAAI,IAAI,CAAC,KAAK,CAAC,eAAe,EAAE;gCAC9B,IAAI,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;6BAC9B;wBACH,CAAC,GACD,CACE,CACF,CACP,CAAC;SACH;IACH,CAAC;CACF"}

package/dist/Text.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import { TextProps } from "./Common";
+export declare class Text extends React.Component<TextProps, {}> {
+    fontSizes: {
+        sm: number;
+        md: number;
+        lg: number;
+    };
+    propsToStyle(): any;
+    render(): JSX.Element;
+}

package/dist/Text.js

@@ -0,0 +1,85 @@
+import React from "react";
+import { Text as NativeText } from "react-native";
+import Hyperlink from "react-native-hyperlink";
+import { Unifier } from "./Unifier";
+export class Text extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.fontSizes = {
+            sm: 12,
+            md: 14,
+            lg: 16,
+        };
+    }
+    propsToStyle() {
+        const style = {};
+        let font = "primaryFont";
+        if (this.props.font === "primary") {
+            if (this.props.weight === "bold") {
+                font = "primaryBoldFont";
+            }
+            else {
+                font = "primaryFont";
+            }
+        }
+        else if (this.props.font === "secondary") {
+            if (this.props.weight === "bold") {
+                font = "secondaryBoldFont";
+            }
+            else {
+                font = "secondaryFont";
+            }
+        }
+        else if (this.props.font === "button") {
+            font = "buttonFont";
+        }
+        else if (this.props.font === "title") {
+            font = "titleFont";
+        }
+        else if (this.props.font === "accent") {
+            if (this.props.weight === "bold") {
+                font = "accentBoldFont";
+            }
+            else {
+                font = "accentFont";
+            }
+        }
+        style.fontFamily = Unifier.theme[font];
+        style.fontSize = this.fontSizes[this.props.size || "md"];
+        if (this.props.align) {
+            style.textAlign = this.props.align;
+        }
+        if (this.props.color) {
+            style.color = Unifier.theme[this.props.color];
+        }
+        else {
+            style.color = Unifier.theme.darkGray;
+        }
+        // TODO: might be useful for wrapping/truncating
+        // if (this.props.numberOfLines !== 1 && !this.props.inline) {
+        //   style.flexWrap = "wrap";
+        // }
+        return style;
+    }
+    render() {
+        let lines = 0;
+        if (this.props.numberOfLines) {
+            lines = this.props.numberOfLines;
+        }
+        else if (this.props.inline) {
+            lines = 1;
+        }
+        const inner = (React.createElement(NativeText, { numberOfLines: lines, style: this.propsToStyle() }, this.props.children));
+        if (this.props.skipLinking) {
+            return inner;
+        }
+        else {
+            return (
+            // <Hyperlink linkDefault={true} linkStyle={{textDecorationLine: "underline"}}>
+            //   {inner}
+            // </Hyperlink>
+            React.createElement(Hyperlink, { linkDefault: true }, inner));
+        }
+    }
+}
+//# sourceMappingURL=Text.js.map

package/dist/Text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.js","sourceRoot":"","sources":["../src/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,IAAI,IAAI,UAAU,EAAC,MAAM,cAAc,CAAC;AAChD,OAAO,SAAS,MAAM,wBAAwB,CAAC;AAG/C,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAElC,MAAM,OAAO,IAAK,SAAQ,KAAK,CAAC,SAAwB;IAAxD;;QACE,cAAS,GAAG;YACV,EAAE,EAAE,EAAE;YACN,EAAE,EAAE,EAAE;YACN,EAAE,EAAE,EAAE;SACP,CAAC;IA+EJ,CAAC;IA7EC,YAAY;QACV,MAAM,KAAK,GAAQ,EAAE,CAAC;QAEtB,IAAI,IAAI,GAQU,aAAa,CAAC;QAChC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,SAAS,EAAE;YACjC,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,MAAM,EAAE;gBAChC,IAAI,GAAG,iBAAiB,CAAC;aAC1B;iBAAM;gBACL,IAAI,GAAG,aAAa,CAAC;aACtB;SACF;aAAM,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,WAAW,EAAE;YAC1C,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,MAAM,EAAE;gBAChC,IAAI,GAAG,mBAAmB,CAAC;aAC5B;iBAAM;gBACL,IAAI,GAAG,eAAe,CAAC;aACxB;SACF;aAAM,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,QAAQ,EAAE;YACvC,IAAI,GAAG,YAAY,CAAC;SACrB;aAAM,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE;YACtC,IAAI,GAAG,WAAW,CAAC;SACpB;aAAM,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,QAAQ,EAAE;YACvC,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,MAAM,EAAE;gBAChC,IAAI,GAAG,gBAAgB,CAAC;aACzB;iBAAM;gBACL,IAAI,GAAG,YAAY,CAAC;aACrB;SACF;QAED,KAAK,CAAC,UAAU,GAAG,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAEvC,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,IAAI,CAAC,CAAC;QACzD,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;YACpB,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;SACpC;QACD,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;YACpB,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SAC/C;aAAM;YACL,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC;SACtC;QACD,gDAAgD;QAChD,8DAA8D;QAC9D,6BAA6B;QAC7B,IAAI;QACJ,OAAO,KAAK,CAAC;IACf,CAAC;IAED,MAAM;QACJ,IAAI,KAAK,GAAG,CAAC,CAAC;QACd,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE;YAC5B,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC;SAClC;aAAM,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YAC5B,KAAK,GAAG,CAAC,CAAC;SACX;QACD,MAAM,KAAK,GAAG,CACZ,oBAAC,UAAU,IAAC,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,IACzD,IAAI,CAAC,KAAK,CAAC,QAAQ,CACT,CACd,CAAC;QACF,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE;YAC1B,OAAO,KAAK,CAAC;SACd;aAAM;YACL,OAAO;YACL,+EAA+E;YAC/E,YAAY;YACZ,eAAe;YACf,oBAAC,SAAS,IAAC,WAAW,UAAE,KAAK,CAAa,CAC3C,CAAC;SACH;IACH,CAAC;CACF"}

package/dist/Text.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Text.stories.js

@@ -0,0 +1,37 @@
+import React from "react";
+import { Box } from "./Box";
+import { Text } from "./Text";
+import { storiesOf } from "@storybook/react-native";
+import { StorybookContainer } from "./StorybookContainer";
+function renderText(text, props) {
+    return (React.createElement(Box, { width: "100%", paddingY: 1 },
+        React.createElement(Text, Object.assign({}, props), text)));
+}
+storiesOf("Text", module)
+    .add("Texts", () => (React.createElement(StorybookContainer, null,
+    React.createElement(Box, { width: "100%", height: "100%", display: "flex", direction: "column" },
+        renderText("default", {}),
+        renderText("small", { size: "sm" }),
+        renderText("large", { size: "lg" }),
+        renderText("gray", { color: "gray" }),
+        renderText("lightGray", { color: "lightGray" }),
+        renderText("primary", { color: "primary" }),
+        renderText("secondary", { color: "secondary" }),
+        renderText("tertiary", { color: "tertiary" }),
+        renderText("accent", { color: "accent" }),
+        renderText("red", { color: "red" }),
+        renderText("bold", { weight: "bold" }),
+        renderText("italic", { italic: true }),
+        renderText("center", { align: "center" })))))
+    .add("Truncate", () => (React.createElement(StorybookContainer, null,
+    React.createElement(Box, { maxWidth: 160 },
+        React.createElement(Box, { marginBottom: 2 },
+            React.createElement(Text, { weight: "bold" }, "normal:"),
+            React.createElement(Text, { overflow: "normal" }, "This is a long and Supercalifragilisticexpialidocious sentence. \u6B21\u306E\u5358\u8A9E\u30B0\u30EC\u30FC\u30C8\u30D6\u30EA\u30C6\u30F3\u304A\u3088\u3073\u5317\u30A2\u30A4\u30EB\u30E9\u30F3\u30C9\u9023\u5408\u738B\u56FD\u3067\u672C\u5F53\u306B\u5927\u304D\u306A\u8A00\u8449'")),
+        React.createElement(Box, { marginBottom: 2 },
+            React.createElement(Text, { weight: "bold" }, "breakWord:"),
+            React.createElement(Text, { overflow: "breakWord" }, "This is a long and Supercalifragilisticexpialidocious sentence. \u6B21\u306E\u5358\u8A9E\u30B0\u30EC\u30FC\u30C8\u30D6\u30EA\u30C6\u30F3\u304A\u3088\u3073\u5317\u30A2\u30A4\u30EB\u30E9\u30F3\u30C9\u9023\u5408\u738B\u56FD\u3067\u672C\u5F53\u306B\u5927\u304D\u306A\u8A00\u8449 \uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57'")),
+        React.createElement(Box, { marginBottom: 2 },
+            React.createElement(Text, { weight: "bold" }, "truncate:"),
+            React.createElement(Text, { truncate: true }, "This is a long and Supercalifragilisticexpialidocious sentence. \u6B21\u306E\u5358\u8A9E\u30B0\u30EC\u30FC\u30C8\u30D6\u30EA\u30C6\u30F3\u304A\u3088\u3073\u5317\u30A2\u30A4\u30EB\u30E9\u30F3\u30C9\u9023\u5408\u738B\u56FD\u3067\u672C\u5F53\u306B\u5927\u304D\u306A\u8A00\u8449 \uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57\uFF57'"))))));
+//# sourceMappingURL=Text.stories.js.map

package/dist/Text.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.stories.js","sourceRoot":"","sources":["../unifier/Text.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAE5B,OAAO,EAAC,SAAS,EAAC,MAAM,yBAAyB,CAAC;AAClD,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AACxD,SAAS,UAAU,CAAC,IAAY,EAAE,KAAyB;IACzD,OAAO,CACL,oBAAC,GAAG,IAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAE,CAAC;QAC3B,oBAAC,IAAI,oBAAK,KAAK,GAAG,IAAI,CAAQ,CAC1B,CACP,CAAC;AACJ,CAAC;AACD,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC;KACtB,GAAG,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,CAClB,oBAAC,kBAAkB;IACjB,oBAAC,GAAG,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,QAAQ;QAC9D,UAAU,CAAC,SAAS,EAAE,EAAE,CAAC;QACzB,UAAU,CAAC,OAAO,EAAE,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC;QACjC,UAAU,CAAC,OAAO,EAAE,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC;QACjC,UAAU,CAAC,MAAM,EAAE,EAAC,KAAK,EAAE,MAAM,EAAC,CAAC;QACnC,UAAU,CAAC,WAAW,EAAE,EAAC,KAAK,EAAE,WAAW,EAAC,CAAC;QAC7C,UAAU,CAAC,SAAS,EAAE,EAAC,KAAK,EAAE,SAAS,EAAC,CAAC;QACzC,UAAU,CAAC,WAAW,EAAE,EAAC,KAAK,EAAE,WAAW,EAAC,CAAC;QAC7C,UAAU,CAAC,UAAU,EAAE,EAAC,KAAK,EAAE,UAAU,EAAC,CAAC;QAC3C,UAAU,CAAC,QAAQ,EAAE,EAAC,KAAK,EAAE,QAAQ,EAAC,CAAC;QACvC,UAAU,CAAC,KAAK,EAAE,EAAC,KAAK,EAAE,KAAK,EAAC,CAAC;QACjC,UAAU,CAAC,MAAM,EAAE,EAAC,MAAM,EAAE,MAAM,EAAC,CAAC;QACpC,UAAU,CAAC,QAAQ,EAAE,EAAC,MAAM,EAAE,IAAI,EAAC,CAAC;QACpC,UAAU,CAAC,QAAQ,EAAE,EAAC,KAAK,EAAE,QAAQ,EAAC,CAAC,CACpC,CACa,CACtB,CAAC;KACD,GAAG,CAAC,UAAU,EAAE,GAAG,EAAE,CAAC,CACrB,oBAAC,kBAAkB;IACjB,oBAAC,GAAG,IAAC,QAAQ,EAAE,GAAG;QAChB,oBAAC,GAAG,IAAC,YAAY,EAAE,CAAC;YAClB,oBAAC,IAAI,IAAC,MAAM,EAAC,MAAM,cAAe;YAClC,oBAAC,IAAI,IAAC,QAAQ,EAAC,QAAQ,0RAGhB,CACH;QACN,oBAAC,GAAG,IAAC,YAAY,EAAE,CAAC;YAClB,oBAAC,IAAI,IAAC,MAAM,EAAC,MAAM,iBAAkB;YACrC,oBAAC,IAAI,IAAC,QAAQ,EAAC,WAAW,ubAInB,CACH;QACN,oBAAC,GAAG,IAAC,YAAY,EAAE,CAAC;YAClB,oBAAC,IAAI,IAAC,MAAM,EAAC,MAAM,gBAAiB;YACpC,oBAAC,IAAI,IAAC,QAAQ,EAAE,IAAI,ubAIb,CACH,CACF,CACa,CACtB,CAAC,CAAC"}

package/dist/TextArea.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { TextAreaProps } from "./Common";
+export declare class TextArea extends React.Component<TextAreaProps, {}> {
+    constructor(props: TextAreaProps);
+    render(): JSX.Element;
+}

package/dist/TextArea.js

@@ -0,0 +1,12 @@
+import React from "react";
+import { TextField } from "./TextField";
+export class TextArea extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {};
+    }
+    render() {
+        return React.createElement(TextField, Object.assign({}, this.props, { height: 100, multiline: true, rows: 4 }));
+    }
+}
+//# sourceMappingURL=TextArea.js.map

package/dist/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../src/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAEtC,MAAM,OAAO,QAAS,SAAQ,KAAK,CAAC,SAA4B;IAC9D,YAAY,KAAoB;QAC9B,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;IAClB,CAAC;IAED,MAAM;QACJ,OAAO,oBAAC,SAAS,oBAAK,IAAI,CAAC,KAAK,IAAE,MAAM,EAAE,GAAG,EAAE,SAAS,QAAC,IAAI,EAAE,CAAC,IAAI,CAAC;IACvE,CAAC;CACF"}

package/dist/TextArea.stories.d.ts

@@ -0,0 +1,10 @@
+import { TextArea } from "./TextArea";
+declare const _default: {
+    title: string;
+    component: typeof TextArea;
+};
+export default _default;
+export declare const TextAreas: () => JSX.Element;
+export declare const WithLabelTextArea: () => JSX.Element;
+export declare const TextAreaDisabled: () => JSX.Element;
+export declare const TextAreaErrored: () => JSX.Element;

package/dist/TextArea.stories.js

@@ -0,0 +1,24 @@
+import React from "react";
+import { TextArea } from "./TextArea";
+import { StorybookContainer } from "./StorybookContainer";
+export default {
+    title: "TextArea",
+    component: TextArea,
+};
+export const TextAreas = () => {
+    return (React.createElement(StorybookContainer, null,
+        React.createElement(TextArea, { id: "none", onChange: () => { }, placeholder: "Here's some placeholder text." })));
+};
+export const WithLabelTextArea = () => {
+    return (React.createElement(StorybookContainer, null,
+        React.createElement(TextArea, { label: "Enter a bunch of text", helperText: "And some subtext", id: "none", onChange: () => { } })));
+};
+export const TextAreaDisabled = () => {
+    return (React.createElement(StorybookContainer, null,
+        React.createElement(TextArea, { id: "none", onChange: () => { }, disabled: true, placeholder: "This is disabled" })));
+};
+export const TextAreaErrored = () => {
+    return (React.createElement(StorybookContainer, null,
+        React.createElement(TextArea, { label: "Enter a bunch of text", helperText: "And some subtext", errorMessage: "There's been an error", id: "none", onChange: () => { } })));
+};
+//# sourceMappingURL=TextArea.stories.js.map

package/dist/TextArea.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.stories.js","sourceRoot":"","sources":["../unifier/TextArea.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,QAAQ,EAAC,MAAM,YAAY,CAAC;AACpC,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AAExD,eAAe;IACb,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,QAAQ;CACpB,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,OAAO,CACL,oBAAC,kBAAkB;QACjB,oBAAC,QAAQ,IAAC,EAAE,EAAC,MAAM,EAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,WAAW,EAAC,+BAA+B,GAAG,CACnE,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,OAAO,CACL,oBAAC,kBAAkB;QACjB,oBAAC,QAAQ,IACP,KAAK,EAAC,uBAAuB,EAC7B,UAAU,EAAC,kBAAkB,EAC7B,EAAE,EAAC,MAAM,EACT,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,GAClB,CACiB,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,OAAO,CACL,oBAAC,kBAAkB;QACjB,oBAAC,QAAQ,IAAC,EAAE,EAAC,MAAM,EAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAC,kBAAkB,GAAG,CACtE,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE;IAClC,OAAO,CACL,oBAAC,kBAAkB;QACjB,oBAAC,QAAQ,IACP,KAAK,EAAC,uBAAuB,EAC7B,UAAU,EAAC,kBAAkB,EAC7B,YAAY,EAAC,uBAAuB,EACpC,EAAE,EAAC,MAAM,EACT,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,GAClB,CACiB,CACtB,CAAC;AACJ,CAAC,CAAC"}

package/dist/TextField.d.ts

@@ -0,0 +1,48 @@
+import React from "react";
+import { TextFieldProps } from "./Common";
+interface TextFieldState {
+    focused: boolean;
+    height: number;
+}
+export declare class TextField extends React.Component<TextFieldProps, TextFieldState> {
+    dateActionSheetRef: React.RefObject<any>;
+    numberRangeActionSheetRef: React.RefObject<any>;
+    decimalRangeActionSheetRef: React.RefObject<any>;
+    weightActionSheetRef: React.RefObject<any>;
+    constructor(props: TextFieldProps);
+    keyboardMap: {
+        date: string;
+        email: string;
+        number: string;
+        numberRange: string;
+        decimalRange: string;
+        decimal: string;
+        height: string;
+        password: string;
+        search: string;
+        text: string;
+        url: string | undefined;
+        username: string;
+    };
+    textContentMap: {
+        date: string;
+        email: string;
+        number: string;
+        decimal: string;
+        decimalRange: string;
+        height: string;
+        password: string;
+        search: string;
+        text: string;
+        url: string | undefined;
+        username: string;
+    };
+    renderIcon(): JSX.Element | null;
+    getBorderColor: () => string;
+    getHeight: () => number | "100%";
+    focus(): void;
+    isEditable(): boolean;
+    isHandledByModal: () => boolean;
+    render(): JSX.Element;
+}
+export {};

package/dist/TextField.js

@@ -0,0 +1,207 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import moment from "moment-timezone";
+import React from "react";
+import { ActivityIndicator, Platform, TextInput, View } from "react-native";
+import { Box } from "./Box";
+import { DateTimeActionSheet } from "./DateTimeActionSheet";
+import { DecimalRangeActionSheet } from "./DecimalRangeActionSheet";
+import { HeightActionSheet } from "./HeightActionSheet";
+import { Icon } from "./Icon";
+import { NumberPickerActionSheet } from "./NumberPickerActionSheet";
+import { Unifier } from "./Unifier";
+import { WithLabel } from "./WithLabel";
+export class TextField extends React.Component {
+    constructor(props) {
+        super(props);
+        this.dateActionSheetRef = React.createRef();
+        this.numberRangeActionSheetRef = React.createRef();
+        this.decimalRangeActionSheetRef = React.createRef();
+        this.weightActionSheetRef = React.createRef();
+        this.keyboardMap = {
+            date: "default",
+            email: "email-address",
+            number: "number-pad",
+            numberRange: "number-pad",
+            decimalRange: "decimal-pad",
+            decimal: "decimal-pad",
+            height: "default",
+            password: "default",
+            search: "default",
+            text: "default",
+            url: Platform.select({
+                ios: "url",
+                android: "default",
+            }),
+            username: "default",
+        };
+        this.textContentMap = {
+            date: "none",
+            email: "emailAddress",
+            number: "none",
+            decimal: "none",
+            decimalRange: "none",
+            height: "none",
+            password: "password",
+            search: "none",
+            text: "none",
+            url: Platform.select({
+                ios: "URL",
+                android: "none",
+            }),
+            username: "username",
+        };
+        this.getBorderColor = () => {
+            if (this.props.errorMessage) {
+                return Unifier.theme.red;
+            }
+            else if (this.state.focused) {
+                return Unifier.theme.blue;
+            }
+            else {
+                return Unifier.theme.gray;
+            }
+        };
+        this.getHeight = () => {
+            if (this.props.grow) {
+                return Math.max(40, this.state.height);
+            }
+            else if (this.props.multiline) {
+                return this.props.height || "100%";
+            }
+            else {
+                return 40;
+            }
+        };
+        this.isHandledByModal = () => {
+            return (this.props.type === "date" ||
+                this.props.type === "numberRange" ||
+                this.props.type === "decimalRange" ||
+                this.props.type === "height");
+        };
+        this.state = { focused: false, height: props.height || 40 };
+    }
+    renderIcon() {
+        if (this.props.type !== "search") {
+            return null;
+        }
+        if (this.props.searching === true) {
+            return (React.createElement(Box, { marginRight: 4 },
+                React.createElement(ActivityIndicator, { color: Unifier.theme.primary, size: "small" })));
+        }
+        else {
+            return (React.createElement(Box, { marginRight: 2 },
+                React.createElement(Icon, { name: "search", prefix: "far", size: 14 })));
+        }
+    }
+    focus() {
+        // Empty
+    }
+    isEditable() {
+        return !this.props.disabled && !this.isHandledByModal();
+    }
+    render() {
+        const type = this.props.type || "text";
+        const keyboardType = this.keyboardMap[type];
+        // let textContentType = this.textContentMap[this.props.type || "text"];
+        const _a = this.props, { errorMessage } = _a, props = __rest(_a, ["errorMessage"]);
+        let value = this.props.value;
+        if (this.props.type === "date") {
+            value = moment(this.props.value).format("MM/DD/YYYY");
+        }
+        else if (this.props.type === "height") {
+            value = `${Math.floor(Number(this.props.value) / 12)} ft, ${Number(this.props.value) % 12} in`;
+        }
+        return (React.createElement(React.Fragment, null,
+            React.createElement(WithLabel, { label: errorMessage, labelColor: this.props.errorMessageColor || "red", labelPlacement: "after", labelSize: "sm" },
+                React.createElement(WithLabel, Object.assign({}, props),
+                    React.createElement(View, { style: {
+                            flexDirection: "row",
+                            justifyContent: "center",
+                            alignItems: "center",
+                            // height: 40,
+                            // minHeight: this.getHeight(),
+                            minHeight: this.getHeight(),
+                            width: "100%",
+                            // Add padding so the border doesn't mess up layouts
+                            paddingHorizontal: this.props.paddingX || this.state.focused ? 10 : 14,
+                            paddingVertical: this.props.paddingY || this.state.focused ? 0 : 4,
+                            borderColor: this.getBorderColor(),
+                            borderWidth: this.state.focused && !this.props.errorMessage ? 5 : 1,
+                            borderRadius: 16,
+                            backgroundColor: this.props.disabled ? Unifier.theme.gray : Unifier.theme.white,
+                            overflow: "hidden",
+                        }, onTouchEnd: () => {
+                            var _a, _b, _c, _d, _e, _f, _g, _h;
+                            if (this.props.type === "date") {
+                                (_b = (_a = this.dateActionSheetRef) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.setModalVisible(true);
+                            }
+                            else if (this.props.type === "numberRange") {
+                                (_d = (_c = this.numberRangeActionSheetRef) === null || _c === void 0 ? void 0 : _c.current) === null || _d === void 0 ? void 0 : _d.setModalVisible(true);
+                            }
+                            else if (this.props.type === "decimalRange") {
+                                (_f = (_e = this.decimalRangeActionSheetRef) === null || _e === void 0 ? void 0 : _e.current) === null || _f === void 0 ? void 0 : _f.setModalVisible(true);
+                            }
+                            else if (this.props.type === "height") {
+                                (_h = (_g = this.weightActionSheetRef) === null || _g === void 0 ? void 0 : _g.current) === null || _h === void 0 ? void 0 : _h.setModalVisible(true);
+                            }
+                        } },
+                        this.renderIcon(),
+                        React.createElement(TextInput, { ref: (ref) => {
+                                if (this.props.inputRef) {
+                                    this.props.inputRef(ref);
+                                }
+                            }, autoCapitalize: type === "text" ? "sentences" : "none", autoFocus: this.props.autoFocus, blurOnSubmit: true, 
+                            // TODO: uncomment with upgrade to React 0.56.
+                            // textContentType={textContentType}
+                            editable: this.isEditable(), keyboardType: keyboardType, multiline: this.props.multiline, numberOfLines: this.props.rows || 4, placeholder: this.props.placeholder, placeholderTextColor: Unifier.theme.gray, returnKeyType: type === "number" || type === "decimal" ? "done" : this.props.returnKeyType, secureTextEntry: type === "password", 
+                            // For react-native-autofocus
+                            style: Object.assign({ flex: 1, paddingTop: 10, paddingRight: 10, paddingBottom: 10, paddingLeft: 0, height: this.getHeight(), width: "100%", color: Unifier.theme.darkGray, fontFamily: Unifier.theme.primaryFont, 
+                                // Remove border in web.
+                                outlineWidth: 0 }, this.props.style), underlineColorAndroid: "transparent", value: value, onBlur: () => {
+                                if (!this.isHandledByModal()) {
+                                    this.setState({ focused: false });
+                                }
+                                if (this.props.onBlur && this.props.value) {
+                                    this.props.onBlur({ value: this.props.value });
+                                }
+                                // if (this.props.type === "date") {
+                                //   this.actionSheetRef?.current?.setModalVisible(false);
+                                // }
+                            }, onChangeText: (text) => {
+                                this.props.onChange({ value: text });
+                            }, onContentSizeChange: (event) => {
+                                if (!this.props.grow) {
+                                    return;
+                                }
+                                this.setState({ height: event.nativeEvent.contentSize.height });
+                            }, onFocus: () => {
+                                if (!this.isHandledByModal()) {
+                                    this.setState({ focused: true });
+                                }
+                            }, onSubmitEditing: () => {
+                                if (this.props.onEnter) {
+                                    this.props.onEnter();
+                                }
+                                if (this.props.onSubmitEditing) {
+                                    this.props.onSubmitEditing();
+                                }
+                            } })))),
+            this.props.type === "date" && (React.createElement(DateTimeActionSheet, { actionSheetRef: this.dateActionSheetRef, mode: "date", value: this.props.value, onChange: (result) => this.props.onChange(result) })),
+            this.props.type === "numberRange" && this.props.value && (React.createElement(NumberPickerActionSheet, { actionSheetRef: this.numberRangeActionSheetRef, max: this.props.max || (this.props.min || 0) + 100, min: this.props.min || 0, value: this.props.value, onChange: (result) => this.props.onChange(result) })),
+            this.props.type === "decimalRange" && this.props.value && (React.createElement(DecimalRangeActionSheet, { actionSheetRef: this.decimalRangeActionSheetRef, max: this.props.max || (this.props.min || 0) + 100, min: this.props.min || 0, value: this.props.value, onChange: (result) => this.props.onChange(result) })),
+            this.props.type === "height" && (React.createElement(HeightActionSheet, { actionSheetRef: this.weightActionSheetRef, value: this.props.value, onChange: (result) => {
+                    this.props.onChange(result);
+                } }))));
+    }
+}
+//# sourceMappingURL=TextField.js.map