@trilogy-ds/react 0.0.1-alpha-prompt

package/lib/components/title/TitleEnum.d.ts

@@ -0,0 +1,27 @@
+/**
+ * New Title Levels
+ */
+export declare enum TitleLevels {
+    ONE = 1,
+    TWO = 2,
+    THREE = 3,
+    FOUR = 4,
+    FIVE = 5,
+    SIX = 6
+}
+/**
+ * Titles size values
+ */
+export type TitleLevelValues = TitleLevels;
+export declare enum TitleMarkup {
+    H1 = "h1",
+    H2 = "h2",
+    H3 = "h3",
+    H4 = "h4",
+    H5 = "h5",
+    H6 = "h6",
+    P = "p",
+    SPAN = "span",
+    DIV = "div"
+}
+export type TitleMarkupValues = `${TitleMarkup}`;

package/lib/components/title/TitleEnum.js

@@ -0,0 +1,25 @@
+/**
+ * New Title Levels
+ */
+export var TitleLevels;
+(function (TitleLevels) {
+    TitleLevels[TitleLevels["ONE"] = 1] = "ONE";
+    TitleLevels[TitleLevels["TWO"] = 2] = "TWO";
+    TitleLevels[TitleLevels["THREE"] = 3] = "THREE";
+    TitleLevels[TitleLevels["FOUR"] = 4] = "FOUR";
+    TitleLevels[TitleLevels["FIVE"] = 5] = "FIVE";
+    TitleLevels[TitleLevels["SIX"] = 6] = "SIX";
+})(TitleLevels || (TitleLevels = {}));
+export var TitleMarkup;
+(function (TitleMarkup) {
+    TitleMarkup["H1"] = "h1";
+    TitleMarkup["H2"] = "h2";
+    TitleMarkup["H3"] = "h3";
+    TitleMarkup["H4"] = "h4";
+    TitleMarkup["H5"] = "h5";
+    TitleMarkup["H6"] = "h6";
+    TitleMarkup["P"] = "p";
+    TitleMarkup["SPAN"] = "span";
+    TitleMarkup["DIV"] = "div";
+})(TitleMarkup || (TitleMarkup = {}));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGl0bGVFbnVtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy90aXRsZS9UaXRsZUVudW0udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFDSCxNQUFNLENBQU4sSUFBWSxXQU9YO0FBUEQsV0FBWSxXQUFXO0lBQ3JCLDJDQUFPLENBQUE7SUFDUCwyQ0FBTyxDQUFBO0lBQ1AsK0NBQVMsQ0FBQTtJQUNULDZDQUFRLENBQUE7SUFDUiw2Q0FBUSxDQUFBO0lBQ1IsMkNBQU8sQ0FBQTtBQUNULENBQUMsRUFQVyxXQUFXLEtBQVgsV0FBVyxRQU90QjtBQU9ELE1BQU0sQ0FBTixJQUFZLFdBVVg7QUFWRCxXQUFZLFdBQVc7SUFDckIsd0JBQVMsQ0FBQTtJQUNULHdCQUFTLENBQUE7SUFDVCx3QkFBUyxDQUFBO0lBQ1Qsd0JBQVMsQ0FBQTtJQUNULHdCQUFTLENBQUE7SUFDVCx3QkFBUyxDQUFBO0lBQ1Qsc0JBQU8sQ0FBQTtJQUNQLDRCQUFhLENBQUE7SUFDYiwwQkFBVyxDQUFBO0FBQ2IsQ0FBQyxFQVZXLFdBQVcsS0FBWCxXQUFXLFFBVXRCIn0=

package/lib/components/title/TitleProps.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { Accessibility, Clickable, Dev, Invertable, Marginless, TypographyAlign, TypographyAlignValues, TypographyBold, TypographyBoldValues, TypographyColor, TypographyColorValues, TypographyTransform, TypographyTransformValues } from '../../objects';
+import { TitleLevels, TitleLevelValues, TitleMarkup, TitleMarkupValues } from './TitleEnum';
+import { CommonProps } from '../../objects/facets/CommonProps';
+import { Text } from 'react-native';
+type Styles = {
+    [key: string]: unknown;
+};
+/**
+ * Title Interface
+ */
+export interface TitleProps extends Invertable, Accessibility, Clickable, Marginless, Dev, CommonProps {
+    children?: React.ReactNode;
+    level?: TitleLevelValues | TitleLevels;
+    typo?: TypographyColor | TypographyColorValues | TypographyTransform | TypographyTransformValues | TypographyBold | TypographyBoldValues | TypographyAlign | TypographyAlignValues | Array<string> | string;
+    skeleton?: boolean;
+    markup?: TitleMarkup | TitleMarkupValues;
+    style?: Styles;
+    subtitle?: boolean;
+    overline?: boolean;
+}
+export type TitleRef = HTMLParagraphElement | HTMLHeadingElement | HTMLDivElement;
+export type TitleNativeRef = Text;
+export {};

