venice-ui 1.0.5 → 1.0.7

package/dist/cjs/Theme/Theme.js

@@ -10,7 +10,7 @@ exports.Theme = {
         white: "#ffffff",
         black: "#333333",
         gray_1: "#b7b7b7",
-        overlayer: 'rgba(255,255,255,0.2)'
+        overlayer: 'rgba(0,0,0,0.4)'
     },
     fontSize: {
         xs: "12px",
@@ -43,7 +43,7 @@ exports.Theme = {
         l: '8px',
     },
     shadow: {
+        s: '0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);',
         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/cjs/components/Aligment/Aligment.styles.js

@@ -16,4 +16,3 @@ exports.Aligment = styled_components_1.default.div `
   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/cjs/components/Aligment/index.js

@@ -3,4 +3,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Aligment = void 0;
 var Aligment_styles_1 = require("./Aligment.styles");
 Object.defineProperty(exports, "Aligment", { enumerable: true, get: function () { return Aligment_styles_1.Aligment; } });
-//# sourceMappingURL=index.js.map

package/dist/cjs/components/Button/Button.js

@@ -10,4 +10,3 @@ const Button = ({ text, mode = 'primary', size = 'regular', right = false, left
     return (react_1.default.createElement(Button_styles_1.ButtonElement, { mode: mode, size: size, right: right, left: left, onClick: onClick }, text));
 };
 exports.Button = Button;
-//# sourceMappingURL=Button.js.map

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

@@ -63,4 +63,3 @@ exports.ButtonElement = styled_components_1.default.button `
     }
   }
 `;
-//# sourceMappingURL=Button.styles.js.map

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

@@ -3,4 +3,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Button = void 0;
 var Button_1 = require("./Button");
 Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return Button_1.Button; } });
-//# sourceMappingURL=index.js.map

package/dist/cjs/components/Card/Card.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Card = void 0;
+const Aligment_1 = require("../Aligment");
+const Button_1 = require("../Button");
+const Typography_1 = require("../Typography");
+const react_1 = __importDefault(require("react"));
+const Card_styles_1 = require("./Card.styles");
+const Card = ({ children, title, actionLabel, handleClick, height, }) => {
+    return (react_1.default.createElement(Card_styles_1.CardElement, { height: height },
+        (title || actionLabel) && (react_1.default.createElement(Aligment_1.Aligment, { justify: !title && actionLabel ? 'flex-end' : 'space-between' },
+            title && react_1.default.createElement(Typography_1.TextHeader, null, title),
+            handleClick && actionLabel && (react_1.default.createElement(Button_1.Button, { mode: "inverse", text: actionLabel, onClick: handleClick })))),
+        react_1.default.createElement(Card_styles_1.CardContent, null, children)));
+};
+exports.Card = Card;

package/dist/cjs/components/Card/Card.styles.js

@@ -0,0 +1,26 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardContent = exports.CardElement = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+const Theme_1 = require("../../Theme/Theme");
+exports.CardElement = styled_components_1.default.div `
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  padding: ${Theme_1.Theme.padding.l};
+  background-color: ${Theme_1.Theme.colors.white};
+  border-radius: ${Theme_1.Theme.borderRadius.m};
+  height: ${p => p.height ? p.height : '100%'};
+  box-shadow: ${Theme_1.Theme.shadow.s}
+`;
+exports.CardContent = styled_components_1.default.div `
+  box-sizing: border-box; 
+  display: flex;
+  padding-top:  ${Theme_1.Theme.padding.l};
+  width: 100%;
+  flex-direction: row;
+`;

package/dist/cjs/components/Card/index.js

@@ -0,0 +1,17 @@
+"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("./Card"), exports);

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

@@ -14,4 +14,3 @@ const Icon = ({ size = 24, name, color = Theme_1.Theme.colors.text, bgColor, onC
             react_1.default.createElement("path", { d: IconsPath_1.iconsPath[name], fill: color }))));
 };
 exports.Icon = Icon;
-//# sourceMappingURL=Icon.js.map

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

@@ -26,4 +26,3 @@ exports.IconElement = styled_components_1.default.div `
     }
   `}
 `;
