@kvdbil/components 8.3.3 → 8.4.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.
- package/cjs/components/RadioButton/index.js +11 -10
- package/cjs/components/Stepper/index.js +54 -25
- package/cjs/components/Textfield/index.js +1 -1
- package/cjs/index.js +1 -1
- package/cjs/shared/helpers.js +1 -1
- package/esm/components/RadioButton/index.js +3 -2
- package/esm/components/Stepper/index.js +54 -25
- package/esm/components/Textfield/index.js +1 -1
- package/esm/index.js +1 -1
- package/esm/shared/helpers.js +1 -1
- package/package.json +2 -2
- package/types/components/Stepper/index.d.ts +7 -1
- package/types/index.d.ts +0 -2
- package/cjs/components/InlineStepper/Step.js +0 -56
- package/cjs/components/InlineStepper/StepCircle.js +0 -43
- package/cjs/components/InlineStepper/index.js +0 -7
- package/esm/components/InlineStepper/Step.js +0 -56
- package/esm/components/InlineStepper/StepCircle.js +0 -43
- package/esm/components/InlineStepper/index.js +0 -7
- package/types/components/InlineStepper/Step.d.ts +0 -20
- package/types/components/InlineStepper/StepCircle.d.ts +0 -8
- package/types/components/InlineStepper/index.d.ts +0 -10
|
@@ -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"),a=require("../../theme.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("styled-components"),t=require("../../shared/helpers.js"),a=require("../../theme.js"),i=require("../IconButton.js"),l=require("../../typography/BodyText/index.js");function o(y){return y&&typeof y=="object"&&"default"in y?y:{default:y}}require("../../shared/media-queries.js");var s=o(e),c=o(r);const d={regular:r.css`
|
|
2
2
|
.circle {
|
|
3
3
|
&--outer {
|
|
4
4
|
height: 24px;
|
|
@@ -43,18 +43,18 @@
|
|
|
43
43
|
background-color: ${a.default.colors.gray.light1};
|
|
44
44
|
}
|
|
45
45
|
}
|
|
46
|
-
`,f=
|
|
46
|
+
`,f=c.default.div`
|
|
47
47
|
display: flex;
|
|
48
48
|
align-items: center;
|
|
49
49
|
box-sizing: border-box;
|
|
50
|
-
`,b=
|
|
50
|
+
`,b=c.default.span`
|
|
51
51
|
cursor: pointer;
|
|
52
52
|
display: flex;
|
|
53
53
|
position: relative;
|
|
54
54
|
align-items: center;
|
|
55
55
|
justify-content: center;
|
|
56
56
|
|
|
57
|
-
${y=>
|
|
57
|
+
${y=>d[y.size]};
|
|
58
58
|
|
|
59
59
|
${y=>{return!y.isDisabled&&y.isChecked&&($=y.color,r.css`
|
|
60
60
|
.circle {
|
|
@@ -71,15 +71,16 @@
|
|
|
71
71
|
${y=>y.isDisabled&&n};
|
|
72
72
|
|
|
73
73
|
${y=>y.isChecked&&y.isDisabled&&u};
|
|
74
|
-
`,
|
|
75
|
-
|
|
76
|
-
|
|
74
|
+
`,p=c.default.input`
|
|
75
|
+
position: fixed;
|
|
76
|
+
opacity: 0;
|
|
77
|
+
`,h=c.default.span`
|
|
77
78
|
display: flex;
|
|
78
79
|
box-sizing: border-box;
|
|
79
80
|
border-radius: 50%;
|
|
80
81
|
|
|
81
82
|
border: 2px solid ${a.default.colors.gray.light1};
|
|
82
|
-
`,g=
|
|
83
|
+
`,g=c.default.span`
|
|
83
84
|
box-sizing: border-box;
|
|
84
85
|
opacity: 0;
|
|
85
86
|
margin: auto;
|
|
@@ -89,9 +90,9 @@
|
|
|
89
90
|
position: absolute;
|
|
90
91
|
top: 0;
|
|
91
92
|
left: 0;
|
|
92
|
-
`,m=
|
|
93
|
+
`,m=c.default(l.BodyText)`
|
|
93
94
|
cursor: ${({isDisabled:y})=>y?"default":"pointer"};
|
|
94
95
|
user-select: none;
|
|
95
96
|
color: ${({theme:y,isDisabled:$})=>$?y.colors.text.disabled:y.colors.text.dark};
|
|
96
97
|
margin-left: 0.5rem;
|
|
97
|
-
`,x=({name:y=t.generateNameHash("radio-button"),size:$="regular",checked:D=!1,isDisabled:k=!1,color:j="secondary",onChange:q,label:v,...E})=>s.default.createElement(f,null,s.default.createElement(
|
|
98
|
+
`,x=({name:y=t.generateNameHash("radio-button"),size:$="regular",checked:D=!1,isDisabled:k=!1,color:j="secondary",onChange:q,label:v,...E})=>s.default.createElement(f,null,s.default.createElement(i.default,{onClick:q,isActive:D,isDisabled:k,color:j},s.default.createElement(p,{"data-validate":"checked",checked:D,type:"radio",name:y,id:y,onChange:q,disabled:k,"aria-label":y,...E}),s.default.createElement(b,{size:$,color:j,isChecked:D,isDisabled:k},s.default.createElement(h,{className:"circle circle--outer"},s.default.createElement(g,{className:"circle circle--inner"})))),v&&s.default.createElement(m,{as:"label",htmlFor:y,isDisabled:k},v));exports.RadioButton=x,exports.default=x;
|
|
@@ -1,33 +1,62 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),
|
|
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
|
-
|
|
4
|
-
|
|
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
|
-
|
|
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
|
-
&:
|
|
16
|
-
|
|
17
|
-
|
|
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
|
-
|
|
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
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
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)}))};
|
|
@@ -61,4 +61,4 @@
|
|
|
61
61
|
${({centered:g})=>g&&"width: 100%; text-align: center;"}
|
|
62
62
|
`,b=s.default.span`
|
|
63
63
|
display: block;
|
|
64
|
-
`,x=({placeholder:g="",isDisabled:y=!1,centered:
|
|
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;
|
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;
|
package/cjs/shared/helpers.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.fadedColor=(
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.fadedColor=(r,n)=>{if(!/^#?([0-9A-F]{3}){1,2}$/i.test(r))return r;const e=r.match(r.length<=4?/\w/g:/\w\w/g);if(e){const s=e.map(t=>parseInt(t.length<2?`${t}${t}`:t,16));if(s.every(Number.isInteger)){const[t,a,o]=s;return`rgba(${t}, ${a}, ${o}, ${n||1})`}}return r},exports.generateNameHash=r=>`${r}-${Math.random().toString(36).replace(/[^a-z]+/g,"").substr(2,10)}`;
|
|
@@ -72,7 +72,8 @@ import r from"react";import o,{css as i}from"styled-components";import{generateN
|
|
|
72
72
|
|
|
73
73
|
${e=>e.isChecked&&e.isDisabled&&$};
|
|
74
74
|
`,E=o.input`
|
|
75
|
-
|
|
75
|
+
position: fixed;
|
|
76
|
+
opacity: 0;
|
|
76
77
|
`,j=o.span`
|
|
77
78
|
display: flex;
|
|
78
79
|
box-sizing: border-box;
|
|
@@ -94,4 +95,4 @@ import r from"react";import o,{css as i}from"styled-components";import{generateN
|
|
|
94
95
|
user-select: none;
|
|
95
96
|
color: ${({theme:e,isDisabled:l})=>l?e.colors.text.disabled:e.colors.text.dark};
|
|
96
97
|
margin-left: 0.5rem;
|
|
97
|
-
`,
|
|
98
|
+
`,u=({name:e=p("radio-button"),size:l="regular",checked:a=!1,isDisabled:c=!1,color:s="secondary",onChange:n,label:d,...m})=>r.createElement(z,null,r.createElement(g,{onClick:n,isActive:a,isDisabled:c,color:s},r.createElement(E,{"data-validate":"checked",checked:a,type:"radio",name:e,id:e,onChange:n,disabled:c,"aria-label":e,...m}),r.createElement(B,{size:l,color:s,isChecked:a,isDisabled:c},r.createElement(j,{className:"circle circle--outer"},r.createElement(C,{className:"circle circle--inner"})))),d&&r.createElement(S,{as:"label",htmlFor:e,isDisabled:c},d));export{u as RadioButton,u as default};
|
|
@@ -1,33 +1,62 @@
|
|
|
1
|
-
import
|
|
1
|
+
import o from"react";import r from"styled-components";import{TinyTitleRegular as g}from"../../typography/Heading/index.js";import f from"../../icons/components/CheckmarkIcon.js";import"../../shared/media-queries.js";const u=r.div`
|
|
2
|
+
display: flex;
|
|
3
|
+
flex-direction: ${({isHorizontal:e})=>e?"row":"column"};
|
|
2
4
|
min-height: 4rem;
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
width: 2px;
|
|
6
|
-
height: 100%;
|
|
7
|
-
background-color: ${n.colors.primary.main};
|
|
8
|
-
`,s=t.div`
|
|
9
|
-
margin-right: 0.75rem;
|
|
10
|
-
`,d=t.div`
|
|
11
|
-
font-family: ${({theme:r})=>r.typography.fontBaseFamily};
|
|
5
|
+
margin: 0 auto;
|
|
6
|
+
`,x=r.div`
|
|
12
7
|
display: flex;
|
|
13
|
-
|
|
8
|
+
flex-direction: ${({isHorizontal:e})=>e?"column":"row"};
|
|
9
|
+
column-gap: 0.75rem;
|
|
10
|
+
align-items: center;
|
|
11
|
+
padding: ${({isHorizontal:e})=>e?"0 0.5rem":"0.5rem 0"};
|
|
12
|
+
position: relative;
|
|
13
|
+
width: ${({isHorizontal:e,stepsNumber:t})=>e?`calc(100% / ${t})`:"100%"};
|
|
14
14
|
|
|
15
|
-
&:
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
}
|
|
15
|
+
&:not(:first-child) :before {
|
|
16
|
+
position: absolute;
|
|
17
|
+
content: '';
|
|
18
|
+
top: ${({isHorizontal:e,size:t})=>e?`calc(${t/2}rem + 1px)`:"0"};
|
|
19
|
+
left: ${({isHorizontal:e,size:t})=>e?"0":`calc(${t/2}rem + 1px)`};
|
|
20
|
+
width: ${({isHorizontal:e,size:t})=>e?`calc(50% - ${t/2}rem)`:"2px"};
|
|
21
|
+
height: ${({isHorizontal:e,size:t})=>e?"2px":`calc(50% - ${t/2}rem)`};
|
|
22
|
+
background: ${({theme:e,color:t})=>e.colors[t].main};
|
|
19
23
|
}
|
|
20
|
-
`,p=t.div`
|
|
21
|
-
width: 3rem;
|
|
22
|
-
height: 3rem;
|
|
23
|
-
border-radius: 3rem;
|
|
24
24
|
|
|
25
|
-
|
|
25
|
+
&:not(:last-child) :after {
|
|
26
|
+
position: absolute;
|
|
27
|
+
content: '';
|
|
28
|
+
|
|
29
|
+
${({isHorizontal:e,size:t})=>e&&`
|
|
30
|
+
top: calc(${t/2}rem + 1px);
|
|
31
|
+
`}
|
|
32
|
+
${({isHorizontal:e})=>!e&&`
|
|
33
|
+
bottom: 0;
|
|
34
|
+
`}
|
|
35
|
+
${({isHorizontal:e})=>e&&`
|
|
36
|
+
right: 0;
|
|
37
|
+
`}
|
|
38
|
+
${({isHorizontal:e,size:t})=>!e&&`
|
|
39
|
+
left: calc(${t/2}rem + 1px);
|
|
40
|
+
`}
|
|
41
|
+
width: ${({isHorizontal:e,size:t})=>e?`calc(50% - ${t/2}rem)`:"2px"};
|
|
42
|
+
height: ${({isHorizontal:e,size:t})=>e?"2px":`calc(50% - ${t/2}rem)`};
|
|
43
|
+
background: ${({theme:e,color:t})=>e.colors[t].main};
|
|
44
|
+
}
|
|
45
|
+
`,y=r.div``,b=r.div`
|
|
26
46
|
display: flex;
|
|
27
47
|
align-items: center;
|
|
28
48
|
justify-content: center;
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
49
|
+
width: ${({size:e})=>e}rem;
|
|
50
|
+
height: ${({size:e})=>e}rem;
|
|
51
|
+
border-radius: 50%;
|
|
52
|
+
border: 2px solid ${({theme:e,color:t})=>e.colors[t].main};
|
|
53
|
+
color: ${({theme:e,isFilled:t})=>t?e.colors.text.light:e.colors.text.dark};
|
|
54
|
+
${({theme:e,isFilled:t,color:n})=>t&&`
|
|
55
|
+
background-color: ${e.colors[n].main};
|
|
56
|
+
`}
|
|
57
|
+
`,k=r(g)`
|
|
58
|
+
font-size: ${({size:e})=>`${e/2}rem`};
|
|
59
|
+
line-height: 1;
|
|
60
|
+
`,w=r(f)`
|
|
61
|
+
font-size: ${({size:e})=>`calc(${e/2}rem + 6px)`};
|
|
62
|
+
`,E=({children:e,orientation:t="vertical",variant:n="solid",color:l="primary",size:c=2,activeStep:a,...p})=>{const $=e.length,m=t==="horizontal";return o.createElement(u,{isHorizontal:m,...p},e.map((d,i)=>{const s=a&&i<a,h=s||n==="solid";return o.createElement(x,{key:i,color:l,size:c,stepsNumber:$,isHorizontal:m},o.createElement(y,null,o.createElement(b,{color:l,isFilled:h,size:c},s?o.createElement(w,{size:c}):o.createElement(k,{as:"span",size:c},i+1))),d)}))};export{E as Stepper};
|
|
@@ -61,4 +61,4 @@ import o,{useState as B}from"react";import r,{css as m}from"styled-components";i
|
|
|
61
61
|
${({centered:e})=>e&&"width: 100%; text-align: center;"}
|
|
62
62
|
`,g=r.span`
|
|
63
63
|
display: block;
|
|
64
|
-
`,y=({placeholder:e="",isDisabled:t=!1,centered:
|
|
64
|
+
`,y=({placeholder:e="",isDisabled:t=!1,centered:n=!1,hasError:d=!1,className:b,helperText:i,label:s="",onBlur:$=()=>null,onFocus:h=()=>null,forwardRef:k,suffix:u,name:a=w("text-input"),errors:c,...x})=>{const[p,f]=B(!1),F=Boolean(x.value),S=l=>{f(!0),h(l)},v=l=>{f(!1),$(l)};return o.createElement(C,{className:b},o.createElement(L,{isFocused:p,disabled:t,centered:n,hasError:d,hasPlaceholder:!!e},o.createElement(W,{...x,id:a,name:a,"aria-label":s||a,ref:k,onFocus:S,onBlur:v,disabled:t,placeholder:s&&!p?"":e}),u&&o.createElement(_,null,u)),s&&o.createElement(E,{htmlFor:a,isFocused:p,centered:n,hasError:d,hasValue:F,disabled:t},s),(i||c)&&o.createElement(q,{centered:n,hasError:d},i&&o.createElement(g,null,i),c&&c.map(l=>o.createElement(g,{key:l},l))))};export{y as TextField,y as default};
|
package/esm/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{default as theme}from"./theme.js";export{mediaQueries,mq,mqSizes}from"./shared/media-queries.js";export{Accordion}from"./components/Accordion/index.js";export{Button}from"./components/Button/index.js";export{default as IconButton}from"./components/IconButton.js";export{TextField}from"./components/Textfield/index.js";export{TextArea}from"./components/TextArea/index.js";export{Tabs}from"./components/Tabs/Tabs.js";export{default as Tab}from"./components/Tabs/Tab.js";export{ErrorMessage}from"./components/ErrorMessage/index.js";export{default as Spinner}from"./components/Spinner/index.js";export{Modal}from"./components/Modal/index.js";export{Dialog}from"./components/Dialog/index.js";export{OffCanvas}from"./components/OffCanvas/index.js";export{CheckBox}from"./components/CheckBox/index.js";export{Snackbar}from"./components/Snackbar/index.js";export{Select}from"./components/Select/index.js";export{default as ListItem}from"./components/ListItem/index.js";export{TimePicker}from"./components/TimePicker/index.js";export{Hero}from"./components/Hero/index.js";export{DayPicker}from"./components/DayPicker/index.js";export{Logo}from"./components/Logo/index.js";export{Badge}from"./components/Badge/index.js";export{Toggle}from"./components/Toggle/index.js";export{Stepper}from"./components/Stepper/index.js";export{default as Step}from"./components/InlineStepper/Step.js";export{InlineStepper}from"./components/InlineStepper/index.js";export{StepperAccordion}from"./components/StepperAccordion/index.js";export{Card}from"./components/Card/index.js";export{NotificationButton}from"./components/NotificationButton/index.js";export{Range}from"./components/Range/index.js";export{Chip}from"./components/Chip/index.js";export{default as Breadcrumbs}from"./components/Breadcrumbs/index.js";export{default as Message}from"./components/Message/index.js";export{Header}from"./components/Header/index.js";export{MenuItem}from"./components/MenuItem/index.js";export{default as AddIcon}from"./icons/components/AddIcon.js";export{default as AlertIcon}from"./icons/components/AlertIcon.js";export{default as ArrowDownIcon}from"./icons/components/ArrowDownIcon.js";export{default as ArrowLeftIcon}from"./icons/components/ArrowLeftIcon.js";export{default as ArrowRightIcon}from"./icons/components/ArrowRightIcon.js";export{default as ArrowUpIcon}from"./icons/components/ArrowUpIcon.js";export{default as AtvIcon}from"./icons/components/AtvIcon.js";export{default as AuctionIcon}from"./icons/components/AuctionIcon.js";export{default as BackIcon}from"./icons/components/BackIcon.js";export{default as BankidIcon}from"./icons/components/BankidIcon.js";export{default as BidIcon}from"./icons/components/BidIcon.js";export{default as BodyIcon}from"./icons/components/BodyIcon.js";export{default as BreaksIcon}from"./icons/components/BreaksIcon.js";export{default as CabIcon}from"./icons/components/CabIcon.js";export{default as CalendarIcon}from"./icons/components/CalendarIcon.js";export{default as CameraIcon}from"./icons/components/CameraIcon.js";export{default as CancelIcon}from"./icons/components/CancelIcon.js";export{default as CarIcon}from"./icons/components/CarIcon.js";export{default as CarServiceIcon}from"./icons/components/CarServiceIcon.js";export{default as CaravanIcon}from"./icons/components/CaravanIcon.js";export{default as CertifiedIcon}from"./icons/components/CertifiedIcon.js";export{default as ChatIcon}from"./icons/components/ChatIcon.js";export{default as CheckCircleIcon}from"./icons/components/CheckCircleIcon.js";export{default as CheckFilledIcon}from"./icons/components/CheckFilledIcon.js";export{default as CheckIcon}from"./icons/components/CheckIcon.js";export{default as CheckmarkIcon}from"./icons/components/CheckmarkIcon.js";export{default as ClockIcon}from"./icons/components/ClockIcon.js";export{default as CloseIcon}from"./icons/components/CloseIcon.js";export{default as CommentFilledIcon}from"./icons/components/CommentFilledIcon.js";export{default as CommentIcon}from"./icons/components/CommentIcon.js";export{default as ConditioningIcon}from"./icons/components/ConditioningIcon.js";export{default as ContactIcon}from"./icons/components/ContactIcon.js";export{default as ControlNumberIcon}from"./icons/components/ControlNumberIcon.js";export{default as CopyIcon}from"./icons/components/CopyIcon.js";export{default as CountdownIcon}from"./icons/components/CountdownIcon.js";export{default as CoupeIcon}from"./icons/components/CoupeIcon.js";export{default as CraneIcon}from"./icons/components/CraneIcon.js";export{default as CupIcon}from"./icons/components/CupIcon.js";export{default as DeleteIcon}from"./icons/components/DeleteIcon.js";export{default as DisplayIcon}from"./icons/components/DisplayIcon.js";export{default as DocumentIcon}from"./icons/components/DocumentIcon.js";export{default as EcoIcon}from"./icons/components/EcoIcon.js";export{default as EditIcon}from"./icons/components/EditIcon.js";export{default as EngineIcon}from"./icons/components/EngineIcon.js";export{default as ErrorFilledIcon}from"./icons/components/ErrorFilledIcon.js";export{default as ErrorIcon}from"./icons/components/ErrorIcon.js";export{default as ExportIcon}from"./icons/components/ExportIcon.js";export{default as FacebookIcon}from"./icons/components/FacebookIcon.js";export{default as FacilityIcon}from"./icons/components/FacilityIcon.js";export{default as FavouriteFilledIcon}from"./icons/components/FavouriteFilledIcon.js";export{default as FavouriteIcon}from"./icons/components/FavouriteIcon.js";export{default as FigmaIcon}from"./icons/components/FigmaIcon.js";export{default as FilterIcon}from"./icons/components/FilterIcon.js";export{default as FinanceIcon}from"./icons/components/FinanceIcon.js";export{default as FirstIcon}from"./icons/components/FirstIcon.js";export{default as FixedPriceIcon}from"./icons/components/FixedPriceIcon.js";export{default as FuelIcon}from"./icons/components/FuelIcon.js";export{default as GearboxIcon}from"./icons/components/GearboxIcon.js";export{default as GetPaidIcon}from"./icons/components/GetPaidIcon.js";export{default as GridViewIcon}from"./icons/components/GridViewIcon.js";export{default as HatchbackIcon}from"./icons/components/HatchbackIcon.js";export{default as HistoryIcon}from"./icons/components/HistoryIcon.js";export{default as HomeDeliveryIcon}from"./icons/components/HomeDeliveryIcon.js";export{default as IdIcon}from"./icons/components/IdIcon.js";export{default as InfoIcon}from"./icons/components/InfoIcon.js";export{default as InstagramIcon}from"./icons/components/InstagramIcon.js";export{default as InsuranceIcon}from"./icons/components/InsuranceIcon.js";export{default as InteriorIcon}from"./icons/components/InteriorIcon.js";export{default as KvdTestIcon}from"./icons/components/KvdTestIcon.js";export{default as KvdproIcon}from"./icons/components/KvdproIcon.js";export{default as LastIcon}from"./icons/components/LastIcon.js";export{default as LeaderIcon}from"./icons/components/LeaderIcon.js";export{default as LinkedinIcon}from"./icons/components/LinkedinIcon.js";export{default as ListViewIcon}from"./icons/components/ListViewIcon.js";export{default as LocationIcon}from"./icons/components/LocationIcon.js";export{default as MailIcon}from"./icons/components/MailIcon.js";export{default as MenuIcon}from"./icons/components/MenuIcon.js";export{default as MileageIcon}from"./icons/components/MileageIcon.js";export{default as MinivanIcon}from"./icons/components/MinivanIcon.js";export{default as ModelYearIcon}from"./icons/components/ModelYearIcon.js";export{default as MoreIcon}from"./icons/components/MoreIcon.js";export{default as MotorbikeIcon}from"./icons/components/MotorbikeIcon.js";export{default as NavigationIcon}from"./icons/components/NavigationIcon.js";export{default as NewIcon}from"./icons/components/NewIcon.js";export{default as NextFilledIcon}from"./icons/components/NextFilledIcon.js";export{default as NextIcon}from"./icons/components/NextIcon.js";export{default as NotificationIcon}from"./icons/components/NotificationIcon.js";export{default as OpenInNewIcon}from"./icons/components/OpenInNewIcon.js";export{default as PayementIcon}from"./icons/components/PayementIcon.js";export{default as PhoneIcon}from"./icons/components/PhoneIcon.js";export{default as PickUpIcon}from"./icons/components/PickUpIcon.js";export{default as Pickup}from"./icons/components/Pickup.js";export{default as PlayIcon}from"./icons/components/PlayIcon.js";export{default as PreviousFilledIcon}from"./icons/components/PreviousFilledIcon.js";export{default as PreviousIcon}from"./icons/components/PreviousIcon.js";export{default as PrintIcon}from"./icons/components/PrintIcon.js";export{default as RatingIcon}from"./icons/components/RatingIcon.js";export{default as ReleasingIcon}from"./icons/components/ReleasingIcon.js";export{default as ReorderIcon}from"./icons/components/ReorderIcon.js";export{default as RestartIcon}from"./icons/components/RestartIcon.js";export{default as SalesOfferIcon}from"./icons/components/SalesOfferIcon.js";export{default as SavedSearchIcon}from"./icons/components/SavedSearchIcon.js";export{default as ScheduleIcon}from"./icons/components/ScheduleIcon.js";export{default as SearchIcon}from"./icons/components/SearchIcon.js";export{default as SedanIcon}from"./icons/components/SedanIcon.js";export{default as SellIcon}from"./icons/components/SellIcon.js";export{default as SettingsIcon}from"./icons/components/SettingsIcon.js";export{default as ShareIcon}from"./icons/components/ShareIcon.js";export{default as ShowLessIcon}from"./icons/components/ShowLessIcon.js";export{default as ShowMoreIcon}from"./icons/components/ShowMoreIcon.js";export{default as SignInIcon}from"./icons/components/SignInIcon.js";export{default as SignOutIcon}from"./icons/components/SignOutIcon.js";export{default as SlackIcon}from"./icons/components/SlackIcon.js";export{default as SmartphoneIcon}from"./icons/components/SmartphoneIcon.js";export{default as SmileIcon}from"./icons/components/SmileIcon.js";export{default as SnowmobileIcon}from"./icons/components/SnowmobileIcon.js";export{default as SortColumnIcon}from"./icons/components/SortColumnIcon.js";export{default as SortIcon}from"./icons/components/SortIcon.js";export{default as StoreIcon}from"./icons/components/StoreIcon.js";export{default as SuvIcon}from"./icons/components/SuvIcon.js";export{default as ThreeSixtyIcon}from"./icons/components/ThreeSixtyIcon.js";export{default as TrailerIcon}from"./icons/components/TrailerIcon.js";export{default as TransportIcon}from"./icons/components/TransportIcon.js";export{default as TruckIcon}from"./icons/components/TruckIcon.js";export{default as TwitterIcon}from"./icons/components/TwitterIcon.js";export{default as TyresIcon}from"./icons/components/TyresIcon.js";export{default as UserIcon}from"./icons/components/UserIcon.js";export{default as ValuationIcon}from"./icons/components/ValuationIcon.js";export{default as VanIcon}from"./icons/components/VanIcon.js";export{default as ViewsIcon}from"./icons/components/ViewsIcon.js";export{default as WagonIcon}from"./icons/components/WagonIcon.js";export{default as WarningIcon}from"./icons/components/WarningIcon.js";export{default as WarrantyIcon}from"./icons/components/WarrantyIcon.js";export{default as YoutubeIcon}from"./icons/components/YoutubeIcon.js";export{useDynamicScript}from"./hooks/useDynamicScript.js";export{Display1,Display2,Display3,Headline,Subtitle,TinyTitleBold,TinyTitleRegular,Title}from"./typography/Heading/index.js";export{BodyLink,BodyText,Caption,CaptionLink,Quote,Status}from"./typography/BodyText/index.js";export{ButtonLarge as ButtonLargeText,Button as ButtonRegularText,ButtonSmall as ButtonSmallText}from"./typography/ButtonText/index.js";export{RadioButton}from"./components/RadioButton/index.js";export{resetButtonStyle}from"./utils/utils.js";import"react";import"styled-components";import"react-collapse";import"./components/Button/styles.js";import"./components/FieldLabel.js";import"./shared/helpers.js";import"react-dom";import"react-transition-group";import"./components/Icons/Close.js";import"./components/OffCanvas/Overlay.js";import"./components/OffCanvas/useClickOutside.js";import"./components/Icons/CheckCircle.js";import"./components/Icons/ErrorCircle.js";import"./components/Icons/InfoCircle.js";import"react-select";import"./shared/constants.js";import"react-day-picker";import"./components/DayPicker/DayPickerNavBar.js";import"./components/Icons/Arrow.js";import"./components/DayPicker/localeUtils.js";import"./components/DayPicker/style.js";import"./components/Logo/LogoSv.js";import"./components/Logo/LogoEn.js";import"./components/InlineStepper/StepCircle.js";import"./components/Icons/CheckIcon.js";import"./components/Chip/styles.js";import"./components/Breadcrumbs/BreadcrumbsItem.js";import"./components/Header/Hamburger.js";import"./components/Header/Link.js";
|
|
1
|
+
export{default as theme}from"./theme.js";export{mediaQueries,mq,mqSizes}from"./shared/media-queries.js";export{Accordion}from"./components/Accordion/index.js";export{Button}from"./components/Button/index.js";export{default as IconButton}from"./components/IconButton.js";export{TextField}from"./components/Textfield/index.js";export{TextArea}from"./components/TextArea/index.js";export{Tabs}from"./components/Tabs/Tabs.js";export{default as Tab}from"./components/Tabs/Tab.js";export{ErrorMessage}from"./components/ErrorMessage/index.js";export{default as Spinner}from"./components/Spinner/index.js";export{Modal}from"./components/Modal/index.js";export{Dialog}from"./components/Dialog/index.js";export{OffCanvas}from"./components/OffCanvas/index.js";export{CheckBox}from"./components/CheckBox/index.js";export{Snackbar}from"./components/Snackbar/index.js";export{Select}from"./components/Select/index.js";export{default as ListItem}from"./components/ListItem/index.js";export{TimePicker}from"./components/TimePicker/index.js";export{Hero}from"./components/Hero/index.js";export{DayPicker}from"./components/DayPicker/index.js";export{Logo}from"./components/Logo/index.js";export{Badge}from"./components/Badge/index.js";export{Toggle}from"./components/Toggle/index.js";export{Stepper}from"./components/Stepper/index.js";export{StepperAccordion}from"./components/StepperAccordion/index.js";export{Card}from"./components/Card/index.js";export{NotificationButton}from"./components/NotificationButton/index.js";export{Range}from"./components/Range/index.js";export{Chip}from"./components/Chip/index.js";export{default as Breadcrumbs}from"./components/Breadcrumbs/index.js";export{default as Message}from"./components/Message/index.js";export{Header}from"./components/Header/index.js";export{MenuItem}from"./components/MenuItem/index.js";export{default as AddIcon}from"./icons/components/AddIcon.js";export{default as AlertIcon}from"./icons/components/AlertIcon.js";export{default as ArrowDownIcon}from"./icons/components/ArrowDownIcon.js";export{default as ArrowLeftIcon}from"./icons/components/ArrowLeftIcon.js";export{default as ArrowRightIcon}from"./icons/components/ArrowRightIcon.js";export{default as ArrowUpIcon}from"./icons/components/ArrowUpIcon.js";export{default as AtvIcon}from"./icons/components/AtvIcon.js";export{default as AuctionIcon}from"./icons/components/AuctionIcon.js";export{default as BackIcon}from"./icons/components/BackIcon.js";export{default as BankidIcon}from"./icons/components/BankidIcon.js";export{default as BidIcon}from"./icons/components/BidIcon.js";export{default as BodyIcon}from"./icons/components/BodyIcon.js";export{default as BreaksIcon}from"./icons/components/BreaksIcon.js";export{default as CabIcon}from"./icons/components/CabIcon.js";export{default as CalendarIcon}from"./icons/components/CalendarIcon.js";export{default as CameraIcon}from"./icons/components/CameraIcon.js";export{default as CancelIcon}from"./icons/components/CancelIcon.js";export{default as CarIcon}from"./icons/components/CarIcon.js";export{default as CarServiceIcon}from"./icons/components/CarServiceIcon.js";export{default as CaravanIcon}from"./icons/components/CaravanIcon.js";export{default as CertifiedIcon}from"./icons/components/CertifiedIcon.js";export{default as ChatIcon}from"./icons/components/ChatIcon.js";export{default as CheckCircleIcon}from"./icons/components/CheckCircleIcon.js";export{default as CheckFilledIcon}from"./icons/components/CheckFilledIcon.js";export{default as CheckIcon}from"./icons/components/CheckIcon.js";export{default as CheckmarkIcon}from"./icons/components/CheckmarkIcon.js";export{default as ClockIcon}from"./icons/components/ClockIcon.js";export{default as CloseIcon}from"./icons/components/CloseIcon.js";export{default as CommentFilledIcon}from"./icons/components/CommentFilledIcon.js";export{default as CommentIcon}from"./icons/components/CommentIcon.js";export{default as ConditioningIcon}from"./icons/components/ConditioningIcon.js";export{default as ContactIcon}from"./icons/components/ContactIcon.js";export{default as ControlNumberIcon}from"./icons/components/ControlNumberIcon.js";export{default as CopyIcon}from"./icons/components/CopyIcon.js";export{default as CountdownIcon}from"./icons/components/CountdownIcon.js";export{default as CoupeIcon}from"./icons/components/CoupeIcon.js";export{default as CraneIcon}from"./icons/components/CraneIcon.js";export{default as CupIcon}from"./icons/components/CupIcon.js";export{default as DeleteIcon}from"./icons/components/DeleteIcon.js";export{default as DisplayIcon}from"./icons/components/DisplayIcon.js";export{default as DocumentIcon}from"./icons/components/DocumentIcon.js";export{default as EcoIcon}from"./icons/components/EcoIcon.js";export{default as EditIcon}from"./icons/components/EditIcon.js";export{default as EngineIcon}from"./icons/components/EngineIcon.js";export{default as ErrorFilledIcon}from"./icons/components/ErrorFilledIcon.js";export{default as ErrorIcon}from"./icons/components/ErrorIcon.js";export{default as ExportIcon}from"./icons/components/ExportIcon.js";export{default as FacebookIcon}from"./icons/components/FacebookIcon.js";export{default as FacilityIcon}from"./icons/components/FacilityIcon.js";export{default as FavouriteFilledIcon}from"./icons/components/FavouriteFilledIcon.js";export{default as FavouriteIcon}from"./icons/components/FavouriteIcon.js";export{default as FigmaIcon}from"./icons/components/FigmaIcon.js";export{default as FilterIcon}from"./icons/components/FilterIcon.js";export{default as FinanceIcon}from"./icons/components/FinanceIcon.js";export{default as FirstIcon}from"./icons/components/FirstIcon.js";export{default as FixedPriceIcon}from"./icons/components/FixedPriceIcon.js";export{default as FuelIcon}from"./icons/components/FuelIcon.js";export{default as GearboxIcon}from"./icons/components/GearboxIcon.js";export{default as GetPaidIcon}from"./icons/components/GetPaidIcon.js";export{default as GridViewIcon}from"./icons/components/GridViewIcon.js";export{default as HatchbackIcon}from"./icons/components/HatchbackIcon.js";export{default as HistoryIcon}from"./icons/components/HistoryIcon.js";export{default as HomeDeliveryIcon}from"./icons/components/HomeDeliveryIcon.js";export{default as IdIcon}from"./icons/components/IdIcon.js";export{default as InfoIcon}from"./icons/components/InfoIcon.js";export{default as InstagramIcon}from"./icons/components/InstagramIcon.js";export{default as InsuranceIcon}from"./icons/components/InsuranceIcon.js";export{default as InteriorIcon}from"./icons/components/InteriorIcon.js";export{default as KvdTestIcon}from"./icons/components/KvdTestIcon.js";export{default as KvdproIcon}from"./icons/components/KvdproIcon.js";export{default as LastIcon}from"./icons/components/LastIcon.js";export{default as LeaderIcon}from"./icons/components/LeaderIcon.js";export{default as LinkedinIcon}from"./icons/components/LinkedinIcon.js";export{default as ListViewIcon}from"./icons/components/ListViewIcon.js";export{default as LocationIcon}from"./icons/components/LocationIcon.js";export{default as MailIcon}from"./icons/components/MailIcon.js";export{default as MenuIcon}from"./icons/components/MenuIcon.js";export{default as MileageIcon}from"./icons/components/MileageIcon.js";export{default as MinivanIcon}from"./icons/components/MinivanIcon.js";export{default as ModelYearIcon}from"./icons/components/ModelYearIcon.js";export{default as MoreIcon}from"./icons/components/MoreIcon.js";export{default as MotorbikeIcon}from"./icons/components/MotorbikeIcon.js";export{default as NavigationIcon}from"./icons/components/NavigationIcon.js";export{default as NewIcon}from"./icons/components/NewIcon.js";export{default as NextFilledIcon}from"./icons/components/NextFilledIcon.js";export{default as NextIcon}from"./icons/components/NextIcon.js";export{default as NotificationIcon}from"./icons/components/NotificationIcon.js";export{default as OpenInNewIcon}from"./icons/components/OpenInNewIcon.js";export{default as PayementIcon}from"./icons/components/PayementIcon.js";export{default as PhoneIcon}from"./icons/components/PhoneIcon.js";export{default as PickUpIcon}from"./icons/components/PickUpIcon.js";export{default as Pickup}from"./icons/components/Pickup.js";export{default as PlayIcon}from"./icons/components/PlayIcon.js";export{default as PreviousFilledIcon}from"./icons/components/PreviousFilledIcon.js";export{default as PreviousIcon}from"./icons/components/PreviousIcon.js";export{default as PrintIcon}from"./icons/components/PrintIcon.js";export{default as RatingIcon}from"./icons/components/RatingIcon.js";export{default as ReleasingIcon}from"./icons/components/ReleasingIcon.js";export{default as ReorderIcon}from"./icons/components/ReorderIcon.js";export{default as RestartIcon}from"./icons/components/RestartIcon.js";export{default as SalesOfferIcon}from"./icons/components/SalesOfferIcon.js";export{default as SavedSearchIcon}from"./icons/components/SavedSearchIcon.js";export{default as ScheduleIcon}from"./icons/components/ScheduleIcon.js";export{default as SearchIcon}from"./icons/components/SearchIcon.js";export{default as SedanIcon}from"./icons/components/SedanIcon.js";export{default as SellIcon}from"./icons/components/SellIcon.js";export{default as SettingsIcon}from"./icons/components/SettingsIcon.js";export{default as ShareIcon}from"./icons/components/ShareIcon.js";export{default as ShowLessIcon}from"./icons/components/ShowLessIcon.js";export{default as ShowMoreIcon}from"./icons/components/ShowMoreIcon.js";export{default as SignInIcon}from"./icons/components/SignInIcon.js";export{default as SignOutIcon}from"./icons/components/SignOutIcon.js";export{default as SlackIcon}from"./icons/components/SlackIcon.js";export{default as SmartphoneIcon}from"./icons/components/SmartphoneIcon.js";export{default as SmileIcon}from"./icons/components/SmileIcon.js";export{default as SnowmobileIcon}from"./icons/components/SnowmobileIcon.js";export{default as SortColumnIcon}from"./icons/components/SortColumnIcon.js";export{default as SortIcon}from"./icons/components/SortIcon.js";export{default as StoreIcon}from"./icons/components/StoreIcon.js";export{default as SuvIcon}from"./icons/components/SuvIcon.js";export{default as ThreeSixtyIcon}from"./icons/components/ThreeSixtyIcon.js";export{default as TrailerIcon}from"./icons/components/TrailerIcon.js";export{default as TransportIcon}from"./icons/components/TransportIcon.js";export{default as TruckIcon}from"./icons/components/TruckIcon.js";export{default as TwitterIcon}from"./icons/components/TwitterIcon.js";export{default as TyresIcon}from"./icons/components/TyresIcon.js";export{default as UserIcon}from"./icons/components/UserIcon.js";export{default as ValuationIcon}from"./icons/components/ValuationIcon.js";export{default as VanIcon}from"./icons/components/VanIcon.js";export{default as ViewsIcon}from"./icons/components/ViewsIcon.js";export{default as WagonIcon}from"./icons/components/WagonIcon.js";export{default as WarningIcon}from"./icons/components/WarningIcon.js";export{default as WarrantyIcon}from"./icons/components/WarrantyIcon.js";export{default as YoutubeIcon}from"./icons/components/YoutubeIcon.js";export{useDynamicScript}from"./hooks/useDynamicScript.js";export{Display1,Display2,Display3,Headline,Subtitle,TinyTitleBold,TinyTitleRegular,Title}from"./typography/Heading/index.js";export{BodyLink,BodyText,Caption,CaptionLink,Quote,Status}from"./typography/BodyText/index.js";export{ButtonLarge as ButtonLargeText,Button as ButtonRegularText,ButtonSmall as ButtonSmallText}from"./typography/ButtonText/index.js";export{RadioButton}from"./components/RadioButton/index.js";export{resetButtonStyle}from"./utils/utils.js";import"react";import"styled-components";import"react-collapse";import"./components/Button/styles.js";import"./components/FieldLabel.js";import"./shared/helpers.js";import"react-dom";import"react-transition-group";import"./components/Icons/Close.js";import"./components/OffCanvas/Overlay.js";import"./components/OffCanvas/useClickOutside.js";import"./components/Icons/CheckCircle.js";import"./components/Icons/ErrorCircle.js";import"./components/Icons/InfoCircle.js";import"react-select";import"./shared/constants.js";import"react-day-picker";import"./components/DayPicker/DayPickerNavBar.js";import"./components/Icons/Arrow.js";import"./components/DayPicker/localeUtils.js";import"./components/DayPicker/style.js";import"./components/Logo/LogoSv.js";import"./components/Logo/LogoEn.js";import"./components/Icons/CheckIcon.js";import"./components/Chip/styles.js";import"./components/Breadcrumbs/BreadcrumbsItem.js";import"./components/Header/Hamburger.js";import"./components/Header/Link.js";
|
package/esm/shared/helpers.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const
|
|
1
|
+
const c=t=>{const e=Math.random().toString(36).replace(/[^a-z]+/g,"").substr(2,10);return`${t}-${e}`},g=(t,e)=>{if(!/^#?([0-9A-F]{3}){1,2}$/i.test(t))return t;const n=t.match(t.length<=4?/\w/g:/\w\w/g);if(n){const s=n.map(r=>parseInt(r.length<2?`${r}${r}`:r,16));if(s.every(Number.isInteger)){const[r,a,o]=s;return`rgba(${r}, ${a}, ${o}, ${e||1})`}}return t};export{g as fadedColor,c as generateNameHash};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kvdbil/components",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.4.0",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"main": "cjs/index.js",
|
|
6
6
|
"module": "esm/index.js",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"build-storybook": "build-storybook -s ./public",
|
|
20
20
|
"updateSnapshots": "yarn test -u",
|
|
21
21
|
"analyze": "rollup -c rollup.config.analyze.js",
|
|
22
|
-
"create-declaration": "yarn tsc --p tsconfig.production.json --emitDeclarationOnly --noEmit false --declaration true --declarationDir dist/types
|
|
22
|
+
"create-declaration": "yarn tsc --p tsconfig.production.json --emitDeclarationOnly --noEmit false --declaration true --declarationDir dist/types"
|
|
23
23
|
},
|
|
24
24
|
"peerDependencies": {
|
|
25
25
|
"react": ">= 17.0.0",
|
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef, ReactNode } from 'react';
|
|
2
|
+
import { Color } from '../../Types';
|
|
2
3
|
export interface StepperProps extends ComponentPropsWithoutRef<'div'> {
|
|
3
4
|
children: ReactNode[];
|
|
5
|
+
orientation?: 'horizontal' | 'vertical';
|
|
6
|
+
variant?: 'solid' | 'outline';
|
|
7
|
+
color?: Color;
|
|
8
|
+
size?: number;
|
|
9
|
+
activeStep?: number;
|
|
4
10
|
}
|
|
5
|
-
export declare const Stepper: ({ children, ...props }: StepperProps) => JSX.Element;
|
|
11
|
+
export declare const Stepper: ({ children, orientation, variant, color, size, activeStep, ...props }: StepperProps) => JSX.Element;
|
package/types/index.d.ts
CHANGED
|
@@ -22,8 +22,6 @@ export { default as Logo } from './components/Logo';
|
|
|
22
22
|
export { Badge } from './components/Badge';
|
|
23
23
|
export { Toggle } from './components/Toggle';
|
|
24
24
|
export { Stepper } from './components/Stepper';
|
|
25
|
-
export { default as Step } from './components/InlineStepper/Step';
|
|
26
|
-
export { InlineStepper } from './components/InlineStepper';
|
|
27
25
|
export { StepperAccordion } from './components/StepperAccordion';
|
|
28
26
|
export { Card } from './components/Card';
|
|
29
27
|
export { NotificationButton } from './components/NotificationButton';
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),a=require("../../theme.js"),l=require("../../typography/BodyText/index.js"),i=require("./StepCircle.js");function r(h){return h&&typeof h=="object"&&"default"in h?h:{default:h}}require("../../shared/media-queries.js"),require("../Icons/CheckIcon.js");var d=r(e),o=r(t);const n=o.default.div`
|
|
2
|
-
background-color: ${a.default.colors.gray.dark3};
|
|
3
|
-
height: 1px;
|
|
4
|
-
right: 0;
|
|
5
|
-
left: calc(50% + 20px);
|
|
6
|
-
top: 1.25rem;
|
|
7
|
-
position: absolute;
|
|
8
|
-
width: calc(100% - 40px);
|
|
9
|
-
`,c=o.default.div`
|
|
10
|
-
font-family: ${({theme:h})=>h.typography.fontBaseFamily};
|
|
11
|
-
display: flex;
|
|
12
|
-
position: relative;
|
|
13
|
-
padding: 0 0.5rem;
|
|
14
|
-
flex: 1;
|
|
15
|
-
align-items: center;
|
|
16
|
-
flex-direction: column;
|
|
17
|
-
|
|
18
|
-
&:last-child {
|
|
19
|
-
padding-bottom: 0;
|
|
20
|
-
${n} {
|
|
21
|
-
display: none;
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
`,u=o.default(l.CaptionLink)`
|
|
25
|
-
width: 100%;
|
|
26
|
-
margin: 0.5rem 0 0;
|
|
27
|
-
line-height: 1.2;
|
|
28
|
-
text-align: center;
|
|
29
|
-
color: ${a.default.colors.text.dark};
|
|
30
|
-
`,s=o.default.div`
|
|
31
|
-
margin: 0 auto;
|
|
32
|
-
width: 1px;
|
|
33
|
-
height: 100%;
|
|
34
|
-
background-color: ${a.default.colors.gray.dark3};
|
|
35
|
-
`,f=o.default.div`
|
|
36
|
-
margin-right: 0.75rem;
|
|
37
|
-
`,p=o.default.div`
|
|
38
|
-
font-family: ${({theme:h})=>h.typography.fontBaseFamily};
|
|
39
|
-
display: flex;
|
|
40
|
-
padding-bottom: 1rem;
|
|
41
|
-
|
|
42
|
-
&:last-child {
|
|
43
|
-
${s} {
|
|
44
|
-
display: none;
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
`,m=o.default(l.CaptionLink)`
|
|
48
|
-
margin: 0;
|
|
49
|
-
width: 100%;
|
|
50
|
-
line-height: 1.2;
|
|
51
|
-
text-align: left;
|
|
52
|
-
color: ${a.default.colors.text.dark};
|
|
53
|
-
display: flex;
|
|
54
|
-
flex-direction: column;
|
|
55
|
-
justify-content: center;
|
|
56
|
-
`,g=({active:h,disabled:y})=>h?"active":y?"disabled":"completed";exports.default=({step:h=0,active:y=!1,completed:k=!1,disabled:E=!1,orientation:j,children:x,backgroundColor:q,...v})=>{const b=g({active:y,disabled:E,completed:k});return j==="horizontal"?d.default.createElement(c,{...v},d.default.createElement(i.default,{state:b,step:h,backgroundColor:q}),d.default.createElement(n,null),d.default.createElement(u,{as:"div"},x)):d.default.createElement(p,{...v},d.default.createElement(f,null,d.default.createElement(i.default,{state:b,step:h}),d.default.createElement(s,null)),d.default.createElement(m,{as:"div"},x))},exports.getStepState=g;
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),o=require("../../theme.js"),r=require("../Icons/CheckIcon.js");function l(u){return u&&typeof u=="object"&&"default"in u?u:{default:u}}var a=l(e),i=l(t);const d=u=>({active:{background:o.default.colors.primary.main,color:o.default.colors.text.light,border:`1px solid ${o.default.colors.primary.main}`},completed:{background:o.default.colors.success.main,color:o.default.colors.text.light,border:`1px solid ${o.default.colors.success.main}`},disabled:{background:u,color:o.default.colors.primary.main,border:`1px solid ${o.default.colors.primary.main}`}}),n=i.default.div`
|
|
2
|
-
box-sizing: content-box;
|
|
3
|
-
width: 40px;
|
|
4
|
-
height: 40px;
|
|
5
|
-
border-radius: 50%;
|
|
6
|
-
position: relative;
|
|
7
|
-
display: flex;
|
|
8
|
-
align-items: center;
|
|
9
|
-
justify-content: center;
|
|
10
|
-
border: ${({state:u,backgroundColor:f})=>d(f)[u].border};
|
|
11
|
-
justify-content: center;
|
|
12
|
-
background-color: ${({state:u,backgroundColor:f})=>d(f)[u].background};
|
|
13
|
-
color: ${({state:u,backgroundColor:f})=>d(f)[u].color};
|
|
14
|
-
&:after {
|
|
15
|
-
content: '';
|
|
16
|
-
width: 42px;
|
|
17
|
-
height: 42px;
|
|
18
|
-
border-radius: 50%;
|
|
19
|
-
top: -11px;
|
|
20
|
-
left: -11px;
|
|
21
|
-
position: absolute;
|
|
22
|
-
z-index: 2;
|
|
23
|
-
border: ${({backgroundColor:u})=>`10px solid ${u}`};
|
|
24
|
-
}
|
|
25
|
-
`,c=i.default.div`
|
|
26
|
-
display: flex;
|
|
27
|
-
font-size: 1.25rem;
|
|
28
|
-
line-height: 1;
|
|
29
|
-
font-family: ${({theme:u})=>u.typography.fontAlternativeFamily};
|
|
30
|
-
font-weight: ${({theme:u})=>u.typography.fontAlternativeBoldWeight};
|
|
31
|
-
width: 100%;
|
|
32
|
-
height: 100%;
|
|
33
|
-
align-items: center;
|
|
34
|
-
justify-content: center;
|
|
35
|
-
`,s=i.default.div`
|
|
36
|
-
width: 14px;
|
|
37
|
-
height: 14px;
|
|
38
|
-
display: flex;
|
|
39
|
-
& svg {
|
|
40
|
-
fill: ${({theme:u})=>u.colors.text.light};
|
|
41
|
-
width: 100%;
|
|
42
|
-
}
|
|
43
|
-
`;exports.default=({state:u,step:f,backgroundColor:p=o.default.colors.background.light,...m})=>a.default.createElement("div",null,a.default.createElement(n,{className:u,state:u,...m,backgroundColor:p},a.default.createElement(c,{as:"div"},u==="completed"?a.default.createElement(s,null,a.default.createElement(r.default,{className:""})):a.default.createElement("span",{className:"step-content-text"},f))));
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("styled-components"),o=require("../../theme.js");function t(l){return l&&typeof l=="object"&&"default"in l?l:{default:l}}var n=t(e);const i=t(r).default.div`
|
|
2
|
-
min-height: 4rem;
|
|
3
|
-
padding: 10px 0;
|
|
4
|
-
display: ${({orientation:l})=>l==="horizontal"?"flex":"block"};
|
|
5
|
-
justify-content: space-between;
|
|
6
|
-
background-color: ${({backgroundColor:l})=>l};
|
|
7
|
-
`;exports.InlineStepper=({children:l,activeStep:c=0,orientation:u="horizontal",backgroundColor:s=o.default.colors.background.light,...b})=>{const f=(Array.isArray(l)?l:[l]).map((d,a)=>{var p;return((g,h)=>e.cloneElement(g,h))(d,{active:a===c,step:a+1,completed:a<c,disabled:a>c,children:(p=d==null?void 0:d.props)==null?void 0:p.children,orientation:u,backgroundColor:s})});return n.default.createElement(i,{...b,orientation:u,backgroundColor:s},f)};
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import e from"react";import r from"styled-components";import o from"../../theme.js";import{CaptionLink as c}from"../../typography/BodyText/index.js";import m from"./StepCircle.js";import"../../shared/media-queries.js";import"../Icons/CheckIcon.js";const s=r.div`
|
|
2
|
-
background-color: ${o.colors.gray.dark3};
|
|
3
|
-
height: 1px;
|
|
4
|
-
right: 0;
|
|
5
|
-
left: calc(50% + 20px);
|
|
6
|
-
top: 1.25rem;
|
|
7
|
-
position: absolute;
|
|
8
|
-
width: calc(100% - 40px);
|
|
9
|
-
`,u=r.div`
|
|
10
|
-
font-family: ${({theme:t})=>t.typography.fontBaseFamily};
|
|
11
|
-
display: flex;
|
|
12
|
-
position: relative;
|
|
13
|
-
padding: 0 0.5rem;
|
|
14
|
-
flex: 1;
|
|
15
|
-
align-items: center;
|
|
16
|
-
flex-direction: column;
|
|
17
|
-
|
|
18
|
-
&:last-child {
|
|
19
|
-
padding-bottom: 0;
|
|
20
|
-
${s} {
|
|
21
|
-
display: none;
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
`,x=r(c)`
|
|
25
|
-
width: 100%;
|
|
26
|
-
margin: 0.5rem 0 0;
|
|
27
|
-
line-height: 1.2;
|
|
28
|
-
text-align: center;
|
|
29
|
-
color: ${o.colors.text.dark};
|
|
30
|
-
`,d=r.div`
|
|
31
|
-
margin: 0 auto;
|
|
32
|
-
width: 1px;
|
|
33
|
-
height: 100%;
|
|
34
|
-
background-color: ${o.colors.gray.dark3};
|
|
35
|
-
`,v=r.div`
|
|
36
|
-
margin-right: 0.75rem;
|
|
37
|
-
`,E=r.div`
|
|
38
|
-
font-family: ${({theme:t})=>t.typography.fontBaseFamily};
|
|
39
|
-
display: flex;
|
|
40
|
-
padding-bottom: 1rem;
|
|
41
|
-
|
|
42
|
-
&:last-child {
|
|
43
|
-
${d} {
|
|
44
|
-
display: none;
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
`,k=r(c)`
|
|
48
|
-
margin: 0;
|
|
49
|
-
width: 100%;
|
|
50
|
-
line-height: 1.2;
|
|
51
|
-
text-align: left;
|
|
52
|
-
color: ${o.colors.text.dark};
|
|
53
|
-
display: flex;
|
|
54
|
-
flex-direction: column;
|
|
55
|
-
justify-content: center;
|
|
56
|
-
`,p=({active:t,disabled:i})=>t?"active":i?"disabled":"completed",$=({step:t=0,active:i=!1,completed:f=!1,disabled:h=!1,orientation:g,children:a,backgroundColor:y,...n})=>{const l=p({active:i,disabled:h,completed:f});return g==="horizontal"?e.createElement(u,{...n},e.createElement(m,{state:l,step:t,backgroundColor:y}),e.createElement(s,null),e.createElement(x,{as:"div"},a)):e.createElement(E,{...n},e.createElement(v,null,e.createElement(m,{state:l,step:t}),e.createElement(d,null)),e.createElement(k,{as:"div"},a))};export{$ as default,p as getStepState};
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
import r from"react";import i from"styled-components";import t from"../../theme.js";import s from"../Icons/CheckIcon.js";const l=e=>({active:{background:t.colors.primary.main,color:t.colors.text.light,border:`1px solid ${t.colors.primary.main}`},completed:{background:t.colors.success.main,color:t.colors.text.light,border:`1px solid ${t.colors.success.main}`},disabled:{background:e,color:t.colors.primary.main,border:`1px solid ${t.colors.primary.main}`}}),a=i.div`
|
|
2
|
-
box-sizing: content-box;
|
|
3
|
-
width: 40px;
|
|
4
|
-
height: 40px;
|
|
5
|
-
border-radius: 50%;
|
|
6
|
-
position: relative;
|
|
7
|
-
display: flex;
|
|
8
|
-
align-items: center;
|
|
9
|
-
justify-content: center;
|
|
10
|
-
border: ${({state:e,backgroundColor:o})=>l(o)[e].border};
|
|
11
|
-
justify-content: center;
|
|
12
|
-
background-color: ${({state:e,backgroundColor:o})=>l(o)[e].background};
|
|
13
|
-
color: ${({state:e,backgroundColor:o})=>l(o)[e].color};
|
|
14
|
-
&:after {
|
|
15
|
-
content: '';
|
|
16
|
-
width: 42px;
|
|
17
|
-
height: 42px;
|
|
18
|
-
border-radius: 50%;
|
|
19
|
-
top: -11px;
|
|
20
|
-
left: -11px;
|
|
21
|
-
position: absolute;
|
|
22
|
-
z-index: 2;
|
|
23
|
-
border: ${({backgroundColor:e})=>`10px solid ${e}`};
|
|
24
|
-
}
|
|
25
|
-
`,d=i.div`
|
|
26
|
-
display: flex;
|
|
27
|
-
font-size: 1.25rem;
|
|
28
|
-
line-height: 1;
|
|
29
|
-
font-family: ${({theme:e})=>e.typography.fontAlternativeFamily};
|
|
30
|
-
font-weight: ${({theme:e})=>e.typography.fontAlternativeBoldWeight};
|
|
31
|
-
width: 100%;
|
|
32
|
-
height: 100%;
|
|
33
|
-
align-items: center;
|
|
34
|
-
justify-content: center;
|
|
35
|
-
`,m=i.div`
|
|
36
|
-
width: 14px;
|
|
37
|
-
height: 14px;
|
|
38
|
-
display: flex;
|
|
39
|
-
& svg {
|
|
40
|
-
fill: ${({theme:e})=>e.colors.text.light};
|
|
41
|
-
width: 100%;
|
|
42
|
-
}
|
|
43
|
-
`,p=({state:e,step:o,backgroundColor:c=t.colors.background.light,...n})=>r.createElement("div",null,r.createElement(a,{className:e,state:e,...n,backgroundColor:c},r.createElement(d,{as:"div"},e==="completed"?r.createElement(m,null,r.createElement(s,{className:""})):r.createElement("span",{className:"step-content-text"},o))));export{p as default};
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import m,{cloneElement as i}from"react";import d from"styled-components";import h from"../../theme.js";const u=d.div`
|
|
2
|
-
min-height: 4rem;
|
|
3
|
-
padding: 10px 0;
|
|
4
|
-
display: ${({orientation:e})=>e==="horizontal"?"flex":"block"};
|
|
5
|
-
justify-content: space-between;
|
|
6
|
-
background-color: ${({backgroundColor:e})=>e};
|
|
7
|
-
`,y=(e,r)=>i(e,r),f=({children:e,activeStep:r=0,orientation:n="horizontal",backgroundColor:l=h.colors.background.light,...c})=>{const p=(Array.isArray(e)?e:[e]).map((o,t)=>{var s;const a={active:t===r,step:t+1,completed:t<r,disabled:t>r,children:(s=o==null?void 0:o.props)==null?void 0:s.children,orientation:n,backgroundColor:l};return y(o,a)});return m.createElement(u,{...c,orientation:n,backgroundColor:l},p)};export{f as InlineStepper};
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import { Orientation } from '.';
|
|
3
|
-
export interface StepProps {
|
|
4
|
-
backgroundColor?: string;
|
|
5
|
-
step?: number;
|
|
6
|
-
active?: boolean;
|
|
7
|
-
completed?: boolean;
|
|
8
|
-
disabled?: boolean;
|
|
9
|
-
children?: ReactNode;
|
|
10
|
-
orientation?: Orientation;
|
|
11
|
-
}
|
|
12
|
-
declare type State = 'active' | 'completed' | 'disabled';
|
|
13
|
-
interface States {
|
|
14
|
-
active?: boolean;
|
|
15
|
-
disabled?: boolean;
|
|
16
|
-
completed?: boolean;
|
|
17
|
-
}
|
|
18
|
-
export declare const getStepState: ({ active, disabled }: States) => State;
|
|
19
|
-
declare const Step: ({ step, active, completed, disabled, orientation, children, backgroundColor, ...props }: StepProps) => JSX.Element;
|
|
20
|
-
export default Step;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
declare type State = 'active' | 'completed' | 'disabled';
|
|
2
|
-
interface Props {
|
|
3
|
-
state: State;
|
|
4
|
-
step: number;
|
|
5
|
-
backgroundColor?: string;
|
|
6
|
-
}
|
|
7
|
-
declare const StepCircle: ({ state, step, backgroundColor, ...props }: Props) => JSX.Element;
|
|
8
|
-
export default StepCircle;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { ReactElement } from 'react';
|
|
2
|
-
import { StepProps } from './Step';
|
|
3
|
-
export declare type Orientation = 'horizontal' | 'vertical';
|
|
4
|
-
export interface InlineStepperProps {
|
|
5
|
-
activeStep: number;
|
|
6
|
-
children: ReactElement<StepProps>[] | ReactElement<StepProps>;
|
|
7
|
-
orientation?: Orientation;
|
|
8
|
-
backgroundColor?: string;
|
|
9
|
-
}
|
|
10
|
-
export declare const InlineStepper: ({ children, activeStep, orientation, backgroundColor, ...props }: InlineStepperProps) => JSX.Element;
|