@kvdbil/components 17.2.3 → 17.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/cjs/components/Accordion/index.js +3 -3
  2. package/cjs/components/Breadcrumbs/index.js +2 -2
  3. package/cjs/components/CheckBox/index.js +20 -17
  4. package/cjs/components/EditRow/index.js +2 -2
  5. package/cjs/components/RadioButton/index.js +4 -4
  6. package/cjs/components/Stepper/index.js +6 -6
  7. package/cjs/components/StepperAccordion/index.js +17 -17
  8. package/cjs/components/TextArea/index.js +8 -8
  9. package/cjs/components/Textfield/index.js +11 -11
  10. package/cjs/hooks/useNameAndId.js +1 -0
  11. package/cjs/index.js +1 -1
  12. package/cjs/shared/helpers.js +1 -1
  13. package/cjs/utils/utils.js +4 -0
  14. package/esm/components/Accordion/index.js +9 -9
  15. package/esm/components/Breadcrumbs/index.js +2 -2
  16. package/esm/components/CheckBox/index.js +21 -18
  17. package/esm/components/EditRow/index.js +1 -1
  18. package/esm/components/RadioButton/index.js +19 -19
  19. package/esm/components/Stepper/index.js +6 -6
  20. package/esm/components/StepperAccordion/index.js +15 -15
  21. package/esm/components/TextArea/index.js +14 -14
  22. package/esm/components/Textfield/index.js +11 -11
  23. package/esm/hooks/useNameAndId.js +1 -0
  24. package/esm/index.js +1 -1
  25. package/esm/shared/helpers.js +1 -1
  26. package/esm/utils/utils.js +4 -0
  27. package/package.json +1 -1
  28. package/package.json.tmp +1 -1
  29. package/types/components/CheckBox/index.d.ts +1 -1
  30. package/types/components/RadioButton/index.d.ts +1 -1
  31. package/types/components/TextArea/index.d.ts +1 -1
  32. package/types/components/Textfield/index.d.ts +1 -1
  33. package/types/hooks/useNameAndId.d.ts +4 -0
  34. package/types/index.d.ts +2 -0
  35. package/types/shared/helpers.d.ts +1 -1
@@ -1,7 +1,7 @@
1
- import{jsx as r}from"react/jsx-runtime";import{useRef as m}from"react";import l from"styled-components";import s from"./BreadcrumbsItem.js";import p from"../../icons/components/NextIcon.js";import{generateNameHash as d}from"../../shared/helpers.js";import"../../typography/BodyText/index.js";import"../../shared/media-queries.js";const c=l.ol`
1
+ import{jsx as r}from"react/jsx-runtime";import m from"styled-components";import p from"./BreadcrumbsItem.js";import l from"../../icons/components/NextIcon.js";import{useNameAndId as d}from"../../hooks/useNameAndId.js";import"../../typography/BodyText/index.js";import"../../shared/media-queries.js";import"react";import"../../shared/helpers.js";const s=m.ol`
2
2
  display: flex;
3
3
  align-items: center;
4
4
  padding: 0;
5
5
  white-space: nowrap;
6
6
  overflow: hidden;
7
- `,f=({links:e,separator:o=r(p,{}),onlyLastTruncated:n=!1})=>{const t=m(d("breadcrumb"));return r("nav",{"aria-label":"Breadcrumb",id:t.current,children:r(c,{children:e.map((i,a)=>r(s,{link:i,separator:o,isLast:a===e.length-1,onlyLastTruncated:n},`${t.current}-${a}`))})})};export{f as default};
7
+ `,c=({links:a,separator:e=r(l,{}),onlyLastTruncated:i=!1})=>{const{id:o}=d("breadcrumb");return r("nav",{"aria-label":"Breadcrumb",id:o,children:r(s,{children:a.map((n,t)=>r(p,{link:n,separator:e,isLast:t===a.length-1,onlyLastTruncated:i},`${o}-${t}`))})})};export{c as default};
@@ -1,4 +1,4 @@
1
- import{jsxs as m,jsx as s}from"react/jsx-runtime";import a,{css as r}from"styled-components";import g from"../../icons/components/CheckmarkIcon.js";import{generateNameHash as $}from"../../shared/helpers.js";import i from"../../theme.js";import{BodyText as f}from"../../typography/BodyText/index.js";import{BackgroundStyles as u}from"../IconButton.js";import"../../shared/media-queries.js";import"../../utils/utils.js";const k=r`
1
+ import{jsxs as u,jsx as s}from"react/jsx-runtime";import a,{css as r}from"styled-components";import f from"../../icons/components/CheckmarkIcon.js";import i from"../../theme.js";import{BodyText as $}from"../../typography/BodyText/index.js";import{BackgroundStyles as k}from"../IconButton.js";import{useNameAndId as v}from"../../hooks/useNameAndId.js";import"../../shared/media-queries.js";import"../../utils/utils.js";import"react";import"../../shared/helpers.js";const y=r`
2
2
  width: 24px;
3
3
  height: 24px;
4
4
 
@@ -6,7 +6,7 @@ import{jsxs as m,jsx as s}from"react/jsx-runtime";import a,{css as r}from"styled
6
6
  width: 15px;
7
7
  height: 15px;
8
8
  }
9
- `,v=r`
9
+ `,z=r`
10
10
  width: 32px;
11
11
  height: 32px;
12
12
 
@@ -14,10 +14,10 @@ import{jsxs as m,jsx as s}from"react/jsx-runtime";import a,{css as r}from"styled
14
14
  width: 22px;
15
15
  height: 22px;
16
16
  }
17
- `,p={regular:k,large:v},y=r`
17
+ `,b={regular:y,large:z},D=r`
18
18
  cursor: default;
19
19
  border: 2px solid ${i.colors.grayscaleToned.light2};
20
- `,z=(e,o)=>r`
20
+ `,S=(e,o)=>r`
21
21
  svg {
22
22
  opacity: 1;
23
23
  }
@@ -27,17 +27,17 @@ import{jsxs as m,jsx as s}from"react/jsx-runtime";import a,{css as r}from"styled
27
27
 
28
28
  background: ${i.colors[e][o]};
29
29
  border: 2px solid ${i.colors[e][o]};
30
- `,D=r`
30
+ `,w=r`
31
31
  background: ${i.colors.grayscaleToned.light2};
32
32
  z-index: 1;
33
- `,S=r`
33
+ `,C=r`
34
34
  border: 2px solid ${i.colors.error.dark};
35
- `,w=a.div`
35
+ `,T=a.div`
36
36
  display: flex;
37
37
  align-items: flex-start;
38
38
  box-sizing: border-box;
39
39
  position: relative;
40
- `,C=a.input.attrs({type:"checkbox"})`
40
+ `,j=a.input.attrs({type:"checkbox"})`
41
41
  position: absolute;
42
42
  appearance: none;
43
43
  width: 100%;
@@ -47,14 +47,17 @@ import{jsxs as m,jsx as s}from"react/jsx-runtime";import a,{css as r}from"styled
47
47
  outline: none;
48
48
  cursor: pointer;
49
49
  z-index: 1;
50
- ${e=>p[e.boxSize]};
50
+ ${e=>b[e.boxSize]};
51
51
 
52
52
  &:hover,
53
53
  &:focus {
54
54
  transition: background-color 400ms;
55
- ${u}
55
+ ${k}
56
56
  }
57
- `,T=a.span`
57
+ &:focus-visible {
58
+ outline: revert;
59
+ }
60
+ `,B=a.span`
58
61
  box-sizing: border-box;
59
62
  cursor: pointer;
60
63
  display: flex;
@@ -65,21 +68,21 @@ import{jsxs as m,jsx as s}from"react/jsx-runtime";import a,{css as r}from"styled
65
68
 
66
69
  border: 2px solid ${i.colors.grayscaleToned.dark5};
67
70
 
68
- ${e=>p[e.size]};
71
+ ${e=>b[e.size]};
69
72
 
70
73
  svg {
71
74
  opacity: 0;
72
75
  color: ${({theme:e})=>e.colors.common.white};
73
76
  }
74
77
 
75
- ${e=>e.isChecked&&z(e.$color,e.$colorShade)};
76
- ${e=>e.isDisabled&&y};
77
- ${e=>e.hasError&&S};
78
- ${e=>e.isChecked&&e.isDisabled&&D};
79
- `,j=a(f)`
78
+ ${e=>e.isChecked&&S(e.$color,e.$colorShade)};
79
+ ${e=>e.isDisabled&&D};
80
+ ${e=>e.hasError&&C};
81
+ ${e=>e.isChecked&&e.isDisabled&&w};
82
+ `,E=a($)`
80
83
  flex: 1;
81
84
  cursor: ${({isDisabled:e})=>e?"default":"pointer"};
82
85
  user-select: none;
83
86
  color: ${({theme:e,isDisabled:o})=>o?e.colors.text.disabled:e.colors.text.dark};
84
87
  margin-left: 0.5rem;
85
- `,x=({name:e=$("check-box"),isDisabled:o=!1,size:d="regular",checked:l=!1,color:c="secondary",colorShade:n="mainAlt",hasError:h=!1,label:t,...b})=>m(w,{children:[s(C,{...b,type:"checkbox",checked:l,"data-validate":"checked",name:e,id:e,$color:c,$colorShade:n,disabled:o,isDisabled:o,boxSize:d,"aria-label":t?void 0:e,"aria-checked":l,"aria-invalid":h||void 0}),s(T,{size:d,$color:c,$colorShade:n,isChecked:l,isDisabled:o,hasError:h,children:s(g,{})}),t&&s(j,{as:"label",htmlFor:e,isDisabled:o,children:t})]});export{x as CheckBox,x as default};
88
+ `,m=({name:e,isDisabled:o=!1,size:d="regular",checked:l=!1,color:c="secondary",colorShade:n="mainAlt",hasError:h=!1,label:t,...g})=>{const{name:p,id:x}=v("check-box",e);return u(T,{children:[s(j,{...g,type:"checkbox",checked:l,"data-validate":"checked",name:p,id:x,$color:c,$colorShade:n,disabled:o,isDisabled:o,boxSize:d,"aria-label":t?void 0:p,"aria-checked":l,"aria-invalid":h||void 0}),s(B,{size:d,$color:c,$colorShade:n,isChecked:l,isDisabled:o,hasError:h,children:s(f,{})}),t&&s(E,{as:"label",htmlFor:x,isDisabled:o,children:t})]})};export{m as CheckBox,m as default};
@@ -1,4 +1,4 @@
1
- import{jsxs as m,Fragment as Q,jsx as t}from"react/jsx-runtime";import{useState as s,useEffect as R}from"react";import i from"styled-components";import v from"../../theme.js";import{BodyLink as U,BodyText as V}from"../../typography/BodyText/index.js";import{Button as f}from"../Button/index.js";import{Chip as W}from"../Chip/index.js";import{TextField as X}from"../Textfield/index.js";import"../../shared/media-queries.js";import"../Spinner/index.js";import"../../utils/utils.js";import"../../typography/ButtonText/index.js";import"../Button/styles.js";import"../../icons/components/CloseIcon.js";import"../Chip/styles.js";import"../FieldLabel.js";import"../../shared/helpers.js";const Y=i.div`
1
+ import{jsxs as m,Fragment as Q,jsx as t}from"react/jsx-runtime";import{useState as s,useEffect as R}from"react";import i from"styled-components";import v from"../../theme.js";import{BodyLink as U,BodyText as V}from"../../typography/BodyText/index.js";import{Button as f}from"../Button/index.js";import{Chip as W}from"../Chip/index.js";import{TextField as X}from"../Textfield/index.js";import"../../shared/media-queries.js";import"../Spinner/index.js";import"../../utils/utils.js";import"../../typography/ButtonText/index.js";import"../Button/styles.js";import"../../icons/components/CloseIcon.js";import"../Chip/styles.js";import"../FieldLabel.js";import"../../hooks/useNameAndId.js";import"../../shared/helpers.js";const Y=i.div`
2
2
  display: flex;
