@kvdbil/components 3.3.5 → 3.4.0

package/esm/components/DayPicker/style.js

@@ -0,0 +1,226 @@
+import{css as e}from"styled-components";var a=e`
+  /* DayPicker styles */
+
+  .DayPicker {
+    display: inline-block;
+    font-size: 1rem;
+  }
+
+  .DayPicker-wrapper {
+    position: relative;
+
+    flex-direction: row;
+    padding-bottom: 1em;
+
+    -webkit-user-select: none;
+
+    -moz-user-select: none;
+
+    -ms-user-select: none;
+
+    user-select: none;
+  }
+
+  .DayPicker-Months {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+  }
+
+  .DayPicker-Month {
+    display: table;
+    margin: 0 1em;
+    margin-top: 1em;
+    border-spacing: 0;
+    border-collapse: collapse;
+
+    -webkit-user-select: none;
+
+    -moz-user-select: none;
+
+    -ms-user-select: none;
+
+    user-select: none;
+  }
+
+  .DayPicker-NavBar {
+  }
+
+  .DayPicker-NavButton {
+    position: absolute;
+    top: 1em;
+    right: 1.5em;
+    left: auto;
+
+    display: inline-block;
+    margin-top: 2px;
+    width: 1.25em;
+    height: 1.25em;
+    background-position: center;
+    background-size: 50%;
+    background-repeat: no-repeat;
+    color: #8b9898;
+    cursor: pointer;
+  }
+
+  .DayPicker-NavButton:hover {
+    opacity: 0.8;
+  }
+
+  .DayPicker-NavButton--prev {
+    margin-right: 1.5em;
+    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAwCAYAAAB5R9gVAAAABGdBTUEAALGPC/xhBQAAAVVJREFUWAnN2G0KgjAYwPHpGfRkaZeqvgQaK+hY3SUHrk1YzNLay/OiEFp92I+/Mp2F2Mh2lLISWnflFjzH263RQjzMZ19wgs73ez0o1WmtW+dgA01VxrE3p6l2GLsnBy1VYQOtVSEH/atCCgqpQgKKqYIOiq2CBkqtggLKqQIKgqgCBjpJ2Y5CdJ+zrT9A7HHSTA1dxUdHgzCqJIEwq0SDsKsEg6iqBIEoq/wEcVRZBXFV+QJxV5mBtlDFB5VjYTaGZ2sf4R9PM7U9ZU+lLuaetPP/5Die3ToO1+u+MKtHs06qODB2zBnI/jBd4MPQm1VkY79Tb18gB+C62FdBFsZR6yeIo1YQiLJWMIiqVjQIu1YSCLNWFgijVjYIuhYYCKoWKAiiFgoopxYaKLUWOii2FgkophYp6F3r42W5A9s9OcgNvva8xQaysKXlFytoqdYmQH6tF3toSUo0INq9AAAAAElFTkSuQmCC');
+  }
+
+  .DayPicker-NavButton--next {
+    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAwCAYAAAB5R9gVAAAABGdBTUEAALGPC/xhBQAAAXRJREFUWAnN119ugjAcwPHWzJ1gnmxzB/BBE0n24m4xfNkTaOL7wOtsl3AXMMb+Vjaa1BG00N8fSEibPpAP3xAKKs2yjzTPH9RAjhEo9WzPr/Vm8zgE0+gXATAxxuxtqeJ9t5tIwv5AtQAApsfT6TPdbp+kUBcgVwvO51KqVhMkXKsVJFXrOkigVhCIs1Y4iKlWZxB1rX4gwlpRIIpa8SDkWmggrFq4IIRaJKCYWnSgnrXIQV1r8YD+1Vrn+bReagysIFfLABRt31v8oBu1xEBttfRbltmfjgEcWh9snUS2kNdBK6WN1vrOWxObWsz+fjxevsxmB1GQDfINWiev83nhaoiB/CoOU438oPrhXS0WpQ9xc1ZQWxWHqUYe0I0qrKCQKjygDlXIQV2r0IF6ViEBxVTBBSFUQQNhVYkHIVeJAtkNsbQ7c1LtzP6FsObhb2rCKv7NBIGoq4SDmKoEgTirXAcJVGkFSVVpgoSrXICGUMUH/QBZNSUy5XWUhwAAAABJRU5ErkJggg==');
+  }
+
+  .DayPicker-NavButton--interactionDisabled {
+    display: none;
+  }
+
+  .DayPicker-Caption {
+    display: table-caption;
+    margin-bottom: 0.5em;
+    padding: 0 0.5em;
+    text-align: left;
+  }
+
+  .DayPicker-Caption > div {
+    font-weight: 500;
+    font-size: 1.15em;
+  }
+
+  .DayPicker-Weekdays {
+    display: table-header-group;
+    margin-top: 1em;
+  }
+
+  .DayPicker-WeekdaysRow {
+    display: table-row;
+  }
+
+  .DayPicker-Weekday {
+    display: table-cell;
+    padding: 0.5em;
+    color: #8b9898;
+    text-align: center;
+    font-size: 0.875em;
+  }
+
+  .DayPicker-Weekday abbr[title] {
+    border-bottom: none;
+    text-decoration: none;
+  }
+
+  .DayPicker-Body {
+    display: table-row-group;
+  }
+
+  .DayPicker-Week {
+    display: table-row;
+  }
+
+  .DayPicker-Day {
+    display: table-cell;
+    padding: 0.5em;
+    border-radius: 50%;
+    vertical-align: middle;
+    text-align: center;
+    cursor: pointer;
+  }
+
+  .DayPicker-WeekNumber {
+    display: table-cell;
+    padding: 0.5em;
+    min-width: 1em;
+    border-right: 1px solid #eaecec;
+    color: #8b9898;
+    vertical-align: middle;
+    text-align: right;
+    font-size: 0.75em;
+    cursor: pointer;
+  }
+
+  .DayPicker--interactionDisabled .DayPicker-Day {
+    cursor: default;
+  }
+
+  .DayPicker-Footer {
+    padding-top: 0.5em;
+  }
+
+  .DayPicker-TodayButton {
+    border: none;
+    background-color: transparent;
+    background-image: none;
+    box-shadow: none;
+    color: #4a90e2;
+    font-size: 0.875em;
+    cursor: pointer;
+  }
+
+  /* Default modifiers */
+
+  .DayPicker-Day--today {
+    color: #d0021b;
+    font-weight: 700;
+  }
+
+  .DayPicker-Day--outside {
+    color: #8b9898;
+    cursor: default;
+  }
+
+  .DayPicker-Day--disabled {
+    color: #dce0e0;
+    cursor: default;
+    /* background-color: #eff1f1; */
+  }
+
+  /* Example modifiers */
+
+  .DayPicker-Day--sunday {
+    background-color: #f7f8f8;
+  }
+
+  .DayPicker-Day--sunday:not(.DayPicker-Day--today) {
+    color: #dce0e0;
+  }
+
+  .DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {
+    position: relative;
+
+    background-color: #4a90e2;
+    color: #f0f8ff;
+  }
+
+  .DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside):hover {
+    background-color: #51a0fa;
+  }
+
+  .DayPicker:not(.DayPicker--interactionDisabled)
+    .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {
+    background-color: #f0f8ff;
+  }
+
+  /* DayPickerInput */
+
+  .DayPickerInput {
+    display: inline-block;
+  }
+
+  .DayPickerInput-OverlayWrapper {
+    position: relative;
+  }
+
+  .DayPickerInput-Overlay {
+    position: absolute;
+    left: 0;
+    z-index: 1;
+
+    background: white;
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
+  }
+`;export{a as default};

