Changeset View

Standalone View

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';

	import css from './input.css';			import css from './input.css';

	type Props = {			type Props = {
	+type: string,			+type: string,
	+placeholder: string,			+placeholder: string,
	+value: string,			+value: string,
	+onChange: (value: SyntheticEvent<HTMLInputElement>) => mixed,			+onChange: (value: SyntheticEvent<HTMLInputElement>) => mixed,
	+disabled: boolean,			+disabled?: boolean,
	+label?: string,			+label?: string,
	+id?: string,			+id?: string,
	};			};

	function Input(props: Props, ref): React.Node {			function Input(props: Props, ref): React.Node {
	const { label: labelProp, id, ...rest } = props;			const { label: labelProp, disabled = false, id, ...rest } = props;

	let label;			let label;
	if (labelProp) {			if (labelProp) {
	label = (			label = (
	<label className={css.label} htmlFor={id}>			<label className={css.label} htmlFor={id}>
	{labelProp}			{labelProp}
	</label>			</label>
	);			);
	}			}

	return (			return (
	<>			<>
	{label}			{label}
	<input className={css.input} id={id} {...rest} ref={ref} />			<input
				className={css.input}
				id={id}
				disabled={disabled}
				{...rest}
				ref={ref}
				/>
	</>			</>
	);			);
	}			}

	const ForwardedInput: React.AbstractComponent<			const ForwardedInput: React.AbstractComponent<
	Props,			Props,
	HTMLInputElement,			HTMLInputElement,
	> = React.forwardRef<Props, HTMLInputElement>(Input);			> = React.forwardRef<Props, HTMLInputElement>(Input);

	export default ForwardedInput;			export default ForwardedInput;