alouette/dist/definitions/ui/data/EditableItem.d.ts

A modern, customizable design system built on top of NativeWind v5 with configurable defaults

import type { ReactNode } from "react";
import type { Accent } from "../../core/AlouetteConfig";
import type { PressableBoxProps } from "../actions/PressableBox";
import type { SVGIconElement } from "../primitives/Icon";
export interface EditableItemProps {
    label: string;
    /** Current value shown next to the label — a Badge, a Text, anything short. */
    summary?: ReactNode;
    /** Muted helper text under the label. */
    details?: ReactNode;
    /** Names the edit button for assistive tech — it has no visible text. */
    editAriaLabel: string;
    editIcon?: SVGIconElement;
    variant?: PressableBoxProps["variant"];
    accent?: Accent;
    disabled?: boolean;
    onEdit: () => void;
    /** Rendered under the row, when the value is too large for `summary`. */
    children?: ReactNode;
}
/**
 * A labelled value with an edit affordance. Owns no editor: pair it with
 * FormEditableItem for a react-hook-form modal, or compose your own Modal
 * from `onEdit`.
 */
export declare function EditableItem({ label, summary, details, editAriaLabel, editIcon, variant, accent, disabled, onEdit, children, }: EditableItemProps): ReactNode;
//# sourceMappingURL=EditableItem.d.ts.map