@codeleap/mobile 1.2.1 → 1.3.0

package/dist/components/Animated.d.ts

@@ -0,0 +1,103 @@
+import React from 'react';
+declare const Components: {
+    Touchable: React.FC<import("./Touchable").TouchableProps>;
+    View: React.ForwardRefExoticComponent<Pick<import("./View").ViewProps, keyof import("react-native").ViewProps | keyof import("@codeleap/common").ComponentVariants<{
+        default: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fixed: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        block: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        flex: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        absolute: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        sticky: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        row: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        center: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        column: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        wrap: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        inline: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        inlineFlex: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        hidden: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        full: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        noWrap: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullWidth: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullHeight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullView: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullViewWidth: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullViewHeight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        whole: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        centerRow: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        listStyles: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        alignStart: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        alignEnd: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        alignCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        justifyStart: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        justifyEnd: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        justifyCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        justifySpaceBetween: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        textRight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        textLeft: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        textCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        blur: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        elevated: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        neumorphism: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        scrollX: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        scrollY: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        scrollXY: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        debRed: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        debGreen: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        debBlue: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        debYellow: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+    }, import("@codeleap/common").EnhancedTheme<any>, import("@codeleap/common").VariantProp<{
+        default: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fixed: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        block: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        flex: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        absolute: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        sticky: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        row: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        center: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        column: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        wrap: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        inline: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        inlineFlex: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        hidden: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        full: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        noWrap: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullWidth: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullHeight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullView: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullViewWidth: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        fullViewHeight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        whole: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        centerRow: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        listStyles: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        alignStart: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        alignEnd: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        alignCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        justifyStart: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        justifyEnd: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        justifyCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        justifySpaceBetween: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        textRight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        textLeft: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        textCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        blur: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        elevated: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        neumorphism: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        scrollX: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        scrollY: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        scrollXY: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        debRed: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        debGreen: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        debBlue: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+        debYellow: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<"wrapper", any>>;
+    }>> | "component" | keyof import("@codeleap/common").BaseViewProps> & React.RefAttributes<import("react-native").View>>;
+};
+declare type AnimatedComponents = typeof Components;
+declare type CP = keyof AnimatedComponents;
+declare type AnimatedProps<T extends CP, CFG = Record<string, any>> = {
+    component: T;
+    config: CFG;
+    pose: keyof CFG;
+    initialPose?: keyof CFG;
+} & Omit<Parameters<AnimatedComponents[T]>[0], 'component'>;
+export declare const Animated: <T extends "View" | "Touchable", CFG = any>({ config, component, ...props }: AnimatedProps<T, CFG>) => JSX.Element;
+export {};

package/dist/components/Animated.js

@@ -0,0 +1,55 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Animated = void 0;
+var react_1 = __importStar(require("react"));
+var react_native_pose_1 = __importDefault(require("react-native-pose"));
+var Touchable_1 = require("./Touchable");
+var View_1 = require("./View");
+var Components = {
+    Touchable: Touchable_1.Touchable,
+    View: View_1.View
+};
+var PosedComponents = Object.fromEntries(Object.entries(Components).map(function (_a) {
+    var key = _a[0], Render = _a[1];
+    return [key, (0, react_native_pose_1.default)(Render)];
+}));
+var Animated = function (_a) {
+    var config = _a.config, component = _a.component, props = __rest(_a, ["config", "component"]);
+    var Component = (0, react_1.useRef)(PosedComponents[component](config)).current;
+    return <Component {...props}/>;
+};
+exports.Animated = Animated;
+//# sourceMappingURL=Animated.js.map

package/dist/components/Animated.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Animated.js","sourceRoot":"","sources":["../../src/components/Animated.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,6CAAqC;AAErC,wEAAqC;AACrC,yCAAqC;AACrC,+BAA2B;AAC3B,IAAM,UAAU,GAAG;IACf,SAAS,uBAAA;IACT,IAAI,aAAA;CACP,CAAA;AAGD,IAAM,eAAe,GAAG,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,UAAC,EAAY;QAAX,GAAG,QAAA,EAAC,MAAM,QAAA;IAAM,OAAA,CAAC,GAAG,EAAE,IAAA,2BAAK,EAAC,MAAM,CAAC,CAAC;AAApB,CAAoB,CAAC,CAAC,CAAA;AAY3G,IAAM,QAAQ,GAAG,UAA0B,EAAkD;IAAjD,IAAA,MAAM,YAAA,EAAC,SAAS,eAAA,EAAK,KAAK,cAA3B,uBAA4B,CAAD;IAEzE,IAAM,SAAS,GAAG,IAAA,cAAM,EAAC,eAAe,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAA;IAEpE,OAAO,CAAC,SAAS,CAAC,IAAI,KAAK,CAAC,EAAG,CAAA;AACnC,CAAC,CAAA;AALY,QAAA,QAAQ,YAKpB"}