package/esm/components/Dialog/index.js

@@ -0,0 +1,27 @@
+import t from"react";import e from"styled-components";import{mq as x}from"../../shared/media-queries.js";import{Button as a}from"../Button/index.js";import{Modal as h}from"../Modal/index.js";import{TinyTitle as g}from"../../typography/Heading/index.js";import"../../theme.js";import"../Spinner/index.js";import"../../typography/ButtonText/index.js";import"react-dom";import"react-transition-group";import"../Icons/Close.js";const j=e.div`
+  padding-top: 1rem;
+`,v=e.div`
+  top: 20px;
+  left: 32px;
+  position: absolute;
+`,w=e(g)`
+  font-weight: ${({theme:o})=>o.typography.fontAlternativeRegularWeight};
+  margin: 0;
+`,E=e.div`
+  display: flex;
+  justify-content: space-between;
+  ${x("tablet")} {
+    justify-content: flex-start;
+  }
+  overflow-x: hidden;
+`,B=e(a)`
+  overflow-x: hidden;
+  margin-right: 2rem;
+  justify-content: center;
+  width: 100%;
+  max-width: 110px;
+`,C=e(a)`
+  justify-content: center;
+  width: 100%;
+  max-width: 245px;
+`,l=({isOpen:o,title:n,children:s,modalStyles:m,titleStyles:c,primaryButtonText:p,primaryButtonStyles:d,secondaryButtonStyles:u,secondaryButtonText:f,primaryButtonAction:r,secondaryButtonAction:i,onClose:y})=>t.createElement(h,{contentStyles:m,isOpen:o,onClose:y},n&&t.createElement(v,null,t.createElement(w,{style:c},n)),t.createElement(j,null,s),t.createElement(E,null,i&&t.createElement(B,{style:u,onClick:i,variant:"outline",color:"neutral"},f),r&&t.createElement(C,{style:d,onClick:r,variant:"solid",color:"success"},p)));export{l as Dialog,l as default};

