venice-ui 1.0.0 → 1.0.2

package/dist/cjs/example/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ExampleComponent"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/example/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/example/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,qDAAkC"}

package/dist/cjs/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./components/InputText";
+export { Modal } from './components/Modal';
+export { Aligment } from './components/Aligment';
+export * from './components/Typography';
+export { Button } from './components/Button';
+export { Icon } from './components/Icons';

package/dist/cjs/index.js

@@ -0,0 +1,28 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Icon = exports.Button = exports.Aligment = exports.Modal = void 0;
+__exportStar(require("./components/InputText"), exports);
+var Modal_1 = require("./components/Modal");
+Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return Modal_1.Modal; } });
+var Aligment_1 = require("./components/Aligment");
+Object.defineProperty(exports, "Aligment", { enumerable: true, get: function () { return Aligment_1.Aligment; } });
+__exportStar(require("./components/Typography"), exports);
+var Button_1 = require("./components/Button");
+Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return Button_1.Button; } });
+var Icons_1 = require("./components/Icons");
+Object.defineProperty(exports, "Icon", { enumerable: true, get: function () { return Icons_1.Icon; } });
+//# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,yDAAuC;AACvC,4CAAwC;AAAhC,8FAAA,KAAK,OAAA;AACb,kDAA8C;AAAtC,oGAAA,QAAQ,OAAA;AAChB,0DAAuC;AACvC,8CAA0C;AAAlC,gGAAA,MAAM,OAAA;AACd,4CAAuC;AAA/B,6FAAA,IAAI,OAAA"}

package/dist/esm/Theme/Theme.d.ts

@@ -0,0 +1,45 @@
+export declare const Theme: {
+    colors: {
+        primary: string;
+        text: string;
+        disableText: string;
+        disableBackground: string;
+        white: string;
+        black: string;
+        gray_1: string;
+        overlayer: string;
+    };
+    fontSize: {
+        xs: string;
+        s: string;
+        m: string;
+        l: string;
+        xl: string;
+    };
+    lineHeight: {
+        xs: string;
+        s: string;
+        m: string;
+        l: string;
+        xl: string;
+    };
+    padding: {
+        xs: string;
+        s: string;
+        m: string;
+        l: string;
+        xl: string;
+        xxl: string;
+    };
+    zIndex: {
+        modalOverlayer: number;
+    };
+    borderRadius: {
+        s: string;
+        m: string;
+        l: string;
+    };
+    shadow: {
+        m: string;
+    };
+};

package/dist/esm/Theme/Theme.js

@@ -0,0 +1,46 @@
+export const Theme = {
+    colors: {
+        primary: "#4c95c5",
+        text: '#333333',
+        disableText: "#cccccc",
+        disableBackground: '#dddddd',
+        white: "#ffffff",
+        black: "#333333",
+        gray_1: "#b7b7b7",
+        overlayer: 'rgba(255,255,255,0.2)'
+    },
+    fontSize: {
+        xs: "12px",
+        s: "14px",
+        m: "16px",
+        l: "22px",
+        xl: "32px",
+    },
+    lineHeight: {
+        xs: "14px",
+        s: "16px",
+        m: "18px",
+        l: "24px",
+        xl: "36px",
+    },
+    padding: {
+        xs: "2px",
+        s: "4px",
+        m: "8px",
+        l: "16px",
+        xl: "32px",
+        xxl: '48px',
+    },
+    zIndex: {
+        modalOverlayer: 1000,
+    },
+    borderRadius: {
+        s: '2px',
+        m: '4px',
+        l: '8px',
+    },
+    shadow: {
+        m: '0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);'
+    }
+};
+//# sourceMappingURL=Theme.js.map