package/lib/components/title/TitleProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGl0bGVQcm9wcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvdGl0bGUvVGl0bGVQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=

package/lib/components/title/TitlePropsDefaults.js

@@ -0,0 +1,142 @@
+export default {
+  "children": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
+    ]
+  },
+  "level": {
+    "type": "enum",
+    "values": [
+      "undefined",
+      1,
+      2,
+      3,
+      4,
+      5,
+      6
+    ]
+  },
+  "typo": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string",
+      "string[]"
+    ]
+  },
+  "skeleton": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "markup": {
+    "type": "enum",
+    "values": [
+      "undefined",
+      "p",
+      "h2",
+      "h3",
+      "h4",
+      "h5",
+      "h6",
+      "div",
+      "h1",
+      "span",
+      "h1",
+      "h2",
+      "h3",
+      "h4",
+      "h5",
+      "h6",
+      "p",
+      "span",
+      "div"
+    ]
+  },
+  "style": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "Styles"
+    ]
+  },
+  "subtitle": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "overline": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "inverted": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "accessibilityLabel": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "onClick": {
+    "type": "function",
+    "values": [
+      "undefined",
+      "ClickEvent"
+    ]
+  },
+  "marginless": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "testId": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "id": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "className": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  }
+};

package/lib/components/title/index.d.ts

@@ -0,0 +1,3 @@
+import Title from './Title';
+export * from './TitleEnum';
+export { Title };

package/lib/components/title/index.js

@@ -0,0 +1,4 @@
+import Title from './Title';
+export * from './TitleEnum';
+export { Title };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3RpdGxlL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLFNBQVMsQ0FBQTtBQUUzQixjQUFjLGFBQWEsQ0FBQTtBQUMzQixPQUFPLEVBQUUsS0FBSyxFQUFFLENBQUEifQ==

package/lib/components/view/View.d.ts

@@ -0,0 +1,24 @@
+import * as React from "react";
+import { ViewProps } from "./ViewProps";
+/**
+ * View Component (DIV EQUIVALENT)
+ * @param children {ReactNode} View child
+ * @param flexable {boolean} Flexable view
+ * @param style {CSSProperties} View custom style
+ * @param onClick {Function} Click Event
+ * @param backgroundColor {TrilogyColor} View backgroud color
+ * @param backgroundSrc {string} View backgroud image source
+ * @param id {string} Id for Web / TestID for Native
+ * @param fullwidth {boolean} true by default
+ * @param justify {JustifiableProps.justify?} Justifiable | "JUSTIFIED_CENTER" | "JUSTIFIED_START" | "JUSTIFIED_END" | "SPACE_BETWEEN" | undefined
+ * @param align {AlignableProps.center?} AlignableProps | "ALIGNED_CENTER" | "ALIGNED_START" | "ALIGNED_END" | "ALIGNED_STRETCH" | undefined
+ * - ------------------ WEB PROPERTIES ---------------
+ * @param className {string} Additional css classes
+ * @param loading {Loading} Loading View
+ * @param markup {ViewMarkup} Markup for View
+ * @param inverted {boolean} Inverted View Color
+ * - ------------------ NATIVE PROPERTIES ------------
+ * @param bottom {boolean} Bottom position
+ */
+declare const View: React.ForwardRefExoticComponent<ViewProps & React.RefAttributes<any>>;
+export default View;

package/lib/components/view/View.js