package/dist/components/Button.d.ts

@@ -11,7 +11,7 @@ export declare type ButtonProps = Omit<TouchableProps, 'variants'> & ComponentVa
     styles?: StylesOf<ButtonComposition>;
     loading?: boolean;
 };
-export declare const Button: React.ForwardRefExoticComponent<Omit<TouchableProps, "variants"> & ComponentVariants<{
+export declare const Button: React.ForwardRefExoticComponent<Pick<ButtonProps, "children" | "hitSlop" | "onLayout" | "style" | "testID" | "hasTVPreferredFocus" | "tvParallaxProperties" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "text" | "component" | keyof import("@codeleap/common").BaseViewProps | "icon" | "disabled" | "rightIcon" | "styles" | "activeOpacity" | "delayLongPress" | "delayPressIn" | "delayPressOut" | "onBlur" | "onFocus" | "onLongPress" | "onPress" | "onPressIn" | "onPressOut" | "pressRetentionOffset" | "touchSoundDisabled" | "nextFocusDown" | "nextFocusForward" | "nextFocusLeft" | "nextFocusRight" | "nextFocusUp" | "debugName" | keyof ComponentVariants<{
     default: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ButtonComposition, any>>;
     negative: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ButtonComposition, any>>;
     circle: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ButtonComposition, any>>;
@@ -107,10 +107,4 @@ export declare const Button: React.ForwardRefExoticComponent<Omit<TouchableProps
     debGreen: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ButtonComposition, any>>;
     debBlue: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ButtonComposition, any>>;
     debYellow: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ButtonComposition, any>>;
-}>> & {
-    text?: string;
-    rightIcon?: IconPlaceholder;
-    icon?: IconPlaceholder;
-    styles?: StylesOf<ButtonComposition>;
-    loading?: boolean;
-} & React.RefAttributes<TouchableOpacity>>;
+}>> | "loading"> & React.RefAttributes<TouchableOpacity>>;

package/dist/components/Button.js

@@ -50,7 +50,8 @@ exports.Button = (0, react_1.forwardRef)(function (buttonProps, ref) {
     return (<Touchable_1.Touchable style={[variantStyles.wrapper, styles.wrapper]} onPress={handlePress} ref={ref} {...props}>
       {loading && <ActivityIndicator_1.ActivityIndicator style={[variantStyles.loader, styles.loader]}/>}
       {!loading && <Icon_1.Icon name={icon} style={react_native_1.StyleSheet.flatten([variantStyles.icon, styles.icon, variantStyles.leftIcon, styles.leftIcon])}/>}
-      {children || <Text_1.Text text={text} style={[variantStyles.text, styles.text]}/>}
+      {text ? <Text_1.Text text={text} style={[variantStyles.text, styles.text]}/> : null}
+      {children}
       <Icon_1.Icon name={rightIcon} style={react_native_1.StyleSheet.flatten([variantStyles.icon, styles.icon, variantStyles.rightIcon, styles.rightIcon])}/>
     </Touchable_1.Touchable>);
 });