package/dist/esm/Theme/Theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Theme.js","sourceRoot":"","sources":["../../../src/Theme/Theme.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,MAAM,EAAE;QACN,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,SAAS;QACtB,iBAAiB,EAAE,SAAS;QAC5B,KAAK,EAAE,SAAS;QAChB,KAAK,EAAE,SAAS;QAChB,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,uBAAuB;KACnC;IAED,QAAQ,EAAE;QACR,EAAE,EAAE,MAAM;QACV,CAAC,EAAE,MAAM;QACT,CAAC,EAAE,MAAM;QACT,CAAC,EAAE,MAAM;QACT,EAAE,EAAE,MAAM;KACX;IACD,UAAU,EAAE;QACV,EAAE,EAAE,MAAM;QACV,CAAC,EAAE,MAAM;QACT,CAAC,EAAE,MAAM;QACT,CAAC,EAAE,MAAM;QACT,EAAE,EAAE,MAAM;KACX;IAED,OAAO,EAAE;QACP,EAAE,EAAE,KAAK;QACT,CAAC,EAAE,KAAK;QACR,CAAC,EAAE,KAAK;QACR,CAAC,EAAE,MAAM;QACT,EAAE,EAAE,MAAM;QACV,GAAG,EAAE,MAAM;KACZ;IACD,MAAM,EAAC;QACL,cAAc,EAAE,IAAI;KACrB;IACD,YAAY,EAAE;QACZ,CAAC,EAAE,KAAK;QACR,CAAC,EAAE,KAAK;QACR,CAAC,EAAE,KAAK;KACT;IACD,MAAM,EAAC;QACL,CAAC,EAAE,iEAAiE;KACrE;CACF,CAAC"}

package/dist/esm/components/Aligment/Aligment.stories.d.ts

@@ -0,0 +1,7 @@
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+declare const _default: ComponentMeta<import("styled-components").StyledComponent<"div", any, import("./Aligment.styles").IAligmentProps, never>>;
+export default _default;
+export declare const Default: ComponentStory<import("styled-components").StyledComponent<"div", any, import("./Aligment.styles").IAligmentProps, never>>;
+export declare const Column: ComponentStory<import("styled-components").StyledComponent<"div", any, import("./Aligment.styles").IAligmentProps, never>>;
+export declare const WithColor: ComponentStory<import("styled-components").StyledComponent<"div", any, import("./Aligment.styles").IAligmentProps, never>>;
+export declare const WithPadding: ComponentStory<import("styled-components").StyledComponent<"div", any, import("./Aligment.styles").IAligmentProps, never>>;

package/dist/esm/components/Aligment/Aligment.stories.js

@@ -0,0 +1,104 @@
+import React from 'react';
+import { Aligment } from './Aligment.styles';
+import { ExmpleBlock, ExmpleBlockWrapper } from '../../example';
+import { Theme } from '../../Theme/Theme';
+export default {
+    title: 'Layout/Aligment',
+    component: Aligment,
+    argTypes: {
+        width: { control: 'text', defaultValue: '100%', default: '100%' },
+        direction: {
+            options: ['row', 'row-reverse', 'column', 'column-reverse'],
+            control: 'select',
+        },
+        align: {
+            options: [
+                'stretch',
+                'flex-start',
+                'flex-end',
+                'center',
+                'baseline',
+                'first baseline',
+                'last baseline',
+                'start',
+                'end',
+                'self-start',
+                'self-end',
+            ],
+            control: 'select',
+        },
+        justify: {
+            options: [
+                'flex-start',
+                'flex-end',
+                'center',
+                'space-between',
+                'space-around',
+                'space-evenly',
+                'start',
+                'end',
+                'left',
+            ],
+            control: 'select',
+        },
+        wrap: {
+            options: ['wrap', 'nowrap', 'wrap-reverse'],
+            control: 'select',
+        },
+        backgroundColor: {
+            control: { type: 'color' },
+        },
+        vPadding: { control: 'text' },
+        hPadding: { control: 'text' },
+    },
+};
+const Template = (args) => (React.createElement(Aligment, Object.assign({}, args),
+    React.createElement(ExmpleBlockWrapper, null,
+        React.createElement(ExmpleBlock, { width: "20px", height: "40px" }, "1")),
+    React.createElement(ExmpleBlockWrapper, null,
+        React.createElement(ExmpleBlock, { width: "60px", height: "30px" }, "2")),
+    React.createElement(ExmpleBlockWrapper, null,
+        React.createElement(ExmpleBlock, { width: "30px", height: "60px" }, "3")),
+    React.createElement(ExmpleBlockWrapper, null,
+        React.createElement(ExmpleBlock, { width: "40px", height: "40px" }, "4"))));
+export const Default = Template.bind({});
+Default.args = {
+    direction: 'row',
+    align: 'center',
+    justify: 'space-between',
+    wrap: 'wrap',
+    backgroundColor: 'transparent',
+    vPadding: '0px',
+    hPadding: '0px',
+};
+export const Column = Template.bind({});
+Column.args = {
+    direction: 'column',
+    align: 'center',
+    justify: 'space-between',
+    wrap: 'wrap',
+    backgroundColor: 'transparent',
+    vPadding: '0px',
+    hPadding: '0px',
+};
+export const WithColor = Template.bind({});
+WithColor.args = {
+    direction: 'row',
+    align: 'center',
+    justify: 'space-between',
+    wrap: 'wrap',
+    backgroundColor: Theme.colors.primary,
+    vPadding: '0px',
+    hPadding: '0px',
+};
+export const WithPadding = Template.bind({});
+WithPadding.args = {
+    direction: 'row',
+    align: 'center',
+    justify: 'space-between',
+    wrap: 'wrap',
+    backgroundColor: Theme.colors.primary,
+    vPadding: Theme.padding.xl,
+    hPadding: Theme.padding.xl,
+};
+//# sourceMappingURL=Aligment.stories.js.map

