norma-library 0.5.144 → 0.5.146

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/dist/esm/components/StatusModal/StatusModal.d.ts +1 -0
  2. package/dist/esm/components/StatusModal/StatusModal.js +2 -2
  3. package/dist/esm/components/StatusModal/StatusModal.js.map +1 -1
  4. package/dist/esm/components/StatusModal/StatusModal.style.d.ts +3 -1
  5. package/dist/esm/components/StatusModal/StatusModal.style.js +3 -3
  6. package/dist/esm/components/StatusModal/StatusModal.style.js.map +1 -1
  7. package/package.json +1 -1
  8. package/src/components/StatusModal/StatusModal.style.tsx +4 -3
  9. package/src/components/StatusModal/StatusModal.tsx +3 -2
package/dist/esm/components/StatusModal/StatusModal.d.ts CHANGED
@@ -5,6 +5,7 @@ interface ModalStatusProps {
5
5
  text: string;
6
6
  type: 'success' | 'info' | 'warning';
7
7
  actions: OnAction[];
8
+ w?: string;
8
9
  }
9
10
  export declare const ModalStatus: (props: ModalStatusProps) => React.JSX.Element;
10
11
  export {};
package/dist/esm/components/StatusModal/StatusModal.js CHANGED
@@ -3,14 +3,14 @@ import { WarningRounded, CheckCircleRounded, InfoRounded } from '@mui/icons-mate
3
3
  import * as S from './StatusModal.style';
4
4
  import { Button } from '../Button';