@@ -0,0 +1,48 @@
+import { __assign, __rest } from "tslib";
+import * as React from "react";
+import { ViewMarkup } from "./ViewProps";
+import clsx from "clsx";
+import { has, is } from "../../services";
+import { getLoadingClassName, getJustifyClassName, getAlignClassName, getBackgroundClassName, } from "../../objects";
+import { hashClass } from "../../helpers";
+import { useTrilogyContext } from "../../context";
+/**
+ * View Component (DIV EQUIVALENT)
+ * @param children {ReactNode} View child
+ * @param flexable {boolean} Flexable view
+ * @param style {CSSProperties} View custom style
+ * @param onClick {Function} Click Event
+ * @param backgroundColor {TrilogyColor} View backgroud color
+ * @param backgroundSrc {string} View backgroud image source
+ * @param id {string} Id for Web / TestID for Native
+ * @param fullwidth {boolean} true by default
+ * @param justify {JustifiableProps.justify?} Justifiable | "JUSTIFIED_CENTER" | "JUSTIFIED_START" | "JUSTIFIED_END" | "SPACE_BETWEEN" | undefined
+ * @param align {AlignableProps.center?} AlignableProps | "ALIGNED_CENTER" | "ALIGNED_START" | "ALIGNED_END" | "ALIGNED_STRETCH" | undefined
+ * - ------------------ WEB PROPERTIES ---------------
+ * @param className {string} Additional css classes
+ * @param loading {Loading} Loading View
+ * @param markup {ViewMarkup} Markup for View
+ * @param inverted {boolean} Inverted View Color
+ * - ------------------ NATIVE PROPERTIES ------------
+ * @param bottom {boolean} Bottom position
+ */
+var View = React.forwardRef(function (_a, ref) {
+    var children = _a.children, style = _a.style, className = _a.className, loading = _a.loading, onClick = _a.onClick, backgroundColor = _a.backgroundColor, backgroundSrc = _a.backgroundSrc, inverted = _a.inverted, _b = _a.fullwidth, fullwidth = _b === void 0 ? true : _b, markup = _a.markup, flexable = _a.flexable, justify = _a.justify, align = _a.align, others = __rest(_a, ["children", "style", "className", "loading", "onClick", "backgroundColor", "backgroundSrc", "inverted", "fullwidth", "markup", "flexable", "justify", "align"]);
+    var styled = useTrilogyContext().styled;
+    var isCorrectMarkup = function (stringMarkup) {
+        if (stringMarkup in ViewMarkup ||
+            Object.values(ViewMarkup).includes(stringMarkup))
+            return true;
+    };
+    var Tag = markup && isCorrectMarkup(markup) ? markup : "div";
+    var classes = hashClass(styled, clsx(typeof loading === "string" && is(getLoadingClassName(loading)), typeof loading === "boolean" ? is("loading") : is("loaded"), backgroundColor && has(getBackgroundClassName(backgroundColor)), backgroundSrc && has('background'), inverted && is('inverted') || is('base'), fullwidth && is("fullwidth"), flexable && is("flex"), typeof justify === "string" && is(getJustifyClassName(justify)), typeof align === "string" && is(getAlignClassName(align)), className));
+    return (React.createElement(Tag, __assign({ ref: ref, onClick: onClick, style: style, className: classes }, (backgroundSrc && {
+        style: {
+            backgroundImage: "url(".concat(backgroundSrc, ")"),
+            backgroundSize: "cover",
+            backgroundPosition: "50%",
+        },
+    }), others), children));
+});
+export default View;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVmlldy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvdmlldy9WaWV3LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLFVBQVUsRUFBd0MsTUFBTSxhQUFhLENBQUE7QUFDOUUsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sRUFDTCxtQkFBbUIsRUFDbkIsbUJBQW1CLEVBQ25CLGlCQUFpQixFQUFFLHNCQUFzQixHQUMxQyxNQUFNLFdBQVcsQ0FBQTtBQUNsQixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUU3Qzs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1CRztBQUNILElBQU0sSUFBSSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQXFCLFVBQUMsRUFlbEQsRUFBRSxHQUFHO0lBZEosSUFBQSxRQUFRLGNBQUEsRUFDUixLQUFLLFdBQUEsRUFDTCxTQUFTLGVBQUEsRUFDVCxPQUFPLGFBQUEsRUFDUCxPQUFPLGFBQUEsRUFDUCxlQUFlLHFCQUFBLEVBQ2YsYUFBYSxtQkFBQSxFQUNiLFFBQVEsY0FBQSxFQUNSLGlCQUFnQixFQUFoQixTQUFTLG1CQUFHLElBQUksS0FBQSxFQUNoQixNQUFNLFlBQUEsRUFDTixRQUFRLGNBQUEsRUFDUixPQUFPLGFBQUEsRUFDUCxLQUFLLFdBQUEsRUFDRixNQUFNLGNBZHdDLCtKQWVsRCxDQURVO0lBRUQsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFdEMsSUFBTSxlQUFlLEdBQUcsVUFBQyxZQUEyQztRQUNsRSxJQUNFLFlBQVksSUFBSSxVQUFVO1lBQzFCLE1BQU0sQ0FBQyxNQUFNLENBQUMsVUFBVSxDQUFDLENBQUMsUUFBUSxDQUFDLFlBQTBCLENBQUM7WUFFOUQsT0FBTyxJQUFJLENBQUE7SUFDZixDQUFDLENBQUE7SUFFRCxJQUFNLEdBQUcsR0FBUSxNQUFNLElBQUksZUFBZSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQTtJQUVuRSxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLE1BQU0sRUFDTixJQUFJLENBQ0YsT0FBTyxPQUFPLEtBQUssUUFBUSxJQUFJLEVBQUUsQ0FBQyxtQkFBbUIsQ0FBQyxPQUFPLENBQUMsQ0FBQyxFQUMvRCxPQUFPLE9BQU8sS0FBSyxTQUFTLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLFFBQVEsQ0FBQyxFQUMzRCxlQUFlLElBQUksR0FBRyxDQUFDLHNCQUFzQixDQUFDLGVBQWUsQ0FBQyxDQUFDLEVBQy9ELGFBQWEsSUFBSSxHQUFHLENBQUMsWUFBWSxDQUFDLEVBQ2xDLFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLElBQUksRUFBRSxDQUFDLE1BQU0sQ0FBQyxFQUN4QyxTQUFTLElBQUksRUFBRSxDQUFDLFdBQVcsQ0FBQyxFQUM1QixRQUFRLElBQUksRUFBRSxDQUFDLE1BQU0sQ0FBQyxFQUN0QixPQUFPLE9BQU8sS0FBSyxRQUFRLElBQUksRUFBRSxDQUFDLG1CQUFtQixDQUFDLE9BQU8sQ0FBQyxDQUFDLEVBQy9ELE9BQU8sS0FBSyxLQUFLLFFBQVEsSUFBSSxFQUFFLENBQUMsaUJBQWlCLENBQUMsS0FBSyxDQUFDLENBQUMsRUFDekQsU0FBUyxDQUNWLENBQ0YsQ0FBQTtJQUVELE9BQU8sQ0FDTCxvQkFBQyxHQUFHLGFBQ0YsR0FBRyxFQUFFLEdBQUcsRUFDUixPQUFPLEVBQUUsT0FBTyxFQUNoQixLQUFLLEVBQUUsS0FBSyxFQUNaLFNBQVMsRUFBRSxPQUFPLElBQ2QsQ0FBQyxhQUFhLElBQUk7UUFDcEIsS0FBSyxFQUFFO1lBQ0wsZUFBZSxFQUFFLGNBQU8sYUFBYSxNQUFHO1lBQ3hDLGNBQWMsRUFBRSxPQUFPO1lBQ3ZCLGtCQUFrQixFQUFFLEtBQUs7U0FDMUI7S0FDRixDQUFDLEVBQ0UsTUFBTSxHQUVULFFBQVEsQ0FDTCxDQUNQLENBQUE7QUFDSCxDQUFDLENBQUMsQ0FBQTtBQUVGLGVBQWUsSUFBSSxDQUFBIn0=

