norma-library 0.5.145 → 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.
- package/dist/esm/components/StatusModal/StatusModal.d.ts +1 -0
- package/dist/esm/components/StatusModal/StatusModal.js +2 -2
- package/dist/esm/components/StatusModal/StatusModal.js.map +1 -1
- package/dist/esm/components/StatusModal/StatusModal.style.d.ts +3 -1
- package/dist/esm/components/StatusModal/StatusModal.style.js +1 -1
- package/dist/esm/components/StatusModal/StatusModal.style.js.map +1 -1
- package/package.json +1 -1
- package/src/components/StatusModal/StatusModal.style.tsx +2 -2
- package/src/components/StatusModal/StatusModal.tsx +3 -2
|
@@ -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,
|
|
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' } }),
|
|
@@ -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;
|
|
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"}
|
|
@@ -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").
|
|
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;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __makeTemplateObject } from "tslib";
|
|
2
2
|
import styled from 'styled-components';
|
|
3
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:
|
|
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"])));
|
|
@@ -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,gRAAA,6MAWlC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,MAAM,CAAC,GAAG,
|
|
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.
|
|
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": {
|
|
@@ -13,9 +13,9 @@ export const Container = styled.div`
|
|
|
13
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;
|
|
@@ -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' }} />}
|