-//# sourceMappingURL=Icon.styles.js.map

package/dist/cjs/components/Icons/IconsPath.js

@@ -12,4 +12,3 @@ exports.iconsPath = {
     expand_more: "m24 30.75-12-12 2.15-2.15L24 26.5l9.85-9.85L36 18.8Z",
     expand_less: "M14.15 30.75 12 28.6l12-12 12 11.95-2.15 2.15L24 20.85Z",
 };
-//# sourceMappingURL=IconsPath.js.map

package/dist/cjs/components/Icons/index.js

@@ -3,4 +3,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Icon = void 0;
 var Icon_1 = require("./Icon");
 Object.defineProperty(exports, "Icon", { enumerable: true, get: function () { return Icon_1.Icon; } });
-//# sourceMappingURL=index.js.map

package/dist/cjs/components/InputText/InputText.js

@@ -10,4 +10,3 @@ const InputText = ({ label, value, name, read = false, disable = false, size = "
     return react_1.default.createElement(InputText_styles_1.InputTextField, null);
 };
 exports.InputText = InputText;
-//# sourceMappingURL=InputText.js.map

package/dist/cjs/components/InputText/InputText.styles.js

@@ -22,4 +22,3 @@ exports.InputTextField = styled_components_1.default.input `
     border-color: ${Theme_1.Theme.colors.primary};
   }
 `;
-//# sourceMappingURL=InputText.styles.js.map

package/dist/cjs/components/InputText/index.js

@@ -3,4 +3,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.InputText = void 0;
 var InputText_1 = require("./InputText");
 Object.defineProperty(exports, "InputText", { enumerable: true, get: function () { return InputText_1.InputText; } });
-//# sourceMappingURL=index.js.map

package/dist/cjs/components/Modal/Modal.js

@@ -18,13 +18,12 @@ const Modal = ({ children, title, handleConfirm, handleClose, labelConfirm, labe
     };
     return (react_1.default.createElement(Modal_styles_1.ModalOverlayer, null,
         react_1.default.createElement(Modal_styles_1.ModalElement, { size: size },
-            react_1.default.createElement(Aligment_1.Aligment, { justify: !title ? 'flex-end' : 'space-between', vPadding: Theme_1.Theme.padding.m, hPadding: Theme_1.Theme.padding.m },
+            react_1.default.createElement(Aligment_1.Aligment, { justify: !title ? 'flex-end' : 'space-between', vPadding: Theme_1.Theme.padding.l, hPadding: Theme_1.Theme.padding.l },
                 title && react_1.default.createElement(Typography_1.TextHeader, null, title),
                 react_1.default.createElement(Icons_1.Icon, { onClick: handleClose, name: "close" })),
             react_1.default.createElement(common_1.ScrollCotainer, null, children),
-            react_1.default.createElement(Aligment_1.Aligment, { justify: 'flex-end', vPadding: Theme_1.Theme.padding.m, hPadding: Theme_1.Theme.padding.m },
+            react_1.default.createElement(Aligment_1.Aligment, { justify: 'flex-end', vPadding: Theme_1.Theme.padding.l, hPadding: Theme_1.Theme.padding.l },
                 react_1.default.createElement(Button_1.Button, { mode: isMultiButtons() ? 'inverse' : 'primary', onClick: () => handleClose(), text: labelClose, left: isMultiButtons() }),
                 handleConfirm && labelConfirm && (react_1.default.createElement(Button_1.Button, { onClick: handleConfirm, text: labelConfirm }))))));
 };
 exports.Modal = Modal;
-//# sourceMappingURL=Modal.js.map

package/dist/cjs/components/Modal/Modal.styles.js

@@ -37,4 +37,3 @@ exports.ModalElement = styled_components_1.default.div `
   ${p => p.size === 'large' && `max-width:100%`}
 
 `;
-//# sourceMappingURL=Modal.styles.js.map

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

@@ -3,4 +3,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Modal = void 0;
 var Modal_1 = require("./Modal");
 Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return Modal_1.Modal; } });