package/dist/esm/components/Aligment/Aligment.stories.js.map

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

package/dist/esm/components/Aligment/Aligment.styles.d.ts

@@ -0,0 +1,11 @@
+export interface IAligmentProps {
+    direction?: string;
+    justify?: string;
+    align?: string;
+    width?: string;
+    wrap?: string;
+    vPadding?: string;
+    hPadding?: string;
+    backgroundColor?: string;
+}
+export declare const Aligment: import("styled-components").StyledComponent<"div", any, IAligmentProps, never>;

package/dist/esm/components/Aligment/Aligment.styles.js

@@ -0,0 +1,13 @@
+import styled from "styled-components";
+export const Aligment = styled.div `
+  box-sizing: border-box;
+  display: flex;
+  width: ${p => p.width ? p.width : '100%'};
+  flex-direction: ${p => p.direction ? p.direction : 'row'};
+  justify-content: ${p => p.justify ? p.justify : 'space-between'};
+  align-items: ${p => p.align ? p.align : 'center'};
+  flex-wrap: ${p => p.wrap ? p.wrap : 'wrap'};
+  padding: ${p => p.vPadding ? p.vPadding : '0'} ${p => p.hPadding ? p.hPadding : '0'};
+  background-color: ${p => p.backgroundColor ? p.backgroundColor : 'transparent'}
+`;
+//# sourceMappingURL=Aligment.styles.js.map

package/dist/esm/components/Aligment/Aligment.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Aligment.styles.js","sourceRoot":"","sources":["../../../../src/components/Aligment/Aligment.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAYvC,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAgB;;;WAGvC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM;oBACtB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK;qBACrC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,eAAe;iBAChD,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ;eACnC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM;aAC/B,CAAC,CAAA,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAA,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG;sBAC7D,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,aAAa;CAC/E,CAAC"}

package/dist/esm/components/Aligment/index.d.ts

@@ -0,0 +1 @@
+export { Aligment } from './Aligment.styles';

package/dist/esm/components/Aligment/index.js

@@ -0,0 +1,2 @@
+export { Aligment } from './Aligment.styles';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Aligment/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Aligment/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA"}

package/dist/esm/components/Button/Button.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+export interface IButtonProps {
+    text: string;
+    mode?: string;
+    size?: string;
+    right?: boolean;
+    left?: boolean;
+    onClick: () => void;
+}
+export declare const Button: FC<IButtonProps>;

package/dist/esm/components/Button/Button.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { ButtonElement } from './Button.styles';
+export const Button = ({ text, mode = 'primary', size = 'regular', right = false, left = false, onClick, }) => {
+    return (React.createElement(ButtonElement, { mode: mode, size: size, right: right, left: left, onClick: onClick }, text));
+};
+//# sourceMappingURL=Button.js.map