3
3
  border-bottom: 1px solid ${v.colors.grayscaleToned.light5};
4
4
  `,Z=i.form`
@@ -1,4 +1,4 @@
1
- import{jsxs as b,jsx as c}from"react/jsx-runtime";import i,{css as s}from"styled-components";import{generateNameHash as g}from"../../shared/helpers.js";import e from"../../theme.js";import{BodyText as $}from"../../typography/BodyText/index.js";import{BackgroundStyles as x}from"../IconButton.js";import"../../shared/media-queries.js";import"../../utils/utils.js";const f=s`
1
+ import{jsxs as m,jsx as c}from"react/jsx-runtime";import i,{css as a}from"styled-components";import e from"../../theme.js";import{BodyText as x}from"../../typography/BodyText/index.js";import{BackgroundStyles as f}from"../IconButton.js";import{useNameAndId as k}from"../../hooks/useNameAndId.js";import"../../shared/media-queries.js";import"../../utils/utils.js";import"react";import"../../shared/helpers.js";const y=a`
2
2
  .circle {
3
3
  &--outer {
4
4
  height: 24px;
@@ -11,7 +11,7 @@ import{jsxs as b,jsx as c}from"react/jsx-runtime";import i,{css as s}from"styled
11
11
  transform: scale(0.6);
12
12
  }
13
13
  }
14
- `,k=s`
14
+ `,D=a`
15
15
  .circle {
16
16
  &--outer {
17
17
  height: 32px;
@@ -24,7 +24,7 @@ import{jsxs as b,jsx as c}from"react/jsx-runtime";import i,{css as s}from"styled
24
24
  transform: scale(0.6);
25
25
  }
26
26
  }
27
- `,p={regular:f,large:k},y=s`
27
+ `,u={regular:y,large:D},z=a`
28
28
  cursor: default;
29
29
 
30
30
  .circle {
@@ -36,14 +36,14 @@ import{jsxs as b,jsx as c}from"react/jsx-runtime";import i,{css as s}from"styled
36
36
  border: 2px solid ${e.colors.grayscaleToned.light2};
37
37
  }
38
38
  }
39
- `,D=s`
39
+ `,v=a`
40
40
  .circle {
41
41
  &--inner {
42
42
  opacity: 1;
43
43
  background-color: ${e.colors.grayscaleToned.light2};
44
44
  }
45
45
  }
46
- `,z=(r,o,a)=>s`
46
+ `,S=(r,o,s)=>a`
47
47
  .circle {
48
48
  &--inner {
49
49
  opacity: 1;
@@ -52,48 +52,48 @@ import{jsxs as b,jsx as c}from"react/jsx-runtime";import i,{css as s}from"styled
52
52
 
53
53
  &--outer {
54
54
  border: 2px solid
55
- ${a?e.colors.error.dark:e.colors[r][o]};
55
+ ${s?e.colors.error.dark:e.colors[r][o]};
56
56
  }
57
57
  }
58
- `,v=i.div`
58
+ `,E=i.div`
59
59
  display: flex;
60
60
  align-items: flex-start;
61
61
  box-sizing: border-box;
62
- `,S=i.span`
62
+ `,N=i.span`
63
63
  cursor: pointer;
64
64
  display: flex;
65
65
  position: relative;
66
66
  align-items: center;
67
67
  justify-content: center;
68
68
 
69
- ${r=>p[r.size]};
69
+ ${r=>u[r.size]};
70
70
 
71
- ${r=>!r.isDisabled&&r.isChecked&&z(r.$color,r.$colorShade,r.$hasError)};
72
- ${r=>r.isDisabled&&y};
71
+ ${r=>!r.isDisabled&&r.isChecked&&S(r.$color,r.$colorShade,r.$hasError)};
72
+ ${r=>r.isDisabled&&z};
73
73
 
74
- ${r=>r.isChecked&&r.isDisabled&&D};
74
+ ${r=>r.isChecked&&r.isDisabled&&v};
75
75
 
76
76
  &:hover,
77
77
  &:focus {
78
78
  border-radius: 50%;
79
79
  transition: background-color 400ms;
80
- ${x}
80
+ ${f}
81
81
  }
82
- `,E=i.input`
82
+ `,T=i.input`
83
83
  position: absolute;
84
84
  opacity: 0;
85
85
  margin: 0;
86
86
  ${r=>!r.isDisabled&&"cursor: pointer;"}
87
87
  z-index: 1;
88
- ${r=>p[r.$size]};
89
- `,N=i.span`
88
+ ${r=>u[r.$size]};
89
+ `,w=i.span`
90
90
  display: flex;
91
91
  box-sizing: border-box;
92
92
  border-radius: 50%;
93
93
 
94
94
  border: 2px solid
95
95
  ${r=>r.$hasError?e.colors.error.dark:e.colors.grayscaleToned.dark5};
96
- `,T=i.span`
96
+ `,B=i.span`
97
97
  box-sizing: border-box;
98
98
  opacity: 0;
99
99
  margin: auto;
@@ -102,9 +102,9 @@ import{jsxs as b,jsx as c}from"react/jsx-runtime";import i,{css as s}from"styled
102
102
  position: absolute;
103
103
  top: 0;
104
104
  left: 0;
105
- `,w=i($)`
105
+ `,C=i(x)`
106
106
  cursor: ${({isDisabled:r})=>r?"default":"pointer"};
107
107
  user-select: none;
108
108
  color: ${({theme:r,isDisabled:o})=>o?r.colors.text.disabled:r.colors.text.dark};
109
109
  margin-left: 0.5rem;
110
- `,m=({name:r=g("radio-button"),size:o="regular",checked:a=!1,isDisabled:l=!1,color:n="secondary",colorShade:h="mainAlt",label:d,hasError:t,...u})=>b(v,{children:[b(S,{size:o,$color:n,$colorShade:h,isChecked:a,isDisabled:l,$hasError:t,children:[c(E,{"data-validate":"checked",checked:a,type:"radio",name:r,id:r,disabled:l,"aria-label":d?void 0:r,"aria-checked":a,"aria-invalid":t||void 0,className:"circle circle--outer",$size:o,isDisabled:l,$color:n,$colorShade:h,...u}),c(N,{className:"circle circle--outer",$hasError:t,children:c(T,{className:"circle circle--inner"})})]}),d&&c(w,{as:"label",htmlFor:r,isDisabled:l,children:d})]});export{m as RadioButton,m as default};
110
+ `,g=({name:r,size:o="regular",checked:s=!1,isDisabled:l=!1,color:n="secondary",colorShade:h="mainAlt",label:t,hasError:d,...$})=>{const{name:b,id:p}=k("radio-button",r);return m(E,{children:[m(N,{size:o,$color:n,$colorShade:h,isChecked:s,isDisabled:l,$hasError:d,children:[c(T,{"data-validate":"checked",checked:s,type:"radio",name:b,id:p,disabled:l,"aria-label":t?void 0:b,"aria-checked":s,"aria-invalid":d||void 0,className:"circle circle--outer",$size:o,isDisabled:l,$color:n,$colorShade:h,...$}),c(w,{className:"circle circle--outer",$hasError:d,children:c(B,{className:"circle circle--inner"})})]}),t&&c(C,{as:"label",htmlFor:p,isDisabled:l,children:t})]})};export{g as RadioButton,g as default};
@@ -1,9 +1,9 @@
1
- import{jsx as a,jsxs as f}from"react/jsx-runtime";import{useRef as x}from"react";import t from"styled-components";import{TinyTitleRegular as H}from"../../typography/Heading/index.js";import b from"../../icons/components/CheckmarkIcon.js";import{generateNameHash as S}from"../../shared/helpers.js";import"../../shared/media-queries.js";const v=t.div`
1
+ import{jsx as a,jsxs as x}from"react/jsx-runtime";import t from"styled-components";import{TinyTitleRegular as f}from"../../typography/Heading/index.js";import H from"../../icons/components/CheckmarkIcon.js";import{useNameAndId as b}from"../../hooks/useNameAndId.js";import"../../shared/media-queries.js";import"react";import"../../shared/helpers.js";const S=t.div`
2
2
  display: flex;
3
3
  flex-direction: ${({isHorizontal:e})=>e?"row":"column"};
4
4
  min-height: 4rem;
5
5
  margin: 0 auto;
6
- `,w=t.div`
6
+ `,v=t.div`
7
7
  display: flex;
8
8
  flex-direction: ${({isHorizontal:e})=>e?"column":"row"};
9
9
  column-gap: 0.75rem;
@@ -42,7 +42,7 @@ import{jsx as a,jsxs as f}from"react/jsx-runtime";import{useRef as x}from"react"
42
42
  height: ${({isHorizontal:e,$size:i})=>e?"2px":`calc(50% - ${i/2}rem)`};
43
43
  background: ${({theme:e,$color:i,$colorShade:o})=>e.colors[i][o]};
44
44
  }
45
- `,y=t.div``,k=t.div`
45
+ `,w=t.div``,y=t.div`
46
46
  display: flex;
47
47
  align-items: center;
48
48
  justify-content: center;
@@ -55,9 +55,9 @@ import{jsx as a,jsxs as f}from"react/jsx-runtime";import{useRef as x}from"react"
55
55
  ${({theme:e,isFilled:i,$color:o,$colorShade:c})=>i&&`
56
56
  background-color: ${e.colors[o][c]};
57
57
  `}
58
- `,j=t(H)`
58
+ `,k=t(f)`
59
59
  font-size: ${({size:e})=>`${e/2}rem`};
60
60
  line-height: 1;
61
- `,C=t(b)`
61
+ `,j=t(H)`
62
62
  font-size: ${({size:e})=>`calc(${e/2}rem + 6px)`};
