@kvdbil/components 17.12.6 → 17.12.7

package/cjs/ColorCard.js

@@ -22,4 +22,4 @@
   padding: 0;
   display: flex;
   flex-direction: column;
-`,c=r=>Object.entries(r).map((([r,l])=>"string"==typeof l?e.jsxs(n,{hex:l,children:[r," (",l,")"]},l):e.jsxs(e.Fragment,{children:[e.jsx(o,{children:r}),e.jsx(a,{children:c(l)})]})));exports.default=({colorName:r,variants:l})=>e.jsxs(d,{children:[e.jsx(o,{children:r}),e.jsx(u,{children:c(l)})]});
+`,c=r=>Object.entries(r).map(([r,l])=>"string"==typeof l?e.jsxs(n,{hex:l,children:[r," (",l,")"]},l):e.jsxs(e.Fragment,{children:[e.jsx(o,{children:r}),e.jsx(a,{children:c(l)})]}));exports.default=({colorName:r,variants:l})=>e.jsxs(d,{children:[e.jsx(o,{children:r}),e.jsx(u,{children:c(l)})]});

package/cjs/components/Accordion/index.js

@@ -33,4 +33,4 @@
     margin-bottom: 0;
     padding-bottom: 0rem;
   }
-`,m=({items:t,...l})=>{const[n,m]=r.useState({}),{id:h}=o.useNameAndId("accordion"),f=e=>{m((r=>({...r,[e]:!r[e]})))},g=e=>()=>{f(e)},j=e=>r=>{("Enter"===r.key||" "===r.key)&&(r.preventDefault(),f(e))};return e.jsx(a,{...l,children:e.jsx(c,{className:"accordionList",children:t.map(((r,t)=>{const o=!!n[t],l=`${h}-${t}-header`,a=`${h}-${t}-content`;return e.jsxs(p,{isOpen:o,className:"accordionItem",children:[e.jsxs(u,{id:l,onClick:g(t),onKeyDown:j(t),className:"accordionItemTitle",role:"button",tabIndex:0,"aria-expanded":o,"aria-controls":a,children:[e.jsx(d.BodyLink,{as:"span",children:r.title}),e.jsx(s.default,{isExpanded:o})]}),e.jsx(i.Collapse,{isOpened:o,children:e.jsx(x,{id:a,"aria-labelledby":l,role:"region",...o?null:{inert:""},children:"string"==typeof r.text?e.jsx(d.BodyText,{children:r.text}):r.text})},t)]},r.title)}))})})};exports.Accordion=m,exports.default=m;
+`,m=({items:t,...l})=>{const[n,m]=r.useState({}),{id:h}=o.useNameAndId("accordion"),f=e=>{m(r=>({...r,[e]:!r[e]}))},g=e=>()=>{f(e)},j=e=>r=>{("Enter"===r.key||" "===r.key)&&(r.preventDefault(),f(e))};return e.jsx(a,{...l,children:e.jsx(c,{className:"accordionList",children:t.map((r,t)=>{const o=!!n[t],l=`${h}-${t}-header`,a=`${h}-${t}-content`;return e.jsxs(p,{isOpen:o,className:"accordionItem",children:[e.jsxs(u,{id:l,onClick:g(t),onKeyDown:j(t),className:"accordionItemTitle",role:"button",tabIndex:0,"aria-expanded":o,"aria-controls":a,children:[e.jsx(d.BodyLink,{as:"span",children:r.title}),e.jsx(s.default,{isExpanded:o})]}),e.jsx(i.Collapse,{isOpened:o,children:e.jsx(x,{id:a,"aria-labelledby":l,role:"region",...o?null:{inert:""},children:"string"==typeof r.text?e.jsx(d.BodyText,{children:r.text}):r.text})},t)]},r.title)})})})};exports.Accordion=m,exports.default=m;

package/cjs/components/Breadcrumbs/index.js

@@ -4,4 +4,4 @@
   padding: 0;
   white-space: nowrap;
   overflow: hidden;
-`;exports.default=({links:e,separator:s=r.jsx(t.default,{}),onlyLastTruncated:n=!1})=>{const{id:u}=d.useNameAndId("breadcrumb");return r.jsx("nav",{"aria-label":"Breadcrumb",id:u,children:r.jsx(i,{children:e.map(((t,d)=>r.jsx(a.default,{link:t,separator:s,isLast:d===e.length-1,onlyLastTruncated:n},`${u}-${d}`)))})})};
+`;exports.default=({links:e,separator:s=r.jsx(t.default,{}),onlyLastTruncated:n=!1})=>{const{id:u}=d.useNameAndId("breadcrumb");return r.jsx("nav",{"aria-label":"Breadcrumb",id:u,children:r.jsx(i,{children:e.map((t,d)=>r.jsx(a.default,{link:t,separator:s,isLast:d===e.length-1,onlyLastTruncated:n},`${u}-${d}`))})})};

package/cjs/components/Button/index.js

@@ -43,4 +43,4 @@
   position: absolute;
 `,g=d.default.span`
   opacity: ${({$isLoading:e})=>e?0:1};
-`,m={small:1,regular:1.25,large:1.5},y=i.forwardRef((({size:i="regular",color:r,colorShade:s="mainAlt",variant:o="solid",fullWidth:l=!1,isDisabled:a=!1,isLoading:d=!1,children:c,sufixIcon:$,prefixIcon:y,minWidth:x,as:h="button",noRadius:b=!1,...z},S)=>{return e.jsx(u,{...z,as:h,$minWidth:x,$color:r,$colorShade:s,disabled:a||d,$fullWidth:l,theme:t.default,$variant:o,$size:i,$isLoading:d,ref:S,$isIcon:!(!y&&!$),$noRadius:b,"aria-disabled":"button"===h?a||d:void 0,"aria-busy":"button"===h?d:void 0,children:e.jsxs(e.Fragment,{children:[y&&e.jsx(p,{size:i,type:"prefix",isLoading:d,children:y}),(j=c,v=d,"string"==typeof j||"number"==typeof j?e.jsx(g,{$isLoading:v,children:j}):n.default.isValidElement(j)?n.default.cloneElement(j,{style:{...j.props.style,opacity:v?0:1}}):j),$&&e.jsx(p,{size:i,type:"sufix",isLoading:d,children:$}),d&&e.jsx(f,{customColor:t.default.colors.grayscaleToned.light1,size:m[i]})]})});var j,v}));y.displayName="Button",exports.Button=y,exports.default=y;
+`,m={small:1,regular:1.25,large:1.5},y=i.forwardRef(({size:i="regular",color:r,colorShade:s="mainAlt",variant:o="solid",fullWidth:l=!1,isDisabled:a=!1,isLoading:d=!1,children:c,sufixIcon:$,prefixIcon:y,minWidth:x,as:h="button",noRadius:b=!1,...z},S)=>{return e.jsx(u,{...z,as:h,$minWidth:x,$color:r,$colorShade:s,disabled:a||d,$fullWidth:l,theme:t.default,$variant:o,$size:i,$isLoading:d,ref:S,$isIcon:!(!y&&!$),$noRadius:b,"aria-disabled":"button"===h?a||d:void 0,"aria-busy":"button"===h?d:void 0,children:e.jsxs(e.Fragment,{children:[y&&e.jsx(p,{size:i,type:"prefix",isLoading:d,children:y}),(j=c,v=d,"string"==typeof j||"number"==typeof j?e.jsx(g,{$isLoading:v,children:j}):n.default.isValidElement(j)?n.default.cloneElement(j,{style:{...j.props.style,opacity:v?0:1}}):j),$&&e.jsx(p,{size:i,type:"sufix",isLoading:d,children:$}),d&&e.jsx(f,{customColor:t.default.colors.grayscaleToned.light1,size:m[i]})]})});var j,v});y.displayName="Button",exports.Button=y,exports.default=y;

