UNPKG

@wix/design-system

Version:

@wix/design-system

47 lines 2.36 kB
import * as React from 'react'; import { InputProps } from '../Input'; export type InputWithLabelProps = InputProps & { /** Sets a default value for those who want to use this component uncontrolled */ dataHook?: string; /** Pass a component you want to show as the suffix of the input, e.g., text string, icon. */ suffix?: React.ReactNode[]; /** Sets the field label */ label?: string; /** Sets input value */ value?: string | number; /** Specifies the status of a field */ status?: InputProps['status']; /** Defines the message displayed when you hover over the status icon. If not given or empty there will be no tooltip. */ statusMessage?: InputProps['statusMessage']; /** Defines a standard input onFocus callback */ onFocus?: React.FocusEventHandler<HTMLInputElement>; /** Defines a standard input onBlur callback */ onBlur?: React.FocusEventHandler<HTMLInputElement>; /** Defines a standard input onChange callback */ onChange?: React.ChangeEventHandler<HTMLInputElement>; /** Reference element data when a form is submitted */ name?: string; /** Specifies the type of `<input/>` element to display. Default is text string. */ type?: string; /** Define a string that labels the current element in case where a text label is not visible on the screen */ ariaLabel?: string; /** Focus the element on mount (standard React input autoFocus). */ autoFocus?: boolean; /** Sets the value of native autocomplete attribute (consult the [HTML spec](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#attr-fe-autocomplete) for possible values) */ autocomplete?: string; /** Specifies whether the input should be disabled or not */ disabled?: boolean; /** Specifies a CSS class name to be appended to the component’s root element. * @internal */ className?: string; /** Sets the maximum number of characters that can be entered into a field */ maxLength?: number; /** Sets a placeholder message to display */ placeholder?: string; /** Render a custom input component instead of the default html input tag */ customInput?: React.ReactNode | Function; /** Sets the border type */ border?: 'standard' | 'bottomLine'; }; //# sourceMappingURL=InputWithLabel.types.d.ts.map