package/esm/components/ErrorMessage/index.js

@@ -0,0 +1,10 @@
+import a from"react";import n from"styled-components";const i=n.div`
+  font-family: ${({theme:t})=>t.typography.fontAlternativeFamily};
+  font-weight: ${({theme:t})=>t.typography.fontAlternativeRegularWeight};
+  background: ${({theme:t})=>t.colors.error.main};
+  color: white;
+  border-radius: 0.25rem;
+  font-size: 13px;
+  padding: 10px;
+  ${({centered:t})=>t&&"text-align: center;"}
+`,e=({children:t,centered:r,...o})=>a.createElement(i,{centered:r,...o},t);export{e as ErrorMessage,e as default};

package/esm/components/FieldLabel.js

@@ -0,0 +1,34 @@
+import r,{css as t}from"styled-components";const l="0.5rem",s=e=>t`
+  background-color: ${o=>o.theme.colors.background.light};
+  transform: scale(0.75) translateY(${e});
+  transform-origin: 0 0;
+  padding: 0 ${l};
+  left: ${l};
+  color: ${({theme:o})=>o.colors.text.dark};
+`,c=t`
+  color: ${e=>e.theme.colors.text.dark};
+`,n=t`
+  color: ${e=>e.theme.colors.gray.light1};
+  background-color: ${e=>e.theme.colors.background.light};
+`,a=t`
+  text-align: center;
+  width: 100%;
+  left: 0;
+`,i=r.label`
+  font-family: ${({theme:e})=>e.typography.fontBaseFamily};
+  pointer-events: none;
+  position: absolute;
+  z-index: 1;
+  top: ${e=>e.height?`${e.height}rem`:"0.9rem"};
+  left: calc(0.75rem + 2px);
+  transition: 150ms;
+  height: 16px;
+  line-height: 16px;
+  font-size: 16px;
+  color: ${e=>e.theme.colors.gray.dark5};
+
+  ${e=>e.centered&&a}
+  ${e=>(e.hasValue||e.isFocused)&&s(e.height?`-${(e.height+.25)*1.35}rem`:"-1.75rem")}
+  ${e=>e.isFocused&&c}
+  ${e=>e.disabled&&n}
+`;export{i as Label};

package/esm/components/Header/Hamburger.js

@@ -0,0 +1,31 @@
+import t from"react";import a from"styled-components";import{mq as r}from"../../shared/media-queries.js";const o=a.button`
+  appearance: none;
+  cursor: pointer;
+  background-color: transparent;
+  border: 0;
+  outline: none;
+  display: flex;
+  align-items: center;
+  margin-right: 1.5rem;
+  margin-left: auto;
+  ${r("laptop")} {
+    display: none;
+  }
+
+  svg {
+    width: 1.5rem;
+    height: 1.5rem;
+    fill: ${({theme:e})=>e.colors.text.dark};
+  }
+  span {
+    display: none;
+    font-family: ${({theme:e})=>e.typography.fontBaseFamily};
+    font-weight: ${({theme:e})=>e.typography.fontBaseBoldWeight};
+    font-size: 1rem;
+    margin-right: 0.75rem;
+
+    ${r("tablet")} {
+      display: inline;
+    }
+  }
+`,l=({onClick:e=()=>{},text:n})=>t.createElement(o,{onClick:e},t.createElement("span",null,n),t.createElement("svg",null,t.createElement("symbol",{id:"icon-hamburger",viewBox:"0 0 16 12"},t.createElement("path",{d:"M0 0h16v2H0zm0 5h16v2H0zm0 5h16v2H0z"})),t.createElement("use",{xlinkHref:"#icon-hamburger"})));export{l as default};