package/lib/components/view/View.native.d.ts

@@ -0,0 +1,18 @@
+import * as React from "react";
+import { ViewProps } from "./ViewProps";
+/**
+ * View Component (DIV EQUIVALENT)
+ * @param children {ReactNode} View child
+ * @param flexable {boolean} Flexable view
+ * @param style {CSSProperties} View custom style
+ * @param onClick {Function} Click Event
+ * @param backgroundColor {TrilogyColor} View backgroud color
+ * @param backgroundSrc {string} View backgroud image source
+ * @param id {string} Id for Web / TestID for Native
+ * @param fullwidth {boolean} true by default
+ * @param justify {JustifiableProps.justify?} Justifiable | "JUSTIFIED_CENTER" | "JUSTIFIED_START" | "JUSTIFIED_END" | "SPACE_BETWEEN" | undefined
+ * @param align {AlignableProps.center?} AlignableProps | "ALIGNED_CENTER" | "ALIGNED_START" | "ALIGNED_END" | undefined
+ * @param bottom {boolean} Bottom position
+ */
+declare const View: React.ForwardRefExoticComponent<ViewProps & React.RefAttributes<any>>;
+export default View;

package/lib/components/view/View.native.js

@@ -0,0 +1,51 @@
+import { __assign, __rest } from "tslib";
+import * as React from "react";
+import { ImageBackground, StyleSheet, TouchableOpacity, View as ViewNative, } from "react-native";
+import { getAlignStyle, getJustifyStyle } from "../../objects";
+import { getColorStyle } from "../../objects/facets/Color";
+import { ComponentName } from "../../components/enumsComponentsName";
+/**
+ * View Component (DIV EQUIVALENT)
+ * @param children {ReactNode} View child
+ * @param flexable {boolean} Flexable view
+ * @param style {CSSProperties} View custom style
+ * @param onClick {Function} Click Event
+ * @param backgroundColor {TrilogyColor} View backgroud color
+ * @param backgroundSrc {string} View backgroud image source
+ * @param id {string} Id for Web / TestID for Native
+ * @param fullwidth {boolean} true by default
+ * @param justify {JustifiableProps.justify?} Justifiable | "JUSTIFIED_CENTER" | "JUSTIFIED_START" | "JUSTIFIED_END" | "SPACE_BETWEEN" | undefined
+ * @param align {AlignableProps.center?} AlignableProps | "ALIGNED_CENTER" | "ALIGNED_START" | "ALIGNED_END" | undefined
+ * @param bottom {boolean} Bottom position
+ */
+var View = React.forwardRef(function (_a, ref) {
+    var children = _a.children, style = _a.style, onClick = _a.onClick, flexable = _a.flexable, bottom = _a.bottom, backgroundColor = _a.backgroundColor, backgroundSrc = _a.backgroundSrc, id = _a.id, justify = _a.justify, _b = _a.fullwidth, fullwidth = _b === void 0 ? true : _b, align = _a.align, others = __rest(_a, ["children", "style", "onClick", "flexable", "bottom", "backgroundColor", "backgroundSrc", "id", "justify", "fullwidth", "align"]);
+    var viewColor = (backgroundColor && getColorStyle(backgroundColor)) || "transparent";
+    var styles = StyleSheet.create({
+        view: __assign(__assign({ flex: flexable ? 1 : 0, backgroundColor: viewColor, width: fullwidth ? "100%" : "auto" }, (justify && { justifyContent: getJustifyStyle(justify) })), (align && { alignItems: getAlignStyle(align) })),
+        bottom: {
+            position: "absolute",
+            bottom: 0,
+            width: fullwidth ? "100%" : "auto",
+        },
+        sectionImage: {
+            flex: flexable ? 1 : 0,
+            width: "100%",
+            height: "auto",
+        },
+    });
+    var returnView = (React.createElement(ViewNative, __assign({ ref: ref, testID: id, nativeID: id, style: [styles.view, bottom && styles.bottom, style] }, others), children));
+    if (!children) {
+        returnView = (React.createElement(ViewNative, __assign({ ref: ref, testID: id, nativeID: id, style: [styles.view, bottom && styles.bottom, style] }, others)));
+    }
+    if (onClick) {
+        returnView = (React.createElement(ViewNative, __assign({ ref: ref, testID: id, nativeID: id, style: [styles.view, bottom && styles.bottom, style] }, others),
+            React.createElement(TouchableOpacity, { activeOpacity: 1, onPress: onClick }, children)));
+    }
+    return backgroundSrc ? (React.createElement(ImageBackground, { style: styles.sectionImage, source: typeof backgroundSrc === "number"
+            ? backgroundSrc
+            : { uri: backgroundSrc } }, returnView)) : (returnView);
+});
+View.displayName = ComponentName.View;
+export default View;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVmlldy5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3ZpZXcvVmlldy5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsZUFBZSxFQUFFLFVBQVUsRUFBRSxnQkFBZ0IsRUFBRSxJQUFJLElBQUksVUFBVSxHQUFHLE1BQU0sY0FBYyxDQUFBO0FBQ2pHLE9BQU8sRUFBRSxhQUFhLEVBQUUsZUFBZSxFQUFnQixNQUFNLFdBQVcsQ0FBQTtBQUN4RSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFFdEQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBRWhFOzs7Ozs7Ozs7Ozs7O0dBYUc7QUFDSCxJQUFNLElBQUksR0FBRyxLQUFLLENBQUMsVUFBVSxDQUEyQixVQUFDLEVBYXhELEVBQUUsR0FBRztJQVpKLElBQUEsUUFBUSxjQUFBLEVBQ1IsS0FBSyxXQUFBLEVBQ0wsT0FBTyxhQUFBLEVBQ1AsUUFBUSxjQUFBLEVBQ1IsTUFBTSxZQUFBLEVBQ04sZUFBZSxxQkFBQSxFQUNmLGFBQWEsbUJBQUEsRUFDYixFQUFFLFFBQUEsRUFDRixPQUFPLGFBQUEsRUFDUCxpQkFBZ0IsRUFBaEIsU0FBUyxtQkFBRyxJQUFJLEtBQUEsRUFDaEIsS0FBSyxXQUFBLEVBQ0YsTUFBTSxjQVo4QyxpSUFheEQsQ0FEVTtJQUVULElBQU0sU0FBUyxHQUNiLENBQUMsZUFBZSxJQUFJLGFBQWEsQ0FBQyxlQUErQixDQUFDLENBQUMsSUFBSSxhQUFhLENBQUE7SUFFdEYsSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixJQUFJLHNCQUNGLElBQUksRUFBRSxRQUFRLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUN0QixlQUFlLEVB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

