@kvdbil/components 8.3.6 → 8.4.3

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,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("styled-components"),t=require("../../shared/helpers.js"),o=require("../../theme.js"),s=require("../../typography/BodyText/index.js"),i=require("../../icons/components/CheckmarkIcon.js"),a=require("../IconButton.js");function l(m){return m&&typeof m=="object"&&"default"in m?m:{default:m}}require("../../shared/media-queries.js");var d=l(e),c=l(r);const n={regular:r.css`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("styled-components"),t=require("../../icons/components/CheckmarkIcon.js"),o=require("../../shared/helpers.js"),s=require("../../theme.js"),i=require("../../typography/BodyText/index.js"),a=require("../IconButton.js");function l(m){return m&&typeof m=="object"&&"default"in m?m:{default:m}}require("../../shared/media-queries.js");var d=l(e),c=l(r);const n={regular:r.css`
2
2
  width: 24px;
3
3
  height: 24px;
4
4
 
@@ -16,14 +16,14 @@
16
16
  }
17
17
  `},u=r.css`
18
18
  cursor: default;
19
- border: 2px solid ${o.default.colors.gray.light2};
19
+ border: 2px solid ${s.default.colors.gray.light2};
20
20
  `,h=r.css`
21
- background: ${o.default.colors.gray.light2};
21
+ background: ${s.default.colors.gray.light2};
22
22
  `,p=c.default.div`
23
23
  display: flex;
24
- align-items: center;
24
+ align-items: flex-start;
25
25
  box-sizing: border-box;
26
- `,b=c.default.input.attrs({type:"checkbox"})`
26
+ `,x=c.default.input.attrs({type:"checkbox"})`
27
27
  position: absolute;
28
28
  appearance: none;
29
29
  width: 100%;
@@ -39,7 +39,7 @@
39
39
  transition: background-color 400ms;
40
40
  ${a.BackgroundStyles}
41
41
  }
42
- `,x=c.default.span`
42
+ `,b=c.default.span`
43
43
  box-sizing: border-box;
44
44
  cursor: pointer;
45
45
  display: flex;
@@ -48,7 +48,7 @@
48
48
  justify-content: center;
49
49
  z-index: 0;
50
50
 
51
- border: 2px solid ${o.default.colors.gray.dark5};
51
+ border: 2px solid ${s.default.colors.gray.dark5};
52
52
 
53
53
  ${m=>n[m.size]};
54
54
 
@@ -65,15 +65,16 @@
65
65
  :hover {
66
66
  }
67
67
 
68
- background: ${o.default.colors[y].main};
69
- border: 2px solid ${o.default.colors[y].main};
68
+ background: ${s.default.colors[y].main};
69
+ border: 2px solid ${s.default.colors[y].main};
70
70
  `);var y}};
71
71
  ${m=>m.isDisabled&&u};
72
72
 
73
73
  ${m=>m.isChecked&&m.isDisabled&&h};
74
- `,g=c.default(s.BodyText)`
74
+ `,f=c.default(i.BodyText)`
75
+ flex: 1;
75
76
  cursor: ${({isDisabled:m})=>m?"default":"pointer"};
76
77
  user-select: none;
77
78
  color: ${({theme:m,isDisabled:y})=>y?m.colors.text.disabled:m.colors.text.dark};
78
79
  margin-left: 0.5rem;
79
- `,f=({name:m=t.generateNameHash("check-box"),isDisabled:y=!1,size:k="regular",checked:$=!1,color:v="secondary",label:j,...q})=>d.default.createElement(p,null,d.default.createElement(b,{...q,type:"checkbox",checked:$,"data-validate":"checked",name:m,id:m,color:v,disabled:y,isDisabled:y,boxSize:k}),d.default.createElement(x,{size:k,color:v,isChecked:$,isDisabled:y},d.default.createElement(i.default,null)),j&&d.default.createElement(g,{as:"label",htmlFor:m,isDisabled:y},j));exports.CheckBox=f,exports.default=f;
80
+ `,g=({name:m=o.generateNameHash("check-box"),isDisabled:y=!1,size:k="regular",checked:$=!1,color:v="secondary",label:j,...q})=>d.default.createElement(p,null,d.default.createElement(x,{...q,type:"checkbox",checked:$,"data-validate":"checked",name:m,id:m,color:v,disabled:y,isDisabled:y,boxSize:k}),d.default.createElement(b,{size:k,color:v,isChecked:$,isDisabled:y},d.default.createElement(t.default,null)),j&&d.default.createElement(f,{as:"label",htmlFor:m,isDisabled:y},j));exports.CheckBox=g,exports.default=g;
@@ -1,34 +1,39 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../typography/BodyText/index.js");function o(i){return i&&typeof i=="object"&&"default"in i?i:{default:i}}require("react"),require("../shared/media-queries.js");var t=o(e);const s=e.css`
2
- color: ${({theme:i,hasError:d})=>d?i.colors.error.dark:i.colors.text.dark};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../typography/BodyText/index.js");function o(c){return c&&typeof c=="object"&&"default"in c?c:{default:c}}require("react"),require("../shared/media-queries.js");var t=o(e);const s=e.css`
2
+ color: ${({theme:c,hasError:n})=>n?c.colors.error.dark:c.colors.text.dark};
3
3
  `,a=e.css`
4
- color: ${({theme:i})=>i.colors.gray.light1};
5
- background-color: ${({theme:i})=>i.colors.background.light};
4
+ color: ${({theme:c})=>c.colors.gray.light1};
5
+ background-color: ${({theme:c})=>c.colors.background.light};
6
6
  `,l=e.css`
7
- text-align: center;
8
- width: 100%;
7
+ width: max-content;
9
8
  left: 0;
10
- `,c=t.default.label`
11
- ${r.CaptionStyle}
9
+ right: 0;
10
+ margin-right: auto;
11
+ margin-left: auto;
12
+ `,i=t.default.label`
13
+ ${r.BodyTextStyle}
12
14
  pointer-events: none;
13
15
  position: absolute;
16
+ max-width: calc(100% - 2rem);
14
17
  z-index: 1;
15
- top: ${({height:i})=>i?`${i}rem`:"1rem"};
18
+ top: ${({height:c})=>c?`${c}rem`:"0.75rem"};
16
19
  left: calc(0.75rem + 2px);
17
20
  transition: 150ms;
18
- height: 16px;
19
- line-height: 16px;
20
- font-size: 16px;
21
- color: ${({theme:i})=>i.colors.gray.dark5};
21
+ color: ${({theme:c})=>c.colors.gray.dark5};
22
+ overflow: hidden;
23
+ white-space: nowrap;
24
+ text-overflow: ellipsis;
22
25
 
