@laerdal/life-react-components 1.1.2-dev.11 → 1.1.2-dev.15
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/Breadcrumb/Breadcrumb.js +88 -48
- package/dist/esm/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/esm/Button/Button.js +1 -40
- package/dist/esm/Button/Button.js.map +1 -1
- package/dist/esm/Button/Iconbutton.js +2 -6
- package/dist/esm/Button/Iconbutton.js.map +1 -1
- package/dist/esm/Button/index.js +0 -1
- package/dist/esm/Button/index.js.map +1 -1
- package/dist/esm/Dropdown/CommonStyling.js +0 -5
- package/dist/esm/Dropdown/CommonStyling.js.map +1 -1
- package/dist/esm/Dropdown/DropdownButton.js +8 -18
- package/dist/esm/Dropdown/DropdownButton.js.map +1 -1
- package/dist/esm/Dropdown/DropdownContent.js +8 -23
- package/dist/esm/Dropdown/DropdownContent.js.map +1 -1
- package/dist/esm/List/ListRow.js +1 -1
- package/dist/esm/List/ListRow.js.map +1 -1
- package/dist/esm/Table/Table.js +1 -1
- package/dist/esm/Table/Table.js.map +1 -1
- package/dist/esm/types.js +1 -0
- package/dist/esm/types.js.map +1 -1
- package/dist/js/Breadcrumb/Breadcrumb.d.ts +5 -2
- package/dist/js/Breadcrumb/Breadcrumb.js +78 -35
- package/dist/js/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/js/Button/Button.d.ts +1 -1
- package/dist/js/Button/Button.js +2 -22
- package/dist/js/Button/Button.js.map +1 -1
- package/dist/js/Button/Iconbutton.js +2 -2
- package/dist/js/Button/Iconbutton.js.map +1 -1
- package/dist/js/Button/index.d.ts +0 -1
- package/dist/js/Button/index.js +0 -8
- package/dist/js/Button/index.js.map +1 -1
- package/dist/js/Dropdown/CommonStyling.js +2 -2
- package/dist/js/Dropdown/CommonStyling.js.map +1 -1
- package/dist/js/Dropdown/DropdownButton.js +9 -17
- package/dist/js/Dropdown/DropdownButton.js.map +1 -1
- package/dist/js/Dropdown/DropdownContent.js +12 -31
- package/dist/js/Dropdown/DropdownContent.js.map +1 -1
- package/dist/js/List/ListRow.js +1 -1
- package/dist/js/List/ListRow.js.map +1 -1
- package/dist/js/Table/Table.js +1 -1
- package/dist/js/Table/Table.js.map +1 -1
- package/dist/js/types.d.ts +1 -0
- package/dist/js/types.js +1 -0
- package/dist/js/types.js.map +1 -1
- package/dist/umd/Breadcrumb/Breadcrumb.js +90 -50
- package/dist/umd/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/umd/Button/Button.js +1 -40
- package/dist/umd/Button/Button.js.map +1 -1
- package/dist/umd/Button/Iconbutton.js +2 -6
- package/dist/umd/Button/Iconbutton.js.map +1 -1
- package/dist/umd/Button/index.js +4 -10
- package/dist/umd/Button/index.js.map +1 -1
- package/dist/umd/Dropdown/CommonStyling.js +0 -5
- package/dist/umd/Dropdown/CommonStyling.js.map +1 -1
- package/dist/umd/Dropdown/DropdownButton.js +8 -18
- package/dist/umd/Dropdown/DropdownButton.js.map +1 -1
- package/dist/umd/Dropdown/DropdownContent.js +8 -23
- package/dist/umd/Dropdown/DropdownContent.js.map +1 -1
- package/dist/umd/List/ListRow.js +1 -1
- package/dist/umd/List/ListRow.js.map +1 -1
- package/dist/umd/Table/Table.js +1 -1
- package/dist/umd/Table/Table.js.map +1 -1
- package/dist/umd/types.js +1 -0
- package/dist/umd/types.js.map +1 -1
- package/package.json +1 -1
- package/dist/esm/Button/Anchor.js +0 -76
- package/dist/esm/Button/Anchor.js.map +0 -1
- package/dist/js/Button/Anchor.d.ts +0 -7
- package/dist/js/Button/Anchor.js +0 -66
- package/dist/js/Button/Anchor.js.map +0 -1
- package/dist/umd/Button/Anchor.js +0 -201
- package/dist/umd/Button/Anchor.js.map +0 -1
|
@@ -2,23 +2,46 @@ import _pt from "prop-types";
|
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import styled from 'styled-components';
|
|
4
4
|
import { COLORS } from '../styles';
|
|
5
|
-
import { ComponentTextStyle, SystemIcons } from '..';
|
|
6
|
-
import {
|
|
5
|
+
import { ComponentTextStyle, Size, SystemIcons } from '..';
|
|
6
|
+
import { useHistory } from 'react-router';
|
|
7
|
+
import { HyperLink, IconButton } from '..';
|
|
7
8
|
import { ComponentMStyling, ComponentSStyling, ComponentXXSStyling } from '../styles/typography';
|
|
9
|
+
import DropdownButton from '../Dropdown/DropdownButton';
|
|
8
10
|
const BreadcrumbContainer = styled.div`
|
|
9
11
|
display:flex;
|
|
10
12
|
align-items: center;
|
|
13
|
+
|
|
14
|
+
a {
|
|
15
|
+
text-decoration: none;
|
|
16
|
+
${props => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}
|
|
17
|
+
margin: 0 7px;
|
|
18
|
+
|
|
19
|
+
svg{
|
|
20
|
+
padding:4px 0 0 0;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
button {
|
|
25
|
+
height: 36px;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
a:hover {
|
|
29
|
+
color: ${COLORS.primary_700};
|
|
30
|
+
}
|
|
31
|
+
a:active {
|
|
32
|
+
color: ${COLORS.primary_800};
|
|
33
|
+
}
|
|
11
34
|
`;
|
|
12
35
|
|
|
13
36
|
const FontStyles = (size, textStyle, color) => {
|
|
14
37
|
switch (size) {
|
|
15
|
-
case
|
|
38
|
+
case Size.XSmall:
|
|
16
39
|
return ComponentXXSStyling(textStyle, color);
|
|
17
40
|
|
|
18
|
-
case
|
|
41
|
+
case Size.Medium:
|
|
19
42
|
return ComponentMStyling(textStyle, color);
|
|
20
43
|
|
|
21
|
-
case
|
|
44
|
+
case Size.Small:
|
|
22
45
|
default:
|
|
23
46
|
return ComponentSStyling(textStyle, color);
|
|
24
47
|
}
|
|
@@ -28,60 +51,77 @@ const LastBreadcrumbItem = styled.label`
|
|
|
28
51
|
${props => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}
|
|
29
52
|
margin: 0 7px;
|
|
30
53
|
`;
|
|
31
|
-
const LinkWrapper = styled.div`
|
|
32
|
-
align-items: center;
|
|
33
|
-
${props => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}
|
|
34
|
-
|
|
35
|
-
a {
|
|
36
|
-
text-decoration: none;
|
|
37
|
-
${props => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}
|
|
38
|
-
margin: 0 7px;
|
|
39
|
-
|
|
40
|
-
svg{
|
|
41
|
-
padding:4px 0 0 0;
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
a:hover {
|
|
45
|
-
color: ${COLORS.primary_700};
|
|
46
|
-
}
|
|
47
|
-
a:active {
|
|
48
|
-
color: ${COLORS.primary_800};
|
|
49
|
-
}
|
|
50
|
-
`;
|
|
51
54
|
|
|
52
55
|
const Breadcrumb = ({
|
|
53
56
|
items,
|
|
54
|
-
size
|
|
57
|
+
size = Size.Small,
|
|
58
|
+
homeIcon = true,
|
|
59
|
+
homeLabel = 'Home',
|
|
60
|
+
homeUrl = '/'
|
|
55
61
|
}) => {
|
|
56
|
-
|
|
57
|
-
const
|
|
58
|
-
|
|
62
|
+
const history = useHistory();
|
|
63
|
+
const dropdownItems = items ? items.slice(0, items.length - 2).map(x => ({
|
|
64
|
+
value: x.url,
|
|
65
|
+
displayLabel: x.label
|
|
66
|
+
})) : [];
|
|
67
|
+
|
|
68
|
+
const navigate = links => {
|
|
69
|
+
history.push(links[0]);
|
|
70
|
+
};
|
|
71
|
+
|
|
72
|
+
return /*#__PURE__*/React.createElement(BreadcrumbContainer, {
|
|
59
73
|
size: size
|
|
60
|
-
}, /*#__PURE__*/React.createElement(
|
|
61
|
-
|
|
74
|
+
}, homeIcon ? /*#__PURE__*/React.createElement(IconButton, {
|
|
75
|
+
variant: "secondary",
|
|
76
|
+
shape: "circular",
|
|
77
|
+
action: () => history.push(homeUrl)
|
|
62
78
|
}, /*#__PURE__*/React.createElement(SystemIcons.Home, {
|
|
63
|
-
size:
|
|
64
|
-
}))
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
}),
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
79
|
+
size: "20px"
|
|
80
|
+
})) : /*#__PURE__*/React.createElement(HyperLink, {
|
|
81
|
+
id: "homelink",
|
|
82
|
+
variant: "default",
|
|
83
|
+
href: homeUrl
|
|
84
|
+
}, homeLabel), !!items && items.length > 2 && (items.length > 3 ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SystemIcons.ChevronRight, {
|
|
85
|
+
color: COLORS.neutral_500,
|
|
86
|
+
size: "20px"
|
|
87
|
+
}), /*#__PURE__*/React.createElement(DropdownButton, {
|
|
88
|
+
alignLeft: true,
|
|
89
|
+
items: dropdownItems,
|
|
90
|
+
size: size,
|
|
91
|
+
icon: /*#__PURE__*/React.createElement(SystemIcons.MoreHorizontal, {
|
|
92
|
+
color: COLORS.neutral_600,
|
|
93
|
+
size: "20px"
|
|
94
|
+
}),
|
|
95
|
+
onClick: navigate
|
|
96
|
+
})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SystemIcons.ChevronRight, {
|
|
97
|
+
color: COLORS.neutral_500,
|
|
98
|
+
size: "20px"
|
|
99
|
+
}), /*#__PURE__*/React.createElement(HyperLink, {
|
|
100
|
+
id: "link-item-" + (items.length - 3),
|
|
101
|
+
target: "_self",
|
|
102
|
+
variant: "default",
|
|
103
|
+
href: items[items.length - 3].url
|
|
104
|
+
}, items[items.length - 3].label))), !!items && items.length > 1 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SystemIcons.ChevronRight, {
|
|
105
|
+
color: COLORS.neutral_500,
|
|
106
|
+
size: "20px"
|
|
107
|
+
}), /*#__PURE__*/React.createElement(HyperLink, {
|
|
108
|
+
id: "link-item-" + (items.length - 2),
|
|
109
|
+
target: "_self",
|
|
110
|
+
variant: "default",
|
|
111
|
+
href: items[items.length - 2].url
|
|
112
|
+
}, items[items.length - 2].label)), !!items && items.length > 0 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SystemIcons.ChevronRight, {
|
|
113
|
+
color: COLORS.neutral_500,
|
|
114
|
+
size: "20px"
|
|
115
|
+
}), /*#__PURE__*/React.createElement(LastBreadcrumbItem, {
|
|
78
116
|
size: size
|
|
79
117
|
}, items[items.length - 1].label)));
|
|
80
118
|
};
|
|
81
119
|
|
|
82
120
|
Breadcrumb.propTypes = {
|
|
83
|
-
|
|
84
|
-
|
|
121
|
+
homeIcon: _pt.bool,
|
|
122
|
+
homeLabel: _pt.string,
|
|
123
|
+
homeUrl: _pt.string,
|
|
124
|
+
items: _pt.array
|
|
85
125
|
};
|
|
86
126
|
export default Breadcrumb;
|
|
87
127
|
//# sourceMappingURL=Breadcrumb.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Breadcrumb/Breadcrumb.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","SystemIcons","
|
|
1
|
+
{"version":3,"sources":["../../../src/Breadcrumb/Breadcrumb.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","Size","SystemIcons","useHistory","HyperLink","IconButton","ComponentMStyling","ComponentSStyling","ComponentXXSStyling","DropdownButton","BreadcrumbContainer","div","props","FontStyles","size","Regular","neutral_600","primary_700","primary_800","textStyle","color","XSmall","Medium","Small","LastBreadcrumbItem","label","Bold","neutral_800","Breadcrumb","items","homeIcon","homeLabel","homeUrl","history","dropdownItems","slice","length","map","x","value","url","displayLabel","navigate","links","push","neutral_500"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA,SAAQC,MAAR,QAAqB,WAArB;AACA,SAAQC,kBAAR,EAA4BC,IAA5B,EAAkCC,WAAlC,QAAoD,IAApD;AACA,SAAQC,UAAR,QAAyB,cAAzB;AACA,SAASC,SAAT,EAAoBC,UAApB,QAAsC,IAAtC;AAGA,SAAQC,iBAAR,EAA2BC,iBAA3B,EAA8CC,mBAA9C,QAAwE,sBAAxE;AACA,OAAOC,cAAP,MAA2B,4BAA3B;AAWA,MAAMC,mBAAmB,GAAGZ,MAAM,CAACa,GAA8B;AACjE;AACA;AACA;AACA;AACA;AACA,MAAOC,KAAD,IAAWC,UAAU,CAACD,KAAK,CAACE,IAAP,EAAad,kBAAkB,CAACe,OAAhC,EAAyChB,MAAM,CAACiB,WAAhD,CAA6D;AACxF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAajB,MAAM,CAACkB,WAAY;AAChC;AACA;AACA,aAAalB,MAAM,CAACmB,WAAY;AAChC;AACA,CAxBA;;AA0BA,MAAML,UAAU,GAAG,CAACC,IAAD,EAAyBK,SAAzB,EAAwDC,KAAxD,KAA0E;AAC3F,UAAQN,IAAR;AACE,SAAKb,IAAI,CAACoB,MAAV;AACE,aAAOb,mBAAmB,CAACW,SAAD,EAAYC,KAAZ,CAA1B;;AACF,SAAKnB,IAAI,CAACqB,MAAV;AACE,aAAOhB,iBAAiB,CAACa,SAAD,EAAYC,KAAZ,CAAxB;;AACF,SAAKnB,IAAI,CAACsB,KAAV;AACA;AACE,aAAOhB,iBAAiB,CAACY,SAAD,EAAYC,KAAZ,CAAxB;AAPJ;AASD,CAVD;;AAYA,MAAMI,kBAAkB,GAAG1B,MAAM,CAAC2B,KAAoB;AACtD,IAAKb,KAAD,IAAWC,UAAU,CAACD,KAAK,CAACE,IAAP,EAAad,kBAAkB,CAAC0B,IAAhC,EAAsC3B,MAAM,CAAC4B,WAA7C,CAA0D;AACnF;AACA,CAHA;;AAKA,MAAMC,UAAoD,GAAG,CAAC;AAC1DC,EAAAA,KAD0D;AAE1Df,EAAAA,IAAI,GAAGb,IAAI,CAACsB,KAF8C;AAG1DO,EAAAA,QAAQ,GAAG,IAH+C;AAI1DC,EAAAA,SAAS,GAAG,MAJ8C;AAK1DC,EAAAA,OAAO,GAAG;AALgD,CAAD,KAKrC;AAEtB,QAAMC,OAAO,GAAG9B,UAAU,EAA1B;AACA,QAAM+B,aAA6B,GAAGL,KAAK,GAAGA,KAAK,CAACM,KAAN,CAAY,CAAZ,EAAeN,KAAK,CAACO,MAAN,GAAe,CAA9B,EAAiCC,GAAjC,CAAqCC,CAAC,KAAK;AAAEC,IAAAA,KAAK,EAAED,CAAC,CAACE,GAAX;AAAgBC,IAAAA,YAAY,EAAEH,CAAC,CAACb;AAAhC,GAAL,CAAtC,CAAH,GAA0F,EAArI;;AACA,QAAMiB,QAAQ,GAAIC,KAAD,IAAqB;AACpCV,IAAAA,OAAO,CAACW,IAAR,CAAaD,KAAK,CAAC,CAAD,CAAlB;AACD,GAFD;;AAIA,sBACE,oBAAC,mBAAD;AAAqB,IAAA,IAAI,EAAE7B;AAA3B,KAEGgB,QAAQ,gBACP,oBAAC,UAAD;AAAY,IAAA,OAAO,EAAC,WAApB;AAAgC,IAAA,KAAK,EAAC,UAAtC;AAAiD,IAAA,MAAM,EAAE,MAAMG,OAAO,CAACW,IAAR,CAAaZ,OAAb;AAA/D,kBACE,oBAAC,WAAD,CAAa,IAAb;AAAkB,IAAA,IAAI,EAAC;AAAvB,IADF,CADO,gBAIP,oBAAC,SAAD;AAAW,IAAA,EAAE,EAAE,UAAf;AAA2B,IAAA,OAAO,EAAC,SAAnC;AAA6C,IAAA,IAAI,EAAEA;AAAnD,KACGD,SADH,CANJ,EAUI,CAAC,CAACF,KAAF,IAAWA,KAAK,CAACO,MAAN,GAAe,CAA1B,KACGP,KAAK,CAACO,MAAN,GAAe,CAAf,gBACD,uDACE,oBAAC,WAAD,CAAa,YAAb;AAA0B,IAAA,KAAK,EAAErC,MAAM,CAAC8C,WAAxC;AAAqD,IAAA,IAAI,EAAC;AAA1D,IADF,eAEE,oBAAC,cAAD;AACE,IAAA,SAAS,EAAE,IADb;AAEE,IAAA,KAAK,EAAEX,aAFT;AAGE,IAAA,IAAI,EAAEpB,IAHR;AAIE,IAAA,IAAI,eAAE,oBAAC,WAAD,CAAa,cAAb;AAA4B,MAAA,KAAK,EAAEf,MAAM,CAACiB,WAA1C;AAAuD,MAAA,IAAI,EAAC;AAA5D,MAJR;AAKE,IAAA,OAAO,EAAE0B;AALX,IAFF,CADC,gBAUD,uDACE,oBAAC,WAAD,CAAa,YAAb;AAA0B,IAAA,KAAK,EAAE3C,MAAM,CAAC8C,WAAxC;AAAqD,IAAA,IAAI,EAAC;AAA1D,IADF,eAEE,oBAAC,SAAD;AAAW,IAAA,EAAE,EAAE,gBAAgBhB,KAAK,CAACO,MAAN,GAAe,CAA/B,CAAf;AAAkD,IAAA,MAAM,EAAC,OAAzD;AAAiE,IAAA,OAAO,EAAC,SAAzE;AAAmF,IAAA,IAAI,EAAEP,KAAK,CAACA,KAAK,CAACO,MAAN,GAAe,CAAhB,CAAL,CAAwBI;AAAjH,KACGX,KAAK,CAACA,KAAK,CAACO,MAAN,GAAe,CAAhB,CAAL,CAAwBX,KAD3B,CAFF,CAXF,CAVJ,EA6BI,CAAC,CAACI,KAAF,IAAWA,KAAK,CAACO,MAAN,GAAe,CAA1B,iBACA,uDACE,oBAAC,WAAD,CAAa,YAAb;AAA0B,IAAA,KAAK,EAAErC,MAAM,CAAC8C,WAAxC;AAAqD,IAAA,IAAI,EAAC;AAA1D,IADF,eAEE,oBAAC,SAAD;AAAW,IAAA,EAAE,EAAE,gBAAgBhB,KAAK,CAACO,MAAN,GAAe,CAA/B,CAAf;AAAkD,IAAA,MAAM,EAAC,OAAzD;AAAiE,IAAA,OAAO,EAAC,SAAzE;AAAmF,IAAA,IAAI,EAAEP,KAAK,CAACA,KAAK,CAACO,MAAN,GAAe,CAAhB,CAAL,CAAwBI;AAAjH,KACGX,KAAK,CAACA,KAAK,CAACO,MAAN,GAAe,CAAhB,CAAL,CAAwBX,KAD3B,CAFF,CA9BJ,EAsCI,CAAC,CAACI,KAAF,IAAWA,KAAK,CAACO,MAAN,GAAe,CAA1B,iBACA,uDACE,oBAAC,WAAD,CAAa,YAAb;AAA0B,IAAA,KAAK,EAAErC,MAAM,CAAC8C,WAAxC;AAAqD,IAAA,IAAI,EAAC;AAA1D,IADF,eAEE,oBAAC,kBAAD;AAAoB,IAAA,IAAI,EAAE/B;AAA1B,KACGe,KAAK,CAACA,KAAK,CAACO,MAAN,GAAe,CAAhB,CAAL,CAAwBX,KAD3B,CAFF,CAvCJ,CADF;AAiDD,CA9DD;;;AAlDEK,EAAAA,Q;AACAC,EAAAA,S;AACAC,EAAAA,O;AACAH,EAAAA,K;;AA+GF,eAAeD,UAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {COLORS} from '../styles';\nimport {ComponentTextStyle, Size, SystemIcons} from '..';\nimport {useHistory} from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport {BreadcrumbItem} from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport {Link} from 'react-router-dom';\nimport {ComponentMStyling, ComponentSStyling, ComponentXXSStyling} from '../styles/typography';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\n\ntype BreadcrumbProps = {\n homeIcon?: boolean;\n homeLabel?: string;\n homeUrl?: string;\n items?: BreadcrumbItem[];\n size?: Size;\n};\n\nconst BreadcrumbContainer = styled.div<{size: Size | undefined}>`\n display:flex;\n align-items: center;\n \n a {\n text-decoration: none;\n ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n margin: 0 7px;\n\n svg{\n padding:4px 0 0 0;\n }\n }\n\n button {\n height: 36px;\n }\n\n a:hover {\n color: ${COLORS.primary_700};\n }\n a:active {\n color: ${COLORS.primary_800};\n }\n`;\n\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\n switch (size) {\n case Size.XSmall:\n return ComponentXXSStyling(textStyle, color);\n case Size.Medium:\n return ComponentMStyling(textStyle, color);\n case Size.Small:\n default:\n return ComponentSStyling(textStyle, color);\n }\n}\n\nconst LastBreadcrumbItem = styled.label<{size: Size}>`\n ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n margin: 0 7px;\n`;\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ \n items, \n size = Size.Small, \n homeIcon = true, \n homeLabel = 'Home', \n homeUrl = '/' }) => {\n\n const history = useHistory();\n const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map(x => ({ value: x.url, displayLabel: x.label })) : [];\n const navigate = (links: string[]) => { \n history.push(links[0]);\n };\n\n return (\n <BreadcrumbContainer size={size}>\n\n {homeIcon ? \n <IconButton variant=\"secondary\" shape=\"circular\" action={() => history.push(homeUrl)}>\n <SystemIcons.Home size=\"20px\" />\n </IconButton> : \n <HyperLink id={\"homelink\"} variant=\"default\" href={homeUrl}>\n {homeLabel}\n </HyperLink>}\n\n { !!items && items.length > 2 &&\n (items.length > 3 ?\n <>\n <SystemIcons.ChevronRight color={COLORS.neutral_500} size=\"20px\" />\n <DropdownButton \n alignLeft={true}\n items={dropdownItems} \n size={size}\n icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n onClick={navigate} />\n </> :\n <>\n <SystemIcons.ChevronRight color={COLORS.neutral_500} size=\"20px\" />\n <HyperLink id={\"link-item-\" + (items.length - 3)} target=\"_self\" variant=\"default\" href={items[items.length - 3].url}>\n {items[items.length - 3].label}\n </HyperLink> \n </>)\n }\n\n { !!items && items.length > 1 && \n <>\n <SystemIcons.ChevronRight color={COLORS.neutral_500} size=\"20px\" />\n <HyperLink id={\"link-item-\" + (items.length - 2)} target=\"_self\" variant=\"default\" href={items[items.length - 2].url}>\n {items[items.length - 2].label}\n </HyperLink>\n </>\n }\n\n { !!items && items.length > 0 && \n <>\n <SystemIcons.ChevronRight color={COLORS.neutral_500} size=\"20px\" />\n <LastBreadcrumbItem size={size}>\n {items[items.length - 1].label}\n </LastBreadcrumbItem>\n </>\n }\n\n </BreadcrumbContainer>);\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.js"}
|
|
@@ -384,35 +384,6 @@ const Critical = styled(Primary)`
|
|
|
384
384
|
}
|
|
385
385
|
}
|
|
386
386
|
`;
|
|
387
|
-
const Text = styled.button`
|
|
388
|
-
color: ${props => props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary};
|
|
389
|
-
background-color: transparent;
|
|
390
|
-
padding: 0;
|
|
391
|
-
border: none;
|
|
392
|
-
cursor: pointer;
|
|
393
|
-
|
|
394
|
-
text-decoration: underline;
|
|
395
|
-
${props => props.size === Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary) : props.size === Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary) : ComponentMStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};
|
|
396
|
-
|
|
397
|
-
&:hover,
|
|
398
|
-
&:focus,
|
|
399
|
-
&.hover-state,
|
|
400
|
-
&.focus-state {
|
|
401
|
-
color: ${props => props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700};
|
|
402
|
-
background: transparent;
|
|
403
|
-
}
|
|
404
|
-
&:active,
|
|
405
|
-
&.active-state {
|
|
406
|
-
color: ${props => props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800};
|
|
407
|
-
background: transparent;
|
|
408
|
-
}
|
|
409
|
-
&:disabled,
|
|
410
|
-
&.disabled-state {
|
|
411
|
-
color: ${COLORS.neutral_500};
|
|
412
|
-
background: transparent;
|
|
413
|
-
cursor: not-allowed;
|
|
414
|
-
}
|
|
415
|
-
`;
|
|
416
387
|
|
|
417
388
|
const Button = _ref => {
|
|
418
389
|
let {
|
|
@@ -521,16 +492,6 @@ const Button = _ref => {
|
|
|
521
492
|
className: "button-content"
|
|
522
493
|
}, renderContent()));
|
|
523
494
|
|
|
524
|
-
case 'text':
|
|
525
|
-
return /*#__PURE__*/React.createElement(Text, _extends({}, renderProps, {
|
|
526
|
-
disabled: disabled,
|
|
527
|
-
type: type,
|
|
528
|
-
size: size,
|
|
529
|
-
width: width,
|
|
530
|
-
minWidth: minWidth,
|
|
531
|
-
"data-testid": testId
|
|
532
|
-
}), children);
|
|
533
|
-
|
|
534
495
|
case 'correct':
|
|
535
496
|
return /*#__PURE__*/React.createElement(Correct, _extends({}, renderProps, {
|
|
536
497
|
disabled: disabled,
|
|
@@ -609,7 +570,7 @@ const Button = _ref => {
|
|
|
609
570
|
};
|
|
610
571
|
|
|
611
572
|
Button.propTypes = {
|
|
612
|
-
variant: _pt.oneOf(['primary', 'secondary', 'tertiary', '
|
|
573
|
+
variant: _pt.oneOf(['primary', 'secondary', 'tertiary', 'correct', 'critical']),
|
|
613
574
|
role: _pt.oneOfType([_pt.oneOf(['button']), _pt.string]),
|
|
614
575
|
title: _pt.string,
|
|
615
576
|
colorTheme: _pt.oneOf(['teal', 'dark']),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Button/Button.tsx"],"names":["React","styled","css","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","Size","getBorderRadius","flatEdge","radius","tabbedHereStyle","variant","colorTheme","focus_25","focus","accent1_700","primary_100","primary_700","primary_600","white","accent1","primary_800","primary","primary_500","accent1_500","Primary","button","props","size","Large","Bold","Small","width","minWidth","Medium","iconOnly","accent1_800","primary_200","tabbedHere","neutral_100","neutral_300","Secondary","primary_300","Tertiary","accent1_20","primary_20","accent1_100","Correct","correct_500","correct_700","correct_800","Critical","critical_500","critical_700","critical_800","Text","neutral_500","Button","children","type","testId","disabled","icon","loading","renderProps","supressFocusRef","useRef","setTabbedHere","useState","renderContent","className","e","current","role","title"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\nimport { COLORS, TYPOGRAPHY } from '../styles';\nimport { Size } from '../types';\n\nconst getBorderRadius = (flatEdge : string | undefined, radius: number) => {\n switch(flatEdge)\n {\n case 'left':\n return `0px ${radius}px ${radius}px 0px`;\n \n case 'right':\n return `${radius}px 0px 0px ${radius}px`;\n\n case 'none':\n default:\n return `${radius}px`;\n }\n}\n\n\nconst tabbedHereStyle = (variant: string, colorTheme?: string) => {\n switch (variant) {\n case 'primary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n color: ${colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white};\n }\n `;\n case 'secondary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'dark' ? 'transparent' : COLORS.white};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1 : colorTheme === 'dark' ? COLORS.primary_800 : COLORS.primary};\n color: ${colorTheme === 'dark' ? COLORS.white : COLORS.primary_500};\n }\n `;\n case 'tertiary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${COLORS.white};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary};\n color: ${colorTheme === 'teal' ? COLORS.accent1_500 : COLORS.primary_500};\n }\n `;\n\n default:\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n color: ${colorTheme === 'dark' ? COLORS.primary_500 : COLORS.white};\n }\n `;\n }\n};\n\nconst Primary = styled.button<ButtonProps>`\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n &.loading-state {\n cursor: wait;\n }\n &:focus:not(:focus-visible),\n &:focus:not(:focus-visible) > div.button-content {\n outline: none !important;\n }\n div.button-content {\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-radius: ${props => getBorderRadius(props.flatEdge, 8)};\n border-width: 2px;\n border-style: solid;\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n\n width: ${(props) => props.width};\n position: relative;\n\n min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n min-width: ${props => props.minWidth};\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n // paddings have -2px for border\n padding: ${(props) => (props.size === Size.Large ? '14px 18px' : props.size === Size.Small ? '4px 10px' : '6px 14px')};\n\n span.loading {\n opacity: 0;\n }\n .icon {\n margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '-2px -4px' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '-2px -4px' : '-2px -8px' ))};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n svg {\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n }\n }\n\n .extramargin {\n margin-right: 4px;\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n path {\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n }\n }\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n box-shadow: none !important;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('primary', props?.colorTheme)};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n border-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n border-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n }\n }\n`;\n\nconst Secondary = styled(Primary)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n }\n\n &:focus:not(:focus-visible),\n &:focus:not(:focus-visible) > div.button-content {\n outline: none !important;\n background-color: white;\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: white;\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n border-color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n cursor: not-allowed;\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('secondary', props?.colorTheme)};\n\n }\n`;\n\nconst Tertiary = styled(Primary)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary_500)};\n border-color: transparent;\n background-color: transparent;\n border-width: 1px;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n }\n }\n }\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: white !important;\n color: ${COLORS.neutral_300};\n border-color: transparent;\n cursor: not-allowed;\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: white !important;\n color: ${COLORS.neutral_300};\n border-color: transparent !important;\n cursor: not-allowed;\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('tertiary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('tertiary', props?.colorTheme)};\n }\n`;\n\nconst Correct = styled(Primary)<ButtonProps>`\n div.button-content {\n color: white;\n border-color: ${COLORS.correct_500};\n background-color: ${COLORS.correct_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n border-color: ${COLORS.correct_700};\n background-color: ${COLORS.correct_700};\n }\n &:focus > div.button-content,\n &.focus-state > div.button-content {\n border-color: ${COLORS.correct_700};\n background-color: ${COLORS.correct_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n border-color: ${COLORS.correct_800};\n background-color: ${COLORS.correct_800};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n }\n }\n`;\n\nconst Critical = styled(Primary)<ButtonProps>`\n div.button-content {\n color: white;\n border-color: ${COLORS.critical_500};\n background-color: ${COLORS.critical_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n border-color: ${COLORS.critical_700};\n background-color: ${COLORS.critical_700};\n }\n &:focus > div.button-content,\n &.focus-state > div.button-content {\n border-color: ${COLORS.critical_700};\n background-color: ${COLORS.critical_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n border-color: ${COLORS.critical_800};\n background-color: ${COLORS.critical_800};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n }\n }\n`;\n\nconst Text = styled.button<ButtonProps>`\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n background-color: transparent;\n padding: 0;\n border: none;\n cursor: pointer;\n\n text-decoration: underline;\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)\n : ComponentMStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n\n &:hover,\n &:focus,\n &.hover-state,\n &.focus-state {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n background: transparent;\n }\n &:active,\n &.active-state {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n background: transparent;\n }\n &:disabled,\n &.disabled-state {\n color: ${COLORS.neutral_500};\n background: transparent;\n cursor: not-allowed;\n }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'correct' | 'critical';\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n role?: 'button' | string;\n title?: string;\n size?: Size;\n colorTheme?: 'teal' | 'dark';\n width?: 'auto' | string;\n loading?: boolean;\n testId?: string;\n tabbedHere?: boolean;\n icon?: React.ReactNode;\n minWidth?: string;\n iconOnly?: boolean;\n}\n\nconst Button: React.FunctionComponent<ButtonProps> = ({\n children = '',\n variant = 'primary',\n type = 'button',\n size = Size.Medium,\n width = 'auto',\n minWidth = '64px',\n testId,\n disabled,\n flatEdge,\n icon,\n ...props\n}) => {\n // Let's filter out properties that we don't need to render.\n const { loading, ...renderProps } = props;\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const renderContent = () => (\n <>\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n {loading && <LoadingIndicator></LoadingIndicator>}\n </>\n );\n\n // Let's render button\n switch (variant) {\n case 'primary':\n return (\n <Primary\n {...renderProps}\n disabled={disabled}\n iconOnly={!children}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Primary>\n );\n case 'secondary':\n return (\n <Secondary\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n iconOnly={!children}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Secondary>\n );\n case 'tertiary':\n return (\n <Tertiary\n {...renderProps}\n disabled={disabled}\n type={type}\n flatEdge={flatEdge}\n size={size}\n width={width}\n iconOnly={!children}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Tertiary>\n );\n case 'text':\n return (\n <Text {...renderProps} disabled={disabled} type={type} size={size} width={width} minWidth={minWidth} data-testid={testId}>\n {children}\n </Text>\n );\n case 'correct':\n return (\n <Correct\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n iconOnly={!children}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Correct>\n );\n case 'critical':\n return (\n <Critical\n {...renderProps}\n disabled={disabled}\n flatEdge={flatEdge}\n iconOnly={!children}\n type={type}\n size={size}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Critical>\n );\n default:\n return (\n <Primary\n {...renderProps}\n flatEdge={flatEdge}\n disabled={disabled}\n iconOnly={!children}\n type={type}\n size={size}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Primary>\n );\n }\n};\n\nexport default Button;\n"],"file":"Button.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/Button/Button.tsx"],"names":["React","styled","css","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","Size","getBorderRadius","flatEdge","radius","tabbedHereStyle","variant","colorTheme","focus_25","focus","accent1_700","primary_100","primary_700","primary_600","white","accent1","primary_800","primary","primary_500","accent1_500","Primary","button","props","size","Large","Bold","Small","width","minWidth","Medium","iconOnly","accent1_800","primary_200","tabbedHere","neutral_100","neutral_300","Secondary","primary_300","Tertiary","accent1_20","primary_20","accent1_100","Correct","correct_500","correct_700","correct_800","Critical","critical_500","critical_700","critical_800","Button","children","type","testId","disabled","icon","loading","renderProps","supressFocusRef","useRef","setTabbedHere","useState","renderContent","className","e","current","role","title"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\nimport { COLORS, TYPOGRAPHY } from '../styles';\nimport { Size } from '../types';\n\nconst getBorderRadius = (flatEdge : string | undefined, radius: number) => {\n switch(flatEdge)\n {\n case 'left':\n return `0px ${radius}px ${radius}px 0px`;\n \n case 'right':\n return `${radius}px 0px 0px ${radius}px`;\n\n case 'none':\n default:\n return `${radius}px`;\n }\n}\n\n\nconst tabbedHereStyle = (variant: string, colorTheme?: string) => {\n switch (variant) {\n case 'primary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n color: ${colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white};\n }\n `;\n case 'secondary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'dark' ? 'transparent' : COLORS.white};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1 : colorTheme === 'dark' ? COLORS.primary_800 : COLORS.primary};\n color: ${colorTheme === 'dark' ? COLORS.white : COLORS.primary_500};\n }\n `;\n case 'tertiary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${COLORS.white};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary};\n color: ${colorTheme === 'teal' ? COLORS.accent1_500 : COLORS.primary_500};\n }\n `;\n\n default:\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n color: ${colorTheme === 'dark' ? COLORS.primary_500 : COLORS.white};\n }\n `;\n }\n};\n\nconst Primary = styled.button<ButtonProps>`\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n &.loading-state {\n cursor: wait;\n }\n &:focus:not(:focus-visible),\n &:focus:not(:focus-visible) > div.button-content {\n outline: none !important;\n }\n div.button-content {\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-radius: ${props => getBorderRadius(props.flatEdge, 8)};\n border-width: 2px;\n border-style: solid;\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n\n width: ${(props) => props.width};\n position: relative;\n\n min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n min-width: ${props => props.minWidth};\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n // paddings have -2px for border\n padding: ${(props) => (props.size === Size.Large ? '14px 18px' : props.size === Size.Small ? '4px 10px' : '6px 14px')};\n\n span.loading {\n opacity: 0;\n }\n .icon {\n margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '-2px -4px' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '-2px -4px' : '-2px -8px' ))};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n svg {\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n }\n }\n\n .extramargin {\n margin-right: 4px;\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n path {\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n }\n }\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n box-shadow: none !important;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('primary', props?.colorTheme)};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n border-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n border-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n }\n }\n`;\n\nconst Secondary = styled(Primary)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n }\n\n &:focus:not(:focus-visible),\n &:focus:not(:focus-visible) > div.button-content {\n outline: none !important;\n background-color: white;\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: white;\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n border-color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n cursor: not-allowed;\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('secondary', props?.colorTheme)};\n\n }\n`;\n\nconst Tertiary = styled(Primary)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary_500)};\n border-color: transparent;\n background-color: transparent;\n border-width: 1px;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n }\n }\n }\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: white !important;\n color: ${COLORS.neutral_300};\n border-color: transparent;\n cursor: not-allowed;\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: white !important;\n color: ${COLORS.neutral_300};\n border-color: transparent !important;\n cursor: not-allowed;\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('tertiary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('tertiary', props?.colorTheme)};\n }\n`;\n\nconst Correct = styled(Primary)<ButtonProps>`\n div.button-content {\n color: white;\n border-color: ${COLORS.correct_500};\n background-color: ${COLORS.correct_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n border-color: ${COLORS.correct_700};\n background-color: ${COLORS.correct_700};\n }\n &:focus > div.button-content,\n &.focus-state > div.button-content {\n border-color: ${COLORS.correct_700};\n background-color: ${COLORS.correct_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n border-color: ${COLORS.correct_800};\n background-color: ${COLORS.correct_800};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n }\n }\n`;\n\nconst Critical = styled(Primary)<ButtonProps>`\n div.button-content {\n color: white;\n border-color: ${COLORS.critical_500};\n background-color: ${COLORS.critical_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n border-color: ${COLORS.critical_700};\n background-color: ${COLORS.critical_700};\n }\n &:focus > div.button-content,\n &.focus-state > div.button-content {\n border-color: ${COLORS.critical_700};\n background-color: ${COLORS.critical_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n border-color: ${COLORS.critical_800};\n background-color: ${COLORS.critical_800};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n }\n }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: 'primary' | 'secondary' | 'tertiary' | 'correct' | 'critical';\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n role?: 'button' | string;\n title?: string;\n size?: Size;\n colorTheme?: 'teal' | 'dark';\n width?: 'auto' | string;\n loading?: boolean;\n testId?: string;\n tabbedHere?: boolean;\n icon?: React.ReactNode;\n minWidth?: string;\n iconOnly?: boolean;\n}\n\nconst Button: React.FunctionComponent<ButtonProps> = ({\n children = '',\n variant = 'primary',\n type = 'button',\n size = Size.Medium,\n width = 'auto',\n minWidth = '64px',\n testId,\n disabled,\n flatEdge,\n icon,\n ...props\n}) => {\n // Let's filter out properties that we don't need to render.\n const { loading, ...renderProps } = props;\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const renderContent = () => (\n <>\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n {loading && <LoadingIndicator></LoadingIndicator>}\n </>\n );\n\n // Let's render button\n switch (variant) {\n case 'primary':\n return (\n <Primary\n {...renderProps}\n disabled={disabled}\n iconOnly={!children}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Primary>\n );\n case 'secondary':\n return (\n <Secondary\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n iconOnly={!children}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Secondary>\n );\n case 'tertiary':\n return (\n <Tertiary\n {...renderProps}\n disabled={disabled}\n type={type}\n flatEdge={flatEdge}\n size={size}\n width={width}\n iconOnly={!children}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Tertiary>\n );\n case 'correct':\n return (\n <Correct\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n iconOnly={!children}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Correct>\n );\n case 'critical':\n return (\n <Critical\n {...renderProps}\n disabled={disabled}\n flatEdge={flatEdge}\n iconOnly={!children}\n type={type}\n size={size}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Critical>\n );\n default:\n return (\n <Primary\n {...renderProps}\n flatEdge={flatEdge}\n disabled={disabled}\n iconOnly={!children}\n type={type}\n size={size}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Primary>\n );\n }\n};\n\nexport default Button;\n"],"file":"Button.js"}
|
|
@@ -239,9 +239,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
|
|
|
239
239
|
if (!supressFocusRef.current) setTabbedHere(true);else supressFocusRef.current = false;
|
|
240
240
|
}
|
|
241
241
|
},
|
|
242
|
-
onBlur: () =>
|
|
243
|
-
setTabbedHere(false);
|
|
244
|
-
},
|
|
242
|
+
onBlur: () => setTabbedHere(false),
|
|
245
243
|
tabbedHere: tabbedHere,
|
|
246
244
|
onKeyPress: onKeyPress,
|
|
247
245
|
tabbedHereBackgroundColor: tabbedHereBackgroundColor
|
|
@@ -273,9 +271,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
|
|
|
273
271
|
if (!supressFocusRef.current) setTabbedHere(true);else supressFocusRef.current = false;
|
|
274
272
|
}
|
|
275
273
|
},
|
|
276
|
-
onBlur: () =>
|
|
277
|
-
setTabbedHere(false);
|
|
278
|
-
},
|
|
274
|
+
onBlur: () => setTabbedHere(false),
|
|
279
275
|
tabbedHere: tabbedHere,
|
|
280
276
|
onKeyPress: onKeyPress,
|
|
281
277
|
tabbedHereBackgroundColor: tabbedHereBackgroundColor
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Button/Iconbutton.tsx"],"names":["React","styled","css","BREAKPOINTS","COLORS","tabbedHereStyle","variant","tabbedHereBackgroundColor","primary_500","neutral_600","primary_700","white","getBorderRadius","props","borderRadius","getBorderRadiusStyle","radius","flatEdge","StyledIconButton","button","hideOnLowWidth","MEDIUM","unsetIconSize","StyledPrimaryIconButton","useTransparentBackground","iconColor","primary_800","neutral_200","tabbedHere","StyledSecondaryIconButton","primary_20","primary_100","neutral_300","IconButton","forwardRef","id","shape","action","isInMobileMenu","children","disabled","tabIndex","onKeyPress","type","ref","supressFocusRef","useRef","setTabbedHere","useState","isPressingEnter","e","key","preventDefault","stopPropagation","event","current"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS } from '../styles';\n\ninterface HeaderItemProps {\n hideOnLowWidth: boolean;\n inMobileMenu?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n borderRadius?: number;\n shape?: string;\n flatEdge?: string;\n tabbedHere?: boolean;\n tabbedHereBackgroundColor?: string;\n}\n\nconst tabbedHereStyle = (variant: string, tabbedHereBackgroundColor?: string) => {\n switch (variant) {\n case 'secondary':\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor || 'transparent'} !important;\n box-shadow: 0px 0px 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n }\n div svg path,\n div svg {\n fill: ${COLORS.neutral_600};\n }\n `;\n case 'primary':\n default:\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor || COLORS.primary_700} !important;\n box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n `;\n }\n};\n\nconst getBorderRadius = (props:HeaderItemProps) => (props.borderRadius ? `${props.borderRadius}px` : '4px'); \n\nconst getBorderRadiusStyle = (props:HeaderItemProps) => {\n const radius = getBorderRadius(props);\n switch(props.flatEdge)\n {\n case 'left':\n return `0px ${radius} ${radius} 0px`;\n \n case 'right':\n return `${radius} 0px 0px ${radius}`;\n\n case 'none':\n default:\n return `${radius}`;\n }\n};\n\nconst StyledIconButton = styled.button<HeaderItemProps>`\n border-width: 0;\n cursor: pointer;\n height: 48px;\n width: 48px;\n background: transparent;\n\n display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n ${BREAKPOINTS.MEDIUM} {\n display: block;\n }\n\n border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n div {\n height: 36px;\n width: 36px;\n border-radius: ${getBorderRadiusStyle};\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n padding: 0;\n }\n }\n &:only-child {\n margin: 0;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:focus:not(:disabled) {\n outline: none;\n div {\n outline: none;\n }\n }\n &:active:not(:disabled) {\n div {\n box-shadow: none;\n }\n }\n`;\n\nconst StyledPrimaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n svg {\n fill: ${(props) => props.iconColor || COLORS.white};\n path {\n fill: ${(props) => props.iconColor || COLORS.white};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_700};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_800};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:disabled {\n div {\n background-color: ${COLORS.neutral_200};\n }\n svg {\n path {\n fill: ${COLORS.white};\n }\n fill: ${COLORS.white};\n }\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.tabbedHereBackgroundColor) : '')};\n`;\n\nconst StyledSecondaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n svg {\n fill: ${(props) => props.iconColor || COLORS.neutral_600};\n path {\n fill: ${(props) => props.iconColor || COLORS.neutral_600};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_20};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_700};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_100};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:disabled {\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n }\n svg {\n path {\n fill: ${COLORS.neutral_300};\n }\n fill: ${COLORS.neutral_300};\n }\n }\n\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.tabbedHereBackgroundColor) : '')};\n`;\n\ninterface Props {\n id?: string;\n variant?: 'primary' | 'secondary';\n shape?: 'square' | 'circular';\n action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n hideOnLowWidth?: boolean;\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n isInMobileMenu?: boolean;\n disabled?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n tabIndex?: number;\n borderRadius?: number;\n onKeyPress?: React.KeyboardEventHandler<HTMLButtonElement>;\n tabbedHereBackgroundColor?: string;\n type?: 'submit' | 'reset' | 'button' | undefined;\n children?: React.ReactNode;\n};\n\nconst IconButton = React.forwardRef<HTMLButtonElement, Props>(({\n id,\n variant,\n shape,\n action,\n hideOnLowWidth,\n isInMobileMenu,\n children,\n useTransparentBackground,\n disabled,\n iconColor,\n unsetIconSize,\n tabIndex,\n flatEdge,\n borderRadius,\n onKeyPress,\n tabbedHereBackgroundColor,\n type,\n}: Props, ref) => {\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n // Let's render button\n switch (variant) {\n case 'secondary':\n return (\n <StyledSecondaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n ref={ref}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth || false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex || 0}\n borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => {\n setTabbedHere(false);\n }}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledSecondaryIconButton>\n );\n case 'primary':\n default:\n return (\n <StyledPrimaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n flatEdge={flatEdge}\n ref={ref}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth || false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex || 0}\n borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => {\n setTabbedHere(false);\n }}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledPrimaryIconButton>\n );\n }\n});\n\nexport default IconButton;\n"],"file":"Iconbutton.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/Button/Iconbutton.tsx"],"names":["React","styled","css","BREAKPOINTS","COLORS","tabbedHereStyle","variant","tabbedHereBackgroundColor","primary_500","neutral_600","primary_700","white","getBorderRadius","props","borderRadius","getBorderRadiusStyle","radius","flatEdge","StyledIconButton","button","hideOnLowWidth","MEDIUM","unsetIconSize","StyledPrimaryIconButton","useTransparentBackground","iconColor","primary_800","neutral_200","tabbedHere","StyledSecondaryIconButton","primary_20","primary_100","neutral_300","IconButton","forwardRef","id","shape","action","isInMobileMenu","children","disabled","tabIndex","onKeyPress","type","ref","supressFocusRef","useRef","setTabbedHere","useState","isPressingEnter","e","key","preventDefault","stopPropagation","event","current"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS } from '../styles';\n\ninterface HeaderItemProps {\n hideOnLowWidth: boolean;\n inMobileMenu?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n borderRadius?: number;\n shape?: string;\n flatEdge?: string;\n tabbedHere?: boolean;\n tabbedHereBackgroundColor?: string;\n}\n\nconst tabbedHereStyle = (variant: string, tabbedHereBackgroundColor?: string) => {\n switch (variant) {\n case 'secondary':\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor || 'transparent'} !important;\n box-shadow: 0px 0px 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n }\n div svg path,\n div svg {\n fill: ${COLORS.neutral_600};\n }\n `;\n case 'primary':\n default:\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor || COLORS.primary_700} !important;\n box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n `;\n }\n};\n\nconst getBorderRadius = (props:HeaderItemProps) => (props.borderRadius ? `${props.borderRadius}px` : '4px'); \n\nconst getBorderRadiusStyle = (props:HeaderItemProps) => {\n const radius = getBorderRadius(props);\n switch(props.flatEdge)\n {\n case 'left':\n return `0px ${radius} ${radius} 0px`;\n \n case 'right':\n return `${radius} 0px 0px ${radius}`;\n\n case 'none':\n default:\n return `${radius}`;\n }\n};\n\nconst StyledIconButton = styled.button<HeaderItemProps>`\n border-width: 0;\n cursor: pointer;\n height: 48px;\n width: 48px;\n background: transparent;\n\n display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n ${BREAKPOINTS.MEDIUM} {\n display: block;\n }\n\n border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n div {\n height: 36px;\n width: 36px;\n border-radius: ${getBorderRadiusStyle};\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n padding: 0;\n }\n }\n &:only-child {\n margin: 0;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:focus:not(:disabled) {\n outline: none;\n div {\n outline: none;\n }\n }\n &:active:not(:disabled) {\n div {\n box-shadow: none;\n }\n }\n`;\n\nconst StyledPrimaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n svg {\n fill: ${(props) => props.iconColor || COLORS.white};\n path {\n fill: ${(props) => props.iconColor || COLORS.white};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_700};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_800};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:disabled {\n div {\n background-color: ${COLORS.neutral_200};\n }\n svg {\n path {\n fill: ${COLORS.white};\n }\n fill: ${COLORS.white};\n }\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.tabbedHereBackgroundColor) : '')};\n`;\n\nconst StyledSecondaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n svg {\n fill: ${(props) => props.iconColor || COLORS.neutral_600};\n path {\n fill: ${(props) => props.iconColor || COLORS.neutral_600};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_20};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_700};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_100};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:disabled {\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n }\n svg {\n path {\n fill: ${COLORS.neutral_300};\n }\n fill: ${COLORS.neutral_300};\n }\n }\n\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.tabbedHereBackgroundColor) : '')};\n`;\n\ninterface Props {\n id?: string;\n variant?: 'primary' | 'secondary';\n shape?: 'square' | 'circular';\n action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n hideOnLowWidth?: boolean;\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n isInMobileMenu?: boolean;\n disabled?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n tabIndex?: number;\n borderRadius?: number;\n onKeyPress?: React.KeyboardEventHandler<HTMLButtonElement>;\n tabbedHereBackgroundColor?: string;\n type?: 'submit' | 'reset' | 'button' | undefined;\n children?: React.ReactNode;\n};\n\nconst IconButton = React.forwardRef<HTMLButtonElement, Props>(({\n id,\n variant,\n shape,\n action,\n hideOnLowWidth,\n isInMobileMenu,\n children,\n useTransparentBackground,\n disabled,\n iconColor,\n unsetIconSize,\n tabIndex,\n flatEdge,\n borderRadius,\n onKeyPress,\n tabbedHereBackgroundColor,\n type,\n}: Props, ref) => {\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n // Let's render button\n switch (variant) {\n case 'secondary':\n return (\n <StyledSecondaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n ref={ref}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth || false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex || 0}\n borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledSecondaryIconButton>\n );\n case 'primary':\n default:\n return (\n <StyledPrimaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n flatEdge={flatEdge}\n ref={ref}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth || false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex || 0}\n borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledPrimaryIconButton>\n );\n }\n});\n\nexport default IconButton;\n"],"file":"Iconbutton.js"}
|
package/dist/esm/Button/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Button/index.ts"],"names":["default","IconButton","Button","BackButton"
|
|
1
|
+
{"version":3,"sources":["../../../src/Button/index.ts"],"names":["default","IconButton","Button","BackButton"],"mappings":"AAAA,SAASA,OAAO,IAAIC,UAApB,QAAsC,cAAtC;AACA,SAASD,OAAO,IAAIE,MAApB,QAAkC,UAAlC;AACA,SAASF,OAAO,IAAIG,UAApB,QAAsC,cAAtC","sourcesContent":["export { default as IconButton } from './Iconbutton';\nexport { default as Button } from './Button';\nexport { default as BackButton } from './BackButton';\n"],"file":"index.js"}
|