63
- `,F=({children:e,orientation:i="vertical",variant:o="solid",color:c="primary",colorShade:p="mainAlt",size:n=2,activeStep:l,ariaLabels:s={},...m})=>{const h=e.length,d=i==="horizontal",z=x(S("stepper"));return a(v,{isHorizontal:d,...m,role:"list","aria-Label":s?.list??"Step progress",children:e.map((g,r)=>{const $=l&&r<l,u=$||o==="solid";return f(w,{$color:c,$colorShade:p,$size:n,stepsNumber:h,isHorizontal:d,role:"listitem","aria-disabled":$?"true":void 0,"aria-current":l===r?"step":void 0,"aria-Label":(l===void 0?`${s?.step??"Step %s"}`:(l===r&&`${s?.stepCurrent??"Current step, step %s"}`,$&&`${s?.stepDone??"Completed step, step %s"}`,`${s?.stepUpcoming??"Upcoming step, step %s"}`)).replaceAll("%s",String(r+1)),children:[a(y,{children:a(k,{$color:c,$colorShade:p,isFilled:u,size:n,role:"img",children:$?a(C,{size:n,"aria-hidden":"true"}):a(j,{as:"span",size:n,"aria-hidden":"true",children:r+1})})}),g]},`${z}-${r}`)})})};export{F as Stepper};
63
+ `,A=({children:e,orientation:i="vertical",variant:o="solid",color:c="primary",colorShade:p="mainAlt",size:n=2,activeStep:l,ariaLabels:s={},...m})=>{const h=e.length,d=i==="horizontal",{id:z}=b("stepper");return a(S,{isHorizontal:d,...m,role:"list","aria-Label":s?.list??"Step progress",children:e.map((u,r)=>{const $=l&&r<l,g=$||o==="solid";return x(v,{$color:c,$colorShade:p,$size:n,stepsNumber:h,isHorizontal:d,role:"listitem","aria-disabled":$?"true":void 0,"aria-current":l===r?"step":void 0,"aria-Label":(l===void 0?`${s?.step??"Step %s"}`:(l===r&&`${s?.stepCurrent??"Current step, step %s"}`,$&&`${s?.stepDone??"Completed step, step %s"}`,`${s?.stepUpcoming??"Upcoming step, step %s"}`)).replaceAll("%s",String(r+1)),children:[a(w,{children:a(y,{$color:c,$colorShade:p,isFilled:g,size:n,role:"img",children:$?a(j,{size:n,"aria-hidden":"true"}):a(k,{as:"span",size:n,"aria-hidden":"true",children:r+1})})}),u]},`${z}-${r}`)})})};export{A as Stepper};
@@ -1,18 +1,18 @@
1
- import{jsxs as u,jsx as t}from"react/jsx-runtime";import{useState as z,useRef as R,useCallback as B,useEffect as F}from"react";import a,{css as s}from"styled-components";import l from"../../theme.js";import{Title as I}from"../../typography/Heading/index.js";import{fadedColor as d,generateNameHash as K}from"../../shared/helpers.js";import{Collapse as O}from"react-collapse";import A from"../../icons/components/CheckmarkIcon.js";import H from"../../icons/components/ShowMoreIcon.js";import"../../shared/media-queries.js";const c="200ms",L=a.div`
1
+ import{jsxs as u,jsx as t}from"react/jsx-runtime";import{useState as z,useCallback as I,useEffect as K}from"react";import s,{css as n}from"styled-components";import l from"../../theme.js";import{Title as A}from"../../typography/Heading/index.js";import{fadedColor as d}from"../../shared/helpers.js";import{Collapse as B}from"react-collapse";import F from"../../icons/components/CheckmarkIcon.js";import O from"../../icons/components/ShowMoreIcon.js";import{useNameAndId as T}from"../../hooks/useNameAndId.js";import"../../shared/media-queries.js";const c="200ms",L=s.div`
2
2
  .ReactCollapse--collapse {
3
3
  transition: height ${c} ease-in-out;
4
4
  }
5
- `,N=s`
5
+ `,N=n`
6
6
  transform: rotate(-180deg);
7
- `,T=a.div`
7
+ `,R=s.div`
8
8
  display: flex;
9
9
  align-items: center;
10
10
  height: 4rem;
11
11
 
12
12
  color: ${e=>e.$isDisabled?l.colors.text.disabled:l.colors.text.dark};
13
- `,U=a(I)`
13
+ `,_=s(A)`
14
14
  margin: 0;
15
- `,_=a(H)`
15
+ `,q=s(O)`
16
16
  font-size: 2rem;
17
17
  margin-left: auto;
18
18
 