package/dist/components/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,2CAAyG;AACzG,+BAAmC;AAEnC,+BAA8B;AAC9B,yCAAwD;AACxD,+BAA8B;AAC9B,yDAAwD;AAExD,6CAA4D;AAa/C,QAAA,MAAM,GAAG,IAAA,kBAAU,EAAiC,UAAC,WAAW,EAAC,GAAG;IAE7E,IAAA,KAUE,WAAW,SAVA,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,KASE,WAAW,mBATU,EAAvB,kBAAkB,mBAAG,EAAE,KAAA,EACvB,QAAQ,GAQN,WAAW,SARL,EACR,IAAI,GAOF,WAAW,KAPT,EACJ,IAAI,GAMF,WAAW,KANT,EACJ,OAAO,GAKL,WAAW,QALN,EACP,KAIE,WAAW,OAJF,EAAX,MAAM,mBAAG,EAAE,KAAA,EACX,OAAO,GAGL,WAAW,QAHN,EACP,SAAS,GAEP,WAAW,UAFJ,EACN,KAAK,UACN,WAAW,EAXT,2GAWL,CADS,CACK;IAGf,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,QAAQ,EAAE;QAChD,QAAQ,UAAA;KACT,CAAC,CAAA;IAGF,SAAS,WAAW,CAAC,CAAuC;QAC1D,OAAO,IAAI,OAAO,CAAC,CAAC,CAAC,CAAA;IACvB,CAAC;IAGD,OAAO,CACL,CAAC,qBAAS,CACR,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAC/C,OAAO,CAAC,CAAC,WAAW,CAAC,CACrB,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,OAAO,IAAI,CAAC,qCAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,EAAG,CAC/E;MAAA,CAAC,CAAC,OAAO,IAAI,CAAC,WAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,yBAAU,CAAC,OAAO,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,aAAa,CAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CACvI;MAAA,CAAC,QAAQ,IAAI,CAAC,WAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,CAC1E;MAAA,CAAC,WAAI,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,yBAAU,CAAC,OAAO,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,aAAa,CAAC,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,EACjI;IAAA,EAAE,qBAAS,CAAC,CACb,CAAA;AACH,CAAC,CAAC,CAAA"}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,2CAAyG;AACzG,+BAAmC;AAEnC,+BAA8B;AAC9B,yCAAwD;AACxD,+BAA8B;AAC9B,yDAAwD;AAExD,6CAA4D;AAa/C,QAAA,MAAM,GAAG,IAAA,kBAAU,EAAiC,UAAC,WAAW,EAAC,GAAG;IAE7E,IAAA,KAUE,WAAW,SAVA,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,KASE,WAAW,mBATU,EAAvB,kBAAkB,mBAAG,EAAE,KAAA,EACvB,QAAQ,GAQN,WAAW,SARL,EACR,IAAI,GAOF,WAAW,KAPT,EACJ,IAAI,GAMF,WAAW,KANT,EACJ,OAAO,GAKL,WAAW,QALN,EACP,KAIE,WAAW,OAJF,EAAX,MAAM,mBAAG,EAAE,KAAA,EACX,OAAO,GAGL,WAAW,QAHN,EACP,SAAS,GAEP,WAAW,UAFJ,EACN,KAAK,UACN,WAAW,EAXT,2GAWL,CADS,CACK;IAGf,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,QAAQ,EAAE;QAChD,QAAQ,UAAA;KACT,CAAC,CAAA;IAGF,SAAS,WAAW,CAAC,CAAuC;QAC1D,OAAO,IAAI,OAAO,CAAC,CAAC,CAAC,CAAA;IACvB,CAAC;IAGD,OAAO,CACL,CAAC,qBAAS,CACR,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAC/C,OAAO,CAAC,CAAC,WAAW,CAAC,CACrB,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,OAAO,IAAI,CAAC,qCAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,EAAG,CAC/E;MAAA,CAAC,CAAC,OAAO,IAAI,CAAC,WAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,yBAAU,CAAC,OAAO,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,aAAa,CAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CACvI;MAAA,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,WAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAC5E;MAAA,CAAC,QAAQ,CACT;MAAA,CAAC,WAAI,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,yBAAU,CAAC,OAAO,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,aAAa,CAAC,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,EACjI;IAAA,EAAE,qBAAS,CAAC,CACb,CAAA;AACH,CAAC,CAAC,CAAA"}

package/dist/components/FileInput.d.ts

@@ -1,2 +1,19 @@
-import * as React from 'react';
-export declare const FileInput: React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;
+import React from 'react';
+import { DocumentPicker } from '../modules/documentPicker';
+import { ComponentVariants, FileInputComposition, FileInputStyles, IconPlaceholder, MobileInputFile } from '@codeleap/common';
+import { StylesOf } from '../types/utility';
+import { ButtonProps } from './Button';
+export declare type FileInputRef = {
+    openFilePicker: () => void;
+};
+export declare type FileInputProps = {
+    label?: string;
+    iconName?: IconPlaceholder;
+    styles?: StylesOf<FileInputComposition>;
+    mode: 'hidden' | 'button';
+    variants?: ComponentVariants<typeof FileInputStyles>['variants'];
+    onFileSelect(files: MobileInputFile[]): void;
+    options?: DocumentPicker.DocumentPickerOptions;
+    buttonProps?: ButtonProps;
+};
+export declare const FileInput: React.FC<FileInputProps>;

package/dist/components/FileInput.js