package/esm/components/Header/Link.js

@@ -0,0 +1,34 @@
+import r from"react";import o from"styled-components";import{mq as m}from"../../shared/media-queries.js";import t from"../../theme.js";const l=o.li`
+  font-family: ${({theme:e})=>e.typography.fontAlternativeFamily};
+  font-weight: ${({theme:e})=>e.typography.fontAlternativeRegularWeight};
+  font-size: 1rem;
+  display: flex;
+  align-items: center;
+  white-space: nowrap;
+  border-radius: 0.25rem;
+
+  &:last-child {
+    margin-right: 0;
+  }
+  &:nth-child(n + 4) {
+    display: none;
+  }
+
+  ${m("laptop")} {
+    &:nth-child(n + 4) {
+      display: inherit;
+    }
+  }
+`,s=o.a`
+  border-radius: 0.25rem;
+  padding: 0.75rem 1.5rem;
+  transition: 200ms;
+  color: ${t.colors.text.dark};
+  text-decoration: none;
+
+  &:hover,
+  &:active {
+    color: ${t.colors.primary.main};
+    background: ${t.colors.gray.light4};
+  }
+`,c=({to:e,component:i,text:n,...a})=>r.createElement(l,null,i||r.createElement(s,{href:e,...a},n));export{c as default};

package/esm/components/Header/index.js

