import React, { MouseEventHandler } from "react"; import { TypedField } from "../../../lib"; import { BadgeProps } from "../../badge"; import { BoolProps } from "../../boolean"; import { ButtonProps } from "../../button"; import { FormControlProps } from "../../form"; import { AProps, PProps } from "../../typography"; export type ValueProps = Omit, "onBlur" | "onChange" | "onClick" | "value"> & { /** Value to render. */ value: unknown; /** Whether to use a "decorative" component instead of `

` if applicable. */ decorate?: boolean; /** Is set, renders an `` with `href` set. */ href?: string; aProps?: AProps; boolProps?: Omit; badgeProps?: BadgeProps; pProps?: PProps; onClick?: MouseEventHandler; /** @private indicates that the is used internally. */ nested?: boolean; } & ValueEditableUnion; export type ValueEditableUnion = ({ /** Whether the value should be editable (requires field). */ editable: true; /** The form field to show when editing. */ field: TypedField; } | { /** Whether the value should be editable (requires field). */ editable?: false; /** The form field to show when editing. */ field?: TypedField; }) & { formControlProps?: Partial; buttonProps?: Partial; /** Whether the value is currently being edited. */ editing?: boolean; /** An error message to show. */ error?: string; labelEdit?: string; /** Gets called when the input is blurred. */ onBlur?: React.FocusEventHandler; /** Gets called when the value changes. */ onChange?: React.ChangeEventHandler; /** Gets called when the edit button is clicked. */ onEdit?: React.MouseEventHandler; }; /** * Generic wrapper rendering the appropriate component for `value` based on its type. * Type can be: * * - A primitive, rendered using appropriate subcomponent (see props). * - A React.ReactNode: rendered directly. * - Any other complex type is ignored. */ export declare const Value: (rawProps: ValueProps) => string | React.JSX.Element | React.JSX.Element[] | undefined;