package/dist/esm/components/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAU/C,MAAM,CAAC,MAAM,MAAM,GAAqB,CAAC,EACvC,IAAI,EACJ,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,SAAS,EAChB,KAAK,GAAG,KAAK,EACb,IAAI,GAAG,KAAK,EACZ,OAAO,GACR,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,aAAa,IACZ,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,IAEf,IAAI,CACS,CACjB,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/components/Button/Button.stories.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+declare const _default: ComponentMeta<React.FC<import("./Button").IButtonProps>>;
+export default _default;
+export declare const Default: ComponentStory<React.FC<import("./Button").IButtonProps>>;
+export declare const Inverse: ComponentStory<React.FC<import("./Button").IButtonProps>>;
+export declare const Ghost: ComponentStory<React.FC<import("./Button").IButtonProps>>;

package/dist/esm/components/Button/Button.stories.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import { Button } from './Button';
+export default {
+    title: 'Elements/Button',
+    component: Button,
+    argTypes: {
+        text: { control: 'text' },
+        mode: {
+            options: ['primary', 'inverse', 'ghost'],
+            control: 'select',
+        },
+        size: {
+            options: ['regular', 'small', 'flat'],
+            control: 'select',
+        },
+        right: { control: 'boolean' },
+        left: { control: 'boolean' },
+    },
+    args: {
+        text: 'Click me',
+    },
+};
+const Template = (args) => React.createElement(Button, Object.assign({}, args));
+export const Default = Template.bind({});
+Default.args = {
+    size: 'regular',
+    mode: 'primary',
+    left: false,
+    right: false,
+};
+export const Inverse = Template.bind({});
+Inverse.args = {
+    size: 'regular',
+    mode: 'inverse',
+    left: false,
+    right: false,
+};
+export const Ghost = Template.bind({});
+Ghost.args = {
+    size: 'regular',
+    mode: 'ghost',
+    left: false,
+    right: false,
+};
+//# sourceMappingURL=Button.stories.js.map

package/dist/esm/components/Button/Button.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,eAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,MAAM;IACjB,QAAQ,EAAE;QACR,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QACzB,IAAI,EAAE;YACJ,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC;YACxC,OAAO,EAAE,QAAQ;SAClB;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,MAAM,CAAC;YACrC,OAAO,EAAE,QAAQ;SAClB;QACD,KAAK,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QAC7B,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KAG7B;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;KACjB;CAC8B,CAAA;AAEjC,MAAM,QAAQ,GAAkC,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,MAAM,oBAAK,IAAI,EAAG,CAAA;AAE7E,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,KAAK;IACX,KAAK,EAAE,KAAK;CACb,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,KAAK;IACX,KAAK,EAAE,KAAK;CACb,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACtC,KAAK,CAAC,IAAI,GAAG;IACX,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,OAAO;IACb,IAAI,EAAE,KAAK;IACX,KAAK,EAAE,KAAK;CACb,CAAA"}

package/dist/esm/components/Button/Button.styles.d.ts

@@ -0,0 +1,8 @@
+interface IButtonElement {
+    mode: string;
+    size: string;
+    right: boolean;
+    left: boolean;
+}
+export declare const ButtonElement: import("styled-components").StyledComponent<"button", any, IButtonElement, never>;
+export {};

package/dist/esm/components/Button/Button.styles.js