@@ -20,18 +20,18 @@ import{jsxs as u,jsx as t}from"react/jsx-runtime";import{useState as z,useRef as
20
20
  transform: rotate(0deg);
21
21
  transform-origin: center;
22
22
  ${e=>e.isExpanded&&N};
23
- `,q=(e,o)=>s`
23
+ `,G=(e,r)=>n`
24
24
  color: white;
25
- background-color: ${l.colors[e][o]};
26
- `,G=(e,o,r)=>s`
25
+ background-color: ${l.colors[e][r]};
26
+ `,H=(e,r,o)=>n`
27
27
  fill: white;
28
- border: 2px solid ${d(l.colors[o][r],.2)};
28
+ border: 2px solid ${d(l.colors[r][o],.2)};
29
29
 
30
30
  ${e&&`
31
- border: 2px solid ${d(l.colors[o][r],0)};
32
- background-color: ${d(l.colors[o][r],.5)};
31
+ border: 2px solid ${d(l.colors[r][o],0)};
32
+ background-color: ${d(l.colors[r][o],.5)};
33
33
  `}
34
- `,J=a.div`
34
+ `,J=s.div`
35
35
  font-family: ${({theme:e})=>e.typography.fontBaseFamily};
36
36
  display: flex;
37
37
  align-items: center;
@@ -61,6 +61,6 @@ import{jsxs as u,jsx as t}from"react/jsx-runtime";import{useState as z,useRef as
61
61
  }
62
62
 
63
63
  transition: background-color ${c};
64
- ${e=>e.isComplete&&q(e.$color,e.$colorShade)};
65
- ${e=>e.isDisabled&&G(e.isComplete,e.$color,e.$colorShade)};
66
- `,x=({step:e,isExpanded:o,isDisabled:r,isComplete:m,onClick:y,color:C,colorShade:k,title:v,children:D,closedChildren:p,...S})=>{const[n,f]=z(o||!1),h=R(K("stepper")),$=B(()=>{r||f(i=>!i)},[r]);F(()=>{f(o||!1)},[r,o]);const w=e||e===0,E=i=>{r||(y||$)(i)},j=i=>{(i.key==="Enter"||i.key===" ")&&!r&&(i.preventDefault(),$())},g=`${h.current}-header`,b=`${h.current}-content`;return u(L,{children:[u(T,{...S,id:g,onClick:E,onKeyDown:j,$isDisabled:r||!1,role:"button",tabIndex:0,"aria-expanded":n,"aria-controls":b,children:[w&&t(J,{isComplete:m||!1,isDisabled:r||!1,$color:C||"primary",$colorShade:k||"main",children:m?t(A,{}):t("span",{children:e})}),t(U,{children:v}),t(_,{isExpanded:n})]}),t(O,{isOpened:n,children:t("div",{id:b,role:"region","aria-labelledby":g,children:D})}),p&&p]})};export{x as StepperAccordion,x as default};
64
+ ${e=>e.isComplete&&G(e.$color,e.$colorShade)};
65
+ ${e=>e.isDisabled&&H(e.isComplete,e.$color,e.$colorShade)};
66
+ `,x=({step:e,isExpanded:r,isDisabled:o,isComplete:m,onClick:y,color:C,colorShade:k,title:v,children:D,closedChildren:p,...S})=>{const[a,f]=z(r||!1),{id:h}=T("stepper"),$=I(()=>{o||f(i=>!i)},[o]);K(()=>{f(r||!1)},[o,r]);const w=e||e===0,E=i=>{o||(y||$)(i)},j=i=>{(i.key==="Enter"||i.key===" ")&&!o&&(i.preventDefault(),$())},g=`${h}-header`,b=`${h}-content`;return u(L,{children:[u(R,{...S,id:g,onClick:E,onKeyDown:j,$isDisabled:o||!1,role:"button",tabIndex:0,"aria-expanded":a,"aria-controls":b,children:[w&&t(J,{isComplete:m||!1,isDisabled:o||!1,$color:C||"primary",$colorShade:k||"main",children:m?t(F,{}):t("span",{children:e})}),t(_,{children:v}),t(q,{isExpanded:a})]}),t(B,{isOpened:a,children:t("div",{id:b,role:"region","aria-labelledby":g,children:D})}),p&&p]})};export{x as StepperAccordion,x as default};
@@ -1,18 +1,18 @@
1
- import{jsxs as h,jsx as i,Fragment as z}from"react/jsx-runtime";import{useState as B,useRef as E}from"react";import l,{css as b}from"styled-components";import r from"../../theme.js";import{Label as j}from"../FieldLabel.js";import{BodyTextStyle as N,CaptionStyle as S}from"../../typography/BodyText/index.js";import{generateNameHash as w}from"../../shared/helpers.js";import"../../shared/media-queries.js";const C=b`
1
+ import{jsxs as h,jsx as i,Fragment as B}from"react/jsx-runtime";import{useState as E}from"react";import l,{css as $}from"styled-components";import r from"../../theme.js";import{Label as j}from"../FieldLabel.js";import{BodyTextStyle as N,CaptionStyle as S}from"../../typography/BodyText/index.js";import{useNameAndId as w}from"../../hooks/useNameAndId.js";import"../../shared/media-queries.js";import"../../shared/helpers.js";const A=$`
2
2
  border: 1px solid ${r.colors.grayscaleToned.light1};
3
3
  color: ${r.colors.grayscaleToned.dark1};
4
4
  fill: ${r.colors.grayscaleToned.light1};
5
- `,H=b`
5
+ `,I=$`
6
6
  border: 1px solid ${r.colors.error.dark};
7
- `,L=b`
7
+ `,C=$`
8
8
  color: ${r.colors.text.dark};
9
9
  border: 1px solid ${r.colors.text.dark};
10
10
  fill: ${r.colors.text.dark};
11
- `,R=l.div`
11
+ `,L=l.div`
12
12
  position: relative;
13
13
  padding: 0;
14
14
  display: inline-block;
15
- `,A=l.div`
15
+ `,D=l.div`
16
16
  display: inline-black;
17
17
 
18
18
  color: ${r.colors.grayscaleToned.light1};
@@ -24,11 +24,11 @@ import{jsxs as h,jsx as i,Fragment as z}from"react/jsx-runtime";import{useState
24
24
 
25
25
  padding: 0.7rem 0.75rem;
26
26
 
27
- ${({hasError:e,isFocused:a})=>!e&&a&&L}
28
- ${({disabled:e})=>e&&C}
29
- ${({hasError:e})=>e&&H}
27
+ ${({hasError:e,isFocused:a})=>!e&&a&&C}
28
+ ${({disabled:e})=>e&&A}
29
+ ${({hasError:e})=>e&&I}
30
30
  ${({centered:e})=>e&&"text-align: center;"}
31
- `,D=l.textarea`
31
+ `,H=l.textarea`
32
32
  ${N}
33
33
 
34
34
  width: 100%;
@@ -38,17 +38,17 @@ import{jsxs as h,jsx as i,Fragment as z}from"react/jsx-runtime";import{useState
38
38
  background-color: transparent;
39
39
 
40
40
  ${({resize:e})=>!e&&"resize: none;"}
41
- `,I=l.div`
42
- font-family: ${({theme:e})=>e.typography.fontBaseFamily};
43
41
  `,P=l.div`
42
+ font-family: ${({theme:e})=>e.typography.fontBaseFamily};
43
+ `,V=l.div`
44
44
  ${S}
45
45
  margin-top: 0.25rem;
46
46
 
47
47
  ${({centered:e})=>e&&"width: 100%; text-align: center;"}
48
- `,V=l.span`
48
+ `,W=l.span`
49
49
  display: block;
50
50
  color: ${({theme:e})=>e.colors.text.disabled};
51
- `,W=l.span`
51
+ `,q=l.span`
52
52
  display: block;
53
53
  color: ${({theme:e})=>e.colors.error.dark};
54
- `,u=({placeholder:e="",isDisabled:a=!1,centered:m=!1,hasError:g=!1,className:y,helperText:t,label:d="",resize:k=!0,name:p,errors:s,...n})=>{const[$,f]=B(!1),v=!!n.value,o=`${E(w("textarea")).current}-${p}`,T=s?.map((x,c)=>`${o}-error-${c}`)??[],F=[t?`${o}-helper`:null,...T].filter(Boolean).join(" ");return h(R,{className:y,children:[h(A,{isFocused:$,disabled:a,centered:m,hasError:g,hasPlaceholder:!!e,children:[i(D,{...n,id:o,name:p,"aria-label":d?void 0:p,"aria-describedby":F||void 0,"aria-invalid":!!s?.length,resize:k,onFocus:()=>f(!0),onBlur:()=>f(!1),disabled:a,tabIndex:a?-1:0,theme:r,placeholder:d&&!$?"":e}),n.suffix&&i(I,{children:n.suffix})]}),d&&i(j,{htmlFor:o,isFocused:$,centered:m,hasError:g,hasValue:v,disabled:a,theme:r,children:h(z,{children:[d,i("span",{})]})}),(t||s)&&h(P,{centered:m,children:[t&&i(V,{id:`${o}-helper`,children:t}),s&&s.map((x,c)=>i(W,{id:`${o}-error-${c}`,role:"alert","aria-live":"assertive",children:x},`${o}-error-${c}`))]})]})};export{u as TextArea,u as default};
54
+ `,u=({placeholder:e="",isDisabled:a=!1,centered:m=!1,hasError:b=!1,className:y,helperText:t,label:d="",resize:k=!0,name:v,errors:s,...n})=>{const[p,g]=E(!1),T=!!n.value,{name:x,id:o}=w("textarea",v),F=s?.map((f,c)=>`${o}-error-${c}`)??[],z=[t?`${o}-helper`:null,...F].filter(Boolean).join(" ");return h(L,{className:y,children:[h(D,{isFocused:p,disabled:a,centered:m,hasError:b,hasPlaceholder:!!e,children:[i(H,{...n,id:o,name:x,"aria-label":d?void 0:x,"aria-describedby":z||void 0,"aria-invalid":!!s?.length,resize:k,onFocus:()=>g(!0),onBlur:()=>g(!1),disabled:a,tabIndex:a?-1:0,theme:r,placeholder:d&&!p?"":e}),n.suffix&&i(P,{children:n.suffix})]}),d&&i(j,{htmlFor:o,isFocused:p,centered:m,hasError:b,hasValue:T,disabled:a,theme:r,children:h(B,{children:[d,i("span",{})]})}),(t||s)&&h(V,{centered:m,children:[t&&i(W,{id:`${o}-helper`,children:t}),s&&s.map((f,c)=>i(q,{id:`${o}-error-${c}`,role:"alert","aria-live":"assertive",children:f},`${o}-error-${c}`))]})]})};export{u as TextArea,u as default};
@@ -1,18 +1,18 @@
1
- import{jsxs as c,jsx as t,Fragment as A}from"react/jsx-runtime";import{useState as R,useRef as H}from"react";import o,{css as $}from"styled-components";import{Label as P}from"../FieldLabel.js";import{BodyTextStyle as V,CaptionStyle as q}from"../../typography/BodyText/index.js";import{generateNameHash as y}from"../../shared/helpers.js";import"../../shared/media-queries.js";const C=$`
1
+ import{jsxs as c,jsx as t,Fragment as z}from"react/jsx-runtime";import{useState as I}from"react";import o,{css as $}from"styled-components";import{Label as R}from"../FieldLabel.js";import{BodyTextStyle as V,CaptionStyle as q}from"../../typography/BodyText/index.js";import{useNameAndId as C}from"../../hooks/useNameAndId.js";import"../../shared/media-queries.js";import"../../shared/helpers.js";const D=$`
2
2
  border: 1px solid ${({theme:e})=>e.colors.grayscaleToned.light2};
3
3
  color: ${({theme:e})=>e.colors.text.disabled};
4
4
  fill: ${({theme:e})=>e.colors.text.disabled};
5
- `,D=$`
6
- border: 2px solid ${({theme:e})=>e.colors.error.dark};
7
5
  `,G=$`
6
+ border: 2px solid ${({theme:e})=>e.colors.error.dark};
7
+ `,H=$`
8
8
  border: 2px solid ${({theme:e})=>e.colors.grayscaleToned.dark5};
9
9
  color: ${({theme:e})=>e.colors.text.dark};
10
10
  fill: ${({theme:e})=>e.colors.text.dark};
11
- `,I=o.div`
11
+ `,L=o.div`
12
12
  position: relative;
13
13
  padding: 0;
14
14
  display: block;
15
- `,L=o.div`
15
+ `,M=o.div`
16
16
  display: flex;
17
17
  text-align: center;
18
18
  align-items: center;
@@ -26,11 +26,11 @@ import{jsxs as c,jsx as t,Fragment as A}from"react/jsx-runtime";import{useState
26
26
 
27
27
  padding: 0.75rem 0.6rem;
28
28
 
29
- ${({hasError:e,isFocused:a})=>!e&&a&&G}
30
- ${({disabled:e})=>e&&C}
31
- ${({hasError:e})=>e&&D}
29
+ ${({hasError:e,isFocused:a})=>!e&&a&&H}
30
+ ${({disabled:e})=>e&&D}
31
+ ${({hasError:e})=>e&&G}
32
32
  ${({centered:e})=>e&&"text-align: center;"}
33
- `,M=o.input`
33
+ `,O=o.input`
34
34
  ${V}
35
35
  width: 100%;
36
36
  cursor: text;
@@ -42,7 +42,7 @@ import{jsxs as c,jsx as t,Fragment as A}from"react/jsx-runtime";import{useState
42
42
  color: ${({theme:e})=>e.colors.text.disabled};
43
43
  fill: ${({theme:e})=>e.colors.text.disabled};
44
44
  }
45
- `,O=o.span`
45
+ `,P=o.span`
46
46
  display: flex;
47
47
  font-family: ${({theme:e})=>e.typography.fontBaseFamily};
48
48
  font-size: 1.25rem;
@@ -63,4 +63,4 @@ import{jsxs as c,jsx as t,Fragment as A}from"react/jsx-runtime";import{useState
63
63
  `,K=o.span`
64
64
  display: block;
65
65
  color: ${({theme:e})=>e.colors.error.dark};
66
- `,k=({placeholder:e="",isDisabled:a=!1,centered:h=!1,hasError:m=!1,className:v,helperText:s,label:d="",onBlur:F=()=>null,onFocus:T=()=>null,forwardRef:w,suffix:f,name:u=y("text-input"),errors:i,isAutoFocused:B=!1,...x})=>{const[p,g]=R(!1),E=!!x.value,b=i&&Array.isArray(i)&&i?.length>0,r=`${H(y("text-input")).current}-${u}`,j=i?.map((l,n)=>`${r}-error-${n}`)??[],N=[s?`${r}-helper`:null,...j].filter(Boolean).join(" "),S=l=>{g(!0),T(l)},z=l=>{g(!1),F(l)};return c(I,{className:v,children:[c(L,{isFocused:p,disabled:a,centered:h,hasError:m,hasPlaceholder:!!e,children:[t(M,{...x,id:r,name:u,"aria-labelledby":d?`${r}-label`:void 0,"aria-describedby":N||void 0,"aria-invalid":b||m,ref:w,onFocus:S,onBlur:z,disabled:a,placeholder:d&&!p?"":e,autoFocus:B}),f&&t(O,{children:f})]}),d&&t(P,{id:`${r}-label`,htmlFor:r,isFocused:p,centered:h,hasError:m,hasValue:E,disabled:a,children:c(A,{children:[d,t("span",{})]})}),(s||b)&&c(_,{centered:h,children:[s&&t(J,{id:`${r}-helper`,children:s}),b&&i.map((l,n)=>t(K,{id:`${r}-error-${n}`,role:"alert","aria-live":"assertive",children:l},`${r}-error-${n}`))]})]})};export{k as TextField,k as default};
66
+ `,g=({placeholder:e="",isDisabled:a=!1,centered:m=!1,hasError:h=!1,className:y,helperText:s,label:d="",onBlur:k=()=>null,onFocus:v=()=>null,forwardRef:F,suffix:f,name:B,errors:i,isAutoFocused:T=!1,...u})=>{const[p,x]=I(!1),w=!!u.value,b=i&&Array.isArray(i)&&i?.length>0,{name:E,id:r}=C("text-input",B),j=i?.map((l,n)=>`${r}-error-${n}`)??[],A=[s?`${r}-helper`:null,...j].filter(Boolean).join(" "),N=l=>{x(!0),v(l)},S=l=>{x(!1),k(l)};return c(L,{className:y,children:[c(M,{isFocused:p,disabled:a,centered:m,hasError:h,hasPlaceholder:!!e,children:[t(O,{...u,id:r,name:E,"aria-labelledby":d?`${r}-label`:void 0,"aria-describedby":A||void 0,"aria-invalid":b||h,ref:F,onFocus:N,onBlur:S,disabled:a,placeholder:d&&!p?"":e,autoFocus:T}),f&&t(P,{children:f})]}),d&&t(R,{id:`${r}-label`,htmlFor:r,isFocused:p,centered:m,hasError:h,hasValue:w,disabled:a,children:c(z,{children:[d,t("span",{})]})}),(s||b)&&c(_,{centered:m,children:[s&&t(J,{id:`${r}-helper`,children:s}),b&&i.map((l,n)=>t(K,{id:`${r}-error-${n}`,role:"alert","aria-live":"assertive",children:l},`${r}-error-${n}`))]})]})};export{g as TextField,g as default};
@@ -0,0 +1 @@
1
+ import{useRef as r}from"react";import{generateNameHash as t}from"../shared/helpers.js";const u=(n,o)=>{const e=r(o??t(n)),m=r(`${e.current}-${t()}`);return{name:e.current,id:m.current}};export{u as useNameAndId};
package/esm/index.js CHANGED
@@ -1 +1 @@
1
- import{default as F}from"./theme.js";import{mediaQueries as L,mq as v,mqNumberSizes as b,mqSizes as D}from"./shared/media-queries.js";import{Accordion as R}from"./components/Accordion/index.js";import{Button as M}from"./components/Button/index.js";import{default as E}from"./components/IconButton.js";import{TextField as V}from"./components/Textfield/index.js";import{TextArea as G}from"./components/TextArea/index.js";import{Tabs as O}from"./components/Tabs/Tabs.js";import{default as W}from"./components/Tabs/Tab.js";import{ErrorMessage as z}from"./components/ErrorMessage/index.js";import{default as j}from"./components/Spinner/index.js";import{Modal as X}from"./components/Modal/index.js";import{Dialog as _}from"./components/Dialog/index.js";import{OffCanvas as oo}from"./components/OffCanvas/index.js";import{CheckBox as to}from"./components/CheckBox/index.js";import{Snackbar as ao}from"./components/Snackbar/index.js";import{default as lo}from"./components/Spacer/index.js";import{default as no}from"./components/Stack/index.js";import{default as uo}from"./components/Flex/index.js";import{Select as so}from"./components/Select/index.js";import{default as Io}from"./components/ToggleArrow/index.js";import{default as So}from"./components/ListItem/index.js";import{default as go}from"./components/Table/index.js";import{Link as To}from"./components/Link/index.js";import{default as ko}from"./components/EditRow/index.js";import{RadioButton as Fo}from"./components/RadioButton/index.js";import{SpinnerThin as Lo}from"./components/SpinnerThin/index.js";import{default as bo}from"./components/Stamp/index.js";import{TimePicker as Po}from"./components/TimePicker/index.js";import{default as Ao}from"./components/Hero/index.js";import{DayPicker as No}from"./components/DayPicker/index.js";import{Logo as Ho}from"./components/Logo/index.js";import{Badge as Uo}from"./components/Badge/index.js";import{Toggle as Ko}from"./components/Toggle/index.js";import{Stepper as Qo}from"./components/Stepper/index.js";import{StepperAccordion as qo}from"./components/StepperAccordion/index.js";import{Card as Yo}from"./components/Card/index.js";import{Switcher as Jo}from"./components/Switcher/index.js";import{NotificationButton as Zo}from"./components/NotificationButton/index.js";import{default as $o}from"./components/ValuationRange/index.js";import{Chip as ee}from"./components/Chip/index.js";import{default as re}from"./components/Breadcrumbs/index.js";import{default as fe}from"./components/Message/index.js";import{default as pe}from"./components/RegistrationPlate/index.js";import{MenuItem as me}from"./components/MenuItem/index.js";import{FocusTrap as ue}from"./components/FocusTrap.js";import{default as se}from"./icons/components/AddIcon.js";import{default as Ie}from"./icons/components/AlertIcon.js";import{default as Se}from"./icons/components/ArrowDownIcon.js";import{default as ge}from"./icons/components/ArrowLeftIcon.js";import{default as Te}from"./icons/components/ArrowRightIcon.js";import{default as ke}from"./icons/components/ArrowUpIcon.js";import{default as Fe}from"./icons/components/AtvIcon.js";import{default as Le}from"./icons/components/AuctionIcon.js";import{default as be}from"./icons/components/BackIcon.js";import{default as Pe}from"./icons/components/BackToTopIcon.js";import{default as Ae}from"./icons/components/BankidIcon.js";import{default as Ne}from"./icons/components/BidIcon.js";import{default as He}from"./icons/components/BodyIcon.js";import{default as Ue}from"./icons/components/BreaksIcon.js";import{default as Ke}from"./icons/components/CabIcon.js";import{default as Qe}from"./icons/components/CalendarIcon.js";import{default as qe}from"./icons/components/CameraIcon.js";import{default as Ye}from"./icons/components/CamperIcon.js";import{default as Je}from"./icons/components/CancelCircleIcon.js";import{default as Ze}from"./icons/components/CancelIcon.js";import{default as $e}from"./icons/components/CarIcon.js";import{default as et}from"./icons/components/CarServiceIcon.js";import{default as rt}from"./icons/components/CaravanIcon.js";import{default as ft}from"./icons/components/CertifiedIcon.js";import{default as pt}from"./icons/components/ChatIcon.js";import{default as mt}from"./icons/components/CheckCircleIcon.js";import{default as ut}from"./icons/components/CheckFilledIcon.js";import{default as st}from"./icons/components/CheckIcon.js";import{default as It}from"./icons/components/CheckmarkIcon.js";import{default as St}from"./icons/components/ClockIcon.js";import{default as gt}from"./icons/components/CloseIcon.js";import{default as Tt}from"./icons/components/CommentFilledIcon.js";import{default as kt}from"./icons/components/CommentIcon.js";import{default as Ft}from"./icons/components/ConditioningIcon.js";import{default as Lt}from"./icons/components/ContactIcon.js";import{default as bt}from"./icons/components/ControlNumberIcon.js";import{default as Pt}from"./icons/components/CopyIcon.js";import{default as At}from"./icons/components/CountdownIcon.js";import{default as Nt}from"./icons/components/CoupeIcon.js";import{default as Ht}from"./icons/components/CraneIcon.js";import{default as Ut}from"./icons/components/CupIcon.js";import{default as Kt}from"./icons/components/DeleteIcon.js";import{default as Qt}from"./icons/components/DisplayIcon.js";import{default as qt}from"./icons/components/DocumentIcon.js";import{default as Yt}from"./icons/components/DownloadIcon.js";import{default as Jt}from"./icons/components/EcoIcon.js";import{default as Zt}from"./icons/components/EditIcon.js";import{default as $t}from"./icons/components/EngineIcon.js";import{default as er}from"./icons/components/ErrorFilledIcon.js";import{default as rr}from"./icons/components/ErrorIcon.js";import{default as fr}from"./icons/components/EstoniaFlagIcon.js";import{default as pr}from"./icons/components/ExportIcon.js";import{default as mr}from"./icons/components/FacebookIcon.js";import{default as ur}from"./icons/components/FacilityIcon.js";import{default as sr}from"./icons/components/FavouriteFilledIcon.js";import{default as Ir}from"./icons/components/FavouriteIcon.js";import{default as Sr}from"./icons/components/FigmaIcon.js";import{default as gr}from"./icons/components/FilterIcon.js";import{default as Tr}from"./icons/components/FinanceIcon.js";import{default as kr}from"./icons/components/FinlandFlagIcon.js";import{default as Fr}from"./icons/components/FirstIcon.js";import{default as Lr}from"./icons/components/FixedPriceIcon.js";import{default as br}from"./icons/components/FuelIcon.js";import{default as Pr}from"./icons/components/GearboxIcon.js";import{default as Ar}from"./icons/components/GetPaidIcon.js";import{default as Nr}from"./icons/components/GridViewIcon.js";import{default as Hr}from"./icons/components/HatchbackIcon.js";import{default as Ur}from"./icons/components/HelpIcon.js";import{default as Kr}from"./icons/components/HistoryIcon.js";import{default as Qr}from"./icons/components/HomeDeliveryIcon.js";import{default as qr}from"./icons/components/IdIcon.js";import{default as Yr}from"./icons/components/ImageIcon.js";import{default as Jr}from"./icons/components/InfoIcon.js";import{default as Zr}from"./icons/components/InstagramIcon.js";import{default as $r}from"./icons/components/InsuranceIcon.js";import{default as ea}from"./icons/components/InteriorIcon.js";import{default as ra}from"./icons/components/KvdIcon.js";import{default as fa}from"./icons/components/KvdTestIcon.js";import{default as pa}from"./icons/components/KvdproIcon.js";import{default as ma}from"./icons/components/LastIcon.js";import{default as ua}from"./icons/components/LeaderIcon.js";import{default as sa}from"./icons/components/LinkedinIcon.js";import{default as Ia}from"./icons/components/ListViewIcon.js";import{default as Sa}from"./icons/components/LocationIcon.js";import{default as ga}from"./icons/components/MailIcon.js";import{default as Ta}from"./icons/components/MenuIcon.js";import{default as ka}from"./icons/components/MileageIcon.js";import{default as Fa}from"./icons/components/MinivanIcon.js";import{default as La}from"./icons/components/ModelYearIcon.js";import{default as ba}from"./icons/components/MoreIcon.js";import{default as Pa}from"./icons/components/MotorbikeIcon.js";import{default as Aa}from"./icons/components/NavigationIcon.js";import{default as Na}from"./icons/components/NewIcon.js";import{default as Ha}from"./icons/components/NextFilledIcon.js";import{default as Ua}from"./icons/components/NextIcon.js";import{default as Ka}from"./icons/components/NotificationIcon.js";import{default as Qa}from"./icons/components/OpenInNewIcon.js";import{default as qa}from"./icons/components/PayementIcon.js";import{default as Ya}from"./icons/components/PercentIcon.js";import{default as Ja}from"./icons/components/PhoneIcon.js";import{default as Za}from"./icons/components/PickUpIcon.js";import{default as $a}from"./icons/components/Pickup.js";import{default as ef}from"./icons/components/PlayIcon.js";import{default as rf}from"./icons/components/PlugIcon.js";import{default as ff}from"./icons/components/PolandFlagIcon.js";import{default as pf}from"./icons/components/PreviousFilledIcon.js";import{default as mf}from"./icons/components/PreviousIcon.js";import{default as uf}from"./icons/components/PrintIcon.js";import{default as sf}from"./icons/components/QuoteIcon.js";import{default as If}from"./icons/components/RatingIcon.js";import{default as yf}from"./icons/components/ReleasingIcon.js";import{default as Cf}from"./icons/components/ReorderIcon.js";import{default as Bf}from"./icons/components/RestartIcon.js";import{default as hf}from"./icons/components/SalesOfferIcon.js";import{default as wf}from"./icons/components/SavedSearchIcon.js";import{default as vf}from"./icons/components/ScheduleIcon.js";import{default as Df}from"./icons/components/SearchIcon.js";import{default as Rf}from"./icons/components/SedanIcon.js";import{default as Mf}from"./icons/components/SellFilledIcon.js";import{default as Ef}from"./icons/components/SellIcon.js";import{default as Vf}from"./icons/components/SettingsIcon.js";import{default as Gf}from"./icons/components/ShareIcon.js";import{default as Of}from"./icons/components/ShowLessIcon.js";import{default as Wf}from"./icons/components/ShowMoreIcon.js";import{default as zf}from"./icons/components/SignInIcon.js";import{default as jf}from"./icons/components/SignOutIcon.js";import{default as Xf}from"./icons/components/SlackIcon.js";import{default as _f}from"./icons/components/SmartphoneIcon.js";import{default as ol}from"./icons/components/SmileIcon.js";import{default as tl}from"./icons/components/SnowmobileIcon.js";import{default as al}from"./icons/components/SortColumnIcon.js";import{default as ll}from"./icons/components/SortIcon.js";import{default as nl}from"./icons/components/StorageIcon.js";import{default as dl}from"./icons/components/StoreIcon.js";import{default as xl}from"./icons/components/SuvIcon.js";import{default as cl}from"./icons/components/SwedishFlagIcon.js";import{default as il}from"./icons/components/ThreeSixtyIcon.js";import{default as yl}from"./icons/components/TractorIcon.js";import{default as Cl}from"./icons/components/TrailerIcon.js";import{default as Bl}from"./icons/components/TransportIcon.js";import{default as hl}from"./icons/components/TruckIcon.js";import{default as wl}from"./icons/components/TwitterIcon.js";import{default as vl}from"./icons/components/TyresIcon.js";import{default as Dl}from"./icons/components/UnitedKingdomFlagIcon.js";import{default as Rl}from"./icons/components/UploadIcon.js";import{default as Ml}from"./icons/components/UserIcon.js";import{default as El}from"./icons/components/ValuationIcon.js";import{default as Vl}from"./icons/components/VanIcon.js";import{default as Gl}from"./icons/components/VersionIcon.js";import{default as Ol}from"./icons/components/ViewsIcon.js";import{default as Wl}from"./icons/components/WagonIcon.js";import{default as zl}from"./icons/components/WarningIcon.js";import{default as jl}from"./icons/components/WarrantyIcon.js";import{default as Xl}from"./icons/components/YoutubeIcon.js";import{useDynamicScript as _l}from"./hooks/useDynamicScript.js";import{Display1 as op,Display1Style as ep,Display2 as tp,Display2Style as rp,Display3 as ap,Display3Style as fp,Headline as lp,HeadlineStyle as pp,Subtitle as np,SubtitleStyle as mp,TinyTitleBold as dp,TinyTitleBoldStyle as up,TinyTitleRegular as xp,TinyTitleRegularStyle as sp,Title as cp,TitleStyle as Ip}from"./typography/Heading/index.js";import{BodyLink as Sp,BodyLinkStyle as yp,BodyText as gp,BodyTextStyle as Cp,Caption as Tp,CaptionLink as Bp,CaptionLinkStyle as kp,CaptionStyle as hp,Quote as Fp,QuoteStyle as wp,Status as Lp,StatusStyle as vp}from"./typography/BodyText/index.js";import{ButtonLarge as Dp,ButtonLargeTextStyle as Pp,Button as Rp,ButtonRegularTextStyle as Ap,ButtonSmall as Mp,ButtonSmallTextStyle as Np}from"./typography/ButtonText/index.js";import{getDarkerShade as Hp,getLighterShade as Vp,hexToRGB as Up,resetButtonStyle as Gp,resolveColorWithNeutral as Kp}from"./utils/utils.js";import"react/jsx-runtime";import"react";import"styled-components";import"react-collapse";import"./shared/helpers.js";import"./components/Button/styles.js";import"./components/FieldLabel.js";import"react-dom";import"react-transition-group";import"./components/OffCanvas/Overlay.js";import"./components/OffCanvas/useClickOutside.js";import"react-select";import"./shared/constants.js";import"react-router-dom";import"react-day-picker";import"date-fns/locale";import"date-fns";import"./components/DayPicker/style.js";import"./components/Logo/LogoSv.js";import"./components/Logo/LogoEn.js";import"./components/Chip/styles.js";import"./components/Breadcrumbs/BreadcrumbsItem.js";import"./components/RegistrationPlate/EuFlagIcon.js";export{R as Accordion,se as AddIcon,Ie as AlertIcon,Se as ArrowDownIcon,ge as ArrowLeftIcon,Te as ArrowRightIcon,ke as ArrowUpIcon,Fe as AtvIcon,Le as AuctionIcon,be as BackIcon,Pe as BackToTopIcon,Uo as Badge,Ae as BankidIcon,Ne as BidIcon,He as BodyIcon,Sp as BodyLink,yp as BodyLinkStyle,gp as BodyText,Cp as BodyTextStyle,re as Breadcrumbs,Ue as BreaksIcon,M as Button,Dp as ButtonLargeText,Pp as ButtonLargeTextStyle,Rp as ButtonRegularText,Ap as ButtonRegularTextStyle,Mp as ButtonSmallText,Np as ButtonSmallTextStyle,Ke as CabIcon,Qe as CalendarIcon,qe as CameraIcon,Ye as CamperIcon,Je as CancelCircleIcon,Ze as CancelIcon,Tp as Caption,Bp as CaptionLink,kp as CaptionLinkStyle,hp as CaptionStyle,$e as CarIcon,et as CarServiceIcon,rt as CaravanIcon,Yo as Card,ft as CertifiedIcon,pt as ChatIcon,to as CheckBox,mt as CheckCircleIcon,ut as CheckFilledIcon,st as CheckIcon,It as CheckmarkIcon,ee as Chip,St as ClockIcon,gt as CloseIcon,Tt as CommentFilledIcon,kt as CommentIcon,Ft as ConditioningIcon,Lt as ContactIcon,bt as ControlNumberIcon,Pt as CopyIcon,At as CountdownIcon,Nt as CoupeIcon,Ht as CraneIcon,Ut as CupIcon,No as DayPicker,Kt as DeleteIcon,_ as Dialog,op as Display1,ep as Display1Style,tp as Display2,rp as Display2Style,ap as Display3,fp as Display3Style,Qt as DisplayIcon,qt as DocumentIcon,Yt as DownloadIcon,Jt as EcoIcon,Zt as EditIcon,ko as EditRow,$t as EngineIcon,er as ErrorFilledIcon,rr as ErrorIcon,z as ErrorMessage,fr as EstoniaFlagIcon,pr as ExportIcon,mr as FacebookIcon,ur as FacilityIcon,sr as FavouriteFilledIcon,Ir as FavouriteIcon,Sr as FigmaIcon,gr as FilterIcon,Tr as FinanceIcon,kr as FinlandFlagIcon,Fr as FirstIcon,Lr as FixedPriceIcon,uo as Flex,ue as FocusTrap,br as FuelIcon,Pr as GearboxIcon,Ar as GetPaidIcon,Nr as GridViewIcon,Hr as HatchbackIcon,lp as Headline,pp as HeadlineStyle,Ur as HelpIcon,Ao as Hero,Kr as HistoryIcon,Qr as HomeDeliveryIcon,E as IconButton,qr as IdIcon,Yr as ImageIcon,Jr as InfoIcon,Zr as InstagramIcon,$r as InsuranceIcon,ea as InteriorIcon,ra as KvdIcon,fa as KvdTestIcon,pa as KvdproIcon,ma as LastIcon,ua as LeaderIcon,To as Link,sa as LinkedinIcon,So as ListItem,Ia as ListViewIcon,Sa as LocationIcon,Ho as Logo,ga as MailIcon,Ta as MenuIcon,me as MenuItem,fe as Message,ka as MileageIcon,Fa as MinivanIcon,X as Modal,La as ModelYearIcon,ba as MoreIcon,Pa as MotorbikeIcon,Aa as NavigationIcon,Na as NewIcon,Ha as NextFilledIcon,Ua as NextIcon,Zo as NotificationButton,Ka as NotificationIcon,oo as OffCanvas,Qa as OpenInNewIcon,qa as PayementIcon,Ya as PercentIcon,Ja as PhoneIcon,Za as PickUpIcon,$a as Pickup,ef as PlayIcon,rf as PlugIcon,ff as PolandFlagIcon,pf as PreviousFilledIcon,mf as PreviousIcon,uf as PrintIcon,Fp as Quote,sf as QuoteIcon,wp as QuoteStyle,Fo as RadioButton,If as RatingIcon,pe as RegistrationPlate,yf as ReleasingIcon,Cf as ReorderIcon,Bf as RestartIcon,hf as SalesOfferIcon,wf as SavedSearchIcon,vf as ScheduleIcon,Df as SearchIcon,Rf as SedanIcon,so as Select,Mf as SellFilledIcon,Ef as SellIcon,Vf as SettingsIcon,Gf as ShareIcon,Of as ShowLessIcon,Wf as ShowMoreIcon,zf as SignInIcon,jf as SignOutIcon,Xf as SlackIcon,_f as SmartphoneIcon,ol as SmileIcon,ao as Snackbar,tl as SnowmobileIcon,al as SortColumnIcon,ll as SortIcon,lo as Spacer,j as Spinner,Lo as SpinnerThin,no as Stack,bo as Stamp,Lp as Status,vp as StatusStyle,Qo as Stepper,qo as StepperAccordion,nl as StorageIcon,dl as StoreIcon,np as Subtitle,mp as SubtitleStyle,xl as SuvIcon,cl as SwedishFlagIcon,Jo as Switcher,W as Tab,go as Table,O as Tabs,G as TextArea,V as TextField,il as ThreeSixtyIcon,Po as TimePicker,dp as TinyTitleBold,up as TinyTitleBoldStyle,xp as TinyTitleRegular,sp as TinyTitleRegularStyle,cp as Title,Ip as TitleStyle,Ko as Toggle,Io as ToggleArrow,yl as TractorIcon,Cl as TrailerIcon,Bl as TransportIcon,hl as TruckIcon,wl as TwitterIcon,vl as TyresIcon,Dl as UnitedKingdomFlagIcon,Rl as UploadIcon,Ml as UserIcon,El as ValuationIcon,$o as ValuationRange,Vl as VanIcon,Gl as VersionIcon,Ol as ViewsIcon,Wl as WagonIcon,zl as WarningIcon,jl as WarrantyIcon,Xl as YoutubeIcon,Hp as getDarkerShade,Vp as getLighterShade,Up as hexToRGB,L as mediaQueries,v as mq,b as mqNumberSizes,D as mqSizes,Gp as resetButtonStyle,Kp as resolveColorWithNeutral,F as theme,_l as useDynamicScript};
1
+ import{default as h}from"./theme.js";import{mediaQueries as w,mq as L,mqNumberSizes as v,mqSizes as b}from"./shared/media-queries.js";import{Accordion as P}from"./components/Accordion/index.js";import{Button as A}from"./components/Button/index.js";import{default as N}from"./components/IconButton.js";import{TextField as H}from"./components/Textfield/index.js";import{TextArea as U}from"./components/TextArea/index.js";import{Tabs as K}from"./components/Tabs/Tabs.js";import{default as Q}from"./components/Tabs/Tab.js";import{ErrorMessage as q}from"./components/ErrorMessage/index.js";import{default as Y}from"./components/Spinner/index.js";import{Modal as J}from"./components/Modal/index.js";import{Dialog as Z}from"./components/Dialog/index.js";import{OffCanvas as $}from"./components/OffCanvas/index.js";import{CheckBox as eo}from"./components/CheckBox/index.js";import{Snackbar as ro}from"./components/Snackbar/index.js";import{default as fo}from"./components/Spacer/index.js";import{default as no}from"./components/Stack/index.js";import{default as mo}from"./components/Flex/index.js";import{Select as xo}from"./components/Select/index.js";import{default as co}from"./components/ToggleArrow/index.js";import{default as io}from"./components/ListItem/index.js";import{default as go}from"./components/Table/index.js";import{Link as Co}from"./components/Link/index.js";import{default as Bo}from"./components/EditRow/index.js";import{RadioButton as ho}from"./components/RadioButton/index.js";import{SpinnerThin as wo}from"./components/SpinnerThin/index.js";import{default as vo}from"./components/Stamp/index.js";import{TimePicker as Do}from"./components/TimePicker/index.js";import{default as Ro}from"./components/Hero/index.js";import{DayPicker as Mo}from"./components/DayPicker/index.js";import{Logo as Eo}from"./components/Logo/index.js";import{Badge as Vo}from"./components/Badge/index.js";import{Toggle as Go}from"./components/Toggle/index.js";import{Stepper as Oo}from"./components/Stepper/index.js";import{StepperAccordion as Wo}from"./components/StepperAccordion/index.js";import{Card as zo}from"./components/Card/index.js";import{Switcher as jo}from"./components/Switcher/index.js";import{NotificationButton as Xo}from"./components/NotificationButton/index.js";import{default as _o}from"./components/ValuationRange/index.js";import{Chip as oe}from"./components/Chip/index.js";import{default as te}from"./components/Breadcrumbs/index.js";import{default as ae}from"./components/Message/index.js";import{default as le}from"./components/RegistrationPlate/index.js";import{MenuItem as pe}from"./components/MenuItem/index.js";import{FocusTrap as de}from"./components/FocusTrap.js";import{default as xe}from"./icons/components/AddIcon.js";import{default as ce}from"./icons/components/AlertIcon.js";import{default as ie}from"./icons/components/ArrowDownIcon.js";import{default as ge}from"./icons/components/ArrowLeftIcon.js";import{default as Ce}from"./icons/components/ArrowRightIcon.js";import{default as Be}from"./icons/components/ArrowUpIcon.js";import{default as he}from"./icons/components/AtvIcon.js";import{default as we}from"./icons/components/AuctionIcon.js";import{default as ve}from"./icons/components/BackIcon.js";import{default as De}from"./icons/components/BackToTopIcon.js";import{default as Re}from"./icons/components/BankidIcon.js";import{default as Me}from"./icons/components/BidIcon.js";import{default as Ee}from"./icons/components/BodyIcon.js";import{default as Ve}from"./icons/components/BreaksIcon.js";import{default as Ge}from"./icons/components/CabIcon.js";import{default as Oe}from"./icons/components/CalendarIcon.js";import{default as We}from"./icons/components/CameraIcon.js";import{default as ze}from"./icons/components/CamperIcon.js";import{default as je}from"./icons/components/CancelCircleIcon.js";import{default as Xe}from"./icons/components/CancelIcon.js";import{default as _e}from"./icons/components/CarIcon.js";import{default as ot}from"./icons/components/CarServiceIcon.js";import{default as tt}from"./icons/components/CaravanIcon.js";import{default as at}from"./icons/components/CertifiedIcon.js";import{default as lt}from"./icons/components/ChatIcon.js";import{default as pt}from"./icons/components/CheckCircleIcon.js";import{default as dt}from"./icons/components/CheckFilledIcon.js";import{default as xt}from"./icons/components/CheckIcon.js";import{default as ct}from"./icons/components/CheckmarkIcon.js";import{default as it}from"./icons/components/ClockIcon.js";import{default as gt}from"./icons/components/CloseIcon.js";import{default as Ct}from"./icons/components/CommentFilledIcon.js";import{default as Bt}from"./icons/components/CommentIcon.js";import{default as ht}from"./icons/components/ConditioningIcon.js";import{default as wt}from"./icons/components/ContactIcon.js";import{default as vt}from"./icons/components/ControlNumberIcon.js";import{default as Dt}from"./icons/components/CopyIcon.js";import{default as Rt}from"./icons/components/CountdownIcon.js";import{default as Mt}from"./icons/components/CoupeIcon.js";import{default as Et}from"./icons/components/CraneIcon.js";import{default as Vt}from"./icons/components/CupIcon.js";import{default as Gt}from"./icons/components/DeleteIcon.js";import{default as Ot}from"./icons/components/DisplayIcon.js";import{default as Wt}from"./icons/components/DocumentIcon.js";import{default as zt}from"./icons/components/DownloadIcon.js";import{default as jt}from"./icons/components/EcoIcon.js";import{default as Xt}from"./icons/components/EditIcon.js";import{default as _t}from"./icons/components/EngineIcon.js";import{default as or}from"./icons/components/ErrorFilledIcon.js";import{default as tr}from"./icons/components/ErrorIcon.js";import{default as ar}from"./icons/components/EstoniaFlagIcon.js";import{default as lr}from"./icons/components/ExportIcon.js";import{default as pr}from"./icons/components/FacebookIcon.js";import{default as dr}from"./icons/components/FacilityIcon.js";import{default as xr}from"./icons/components/FavouriteFilledIcon.js";import{default as cr}from"./icons/components/FavouriteIcon.js";import{default as ir}from"./icons/components/FigmaIcon.js";import{default as gr}from"./icons/components/FilterIcon.js";import{default as Cr}from"./icons/components/FinanceIcon.js";import{default as Br}from"./icons/components/FinlandFlagIcon.js";import{default as hr}from"./icons/components/FirstIcon.js";import{default as wr}from"./icons/components/FixedPriceIcon.js";import{default as vr}from"./icons/components/FuelIcon.js";import{default as Dr}from"./icons/components/GearboxIcon.js";import{default as Rr}from"./icons/components/GetPaidIcon.js";import{default as Mr}from"./icons/components/GridViewIcon.js";import{default as Er}from"./icons/components/HatchbackIcon.js";import{default as Vr}from"./icons/components/HelpIcon.js";import{default as Gr}from"./icons/components/HistoryIcon.js";import{default as Or}from"./icons/components/HomeDeliveryIcon.js";import{default as Wr}from"./icons/components/IdIcon.js";import{default as zr}from"./icons/components/ImageIcon.js";import{default as jr}from"./icons/components/InfoIcon.js";import{default as Xr}from"./icons/components/InstagramIcon.js";import{default as _r}from"./icons/components/InsuranceIcon.js";import{default as oa}from"./icons/components/InteriorIcon.js";import{default as ta}from"./icons/components/KvdIcon.js";import{default as aa}from"./icons/components/KvdTestIcon.js";import{default as la}from"./icons/components/KvdproIcon.js";import{default as pa}from"./icons/components/LastIcon.js";import{default as da}from"./icons/components/LeaderIcon.js";import{default as xa}from"./icons/components/LinkedinIcon.js";import{default as ca}from"./icons/components/ListViewIcon.js";import{default as ia}from"./icons/components/LocationIcon.js";import{default as ga}from"./icons/components/MailIcon.js";import{default as Ca}from"./icons/components/MenuIcon.js";import{default as Ba}from"./icons/components/MileageIcon.js";import{default as ha}from"./icons/components/MinivanIcon.js";import{default as wa}from"./icons/components/ModelYearIcon.js";import{default as va}from"./icons/components/MoreIcon.js";import{default as Da}from"./icons/components/MotorbikeIcon.js";import{default as Ra}from"./icons/components/NavigationIcon.js";import{default as Ma}from"./icons/components/NewIcon.js";import{default as Ea}from"./icons/components/NextFilledIcon.js";import{default as Va}from"./icons/components/NextIcon.js";import{default as Ga}from"./icons/components/NotificationIcon.js";import{default as Oa}from"./icons/components/OpenInNewIcon.js";import{default as Wa}from"./icons/components/PayementIcon.js";import{default as za}from"./icons/components/PercentIcon.js";import{default as ja}from"./icons/components/PhoneIcon.js";import{default as Xa}from"./icons/components/PickUpIcon.js";import{default as _a}from"./icons/components/Pickup.js";import{default as of}from"./icons/components/PlayIcon.js";import{default as tf}from"./icons/components/PlugIcon.js";import{default as af}from"./icons/components/PolandFlagIcon.js";import{default as lf}from"./icons/components/PreviousFilledIcon.js";import{default as pf}from"./icons/components/PreviousIcon.js";import{default as df}from"./icons/components/PrintIcon.js";import{default as xf}from"./icons/components/QuoteIcon.js";import{default as cf}from"./icons/components/RatingIcon.js";import{default as Sf}from"./icons/components/ReleasingIcon.js";import{default as yf}from"./icons/components/ReorderIcon.js";import{default as Tf}from"./icons/components/RestartIcon.js";import{default as kf}from"./icons/components/SalesOfferIcon.js";import{default as Ff}from"./icons/components/SavedSearchIcon.js";import{default as Lf}from"./icons/components/ScheduleIcon.js";import{default as bf}from"./icons/components/SearchIcon.js";import{default as Pf}from"./icons/components/SedanIcon.js";import{default as Af}from"./icons/components/SellFilledIcon.js";import{default as Nf}from"./icons/components/SellIcon.js";import{default as Hf}from"./icons/components/SettingsIcon.js";import{default as Uf}from"./icons/components/ShareIcon.js";import{default as Kf}from"./icons/components/ShowLessIcon.js";import{default as Qf}from"./icons/components/ShowMoreIcon.js";import{default as qf}from"./icons/components/SignInIcon.js";import{default as Yf}from"./icons/components/SignOutIcon.js";import{default as Jf}from"./icons/components/SlackIcon.js";import{default as Zf}from"./icons/components/SmartphoneIcon.js";import{default as $f}from"./icons/components/SmileIcon.js";import{default as el}from"./icons/components/SnowmobileIcon.js";import{default as rl}from"./icons/components/SortColumnIcon.js";import{default as fl}from"./icons/components/SortIcon.js";import{default as nl}from"./icons/components/StorageIcon.js";import{default as ml}from"./icons/components/StoreIcon.js";import{default as ul}from"./icons/components/SuvIcon.js";import{default as sl}from"./icons/components/SwedishFlagIcon.js";import{default as Il}from"./icons/components/ThreeSixtyIcon.js";import{default as Sl}from"./icons/components/TractorIcon.js";import{default as yl}from"./icons/components/TrailerIcon.js";import{default as Tl}from"./icons/components/TransportIcon.js";import{default as kl}from"./icons/components/TruckIcon.js";import{default as Fl}from"./icons/components/TwitterIcon.js";import{default as Ll}from"./icons/components/TyresIcon.js";import{default as bl}from"./icons/components/UnitedKingdomFlagIcon.js";import{default as Pl}from"./icons/components/UploadIcon.js";import{default as Al}from"./icons/components/UserIcon.js";import{default as Nl}from"./icons/components/ValuationIcon.js";import{default as Hl}from"./icons/components/VanIcon.js";import{default as Ul}from"./icons/components/VersionIcon.js";import{default as Kl}from"./icons/components/ViewsIcon.js";import{default as Ql}from"./icons/components/WagonIcon.js";import{default as ql}from"./icons/components/WarningIcon.js";import{default as Yl}from"./icons/components/WarrantyIcon.js";import{default as Jl}from"./icons/components/YoutubeIcon.js";import{useDynamicScript as Zl}from"./hooks/useDynamicScript.js";import{useNameAndId as $l}from"./hooks/useNameAndId.js";import{generateNameHash as en}from"./shared/helpers.js";import{Display1 as rn,Display1Style as an,Display2 as fn,Display2Style as ln,Display3 as nn,Display3Style as pn,Headline as mn,HeadlineStyle as dn,Subtitle as un,SubtitleStyle as xn,TinyTitleBold as sn,TinyTitleBoldStyle as cn,TinyTitleRegular as In,TinyTitleRegularStyle as Sn,Title as gn,TitleStyle as yn}from"./typography/Heading/index.js";import{BodyLink as Tn,BodyLinkStyle as Bn,BodyText as kn,BodyTextStyle as hn,Caption as Fn,CaptionLink as wn,CaptionLinkStyle as Ln,CaptionStyle as vn,Quote as bn,QuoteStyle as Dn,Status as Pn,StatusStyle as Rn}from"./typography/BodyText/index.js";import{ButtonLarge as Mn,ButtonLargeTextStyle as Nn,Button as En,ButtonRegularTextStyle as Hn,ButtonSmall as Vn,ButtonSmallTextStyle as Un}from"./typography/ButtonText/index.js";import{getDarkerShade as Kn,getLighterShade as On,hexToRGB as Qn,resetButtonStyle as Wn,resolveColorWithNeutral as qn}from"./utils/utils.js";import"react/jsx-runtime";import"react";import"styled-components";import"react-collapse";import"./components/Button/styles.js";import"./components/FieldLabel.js";import"react-dom";import"react-transition-group";import"./components/OffCanvas/Overlay.js";import"./components/OffCanvas/useClickOutside.js";import"react-select";import"./shared/constants.js";import"react-router-dom";import"react-day-picker";import"date-fns/locale";import"date-fns";import"./components/DayPicker/style.js";import"./components/Logo/LogoSv.js";import"./components/Logo/LogoEn.js";import"./components/Chip/styles.js";import"./components/Breadcrumbs/BreadcrumbsItem.js";import"./components/RegistrationPlate/EuFlagIcon.js";export{P as Accordion,xe as AddIcon,ce as AlertIcon,ie as ArrowDownIcon,ge as ArrowLeftIcon,Ce as ArrowRightIcon,Be as ArrowUpIcon,he as AtvIcon,we as AuctionIcon,ve as BackIcon,De as BackToTopIcon,Vo as Badge,Re as BankidIcon,Me as BidIcon,Ee as BodyIcon,Tn as BodyLink,Bn as BodyLinkStyle,kn as BodyText,hn as BodyTextStyle,te as Breadcrumbs,Ve as BreaksIcon,A as Button,Mn as ButtonLargeText,Nn as ButtonLargeTextStyle,En as ButtonRegularText,Hn as ButtonRegularTextStyle,Vn as ButtonSmallText,Un as ButtonSmallTextStyle,Ge as CabIcon,Oe as CalendarIcon,We as CameraIcon,ze as CamperIcon,je as CancelCircleIcon,Xe as CancelIcon,Fn as Caption,wn as CaptionLink,Ln as CaptionLinkStyle,vn as CaptionStyle,_e as CarIcon,ot as CarServiceIcon,tt as CaravanIcon,zo as Card,at as CertifiedIcon,lt as ChatIcon,eo as CheckBox,pt as CheckCircleIcon,dt as CheckFilledIcon,xt as CheckIcon,ct as CheckmarkIcon,oe as Chip,it as ClockIcon,gt as CloseIcon,Ct as CommentFilledIcon,Bt as CommentIcon,ht as ConditioningIcon,wt as ContactIcon,vt as ControlNumberIcon,Dt as CopyIcon,Rt as CountdownIcon,Mt as CoupeIcon,Et as CraneIcon,Vt as CupIcon,Mo as DayPicker,Gt as DeleteIcon,Z as Dialog,rn as Display1,an as Display1Style,fn as Display2,ln as Display2Style,nn as Display3,pn as Display3Style,Ot as DisplayIcon,Wt as DocumentIcon,zt as DownloadIcon,jt as EcoIcon,Xt as EditIcon,Bo as EditRow,_t as EngineIcon,or as ErrorFilledIcon,tr as ErrorIcon,q as ErrorMessage,ar as EstoniaFlagIcon,lr as ExportIcon,pr as FacebookIcon,dr as FacilityIcon,xr as FavouriteFilledIcon,cr as FavouriteIcon,ir as FigmaIcon,gr as FilterIcon,Cr as FinanceIcon,Br as FinlandFlagIcon,hr as FirstIcon,wr as FixedPriceIcon,mo as Flex,de as FocusTrap,vr as FuelIcon,Dr as GearboxIcon,Rr as GetPaidIcon,Mr as GridViewIcon,Er as HatchbackIcon,mn as Headline,dn as HeadlineStyle,Vr as HelpIcon,Ro as Hero,Gr as HistoryIcon,Or as HomeDeliveryIcon,N as IconButton,Wr as IdIcon,zr as ImageIcon,jr as InfoIcon,Xr as InstagramIcon,_r as InsuranceIcon,oa as InteriorIcon,ta as KvdIcon,aa as KvdTestIcon,la as KvdproIcon,pa as LastIcon,da as LeaderIcon,Co as Link,xa as LinkedinIcon,io as ListItem,ca as ListViewIcon,ia as LocationIcon,Eo as Logo,ga as MailIcon,Ca as MenuIcon,pe as MenuItem,ae as Message,Ba as MileageIcon,ha as MinivanIcon,J as Modal,wa as ModelYearIcon,va as MoreIcon,Da as MotorbikeIcon,Ra as NavigationIcon,Ma as NewIcon,Ea as NextFilledIcon,Va as NextIcon,Xo as NotificationButton,Ga as NotificationIcon,$ as OffCanvas,Oa as OpenInNewIcon,Wa as PayementIcon,za as PercentIcon,ja as PhoneIcon,Xa as PickUpIcon,_a as Pickup,of as PlayIcon,tf as PlugIcon,af as PolandFlagIcon,lf as PreviousFilledIcon,pf as PreviousIcon,df as PrintIcon,bn as Quote,xf as QuoteIcon,Dn as QuoteStyle,ho as RadioButton,cf as RatingIcon,le as RegistrationPlate,Sf as ReleasingIcon,yf as ReorderIcon,Tf as RestartIcon,kf as SalesOfferIcon,Ff as SavedSearchIcon,Lf as ScheduleIcon,bf as SearchIcon,Pf as SedanIcon,xo as Select,Af as SellFilledIcon,Nf as SellIcon,Hf as SettingsIcon,Uf as ShareIcon,Kf as ShowLessIcon,Qf as ShowMoreIcon,qf as SignInIcon,Yf as SignOutIcon,Jf as SlackIcon,Zf as SmartphoneIcon,$f as SmileIcon,ro as Snackbar,el as SnowmobileIcon,rl as SortColumnIcon,fl as SortIcon,fo as Spacer,Y as Spinner,wo as SpinnerThin,no as Stack,vo as Stamp,Pn as Status,Rn as StatusStyle,Oo as Stepper,Wo as StepperAccordion,nl as StorageIcon,ml as StoreIcon,un as Subtitle,xn as SubtitleStyle,ul as SuvIcon,sl as SwedishFlagIcon,jo as Switcher,Q as Tab,go as Table,K as Tabs,U as TextArea,H as TextField,Il as ThreeSixtyIcon,Do as TimePicker,sn as TinyTitleBold,cn as TinyTitleBoldStyle,In as TinyTitleRegular,Sn as TinyTitleRegularStyle,gn as Title,yn as TitleStyle,Go as Toggle,co as ToggleArrow,Sl as TractorIcon,yl as TrailerIcon,Tl as TransportIcon,kl as TruckIcon,Fl as TwitterIcon,Ll as TyresIcon,bl as UnitedKingdomFlagIcon,Pl as UploadIcon,Al as UserIcon,Nl as ValuationIcon,_o as ValuationRange,Hl as VanIcon,Ul as VersionIcon,Kl as ViewsIcon,Ql as WagonIcon,ql as WarningIcon,Yl as WarrantyIcon,Jl as YoutubeIcon,en as generateNameHash,Kn as getDarkerShade,On as getLighterShade,Qn as hexToRGB,w as mediaQueries,L as mq,v as mqNumberSizes,b as mqSizes,Wn as resetButtonStyle,qn as resolveColorWithNeutral,h as theme,Zl as useDynamicScript,$l as useNameAndId};
@@ -1 +1 @@
1
- const o=e=>{const t=Math.random().toString(36).replace(/[^a-z]+/g,"").substr(2,10);return`${e}-${t}`},$=(e,t)=>{if(!/^#?([0-9A-F]{3}){1,2}$/i.test(e))return e;const n=e.match(e.length<=4?/\w/g:/\w\w/g);if(n){const a=n.map(r=>parseInt(r.length<2?`${r}${r}`:r,16));if(a.every(Number.isInteger)){const[r,s,g]=a;return`rgba(${r}, ${s}, ${g}, ${t||1})`}}return e};export{$ as fadedColor,o as generateNameHash};
1
+ const g=e=>`${e?`${e}-`:""}${Math.random().toString(36).slice(2,12)}`,o=(e,a)=>{if(!/^#?([0-9A-F]{3}){1,2}$/i.test(e))return e;const r=e.match(e.length<=4?/\w/g:/\w\w/g);if(r){const t=r.map(n=>parseInt(n.length<2?`${n}${n}`:n,16));if(t.every(Number.isInteger)){const[n,s,$]=t;return`rgba(${n}, ${s}, ${$}, ${a||1})`}}return e};export{o as fadedColor,g as generateNameHash};
@@ -6,4 +6,8 @@ import{css as s}from"styled-components";const i=e=>{let t=0,a=0,r=0;return e.len
6
6
  font-family: inherit;
7
7
  outline: none;
8
8
  padding: 0;
9
+
10
+ &:focus-visible {
11
+ outline: revert;
12
+ }
9
13
  `,o=e=>({darker:e.colors.grayscaleNeutral.dark1,dark:e.colors.grayscaleNeutral.dark1,mainAlt:e.colors.grayscaleToned.dark1,main:e.colors.grayscaleToned.dark1,light:e.colors.grayscaleToned.light1,lighter:e.colors.grayscaleToned.light2,lighter2:e.colors.grayscaleToned.light3,lighter3:e.colors.grayscaleToned.light4}),h=(e,t)=>t==="neutral"?o(e):e.colors[t],n=["darker","dark","mainAlt","main","light","lighter","lighter2","lighter3"],d=e=>{const t=n.indexOf(e);return t>=0&&t<n.length-1?n[t+1]:e},u=e=>{const t=n.indexOf(e);return t>0?n[t-1]:e};export{u as getDarkerShade,d as getLighterShade,i as getLuminosity,c as hexToRGB,o as neutralColorSwap,g as resetButtonStyle,h as resolveColorWithNeutral};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kvdbil/components",
3
- "version": "17.2.3",
3
+ "version": "17.3.0",
4
4
  "sideEffects": false,
5
5
  "main": "cjs/index.js",
6
6
  "module": "esm/index.js",