package/cjs/components/DayPicker/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),o=require("../../theme.js"),l=require("react-day-picker"),c=require("date-fns/locale"),a=require("date-fns"),u=require("./style.js");var n,s=(n=t)&&n.__esModule?n:{default:n},i=function(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,o.get?o:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}(c);const d=s.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),o=require("../../theme.js"),l=require("react-day-picker"),c=require("date-fns/locale"),a=require("date-fns"),u=require("./style.js");var n,s=(n=t)&&n.__esModule?n:{default:n},i=function(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach(function(t){if("default"!==t){var o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,o.get?o:{enumerable:!0,get:function(){return e[t]}})}}),r.default=e,Object.freeze(r)}(c);const d=s.default.div`
   ${u.default}
 
   .rdp-chevron {

package/cjs/components/EditRow/index.js

@@ -31,4 +31,4 @@
   flex-wrap: wrap;
 `,q=d.default(s.Chip)`
   margin: 0.5rem;
-`;exports.default=({value:r,label:i,onChange:l,onEdit:s,options:o=[],inputProps:a={},isClearable:d=!1,isEditionDisabled:v=!1,editText:b,saveText:C,cancelText:T,noValueText:B,formatterFunc:w,isSingleSelect:S,color:k="secondary",isInitialEditing:E})=>{const[F,D]=t.useState(r),[_,I]=t.useState(r),[L,M]=t.useState(!!E),P="string"==typeof F,$=w&&P?w?.(F):F,A=P?$:F.join(", "),N=F.length>0;t.useEffect((()=>s?.(L)),[s,L]);const O=()=>{L?D(_):I(F),M((e=>!e))};return e.jsxs(u,{children:[!L&&e.jsxs(e.Fragment,{children:[e.jsx(m,{children:i}),N&&e.jsx(p,{children:A}),!N&&e.jsx(g,{children:B}),e.jsx(n.Button,{variant:"flat",color:k,onClick:O,isDisabled:v,children:b})]}),L&&e.jsxs(c,{onSubmit:e=>{e.preventDefault(),l?.(F),M(!1)},children:[e.jsx(m,{children:i}),P&&e.jsx(x,{...a,autoFocus:!0,value:F,label:i,onChange:e=>D(e.target.value)}),!P&&e.jsx(y,{children:o.map((t=>e.jsx(q,{color:k,onClick:e=>{e.preventDefault(),(e=>{if("object"!=typeof F)throw new Error("Cannot toggle chip on other than array");if(S)return F.includes(e)&&d?void D([]):void D([e]);if(F.includes(e)){const t=F.filter((t=>t!==e));D(t)}else D((t=>[...t,e]))})(t)},variant:F.includes(t)?"solid":"outline",children:t},t)))}),e.jsxs(f,{children:[e.jsx(j,{type:"button",variant:"flat",color:"neutral",onClick:O,children:T}),e.jsx(h,{type:"submit",color:k,children:C})]})]})]})};
+`;exports.default=({value:r,label:i,onChange:l,onEdit:s,options:o=[],inputProps:a={},isClearable:d=!1,isEditionDisabled:v=!1,editText:b,saveText:C,cancelText:T,noValueText:B,formatterFunc:w,isSingleSelect:S,color:k="secondary",isInitialEditing:E})=>{const[F,D]=t.useState(r),[_,I]=t.useState(r),[L,M]=t.useState(!!E),P="string"==typeof F,$=w&&P?w?.(F):F,A=P?$:F.join(", "),N=F.length>0;t.useEffect(()=>s?.(L),[s,L]);const O=()=>{L?D(_):I(F),M(e=>!e)};return e.jsxs(u,{children:[!L&&e.jsxs(e.Fragment,{children:[e.jsx(m,{children:i}),N&&e.jsx(p,{children:A}),!N&&e.jsx(g,{children:B}),e.jsx(n.Button,{variant:"flat",color:k,onClick:O,isDisabled:v,children:b})]}),L&&e.jsxs(c,{onSubmit:e=>{e.preventDefault(),l?.(F),M(!1)},children:[e.jsx(m,{children:i}),P&&e.jsx(x,{...a,autoFocus:!0,value:F,label:i,onChange:e=>D(e.target.value)}),!P&&e.jsx(y,{children:o.map(t=>e.jsx(q,{color:k,onClick:e=>{e.preventDefault(),(e=>{if("object"!=typeof F)throw new Error("Cannot toggle chip on other than array");if(S)return F.includes(e)&&d?void D([]):void D([e]);if(F.includes(e)){const t=F.filter(t=>t!==e);return void D(t)}D(t=>[...t,e])})(t)},variant:F.includes(t)?"solid":"outline",children:t},t))}),e.jsxs(f,{children:[e.jsx(j,{type:"button",variant:"flat",color:"neutral",onClick:O,children:T}),e.jsx(h,{type:"submit",color:k,children:C})]})]})]})};

package/cjs/components/Flex/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("styled-components"),i=require("../../shared/media-queries.js");var s,n=(s=r)&&s.__esModule?s:{default:s};const t="center",a=(e,r)=>"gap"!==r&&"row-gap"!==r||"number"!=typeof e?e:`${e}rem`,o=n.default.div((({$direction:e,$justify:s,$align:n,$gap:t,$rowGap:o,$wrap:$,$basis:l,$grow:p,$shrink:u,$inlineChildren:c})=>r.css`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("styled-components"),i=require("../../shared/media-queries.js");var s,n=(s=r)&&s.__esModule?s:{default:s};const t="center",a=(e,r)=>"gap"!==r&&"row-gap"!==r||"number"!=typeof e?e:`${e}rem`,o=n.default.div(({$direction:e,$justify:s,$align:n,$gap:t,$rowGap:o,$wrap:$,$basis:l,$grow:p,$shrink:u,$inlineChildren:c})=>r.css`
   display: flex;
 
   ${e&&["column","column-reverse"].includes(String(e))&&!c&&r.css`
@@ -7,13 +7,13 @@
     }
   `}
 
-  ${[[e,"flex-direction"],[s,"justify-content"],[n,"align-items"],[t,"gap"],[o,"row-gap"],[o,"row-gap"],[$,"flex-wrap"],[l,"flex-basis"],[p,"flex-grow"],[u,"flex-shrink"]].map((([e,s])=>{if("string"==typeof e||"number"==typeof e)return r.css`
+  ${[[e,"flex-direction"],[s,"justify-content"],[n,"align-items"],[t,"gap"],[o,"row-gap"],[o,"row-gap"],[$,"flex-wrap"],[l,"flex-basis"],[p,"flex-grow"],[u,"flex-shrink"]].map(([e,s])=>{if("string"==typeof e||"number"==typeof e)return r.css`
         ${s}: ${a(e,s)};
       `;if("object"==typeof e){const n=[],{initial:t,...o}=e;return t&&n.push(r.css`
           ${s}: ${a(t,s)};
-        `),Object.entries(o).forEach((([e,t])=>{n.push(r.css`
+        `),Object.entries(o).forEach(([e,t])=>{n.push(r.css`
           ${i.mq(e)} {
             ${s}: ${a(t,s)};
           }
-        `)})),n}return""}))}
-`));exports.default=({direction:r,justify:i,align:s,gap:n,rowGap:a,wrap:$,basis:l,grow:p,shrink:u,inlineChildren:c=!1,...f})=>e.jsx(o,{$direction:r??"row",$justify:i??t,$align:s??t,$gap:n??"1rem",$rowGap:a,$wrap:$,$basis:l,$grow:p,$shrink:u,$inlineChildren:c,...f});
+        `)}),n}return""})}
+`);exports.default=({direction:r,justify:i,align:s,gap:n,rowGap:a,wrap:$,basis:l,grow:p,shrink:u,inlineChildren:c=!1,...f})=>e.jsx(o,{$direction:r??"row",$justify:i??t,$align:s??t,$gap:n??"1rem",$rowGap:a,$wrap:$,$basis:l,$grow:p,$shrink:u,$inlineChildren:c,...f});

package/cjs/components/FocusTrap.js

@@ -1,4 +1,4 @@
 "use strict";var e,t=require("react/jsx-runtime"),r=require("react"),n=require("styled-components");const u=((e=n)&&e.__esModule?e:{default:e}).default.div`
   width: 100%;
   height: 100%;
-`;exports.FocusTrap=({children:e,pause:n=!1,autoFocusOnOpen:s="firstElem",restoreFocusOnClose:c=!0})=>{const o=r.useRef(null),i=r.useRef([]),l=r.useRef(null),d=r.useRef(null),f=r.useRef(!1);return r.useEffect((()=>{if(n)return void(c&&f.current&&d.current&&d.current.focus());const e=o.current;if(!e)return;c&&(d.current=document.activeElement);const t=["a[href]","button:not([disabled])","textarea:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])",'[tabindex]:not([tabindex="-1"])'],r=()=>{i.current=Array.from(e.querySelectorAll(t.join(",")))},u=e=>{if("Tab"!==e.key)return;const t=i.current;if(0===t.length)return void e.preventDefault();const r=t[0],n=t[t.length-1],u=t.findIndex((e=>e===document.activeElement));e.preventDefault(),e.shiftKey?u<=0?n.focus():t[u-1].focus():-1===u||u===t.length-1?r.focus():t[u+1].focus()};return r(),"firstElem"===s&&i.current.length>0&&i.current[0].focus(),"firstInput"===s&&i.current.find((e=>"INPUT"===e.tagName))?.focus(),e.addEventListener("keydown",u),l.current=new MutationObserver(r),l.current.observe(e,{childList:!0,subtree:!0}),f.current=!0,()=>{e.removeEventListener("keydown",u),l.current?.disconnect(),l.current=null}}),[n,s,c]),t.jsx(u,{ref:o,children:e})};
+`;exports.FocusTrap=({children:e,pause:n=!1,autoFocusOnOpen:s="firstElem",restoreFocusOnClose:c=!0})=>{const o=r.useRef(null),i=r.useRef([]),l=r.useRef(null),d=r.useRef(null),f=r.useRef(!1);return r.useEffect(()=>{if(n)return void(c&&f.current&&d.current&&d.current.focus());const e=o.current;if(!e)return;c&&(d.current=document.activeElement);const t=["a[href]","button:not([disabled])","textarea:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])",'[tabindex]:not([tabindex="-1"])'],r=()=>{i.current=Array.from(e.querySelectorAll(t.join(",")))},u=e=>{if("Tab"!==e.key)return;const t=i.current;if(0===t.length)return void e.preventDefault();const r=t[0],n=t[t.length-1],u=t.findIndex(e=>e===document.activeElement);e.preventDefault(),e.shiftKey?u<=0?n.focus():t[u-1].focus():-1===u||u===t.length-1?r.focus():t[u+1].focus()};return r(),"firstElem"===s&&i.current.length>0&&i.current[0].focus(),"firstInput"===s&&i.current.find(e=>"INPUT"===e.tagName)?.focus(),e.addEventListener("keydown",u),l.current=new MutationObserver(r),l.current.observe(e,{childList:!0,subtree:!0}),f.current=!0,()=>{e.removeEventListener("keydown",u),l.current?.disconnect(),l.current=null}},[n,s,c]),t.jsx(u,{ref:o,children:e})};

package/cjs/components/Icon/index.js

@@ -29,4 +29,4 @@
 `,x=c.default.span`
   font-size: ${({size:e})=>e};
   color: ${({color:e})=>e};
-`;exports.default=({background:o=t.default.colors.background.light,color:s=t.default.colors.text.dark,icons:i,size:a="2rem"})=>{const[c,g]=r.useState({isOpen:!1,message:"",type:"info",color:"neutral"});return e.jsxs(e.Fragment,{children:[e.jsxs(l,{children:[e.jsx(d,{as:"h2",children:"Click to copy import declaration for icon"}),e.jsx(u,{children:i.map((([r,i],t)=>e.jsxs(p,{background:o,onClick:()=>{(async e=>{const r=`import { ${e} } from 'kvdbil-components';`;if(navigator.clipboard)try{await navigator.clipboard.writeText(r),g((r=>({...r,isOpen:!0,message:`copied import for ${e}`,type:"success",color:"success"})))}catch(e){g((r=>({...r,isOpen:!0,message:`Could not copy text: ${e}`,type:"error",color:"error"})))}})(r)},children:[e.jsx(m,{children:r}),e.jsx(x,{size:a,color:s,children:e.jsx(i,{})})]},t)))})]}),e.jsx(n.Snackbar,{message:c.message,isOpen:c.isOpen,type:c.type,color:c.color,onClose:()=>g((e=>({...e,isOpen:!1})))})]})};
+`;exports.default=({background:o=t.default.colors.background.light,color:s=t.default.colors.text.dark,icons:i,size:a="2rem"})=>{const[c,g]=r.useState({isOpen:!1,message:"",type:"info",color:"neutral"});return e.jsxs(e.Fragment,{children:[e.jsxs(l,{children:[e.jsx(d,{as:"h2",children:"Click to copy import declaration for icon"}),e.jsx(u,{children:i.map(([r,i],t)=>e.jsxs(p,{background:o,onClick:()=>{(async e=>{const r=`import { ${e} } from 'kvdbil-components';`;if(navigator.clipboard)try{await navigator.clipboard.writeText(r),g(r=>({...r,isOpen:!0,message:`copied import for ${e}`,type:"success",color:"success"}))}catch(e){g(r=>({...r,isOpen:!0,message:`Could not copy text: ${e}`,type:"error",color:"error"}))}})(r)},children:[e.jsx(m,{children:r}),e.jsx(x,{size:a,color:s,children:e.jsx(i,{})})]},t))})]}),e.jsx(n.Snackbar,{message:c.message,isOpen:c.isOpen,type:c.type,color:c.color,onClose:()=>g(e=>({...e,isOpen:!1}))})]})};

