@codeleap/web 1.0.0

package/.eslintignore

@@ -0,0 +1,2 @@
+node_modules
+dist

package/.eslintrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  ...require('@codeleap/config/.eslintrc'),
+}

package/.turbo/turbo-build.log

@@ -0,0 +1 @@
+$ tsc --build

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

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { CSSObject } from '@emotion/react';
+import { ComponentVariants, ActivityIndicatorStyles, ActivityIndicatorComposition } from '@codeleap/common';
+import { StylesOf } from '../../types/utility';
+export * from './styles';
+export declare type ActivityIndicatorProps = {
+    animating?: boolean;
+    hidesWhenStopped?: boolean;
+    styles?: StylesOf<ActivityIndicatorComposition>;
+    css?: CSSObject;
+} & ComponentVariants<typeof ActivityIndicatorStyles>;
+export declare const ActivityIndicator: React.FC<ActivityIndicatorProps>;

package/dist/components/ActivityIndicator/index.js

@@ -0,0 +1,60 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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 __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.ActivityIndicator = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var View_1 = require("../View");
+var react_1 = require("@emotion/react");
+var common_1 = require("@codeleap/common");
+__exportStar(require("./styles"), exports);
+var spin = (0, react_1.keyframes)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    from {\n        transform: rotate(0deg);\n    }\n    to{ \n        transform: rotate(360deg);\n    }\n"], ["\n    from {\n        transform: rotate(0deg);\n    }\n    to{ \n        transform: rotate(360deg);\n    }\n"])));
+var ActivityIndicator = function (indicatorProps) {
+    var _a = indicatorProps.animating, animating = _a === void 0 ? true : _a, _b = indicatorProps.hidesWhenStopped, hidesWhenStopped = _b === void 0 ? true : _b, variants = indicatorProps.variants, responsiveVariants = indicatorProps.responsiveVariants, styles = indicatorProps.styles, viewProps = __rest(indicatorProps, ["animating", "hidesWhenStopped", "variants", "responsiveVariants", "styles"]);
+    var variantStyles = (0, common_1.useComponentStyle)('ActivityIndicator', {
+        styles: styles,
+        responsiveVariants: responsiveVariants,
+        variants: variants,
+    });
+    if (!animating && hidesWhenStopped) {
+        return null;
+    }
+    return (0, jsx_runtime_1.jsxs)(View_1.View, __assign({}, viewProps, { css: variantStyles.wrapper }, { children: [(0, jsx_runtime_1.jsx)(View_1.View, { css: __assign(__assign({}, variantStyles.circle), variantStyles.backCircle) }, void 0), (0, jsx_runtime_1.jsx)(View_1.View, { css: __assign(__assign(__assign({}, variantStyles.circle), variantStyles.frontCircle), { animation: "".concat(spin, " 1s infinite"), animationPlayState: animating ? 'running' : 'paused' }) }, void 0)] }), void 0);
+};
+exports.ActivityIndicator = ActivityIndicator;
+var templateObject_1;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ActivityIndicator/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gCAA8B;AAC9B,wCAAqD;AACrD,2CAA+H;AAG/H,2CAAwB;AAExB,IAAM,IAAI,OAAG,iBAAS,kLAAA,8GAOrB,IAAA,CAAA;AAWM,IAAM,iBAAiB,GAAoC,UAAC,cAAc;IAE7E,IAAA,KAOE,cAAc,UAPA,EAAhB,SAAS,mBAAG,IAAI,KAAA,EAChB,KAME,cAAc,iBANO,EAAvB,gBAAgB,mBAAG,IAAI,KAAA,EAEvB,QAAQ,GAIN,cAAc,SAJR,EACR,kBAAkB,GAGhB,cAAc,mBAHE,EAClB,MAAM,GAEJ,cAAc,OAFV,EACH,SAAS,UACV,cAAc,EARZ,6EAQL,CADa,CACI;IAGlB,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,mBAAmB,EAAE;QAC3D,MAAM,QAAA;QACN,kBAAkB,oBAAA;QAClB,QAAQ,UAAA;KACT,CAAC,CAAA;IAEF,IAAI,CAAC,SAAS,IAAI,gBAAgB,EAAC;QACjC,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,wBAAC,WAAI,eAAK,SAAS,IAAE,GAAG,EAAE,aAAa,CAAC,OAAO,iBACpD,uBAAC,WAAI,IAAC,GAAG,wBAAM,aAAa,CAAC,MAAM,GAAK,aAAa,CAAC,UAAU,YAAI,EACpE,uBAAC,WAAI,IAAC,GAAG,iCAAM,aAAa,CAAC,MAAM,GAAK,aAAa,CAAC,WAAW,KAC/D,SAAS,EAAE,UAAG,IAAI,iBAAc,EAChC,kBAAkB,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAE,QAAQ,cACnD,aACC,CAAA;AACT,CAAC,CAAA;AA7BY,QAAA,iBAAiB,qBA6B7B"}

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

