@kvdbil/components 8.6.1 → 8.6.4

package/cjs/components/EditRow/index.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),l=require("../../theme.js"),r=require("../../typography/BodyText/index.js"),a=require("../Button/index.js"),n=require("../Chip/index.js"),u=require("../Textfield/index.js");function i(b){return b&&typeof b=="object"&&"default"in b?b:{default:b}}require("../../shared/media-queries.js"),require("../Spinner/index.js"),require("../../typography/ButtonText/index.js"),require("../Button/styles.js"),require("../../icons/components/CloseIcon.js"),require("../Chip/styles.js"),require("../FieldLabel.js"),require("../../shared/helpers.js");var o=i(e),d=i(t);const s=d.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),l=require("../../theme.js"),r=require("../../typography/BodyText/index.js"),a=require("../Button/index.js"),n=require("../Chip/index.js"),u=require("../Textfield/index.js");function i(b){return b&&typeof b=="object"&&"default"in b?b:{default:b}}require("../../shared/media-queries.js"),require("../Spinner/index.js"),require("../../typography/ButtonText/index.js"),require("../Button/styles.js"),require("../../icons/components/CloseIcon.js"),require("../Chip/styles.js"),require("../FieldLabel.js"),require("../../shared/helpers.js");var o=i(e),d=i(t);const f=d.default.div`
   display: flex;
   border-bottom: 1px solid ${l.default.colors.gray.light5};
-`,f=d.default.form`
+`,s=d.default.form`
   flex: 1;
   flex-direction: column;
   margin-bottom: 1rem;
@@ -19,13 +19,16 @@
   min-width: 5rem;
   margin-right: 1rem;
 `,y=d.default(r.BodyLink)`
-  margin-right: 4rem;
+  flex: 1;
+  margin-right: 1rem;
 `,h=d.default(r.BodyText)`
   flex: 1rem;
+  flex: 4;
 `,g=d.default(h)`
   color: ${l.default.colors.text.disabled};
 `,j=d.default.div`
   display: flex;
+  flex-wrap: wrap;
 `,v=d.default(n.Chip)`
-  margin: 0 0.25rem;
-`;exports.default=({value:b,label:T,onEdit:D,options:I=[],inputProps:M={},isClearable:O=!1,editText:V,saveText:z,cancelText:A,noValueText:G,formatterFunc:L,isSingleSelect:H,color:k="secondary"})=>{const[q,B]=e.useState(b),[J,K]=e.useState(b),[w,P]=e.useState(!1),S=typeof q=="string",N=L&&S?L(q):q,Q=S?N:q.join(", "),_=q.length>0,$=()=>{w?B(J):K(q),P(E=>!E)};return o.default.createElement(s,null,!w&&o.default.createElement(o.default.Fragment,null,o.default.createElement(y,null,T),_&&o.default.createElement(h,null,Q),!_&&o.default.createElement(g,null,G),o.default.createElement(a.Button,{variant:"flat",color:k,onClick:$},V)),w&&o.default.createElement(f,{onSubmit:E=>{E.preventDefault(),D==null||D(q),P(!1)}},o.default.createElement(y,null,T),S&&o.default.createElement(c,{...M,autoFocus:!0,value:q,label:T,onChange:E=>B(E.target.value)}),!S&&o.default.createElement(j,null,I.map(E=>o.default.createElement(v,{color:k,onClick:R=>{R.preventDefault(),(C=>{if(typeof q!="object")throw new Error("Cannot toggle chip on other than array");if(H)return q.includes(C)&&O?void B([]):void B([C]);if(q.includes(C)){const F=q.filter(U=>U!==C);B(F)}else B(F=>[...F,C])})(E)},key:E,variant:q.includes(E)?"solid":"outline"},E))),o.default.createElement(m,null,o.default.createElement(x,{type:"button",variant:"flat",color:"neutral",onClick:$},A),o.default.createElement(p,{type:"submit",color:k},z))))};
+  margin: 0.25rem;
+`;exports.default=({value:b,label:S,onChange:D,options:I=[],inputProps:M={},isClearable:O=!1,editText:V,saveText:z,cancelText:A,noValueText:G,formatterFunc:L,isSingleSelect:H,color:T="secondary"})=>{const[q,C]=e.useState(b),[J,K]=e.useState(b),[k,P]=e.useState(!1),w=typeof q=="string",N=L&&w?L(q):q,Q=w?N:q.join(", "),_=q.length>0,$=()=>{k?C(J):K(q),P(E=>!E)};return o.default.createElement(f,null,!k&&o.default.createElement(o.default.Fragment,null,o.default.createElement(y,null,S),_&&o.default.createElement(h,null,Q),!_&&o.default.createElement(g,null,G),o.default.createElement(a.Button,{variant:"flat",color:T,onClick:$},V)),k&&o.default.createElement(s,{onSubmit:E=>{E.preventDefault(),D==null||D(q),P(!1)}},o.default.createElement(y,null,S),w&&o.default.createElement(c,{...M,autoFocus:!0,value:q,label:S,onChange:E=>C(E.target.value)}),!w&&o.default.createElement(j,null,I.map(E=>o.default.createElement(v,{color:T,onClick:R=>{R.preventDefault(),(B=>{if(typeof q!="object")throw new Error("Cannot toggle chip on other than array");if(H)return q.includes(B)&&O?void C([]):void C([B]);if(q.includes(B)){const F=q.filter(U=>U!==B);C(F)}else C(F=>[...F,B])})(E)},key:E,variant:q.includes(E)?"solid":"outline"},E))),o.default.createElement(m,null,o.default.createElement(x,{type:"button",variant:"flat",color:"neutral",onClick:$},A),o.default.createElement(p,{type:"submit",color:T},z))))};

package/cjs/components/Select/index.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("react-select"),o=require("styled-components"),t=require("../../shared/constants.js"),a=require("../../theme.js"),l=require("../FieldLabel.js");function i(y){return y&&typeof y=="object"&&"default"in y?y:{default:y}}require("../../typography/BodyText/index.js"),require("../../shared/media-queries.js");var d=i(e),s=i(r),n=i(o);const u=n.default.div`
-  font-family: ${({theme:y})=>y.typography.fontBaseFamily};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("react-select"),o=require("styled-components"),t=require("../../shared/constants.js"),a=require("../../theme.js"),l=require("../../typography/BodyText/index.js"),d=require("../FieldLabel.js");function i($){return $&&typeof $=="object"&&"default"in $?$:{default:$}}require("../../shared/media-queries.js");var s=i(e),n=i(r),u=i(o);const c=u.default.div`
+  font-family: ${({theme:$})=>$.typography.fontBaseFamily};
   position: relative;
-`,c=y=>y&&{paddingLeft:"2.5rem"},f=y=>y&&{border:`1px solid ${a.default.colors.gray.light1}`,color:a.default.colors.gray.dark1,fill:a.default.colors.gray.light1},m=n.default.div`
+`,f=$=>$&&{paddingLeft:"2.5rem"},m=$=>$&&{border:`1px solid ${a.default.colors.gray.light1}`,color:a.default.colors.gray.dark1,fill:a.default.colors.gray.light1},p=$=>$&&{border:`2px solid ${a.default.colors.error.dark}`},h=u.default.div`
   position: absolute;
   z-index: 1;
   top: 0.5rem;
@@ -10,26 +10,24 @@
   fill: ${a.default.colors.gray.dark5};
   transition: ${t.DEFAULT_TRANSITION_MS};
 
-  ${y=>y.isDisabled&&`
+  ${$=>$.isDisabled&&`
     fill: ${a.default.colors.gray.light1};
 `}
 
