[REF]: R for adecuating to API pages

src/files-ui/components/avatar/Avatar.tsx

@@ -15,6 +15,7 @@ const Avatar: React.FC<AvatarProps> = (props: AvatarProps) => {
     accept,
 
     onChange,
+
     emptyLabel,
     changeLabel,
 
@@ -36,11 +37,11 @@ const Avatar: React.FC<AvatarProps> = (props: AvatarProps) => {
 
   const avatarId = React.useId();
   const finalClassNameBorder: string | undefined = useAvatarStyle(
-    avatarId.replaceAll(":",""),
+    avatarId.replaceAll(":", ""),
     borderRadius
   );
 
-  console.log("finalClassNameBorder",finalClassNameBorder);
+  console.log("finalClassNameBorder", finalClassNameBorder);
 
   const handleClick = () => {
     // alert("Agregar fotooooooo");
@@ -71,11 +72,9 @@ const Avatar: React.FC<AvatarProps> = (props: AvatarProps) => {
     return (
       <React.Fragment>
         <div
-          className={
-            `fui-avatar-main-container${
-              variant === "circle" ? " circle" : ""
-            }` + " "+finalClassNameBorder
-          }
+          className={`fui-avatar-main-container${
+            variant === "circle" ? " circle" : ""
+          } ${finalClassNameBorder}`}
           style={style}
           {...rest}
         >

src/files-ui/components/avatar/AvatarProps.ts

@@ -3,27 +3,47 @@ export interface AvatarFullProps extends OverridableComponentProps {
     accept?: string;
     variant?: "square" | "circle";
     borderRadius?: string;
+    /**
+     * Just like any other input component. The value of the input element,
+        required for a controlled component.
+     */
     src?: string | File;
+    /**
+     * Callback fired when an image file is selected.
+     * @param selectedFile The new file selected
+     */
     onChange?: (selectedFile: File) => void,
     /**
      * Alternative label when an error occurs
      * on loading the image
      */
     alt?: string,
-
+    /**
+     * Label to be displayed when image source is not set.
+     */
     emptyLabel?: React.ReactNode;
+    /**
+     * Label to be displayed when "isLoading" prop is set set. This will cover
+        the current image.
+     */
     loadingLabel?: React.ReactNode;
+    /**
+     * Label to be displayed when there is a valid source set.
+     */
     changeLabel?: React.ReactNode;
     /**
-     * if a src is given, then avatar will show the image
-     * or a file error message and will not allow
+     * If true and if a src is given, then avatar will show the image and will not allow
      * the user to change the picture. Also, layer on hover will not be shown
      */
     readOnly?: boolean;
-
+    /**
+     * If true, loadingLabel will be shown.
+     */
     isLoading?: boolean;
-
-    onError?: React.ReactEventHandler<HTMLImageElement>;
+    /**
+     * Callback fired when an error occured on loading the image.
+     */
+    onError?: Function;
 
     /**
      * If not present, image width will be set to 100%.
@@ -38,7 +58,7 @@ export interface AvatarFullProps extends OverridableComponentProps {
      * - If value is "center", image will be centered and will not be displayed complete.
      * This the empty space is avoided. This is achived by giving 100% to width prop if 
      * the orientation is "portrait". When orientation is "landscape", height prop will be set to 100%.
-     * @default orientation
+     * @default center
      */
     smartImgFit?: false | "orientation" | "center";
 }

src/files-ui/components/dropzone/components/dropzone/DropzoneProps.ts

@@ -160,7 +160,7 @@ export interface DropzoneFullProps extends OverridableComponentProps {
   onDragLeave?: (evt: React.DragEvent<HTMLDivElement>) => void;
 
   //ACTION BUTTONS
-  /** If set, buttons will be added on the before or after of the component.
+  /** If set, buttons will be added before or after of the component.
         This buttons triggresthe common opertions of the component such as
         clean, upload, abort and delete all.
    */

src/files-ui/components/file-input-button/FileInputButton.tsx

@@ -41,8 +41,8 @@ const FileInputButton: React.FC<FileInputButtonProps> = (
 ) => {
   const {
     //basic
-    onChange,
     value = [],
+    onChange,
     //validation
     accept,
     maxFileSize,

src/files-ui/components/file-input-button/InputButtonProps.ts

-import { CustomValidateFileResponse, ExtFile, Localization, UploadConfig, UploadResponse } from "../../core";
+import { CustomValidateFileResponse, ExtFile, Localization, UploadConfig } from "../../core";
 import { DropzoneActions } from "../dropzone/components/dropzone/DropzoneProps";
 import { MaterialButtonProps } from "../material-button/MaterialButtonProps";
-//import { OverridableComponentProps } from "../overridable";
 
 interface InputButtonFullProps {
     /**
@@ -37,9 +36,9 @@ interface InputButtonFullProps {
     */
     localization?: Localization;
     /**
-   * If true, will show a ripple everytime
-   * the user drops files or selects files
-   */
+     * If true, will not show a ripple effect everytime the user 
+     * clicks the components for selecting files.
+    */
     disableRipple?: boolean;
 
     ///////////////         VALIDATION STAGE        ///////////////
@@ -112,20 +111,18 @@ interface InputButtonFullProps {
     */
     onUploadFinish?: (extFiles: ExtFile[]) => void;
 
-  //ACTION BUTTONS
-  /**
-   * The configuration needed for uploading the files.
-   * When "uploadConfig" is not given or uploadConfig.url is undefined
-   * the upload button will not be visible
-   * and uploadOnDrop flag will not work
-   */
-  actionButtons?: DropzoneActions;
-  // ADD OR REPLACE
-  /**
-   * The behaviour when new files are selected or dropped
-   * @default 'add'
-   */
-  behaviour?: 'add' | 'replace';
+    //ACTION BUTTONS
+    /** If set, buttons will be added before or after of the component.
+          This buttons triggresthe common opertions of the component such as
+          clean, upload, abort and delete all.
+     */
+    actionButtons?: DropzoneActions;
+    // ADD OR REPLACE
+    /**
+     * The behaviour when new files are selected or dropped
+     * @default 'add'
+     */
+    behaviour?: 'add' | 'replace';
 }
 
 type MaterialButtonPropsOmitInputButtonFullProps = Omit<MaterialButtonProps, keyof InputButtonFullProps>;

src/files-ui/components/material-button/MaterialButtonProps.ts

@@ -25,7 +25,7 @@ export interface MaterialButtonPropsInterface extends OverridableComponentProps
      */
     variant?: "text" | "outlined" | "contained";
     /**
-     * The label to place when no files are selected
+     * The text label for the button
      */
     label?: string;
     /**

src/files-ui/components/overridable/OverridableComponentsProps.ts

@@ -5,7 +5,7 @@
  */
 export declare type OverridableComponentProps = {
     /**
-     * The react node children
+     * The content of the component.
      */
     children?: React.ReactNode | string;
     /**

src/files-ui/components/previews/FullScreen/FullScreen.tsx

@@ -16,10 +16,10 @@ const FullScreen: React.FC<FullScreenProps> = (props: FullScreenProps) => {
     const handleCloseEsc = (evt: KeyboardEvent) => {
       if (evt.key === "Escape") onClose?.();
     };
-    console.log("adding listener");
+    //console.log("adding listener");
     document.addEventListener("keydown", handleCloseEsc);
     return () => {
-      console.log("removing listener");
+      //console.log("removing listener");
       document.removeEventListener("keydown", handleCloseEsc);
     };
     // eslint-disable-next-line

src/files-ui/components/previews/FullScreen/FullScreenProps.ts

@@ -7,12 +7,17 @@ export interface FullScreenPropsMap extends OverridableComponentProps {
     */
   open?: boolean;
   /**
-  * handler for on Close operation
+  * 	Callback fired when the component requests to be closed.
   */
   onClose?: Function;
 }
 
+type DefDivProps = React.HTMLProps<HTMLDivElement>;
+type DivPropsOmitFullScreenPropsMap = Omit<DefDivProps, keyof FullScreenPropsMap>;
+
+
 export type FullScreenProps =
+  DivPropsOmitFullScreenPropsMap &
   {
     [F in keyof FullScreenPropsMap]: FullScreenPropsMap[F]
   }
\ No newline at end of file

src/files-ui/components/previews/ImagePreview/ImagePreview.tsx

@@ -14,13 +14,13 @@ const ImagePreview: React.FC<ImagePreviewProps> = (
   const {
     src,
     alt,
-    className,
-    style,
     width,
     height,
     onError,
     //smart,
     smartImgFit,
+    style,
+    className,
   } = mergeProps(props, ImagePreviewDefaultProps);
 console.log("ImagePreview smartImgFit",smartImgFit);
   const [[finalHeight, finalWidth], setfinalDimensions] = React.useState<

src/files-ui/components/previews/VideoPreview/VideoPreview.tsx

@@ -6,7 +6,8 @@ const VideoPreview: React.FC<VideoPreviewProps> = (
 ) => {
   const {
     src: videoSrc,
-    /* autoPlay, controls,  */ style,
+    /* autoPlay, controls,  */
+    style,
     className,
     ...others
   } = props;

src/files-ui/components/previews/VideoPreview/VideoPreviewProps.ts

@@ -3,8 +3,7 @@ import { OverridableComponentProps } from "../../overridable";
 
 export interface VideoPreviewPropsMap extends OverridableComponentProps {
     /**
-     * video source in string format or File object
-     * FileItemComponent returns this value in onWatch handler
+     * The video source in string format or File object.
      */
     src?: File | string;
 

src/files-ui/core/types/ExtFile.ts

@@ -29,10 +29,6 @@ export declare type ExtFile = {
      * The size of the file. Used mostly for displaying file data from server.
      */
     size?: number;
-    /**
-     * Link, URI or string representation of an image
-     */
-    imageUrl?: string;
     /**
      * a flag that determines whether the file is valid, not valid or it is not validated.
      */
@@ -41,14 +37,18 @@ export declare type ExtFile = {
      * The list of errors when the file was validated
      */
     errors?: string[];
+    /**
+     * The current upload status. (e.g. "uploading")
+     */
+    uploadStatus?: UPLOADSTATUS | undefined;
     /**
      * A message that shows the result of the upload process
      */
     uploadMessage?: string;
     /**
-     * The current upload status. (e.g. "uploading")
+     * Link, URI or string representation of an image
      */
-    uploadStatus?: UPLOADSTATUS | undefined;
+    imageUrl?: string;
     /**
      * The XMLHttpRequest object for performing uploads to a server
      */
@@ -61,12 +61,11 @@ export declare type ExtFile = {
     progress?: number;
     /**
      * The additional data that will be sent to the server
-     * when filesare uploaded individually
+     * when files are uploaded individually
      */
     extraUploadData?: Record<string, any>;
     /**
-     * Any kind of extra data that could be needed
-     * 
+     * Any kind of extra data that could be needed.
      */
     extraData?: Object;
     /**
@@ -74,9 +73,8 @@ export declare type ExtFile = {
      */
     serverResponse?: ServerResponse;
     /**
-     * Url to perform a GET request in order to download the file.
-     * This action is triggered when download button is clicked or pressed.
-     * In case onDownload prop is given
+     * The url to be used to perform a GET request in order to download the
+        file. If defined, the download icon will be shown.
      */
     downloadUrl?: string;
 }