MediaPage
El componente MediaPage es un componente que muestra un pagina de media para gestionar archivos.
Ejemplo
Importacion
Para importar el componente MediaPage, se puede hacer desde fenextjs o fenextjs-component
import { MediaPage, MediaPageProps } from "fenextjs/cjs/component/Media/Page";o
import { MediaPage, MediaPageProps } from "fenextjs-component/cjs/Media/Page";Parametros
| Parametro | Tipo | Requerido | Default | Descripcion |
|---|---|---|---|---|
| defaultValue | ImgDataProps[] | ImgDataProps | No | Valor predeterminado del componente. | |
| disabledSelectImg | boolean | No | Indica si la selección de imágenes está deshabilitada. | |
| images | ImgDataProps[] | No | Lista de imágenes para el componente. | |
| loaderImages | boolean | No | Indica si la carga de imágenes está en estado de carga. | |
| multiple | boolean | No | Indica si se permiten múltiples imágenes. | |
| isPage | boolean | No | Indica si la vista es una página. | |
| onRenderImg | (data: ImgDataProps) => ReactNode | No | Función para renderizar una imagen en la vista. | |
| onChange | (data: ImgDataProps[] | ImgDataProps | undefined) => void | No | Función a llamar cuando cambia la selección de imágenes. | |
| onUploadImg | (data: ImgDataProps) => void | No | Función a llamar cuando se carga una nueva imagen. | |
| onDeleteImg | (data: ImgDataProps) => void | No | Función a llamar cuando se elimina una imagen. | |
| onAcepte | (data: ImgDataProps[] | ImgDataProps) => void | No | Función a llamar cuando se acepta la selección de imágenes. | |
| HeaderPage | ReactNode | No | Elemento de encabezado para la página de medios. | |
| ButtonAcceptProps | Omit<ButtonProps, "onClick"> | No | Propiedades del botón de aceptar para la página. | |
| ButtonCancelProps | Omit<ButtonProps, "onClick"> | No | Propiedades del botón de cancelar para la página. | |
| InputUploadProps | Omit<InputUploadProps, "onChange" | "defaultValue" | "onChangeProgress" | "onUploadFile" | "clearAfterUpload"> | No | Propiedades del componente de carga de archivos. | |
| extraContentImgs | ReactNode | No | Contenido adicional para las imágenes en la página. |
Storybook
Para ver el storybook del componente lo puede hacer con este link (opens in a new tab)
Usos
- Uso básico del componente MediaPage
<MediaPage />