@@ -0,0 +1,60 @@
+import { lighten } from 'polished';
+import styled from 'styled-components';
+import { Theme } from '../../Theme/Theme';
+export const ButtonElement = styled.button `
+  transition: 300ms;
+  border-radius: ${Theme.borderRadius.s};
+  overflow: hidden;
+  cursor: pointer;
+  box-sizing: border-box;
+  margin-left: ${(p) => (p.right ? Theme.padding.m : '0')};
+  margin-right: ${(p) => (p.left ? Theme.padding.m : '0')};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  display: flex;
+
+  ${(p) => p.mode === 'primary' &&
+    `background-color: ${Theme.colors.primary};
+    color: ${Theme.colors.white};
+    border: 1px solid rgba(0,0,0,0.15);`}
+  ${(p) => p.mode === 'inverse' &&
+    `background-color: ${Theme.colors.white};
+    color: ${Theme.colors.primary};
+    border: 1px solid ${Theme.colors.primary};
+    `}
+  ${(p) => p.mode === 'ghost' &&
+    `background-color:transparent;
+    color: ${Theme.colors.primary};
+    border:none;`}
+  ${(p) => p.size === 'regular' &&
+    `font-size: ${Theme.fontSize.m};
+    line-height: ${Theme.lineHeight.m};
+    padding: ${Theme.padding.m} ${Theme.padding.l};`}
+  ${(p) => p.size === 'small' &&
+    `font-size: ${Theme.fontSize.s};
+    line-height: ${Theme.lineHeight.s};
+    padding: ${Theme.padding.s} ${Theme.padding.m};`}
+  ${(p) => p.size === 'flat' &&
+    `font-size: ${Theme.fontSize.m};
+    line-height: ${Theme.lineHeight.m};
+    padding: ${Theme.padding.s} ${Theme.padding.s};`}
+  &:hover {
+    transition: 300ms;
+    ${(p) => p.mode === 'primary' &&
+    `background-color: ${lighten(0.1, Theme.colors.primary)};`}
+    ${(p) => p.mode === 'inverse' &&
+    `background-color: ${lighten(0.4, Theme.colors.primary)}`};
+    ${(p) => p.mode === 'ghost' && `color: ${lighten(0.2, Theme.colors.primary)};`}
+  }
+
+  &.disable,
+  button[disabled] {
+    color: ${Theme.colors.disableText};
+    cursor: default;
+    &:hover {
+      color: ${Theme.colors.disableBackground};
+    }
+  }
+`;
+//# sourceMappingURL=Button.styles.js.map

package/dist/esm/components/Button/Button.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.styles.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.styles.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAClC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AASzC,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,CAAgB;;mBAEvC,KAAK,CAAC,YAAY,CAAC,CAAC;;;;iBAItB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;kBACvC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;;;;;;IAMrD,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,SAAS;IACpB,qBAAqB,KAAK,CAAC,MAAM,CAAC,OAAO;aAChC,KAAK,CAAC,MAAM,CAAC,KAAK;wCACS;IACpC,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,SAAS;IACpB,qBAAqB,KAAK,CAAC,MAAM,CAAC,KAAK;aAC9B,KAAK,CAAC,MAAM,CAAC,OAAO;wBACT,KAAK,CAAC,MAAM,CAAC,OAAO;KACvC;IACD,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,OAAO;IAClB;aACS,KAAK,CAAC,MAAM,CAAC,OAAO;iBAChB;IACb,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,SAAS;IACpB,cAAc,KAAK,CAAC,QAAQ,CAAC,CAAC;mBACf,KAAK,CAAC,UAAU,CAAC,CAAC;eACtB,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,GAAG;IAChD,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,OAAO;IAClB,cAAc,KAAK,CAAC,QAAQ,CAAC,CAAC;mBACf,KAAK,CAAC,UAAU,CAAC,CAAC;eACtB,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,GAAG;IAChD,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,MAAM;IACjB,cAAc,KAAK,CAAC,QAAQ,CAAC,CAAC;mBACf,KAAK,CAAC,UAAU,CAAC,CAAC;eACtB,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,GAAG;;;MAG9C,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,SAAS;IACpB,qBAAqB,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG;MAC1D,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,SAAS;IACpB,qBAAqB,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE;MACzD,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,IAAI,KAAK,OAAO,IAAI,UAAU,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG;;;;;aAK9D,KAAK,CAAC,MAAM,CAAC,WAAW;;;eAGtB,KAAK,CAAC,MAAM,CAAC,iBAAiB;;;CAG5C,CAAA"}

package/dist/esm/components/Button/index.d.ts

@@ -0,0 +1 @@
+export { Button } from './Button';