package/cjs/components/Message/index.js

@@ -38,4 +38,4 @@
   svg {
     font-size: 2.5rem;
   }
-`;exports.default=({children:t,type:n,withIcon:s=!1,isDeletable:i=!1,fullWidth:l=!1,inverted:c=!1,textCenter:a=!1,...u})=>{const d=r.useRef(null),[y,b]=r.useState(!1);return e.jsx(g,{isDeleted:y,children:e.jsxs(x,{messageType:n,fullWidth:l,inverted:c,textCenter:a,role:"error"===n||"warning"===n?"alert":void 0,"aria-live":"error"===n||"warning"===n?"assertive":"polite",ref:d,...u,children:[e.jsxs(p,{children:[s&&e.jsx(j,{children:f(n)}),e.jsxs(h,{children:["string"==typeof t&&e.jsx(m,{children:t}),"string"!=typeof t&&t]})]}),i&&e.jsx(v,{onClick:e=>{e.stopPropagation(),b(!0),setTimeout((()=>{d.current&&d.current.remove()}),300)},"aria-label":"Close",type:"button",children:e.jsx(o.default,{})})]})})};
+`;exports.default=({children:t,type:n,withIcon:s=!1,isDeletable:i=!1,fullWidth:l=!1,inverted:c=!1,textCenter:a=!1,...u})=>{const d=r.useRef(null),[y,b]=r.useState(!1);return e.jsx(g,{isDeleted:y,children:e.jsxs(x,{messageType:n,fullWidth:l,inverted:c,textCenter:a,role:"error"===n||"warning"===n?"alert":void 0,"aria-live":"error"===n||"warning"===n?"assertive":"polite",ref:d,...u,children:[e.jsxs(p,{children:[s&&e.jsx(j,{children:f(n)}),e.jsxs(h,{children:["string"==typeof t&&e.jsx(m,{children:t}),"string"!=typeof t&&t]})]}),i&&e.jsx(v,{onClick:e=>{e.stopPropagation(),b(!0),setTimeout(()=>{d.current&&d.current.remove()},300)},"aria-label":"Close",type:"button",children:e.jsx(o.default,{})})]})})};

package/cjs/components/Modal/index.js

@@ -78,4 +78,4 @@
   }
 `,h=n.createGlobalStyle`
   ${u}
-`,y=({children:n,isOpen:a,contentStyles:d,withPortal:l=!1,withCloseIcon:u=!0,onClose:y,focusTrapProps:f={},...m})=>{t.useEffect((()=>{const e=e=>{"Escape"===e.key&&a&&y()};return a&&window.addEventListener("keydown",e),()=>{window.removeEventListener("keydown",e)}}),[y,a]);const v=!!(typeof window<"u"&&window.document&&window.document.createElement),j=e.jsx(o.CSSTransition,{in:a,mountOnEnter:!0,unmountOnExit:!0,timeout:400,classNames:"backgroundTransition",children:e.jsxs(e.Fragment,{children:[e.jsx(h,{}),e.jsxs(c,{...m,children:[e.jsx(x,{"data-testid":"background",onClick:y}),e.jsx(s.FocusTrap,{pause:!a,...f,children:e.jsx(p,{children:e.jsxs(b,{style:d,role:"dialog","aria-modal":"true","aria-labelledby":"modal-title",children:[u&&e.jsx(w,{onClick:y,"data-testid":"close",type:"button","aria-label":"Close dialog",children:e.jsx(r.default,{})}),n]})})}),e.jsx(g,{})]})]})});return l&&v?i.createPortal(j,document.body):j};exports.Modal=y,exports.default=y;
+`,y=({children:n,isOpen:a,contentStyles:d,withPortal:l=!1,withCloseIcon:u=!0,onClose:y,focusTrapProps:f={},...m})=>{t.useEffect(()=>{const e=e=>{"Escape"===e.key&&a&&y()};return a&&window.addEventListener("keydown",e),()=>{window.removeEventListener("keydown",e)}},[y,a]);const v=!!(typeof window<"u"&&window.document&&window.document.createElement),j=e.jsx(o.CSSTransition,{in:a,mountOnEnter:!0,unmountOnExit:!0,timeout:400,classNames:"backgroundTransition",children:e.jsxs(e.Fragment,{children:[e.jsx(h,{}),e.jsxs(c,{...m,children:[e.jsx(x,{"data-testid":"background",onClick:y}),e.jsx(s.FocusTrap,{pause:!a,...f,children:e.jsx(p,{children:e.jsxs(b,{style:d,role:"dialog","aria-modal":"true","aria-labelledby":"modal-title",children:[u&&e.jsx(w,{onClick:y,"data-testid":"close",type:"button","aria-label":"Close dialog",children:e.jsx(r.default,{})}),n]})})}),e.jsx(g,{})]})]})});return l&&v?i.createPortal(j,document.body):j};exports.Modal=y,exports.default=y;

package/cjs/components/OffCanvas/index.js

@@ -7,4 +7,4 @@
   overflow-x: hidden;
   overflow-y: auto;
   -webkit-overflow-scrolling: touch;
-`,m=({animationName:r="offCanvasAnimation",animationDuration:l=300,backgroundColor:d,backgroundOverlay:m,children:h,from:$="right",isOpen:g,onClickOutside:x,width:p="375px",withPortal:v,transitionProps:w,focusTrapProps:k={}})=>{const O=e.useRef(null);o.useOutsideClick(O,(()=>x?.())),e.useEffect((()=>{const n=n=>{"Escape"===n.key&&g&&x?.()};return g&&window.addEventListener("keydown",n),()=>{window.removeEventListener("keydown",n)}}),[x,g]),m&&!x&&console.error("Please provide a clickOutside handler when using backgroundOverlay option in OffCanvas component");const b=`${r}--${$}`,j=n.jsxs(n.Fragment,{children:[m&&n.jsx(i.default,{isOpen:g}),n.jsx(n.Fragment,{children:n.jsx(a.CSSTransition,{in:g,className:`${r} ${b}`,classNames:b,...u,...w,children:n.jsx(s.FocusTrap,{pause:!g,...k,children:n.jsx(c,{ref:O,animationName:r,animationDuration:l,backgroundColor:d,from:$,width:p,role:"dialog","aria-modal":"true","aria-label":"Side panel",children:n.jsx(f,{className:`${r}-content`,children:h})})})})})]});return v?t.createPortal(j,document.body):j};exports.OffCanvas=m,exports.default=m;
+`,m=({animationName:r="offCanvasAnimation",animationDuration:l=300,backgroundColor:d,backgroundOverlay:m,children:h,from:$="right",isOpen:g,onClickOutside:x,width:p="375px",withPortal:v,transitionProps:w,focusTrapProps:k={}})=>{const O=e.useRef(null);o.useOutsideClick(O,()=>x?.()),e.useEffect(()=>{const n=n=>{"Escape"===n.key&&g&&x?.()};return g&&window.addEventListener("keydown",n),()=>{window.removeEventListener("keydown",n)}},[x,g]),m&&!x&&console.error("Please provide a clickOutside handler when using backgroundOverlay option in OffCanvas component");const b=`${r}--${$}`,j=n.jsxs(n.Fragment,{children:[m&&n.jsx(i.default,{isOpen:g}),n.jsx(n.Fragment,{children:n.jsx(a.CSSTransition,{in:g,className:`${r} ${b}`,classNames:b,...u,...w,children:n.jsx(s.FocusTrap,{pause:!g,...k,children:n.jsx(c,{ref:O,animationName:r,animationDuration:l,backgroundColor:d,from:$,width:p,role:"dialog","aria-modal":"true","aria-label":"Side panel",children:n.jsx(f,{className:`${r}-content`,children:h})})})})})]});return v?t.createPortal(j,document.body):j};exports.OffCanvas=m,exports.default=m;

package/cjs/components/OffCanvas/useClickOutside.js

@@ -1 +1 @@
-"use strict";var e=require("react");exports.useOutsideClick=(t,r)=>{const n=e.useCallback((e=>{t.current&&!t.current.contains(e.target)&&r()}),[r,t]);e.useEffect((()=>(document.addEventListener("mousedown",n),()=>{document.removeEventListener("mousedown",n)})),[n])};
+"use strict";var e=require("react");exports.useOutsideClick=(t,r)=>{const n=e.useCallback(e=>{t.current&&!t.current.contains(e.target)&&r()},[r,t]);e.useEffect(()=>(document.addEventListener("mousedown",n),()=>{document.removeEventListener("mousedown",n)}),[n])};

package/cjs/components/Select/index.js

@@ -18,7 +18,7 @@
   display: block;
   margin-top: 0.25rem;
   color: ${({hasError:e})=>e?t.default.colors.error.dark:t.default.colors.text.disabled};