package/lib/components/view/ViewEnum.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Icon Color
+ */
+export declare enum ViewColor {
+    SUCCESS = "SUCCESS",
+    ERROR = "ERROR",
+    INFO = "INFO",
+    WARNING = "WARNING",
+    TERTIARY = "TERTIARY",
+    WHITE = "WHITE"
+}
+/**
+ * Icon Color values
+ */
+export type ViewColorValues = `${ViewColor}`;
+export declare enum JustifyContent {
+    SPACE_BETWEEN = "space-between",
+    SPACE_AROUND = "space-around",
+    FLEX_START = "flex-start",
+    FLEX_END = "flex-end",
+    CENTER = "center"
+}

package/lib/components/view/ViewEnum.js

@@ -0,0 +1,21 @@
+/**
+ * Icon Color
+ */
+export var ViewColor;
+(function (ViewColor) {
+    ViewColor["SUCCESS"] = "SUCCESS";
+    ViewColor["ERROR"] = "ERROR";
+    ViewColor["INFO"] = "INFO";
+    ViewColor["WARNING"] = "WARNING";
+    ViewColor["TERTIARY"] = "TERTIARY";
+    ViewColor["WHITE"] = "WHITE";
+})(ViewColor || (ViewColor = {}));
+export var JustifyContent;
+(function (JustifyContent) {
+    JustifyContent["SPACE_BETWEEN"] = "space-between";
+    JustifyContent["SPACE_AROUND"] = "space-around";
+    JustifyContent["FLEX_START"] = "flex-start";
+    JustifyContent["FLEX_END"] = "flex-end";
+    JustifyContent["CENTER"] = "center";
+})(JustifyContent || (JustifyContent = {}));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVmlld0VudW0uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3ZpZXcvVmlld0VudW0udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFDSCxNQUFNLENBQU4sSUFBWSxTQU9YO0FBUEQsV0FBWSxTQUFTO0lBQ25CLGdDQUFtQixDQUFBO0lBQ25CLDRCQUFlLENBQUE7SUFDZiwwQkFBYSxDQUFBO0lBQ2IsZ0NBQW1CLENBQUE7SUFDbkIsa0NBQXFCLENBQUE7SUFDckIsNEJBQWUsQ0FBQTtBQUNqQixDQUFDLEVBUFcsU0FBUyxLQUFULFNBQVMsUUFPcEI7QUFPRCxNQUFNLENBQU4sSUFBWSxjQU1YO0FBTkQsV0FBWSxjQUFjO0lBQ3hCLGlEQUErQixDQUFBO0lBQy9CLCtDQUE2QixDQUFBO0lBQzdCLDJDQUF5QixDQUFBO0lBQ3pCLHVDQUFxQixDQUFBO0lBQ3JCLG1DQUFpQixDQUFBO0FBQ25CLENBQUMsRUFOVyxjQUFjLEtBQWQsY0FBYyxRQU16QiJ9

