@kvdbil/components 8.1.0 → 8.1.1
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.
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),r=require("../../shared/media-queries.js"),n=require("../Button/index.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),r=require("../../shared/media-queries.js"),n=require("../Button/index.js"),l=require("../Modal/index.js"),i=require("../../typography/Heading/index.js");function o(x){return x&&typeof x=="object"&&"default"in x?x:{default:x}}require("../../theme.js"),require("../Spinner/index.js"),require("../../typography/ButtonText/index.js"),require("../Button/styles.js"),require("react-dom"),require("react-transition-group"),require("../Icons/Close.js");var a=o(e),u=o(t);const s=u.default.div`
|
|
2
2
|
padding-top: 1rem;
|
|
3
3
|
`,d=u.default.div`
|
|
4
4
|
top: 20px;
|
|
5
5
|
left: 32px;
|
|
6
6
|
position: absolute;
|
|
7
|
-
`,c=u.default(
|
|
7
|
+
`,c=u.default(i.TinyTitleBold)`
|
|
8
8
|
font-weight: ${({theme:x})=>x.typography.fontAlternativeRegularWeight};
|
|
9
9
|
margin: 0;
|
|
10
10
|
`,f=u.default.div`
|
|
@@ -24,4 +24,4 @@
|
|
|
24
24
|
justify-content: center;
|
|
25
25
|
width: 100%;
|
|
26
26
|
max-width: 245px;
|
|
27
|
-
`,m=({isOpen:x,title:h,children:g,modalStyles:B,titleStyles:v,primaryButtonText:w,primaryButtonStyles:E,secondaryButtonStyles:S,secondaryButtonText:b,primaryButtonAction:q,secondaryButtonAction:j,onClose:C,withPortal:T})=>a.default.createElement(
|
|
27
|
+
`,m=({isOpen:x,title:h,children:g,modalStyles:B,titleStyles:v,primaryButtonText:w,primaryButtonStyles:E,secondaryButtonStyles:S,secondaryButtonText:b,primaryButtonAction:q,secondaryButtonAction:j,onClose:C,withPortal:T,color:A="success"})=>a.default.createElement(l.Modal,{contentStyles:B,isOpen:x,onClose:C,withPortal:T},h&&a.default.createElement(d,null,a.default.createElement(c,{style:v},h)),a.default.createElement(s,null,g),a.default.createElement(f,null,j&&a.default.createElement(y,{style:S,onClick:j,variant:"outline",color:"neutral"},b),q&&a.default.createElement(p,{style:E,onClick:q,variant:"solid",color:A},w)));exports.Dialog=m,exports.default=m;
|
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
import t from"react";import e from"styled-components";import{mq as
|
|
1
|
+
import t from"react";import e from"styled-components";import{mq as g}from"../../shared/media-queries.js";import{Button as l}from"../Button/index.js";import{Modal as j}from"../Modal/index.js";import{TinyTitleBold as v}from"../../typography/Heading/index.js";import"../../theme.js";import"../Spinner/index.js";import"../../typography/ButtonText/index.js";import"../Button/styles.js";import"react-dom";import"react-transition-group";import"../Icons/Close.js";const w=e.div`
|
|
2
2
|
padding-top: 1rem;
|
|
3
|
-
`,
|
|
3
|
+
`,E=e.div`
|
|
4
4
|
top: 20px;
|
|
5
5
|
left: 32px;
|
|
6
6
|
position: absolute;
|
|
7
|
-
`,
|
|
7
|
+
`,B=e(v)`
|
|
8
8
|
font-weight: ${({theme:o})=>o.typography.fontAlternativeRegularWeight};
|
|
9
9
|
margin: 0;
|
|
10
|
-
`,
|
|
10
|
+
`,C=e.div`
|
|
11
11
|
display: flex;
|
|
12
12
|
justify-content: space-between;
|
|
13
|
-
${
|
|
13
|
+
${g("tablet")} {
|
|
14
14
|
justify-content: flex-start;
|
|
15
15
|
}
|
|
16
16
|
overflow-x: hidden;
|
|
17
|
-
`,
|
|
17
|
+
`,T=e(l)`
|
|
18
18
|
overflow-x: hidden;
|
|
19
19
|
margin-right: 2rem;
|
|
20
20
|
justify-content: center;
|
|
21
21
|
width: 100%;
|
|
22
22
|
max-width: 110px;
|
|
23
|
-
`,
|
|
23
|
+
`,b=e(l)`
|
|
24
24
|
justify-content: center;
|
|
25
25
|
width: 100%;
|
|
26
26
|
max-width: 245px;
|
|
27
|
-
`,a=({isOpen:o,title:n,children:s,modalStyles:m,titleStyles:
|
|
27
|
+
`,a=({isOpen:o,title:n,children:s,modalStyles:m,titleStyles:p,primaryButtonText:c,primaryButtonStyles:d,secondaryButtonStyles:u,secondaryButtonText:f,primaryButtonAction:r,secondaryButtonAction:i,onClose:y,withPortal:x,color:h="success"})=>t.createElement(j,{contentStyles:m,isOpen:o,onClose:y,withPortal:x},n&&t.createElement(E,null,t.createElement(B,{style:p},n)),t.createElement(w,null,s),t.createElement(C,null,i&&t.createElement(T,{style:u,onClick:i,variant:"outline",color:"neutral"},f),r&&t.createElement(b,{style:d,onClick:r,variant:"solid",color:h},c)));export{a as Dialog,a as default};
|
package/package.json
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
+
import { Color } from '../../Types';
|
|
2
3
|
export interface DialogProps {
|
|
3
4
|
title?: string;
|
|
4
5
|
children: ReactNode;
|
|
@@ -14,6 +15,7 @@ export interface DialogProps {
|
|
|
14
15
|
onClose(): void;
|
|
15
16
|
primaryButtonAction?(): void;
|
|
16
17
|
secondaryButtonAction?(): void;
|
|
18
|
+
color?: Color;
|
|
17
19
|
}
|
|
18
|
-
export declare const Dialog: ({ isOpen, title, children, modalStyles, titleStyles, primaryButtonText, primaryButtonStyles, secondaryButtonStyles, secondaryButtonText, primaryButtonAction, secondaryButtonAction, onClose, withPortal, }: DialogProps) => JSX.Element;
|
|
20
|
+
export declare const Dialog: ({ isOpen, title, children, modalStyles, titleStyles, primaryButtonText, primaryButtonStyles, secondaryButtonStyles, secondaryButtonText, primaryButtonAction, secondaryButtonAction, onClose, withPortal, color, }: DialogProps) => JSX.Element;
|
|
19
21
|
export default Dialog;
|