@@ -0,0 +1,42 @@
+import { ActivityIndicatorComposition } from '@codeleap/common';
+export declare const WebActivityIndicatorStyles: {
+    default: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    fixed: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    hidden: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    block: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    flex: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    absolute: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    sticky: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    row: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    center: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    column: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    wrap: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    inline: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    inlineFlex: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    full: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    noWrap: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    fullWidth: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    fullHeight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    fullView: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    fullViewWidth: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    fullViewHeight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    whole: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    centerRow: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    listStyles: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    alignStart: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    alignEnd: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    alignCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    justifyStart: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    justifyEnd: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    justifyCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    justifySpaceBetween: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    textRight: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    textLeft: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    textCenter: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    blur: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    elevated: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    neumorphism: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    scrollX: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    scrollY: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+    scrollXY: (theme: import("@codeleap/common").EnhancedTheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
+};

package/dist/components/ActivityIndicator/styles.js

@@ -0,0 +1,22 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WebActivityIndicatorStyles = void 0;
+var common_1 = require("@codeleap/common");
+var createActivityIndicatorStyle = (0, common_1.createDefaultVariantFactory)();
+var getDefault = common_1.ActivityIndicatorStyles.default;
+exports.WebActivityIndicatorStyles = __assign(__assign({}, common_1.ActivityIndicatorStyles), { default: createActivityIndicatorStyle(function (theme) {
+        var defaults = getDefault(theme);
+        return defaults;
+    }) });
+//# sourceMappingURL=styles.js.map

package/dist/components/ActivityIndicator/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/ActivityIndicator/styles.ts"],"names":[],"mappings":";;;;;;;;;;;;;;AACA,2CAAqH;AAIrH,IAAM,4BAA4B,GAAG,IAAA,oCAA2B,GAAgC,CAAA;AAEhG,IAAM,UAAU,GAAG,gCAAuB,CAAC,OAAO,CAAA;AAErC,QAAA,0BAA0B,yBAClC,gCAAuB,KAC1B,OAAO,EAAE,4BAA4B,CAAC,UAAC,KAAK;QAC1C,IAAM,QAAQ,GAAG,UAAU,CAAC,KAAK,CAAC,CAAA;QAClC,OAAO,QAAQ,CAAA;IAEjB,CAAC,CAAC,IACH"}

package/dist/components/Button.d.ts

@@ -0,0 +1,15 @@
+import { ButtonStyles, ComponentVariants, ButtonComposition } from '@codeleap/common';
+import React, { ComponentPropsWithRef } from 'react';
+import { StylesOf } from '../types/utility';
+import { IconPlaceholder } from '@codeleap/common';
+declare type NativeButtonProps = ComponentPropsWithRef<'button'>;
+export declare type ButtonProps = NativeButtonProps & ComponentVariants<typeof ButtonStyles> & {
+    text?: string;
+    rightIcon?: IconPlaceholder;
+    icon?: IconPlaceholder;
+    onPress?: NativeButtonProps['onClick'];
+    styles?: StylesOf<ButtonComposition>;
+    loading?: boolean;
+};
+export declare const Button: React.FC<ButtonProps>;
+export {};

package/dist/components/Button.js

@@ -0,0 +1,48 @@
+"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 __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.Button = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var common_1 = require("@codeleap/common");
+var Text_1 = require("./Text");
+var Touchable_1 = require("./Touchable");
+var Icon_1 = require("./Icon");
+var ActivityIndicator_1 = require("./ActivityIndicator");
+var Button = function (buttonProps) {
+    var _a = buttonProps.variants, variants = _a === void 0 ? [] : _a, _b = buttonProps.responsiveVariants, responsiveVariants = _b === void 0 ? {} : _b, children = buttonProps.children, icon = buttonProps.icon, text = buttonProps.text, loading = buttonProps.loading, styles = buttonProps.styles, onPress = buttonProps.onPress, rightIcon = buttonProps.rightIcon, props = __rest(buttonProps, ["variants", "responsiveVariants", "children", "icon", "text", "loading", "styles", "onPress", "rightIcon"]);
+    var variantStyles = (0, common_1.useComponentStyle)('Button', {
+        responsiveVariants: responsiveVariants,
+        variants: variants,
+        styles: styles,
+    });
+    function handlePress(e) {
+        props.onClick && props.onClick(e);
+        onPress && onPress(e);
+    }
+    return ((0, jsx_runtime_1.jsxs)(Touchable_1.Touchable, __assign({ css: variantStyles.wrapper, component: 'button', onClick: handlePress }, props, { children: [loading && (0, jsx_runtime_1.jsx)(ActivityIndicator_1.ActivityIndicator, { css: variantStyles.loader }, void 0), !loading && (0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: icon, style: __assign(__assign({}, variantStyles.icon), variantStyles.leftIcon) }, void 0), children || (0, jsx_runtime_1.jsx)(Text_1.Text, { text: text, styles: {
+                    text: variantStyles.text,
+                } }, void 0), (0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: rightIcon, style: __assign(__assign({}, variantStyles.icon), variantStyles.rightIcon) }, void 0)] }), void 0));
+};
+exports.Button = Button;
+//# sourceMappingURL=Button.js.map

