UNPKG

@react-md/form

Version:

This package is for creating all the different form input types.

54 lines (53 loc) 2.07 kB
import type { InputHTMLAttributes, ReactNode } from "react"; import type { ButtonThemeProps } from "@react-md/button"; declare type InputAttributes = Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "defaultValue" | "value">; export interface FileInputProps extends ButtonThemeProps, InputAttributes { /** * An id for the input. This is required for a11y since it also is applied as * the `htmlFor` prop for the label. */ id: string; /** * The change event handler to attach to this input. This is required since * there's really no use in this component otherwise. */ onChange: React.ChangeEventHandler<HTMLInputElement>; /** * An optional icon to display for the file input. */ icon?: ReactNode; /** * Boolean if the icon should appear after the children in the label. */ iconAfter?: boolean; /** * Boolean if the children should not have some spacing between the icon and * itself. The default behavior is to use the `<TextIconSpacing>` component * for text styled input buttons, but this can be disabled if you want to use * a screen-reader only accessible label. * * Note: This will default to `false` if {@link children} are provided. * * @defaultValue `true` */ disableIconSpacing?: boolean; /** * Boolean if the file input should no longer allow the same file to be * selected multiple times and trigger the `onChange` each time it is * selected. */ disableRepeatableFiles?: boolean; /** * Children should generally be provided when the {@link buttonType} is * set to `"text"`. This defaults to a screen-reader only accessible text. * * @defaultValue `<SrOnly>Upload</SrOnly>` */ children?: ReactNode; } /** * This component is a wrapper for the `<input type="file" />` that can be themed * like a button. */ export declare const FileInput: import("react").ForwardRefExoticComponent<FileInputProps & import("react").RefAttributes<HTMLInputElement>>; export {};