@inntechcorp/it-design 3.1.6 → 3.1.7

package/dist/cropper/index.d.ts

@@ -13,6 +13,10 @@ export interface ImageCropperProps {
     minWidth?: number;
     /** Minimum crop height in pixels */
     minHeight?: number;
+    /** Output width - cropped image will be resized to this width */
+    outputWidth?: number;
+    /** Output height - cropped image will be resized to this height */
+    outputHeight?: number;
     /** Output image quality (0-1) */
     quality?: number;
     /** Output image format */
@@ -23,6 +27,8 @@ export interface ImageCropperProps {
     width?: string | number;
     /** Container height */
     height?: string | number;
+    /** Show grid lines on crop area (default: true) */
+    showGrid?: boolean;
 }
 export interface ImageCropperRef {
     /** Get cropped image as Blob */

package/dist/index.cjs.js

@@ -4136,7 +4136,7 @@
 
   }
 
-`,dp=n.forwardRef(({id:e="itd-upload-"+fe(),resultFileName:o=null,action:i="",filePath:a="",binaryName:s="file",showDeleteIcon:l=!1,showPreviewIcon:d=!1,buttonsPosition:c="default",padding:u=10,fluid:p=!0,fileWidth:h="100%",fileHeight:g="auto",maxFileWidth:m="none",maxFileHeight:b="none",containerWidth:x="100%",containerHeight:v="auto",previewFileWidth:y="100%",previewFileHeight:w="100%",previewFilePadding:A="0",requestMethod:k="put",maxFileSize:S=1024,disabled:_=!1,extraFormData:E={},extraQueryString:C={},extraHeader:$={},fileTypes:j=[exports.FileTypes.JPG,exports.FileTypes.PNG,exports.FileTypes.SVG,exports.FileTypes.PDF],removeAction:F="",removeExtraFormData:z={},removeExtraQueryString:L={},removeExtraHeader:N={},minImageWidth:M,minImageHeight:D,enableCrop:T=!1,cropAspectRatio:O,cropMinWidth:I=50,cropMinHeight:R=50,cropQuality:P=.9,cropModalTitle:B,onUpdate:V,onUploadSuccess:H,onUploadFailed:G,onRemoveFileSuccess:W,onRemoveFileFailed:Y},q)=>{const X=n.useRef(null),{showModal:K}=et.useModal(),{fetch:J,cancel:Z}=U(),{t:Q}=t.useTranslation("itd"),[ee,te]=n.useState(!1),[re,ne]=n.useState(!1),[oe,ie]=n.useState(".svg, .png, .jpg"),[ae,se]=n.useState(!1),[le,de]=n.useState(!1),[ce,ue]=n.useState(!1),[pe,he]=n.useState(null),[ge,me]=n.useState(null),[be,ve]=n.useState(""),[ye,we]=n.useState(!1),[Ae,ke]=n.useState(!1),[Se,_e]=n.useState(null),[Ee,Ce]=n.useState(!1),[$e,je]=n.useState(null),[Fe,ze]=n.useState(null);n.useEffect(()=>()=>{Z()},[]),n.useEffect(()=>{ne(_)},[_]),n.useEffect(()=>{me(a?a.split("?")[0]:"")},[a]),n.useEffect(()=>{null!==ge&&(void 0!==ge?Me():te(!1))},[ge]),n.useEffect(()=>{let e=[];j.map(t=>{e.push(Po(t))}),ie(e.join(", "))},[j]);const Le=(e,t)=>{f.toast.error(e,{description:t,duration:5e3})},Ne=(e,t=!0,r=!0)=>{V&&V(e,t,r)};n.useImperativeHandle(q,()=>({setFocus(){ue(!0)},reset(e=!1,t=!1){De(),me(null),ve(""),Ne("",e,t)},setValue(e,t=!0,r=!0){me(e),Ne(e,t,r)},getValue:()=>ge||"",setError(e){ve(e)},forceUpdate(){Ne(ge||"")},clear(){me("")}}));const Me=async()=>{let e=!1;ge&&(e=await Io(ge),he(e),e?Ne(ge):Ne("",!0,!0),ee||te(!0)),""!==ge||ee||te(!0),""===ge&&ee&&Ne("",!0,!0)},De=()=>{je(null),_e(null),Ce(!1),he(null)},Te=async()=>{ne(!0),K({content:r.jsx("div",{children:Q("uploader.areYouSureToDeleteThisFile")}),title:Q("uploader.removeFile"),okButtonText:Q("uploader.yes"),cancelButtonText:Q("uploader.no"),okButtonProps:{variant:"statable",state:"reject"},closeOnClickOutside:!1,showCloseButton:!1,onOk:()=>(F?J({action:F,params:z,queries:L,headers:N,onFetched:e=>{e.data.success?(De(),Ne("",!0,!0),W&&W(e.data.data)):Y&&Y()},onError:()=>{Y&&Y()}}):(De(),Ne("",!0,!0),W&&W()),ne(!1),!0),onCancel:()=>(ne(!1),!0)})},Oe=e=>{e.preventDefault(),Ae||de(!0)},Ie=e=>{e.preventDefault(),Ae||de(!1)},Re=e=>{e.preventDefault(),Ae||(de(!1),e.dataTransfer&&0!==e.dataTransfer.files.length?He(e.dataTransfer.files[0]):console.log(Q("uploader.browserDoesntSupportDND")))},Pe=e=>{de(!1);const t=e.target.files[0];He(t)},Be=async({path:e,errorMessage:t,errorCode:r})=>{await Bo(1e3),_e(null),ke(!1),await Bo(1500),Ce(!1),e?H&&H(e):t&&G&&G(t,r||0)},Ve=async e=>{if(!e)return;let t=new FormData;t.append(s,e),o&&t.append("name",o),Object.keys(E).forEach(e=>{t.append(e,E[e])}),J({action:i,requestMethod:k,params:t,queries:C,headers:$,onFetched:e=>{e.data.success?(je({message:Q("uploader.fileUploadSuccess"),status:"success"}),Ce(!0),me(e.data.data.url),Be({path:e.data.data.url})):(je({message:Q("uploader.fileUploadFailed"),status:"error"}),Ne("",!0,!0),Be({errorMessage:Q("uploader.fileUploadFailed")}))},onError:(e,t)=>{je({message:Q("uploader.fileUploadFailed"),status:"error"}),Ne("",!0,!0),Be({errorMessage:e,errorCode:t})},onProgress:e=>{_e({estimated:e.estimated?(Math.round(100*e.estimated)/100).toFixed(2):"0",progress:e.progress?Math.round(100*e.progress):0,bytes:e.bytes?Ro(e.bytes):"",total:e.total?Ro(e.total):""})}})},He=async e=>{if(!e)return;if(!(e=>!!j.includes(e.type)||(Le(Q("uploader.error"),Q("uploader.fileFormatError",{fileFormat:oe})),!1))(e))return;if(!(e=>!(e.size>1024*S&&(Le(Q("uploader.error"),Q("uploader.fileSizeError",{fileSize:Ro(1024*S)})),1)))(e))return;const t=await(e=>new Promise(t=>{if(!e.type.startsWith("image/")||e.type===exports.FileTypes.SVG)return void t(!0);if(!M&&!D)return void t(!0);const r=new window.Image,n=URL.createObjectURL(e);r.onload=()=>{URL.revokeObjectURL(n);const e=!M||r.naturalWidth>=M,o=!D||r.naturalHeight>=D;if(!e||!o){const e=M&&D?`${M}x${D}`:M?`${M}px ${Q("uploader.width")}`:`${D}px ${Q("uploader.height")}`,n=`${r.naturalWidth}x${r.naturalHeight}`;return Le(Q("uploader.imageTooSmall"),Q("uploader.imageTooSmallMessage",{required:e,actual:n})),X.current&&(X.current.value=""),void t(!1)}t(!0)},r.onerror=()=>{URL.revokeObjectURL(n),t(!0)},r.src=n}))(e);if(t){if(o){const t=Po(e.type);e=new File([e],o+t,{type:t,lastModified:e.lastModified})}if(T&&e.type.startsWith("image/")&&e.type!==exports.FileTypes.SVG){ze(e);const t=new FileReader;return t.onload=t=>{Ue(t.target?.result,e)},void t.readAsDataURL(e)}Ve(e),ke(!0)}},Ue=(e,t)=>{let n=null,i=null;const a=t.type===exports.FileTypes.PNG?"image/png":"image/webp"===t.type?"image/webp":"image/jpeg",s=async()=>{if(!n)return;const e=await n.getCroppedFile(o||Fe?.name.split(".")[0]||"cropped");e&&(ze(null),i?.(),Ve(e),ke(!0))},l=()=>{ze(null),X.current&&(X.current.value=""),i?.()};K({title:B||Q("uploader.cropImage"),content:r.jsx(({hideCurrentModal:t})=>(i=t||null,r.jsxs("div",{style:{width:"100%"},children:[r.jsx("div",{style:{minHeight:"400px",marginBottom:"20px"},children:r.jsx(mp,{ref:e=>{n=e},src:e,aspectRatio:O,minWidth:I,minHeight:R,quality:P,outputFormat:a,width:"100%",height:"400px"})}),r.jsxs(qf,{justify:"flex-end",gap:"small",children:[r.jsx(xe,{variant:"ghost",onClick:l,children:Q("uploader.cancel")}),r.jsx(xe,{variant:"solid",onClick:s,children:Q("uploader.crop")})]})]})),{}),showOkButton:!1,showCancelButton:!1,closeOnClickOutside:!1,showCloseButton:!0,width:"600px",onCancel:()=>(l(),!0)})},Ge=()=>{ne(!0),K({content:r.jsx(tp,{className:"itd-upload-preview-content",$width:y,$height:w,$padding:A,children:r.jsx(Mi,{src:ge||""})}),showOkButton:!1,showCancelButton:!1,contentPadding:"0px",width:"max-content",onCancel:()=>(ne(!1),!0)})},We=()=>{if(l&&ge&&!Ae&&pe)return r.jsx("span",{className:"delete-icon",children:r.jsx(xe,{variant:"solid",size:exports.ComponentSizes.SMALL,type:"button",circle:!0,onClick:Te,disabled:re,icon:r.jsx(ni,{width:16,height:16}),className:"itd-upload-delete-button"})})},Ye=()=>{if(d&&ge&&!Ae&&pe)return r.jsx("span",{className:"preview-icon",children:r.jsx(xe,{variant:"solid",size:exports.ComponentSizes.SMALL,type:"button",circle:!0,onClick:Ge,disabled:re,icon:r.jsx(oi,{width:16,height:16}),className:"itd-upload-preview-button"})})},qe=r.jsx("svg",{width:"20px",height:"20px",viewBox:"0 0 20 20",version:"1.1",xmlns:"http://www.w3.org/2000/svg",children:r.jsx("g",{id:"Error",stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd",children:r.jsxs("g",{id:"ErrorGroup",fillRule:"nonzero",children:[r.jsx("circle",{id:"ErrorBackground",fill:"#F8285A",cx:"10",cy:"10",r:"10"}),r.jsx("path",{d:"M10.0355339,8.6213203 L12.863961,5.79289322 C13.2544853,5.40236893 13.8876503,5.40236893 14.2781746,5.79289322 C14.6686989,6.18341751 14.6686989,6.81658249 14.2781746,7.20710678 L11.4497475,10.0355339 \n            L14.2781746,12.863961 C14.6686989,13.2544853 14.6686989,13.8876503 14.2781746,14.2781746 C13.8876503,14.6686989 13.2544853,14.6686989 12.863961,14.2781746 L10.0355339,11.4497475 L7.20710678,14.2781746\n            C6.81658249,14.6686989 6.18341751,14.6686989 5.79289322,14.2781746 C5.40236893,13.8876503 5.40236893,13.2544853 5.79289322,12.863961 L8.6213203,10.0355339 L5.79289322,7.20710678 C5.40236893,6.81658249\n            5.40236893,6.18341751 5.79289322,5.79289322 C6.18341751,5.40236893 6.81658249,5.40236893 7.20710678,5.79289322 L10.0355339,8.6213203 Z",id:"ErrorIcon",fill:"#FFFFFF"})]})})}),Xe=()=>{if(""===be||Ae)return;let e={className:"itd-upload-failed itd-failed-status",onPointerOver:()=>we(!0),onPointerOut:()=>we(!1)};return r.jsxs(sp,{...e,children:[ye?r.jsx(lp,{className:"itd-upload-error-tooltip itd-error-tooltip",children:be}):null,qe]})},Ke=()=>{if(ee)return null===pe?r.jsx(Qo,{width:24,height:24}):!1===pe?r.jsx(ii,{width:40,height:40}):r.jsx(Mi,{src:ge||"",width:Uo(h),height:Uo(g)})},Je=()=>{let e=(ae||le)&&!Ae&&!re;return r.jsx(np,{$isHover:e,className:"itd-upload-overlay",children:r.jsxs(rp,{$isHover:e,className:"itd-upload-overlay-content",children:[r.jsx("span",{className:"itd-upload-header",children:Q("uploader.header")}),r.jsx("span",{className:"itd-upload-hint",children:Q("uploader.hint")})]})})};return r.jsxs(Ju,{className:"itd-upload",$fluid:p,children:[r.jsx("input",{type:"file",id:e,accept:oe,onChange:Pe,onFocus:e=>{e.target.matches(":focus-visible")&&ue(!0)},onBlur:()=>ue(!1),onPointerOver:()=>{!le&&se(!0)},onPointerOut:()=>{!le&&se(!1)},onDragOver:Oe,onDragLeave:Ie,onDrop:Re,disabled:Ae||re,ref:X}),r.jsx(Qu,{$showFocus:ce,className:"itd-upload-label",children:r.jsxs(Zu,{$showBorder:(le||ae)&&!Ae,$padding:u,$disabled:_,$hasError:""!==be&&!Ae,$fileWidth:h,$fileHeight:g,$maxFileWidth:m,$maxFileHeight:b,$containerWidth:x,$containerHeight:v,className:"itd-upload-content",children:[Ke(),r.jsxs(op,{className:"itd-upload-status",$isActive:Ae,$complete:"success"===$e?.status,$error:"error"===$e?.status,children:[r.jsx(ip,{className:"itd-upload-status-box",$progress:Se?Se.progress:0,$complete:"success"===$e?.status,$error:"error"===$e?.status}),r.jsx("span",{className:"itd-upload-status-message",children:Q(Ee||$e?String($e?.message):"uploader.fileUploading")}),Se?r.jsx("span",{className:"itd-upload-status-info",children:Q("uploader.info",{total:Se.total,estimated:Se.estimated})}):r.jsx("span",{className:"itd-upload-status-calculating",children:Q("uploader.calculating")})]}),Je(),r.jsxs(ep,{$position:""===be?c:"default",children:[r.jsxs(qf,{vertical:!0,gap:"small",className:"itd-upload-icons",children:[We(),Ye()]}),Xe()]})]})})]})}),cp=l.div`
+`,dp=n.forwardRef(({id:e="itd-upload-"+fe(),resultFileName:o=null,action:i="",filePath:a="",binaryName:s="file",showDeleteIcon:l=!1,showPreviewIcon:d=!1,buttonsPosition:c="default",padding:u=10,fluid:p=!0,fileWidth:h="100%",fileHeight:g="auto",maxFileWidth:m="none",maxFileHeight:b="none",containerWidth:x="100%",containerHeight:v="auto",previewFileWidth:y="100%",previewFileHeight:w="100%",previewFilePadding:A="0",requestMethod:k="put",maxFileSize:S=1024,disabled:_=!1,extraFormData:E={},extraQueryString:C={},extraHeader:$={},fileTypes:j=[exports.FileTypes.JPG,exports.FileTypes.PNG,exports.FileTypes.SVG,exports.FileTypes.PDF],removeAction:F="",removeExtraFormData:z={},removeExtraQueryString:L={},removeExtraHeader:N={},minImageWidth:M,minImageHeight:D,crop:T,onUpdate:O,onUploadSuccess:I,onUploadFailed:R,onRemoveFileSuccess:P,onRemoveFileFailed:B},V)=>{const H=n.useRef(null),{showModal:G}=et.useModal(),{fetch:W,cancel:Y}=U(),{t:q}=t.useTranslation("itd"),[X,K]=n.useState(!1),[J,Z]=n.useState(!1),[Q,ee]=n.useState(".svg, .png, .jpg"),[te,re]=n.useState(!1),[ne,oe]=n.useState(!1),[ie,ae]=n.useState(!1),[se,le]=n.useState(null),[de,ce]=n.useState(null),[ue,pe]=n.useState(""),[he,ge]=n.useState(!1),[me,be]=n.useState(!1),[ve,ye]=n.useState(null),[we,Ae]=n.useState(!1),[ke,Se]=n.useState(null),[_e,Ee]=n.useState(null);n.useEffect(()=>()=>{Y()},[]),n.useEffect(()=>{Z(_)},[_]),n.useEffect(()=>{ce(a?a.split("?")[0]:"")},[a]),n.useEffect(()=>{null!==de&&(void 0!==de?je():K(!1))},[de]),n.useEffect(()=>{let e=[];j.map(t=>{e.push(Po(t))}),ee(e.join(", "))},[j]);const Ce=(e,t)=>{f.toast.error(e,{description:t,duration:5e3})},$e=(e,t=!0,r=!0)=>{O&&O(e,t,r)};n.useImperativeHandle(V,()=>({setFocus(){ae(!0)},reset(e=!1,t=!1){Fe(),ce(null),pe(""),$e("",e,t)},setValue(e,t=!0,r=!0){ce(e),$e(e,t,r)},getValue:()=>de||"",setError(e){pe(e)},forceUpdate(){$e(de||"")},clear(){ce("")}}));const je=async()=>{let e=!1;de&&(e=await Io(de),le(e),e?$e(de):$e("",!0,!0),X||K(!0)),""!==de||X||K(!0),""===de&&X&&$e("",!0,!0)},Fe=()=>{Se(null),ye(null),Ae(!1),le(null)},ze=async()=>{Z(!0),G({content:r.jsx("div",{children:q("uploader.areYouSureToDeleteThisFile")}),title:q("uploader.removeFile"),okButtonText:q("uploader.yes"),cancelButtonText:q("uploader.no"),okButtonProps:{variant:"statable",state:"reject"},closeOnClickOutside:!1,showCloseButton:!1,onOk:()=>(F?W({action:F,params:z,queries:L,headers:N,onFetched:e=>{e.data.success?(Fe(),$e("",!0,!0),P&&P(e.data.data)):B&&B()},onError:()=>{B&&B()}}):(Fe(),$e("",!0,!0),P&&P()),Z(!1),!0),onCancel:()=>(Z(!1),!0)})},Le=e=>{e.preventDefault(),me||oe(!0)},Ne=e=>{e.preventDefault(),me||oe(!1)},Me=e=>{e.preventDefault(),me||(oe(!1),e.dataTransfer&&0!==e.dataTransfer.files.length?Ie(e.dataTransfer.files[0]):console.log(q("uploader.browserDoesntSupportDND")))},De=e=>{oe(!1);const t=e.target.files[0];Ie(t)},Te=async({path:e,errorMessage:t,errorCode:r})=>{await Bo(1e3),ye(null),be(!1),await Bo(1500),Ae(!1),e?I&&I(e):t&&R&&R(t,r||0)},Oe=async e=>{if(!e)return;let t=new FormData;t.append(s,e),o&&t.append("name",o),Object.keys(E).forEach(e=>{t.append(e,E[e])}),W({action:i,requestMethod:k,params:t,queries:C,headers:$,onFetched:e=>{e.data.success?(Se({message:q("uploader.fileUploadSuccess"),status:"success"}),Ae(!0),ce(e.data.data.url),Te({path:e.data.data.url})):(Se({message:q("uploader.fileUploadFailed"),status:"error"}),$e("",!0,!0),Te({errorMessage:q("uploader.fileUploadFailed")}))},onError:(e,t)=>{Se({message:q("uploader.fileUploadFailed"),status:"error"}),$e("",!0,!0),Te({errorMessage:e,errorCode:t})},onProgress:e=>{ye({estimated:e.estimated?(Math.round(100*e.estimated)/100).toFixed(2):"0",progress:e.progress?Math.round(100*e.progress):0,bytes:e.bytes?Ro(e.bytes):"",total:e.total?Ro(e.total):""})}})},Ie=async e=>{if(!e)return;if(!(e=>!!j.includes(e.type)||(Ce(q("uploader.error"),q("uploader.fileFormatError",{fileFormat:Q})),!1))(e))return;if(!(e=>!(e.size>1024*S&&(Ce(q("uploader.error"),q("uploader.fileSizeError",{fileSize:Ro(1024*S)})),1)))(e))return;const t=await(e=>new Promise(t=>{if(!e.type.startsWith("image/")||e.type===exports.FileTypes.SVG)return void t(!0);if(!M&&!D)return void t(!0);const r=new window.Image,n=URL.createObjectURL(e);r.onload=()=>{URL.revokeObjectURL(n);const e=!M||r.naturalWidth>=M,o=!D||r.naturalHeight>=D;if(!e||!o){const e=M&&D?`${M}x${D}`:M?`${M}px ${q("uploader.width")}`:`${D}px ${q("uploader.height")}`,n=`${r.naturalWidth}x${r.naturalHeight}`;return Ce(q("uploader.imageTooSmall"),q("uploader.imageTooSmallMessage",{required:e,actual:n})),H.current&&(H.current.value=""),void t(!1)}t(!0)},r.onerror=()=>{URL.revokeObjectURL(n),t(!0)},r.src=n}))(e);if(t){if(o){const t=Po(e.type);e=new File([e],o+t,{type:t,lastModified:e.lastModified})}if(T&&e.type.startsWith("image/")&&e.type!==exports.FileTypes.SVG){Ee(e);const t=new FileReader;return t.onload=t=>{Re(t.target?.result,e)},void t.readAsDataURL(e)}Oe(e),be(!0)}},Re=(e,t)=>{let n=null,i=null;const a=t.type===exports.FileTypes.PNG?"image/png":"image/webp"===t.type?"image/webp":"image/jpeg",s=async()=>{if(!n)return;const e=await n.getCroppedFile(o||_e?.name.split(".")[0]||"cropped");e&&(Ee(null),i?.(),Oe(e),be(!0))},l=()=>{Ee(null),H.current&&(H.current.value=""),i?.()};G({title:T?.modalTitle||q("uploader.cropImage"),content:r.jsx(({hideCurrentModal:t})=>(i=t||null,r.jsxs("div",{style:{width:"100%"},children:[r.jsx("div",{style:{minHeight:"400px",marginBottom:"20px"},children:r.jsx(mp,{ref:e=>{n=e},src:e,aspectRatio:T?.aspectRatio,minWidth:T?.minWidth,minHeight:T?.minHeight,outputWidth:T?.outputWidth,outputHeight:T?.outputHeight,quality:T?.quality||.9,outputFormat:a,showGrid:T?.showGrid??!0,width:"100%",height:"400px"})}),r.jsxs(qf,{justify:"flex-end",gap:"small",children:[r.jsx(xe,{variant:"ghost",onClick:l,children:q("uploader.cancel")}),r.jsx(xe,{variant:"solid",onClick:s,children:q("uploader.crop")})]})]})),{}),showOkButton:!1,showCancelButton:!1,closeOnClickOutside:!1,showCloseButton:!0,width:"600px",onCancel:()=>(l(),!0)})},Pe=()=>{Z(!0),G({content:r.jsx(tp,{className:"itd-upload-preview-content",$width:y,$height:w,$padding:A,children:r.jsx(Mi,{src:de||""})}),showOkButton:!1,showCancelButton:!1,contentPadding:"0px",width:"max-content",onCancel:()=>(Z(!1),!0)})},Be=()=>{if(l&&de&&!me&&se)return r.jsx("span",{className:"delete-icon",children:r.jsx(xe,{variant:"solid",size:exports.ComponentSizes.SMALL,type:"button",circle:!0,onClick:ze,disabled:J,icon:r.jsx(ni,{width:16,height:16}),className:"itd-upload-delete-button"})})},Ve=()=>{if(d&&de&&!me&&se)return r.jsx("span",{className:"preview-icon",children:r.jsx(xe,{variant:"solid",size:exports.ComponentSizes.SMALL,type:"button",circle:!0,onClick:Pe,disabled:J,icon:r.jsx(oi,{width:16,height:16}),className:"itd-upload-preview-button"})})},He=r.jsx("svg",{width:"20px",height:"20px",viewBox:"0 0 20 20",version:"1.1",xmlns:"http://www.w3.org/2000/svg",children:r.jsx("g",{id:"Error",stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd",children:r.jsxs("g",{id:"ErrorGroup",fillRule:"nonzero",children:[r.jsx("circle",{id:"ErrorBackground",fill:"#F8285A",cx:"10",cy:"10",r:"10"}),r.jsx("path",{d:"M10.0355339,8.6213203 L12.863961,5.79289322 C13.2544853,5.40236893 13.8876503,5.40236893 14.2781746,5.79289322 C14.6686989,6.18341751 14.6686989,6.81658249 14.2781746,7.20710678 L11.4497475,10.0355339 \n            L14.2781746,12.863961 C14.6686989,13.2544853 14.6686989,13.8876503 14.2781746,14.2781746 C13.8876503,14.6686989 13.2544853,14.6686989 12.863961,14.2781746 L10.0355339,11.4497475 L7.20710678,14.2781746\n            C6.81658249,14.6686989 6.18341751,14.6686989 5.79289322,14.2781746 C5.40236893,13.8876503 5.40236893,13.2544853 5.79289322,12.863961 L8.6213203,10.0355339 L5.79289322,7.20710678 C5.40236893,6.81658249\n            5.40236893,6.18341751 5.79289322,5.79289322 C6.18341751,5.40236893 6.81658249,5.40236893 7.20710678,5.79289322 L10.0355339,8.6213203 Z",id:"ErrorIcon",fill:"#FFFFFF"})]})})}),Ue=()=>{if(""===ue||me)return;let e={className:"itd-upload-failed itd-failed-status",onPointerOver:()=>ge(!0),onPointerOut:()=>ge(!1)};return r.jsxs(sp,{...e,children:[he?r.jsx(lp,{className:"itd-upload-error-tooltip itd-error-tooltip",children:ue}):null,He]})},Ge=()=>{if(X)return null===se?r.jsx(Qo,{width:24,height:24}):!1===se?r.jsx(ii,{width:40,height:40}):r.jsx(Mi,{src:de||"",width:Uo(h),height:Uo(g)})},We=()=>{let e=(te||ne)&&!me&&!J;return r.jsx(np,{$isHover:e,className:"itd-upload-overlay",children:r.jsxs(rp,{$isHover:e,className:"itd-upload-overlay-content",children:[r.jsx("span",{className:"itd-upload-header",children:q("uploader.header")}),r.jsx("span",{className:"itd-upload-hint",children:q("uploader.hint")})]})})};return r.jsxs(Ju,{className:"itd-upload",$fluid:p,children:[r.jsx("input",{type:"file",id:e,accept:Q,onChange:De,onFocus:e=>{e.target.matches(":focus-visible")&&ae(!0)},onBlur:()=>ae(!1),onPointerOver:()=>{!ne&&re(!0)},onPointerOut:()=>{!ne&&re(!1)},onDragOver:Le,onDragLeave:Ne,onDrop:Me,disabled:me||J,ref:H}),r.jsx(Qu,{$showFocus:ie,className:"itd-upload-label",children:r.jsxs(Zu,{$showBorder:(ne||te)&&!me,$padding:u,$disabled:_,$hasError:""!==ue&&!me,$fileWidth:h,$fileHeight:g,$maxFileWidth:m,$maxFileHeight:b,$containerWidth:x,$containerHeight:v,className:"itd-upload-content",children:[Ge(),r.jsxs(op,{className:"itd-upload-status",$isActive:me,$complete:"success"===ke?.status,$error:"error"===ke?.status,children:[r.jsx(ip,{className:"itd-upload-status-box",$progress:ve?ve.progress:0,$complete:"success"===ke?.status,$error:"error"===ke?.status}),r.jsx("span",{className:"itd-upload-status-message",children:q(we||ke?String(ke?.message):"uploader.fileUploading")}),ve?r.jsx("span",{className:"itd-upload-status-info",children:q("uploader.info",{total:ve.total,estimated:ve.estimated})}):r.jsx("span",{className:"itd-upload-status-calculating",children:q("uploader.calculating")})]}),We(),r.jsxs(ep,{$position:""===ue?c:"default",children:[r.jsxs(qf,{vertical:!0,gap:"small",className:"itd-upload-icons",children:[Be(),Ve()]}),Ue()]})]})})]})}),cp=l.div`
   position: relative;
   width: ${({$width:e})=>"number"==typeof e?`${e}px`:e||"100%"};
   height: ${({$height:e})=>"number"==typeof e?`${e}px`:e||"400px"};
@@ -4173,7 +4173,7 @@
   /* Grid lines */
   &::before,
   &::after {
-    content: "";
+    content: ${({$showGrid:e})=>e?'""':"none"};
     position: absolute;
     background: rgba(255, 255, 255, 0.3);
   }
@@ -4215,7 +4215,7 @@
     background: #f0f0f0;
     transform: ${({$position:e})=>{switch(e){case"ne":return"translate(50%, -50%) scale(1.1)";case"sw":return"translate(-50%, 50%) scale(1.1)";case"se":return"translate(50%, 50%) scale(1.1)";default:return"translate(-50%, -50%) scale(1.1)"}}};
   }
