norma-library 0.5.74 → 0.5.76

package/dist/esm/components/Modal.js

@@ -1,13 +1,14 @@
 import { __assign, __makeTemplateObject, __rest } from "tslib";
 import React from 'react';
-import { Modal as MuiModal, Paper, Box } from '@mui/material';
+import { Modal as MuiModal, Paper, Box, Typography } from '@mui/material';
 import { styled } from '@mui/material/styles';
 import { IconButton } from './IconButton';
 import { Button } from './Button';
 var ModalStyled = styled(MuiModal)({});
-var ModalContentStyled = styled(Paper)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border: 1px solid #00000033;\n  border-radius: 4px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 421px;\n  transform: translate(-50%, -50%);\n  bgcolor: background.paper;\n  box-shadow: 24px;\n  padding: 16px;\n"], ["\n  border: 1px solid #00000033;\n  border-radius: 4px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 421px;\n  transform: translate(-50%, -50%);\n  bgcolor: background.paper;\n  box-shadow: 24px;\n  padding: 16px;\n"])));
-var ModalHeaderStyled = styled(Box)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  text-align: left;\n  border-bottom: 1px solid #00000033;\n  margin: 0;\n  top: -5px;\n  position: relative;\n  padding: 0 5px;\n  display: flex;\n\n  & h2 {\n    font: normal normal 600 18px/30px Source Sans Pro;\n    color: #292929;\n  }\n"], ["\n  text-align: left;\n  border-bottom: 1px solid #00000033;\n  margin: 0;\n  top: -5px;\n  position: relative;\n  padding: 0 5px;\n  display: flex;\n\n  & h2 {\n    font: normal normal 600 18px/30px Source Sans Pro;\n    color: #292929;\n  }\n"])));
-var ModalFooterStyled = styled(Box)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  text-align: left;\n  border-top: 1px solid #00000033;\n  margin-top: 16px;\n  bottom: -5px;\n  position: relative;\n  padding: 10px 5px 5px;\n  display: flex;\n  justify-content: end;\n"], ["\n  text-align: left;\n  border-top: 1px solid #00000033;\n  margin-top: 16px;\n  bottom: -5px;\n  position: relative;\n  padding: 10px 5px 5px;\n  display: flex;\n  justify-content: end;\n"])));
+var ModalContentStyled = styled(Paper)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border: 1px solid #00000033;\n  border-radius: 4px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 421px;\n  transform: translate(-50%, -50%);\n  bgcolor: background.paper;\n  box-shadow: 24px;\n"], ["\n  border: 1px solid #00000033;\n  border-radius: 4px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 421px;\n  transform: translate(-50%, -50%);\n  bgcolor: background.paper;\n  box-shadow: 24px;\n"])));
+var ModalHeaderStyled = styled(Box)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  text-align: left;\n  border-bottom: 1px solid #00000033;\n  box-sizing: border-box;\n  margin: 0;\n  position: relative;\n  padding: 22px 26px 15px 26px;\n  justify-content: space-between;\n  display: flex;\n\n  & h2 {\n    font: normal normal 600 18px/30px Source Sans Pro;\n    color: #292929;\n  }\n"], ["\n  text-align: left;\n  border-bottom: 1px solid #00000033;\n  box-sizing: border-box;\n  margin: 0;\n  position: relative;\n  padding: 22px 26px 15px 26px;\n  justify-content: space-between;\n  display: flex;\n\n  & h2 {\n    font: normal normal 600 18px/30px Source Sans Pro;\n    color: #292929;\n  }\n"])));
+var ModalFooterStyled = styled(Box)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  border-top: 1px solid #00000033;\n  box-sizing: border-box;\n  position: relative;\n  padding: 24px;\n  display: flex;\n  justify-content: end;\n  gap: 24px;\n"], ["\n  border-top: 1px solid #00000033;\n  box-sizing: border-box;\n  position: relative;\n  padding: 24px;\n  display: flex;\n  justify-content: end;\n  gap: 24px;\n"])));
+var ModalContainerChildrenStyled = styled(Box)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  box-sizing: border-box;\n  padding: 24px;\n"], ["\n  box-sizing: border-box;\n  padding: 24px;\n"])));
 export function Close() {
     return (React.createElement("svg", { fill: "#808080", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", height: "24", width: "24" },
         React.createElement("path", { clipRule: "evenodd", fillRule: "evenodd", d: "M5.47 5.47a.75.75 0 011.06 0L12 10.94l5.47-5.47a.75.75 0 111.06 1.06L13.06 12l5.47 5.47a.75.75 0 11-1.06 1.06L12 13.06l-5.47 5.47a.75.75 0 01-1.06-1.06L10.94 12 5.47 6.53a.75.75 0 010-1.06z" })));
@@ -17,12 +18,11 @@ export var Modal = function (_a) {
     return (React.createElement(ModalStyled, __assign({ open: true }, props),
         React.createElement(ModalContentStyled, null,
             props.title && (React.createElement(ModalHeaderStyled, null,
-                React.createElement(React.Fragment, null,
-                    React.createElement("h2", null, props.title),
-                    React.createElement(IconButton, { onClick: props.onClose, size: "small", color: "inherit", variant: "text", cursor: "pointer", sx: { position: 'absolute', right: 0, top: 5 } },
-                        React.createElement(Close, null))))),
-            children,
-            props.action && (React.createElement(ModalFooterStyled, null, props.action.map(function (item, key) { return (React.createElement(Button, { color: item.color, variant: item.variant, key: key, onClick: item.action, style: { marginLeft: 10 } }, item.label)); }))))));
+                React.createElement(Typography, { variant: 'h2' }, props.title),
+                React.createElement(IconButton, { onClick: props.onClose, size: "small", color: "inherit", variant: "text", cursor: "pointer", sx: { padding: "0" } },
+                    React.createElement(Close, null)))),
+            React.createElement(ModalContainerChildrenStyled, null, children),
+            props.action && (React.createElement(ModalFooterStyled, null, props.action.map(function (item, key) { return (React.createElement(Button, { color: item.color, variant: item.variant, key: key, onClick: item.action, size: item.size }, item.label)); }))))));
 };