package/lib/components/view/ViewProps.d.ts

@@ -0,0 +1,40 @@
+/// <reference types="react" />
+import { Accessibility, AlignableProps, BackgroundProps, Clickable, Fullwidth, JustifiableProps, Loadable } from '../../objects';
+type Styles = {
+    [key: string]: any;
+};
+export declare enum ViewMarkup {
+    BUTTON = "button",
+    INPUT = "input",
+    A = "a",
+    SPAN = "span",
+    DIV = "div",
+    P = "p",
+    UL = "ul",
+    LI = "li",
+    LABEL = "label",
+    MAIN = "main",
+    SUMMARY = "summary",
+    DETAILS = "details",
+    OL = "ol",
+    DL = "dl",
+    DT = "dt",
+    DD = "dd",
+    DIALOG = "dialog"
+}
+export type ViewMarkupValues = `${ViewMarkup}`;
+/**
+ * View Interface
+ */
+export interface ViewProps extends Loadable, Clickable, JustifiableProps, Fullwidth, AlignableProps, BackgroundProps, Accessibility {
+    children?: React.ReactNode;
+    className?: string;
+    style?: Styles;
+    flexable?: boolean;
+    bottom?: boolean;
+    id?: string;
+    markup?: ViewMarkup | ViewMarkupValues;
+}
+export type ViewRef = any;
+export type ViewNativeRef = any;
+export {};