package/dist/components/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,2CAAyG;AAGzG,+BAA8B;AAC9B,yCAAwC;AACxC,+BAA8B;AAC9B,yDAAwD;AAejD,IAAM,MAAM,GAAyB,UAAC,WAAW;IAEpD,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,MAAM,GAIJ,WAAW,OAJP,EACN,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,kBAAkB,oBAAA;QAClB,QAAQ,UAAA;QACR,MAAM,QAAA;KACP,CAAC,CAAA;IAGF,SAAS,WAAW,CAAC,CAAuC;QAC1D,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAA;QACjC,OAAO,IAAI,OAAO,CAAC,CAAC,CAAC,CAAA;IACvB,CAAC;IAGD,OAAO,CACL,wBAAC,qBAAS,aACR,GAAG,EAAE,aAAa,CAAC,OAAO,EAC1B,SAAS,EAAC,QAAQ,EAClB,OAAO,EAAE,WAAW,IAChB,KAAK,eAER,OAAO,IAAI,uBAAC,qCAAiB,IAAC,GAAG,EAAE,aAAa,CAAC,MAAM,WAAI,EAC3D,CAAC,OAAO,IAAI,uBAAC,WAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,wBAAM,aAAa,CAAC,IAAI,GAAK,aAAa,CAAC,QAAQ,YAAI,EAC1F,QAAQ,IAAI,uBAAC,WAAI,IAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE;oBACrC,IAAI,EAAE,aAAa,CAAC,IAAI;iBACzB,WAAG,EACJ,uBAAC,WAAI,IAAC,IAAI,EAAE,SAAS,EAAE,KAAK,wBAAM,aAAa,CAAC,IAAI,GAAK,aAAa,CAAC,SAAS,YAAI,aAC1E,CACb,CAAA;AACH,CAAC,CAAA;AA3CY,QAAA,MAAM,UA2ClB"}

package/dist/components/CenterWrapper.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { StylesOf } from '../types/utility';
+import { ComponentVariants, CenterWrapperComposition, CenterWrapperStyles } from '@codeleap/common';
+export declare type CenterWrapperProps = {
+    styles?: StylesOf<CenterWrapperComposition>;
+} & ComponentVariants<typeof CenterWrapperStyles>;
+export declare const CenterWrapper: React.FC<CenterWrapperProps>;

package/dist/components/CenterWrapper.js

@@ -0,0 +1,28 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CenterWrapper = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var View_1 = require("./View");
+var common_1 = require("@codeleap/common");
+var CenterWrapper = function (props) {
+    var _a = props.styles, propStyles = _a === void 0 ? {} : _a, children = props.children, variants = props.variants, styles = props.styles, responsiveVariants = props.responsiveVariants;
+    var variantStyles = (0, common_1.useComponentStyle)('CenterWrapper', {
+        variants: variants,
+        styles: styles,
+        responsiveVariants: responsiveVariants,
+    });
+    return ((0, jsx_runtime_1.jsx)(View_1.View, __assign({ css: [variantStyles.wrapper, propStyles.wrapper] }, { children: (0, jsx_runtime_1.jsx)(View_1.View, __assign({ css: [variantStyles.innerWrapper, propStyles.innerWrapper] }, { children: children }), void 0) }), void 0));
+};
+exports.CenterWrapper = CenterWrapper;
+//# sourceMappingURL=CenterWrapper.js.map

