@bikdotai/bik-component-library 0.0.736-beta.0 → 0.0.736-beta.10

package/dist/esm/components/floating-input-dropdown/FloatingInputDropdown.js

@@ -1,5 +1,5 @@
-import{jsxs as e,Fragment as o,jsx as n}from"react/jsx-runtime";import{useRef as t,useState as i,useEffect as r}from"react";import{usePopper as l}from"react-popper";import s from"styled-components";import{DropShadow as p}from"../dropShadow/DropShadow.js";import{OpenDropdownContainer as c}from"../dropdown/Common.styled.js";import{OpenedDropdown as d}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{Floater as a}from"../floater/floater.js";import{Input as m}from"../input/Input.js";const u=s(c)`
-	opacity: ${e=>{let{visible:o}=e;return o?1:0}};
-	visibility: ${e=>{let{visible:o}=e;return o?"visible":"hidden"}};
+import{jsxs as e,Fragment as o,jsx as n}from"react/jsx-runtime";import{useRef as t,useState as i,useEffect as r}from"react";import{usePopper as l}from"react-popper";import s from"styled-components";import{DropShadow as p}from"../dropShadow/DropShadow.js";import{OpenDropdownContainer as d}from"../dropdown/Common.styled.js";import{OpenedDropdown as c}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{Floater as a}from"../floater/floater.js";import{Input as m}from"../input/Input.js";const u=s(d)`
+	opacity: ${({visible:e})=>e?1:0};
+	visibility: ${({visible:e})=>e?"visible":"hidden"};
 	transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
-`,f=s=>{let{inputProps:c,dropdownProps:f,floaterProps:v,children:b,isVisible:g,onDropdownOptionClick:h,onChangeText:j}=s;const O=t(null),w=t(null),[y,C]=i(!1),[S,D]=i(null),[x,k]=i(null),[z,P]=i(!1),{styles:R,attributes:T,update:I,forceUpdate:M}=l(x,S,{placement:f.placement,strategy:f.strategy,modifiers:[{name:"offset",options:{offset:[0,0]}},{name:"preventOverflow",options:{padding:{top:0,bottom:10,left:0,right:0}}},{name:"flip",options:{fallbackPlacements:["bottom","top"]}}]});r((()=>{if(!y){const e=setTimeout((()=>P(!1)),200);return()=>clearTimeout(e)}P(!0),I&&I()}),[y,I]),r((()=>{if(O.current){const e=new ResizeObserver((()=>{I&&I()}));return e.observe(O.current),()=>{e.disconnect()}}}),[O.current,I]);return e(o,{children:[g&&e(a,Object.assign({},v,{refElement:w},{children:[n("div",Object.assign({style:{position:"relative"},ref:k},{children:n(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:n(m,Object.assign({},c,{onClick:()=>{var e;null===(e=f.onDropdownOpen)||void 0===e||e.call(f),y?C(!1):f.disabled||C(!0),null==M||M()},ref:O,onChangeText:(e,o)=>{null==j||j(e,o),I&&I()}}))}))})),n(u,Object.assign({ref:D,style:Object.assign(Object.assign({},R.popper),{zIndex:3})},T.popper,{visible:y||z},{children:n(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:n(d,Object.assign({},f,{onSelect:e=>{var o;"2.0"===f.version&&f.isMultiSelect||(null===(o=f.onSelect)||void 0===o||o.call(f,e),C(!1))},onClose:e=>{var o,n;"2.0"===f.version&&f.isMultiSelect&&e&&(null===(o=f.onSelect)||void 0===o||o.call(f,[...e])),C(!1),null===(n=null==f?void 0:f.onClose)||void 0===n||n.call(f)},version:f.version,headerRef:O,onDropdownItemClick:e=>{null==h||h(e)}}))}))}))]})),n("div",Object.assign({ref:w},{children:b&&n("div",{children:b})}))]})};export{f as FloatingInputDropdown};
+`,f=({inputProps:s,dropdownProps:d,floaterProps:f,children:v,isVisible:b,onDropdownOptionClick:h,onChangeText:w})=>{const y=t(null),g=t(null),[j,O]=i(!1),[C,S]=i(null),[D,x]=i(null),[k,z]=i(!1),{styles:P,attributes:R,update:T,forceUpdate:I}=l(D,C,{placement:d.placement,strategy:d.strategy,modifiers:[{name:"offset",options:{offset:[0,0]}},{name:"preventOverflow",options:{padding:{top:0,bottom:10,left:0,right:0}}},{name:"flip",options:{fallbackPlacements:["bottom","top"]}}]});r(()=>{if(!j){const e=setTimeout(()=>z(!1),200);return()=>clearTimeout(e)}z(!0),T&&T()},[j,T]),r(()=>{if(y.current){const e=new ResizeObserver(()=>{T&&T()});return e.observe(y.current),()=>{e.disconnect()}}},[y.current,T]);return e(o,{children:[b&&e(a,Object.assign({},f,{refElement:g,children:[n("div",{style:{position:"relative"},ref:x,children:n(p,{level:"z2",position:"down",style:{borderRadius:8},children:n(m,Object.assign({},s,{onClick:()=>{var e;null===(e=d.onDropdownOpen)||void 0===e||e.call(d),j?O(!1):d.disabled||O(!0),null==I||I()},ref:y,onChangeText:(e,o)=>{null==w||w(e,o),T&&T()}}))})}),n(u,Object.assign({ref:S,style:Object.assign(Object.assign({},P.popper),{zIndex:3})},R.popper,{visible:j||k,children:n(p,{level:"z2",position:"down",style:{borderRadius:8},children:n(c,Object.assign({},d,{onSelect:e=>{var o;"2.0"===d.version&&d.isMultiSelect||(null===(o=d.onSelect)||void 0===o||o.call(d,e),O(!1))},onClose:e=>{var o,n;"2.0"===d.version&&d.isMultiSelect&&e&&(null===(o=d.onSelect)||void 0===o||o.call(d,[...e])),O(!1),null===(n=null==d?void 0:d.onClose)||void 0===n||n.call(d)},version:d.version,headerRef:y,onDropdownItemClick:e=>{null==h||h(e)}}))})}))]})),n("div",{ref:g,children:v&&n("div",{children:v})})]})};export{f as FloatingInputDropdown};