@@ -18,11 +18,96 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FileInput = void 0;
-var React = __importStar(require("react"));
-var react_native_1 = require("react-native");
-exports.FileInput = React.forwardRef(function () {
-    return <react_native_1.Text>Not implemented</react_native_1.Text>;
+var react_1 = __importStar(require("react"));
+var documentPicker_1 = require("../modules/documentPicker");
+var common_1 = require("@codeleap/common");
+var Button_1 = require("./Button");
+var View_1 = require("./View");
+var TextInput_1 = require("./TextInput");
+exports.FileInput = (0, react_1.forwardRef)(function (fileInputProps, ref) {
+    var _a = fileInputProps.mode, mode = _a === void 0 ? 'hidden' : _a, onFileSelect = fileInputProps.onFileSelect, iconName = fileInputProps.iconName, styles = fileInputProps.styles, label = fileInputProps.label, variants = fileInputProps.variants, options = fileInputProps.options, buttonProps = fileInputProps.buttonProps;
+    var _b = react_1.default.useState(null), file = _b[0], setFile = _b[1];
+    var logger = (0, common_1.useStyle)().logger;
+    var openFilePicker = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var files, err_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    return [4 /*yield*/, documentPicker_1.DocumentPicker.pick(options)];
+                case 1:
+                    files = _a.sent();
+                    if (!Array.isArray(files)) {
+                        files = [files];
+                    }
+                    setFile(files);
+                    onFileSelect(files.map(function (file) { return ({ preview: file, file: file }); }));
+                    return [3 /*break*/, 3];
+                case 2:
+                    err_1 = _a.sent();
+                    if (documentPicker_1.DocumentPicker.isCancel(err_1)) {
+                        logger.log('User cancelled the picker.', null, 'Component');
+                    }
+                    else {
+                        throw err_1;
+                    }
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    var variantStyles = (0, common_1.useComponentStyle)('FileInput', {
+        styles: styles,
+        variants: variants,
+    });
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        openFilePicker: openFilePicker
+    }); });
+    var filenames = file ? file.map(function (f) { return f.name; }) : '';
+    if (mode === 'button') {
+        return (<View_1.View style={variantStyles.wrapper}>
+            <TextInput_1.InputLabel label={label} style={variantStyles.label}/>
+            <Button_1.Button onPress={function () { return openFilePicker(); }} text={filenames} icon={iconName || 'fileInputButton'} variants={filenames ? '' : 'icon'} {...buttonProps}/>
+        </View_1.View>);
+    }
+    return null;
 });
 //# sourceMappingURL=FileInput.js.map

package/dist/components/FileInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileInput.js","sourceRoot":"","sources":["../../src/components/FileInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,6CAAmC;AAEtB,QAAA,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC;IACtC,OAAO,CAAC,mBAAK,AAAD,CAAE,eAAe,EAAE,mBAAI,CAAC,CAAA;AACxC,CAAC,CAAC,CAAA"}
+{"version":3,"file":"FileInput.js","sourceRoot":"","sources":["../../src/components/FileInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAsE;AACtE,4DAA0D;AAC1D,2CAAyJ;AAEzJ,mCAA8C;AAC9C,+BAA6B;AAC7B,yCAAwC;AAiB3B,QAAA,SAAS,GAA6B,IAAA,kBAAU,EAA+B,UAAC,cAAc,EAAC,GAAG;IACpG,IAAA,KAA0F,cAAc,KAAzF,EAAf,IAAI,mBAAG,QAAQ,KAAA,EAAE,YAAY,GAA6D,cAAc,aAA3E,EAAE,QAAQ,GAAmD,cAAc,SAAjE,EAAE,MAAM,GAA2C,cAAc,OAAzD,EAAE,KAAK,GAAoC,cAAc,MAAlD,EAAE,QAAQ,GAA0B,cAAc,SAAxC,EAAE,OAAO,GAAiB,cAAc,QAA/B,EAAE,WAAW,GAAI,cAAc,YAAlB,CAAkB;IAEzG,IAAA,KAAkB,eAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,EAArC,IAAI,QAAA,EAAE,OAAO,QAAwB,CAAA;IAErC,IAAA,MAAM,GAAI,IAAA,iBAAQ,GAAE,OAAd,CAAc;IAE3B,IAAM,cAAc,GAAG;;;;;;oBAEH,qBAAM,+BAAc,CAAC,IAAI,CAAC,OAAO,CAAC,EAAA;;oBAA1C,KAAK,GAAG,SAAkC;oBAC9C,IAAG,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC;wBACrB,KAAK,GAAG,CAAC,KAAK,CAAC,CAAA;qBAClB;oBACD,OAAO,CAAC,KAAK,CAAC,CAAA;oBACd,YAAY,CAAC,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,IAAK,OAAA,CAAC,EAAC,OAAO,EAAE,IAAI,EAAE,IAAI,MAAA,EAAC,CAAC,EAAvB,CAAuB,CAAC,CAAC,CAAA;;;;oBAE1D,IAAI,+BAAc,CAAC,QAAQ,CAAC,KAAG,CAAC,EAAE;wBAC/B,MAAM,CAAC,GAAG,CAAC,4BAA4B,EAAE,IAAI,EAAE,WAAW,CAAC,CAAA;qBAC7D;yBAAM;wBACH,MAAM,KAAG,CAAA;qBACZ;;;;;SAER,CAAA;IAED,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,WAAW,EAAE;QACjD,MAAM,QAAA;QACN,QAAQ,UAAA;KAEX,CAAC,CAAA;IAGF,IAAA,2BAAmB,EAAC,GAAG,EAAE,cAAM,OAAA,CAAC;QAC5B,cAAc,gBAAA;KACjB,CAAC,EAF6B,CAE7B,CAAC,CAAA;IAEH,IAAM,SAAS,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,UAAC,CAAC,IAAK,OAAA,CAAC,CAAC,IAAI,EAAN,CAAM,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IACrD,IAAG,IAAI,KAAK,QAAQ,EAAC;QACjB,OAAO,CAAC,CAAC,WAAI,CAAC,KAAK,CAAC,CAAC,aAAa,CAAC,OAAO,CAAC,CACvC;YAAA,CAAC,sBAAU,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,EACrD;YAAA,CAAC,eAAM,CAAE,OAAO,CAAC,CAAC,cAAM,OAAA,cAAc,EAAE,EAAhB,CAAgB,CAAC,CAAE,IAAI,CAAC,CAAC,SAAS,CAAE,CAAC,IAAI,CAAC,CAAE,QAAQ,IAAI,iBAAoC,CAAC,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAE,CAAC,IAAI,WAAW,CAAC,EAC9K;QAAA,EAAE,WAAI,CAAC,CACN,CAAA;KACJ;IAED,OAAO,IAAI,CAAA;AACf,CAAC,CAAC,CAAA"}

package/dist/components/Image.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ComponentVariants, ImageStyles } from "@codeleap/common";
+import { ComponentVariants, ImageStyles, MobileInputFile } from "@codeleap/common";
 import { ComponentPropsWithoutRef } from "react";
 import { Image as NativeImage } from 'react-native';
 import { FastImage } from '../modules/fastImage';