package/dist/components/CenterWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CenterWrapper.js","sourceRoot":"","sources":["../../src/components/CenterWrapper.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AACA,+BAA8B;AAE9B,2CAAuH;AAMhH,IAAM,aAAa,GAAgC,UAAC,KAAK;IACrD,IAAA,KAA4E,KAAK,OAA1D,EAAf,UAAU,mBAAG,EAAE,KAAA,EAAE,QAAQ,GAA2C,KAAK,SAAhD,EAAE,QAAQ,GAAiC,KAAK,SAAtC,EAAE,MAAM,GAAyB,KAAK,OAA9B,EAAE,kBAAkB,GAAK,KAAK,mBAAV,CAAW;IAE3F,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,eAAe,EAAE;QACvD,QAAQ,UAAA;QAAE,MAAM,QAAA;QAAE,kBAAkB,oBAAA;KACrC,CAAC,CAAA;IAEF,OAAO,CACL,uBAAC,WAAI,aAAE,GAAG,EAAE,CAAC,aAAa,CAAC,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC,gBACrD,uBAAC,WAAI,aAAC,GAAG,EAAE,CAAC,aAAa,CAAC,YAAY,EAAE,UAAU,CAAC,YAAY,CAAC,gBAAG,QAAQ,YAAQ,YAC9E,CACR,CAAC;AACJ,CAAC,CAAA;AAZY,QAAA,aAAa,iBAYzB"}

package/dist/components/Checkbox.d.ts