package/dist/esm/components/Button/index.js

@@ -0,0 +1,2 @@
+export { Button } from './Button';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAA"}

package/dist/esm/components/Icons/Icon.d.ts

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+export interface IIconActionProps {
+    name: string;
+    size?: number;
+    color?: string;
+    bgColor?: boolean;
+    onClick?: () => void;
+}
+export declare const Icon: FC<IIconActionProps>;

package/dist/esm/components/Icons/Icon.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import { Theme } from '../../Theme/Theme';
+import { IconElement } from './Icon.styles';
+import { iconsPath } from './IconsPath';
+export const Icon = ({ size = 24, name, color = Theme.colors.text, bgColor, onClick, }) => {
+    return (React.createElement(IconElement, { onClick: onClick, bgColor: bgColor },
+        React.createElement("svg", { width: size, height: size, viewBox: '0 0 48 48', preserveAspectRatio: "xMidYMid meet", x: "0", y: "0", name: name },
+            React.createElement("path", { d: iconsPath[name], fill: color }))));
+};
+//# sourceMappingURL=Icon.js.map

package/dist/esm/components/Icons/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../../src/components/Icons/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AASvC,MAAM,CAAC,MAAM,IAAI,GAAyB,CAAC,EACzC,IAAI,GAAG,EAAE,EACT,IAAI,EACJ,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,EACzB,OAAO,EACP,OAAO,GACR,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO;QAC7C,6BACE,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,WAAW,EACpB,mBAAmB,EAAC,eAAe,EACnC,CAAC,EAAC,GAAG,EACL,CAAC,EAAC,GAAG,EACL,IAAI,EAAE,IAAI;YAEV,8BAAM,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,GAAI,CACrC,CACM,CACf,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/components/Icons/Icon.stories.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+declare const _default: ComponentMeta<React.FC<import("./Icon").IIconActionProps>>;
+export default _default;
+export declare const Default: ComponentStory<React.FC<import("./Icon").IIconActionProps>>;
+export declare const Size: ComponentStory<React.FC<import("./Icon").IIconActionProps>>;
+export declare const Color: ComponentStory<React.FC<import("./Icon").IIconActionProps>>;
+export declare const ActionDefault: ComponentStory<React.FC<import("./Icon").IIconActionProps>>;
+export declare const ActionColor: ComponentStory<React.FC<import("./Icon").IIconActionProps>>;

package/dist/esm/components/Icons/Icon.stories.js

@@ -0,0 +1,54 @@
+import React from 'react';
+import { Icon } from './Icon';
+import { Theme } from '../../Theme/Theme';
+import { Aligment } from '../Aligment';
+export default {
+    title: 'Elements/Icon',
+    component: Icon,
+    argTypes: {
+        name: {
+            options: ['person', 'menu', 'remove', 'add', 'close'],
+            control: 'select',
+        },
+        size: { control: 'number' },
+        color: { control: { type: 'color' } },
+        bgColor: { control: 'boolean' },
+    },
+    args: {
+        onClick: undefined
+    }
+};
+const Template = (args) => (React.createElement(Icon, Object.assign({}, args)));
+export const Default = Template.bind({});
+Default.args = {
+    name: 'person',
+    size: 48
+};
+export const Size = Template.bind({});
+Size.args = {
+    name: 'person',
+    size: 24
+};
+export const Color = Template.bind({});
+Color.args = {
+    name: 'person',
+    size: 48,
+    color: Theme.colors.primary
+};
+export const ActionDefault = Template.bind({});
+ActionDefault.args = {
+    name: 'person',
+    size: 48,
+    onClick: () => console.log('click')
+};
+const DarkTemplate = (args) => (React.createElement(Aligment, { backgroundColor: Theme.colors.black },
+    React.createElement(Icon, Object.assign({}, args))));
+export const ActionColor = DarkTemplate.bind({});
+ActionColor.args = {
+    name: 'person',
+    size: 48,
+    bgColor: true,
+    color: Theme.colors.white,
+    onClick: () => console.log('click')
+};
+//# sourceMappingURL=Icon.stories.js.map