5
5
  export var ModalStatus = function (props) {
6
- var title = props.title, text = props.text, type = props.type, actions = props.actions;
6
+ var title = props.title, text = props.text, type = props.type, actions = props.actions, w = props.w;
7
7
  var iconBgColor = {
8
8
  warning: '#FFDB9F',
9
9
  info: '#D9FCFE',
10
10
  success: '#C9F5CB',
11
11
  };
12
12
  return (React.createElement(S.Container, null,
13
- React.createElement(S.Modal, null,
13
+ React.createElement(S.Modal, { "$w": w },
14
14
  React.createElement(S.ModalHeader, null,
15
15
  React.createElement(S.ModalIcon, { "$bg": iconBgColor[type] },
16
16
  type === 'warning' && React.createElement(WarningRounded, { sx: { fill: '#B74608' } }),
package/dist/esm/components/StatusModal/StatusModal.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"StatusModal.js","sourceRoot":"","sources":["../../../../src/components/StatusModal/StatusModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAEtF,OAAO,KAAK,CAAC,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAUnC,MAAM,CAAC,IAAM,WAAW,GAAG,UAAC,KAAuB;IACzC,IAAA,KAAK,GAA0B,KAAK,MAA/B,EAAE,IAAI,GAAoB,KAAK,KAAzB,EAAE,IAAI,GAAc,KAAK,KAAnB,EAAE,OAAO,GAAK,KAAK,QAAV,CAAW;IAE7C,IAAM,WAAW,GAAG;QAClB,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;QACf,OAAO,EAAE,SAAS;KACnB,CAAC;IAEF,OAAO,CACL,oBAAC,CAAC,CAAC,SAAS;QACV,oBAAC,CAAC,CAAC,KAAK;YACN,oBAAC,CAAC,CAAC,WAAW;gBACZ,oBAAC,CAAC,CAAC,SAAS,WAAM,WAAW,CAAC,IAAI,CAAC;oBAChC,IAAI,KAAK,SAAS,IAAI,oBAAC,cAAc,IAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,GAAI;oBACjE,IAAI,KAAK,MAAM,IAAI,oBAAC,WAAW,IAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,GAAI;oBAC3D,IAAI,KAAK,SAAS,IAAI,oBAAC,kBAAkB,IAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,GAAI,CAC1D;gBACd,oBAAC,CAAC,CAAC,UAAU,QAAE,KAAK,CAAgB,CACtB;YAChB,oBAAC,CAAC,CAAC,SAAS;gBACV,oBAAC,CAAC,CAAC,SAAS,QAAE,IAAI,CAAe,CACrB;YACd,oBAAC,CAAC,CAAC,WAAW,QACX,OAAO,CAAC,GAAG,CAAC,UAAC,MAAM,EAAE,GAAG;gBACvB,OAAO,CACL,oBAAC,MAAM,IACL,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,SAAS,EAChC,OAAO,EAAE,MAAM,CAAC,OAAO,IAAI,WAAW,EACtC,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,OAAO,EAAE,MAAM,CAAC,MAAM,IAErB,MAAM,CAAC,KAAK,CACN,CACV,CAAC;YACJ,CAAC,CAAC,CACY,CACR,CACE,CACf,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"StatusModal.js","sourceRoot":"","sources":["../../../../src/components/StatusModal/StatusModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAEtF,OAAO,KAAK,CAAC,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAWnC,MAAM,CAAC,IAAM,WAAW,GAAG,UAAC,KAAuB;IACzC,IAAA,KAAK,GAA6B,KAAK,MAAlC,EAAE,IAAI,GAAuB,KAAK,KAA5B,EAAE,IAAI,GAAiB,KAAK,KAAtB,EAAE,OAAO,GAAQ,KAAK,QAAb,EAAE,CAAC,GAAK,KAAK,EAAV,CAAW;IAEhD,IAAM,WAAW,GAAG;QAClB,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;QACf,OAAO,EAAE,SAAS;KACnB,CAAC;IAEF,OAAO,CACL,oBAAC,CAAC,CAAC,SAAS;QACV,oBAAC,CAAC,CAAC,KAAK,UAAK,CAAC;YACZ,oBAAC,CAAC,CAAC,WAAW;gBACZ,oBAAC,CAAC,CAAC,SAAS,WAAM,WAAW,CAAC,IAAI,CAAC;oBAChC,IAAI,KAAK,SAAS,IAAI,oBAAC,cAAc,IAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,GAAI;oBACjE,IAAI,KAAK,MAAM,IAAI,oBAAC,WAAW,IAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,GAAI;oBAC3D,IAAI,KAAK,SAAS,IAAI,oBAAC,kBAAkB,IAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,GAAI,CAC1D;gBACd,oBAAC,CAAC,CAAC,UAAU,QAAE,KAAK,CAAgB,CACtB;YAChB,oBAAC,CAAC,CAAC,SAAS;gBACV,oBAAC,CAAC,CAAC,SAAS,QAAE,IAAI,CAAe,CACrB;YACd,oBAAC,CAAC,CAAC,WAAW,QACX,OAAO,CAAC,GAAG,CAAC,UAAC,MAAM,EAAE,GAAG;gBACvB,OAAO,CACL,oBAAC,MAAM,IACL,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,SAAS,EAChC,OAAO,EAAE,MAAM,CAAC,OAAO,IAAI,WAAW,EACtC,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,OAAO,EAAE,MAAM,CAAC,MAAM,IAErB,MAAM,CAAC,KAAK,CACN,CACV,CAAC;YACJ,CAAC,CAAC,CACY,CACR,CACE,CACf,CAAC;AACJ,CAAC,CAAC"}
package/dist/esm/components/StatusModal/StatusModal.style.d.ts CHANGED
@@ -1,6 +1,8 @@
1
1
  /// <reference types="react" />
2
2
  export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
3
- export declare const Modal: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
3
+ export declare const Modal: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
4
+ $w?: string | undefined;
5
+ }>> & string;
4
6
  export declare const ModalHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
5
7
  export declare const ModalIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
6
8
  $bg: string;
package/dist/esm/components/StatusModal/StatusModal.style.js CHANGED
@@ -1,12 +1,12 @@
1
1
  import { __makeTemplateObject } from "tslib";
2
2
  import styled from 'styled-components';
3
- export var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n background: rgba(0, 0, 0, 0.6);\n z-index: 999;\n"], ["\n width: 100vw;\n height: 100vh;\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n background: rgba(0, 0, 0, 0.6);\n z-index: 999;\n"])));
4
- export var Modal = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n width: 430px;\n padding: 24px;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n border-radius: 4px;\n background: #fff;\n"], ["\n display: flex;\n width: 430px;\n padding: 24px;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n border-radius: 4px;\n background: #fff;\n"])));
3
+ export var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n background: rgba(0, 0, 0, 0.6);\n z-index: 9999;\n"], ["\n width: 100vw;\n height: 100vh;\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n background: rgba(0, 0, 0, 0.6);\n z-index: 9999;\n"])));
4
+ export var Modal = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n width: ", ";\n padding: 24px;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n border-radius: 4px;\n background: #fff;\n"], ["\n display: flex;\n width: ", ";\n padding: 24px;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n border-radius: 4px;\n background: #fff;\n"])), function (props) { return props.$w || '430px'; });
5
5
  export var ModalHeader = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n gap: 16px;\n align-self: stretch;\n align-items: center;\n"], ["\n display: flex;\n gap: 16px;\n align-self: stretch;\n align-items: center;\n"])));
6
6
  export var ModalIcon = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n padding: 4px;\n align-items: center;\n border-radius: 4px;\n background-color: ", ";\n"], ["\n display: flex;\n padding: 4px;\n align-items: center;\n border-radius: 4px;\n background-color: ", ";\n"])), function (props) { return props.$bg; });
7
7
  export var ModalTitle = styled.h1(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: #1d1d1d;\n font-size: 24px;\n font-style: normal;\n font-weight: 500;\n letter-spacing: 0.25px;\n margin: 0;\n"], ["\n color: #1d1d1d;\n font-size: 24px;\n font-style: normal;\n font-weight: 500;\n letter-spacing: 0.25px;\n margin: 0;\n"])));
8
8
  export var ModalBody = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: flex;\n width: 100%;\n border-bottom: 2px solid #a3a3a3;\n margin-top: 16px;\n padding-bottom: 32px;\n"], ["\n display: flex;\n width: 100%;\n border-bottom: 2px solid #a3a3a3;\n margin-top: 16px;\n padding-bottom: 32px;\n"])));
9
- export var ModalText = styled.p(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n color: rgba(0, 0, 0, 0.87);\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.17px;\n margin: 0;\n"], ["\n color: rgba(0, 0, 0, 0.87);\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.17px;\n margin: 0;\n"])));
9
+ export var ModalText = styled.p(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n color: rgba(0, 0, 0, 0.87);\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.17px;\n margin: 0;\n line-height: 1.3;\n"], ["\n color: rgba(0, 0, 0, 0.87);\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.17px;\n margin: 0;\n line-height: 1.3;\n"])));
10
10
  export var ModalFooter = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n display: flex;\n justify-content: flex-end;\n width: 100%;\n margin-top: 8px;\n gap: 8px;\n"], ["\n display: flex;\n justify-content: flex-end;\n width: 100%;\n margin-top: 8px;\n gap: 8px;\n"])));
11
11
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
12
12
  //# sourceMappingURL=StatusModal.style.js.map
package/dist/esm/components/StatusModal/StatusModal.style.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"StatusModal.style.js","sourceRoot":"","sources":["../../../../src/components/StatusModal/StatusModal.style.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,+QAAA,4MAWlC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,MAAM,CAAC,GAAG,2PAAA,wLAS9B,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,WAAW,GAAG,MAAM,CAAC,GAAG,uJAAA,oFAKpC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,oLAAiB,0GAK9B,EAAkB,KACvC,KADqB,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,GAAG,EAAT,CAAS,CACvC,CAAC;AAEF,MAAM,CAAC,IAAM,UAAU,GAAG,MAAM,CAAC,EAAE,mMAAA,gIAOlC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,4LAAA,yHAMlC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,CAAC,+MAAA,4IAOhC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,WAAW,GAAG,MAAM,CAAC,GAAG,wKAAA,qGAMpC,IAAA,CAAC"}
1
+ {"version":3,"file":"StatusModal.style.js","sourceRoot":"","sources":["../../../../src/components/StatusModal/StatusModal.style.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,gRAAA,6MAWlC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,MAAM,CAAC,GAAG,0PAAiB,+BAErC,EAA4B,sJAOtC,KAPU,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,EAAE,IAAI,OAAO,EAAnB,CAAmB,CAOtC,CAAC;AAEF,MAAM,CAAC,IAAM,WAAW,GAAG,MAAM,CAAC,GAAG,uJAAA,oFAKpC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,oLAAiB,0GAK9B,EAAkB,KACvC,KADqB,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,GAAG,EAAT,CAAS,CACvC,CAAC;AAEF,MAAM,CAAC,IAAM,UAAU,GAAG,MAAM,CAAC,EAAE,mMAAA,gIAOlC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,4LAAA,yHAMlC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,CAAC,oOAAA,iKAQhC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,WAAW,GAAG,MAAM,CAAC,GAAG,wKAAA,qGAMpC,IAAA,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "norma-library",
3
- "version": "0.5.144",
3
+ "version": "0.5.146",
4
4
  "private": false,
5
5
  "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.",
6
6
  "scripts": {
package/src/components/StatusModal/StatusModal.style.tsx CHANGED
@@ -10,12 +10,12 @@ export const Container = styled.div`
10
10
  justify-content: center;
11
11
  align-items: center;
12
12
  background: rgba(0, 0, 0, 0.6);
13
- z-index: 999;
13
+ z-index: 9999;
14
14
  `;
15
15
 
16
- export const Modal = styled.div`
16
+ export const Modal = styled.div<{ $w?: string }>`
17
17
  display: flex;
18
- width: 430px;
18
+ width: ${props => props.$w || '430px'};
19
19
  padding: 24px;
20
20
  flex-direction: column;
21
21
  justify-content: center;
@@ -63,6 +63,7 @@ export const ModalText = styled.p`
63
63
  font-weight: 400;
64
64
  letter-spacing: 0.17px;
65
65
  margin: 0;
66
+ line-height: 1.3;
66
67
  `;
67
68
 
68
69
  export const ModalFooter = styled.div`
package/src/components/StatusModal/StatusModal.tsx CHANGED
@@ -11,10 +11,11 @@ interface ModalStatusProps {
11
11
  text: string;
12
12
  type: 'success' | 'info' | 'warning';
13
13
  actions: OnAction[];
14
+ w?: string;
14
15
  }
15
16
 
16
17
  export const ModalStatus = (props: ModalStatusProps) => {
17
- const { title, text, type, actions } = props;
18
+ const { title, text, type, actions, w } = props;
18
19
 
19
20
  const iconBgColor = {
20
21
  warning: '#FFDB9F',
@@ -24,7 +25,7 @@ export const ModalStatus = (props: ModalStatusProps) => {
24
25
 
25
26
  return (
26
27
  <S.Container>
27
- <S.Modal>
28
+ <S.Modal $w={w}>
28
29
  <S.ModalHeader>
29
30
  <S.ModalIcon $bg={iconBgColor[type]}>
30
31
  {type === 'warning' && <WarningRounded sx={{ fill: '#B74608' }} />}