@@ -0,0 +1,11 @@
+import { CheckboxComposition, CheckboxStyles, ComponentVariants, StylesOf } from '@codeleap/common';
+import { ComponentPropsWithRef } from 'react';
+declare type NativeCheckboxProps = ComponentPropsWithRef<'input'>;
+export declare type CheckboxProps = NativeCheckboxProps & {
+    checked?: boolean;
+    onValueChange?: (checked: boolean) => any;
+    label?: React.ReactNode;
+    styles?: StylesOf<CheckboxComposition>;
+} & ComponentVariants<typeof CheckboxStyles>;
+export declare const Checkbox: (checkboxProps: CheckboxProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Checkbox.js

@@ -0,0 +1,46 @@
+"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 __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.Checkbox = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var common_1 = require("@codeleap/common");
+var View_1 = require("./View");
+var Text_1 = require("./Text");
+var Checkbox = function (checkboxProps) {
+    var checked = checkboxProps.checked, onValueChange = checkboxProps.onValueChange, _a = checkboxProps.variants, variants = _a === void 0 ? [] : _a, _b = checkboxProps.responsiveVariants, responsiveVariants = _b === void 0 ? {} : _b, label = checkboxProps.label, onChange = checkboxProps.onChange, styles = checkboxProps.styles, props = __rest(checkboxProps, ["checked", "onValueChange", "variants", "responsiveVariants", "label", "onChange", "styles"]);
+    function handleChange(e) {
+        onChange && onChange(e);
+        onValueChange && onValueChange(e.target.checked);
+    }
+    var variantStyles = (0, common_1.useComponentStyle)('Checkbox', {
+        responsiveVariants: responsiveVariants,
+        variants: variants,
+        styles: styles,
+    });
+    var logger = (0, common_1.useStyle)().logger;
+    logger.log('Checkbox Style', variantStyles, 'Style');
+    return (0, jsx_runtime_1.jsxs)(View_1.View, __assign({ component: 'label', css: __assign({}, variantStyles.wrapper) }, { children: [(0, jsx_runtime_1.jsx)("input", __assign({}, props, { css: variantStyles.input, onChange: handleChange, type: 'checkbox', checked: checked }), void 0), (0, jsx_runtime_1.jsx)("span", { className: 'checkbox-label', css: __assign(__assign({}, variantStyles.checkmarkWrapper), { '&:after': __assign({}, variantStyles.checkmark) }) }, void 0), typeof label === 'string' ? (0, jsx_runtime_1.jsx)(Text_1.Text, { text: label, styles: { text: variantStyles.label } }, void 0) : label] }), void 0);
+};
+exports.Checkbox = Checkbox;
+//# sourceMappingURL=Checkbox.js.map

package/dist/components/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../src/components/Checkbox.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,2CAAgI;AAEhI,+BAA6B;AAC7B,+BAA6B;AAWtB,IAAM,QAAQ,GAAG,UAAC,aAA2B;IAC3C,IAAA,OAAO,GAA6F,aAAa,QAA1G,EAAE,aAAa,GAA8E,aAAa,cAA3F,EAAE,KAA4E,aAAa,SAA7E,EAAZ,QAAQ,mBAAE,EAAE,KAAA,EAAE,KAA8D,aAAa,mBAApD,EAAvB,kBAAkB,mBAAG,EAAE,KAAA,EAAE,KAAK,GAAgC,aAAa,MAA7C,EAAE,QAAQ,GAAsB,aAAa,SAAnC,EAAE,MAAM,GAAc,aAAa,OAA3B,EAAK,KAAK,UAAI,aAAa,EAAlH,6FAAkG,CAAD,CAAiB;IAExH,SAAS,YAAY,CAAC,CAAqC;QACzD,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC,CAAA;QACvB,aAAa,IAAI,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;IAClD,CAAC;IAED,IAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,UAAU,EAAE;QAClD,kBAAkB,oBAAA;QAClB,QAAQ,UAAA;QACR,MAAM,QAAA;KACP,CAAC,CAAA;IAEK,IAAA,MAAM,GAAI,IAAA,iBAAQ,GAAE,OAAd,CAAc;IAC3B,MAAM,CAAC,GAAG,CAAC,gBAAgB,EAAE,aAAa,EAAE,OAAO,CAAC,CAAA;IAEpD,OAAO,wBAAC,WAAI,aAAC,SAAS,EAAC,OAAO,EAAC,GAAG,eAAM,aAAa,CAAC,OAAO,kBAC3D,6CAAW,KAAK,IAAE,GAAG,EAAE,aAAa,CAAC,KAAK,EAAG,QAAQ,EAAE,YAAY,EAAG,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,OAAO,YAAG,EACzG,iCAAM,SAAS,EAAC,gBAAgB,EAAC,GAAG,wBAC/B,aAAa,CAAC,gBAAgB,KACjC,SAAS,eACJ,aAAa,CAAC,SAAS,eAE1B,EAEF,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAE,uBAAC,WAAI,IAAE,IAAI,EAAE,KAAK,EAAG,MAAM,EAAE,EAAC,IAAI,EAAE,aAAa,CAAC,KAAK,EAAC,WAAG,CAAC,CAAC,CAAC,KAAK,aAE7F,CAAA;AACT,CAAC,CAAA;AA7BY,QAAA,QAAQ,YA6BpB"}

package/dist/components/ContentView.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { ComponentVariants, ContentViewStyles, ViewComposition } from '@codeleap/common';
+import { ViewProps } from './View';
+import { StylesOf } from '../types/utility';
+export declare type ContentViewProps = Omit<ViewProps<'div'>, 'variants' | 'responsiveVariants'> & {
+    placeholderMsg: string;
+    loading?: boolean;
+    styles?: StylesOf<ViewComposition>;
+} & ComponentVariants<typeof ContentViewStyles>;
+export declare const ContentView: React.FC<ContentViewProps>;

package/dist/components/ContentView.js

@@ -0,0 +1,52 @@
+"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 __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.ContentView = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var common_1 = require("@codeleap/common");
+var _1 = require(".");
+var View_1 = require("./View");
+var Text_1 = require("./Text");
+var WrapContent = function (_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (0, jsx_runtime_1.jsx)(View_1.View, __assign({}, props, { children: children }), void 0);
+};
+var ContentView = function (rawProps) {
+    var children = rawProps.children, placeholderMsg = rawProps.placeholderMsg, loading = rawProps.loading, variants = rawProps.variants, responsiveVariants = rawProps.responsiveVariants, styles = rawProps.styles, props = __rest(rawProps, ["children", "placeholderMsg", "loading", "variants", "responsiveVariants", "styles"]);
+    var variantStyle = (0, common_1.useComponentStyle)('ContentView', {
+        variants: variants,
+        responsiveVariants: responsiveVariants,
+        styles: styles,
+    });
+    if (loading) {
+        return (0, jsx_runtime_1.jsx)(WrapContent, __assign({}, props, { css: variantStyle.wrapper }, { children: (0, jsx_runtime_1.jsx)(_1.ActivityIndicator, { css: variantStyle.loader }, void 0) }), void 0);
+    }
+    var hasChildren = Object.keys(children || {}).length > 0;
+    if (hasChildren) {
+        return (0, jsx_runtime_1.jsx)(WrapContent, __assign({}, props, { css: variantStyle.wrapper }, { children: children }), void 0);
+    }
+    return (0, jsx_runtime_1.jsx)(WrapContent, __assign({}, props, { css: variantStyle.wrapper }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { text: placeholderMsg, css: variantStyle.placeholder }, void 0) }), void 0);
+};
+exports.ContentView = ContentView;
+//# sourceMappingURL=ContentView.js.map