-var templateObject_1, templateObject_2, templateObject_3;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
 //# sourceMappingURL=Modal.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,IAAI,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAE9D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,IAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC;AAEzC,IAAM,kBAAkB,GAAG,MAAM,CAAC,KAAK,CAAC,2SAAA,wOAWvC,IAAA,CAAC;AAEF,IAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,yTAAA,sPAapC,IAAA,CAAC;AAEF,IAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,kQAAA,+LASpC,IAAA,CAAC;AAEF,MAAM,UAAU,KAAK;IACnB,OAAO,CACL,6BACE,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,MAAM,EAAC,IAAI,EACX,KAAK,EAAC,IAAI;QAEV,8BACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,+LAA+L,GACjM,CACE,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,IAAM,KAAK,GAAG,UAAC,EAA4C;IAA1C,IAAA,IAAI,UAAA,EAAE,QAAQ,cAAA,EAAK,KAAK,cAA1B,oBAA4B,CAAF;IAE9C,OAAO,CACL,oBAAC,WAAW,aAAC,IAAI,UAAK,KAAK;QACzB,oBAAC,kBAAkB;YAChB,KAAK,CAAC,KAAK,IAAI,CACd,oBAAC,iBAAiB;gBAChB;oBACE,gCAAK,KAAK,CAAC,KAAK,CAAM;oBACtB,oBAAC,UAAU,IACT,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,SAAS,EACf,OAAO,EAAC,MAAM,EACd,MAAM,EAAC,SAAS,EAChB,EAAE,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE;wBAE9C,oBAAC,KAAK,OAAG,CACE,CACZ,CACe,CACrB;YACA,QAAQ;YACR,KAAK,CAAC,MAAM,IAAI,CACf,oBAAC,iBAAiB,QACf,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,GAAG,IAAK,OAAA,CAC/B,oBAAC,MAAM,IACL,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,IAAI,CAAC,MAAM,EACpB,KAAK,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,IAExB,IAAI,CAAC,KAAK,CACJ,CACV,EAVgC,CAUhC,CAAC,CACgB,CACrB,CACkB,CACT,CACf,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,IAAI,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE1E,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,IAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC;AAEzC,IAAM,kBAAkB,GAAG,MAAM,CAAC,KAAK,CAAC,yRAAA,sNAUvC,IAAA,CAAC;AAEF,IAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,uXAAA,oTAcpC,IAAA,CAAC;AAEF,IAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,wOAAA,qKAQpC,IAAA,CAAC;AAEF,IAAM,4BAA4B,GAAG,MAAM,CAAC,GAAG,CAAC,oHAAA,iDAG/C,IAAA,CAAC;AAEF,MAAM,UAAU,KAAK;IACnB,OAAO,CACL,6BACE,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,MAAM,EAAC,IAAI,EACX,KAAK,EAAC,IAAI;QAEV,8BACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,+LAA+L,GACjM,CACE,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,IAAM,KAAK,GAAG,UAAC,EAA4C;IAA1C,IAAA,IAAI,UAAA,EAAE,QAAQ,cAAA,EAAK,KAAK,cAA1B,oBAA4B,CAAF;IAE9C,OAAO,CACL,oBAAC,WAAW,aAAC,IAAI,UAAK,KAAK;QACzB,oBAAC,kBAAkB;YAChB,KAAK,CAAC,KAAK,IAAI,CACd,oBAAC,iBAAiB;gBAChB,oBAAC,UAAU,IAAC,OAAO,EAAC,IAAI,IAAE,KAAK,CAAC,KAAK,CAAc;gBACnD,oBAAC,UAAU,IACT,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,SAAS,EACf,OAAO,EAAC,MAAM,EACd,MAAM,EAAC,SAAS,EAChB,EAAE,EAAE,EAAC,OAAO,EAAE,GAAG,EAAC;oBAElB,oBAAC,KAAK,OAAG,CACE,CACK,CACrB;YACD,oBAAC,4BAA4B,QAC1B,QAAQ,CACoB;YAC9B,KAAK,CAAC,MAAM,IAAI,CACf,oBAAC,iBAAiB,QACf,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,GAAG,IAAK,OAAA,CAC/B,oBAAC,MAAM,IACL,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,IAAI,CAAC,MAAM,EACpB,IAAI,EAAE,IAAI,CAAC,IAAI,IAEd,IAAI,CAAC,KAAK,CACJ,CACV,EAVgC,CAUhC,CAAC,CACgB,CACrB,CACkB,CACT,CACf,CAAC;AACJ,CAAC,CAAC"}

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import { TabsBaseProps } from '../interfaces';
-export declare const Tabs: ({ data, color, ...props }: TabsBaseProps) => React.JSX.Element;
+export declare const Tabs: ({ data, color, onChange, ...props }: TabsBaseProps) => React.JSX.Element;