@@ -9,7 +9,7 @@ export declare type ImageProps = Omit<NativeImageProps, 'source'> & {
     fast?: boolean;
     source: NativeImageProps['source'] & {
         priority?: keyof typeof FastImage.priority;
-    };
+    } | MobileInputFile | string;
     resizeMode?: keyof typeof FastImage.resizeMode;
 };
 export declare const Image: React.FC<ImageProps>;

package/dist/components/Image.js.map

@@ -1 +1 @@
-{"version":3,"file":"Image.js","sourceRoot":"","sources":["../../src/components/Image.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,2CAAoF;AAEpF,6CAAmD;AACnD,kDAA8C;AAYvC,IAAM,KAAK,GAAwB,UAAC,KAAK;IAExC,IAAA,QAAQ,GAMR,KAAK,SANG,EACR,KAAK,GAKL,KAAK,MALA,EACL,IAAI,GAIJ,KAAK,KAJD,EACJ,UAAU,GAGV,KAAK,WAHK,EACV,YAAY,GAEZ,KAAK,aAFO,EACT,UAAU,UACb,KAAK,EAPH,2DAOL,CADgB,CACR;IAET,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,OAAO,EAAE,EAAC,QAAQ,UAAA,EAAC,CAAC,CAAA;IAE5D,IAAM,MAAM,GAAG,CAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;IAG7C,IAAG,IAAI,EAAC;QACJ,OAAO,CAAC,qBAAS,CACb,KAAK,CAAC,CAAC,MAAM,CAAC,CACd,UAAU,CAAC,CAAE,qBAAS,CAAC,UAAU,CAAC,UAAU,IAAI,SAAS,CAAC,CAAC,CAC3D,IAAI,UAAU,CAAC,EACjB,CAAA;KACL;IACD,OAAO,CAAC,oBAAW,CACf,KAAK,CAAC,CAAC,MAAM,CAAC,CACd,IAAI,UAAU,CAAC,EACjB,CAAA;AACN,CAAC,CAAA;AA1BY,QAAA,KAAK,SA0BjB"}
+{"version":3,"file":"Image.js","sourceRoot":"","sources":["../../src/components/Image.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,2CAAqG;AAErG,6CAAmD;AACnD,kDAA8C;AAYvC,IAAM,KAAK,GAAwB,UAAC,KAAK;IAExC,IAAA,QAAQ,GAMR,KAAK,SANG,EACR,KAAK,GAKL,KAAK,MALA,EACL,IAAI,GAIJ,KAAK,KAJD,EACJ,UAAU,GAGV,KAAK,WAHK,EACV,YAAY,GAEZ,KAAK,aAFO,EACT,UAAU,UACb,KAAK,EAPH,2DAOL,CADgB,CACR;IAET,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,OAAO,EAAE,EAAC,QAAQ,UAAA,EAAC,CAAC,CAAA;IAE5D,IAAM,MAAM,GAAG,CAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;IAG7C,IAAG,IAAI,EAAC;QACJ,OAAO,CAAC,qBAAS,CACb,KAAK,CAAC,CAAC,MAAM,CAAC,CACd,UAAU,CAAC,CAAE,qBAAS,CAAC,UAAU,CAAC,UAAU,IAAI,SAAS,CAAC,CAAC,CAC3D,IAAI,UAAU,CAAC,EACjB,CAAA;KACL;IACD,OAAO,CAAC,oBAAW,CACf,KAAK,CAAC,CAAC,MAAM,CAAC,CACd,IAAK,UAAkB,CAAC,EAC1B,CAAA;AACN,CAAC,CAAA;AA1BY,QAAA,KAAK,SA0BjB"}

package/dist/components/Modal/index.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import { ViewProps } from '../View';
+import { ButtonProps } from '../Button';
+import { ComponentVariants, IconPlaceholder } from '@codeleap/common';
+import { MobileModalComposition, MobileModalStyles } from './styles';
+import { StylesOf } from '../../types/utility';
+export * from './styles';
+export declare type ModalProps = Omit<ViewProps, 'variants' | 'styles'> & {
+    variants?: ComponentVariants<typeof MobileModalStyles>['variants'];
+    styles?: StylesOf<MobileModalComposition>;
+    dismissOnBackdrop?: boolean;
+    buttonProps?: ButtonProps;
+    accessible?: boolean;
+    showClose?: boolean;
+    closable?: boolean;
+    footer?: React.ReactNode;
+    title?: React.ReactNode;
+    debugName?: string;
+    closeIconName?: IconPlaceholder;
+    visible: boolean;
+    toggle: () => void;
+};
+export declare const Modal: React.FC<ModalProps>;
+export default Modal;

package/dist/components/Modal/index.js

@@ -0,0 +1,116 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Modal = void 0;
+var React = __importStar(require("react"));
+var View_1 = require("../View");
+var Button_1 = require("../Button");
+var Scroll_1 = require("../Scroll");
+var common_1 = require("@codeleap/common");
+var react_native_1 = require("react-native");
+var Touchable_1 = require("../Touchable");
+var Text_1 = require("../Text");
+var Animated_1 = require("../Animated");
+__exportStar(require("./styles"), exports);
+var Modal = function (modalProps) {
+    var _a = modalProps.variants, variants = _a === void 0 ? [] : _a, _b = modalProps.styles, styles = _b === void 0 ? {} : _b, style = modalProps.style, visible = modalProps.visible, showClose = modalProps.showClose, _c = modalProps.closable, closable = _c === void 0 ? true : _c, title = modalProps.title, footer = modalProps.footer, children = modalProps.children, toggle = modalProps.toggle, _d = modalProps.dismissOnBackdrop, dismissOnBackdrop = _d === void 0 ? true : _d, _e = modalProps.closeIconName, closeIconName = _e === void 0 ? 'close' : _e, debugName = modalProps.debugName, props = __rest(modalProps, ["variants", "styles", "style", "visible", "showClose", "closable", "title", "footer", "children", "toggle", "dismissOnBackdrop", "closeIconName", "debugName"]);
+    var variantStyles = (0, common_1.useComponentStyle)('Modal', {
+        variants: variants,
+        transform: react_native_1.StyleSheet.flatten,
+        styles: styles
+    });
+    function getStyles(key) {
+        var s = [
+            variantStyles[key],
+            styles[key],
+            visible ? variantStyles[key + ':visible'] : {},
+            visible ? styles[key + ':visible'] : {},
+        ];
+        return s;
+    }
+    var buttonStyles = React.useMemo(function () {
+        var buttonEntries = {};
+        for (var _i = 0, _a = Object.entries(variantStyles); _i < _a.length; _i++) {
+            var _b = _a[_i], key = _b[0], style_1 = _b[1];
+            if (key.startsWith('closeButton')) {
+                buttonEntries[(0, common_1.capitalize)(key.replace('closeButton', ''), true)] = style_1;
+            }
+        }
+        return buttonEntries;
+    }, [variantStyles]);
+    var boxAnimation = {
+        hidden: __assign(__assign({}, variantStyles['box:pose']), styles['box:pose']),
+        visible: __assign(__assign({}, variantStyles['box:pose:visible']), styles['box:pose:visible'])
+    };
+    return (<View_1.View style={getStyles('wrapper')} pointerEvents={visible ? 'auto' : 'none'}>
+        <View_1.AnimatedView style={getStyles('overlay')} transition={'opacity'}/>
+        <Scroll_1.Scroll style={getStyles('innerWrapper')} contentContainerStyle={getStyles('innerWrapperScroll')}>
+           {dismissOnBackdrop &&
+            <Touchable_1.Touchable debugName={"".concat(debugName, " modal backdrop")} activeOpacity={1} onPress={function () { return toggle(); }} style={getStyles('touchableBackdrop')}/>}
+              <Animated_1.Animated component='View' config={boxAnimation} pose={visible ? 'visible' : 'hidden'} style={getStyles('box')}>
+                {(title || showClose) &&
+            <View_1.View style={getStyles('header')}>
+                  
+                      {typeof title === 'string' ? <Text_1.Text text={title} style={getStyles('title')}/> : title}
+                    
+                      {(showClose && closable) &&
+                    <Button_1.Button debugName={"".concat(debugName, " modal close button")} icon={closeIconName} variants={['icon']} onPress={toggle} styles={buttonStyles}/>}
+                    </View_1.View>}
+            
+                <View_1.View style={getStyles('body')}>
+                  {children}
+                </View_1.View>
+                {footer && <View_1.View style={getStyles('footer')}> 
+                    {footer}
+                  </View_1.View>}
+            </Animated_1.Animated>
+          
+        </Scroll_1.Scroll>
+      </View_1.View>);
+};
+exports.Modal = Modal;
+exports.default = exports.Modal;
+//# sourceMappingURL=index.js.map

package/dist/components/Modal/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,gCAIgB;AAChB,oCAAgD;AAChD,oCAAkC;AAClC,2CAAwH;AAExH,6CAAyC;AAGzC,0CAAwC;AACxC,gCAA8B;AAC9B,wCAAsC;AAGtC,2CAAwB;AAkBjB,IAAM,KAAK,GAAwB,UAAC,UAAU;IAGjD,IAAA,KAcI,UAAU,SAdD,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,KAaI,UAAU,OAbF,EAAZ,MAAM,mBAAG,EAAG,KAAA,EACZ,KAAK,GAYD,UAAU,MAZT,EACL,OAAO,GAWH,UAAU,QAXP,EACP,SAAS,GAUL,UAAU,UAVL,EACT,KASI,UAAU,SATC,EAAf,QAAQ,mBAAG,IAAI,KAAA,EACf,KAAK,GAQD,UAAU,MART,EACL,MAAM,GAOF,UAAU,OAPR,EACN,QAAQ,GAMJ,UAAU,SANN,EACR,MAAM,GAKF,UAAU,OALR,EACN,KAII,UAAU,kBAJU,EAAxB,iBAAiB,mBAAG,IAAI,KAAA,EACxB,KAGI,UAAU,cAHS,EAAvB,aAAa,mBAAG,OAAO,KAAA,EACvB,SAAS,GAEL,UAAU,UAFL,EACN,KAAK,UACJ,UAAU,EAfT,+JAeJ,CADO,CACM;IAEhB,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,OAAO,EAAE;QAC/C,QAAQ,EAAG,QAAe;QAC1B,SAAS,EAAE,yBAAU,CAAC,OAAO;QAC7B,MAAM,QAAA;KACP,CAAyB,CAAA;IAG1B,SAAS,SAAS,CAAC,GAAoB;QACrC,IAAM,CAAC,GAAI;YACT,aAAa,CAAC,GAAG,CAAC;YACnB,MAAM,CAAC,GAAG,CAAC;YACV,OAAO,CAAC,CAAC,CAAE,aAAa,CAAC,GAAG,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE;YAC/C,OAAO,CAAC,CAAC,CAAE,MAAM,CAAC,GAAG,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE;SACzC,CAAA;QAED,OAAO,CAAC,CAAA;IACV,CAAC;IAED,IAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC;QACjC,IAAM,aAAa,GAAG,EAAE,CAAA;QAExB,KAAyB,UAA6B,EAA7B,KAAA,MAAM,CAAC,OAAO,CAAC,aAAa,CAAC,EAA7B,cAA6B,EAA7B,IAA6B,EAAC;YAA7C,IAAA,WAAW,EAAV,GAAG,QAAA,EAAC,OAAK,QAAA;YAChB,IAAG,GAAG,CAAC,UAAU,CAAC,aAAa,CAAC,EAAC;gBAC7B,aAAa,CAAC,IAAA,mBAAU,EAAC,GAAG,CAAC,OAAO,CAAC,aAAa,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,OAAK,CAAA;aAC1E;SACJ;QACD,OAAO,aAAa,CAAA;IACtB,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAA;IAEnB,IAAM,YAAY,GAAG;QACnB,MAAM,wBACD,aAAa,CAAC,UAAU,CAAC,GACzB,MAAM,CAAC,UAAU,CAAC,CACtB;QACD,OAAO,wBACF,aAAa,CAAC,kBAAkB,CAAC,GACjC,MAAM,CAAC,kBAAkB,CAAC,CAC9B;KACF,CAAA;IAED,OAAO,CAEH,CAAC,WAAI,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAC1E;QAAA,CAAC,mBAAY,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,EACjE;QAAA,CAAC,eAAM,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,SAAS,CAAC,oBAAoB,CAAC,CAAC,CAC9F;WAAA,CACC,iBAAiB;YACf,CAAC,qBAAS,CACR,SAAS,CAAC,CAAC,UAAG,SAAS,oBAAiB,CAAC,CACzC,aAAa,CAAC,CAAC,CAAC,CAAC,CACjB,OAAO,CAAC,CAAC,cAAO,OAAA,MAAM,EAAE,EAAR,CAAQ,CAAC,CACzB,KAAK,CAAC,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC,EAEtC,CAEF;cAAA,CAAC,mBAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAE,KAAK,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAC9G;gBAAA,CACE,CAAC,KAAK,IAAI,SAAS,CAAC;YAElB,CAAC,WAAI,CAAG,KAAK,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAEjC;;sBAAA,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,WAAI,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAEpF;;sBAAA,CACE,CAAC,SAAS,IAAI,QAAQ,CAAC;oBACrB,CAAC,eAAM,CAAC,SAAS,CAAC,CAAC,UAAG,SAAS,wBAAqB,CAAC,CAAC,IAAI,CAAC,CAAC,aAAgC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,YAAY,CAAC,EAAE,CAEhK;oBAAA,EAAE,WAAI,CAAC,CAGX;;gBAAA,CAAC,WAAI,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAC7B;kBAAA,CAAC,QAAQ,CACX;gBAAA,EAAE,WAAI,CACN;gBAAA,CACE,MAAM,IAAI,CAAC,WAAI,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CACzC;oBAAA,CAAC,MAAM,CACT;kBAAA,EAAE,WAAI,CAAC,CAEb;YAAA,EAAE,mBAAQ,CAEd;;QAAA,EAAE,eAAM,CACV;MAAA,EAAE,WAAI,CAAC,CACV,CAAA;AACH,CAAC,CAAA;AAtGY,QAAA,KAAK,SAsGjB;AAID,kBAAe,aAAK,CAAA"}

package/dist/components/Modal/styles.d.ts

@@ -0,0 +1,62 @@
+import { ButtonComposition, ModalComposition } from '@codeleap/common';
+export declare const backgroundTransition: {
+    duration: number;
+    ease: string;
+    useNativeDriver: boolean;
+};
+export declare const modalTransition: {
+    duration: number;
+    ease: string;
+    useNativeDriver: boolean;
+};
+export declare type MobileModalParts = 'wrapper' | 'overlay' | 'innerWrapper' | 'innerWrapperScroll' | 'box' | 'footer' | 'body' | 'header' | 'touchableBackdrop' | 'box:pose' | 'title' | `closeButton${Capitalize<ButtonComposition>}`;
+export declare type MobileModalComposition = MobileModalParts | `${MobileModalParts}:visible`;
+export declare const MobileModalStyles: {
+    default: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<MobileModalComposition, any>>;
+    popup: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<MobileModalComposition, any>>;
+    roundish: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    dynamicHandler: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    fullscreen: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    fixed: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    block: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    flex: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    absolute: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    sticky: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    row: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    center: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    column: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    wrap: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    inline: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    inlineFlex: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    hidden: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    full: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    noWrap: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    fullWidth: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    fullHeight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    fullView: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    fullViewWidth: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    fullViewHeight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    whole: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    centerRow: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    listStyles: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    alignStart: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    alignEnd: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    alignCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    justifyStart: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    justifyEnd: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    justifyCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    justifySpaceBetween: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    textRight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    textLeft: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    textCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    blur: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    elevated: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    neumorphism: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    scrollX: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    scrollY: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    scrollXY: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    debRed: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    debGreen: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    debBlue: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+    debYellow: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ModalComposition, any>>;
+};