@mage-ui/components 1.0.115 → 1.0.116

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -28,6 +28,7 @@ type DropzoneProps = {
28
28
  initialFiles?: Record<string, FileData>;
29
29
  maxFiles?: number;
30
30
  data?: Record<string, unknown>;
31
+ headers?: Record<string, string>;
31
32
  url: string;
32
33
  accept?: string[];
33
34
  preventDropOnDocument?: boolean;
@@ -54,6 +55,7 @@ type DropzoneProps = {
54
55
  };
55
56
  declare const Dropzone: ({
56
57
  data,
58
+ headers,
57
59
  children,
58
60
  initialFiles,
59
61
  maxFiles,
@@ -1 +1 @@
1
- {"version":3,"file":"Dropzone.d.mts","names":[],"sources":["../../../../src/components/controls/dropzone/Dropzone.tsx"],"mappings":";;;;;;KA2BY,QAAA;EACV,IAAA;EACA,IAAA;EACA,IAAA;EACA,IAAA;EACA,QAAA;EACA,OAAA;EACA,GAAA;EACA,KAAA;EACA,QAAA;AAAA;AAAA,KAGU,aAAA;EACV,QAAA;IACE,KAAA;IACA,WAAA;IACA;EAAA;IAEA,KAAA,EAAO,MAAA,SAAe,QAAA;IACtB,WAAA;IACA,UAAA,GAAa,QAAA;EAAA,MACT,SAAA;EACN,YAAA,GAAe,MAAA,SAAe,QAAA;EAC9B,QAAA;EACA,IAAA,GAAO,MAAA;EACP,GAAA;EACA,MAAA;EACA,qBAAA;EACA,KAAA,GAAQ,SAAA;EACR,QAAA,GAAW,SAAA;EACX,IAAA,GAAO,SAAA;EACP,OAAA;EACA,cAAA,IAAkB,IAAA,EAAM,QAAA;EACxB,UAAA;IACE,QAAA;IACA,IAAA;IACA,gBAAA;MACE,IAAA;MACA,KAAA;IAAA;IAEF,QAAA;IACA,YAAA,GAAe,SAAA;IACf,MAAA,GAAS,eAAA;IACT,QAAA;IACA,KAAA;IACA,QAAA;IACA,IAAA;EAAA;AAAA;AAAA,cAIS,QAAA;EAAY,IAAA;EAAA,QAAA;EAAA,YAAA;EAAA,QAAA;EAAA,MAAA;EAAA,GAAA;EAAA,KAAA;EAAA,QAAA;EAAA,IAAA;EAAA,OAAA;EAAA,cAAA;EAAA;AAAA,GAatB,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
1
+ {"version":3,"file":"Dropzone.d.mts","names":[],"sources":["../../../../src/components/controls/dropzone/Dropzone.tsx"],"mappings":";;;;;;KA2BY,QAAA;EACV,IAAA;EACA,IAAA;EACA,IAAA;EACA,IAAA;EACA,QAAA;EACA,OAAA;EACA,GAAA;EACA,KAAA;EACA,QAAA;AAAA;AAAA,KAGU,aAAA;EACV,QAAA;IACE,KAAA;IACA,WAAA;IACA;EAAA;IAEA,KAAA,EAAO,MAAA,SAAe,QAAA;IACtB,WAAA;IACA,UAAA,GAAa,QAAA;EAAA,MACT,SAAA;EACN,YAAA,GAAe,MAAA,SAAe,QAAA;EAC9B,QAAA;EACA,IAAA,GAAO,MAAA;EACP,OAAA,GAAU,MAAA;EACV,GAAA;EACA,MAAA;EACA,qBAAA;EACA,KAAA,GAAQ,SAAA;EACR,QAAA,GAAW,SAAA;EACX,IAAA,GAAO,SAAA;EACP,OAAA;EACA,cAAA,IAAkB,IAAA,EAAM,QAAA;EACxB,UAAA;IACE,QAAA;IACA,IAAA;IACA,gBAAA;MACE,IAAA;MACA,KAAA;IAAA;IAEF,QAAA;IACA,YAAA,GAAe,SAAA;IACf,MAAA,GAAS,eAAA;IACT,QAAA;IACA,KAAA;IACA,QAAA;IACA,IAAA;EAAA;AAAA;AAAA,cAIS,QAAA;EAAY,IAAA;EAAA,OAAA;EAAA,QAAA;EAAA,YAAA;EAAA,QAAA;EAAA,MAAA;EAAA,GAAA;EAAA,KAAA;EAAA,QAAA;EAAA,IAAA;EAAA,OAAA;EAAA,cAAA;EAAA;AAAA,GActB,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
@@ -1,2 +1,2 @@
1
- import{Icon as e}from"../../data-display/icons/icon/Icon.mjs";import{LoaderOval as t}from"../../data-display/loader-oval/LoaderOval.mjs";import{useDropzoneState as n}from"./use-dropzone-state.mjs";import{cx as r}from"@mage-ui/styled-system/css";import{dropzone as i,dropzoneDropzoneInner as a,dropzoneDropzoneRoot as o,dropzoneHint as s,dropzoneIcon as c,dropzoneIconSlot as l,dropzoneLoader as u,dropzoneLoaderRoot as d,dropzoneRoot as f,dropzoneSubtitle as p,dropzoneTextSlot as m,dropzoneTitle as h}from"@mage-ui/styled-system/recipes";import{Fragment as g,jsx as _,jsxs as v}from"react/jsx-runtime";import{useCallback as y,useRef as b}from"react";import{Dropzone as x}from"@mantine/dropzone";const S=({data:S,children:C,initialFiles:w={},maxFiles:T,accept:E,url:D,title:O,subtitle:k,hint:A,inputId:j,onFileUploaded:M,classNames:N})=>{let P=b(null),{files:F,isUploading:I,uploadMultipleFiles:L,removeFile:R}=n(D,w,M),z=y(async e=>{let t=Object.keys(F).length,n=(T??1/0)-t;n<=0||await L(e.slice(0,n),S)},[L,S,F,T]);return v(`div`,{className:r(N?.dropzone??i(),N?.root??f()),children:[v(x,{ref:P,onDrop:z,disabled:Object.keys(F).length>=(T??1/0),loading:I,accept:E,preventDropOnDocument:!0,inputProps:{id:j},classNames:{root:N?.dropzoneDropzone?.root??r(o(),`group`),inner:N?.dropzoneDropzone?.inner??a()},children:[_(`div`,{className:N?.iconSlot??l(),children:I?_(t,{classNames:{loader:N?.loader?.loader??u(),root:N?.loader?.root??d()}}):v(g,{children:[_(x.Idle,{children:_(e,{name:`mage-dropzone-upload-01`,path:`/icons/sprite-mage.svg`,classNames:{icon:N?.dropzoneIcon?.icon??c()}})}),_(x.Accept,{children:_(e,{name:`mage-dropzone-thumbs-up`,path:`/icons/sprite-mage.svg`,classNames:{icon:N?.dropzoneIcon?.icon??c()}})}),_(x.Reject,{children:_(e,{name:`mage-dropzone-thumbs-down`,path:`/icons/sprite-mage.svg`,classNames:{icon:N?.dropzoneIcon?.icon??c()}})})]})}),v(`div`,{className:N?.textSlot??m(),children:[_(`span`,{className:N?.title??h(),children:O||`Upload files`}),_(`span`,{className:N?.subtitle??p(),children:k||`Drag images here or click to select files`}),_(`span`,{className:N?.hint??s(),children:A||`Attach as many files as you like, each file should not exceed 5mb`})]})]}),C({files:F,isUploading:I,removeFile:R})]})};export{S as Dropzone};
1
+ import{Icon as e}from"../../data-display/icons/icon/Icon.mjs";import{LoaderOval as t}from"../../data-display/loader-oval/LoaderOval.mjs";import{useDropzoneState as n}from"./use-dropzone-state.mjs";import{cx as r}from"@mage-ui/styled-system/css";import{dropzone as i,dropzoneDropzoneInner as a,dropzoneDropzoneRoot as o,dropzoneHint as s,dropzoneIcon as c,dropzoneIconSlot as l,dropzoneLoader as u,dropzoneLoaderRoot as d,dropzoneRoot as f,dropzoneSubtitle as p,dropzoneTextSlot as m,dropzoneTitle as h}from"@mage-ui/styled-system/recipes";import{Fragment as g,jsx as _,jsxs as v}from"react/jsx-runtime";import{useCallback as y,useRef as b}from"react";import{Dropzone as x}from"@mantine/dropzone";const S=({data:S,headers:C,children:w,initialFiles:T={},maxFiles:E,accept:D,url:O,title:k,subtitle:A,hint:j,inputId:M,onFileUploaded:N,classNames:P})=>{let F=b(null),{files:I,isUploading:L,uploadMultipleFiles:R,removeFile:z}=n(O,T,N,C),B=y(async e=>{let t=Object.keys(I).length,n=(E??1/0)-t;n<=0||await R(e.slice(0,n),S)},[R,S,I,E]);return v(`div`,{className:r(P?.dropzone??i(),P?.root??f()),children:[v(x,{ref:F,onDrop:B,disabled:Object.keys(I).length>=(E??1/0),loading:L,accept:D,preventDropOnDocument:!0,inputProps:{id:M},classNames:{root:P?.dropzoneDropzone?.root??r(o(),`group`),inner:P?.dropzoneDropzone?.inner??a()},children:[_(`div`,{className:P?.iconSlot??l(),children:L?_(t,{classNames:{loader:P?.loader?.loader??u(),root:P?.loader?.root??d()}}):v(g,{children:[_(x.Idle,{children:_(e,{name:`mage-dropzone-upload-01`,path:`/icons/sprite-mage.svg`,classNames:{icon:P?.dropzoneIcon?.icon??c()}})}),_(x.Accept,{children:_(e,{name:`mage-dropzone-thumbs-up`,path:`/icons/sprite-mage.svg`,classNames:{icon:P?.dropzoneIcon?.icon??c()}})}),_(x.Reject,{children:_(e,{name:`mage-dropzone-thumbs-down`,path:`/icons/sprite-mage.svg`,classNames:{icon:P?.dropzoneIcon?.icon??c()}})})]})}),v(`div`,{className:P?.textSlot??m(),children:[_(`span`,{className:P?.title??h(),children:k||`Upload files`}),_(`span`,{className:P?.subtitle??p(),children:A||`Drag images here or click to select files`}),_(`span`,{className:P?.hint??s(),children:j||`Attach as many files as you like, each file should not exceed 5mb`})]})]}),w({files:I,isUploading:L,removeFile:z})]})};export{S as Dropzone};
2
2
  //# sourceMappingURL=Dropzone.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropzone.mjs","names":["Dropzone","MantineDropzone"],"sources":["../../../../src/components/controls/dropzone/Dropzone.tsx"],"sourcesContent":["import { type ReactNode, useCallback, useRef } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dropzone,\n dropzoneDropzoneInner,\n dropzoneDropzoneRoot,\n dropzoneHint,\n dropzoneIcon,\n dropzoneIconSlot,\n dropzoneLoader,\n dropzoneLoaderRoot,\n dropzoneRoot,\n dropzoneSubtitle,\n dropzoneTextSlot,\n dropzoneTitle,\n} from '@mage-ui/styled-system/recipes';\nimport { Dropzone as MantineDropzone } from '@mantine/dropzone';\nimport {\n Icon,\n type IconProps,\n LoaderOval,\n type LoaderOvalProps,\n} from '@/components/data-display';\n\nimport { useDropzoneState } from './use-dropzone-state';\n\nexport type FileData = {\n name: string;\n size: number;\n type: string;\n date: string;\n uploaded: boolean;\n loading: boolean;\n url: string;\n error?: string;\n progress?: number; // (0-100)\n};\n\nexport type DropzoneProps = {\n children: ({\n files,\n isUploading,\n removeFile,\n }: {\n files: Record<string, FileData>;\n isUploading: boolean;\n removeFile: (fileName: string) => void;\n }) => ReactNode;\n initialFiles?: Record<string, FileData>;\n maxFiles?: number;\n data?: Record<string, unknown>;\n url: string;\n accept?: string[];\n preventDropOnDocument?: boolean;\n title?: ReactNode;\n subtitle?: ReactNode;\n hint?: ReactNode;\n inputId?: string;\n onFileUploaded?: (file: FileData) => void;\n classNames?: {\n dropzone?: string;\n root?: string;\n dropzoneDropzone?: {\n root?: string;\n inner?: string;\n };\n iconSlot?: string;\n dropzoneIcon?: IconProps['classNames'];\n loader?: LoaderOvalProps['classNames'];\n textSlot?: string;\n title?: string;\n subtitle?: string;\n hint?: string;\n };\n};\n\nexport const Dropzone = ({\n data,\n children,\n initialFiles = {},\n maxFiles,\n accept,\n url,\n title,\n subtitle,\n hint,\n inputId,\n onFileUploaded,\n classNames,\n}: DropzoneProps) => {\n const dropzoneRef = useRef<HTMLDivElement>(null);\n const { files, isUploading, uploadMultipleFiles, removeFile } =\n useDropzoneState(url, initialFiles, onFileUploaded);\n const handleDrop = useCallback(\n async (acceptedFiles: File[]) => {\n const currentCount = Object.keys(files).length;\n const max = maxFiles ?? Number.POSITIVE_INFINITY;\n const remainingSlots = max - currentCount;\n if (remainingSlots <= 0) {\n return;\n }\n const filesToUpload = acceptedFiles.slice(0, remainingSlots);\n await uploadMultipleFiles(filesToUpload, data);\n },\n [uploadMultipleFiles, data, files, maxFiles],\n );\n\n return (\n <div\n className={cx(\n classNames?.dropzone ?? dropzone(),\n classNames?.root ?? dropzoneRoot(),\n )}\n >\n <MantineDropzone\n ref={dropzoneRef}\n onDrop={handleDrop}\n disabled={\n Object.keys(files).length >= (maxFiles ?? Number.POSITIVE_INFINITY)\n }\n loading={isUploading}\n accept={accept}\n preventDropOnDocument\n inputProps={{ id: inputId }}\n classNames={{\n root:\n classNames?.dropzoneDropzone?.root ??\n cx(dropzoneDropzoneRoot(), 'group'),\n inner: classNames?.dropzoneDropzone?.inner ?? dropzoneDropzoneInner(),\n }}\n >\n <div className={classNames?.iconSlot ?? dropzoneIconSlot()}>\n {isUploading ? (\n <LoaderOval\n classNames={{\n loader: classNames?.loader?.loader ?? dropzoneLoader(),\n root: classNames?.loader?.root ?? dropzoneLoaderRoot(),\n }}\n />\n ) : (\n <>\n <MantineDropzone.Idle>\n <Icon\n name='mage-dropzone-upload-01'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon: classNames?.dropzoneIcon?.icon ?? dropzoneIcon(),\n }}\n />\n </MantineDropzone.Idle>\n <MantineDropzone.Accept>\n <Icon\n name='mage-dropzone-thumbs-up'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon: classNames?.dropzoneIcon?.icon ?? dropzoneIcon(),\n }}\n />\n </MantineDropzone.Accept>\n <MantineDropzone.Reject>\n <Icon\n name='mage-dropzone-thumbs-down'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon: classNames?.dropzoneIcon?.icon ?? dropzoneIcon(),\n }}\n />\n </MantineDropzone.Reject>\n </>\n )}\n </div>\n <div className={classNames?.textSlot ?? dropzoneTextSlot()}>\n <span className={classNames?.title ?? dropzoneTitle()}>\n {title || 'Upload files'}\n </span>\n <span className={classNames?.subtitle ?? dropzoneSubtitle()}>\n {subtitle || 'Drag images here or click to select files'}\n </span>\n <span className={classNames?.hint ?? dropzoneHint()}>\n {hint ||\n 'Attach as many files as you like, each file should not exceed 5mb'}\n </span>\n </div>\n </MantineDropzone>\n {children({ files, isUploading, removeFile })}\n </div>\n );\n};\n"],"mappings":"wrBA6EA,MAAaA,GAAY,CACvB,OACA,WACA,eAAe,EAAE,CACjB,WACA,SACA,MACA,QACA,WACA,OACA,UACA,iBACA,gBACmB,CACnB,IAAM,EAAc,EAAuB,KAAK,CAC1C,CAAE,QAAO,cAAa,sBAAqB,cAC/C,EAAiB,EAAK,EAAc,EAAe,CAC/C,EAAa,EACjB,KAAO,IAA0B,CAC/B,IAAM,EAAe,OAAO,KAAK,EAAM,CAAC,OAElC,GADM,GAAY,KACK,EACzB,GAAkB,GAItB,MAAM,EADgB,EAAc,MAAM,EAAG,EAAe,CACnB,EAAK,EAEhD,CAAC,EAAqB,EAAM,EAAO,EAAS,CAC7C,CAED,OACE,EAAC,MAAD,CACE,UAAW,EACT,GAAY,UAAY,GAAU,CAClC,GAAY,MAAQ,GAAc,CACnC,UAJH,CAME,EAACC,EAAD,CACE,IAAK,EACL,OAAQ,EACR,SACE,OAAO,KAAK,EAAM,CAAC,SAAW,GAAY,KAE5C,QAAS,EACD,SACR,sBAAA,GACA,WAAY,CAAE,GAAI,EAAS,CAC3B,WAAY,CACV,KACE,GAAY,kBAAkB,MAC9B,EAAG,GAAsB,CAAE,QAAQ,CACrC,MAAO,GAAY,kBAAkB,OAAS,GAAuB,CACtE,UAfH,CAiBE,EAAC,MAAD,CAAK,UAAW,GAAY,UAAY,GAAkB,UACvD,EACC,EAAC,EAAD,CACE,WAAY,CACV,OAAQ,GAAY,QAAQ,QAAU,GAAgB,CACtD,KAAM,GAAY,QAAQ,MAAQ,GAAoB,CACvD,CACD,CAAA,CAEF,EAAA,EAAA,CAAA,SAAA,CACE,EAACA,EAAgB,KAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,cAAc,MAAQ,GAAc,CACvD,CACD,CAAA,CACmB,CAAA,CACvB,EAACA,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,cAAc,MAAQ,GAAc,CACvD,CACD,CAAA,CACqB,CAAA,CACzB,EAACA,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,4BACL,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,cAAc,MAAQ,GAAc,CACvD,CACD,CAAA,CACqB,CAAA,CACxB,CAAA,CAAA,CAED,CAAA,CACN,EAAC,MAAD,CAAK,UAAW,GAAY,UAAY,GAAkB,UAA1D,CACE,EAAC,OAAD,CAAM,UAAW,GAAY,OAAS,GAAe,UAClD,GAAS,eACL,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAY,UAAY,GAAkB,UACxD,GAAY,4CACR,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAY,MAAQ,GAAc,UAChD,GACC,oEACG,CAAA,CACH,GACU,GACjB,EAAS,CAAE,QAAO,cAAa,aAAY,CAAC,CACzC"}
1
+ {"version":3,"file":"Dropzone.mjs","names":["Dropzone","MantineDropzone"],"sources":["../../../../src/components/controls/dropzone/Dropzone.tsx"],"sourcesContent":["import { type ReactNode, useCallback, useRef } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dropzone,\n dropzoneDropzoneInner,\n dropzoneDropzoneRoot,\n dropzoneHint,\n dropzoneIcon,\n dropzoneIconSlot,\n dropzoneLoader,\n dropzoneLoaderRoot,\n dropzoneRoot,\n dropzoneSubtitle,\n dropzoneTextSlot,\n dropzoneTitle,\n} from '@mage-ui/styled-system/recipes';\nimport { Dropzone as MantineDropzone } from '@mantine/dropzone';\nimport {\n Icon,\n type IconProps,\n LoaderOval,\n type LoaderOvalProps,\n} from '@/components/data-display';\n\nimport { useDropzoneState } from './use-dropzone-state';\n\nexport type FileData = {\n name: string;\n size: number;\n type: string;\n date: string;\n uploaded: boolean;\n loading: boolean;\n url: string;\n error?: string;\n progress?: number; // (0-100)\n};\n\nexport type DropzoneProps = {\n children: ({\n files,\n isUploading,\n removeFile,\n }: {\n files: Record<string, FileData>;\n isUploading: boolean;\n removeFile: (fileName: string) => void;\n }) => ReactNode;\n initialFiles?: Record<string, FileData>;\n maxFiles?: number;\n data?: Record<string, unknown>;\n headers?: Record<string, string>;\n url: string;\n accept?: string[];\n preventDropOnDocument?: boolean;\n title?: ReactNode;\n subtitle?: ReactNode;\n hint?: ReactNode;\n inputId?: string;\n onFileUploaded?: (file: FileData) => void;\n classNames?: {\n dropzone?: string;\n root?: string;\n dropzoneDropzone?: {\n root?: string;\n inner?: string;\n };\n iconSlot?: string;\n dropzoneIcon?: IconProps['classNames'];\n loader?: LoaderOvalProps['classNames'];\n textSlot?: string;\n title?: string;\n subtitle?: string;\n hint?: string;\n };\n};\n\nexport const Dropzone = ({\n data,\n headers,\n children,\n initialFiles = {},\n maxFiles,\n accept,\n url,\n title,\n subtitle,\n hint,\n inputId,\n onFileUploaded,\n classNames,\n}: DropzoneProps) => {\n const dropzoneRef = useRef<HTMLDivElement>(null);\n const { files, isUploading, uploadMultipleFiles, removeFile } =\n useDropzoneState(url, initialFiles, onFileUploaded, headers);\n const handleDrop = useCallback(\n async (acceptedFiles: File[]) => {\n const currentCount = Object.keys(files).length;\n const max = maxFiles ?? Number.POSITIVE_INFINITY;\n const remainingSlots = max - currentCount;\n if (remainingSlots <= 0) {\n return;\n }\n const filesToUpload = acceptedFiles.slice(0, remainingSlots);\n await uploadMultipleFiles(filesToUpload, data);\n },\n [uploadMultipleFiles, data, files, maxFiles],\n );\n\n return (\n <div\n className={cx(\n classNames?.dropzone ?? dropzone(),\n classNames?.root ?? dropzoneRoot(),\n )}\n >\n <MantineDropzone\n ref={dropzoneRef}\n onDrop={handleDrop}\n disabled={\n Object.keys(files).length >= (maxFiles ?? Number.POSITIVE_INFINITY)\n }\n loading={isUploading}\n accept={accept}\n preventDropOnDocument\n inputProps={{ id: inputId }}\n classNames={{\n root:\n classNames?.dropzoneDropzone?.root ??\n cx(dropzoneDropzoneRoot(), 'group'),\n inner: classNames?.dropzoneDropzone?.inner ?? dropzoneDropzoneInner(),\n }}\n >\n <div className={classNames?.iconSlot ?? dropzoneIconSlot()}>\n {isUploading ? (\n <LoaderOval\n classNames={{\n loader: classNames?.loader?.loader ?? dropzoneLoader(),\n root: classNames?.loader?.root ?? dropzoneLoaderRoot(),\n }}\n />\n ) : (\n <>\n <MantineDropzone.Idle>\n <Icon\n name='mage-dropzone-upload-01'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon: classNames?.dropzoneIcon?.icon ?? dropzoneIcon(),\n }}\n />\n </MantineDropzone.Idle>\n <MantineDropzone.Accept>\n <Icon\n name='mage-dropzone-thumbs-up'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon: classNames?.dropzoneIcon?.icon ?? dropzoneIcon(),\n }}\n />\n </MantineDropzone.Accept>\n <MantineDropzone.Reject>\n <Icon\n name='mage-dropzone-thumbs-down'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon: classNames?.dropzoneIcon?.icon ?? dropzoneIcon(),\n }}\n />\n </MantineDropzone.Reject>\n </>\n )}\n </div>\n <div className={classNames?.textSlot ?? dropzoneTextSlot()}>\n <span className={classNames?.title ?? dropzoneTitle()}>\n {title || 'Upload files'}\n </span>\n <span className={classNames?.subtitle ?? dropzoneSubtitle()}>\n {subtitle || 'Drag images here or click to select files'}\n </span>\n <span className={classNames?.hint ?? dropzoneHint()}>\n {hint ||\n 'Attach as many files as you like, each file should not exceed 5mb'}\n </span>\n </div>\n </MantineDropzone>\n {children({ files, isUploading, removeFile })}\n </div>\n );\n};\n"],"mappings":"wrBA8EA,MAAaA,GAAY,CACvB,OACA,UACA,WACA,eAAe,EAAE,CACjB,WACA,SACA,MACA,QACA,WACA,OACA,UACA,iBACA,gBACmB,CACnB,IAAM,EAAc,EAAuB,KAAK,CAC1C,CAAE,QAAO,cAAa,sBAAqB,cAC/C,EAAiB,EAAK,EAAc,EAAgB,EAAQ,CACxD,EAAa,EACjB,KAAO,IAA0B,CAC/B,IAAM,EAAe,OAAO,KAAK,EAAM,CAAC,OAElC,GADM,GAAY,KACK,EACzB,GAAkB,GAItB,MAAM,EADgB,EAAc,MAAM,EAAG,EAAe,CACnB,EAAK,EAEhD,CAAC,EAAqB,EAAM,EAAO,EAAS,CAC7C,CAED,OACE,EAAC,MAAD,CACE,UAAW,EACT,GAAY,UAAY,GAAU,CAClC,GAAY,MAAQ,GAAc,CACnC,UAJH,CAME,EAACC,EAAD,CACE,IAAK,EACL,OAAQ,EACR,SACE,OAAO,KAAK,EAAM,CAAC,SAAW,GAAY,KAE5C,QAAS,EACD,SACR,sBAAA,GACA,WAAY,CAAE,GAAI,EAAS,CAC3B,WAAY,CACV,KACE,GAAY,kBAAkB,MAC9B,EAAG,GAAsB,CAAE,QAAQ,CACrC,MAAO,GAAY,kBAAkB,OAAS,GAAuB,CACtE,UAfH,CAiBE,EAAC,MAAD,CAAK,UAAW,GAAY,UAAY,GAAkB,UACvD,EACC,EAAC,EAAD,CACE,WAAY,CACV,OAAQ,GAAY,QAAQ,QAAU,GAAgB,CACtD,KAAM,GAAY,QAAQ,MAAQ,GAAoB,CACvD,CACD,CAAA,CAEF,EAAA,EAAA,CAAA,SAAA,CACE,EAACA,EAAgB,KAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,cAAc,MAAQ,GAAc,CACvD,CACD,CAAA,CACmB,CAAA,CACvB,EAACA,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,cAAc,MAAQ,GAAc,CACvD,CACD,CAAA,CACqB,CAAA,CACzB,EAACA,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,4BACL,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,cAAc,MAAQ,GAAc,CACvD,CACD,CAAA,CACqB,CAAA,CACxB,CAAA,CAAA,CAED,CAAA,CACN,EAAC,MAAD,CAAK,UAAW,GAAY,UAAY,GAAkB,UAA1D,CACE,EAAC,OAAD,CAAM,UAAW,GAAY,OAAS,GAAe,UAClD,GAAS,eACL,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAY,UAAY,GAAkB,UACxD,GAAY,4CACR,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAY,MAAQ,GAAc,UAChD,GACC,oEACG,CAAA,CACH,GACU,GACjB,EAAS,CAAE,QAAO,cAAa,aAAY,CAAC,CACzC"}
@@ -1,2 +1,2 @@
1
- const e=async(e,t,n,r)=>{let i=new FormData;i.append(`file`,t),n&&Object.entries(n).forEach(([e,t])=>{i.append(e,t)});let a=new XMLHttpRequest;return new Promise((t,n)=>{if(a.readyState!==0){n(Error(`Ya hay una solicitud en progreso`));return}a.upload.addEventListener(`progress`,e=>{e.lengthComputable&&r&&r({loaded:e.loaded,total:e.total,percentage:Math.round(e.loaded/e.total*100)})}),a.addEventListener(`load`,()=>{if(a.status>=200&&a.status<300)try{t(JSON.parse(a.responseText))}catch{n(Error(`Error al parsear la respuesta`))}else try{let e=JSON.parse(a.responseText);n(Error(e.error||`Error al subir el archivo`))}catch{n(Error(`Error ${a.status}: ${a.statusText}`))}}),a.addEventListener(`error`,()=>{n(Error(`Error de red al subir el archivo`))}),a.addEventListener(`abort`,()=>{n(Error(`Subida cancelada`))}),a.timeout=3e4,a.addEventListener(`timeout`,()=>{n(Error(`Tiempo de espera agotado`))});try{a.open(`POST`,e),a.send(i)}catch{n(Error(`Error al iniciar la solicitud`))}})};export{e as uploadFile};
1
+ const e=async(e,t,n,r,i)=>{let a=new FormData;a.append(`file`,t),n&&Object.entries(n).forEach(([e,t])=>{a.append(e,t)});let o=new XMLHttpRequest;return new Promise((t,n)=>{if(o.readyState!==0){n(Error(`Ya hay una solicitud en progreso`));return}o.upload.addEventListener(`progress`,e=>{e.lengthComputable&&r&&r({loaded:e.loaded,total:e.total,percentage:Math.round(e.loaded/e.total*100)})}),o.addEventListener(`load`,()=>{if(o.status>=200&&o.status<300)try{t(JSON.parse(o.responseText))}catch{n(Error(`Error al parsear la respuesta`))}else try{let e=JSON.parse(o.responseText);n(Error(e.error||`Error al subir el archivo`))}catch{n(Error(`Error ${o.status}: ${o.statusText}`))}}),o.addEventListener(`error`,()=>{n(Error(`Error de red al subir el archivo`))}),o.addEventListener(`abort`,()=>{n(Error(`Subida cancelada`))}),o.timeout=3e4,o.addEventListener(`timeout`,()=>{n(Error(`Tiempo de espera agotado`))});try{o.open(`POST`,e),i&&Object.entries(i).forEach(([e,t])=>{o.setRequestHeader(e,t)}),o.send(a)}catch{n(Error(`Error al iniciar la solicitud`))}})};export{e as uploadFile};
2
2
  //# sourceMappingURL=upload-service.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"upload-service.mjs","names":[],"sources":["../../../../src/components/controls/dropzone/upload-service.ts"],"sourcesContent":["export type UploadResponse = {\n body: {\n url: string;\n };\n};\n\nexport type UploadProgress = {\n loaded: number;\n total: number;\n percentage: number;\n};\n\nexport const uploadFile = async (\n url: string,\n file: File,\n data?: Record<string, unknown>,\n onProgress?: (progress: UploadProgress) => void,\n): Promise<UploadResponse> => {\n const formData = new FormData();\n formData.append('file', file);\n if (data) {\n Object.entries(data).forEach(([key, value]) => {\n formData.append(key, value as string);\n });\n }\n const xhr = new XMLHttpRequest();\n\n return new Promise((resolve, reject) => {\n // Prevenir múltiples solicitudes simultáneas\n if (xhr.readyState !== 0) {\n reject(new Error('Ya hay una solicitud en progreso'));\n return;\n }\n\n xhr.upload.addEventListener('progress', (event) => {\n if (event.lengthComputable && onProgress) {\n const progress: UploadProgress = {\n loaded: event.loaded,\n total: event.total,\n percentage: Math.round((event.loaded / event.total) * 100),\n };\n onProgress(progress);\n }\n });\n\n xhr.addEventListener('load', () => {\n if (xhr.status >= 200 && xhr.status < 300) {\n try {\n const response = JSON.parse(xhr.responseText);\n resolve(response);\n } catch (_) {\n reject(new Error('Error al parsear la respuesta'));\n }\n } else {\n try {\n const errorData = JSON.parse(xhr.responseText);\n reject(new Error(errorData.error || 'Error al subir el archivo'));\n } catch {\n reject(new Error(`Error ${xhr.status}: ${xhr.statusText}`));\n }\n }\n });\n\n xhr.addEventListener('error', () => {\n reject(new Error('Error de red al subir el archivo'));\n });\n\n xhr.addEventListener('abort', () => {\n reject(new Error('Subida cancelada'));\n });\n\n // Configurar timeout para evitar solicitudes colgadas\n xhr.timeout = 30000; // 30 segundos\n xhr.addEventListener('timeout', () => {\n reject(new Error('Tiempo de espera agotado'));\n });\n\n try {\n xhr.open('POST', url);\n xhr.send(formData);\n } catch (_) {\n reject(new Error('Error al iniciar la solicitud'));\n }\n });\n};\n"],"mappings":"AAYA,MAAa,EAAa,MACxB,EACA,EACA,EACA,IAC4B,CAC5B,IAAM,EAAW,IAAI,SACrB,EAAS,OAAO,OAAQ,EAAK,CACzB,GACF,OAAO,QAAQ,EAAK,CAAC,SAAS,CAAC,EAAK,KAAW,CAC7C,EAAS,OAAO,EAAK,EAAgB,EACrC,CAEJ,IAAM,EAAM,IAAI,eAEhB,OAAO,IAAI,SAAS,EAAS,IAAW,CAEtC,GAAI,EAAI,aAAe,EAAG,CACxB,EAAW,MAAM,mCAAmC,CAAC,CACrD,OAGF,EAAI,OAAO,iBAAiB,WAAa,GAAU,CAC7C,EAAM,kBAAoB,GAM5B,EALiC,CAC/B,OAAQ,EAAM,OACd,MAAO,EAAM,MACb,WAAY,KAAK,MAAO,EAAM,OAAS,EAAM,MAAS,IAAI,CAC3D,CACmB,EAEtB,CAEF,EAAI,iBAAiB,WAAc,CACjC,GAAI,EAAI,QAAU,KAAO,EAAI,OAAS,IACpC,GAAI,CAEF,EADiB,KAAK,MAAM,EAAI,aAAa,CAC5B,MACP,CACV,EAAW,MAAM,gCAAgC,CAAC,MAGpD,GAAI,CACF,IAAM,EAAY,KAAK,MAAM,EAAI,aAAa,CAC9C,EAAW,MAAM,EAAU,OAAS,4BAA4B,CAAC,MAC3D,CACN,EAAW,MAAM,SAAS,EAAI,OAAO,IAAI,EAAI,aAAa,CAAC,GAG/D,CAEF,EAAI,iBAAiB,YAAe,CAClC,EAAW,MAAM,mCAAmC,CAAC,EACrD,CAEF,EAAI,iBAAiB,YAAe,CAClC,EAAW,MAAM,mBAAmB,CAAC,EACrC,CAGF,EAAI,QAAU,IACd,EAAI,iBAAiB,cAAiB,CACpC,EAAW,MAAM,2BAA2B,CAAC,EAC7C,CAEF,GAAI,CACF,EAAI,KAAK,OAAQ,EAAI,CACrB,EAAI,KAAK,EAAS,MACR,CACV,EAAW,MAAM,gCAAgC,CAAC,GAEpD"}
1
+ {"version":3,"file":"upload-service.mjs","names":[],"sources":["../../../../src/components/controls/dropzone/upload-service.ts"],"sourcesContent":["export type UploadResponse = {\n body: {\n url: string;\n };\n};\n\nexport type UploadProgress = {\n loaded: number;\n total: number;\n percentage: number;\n};\n\nexport const uploadFile = async (\n url: string,\n file: File,\n data?: Record<string, unknown>,\n onProgress?: (progress: UploadProgress) => void,\n headers?: Record<string, string>,\n): Promise<UploadResponse> => {\n const formData = new FormData();\n formData.append('file', file);\n if (data) {\n Object.entries(data).forEach(([key, value]) => {\n formData.append(key, value as string);\n });\n }\n const xhr = new XMLHttpRequest();\n\n return new Promise((resolve, reject) => {\n // Prevenir múltiples solicitudes simultáneas\n if (xhr.readyState !== 0) {\n reject(new Error('Ya hay una solicitud en progreso'));\n return;\n }\n\n xhr.upload.addEventListener('progress', (event) => {\n if (event.lengthComputable && onProgress) {\n const progress: UploadProgress = {\n loaded: event.loaded,\n total: event.total,\n percentage: Math.round((event.loaded / event.total) * 100),\n };\n onProgress(progress);\n }\n });\n\n xhr.addEventListener('load', () => {\n if (xhr.status >= 200 && xhr.status < 300) {\n try {\n const response = JSON.parse(xhr.responseText);\n resolve(response);\n } catch (_) {\n reject(new Error('Error al parsear la respuesta'));\n }\n } else {\n try {\n const errorData = JSON.parse(xhr.responseText);\n reject(new Error(errorData.error || 'Error al subir el archivo'));\n } catch {\n reject(new Error(`Error ${xhr.status}: ${xhr.statusText}`));\n }\n }\n });\n\n xhr.addEventListener('error', () => {\n reject(new Error('Error de red al subir el archivo'));\n });\n\n xhr.addEventListener('abort', () => {\n reject(new Error('Subida cancelada'));\n });\n\n // Configurar timeout para evitar solicitudes colgadas\n xhr.timeout = 30000; // 30 segundos\n xhr.addEventListener('timeout', () => {\n reject(new Error('Tiempo de espera agotado'));\n });\n\n try {\n xhr.open('POST', url);\n if (headers) {\n Object.entries(headers).forEach(([key, value]) => {\n xhr.setRequestHeader(key, value);\n });\n }\n xhr.send(formData);\n } catch (_) {\n reject(new Error('Error al iniciar la solicitud'));\n }\n });\n};\n"],"mappings":"AAYA,MAAa,EAAa,MACxB,EACA,EACA,EACA,EACA,IAC4B,CAC5B,IAAM,EAAW,IAAI,SACrB,EAAS,OAAO,OAAQ,EAAK,CACzB,GACF,OAAO,QAAQ,EAAK,CAAC,SAAS,CAAC,EAAK,KAAW,CAC7C,EAAS,OAAO,EAAK,EAAgB,EACrC,CAEJ,IAAM,EAAM,IAAI,eAEhB,OAAO,IAAI,SAAS,EAAS,IAAW,CAEtC,GAAI,EAAI,aAAe,EAAG,CACxB,EAAW,MAAM,mCAAmC,CAAC,CACrD,OAGF,EAAI,OAAO,iBAAiB,WAAa,GAAU,CAC7C,EAAM,kBAAoB,GAM5B,EALiC,CAC/B,OAAQ,EAAM,OACd,MAAO,EAAM,MACb,WAAY,KAAK,MAAO,EAAM,OAAS,EAAM,MAAS,IAAI,CAC3D,CACmB,EAEtB,CAEF,EAAI,iBAAiB,WAAc,CACjC,GAAI,EAAI,QAAU,KAAO,EAAI,OAAS,IACpC,GAAI,CAEF,EADiB,KAAK,MAAM,EAAI,aAAa,CAC5B,MACP,CACV,EAAW,MAAM,gCAAgC,CAAC,MAGpD,GAAI,CACF,IAAM,EAAY,KAAK,MAAM,EAAI,aAAa,CAC9C,EAAW,MAAM,EAAU,OAAS,4BAA4B,CAAC,MAC3D,CACN,EAAW,MAAM,SAAS,EAAI,OAAO,IAAI,EAAI,aAAa,CAAC,GAG/D,CAEF,EAAI,iBAAiB,YAAe,CAClC,EAAW,MAAM,mCAAmC,CAAC,EACrD,CAEF,EAAI,iBAAiB,YAAe,CAClC,EAAW,MAAM,mBAAmB,CAAC,EACrC,CAGF,EAAI,QAAU,IACd,EAAI,iBAAiB,cAAiB,CACpC,EAAW,MAAM,2BAA2B,CAAC,EAC7C,CAEF,GAAI,CACF,EAAI,KAAK,OAAQ,EAAI,CACjB,GACF,OAAO,QAAQ,EAAQ,CAAC,SAAS,CAAC,EAAK,KAAW,CAChD,EAAI,iBAAiB,EAAK,EAAM,EAChC,CAEJ,EAAI,KAAK,EAAS,MACR,CACV,EAAW,MAAM,gCAAgC,CAAC,GAEpD"}
@@ -1,2 +1,2 @@
1
- import{uploadFile as e}from"./upload-service.mjs";import{useCallback as t,useRef as n,useState as r}from"react";const i=(i,a={},o)=>{let[s,c]=r((()=>{if(!a)return{};if(typeof a==`object`&&!(`name`in a))return a;if(typeof a==`object`&&`name`in a){let e=a;return{[e.name]:{name:e.name,size:e.size,type:e.type,date:e.date,uploaded:e.uploaded??!0,loading:e.loading??!1,url:e.url,error:e.error,progress:e.progress}}}return{}})()),[l,u]=r(!1),d=n(new Set),f=t((e,t)=>{let n={name:e.name,size:e.size,type:e.type,url:``,uploaded:!1,loading:!1,progress:0,date:t??new Date().toLocaleString(`es-ES`,{timeZone:`Europe/Madrid`,year:`numeric`,month:`2-digit`,day:`2-digit`,hour:`2-digit`,minute:`2-digit`,second:`2-digit`})};return c(t=>({...t,[e.name]:n})),e.name},[]),p=t((e,t)=>{c(n=>({...n,[e]:{...n[e],progress:t,loading:t<100}}))},[]),m=t((e,t)=>{c(n=>({...n,[e]:{...n[e],uploaded:!0,loading:!1,progress:100,url:t}}))},[]),h=t((e,t)=>{c(n=>({...n,[e]:{...n[e],uploaded:!1,loading:!1,progress:0,error:t}}))},[]),g=t(e=>{c(t=>{let n={...t};return delete n[e],n}),d.current.delete(e)},[]),_=t(()=>{c({}),d.current.clear()},[]),v=t(e=>d.current.has(e),[]),y=t(e=>{d.current.add(e)},[]),b=t(e=>{d.current.delete(e)},[]),x=t(async(t,n)=>{let r=new Date().toLocaleString(`es-ES`,{timeZone:`Europe/Madrid`,year:`numeric`,month:`2-digit`,day:`2-digit`,hour:`2-digit`,minute:`2-digit`,second:`2-digit`}),a=f(t,r);y(a);try{let{body:s}=await e(i,t,n,e=>{p(a,e.percentage)});m(a,s.url),o?.({name:t.name,size:t.size,type:t.type,date:r,uploaded:!0,loading:!1,progress:100,url:s.url})}catch(e){console.error(`Error al subir archivo:`,e),h(a,e instanceof Error?e.message:`Error desconocido`)}finally{b(a)}},[f,y,p,m,h,b,o,i]);return{files:s,isUploading:l,setIsUploading:u,addFile:f,updateFileProgress:p,markFileAsUploaded:m,markFileAsError:h,removeFile:g,clearFiles:_,isFileUploading:v,addToUploadQueue:y,removeFromUploadQueue:b,uploadFileToServer:x,uploadMultipleFiles:t(async(e,t)=>{if(l){console.warn(`Ya hay una subida en progreso`);return}u(!0);try{for(let n of e)await x(n,t)}finally{u(!1)}},[l,u,x])}};export{i as useDropzoneState};
1
+ import{uploadFile as e}from"./upload-service.mjs";import{useCallback as t,useRef as n,useState as r}from"react";const i=(i,a={},o,s)=>{let[c,l]=r((()=>{if(!a)return{};if(typeof a==`object`&&!(`name`in a))return a;if(typeof a==`object`&&`name`in a){let e=a;return{[e.name]:{name:e.name,size:e.size,type:e.type,date:e.date,uploaded:e.uploaded??!0,loading:e.loading??!1,url:e.url,error:e.error,progress:e.progress}}}return{}})()),[u,d]=r(!1),f=n(new Set),p=t((e,t)=>{let n={name:e.name,size:e.size,type:e.type,url:``,uploaded:!1,loading:!1,progress:0,date:t??new Date().toLocaleString(`es-ES`,{timeZone:`Europe/Madrid`,year:`numeric`,month:`2-digit`,day:`2-digit`,hour:`2-digit`,minute:`2-digit`,second:`2-digit`})};return l(t=>({...t,[e.name]:n})),e.name},[]),m=t((e,t)=>{l(n=>({...n,[e]:{...n[e],progress:t,loading:t<100}}))},[]),h=t((e,t)=>{l(n=>({...n,[e]:{...n[e],uploaded:!0,loading:!1,progress:100,url:t}}))},[]),g=t((e,t)=>{l(n=>({...n,[e]:{...n[e],uploaded:!1,loading:!1,progress:0,error:t}}))},[]),_=t(e=>{l(t=>{let n={...t};return delete n[e],n}),f.current.delete(e)},[]),v=t(()=>{l({}),f.current.clear()},[]),y=t(e=>f.current.has(e),[]),b=t(e=>{f.current.add(e)},[]),x=t(e=>{f.current.delete(e)},[]),S=t(async(t,n)=>{let r=new Date().toLocaleString(`es-ES`,{timeZone:`Europe/Madrid`,year:`numeric`,month:`2-digit`,day:`2-digit`,hour:`2-digit`,minute:`2-digit`,second:`2-digit`}),a=p(t,r);b(a);try{let{body:c}=await e(i,t,n,e=>{m(a,e.percentage)},s);h(a,c.url),o?.({name:t.name,size:t.size,type:t.type,date:r,uploaded:!0,loading:!1,progress:100,url:c.url})}catch(e){console.error(`Error al subir archivo:`,e),g(a,e instanceof Error?e.message:`Error desconocido`)}finally{x(a)}},[p,b,m,h,g,x,o,i,s]);return{files:c,isUploading:u,setIsUploading:d,addFile:p,updateFileProgress:m,markFileAsUploaded:h,markFileAsError:g,removeFile:_,clearFiles:v,isFileUploading:y,addToUploadQueue:b,removeFromUploadQueue:x,uploadFileToServer:S,uploadMultipleFiles:t(async(e,t)=>{if(u){console.warn(`Ya hay una subida en progreso`);return}d(!0);try{for(let n of e)await S(n,t)}finally{d(!1)}},[u,d,S])}};export{i as useDropzoneState};
2
2
  //# sourceMappingURL=use-dropzone-state.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"use-dropzone-state.mjs","names":[],"sources":["../../../../src/components/controls/dropzone/use-dropzone-state.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\n\nimport type { FileData } from './Dropzone';\nimport { uploadFile } from './upload-service';\n\nexport const useDropzoneState = (\n url: string,\n initialFiles: Record<string, FileData> | FileData | null | undefined = {},\n onFileUploaded?: (file: FileData) => void,\n) => {\n const normalizeInitialFiles = (): Record<string, FileData> => {\n if (!initialFiles) return {};\n\n if (typeof initialFiles === 'object' && !('name' in initialFiles)) {\n return initialFiles as Record<string, FileData>;\n }\n\n if (typeof initialFiles === 'object' && 'name' in initialFiles) {\n const fileData = initialFiles as FileData;\n return {\n [fileData.name]: {\n name: fileData.name,\n size: fileData.size,\n type: fileData.type,\n date: fileData.date,\n uploaded: fileData.uploaded ?? true,\n loading: fileData.loading ?? false,\n url: fileData.url,\n error: fileData.error,\n progress: fileData.progress,\n },\n };\n }\n\n return {};\n };\n\n const [files, setFiles] = useState<Record<string, FileData>>(\n normalizeInitialFiles(),\n );\n const [isUploading, setIsUploading] = useState(false);\n const uploadQueue = useRef<Set<string>>(new Set());\n\n const addFile = useCallback((file: File, date?: string) => {\n const fileData: FileData = {\n name: file.name,\n size: file.size,\n type: file.type,\n url: '',\n uploaded: false,\n loading: false,\n progress: 0,\n date:\n date ??\n new Date().toLocaleString('es-ES', {\n timeZone: 'Europe/Madrid',\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n }),\n };\n\n setFiles((prev) => ({\n ...prev,\n [file.name]: fileData,\n }));\n\n return file.name;\n }, []);\n\n const updateFileProgress = useCallback(\n (fileName: string, progress: number) => {\n setFiles((prev) => ({\n ...prev,\n [fileName]: {\n ...prev[fileName],\n progress,\n loading: progress < 100,\n },\n }));\n },\n [],\n );\n\n const markFileAsUploaded = useCallback((fileName: string, url: string) => {\n setFiles((prev) => ({\n ...prev,\n [fileName]: {\n ...prev[fileName],\n uploaded: true,\n loading: false,\n progress: 100,\n url,\n },\n }));\n }, []);\n\n const markFileAsError = useCallback((fileName: string, error: string) => {\n setFiles((prev) => ({\n ...prev,\n [fileName]: {\n ...prev[fileName],\n uploaded: false,\n loading: false,\n progress: 0,\n error,\n },\n }));\n }, []);\n\n const removeFile = useCallback((fileName: string) => {\n setFiles((prev) => {\n const newFiles = { ...prev };\n delete newFiles[fileName];\n return newFiles;\n });\n uploadQueue.current.delete(fileName);\n }, []);\n\n const clearFiles = useCallback(() => {\n setFiles({});\n uploadQueue.current.clear();\n }, []);\n\n const isFileUploading = useCallback((fileName: string) => {\n return uploadQueue.current.has(fileName);\n }, []);\n\n const addToUploadQueue = useCallback((fileName: string) => {\n uploadQueue.current.add(fileName);\n }, []);\n\n const removeFromUploadQueue = useCallback((fileName: string) => {\n uploadQueue.current.delete(fileName);\n }, []);\n\n const uploadFileToServer = useCallback(\n async (file: File, data?: Record<string, unknown>) => {\n const date = new Date().toLocaleString('es-ES', {\n timeZone: 'Europe/Madrid',\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n });\n const fileName = addFile(file, date);\n addToUploadQueue(fileName);\n\n try {\n const { body } = await uploadFile(url, file, data, (progress) => {\n updateFileProgress(fileName, progress.percentage);\n });\n\n markFileAsUploaded(fileName, body.url);\n onFileUploaded?.({\n name: file.name,\n size: file.size,\n type: file.type,\n date,\n uploaded: true,\n loading: false,\n progress: 100,\n url: body.url,\n });\n } catch (error) {\n console.error('Error al subir archivo:', error);\n markFileAsError(\n fileName,\n error instanceof Error ? error.message : 'Error desconocido',\n );\n } finally {\n removeFromUploadQueue(fileName);\n }\n },\n [\n addFile,\n addToUploadQueue,\n updateFileProgress,\n markFileAsUploaded,\n markFileAsError,\n removeFromUploadQueue,\n onFileUploaded,\n url,\n ],\n );\n\n const uploadMultipleFiles = useCallback(\n async (acceptedFiles: File[], data?: Record<string, unknown>) => {\n if (isUploading) {\n console.warn('Ya hay una subida en progreso');\n return;\n }\n\n setIsUploading(true);\n\n try {\n for (const file of acceptedFiles) {\n await uploadFileToServer(file, data);\n }\n } finally {\n setIsUploading(false);\n }\n },\n [isUploading, setIsUploading, uploadFileToServer],\n );\n\n return {\n files,\n isUploading,\n setIsUploading,\n addFile,\n updateFileProgress,\n markFileAsUploaded,\n markFileAsError,\n removeFile,\n clearFiles,\n isFileUploading,\n addToUploadQueue,\n removeFromUploadQueue,\n uploadFileToServer,\n uploadMultipleFiles,\n };\n};\n"],"mappings":"gHAKA,MAAa,GACX,EACA,EAAuE,EAAE,CACzE,IACG,CA4BH,GAAM,CAAC,EAAO,GAAY,OA3BoC,CAC5D,GAAI,CAAC,EAAc,MAAO,EAAE,CAE5B,GAAI,OAAO,GAAiB,UAAY,EAAE,SAAU,GAClD,OAAO,EAGT,GAAI,OAAO,GAAiB,UAAY,SAAU,EAAc,CAC9D,IAAM,EAAW,EACjB,MAAO,EACJ,EAAS,MAAO,CACf,KAAM,EAAS,KACf,KAAM,EAAS,KACf,KAAM,EAAS,KACf,KAAM,EAAS,KACf,SAAU,EAAS,UAAY,GAC/B,QAAS,EAAS,SAAW,GAC7B,IAAK,EAAS,IACd,MAAO,EAAS,MAChB,SAAU,EAAS,SACpB,CACF,CAGH,MAAO,EAAE,IAIc,CACxB,CACK,CAAC,EAAa,GAAkB,EAAS,GAAM,CAC/C,EAAc,EAAoB,IAAI,IAAM,CAE5C,EAAU,GAAa,EAAY,IAAkB,CACzD,IAAM,EAAqB,CACzB,KAAM,EAAK,KACX,KAAM,EAAK,KACX,KAAM,EAAK,KACX,IAAK,GACL,SAAU,GACV,QAAS,GACT,SAAU,EACV,KACE,GACA,IAAI,MAAM,CAAC,eAAe,QAAS,CACjC,SAAU,gBACV,KAAM,UACN,MAAO,UACP,IAAK,UACL,KAAM,UACN,OAAQ,UACR,OAAQ,UACT,CAAC,CACL,CAOD,OALA,EAAU,IAAU,CAClB,GAAG,GACF,EAAK,MAAO,EACd,EAAE,CAEI,EAAK,MACX,EAAE,CAAC,CAEA,EAAqB,GACxB,EAAkB,IAAqB,CACtC,EAAU,IAAU,CAClB,GAAG,GACF,GAAW,CACV,GAAG,EAAK,GACR,WACA,QAAS,EAAW,IACrB,CACF,EAAE,EAEL,EAAE,CACH,CAEK,EAAqB,GAAa,EAAkB,IAAgB,CACxE,EAAU,IAAU,CAClB,GAAG,GACF,GAAW,CACV,GAAG,EAAK,GACR,SAAU,GACV,QAAS,GACT,SAAU,IACV,MACD,CACF,EAAE,EACF,EAAE,CAAC,CAEA,EAAkB,GAAa,EAAkB,IAAkB,CACvE,EAAU,IAAU,CAClB,GAAG,GACF,GAAW,CACV,GAAG,EAAK,GACR,SAAU,GACV,QAAS,GACT,SAAU,EACV,QACD,CACF,EAAE,EACF,EAAE,CAAC,CAEA,EAAa,EAAa,GAAqB,CACnD,EAAU,GAAS,CACjB,IAAM,EAAW,CAAE,GAAG,EAAM,CAE5B,OADA,OAAO,EAAS,GACT,GACP,CACF,EAAY,QAAQ,OAAO,EAAS,EACnC,EAAE,CAAC,CAEA,EAAa,MAAkB,CACnC,EAAS,EAAE,CAAC,CACZ,EAAY,QAAQ,OAAO,EAC1B,EAAE,CAAC,CAEA,EAAkB,EAAa,GAC5B,EAAY,QAAQ,IAAI,EAAS,CACvC,EAAE,CAAC,CAEA,EAAmB,EAAa,GAAqB,CACzD,EAAY,QAAQ,IAAI,EAAS,EAChC,EAAE,CAAC,CAEA,EAAwB,EAAa,GAAqB,CAC9D,EAAY,QAAQ,OAAO,EAAS,EACnC,EAAE,CAAC,CAEA,EAAqB,EACzB,MAAO,EAAY,IAAmC,CACpD,IAAM,EAAO,IAAI,MAAM,CAAC,eAAe,QAAS,CAC9C,SAAU,gBACV,KAAM,UACN,MAAO,UACP,IAAK,UACL,KAAM,UACN,OAAQ,UACR,OAAQ,UACT,CAAC,CACI,EAAW,EAAQ,EAAM,EAAK,CACpC,EAAiB,EAAS,CAE1B,GAAI,CACF,GAAM,CAAE,QAAS,MAAM,EAAW,EAAK,EAAM,EAAO,GAAa,CAC/D,EAAmB,EAAU,EAAS,WAAW,EACjD,CAEF,EAAmB,EAAU,EAAK,IAAI,CACtC,IAAiB,CACf,KAAM,EAAK,KACX,KAAM,EAAK,KACX,KAAM,EAAK,KACX,OACA,SAAU,GACV,QAAS,GACT,SAAU,IACV,IAAK,EAAK,IACX,CAAC,OACK,EAAO,CACd,QAAQ,MAAM,0BAA2B,EAAM,CAC/C,EACE,EACA,aAAiB,MAAQ,EAAM,QAAU,oBAC1C,QACO,CACR,EAAsB,EAAS,GAGnC,CACE,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACD,CACF,CAsBD,MAAO,CACL,QACA,cACA,iBACA,UACA,qBACA,qBACA,kBACA,aACA,aACA,kBACA,mBACA,wBACA,qBACA,oBAlC0B,EAC1B,MAAO,EAAuB,IAAmC,CAC/D,GAAI,EAAa,CACf,QAAQ,KAAK,gCAAgC,CAC7C,OAGF,EAAe,GAAK,CAEpB,GAAI,CACF,IAAK,IAAM,KAAQ,EACjB,MAAM,EAAmB,EAAM,EAAK,QAE9B,CACR,EAAe,GAAM,GAGzB,CAAC,EAAa,EAAgB,EAAmB,CAClD,CAiBA"}
1
+ {"version":3,"file":"use-dropzone-state.mjs","names":[],"sources":["../../../../src/components/controls/dropzone/use-dropzone-state.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\n\nimport type { FileData } from './Dropzone';\nimport { uploadFile } from './upload-service';\n\nexport const useDropzoneState = (\n url: string,\n initialFiles: Record<string, FileData> | FileData | null | undefined = {},\n onFileUploaded?: (file: FileData) => void,\n headers?: Record<string, string>,\n) => {\n const normalizeInitialFiles = (): Record<string, FileData> => {\n if (!initialFiles) return {};\n\n if (typeof initialFiles === 'object' && !('name' in initialFiles)) {\n return initialFiles as Record<string, FileData>;\n }\n\n if (typeof initialFiles === 'object' && 'name' in initialFiles) {\n const fileData = initialFiles as FileData;\n return {\n [fileData.name]: {\n name: fileData.name,\n size: fileData.size,\n type: fileData.type,\n date: fileData.date,\n uploaded: fileData.uploaded ?? true,\n loading: fileData.loading ?? false,\n url: fileData.url,\n error: fileData.error,\n progress: fileData.progress,\n },\n };\n }\n\n return {};\n };\n\n const [files, setFiles] = useState<Record<string, FileData>>(\n normalizeInitialFiles(),\n );\n const [isUploading, setIsUploading] = useState(false);\n const uploadQueue = useRef<Set<string>>(new Set());\n\n const addFile = useCallback((file: File, date?: string) => {\n const fileData: FileData = {\n name: file.name,\n size: file.size,\n type: file.type,\n url: '',\n uploaded: false,\n loading: false,\n progress: 0,\n date:\n date ??\n new Date().toLocaleString('es-ES', {\n timeZone: 'Europe/Madrid',\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n }),\n };\n\n setFiles((prev) => ({\n ...prev,\n [file.name]: fileData,\n }));\n\n return file.name;\n }, []);\n\n const updateFileProgress = useCallback(\n (fileName: string, progress: number) => {\n setFiles((prev) => ({\n ...prev,\n [fileName]: {\n ...prev[fileName],\n progress,\n loading: progress < 100,\n },\n }));\n },\n [],\n );\n\n const markFileAsUploaded = useCallback((fileName: string, url: string) => {\n setFiles((prev) => ({\n ...prev,\n [fileName]: {\n ...prev[fileName],\n uploaded: true,\n loading: false,\n progress: 100,\n url,\n },\n }));\n }, []);\n\n const markFileAsError = useCallback((fileName: string, error: string) => {\n setFiles((prev) => ({\n ...prev,\n [fileName]: {\n ...prev[fileName],\n uploaded: false,\n loading: false,\n progress: 0,\n error,\n },\n }));\n }, []);\n\n const removeFile = useCallback((fileName: string) => {\n setFiles((prev) => {\n const newFiles = { ...prev };\n delete newFiles[fileName];\n return newFiles;\n });\n uploadQueue.current.delete(fileName);\n }, []);\n\n const clearFiles = useCallback(() => {\n setFiles({});\n uploadQueue.current.clear();\n }, []);\n\n const isFileUploading = useCallback((fileName: string) => {\n return uploadQueue.current.has(fileName);\n }, []);\n\n const addToUploadQueue = useCallback((fileName: string) => {\n uploadQueue.current.add(fileName);\n }, []);\n\n const removeFromUploadQueue = useCallback((fileName: string) => {\n uploadQueue.current.delete(fileName);\n }, []);\n\n const uploadFileToServer = useCallback(\n async (file: File, data?: Record<string, unknown>) => {\n const date = new Date().toLocaleString('es-ES', {\n timeZone: 'Europe/Madrid',\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n });\n const fileName = addFile(file, date);\n addToUploadQueue(fileName);\n\n try {\n const { body } = await uploadFile(\n url,\n file,\n data,\n (progress) => {\n updateFileProgress(fileName, progress.percentage);\n },\n headers,\n );\n\n markFileAsUploaded(fileName, body.url);\n onFileUploaded?.({\n name: file.name,\n size: file.size,\n type: file.type,\n date,\n uploaded: true,\n loading: false,\n progress: 100,\n url: body.url,\n });\n } catch (error) {\n console.error('Error al subir archivo:', error);\n markFileAsError(\n fileName,\n error instanceof Error ? error.message : 'Error desconocido',\n );\n } finally {\n removeFromUploadQueue(fileName);\n }\n },\n [\n addFile,\n addToUploadQueue,\n updateFileProgress,\n markFileAsUploaded,\n markFileAsError,\n removeFromUploadQueue,\n onFileUploaded,\n url,\n headers,\n ],\n );\n\n const uploadMultipleFiles = useCallback(\n async (acceptedFiles: File[], data?: Record<string, unknown>) => {\n if (isUploading) {\n console.warn('Ya hay una subida en progreso');\n return;\n }\n\n setIsUploading(true);\n\n try {\n for (const file of acceptedFiles) {\n await uploadFileToServer(file, data);\n }\n } finally {\n setIsUploading(false);\n }\n },\n [isUploading, setIsUploading, uploadFileToServer],\n );\n\n return {\n files,\n isUploading,\n setIsUploading,\n addFile,\n updateFileProgress,\n markFileAsUploaded,\n markFileAsError,\n removeFile,\n clearFiles,\n isFileUploading,\n addToUploadQueue,\n removeFromUploadQueue,\n uploadFileToServer,\n uploadMultipleFiles,\n };\n};\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mage-ui/components",
3
- "version": "1.0.115",
3
+ "version": "1.0.116",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [],
@@ -25,7 +25,7 @@
25
25
  "rimraf": "^6.1.3",
26
26
  "tsdown": "^0.21.4",
27
27
  "typescript": "^5.9.3",
28
- "@mage-ui/preset": "1.0.115",
28
+ "@mage-ui/preset": "1.0.116",
29
29
  "@mage-ui/styled-system": "1.0.8"
30
30
  },
31
31
  "peerDependencies": {