@majapisoftwares/ui 4.1.3 → 4.1.5

package/components/FileInput/FileInput.d.ts

@@ -19,7 +19,7 @@ export type FileUrl = {
     size: number;
 };
 export type FileInputFile = FileFile | FileUrl;
-declare function FileInput({ error, className, helpText, onChange, name, limit, label, id, required, onMouseOver, onMouseOut, readOnly, value, emptyText, downloadText, openText, fileDisplay, asyncUpload, onRejectFiles, loading, maxConcurrentUploads, fileAdditionalInfo, ref, fileSelectClassName, previewFileClassName, filesPerPage, previewFileComponent, ...props }: Pick<InputProps<false>, "error" | "className" | "helpText" | "name" | "label" | "id" | "required" | "onMouseOver" | "onMouseOut"> & Omit<FileSelectProps, "onAcceptFiles" | "onRejectFiles"> & {
+declare function FileInput<PFP extends object>({ error, className, helpText, onChange, name, limit, label, id, required, onMouseOver, onMouseOut, readOnly, value, emptyText, downloadText, openText, fileDisplay, asyncUpload, onRejectFiles, loading, maxConcurrentUploads, fileAdditionalInfo, ref, fileSelectClassName, previewFileClassName, filesPerPage, previewFileComponent, previewFileProps, ...props }: Pick<InputProps<false>, "error" | "className" | "helpText" | "name" | "label" | "id" | "required" | "onMouseOver" | "onMouseOut"> & Omit<FileSelectProps, "onAcceptFiles" | "onRejectFiles"> & {
     readOnly?: boolean;
     value?: FileInputFile[];
     onChange?: (event: {
@@ -43,7 +43,8 @@ declare function FileInput({ error, className, helpText, onChange, name, limit,
     fileSelectClassName?: string;
     previewFileClassName?: string;
     filesPerPage?: number;
-    previewFileComponent?: ComponentType<PreviewFileProps>;
+    previewFileComponent?: ComponentType<PreviewFileProps & PFP>;
+    previewFileProps?: PFP;
 }): import("react").JSX.Element;
 export type FileInputProps = ComponentPropsWithRef<typeof FileInput>;
 export default FileInput;

package/components/FileInput/FileInput.jsx

@@ -10,7 +10,7 @@ import { PreviewFile } from "./PreviewFile";
 import concurrentForOf from "@majapisoftwares/next/utils/concurrentForOf";
 import paginated from "@majapisoftwares/next/utils/paginated";
 import Pagination from "../Pagination";
-function FileInput({ error, className, helpText, onChange, name, limit, label, id, required, onMouseOver, onMouseOut, readOnly, value, emptyText = "No files", downloadText = "Download", openText = "Open", fileDisplay, asyncUpload, onRejectFiles, loading, maxConcurrentUploads = 1, fileAdditionalInfo, ref, fileSelectClassName, previewFileClassName, filesPerPage = 10, previewFileComponent, ...props }) {
+function FileInput({ error, className, helpText, onChange, name, limit, label, id, required, onMouseOver, onMouseOut, readOnly, value, emptyText = "No files", downloadText = "Download", openText = "Open", fileDisplay, asyncUpload, onRejectFiles, loading, maxConcurrentUploads = 1, fileAdditionalInfo, ref, fileSelectClassName, previewFileClassName, filesPerPage = 10, previewFileComponent, previewFileProps, ...props }) {
     const [uploading, setUploading] = useState(false);
     const [innerValue, setInnerValue] = useState(value || []);
     const [currentPage, setCurrentPage] = useState(1);
@@ -131,7 +131,7 @@ function FileInput({ error, className, helpText, onChange, name, limit, label, i
             "md:grid-cols-2": !!innerValue.length,
             "min-h-[140px]": !!innerValue.length || !readOnly,
         })}>
-        {paginatedValue.map((file, index) => (<PreviewFileComponent key={index} file={file} readOnly={readOnly} handleDeleteClick={handleDeleteClick(file)} downloadText={downloadText} display={fileDisplay} openText={openText} additionalInfo={fileAdditionalInfo} index={index} className={previewFileClassName} filesPerPage={filesPerPage} currentPage={currentPage}/>))}
+        {paginatedValue.map((file, index) => (<PreviewFileComponent key={index} file={file} readOnly={readOnly} handleDeleteClick={handleDeleteClick(file)} downloadText={downloadText} display={fileDisplay} openText={openText} additionalInfo={fileAdditionalInfo} index={index} className={previewFileClassName} filesPerPage={filesPerPage} currentPage={currentPage} {...previewFileProps}/>))}
         {innerValue.length > filesPerPage && (<Pagination className="col-span-2 mx-auto" currentPage={currentPage} totalItems={innerValue.length} onChangePage={setCurrentPage} itemsPerPage={filesPerPage}/>)}
         {readOnly && !innerValue.length && (<Text variant="secondary">{emptyText}</Text>)}
         {!readOnly && (!limit || innerValue.length < limit) && (<FileSelect {...props} className={fileSelectClassName} id={id} onAcceptFiles={handleAcceptFiles} limit={limit ? limit - innerValue.length : undefined} uploading={uploading} onRejectFiles={onRejectFiles} error={error}/>)}

package/components/ImageInput/ImageInput.d.ts

@@ -1,4 +1,4 @@
 import { ComponentProps } from "react";
 import FileInput from "../FileInput";
-declare function ImageInput({ icon, uploadAFileText, allowedFileTypes, fileDisplay, ...props }: ComponentProps<typeof FileInput>): import("react").JSX.Element;
+declare function ImageInput<PFP extends object>({ icon, uploadAFileText, allowedFileTypes, fileDisplay, ...props }: ComponentProps<typeof FileInput<PFP>>): import("react").JSX.Element;
 export default ImageInput;

package/components/ImageInput/ImageInput.jsx

@@ -1,6 +1,6 @@
 import FileInput from "../FileInput";
-const defaultIcon = (<svg stroke="currentColor" fill="none" viewBox="0 0 48 48" aria-hidden="true">
-    <path d="M28 8H12a4 4 0 00-4 4v20m32-12v8m0 0v8a4 4 0 01-4 4H12a4 4 0 01-4-4v-4m32-4l-3.172-3.172a4 4 0 00-5.656 0L28 28M8 32l9.172-9.172a4 4 0 015.656 0L28 28m0 0l4 4m4-24h8m-4-4v8m-12 4h.02" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round"/>
+const defaultIcon = (<svg stroke="currentColor" fill="none" viewBox="0 0 48 48" aria-hidden="true">
+    <path d="M28 8H12a4 4 0 00-4 4v20m32-12v8m0 0v8a4 4 0 01-4 4H12a4 4 0 01-4-4v-4m32-4l-3.172-3.172a4 4 0 00-5.656 0L28 28M8 32l9.172-9.172a4 4 0 015.656 0L28 28m0 0l4 4m4-24h8m-4-4v8m-12 4h.02" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round"/>
   </svg>);
 function ImageInput({ icon = defaultIcon, uploadAFileText = "Upload an image", allowedFileTypes = [".png", ".jpg", ".jpeg", ".webp"], fileDisplay = "preview", ...props }) {
     return (<FileInput {...props} icon={icon} uploadAFileText={uploadAFileText} allowedFileTypes={allowedFileTypes} fileDisplay={fileDisplay}/>);

package/package.json

@@ -4,6 +4,6 @@
     "type": "git",
     "url": "https://github.com/majapisoftwares/ui.git"
   },
-  "version": "4.1.3",
+  "version": "4.1.5",
   "type": "module"
 }