23
- ${({centered:i})=>i&&l}
24
- ${({hasValue:i,isFocused:d,height:h,hasError:u})=>(i||d)&&((m,g)=>e.css`
25
- background-color: ${({theme:n})=>n.colors.background.light};
26
- transform: scale(0.75) translateY(${m});
26
+ ${({hasValue:c,isFocused:n,height:h=.7,hasError:u})=>(c||n)&&((m,g)=>e.css`
27
+ background-color: ${({theme:d})=>d.colors.background.light};
28
+ transform: translateY(${m});
29
+ line-height: 0.875rem;
30
+ font-size: 0.75rem;
27
31
  transform-origin: 0 0;
28
32
  padding: 0 ${"0.5rem"};
29
33
  left: ${"0.5rem"};
30
- color: ${({theme:n})=>g?n.colors.error.dark:n.colors.text.dark};
31
- `)(h?`-${1.35*(h+.25)}rem`:"-1.8rem",u)}
32
- ${({isFocused:i})=>i&&s}
33
- ${({disabled:i})=>i&&a}
34
- `;exports.Label=c;
34
+ color: ${({theme:d})=>g?d.colors.error.dark:d.colors.text.dark};
35
+ `)(`-${h+.4}rem`,u)}
36
+ ${({centered:c,hasValue:n,isFocused:h})=>(n||h)&&c&&l}
37
+ ${({isFocused:c})=>c&&s}
38
+ ${({disabled:c})=>c&&a}
39
+ `;exports.Label=i;
@@ -1,26 +1,32 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),r=require("../../theme.js");function o(f){return f&&typeof f=="object"&&"default"in f?f:{default:f}}var l=o(e),i=o(t);const a=i.default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),o=require("../../theme.js");function i(p){return p&&typeof p=="object"&&"default"in p?p:{default:p}}var r=i(e),n=i(t);const l=n.default.div`
2
2
  position: relative;
3
- height: 60vh;
4
- max-height: 600px;
5
- background-color: ${r.default.colors.primary.main};
3
+ min-height: 500px;
4
+ background-color: ${o.default.colors.primary.main};
6
5
  background-size: cover;
7
- `,d=i.default.div`
6
+ display: flex;
7
+ `,a=n.default.div`
8
+ pointer-events: ${({$pointerEvents:p})=>p};
8
9
  position: relative;
9
10
  display: flex;
11
+ flex-direction: ${({$direction:p})=>p};
12
+ align-items: ${({$align:p})=>p};
13
+ justify-content: ${({$justify:p})=>p};
10
14
  padding: 50px;
11
15
  z-index: 1;
12
- `,n=i.default.iframe`
16
+ flex: 1;
17
+ `,d=n.default.iframe`
13
18
  position: absolute;
14
19
  width: 100%;
15
20
  height: 100%;
16
21
  top: 0;
17
22
  left: 0;
18
- `,c=i.default.img`
23
+ `,s=p=>typeof p=="number",u=p=>typeof p=="string",c=n.default.img`
19
24
  position: absolute;
20
25
  top: 0;
21
26
  left: 0;
22
27
  height: 100%;
23
28
  width: 100%;
24
29
  object-fit: cover;
25
- background-color: ${r.default.colors.primary.main};
26
- `;function u(f){const{imageProps:s,containerStyle:m,videoProps:p,children:h}=f,v={objectPosition:`${(s==null?void 0:s.x)?s.x:"50%"} ${(s==null?void 0:s.y)?s.y:"50%"}`};return l.default.createElement(a,{style:m},p?l.default.createElement(n,{"data-testid":"hero-video",title:"video-frame",src:p.src,width:"100%",height:"100%",frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0}):l.default.createElement(l.default.Fragment,null,l.default.createElement(c,{src:s==null?void 0:s.src,alt:"Hero background",style:v}),l.default.createElement(d,null,h)))}exports.Hero=u,exports.default=u;
30
+ background-color: ${o.default.colors.primary.main};
31
+ object-position: ${({$positionX:p,$positionY:$})=>s(p)&&s($)?`${p}% ${$}%`:u(p)&&u($)?`${p} ${$}`:p||$?`${(s(p)?`${p}%`:p)||"50%"} ${(s($)?`${$}%`:$)||"50%"}`:"50% 50%"};
32
+ `;function f(p){const{imageProps:$,containerStyle:g,videoProps:m,children:v,align:b,direction:h,justify:x}=p,{autoplay:j=0,controls:w=0,disablekb:k=0,end:y,loop:E=0,modestbranding:q=1,start:P=0,showInfo:z=0}=(m==null?void 0:m.ytConfig)||{};return r.default.createElement(l,{style:g},m?r.default.createElement(d,{"data-testid":"hero-video",title:"video-frame",src:`${m.src}?disabledkb=${k}&autoplay=${j}&controls=${w}&loop=${E}&modestbranding=${q}&start=${P}&showInfo=${z}${y?`&end=${y}`:""}`,width:"100%",height:"100%",frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0}):r.default.createElement(c,{$positionX:$==null?void 0:$.x,$positionY:$==null?void 0:$.y,src:$==null?void 0:$.src,alt:"Hero background"}),r.default.createElement(a,{$pointerEvents:m?"none":"auto",$align:b||"flex-start",$direction:h||"column",$justify:x||"flex-start"},v))}exports.Hero=f,exports.default=f;
@@ -41,4 +41,4 @@
41
41
 
42
42
  transform: ${y=>y.$isMenuOpen?"rotate(-180deg)":"rotate(0deg)"};
43
43
  transform-origin: 50% 60%;
44
- `,g=({selectProps:{menuIsOpen:y=!1},isFocused:D=!1,isDisabled:I})=>d.default.createElement(h,{$isDisabled:I,$isFocused:D,$isMenuOpen:y,$theme:a.default}),b=({className:y,color:D="primary",forwardRef:I,hasError:L=!1,height:v,helperText:C,isDisabled:S=!1,onBlur:M=()=>null,onFocus:N=()=>null,onInputChange:O=()=>null,placeholder:_="",name:B,...$})=>{var q;const[k,T]=e.useState(!1),[R,z]=e.useState(""),E=({isSelected:x,isFocused:F,isDisabled:w})=>x?a.default.colors[D].main:w?a.default.colors.background.light:F?a.default.colors.background.gray:a.default.colors.background.light,A=((x,F)=>F?a.default.colors.error.main:x?a.default.colors.text.dark:a.default.colors.gray.light1)(k,L);return d.default.createElement(u,{className:y},$.label&&d.default.createElement(l.Label,{htmlFor:B,height:v,isFocused:k,hasValue:Boolean($.value||R),disabled:S,theme:a.default,hasError:L},$.label),$.prefix&&d.default.createElement(m,{isDisabled:S,isFocused:k},$.prefix),d.default.createElement(s.default,{...$,inputId:B,name:B,ref:I,isDisabled:S,onInputChange:(x,F)=>{O(x,F),z(x)},placeholder:_,onFocus:x=>{T(!0),N(x)},onBlur:x=>{T(!1),M(x)},styles:{control:x=>({...x,borderRadius:0,color:a.default.colors.text.dark,fontFamily:a.default.typography.fontBaseFamily,fontSize:"1rem",fontWeight:400,cursor:"pointer",padding:"0.7rem 0.75rem",backgroundColor:a.default.colors.background.light,borderColor:A,boxShadow:"none","&:hover":{borderColor:"none"},...f(S),...c(Boolean($.prefix))}),placeholder:x=>({...x,display:k?"static":"none"}),singleValue:x=>({...x,maxWidth:"calc(100% - 3.3rem)",width:"calc(100% - 3.3rem)"}),menuList:x=>({...x,padding:"8px 0"}),menu:x=>({...x,borderRadius:0,boxShadow:a.default.elevations.elevation2,zIndex:2,padding:"0"}),option:(x,{isSelected:F,isFocused:w,isDisabled:j})=>({...x,padding:"1rem",cursor:j?"not-allowed":"pointer","&:hover":{background:E({isSelected:F,isFocused:!0,isDisabled:j})},background:E({isSelected:F,isFocused:w}),...c(Boolean($.prefix))}),valueContainer:x=>({...x,position:"static",padding:v?v-1+"rem 0 ":0,height:v?"auto":"21px"}),clearIndicator:x=>({...x,paddingTop:0,paddingBottom:0})},components:{IndicatorSeparator:()=>null,DropdownIndicator:g,...(q=$.components)!=null?q:{}}}),C&&d.default.createElement(p,{hasError:L},C))};exports.Select=b,exports.default=b;
44
+ `,g=({selectProps:{menuIsOpen:y=!1},isFocused:D=!1,isDisabled:I})=>d.default.createElement(h,{$isDisabled:I,$isFocused:D,$isMenuOpen:y,$theme:a.default}),b=({className:y,color:D="primary",forwardRef:I,hasError:L=!1,height:v,helperText:C,isDisabled:S=!1,onBlur:M=()=>null,onFocus:N=()=>null,onInputChange:O=()=>null,placeholder:_="",name:B,...$})=>{var q;const[k,T]=e.useState(!1),[R,z]=e.useState(""),E=({isSelected:x,isFocused:F,isDisabled:w})=>x?a.default.colors[D].main:w?a.default.colors.background.light:F?a.default.colors.background.gray:a.default.colors.background.light,A=((x,F)=>F?a.default.colors.error.main:x?a.default.colors.text.dark:a.default.colors.gray.light1)(k,L);return d.default.createElement(u,{className:y},$.label&&d.default.createElement(l.Label,{htmlFor:B,height:v,isFocused:k,hasValue:Boolean($.value||R),disabled:S,theme:a.default,hasError:L},$.label),$.prefix&&d.default.createElement(m,{isDisabled:S,isFocused:k},$.prefix),d.default.createElement(s.default,{...$,inputId:B,name:B,ref:I,isDisabled:S,onInputChange:(x,F)=>{O(x,F),z(x)},placeholder:_,onFocus:x=>{T(!0),N(x)},onBlur:x=>{T(!1),M(x)},styles:{control:x=>({...x,borderRadius:0,color:a.default.colors.text.dark,fontFamily:a.default.typography.fontBaseFamily,fontSize:"1rem",fontWeight:400,cursor:"pointer",padding:"0.7rem 0.75rem",backgroundColor:a.default.colors.background.light,borderColor:A,boxShadow:"none",minHeight:"3rem","&:hover":{borderColor:"none"},...f(S),...c(Boolean($.prefix))}),placeholder:x=>({...x,display:k?"static":"none"}),singleValue:x=>({...x,maxWidth:"calc(100% - 3.3rem)",width:"calc(100% - 3.3rem)"}),menuList:x=>({...x,padding:"8px 0"}),menu:x=>({...x,borderRadius:0,boxShadow:a.default.elevations.elevation2,zIndex:2,padding:"0"}),option:(x,{isSelected:F,isFocused:w,isDisabled:j})=>({...x,padding:"1rem",cursor:j?"not-allowed":"pointer","&:hover":{background:E({isSelected:F,isFocused:!0,isDisabled:j})},background:E({isSelected:F,isFocused:w}),...c(Boolean($.prefix))}),valueContainer:x=>({...x,position:"static",padding:v?v-1+"rem 0 ":0,height:v?"auto":"21px"}),clearIndicator:x=>({...x,paddingTop:0,paddingBottom:0})},components:{IndicatorSeparator:()=>null,DropdownIndicator:g,...(q=$.components)!=null?q:{}}}),C&&d.default.createElement(p,{hasError:L},C))};exports.Select=b,exports.default=b;
@@ -1,33 +1,62 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),r=require("../../theme.js"),a=require("../../typography/Heading/index.js");function l(s){return s&&typeof s=="object"&&"default"in s?s:{default:s}}require("../../shared/media-queries.js");var i=l(e),n=l(t);const d=n.default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),i=require("styled-components"),t=require("../../typography/Heading/index.js"),o=require("../../icons/components/CheckmarkIcon.js");function r(p){return p&&typeof p=="object"&&"default"in p?p:{default:p}}require("../../shared/media-queries.js");var l=r(e),n=r(i);const a=n.default.div`
2
+ display: flex;
3
+ flex-direction: ${({isHorizontal:p})=>p?"row":"column"};
2
4
  min-height: 4rem;
3
- `,u=n.default.div`
4
- margin: auto;
5
- width: 2px;
6
- height: 100%;
7
- background-color: ${r.default.colors.primary.main};
8
- `,o=n.default.div`
9
- margin-right: 0.75rem;
10
- `,m=n.default.div`
11
- font-family: ${({theme:s})=>s.typography.fontBaseFamily};
5
+ margin: 0 auto;
6
+ `,s=n.default.div`
12
7
  display: flex;