package/lib/components/view/ViewProps.js

@@ -0,0 +1,21 @@
+export var ViewMarkup;
+(function (ViewMarkup) {
+    ViewMarkup["BUTTON"] = "button";
+    ViewMarkup["INPUT"] = "input";
+    ViewMarkup["A"] = "a";
+    ViewMarkup["SPAN"] = "span";
+    ViewMarkup["DIV"] = "div";
+    ViewMarkup["P"] = "p";
+    ViewMarkup["UL"] = "ul";
+    ViewMarkup["LI"] = "li";
+    ViewMarkup["LABEL"] = "label";
+    ViewMarkup["MAIN"] = "main";
+    ViewMarkup["SUMMARY"] = "summary";
+    ViewMarkup["DETAILS"] = "details";
+    ViewMarkup["OL"] = "ol";
+    ViewMarkup["DL"] = "dl";
+    ViewMarkup["DT"] = "dt";
+    ViewMarkup["DD"] = "dd";
+    ViewMarkup["DIALOG"] = "dialog";
+})(ViewMarkup || (ViewMarkup = {}));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVmlld1Byb3BzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy92aWV3L1ZpZXdQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFhQSxNQUFNLENBQU4sSUFBWSxVQWtCWDtBQWxCRCxXQUFZLFVBQVU7SUFDcEIsK0JBQWlCLENBQUE7SUFDakIsNkJBQWUsQ0FBQTtJQUNmLHFCQUFPLENBQUE7SUFDUCwyQkFBYSxDQUFBO0lBQ2IseUJBQVcsQ0FBQTtJQUNYLHFCQUFPLENBQUE7SUFDUCx1QkFBUyxDQUFBO0lBQ1QsdUJBQVMsQ0FBQTtJQUNULDZCQUFlLENBQUE7SUFDZiwyQkFBYSxDQUFBO0lBQ2IsaUNBQW1CLENBQUE7SUFDbkIsaUNBQW1CLENBQUE7SUFDbkIsdUJBQVMsQ0FBQTtJQUNULHVCQUFTLENBQUE7SUFDVCx1QkFBUyxDQUFBO0lBQ1QsdUJBQVMsQ0FBQTtJQUNULCtCQUFpQixDQUFBO0FBQ25CLENBQUMsRUFsQlcsVUFBVSxLQUFWLFVBQVUsUUFrQnJCIn0=