-//# sourceMappingURL=index.js.map

package/dist/cjs/components/Typography/Typography.styles.js

@@ -31,4 +31,3 @@ exports.TextLabel = styled_components_1.default.div `
   line-height: ${Theme_1.Theme.lineHeight.xs};
   font-weight: bold;
 `;
-//# sourceMappingURL=Typography.styles.js.map

package/dist/cjs/components/Typography/index.js

@@ -6,4 +6,3 @@ Object.defineProperty(exports, "Text", { enumerable: true, get: function () { re
 Object.defineProperty(exports, "TextHeader", { enumerable: true, get: function () { return Typography_styles_1.TextHeader; } });
 Object.defineProperty(exports, "TextSubHeader", { enumerable: true, get: function () { return Typography_styles_1.TextSubHeader; } });
 Object.defineProperty(exports, "TextLabel", { enumerable: true, get: function () { return Typography_styles_1.TextLabel; } });
-//# sourceMappingURL=index.js.map

package/dist/cjs/components/common/commonComponents.js

@@ -11,8 +11,7 @@ exports.Container = styled_components_1.default.div `
 `;
 exports.ScrollCotainer = styled_components_1.default.div `
   width: 100%;
-  padding: ${Theme_1.Theme.padding.l} ${Theme_1.Theme.padding.m};
+  padding: ${Theme_1.Theme.padding.m} ${Theme_1.Theme.padding.l};
   overflow: auto;
   box-sizing: border-box;
 `;
-//# sourceMappingURL=commonComponents.js.map

package/dist/cjs/components/common/index.js

@@ -15,4 +15,3 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./commonComponents"), exports);
-//# sourceMappingURL=index.js.map

package/dist/cjs/example/ExampleComponent.js

@@ -36,4 +36,3 @@ exports.ExampleTableHeader = styled_components_1.default.th `
   background-color:#dddddd;
   text-align: left;
 `;
-//# sourceMappingURL=ExampleComponent.js.map

package/dist/cjs/example/exampleVars.js

@@ -0,0 +1,101 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.longExampleText = exports.shortExampleText = void 0;
+exports.shortExampleText = `One ring to rule them all, one ring to find them`;
+exports.longExampleText = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla at
+            ultricies nulla. Aliquam suscipit, ante sollicitudin egestas
+            lacinia, odio ex mattis arcu, vitae molestie neque nunc a eros.
+            Morbi dictum nisl placerat quam fermentum mollis. Etiam efficitur,
+            metus nec tincidunt tempus, magna enim interdum lacus, eu lacinia
+            lorem quam eu est. Vestibulum sapien lorem, tempor nec ultricies sit
+            amet, tristique sed tellus. Proin felis dui, porta ut placerat vel,
+            gravida eget ipsum. Etiam neque elit, sodales nec erat pretium,
+            auctor volutpat sem. Aliquam imperdiet venenatis magna. Cras metus
+            ligula, suscipit ac quam sit amet, porttitor feugiat nibh. Aenean eu
+            libero convallis, fermentum eros sit amet, pellentesque ligula.
+            Fusce scelerisque justo sit amet nunc sollicitudin, vel varius odio
+            aliquam. Quisque euismod scelerisque urna at maximus. Aenean
+            elementum venenatis tellus, id posuere arcu pharetra nec. Proin
+            posuere mi id gravida maximus. Cras interdum, risus at tincidunt
+            convallis, felis dolor congue urna, vitae accumsan magna enim ut
+            elit. Ut dapibus enim ipsum, imperdiet ultrices arcu tempor quis.
+            Praesent eget facilisis dolor. Vestibulum ante mi, blandit at
+            sodales a, tristique sed odio. Pellentesque nec rhoncus sapien.
+            Quisque nec malesuada nisl. In facilisis felis ut velit ullamcorper,
+            a posuere odio interdum. Curabitur porttitor nunc nec mauris
+            suscipit, ac semper diam accumsan. Curabitur rhoncus varius dolor id
+            vulputate. Fusce sagittis urna et sapien suscipit porttitor.
+            Maecenas eget facilisis velit. In molestie, ligula nec pellentesque
+            rhoncus, sem libero dictum sem, in luctus massa est eget velit. Ut
+            aliquet velit velit, ut feugiat tellus ultrices vel. Quisque est
+            lacus, egestas feugiat lectus at, dignissim rhoncus nulla. Integer
+            quis orci sagittis erat aliquet porta quis id felis. Cras sapien
+            eros, vestibulum sed dui eu, commodo scelerisque nisi. Sed vel augue
+            arcu. Ut consequat pellentesque neque, consequat vestibulum urna
+            pulvinar sed. Sed pulvinar, metus a porttitor commodo, felis leo
+            dictum ante, in congue elit ante et justo. Nulla rhoncus dui eget
+            facilisis interdum. Nam pretium pellentesque aliquam. In euismod
+            dapibus rhoncus. Quisque purus diam, fringilla ac malesuada at,
+            euismod et dui. Nulla gravida libero molestie lacus feugiat, at
+            laoreet diam auctor. Nullam at sapien molestie, aliquam massa eget,
+            dapibus ipsum. Aliquam erat volutpat. Sed hendrerit convallis
+            fringilla. Mauris feugiat metus in sem vestibulum tempor. Cras vitae
+            faucibus enim, nec blandit ante. Aenean pharetra felis et aliquam
+            sodales. Integer at urna dictum, laoreet diam et, faucibus mi.
+            Phasellus eleifend aliquam dui, ut fermentum mauris. Aenean porta
+            risus vitae odio mollis pretium. Nam consequat lectus id dui
+            consequat ultricies. Pellentesque non diam a sem viverra pulvinar.
+            Ut maximus molestie risus, sed lacinia mauris blandit ultrices.
+            Suspendisse ac nisi ut nibh consequat faucibus. Lorem ipsum dolor
+            sit amet, consectetur adipiscing elit. Aliquam auctor interdum
+            mollis. Phasellus vitae molestie nibh. Vivamus in dignissim lacus.
+            Vivamus vel dui ac lacus porta sodales. Ut malesuada placerat ex ut
+            pretium. Fusce in volutpat ipsum, sed ornare lacus. In erat arcu,
+            sagittis vitae turpis in, blandit suscipit odio. Cras sed arcu
+            cursus, facilisis orci nec, egestas mauris. Donec ut mollis dolor.
+            Nulla ac laoreet lacus, mattis hendrerit ligula. Sed bibendum elit
+            id nisi luctus, eget volutpat ipsum egestas. Aliquam dignissim, ante
+            non cursus gravida, enim odio euismod ipsum, nec tempus quam nisl
+            vitae justo. Integer fringilla sagittis porttitor. Donec ut vehicula
+            dolor. Etiam nec tellus urna. Aliquam efficitur volutpat tortor eget
+            varius. Maecenas at posuere augue. Nam ac rhoncus ipsum. Donec
+            maximus pharetra elit sit amet auctor. Pellentesque habitant morbi
+            tristique senectus et netus et malesuada fames ac turpis egestas.
+            Maecenas nisi enim, efficitur id purus at, auctor sollicitudin nisl.
+            Aliquam eu fermentum ipsum. Vestibulum ante ipsum primis in faucibus
+            orci luctus et ultrices posuere cubilia curae; Phasellus varius
+            lacinia orci sit amet rutrum. Etiam lacinia justo non ultricies
+            fermentum. Praesent tellus orci, rutrum at iaculis hendrerit,
+            gravida id urna. Ut massa sem, lobortis non massa eu, sodales mattis
+            ante. Proin in quam non purus placerat ornare. Duis iaculis ipsum
+            odio. Nam commodo facilisis massa ut rutrum. Duis porta rhoncus urna
+            sit amet bibendum. Duis ornare dignissim turpis ac suscipit. Vivamus
+            faucibus risus et enim accumsan vehicula. Aenean ut ultrices risus,
+            quis vehicula nibh. Vestibulum accumsan tempor lectus, eu luctus
+            massa volutpat vitae. Pellentesque dictum vulputate augue, id
+            venenatis justo tempus id. Aenean non nibh eu elit sagittis
+            ultrices. Pellentesque nibh nisi, sollicitudin et varius in, aliquam
+            in sem. In ultrices sem odio, et laoreet risus aliquam ut. Donec nec
+            odio egestas, mattis ante eu, dictum sapien. Phasellus sed vulputate
+            mauris. Vestibulum vel imperdiet nisl, ac malesuada sapien.
+            Phasellus urna arcu, fringilla id lectus id, tristique elementum
+            sapien. Nunc pharetra massa vitae placerat convallis. Morbi euismod
+            arcu sem, a euismod est iaculis sed. Ut at ipsum a ipsum aliquam
+            feugiat eleifend sed lacus. Aenean nec tortor ante. Morbi eu ante
+            eget tortor tincidunt efficitur. Vivamus et ultricies enim. Proin a
+            magna eget justo ultrices consectetur vel id est. Proin quis sem
+            quis sapien malesuada finibus. Pellentesque vel ex augue. Sed
+            ullamcorper tellus id nulla viverra, pharetra tincidunt ante
+            tincidunt. Sed sagittis mauris id felis convallis pulvinar. Aliquam
+            erat volutpat. Maecenas rutrum est sed orci egestas, non dictum
+            purus pharetra. Proin non enim dictum, condimentum metus eget,
+            lacinia purus. In a lacus ante. Nam vel auctor libero, et venenatis
+            urna. Nunc euismod, tortor ac vestibulum consequat, diam orci
+            finibus eros, eu lacinia ex enim sit amet elit. Interdum et
+            malesuada fames ac ante ipsum primis in faucibus. Vivamus tincidunt
+            id nunc ut facilisis. Phasellus iaculis mauris nisi, ac ullamcorper
+            eros lacinia sit amet. Donec ultricies semper nisi, ut vehicula
+            risus euismod at. Praesent non mauris eros. Nam aliquam tellus eget
+            neque aliquam, sit amet accumsan tellus luctus. Morbi id ultrices
+            nisl. Ut euismod pulvinar augue in posuere. Vivamus in risus iaculis
+            quam hendrerit ornare sit amet eu enim. Ut id leo urna.`;

package/dist/cjs/example/index.js

@@ -15,4 +15,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./ExampleComponent"), exports);
-//# sourceMappingURL=index.js.map
+__exportStar(require("./exampleVars"), exports);

package/dist/cjs/index.js

@@ -14,10 +14,10 @@ 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("./components/InputText"), exports);
-__exportStar(require("./components/Modal"), exports);
 __exportStar(require("./components/Aligment"), exports);
-__exportStar(require("./components/Typography"), exports);
 __exportStar(require("./components/Button"), exports);
+__exportStar(require("./components/Card"), exports);
 __exportStar(require("./components/Icons"), exports);
-//# sourceMappingURL=index.js.map
+__exportStar(require("./components/InputText"), exports);
+__exportStar(require("./components/Modal"), exports);
+__exportStar(require("./components/Typography"), exports);

package/dist/cjs/types/index.js

@@ -15,4 +15,3 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./types"), exports);
-//# sourceMappingURL=index.js.map

package/dist/cjs/types/types.js

@@ -1,3 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=types.js.map

package/dist/esm/Theme/Theme.js

@@ -1,7 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Theme = void 0;
-exports.Theme = {
+export const Theme = {
     colors: {
         primary: "#4c95c5",
         text: '#333333',
@@ -10,7 +7,7 @@ exports.Theme = {
         white: "#ffffff",
         black: "#333333",
         gray_1: "#b7b7b7",
-        overlayer: 'rgba(255,255,255,0.2)'
+        overlayer: 'rgba(0,0,0,0.4)'
     },
     fontSize: {
         xs: "12px",
@@ -43,7 +40,7 @@ exports.Theme = {
         l: '8px',
     },
     shadow: {
+        s: '0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);',
         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/components/Aligment/Aligment.styles.js

@@ -1,11 +1,5 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Aligment = void 0;
-const styled_components_1 = __importDefault(require("styled-components"));
-exports.Aligment = styled_components_1.default.div `
+import styled from "styled-components";
+export const Aligment = styled.div `
   box-sizing: border-box;
   display: flex;
   width: ${p => p.width ? p.width : '100%'};
@@ -16,4 +10,3 @@ exports.Aligment = styled_components_1.default.div `
   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/index.js

@@ -1,6 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Aligment = void 0;
-var Aligment_styles_1 = require("./Aligment.styles");
-Object.defineProperty(exports, "Aligment", { enumerable: true, get: function () { return Aligment_styles_1.Aligment; } });
-//# sourceMappingURL=index.js.map
+export { Aligment } from './Aligment.styles';

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

@@ -1,13 +1,5 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+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));
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-const react_1 = __importDefault(require("react"));
-const Button_styles_1 = require("./Button.styles");
-const Button = ({ text, mode = 'primary', size = 'regular', right = false, left = false, onClick, }) => {
-    return (react_1.default.createElement(Button_styles_1.ButtonElement, { mode: mode, size: size, right: right, left: left, onClick: onClick }, text));
-};
-exports.Button = Button;
-//# sourceMappingURL=Button.js.map

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

@@ -1,66 +1,59 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ButtonElement = void 0;
-const polished_1 = require("polished");
-const styled_components_1 = __importDefault(require("styled-components"));
-const Theme_1 = require("../../Theme/Theme");
-exports.ButtonElement = styled_components_1.default.button `
+import { lighten } from 'polished';
+import styled from 'styled-components';
+import { Theme } from '../../Theme/Theme';
+export const ButtonElement = styled.button `
   transition: 300ms;
-  border-radius: ${Theme_1.Theme.borderRadius.s};
+  border-radius: ${Theme.borderRadius.s};
   overflow: hidden;
   cursor: pointer;
   box-sizing: border-box;
-  margin-left: ${(p) => (p.right ? Theme_1.Theme.padding.m : '0')};
-  margin-right: ${(p) => (p.left ? Theme_1.Theme.padding.m : '0')};
+  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_1.Theme.colors.primary};
-    color: ${Theme_1.Theme.colors.white};
+    `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_1.Theme.colors.white};
-    color: ${Theme_1.Theme.colors.primary};
-    border: 1px solid ${Theme_1.Theme.colors.primary};
+    `background-color: ${Theme.colors.white};
+    color: ${Theme.colors.primary};
+    border: 1px solid ${Theme.colors.primary};
     `}
   ${(p) => p.mode === 'ghost' &&
     `background-color:transparent;