13
- padding-bottom: 1rem;
8
+ flex-direction: ${({isHorizontal:p})=>p?"column":"row"};
9
+ column-gap: 0.75rem;
10
+ align-items: center;
11
+ padding: ${({isHorizontal:p})=>p?"0 0.5rem":"0.5rem 0"};
12
+ position: relative;
13
+ width: ${({isHorizontal:p,stepsNumber:z})=>p?`calc(100% / ${z})`:"100%"};
14
14
 
15
- &:last-child {
16
- ${u} {
17
- display: none;
18
- }
15
+ &:not(:first-child) :before {
16
+ position: absolute;
17
+ content: '';
18
+ top: ${({isHorizontal:p,size:z})=>p?`calc(${z/2}rem + 1px)`:"0"};
19
+ left: ${({isHorizontal:p,size:z})=>p?"0":`calc(${z/2}rem + 1px)`};
20
+ width: ${({isHorizontal:p,size:z})=>p?`calc(50% - ${z/2}rem)`:"2px"};
21
+ height: ${({isHorizontal:p,size:z})=>p?"2px":`calc(50% - ${z/2}rem)`};
22
+ background: ${({theme:p,color:z})=>p.colors[z].main};
19
23
  }
20
- `,f=n.default.div`
21
- width: 3rem;
22
- height: 3rem;
23
- border-radius: 3rem;
24
24
 
25
- color: white;
25
+ &:not(:last-child) :after {
26
+ position: absolute;
27
+ content: '';
28
+
29
+ ${({isHorizontal:p,size:z})=>p&&`
30
+ top: calc(${z/2}rem + 1px);
31
+ `}
32
+ ${({isHorizontal:p})=>!p&&`
33
+ bottom: 0;
34
+ `}
35
+ ${({isHorizontal:p})=>p&&`
36
+ right: 0;
37
+ `}
38
+ ${({isHorizontal:p,size:z})=>!p&&`
39
+ left: calc(${z/2}rem + 1px);
40
+ `}
41
+ width: ${({isHorizontal:p,size:z})=>p?`calc(50% - ${z/2}rem)`:"2px"};
42
+ height: ${({isHorizontal:p,size:z})=>p?"2px":`calc(50% - ${z/2}rem)`};
43
+ background: ${({theme:p,color:z})=>p.colors[z].main};
44
+ }
45
+ `,c=n.default.div``,d=n.default.div`
26
46
  display: flex;
27
47
  align-items: center;
28
48
  justify-content: center;
29
- background-color: ${r.default.colors.primary.main};
30
- `,c=n.default(a.Title)`
31
- font-size: 1.5rem;
32
- font-variant: lining-nums;
33
- `;exports.Stepper=({children:s,...h})=>i.default.createElement(d,{...h},s.map((y,p)=>i.default.createElement(m,{key:p},i.default.createElement(o,null,i.default.createElement(f,null,i.default.createElement(c,null,p+1)),i.default.createElement(u,null)),y)));
49
+ width: ${({size:p})=>p}rem;
50
+ height: ${({size:p})=>p}rem;
51
+ border-radius: 50%;
52
+ border: 2px solid ${({theme:p,color:z})=>p.colors[z].main};
53
+ color: ${({theme:p,isFilled:z})=>z?p.colors.text.light:p.colors.text.dark};
54
+ ${({theme:p,isFilled:z,color:f})=>z&&`
55
+ background-color: ${p.colors[f].main};
56
+ `}
57
+ `,m=n.default(t.TinyTitleRegular)`
58
+ font-size: ${({size:p})=>p/2+"rem"};
59
+ line-height: 1;
60
+ `,u=n.default(o.default)`
61
+ font-size: ${({size:p})=>`calc(${p/2}rem + 6px)`};
62
+ `;exports.Stepper=({children:p,orientation:z="vertical",variant:f="solid",color:x="primary",size:$=2,activeStep:g,...y})=>{const v=p.length,H=z==="horizontal";return l.default.createElement(a,{isHorizontal:H,...y},p.map((k,h)=>{const b=g&&h<g,j=b||f==="solid";return l.default.createElement(s,{key:h,color:x,size:$,stepsNumber:v,isHorizontal:H},l.default.createElement(c,null,l.default.createElement(d,{color:x,isFilled:j,size:$},b?l.default.createElement(u,{size:$}):l.default.createElement(m,{as:"span",size:$},h+1))),k)}))};
@@ -1,10 +1,10 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("styled-components"),l=require("../../theme.js"),t=require("../FieldLabel.js"),a=require("../../typography/BodyText/index.js");function o(b){return b&&typeof b=="object"&&"default"in b?b:{default:b}}require("../../shared/media-queries.js");var d=o(e),s=o(r);const i=r.css`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("styled-components"),l=require("../../theme.js"),t=require("../FieldLabel.js"),a=require("../../typography/BodyText/index.js");function o(x){return x&&typeof x=="object"&&"default"in x?x:{default:x}}require("../../shared/media-queries.js");var d=o(e),s=o(r);const i=r.css`
2
2
  border: 1px solid ${l.default.colors.gray.light1};
3
3
  color: ${l.default.colors.gray.dark1};
4
4
  fill: ${l.default.colors.gray.light1};
5
- `,n=r.css`
6
- border: 1px solid ${l.default.colors.error.main};
7
5
  `,c=r.css`
6
+ border: 1px solid ${l.default.colors.error.main};
7
+ `,n=r.css`
8
8
  color: ${l.default.colors.text.dark};
9
9
  border: 1px solid ${l.default.colors.text.dark};
10
10
  fill: ${l.default.colors.text.dark};
@@ -20,16 +20,15 @@
20
20
  background-color: ${l.default.colors.background.light};
21
21
 
22
22
  border: 1px solid ${l.default.colors.gray.light1};
23
- border-radius: 0.25em;
24
23
  transition: all 150ms;
25
24
 
26
25
  padding: 0.7rem 0.75rem;
27
26
 
28
- ${({hasError:b,isFocused:x})=>!b&&x&&c}
29
- ${({disabled:b})=>b&&i}
30
- ${({hasError:b})=>b&&n}
31
- ${({centered:b})=>b&&"text-align: center;"}
32
- `,h=s.default.textarea`
27
+ ${({hasError:x,isFocused:$})=>!x&&$&&n}
28
+ ${({disabled:x})=>x&&i}
29
+ ${({hasError:x})=>x&&c}
30
+ ${({centered:x})=>x&&"text-align: center;"}
31
+ `,m=s.default.textarea`
33
32
  ${a.BodyTextStyle}
34
33
 
35
34
  width: 100%;
@@ -38,18 +37,18 @@
38
37
  border: none;
39
38
  background-color: transparent;
40
39
 
41
- ${({resize:b})=>!b&&"resize: none;"}
42
- `,m=s.default.div`
43
- font-family: ${({theme:b})=>b.typography.fontBaseFamily};
44
- `,p=s.default.span`
45
- display: block;
46
- font-family: ${({theme:b})=>b.typography.fontBaseFamily};
47
- font-size: 0.81rem;
48
-
40
+ ${({resize:x})=>!x&&"resize: none;"}
41
+ `,p=s.default.div`
42
+ font-family: ${({theme:x})=>x.typography.fontBaseFamily};
43
+ `,h=s.default.div`
44
+ ${a.CaptionStyle}
49
45
  margin-top: 0.25rem;
50
- margin-left: 0.85rem;
51
-
52
- color: ${({hasError:b})=>b?l.default.colors.error.main:l.default.colors.text.dark};
53
46
 
54
- ${({centered:b})=>b&&"width: 100%; text-align: center; display: block;"}
55
- `,y=({placeholder:b="",isDisabled:x=!1,centered:g=!1,hasError:E=!1,className:j,helperText:q,label:k="",resize:B=!0,...$})=>{const[v,F]=e.useState(!1),z=Boolean($.value);return d.default.createElement(u,{className:j},d.default.createElement(f,{isFocused:v,disabled:x,centered:g,hasError:E,hasPlaceholder:!!b},d.default.createElement(h,{...$,resize:B,onFocus:()=>F(!0),onBlur:()=>F(!1),disabled:x,theme:l.default,placeholder:k&&!v?"":b}),$.suffix&&d.default.createElement(m,null,$.suffix)),k&&d.default.createElement(t.Label,{isFocused:v,centered:g,hasError:E,hasValue:z,disabled:x,theme:l.default},k),q&&d.default.createElement(p,{centered:g,hasError:E},q))};exports.TextArea=y,exports.default=y;
47
+ ${({centered:x})=>x&&"width: 100%; text-align: center;"}
48
+ `,b=s.default.span`
49
+ display: block;
50
+ color: ${({theme:x})=>x.colors.text.disabled};
51
+ `,y=s.default.span`
52
+ display: block;
53
+ color: ${({theme:x})=>x.colors.error.dark};
54
+ `,g=({placeholder:x="",isDisabled:$=!1,centered:v=!1,hasError:z=!1,className:w,helperText:q,label:E="",resize:L=!0,name:F,errors:j,...k})=>{const[B,T]=e.useState(!1),N=Boolean(k.value);return d.default.createElement(u,{className:w},d.default.createElement(f,{isFocused:B,disabled:$,centered:v,hasError:z,hasPlaceholder:!!x},d.default.createElement(m,{...k,name:F,"aria-label":E||F,resize:L,onFocus:()=>T(!0),onBlur:()=>T(!1),disabled:$,theme:l.default,placeholder:E&&!B?"":x}),k.suffix&&d.default.createElement(p,null,k.suffix)),E&&d.default.createElement(t.Label,{htmlFor:F,isFocused:B,centered:v,hasError:z,hasValue:N,disabled:$,theme:l.default},E),(q||j)&&d.default.createElement(h,{centered:v},q&&d.default.createElement(b,null,q),j&&j.map(S=>d.default.createElement(y,{key:S},S))))};exports.TextArea=g,exports.default=g;
@@ -1,36 +1,36 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("styled-components"),t=require("../FieldLabel.js"),l=require("../../typography/BodyText/index.js"),a=require("../../shared/helpers.js");function o(g){return g&&typeof g=="object"&&"default"in g?g:{default:g}}require("../../shared/media-queries.js");var d=o(e),s=o(r);const i=r.css`
2
- border: 1px solid ${({theme:g})=>g.colors.gray.light2}};
3
- color: ${({theme:g})=>g.colors.text.disabled};
4
- fill: ${({theme:g})=>g.colors.text.disabled};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("styled-components"),t=require("../FieldLabel.js"),l=require("../../typography/BodyText/index.js"),a=require("../../shared/helpers.js");function o(y){return y&&typeof y=="object"&&"default"in y?y:{default:y}}require("../../shared/media-queries.js");var d=o(e),s=o(r);const i=r.css`
2
+ border: 1px solid ${({theme:y})=>y.colors.gray.light2}};
3
+ color: ${({theme:y})=>y.colors.text.disabled};
4
+ fill: ${({theme:y})=>y.colors.text.disabled};
5
5
  `,n=r.css`