-  ${y=>y.isFocused&&`
-    fill: ${y.theme.colors.text.dark};
+  ${$=>$.isFocused&&`
+    fill: ${$.theme.colors.text.dark};
 `}
-`,p=n.default.span`
+`,g=u.default.span`
+  ${l.CaptionStyle}
   display: block;
-  font-family: ${({theme:y})=>y.typography.fontBaseFamily};
-  font-size: 0.81rem;
   margin-top: 0.25rem;
-  margin-left: 0.85rem;
-  color: ${({hasError:y})=>y?a.default.colors.error.main:a.default.colors.text.disabled};
-`,h=n.default(y=>d.default.createElement("svg",{...y},d.default.createElement("symbol",{id:"icon-arrow",viewBox:"0 0 19 19"},d.default.createElement("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"})),d.default.createElement("use",{xlinkHref:"#icon-arrow"})))`
+  color: ${({hasError:$})=>$?a.default.colors.error.dark:a.default.colors.text.disabled};
+`,b=u.default($=>s.default.createElement("svg",{...$},s.default.createElement("symbol",{id:"icon-arrow",viewBox:"0 0 19 19"},s.default.createElement("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"})),s.default.createElement("use",{xlinkHref:"#icon-arrow"})))`
   width: 0.8rem;
   height: 0.8rem;
   margin: 0 0.5rem;
-  ${y=>y.$isFocused&&`color: ${y.$theme.colors.text.dark}`}
-  ${y=>y.$isDisabled&&`color: ${y.$theme.colors.gray.dark1}`}
+  ${$=>$.$isFocused&&`color: ${$.$theme.colors.text.dark}`}
+  ${$=>$.$isDisabled&&`color: ${$.$theme.colors.gray.dark1}`}
 
 
   path {
@@ -39,6 +37,6 @@
 
   transition: transform ${t.DEFAULT_TRANSITION_MS};
 
-  transform: ${y=>y.$isMenuOpen?"rotate(-180deg)":"rotate(0deg)"};
+  transform: ${$=>$.$isMenuOpen?"rotate(-180deg)":"rotate(0deg)"};
   transform-origin: 50% 60%;
-`,g=({selectProps:{menuIsOpen:y=!1},isFocused:D=!1,isDisabled:I})=>d.default.createElement(h,{$isDisabled:I,$isFocused:D,$isMenuOpen:y,$theme:a.default}),b=({className:y,color:D="primary",forwardRef:I,hasError:L=!1,height:v,helperText:C,isDisabled:S=!1,onBlur:M=()=>null,onFocus:N=()=>null,onInputChange:O=()=>null,placeholder:_="",name:B,...$})=>{var q;const[k,T]=e.useState(!1),[R,z]=e.useState(""),E=({isSelected:x,isFocused:F,isDisabled:w})=>x?a.default.colors[D].main:w?a.default.colors.background.light:F?a.default.colors.background.gray:a.default.colors.background.light,A=((x,F)=>F?a.default.colors.error.main:x?a.default.colors.text.dark:a.default.colors.gray.light1)(k,L);return d.default.createElement(u,{className:y},$.label&&d.default.createElement(l.Label,{htmlFor:B,height:v,isFocused:k,hasValue:Boolean($.value||R),disabled:S,theme:a.default,hasError:L},$.label),$.prefix&&d.default.createElement(m,{isDisabled:S,isFocused:k},$.prefix),d.default.createElement(s.default,{...$,inputId:B,name:B,ref:I,isDisabled:S,onInputChange:(x,F)=>{O(x,F),z(x)},placeholder:_,onFocus:x=>{T(!0),N(x)},onBlur:x=>{T(!1),M(x)},styles:{control:x=>({...x,borderRadius:0,color:a.default.colors.text.dark,fontFamily:a.default.typography.fontBaseFamily,fontSize:"1rem",fontWeight:400,cursor:"pointer",padding:"0.7rem 0.75rem",backgroundColor:a.default.colors.background.light,borderColor:A,boxShadow:"none",minHeight:"3rem","&:hover":{borderColor:"none"},...f(S),...c(Boolean($.prefix))}),placeholder:x=>({...x,display:k?"static":"none"}),singleValue:x=>({...x,maxWidth:"calc(100% - 3.3rem)",width:"calc(100% - 3.3rem)"}),menuList:x=>({...x,padding:"8px 0"}),menu:x=>({...x,borderRadius:0,boxShadow:a.default.elevations.elevation2,zIndex:2,padding:"0"}),option:(x,{isSelected:F,isFocused:w,isDisabled:j})=>({...x,padding:"1rem",cursor:j?"not-allowed":"pointer","&:hover":{background:E({isSelected:F,isFocused:!0,isDisabled:j})},background:E({isSelected:F,isFocused:w}),...c(Boolean($.prefix))}),valueContainer:x=>({...x,position:"static",padding:v?v-1+"rem 0 ":0,height:v?"auto":"21px"}),clearIndicator:x=>({...x,paddingTop:0,paddingBottom:0})},components:{IndicatorSeparator:()=>null,DropdownIndicator:g,...(q=$.components)!=null?q:{}}}),C&&d.default.createElement(p,{hasError:L},C))};exports.Select=b,exports.default=b;
+`,y=({selectProps:{menuIsOpen:$=!1},isFocused:C=!1,isDisabled:w})=>s.default.createElement(b,{$isDisabled:w,$isFocused:C,$isMenuOpen:$,$theme:a.default}),x=({className:$,color:C="primary",forwardRef:w,hasError:D=!1,height:E,helperText:T,isDisabled:I=!1,onBlur:O=()=>null,onFocus:_=()=>null,onInputChange:R=()=>null,placeholder:A="",name:B,...F})=>{var S;const[L,j]=e.useState(!1),[z,H]=e.useState(""),M=({isSelected:k,isFocused:v,isDisabled:q})=>k?a.default.colors[C].main:q?a.default.colors.background.light:v?a.default.colors.background.gray:a.default.colors.background.light,P=((k,v)=>v?a.default.colors.error.main:k?a.default.colors.text.dark:a.default.colors.gray.light1)(L,D);return s.default.createElement(c,{className:$},F.label&&s.default.createElement(d.Label,{htmlFor:B,height:E,isFocused:L,hasValue:Boolean(F.value||z),disabled:I,theme:a.default,hasError:D},F.label),F.prefix&&s.default.createElement(h,{isDisabled:I,isFocused:L},F.prefix),s.default.createElement(n.default,{...F,inputId:B,name:B,ref:w,isDisabled:I,onInputChange:(k,v)=>{R(k,v),H(k)},placeholder:A,onFocus:k=>{j(!0),_(k)},onBlur:k=>{j(!1),O(k)},styles:{control:k=>({...k,borderRadius:0,color:a.default.colors.text.dark,fontFamily:a.default.typography.fontBaseFamily,fontSize:"1rem",fontWeight:400,cursor:"pointer",padding:"0.7rem 0.75rem",backgroundColor:a.default.colors.background.light,borderColor:P,boxShadow:"none",minHeight:"3rem","&:hover":{borderColor:"none"},...m(I),...p(D),...f(Boolean(F.prefix))}),placeholder:k=>({...k,display:L?"static":"none"}),singleValue:k=>({...k,maxWidth:"calc(100% - 3.3rem)",width:"calc(100% - 3.3rem)"}),menuList:k=>({...k,padding:"8px 0"}),menu:k=>({...k,borderRadius:0,boxShadow:a.default.elevations.elevation2,zIndex:2,padding:"0"}),option:(k,{isSelected:v,isFocused:q,isDisabled:N})=>({...k,padding:"1rem",cursor:N?"not-allowed":"pointer","&:hover":{background:M({isSelected:v,isFocused:!0,isDisabled:N})},background:M({isSelected:v,isFocused:q}),...f(Boolean(F.prefix))}),valueContainer:k=>({...k,position:"static",padding:E?E-1+"rem 0 ":0,height:E?"auto":"21px"}),clearIndicator:k=>({...k,paddingTop:0,paddingBottom:0})},components:{IndicatorSeparator:()=>null,DropdownIndicator:y,...(S=F.components)!=null?S:{}}}),T&&s.default.createElement(g,{hasError:D},T))};exports.Select=x,exports.default=x;

package/esm/components/EditRow/index.js

@@ -1,6 +1,6 @@
-import t,{useState as c}from"react";import r from"styled-components";import x from"../../theme.js";import{BodyLink as $,BodyText as q}from"../../typography/BodyText/index.js";import{Button as d}from"../Button/index.js";import{Chip as N}from"../Chip/index.js";import{TextField as O}from"../Textfield/index.js";import"../../shared/media-queries.js";import"../Spinner/index.js";import"../../typography/ButtonText/index.js";import"../Button/styles.js";import"../../icons/components/CloseIcon.js";import"../Chip/styles.js";import"../FieldLabel.js";import"../../shared/helpers.js";const z=r.div`
+import t,{useState as c}from"react";import r from"styled-components";import y from"../../theme.js";import{BodyLink as $,BodyText as q}from"../../typography/BodyText/index.js";import{Button as d}from"../Button/index.js";import{Chip as N}from"../Chip/index.js";import{TextField as O}from"../Textfield/index.js";import"../../shared/media-queries.js";import"../Spinner/index.js";import"../../typography/ButtonText/index.js";import"../Button/styles.js";import"../../icons/components/CloseIcon.js";import"../Chip/styles.js";import"../FieldLabel.js";import"../../shared/helpers.js";const z=r.div`
   display: flex;
-  border-bottom: 1px solid ${x.colors.gray.light5};
+  border-bottom: 1px solid ${y.colors.gray.light5};
 `,A=r.form`
   flex: 1;
   flex-direction: column;
@@ -19,13 +19,16 @@ import t,{useState as c}from"react";import r from"styled-components";import x fr
   min-width: 5rem;
   margin-right: 1rem;
 `,E=r($)`
-  margin-right: 4rem;
+  flex: 1;
+  margin-right: 1rem;
 `,j=r(q)`
   flex: 1rem;
+  flex: 4;
 `,M=r(j)`
-  color: ${x.colors.text.disabled};
+  color: ${y.colors.text.disabled};
 `,P=r.div`
   display: flex;
+  flex-wrap: wrap;
 `,Q=r(N)`
-  margin: 0 0.25rem;
-`,U=({value:u,label:s,onEdit:p,options:C=[],inputProps:v={},isClearable:B=!1,editText:b,saveText:w,cancelText:S,noValueText:F,formatterFunc:f,isSingleSelect:T,color:a="secondary"})=>{const[n,o]=c(u),[V,k]=c(u),[m,h]=c(!1),i=typeof n=="string",L=f&&i?f(n):n,D=i?L:n.join(", "),g=n.length>0,y=()=>{m?o(V):k(n),h(e=>!e)},I=e=>{e.preventDefault(),p==null||p(n),h(!1)},R=e=>{if(typeof n!="object")throw new Error("Cannot toggle chip on other than array");if(T){if(n.includes(e)&&B){o([]);return}o([e]);return}if(n.includes(e)){const l=n.filter(_=>_!==e);o(l);return}o(l=>[...l,e])};return t.createElement(z,null,!m&&t.createElement(t.Fragment,null,t.createElement(E,null,s),g&&t.createElement(j,null,D),!g&&t.createElement(M,null,F),t.createElement(d,{variant:"flat",color:a,onClick:y},b)),m&&t.createElement(A,{onSubmit:I},t.createElement(E,null,s),i&&t.createElement(G,{...v,autoFocus:!0,value:n,label:s,onChange:e=>o(e.target.value)}),!i&&t.createElement(P,null,C.map(e=>t.createElement(Q,{color:a,onClick:l=>{l.preventDefault(),R(e)},key:e,variant:n.includes(e)?"solid":"outline"},e))),t.createElement(H,null,t.createElement(K,{type:"button",variant:"flat",color:"neutral",onClick:y},S),t.createElement(J,{type:"submit",color:a},w))))};export{U as default};
+  margin: 0.25rem;
+`,U=({value:u,label:s,onChange:f,options:v=[],inputProps:C={},isClearable:B=!1,editText:b,saveText:w,cancelText:S,noValueText:F,formatterFunc:p,isSingleSelect:T,color:a="secondary"})=>{const[n,l]=c(u),[V,k]=c(u),[m,h]=c(!1),i=typeof n=="string",L=p&&i?p(n):n,D=i?L:n.join(", "),x=n.length>0,g=()=>{m?l(V):k(n),h(e=>!e)},I=e=>{e.preventDefault(),f==null||f(n),h(!1)},R=e=>{if(typeof n!="object")throw new Error("Cannot toggle chip on other than array");if(T){if(n.includes(e)&&B){l([]);return}l([e]);return}if(n.includes(e)){const o=n.filter(_=>_!==e);l(o);return}l(o=>[...o,e])};return t.createElement(z,null,!m&&t.createElement(t.Fragment,null,t.createElement(E,null,s),x&&t.createElement(j,null,D),!x&&t.createElement(M,null,F),t.createElement(d,{variant:"flat",color:a,onClick:g},b)),m&&t.createElement(A,{onSubmit:I},t.createElement(E,null,s),i&&t.createElement(G,{...C,autoFocus:!0,value:n,label:s,onChange:e=>l(e.target.value)}),!i&&t.createElement(P,null,v.map(e=>t.createElement(Q,{color:a,onClick:o=>{o.preventDefault(),R(e)},key:e,variant:n.includes(e)?"solid":"outline"},e))),t.createElement(H,null,t.createElement(K,{type:"button",variant:"flat",color:"neutral",onClick:g},S),t.createElement(J,{type:"submit",color:a},w))))};export{U as default};

package/esm/components/Select/index.js

@@ -1,14 +1,14 @@
-import t,{useState as x}from"react";import T from"react-select";import d from"styled-components";import{DEFAULT_TRANSITION_MS as F}from"../../shared/constants.js";import r from"../../theme.js";import{Label as _}from"../FieldLabel.js";import"../../typography/BodyText/index.js";import"../../shared/media-queries.js";const z=d.div`
+import t,{useState as x}from"react";import T from"react-select";import m from"styled-components";import{DEFAULT_TRANSITION_MS as k}from"../../shared/constants.js";import r from"../../theme.js";import{CaptionStyle as _}from"../../typography/BodyText/index.js";import{Label as A}from"../FieldLabel.js";import"../../shared/media-queries.js";const M=m.div`
   font-family: ${({theme:e})=>e.typography.fontBaseFamily};
   position: relative;
-`,k=e=>e&&{paddingLeft:"2.5rem"},A=e=>e&&{border:`1px solid ${r.colors.gray.light1}`,color:r.colors.gray.dark1,fill:r.colors.gray.light1},M=d.div`
+`,F=e=>e&&{paddingLeft:"2.5rem"},O=e=>e&&{border:`1px solid ${r.colors.gray.light1}`,color:r.colors.gray.dark1,fill:r.colors.gray.light1},z=e=>e&&{border:`2px solid ${r.colors.error.dark}`},H=m.div`
   position: absolute;
   z-index: 1;
   top: 0.5rem;
   margin: 0.35rem 0.75rem;
 
   fill: ${r.colors.gray.dark5};
-  transition: ${F};
+  transition: ${k};
 
   ${e=>e.isDisabled&&`
     fill: ${r.colors.gray.light1};