-`,mp=n.forwardRef(({src:e,aspectRatio:t,minWidth:o=50,minHeight:i=50,quality:a=.9,outputFormat:s="image/jpeg",onCropChange:l,width:d,height:c},u)=>{const p=n.useRef(null),f=n.useRef(null),[h,g]=n.useState(!1),[m,b]=n.useState({x:0,y:0,width:100,height:100}),[x,v]=n.useState(!1),[y,w]=n.useState(null),[A,k]=n.useState({x:0,y:0}),[S,_]=n.useState({x:0,y:0,width:0,height:0}),E=n.useCallback(()=>{if(!f.current||!p.current)return;const e=f.current.getBoundingClientRect(),r=p.current.getBoundingClientRect(),n={x:e.left-r.left,y:e.top-r.top,width:e.width,height:e.height},a=e.width/f.current.naturalWidth,s=e.height/f.current.naturalHeight,d=o*a,c=i*s;let u=Math.max(.8*n.width,d),h=Math.max(.8*n.height,c);if(u=Math.min(u,n.width),h=Math.min(h,n.height),t){if(u/h>t){const e=h*t;e>=d?u=e:(u=d,h=u/t)}else{const e=u/t;e>=c?h=e:(h=c,u=h*t)}u>n.width&&(u=n.width,h=u/t),h>n.height&&(h=n.height,u=h*t)}const g={x:n.x+(n.width-u)/2,y:n.y+(n.height-h)/2,width:u,height:h};b(g),l?.(g)},[t,o,i,l]);n.useEffect(()=>{h&&E()},[h,E]),n.useEffect(()=>{const e=()=>{h&&E()};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[h,E]);const C=n.useCallback(e=>{if(!f.current||!p.current)return e;const t=f.current.getBoundingClientRect(),r=p.current.getBoundingClientRect(),n={left:t.left-r.left,top:t.top-r.top,right:t.right-r.left,bottom:t.bottom-r.top};let{x:o,y:i,width:a,height:s}=e;return o=Math.max(n.left,Math.min(o,n.right-a)),i=Math.max(n.top,Math.min(i,n.bottom-s)),a=Math.min(a,n.right-o),s=Math.min(s,n.bottom-i),{x:o,y:i,width:a,height:s}},[]),$=e=>{e.preventDefault();const t="touches"in e?e.touches[0].clientX:e.clientX,r="touches"in e?e.touches[0].clientY:e.clientY;v(!0),k({x:t,y:r}),_({...m})},j=e=>t=>{t.preventDefault(),t.stopPropagation();const r="touches"in t?t.touches[0].clientX:t.clientX,n="touches"in t?t.touches[0].clientY:t.clientY;w(e),k({x:r,y:n}),_({...m})};n.useEffect(()=>{const e=e=>{if(!x&&!y)return;if(!f.current||!p.current)return;const r="touches"in e?e.touches[0].clientX:e.clientX,n="touches"in e?e.touches[0].clientY:e.clientY,a=r-A.x,s=n-A.y,d=f.current.getBoundingClientRect(),c=p.current.getBoundingClientRect(),u=d.width/f.current.naturalWidth,h=d.height/f.current.naturalHeight,g=o*u,m=i*h,v=d.left-c.left,w=d.top-c.top,k=d.right-c.left,_=d.bottom-c.top;let E;if(x)E=C({...S,x:S.x+a,y:S.y+s});else{if(!y)return;{let e=S.width,r=S.height,n=S.x,o=S.y;const i=S.x+S.width,l=S.y+S.height;switch(y){case"se":{e=Math.max(g,S.width+a);const n=k-S.x;if(e=Math.min(e,n),t){r=e/t;const n=_-S.y;r>n&&(r=n,e=r*t)}else r=Math.max(m,S.height+s),r=Math.min(r,_-S.y);break}case"sw":{e=Math.max(g,S.width-a);const o=i-v;if(e=Math.min(e,o),t){r=e/t;const n=_-S.y;r>n&&(r=n,e=r*t)}else r=Math.max(m,S.height+s),r=Math.min(r,_-S.y);n=i-e;break}case"ne":{e=Math.max(g,S.width+a);const n=k-S.x;if(e=Math.min(e,n),t){r=e/t;const n=l-w;r>n&&(r=n,e=r*t)}else r=Math.max(m,S.height-s),r=Math.min(r,l-w);o=l-r;break}case"nw":{e=Math.max(g,S.width-a);const d=i-v;if(e=Math.min(e,d),t){r=e/t;const n=l-w;r>n&&(r=n,e=r*t)}else r=Math.max(m,S.height-s),r=Math.min(r,l-w);n=i-e,o=l-r;break}}E={x:n,y:o,width:e,height:r}}}b(E),l?.(E)},r=()=>{v(!1),w(null)};return(x||y)&&(document.addEventListener("mousemove",e),document.addEventListener("mouseup",r),document.addEventListener("touchmove",e),document.addEventListener("touchend",r)),()=>{document.removeEventListener("mousemove",e),document.removeEventListener("mouseup",r),document.removeEventListener("touchmove",e),document.removeEventListener("touchend",r)}},[x,y,A,S,C,t,o,i,l]);const F=n.useCallback(async()=>{if(!f.current||!p.current)return null;const e=f.current,t=e.getBoundingClientRect(),r=p.current.getBoundingClientRect(),n=e.naturalWidth/t.width,o=e.naturalHeight/t.height,i=t.left-r.left,l=t.top-r.top,d=(m.x-i)*n,c=(m.y-l)*o,u=m.width*n,h=m.height*o,g=document.createElement("canvas");g.width=u,g.height=h;const b=g.getContext("2d");return b?(b.drawImage(e,d,c,u,h,0,0,u,h),new Promise(e=>{g.toBlob(t=>e(t),s,a)})):null},[m,s,a]),z=n.useCallback(async(e="cropped-image")=>{const t=await F();if(!t)return null;const r=s.split("/")[1];return new File([t],`${e}.${r}`,{type:s})},[F,s]);return n.useImperativeHandle(u,()=>({getCroppedImage:F,getCroppedFile:z,getCropArea:()=>m,reset:E})),r.jsxs(cp,{ref:p,$width:d,$height:c,children:[r.jsx(up,{children:r.jsx(pp,{ref:f,src:e,onLoad:()=>g(!0),alt:"Crop preview",draggable:!1})}),h&&r.jsx(fp,{children:r.jsxs(hp,{$cropArea:m,onMouseDown:$,onTouchStart:$,children:[r.jsx(gp,{$position:"nw",onMouseDown:j("nw"),onTouchStart:j("nw")}),r.jsx(gp,{$position:"ne",onMouseDown:j("ne"),onTouchStart:j("ne")}),r.jsx(gp,{$position:"sw",onMouseDown:j("sw"),onTouchStart:j("sw")}),r.jsx(gp,{$position:"se",onMouseDown:j("se"),onTouchStart:j("se")})]})})]})});mp.displayName="ImageCropper";const bp=l(a.NavLink)`
+`,mp=n.forwardRef(({src:e,aspectRatio:t,minWidth:o,minHeight:i,outputWidth:a,outputHeight:s,quality:l=.9,outputFormat:d="image/jpeg",onCropChange:c,width:u,height:p,showGrid:f=!0},h)=>{const g=n.useRef(null),m=n.useRef(null),[b,x]=n.useState(!1),v=o??(a?Math.round(a/4):200),y=i??(s?Math.round(s/4):200),[w,A]=n.useState({x:0,y:0,width:100,height:100}),[k,S]=n.useState(!1),[_,E]=n.useState(null),[C,$]=n.useState({x:0,y:0}),[j,F]=n.useState({x:0,y:0,width:0,height:0}),z=n.useCallback(()=>{if(!m.current||!g.current)return;const e=m.current.getBoundingClientRect(),r=g.current.getBoundingClientRect(),n={x:e.left-r.left,y:e.top-r.top,width:e.width,height:e.height},o=e.width/m.current.naturalWidth,i=e.height/m.current.naturalHeight,a=v*o,s=y*i;let l=Math.max(.8*n.width,a),d=Math.max(.8*n.height,s);if(l=Math.min(l,n.width),d=Math.min(d,n.height),t){if(l/d>t){const e=d*t;e>=a?l=e:(l=a,d=l/t)}else{const e=l/t;e>=s?d=e:(d=s,l=d*t)}l>n.width&&(l=n.width,d=l/t),d>n.height&&(d=n.height,l=d*t)}const u={x:n.x+(n.width-l)/2,y:n.y+(n.height-d)/2,width:l,height:d};A(u),c?.(u)},[t,v,y,c]);n.useEffect(()=>{b&&z()},[b,z]),n.useEffect(()=>{const e=()=>{b&&z()};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[b,z]);const L=n.useCallback(e=>{if(!m.current||!g.current)return e;const t=m.current.getBoundingClientRect(),r=g.current.getBoundingClientRect(),n={left:t.left-r.left,top:t.top-r.top,right:t.right-r.left,bottom:t.bottom-r.top};let{x:o,y:i,width:a,height:s}=e;return o=Math.max(n.left,Math.min(o,n.right-a)),i=Math.max(n.top,Math.min(i,n.bottom-s)),a=Math.min(a,n.right-o),s=Math.min(s,n.bottom-i),{x:o,y:i,width:a,height:s}},[]),N=e=>{e.preventDefault();const t="touches"in e?e.touches[0].clientX:e.clientX,r="touches"in e?e.touches[0].clientY:e.clientY;S(!0),$({x:t,y:r}),F({...w})},M=e=>t=>{t.preventDefault(),t.stopPropagation();const r="touches"in t?t.touches[0].clientX:t.clientX,n="touches"in t?t.touches[0].clientY:t.clientY;E(e),$({x:r,y:n}),F({...w})};n.useEffect(()=>{const e=e=>{if(!k&&!_)return;if(!m.current||!g.current)return;const r="touches"in e?e.touches[0].clientX:e.clientX,n="touches"in e?e.touches[0].clientY:e.clientY,o=r-C.x,i=n-C.y,a=m.current.getBoundingClientRect(),s=g.current.getBoundingClientRect(),l=a.width/m.current.naturalWidth,d=a.height/m.current.naturalHeight,u=v*l,p=y*d,f=a.left-s.left,h=a.top-s.top,b=a.right-s.left,x=a.bottom-s.top;let w;if(k)w=L({...j,x:j.x+o,y:j.y+i});else{if(!_)return;{let e=j.width,r=j.height,n=j.x,a=j.y;const s=j.x+j.width,l=j.y+j.height;switch(_){case"se":{e=Math.max(u,j.width+o);const n=b-j.x;if(e=Math.min(e,n),t){r=e/t;const n=x-j.y;r>n&&(r=n,e=r*t)}else r=Math.max(p,j.height+i),r=Math.min(r,x-j.y);break}case"sw":{e=Math.max(u,j.width-o);const a=s-f;if(e=Math.min(e,a),t){r=e/t;const n=x-j.y;r>n&&(r=n,e=r*t)}else r=Math.max(p,j.height+i),r=Math.min(r,x-j.y);n=s-e;break}case"ne":{e=Math.max(u,j.width+o);const n=b-j.x;if(e=Math.min(e,n),t){r=e/t;const n=l-h;r>n&&(r=n,e=r*t)}else r=Math.max(p,j.height-i),r=Math.min(r,l-h);a=l-r;break}case"nw":{e=Math.max(u,j.width-o);const d=s-f;if(e=Math.min(e,d),t){r=e/t;const n=l-h;r>n&&(r=n,e=r*t)}else r=Math.max(p,j.height-i),r=Math.min(r,l-h);n=s-e,a=l-r;break}}switch(e<u&&(e=u,t&&(r=e/t)),r<p&&(r=p,t&&(e=r*t)),_){case"se":n=j.x,a=j.y;break;case"sw":n=s-e,a=j.y;break;case"ne":n=j.x,a=l-r;break;case"nw":n=s-e,a=l-r}w={x:n,y:a,width:e,height:r}}}A(w),c?.(w)},r=()=>{S(!1),E(null)};return(k||_)&&(document.addEventListener("mousemove",e),document.addEventListener("mouseup",r),document.addEventListener("touchmove",e),document.addEventListener("touchend",r)),()=>{document.removeEventListener("mousemove",e),document.removeEventListener("mouseup",r),document.removeEventListener("touchmove",e),document.removeEventListener("touchend",r)}},[k,_,C,j,L,t,v,y,c]);const D=n.useCallback(async()=>{if(!m.current||!g.current)return null;const e=m.current,t=e.getBoundingClientRect(),r=g.current.getBoundingClientRect(),n=e.naturalWidth/t.width,o=e.naturalHeight/t.height,i=t.left-r.left,c=t.top-r.top,u=(w.x-i)*n,p=(w.y-c)*o,f=w.width*n,h=w.height*o,b=document.createElement("canvas"),x=a||f,v=s||h;b.width=x,b.height=v;const y=b.getContext("2d");return y?(y.imageSmoothingEnabled=!0,y.imageSmoothingQuality="high",y.drawImage(e,u,p,f,h,0,0,x,v),new Promise(e=>{b.toBlob(t=>e(t),d,l)})):null},[w,d,l,a,s]),T=n.useCallback(async(e="cropped-image")=>{const t=await D();if(!t)return null;const r=d.split("/")[1];return new File([t],`${e}.${r}`,{type:d})},[D,d]);return n.useImperativeHandle(h,()=>({getCroppedImage:D,getCroppedFile:T,getCropArea:()=>w,reset:z})),r.jsxs(cp,{ref:g,$width:u,$height:p,children:[r.jsx(up,{children:r.jsx(pp,{ref:m,src:e,onLoad:()=>x(!0),alt:"Crop preview",draggable:!1})}),b&&r.jsx(fp,{children:r.jsxs(hp,{$cropArea:w,$showGrid:f,onMouseDown:N,onTouchStart:N,children:[r.jsx(gp,{$position:"nw",onMouseDown:M("nw"),onTouchStart:M("nw")}),r.jsx(gp,{$position:"ne",onMouseDown:M("ne"),onTouchStart:M("ne")}),r.jsx(gp,{$position:"sw",onMouseDown:M("sw"),onTouchStart:M("sw")}),r.jsx(gp,{$position:"se",onMouseDown:M("se"),onTouchStart:M("se")})]})})]})});mp.displayName="ImageCropper";const bp=l(a.NavLink)`
 
   text-decoration: none;
   