6
- border: 2px solid ${({theme:g})=>g.colors.error.dark};
6
+ border: 2px solid ${({theme:y})=>y.colors.error.dark};
7
7
  `,c=r.css`
8
- border: 2px solid ${({theme:g})=>g.colors.gray.dark5}};
9
- color: ${({theme:g})=>g.colors.text.dark};
10
- fill: ${({theme:g})=>g.colors.text.dark};
8
+ border: 2px solid ${({theme:y})=>y.colors.gray.dark5}};
9
+ color: ${({theme:y})=>y.colors.text.dark};
10
+ fill: ${({theme:y})=>y.colors.text.dark};
11
11
  `,u=s.default.div`
12
12
  position: relative;
13
13
  padding: 0;
14
14
  display: block;
15
- `,h=s.default.div`
15
+ `,m=s.default.div`
16
16
  display: flex;
17
17
  text-align: center;
18
18
  align-items: center;
19
19
  box-sizing: border-box;
20
20
  height: 3rem;
21
21
 
22
- background-color: ${({theme:g})=>g.colors.background.light};
22
+ background-color: ${({theme:y})=>y.colors.background.light};
23
23
 
24
- border: 1px solid ${({theme:g})=>g.colors.gray.dark5};
24
+ border: 1px solid ${({theme:y})=>y.colors.gray.dark5};
25
25
  transition: all 150ms;
26
26
 
27
- padding: 0.7rem 0.75rem 0.6rem;
27
+ padding: 0.75rem 0.6rem;
28
28
 
29
- ${({hasError:g,isFocused:y})=>!g&&y&&c}
30
- ${({disabled:g})=>g&&i}
31
- ${({hasError:g})=>g&&n}
32
- ${({centered:g})=>g&&"text-align: center;"}
33
- `,m=s.default.input`
29
+ ${({hasError:y,isFocused:k})=>!y&&k&&c}
30
+ ${({disabled:y})=>y&&i}
31
+ ${({hasError:y})=>y&&n}
32
+ ${({centered:y})=>y&&"text-align: center;"}
33
+ `,h=s.default.input`
34
34
  ${l.BodyTextStyle}
35
35
  width: 100%;
36
36
  cursor: text;
@@ -39,12 +39,12 @@
39
39
  background-color: transparent;
40
40
 
41
41
  :disabled {
42
- color: ${({theme:g})=>g.colors.text.disabled};
43
- fill: ${({theme:g})=>g.colors.text.disabled};
42
+ color: ${({theme:y})=>y.colors.text.disabled};
43
+ fill: ${({theme:y})=>y.colors.text.disabled};
44
44
  }
45
45
  `,f=s.default.span`
46
46
  display: flex;
47
- font-family: ${({theme:g})=>g.typography.fontBaseFamily};
47
+ font-family: ${({theme:y})=>y.typography.fontBaseFamily};
48
48
  font-size: 1.25rem;
49
49
  line-height: 1.5rem;
50
50
 
@@ -56,9 +56,11 @@
56
56
  ${l.CaptionStyle}
57
57
  margin-top: 0.25rem;
58
58
 
59
- color: ${({hasError:g,theme:y})=>g?y.colors.error.dark:y.colors.text.disabled};
60
-
61
- ${({centered:g})=>g&&"width: 100%; text-align: center;"}
59
+ ${({centered:y})=>y&&"width: 100%; text-align: center;"}
62
60
  `,b=s.default.span`
63
61
  display: block;