package/dist/esm/components/Icons/Icon.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.stories.js","sourceRoot":"","sources":["../../../../src/components/Icons/Icon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAEtC,eAAe;IACb,KAAK,EAAE,eAAe;IAEtB,SAAS,EAAE,IAAI;IACf,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,CAAC;YACrD,OAAO,EAAE,QAAQ;SAClB;QACD,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;QAC3B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE;QACrC,OAAO,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KAChC;IACD,IAAI,EAAE;QACJ,OAAO,EAAE,SAAS;KACnB;CAC4B,CAAA;AAE/B,MAAM,QAAQ,GAAgC,CAAC,IAAI,EAAE,EAAE,CAAC,CACtD,oBAAC,IAAI,oBAAK,IAAI,EAAG,CAClB,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAE;IACZ,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,EAAE;CACT,CAAA;AACD,MAAM,CAAC,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACrC,IAAI,CAAC,IAAI,GAAE;IACT,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,EAAE;CACT,CAAA;AACD,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACtC,KAAK,CAAC,IAAI,GAAE;IACV,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,EAAE;IACR,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO;CAC5B,CAAA;AACD,MAAM,CAAC,MAAM,aAAa,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC9C,aAAa,CAAC,IAAI,GAAE;IAClB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,EAAE;IACR,OAAO,EAAE,GAAE,EAAE,CAAA,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC;CAClC,CAAA;AACD,MAAM,YAAY,GAAgC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC1D,oBAAC,QAAQ,IAAC,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK;IAAE,oBAAC,IAAI,oBAAK,IAAI,EAAG,CAAW,CAC5E,CAAA;AACD,MAAM,CAAC,MAAM,WAAW,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAChD,WAAW,CAAC,IAAI,GAAE;IAChB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,EAAE;IACR,OAAO,EAAE,IAAI;IACb,KAAK,EAAC,KAAK,CAAC,MAAM,CAAC,KAAK;IACxB,OAAO,EAAE,GAAE,EAAE,CAAA,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC;CAClC,CAAA"}

package/dist/esm/components/Icons/Icon.styles.d.ts

@@ -0,0 +1,6 @@
+interface IIconElementProps {
+    bgColor?: boolean;
+    onClick?: () => void;
+}
+export declare const IconElement: import("styled-components").StyledComponent<"div", any, IIconElementProps, never>;
+export {};

package/dist/esm/components/Icons/Icon.styles.js

@@ -0,0 +1,23 @@
+import { lighten } from "polished";
+import styled from "styled-components";
+import { Theme } from "../../Theme/Theme";
+export const IconElement = styled.div `
+  transition: 300ms;
+  box-sizing: border-box;
+  width:auto;
+  display:inline-flex;
+  border-radius: ${Theme.borderRadius.s};
+  ${p => p.onClick !== undefined &&
+    `
+    padding: ${Theme.padding.s};
+    cursor:pointer;
+    &:hover{
+      background-color: ${p.bgColor ? `rgba(255,255,255,0.2)` : lighten(0.4, Theme.colors.primary)};
+      transition: 300ms;
+    }
+    svg{
+      cursor:pointer;
+    }
+  `}
+`;
+//# sourceMappingURL=Icon.styles.js.map

package/dist/esm/components/Icons/Icon.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.styles.js","sourceRoot":"","sources":["../../../../src/components/Icons/Icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAO1C,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAmB;;;;;mBAKrC,KAAK,CAAC,YAAY,CAAC,CAAC;IACnC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,KAAK,SAAS;IAC9B;eACa,KAAK,CAAC,OAAO,CAAC,CAAC;;;0BAGJ,CAAC,CAAC,OAAO,CAAC,CAAC,CAAE,uBAAuB,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAG;;;;;;GAOnG;CACD,CAAA"}

package/dist/esm/components/Icons/IconsPath.d.ts

@@ -0,0 +1,11 @@
+export declare const iconsPath: {
+    close: string;
+    add: string;
+    back: string;
+    delete: string;
+    remove: string;
+    person: string;
+    menu: string;
+    expand_more: string;
+    expand_less: string;
+};