package/dist/esm/components/icon-button/IconButton.js

@@ -1 +1 @@
-import{__rest as t}from"../../_virtual/_tslib.js";import{jsx as e}from"react/jsx-runtime";import o,{forwardRef as i}from"react";import{Tooltip as l}from"../tooltips/Tooltip.js";import{IconButton as s}from"./IconButton.styled.js";import{getIconColor as r}from"./theme.js";const d=i(((i,d)=>{var{id:n,iconButtonType:c="default",Icon:a,height:p=20,width:b=20,bordered:m,disabled:y,isSelected:h,style:u,svgStyle:g,iconColor:j,disabledTooltip:f}=i,B=t(i,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style","svgStyle","iconColor","disabledTooltip"]);const T=r(c,y,h),I=e(s,Object.assign({id:n,ref:d,style:u,iconButtonType:c,bordered:m,disabled:y,isSelected:h},B,{children:o.createElement(a,{height:p,width:b,color:j||T,style:Object.assign({display:"block"},null!=g?g:{})})}));return y&&f?e(l,Object.assign({body:f},{children:e("span",Object.assign({style:{display:"inline-block",cursor:"not-allowed"}},{children:I}))})):I}));d.displayName="IconButton";export{d as IconButton};
+import{__rest as t}from"../../_virtual/_tslib.js";import{jsx as e}from"react/jsx-runtime";import o,{forwardRef as i}from"react";import{Tooltip as l}from"../tooltips/Tooltip.js";import{IconButton as r}from"./IconButton.styled.js";import{getIconColor as d}from"./theme.js";const s=i((i,s)=>{var{id:n,iconButtonType:c="default",Icon:a,height:p=20,width:m=20,bordered:y,disabled:b,isSelected:h,style:u,svgStyle:f,iconColor:g,disabledTooltip:j}=i,B=t(i,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style","svgStyle","iconColor","disabledTooltip"]);const T=d(c,b,h),I=e(r,Object.assign({id:n,ref:s,style:u,iconButtonType:c,bordered:y,disabled:b,isSelected:h},B,{children:o.createElement(a,{height:p,width:m,color:g||T,style:Object.assign({display:"block"},null!=f?f:{})})}));return b&&j?e(l,{body:j,children:e("span",{style:{display:"inline-block",cursor:"not-allowed"},children:I})}):I});s.displayName="IconButton";export{s as IconButton};

package/dist/esm/components/icon-button/IconButton.styled.js

@@ -1,3 +1,3 @@
 import t from"styled-components";import{COLORS as n}from"../../constants/Theme.js";import{generateBackgroundColor as o}from"./theme.js";const r=t.button`
-	${t=>`\n\tall: unset;\n\tcursor: pointer;\n\tpadding: 6px;\n\tborder-radius: 4px;\n\tflex-wrap: wrap;\n\t${t.bordered&&"ai"!==t.iconButtonType?`border: 1px solid ${n.stroke.primary};`:""}\n\t${t.isSelected?`\n\t\t\tbackground: ${o(t.iconButtonType)};\n\t\t\t\t`:"\n\t\t\t\t:hover {\n\t\t\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t\t\t}\n\t\t\t"}\n\t${t.disabled&&"\n\t\t\tcursor: not-allowed !important;\n\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t"}\n\n\t`}
+	${t=>`\n\tall: unset;\n\tcursor: pointer;\n\tpadding: 6px;\n\tborder-radius: 4px;\n\tflex-wrap: wrap;\n\t${t.bordered&&"ai"!==t.iconButtonType?`border: 1px solid ${n.stroke.primary};`:""}\n\t${t.isSelected?`\n\t\t\tbackground: ${o(t.iconButtonType)};\n\t\t\t\t`:"\n\t\t\t\t&:hover {\n\t\t\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t\t\t}\n\t\t\t"}\n\t${t.disabled&&"\n\t\t\tcursor: not-allowed !important;\n\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t"}\n\n\t`}
 `;export{r as IconButton};

package/dist/esm/components/image-compress/ImageCompress.js

@@ -1 +1 @@
-import{__awaiter as e}from"../../_virtual/_tslib.js";import r from"browser-image-compression";class t{}Object.defineProperty(t,"base64ToImage",{enumerable:!0,configurable:!0,writable:!0,value:e=>{const r=atob(e.split(",")[1]),t=e.split(",")[0].split(":")[1].split(";")[0],i=new ArrayBuffer(r.length),o=new Uint8Array(i);for(let e=0;e<r.length;e++)o[e]=r.charCodeAt(e);const l=new Blob([i],{type:t});return new File([l],"image",{type:t})}}),Object.defineProperty(t,"compressImage",{enumerable:!0,configurable:!0,writable:!0,value:(t,i)=>e(void 0,void 0,void 0,(function*(){let e=t,o="";const l=i?i.maxSizeMB:t.size/1024/1024*.8;try{const i={maxSizeMB:l,maxWidthOrHeight:1920,useWebWorker:!0};t.size/1024/1024>.1&&(e=yield r(t,i)),o=yield r.getDataUrlFromFile(e)}catch(e){console.error(e)}return{base64:o,compressedFile:e}}))});export{t as ImageService};
+import{__awaiter as e}from"../../_virtual/_tslib.js";import r from"browser-image-compression";class t{}Object.defineProperty(t,"base64ToImage",{enumerable:!0,configurable:!0,writable:!0,value:e=>{const r=atob(e.split(",")[1]),t=e.split(",")[0].split(":")[1].split(";")[0],i=new ArrayBuffer(r.length),o=new Uint8Array(i);for(let e=0;e<r.length;e++)o[e]=r.charCodeAt(e);const l=new Blob([i],{type:t});return new File([l],"image",{type:t})}}),Object.defineProperty(t,"compressImage",{enumerable:!0,configurable:!0,writable:!0,value:(t,i)=>e(void 0,void 0,void 0,function*(){let e=t,o="";const l=i?i.maxSizeMB:t.size/1024/1024*.8;try{const i={maxSizeMB:l,maxWidthOrHeight:1920,useWebWorker:!0};t.size/1024/1024>.1&&(e=yield r(t,i)),o=yield r.getDataUrlFromFile(e)}catch(e){console.error(e)}return{base64:o,compressedFile:e}})});export{t as ImageService};

package/dist/esm/components/image-cropper/BikImageCropper.js

@@ -1 +1 @@
-import{__awaiter as t}from"../../_virtual/_tslib.js";import{jsx as e}from"react/jsx-runtime";import{useState as i}from"react";import o from"react-image-crop";import{StyledModal as r}from"../modals/styledModal.js";const n=n=>{const[a,d]=i(!1),[l,c]=i(void 0),[h,s]=i({width:0,height:0}),[g,m]=i(!1),p=(e,i,o,r)=>t(void 0,void 0,void 0,(function*(){const t=document.createElement("canvas");t.width=i.width,t.height=i.height;const n=t.getContext("2d");if(!n)throw new Error("Failed to get 2D context of canvas.");n.drawImage(e,i.x*o,i.y*r,i.width*o,i.height*r,0,0,i.width,i.height);try{return t.toDataURL("image/png")}catch(t){throw new Error("Failed to create blob for cropped image.")}}));return e(r,Object.assign({open:!0,onClose:n.onCancel,centralContainerStyles:{width:700,maxHeight:700},headingTitle:"Crop Image",primaryButton:{buttonText:"Save",isLoading:g,onClick:()=>{var e;e=l,t(void 0,void 0,void 0,(function*(){var t,i;if(m(!0),n.src&&(null==e?void 0:e.width)&&(null==e?void 0:e.height)){const i=new Image;i.src=n.src;const o=i.naturalWidth/h.width,r=i.naturalHeight/h.height,d=yield p(i,e,o,r);yield null===(t=null==n?void 0:n.onCropComplete)||void 0===t?void 0:t.call(n,d,a)}else yield null===(i=null==n?void 0:n.onCropComplete)||void 0===i?void 0:i.call(n,n.src,a);m(!1)}))}}},{children:e("div",Object.assign({style:{width:"100%",height:"100%",display:"flex",justifyContent:"center",alignItems:"center"}},{children:e("div",{children:e(o,Object.assign({crop:l,onChange:t=>{c(t)},circularCrop:!1,onDragStart:()=>{d(!0)},aspect:n.aspectRatio},{children:e("img",{style:{maxWidth:700,maxHeight:550,objectFit:"contain"},src:n.src,alt:"image cropper",onLoad:t=>{const e=t.target,i=e.width;s({width:i,height:e.height})}})}))})}))}))};export{n as BikImageCropper,n as default};
+import{__awaiter as t}from"../../_virtual/_tslib.js";import{jsx as e}from"react/jsx-runtime";import{useState as i}from"react";import o from"react-image-crop";import{StyledModal as r}from"../modals/styledModal.js";const n=n=>{const[a,d]=i(!1),[l,c]=i(void 0),[h,s]=i({width:0,height:0}),[g,m]=i(!1),p=(e,i,o,r)=>t(void 0,void 0,void 0,function*(){const t=document.createElement("canvas");t.width=i.width,t.height=i.height;const n=t.getContext("2d");if(!n)throw new Error("Failed to get 2D context of canvas.");n.drawImage(e,i.x*o,i.y*r,i.width*o,i.height*r,0,0,i.width,i.height);try{return t.toDataURL("image/png")}catch(t){throw new Error("Failed to create blob for cropped image.")}});return e(r,{open:!0,onClose:n.onCancel,centralContainerStyles:{width:700,maxHeight:700},headingTitle:"Crop Image",primaryButton:{buttonText:"Save",isLoading:g,onClick:()=>{var e;e=l,t(void 0,void 0,void 0,function*(){var t,i;if(m(!0),n.src&&(null==e?void 0:e.width)&&(null==e?void 0:e.height)){const i=new Image;i.src=n.src;const o=i.naturalWidth/h.width,r=i.naturalHeight/h.height,d=yield p(i,e,o,r);yield null===(t=null==n?void 0:n.onCropComplete)||void 0===t?void 0:t.call(n,d,a)}else yield null===(i=null==n?void 0:n.onCropComplete)||void 0===i?void 0:i.call(n,n.src,a);m(!1)})}},children:e("div",{style:{width:"100%",height:"100%",display:"flex",justifyContent:"center",alignItems:"center"},children:e("div",{children:e(o,{crop:l,onChange:t=>{c(t)},circularCrop:!1,onDragStart:()=>{d(!0)},aspect:n.aspectRatio,children:e("img",{style:{maxWidth:700,maxHeight:550,objectFit:"contain"},src:n.src,alt:"image cropper",onLoad:t=>{const e=t.target,i=e.width;s({width:i,height:e.height})}})})})})})};export{n as BikImageCropper,n as default};

package/dist/esm/components/image-cropper/BikImagePipeline/BikImagePipeline.js

@@ -1 +1 @@
-import{jsx as o,Fragment as e,jsxs as r}from"react/jsx-runtime";import{useRef as t,useState as s,useEffect as a,useCallback as i}from"react";import{ImageService as l}from"../../image-compress/ImageCompress.js";import{StateInterface as p}from"../../states/StateComponent.js";import"../../../_virtual/_tslib.js";import{StateModalComponent as n}from"../../states-modal/StateModalComponent.js";import"../../modals/styledModal.js";import{BikImageCropper as c}from"../BikImageCropper.js";const d=d=>{let{cropOptions:m,fileTitle:u,compressionOptions:g,currentImage:h,options:f,onFinish:C,onCancel:w,fileUploadOptions:y,loadingStateOptions:I}=d;const b=t(null),[j,v]=s(),[F,R]=s(h),[O,T]=s(!1);a((()=>{f.upload?(v("upload"),setTimeout((()=>{B()}),500)):f.crop?v("crop"):f.compress?v("compress"):f.uploadToFirestorage?v("cloud-upload"):T(!0)}),[f.upload,f.crop,f.compress,f.uploadToFirestorage]);const E=i(((o,e)=>{if(!f.uploadToFirestorage)return C(o,e),void T(!0);v("cloud-upload"),y&&y.uploadFile(e,y.path).then((r=>{C(o,e,r),T(!0)})).catch((o=>{console.log("starting err process with ")}))}),[]),k=o=>{o||w();const e=l.base64ToImage(o);f.compress?(v("compress"),l.compressImage(e,g).then((o=>{if(!o)return T(!0),void w();E(o.base64,o.compressedFile)}))):E(o,e)},B=()=>{b.current.click()};return O?o(e,{}):"cloud-upload"===j?!y||y.success?o(e,{}):y.error?o("div",{children:o(n,{states:p.ERROR,heading:"Error while uploading",subline:"Please check your image and try again",isButtonEnabled:!1,width:300,onClose:()=>{T(!0),w()}})}):o("div",{children:o(n,{headerImage:null==I?void 0:I.headerImage,states:p.LOADING,heading:`Uploading your ${u||"photo"}`,subline:`Please wait while we upload your ${u||"photo"}`,isButtonEnabled:!1,width:300})}):r(e,{children:[f.upload&&o("input",{ref:b,type:"file",accept:"image/*",style:{display:"none"},onChange:o=>{const e=o.target.files[0],r=new FileReader;r.onload=()=>{var o;R({src:r.result}),o=r.result,f.crop?v("crop"):k(o)},e&&r.readAsDataURL(e)}}),"crop"===j&&o(c,{src:F.src,onCropComplete:o=>{R({src:o}),k(o)},aspectRatio:m.aspectRatio,onCancel:w})]})};export{d as BikImagePipeline};
+import{jsx as o,Fragment as e,jsxs as r}from"react/jsx-runtime";import{useRef as t,useState as s,useEffect as a,useCallback as i}from"react";import{ImageService as p}from"../../image-compress/ImageCompress.js";import{StateInterface as l}from"../../states/StateComponent.js";import"../../../_virtual/_tslib.js";import{StateModalComponent as n}from"../../states-modal/StateModalComponent.js";import"../../modals/styledModal.js";import{BikImageCropper as c}from"../BikImageCropper.js";const d=({cropOptions:d,fileTitle:m,compressionOptions:u,currentImage:g,options:h,onFinish:f,onCancel:C,fileUploadOptions:w,loadingStateOptions:y})=>{const I=t(null),[b,j]=s(),[v,F]=s(g),[R,O]=s(!1);a(()=>{h.upload?(j("upload"),setTimeout(()=>{k()},500)):h.crop?j("crop"):h.compress?j("compress"):h.uploadToFirestorage?j("cloud-upload"):O(!0)},[h.upload,h.crop,h.compress,h.uploadToFirestorage]);const T=i((o,e)=>{if(!h.uploadToFirestorage)return f(o,e),void O(!0);j("cloud-upload"),w&&w.uploadFile(e,w.path).then(r=>{f(o,e,r),O(!0)}).catch(o=>{console.log("starting err process with ")})},[]),E=o=>{o||C();const e=p.base64ToImage(o);h.compress?(j("compress"),p.compressImage(e,u).then(o=>{if(!o)return O(!0),void C();T(o.base64,o.compressedFile)})):T(o,e)},k=()=>{I.current.click()};return R?o(e,{}):"cloud-upload"===b?!w||w.success?o(e,{}):w.error?o("div",{children:o(n,{states:l.ERROR,heading:"Error while uploading",subline:"Please check your image and try again",isButtonEnabled:!1,width:300,onClose:()=>{O(!0),C()}})}):o("div",{children:o(n,{headerImage:null==y?void 0:y.headerImage,states:l.LOADING,heading:`Uploading your ${m||"photo"}`,subline:`Please wait while we upload your ${m||"photo"}`,isButtonEnabled:!1,width:300})}):r(e,{children:[h.upload&&o("input",{ref:I,type:"file",accept:"image/*",style:{display:"none"},onChange:o=>{const e=o.target.files[0],r=new FileReader;r.onload=()=>{var o;F({src:r.result}),o=r.result,h.crop?j("crop"):E(o)},e&&r.readAsDataURL(e)}}),"crop"===b&&o(c,{src:v.src,onCropComplete:o=>{F({src:o}),E(o)},aspectRatio:d.aspectRatio,onCancel:C})]})};export{d as BikImagePipeline};

package/dist/esm/components/input/ChipInput.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as n,useEffect as r}from"react";import o from"react-chips";import{COLORS as i}from"../../constants/Theme.js";import{BodySecondary as l,BodyCaption as c}from"../TypographyStyle.js";import{theme as a,chipTheme as s}from"./ChipInput.styled.js";const p=p=>{let{onChipsChange:h,placeholder:m,chips:d,label:u,labelColor:y,hintText:g,hintTextColor:f,error:v,inputHeight:C,createChipKeys:b,chipsContainerCustomStyle:j,nativeID:x}=p;const[T,S]=n(!1);return r((()=>{var e,t;null===(e=document.querySelector(`#${x} input`))||void 0===e||e.addEventListener("focus",(()=>{S(!0)})),null===(t=document.querySelector(`#${x} input`))||void 0===t||t.addEventListener("blur",(()=>{S(!1)}))}),[]),e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:8},id:x},{children:[u&&t(l,Object.assign({style:{color:T?i.content.brand:v?i.content.negative:y||i.content.primary}},{children:u})),t(o,{value:d,theme:a(!!v,C,j,T),chipTheme:s,placeholder:0===d.length&&!!m&&!T&&m,onChange:e=>{h(e)},createChipKeys:b||","}),(!!g||!!v)&&t(c,Object.assign({style:{color:v?i.content.negative:f||i.content.secondary}},{children:v||g}))]}))};export{p as default};
+import{__rest as t}from"../../_virtual/_tslib.js";import{jsxs as e,jsx as r}from"react/jsx-runtime";import{useRef as o,useEffect as n,useMemo as l,useCallback as s}from"react";import{ReactTags as i}from"react-tag-autocomplete";import{COLORS as a}from"../../constants/Theme.js";import c from"../../assets/icons/cross.svg.js";import{BodySecondary as p,BodyCaption as m}from"../TypographyStyle.js";import{ChipInputContainer as d}from"./ChipInput.styled.js";const h=({onChipsChange:h,placeholder:u,chips:g,label:y,labelColor:f,hintText:b,hintTextColor:C,error:v,chipsContainerCustomStyle:x,nativeID:T,disableTextInput:j=!1})=>{const N=o(null),S=o(null);n(()=>{if(S.current){const t=S.current.querySelector("input");t&&j?(t.setAttribute("readonly","true"),t.style.caretColor="transparent"):t&&(t.removeAttribute("readonly"),t.style.caretColor="")}},[j]);const I=l(()=>[...g].map((t,e)=>({value:e,label:String(t)})),[g]),k=s(t=>{if(j)return;const e=String(t.label).trim();if(e){const t=[...g,e];h(t)}},[g,h,j]),w=s(t=>{const e=g.filter((e,r)=>r!==t);h(e)},[g,h]),A=s(o=>{var{classNames:n,tag:l}=o,s=t(o,["classNames","tag"]);const{onClick:i}=s,p=t(s,["onClick"]);return e("button",Object.assign({type:"button",className:"chip-tag"},p,{children:[r("span",{className:"chip-tag-text",children:l.label}),r("span",{className:"chip-tag-remove","aria-hidden":"true",onClick:i,children:r(c,{width:10,height:10,color:a.content.secondary})})]}))},[]);return e("div",{style:{display:"flex",flexDirection:"column",gap:8},id:T,children:[y&&r(p,{style:{color:v?a.content.negative:f||a.content.primary},children:y}),r(d,{ref:S,$error:!!v,style:x,$disableTextInput:j,children:r(i,{ref:N,selected:I,suggestions:[],onAdd:k,onDelete:w,allowNew:!0,activateFirstOption:!0,placeholderText:0===g.length?u:"",noOptionsText:"No matching options",renderTag:A})}),(!!b||!!v)&&r(m,{style:{color:v?a.content.negative:C||a.content.secondary},children:v||b})]})};export{h as default};

package/dist/esm/components/input/ChipInput.styled.js

@@ -1 +1,146 @@
-import{COLORS as e}from"../../constants/Theme.js";const n={chip:{padding:"0px 8px 0px 8px",background:e.surface.subdued,border:`1px solid ${e.stroke.primary}`,fontSize:12,color:e.content.secondary,fontWeight:400,borderRadius:4,alignItems:"center",alignContent:"center",justifyContent:"center",cursor:"default",margin:"0px 8px 0px 0px",fontFamily:"Inter"},chipRemove:{fontSize:12,fontFamily:"Inter",cursor:"pointer",fontWeight:"normal",color:e.content.secondary,marginLeft:6,":hover":{color:e.content.secondary}}},o=(n,o,r,t)=>({chipsContainer:Object.assign({display:"flex",position:"relative",border:`${t?2:1}px solid ${t?e.stroke.brand:n?e.stroke.negative.vibrant:e.stroke.primary}`,backgroundColor:e.surface.standard,alignItems:"center",flexWrap:"wrap",padding:"3px 8px 3px 8px",borderRadius:4,":hover":{border:`2px solid ${e.stroke.brand}`}},null!=r?r:{}),container:{flex:1},containerOpen:{},input:{border:"none",outline:"none",boxSizing:"border-box",fontSize:14,fontFamily:"Inter",fontWeight:400,height:o||32,width:"100%",paddingTop:0,paddingBottom:0}});export{n as chipTheme,o as theme};
+import e from"styled-components";import{COLORS as t}from"../../constants/Theme.js";const n=e.div`
+	position: relative;
+	display: flex;
+	flex-wrap: wrap;
+	align-items: center;
+	gap: 4px;
+	border: 1px solid ${e=>e.$error?t.stroke.negative.vibrant:t.stroke.primary};
+	border-radius: 4px;
+	background-color: ${t.surface.standard};
+	min-height: 30px;
+	padding: 0px 8px 2px 8px;
+	cursor: text;
+
+	ul,
+	ol,
+	li {
+		list-style: none;
+		list-style-type: none;
+		padding: 0;
+		margin: 0;
+	}
+	ul {
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap;
+		gap: 5px;
+	}
+	.react-tags {
+		position: relative;
+		display: flex;
+		flex-wrap: wrap;
+		align-items: center;
+		gap: 4px;
+		border: none;
+		background: transparent;
+		padding: 0;
+		min-height: auto;
+		width: 100%;
+	}
+
+	.react-tags__label {
+		position: absolute;
+		left: -10000px;
+		top: auto;
+		width: 1px;
+		height: 1px;
+		overflow: hidden;
+	}
+
+	/* Style the selected tags list - remove bullet points */
+	ul.react-tags__selected,
+	.react-tags__selected {
+		display: inline-flex !important;
+		flex-wrap: wrap;
+		gap: 4px;
+		padding: 0 !important;
+		margin: 0 !important;
+		list-style: none !important;
+		list-style-type: none !important;
+	}
+
+	.react-tags__selected li,
+	ul.react-tags__selected li {
+		display: inline-flex !important;
+		list-style: none !important;
+		list-style-type: none !important;
+		margin: 0 !important;
+		padding: 0 !important;
+	}
+
+	.react-tags__selected li::before,
+	.react-tags__selected li::marker {
+		display: none !important;
+		content: none !important;
+	}
+
+	.react-tags__selected-tag {
+		display: none; /* Hide default tags, we use custom renderTag */
+	}
+
+	/* Custom chip tag styling */
+	.chip-tag {
+		display: inline-flex;
+		align-items: center;
+		gap: 6px;
+		background: ${t.surface.subdued};
+		border: 1px solid ${t.stroke.primary};
+		border-radius: 4px;
+		padding: 0px 8px;
+		font-size: 12px;
+		font-family: Inter, sans-serif;
+		font-weight: 400;
+		color: ${t.content.secondary};
+		cursor: pointer;
+		line-height: 1.4;
+		white-space: nowrap;
+		margin: 0;
+
+		&:hover {
+			border-color: ${t.content.secondary};
+		}
+	}
+
+	.chip-tag-text {
+		font-size: 12px;
+		font-family: Inter, sans-serif;
+	}
+
+	.chip-tag-remove {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		line-height: 1;
+		margin-left: 2px;
+	}
+
+	.react-tags__combobox {
+		flex: 1;
+		display: inline-flex;
+		min-width: 80px;
+	}
+
+	.react-tags__combobox-input {
+		border: none;
+		outline: none;
+		box-sizing: border-box;
+		font-size: 14px;
+		font-family: Inter, sans-serif;
+		font-weight: 400;
+		background: transparent;
+		width: 100%;
+		padding: 4px 0;
+		pointer-events: ${e=>e.$disableTextInput?"none":"auto"};
+		user-select: ${e=>e.$disableTextInput?"none":"auto"};
+		cursor: ${e=>e.$disableTextInput?"default":"text"};
+
+		&::placeholder {
+			color: ${t.content.placeholder};
+		}
+	}
+
+	/* Hide the dropdown/listbox completely */
+	.react-tags__listbox {
+		display: none !important;
+	}
+`;t.surface.subdued,t.stroke.primary,t.content.secondary,t.content.secondary,t.content.secondary;export{n as ChipInputContainer};

package/dist/esm/components/input/Input-helper.js

@@ -1 +1 @@
-import{phone as n}from"phone";const e=n=>n&&"function"==typeof n,r=function(e,r){let t,i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};const a=["phonenumber","zip","number"].includes(r),l=a?e?Number(e):null:e;if(null==l||""===l)return[!0,""];if(a&&String(l).length&&(i.min&&l<i.min||i.max&&l>i.max))return[!1,`Enter valid number between ${i.min} and ${i.max}`];if("email"===r)return t=/(.+)@(.+){2,}\.(.+){2,}/,l.match(t)?[!0,""]:[!1,"Enter a valid email id"];if("url"===r)return t=/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/,l.match(t)?[!0,""]:[!1,"Enter a valid url"];if("number"===r)return l>=0?[!0,""]:[!1,"Enter a valid number"];if("zip"===r)return 6===String(l).trim().length?[!0,""]:[!1,"Enter a valid zip code"];if("phonenumber"===r){const{isValid:e}=n("+"+String(l));return e?[!0,""]:[!1,"Enter a valid phonenumber"]}return(null==l?void 0:l.trim().length)>0?[!0,""]:[!1,"Enter a valid data"]};export{e as isFunction,r as validateInput};
+import{phone as n}from"phone";const r=n=>n&&"function"==typeof n,e=(r,e,t={})=>{let i;const a=["phonenumber","zip","number"].includes(e),l=a?r?Number(r):null:r;if(null==l||""===l)return[!0,""];if(a&&String(l).length&&(t.min&&l<t.min||t.max&&l>t.max))return[!1,`Enter valid number between ${t.min} and ${t.max}`];if("email"===e)return i=/(.+)@(.+){2,}\.(.+){2,}/,l.match(i)?[!0,""]:[!1,"Enter a valid email id"];if("url"===e)return i=/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/,l.match(i)?[!0,""]:[!1,"Enter a valid url"];if("number"===e)return l>=0?[!0,""]:[!1,"Enter a valid number"];if("zip"===e)return 6===String(l).trim().length?[!0,""]:[!1,"Enter a valid zip code"];if("phonenumber"===e){const{isValid:r}=n("+"+String(l));return r?[!0,""]:[!1,"Enter a valid phonenumber"]}return(null==l?void 0:l.trim().length)>0?[!0,""]:[!1,"Enter a valid data"]};export{r as isFunction,e as validateInput};

package/dist/esm/components/input/Input.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t,Fragment as i}from"react/jsx-runtime";import n from"../../assets/icons/info.svg.js";import{forwardRef as l,useState as r,useContext as o,useRef as a,useEffect as s}from"react";import{Button as c}from"../button/Button.js";import{isFunction as h,validateInput as d}from"./Input-helper.js";import{Tooltip as u}from"../tooltips/Tooltip.js";import{TitleSmall as v,BodySecondary as g}from"../TypographyStyle.js";import{COLORS as p}from"../../constants/Theme.js";import m from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as b}from"./context/InputStyleProvider.js";import{RootContainer as x,InputFooter as f,MaxCharStyle as y,InputWrapper as j,IconHolder as C,PrefixHolder as T,InputContainer as O,InputContainerSmall as w,SuffixHolder as I,InputHeader as k}from"./Input.styled.js";const B=l(((l,B)=>{var L,H,D,E,M,P,S,z;const{placeholder:A,leftIcon:F,rightIcon:K,labelText:N,maxCharLimit:R,isRequired:G,hintText:W,type:_,state:q,validate:V,variant:$,button:J,suffixText:Q,prefixText:U,onChangeText:X,value:Y,noErrorHint:Z,reset:ee,rangeValidation:te,noKeyDownChange:ie,version:ne,noMaxCharCheck:le,labelElement:re,autoGrow:oe,minHeight:ae,maxHeight:se,labelTextBold:ce,truncateText:he,maxCharLimitPosition:de,hightlightInputColor:ue,onKeyDownEvent:ve,hideInputHeader:ge,hideBorder:pe,inputWrapperStyles:me,minCharsToTrigger:be,isDisabled:xe=!1}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0},l),fe=null==F?void 0:F.icon,ye=null==K?void 0:K.icon,[je,Ce]=r(!1),[Te,Oe]=r(!1),[we,Ie]=r(),ke="x-small"===$?"12px":"small"===$?"18px":"22px",Be=o(b),[Le,He]=r(""),De=a(null),Ee=null!=B?B:De;s((()=>{He(Y||""),!Y&&oe&&(Ee.current.style.height=ae||"48px")}),[Y]),s((()=>{var e;Ee.current&&(null===(e=l.onReferenceInit)||void 0===e||e.call(l,Ee.current))}),[Ee]),s((()=>{const e=Ee.current;if(e&&["phonenumber","zip","number"].includes(_))return e.addEventListener("wheel",ze,{passive:!1}),()=>{e.removeEventListener("wheel",ze)}}),[]),s((()=>{ee&&He("")}),[ee]),s((()=>{var e;Oe(!!l.isActive),l.isActive&&(null===(e=Ee.current)||void 0===e||e.focus())}),[l.isActive]),s((()=>{Ie(l.errorMessage)}),[l.errorMessage]),s((()=>{var e;Ce(!1),("invalid"===l.state||we||"disabled-invalid"===l.state)&&Ce(!0),"active"===l.state&&(null===(e=Ee.current)||void 0===e||e.focus())}),[l.state,we]),s((()=>{Ce(!!we||"invalid"===l.state)}),[we,l.state]);const Me=function(e){if(h(e)){for(var t=arguments.length,i=new Array(t>1?t-1:0),n=1;n<t;n++)i[n-1]=arguments[n];e(...i)}},Pe=()=>"zip"===_?6:2e3,Se=e=>{const t=0!==R?R:Pe(),i=be,n=e.target.value;ve&&(!n.length||n.length>=i)&&ve(e),ie||n.length&&!(n.length>=i)||X(Y||"",e),le||![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},ze=e=>{e.preventDefault()},Ae=e=>{let t=e.target.value;const i=0!==R?R+1:Pe(),n=be;if(!le&&i>0&&t.length>=i&&(t=t.substring(0,i-1)),l.textControl||He(t||""),n&&t&&t.length<n)return;X(t,e),oe&&(Ee.current.style.height=`${Ee.current.scrollHeight}px`,t||(Ee.current.style.height=ae||"48px"));const r=V||d;if(!r||!h(r))return;const[o,a]=r(t,_,te);Ce(!o),Ie(l.errorMessage?l.errorMessage:a)},Fe=e=>{var t;l.skipFocus||Oe(!0),Me(null===(t=l.onFocus)||void 0===t?void 0:t.call(l,e))},Ke=e=>{var t;l.skipFocus||Oe(!1),Me(null===(t=l.onBlur)||void 0===t?void 0:t.call(l,e))},Ne=()=>{var n;return e(i,{children:["multiline"!==_&&t("input",{className:he?"truncate-class":"","data-test":l["data-test"],id:l.id,style:null!==(n=null==Be?void 0:Be.input)&&void 0!==n?n:{},ref:Ee,disabled:xe,type:["phonenumber","zip","number"].includes(_)?"number":_,value:Le,onFocus:e=>Fe(e),onBlur:e=>Ke(e),placeholder:A||"Enter here",onChange:Ae,onClick:e=>Me(l.onClick),onKeyDown:e=>Se(e)}),"multiline"===_&&t("textarea",{"data-test":l["data-test"],value:Le,ref:Ee,onFocus:e=>Fe(e),onBlur:e=>Ke(e),onClick:e=>Me(l.onClick),disabled:xe,placeholder:A||"Enter here",onChange:Ae,onKeyDown:e=>Se(e),maxLength:R>0?R:void 0})]})};return e(x,Object.assign({width:l.width,height:l.height,state:q,type:_,style:null!==(L=null==Be?void 0:Be.RootContainer)&&void 0!==L?L:{}},{children:[e("div",Object.assign({className:"flex-align-center"},{children:[!Z&&(!!W||!!we)&&e(f,Object.assign({invalid:!!we},{children:[!!we&&t(m,{width:16,height:16}),we||W]})),R>0&&"BOTTOM"===de&&e(y,Object.assign({position:"BOTTOM"},{children:[null!==(D=null===(H=(null!=Y?Y:"").toString())||void 0===H?void 0:H.length)&&void 0!==D?D:0,"/",R]}))]})),e(j,Object.assign({variant:$,state:q,width:l.width,isActive:"active"===q||Te,isInvalid:je,style:null!==(M=null!==(E=null==Be?void 0:Be.InputWrapper)&&void 0!==E?E:me)&&void 0!==M?M:{},version:ne,height:l.height,hightlightInputColor:ue,hideBorder:pe},{children:[!!fe&&t(C,Object.assign({variant:$,iconSize:ke,onClick:()=>Me(null==F?void 0:F.callback),isLeft:!0,style:null!==(P=null==Be?void 0:Be.IconHolder)&&void 0!==P?P:{}},{children:t(fe,{})})),!!U&&t(T,Object.assign({variant:$},{children:U})),"default"===$&&t(O,Object.assign({height:l.height,type:l.type,minHeight:ae,maxHeight:se,autoGrow:oe},{children:Ne()})),["x-small","small"].includes($)&&t(w,Object.assign({height:l.height,type:l.type},{children:Ne()})),!!ye&&t(C,Object.assign({variant:$,iconSize:ke,onClick:()=>Me(null==K?void 0:K.callback),isLeft:!1},{children:t(ye,{})})),!!Q&&t(I,Object.assign({variant:$},{children:Q})),J&&J.text&&t(c,{buttonText:J.text,onClick:()=>Me(null==J?void 0:J.onClick)}),J&&J.buttonProps&&t(c,Object.assign({},J.buttonProps))]})),!ge&&(!!N||!!R)&&e(k,Object.assign({invalid:je},{children:[re&&re,e("div",Object.assign({className:"label__container"},{children:[e(ce?v:g,{children:[N,G?t("span",{children:"*"}):""]}),l.tooltipText&&t(u,Object.assign({body:l.tooltipText,placement:"top"},{children:t("span",{children:t(n,{style:{marginTop:-3},width:18,height:18,color:je?p.content.negative:p.content.primary})})}))]})),R>0&&"TOP"===de&&e(y,{children:[null!==(z=null===(S=(null!=Y?Y:"").toString())||void 0===S?void 0:S.length)&&void 0!==z?z:0,"/",R]})]}))]}))}));B.displayName="Input";export{B as Input};
+import{jsxs as e,jsx as t,Fragment as i}from"react/jsx-runtime";import n from"../../assets/icons/info.svg.js";import{forwardRef as l,useState as r,useContext as o,useRef as a,useEffect as s}from"react";import{Button as h}from"../button/Button.js";import{isFunction as c,validateInput as d}from"./Input-helper.js";import{Tooltip as u}from"../tooltips/Tooltip.js";import{TitleSmall as v,BodySecondary as p}from"../TypographyStyle.js";import{COLORS as g}from"../../constants/Theme.js";import m from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as x}from"./context/InputStyleProvider.js";import{RootContainer as f,InputFooter as y,MaxCharStyle as b,InputWrapper as C,IconHolder as T,PrefixHolder as w,InputContainer as I,InputContainerSmall as k,SuffixHolder as j,InputHeader as B}from"./Input.styled.js";const L=l((l,L)=>{var H,O,D,E,M,P,S,z;const{placeholder:F,leftIcon:A,rightIcon:K,labelText:N,maxCharLimit:R,isRequired:G,hintText:W,type:_,state:q,validate:V,variant:$,button:J,suffixText:Q,prefixText:U,onChangeText:X,value:Y,noErrorHint:Z,reset:ee,rangeValidation:te,noKeyDownChange:ie,version:ne,noMaxCharCheck:le,labelElement:re,autoGrow:oe,minHeight:ae,maxHeight:se,labelTextBold:he,truncateText:ce,maxCharLimitPosition:de,hightlightInputColor:ue,onKeyDownEvent:ve,hideInputHeader:pe,hideBorder:ge,inputWrapperStyles:me,minCharsToTrigger:xe,isDisabled:fe=!1}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0},l),ye=null==A?void 0:A.icon,be=null==K?void 0:K.icon,[Ce,Te]=r(!1),[we,Ie]=r(!1),[ke,je]=r(),Be="x-small"===$?"12px":"small"===$?"18px":"22px",Le=o(x),[He,Oe]=r(""),De=a(null),Ee=null!=L?L:De;s(()=>{Oe(Y||""),!Y&&oe&&(Ee.current.style.height=ae||"48px")},[Y]),s(()=>{var e;Ee.current&&(null===(e=l.onReferenceInit)||void 0===e||e.call(l,Ee.current))},[Ee]),s(()=>{const e=Ee.current;if(e&&["phonenumber","zip","number"].includes(_))return e.addEventListener("wheel",ze,{passive:!1}),()=>{e.removeEventListener("wheel",ze)}},[]),s(()=>{ee&&Oe("")},[ee]),s(()=>{var e;Ie(!!l.isActive),l.isActive&&(null===(e=Ee.current)||void 0===e||e.focus())},[l.isActive]),s(()=>{je(l.errorMessage)},[l.errorMessage]),s(()=>{var e;Te(!1),("invalid"===l.state||ke||"disabled-invalid"===l.state)&&Te(!0),"active"===l.state&&(null===(e=Ee.current)||void 0===e||e.focus())},[l.state,ke]),s(()=>{Te(!!ke||"invalid"===l.state)},[ke,l.state]);const Me=(e,...t)=>{c(e)&&e(...t)},Pe=()=>"zip"===_?6:2e3,Se=e=>{const t=0!==R?R:Pe(),i=xe,n=e.target.value;ve&&(!n.length||n.length>=i)&&ve(e),ie||n.length&&!(n.length>=i)||X(Y||"",e),le||![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},ze=e=>{e.preventDefault()},Fe=e=>{let t=e.target.value;const i=0!==R?R+1:Pe(),n=xe;if(!le&&i>0&&t.length>=i&&(t=t.substring(0,i-1)),l.textControl||Oe(t||""),n&&t&&t.length<n)return;X(t,e),oe&&(Ee.current.style.height=`${Ee.current.scrollHeight}px`,t||(Ee.current.style.height=ae||"48px"));const r=V||d;if(!r||!c(r))return;const[o,a]=r(t,_,te);Te(!o),je(l.errorMessage?l.errorMessage:a)},Ae=e=>{var t;l.skipFocus||Ie(!0),Me(null===(t=l.onFocus)||void 0===t?void 0:t.call(l,e))},Ke=e=>{var t;l.skipFocus||Ie(!1),Me(null===(t=l.onBlur)||void 0===t?void 0:t.call(l,e))},Ne=()=>{var n;return e(i,{children:["multiline"!==_&&t("input",{className:ce?"truncate-class":"","data-test":l["data-test"],id:l.id,style:null!==(n=null==Le?void 0:Le.input)&&void 0!==n?n:{},ref:Ee,disabled:fe,type:["phonenumber","zip","number"].includes(_)?"number":_,value:He,onFocus:e=>Ae(e),onBlur:e=>Ke(e),placeholder:F||"Enter here",onChange:Fe,onClick:e=>Me(l.onClick),onKeyDown:e=>Se(e)}),"multiline"===_&&t("textarea",{"data-test":l["data-test"],value:He,ref:Ee,onFocus:e=>Ae(e),onBlur:e=>Ke(e),onClick:e=>Me(l.onClick),disabled:fe,placeholder:F||"Enter here",onChange:Fe,onKeyDown:e=>Se(e),maxLength:R>0?R:void 0})]})};return e(f,{width:l.width,height:l.height,state:q,type:_,style:null!==(H=null==Le?void 0:Le.RootContainer)&&void 0!==H?H:{},children:[e("div",{className:"flex-align-center",children:[!Z&&(!!W||!!ke)&&e(y,{invalid:!!ke,children:[!!ke&&t(m,{width:16,height:16}),ke||W]}),R>0&&"BOTTOM"===de&&e(b,{position:"BOTTOM",children:[null!==(D=null===(O=(null!=Y?Y:"").toString())||void 0===O?void 0:O.length)&&void 0!==D?D:0,"/",R]})]}),e(C,{variant:$,state:q,width:l.width,isActive:"active"===q||we,isInvalid:Ce,style:null!==(M=null!==(E=null==Le?void 0:Le.InputWrapper)&&void 0!==E?E:me)&&void 0!==M?M:{},version:ne,height:l.height,hightlightInputColor:ue,hideBorder:ge,children:[!!ye&&t(T,{variant:$,iconSize:Be,onClick:()=>Me(null==A?void 0:A.callback),isLeft:!0,style:null!==(P=null==Le?void 0:Le.IconHolder)&&void 0!==P?P:{},children:t(ye,{})}),!!U&&t(w,{variant:$,children:U}),"default"===$&&t(I,{height:l.height,type:l.type,minHeight:ae,maxHeight:se,autoGrow:oe,children:Ne()}),["x-small","small"].includes($)&&t(k,{height:l.height,type:l.type,children:Ne()}),!!be&&t(T,{variant:$,iconSize:Be,onClick:()=>Me(null==K?void 0:K.callback),isLeft:!1,children:t(be,{})}),!!Q&&t(j,{variant:$,children:Q}),J&&J.text&&t(h,{buttonText:J.text,onClick:()=>Me(null==J?void 0:J.onClick)}),J&&J.buttonProps&&t(h,Object.assign({},J.buttonProps))]}),!pe&&(!!N||!!R)&&e(B,{invalid:Ce,children:[re&&re,e("div",{className:"label__container",children:[e(he?v:p,{children:[N,G?t("span",{children:"*"}):""]}),l.tooltipText&&t(u,{body:l.tooltipText,placement:"top",children:t("span",{children:t(n,{style:{marginTop:-3},width:18,height:18,color:Ce?g.content.negative:g.content.primary})})})]}),R>0&&"TOP"===de&&e(b,{children:[null!==(z=null===(S=(null!=Y?Y:"").toString())||void 0===S?void 0:S.length)&&void 0!==z?z:0,"/",R]})]})]})});L.displayName="Input";export{L as Input};