64
- `,x=({placeholder:g="",isDisabled:y=!1,centered:F=!1,hasError:q=!1,className:S,helperText:v,label:E="",onBlur:z=()=>null,onFocus:L=()=>null,forwardRef:P,suffix:w,name:k=a.generateNameHash("text-input"),errors:j,...T})=>{const[B,N]=e.useState(!1),_=Boolean(T.value);return d.default.createElement(u,{className:S},d.default.createElement(h,{isFocused:B,disabled:y,centered:F,hasError:q,hasPlaceholder:!!g},d.default.createElement(m,{...T,id:k,name:k,"aria-label":E||k,ref:P,onFocus:$=>{N(!0),L($)},onBlur:$=>{N(!1),z($)},disabled:y,placeholder:E&&!B?"":g}),w&&d.default.createElement(f,null,w)),E&&d.default.createElement(t.Label,{htmlFor:k,isFocused:B,centered:F,hasError:q,hasValue:_,disabled:y},E),(v||j)&&d.default.createElement(p,{centered:F,hasError:q},v&&d.default.createElement(b,null,v),j&&j.map($=>d.default.createElement(b,{key:$},$))))};exports.TextField=x,exports.default=x;
62
+ color: ${({theme:y})=>y.colors.text.disabled};
63
+ `,x=s.default.span`
64
+ display: block;
65
+ color: ${({theme:y})=>y.colors.error.dark};
66
+ `,g=({placeholder:y="",isDisabled:k=!1,centered:F=!1,hasError:w=!1,className:z,helperText:j,label:E="",onBlur:L=()=>null,onFocus:P=()=>null,forwardRef:_,suffix:T,name:q=a.generateNameHash("text-input"),errors:v,...N})=>{const[B,S]=e.useState(!1),C=Boolean(N.value);return d.default.createElement(u,{className:z},d.default.createElement(m,{isFocused:B,disabled:k,centered:F,hasError:w,hasPlaceholder:!!y},d.default.createElement(h,{...N,id:q,name:q,"aria-label":E||q,ref:_,onFocus:$=>{S(!0),P($)},onBlur:$=>{S(!1),L($)},disabled:k,placeholder:E&&!B?"":y}),T&&d.default.createElement(f,null,T)),E&&d.default.createElement(t.Label,{htmlFor:q,isFocused:B,centered:F,hasError:w,hasValue:C,disabled:k},E),(j||v)&&d.default.createElement(p,{centered:F},j&&d.default.createElement(b,null,j),v&&v.map($=>d.default.createElement(x,{key:$},$))))};exports.TextField=g,exports.default=g;
package/cjs/index.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./theme.js"),o=require("./shared/media-queries.js"),n=require("./components/Accordion/index.js"),r=require("./components/Button/index.js"),s=require("./components/IconButton.js"),t=require("./components/Textfield/index.js"),c=require("./components/TextArea/index.js"),i=require("./components/Tabs/Tabs.js"),p=require("./components/Tabs/Tab.js"),u=require("./components/ErrorMessage/index.js"),a=require("./components/Spinner/index.js"),I=require("./components/Modal/index.js"),l=require("./components/Dialog/index.js"),d=require("./components/OffCanvas/index.js"),x=require("./components/CheckBox/index.js"),m=require("./components/Snackbar/index.js"),q=require("./components/Select/index.js"),j=require("./components/ListItem/index.js"),f=require("./components/TimePicker/index.js"),S=require("./components/Hero/index.js"),C=require("./components/DayPicker/index.js"),g=require("./components/Logo/index.js"),y=require("./components/Badge/index.js"),k=require("./components/Toggle/index.js"),h=require("./components/Stepper/index.js"),T=require("./components/InlineStepper/Step.js"),B=require("./components/InlineStepper/index.js"),v=require("./components/StepperAccordion/index.js"),b=require("./components/Card/index.js"),F=require("./components/NotificationButton/index.js"),w=require("./components/Range/index.js"),L=require("./components/Chip/index.js"),P=require("./components/Breadcrumbs/index.js"),D=require("./components/Message/index.js"),M=require("./components/Header/index.js"),A=require("./components/MenuItem/index.js"),R=require("./icons/components/AddIcon.js"),H=require("./icons/components/AlertIcon.js"),N=require("./icons/components/ArrowDownIcon.js"),E=require("./icons/components/ArrowLeftIcon.js"),O=require("./icons/components/ArrowRightIcon.js"),V=require("./icons/components/ArrowUpIcon.js"),U=require("./icons/components/AtvIcon.js"),G=require("./icons/components/AuctionIcon.js"),W=require("./icons/components/BackIcon.js"),K=require("./icons/components/BankidIcon.js"),Q=require("./icons/components/BidIcon.js"),Y=require("./icons/components/BodyIcon.js"),z=require("./icons/components/BreaksIcon.js"),_=require("./icons/components/CabIcon.js"),J=require("./icons/components/CalendarIcon.js"),X=require("./icons/components/CameraIcon.js"),Z=require("./icons/components/CancelIcon.js"),$=require("./icons/components/CarIcon.js"),ee=require("./icons/components/CarServiceIcon.js"),oe=require("./icons/components/CaravanIcon.js"),ne=require("./icons/components/CertifiedIcon.js"),re=require("./icons/components/ChatIcon.js"),se=require("./icons/components/CheckCircleIcon.js"),te=require("./icons/components/CheckFilledIcon.js"),ce=require("./icons/components/CheckIcon.js"),ie=require("./icons/components/CheckmarkIcon.js"),pe=require("./icons/components/ClockIcon.js"),ue=require("./icons/components/CloseIcon.js"),ae=require("./icons/components/CommentFilledIcon.js"),Ie=require("./icons/components/CommentIcon.js"),le=require("./icons/components/ConditioningIcon.js"),de=require("./icons/components/ContactIcon.js"),xe=require("./icons/components/ControlNumberIcon.js"),me=require("./icons/components/CopyIcon.js"),qe=require("./icons/components/CountdownIcon.js"),je=require("./icons/components/CoupeIcon.js"),fe=require("./icons/components/CraneIcon.js"),Se=require("./icons/components/CupIcon.js"),Ce=require("./icons/components/DeleteIcon.js"),ge=require("./icons/components/DisplayIcon.js"),ye=require("./icons/components/DocumentIcon.js"),ke=require("./icons/components/EcoIcon.js"),he=require("./icons/components/EditIcon.js"),Te=require("./icons/components/EngineIcon.js"),Be=require("./icons/components/ErrorFilledIcon.js"),ve=require("./icons/components/ErrorIcon.js"),be=require("./icons/components/ExportIcon.js"),Fe=require("./icons/components/FacebookIcon.js"),we=require("./icons/components/FacilityIcon.js"),Le=require("./icons/components/FavouriteFilledIcon.js"),Pe=require("./icons/components/FavouriteIcon.js"),De=require("./icons/components/FigmaIcon.js"),Me=require("./icons/components/FilterIcon.js"),Ae=require("./icons/components/FinanceIcon.js"),Re=require("./icons/components/FirstIcon.js"),He=require("./icons/components/FixedPriceIcon.js"),Ne=require("./icons/components/FuelIcon.js"),Ee=require("./icons/components/GearboxIcon.js"),Oe=require("./icons/components/GetPaidIcon.js"),Ve=require("./icons/components/GridViewIcon.js"),Ue=require("./icons/components/HatchbackIcon.js"),Ge=require("./icons/components/HistoryIcon.js"),We=require("./icons/components/HomeDeliveryIcon.js"),Ke=require("./icons/components/IdIcon.js"),Qe=require("./icons/components/InfoIcon.js"),Ye=require("./icons/components/InstagramIcon.js"),ze=require("./icons/components/InsuranceIcon.js"),_e=require("./icons/components/InteriorIcon.js"),Je=require("./icons/components/KvdTestIcon.js"),Xe=require("./icons/components/KvdproIcon.js"),Ze=require("./icons/components/LastIcon.js"),$e=require("./icons/components/LeaderIcon.js"),eo=require("./icons/components/LinkedinIcon.js"),oo=require("./icons/components/ListViewIcon.js"),no=require("./icons/components/LocationIcon.js"),ro=require("./icons/components/MailIcon.js"),so=require("./icons/components/MenuIcon.js"),to=require("./icons/components/MileageIcon.js"),co=require("./icons/components/MinivanIcon.js"),io=require("./icons/components/ModelYearIcon.js"),po=require("./icons/components/MoreIcon.js"),uo=require("./icons/components/MotorbikeIcon.js"),ao=require("./icons/components/NavigationIcon.js"),Io=require("./icons/components/NewIcon.js"),lo=require("./icons/components/NextFilledIcon.js"),xo=require("./icons/components/NextIcon.js"),mo=require("./icons/components/NotificationIcon.js"),qo=require("./icons/components/OpenInNewIcon.js"),jo=require("./icons/components/PayementIcon.js"),fo=require("./icons/components/PhoneIcon.js"),So=require("./icons/components/PickUpIcon.js"),Co=require("./icons/components/Pickup.js"),go=require("./icons/components/PlayIcon.js"),yo=require("./icons/components/PreviousFilledIcon.js"),ko=require("./icons/components/PreviousIcon.js"),ho=require("./icons/components/PrintIcon.js"),To=require("./icons/components/RatingIcon.js"),Bo=require("./icons/components/ReleasingIcon.js"),vo=require("./icons/components/ReorderIcon.js"),bo=require("./icons/components/RestartIcon.js"),Fo=require("./icons/components/SalesOfferIcon.js"),wo=require("./icons/components/SavedSearchIcon.js"),Lo=require("./icons/components/ScheduleIcon.js"),Po=require("./icons/components/SearchIcon.js"),Do=require("./icons/components/SedanIcon.js"),Mo=require("./icons/components/SellIcon.js"),Ao=require("./icons/components/SettingsIcon.js"),Ro=require("./icons/components/ShareIcon.js"),Ho=require("./icons/components/ShowLessIcon.js"),No=require("./icons/components/ShowMoreIcon.js"),Eo=require("./icons/components/SignInIcon.js"),Oo=require("./icons/components/SignOutIcon.js"),Vo=require("./icons/components/SlackIcon.js"),Uo=require("./icons/components/SmartphoneIcon.js"),Go=require("./icons/components/SmileIcon.js"),Wo=require("./icons/components/SnowmobileIcon.js"),Ko=require("./icons/components/SortColumnIcon.js"),Qo=require("./icons/components/SortIcon.js"),Yo=require("./icons/components/StoreIcon.js"),zo=require("./icons/components/SuvIcon.js"),_o=require("./icons/components/ThreeSixtyIcon.js"),Jo=require("./icons/components/TrailerIcon.js"),Xo=require("./icons/components/TransportIcon.js"),Zo=require("./icons/components/TruckIcon.js"),$o=require("./icons/components/TwitterIcon.js"),en=require("./icons/components/TyresIcon.js"),on=require("./icons/components/UserIcon.js"),nn=require("./icons/components/ValuationIcon.js"),rn=require("./icons/components/VanIcon.js"),sn=require("./icons/components/ViewsIcon.js"),tn=require("./icons/components/WagonIcon.js"),cn=require("./icons/components/WarningIcon.js"),pn=require("./icons/components/WarrantyIcon.js"),un=require("./icons/components/YoutubeIcon.js"),an=require("./hooks/useDynamicScript.js"),In=require("./typography/Heading/index.js"),ln=require("./typography/BodyText/index.js"),dn=require("./typography/ButtonText/index.js"),xn=require("./components/RadioButton/index.js"),mn=require("./utils/utils.js");require("react"),require("styled-components"),require("react-collapse"),require("./components/Button/styles.js"),require("./components/FieldLabel.js"),require("./shared/helpers.js"),require("react-dom"),require("react-transition-group"),require("./components/Icons/Close.js"),require("./components/OffCanvas/Overlay.js"),require("./components/OffCanvas/useClickOutside.js"),require("./components/Icons/CheckCircle.js"),require("./components/Icons/ErrorCircle.js"),require("./components/Icons/InfoCircle.js"),require("react-select"),require("./shared/constants.js"),require("react-day-picker"),require("./components/DayPicker/DayPickerNavBar.js"),require("./components/Icons/Arrow.js"),require("./components/DayPicker/localeUtils.js"),require("./components/DayPicker/style.js"),require("./components/Logo/LogoSv.js"),require("./components/Logo/LogoEn.js"),require("./components/InlineStepper/StepCircle.js"),require("./components/Icons/CheckIcon.js"),require("./components/Chip/styles.js"),require("./components/Breadcrumbs/BreadcrumbsItem.js"),require("./components/Header/Hamburger.js"),require("./components/Header/Link.js"),exports.theme=e.default,exports.mediaQueries=o.mediaQueries,exports.mq=o.mq,exports.mqSizes=o.mqSizes,exports.Accordion=n.Accordion,exports.Button=r.Button,exports.IconButton=s.default,exports.TextField=t.TextField,exports.TextArea=c.TextArea,exports.Tabs=i.Tabs,exports.Tab=p.default,exports.ErrorMessage=u.ErrorMessage,exports.Spinner=a.default,exports.Modal=I.Modal,exports.Dialog=l.Dialog,exports.OffCanvas=d.OffCanvas,exports.CheckBox=x.CheckBox,exports.Snackbar=m.Snackbar,exports.Select=q.Select,exports.ListItem=j.default,exports.TimePicker=f.TimePicker,exports.Hero=S.Hero,exports.DayPicker=C.DayPicker,exports.Logo=g.Logo,exports.Badge=y.Badge,exports.Toggle=k.Toggle,exports.Stepper=h.Stepper,exports.Step=T.default,exports.InlineStepper=B.InlineStepper,exports.StepperAccordion=v.StepperAccordion,exports.Card=b.Card,exports.NotificationButton=F.NotificationButton,exports.Range=w.Range,exports.Chip=L.Chip,exports.Breadcrumbs=P.default,exports.Message=D.default,exports.Header=M.Header,exports.MenuItem=A.MenuItem,exports.AddIcon=R.default,exports.AlertIcon=H.default,exports.ArrowDownIcon=N.default,exports.ArrowLeftIcon=E.default,exports.ArrowRightIcon=O.default,exports.ArrowUpIcon=V.default,exports.AtvIcon=U.default,exports.AuctionIcon=G.default,exports.BackIcon=W.default,exports.BankidIcon=K.default,exports.BidIcon=Q.default,exports.BodyIcon=Y.default,exports.BreaksIcon=z.default,exports.CabIcon=_.default,exports.CalendarIcon=J.default,exports.CameraIcon=X.default,exports.CancelIcon=Z.default,exports.CarIcon=$.default,exports.CarServiceIcon=ee.default,exports.CaravanIcon=oe.default,exports.CertifiedIcon=ne.default,exports.ChatIcon=re.default,exports.CheckCircleIcon=se.default,exports.CheckFilledIcon=te.default,exports.CheckIcon=ce.default,exports.CheckmarkIcon=ie.default,exports.ClockIcon=pe.default,exports.CloseIcon=ue.default,exports.CommentFilledIcon=ae.default,exports.CommentIcon=Ie.default,exports.ConditioningIcon=le.default,exports.ContactIcon=de.default,exports.ControlNumberIcon=xe.default,exports.CopyIcon=me.default,exports.CountdownIcon=qe.default,exports.CoupeIcon=je.default,exports.CraneIcon=fe.default,exports.CupIcon=Se.default,exports.DeleteIcon=Ce.default,exports.DisplayIcon=ge.default,exports.DocumentIcon=ye.default,exports.EcoIcon=ke.default,exports.EditIcon=he.default,exports.EngineIcon=Te.default,exports.ErrorFilledIcon=Be.default,exports.ErrorIcon=ve.default,exports.ExportIcon=be.default,exports.FacebookIcon=Fe.default,exports.FacilityIcon=we.default,exports.FavouriteFilledIcon=Le.default,exports.FavouriteIcon=Pe.default,exports.FigmaIcon=De.default,exports.FilterIcon=Me.default,exports.FinanceIcon=Ae.default,exports.FirstIcon=Re.default,exports.FixedPriceIcon=He.default,exports.FuelIcon=Ne.default,exports.GearboxIcon=Ee.default,exports.GetPaidIcon=Oe.default,exports.GridViewIcon=Ve.default,exports.HatchbackIcon=Ue.default,exports.HistoryIcon=Ge.default,exports.HomeDeliveryIcon=We.default,exports.IdIcon=Ke.default,exports.InfoIcon=Qe.default,exports.InstagramIcon=Ye.default,exports.InsuranceIcon=ze.default,exports.InteriorIcon=_e.default,exports.KvdTestIcon=Je.default,exports.KvdproIcon=Xe.default,exports.LastIcon=Ze.default,exports.LeaderIcon=$e.default,exports.LinkedinIcon=eo.default,exports.ListViewIcon=oo.default,exports.LocationIcon=no.default,exports.MailIcon=ro.default,exports.MenuIcon=so.default,exports.MileageIcon=to.default,exports.MinivanIcon=co.default,exports.ModelYearIcon=io.default,exports.MoreIcon=po.default,exports.MotorbikeIcon=uo.default,exports.NavigationIcon=ao.default,exports.NewIcon=Io.default,exports.NextFilledIcon=lo.default,exports.NextIcon=xo.default,exports.NotificationIcon=mo.default,exports.OpenInNewIcon=qo.default,exports.PayementIcon=jo.default,exports.PhoneIcon=fo.default,exports.PickUpIcon=So.default,exports.Pickup=Co.default,exports.PlayIcon=go.default,exports.PreviousFilledIcon=yo.default,exports.PreviousIcon=ko.default,exports.PrintIcon=ho.default,exports.RatingIcon=To.default,exports.ReleasingIcon=Bo.default,exports.ReorderIcon=vo.default,exports.RestartIcon=bo.default,exports.SalesOfferIcon=Fo.default,exports.SavedSearchIcon=wo.default,exports.ScheduleIcon=Lo.default,exports.SearchIcon=Po.default,exports.SedanIcon=Do.default,exports.SellIcon=Mo.default,exports.SettingsIcon=Ao.default,exports.ShareIcon=Ro.default,exports.ShowLessIcon=Ho.default,exports.ShowMoreIcon=No.default,exports.SignInIcon=Eo.default,exports.SignOutIcon=Oo.default,exports.SlackIcon=Vo.default,exports.SmartphoneIcon=Uo.default,exports.SmileIcon=Go.default,exports.SnowmobileIcon=Wo.default,exports.SortColumnIcon=Ko.default,exports.SortIcon=Qo.default,exports.StoreIcon=Yo.default,exports.SuvIcon=zo.default,exports.ThreeSixtyIcon=_o.default,exports.TrailerIcon=Jo.default,exports.TransportIcon=Xo.default,exports.TruckIcon=Zo.default,exports.TwitterIcon=$o.default,exports.TyresIcon=en.default,exports.UserIcon=on.default,exports.ValuationIcon=nn.default,exports.VanIcon=rn.default,exports.ViewsIcon=sn.default,exports.WagonIcon=tn.default,exports.WarningIcon=cn.default,exports.WarrantyIcon=pn.default,exports.YoutubeIcon=un.default,exports.useDynamicScript=an.useDynamicScript,exports.Display1=In.Display1,exports.Display2=In.Display2,exports.Display3=In.Display3,exports.Headline=In.Headline,exports.Subtitle=In.Subtitle,exports.TinyTitleBold=In.TinyTitleBold,exports.TinyTitleRegular=In.TinyTitleRegular,exports.Title=In.Title,exports.BodyLink=ln.BodyLink,exports.BodyText=ln.BodyText,exports.Caption=ln.Caption,exports.CaptionLink=ln.CaptionLink,exports.Quote=ln.Quote,exports.Status=ln.Status,exports.ButtonLargeText=dn.ButtonLarge,exports.ButtonRegularText=dn.Button,exports.ButtonSmallText=dn.ButtonSmall,exports.RadioButton=xn.RadioButton,exports.resetButtonStyle=mn.resetButtonStyle;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./theme.js"),o=require("./shared/media-queries.js"),n=require("./components/Accordion/index.js"),r=require("./components/Button/index.js"),s=require("./components/IconButton.js"),t=require("./components/Textfield/index.js"),c=require("./components/TextArea/index.js"),i=require("./components/Tabs/Tabs.js"),p=require("./components/Tabs/Tab.js"),u=require("./components/ErrorMessage/index.js"),a=require("./components/Spinner/index.js"),I=require("./components/Modal/index.js"),l=require("./components/Dialog/index.js"),d=require("./components/OffCanvas/index.js"),x=require("./components/CheckBox/index.js"),m=require("./components/Snackbar/index.js"),q=require("./components/Select/index.js"),j=require("./components/ListItem/index.js"),f=require("./components/TimePicker/index.js"),C=require("./components/Hero/index.js"),S=require("./components/DayPicker/index.js"),g=require("./components/Logo/index.js"),y=require("./components/Badge/index.js"),k=require("./components/Toggle/index.js"),h=require("./components/Stepper/index.js"),T=require("./components/StepperAccordion/index.js"),B=require("./components/Card/index.js"),v=require("./components/NotificationButton/index.js"),b=require("./components/Range/index.js"),F=require("./components/Chip/index.js"),w=require("./components/Breadcrumbs/index.js"),L=require("./components/Message/index.js"),P=require("./components/Header/index.js"),D=require("./components/MenuItem/index.js"),M=require("./icons/components/AddIcon.js"),A=require("./icons/components/AlertIcon.js"),R=require("./icons/components/ArrowDownIcon.js"),H=require("./icons/components/ArrowLeftIcon.js"),N=require("./icons/components/ArrowRightIcon.js"),E=require("./icons/components/ArrowUpIcon.js"),O=require("./icons/components/AtvIcon.js"),V=require("./icons/components/AuctionIcon.js"),U=require("./icons/components/BackIcon.js"),G=require("./icons/components/BankidIcon.js"),W=require("./icons/components/BidIcon.js"),K=require("./icons/components/BodyIcon.js"),Q=require("./icons/components/BreaksIcon.js"),Y=require("./icons/components/CabIcon.js"),z=require("./icons/components/CalendarIcon.js"),_=require("./icons/components/CameraIcon.js"),J=require("./icons/components/CancelIcon.js"),X=require("./icons/components/CarIcon.js"),Z=require("./icons/components/CarServiceIcon.js"),$=require("./icons/components/CaravanIcon.js"),ee=require("./icons/components/CertifiedIcon.js"),oe=require("./icons/components/ChatIcon.js"),ne=require("./icons/components/CheckCircleIcon.js"),re=require("./icons/components/CheckFilledIcon.js"),se=require("./icons/components/CheckIcon.js"),te=require("./icons/components/CheckmarkIcon.js"),ce=require("./icons/components/ClockIcon.js"),ie=require("./icons/components/CloseIcon.js"),pe=require("./icons/components/CommentFilledIcon.js"),ue=require("./icons/components/CommentIcon.js"),ae=require("./icons/components/ConditioningIcon.js"),Ie=require("./icons/components/ContactIcon.js"),le=require("./icons/components/ControlNumberIcon.js"),de=require("./icons/components/CopyIcon.js"),xe=require("./icons/components/CountdownIcon.js"),me=require("./icons/components/CoupeIcon.js"),qe=require("./icons/components/CraneIcon.js"),je=require("./icons/components/CupIcon.js"),fe=require("./icons/components/DeleteIcon.js"),Ce=require("./icons/components/DisplayIcon.js"),Se=require("./icons/components/DocumentIcon.js"),ge=require("./icons/components/EcoIcon.js"),ye=require("./icons/components/EditIcon.js"),ke=require("./icons/components/EngineIcon.js"),he=require("./icons/components/ErrorFilledIcon.js"),Te=require("./icons/components/ErrorIcon.js"),Be=require("./icons/components/ExportIcon.js"),ve=require("./icons/components/FacebookIcon.js"),be=require("./icons/components/FacilityIcon.js"),Fe=require("./icons/components/FavouriteFilledIcon.js"),we=require("./icons/components/FavouriteIcon.js"),Le=require("./icons/components/FigmaIcon.js"),Pe=require("./icons/components/FilterIcon.js"),De=require("./icons/components/FinanceIcon.js"),Me=require("./icons/components/FirstIcon.js"),Ae=require("./icons/components/FixedPriceIcon.js"),Re=require("./icons/components/FuelIcon.js"),He=require("./icons/components/GearboxIcon.js"),Ne=require("./icons/components/GetPaidIcon.js"),Ee=require("./icons/components/GridViewIcon.js"),Oe=require("./icons/components/HatchbackIcon.js"),Ve=require("./icons/components/HistoryIcon.js"),Ue=require("./icons/components/HomeDeliveryIcon.js"),Ge=require("./icons/components/IdIcon.js"),We=require("./icons/components/InfoIcon.js"),Ke=require("./icons/components/InstagramIcon.js"),Qe=require("./icons/components/InsuranceIcon.js"),Ye=require("./icons/components/InteriorIcon.js"),ze=require("./icons/components/KvdTestIcon.js"),_e=require("./icons/components/KvdproIcon.js"),Je=require("./icons/components/LastIcon.js"),Xe=require("./icons/components/LeaderIcon.js"),Ze=require("./icons/components/LinkedinIcon.js"),$e=require("./icons/components/ListViewIcon.js"),eo=require("./icons/components/LocationIcon.js"),oo=require("./icons/components/MailIcon.js"),no=require("./icons/components/MenuIcon.js"),ro=require("./icons/components/MileageIcon.js"),so=require("./icons/components/MinivanIcon.js"),to=require("./icons/components/ModelYearIcon.js"),co=require("./icons/components/MoreIcon.js"),io=require("./icons/components/MotorbikeIcon.js"),po=require("./icons/components/NavigationIcon.js"),uo=require("./icons/components/NewIcon.js"),ao=require("./icons/components/NextFilledIcon.js"),Io=require("./icons/components/NextIcon.js"),lo=require("./icons/components/NotificationIcon.js"),xo=require("./icons/components/OpenInNewIcon.js"),mo=require("./icons/components/PayementIcon.js"),qo=require("./icons/components/PhoneIcon.js"),jo=require("./icons/components/PickUpIcon.js"),fo=require("./icons/components/Pickup.js"),Co=require("./icons/components/PlayIcon.js"),So=require("./icons/components/PreviousFilledIcon.js"),go=require("./icons/components/PreviousIcon.js"),yo=require("./icons/components/PrintIcon.js"),ko=require("./icons/components/RatingIcon.js"),ho=require("./icons/components/ReleasingIcon.js"),To=require("./icons/components/ReorderIcon.js"),Bo=require("./icons/components/RestartIcon.js"),vo=require("./icons/components/SalesOfferIcon.js"),bo=require("./icons/components/SavedSearchIcon.js"),Fo=require("./icons/components/ScheduleIcon.js"),wo=require("./icons/components/SearchIcon.js"),Lo=require("./icons/components/SedanIcon.js"),Po=require("./icons/components/SellIcon.js"),Do=require("./icons/components/SettingsIcon.js"),Mo=require("./icons/components/ShareIcon.js"),Ao=require("./icons/components/ShowLessIcon.js"),Ro=require("./icons/components/ShowMoreIcon.js"),Ho=require("./icons/components/SignInIcon.js"),No=require("./icons/components/SignOutIcon.js"),Eo=require("./icons/components/SlackIcon.js"),Oo=require("./icons/components/SmartphoneIcon.js"),Vo=require("./icons/components/SmileIcon.js"),Uo=require("./icons/components/SnowmobileIcon.js"),Go=require("./icons/components/SortColumnIcon.js"),Wo=require("./icons/components/SortIcon.js"),Ko=require("./icons/components/StoreIcon.js"),Qo=require("./icons/components/SuvIcon.js"),Yo=require("./icons/components/ThreeSixtyIcon.js"),zo=require("./icons/components/TrailerIcon.js"),_o=require("./icons/components/TransportIcon.js"),Jo=require("./icons/components/TruckIcon.js"),Xo=require("./icons/components/TwitterIcon.js"),Zo=require("./icons/components/TyresIcon.js"),$o=require("./icons/components/UserIcon.js"),en=require("./icons/components/ValuationIcon.js"),on=require("./icons/components/VanIcon.js"),nn=require("./icons/components/ViewsIcon.js"),rn=require("./icons/components/WagonIcon.js"),sn=require("./icons/components/WarningIcon.js"),tn=require("./icons/components/WarrantyIcon.js"),cn=require("./icons/components/YoutubeIcon.js"),pn=require("./hooks/useDynamicScript.js"),un=require("./typography/Heading/index.js"),an=require("./typography/BodyText/index.js"),In=require("./typography/ButtonText/index.js"),ln=require("./components/RadioButton/index.js"),dn=require("./utils/utils.js");require("react"),require("styled-components"),require("react-collapse"),require("./components/Button/styles.js"),require("./components/FieldLabel.js"),require("./shared/helpers.js"),require("react-dom"),require("react-transition-group"),require("./components/Icons/Close.js"),require("./components/OffCanvas/Overlay.js"),require("./components/OffCanvas/useClickOutside.js"),require("./components/Icons/CheckCircle.js"),require("./components/Icons/ErrorCircle.js"),require("./components/Icons/InfoCircle.js"),require("react-select"),require("./shared/constants.js"),require("react-day-picker"),require("./components/DayPicker/DayPickerNavBar.js"),require("./components/Icons/Arrow.js"),require("./components/DayPicker/localeUtils.js"),require("./components/DayPicker/style.js"),require("./components/Logo/LogoSv.js"),require("./components/Logo/LogoEn.js"),require("./components/Icons/CheckIcon.js"),require("./components/Chip/styles.js"),require("./components/Breadcrumbs/BreadcrumbsItem.js"),require("./components/Header/Hamburger.js"),require("./components/Header/Link.js"),exports.theme=e.default,exports.mediaQueries=o.mediaQueries,exports.mq=o.mq,exports.mqSizes=o.mqSizes,exports.Accordion=n.Accordion,exports.Button=r.Button,exports.IconButton=s.default,exports.TextField=t.TextField,exports.TextArea=c.TextArea,exports.Tabs=i.Tabs,exports.Tab=p.default,exports.ErrorMessage=u.ErrorMessage,exports.Spinner=a.default,exports.Modal=I.Modal,exports.Dialog=l.Dialog,exports.OffCanvas=d.OffCanvas,exports.CheckBox=x.CheckBox,exports.Snackbar=m.Snackbar,exports.Select=q.Select,exports.ListItem=j.default,exports.TimePicker=f.TimePicker,exports.Hero=C.Hero,exports.DayPicker=S.DayPicker,exports.Logo=g.Logo,exports.Badge=y.Badge,exports.Toggle=k.Toggle,exports.Stepper=h.Stepper,exports.StepperAccordion=T.StepperAccordion,exports.Card=B.Card,exports.NotificationButton=v.NotificationButton,exports.Range=b.Range,exports.Chip=F.Chip,exports.Breadcrumbs=w.default,exports.Message=L.default,exports.Header=P.Header,exports.MenuItem=D.MenuItem,exports.AddIcon=M.default,exports.AlertIcon=A.default,exports.ArrowDownIcon=R.default,exports.ArrowLeftIcon=H.default,exports.ArrowRightIcon=N.default,exports.ArrowUpIcon=E.default,exports.AtvIcon=O.default,exports.AuctionIcon=V.default,exports.BackIcon=U.default,exports.BankidIcon=G.default,exports.BidIcon=W.default,exports.BodyIcon=K.default,exports.BreaksIcon=Q.default,exports.CabIcon=Y.default,exports.CalendarIcon=z.default,exports.CameraIcon=_.default,exports.CancelIcon=J.default,exports.CarIcon=X.default,exports.CarServiceIcon=Z.default,exports.CaravanIcon=$.default,exports.CertifiedIcon=ee.default,exports.ChatIcon=oe.default,exports.CheckCircleIcon=ne.default,exports.CheckFilledIcon=re.default,exports.CheckIcon=se.default,exports.CheckmarkIcon=te.default,exports.ClockIcon=ce.default,exports.CloseIcon=ie.default,exports.CommentFilledIcon=pe.default,exports.CommentIcon=ue.default,exports.ConditioningIcon=ae.default,exports.ContactIcon=Ie.default,exports.ControlNumberIcon=le.default,exports.CopyIcon=de.default,exports.CountdownIcon=xe.default,exports.CoupeIcon=me.default,exports.CraneIcon=qe.default,exports.CupIcon=je.default,exports.DeleteIcon=fe.default,exports.DisplayIcon=Ce.default,exports.DocumentIcon=Se.default,exports.EcoIcon=ge.default,exports.EditIcon=ye.default,exports.EngineIcon=ke.default,exports.ErrorFilledIcon=he.default,exports.ErrorIcon=Te.default,exports.ExportIcon=Be.default,exports.FacebookIcon=ve.default,exports.FacilityIcon=be.default,exports.FavouriteFilledIcon=Fe.default,exports.FavouriteIcon=we.default,exports.FigmaIcon=Le.default,exports.FilterIcon=Pe.default,exports.FinanceIcon=De.default,exports.FirstIcon=Me.default,exports.FixedPriceIcon=Ae.default,exports.FuelIcon=Re.default,exports.GearboxIcon=He.default,exports.GetPaidIcon=Ne.default,exports.GridViewIcon=Ee.default,exports.HatchbackIcon=Oe.default,exports.HistoryIcon=Ve.default,exports.HomeDeliveryIcon=Ue.default,exports.IdIcon=Ge.default,exports.InfoIcon=We.default,exports.InstagramIcon=Ke.default,exports.InsuranceIcon=Qe.default,exports.InteriorIcon=Ye.default,exports.KvdTestIcon=ze.default,exports.KvdproIcon=_e.default,exports.LastIcon=Je.default,exports.LeaderIcon=Xe.default,exports.LinkedinIcon=Ze.default,exports.ListViewIcon=$e.default,exports.LocationIcon=eo.default,exports.MailIcon=oo.default,exports.MenuIcon=no.default,exports.MileageIcon=ro.default,exports.MinivanIcon=so.default,exports.ModelYearIcon=to.default,exports.MoreIcon=co.default,exports.MotorbikeIcon=io.default,exports.NavigationIcon=po.default,exports.NewIcon=uo.default,exports.NextFilledIcon=ao.default,exports.NextIcon=Io.default,exports.NotificationIcon=lo.default,exports.OpenInNewIcon=xo.default,exports.PayementIcon=mo.default,exports.PhoneIcon=qo.default,exports.PickUpIcon=jo.default,exports.Pickup=fo.default,exports.PlayIcon=Co.default,exports.PreviousFilledIcon=So.default,exports.PreviousIcon=go.default,exports.PrintIcon=yo.default,exports.RatingIcon=ko.default,exports.ReleasingIcon=ho.default,exports.ReorderIcon=To.default,exports.RestartIcon=Bo.default,exports.SalesOfferIcon=vo.default,exports.SavedSearchIcon=bo.default,exports.ScheduleIcon=Fo.default,exports.SearchIcon=wo.default,exports.SedanIcon=Lo.default,exports.SellIcon=Po.default,exports.SettingsIcon=Do.default,exports.ShareIcon=Mo.default,exports.ShowLessIcon=Ao.default,exports.ShowMoreIcon=Ro.default,exports.SignInIcon=Ho.default,exports.SignOutIcon=No.default,exports.SlackIcon=Eo.default,exports.SmartphoneIcon=Oo.default,exports.SmileIcon=Vo.default,exports.SnowmobileIcon=Uo.default,exports.SortColumnIcon=Go.default,exports.SortIcon=Wo.default,exports.StoreIcon=Ko.default,exports.SuvIcon=Qo.default,exports.ThreeSixtyIcon=Yo.default,exports.TrailerIcon=zo.default,exports.TransportIcon=_o.default,exports.TruckIcon=Jo.default,exports.TwitterIcon=Xo.default,exports.TyresIcon=Zo.default,exports.UserIcon=$o.default,exports.ValuationIcon=en.default,exports.VanIcon=on.default,exports.ViewsIcon=nn.default,exports.WagonIcon=rn.default,exports.WarningIcon=sn.default,exports.WarrantyIcon=tn.default,exports.YoutubeIcon=cn.default,exports.useDynamicScript=pn.useDynamicScript,exports.Display1=un.Display1,exports.Display2=un.Display2,exports.Display3=un.Display3,exports.Headline=un.Headline,exports.Subtitle=un.Subtitle,exports.TinyTitleBold=un.TinyTitleBold,exports.TinyTitleRegular=un.TinyTitleRegular,exports.Title=un.Title,exports.BodyLink=an.BodyLink,exports.BodyText=an.BodyText,exports.Caption=an.Caption,exports.CaptionLink=an.CaptionLink,exports.Quote=an.Quote,exports.Status=an.Status,exports.ButtonLargeText=In.ButtonLarge,exports.ButtonRegularText=In.Button,exports.ButtonSmallText=In.ButtonSmall,exports.RadioButton=ln.RadioButton,exports.resetButtonStyle=dn.resetButtonStyle;
@@ -1,4 +1,4 @@
1
- import t from"react";import i,{css as r}from"styled-components";import{generateNameHash as m}from"../../shared/helpers.js";import s from"../../theme.js";import{BodyText as x}from"../../typography/BodyText/index.js";import g from"../../icons/components/CheckmarkIcon.js";import{BackgroundStyles as u}from"../IconButton.js";import"../../shared/media-queries.js";const b=r`
1
+ import t from"react";import i,{css as r}from"styled-components";import m from"../../icons/components/CheckmarkIcon.js";import{generateNameHash as x}from"../../shared/helpers.js";import s from"../../theme.js";import{BodyText as g}from"../../typography/BodyText/index.js";import{BackgroundStyles as u}from"../IconButton.js";import"../../shared/media-queries.js";const b=r`
2
2
  width: 24px;
