@cimpress/react-components/dist/src/InlineEdit/InlineEdit.d.ts

React components to support the MCP styleguide

import React, { InputHTMLAttributes } from 'react';
import { PublicComponentProps } from '../types';
type InputBaseProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'size'>;
export type TextSize = 'default' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'small';
export interface InlineEditProps extends InputBaseProps, PublicComponentProps {
    /**
     * ID prop for the input field.
     */
    id?: string;
    /**
     * Floating label for an input field. Use either this or placeholder but not both.
     */
    label?: string;
    /**
     * Determines the size of both the display text and the edit text.
     */
    size?: TextSize;
    /**
     * Determines the HTML5 input type of the input. One of text, number, password, url, search, email, or tel.
     * You can also provide textarea to get a textarea instead of an input element.
     */
    type?: 'text' | 'number' | 'password' | 'url' | 'search' | 'email' | 'tel' | 'textarea';
    disabled?: boolean;
    /**
     * Provides an optional override for localized warning messages for required fields
     */
    requiredWarningMessage?: string;
    /**
     * Callback that fires on a successful save of the value in the input. Provides the input's value and name.
     */
    onSave?: (inputTarget: {
        value?: string;
        name?: string;
    }, event: MouseEvent | KeyboardEvent) => void;
    /**
     * If provided this callback fires when the user cancels the changes. Will provide the most recent changes, when the cancel happened.
     */
    onCancel?: (inputTarget: {
        value?: string;
        name?: string;
    }, event: MouseEvent | KeyboardEvent) => void;
    /**
     * If provided and onChange is not provided, will be called on each text change to validate the input.
     */
    validateInput?: (text: string) => string | null;
    /**
     * Specifies the minimum width of the control.  Defaults to 130px.
     */
    minWidth?: number | null;
    /**
     * Optional callback to be notified when the editing state changes
     */
    onEditStateChange?: (isEditing: boolean) => void;
}
export declare const InlineEdit: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<HTMLInputElement>>;
export {};
//# sourceMappingURL=InlineEdit.d.ts.map