@neo4j-ndl/react
Version:
React implementation of Neo4j Design System
87 lines (86 loc) • 3.2 kB
TypeScript
/**
*
* Copyright (c) "Neo4j"
* Neo4j Sweden AB [http://neo4j.com]
*
* This file is part of Neo4j.
*
* Neo4j is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import type React from 'react';
import { type ReactNode } from 'react';
import { type HtmlAttributes, type PolymorphicCommonProps } from '../_common/types';
import { type TypographyVariants } from '../typography';
type InlineEditProps = {
/** Label text */
label?: ReactNode;
/**
* The typographyVariant of the component applied to Typography as its variant.
* @default subheading-medium
*/
typographyVariant?: TypographyVariants;
/**
* The default input value. Use for an uncontrolled component.
*/
defaultValue?: string;
/**
* The input value. Makes the component controlled.
*/
value?: string;
/**
* Callback when the input value changes. Must be used when the component is controlled.
*/
onChange?: (value: string) => void;
/**
* Placeholder text displayed when the input is empty.
*/
placeholder: string;
/**
* @default false
*/
isDisabled?: boolean;
/**
* If edit pencil icon should be visible on hover
* @default false
*/
hasEditIcon?: boolean;
/**
* If the input is in editing mode
* Used in a stateless inline edit
* @default undefined
*/
isEditing?: boolean;
/** Callback when confirm icon button is pressed */
onConfirm?: (value: string, event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
/** Callback when cancel icon button is pressed */
onCancel?: (event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
/**
* What the input should do on blur
* - "confirm" will confirm the value
* - "cancel" will cancel the value
* - "none" will do nothing
* @default "confirm"
*/
blurBehavior?: 'confirm' | 'cancel' | 'none';
/** props applied to the internal input element */
inputProps?: HtmlAttributes<'input'>;
/**
* If the input is fluid
* @default false
*/
isFluid?: boolean;
};
export declare const InlineEdit: <T extends React.ElementType = "div">({ as, className, defaultValue, htmlAttributes, label, onChange, onCancel, onConfirm, ref, style, value, hasEditIcon, inputProps, isDisabled, isEditing, blurBehavior, isFluid, typographyVariant, placeholder, ...restProps }: PolymorphicCommonProps<T, InlineEditProps>) => import("react/jsx-runtime").JSX.Element;
export {};
//# sourceMappingURL=InlineEdit.d.ts.map