-`,x=c.default((r=>e.jsxs("svg",{...r,children:[e.jsx("symbol",{id:"icon-arrow",viewBox:"0 0 19 19",children:e.jsx("path",{d:"M2.03039 7.95496L9.80856 15.7331C9.90619 15.8308 10.0645 15.8308 10.1621 15.7331L17.9403 7.95496L19.0009 9.01562L11.2228 16.7938C10.5394 17.4772 9.43132 17.4772 8.7479 16.7938L0.969727 9.01562L2.03039 7.95496Z"})}),e.jsx("use",{xlinkHref:"#icon-arrow"})]})))`
+`,x=c.default(r=>e.jsxs("svg",{...r,children:[e.jsx("symbol",{id:"icon-arrow",viewBox:"0 0 19 19",children:e.jsx("path",{d:"M2.03039 7.95496L9.80856 15.7331C9.90619 15.8308 10.0645 15.8308 10.1621 15.7331L17.9403 7.95496L19.0009 9.01562L11.2228 16.7938C10.5394 17.4772 9.43132 17.4772 8.7479 16.7938L0.969727 9.01562L2.03039 7.95496Z"})}),e.jsx("use",{xlinkHref:"#icon-arrow"})]}))`
   width: 0.75rem;
   height: 0.75rem;
   margin: 0;
@@ -36,4 +36,4 @@
   transform: ${e=>e.$isMenuOpen?"rotate(-180deg)":"rotate(0deg)"};
 
   transform-origin: 50% 60%;