package/dist/components/ContentView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContentView.js","sourceRoot":"","sources":["../../src/components/ContentView.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA4G;AAC5G,sBAAqC;AACrC,+BAAwC;AACxC,+BAA6B;AAS7B,IAAM,WAAW,GAAG,UAAC,EAA+C;IAA9C,IAAA,QAAQ,cAAA,EAAM,KAAK,cAApB,YAAqB,CAAD;IAAgC,OAAA,uBAAC,WAAI,eAAK,KAAK,cAAI,QAAQ,YAAQ,CAAA;CAAA,CAAA;AAErG,IAAM,WAAW,GAA8B,UAAC,QAAQ;IAE3D,IAAA,QAAQ,GAON,QAAQ,SAPF,EACR,cAAc,GAMZ,QAAQ,eANI,EACd,OAAO,GAKL,QAAQ,QALH,EACP,QAAQ,GAIN,QAAQ,SAJF,EACR,kBAAkB,GAGhB,QAAQ,mBAHQ,EAClB,MAAM,GAEJ,QAAQ,OAFJ,EACH,KAAK,UACN,QAAQ,EARN,qFAQL,CADS,CACE;IAEZ,IAAM,YAAY,GAAG,IAAA,0BAAiB,EAAC,aAAa,EAAE;QACpD,QAAQ,UAAA;QACR,kBAAkB,oBAAA;QAClB,MAAM,QAAA;KACP,CAAC,CAAA;IAEF,IAAI,OAAO,EAAC;QACV,OAAO,uBAAC,WAAW,eAAK,KAAK,IAAE,GAAG,EAAE,YAAY,CAAC,OAAO,gBACtD,uBAAC,oBAAiB,IAAC,GAAG,EAAE,YAAY,CAAC,MAAM,WAAG,YAClC,CAAA;KACf;IACD,IAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,QAAQ,IAAE,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAA;IACxD,IAAI,WAAW,EAAC;QACd,OAAO,uBAAC,WAAW,eAAK,KAAK,IAAC,GAAG,EAAE,YAAY,CAAC,OAAO,gBACpD,QAAQ,YACG,CAAA;KACf;IAED,OAAO,uBAAC,WAAW,eAAK,KAAK,IAAE,GAAG,EAAE,YAAY,CAAC,OAAO,gBACtD,uBAAC,WAAI,IAAC,IAAI,EAAE,cAAc,EAAE,GAAG,EAAE,YAAY,CAAC,WAAW,WAAG,YAChD,CAAA;AAEhB,CAAC,CAAA;AAjCY,QAAA,WAAW,eAiCvB"}

package/dist/components/Drawer.d.ts

@@ -0,0 +1,23 @@
+import { AnyFunction, ComponentVariants, DrawerComposition, DrawerStyles } from '@codeleap/common';
+import React, { ReactNode } from 'react';
+import { StylesOf } from '../types/utility';
+declare const axisMap: {
+    readonly top: readonly [-1, "Y"];
+    readonly bottom: readonly [1, "Y"];
+    readonly left: readonly [-1, "X"];
+    readonly right: readonly [1, "X"];
+};
+export declare type DrawerProps = {
+    open: boolean;
+    toggle: AnyFunction;
+    darkenBackground?: boolean;
+    size: string | number;
+    showCloseButton?: boolean;
+    title?: ReactNode;
+    footer?: ReactNode;
+    position?: keyof typeof axisMap;
+    styles?: StylesOf<DrawerComposition>;
+    animationDuration?: string;
+} & ComponentVariants<typeof DrawerStyles>;
+export declare const Drawer: React.FC<DrawerProps>;
+export {};

package/dist/components/Drawer.js