package/dist/index.d.mts

@@ -76,6 +76,10 @@ export declare const resources: {
                 cropImage: string;
                 crop: string;
                 cancel: string;
+                width: string;
+                height: string;
+                imageTooSmall: string;
+                imageTooSmallMessage: string;
             };
             results: {
                 authentication: {
@@ -378,6 +382,10 @@ export declare const resources: {
                 cropImage: string;
                 crop: string;
                 cancel: string;
+                width: string;
+                height: string;
+                imageTooSmall: string;
+                imageTooSmallMessage: string;
             };
             results: {
                 authentication: {
@@ -695,7 +703,7 @@ export type { NotificationsProps } from './types/NotificationsProps';
 export type { AlertProps, AlertType, AlertSize } from './types/AlertProps';
 export type { SwitchProps } from './types/SwitchProps';
 export type { ModalProps, ModalContentProps, ModalRefProps } from './types/ModalProps';
-export type { UploadProps, UploadProgressProps, UploadResultMessageProps } from './types/UploadProps';
+export type { UploadProps, UploadProgressProps, UploadResultMessageProps, CropSettings } from './types/UploadProps';
 export type { ResultProps } from './types/ResultProps';
 export type { TabsItemProps, TabsProps } from './types/TabsProps';
 export type { TableColumnType, TableProps, TableTRProps, TableRow, TableRefProps } from './types/TableProps';

package/dist/index.d.ts

@@ -589,6 +589,10 @@ interface ImageCropperProps {
     minWidth?: number;
     /** Minimum crop height in pixels */
     minHeight?: number;
+    /** Output width - cropped image will be resized to this width */
+    outputWidth?: number;
+    /** Output height - cropped image will be resized to this height */
+    outputHeight?: number;
     /** Output image quality (0-1) */
     quality?: number;
     /** Output image format */
@@ -599,6 +603,8 @@ interface ImageCropperProps {
     width?: string | number;
     /** Container height */
     height?: string | number;
+    /** Show grid lines on crop area (default: true) */
+    showGrid?: boolean;
 }
 interface ImageCropperRef {
     /** Get cropped image as Blob */
@@ -1424,6 +1430,27 @@ type ModalRefProps = {
     onClickCancel?: () => void;
 };
 
+/**
+ * Crop settings for the Upload component
+ */
+type CropSettings = {
+    /** Aspect ratio (e.g., 1 for square, 16/9 for widescreen). */
+    aspectRatio?: number;
+    /** Minimum crop area width in pixels. User cannot select smaller than this. */
+    minWidth?: number;
+    /** Minimum crop area height in pixels. User cannot select smaller than this. */
+    minHeight?: number;
+    /** Output width in pixels. Cropped image will be resized to this width. */
+    outputWidth?: number;
+    /** Output height in pixels. Cropped image will be resized to this height. */
+    outputHeight?: number;
+    /** Output image quality (0-1), default 0.9 */
+    quality?: number;
+    /** Crop modal title */
+    modalTitle?: string;
+    /** Show grid lines on crop area (default: true) */
+    showGrid?: boolean;
+};
 type UploadProps = {
     id?: string;
     action?: string;
@@ -1455,22 +1482,24 @@ type UploadProps = {
     extraQueryString?: {};
     extraHeader?: {};
     disabled?: boolean;
-    /** Minimum image width required for upload (in pixels). Smaller images will be rejected. */
+    /** Minimum image width required for upload (in pixels). Smaller images will be rejected. Works with or without crop. */
     minImageWidth?: number;
-    /** Minimum image height required for upload (in pixels). Smaller images will be rejected. */
+    /** Minimum image height required for upload (in pixels). Smaller images will be rejected. Works with or without crop. */
     minImageHeight?: number;
-    /** Enable image cropping before upload */
-    enableCrop?: boolean;
-    /** Aspect ratio for crop (e.g., 1 for square, 16/9 for widescreen). Undefined = free crop */
-    cropAspectRatio?: number;
-    /** Minimum crop width in pixels */
-    cropMinWidth?: number;
-    /** Minimum crop height in pixels */
-    cropMinHeight?: number;
-    /** Output image quality (0-1), default 0.9 */
-    cropQuality?: number;
-    /** Crop modal title */
-    cropModalTitle?: string;
+    /**
+     * Crop settings. If provided, cropping is enabled.
+     * @example
+     * crop={{
+     *   aspectRatio: 16/9,
+     *   minWidth: 960,       // Minimum crop area size
+     *   minHeight: 540,
+     *   outputWidth: 1920,   // Final output size
+     *   outputHeight: 1080,
+     *   quality: 0.9,
+     *   modalTitle: "Crop Image"
+     * }}
+     */
+    crop?: CropSettings;
     onChange?: ((value: any) => void) | null;
     onUpdate?: ((value: any, update: any, validation: boolean) => void) | null;
     onUploadSuccess?: (path: string) => void;
@@ -2294,4 +2323,4 @@ declare const resources: {
 };
 
 export { _default as ALink, Accordion, AddDefaultThemeStyle, AddDefaultUnit, AddZero, Alert, Arrow as ArrowIcon, BackToTop, BackTop, Base64Decode, Base64Encode, Button, Calendar, Card, CheckFileURL, Checkbox, Checkmark, ChunkArray, Collapse, ComponentPositions, ComponentSizes, ComponentSizesSlug, ConnectionStatus, ConsoleLog, ConvertCurrency, DatePicker, DetermineNewHeight, DetermineNewWidth, FileChecker, FileExtensions, FileTypes, FindSelector, Flex, Form, FormValidationTypes, FormatBytes, FormatDate, FormatDateTime, FormatSimpleDate, FormatSimpleDateTime, FormatTime, GetByCurrency, GetCountryCodeByCurrencyCode, GetCountryCodeByLanguage, GetCurrencyFormat, GetCurrencySymbol, GetDecimalByCurrency, GetTypeByFileType, H1, H2, H3, H4, ITDContext, ITDProvider, _default$1 as Image, ImageCropper, _default$5 as InlineSVGCached, InlineSelect, InlineSelectArrow, Input, IsValidJSON, Lock as LockIcon, ModalManager, ModalState, NoData, Notification, Picture, Progress, Radio, RemoveUnits, Result, SVGLoader, Select, Spin, Status, Switch, Table, Tabs, TextArea, TinyScrollbar, Trash, UniUpperCase, UpdateThemeStyle, Upload, Upload$1 as UploadIcon, Wait, ZoomIn, ZoomOut, resources, toKebabCase, useAddExternalCSS, useAvoidCollision, useComponentSize, useConnectionStatus, useConstructor, useContextBridge, useCoreFetch, useKeyboardShortcut, useMultiQuery, useOnClickOutside, useOnESCKeyDown, useOnResize, useOrientation, useReCaptcha, useSingleQuery };
-export type { AccordionItemProps, AccordionProps, AccordionSubMenuProps, AlertProps, AlertSize, AlertType, ButtonProps, ButtonState, ButtonType, ButtonVariant, CalendarDayProps, CalendarProps, CalendarValueProps, CardProps, CheckboxEvent, CheckboxGroupProps, CheckboxProps, CropArea, DatePickerProps, Direction, FieldUpdateProps, FlexAlignProps, FlexGapProps, FlexJustifyProps, FlexProps, FormContextType, FormItemProps, FormProps, FormRuleProps, FormSubComponentProps, FormValueProps, GroupCheckboxOptionType, ITDContextType, ITDImperativeFuncProps, ITDProviderProps, ITDSize, ITDSizeSlug, ImageCropperProps, ImageCropperRef, InputProps, InputVariant, ModalContentProps, ModalProps, ModalRefProps, NotificationContextType, NotificationsProps, ProgressProps, ProgressStatus, QueryValueProps, RadioButtonProps, RadioGroupProps, RadioType, ResultProps, SelectDirection, SelectOptionProps, SelectPosition, SelectProps, SelectToggleProps, SelectValue, SelectVariant, SingleQueryProps, StatusProps, StatusVariant, SwitchProps, TableColumnType, TableProps, TableRefProps, TableRow, TableTRProps, TabsItemProps, TabsProps, TextAreaEvent, TextAreaProps, TextAreaVariant, UploadProgressProps, UploadProps, UploadResultMessageProps };
+export type { AccordionItemProps, AccordionProps, AccordionSubMenuProps, AlertProps, AlertSize, AlertType, ButtonProps, ButtonState, ButtonType, ButtonVariant, CalendarDayProps, CalendarProps, CalendarValueProps, CardProps, CheckboxEvent, CheckboxGroupProps, CheckboxProps, CropArea, CropSettings, DatePickerProps, Direction, FieldUpdateProps, FlexAlignProps, FlexGapProps, FlexJustifyProps, FlexProps, FormContextType, FormItemProps, FormProps, FormRuleProps, FormSubComponentProps, FormValueProps, GroupCheckboxOptionType, ITDContextType, ITDImperativeFuncProps, ITDProviderProps, ITDSize, ITDSizeSlug, ImageCropperProps, ImageCropperRef, InputProps, InputVariant, ModalContentProps, ModalProps, ModalRefProps, NotificationContextType, NotificationsProps, ProgressProps, ProgressStatus, QueryValueProps, RadioButtonProps, RadioGroupProps, RadioType, ResultProps, SelectDirection, SelectOptionProps, SelectPosition, SelectProps, SelectToggleProps, SelectValue, SelectVariant, SingleQueryProps, StatusProps, StatusVariant, SwitchProps, TableColumnType, TableProps, TableRefProps, TableRow, TableTRProps, TabsItemProps, TabsProps, TextAreaEvent, TextAreaProps, TextAreaVariant, UploadProgressProps, UploadProps, UploadResultMessageProps };