@@ -17,14 +17,12 @@ import t,{useState as x}from"react";import T from"react-select";import d from"st
   ${e=>e.isFocused&&`
     fill: ${e.theme.colors.text.dark};
 `}
-`,O=d.span`
+`,V=m.span`
+  ${_}
   display: block;
-  font-family: ${({theme:e})=>e.typography.fontBaseFamily};
-  font-size: 0.81rem;
   margin-top: 0.25rem;
-  margin-left: 0.85rem;
-  color: ${({hasError:e})=>e?r.colors.error.main:r.colors.text.disabled};
-`,H=e=>t.createElement("svg",{...e},t.createElement("symbol",{id:"icon-arrow",viewBox:"0 0 19 19"},t.createElement("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"})),t.createElement("use",{xlinkHref:"#icon-arrow"})),V=d(H)`
+  color: ${({hasError:e})=>e?r.colors.error.dark:r.colors.text.disabled};
+`,N=e=>t.createElement("svg",{...e},t.createElement("symbol",{id:"icon-arrow",viewBox:"0 0 19 19"},t.createElement("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"})),t.createElement("use",{xlinkHref:"#icon-arrow"})),P=m(N)`
   width: 0.8rem;
   height: 0.8rem;
   margin: 0 0.5rem;
@@ -37,8 +35,8 @@ import t,{useState as x}from"react";import T from"react-select";import d from"st
     stroke: currentColor;
   }
 