-`,b=({selectProps:{menuIsOpen:r=!1},isFocused:o=!1,isDisabled:a})=>e.jsx(x,{$isDisabled:a,$isFocused:o,$isMenuOpen:r,$theme:t.default});function y({className:o,color:a="primary",colorShade:l="mainAlt",forwardRef:i,hasError:d=!1,height:c,helperText:x,isDisabled:y=!1,onBlur:$=(()=>null),onFocus:k=(()=>null),onInputChange:F=(()=>null),placeholder:S="",name:j,...T}){const[v,D]=r.useState(!1),[w,L]=r.useState(""),I=({isSelected:e,isFocused:r,isDisabled:o})=>e?t.default.colors[a][l]:o?t.default.colors.background.light:r?t.default.colors.background.gray:t.default.colors.background.light,C=((e,r)=>r?t.default.colors.error.dark:e?t.default.colors.text.dark:t.default.colors.grayscaleToned.light1)(v,d),q=!T.label;return e.jsxs(u,{className:o,children:[!q&&T.label&&e.jsx(s.Label,{htmlFor:j,height:c,isFocused:v,hasValue:!(!T.value&&!w),disabled:y,theme:t.default,hasError:d,children:e.jsxs(e.Fragment,{children:[T.label,e.jsx("span",{})]})}),T.prefix&&e.jsx(f,{isDisabled:y,isFocused:v,children:T.prefix}),e.jsx(n.default,{...T,id:"react-select",inputId:j,name:j,ref:i,isDisabled:y,onInputChange:(e,r)=>{F(e,r),L(e)},placeholder:S,onFocus:e=>{D(!0),k(e)},onBlur:e=>{D(!1),$(e)},styles:{control:e=>({...e,borderRadius:0,color:t.default.colors.text.dark,fontFamily:t.default.typography.fontBaseFamily,fontSize:"1rem",fontWeight:400,cursor:"pointer",padding:"0.7rem 0.5rem",backgroundColor:t.default.colors.background.light,borderColor:C,boxShadow:"none",minHeight:"3rem","&:hover":{borderColor:"none"},...h(y),...m(d),...p(!!T.prefix)}),input:e=>({...e,height:"auto",margin:0,padding:0}),placeholder:e=>{const r={...e,fontSize:"1rem",lineHeight:"1.5rem",whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden",margin:0};return q?{...r,color:t.default.colors.text.dark,fontWeight:600}:{...r,display:v?"static":"none"}},menuList:e=>({...e,padding:"0.5rem 0",paddingBottom:"5rem",marginTop:0,border:`1px solid ${C}`,borderTop:"none",display:"flex",flexDirection:"column",gap:"0.5rem"}),menu:e=>({...e,borderRadius:0,boxShadow:"none",zIndex:5,padding:"0",marginTop:"-0.1rem"}),option:(e,{isSelected:r,isFocused:o,isDisabled:a})=>({...e,padding:"0.5rem",lineHeight:"1.5rem",fontSize:"1rem",fontWeight:400,cursor:a?"not-allowed":"pointer","&:hover":{background:I({isSelected:r,isFocused:!0,isDisabled:a})},background:I({isSelected:r,isFocused:o}),...p(!!T.prefix)}),valueContainer:e=>({...e,position:"static",padding:c?c-1+"rem 0 ":0,height:c?"auto":"1.5rem"}),clearIndicator:e=>({...e,paddingTop:0,paddingBottom:0,paddingLeft:0,paddingRight:"0.2rem"})},components:{IndicatorSeparator:()=>null,DropdownIndicator:b,...T.components??{}}}),x&&e.jsx(g,{hasError:d,children:x})]})}exports.Select=y,exports.default=y;
+`,b=({selectProps:{menuIsOpen:r=!1},isFocused:o=!1,isDisabled:a})=>e.jsx(x,{$isDisabled:a,$isFocused:o,$isMenuOpen:r,$theme:t.default});function y({className:o,color:a="primary",colorShade:l="mainAlt",forwardRef:i,hasError:d=!1,height:c,helperText:x,isDisabled:y=!1,onBlur:$=()=>null,onFocus:k=()=>null,onInputChange:F=()=>null,placeholder:S="",name:j,...T}){const[v,D]=r.useState(!1),[w,L]=r.useState(""),I=({isSelected:e,isFocused:r,isDisabled:o})=>e?t.default.colors[a][l]:o?t.default.colors.background.light:r?t.default.colors.background.gray:t.default.colors.background.light,C=((e,r)=>r?t.default.colors.error.dark:e?t.default.colors.text.dark:t.default.colors.grayscaleToned.light1)(v,d),q=!T.label;return e.jsxs(u,{className:o,children:[!q&&T.label&&e.jsx(s.Label,{htmlFor:j,height:c,isFocused:v,hasValue:!(!T.value&&!w),disabled:y,theme:t.default,hasError:d,children:e.jsxs(e.Fragment,{children:[T.label,e.jsx("span",{})]})}),T.prefix&&e.jsx(f,{isDisabled:y,isFocused:v,children:T.prefix}),e.jsx(n.default,{...T,id:"react-select",inputId:j,name:j,ref:i,isDisabled:y,onInputChange:(e,r)=>{F(e,r),L(e)},placeholder:S,onFocus:e=>{D(!0),k(e)},onBlur:e=>{D(!1),$(e)},styles:{control:e=>({...e,borderRadius:0,color:t.default.colors.text.dark,fontFamily:t.default.typography.fontBaseFamily,fontSize:"1rem",fontWeight:400,cursor:"pointer",padding:"0.7rem 0.5rem",backgroundColor:t.default.colors.background.light,borderColor:C,boxShadow:"none",minHeight:"3rem","&:hover":{borderColor:"none"},...h(y),...m(d),...p(!!T.prefix)}),input:e=>({...e,height:"auto",margin:0,padding:0}),placeholder:e=>{const r={...e,fontSize:"1rem",lineHeight:"1.5rem",whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden",margin:0};return q?{...r,color:t.default.colors.text.dark,fontWeight:600}:{...r,display:v?"static":"none"}},menuList:e=>({...e,padding:"0.5rem 0",paddingBottom:"5rem",marginTop:0,border:`1px solid ${C}`,borderTop:"none",display:"flex",flexDirection:"column",gap:"0.5rem"}),menu:e=>({...e,borderRadius:0,boxShadow:"none",zIndex:5,padding:"0",marginTop:"-0.1rem"}),option:(e,{isSelected:r,isFocused:o,isDisabled:a})=>({...e,padding:"0.5rem",lineHeight:"1.5rem",fontSize:"1rem",fontWeight:400,cursor:a?"not-allowed":"pointer","&:hover":{background:I({isSelected:r,isFocused:!0,isDisabled:a})},background:I({isSelected:r,isFocused:o}),...p(!!T.prefix)}),valueContainer:e=>({...e,position:"static",padding:c?c-1+"rem 0 ":0,height:c?"auto":"1.5rem"}),clearIndicator:e=>({...e,paddingTop:0,paddingBottom:0,paddingLeft:0,paddingRight:"0.2rem"})},components:{IndicatorSeparator:()=>null,DropdownIndicator:b,...T.components??{}}}),x&&e.jsx(g,{hasError:d,children:x})]})}exports.Select=y,exports.default=y;

package/cjs/components/Snackbar/index.js

@@ -80,4 +80,4 @@
   }
 `,h=m.default.span`
   flex: 1;
-`,y={error:e.jsx(n.default,{}),success:e.jsx(s.default,{}),info:e.jsx(l.default,{}),text:""},v=({message:r,color:i="none",type:n="info",action:s,isOpen:l,origin:c={},onClose:m=(()=>{}),onExited:u=(()=>{}),autoHideDuration:d=4e3,...v})=>(t.useEffect((()=>{const e=setTimeout(m,d);return()=>clearTimeout(e)}),[d,m]),e.jsx(o.CSSTransition,{in:l,timeout:200,mountOnEnter:!0,unmountOnExit:!0,onExited:u,classNames:p,children:e.jsxs(f,{...v,$color:i,origin:c,role:"error"===n?"alert":void 0,"aria-live":"error"===n?"assertive":"polite",children:[e.jsx(g,{type:n,children:y[n]}),e.jsx(h,{children:r}),s&&s,e.jsx(x,{onClick:m,"aria-label":"Close",type:"button",children:e.jsx(a.default,{})})]})}));exports.Snackbar=v,exports.default=v;
+`,y={error:e.jsx(n.default,{}),success:e.jsx(s.default,{}),info:e.jsx(l.default,{}),text:""},v=({message:r,color:i="none",type:n="info",action:s,isOpen:l,origin:c={},onClose:m=()=>{},onExited:u=()=>{},autoHideDuration:d=4e3,...v})=>(t.useEffect(()=>{const e=setTimeout(m,d);return()=>clearTimeout(e)},[d,m]),e.jsx(o.CSSTransition,{in:l,timeout:200,mountOnEnter:!0,unmountOnExit:!0,onExited:u,classNames:p,children:e.jsxs(f,{...v,$color:i,origin:c,role:"error"===n?"alert":void 0,"aria-live":"error"===n?"assertive":"polite",children:[e.jsx(g,{type:n,children:y[n]}),e.jsx(h,{children:r}),s&&s,e.jsx(x,{onClick:m,"aria-label":"Close",type:"button",children:e.jsx(a.default,{})})]})}));exports.Snackbar=v,exports.default=v;

package/cjs/components/Stepper/index.js

@@ -50,4 +50,4 @@
   line-height: 1;
 `,p=s.default(o.default)`
   font-size: ${({size:e})=>`calc(${e/2}rem + 6px)`};
-`;exports.Stepper=({children:i,orientation:r="vertical",variant:o="solid",color:l="primary",colorShade:s="mainAlt",size:h=2,activeStep:m,ariaLabels:u={},...z})=>{const x=i.length,g="horizontal"===r,{id:f}=t.useNameAndId("stepper");return e.jsx(a,{isHorizontal:g,...z,role:"list","aria-label":u?.list??"Step progress",children:i.map(((i,r)=>{const t=m&&r<m,a=t||"solid"===o;return e.jsxs(n,{$color:l,$colorShade:s,$size:h,stepsNumber:x,isHorizontal:g,role:"listitem","aria-disabled":t?"true":void 0,"aria-current":m===r?"step":void 0,"aria-label":(void 0===m?`${u?.step??"Step %s"}`:`${u?.stepUpcoming??"Upcoming step, step %s"}`).replaceAll("%s",String(r+1)),children:[e.jsx(c,{children:e.jsx(d,{$color:l,$colorShade:s,isFilled:a,size:h,role:"img",children:t?e.jsx(p,{size:h,"aria-hidden":"true"}):e.jsx($,{as:"span",size:h,"aria-hidden":"true",children:r+1})})}),i]},`${f}-${r}`)}))})};
+`;exports.Stepper=({children:i,orientation:r="vertical",variant:o="solid",color:l="primary",colorShade:s="mainAlt",size:h=2,activeStep:m,ariaLabels:u={},...z})=>{const x=i.length,g="horizontal"===r,{id:f}=t.useNameAndId("stepper");return e.jsx(a,{isHorizontal:g,...z,role:"list","aria-label":u?.list??"Step progress",children:i.map((i,r)=>{const t=m&&r<m,a=t||"solid"===o;return e.jsxs(n,{$color:l,$colorShade:s,$size:h,stepsNumber:x,isHorizontal:g,role:"listitem","aria-disabled":t?"true":void 0,"aria-current":m===r?"step":void 0,"aria-label":(void 0===m?`${u?.step??"Step %s"}`:`${u?.stepUpcoming??"Upcoming step, step %s"}`).replaceAll("%s",String(r+1)),children:[e.jsx(c,{children:e.jsx(d,{$color:l,$colorShade:s,isFilled:a,size:h,role:"img",children:t?e.jsx(p,{size:h,"aria-hidden":"true"}):e.jsx($,{as:"span",size:h,"aria-hidden":"true",children:r+1})})}),i]},`${f}-${r}`)})})};

package/cjs/components/StepperAccordion/index.js

@@ -60,4 +60,4 @@
 
   ${e&&`\n      border: 2px solid ${s.fadedColor(i.default.colors[r][t],0)};\n      background-color: ${s.fadedColor(i.default.colors[r][t],.5)};\n    `}
 `)(e.isComplete,e.$color,e.$colorShade)};
-`,b=({step:o,isExpanded:i,isDisabled:t,isComplete:s,onClick:d,color:c,colorShade:u,title:p,children:h,closedChildren:b,...j})=>{const[y,C]=r.useState(i||!1),{id:k}=n.useNameAndId("stepper"),q=r.useCallback((()=>{t||C((e=>!e))}),[t]);r.useEffect((()=>{C(i||!1)}),[t,i]);const v=o||0===o,S=`${k}-header`,D=`${k}-content`;return e.jsxs(f,{children:[e.jsxs(m,{...j,id:S,onClick:e=>{t||(d||q)(e)},onKeyDown:e=>{("Enter"===e.key||" "===e.key)&&!t&&(e.preventDefault(),q())},$isDisabled:t||!1,role:"button",tabIndex:0,"aria-expanded":y,"aria-controls":D,children:[v&&e.jsx(g,{isComplete:s||!1,isDisabled:t||!1,$color:c||"primary",$colorShade:u||"main",children:s?e.jsx(a.default,{}):e.jsx("span",{children:o})}),e.jsx(x,{children:p}),e.jsx($,{isExpanded:y})]}),e.jsx(l.Collapse,{isOpened:y,children:e.jsx("div",{id:D,role:"region","aria-labelledby":S,children:h})}),b&&b]})};exports.StepperAccordion=b,exports.default=b;
+`,b=({step:o,isExpanded:i,isDisabled:t,isComplete:s,onClick:d,color:c,colorShade:u,title:p,children:h,closedChildren:b,...j})=>{const[y,C]=r.useState(i||!1),{id:k}=n.useNameAndId("stepper"),q=r.useCallback(()=>{t||C(e=>!e)},[t]);r.useEffect(()=>{C(i||!1)},[t,i]);const v=o||0===o,S=`${k}-header`,D=`${k}-content`;return e.jsxs(f,{children:[e.jsxs(m,{...j,id:S,onClick:e=>{t||(d||q)(e)},onKeyDown:e=>{("Enter"===e.key||" "===e.key)&&!t&&(e.preventDefault(),q())},$isDisabled:t||!1,role:"button",tabIndex:0,"aria-expanded":y,"aria-controls":D,children:[v&&e.jsx(g,{isComplete:s||!1,isDisabled:t||!1,$color:c||"primary",$colorShade:u||"main",children:s?e.jsx(a.default,{}):e.jsx("span",{children:o})}),e.jsx(x,{children:p}),e.jsx($,{isExpanded:y})]}),e.jsx(l.Collapse,{isOpened:y,children:e.jsx("div",{id:D,role:"region","aria-labelledby":S,children:h})}),b&&b]})};exports.StepperAccordion=b,exports.default=b;

package/cjs/components/Table/index.js

@@ -21,4 +21,4 @@
   border: 1px solid ${t.default.colors.grayscaleToned.light3};
   padding: 0.5rem 0.75rem;
   vertical-align: top;
-`,f=r=>e.jsx(p,{children:a.Children.toArray(r.map(((a,r)=>e.jsx(c,{scope:"col",children:a},r))))},"RowHead"),m=(a,r)=>r.length?a.map((a=>r?.map((r=>e.jsx(h,{children:a[r]},r))))):a.map((a=>Object.entries(a).map((([a,r])=>e.jsx(h,{children:r},a))))),x=r=>a.Children.toArray(r.map(((r,l)=>e.jsx(p,{children:a.Children.toArray(r)},l))));exports.default=({columns:a,data:r,ariaLabel:l})=>e.jsx(i,{children:e.jsxs(s,{"aria-label":l,children:[a&&e.jsx(n,{children:f(a)}),r&&e.jsx(u,{children:x(m(r,a??[]))})]})});
+`,f=r=>e.jsx(p,{children:a.Children.toArray(r.map((a,r)=>e.jsx(c,{scope:"col",children:a},r)))},"RowHead"),m=(a,r)=>r.length?a.map(a=>r?.map(r=>e.jsx(h,{children:a[r]},r))):a.map(a=>Object.entries(a).map(([a,r])=>e.jsx(h,{children:r},a))),x=r=>a.Children.toArray(r.map((r,l)=>e.jsx(p,{children:a.Children.toArray(r)},l)));exports.default=({columns:a,data:r,ariaLabel:l})=>e.jsx(i,{children:e.jsxs(s,{"aria-label":l,children:[a&&e.jsx(n,{children:f(a)}),r&&e.jsx(u,{children:x(m(r,a??[]))})]})});

package/cjs/components/Tabs/Tab.js

@@ -13,4 +13,4 @@
       ${({theme:e,isActive:r,$activeColor:t,$activeColorShade:o})=>!r&&`background-color: ${i.hexToRGB(e.colors[t][o],.1)};\n      `}
     }
   }
-`,d=o.forwardRef((({label:r,index:t=-1,isActive:o=!1,onClick:i,activeColor:a="secondary",activeColorShade:s="mainAlt",isDisabled:d=!1,onKeyUp:c},u)=>e.jsx(l,{role:"presentation",children:e.jsx(n,{id:`tab-${t}`,role:"tab","aria-selected":o,"aria-controls":`tabpanel-${t}`,tabIndex:o?0:-1,isActive:o,onClick:e=>i&&i(e,t),$activeColor:a,$activeColorShade:s,isDisabled:d,variant:"flat",color:o?a:"neutral",colorShade:s,onKeyUp:e=>c&&c(e,t),ref:u,noRadius:!0,children:r})})));d.displayName="Tab",exports.default=d;
+`,d=o.forwardRef(({label:r,index:t=-1,isActive:o=!1,onClick:i,activeColor:a="secondary",activeColorShade:s="mainAlt",isDisabled:d=!1,onKeyUp:c},u)=>e.jsx(l,{role:"presentation",children:e.jsx(n,{id:`tab-${t}`,role:"tab","aria-selected":o,"aria-controls":`tabpanel-${t}`,tabIndex:o?0:-1,isActive:o,onClick:e=>i&&i(e,t),$activeColor:a,$activeColorShade:s,isDisabled:d,variant:"flat",color:o?a:"neutral",colorShade:s,onKeyUp:e=>c&&c(e,t),ref:u,noRadius:!0,children:r})}));d.displayName="Tab",exports.default=d;

package/cjs/components/Tabs/Tabs.js

@@ -23,4 +23,4 @@
   display: flex;
 `,f=d.default.div`
   padding: 0.5rem 0;
-`,h=d.default.div``,b=({activeColor:t="secondary",activeColorShade:l="mainAlt",justify:o="end",activeIndex:n,initalActive:d,children:b=[],kbNavAutoOpen:x=!0,onTabClick:y,fullWidthBorder:j=!0,borderColor:m="light6",headline:v})=>{const g=r.Children.map(b,(e=>e)),[q,C]=r.useState((()=>d??g.findIndex((e=>!e.props.isDisabled)))),k=r.useRef([]),$=!!g[q]?.props?.children;r.useEffect((()=>{typeof n<"u"&&C(n)}),[n]);const A=(e,r)=>{if(e.preventDefault(),("Enter"===e.key||" "===e.key)&&!x&&C(r),"ArrowLeft"===e.key||"ArrowRight"===e.key){const i=x?q:r,t="ArrowRight"===e.key,l=t?i+1:0,s=t?g.length:i,o=g.slice(l,s);t||o.reverse();const n=o.findIndex((e=>!e.props.isDisabled));if(-1!==n){const e=t?i+(n+1):i-(n+1);x&&C(e),k.current[e].focus()}}};return e.jsx(a,{children:e.jsxs(s.UnmountClosed,{isOpened:!0,children:[e.jsxs(u,{fullWidthBorder:j,justify:v?"space-between":o,role:"tablist",borderColor:m,children:[v&&e.jsx(c,{children:v}),e.jsx(p,{children:g.map(((r,s)=>{if(!r)return null;const o=q===s;return e.jsx(i.default,{label:r.props.label,isDisabled:r.props.isDisabled,index:s,isActive:q===s,activeColor:t,activeColorShade:l,onClick:(e,i)=>{!o&&!r.props.isDisabled&&(r.props.onClick?.(e,i),y?.(e,i),((e,r)=>{e.preventDefault(),C(r)})(e,i))},onKeyUp:A,ref:e=>k.current[s]=e},s)}))})]}),$&&e.jsx(f,{children:g.map(((r,i)=>{const t=r.props.children&&q===i;return e.jsx(h,{id:`tabpanel-${i}`,role:"tabpanel","aria-labelledby":`tab-${i}`,"aria-hidden":t?"false":"true",children:t&&r.props.children},i)}))})]})})};exports.Tabs=b,exports.default=b;
+`,h=d.default.div``,b=({activeColor:t="secondary",activeColorShade:l="mainAlt",justify:o="end",activeIndex:n,initalActive:d,children:b=[],kbNavAutoOpen:x=!0,onTabClick:y,fullWidthBorder:j=!0,borderColor:m="light6",headline:v})=>{const g=r.Children.map(b,e=>e),[q,C]=r.useState(()=>d??g.findIndex(e=>!e.props.isDisabled)),k=r.useRef([]),$=!!g[q]?.props?.children;r.useEffect(()=>{typeof n<"u"&&C(n)},[n]);const A=(e,r)=>{if(e.preventDefault(),("Enter"===e.key||" "===e.key)&&!x&&C(r),"ArrowLeft"===e.key||"ArrowRight"===e.key){const i=x?q:r,t="ArrowRight"===e.key,l=t?i+1:0,s=t?g.length:i,o=g.slice(l,s);t||o.reverse();const n=o.findIndex(e=>!e.props.isDisabled);if(-1!==n){const e=t?i+(n+1):i-(n+1);x&&C(e),k.current[e].focus()}}};return e.jsx(a,{children:e.jsxs(s.UnmountClosed,{isOpened:!0,children:[e.jsxs(u,{fullWidthBorder:j,justify:v?"space-between":o,role:"tablist",borderColor:m,children:[v&&e.jsx(c,{children:v}),e.jsx(p,{children:g.map((r,s)=>{if(!r)return null;const o=q===s;return e.jsx(i.default,{label:r.props.label,isDisabled:r.props.isDisabled,index:s,isActive:q===s,activeColor:t,activeColorShade:l,onClick:(e,i)=>{!o&&!r.props.isDisabled&&(r.props.onClick?.(e,i),y?.(e,i),((e,r)=>{e.preventDefault(),C(r)})(e,i))},onKeyUp:A,ref:e=>k.current[s]=e},s)})})]}),$&&e.jsx(f,{children:g.map((r,i)=>{const t=r.props.children&&q===i;return e.jsx(h,{id:`tabpanel-${i}`,role:"tabpanel","aria-labelledby":`tab-${i}`,"aria-hidden":t?"false":"true",children:t&&r.props.children},i)})})]})})};exports.Tabs=b,exports.default=b;

package/cjs/components/TextArea/index.js

@@ -51,4 +51,4 @@
 `,b=i.default.span`
   display: block;
   color: ${({theme:e})=>e.colors.error.dark};
-`,g=({placeholder:l="",isDisabled:d=!1,centered:t=!1,hasError:i=!1,className:n,helperText:c,label:u="",resize:g=!0,name:y,errors:j,...k})=>{const[v,q]=r.useState(!1),T=!!k.value,{name:F,id:B}=o.useNameAndId("textarea",y),E=j?.map(((e,r)=>`${B}-error-${r}`))??[],z=[c?`${B}-helper`:null,...E].filter(Boolean).join(" ");return e.jsxs(h,{className:n,children:[e.jsxs(x,{isFocused:v,disabled:d,centered:t,hasError:i,hasPlaceholder:!!l,children:[e.jsx(f,{...k,id:B,name:F,"aria-label":u?void 0:F,"aria-describedby":z||void 0,"aria-invalid":!!j?.length,resize:g,onFocus:()=>q(!0),onBlur:()=>q(!1),disabled:d,tabIndex:d?-1:0,theme:a.default,placeholder:u&&!v?"":l}),k.suffix&&e.jsx(p,{children:k.suffix})]}),u&&e.jsx(s.Label,{htmlFor:B,isFocused:v,centered:t,hasError:i,hasValue:T,disabled:d,theme:a.default,children:e.jsxs(e.Fragment,{children:[u,e.jsx("span",{})]})}),(c||j)&&e.jsxs($,{centered:t,children:[c&&e.jsx(m,{id:`${B}-helper`,children:c}),j&&j.map(((r,l)=>e.jsx(b,{id:`${B}-error-${l}`,role:"alert","aria-live":"assertive",children:r},`${B}-error-${l}`)))]})]})};exports.TextArea=g,exports.default=g;
+`,g=({placeholder:l="",isDisabled:d=!1,centered:t=!1,hasError:i=!1,className:n,helperText:c,label:u="",resize:g=!0,name:y,errors:j,...k})=>{const[v,q]=r.useState(!1),T=!!k.value,{name:F,id:B}=o.useNameAndId("textarea",y),E=j?.map((e,r)=>`${B}-error-${r}`)??[],z=[c?`${B}-helper`:null,...E].filter(Boolean).join(" ");return e.jsxs(h,{className:n,children:[e.jsxs(x,{isFocused:v,disabled:d,centered:t,hasError:i,hasPlaceholder:!!l,children:[e.jsx(f,{...k,id:B,name:F,"aria-label":u?void 0:F,"aria-describedby":z||void 0,"aria-invalid":!!j?.length,resize:g,onFocus:()=>q(!0),onBlur:()=>q(!1),disabled:d,tabIndex:d?-1:0,theme:a.default,placeholder:u&&!v?"":l}),k.suffix&&e.jsx(p,{children:k.suffix})]}),u&&e.jsx(s.Label,{htmlFor:B,isFocused:v,centered:t,hasError:i,hasValue:T,disabled:d,theme:a.default,children:e.jsxs(e.Fragment,{children:[u,e.jsx("span",{})]})}),(c||j)&&e.jsxs($,{centered:t,children:[c&&e.jsx(m,{id:`${B}-helper`,children:c}),j&&j.map((r,l)=>e.jsx(b,{id:`${B}-error-${l}`,role:"alert","aria-live":"assertive",children:r},`${B}-error-${l}`))]})]})};exports.TextArea=g,exports.default=g;

package/cjs/components/Textfield/index.js

@@ -64,4 +64,4 @@
 `,f=d.default.span`
   display: block;
   color: ${({theme:e})=>e.colors.error.dark};
-`,$=({placeholder:l="",isDisabled:o=!1,centered:a=!1,hasError:d=!1,className:i,helperText:n,label:c="",onBlur:$=(()=>null),onFocus:g=(()=>null),forwardRef:y,suffix:j,name:v,errors:k,isAutoFocused:F=!1,...q})=>{const[T,w]=r.useState(!1),[B,E]=r.useState(void 0),A=r.useRef(null),N=!!q.value,S=k&&Array.isArray(k)&&k?.length>0,{name:_,id:z}=t.useNameAndId("text-input",v),I=k?.map(((e,r)=>`${z}-error-${r}`))??[],L=[n?`${z}-helper`:null,...I].filter(Boolean).join(" ");return r.useEffect((()=>{A.current&&E(A.current.offsetWidth)}),[A.current]),e.jsxs(u,{className:i,children:[e.jsxs(h,{isFocused:T,disabled:o,centered:a,hasError:d,hasPlaceholder:!!l,children:[e.jsx(m,{...q,id:z,name:_,"aria-labelledby":c?`${z}-label`:void 0,"aria-describedby":L||void 0,"aria-invalid":S||d,ref:y,onFocus:e=>{w(!0),g(e)},onBlur:e=>{w(!1),$(e)},disabled:o,placeholder:c&&!T?"":l,autoFocus:F}),j&&e.jsx(x,{ref:A,children:j})]}),c&&e.jsx(s.Label,{id:`${z}-label`,htmlFor:z,isFocused:T,centered:a,hasError:d,hasValue:N,disabled:o,suffixWidth:B,children:e.jsxs(e.Fragment,{children:[c,e.jsx("span",{})]})}),(n||S)&&e.jsxs(p,{centered:a,children:[n&&e.jsx(b,{id:`${z}-helper`,children:n}),S&&k.map(((r,l)=>e.jsx(f,{id:`${z}-error-${l}`,role:"alert","aria-live":"assertive",children:r},`${z}-error-${l}`)))]})]})};exports.TextField=$,exports.default=$;
+`,$=({placeholder:l="",isDisabled:o=!1,centered:a=!1,hasError:d=!1,className:i,helperText:n,label:c="",onBlur:$=()=>null,onFocus:g=()=>null,forwardRef:y,suffix:j,name:v,errors:k,isAutoFocused:F=!1,...q})=>{const[T,w]=r.useState(!1),[B,E]=r.useState(void 0),A=r.useRef(null),N=!!q.value,S=k&&Array.isArray(k)&&k?.length>0,{name:_,id:z}=t.useNameAndId("text-input",v),I=k?.map((e,r)=>`${z}-error-${r}`)??[],L=[n?`${z}-helper`:null,...I].filter(Boolean).join(" ");return r.useEffect(()=>{A.current&&E(A.current.offsetWidth)},[A.current]),e.jsxs(u,{className:i,children:[e.jsxs(h,{isFocused:T,disabled:o,centered:a,hasError:d,hasPlaceholder:!!l,children:[e.jsx(m,{...q,id:z,name:_,"aria-labelledby":c?`${z}-label`:void 0,"aria-describedby":L||void 0,"aria-invalid":S||d,ref:y,onFocus:e=>{w(!0),g(e)},onBlur:e=>{w(!1),$(e)},disabled:o,placeholder:c&&!T?"":l,autoFocus:F}),j&&e.jsx(x,{ref:A,children:j})]}),c&&e.jsx(s.Label,{id:`${z}-label`,htmlFor:z,isFocused:T,centered:a,hasError:d,hasValue:N,disabled:o,suffixWidth:B,children:e.jsxs(e.Fragment,{children:[c,e.jsx("span",{})]})}),(n||S)&&e.jsxs(p,{centered:a,children:[n&&e.jsx(b,{id:`${z}-helper`,children:n}),S&&k.map((r,l)=>e.jsx(f,{id:`${z}-error-${l}`,role:"alert","aria-live":"assertive",children:r},`${z}-error-${l}`))]})]})};exports.TextField=$,exports.default=$;

package/cjs/components/TimePicker/index.js

@@ -6,4 +6,4 @@
   flex-wrap: wrap;
   margin: 0;
   padding: 0;
-`,s=(e,i)=>Array.isArray(i)?!!i.find((i=>i.getTime()===e.getTime())):i?.getTime()===e.getTime(),a=({timeSlots:e,onTimeSlotClick:r,selectedTimes:a,disabledTimes:o,...d})=>i.jsx(l,{role:"listbox","aria-multiselectable":"true",...d,children:e.map((({text:e,date:l})=>{const n=s(l,a),m=s(l,o),u=d.color||"primary";return i.jsx(t.Chip,{role:"option",component:"li","aria-selected":n,"aria-disabled":m,"data-selected":n,"data-disabled":m,variant:n?"solid":"outline",isDisabled:m,color:n?u:"neutralLight",onClick:()=>!n&&!m&&r(l),onKeyDown:e=>{("Enter"===e.key||" "===e.key)&&!n&&!m&&(e.preventDefault(),r(l))},children:e},l.getTime())}))});exports.TimePicker=a,exports.default=a;
+`,s=(e,i)=>Array.isArray(i)?!!i.find(i=>i.getTime()===e.getTime()):i?.getTime()===e.getTime(),a=({timeSlots:e,onTimeSlotClick:r,selectedTimes:a,disabledTimes:o,...d})=>i.jsx(l,{role:"listbox","aria-multiselectable":"true",...d,children:e.map(({text:e,date:l})=>{const n=s(l,a),m=s(l,o),u=d.color||"primary";return i.jsx(t.Chip,{role:"option",component:"li","aria-selected":n,"aria-disabled":m,"data-selected":n,"data-disabled":m,variant:n?"solid":"outline",isDisabled:m,color:n?u:"neutralLight",onClick:()=>!n&&!m&&r(l),onKeyDown:e=>{("Enter"===e.key||" "===e.key)&&!n&&!m&&(e.preventDefault(),r(l))},children:e},l.getTime())})});exports.TimePicker=a,exports.default=a;

package/cjs/components/TimePicker/testHelper.js

@@ -1 +1 @@
-"use strict";exports.generateTimeSlots=e=>{const t=new Date("2020/02/02"),r=new Date(t);return Array.from({length:e},((e,t)=>{const n=new Date(r.setTime(r.getDate()+(e=>60*e*60*1e3)(t)));return{date:n,text:t<9?`0${t+1}:00`:`${t+1}:00`}}))};
+"use strict";exports.generateTimeSlots=e=>{const t=new Date("2020/02/02"),r=new Date(t);return Array.from({length:e},(e,t)=>{const n=new Date(r.setTime(r.getDate()+(e=>60*e*60*1e3)(t)));return{date:n,text:t<9?`0${t+1}:00`:`${t+1}:00`}})};

package/cjs/components/Toggle/index.js

@@ -34,4 +34,4 @@
   ${e=>"RIGHT"===e.active&&"\n    left: calc(50%);\n  "}
 
   ${e=>!e.active&&"display: none;"}
-`;exports.Toggle=({onChange:t,color:r,colorShade:i="mainAlt",ariaLabel:n,...s})=>{const[d,h]=o.useState(s.active),u=o.useRef(null),f=o.useRef(null);o.useEffect((()=>{h(s.active)}),[s.active]);const p=e=>{h(e),t(e)},g=(e,o)=>{("Enter"===e.key||" "===e.key)&&(e.preventDefault(),p(o)),"ArrowRight"===e.key&&"LEFT"===o?(p("RIGHT"),f.current?.focus()):"ArrowLeft"===e.key&&"RIGHT"===o&&(p("LEFT"),u.current?.focus())};return e.jsxs(l,{role:"radiogroup","aria-label":n??"Toggle options",children:[e.jsx(c,{$color:r,$colorShade:i,active:d}),e.jsx(a,{ref:u,role:"radio","aria-checked":"LEFT"===d,tabIndex:"LEFT"===d?-1:0,onClick:()=>p("LEFT"),onKeyDown:e=>g(e,"LEFT"),isActive:"LEFT"===d,children:s.left}),e.jsx(a,{ref:f,role:"radio","aria-checked":"RIGHT"===d,tabIndex:"RIGHT"===d?-1:0,onClick:()=>p("RIGHT"),onKeyDown:e=>g(e,"RIGHT"),isActive:"RIGHT"===d,children:s.right})]})};
+`;exports.Toggle=({onChange:t,color:r,colorShade:i="mainAlt",ariaLabel:n,...s})=>{const[d,h]=o.useState(s.active),u=o.useRef(null),f=o.useRef(null);o.useEffect(()=>{h(s.active)},[s.active]);const p=e=>{h(e),t(e)},g=(e,o)=>{("Enter"===e.key||" "===e.key)&&(e.preventDefault(),p(o)),"ArrowRight"===e.key&&"LEFT"===o?(p("RIGHT"),f.current?.focus()):"ArrowLeft"===e.key&&"RIGHT"===o&&(p("LEFT"),u.current?.focus())};return e.jsxs(l,{role:"radiogroup","aria-label":n??"Toggle options",children:[e.jsx(c,{$color:r,$colorShade:i,active:d}),e.jsx(a,{ref:u,role:"radio","aria-checked":"LEFT"===d,tabIndex:"LEFT"===d?-1:0,onClick:()=>p("LEFT"),onKeyDown:e=>g(e,"LEFT"),isActive:"LEFT"===d,children:s.left}),e.jsx(a,{ref:f,role:"radio","aria-checked":"RIGHT"===d,tabIndex:"RIGHT"===d?-1:0,onClick:()=>p("RIGHT"),onKeyDown:e=>g(e,"RIGHT"),isActive:"RIGHT"===d,children:s.right})]})};

package/cjs/hooks/useDynamicScript.js

@@ -1 +1 @@
-"use strict";var t=require("react");exports.useDynamicScript=e=>(t.useEffect((()=>{const t=`dynamic-script-${e}`;if(!document.getElementById(t)){const c=document.createElement("script");c.setAttribute("id",t),c.setAttribute("src",e),document.body.appendChild(c)}}),[e]),null);
+"use strict";var t=require("react");exports.useDynamicScript=e=>(t.useEffect(()=>{const t=`dynamic-script-${e}`;if(!document.getElementById(t)){const c=document.createElement("script");c.setAttribute("id",t),c.setAttribute("src",e),document.body.appendChild(c)}},[e]),null);

package/cjs/shared/helpers.js

@@ -1 +1 @@
-"use strict";exports.fadedColor=(e,t)=>{if(!/^#?([0-9A-F]{3}){1,2}$/i.test(e))return e;const r=e.match(e.length<=4?/\w/g:/\w\w/g);if(r){const e=r.map((e=>parseInt(e.length<2?`${e}${e}`:e,16)));if(e.every(Number.isInteger)){const[r,n,s]=e;return`rgba(${r}, ${n}, ${s}, ${t||1})`}}return e},exports.generateNameHash=e=>`${e?`${e}-`:""}${Math.random().toString(36).slice(2,12)}`;
+"use strict";exports.fadedColor=(e,t)=>{if(!/^#?([0-9A-F]{3}){1,2}$/i.test(e))return e;const r=e.match(e.length<=4?/\w/g:/\w\w/g);if(r){const e=r.map(e=>parseInt(e.length<2?`${e}${e}`:e,16));if(e.every(Number.isInteger)){const[r,n,s]=e;return`rgba(${r}, ${n}, ${s}, ${t||1})`}}return e},exports.generateNameHash=e=>`${e?`${e}-`:""}${Math.random().toString(36).slice(2,12)}`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kvdbil/components",
-  "version": "17.12.6",
+  "version": "17.12.7",
   "sideEffects": false,
   "main": "cjs/index.js",
   "module": "esm/index.js",
@@ -48,10 +48,9 @@
   ],
   "resolutions": {
     "**/@types/react": "^18.3.12",
-    "**/minimatch": "^9.0.7",
-    "**/flatted": "^3.4.2",
-    "**/serialize-javascript": "^7.0.3",
-    "**/svgo": "^3.3.3"
+    "**/serialize-javascript": "^7.0.6",
+    "**/js-yaml": "^4.2.0",
+    "**/uuid": "^11.1.1"
   },
   "devDependencies": {
     "@babel/core": "^7.11.6",

package/package.json.tmp

@@ -1,6 +1,6 @@
 {
   "name": "@kvdbil/components",
-  "version": "17.12.6",
+  "version": "17.12.7",
   "sideEffects": false,
   "main": "cjs/index.js",
   "module": "esm/index.js",
@@ -47,10 +47,9 @@
   ],
   "resolutions": {
     "**/@types/react": "^18.3.12",
-    "**/minimatch": "^9.0.7",
-    "**/flatted": "^3.4.2",
-    "**/serialize-javascript": "^7.0.3",
-    "**/svgo": "^3.3.3"
+    "**/serialize-javascript": "^7.0.6",
+    "**/js-yaml": "^4.2.0",
+    "**/uuid": "^11.1.1"
   },
   "devDependencies": {
     "@babel/core": "^7.11.6",

package/types/ColorCard.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 type Variants = Record<string, string | Record<string, string>>;
 interface ColorCardProps {
     colorName: string;
     variants: Variants;
 }
-declare const ColorCard: ({ colorName, variants }: ColorCardProps) => import("react/jsx-runtime").JSX.Element;
+declare const ColorCard: ({ colorName, variants }: ColorCardProps) => React.JSX.Element;
 export default ColorCard;

package/types/ElevationCard.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 import { ComponentType, ReactNode } from 'react';
 export interface ElevationProps {
     value: string;
     children: ReactNode;
     as?: ComponentType | keyof JSX.IntrinsicElements;
 }
-export declare const ElevationCard: ({ children, value, as, }: ElevationProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ElevationCard: ({ children, value, as, }: ElevationProps) => React.JSX.Element;

package/types/components/Accordion/index.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 interface IItem {
     title: string;
     text: ReactNode;
@@ -6,5 +6,5 @@ interface IItem {
 export interface AccordionProps {
     items: IItem[];
 }
-export declare const Accordion: ({ items, ...props }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Accordion: ({ items, ...props }: AccordionProps) => React.JSX.Element;
 export default Accordion;

package/types/components/Badge/index.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 export interface BadgeProps {
     notificationAmount?: number;
     withNumber?: boolean;
     ariaLabel?: string;
 }
-export declare const Badge: ({ notificationAmount, withNumber, ariaLabel, ...rest }: BadgeProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const Badge: ({ notificationAmount, withNumber, ariaLabel, ...rest }: BadgeProps) => React.JSX.Element | null;
 export default Badge;

package/types/components/Breadcrumbs/BreadcrumbsItem.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { BreadcrumbLink } from '.';
 interface Props {
     link: BreadcrumbLink;
@@ -6,5 +6,5 @@ interface Props {
     isLast: boolean;
     onlyLastTruncated: boolean;
 }
-declare const BreadcrumbsItem: ({ link, separator, isLast, onlyLastTruncated, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const BreadcrumbsItem: ({ link, separator, isLast, onlyLastTruncated, }: Props) => React.JSX.Element;
 export default BreadcrumbsItem;

package/types/components/Breadcrumbs/index.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 export interface BreadcrumbLink {
     component?: ReactNode;
     prefixIcon?: ReactNode;
@@ -8,5 +8,5 @@ export interface Props {
     separator?: ReactNode;
     onlyLastTruncated?: boolean;
 }
-declare const Breadcrumbs: ({ links, separator, onlyLastTruncated, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const Breadcrumbs: ({ links, separator, onlyLastTruncated, }: Props) => React.JSX.Element;
 export default Breadcrumbs;

package/types/components/Card/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ReactNode } from 'react';
 import { Color, ColorShade } from '../../Types';
 export interface CardProps {
@@ -9,5 +10,5 @@ export interface CardProps {
     lineBorder?: boolean;
     as?: keyof JSX.IntrinsicElements;
 }
-export declare const Card: ({ children, topBorder, topBorderColor, topBorderColorShade, noFrame, lineBorder, as: element, }: CardProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Card: ({ children, topBorder, topBorderColor, topBorderColorShade, noFrame, lineBorder, as: element, }: CardProps) => React.JSX.Element;
 export default Card;

package/types/components/CheckBox/index.d.ts

@@ -1,4 +1,4 @@
-import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
 import { CheckboxSize, Color, ColorShade } from '../../Types';
 type ComponentPropsWithoutSize = Omit<ComponentPropsWithoutRef<'input'>, 'size'>;
 export interface CheckBoxProps extends ComponentPropsWithoutSize {
@@ -11,5 +11,5 @@ export interface CheckBoxProps extends ComponentPropsWithoutSize {
     hasError?: boolean;
     label?: ReactNode;
 }
-export declare const CheckBox: ({ name: nameProp, isDisabled, size, checked, color, colorShade, hasError, label, ...rest }: CheckBoxProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CheckBox: ({ name: nameProp, isDisabled, size, checked, color, colorShade, hasError, label, ...rest }: CheckBoxProps) => React.JSX.Element;
 export default CheckBox;

package/types/components/Chip/index.d.ts

@@ -29,5 +29,5 @@ export interface ItemProps {
     onClick?: (e: MouseEvent) => void;
     fullWidth?: boolean;
 }
-export declare const Chip: ({ color, children, component, isDisabled, onClick, size, prefix, onDelete, variant, role, ...props }: ChipProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Chip: ({ color, children, component, isDisabled, onClick, size, prefix, onDelete, variant, role, ...props }: ChipProps) => React.JSX.Element;
 export default Chip;

package/types/components/DayPicker/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { PropsBase } from 'react-day-picker';
 import { Locale } from '../../Types';
 import { Color, ColorShade } from '../../Types';
@@ -7,5 +8,5 @@ export interface DayPickerProps extends Omit<PropsBase, 'locale'> {
     selectedDay?: Date;
     colorShade?: ColorShade;
 }
-export declare const DayPicker: ({ locale, color, colorShade, selectedDay, ...props }: DayPickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DayPicker: ({ locale, color, colorShade, selectedDay, ...props }: DayPickerProps) => React.JSX.Element;
 export default DayPicker;

package/types/components/Dialog/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ReactNode } from 'react';
 export interface DialogProps {
     title?: ReactNode;
@@ -8,5 +9,5 @@ export interface DialogProps {
     withCloseIcon?: boolean;
     onClose(): void;
 }
-export declare const Dialog: ({ isOpen, title, children, actions, onClose, withPortal, withCloseIcon, ...props }: DialogProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Dialog: ({ isOpen, title, children, actions, onClose, withPortal, withCloseIcon, ...props }: DialogProps) => React.JSX.Element;
 export default Dialog;

package/types/components/EditRow/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { Color } from '../../Types';
 import { TextFieldProps } from '../Textfield';
 export interface EditRowProps<T> {
@@ -18,5 +19,5 @@ export interface EditRowProps<T> {
     formatterFunc?(value: string): string;
     isInitialEditing?: boolean;
 }
-declare const EditRow: <T extends string | string[]>({ value: initialValue, label, onChange, onEdit, options, inputProps, isClearable, isEditionDisabled, editText, saveText, cancelText, noValueText, formatterFunc, isSingleSelect, color, isInitialEditing, }: EditRowProps<T>) => import("react/jsx-runtime").JSX.Element;
+declare const EditRow: <T extends string | string[]>({ value: initialValue, label, onChange, onEdit, options, inputProps, isClearable, isEditionDisabled, editText, saveText, cancelText, noValueText, formatterFunc, isSingleSelect, color, isInitialEditing, }: EditRowProps<T>) => React.JSX.Element;
 export default EditRow;

package/types/components/ErrorMessage/index.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 import { ReactNode, CSSProperties } from 'react';
 export interface ErrorMessageProps {
     centered?: boolean;
     style?: CSSProperties;
     children: ReactNode;
 }
-export declare const ErrorMessage: ({ children, centered, ...props }: ErrorMessageProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ErrorMessage: ({ children, centered, ...props }: ErrorMessageProps) => React.JSX.Element;
 export default ErrorMessage;

package/types/components/FieldLabel.d.ts

@@ -1,4 +1,4 @@
-export declare const Label: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
+export declare const Label: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "disabled" | "height" | "hasError" | "isFocused" | "hasValue" | "centered" | "suffixWidth"> & {
     isFocused: boolean;
     hasValue: boolean;
     disabled: boolean;
@@ -6,4 +6,12 @@ export declare const Label: import("styled-components/dist/types").IStyledCompon
     hasError: boolean;
     height?: number;
     suffixWidth?: number;
-}>> & string;
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "disabled" | "height" | "hasError" | "isFocused" | "hasValue" | "centered" | "suffixWidth"> & {
+    isFocused: boolean;
+    hasValue: boolean;
+    disabled: boolean;
+    centered?: boolean;
+    hasError: boolean;
+    height?: number;
+    suffixWidth?: number;
+}, never>>> & string;

package/types/components/Flex/index.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes, CSSProperties } from 'react';
+import React, { HTMLAttributes, CSSProperties } from 'react';
 import { SCREEN_SIZE } from '../../shared/media-queries';
 /**
  * CSSPropertyWithResponsive is a type that allows a prop to be either:
@@ -24,5 +24,5 @@ export interface FlexProps {
     inlineChildren?: boolean;
 }
 export type Props = FlexProps & HTMLAttributes<HTMLDivElement>;
-declare const Flex: ({ direction, justify, align, gap, rowGap, wrap, basis, grow, shrink, inlineChildren, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const Flex: ({ direction, justify, align, gap, rowGap, wrap, basis, grow, shrink, inlineChildren, ...props }: Props) => React.JSX.Element;
 export default Flex;

package/types/components/FocusTrap.d.ts

@@ -5,4 +5,4 @@ export interface FocusTrapProps {
     autoFocusOnOpen?: 'firstElem' | 'firstInput' | 'none';
     restoreFocusOnClose?: boolean;
 }
-export declare const FocusTrap: ({ children, pause, autoFocusOnOpen, restoreFocusOnClose, }: FocusTrapProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FocusTrap: ({ children, pause, autoFocusOnOpen, restoreFocusOnClose, }: FocusTrapProps) => React.JSX.Element;

package/types/components/Hero/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ReactNode } from 'react';
 import { CSSProperties } from 'styled-components';
 type Justify = Exclude<CSSProperties['justifyContent'], number>;
@@ -49,5 +50,5 @@ export interface HeroProps {
     elementShadow?: boolean;
     childrenNoWrapper?: boolean;
 }
-declare const Hero: ({ imageProps, imageElement, videoProps, children, align, direction, justify, contentMaxWidth, heading, headingColor, subheading, button, dynamicGutter, isLoading, contentCentered, containerStyle, elementShadow, childrenNoWrapper, }: HeroProps) => import("react/jsx-runtime").JSX.Element;
+declare const Hero: ({ imageProps, imageElement, videoProps, children, align, direction, justify, contentMaxWidth, heading, headingColor, subheading, button, dynamicGutter, isLoading, contentCentered, containerStyle, elementShadow, childrenNoWrapper, }: HeroProps) => React.JSX.Element;
 export default Hero;

package/types/components/Icon/index.d.ts

@@ -9,5 +9,5 @@ export interface IconsProps {
     icons: IconModule[];
     size: string;
 }
-declare const Icons: ({ background, color, icons, size, }: IconsProps) => import("react/jsx-runtime").JSX.Element;
+declare const Icons: ({ background, color, icons, size, }: IconsProps) => React.JSX.Element;
 export default Icons;