@helpwave/hightide/dist/components/user-input/Input.d.ts

helpwave's component and theming library

import * as react_jsx_runtime from 'react/jsx-runtime';
import react__default, { HTMLInputTypeAttribute, ChangeEvent, InputHTMLAttributes } from 'react';
import { LabelProps } from './Label.js';

type InputProps = {
    /**
     * used for the label's `for` attribute
     */
    id?: string;
    value: string;
    label?: Omit<LabelProps, 'id'>;
    /**
     * @default 'text'
     */
    type?: HTMLInputTypeAttribute;
    /**
     * Callback for when the input's value changes
     * This is pretty much required but made optional for the rare cases where it actually isn't need such as when used with disabled
     * That could be enforced through a union type but that seems a bit overkill
     * @default noop
     */
    onChange?: (text: string, event: ChangeEvent<HTMLInputElement>) => void;
    onChangeEvent?: (event: ChangeEvent<HTMLInputElement>) => void;
    className?: string;
    onEditCompleted?: (text: string, event: ChangeEvent<HTMLInputElement>) => void;
    expanded?: boolean;
    containerClassName?: string;
} & Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'value' | 'label' | 'type' | 'onChange' | 'crossOrigin'>;
/**
 * A Component for inputting text or other information
 *
 * Its state is managed must be managed by the parent
 */
declare const ControlledInput: ({ id, type, value, label, onChange, onChangeEvent, className, onEditCompleted, expanded, onBlur, containerClassName, ...restProps }: InputProps) => react_jsx_runtime.JSX.Element;
type UncontrolledInputProps = Omit<InputProps, 'value'> & {
    /**
     * @default ''
     */
    defaultValue?: string;
};
/**
 * A Component for inputting text or other information
 *
 * Its state is managed by the component itself
 */
declare const UncontrolledInput: ({ defaultValue, onChange, ...props }: UncontrolledInputProps) => react_jsx_runtime.JSX.Element;
type FormInputProps = InputHTMLAttributes<HTMLInputElement> & {
    id: string;
    labelText?: string;
    errorText?: string;
    labelClassName?: string;
    errorClassName?: string;
    containerClassName?: string;
};
declare const FormInput: react__default.ForwardRefExoticComponent<react__default.InputHTMLAttributes<HTMLInputElement> & {
    id: string;
    labelText?: string;
    errorText?: string;
    labelClassName?: string;
    errorClassName?: string;
    containerClassName?: string;
} & react__default.RefAttributes<HTMLInputElement>>;

export { FormInput, type FormInputProps, ControlledInput as Input, type InputProps, UncontrolledInput };