3
3
  height: 24px;
4
4
 
@@ -31,7 +31,7 @@ import t from"react";import i,{css as r}from"styled-components";import{generateN
31
31
  background: ${s.colors.gray.light2};
32
32
  `,v=i.div`
33
33
  display: flex;
34
- align-items: center;
34
+ align-items: flex-start;
35
35
  box-sizing: border-box;
36
36
  `,z=i.input.attrs({type:"checkbox"})`
37
37
  position: absolute;
@@ -71,9 +71,10 @@ import t from"react";import i,{css as r}from"styled-components";import{generateN
71
71
  ${e=>e.isDisabled&&y};
72
72
 
73
73
  ${e=>e.isChecked&&e.isDisabled&&$};
74
- `,S=i(x)`
74
+ `,S=i(g)`
75
+ flex: 1;
75
76
  cursor: ${({isDisabled:e})=>e?"default":"pointer"};
76
77
  user-select: none;
77
78
  color: ${({theme:e,isDisabled:o})=>o?e.colors.text.disabled:e.colors.text.dark};
78
79
  margin-left: 0.5rem;
79
- `,h=({name:e=m("check-box"),isDisabled:o=!1,size:c="regular",checked:n=!1,color:a="secondary",label:l,...p})=>t.createElement(v,null,t.createElement(z,{...p,type:"checkbox",checked:n,"data-validate":"checked",name:e,id:e,color:a,disabled:o,isDisabled:o,boxSize:c}),t.createElement(C,{size:c,color:a,isChecked:n,isDisabled:o},t.createElement(g,null)),l&&t.createElement(S,{as:"label",htmlFor:e,isDisabled:o},l));export{h as CheckBox,h as default};
80
+ `,h=({name:e=x("check-box"),isDisabled:o=!1,size:c="regular",checked:n=!1,color:a="secondary",label:l,...p})=>t.createElement(v,null,t.createElement(z,{...p,type:"checkbox",checked:n,"data-validate":"checked",name:e,id:e,color:a,disabled:o,isDisabled:o,boxSize:c}),t.createElement(C,{size:c,color:a,isChecked:n,isDisabled:o},t.createElement(m,null)),l&&t.createElement(S,{as:"label",htmlFor:e,isDisabled:o},l));export{h as CheckBox,h as default};
@@ -1,34 +1,39 @@
1
- import c,{css as e}from"styled-components";import{CaptionStyle as n}from"../typography/BodyText/index.js";import"react";import"../shared/media-queries.js";const s="0.5rem",a=(o,t)=>e`
1
+ import a,{css as e}from"styled-components";import{BodyTextStyle as c}from"../typography/BodyText/index.js";import"react";import"../shared/media-queries.js";const l="0.5rem",n=(o,t)=>e`
2
2
  background-color: ${({theme:r})=>r.colors.background.light};
3
- transform: scale(0.75) translateY(${o});
3
+ transform: translateY(${o});
4
+ line-height: 0.875rem;
5
+ font-size: 0.75rem;
4
6
  transform-origin: 0 0;
5
- padding: 0 ${s};
6
- left: ${s};
7
+ padding: 0 ${l};
8
+ left: ${l};
7
9
  color: ${({theme:r})=>t?r.colors.error.dark:r.colors.text.dark};
8
10
  `,i=e`
9
11
  color: ${({theme:o,hasError:t})=>t?o.colors.error.dark:o.colors.text.dark};
10
12
  `,d=e`
11
13
  color: ${({theme:o})=>o.colors.gray.light1};
12
14
  background-color: ${({theme:o})=>o.colors.background.light};
13
- `,p=e`
14
- text-align: center;
15
- width: 100%;
15
+ `,m=e`
16
+ width: max-content;
16
17
  left: 0;
17
- `,$=c.label`
18
- ${n}
18
+ right: 0;
19
+ margin-right: auto;
20
+ margin-left: auto;
21
+ `,g=a.label`
22
+ ${c}
19
23
  pointer-events: none;
20
24
  position: absolute;
25
+ max-width: calc(100% - 2rem);
21
26
  z-index: 1;
22
- top: ${({height:o})=>o?`${o}rem`:"1rem"};
27
+ top: ${({height:o})=>o?`${o}rem`:"0.75rem"};
23
28
  left: calc(0.75rem + 2px);
24
29
  transition: 150ms;
25
- height: 16px;
26
- line-height: 16px;
27
- font-size: 16px;
28
30
  color: ${({theme:o})=>o.colors.gray.dark5};
31
+ overflow: hidden;
32
+ white-space: nowrap;
33
+ text-overflow: ellipsis;
29
34
 
30
- ${({centered:o})=>o&&p}
31
- ${({hasValue:o,isFocused:t,height:r,hasError:l})=>(o||t)&&a(r?`-${(r+.25)*1.35}rem`:"-1.8rem",l)}
35
+ ${({hasValue:o,isFocused:t,height:r=.7,hasError:s})=>(o||t)&&n(`-${r+.4}rem`,s)}
36
+ ${({centered:o,hasValue:t,isFocused:r})=>(t||r)&&o&&m}
32
37
  ${({isFocused:o})=>o&&i}
33
38
  ${({disabled:o})=>o&&d}
34
- `;export{$ as Label};
39
+ `;export{g as Label};