package/dist/esm/components/Tabs.js

@@ -58,11 +58,12 @@ function a11yProps(index) {
     };
 }
 export var Tabs = function (_a) {
-    var _b = _a.data, data = _b === void 0 ? [] : _b, _c = _a.color, color = _c === void 0 ? 'primary' : _c, props = __rest(_a, ["data", "color"]);
+    var _b = _a.data, data = _b === void 0 ? [] : _b, _c = _a.color, color = _c === void 0 ? 'primary' : _c, onChange = _a.onChange, props = __rest(_a, ["data", "color", "onChange"]);
     var _d = React.useState(0), value = _d[0], setValue = _d[1];
     var handleChange = function (event, newValue) {
         setValue(newValue);
-        console.log(event);
+        if (!!onChange)
+            onChange(event, newValue);
     };
     return (React.createElement(Box, { sx: { width: '100%' } },
         React.createElement(Box, null,

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "norma-library",
-  "version": "0.5.74",
+  "version": "0.5.76",
   "private": false,
   "description": "Olos/Norma-DS. Design System based on Material UI, developed with TypeScript and Styled Components to create reusable and consistent components in web applications.",
   "scripts": {

package/src/components/Modal.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Modal as MuiModal, Paper, Box } from '@mui/material';
+import { Modal as MuiModal, Paper, Box, Typography } from '@mui/material';
 import { ModalBaseProps } from '../interfaces';
 import { styled } from '@mui/material/styles';
 import { IconButton } from './IconButton';
@@ -17,16 +17,16 @@ const ModalContentStyled = styled(Paper)`
   transform: translate(-50%, -50%);
   bgcolor: background.paper;
   box-shadow: 24px;
-  padding: 16px;
 `;
 
 const ModalHeaderStyled = styled(Box)`
   text-align: left;
   border-bottom: 1px solid #00000033;
+  box-sizing: border-box;
   margin: 0;
-  top: -5px;
   position: relative;
-  padding: 0 5px;
+  padding: 22px 26px 15px 26px;
+  justify-content: space-between;
   display: flex;
 
   & h2 {
@@ -36,14 +36,18 @@ const ModalHeaderStyled = styled(Box)`
 `;
 
 const ModalFooterStyled = styled(Box)`
-  text-align: left;
   border-top: 1px solid #00000033;
-  margin-top: 16px;
-  bottom: -5px;
+  box-sizing: border-box;
   position: relative;
-  padding: 10px 5px 5px;
+  padding: 24px;
   display: flex;
   justify-content: end;
+  gap: 24px;
+`;
+
+const ModalContainerChildrenStyled = styled(Box)`
+  box-sizing: border-box;
+  padding: 24px;
 `;
 
 export function Close() {
@@ -72,22 +76,22 @@ export const Modal = ({ open, children, ...props }: ModalBaseProps) => {
       <ModalContentStyled>
         {props.title && (
           <ModalHeaderStyled>
-            <>
-              <h2>{props.title}</h2>
-              <IconButton
-                onClick={props.onClose}
-                size="small"
-                color="inherit"
-                variant="text"
-                cursor="pointer"
-                sx={{ position: 'absolute', right: 0, top: 5 }}
-              >
-                <Close />
-              </IconButton>
-            </>
+            <Typography variant='h2'>{props.title}</Typography>
+            <IconButton
+              onClick={props.onClose}
+              size="small"
+              color="inherit"
+              variant="text"
+              cursor="pointer"
+              sx={{padding: "0"}}
+            >
+              <Close />
+            </IconButton>
           </ModalHeaderStyled>
         )}
-        {children}
+        <ModalContainerChildrenStyled>
+          {children}
+        </ModalContainerChildrenStyled>
         {props.action && (
           <ModalFooterStyled>
             {props.action.map((item, key) => (
@@ -96,7 +100,7 @@ export const Modal = ({ open, children, ...props }: ModalBaseProps) => {
                 variant={item.variant}
                 key={key}
                 onClick={item.action}
-                style={{ marginLeft: 10 }}
+                size={item.size}
               >
                 {item.label}
               </Button>

package/src/components/Tabs.tsx

@@ -80,12 +80,12 @@ function a11yProps(index: number) {
   };
 }
 
-export const Tabs = ({ data = [], color = 'primary', ...props }: TabsBaseProps) => {
+export const Tabs = ({ data = [], color = 'primary', onChange, ...props }: TabsBaseProps) => {
   const [value, setValue] = React.useState(0);
 
   const handleChange = (event: React.SyntheticEvent, newValue: number) => {
     setValue(newValue);
-    console.log(event);
+    if(!!onChange) onChange(event, newValue)
   };
 
   return (

package/src/stories/Tabs.stories.tsx

@@ -54,7 +54,7 @@ export const Playground: Story = {
 export const TabsBasic = () => {
   return (
     <div style={{ width: '480px', marginBottom: 30 }}>
-      <Tabs data={data} />
+      <Tabs data={data} onChange={(e, value) => console.log(e, value)} />
     </div>
   );
 };