@@ -0,0 +1,66 @@
+"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 __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.Drawer = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var common_1 = require("@codeleap/common");
+var Overlay_1 = require("./Overlay");
+var View_1 = require("./View");
+var Text_1 = require("./Text");
+var Button_1 = require("./Button");
+var axisMap = {
+    top: [-1, 'Y'],
+    bottom: [1, 'Y'],
+    left: [-1, 'X'],
+    right: [1, 'X'],
+};
+var resolveHiddenDrawerPosition = function (position) {
+    var _a = axisMap[position], translateOrient = _a[0], translateAxis = _a[1];
+    var translateValues = {
+        X: 0,
+        Y: 0,
+    };
+    translateValues[translateAxis] = 100 * translateOrient;
+    var css = "translate(".concat(translateValues.X, "%, ").concat(translateValues.Y, "%)");
+    var positioningKeys = translateAxis === 'X' ? ['top', 'bottom'] : ['left', 'right'];
+    var positioning = Object.fromEntries(positioningKeys.map(function (k) { return [k, 0]; }));
+    return [css, translateAxis, positioning];
+};
+var Drawer = function (_a) {
+    var _b, _c;
+    var rawProps = __rest(_a, []);
+    var open = rawProps.open, toggle = rawProps.toggle, children = rawProps.children, size = rawProps.size, title = rawProps.title, footer = rawProps.footer, _d = rawProps.darkenBackground, darkenBackground = _d === void 0 ? true : _d, showCloseButton = rawProps.showCloseButton, _e = rawProps.position, position = _e === void 0 ? 'bottom' : _e, _f = rawProps.variants, variants = _f === void 0 ? [] : _f, _g = rawProps.responsiveVariants, responsiveVariants = _g === void 0 ? {} : _g, styles = rawProps.styles, _h = rawProps.animationDuration, animationDuration = _h === void 0 ? '0.3s' : _h;
+    var _j = resolveHiddenDrawerPosition(position), hiddenStyle = _j[0], axis = _j[1], positioning = _j[2];
+    var sizeProperty = axis === 'X' ? 'width' : 'height';
+    var fullProperty = sizeProperty === 'height' ? 'width' : 'height';
+    var variantStyles = (0, common_1.useComponentStyle)('Drawer', {
+        styles: styles,
+        variants: variants,
+        responsiveVariants: responsiveVariants,
+    });
+    return (0, jsx_runtime_1.jsxs)(View_1.View, __assign({ css: __assign(__assign({}, variantStyles.wrapper), { transition: 'visibility 0.01s ease', transitionDelay: open ? '0' : animationDuration, visibility: open ? 'visible' : 'hidden' }) }, { children: [darkenBackground && (0, jsx_runtime_1.jsx)(Overlay_1.Overlay, { visible: open, css: variantStyles.overlay, onPress: function () { return toggle(); } }, void 0), (0, jsx_runtime_1.jsxs)(View_1.View, __assign({ variants: ['fixed'], css: __assign(__assign(__assign((_b = { transform: open ? "translate(0%, 0%)" : hiddenStyle, transition: "transform ".concat(animationDuration, " ease") }, _b[sizeProperty] = size, _b[fullProperty] = '100%', _b), positioning), (_c = {}, _c[position] = 0, _c)), variantStyles.box) }, { children: [(0, jsx_runtime_1.jsxs)(View_1.View, __assign({ component: 'header', variants: ['justifySpaceBetween'], css: variantStyles.header }, { children: [typeof title === 'string' ? (0, jsx_runtime_1.jsx)(Text_1.Text, { text: title }, void 0) : title, showCloseButton && (0, jsx_runtime_1.jsx)(Button_1.Button, { onPress: toggle, icon: 'close', variants: ['icon'], css: variantStyles.headerCloseButton }, void 0)] }), void 0), (0, jsx_runtime_1.jsx)(View_1.View, __assign({ css: variantStyles.body }, { children: children }), void 0), footer &&
+                        (0, jsx_runtime_1.jsx)(View_1.View, __assign({ component: 'footer', css: variantStyles.footer }, { children: footer }), void 0)] }), void 0)] }), void 0);
+};
+exports.Drawer = Drawer;
+//# sourceMappingURL=Drawer.js.map

package/dist/components/Drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../src/components/Drawer.tsx"],"names":[],"mappings":"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"}

package/dist/components/FileInput.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { WebInputFile } from '@codeleap/common';
+export declare type FileInputRef = {
+    openFilePicker: () => void;
+};
+export declare const FileInput: React.ForwardRefExoticComponent<Omit<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type"> & {
+    onFileSelect(files: WebInputFile[]): void;
+} & React.RefAttributes<FileInputRef>>;