-    color: ${Theme_1.Theme.colors.primary};
+    color: ${Theme.colors.primary};
     border:none;`}
   ${(p) => p.size === 'regular' &&
-    `font-size: ${Theme_1.Theme.fontSize.m};
-    line-height: ${Theme_1.Theme.lineHeight.m};
-    padding: ${Theme_1.Theme.padding.m} ${Theme_1.Theme.padding.l};`}
+    `font-size: ${Theme.fontSize.m};
+    line-height: ${Theme.lineHeight.m};
+    padding: ${Theme.padding.m} ${Theme.padding.l};`}
   ${(p) => p.size === 'small' &&
-    `font-size: ${Theme_1.Theme.fontSize.s};
-    line-height: ${Theme_1.Theme.lineHeight.s};
-    padding: ${Theme_1.Theme.padding.s} ${Theme_1.Theme.padding.m};`}
+    `font-size: ${Theme.fontSize.s};
+    line-height: ${Theme.lineHeight.s};
+    padding: ${Theme.padding.s} ${Theme.padding.m};`}
   ${(p) => p.size === 'flat' &&
-    `font-size: ${Theme_1.Theme.fontSize.m};
-    line-height: ${Theme_1.Theme.lineHeight.m};
-    padding: ${Theme_1.Theme.padding.s} ${Theme_1.Theme.padding.s};`}
+    `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: ${(0, polished_1.lighten)(0.1, Theme_1.Theme.colors.primary)};`}
+    `background-color: ${lighten(0.1, Theme.colors.primary)};`}
     ${(p) => p.mode === 'inverse' &&
-    `background-color: ${(0, polished_1.lighten)(0.4, Theme_1.Theme.colors.primary)}`};
-    ${(p) => p.mode === 'ghost' && `color: ${(0, polished_1.lighten)(0.2, Theme_1.Theme.colors.primary)};`}
+    `background-color: ${lighten(0.4, Theme.colors.primary)}`};
+    ${(p) => p.mode === 'ghost' && `color: ${lighten(0.2, Theme.colors.primary)};`}
   }
 
   &.disable,
   button[disabled] {
-    color: ${Theme_1.Theme.colors.disableText};
+    color: ${Theme.colors.disableText};
     cursor: default;
     &:hover {
-      color: ${Theme_1.Theme.colors.disableBackground};
+      color: ${Theme.colors.disableBackground};
     }
   }
 `;