-  transition: transform ${F};
+  transition: transform ${k};
 
   transform: ${e=>e.$isMenuOpen?"rotate(-180deg)":"rotate(0deg)"};
   transform-origin: 50% 60%;
-`,N=(e,l)=>l?r.colors.error.main:e?r.colors.text.dark:r.colors.gray.light1,P=({selectProps:{menuIsOpen:e=!1},isFocused:l=!1,isDisabled:m})=>t.createElement(V,{$isDisabled:m,$isFocused:l,$isMenuOpen:e,$theme:r}),C=({className:e,color:l="primary",forwardRef:m,hasError:u=!1,height:i,helperText:p,isDisabled:s=!1,onBlur:v=()=>null,onFocus:B=()=>null,onInputChange:w=()=>null,placeholder:I="",name:g,...n})=>{var h;const[c,y]=x(!1),[L,S]=x(""),E=(o,a)=>{w(o,a),S(o)},b=({isSelected:o,isFocused:a,isDisabled:f})=>o?r.colors[l].main:f?r.colors.background.light:a?r.colors.background.gray:r.colors.background.light,j=o=>{y(!0),B(o)},D=o=>{y(!1),v(o)},R=N(c,u);return t.createElement(z,{className:e},n.label&&t.createElement(_,{htmlFor:g,height:i,isFocused:c,hasValue:Boolean(n.value||L),disabled:s,theme:r,hasError:u},n.label),n.prefix&&t.createElement(M,{isDisabled:s,isFocused:c},n.prefix),t.createElement(T,{...n,inputId:g,name:g,ref:m,isDisabled:s,onInputChange:E,placeholder:I,onFocus:j,onBlur:D,styles:{control:o=>({...o,borderRadius:0,color:r.colors.text.dark,fontFamily:r.typography.fontBaseFamily,fontSize:"1rem",fontWeight:400,cursor:"pointer",padding:"0.7rem 0.75rem",backgroundColor:r.colors.background.light,borderColor:R,boxShadow:"none",minHeight:"3rem","&:hover":{borderColor:"none"},...A(s),...k(Boolean(n.prefix))}),placeholder:o=>({...o,display:c?"static":"none"}),singleValue:o=>({...o,maxWidth:"calc(100% - 3.3rem)",width:"calc(100% - 3.3rem)"}),menuList:o=>({...o,padding:"8px 0"}),menu:o=>({...o,borderRadius:0,boxShadow:r.elevations.elevation2,zIndex:2,padding:"0"}),option:(o,{isSelected:a,isFocused:f,isDisabled:$})=>({...o,padding:"1rem",cursor:$?"not-allowed":"pointer","&:hover":{background:b({isSelected:a,isFocused:!0,isDisabled:$})},background:b({isSelected:a,isFocused:f}),...k(Boolean(n.prefix))}),valueContainer:o=>({...o,position:"static",padding:i?`${i-1}rem 0 `:0,height:i?"auto":"21px"}),clearIndicator:o=>({...o,paddingTop:0,paddingBottom:0})},components:{IndicatorSeparator:()=>null,DropdownIndicator:P,...(h=n.components)!=null?h:{}}}),p&&t.createElement(O,{hasError:u},p))};export{C as Select,C as default};
+`,W=(e,a)=>a?r.colors.error.main:e?r.colors.text.dark:r.colors.gray.light1,q=({selectProps:{menuIsOpen:e=!1},isFocused:a=!1,isDisabled:u})=>t.createElement(P,{$isDisabled:u,$isFocused:a,$isMenuOpen:e,$theme:r}),C=({className:e,color:a="primary",forwardRef:u,hasError:i=!1,height:s,helperText:p,isDisabled:c=!1,onBlur:v=()=>null,onFocus:S=()=>null,onInputChange:w=()=>null,placeholder:B="",name:g,...n})=>{var h;const[d,y]=x(!1),[I,L]=x(""),E=(o,l)=>{w(o,l),L(o)},b=({isSelected:o,isFocused:l,isDisabled:f})=>o?r.colors[a].main:f?r.colors.background.light:l?r.colors.background.gray:r.colors.background.light,j=o=>{y(!0),S(o)},D=o=>{y(!1),v(o)},R=W(d,i);return t.createElement(M,{className:e},n.label&&t.createElement(A,{htmlFor:g,height:s,isFocused:d,hasValue:Boolean(n.value||I),disabled:c,theme:r,hasError:i},n.label),n.prefix&&t.createElement(H,{isDisabled:c,isFocused:d},n.prefix),t.createElement(T,{...n,inputId:g,name:g,ref:u,isDisabled:c,onInputChange:E,placeholder:B,onFocus:j,onBlur:D,styles:{control:o=>({...o,borderRadius:0,color:r.colors.text.dark,fontFamily:r.typography.fontBaseFamily,fontSize:"1rem",fontWeight:400,cursor:"pointer",padding:"0.7rem 0.75rem",backgroundColor:r.colors.background.light,borderColor:R,boxShadow:"none",minHeight:"3rem","&:hover":{borderColor:"none"},...O(c),...z(i),...F(Boolean(n.prefix))}),placeholder:o=>({...o,display:d?"static":"none"}),singleValue:o=>({...o,maxWidth:"calc(100% - 3.3rem)",width:"calc(100% - 3.3rem)"}),menuList:o=>({...o,padding:"8px 0"}),menu:o=>({...o,borderRadius:0,boxShadow:r.elevations.elevation2,zIndex:2,padding:"0"}),option:(o,{isSelected:l,isFocused:f,isDisabled:$})=>({...o,padding:"1rem",cursor:$?"not-allowed":"pointer","&:hover":{background:b({isSelected:l,isFocused:!0,isDisabled:$})},background:b({isSelected:l,isFocused:f}),...F(Boolean(n.prefix))}),valueContainer:o=>({...o,position:"static",padding:s?`${s-1}rem 0 `:0,height:s?"auto":"21px"}),clearIndicator:o=>({...o,paddingTop:0,paddingBottom:0})},components:{IndicatorSeparator:()=>null,DropdownIndicator:q,...(h=n.components)!=null?h:{}}}),p&&t.createElement(V,{hasError:i},p))};export{C as Select,C as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kvdbil/components",
-  "version": "8.6.1",
+  "version": "8.6.4",
   "sideEffects": false,
   "main": "cjs/index.js",
   "module": "esm/index.js",

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

@@ -1,7 +1,6 @@
-import React from 'react';
 import { Color } from '../../Types';
 import { TextFieldProps } from '../Textfield';
-export interface EditRowProps {
+export interface EditRowProps<T> {
     value: string | string[];
     label: string;
     editText: string;
@@ -13,8 +12,8 @@ export interface EditRowProps {
     isSingleSelect?: boolean;
     inputProps?: TextFieldProps;
     isClearable?: boolean;
-    onEdit?<T>(value: T): void;
+    onChange?(value: T): void;
     formatterFunc?(value: string): string;
 }
-declare const EditRow: React.FC<EditRowProps>;
+declare const EditRow: <T extends string | string[]>({ value: initialValue, label, onChange, options, inputProps, isClearable, editText, saveText, cancelText, noValueText, formatterFunc, isSingleSelect, color, }: EditRowProps<T>) => JSX.Element;
 export default EditRow;