@@ -0,0 +1,63 @@
+import e from"react";import t from"styled-components";import{mq as r}from"../../shared/media-queries.js";import n from"../../theme.js";import{Logo as y}from"../Logo/index.js";import k from"./Hamburger.js";import i from"./Link.js";import"../Logo/LogoSv.js";import"../Logo/LogoEn.js";const b=t.a`
+  cursor: pointer;
+  padding: 0 0.625rem;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: ${n.colors.background.light};
+
+  ${r("tablet")} {
+    display: block;
+    width: auto;
+    padding: 0 1.5rem 0 0;
+  }
+`,h=t.nav`
+  width: 100%;
+  z-index: 17;
+  position: fixed;
+  top: 0;
+  left: 0;
+  color: ${n.colors.text.dark};
+  background-color: ${n.colors.background.light};
+  transition: 300ms;
+`,j=t.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  background-color: ${n.colors.background.gray};
+
+  ${r("tablet")} {
+    background-color: ${n.colors.background.light};
+    flex-direction: row;
+    padding: 0em 1.5em;
+  }
+`,E=t.div`
+  display: flex;
+  width: 100%;
+`,L=t.ul`
+  display: flex;
+  justify-content: space-around;
+  width: 100%;
+  position: relative;
+  margin: 0;
+  padding: 0;
+  flex-grow: 1;
+
+  ${r("tablet")} {
+    justify-content: flex-start;
+    padding: 0.5em 0;
+    display: flex;
+    padding: 0;
+    flex: 1;
+  }
+`,$=t.ul`
+  display: none;
+
+  ${r("laptop")} {
+    padding: 0.5em 0;
+    display: flex;
+    padding: 0;
+  }
+`,l=({locale:d,primaryLinks:c,secondaryLinks:s,menuIconText:m,onMenuClick:p,onHeaderClick:g,forwardRef:u,css:f="",...x})=>e.createElement(h,{css:f,...x,ref:u},e.createElement(j,null,e.createElement(b,{onClick:g},e.createElement(y,{locale:d})),e.createElement(E,null,e.createElement(L,null,c.map((o,a)=>e.createElement(i,{key:o.text||a,...o}))),e.createElement(k,{text:m,onClick:p})),e.createElement($,null,s.map((o,a)=>e.createElement(i,{key:o.text||a,...o})))));export{l as Header,l as default};

package/esm/components/Hero/index.js

@@ -0,0 +1,26 @@
+import t from"react";import o from"styled-components";import i from"../../theme.js";const d=o.div`
+  position: relative;
+  height: 60vh;
+  max-height: 600px;
+  background-color: ${i.colors.primary.main};
+  background-size: cover;
+`,m=o.div`
+  position: relative;
+  display: flex;
+  padding: 50px;
+  z-index: 1;
+`,p=o.iframe`
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+`,u=o.img`
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+  object-fit: cover;
+  background-color: ${i.colors.primary.main};
+`;function l(a){const{imageProps:e,containerStyle:n,videoProps:r,children:c}=a,s={objectPosition:`${(e==null?void 0:e.x)?e.x:"50%"} ${(e==null?void 0:e.y)?e.y:"50%"}`};return t.createElement(d,{style:n},r?t.createElement(p,{"data-testid":"hero-video",title:"video-frame",src:r.src,width:"100%",height:"100%",frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0}):t.createElement(t.Fragment,null,t.createElement(u,{src:e==null?void 0:e.src,alt:"Hero background",style:s}),t.createElement(m,null,c)))}export{l as Hero,l as default};

package/esm/components/Icon/index.js

@@ -0,0 +1,32 @@
+import e,{useState as y}from"react";import o from"styled-components";import{Caption as f}from"../../typography/BodyText/index.js";import{Title as g}from"../../typography/Heading/index.js";import c from"../../theme.js";import{Snackbar as x}from"../Snackbar/index.js";import"../../shared/media-queries.js";import"../Icons/CheckCircle.js";import"../Icons/Close.js";import"../Icons/ErrorCircle.js";import"../Icons/InfoCircle.js";import"react-transition-group";const k=o.div`
+  margin: 0 auto;
+  max-width: 700px;
+`,h=o(g)`
+  margin: 0.5rem;
+`,w=o.ul`
+  display: flex;
+  list-style: none;
+  flex-wrap: wrap;
+  padding: 0;
+`,b=o.li`
+  background: ${({background:r})=>r};
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  width: calc(25% - 2px - 1.5rem);
+  padding: 0 0.25rem;
+  border: 1px solid ${c.colors.gray.dark5};
+  border-radius: 3px;
+  margin: 0.5rem;
+  cursor: pointer;
+`,C=o(f)`
+  overflow-wrap: break-word;
+  word-wrap: break-word;
+  word-break: break-word;
+  hyphens: auto;
+  text-align: center;
+`,j=o.span`
+  font-size: ${({size:r})=>r};
+  color: ${({color:r})=>r};
+`,E=({background:r=c.colors.background.light,color:l=c.colors.text.dark,icons:p,size:m="2rem"})=>{const[a,s]=y({isOpen:!1,message:"",type:"info",color:"neutral"}),d=async t=>{const i=`import { ${t} } from 'kvdbil-components';`;if(!!navigator.clipboard)try{await navigator.clipboard.writeText(i),s(n=>({...n,isOpen:!0,message:`copied import for ${t}`,type:"success",color:"success"}))}catch(n){s(u=>({...u,isOpen:!0,message:`Could not copy text: ${n}`,type:"error",color:"error"}))}};return e.createElement(e.Fragment,null,e.createElement(k,null,e.createElement(h,{as:"h2"},"Click to copy import declaration for icon"),e.createElement(w,null,p.map(([t,i],n)=>e.createElement(b,{key:n,background:r,onClick:()=>{d(t)}},e.createElement(C,null,t),e.createElement(j,{size:m,color:l},e.createElement(i,null)))))),e.createElement(x,{message:a.message,isOpen:a.isOpen,type:a.type,color:a.color,onClose:()=>s(t=>({...t,isOpen:!1}))}))};export{E as default};

package/esm/components/IconButton.js

@@ -0,0 +1,80 @@
+import n from"react";import a,{css as m}from"styled-components";import i from"../theme.js";const r=m`
+  background-color: transparent;
+`,l="400ms",b="1500ms",f="750ms",g=a.div`
+  cursor: ${o=>o.isDisabled?"default":"pointer"};
+  outline: none;
+
+  display: inline-block;
+  position: relative;
+
+  .button-background {
+    :focus {
+      outline: none;
+    }
+  }
+
+  :hover {
+    .button-background {
+      transition: background-color ${l};
+      background-color: ${o=>o.isActive?i.colors[o.color].main:"rgb(136, 136, 136)"};
+
+      opacity: 0.06;
+      ${o=>o.isDisabled&&r};
+    }
+  }
+
+  :focus {
+    .button-background {
+      transition: background-color ${l};
+      animation: FocusRipple ${b} 0ms infinite alternate-reverse;
+      background-color: ${o=>o.isActive?i.colors[o.color].main:"rgba(136, 136, 136)"};
+
+      opacity: 0.12;
+      ${o=>o.isDisabled&&r};
+    }
+  }
+
+  :active {
+    .button-background {
+      animation: ActiveRipple ${f};
+      background-color: ${o=>o.isActive?i.colors[o.color].main:"rgb(136, 136, 136)"};
+
+      opacity: 0.24;
+      ${o=>o.isDisabled&&r};
+    }
+  }
+
+  @keyframes ActiveRipple {
+    0% {
+      clip-path: circle(50%);
+    }
+
+    25% {
+      clip-path: circle(46%);
+    }
+
+    100% {
+      clip-path: circle(50%);
+    }
+  }
+
+  @keyframes FocusRipple {
+    0% {
+      clip-path: circle(46%);
+    }
+
+    100% {
+      clip-path: circle(50%);
+    }
+  }
+`,k=a.div`
+  top: 0;
+  left: 0;
+
+  height: calc(100% + 2rem);
+  width: calc(100% + 2rem);
+  transform: translate(-1rem, -1rem);
+
+  position: absolute;
+  border-radius: 10rem;
+`,h=({children:o,isActive:s,isDisabled:c,onClick:e,color:p})=>{const u=t=>{t.key==="Enter"&&!c&&typeof e=="function"&&(t.persist(),e(t))},d=t=>{t.stopPropagation(),t.preventDefault(),t.persist(),!c&&typeof e=="function"&&e(t)};return n.createElement(g,{color:p,isActive:s,isDisabled:c,onClick:d,onKeyDown:u,tabIndex:c?void 0:1},n.createElement(k,{className:"button-background"}),o)};export{h as default};

package/esm/components/Icons/Arrow.js

@@ -0,0 +1 @@
+import e from"react";const a=({title:t,...r})=>e.createElement("svg",{...r},t&&e.createElement("title",null,t),e.createElement("symbol",{id:"icon-arrow",viewBox:"0 0 22 22"},e.createElement("path",{d:"M1.29412 9.70588L10.7843 19.1961C10.9034 19.3152 11.0966 19.3152 11.2157 19.1961L20.7059 9.70588L22 11L12.5098 20.4902C11.676 21.324 10.324 21.324 9.4902 20.4902L0 11L1.29412 9.70588Z"})),e.createElement("use",{xlinkHref:"#icon-arrow"}));export{a as default};

package/esm/components/Icons/CheckCircle.js

@@ -0,0 +1 @@
+import e from"react";const t=({title:C="CheckCircle",...c})=>e.createElement("svg",{...c},C&&e.createElement("title",null,C),e.createElement("symbol",{id:"icon-checkCircle",viewBox:"0 0 24 24"},e.createElement("path",{d:"M12.5 23.0012C6.42487 23.0012 1.5 18.0764 1.5 12.0012C1.5 5.92609 6.42487 1.00122 12.5 1.00122C18.5751 1.00122 23.5 5.92609 23.5 12.0012C23.5 18.0764 18.5751 23.0012 12.5 23.0012ZM12.5 21.1679C17.5626 21.1679 21.6667 17.0638 21.6667 12.0012C21.6667 6.93861 17.5626 2.83455 12.5 2.83455C7.43739 2.83455 3.33333 6.93861 3.33333 12.0012C3.33333 17.0638 7.43739 21.1679 12.5 21.1679ZM9.10748 13.2429C9.33504 13.5121 9.55429 13.7564 9.76125 13.9695C10.1479 14.3676 10.4817 14.6294 10.6107 14.7179C10.6392 14.7003 10.6714 14.6794 10.7067 14.6551C10.9006 14.522 11.1553 14.3144 11.4591 14.0413C12.0292 13.5287 12.7476 12.8084 13.5766 11.9265C13.7427 11.7497 13.9125 11.5673 14.0856 11.3797C14.819 10.5847 15.5796 9.73162 16.3227 8.87836C16.5829 8.5796 16.8222 8.30225 17.0352 8.0535C17.1626 7.90465 17.2527 7.79871 17.2999 7.74287L18.7001 8.92624C18.6505 8.98498 18.5579 9.09389 18.4278 9.24582C18.2116 9.49837 17.9689 9.77961 17.7052 10.0824C16.9514 10.9479 16.1796 11.8136 15.4331 12.6228C15.2562 12.8145 15.0826 13.0011 14.9124 13.1821C12.7154 15.5196 11.5309 16.5846 10.6667 16.5846C9.95327 16.5846 9.28235 16.1078 8.44613 15.2468C8.20742 15.0011 7.96047 14.7259 7.70721 14.4262C7.35453 14.0089 7.00646 13.5644 6.67696 13.1203C6.47905 12.8535 6.33026 12.6446 6.24558 12.5219L7.75443 11.4805C7.82792 11.587 7.96481 11.7792 8.14939 12.028C8.4574 12.4432 8.78234 12.8581 9.10748 13.2429Z"})),e.createElement("use",{xlinkHref:"#icon-checkCircle"}));export{t as default};

package/esm/components/Icons/CheckIcon.js

@@ -0,0 +1 @@
+import e from"react";const t=({className:C="icon__svg"})=>e.createElement("svg",{className:C},e.createElement("title",null,"Check"),e.createElement("symbol",{id:"icon-check",viewBox:"0 0 20 16"},e.createElement("path",{d:"M5.64559 11.2678C5.31325 10.8822 4.96116 10.4401 4.59575 9.95286C4.07361 9.25661 3.55182 8.50577 3.0572 7.75441C2.76079 7.30414 2.54098 6.95638 2.42297 6.7637L0 8.6482C0.135982 8.87023 0.3749 9.2482 0.692726 9.73101C1.22184 10.5348 1.78078 11.3391 2.34713 12.0943C2.75382 12.6366 3.15039 13.1345 3.53372 13.5793C4.87655 15.1373 5.95393 16 7.09955 16C8.48728 16 10.3894 14.0728 13.9175 9.84286C14.1908 9.51527 14.4697 9.17762 14.7536 8.83074C15.9524 7.36638 17.1918 5.79987 18.4023 4.23366C18.8257 3.6857 19.2155 3.17676 19.5627 2.71975C19.7716 2.44481 19.9203 2.24773 20 2.14142L17.7514 0C17.6756 0.101045 17.531 0.292744 17.3263 0.562104C16.9843 1.01226 16.6 1.51416 16.1821 2.05479C14.9888 3.59885 13.7675 5.1426 12.5898 6.58116C12.3118 6.92065 12.0392 7.25078 11.7723 7.57068C10.4411 9.16669 9.28751 10.4701 8.37209 11.3976C7.8842 11.892 7.47522 12.2676 7.16387 12.5084C7.10708 12.5523 7.05542 12.5903 7.00971 12.6221C6.8025 12.4619 6.2665 11.9882 5.64559 11.2678Z"})),e.createElement("use",{xlinkHref:"#icon-check"}));export{t as default};

package/esm/components/Icons/Close.js

@@ -0,0 +1 @@
+import e from"react";const c=({title:t="Close",...l})=>e.createElement("svg",{...l},t&&e.createElement("title",null,t),e.createElement("symbol",{id:"icon-close",viewBox:"0 0 24 24"},e.createElement("path",{d:"M12.0001 10.5859L21.7629 0.823223L23.1771 2.23744L13.4144 12.0002L23.1771 21.7629L21.7629 23.1771L12.0001 13.4144L2.23744 23.1771L0.823223 21.7629L10.5859 12.0002L0.823223 2.23745L2.23744 0.823234L12.0001 10.5859Z"})),e.createElement("use",{xlinkHref:"#icon-close"}));export{c as default};

package/esm/components/Icons/ErrorCircle.js

@@ -0,0 +1 @@
+import e from"react";const l=({title:r,...t})=>e.createElement("svg",{...t},r&&e.createElement("title",null,r),e.createElement("symbol",{id:"icon-errorCircle",viewBox:"0 0 24 24"},e.createElement("path",{d:"M1.5 12.0012C1.5 18.0764 6.42487 23.0012 12.5 23.0012C18.5751 23.0012 23.5 18.0764 23.5 12.0012C23.5 5.92609 18.5751 1.00122 12.5 1.00122C6.42487 1.00122 1.5 5.92609 1.5 12.0012ZM21.6667 12.0012C21.6667 17.0638 17.5626 21.1679 12.5 21.1679C7.43739 21.1679 3.33333 17.0638 3.33333 12.0012C3.33333 6.93861 7.43739 2.83455 12.5 2.83455C17.5626 2.83455 21.6667 6.93861 21.6667 12.0012ZM13.4167 13.8346V6.50122H11.5833V13.8346H13.4167ZM13.4167 15.6679V17.5012H11.5833V15.6679H13.4167Z"})),e.createElement("use",{xlinkHref:"#icon-errorCircle"}));export{l as default};

package/esm/components/Icons/InfoCircle.js

@@ -0,0 +1 @@
+import e from"react";const c=({title:t,...l})=>e.createElement("svg",{...l},t&&e.createElement("title",null,t),e.createElement("symbol",{id:"icon-infoCircle",viewBox:"0 0 24 24"},e.createElement("path",{d:"M1.5 12.0012C1.5 18.0764 6.42487 23.0012 12.5 23.0012C18.5751 23.0012 23.5 18.0764 23.5 12.0012C23.5 5.92609 18.5751 1.00122 12.5 1.00122C6.42487 1.00122 1.5 5.92609 1.5 12.0012ZM21.6667 12.0012C21.6667 17.0638 17.5626 21.1679 12.5 21.1679C7.43739 21.1679 3.33333 17.0638 3.33333 12.0012C3.33333 6.93861 7.43739 2.83455 12.5 2.83455C17.5626 2.83455 21.6667 6.93861 21.6667 12.0012ZM13.4167 10.1679V17.5012H11.5833V10.1679H13.4167ZM13.4167 8.33455V6.50122H11.5833V8.33455H13.4167Z"})),e.createElement("use",{xlinkHref:"#icon-infoCircle"}));export{c as default};

package/esm/components/InlineStepper/Step.js

@@ -0,0 +1,56 @@
+import e from"react";import o from"styled-components";import r from"../../theme.js";import{CaptionLink as c}from"../../typography/BodyText/index.js";import m from"./StepCircle.js";import"../Icons/CheckIcon.js";const s=o.div`
+  background-color: ${r.colors.gray.dark3};
+  height: 1px;
+  right: 0;
+  left: calc(50% + 20px);
+  top: 1.25rem;
+  position: absolute;
+  width: calc(100% - 40px);
+`,x=o.div`
+  font-family: ${({theme:t})=>t.typography.fontBaseFamily};
+  display: flex;
+  position: relative;
+  padding: 0 0.5rem;
+  flex: 1;
+  align-items: center;
+  flex-direction: column;
+
+  &:last-child {
+    padding-bottom: 0;
+    ${s} {
+      display: none;
+    }
+  }
+`,u=o(c)`
+  width: 100%;
+  margin: 0.5rem 0 0;
+  line-height: 1.2;
+  text-align: center;
+  color: ${r.colors.text.dark};
+`,d=o.div`
+  margin: 0 auto;
+  width: 1px;
+  height: 100%;
+  background-color: ${r.colors.gray.dark3};
+`,v=o.div`
+  margin-right: 0.75rem;
+`,E=o.div`
+  font-family: ${({theme:t})=>t.typography.fontBaseFamily};
+  display: flex;
+  padding-bottom: 1rem;
+
+  &:last-child {
+    ${d} {
+      display: none;
+    }
+  }
+`,k=o(c)`
+  margin: 0;
+  width: 100%;
+  line-height: 1.2;
+  text-align: left;
+  color: ${r.colors.text.dark};
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+`,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:n,backgroundColor:y,...a})=>{const l=p({active:i,disabled:h,completed:f});return g==="horizontal"?e.createElement(x,{...a},e.createElement(m,{state:l,step:t,backgroundColor:y}),e.createElement(s,null),e.createElement(u,{as:"div"},n)):e.createElement(E,{...a},e.createElement(v,null,e.createElement(m,{state:l,step:t}),e.createElement(d,null)),e.createElement(k,{as:"div"},n))};export{$ as default,p as getStepState};