package/dist/components/FileInput.js

@@ -0,0 +1,69 @@
+"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 __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.FileInput = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var react_1 = __importStar(require("react"));
+exports.FileInput = react_1.default.forwardRef(function (inputProps, ref) {
+    var inputRef = (0, react_1.useRef)(null);
+    var onFileSelect = inputProps.onFileSelect, props = __rest(inputProps, ["onFileSelect"]);
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        openFilePicker: function () {
+            inputRef.current.click();
+        },
+    }); });
+    function handleChange(e) {
+        var _a;
+        if (!e.target.files.length)
+            return;
+        inputProps.onChange && inputProps.onChange(e);
+        var fileArray = Array.from(((_a = e.target) === null || _a === void 0 ? void 0 : _a.files) || []);
+        var files = fileArray.map(function (obj) { return ({
+            file: obj,
+            preview: URL.createObjectURL(obj),
+        }); });
+        onFileSelect && onFileSelect(files);
+    }
+    return (0, jsx_runtime_1.jsx)("input", __assign({ type: 'file', css: { visibility: 'hidden' } }, props, { ref: inputRef, onChange: handleChange }), void 0);
+});
+//# sourceMappingURL=FileInput.js.map

package/dist/components/FileInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileInput.js","sourceRoot":"","sources":["../../src/components/FileInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAsF;AAczE,QAAA,SAAS,GAAG,eAAK,CAAC,UAAU,CAA+B,UAAC,UAAU,EAAE,GAAG;IACtF,IAAM,QAAQ,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAA;IAEvC,IAAA,YAAY,GAAe,UAAU,aAAzB,EAAK,KAAK,UAAK,UAAU,EAAvC,gBAA0B,CAAF,CAAe;IAE7C,IAAA,2BAAmB,EAAC,GAAG,EAAE,cAAM,OAAA,CAAC;QAC9B,cAAc,EAAE;YACd,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAA;QAC1B,CAAC;KACF,CAAC,EAJ6B,CAI7B,CAAC,CAAA;IAIH,SAAS,YAAY,CAAC,CAAqC;;QACzD,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM;YAAE,OAAM;QAClC,UAAU,CAAC,QAAQ,IAAI,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;QAC7C,IAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,CAAA,MAAA,CAAC,CAAC,MAAM,0CAAE,KAAK,KAAE,EAAE,CAAC,CAAA;QAEjD,IAAM,KAAK,GAAkB,SAAS,CAAC,GAAG,CAAC,UAAC,GAAG,IAAK,OAAA,CAAC;YACnD,IAAI,EAAE,GAAG;YACT,OAAO,EAAE,GAAG,CAAC,eAAe,CAAC,GAAG,CAAC;SAClC,CAAC,EAHkD,CAGlD,CAAC,CAAA;QAEH,YAAY,IAAI,YAAY,CAAC,KAAK,CAAC,CAAA;IAErC,CAAC;IAED,OAAO,2CAAO,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,EAAC,UAAU,EAAE,QAAQ,EAAC,IAAM,KAAK,IAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,YAAG,CAAA;AAC9G,CAAC,CAAC,CAAA"}

package/dist/components/FlatList.d.ts

@@ -0,0 +1,18 @@
+import { VariableSizeList as List } from 'react-window';
+import { ComponentProps, CSSProperties, ReactElement } from 'react';
+import { ComponentVariants, ViewComposition, ViewStyles } from '@codeleap/common';
+import { StylesOf } from '../types/utility';
+import { CSSObject } from '@emotion/react';
+export declare type FlatListRender<T> = (itemProps: {
+    item: T;
+    index: number;
+    style: CSSProperties;
+}) => ReactElement;
+export declare type FlatListProps<T> = {
+    styles?: StylesOf<ViewComposition>;
+    css?: CSSObject;
+    data: T[];
+    getSize: (i: T, idx: number) => number;
+    renderItem: FlatListRender<T>;
+} & Omit<ComponentProps<typeof List>, 'itemCount' | 'itemSize' | 'itemData' | 'itemHeight' | 'width' | 'height' | 'children'> & ComponentVariants<typeof ViewStyles>;
+export declare const FlatList: <T extends unknown>(flatListProps: FlatListProps<T>) => import("@emotion/react/jsx-runtime").JSX.Element;