-//# sourceMappingURL=Button.styles.js.map

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

@@ -1,6 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-var Button_1 = require("./Button");
-Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return Button_1.Button; } });
-//# sourceMappingURL=index.js.map
+export { Button } from './Button';

package/dist/esm/components/Card/Card.js

@@ -0,0 +1,12 @@
+import { Aligment } from '../Aligment';
+import { Button } from '../Button';
+import { TextHeader } from '../Typography';
+import React from 'react';
+import { CardContent, CardElement } from './Card.styles';
+export const Card = ({ children, title, actionLabel, handleClick, height, }) => {
+    return (React.createElement(CardElement, { height: height },
+        (title || actionLabel) && (React.createElement(Aligment, { justify: !title && actionLabel ? 'flex-end' : 'space-between' },
+            title && React.createElement(TextHeader, null, title),
+            handleClick && actionLabel && (React.createElement(Button, { mode: "inverse", text: actionLabel, onClick: handleClick })))),
+        React.createElement(CardContent, null, children)));
+};

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

@@ -0,0 +1,20 @@
+import styled from "styled-components";
+import { Theme } from "../../Theme/Theme";
+export const CardElement = styled.div `
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  padding: ${Theme.padding.l};
+  background-color: ${Theme.colors.white};
+  border-radius: ${Theme.borderRadius.m};
+  height: ${p => p.height ? p.height : '100%'};
+  box-shadow: ${Theme.shadow.s}
+`;
+export const CardContent = styled.div `
+  box-sizing: border-box; 
+  display: flex;
+  padding-top:  ${Theme.padding.l};
+  width: 100%;
+  flex-direction: row;
+`;

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

@@ -0,0 +1 @@
+export * from './Card';

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

@@ -1,17 +1,9 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+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 }))));
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Icon = void 0;
-const react_1 = __importDefault(require("react"));
-const Theme_1 = require("../../Theme/Theme");
-const Icon_styles_1 = require("./Icon.styles");
-const IconsPath_1 = require("./IconsPath");
-const Icon = ({ size = 24, name, color = Theme_1.Theme.colors.text, bgColor, onClick, }) => {
-    return (react_1.default.createElement(Icon_styles_1.IconElement, { onClick: onClick, bgColor: bgColor },
-        react_1.default.createElement("svg", { width: size, height: size, viewBox: '0 0 48 48', preserveAspectRatio: "xMidYMid meet", x: "0", y: "0", name: name },
-            react_1.default.createElement("path", { d: IconsPath_1.iconsPath[name], fill: color }))));
-};
-exports.Icon = Icon;
-//# sourceMappingURL=Icon.js.map