@helpwave/hightide/dist/index.d.mts

helpwave's component and theming library

import * as react_jsx_runtime from 'react/jsx-runtime';
import * as react from 'react';
import react__default, { HTMLAttributes, SVGProps, ReactNode, ElementType, ComponentPropsWithoutRef, ImgHTMLAttributes, ButtonHTMLAttributes, AnchorHTMLAttributes, MouseEventHandler, PointerEventHandler, PropsWithChildren, RefObject, CSSProperties, Dispatch, SetStateAction, HTMLAttributeAnchorTarget, InputHTMLAttributes, ComponentProps, JSX, TableHTMLAttributes, Key, TextareaHTMLAttributes, LabelHTMLAttributes, ForwardedRef } from 'react';
import { Translation, TranslationEntries, PartialTranslationExtension } from '@helpwave/internationalization';
import { TableFeature, Table as Table$1, ColumnDef, TableState, RowModel, Row, InitialTableState, TableOptions, RowData, FilterFn, RowSelectionState, Header, SortDirection, ColumnSizingState, ColumnFilter, ColumnSort } from '@tanstack/react-table';
import { Virtualizer } from '@tanstack/react-virtual';

type Size$1 = 'sm' | 'md' | 'lg';
type AppZumDocBadgeProps = HTMLAttributes<HTMLSpanElement> & {
    size?: Size$1;
};
declare const AppZumDocBadge: ({ size, ...props }: AppZumDocBadgeProps) => react_jsx_runtime.JSX.Element;

type AppZumDocLogoProps = SVGProps<SVGSVGElement> & {
    frontColor?: string;
    backColor?: string;
    animate?: 'none' | 'loading' | 'pulse' | 'bounce';
    size?: 'sm' | 'md' | 'lg';
    animationDuration?: number;
};
declare const AppZumDocLogo: ({ frontColor, backColor, animate, size, animationDuration, ...props }: AppZumDocLogoProps) => react_jsx_runtime.JSX.Element;

type Size = 'sm' | 'md' | 'lg';
type HelpwaveBadgeProps = HTMLAttributes<HTMLSpanElement> & {
    size?: Size;
};
/**
 * A Badge with the helpwave logo and the helpwave name
 */
declare const HelpwaveBadge: ({ size, ...props }: HelpwaveBadgeProps) => react_jsx_runtime.JSX.Element;

type HelpwaveProps = SVGProps<SVGSVGElement> & {
    color?: string;
    animate?: 'none' | 'loading' | 'pulse' | 'bounce';
    size?: 'sm' | 'md' | 'lg';
    animationDuration?: number;
};
/**
 * The helpwave loading spinner based on the svg logo.
 */
declare const HelpwaveLogo: ({ color, size, animate, animationDuration, ...props }: HelpwaveProps) => react_jsx_runtime.JSX.Element;

type ChatMessageDirection = 'incoming' | 'outgoing';
type ChatMessageBubbleProps = HTMLAttributes<HTMLDivElement> & {
    direction?: ChatMessageDirection;
    timestamp?: ReactNode;
    readReceipt?: ReactNode;
};
declare const ChatMessageBubble: ({ direction, timestamp, readReceipt, children, ...props }: ChatMessageBubbleProps) => react_jsx_runtime.JSX.Element;

type ChatAttachmentCardProps = HTMLAttributes<HTMLDivElement> & {
    name: ReactNode;
    metadata?: ReactNode;
    icon?: ReactNode;
    direction?: ChatMessageDirection;
    downloadLabel?: string;
    onDownload?: () => void;
};
declare const ChatAttachmentCard: ({ name, metadata, icon, direction, downloadLabel, onDownload, ...props }: ChatAttachmentCardProps) => react_jsx_runtime.JSX.Element;

type ScrollableListBaseProps = {
    header?: ReactNode;
    footer?: ReactNode;
    footerClassName?: string;
    headerClassName?: string;
    contentClassName?: string;
};
type ScrollableListProps<E extends ElementType = 'div'> = ScrollableListBaseProps & {
    as?: E;
} & Omit<ComponentPropsWithoutRef<E>, keyof ScrollableListBaseProps | 'as'>;
declare const ScrollableList: <E extends ElementType = "div">({ as, header, footer, footerClassName, headerClassName, contentClassName, className, children, ...props }: ScrollableListProps<E>) => react_jsx_runtime.JSX.Element;

type ChatConversationListProps = Omit<ScrollableListProps, 'as'>;
declare const ChatConversationList: ({ className, headerClassName, contentClassName, footerClassName, ...props }: ChatConversationListProps) => react_jsx_runtime.JSX.Element;

type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | null;
type ImageConfig = {
    avatarUrl: string;
    alt: string;
};
type AvatarImageProps = ImgHTMLAttributes<HTMLImageElement>;
type AvatarProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & {
    image?: ImageConfig;
    name?: string;
    size?: AvatarSize;
    ImageComponent?: ElementType<AvatarImageProps>;
};
/**
 * A component for showing a profile picture
 */
declare const Avatar: ({ image: initialImage, name, size, ImageComponent, ...props }: AvatarProps) => react_jsx_runtime.JSX.Element;
type AvatarGroupProps = HTMLAttributes<HTMLDivElement> & {
    'avatars': Omit<AvatarProps, 'size'>[];
    'showTotalNumber'?: boolean;
    'size'?: AvatarSize;
    'data-name'?: string;
    'ImageComponent'?: ElementType<AvatarImageProps>;
};
/**
 * A component for showing a group of Avatar's
 */
declare const AvatarGroup: ({ avatars, showTotalNumber, size, ImageComponent, ...props }: AvatarGroupProps) => react_jsx_runtime.JSX.Element;
type AvatarStatus = 'online' | 'offline' | 'away' | 'busy' | 'unknown';
type AvatarWithStatusProps = AvatarProps & {
    status?: AvatarStatus;
};
declare const AvatarWithStatus: ({ status, className, size, ...avatarProps }: AvatarWithStatusProps) => react_jsx_runtime.JSX.Element;
type AvatarWithLabelPosition = 'left' | 'right';
type AvatarWithLabelProps = AvatarProps & {
    label: ReactNode;
    labelPosition?: AvatarWithLabelPosition;
};
/**
 * An avatar with a label displayed beside it
 */
declare const AvatarWithLabel: ({ label, labelPosition, className, size, ...avatarProps }: AvatarWithLabelProps) => react_jsx_runtime.JSX.Element;

type ChatConversationSentIndicator = 'sent' | 'sentAndReceived';
type ChatConversationRowProps = ButtonHTMLAttributes<HTMLButtonElement> & {
    avatar: AvatarWithStatusProps;
    title: ReactNode;
    timestamp?: ReactNode;
    preview?: ReactNode;
    unreadCount?: number;
    isSelected?: boolean;
    sentIndicator?: ChatConversationSentIndicator;
};
declare const ChatConversationRow: ({ avatar, title, timestamp, preview, unreadCount, isSelected, sentIndicator, ...props }: ChatConversationRowProps) => react_jsx_runtime.JSX.Element;

type ChatDateDividerProps = HTMLAttributes<HTMLDivElement>;
declare const ChatDateDivider: ({ children, ...props }: ChatDateDividerProps) => react_jsx_runtime.JSX.Element;

type ChipSize = 'xs' | 'sm' | 'md' | 'lg' | null;
type ChipColoringStyle = 'solid' | 'tonal' | 'outline' | 'tonal-outline' | null;
declare const chipColors: readonly ["primary", "secondary", "positive", "warning", "negative", "neutral"];
type ChipColor = typeof chipColors[number];
declare const ChipUtil: {
    colors: readonly ["primary", "secondary", "positive", "warning", "negative", "neutral"];
};
type ChipProps = HTMLAttributes<HTMLDivElement> & {
    color?: ChipColor;
    coloringStyle?: ChipColoringStyle;
    size?: ChipSize;
};
/**
 * A component for displaying a single chip
 */
declare const Chip: ({ children, color, coloringStyle, size, ...props }: ChipProps) => react_jsx_runtime.JSX.Element;
type ChipListProps = HTMLAttributes<HTMLUListElement> & {
    list: ChipProps[];
};
/**
 * A component for displaying a list of chips
 */
declare const ChipList: ({ list, ...props }: ChipListProps) => react_jsx_runtime.JSX.Element;

type ChatMessageCardProps = HTMLAttributes<HTMLDivElement> & {
    icon?: ReactNode;
    title: ReactNode;
    subtitle?: ReactNode;
    badge?: ReactNode;
    actions?: ReactNode;
    color?: ChipColor;
    direction?: ChatMessageDirection;
};
declare const ChatMessageCard: ({ icon, title, subtitle, badge, actions, color, direction, children, ...props }: ChatMessageCardProps) => react_jsx_runtime.JSX.Element;

type ChatMessageComposerProps = Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> & {
    value?: string;
    initialValue?: string;
    onValueChange?: (value: string) => void;
    onSend: (value: string) => void;
    placeholder?: string;
    sendLabel?: string;
    disabled?: boolean;
    actions?: ReactNode;
    trailing?: ReactNode;
};
declare const ChatMessageComposer: ({ value: controlledValue, initialValue, onValueChange, onSend, placeholder, sendLabel, disabled, actions, ...props }: ChatMessageComposerProps) => react_jsx_runtime.JSX.Element;

type ChatMessageListProps = HTMLAttributes<HTMLDivElement> & {
    autoScroll?: boolean;
};
declare const ChatMessageList: ({ autoScroll, children, ...props }: ChatMessageListProps) => react_jsx_runtime.JSX.Element;

type ChatQuickReplyChipProps = ButtonHTMLAttributes<HTMLButtonElement> & {
    isActive?: boolean;
};
declare const ChatQuickReplyChip: ({ isActive, children, ...props }: ChatQuickReplyChipProps) => react_jsx_runtime.JSX.Element;

type ChatSystemLineProps = HTMLAttributes<HTMLDivElement> & {
    icon?: ReactNode;
    color?: ChipColor;
};
declare const ChatSystemLine: ({ icon, color, children, ...props }: ChatSystemLineProps) => react_jsx_runtime.JSX.Element;

type ChatThreadHeaderProps = HTMLAttributes<HTMLDivElement> & {
    avatar?: AvatarWithStatusProps;
    title: ReactNode;
    subtitle?: ReactNode;
    leftActions?: ReactNode;
    rightActions?: ReactNode;
    leadingActionsClassName?: string;
    trailingActionsClassName?: string;
};
declare const ChatThreadHeader: ({ avatar, title, subtitle, leftActions, rightActions, leadingActionsClassName, trailingActionsClassName, ...props }: ChatThreadHeaderProps) => react_jsx_runtime.JSX.Element;

type CardSize = 'sm' | 'md' | 'lg';
type CardProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {
    title: ReactNode;
    description?: ReactNode;
    size?: CardSize;
    leading?: ReactNode;
    trailing?: ReactNode;
};
declare const Card: ({ title, description, size, leading, trailing, children, className, ...props }: CardProps) => react_jsx_runtime.JSX.Element;
type ActionCardProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {
    title: ReactNode;
    description?: ReactNode;
    size?: CardSize;
    leading?: ReactNode;
    trailing?: ReactNode;
    disabled?: boolean;
};
declare const ActionCard: react.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "title"> & {
    title: ReactNode;
    description?: ReactNode;
    size?: CardSize;
    leading?: ReactNode;
    trailing?: ReactNode;
    disabled?: boolean;
} & react.RefAttributes<HTMLDivElement>>;
type NavigationCardLinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
    href: string;
};
type NavigationCardProps = Omit<HTMLAttributes<HTMLAnchorElement>, 'title'> & {
    title: ReactNode;
    description?: ReactNode;
    size?: CardSize;
    leading?: ReactNode;
    href: string;
    isExternal?: boolean;
    LinkComponent?: ElementType<NavigationCardLinkProps>;
};
declare const NavigationCard: react.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLAnchorElement>, "title"> & {
    title: ReactNode;
    description?: ReactNode;
    size?: CardSize;
    leading?: ReactNode;
    href: string;
    isExternal?: boolean;
    LinkComponent?: ElementType<NavigationCardLinkProps>;
} & react.RefAttributes<HTMLAnchorElement>>;

type Curve = (value: number) => number;
type ExponentialCurveBuilderPropsResolved = {
    basis: number;
    multiplier: number;
};
type ExponentialCurveBuilderProps = Partial<ExponentialCurveBuilderPropsResolved>;
type ExponentialRateCurveBuilder = (props: ExponentialCurveBuilderProps) => Curve;
type CubicBezierCurveBuilder = (x1: number, y1: number, x2: number, y2: number) => Curve;
declare const CurveBuilderUtil: {
    ExponentialRateCurveBuilder: ExponentialRateCurveBuilder;
    CubicBezierCurveBuilder: CubicBezierCurveBuilder;
    cubicBezierGeneric: (x1: number, y1: number, x2: number, y2: number) => {
        x: Curve;
        y: Curve;
    };
    easeInEaseOut: Curve;
};

type ChangingNumberProps = {
    start: number;
    end: number;
    animationTime?: number;
    curve?: Curve;
    resetRateAfterUpdate?: boolean;
    formatValue?: (value: number) => ReactNode;
};
/**
 * Displays a number animating from start to end along a curve over animationTime
 */
declare function ChangingNumber({ start, end, animationTime, curve, resetRateAfterUpdate, formatValue, }: ChangingNumberProps): ReactNode;

type ExpansionIconProps = HTMLAttributes<HTMLDivElement> & {
    isExpanded: boolean;
    disabled?: boolean;
};
declare const ExpansionIcon: ({ children, isExpanded, disabled, ...props }: ExpansionIconProps) => react_jsx_runtime.JSX.Element;

type ProgressIndicatorProps = {
    progress: number;
    strokeWidth?: number;
    size?: keyof typeof sizeMapping;
    direction?: 'clockwise' | 'counterclockwise';
    rotation?: number;
};
declare const sizeMapping: {
    small: number;
    medium: number;
    big: number;
};
/**
 * A progress indicator
 *
 * Start rotation is 3 o'clock and fills counterclockwise
 *
 * Progress is given from 0 to 1
 */
declare const ProgressIndicator: ({ progress, strokeWidth, size, direction, rotation }: ProgressIndicatorProps) => react_jsx_runtime.JSX.Element;

type ProcessModelActivityNodeKind = 'activity' | 'terminal';
type ProcessModelActivityNodeProps = {
    nodeId: string;
    label: string;
    count: string;
    customIcon: ReactNode;
    kind?: ProcessModelActivityNodeKind;
    bordered?: boolean;
    active?: boolean;
    visited?: boolean;
    className?: string;
    onClick?: MouseEventHandler<HTMLDivElement>;
    onPointerEnter?: PointerEventHandler<HTMLDivElement>;
    onPointerLeave?: PointerEventHandler<HTMLDivElement>;
};
declare const ProcessModelActivityNode: ({ nodeId, label, count, customIcon, kind, bordered, active, visited, className, onClick, onPointerEnter, onPointerLeave, }: ProcessModelActivityNodeProps) => react_jsx_runtime.JSX.Element;

type ProcessModelTerminalKind = 'start' | 'end';
type ProcessModelActivityIconKind = 'plus' | 'check';
type ProcessModelNodeBase = {
    id: string;
    label: string;
    count: string;
    layer: number;
    col: number;
};
type ProcessModelGraphTerminalNode = ProcessModelNodeBase & {
    type: ProcessModelTerminalKind;
};
type ProcessModelGraphActivityNode = ProcessModelNodeBase & {
    type: 'activity';
    activityIcon?: ProcessModelActivityIconKind;
};
type ProcessModelGraphNode = ProcessModelGraphTerminalNode | ProcessModelGraphActivityNode;
type ProcessModelEdge = {
    from: string;
    to: string;
    label: string;
    weight: number;
};
type ProcessModelTrace = {
    name: string;
    nodes: string[];
};
type ProcessModelGraph = {
    nodes: ProcessModelGraphNode[];
    edges: ProcessModelEdge[];
    traces?: ProcessModelTrace[];
};
type ProcessModelGraphWithTraces = ProcessModelGraph & {
    traces: ProcessModelTrace[];
};
type ProcessModelLibraryEntry = {
    id: string;
    name: string;
    description: string;
    graph: ProcessModelGraph;
};
type ProcessModelNodePosition = {
    x: number;
    y: number;
    w: number;
    h: number;
    layer: number;
};
type ProcessModelLayoutResult = {
    positions: Record<string, ProcessModelNodePosition>;
    canvasW: number;
    canvasH: number;
};
type ProcessModelEdgePointResult = {
    pathD: string;
    labelPt: {
        x: number;
        y: number;
    };
};
type ProcessModelEdgeStrokeStyle = {
    opacity: number;
    sw: number;
    markerTier: 'strong' | 'medium' | 'faint';
};

type ProcessModelCanvasProps = {
    graph: ProcessModelGraph;
    className?: string;
    showNodeBorder?: boolean;
    activeNodeId?: string;
    visitedNodeIds?: ReadonlySet<string>;
    renderActivityIcon?: (node: ProcessModelGraphActivityNode) => ReactNode;
    edgePathIdPrefix?: string;
    edgeReplayHighlight?: {
        from: string;
        to: string;
    } | null;
    replayParticle?: {
        cx: number;
        cy: number;
        opacity: number;
    } | null;
};
declare const ProcessModelCanvas: ({ graph, className, showNodeBorder, activeNodeId, visitedNodeIds, renderActivityIcon, edgePathIdPrefix, edgeReplayHighlight, replayParticle, }: ProcessModelCanvasProps) => react_jsx_runtime.JSX.Element;

type ProcessModelTerminalNodeProps = {
    nodeId: string;
    variant: ProcessModelTerminalKind;
    label: string;
    count: string;
    bordered?: boolean;
    active?: boolean;
    visited?: boolean;
    className?: string;
};
declare const ProcessModelTerminalNode: ({ nodeId, variant, label, count, bordered, active, visited, className, }: ProcessModelTerminalNodeProps) => react_jsx_runtime.JSX.Element;

type ProcessModelTraceReplayProps = {
    graph: ProcessModelGraphWithTraces;
    className?: string;
};
declare const ProcessModelTraceReplay: ({ graph, className }: ProcessModelTraceReplayProps) => react_jsx_runtime.JSX.Element;

declare function terminalCountDisplayLine(rawCount: string): string;
declare function estimateProcessModelActivityChromeWidth(kind: ProcessModelActivityNodeKind, label: string, countLine: string): number;
declare function estimateProcessModelActivityNodeWidth(label: string, count: string): number;
declare function computeLayout(graph: ProcessModelGraph): ProcessModelLayoutResult;
declare function getEdgePoints(pos: Record<string, ProcessModelNodePosition>, fromId: string, toId: string, allEdges: ProcessModelEdge[]): ProcessModelEdgePointResult | null;
declare function weightToStyle(weight: number, maxWeight: number): ProcessModelEdgeStrokeStyle;
declare function maxEdgeWeight(edges: ProcessModelEdge[]): number;
declare function getProcessModelEdgePathDomId(pathIdPrefix: string | undefined, from: string, to: string): string;
declare const ProcessModelLayoutUtilities: {
    ACTIVITY_NODE_MIN_WIDTH: number;
    NODE_H: number;
    terminalCountDisplayLine: typeof terminalCountDisplayLine;
    estimateProcessModelActivityChromeWidth: typeof estimateProcessModelActivityChromeWidth;
    estimateProcessModelActivityNodeWidth: typeof estimateProcessModelActivityNodeWidth;
    computeLayout: typeof computeLayout;
    getEdgePoints: typeof getEdgePoints;
    weightToStyle: typeof weightToStyle;
    maxEdgeWeight: typeof maxEdgeWeight;
    getProcessModelEdgePathDomId: typeof getProcessModelEdgePathDomId;
};

declare const processModelLibrary: ProcessModelLibraryEntry[];
declare function getProcessModelLibraryEntry(id: string): ProcessModelLibraryEntry | undefined;

type FormFieldAriaAttributes = Pick<HTMLAttributes<HTMLElement>, 'aria-labelledby' | 'aria-describedby' | 'aria-disabled' | 'aria-readonly' | 'aria-invalid' | 'aria-errormessage' | 'aria-required'>;
type FormFieldInteractionStates = {
    invalid: boolean;
    disabled: boolean;
    readOnly: boolean;
    required: boolean;
};
type FormFieldLayoutIds = {
    input: string;
    error: string;
    label: string;
    description: string;
};
type FormFieldLayoutBag = {
    interactionStates: FormFieldInteractionStates;
    ariaAttributes: FormFieldAriaAttributes;
    id: string;
};
type FormFieldLayoutProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & Omit<Partial<FormFieldInteractionStates>, 'invalid'> & {
    children: (bag: FormFieldLayoutBag) => ReactNode;
    ids?: Partial<FormFieldLayoutIds>;
    label?: ReactNode;
    labelProps?: Omit<HTMLAttributes<HTMLLabelElement>, 'children' | 'id'>;
    invalidDescription?: ReactNode;
    invalidDescriptionProps?: Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'id'>;
    description?: ReactNode;
    descriptionProps?: Omit<HTMLAttributes<HTMLParagraphElement>, 'children' | 'id'>;
    showRequiredIndicator?: boolean;
};
declare const FormFieldLayout: react.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "children"> & Omit<Partial<FormFieldInteractionStates>, "invalid"> & {
    children: (bag: FormFieldLayoutBag) => ReactNode;
    ids?: Partial<FormFieldLayoutIds>;
    label?: ReactNode;
    labelProps?: Omit<HTMLAttributes<HTMLLabelElement>, "children" | "id">;
    invalidDescription?: ReactNode;
    invalidDescriptionProps?: Omit<HTMLAttributes<HTMLDivElement>, "children" | "id">;
    description?: ReactNode;
    descriptionProps?: Omit<HTMLAttributes<HTMLParagraphElement>, "children" | "id">;
    showRequiredIndicator?: boolean;
} & react.RefAttributes<HTMLDivElement>>;

type FormValidationBehaviour = 'always' | 'touched' | 'submit';
type FormValue = Record<string, any>;
type FormEvent<T extends FormValue> = {
    type: 'onSubmit';
    key: 'ALL';
    hasErrors: boolean;
    values: T;
    errors: Partial<Record<keyof T, ReactNode>>;
} | {
    type: 'reset';
    key: 'ALL';
    values: T;
    errors: Partial<Record<keyof T, ReactNode>>;
} | {
    type: 'onTouched';
    key: keyof T;
    value: T[keyof T];
    values: T;
} | {
    type: 'onUpdate';
    key: 'ALL';
    updatedKeys: (keyof T)[];
    update: Partial<T>;
    values: T;
    hasErrors: boolean;
    errors: Partial<Record<keyof T, ReactNode>>;
} | {
    type: 'onChange';
    key: keyof T;
    value: T[keyof T];
    values: T;
} | {
    type: 'onError';
    key: keyof T;
    value: T[keyof T];
    values: T;
    error: ReactNode;
};
type FormEventListener<T extends FormValue> = (event: FormEvent<T>) => void;
type FormValidator<T extends FormValue> = (value: T[keyof T]) => ReactNode;
type FormStoreProps<T extends FormValue> = {
    initialValues: T;
    hasTriedSubmitting?: boolean;
    submittingTouchesAll?: boolean;
    validators?: Partial<{
        [K in keyof T]: (v: T[K]) => ReactNode;
    }>;
};
declare class FormStore<T extends FormValue> {
    private values;
    private initialValues;
    private validators;
    private hasTriedSubmitting;
    private errors;
    private touched;
    private listeners;
    private submittingTouchesAll;
    constructor({ initialValues, hasTriedSubmitting, submittingTouchesAll, validators, }: FormStoreProps<T>);
    getValue<K extends keyof T>(key: K): T[K];
    getAllValues(): T;
    setValue<K extends keyof T>(key: K, value: T[K], triggerUpdate?: boolean): void;
    setValues(values: Partial<T>, triggerUpdate?: boolean): void;
    getTouched(key: keyof T): boolean;
    getAllTouched(): Partial<Record<keyof T, boolean>>;
    setTouched(key: keyof T, isTouched?: boolean): void;
    getHasError(): boolean;
    getErrors(): Partial<Record<keyof T, ReactNode>>;
    getError(key: keyof T): ReactNode;
    private setError;
    getHasTriedSubmitting(): boolean;
    changeValidators(validators: Partial<Record<keyof T, FormValidator<T>>>): void;
    validate(key: keyof T): void;
    validateAll(): void;
    subscribe(key: keyof T | 'ALL', listener: FormEventListener<T>): () => void;
    private notify;
    submit(): void;
    reset(): void;
}

type UseCreateFormProps<T extends FormValue> = Omit<FormStoreProps<T>, 'validationBehaviour'> & {
    onFormSubmit: (values: T) => void;
    onFormError?: (values: T, errors: Partial<Record<keyof T, ReactNode>>) => void;
    /**
     * Called when the form values change.
     *
     * E.g. a key press for an input field.
     *
     * For most purposes use {@link onUpdate} instead.
     * @param values The new values of the form.
     */
    onValueChange?: (values: T) => void;
    /**
     * Called when the form values change and the corresponding inputs determined that the user
     * finished editing these fields and the client should make an update against the server.
     *
     * E.g. a user finished editing an input field by pressing enter or blurring the field.
     *
     * @param updatedKeys The keys that were updated.
     * @param update The update that was made.
     */
    onValidUpdate?: (updatedKeys: (keyof T)[], update: Partial<T>) => void;
    /**
     * Called when the form values change and the corresponding inputs determined that the user
     * finished editing these fields and the client should make an update against the server.
     *
     * E.g. a user finished editing an input field by pressing enter or blurring the field.
     *
     * @param updatedKeys The keys that were updated.
     * @param update The update that was made.
     */
    onUpdate?: (updatedKeys: (keyof T)[], update: Partial<T>) => void;
    scrollToElements?: boolean;
    scrollOptions?: ScrollIntoViewOptions;
};
type UseCreateFormResult<T extends FormValue> = {
    /**
     * The form store.
     * Do not attempt to read the store directly, use useFormObserver or useFormField instead.
     * Otherwise you will not get the latest values and errors.
     */
    store: FormStore<T>;
    reset: () => void;
    submit: () => void;
    update: (updater: Partial<T> | ((current: T) => Partial<T>), triggerUpdate?: boolean) => void;
    validateAll: () => void;
    registerRef: (key: keyof T) => (el: HTMLElement | null) => void;
};
declare function useCreateForm<T extends FormValue>({ onFormSubmit, onFormError, onValueChange, onUpdate, onValidUpdate, initialValues, hasTriedSubmitting, validators, scrollToElements, scrollOptions, }: UseCreateFormProps<T>): UseCreateFormResult<T>;

type FormFieldFocusableElementProps = FormFieldAriaAttributes & {
    id: string;
    ref: (element: HTMLElement | null) => void;
};
type FormFieldBag<T extends FormValue, K extends keyof T> = {
    dataProps: FormFieldDataHandling<T[K]>;
    focusableElementProps: FormFieldFocusableElementProps;
    interactionStates: FormFieldInteractionStates;
    touched: boolean;
    other: {
        updateValue: (value: T[K]) => void;
    };
};
interface FormFieldProps<T extends FormValue, K extends keyof T> extends Omit<FormFieldLayoutProps, 'invalidDescription' | 'children'> {
    children: (bag: FormFieldBag<T, K>) => ReactNode;
    name: K;
    triggerUpdateOnEditComplete?: boolean;
    validationBehaviour?: FormValidationBehaviour;
}
type FormFieldDataHandling<T> = {
    value: T;
    onValueChange: (value: T) => void;
    onEditComplete: (value: T) => void;
};
declare const FormField: <T extends FormValue, K extends keyof T>({ children, name, triggerUpdateOnEditComplete, validationBehaviour, ...props }: FormFieldProps<T, K>) => react_jsx_runtime.JSX.Element;

type FormContextType<T extends FormValue> = UseCreateFormResult<T>;
declare const FormContext: react.Context<FormContextType<any>>;
type FormProviderProps<T extends FormValue> = PropsWithChildren & {
    state: FormContextType<T>;
};
declare const FormProvider: <T extends FormValue>({ children, state }: FormProviderProps<T>) => react_jsx_runtime.JSX.Element;
declare function useForm<T extends FormValue>(): FormContextType<T>;
interface UseFormFieldParameter<T extends FormValue> {
    key: keyof T;
}
interface UseFormFieldOptions {
    triggerUpdate?: boolean;
    validationBehaviour?: FormValidationBehaviour;
}
interface UserFormFieldProps<T extends FormValue> extends UseFormFieldParameter<T>, UseFormFieldOptions {
}
type FormFieldResult<T> = {
    store: FormStore<T>;
    value: T;
    error: ReactNode;
    touched: boolean;
    hasTriedSubmitting: boolean;
    dataProps: FormFieldDataHandling<T>;
    registerRef: (el: HTMLElement | null) => void;
};
declare function useFormField<T extends FormValue, K extends keyof T>(key: K, { triggerUpdate, validationBehaviour }: UseFormFieldOptions): FormFieldResult<T[K]> | null;
type UseFormObserverProps<T extends FormValue> = {
    formStore?: FormStore<T>;
};
interface FormObserverResult<T extends FormValue> {
    store: FormStore<T>;
    values: T;
    touched: Partial<Record<keyof T, boolean>>;
    errors: Partial<Record<keyof T, ReactNode>>;
    hasErrors: boolean;
    hasTriedSubmitting: boolean;
}
declare function useFormObserver<T extends FormValue>({ formStore }?: UseFormObserverProps<T>): FormObserverResult<T> | null;
interface UseFormObserverKeyProps<T extends FormValue, K extends keyof T> {
    formStore?: FormStore<T>;
    formKey: K;
}
interface FormObserverKeyResult<T extends FormValue, K extends keyof T> {
    store: FormStore<T>;
    value: T[K];
    error: ReactNode;
    hasError: boolean;
    touched: boolean;
}
declare function useFormObserverKey<T extends FormValue, K extends keyof T>({ formStore, formKey }: UseFormObserverKeyProps<T, K>): FormObserverKeyResult<T, K> | null;

interface FormObserverProps<T extends FormValue> extends UseFormObserverProps<T> {
    children: (bag: FormObserverResult<T>) => ReactNode;
}
declare const FormObserver: <T extends FormValue>({ children, formStore }: FormObserverProps<T>) => ReactNode;
interface FormObserverKeyProps<T extends FormValue, K extends keyof T> extends UseFormObserverKeyProps<T, K> {
    children: (bag: FormObserverKeyResult<T, K>) => ReactNode;
}
declare const FormObserverKey: <T extends FormValue, K extends keyof T>({ children, formStore, formKey }: FormObserverKeyProps<T, K>) => ReactNode;

type FloatingElementAlignment = 'beforeStart' | 'afterStart' | 'center' | 'beforeEnd' | 'afterEnd';
type CalculatePositionOptionsResolved = {
    verticalAlignment: FloatingElementAlignment;
    horizontalAlignment: FloatingElementAlignment;
    screenPadding: number;
    gap: number;
    avoidOverlap: boolean;
};
type CalculatePositionOptions = Partial<CalculatePositionOptionsResolved>;
type UseAnchoredPositionOptions = CalculatePositionOptions & {
    isPolling?: boolean;
    isReactingToResize?: boolean;
    isReactingToScroll?: boolean;
    pollingInterval?: number;
};
type UseAnchoredPostitionProps = UseAnchoredPositionOptions & {
    container: RefObject<HTMLElement | null>;
    anchor: RefObject<HTMLElement | null>;
    window?: RefObject<HTMLElement | null>;
    active?: boolean;
};
declare function useAnchoredPosition({ active, window: windowRef, anchor: anchorRef, container: containerRef, isPolling, isReactingToResize, isReactingToScroll, pollingInterval, verticalAlignment, horizontalAlignment, avoidOverlap, screenPadding, gap, }: UseAnchoredPostitionProps): CSSProperties;

type BackgroundOverlayProps = HTMLAttributes<HTMLDivElement>;
interface AnchoredFloatingContainerProps extends HTMLAttributes<HTMLDivElement> {
    anchor: RefObject<HTMLElement | null>;
    options?: UseAnchoredPositionOptions;
    active?: boolean;
}
declare const AnchoredFloatingContainer: react.ForwardRefExoticComponent<AnchoredFloatingContainerProps & react.RefAttributes<HTMLDivElement>>;

interface CarouselSlideProps extends HTMLAttributes<HTMLDivElement> {
    isSelected: boolean;
    index: number;
}
declare const CarouselSlide: react__default.ForwardRefExoticComponent<CarouselSlideProps & react__default.RefAttributes<HTMLDivElement>>;
type CarouselProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & {
    children: ReactNode[];
    animationTime?: number;
    isLooping?: boolean;
    isAutoPlaying?: boolean;
    autoLoopingTimeOut?: number;
    autoLoopAnimationTime?: number;
    hintNext?: boolean;
    arrows?: boolean;
    dots?: boolean;
    /**
     * Percentage that is allowed to be scrolled further
     */
    overScrollThreshold?: number;
    blurColor?: string;
    heightClassName?: string;
    slideClassName?: string;
    slideContainerProps?: HTMLAttributes<HTMLDivElement>;
    onSlideChanged?: (index: number) => void;
};
declare const Carousel: ({ children, animationTime, isLooping, isAutoPlaying, autoLoopingTimeOut, autoLoopAnimationTime, hintNext, arrows, dots, blurColor, heightClassName, slideClassName, slideContainerProps, onSlideChanged, ...props }: CarouselProps) => react_jsx_runtime.JSX.Element;

type DividerInserterProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & {
    children: ReactNode[];
    divider: (index: number) => ReactNode;
};
/**
 * A Component for inserting a divider in the middle of each child element
 *
 *  undefined elements are removed
 */
declare const DividerInserter: ({ children, divider, ...restProps }: DividerInserterProps) => react_jsx_runtime.JSX.Element;

type ExpandableRootProps = HTMLAttributes<HTMLDivElement> & {
    'isExpanded'?: boolean;
    'onExpandedChange'?: (isExpanded: boolean) => void;
    'isInitialExpanded'?: boolean;
    'disabled'?: boolean;
    'allowContainerToggle'?: boolean;
    'data-name'?: string;
};
declare const ExpandableRoot: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
    isExpanded?: boolean;
    onExpandedChange?: (isExpanded: boolean) => void;
    isInitialExpanded?: boolean;
    disabled?: boolean;
    allowContainerToggle?: boolean;
    'data-name'?: string;
} & react.RefAttributes<HTMLDivElement>>;
type ExpandableHeaderProps = HTMLAttributes<HTMLDivElement> & {
    'isUsingDefaultIcon'?: boolean;
    'data-name'?: string;
};
declare const ExpandableHeader: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
    isUsingDefaultIcon?: boolean;
    'data-name'?: string;
} & react.RefAttributes<HTMLDivElement>>;
type ExpandableContentProps = HTMLAttributes<HTMLDivElement> & {
    'forceMount'?: boolean;
    'data-name'?: string;
};
declare const ExpandableContent: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
    forceMount?: boolean;
    'data-name'?: string;
} & react.RefAttributes<HTMLDivElement>>;
interface ExpandableProps extends ExpandableRootProps {
    trigger: ReactNode;
    triggerProps?: Omit<ExpandableHeaderProps, 'children'>;
    contentProps?: Omit<ExpandableContentProps, 'children'>;
    contentExpandedClassName?: string;
}
declare const Expandable: react.ForwardRefExoticComponent<ExpandableProps & react.RefAttributes<HTMLDivElement>>;

type FAQItem = Pick<ExpandableProps, 'isExpanded' | 'className'> & {
    title: string;
    content: ReactNode;
};
type FAQSectionProps = {
    entries: FAQItem[];
};
declare const FAQSection: ({ entries, }: FAQSectionProps) => react_jsx_runtime.JSX.Element;

interface InfiniteScrollProps {
    itemCount: number;
    /** How many items to keep in the DOM at once (default: 30) */
    bufferSize?: number;
    /** How many items to add tp the DOM when reaching one end at once (default: 7) */
    stepSize?: number;
    /** Pixels from edge to trigger a fetch/shift (default: 30) */
    scrollThreshold?: number;
    /** Initial index to center on or start at (optional) */
    initialIndex?: number;
    /** Render prop for each item */
    children: (index: number) => ReactNode;
    /** Optional classname for the scroll container */
    className?: string;
    /** Optional style for the container */
    style?: React.CSSProperties;
}
declare function InfiniteScroll({ children, itemCount, bufferSize, scrollThreshold, stepSize, initialIndex, className, style, }: InfiniteScrollProps): react_jsx_runtime.JSX.Element;

type ASTNodeModifierType = 'none' | 'italic' | 'bold' | 'underline' | 'font-space' | 'primary' | 'secondary' | 'warn' | 'positive' | 'negative';
declare const astNodeInserterType: readonly ["helpwave", "newline"];
type ASTNodeInserterType = typeof astNodeInserterType[number];
type ASTNodeDefaultType = 'text';
type ASTNode = {
    type: ASTNodeModifierType;
    children: ASTNode[];
} | {
    type: ASTNodeInserterType;
} | {
    type: ASTNodeDefaultType;
    text: string;
};
type ASTNodeInterpreterProps = {
    node: ASTNode;
    isRoot?: boolean;
    className?: string;
};
declare const ASTNodeInterpreter: ({ node, isRoot, className, }: ASTNodeInterpreterProps) => string | react_jsx_runtime.JSX.Element;
type MarkdownInterpreterProps = {
    text: string;
    className?: string;
};
declare const MarkdownInterpreter: ({ text, className }: MarkdownInterpreterProps) => react_jsx_runtime.JSX.Element;

interface TabInfo {
    id: string;
    labelId: string;
    label: ReactNode;
    disabled?: boolean;
    ref: RefObject<HTMLElement | null>;
}
type PortalState = {
    id: string;
    ref: RefObject<HTMLElement | null>;
};
interface TabContextType {
    tabs: {
        activeId: string | null;
        setActiveId: Dispatch<SetStateAction<string | null>>;
        subscribe: (info: TabInfo) => () => void;
        infos: TabInfo[];
    };
    portal: {
        id: string | null;
        element: HTMLElement | null;
        setPortal: Dispatch<SetStateAction<PortalState | null>>;
    };
}
declare function useTabContext(): TabContextType;
interface TabSwitcherProps extends PropsWithChildren {
    activeId?: string;
    onActiveIdChange?: (activeId: string | null) => void;
    initialActiveId?: string;
}
/**
 * The controlling component of several Tabpanels.
 *
 * The uncontrolled mode only works if the Tabpanels do not remount.
 */
declare function TabSwitcher({ children, activeId: controlledActiveId, onActiveIdChange, initialActiveId }: TabSwitcherProps): react_jsx_runtime.JSX.Element;
type TabListProps = HTMLAttributes<HTMLUListElement>;
declare function TabList({ ...props }: TabListProps): react_jsx_runtime.JSX.Element;
type TabViewProps = HTMLAttributes<HTMLDivElement>;
declare function TabView({ ...props }: TabViewProps): react_jsx_runtime.JSX.Element;
type TabPanelProps = HTMLAttributes<HTMLDivElement> & {
    label: string;
    forceMount?: boolean;
    disabled?: boolean;
    initiallyActive?: boolean;
};
declare function TabPanel({ label, forceMount, disabled, initiallyActive, ...props }: TabPanelProps): react_jsx_runtime.JSX.Element;

type TextImageColor = 'primary' | 'secondary' | 'dark';
type TextImageProps = {
    title: string;
    description: string;
    imageUrl: string;
    onShowMoreClicked?: () => void;
    color?: TextImageColor;
    badge?: string;
    contentClassName?: string;
    className?: string;
};
/**
 * A Component for layering a Text upon an image
 */
declare const TextImage: ({ title, description, imageUrl, onShowMoreClicked, color, badge, contentClassName, className, }: TextImageProps) => react_jsx_runtime.JSX.Element;

type VerticalDividerProps = {
    width?: number;
    height?: number;
    strokeWidth?: number;
    dashGap?: number;
    dashLength?: number;
};
/**
 * A Component for creating a vertical Divider
 */
declare const VerticalDivider: ({ width, height, strokeWidth, dashGap, dashLength, }: VerticalDividerProps) => react_jsx_runtime.JSX.Element;

type VisibilityProps = PropsWithChildren & {
    isVisible?: boolean;
};
declare function Visibility({ children, isVisible }: VisibilityProps): react_jsx_runtime.JSX.Element;

interface TreeNode {
    id: string;
    items: TreeNode[];
}
interface TreeItem {
    id: string;
    path: ReadonlyArray<string>;
    expanded: boolean;
}
interface TreeIndexEntry {
    node: TreeNode;
    parentId: string | null;
    path: string[];
}
interface TreeIndex {
    byId: Map<string, TreeIndexEntry>;
    roots: TreeNode[];
}

interface TreeExpansionOptions {
    nodes: ReadonlyArray<TreeNode>;
    onlyOneExpandedTree?: boolean;
    expandedIds?: ReadonlySet<string>;
    onExpandedIdsChange?: (expandedIds: ReadonlySet<string>) => void;
    initialExpandedIds?: ReadonlySet<string>;
    pruneCollapsedSubtrees?: boolean;
}
interface TreeExpansionActionOptions {
    focusedPath?: ReadonlyArray<string> | null;
    focusedId?: string | null;
}
interface TreeExpansionReturn {
    visibleItems: ReadonlyArray<TreeItem>;
    allItems: ReadonlyArray<TreeItem>;
    expandedIds: ReadonlySet<string>;
    setExpandedIds: react__default.Dispatch<react__default.SetStateAction<ReadonlySet<string>>>;
    expand: (id: string, options?: TreeExpansionActionOptions) => void;
    collapse: (id: string, options?: TreeExpansionActionOptions) => void;
    toggleExpansion: (id: string, options?: TreeExpansionActionOptions) => void;
    expandForPath: (path: ReadonlyArray<string>) => void;
}
declare function useTreeExpansion({ nodes, onlyOneExpandedTree, expandedIds: controlledExpandedIds, onExpandedIdsChange, initialExpandedIds, pruneCollapsedSubtrees, }: TreeExpansionOptions): TreeExpansionReturn;

interface NavigationItemState {
    expanded: boolean;
    isActive: boolean;
    isOnActivePath: boolean;
    path: ReadonlyArray<string>;
}
interface NavigationContextActions {
    toggleExpansion: ReturnType<typeof useTreeExpansion>['toggleExpansion'];
}
interface NavigationContextType extends NavigationContextActions {
    activeId: string | null;
    activePath: ReadonlyArray<string> | null;
    allItems: ReadonlyArray<TreeItem>;
    getItemState: (id: string) => NavigationItemState | null;
}
interface NavigationProviderProps extends TreeExpansionOptions {
    children: ReactNode;
    activeId?: string | null;
}
declare function NavigationProvider({ children, activeId, nodes, ...expansionOptions }: NavigationProviderProps): react_jsx_runtime.JSX.Element;
declare function useNavigationContext(): NavigationContextType;
declare function useNavigationItem(id: string): {
    toggleExpansion: (id: string, options?: TreeExpansionActionOptions) => void;
    expanded: boolean;
    isActive: boolean;
    isOnActivePath: boolean;
    path: ReadonlyArray<string>;
};

interface NavigationItemData {
    id: string;
    label: ReactNode;
    url?: string;
    external?: boolean;
    items?: NavigationItemData[];
}
declare function toTreeNodes(items: ReadonlyArray<NavigationItemData>): TreeNode[];

interface LinkComponentProps {
    'className'?: string;
    'href': string;
    'target'?: HTMLAttributeAnchorTarget | undefined;
    'rel'?: string | undefined;
    'aria-current'?: 'page' | undefined;
    'children'?: ReactNode;
}
interface VerticalNavigationMenuItemProps {
    id: string;
    label: NavigationItemData['label'];
    url?: string;
    external?: boolean;
    items?: NavigationItemData[];
    depth?: number;
    forceMountDepth?: number;
    LinkComponent?: ElementType<LinkComponentProps>;
}
declare function VerticalNavigationMenuItem({ id, label, url, external, items, depth, forceMountDepth, LinkComponent, }: VerticalNavigationMenuItemProps): react_jsx_runtime.JSX.Element;

interface VerticalNavigationMenuProps extends Omit<NavigationProviderProps, 'children' | 'nodes'> {
    items: NavigationItemData[];
    LinkComponent?: ElementType<LinkComponentProps>;
}
declare function VerticalNavigationMenu({ items, LinkComponent, ...navigationOptions }: VerticalNavigationMenuProps): react_jsx_runtime.JSX.Element;

interface AppSidebarProps extends HTMLAttributes<HTMLDivElement> {
    isOpen?: boolean;
    onClose?: () => void;
}
declare const AppSidebar: ({ isOpen, onClose, children, ...props }: AppSidebarProps) => react_jsx_runtime.JSX.Element;
interface AppPageSidebarWithNavigationProps extends AppSidebarProps {
    header?: ReactNode;
    footer?: ReactNode;
    navigationItems?: NavigationItemData[];
    contentOverwrite?: ReactNode;
    activeId?: string | null;
    LinkComponent?: ElementType<LinkComponentProps>;
}
declare const AppPageSidebarWithNavigation: ({ header, footer, navigationItems, contentOverwrite, activeId, LinkComponent, ...props }: AppPageSidebarWithNavigationProps) => react_jsx_runtime.JSX.Element;
interface AppPageNavigationItem {
    id: string;
    label: ReactNode;
    icon?: ReactNode;
    url?: string;
    external?: boolean;
    items?: AppPageNavigationItem[];
}
interface AppPageSidebarProps {
    activeId?: string | null;
    activeUrl?: string;
    header?: ReactNode;
    items?: AppPageNavigationItem[];
    contentOverwrite?: ReactNode;
    footer?: ReactNode;
    LinkComponent?: ElementType<LinkComponentProps>;
}
interface AppPageProps extends HTMLAttributes<HTMLDivElement> {
    headerActions?: ReactNode[];
    sidebarProps: AppPageSidebarProps;
    noScrolling?: boolean;
    hasSpacer?: boolean;
}
declare const AppPage: ({ children, headerActions, sidebarProps, noScrolling, hasSpacer, ...props }: AppPageProps) => react_jsx_runtime.JSX.Element;

type DialogPosition = 'top' | 'center' | 'none';
type DialogProps = HTMLAttributes<HTMLDivElement> & {
    /** Whether the dialog is currently open */
    isOpen?: boolean;
    /** Title of the Dialog used for accessibility */
    titleElement: ReactNode;
    /** Description of the Dialog used for accessibility */
    description: ReactNode;
    /** Callback when the dialog tries to close */
    onClose?: () => void;
    /** Styling for the background */
    backgroundClassName?: string;
    /** If true shows a close button and sends onClose on background clicks */
    isModal?: boolean;
    position?: DialogPosition;
    isAnimated?: boolean;
    containerClassName?: string;
};
/**
 * A generic dialog window which is managed by its parent
 */
declare const Dialog: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
    /** Whether the dialog is currently open */
    isOpen?: boolean;
    /** Title of the Dialog used for accessibility */
    titleElement: ReactNode;
    /** Description of the Dialog used for accessibility */
    description: ReactNode;
    /** Callback when the dialog tries to close */
    onClose?: () => void;
    /** Styling for the background */
    backgroundClassName?: string;
    /** If true shows a close button and sends onClose on background clicks */
    isModal?: boolean;
    position?: DialogPosition;
    isAnimated?: boolean;
    containerClassName?: string;
} & react.RefAttributes<HTMLDivElement>>;

type DialogContextType = {
    isOpen: boolean;
    setIsOpen: Dispatch<SetStateAction<boolean>>;
    isModal: boolean;
};
declare const DialogContext: react.Context<DialogContextType>;
declare function useDialogContext(): DialogContextType;

interface DialogOpenerWrapperBag {
    open: () => void;
    close: () => void;
    isOpen: boolean;
    toggleOpen: () => void;
    props: {
        'onClick': () => void;
        'aria-haspopup': 'dialog';
    };
}
interface DialogOpenerWrapperProps {
    children: (props: DialogOpenerWrapperBag) => ReactNode;
}
declare function DialogOpenerWrapper({ children }: DialogOpenerWrapperProps): ReactNode;
interface DialogOpenerPassingProps {
    'children'?: React.ReactNode;
    'onClick'?: React.MouseEventHandler<HTMLButtonElement>;
    'aria-haspopup'?: 'dialog';
}

interface DialogRootProps extends PropsWithChildren {
    isOpen?: boolean;
    onIsOpenChange?: (isOpen: boolean) => void;
    initialIsOpen?: boolean;
    isModal?: boolean;
}
declare function DialogRoot({ children, isOpen: controlledIsOpen, onIsOpenChange, initialIsOpen, isModal, }: DialogRootProps): react_jsx_runtime.JSX.Element;

/**
 * The different sizes for a button
 */
type ButtonSize = 'xs' | 'sm' | 'md' | 'lg' | null;
type ButtonColoringStyle = 'outline' | 'solid' | 'text' | 'tonal' | 'tonal-outline' | null;
declare const buttonColorsList: readonly ["primary", "secondary", "positive", "warning", "negative", "neutral"];
/**
 * The allowed colors for the Button
 */
type ButtonColor = typeof buttonColorsList[number] | null;
declare const ButtonUtil: {
    colors: readonly ["primary", "secondary", "positive", "warning", "negative", "neutral"];
};
/**
 * The shard properties between all button types
 */
type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
    /**
     * @default 'medium'
     */
    size?: ButtonSize;
    color?: ButtonColor;
    /**
     * @default 'solid'
     */
    coloringStyle?: ButtonColoringStyle;
    allowClickEventPropagation?: boolean;
};
/**
 * A button with a solid background and different sizes
 */
declare const Button: react.ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & {
    /**
     * @default 'medium'
     */
    size?: ButtonSize;
    color?: ButtonColor;
    /**
     * @default 'solid'
     */
    coloringStyle?: ButtonColoringStyle;
    allowClickEventPropagation?: boolean;
} & react.RefAttributes<HTMLButtonElement>>;

type ConfirmDialogType = 'positive' | 'negative' | 'neutral' | 'primary';
type ButtonOverwriteType = {
    text?: string;
    color?: ButtonColor;
    disabled?: boolean;
};
type ConfirmDialogProps = Omit<DialogProps, 'onClose'> & {
    isShowingDecline?: boolean;
    requireAnswer?: boolean;
    onCancel: () => void;
    onConfirm: () => void;
    onDecline?: () => void;
    confirmType?: ConfirmDialogType;
    /**
     * Order: Cancel, Decline, Confirm
     */
    buttonOverwrites?: [ButtonOverwriteType, ButtonOverwriteType, ButtonOverwriteType];
};
/**
 * A Dialog for asking the user for confirmation
 */
declare const ConfirmDialog: ({ children, onCancel, onConfirm, onDecline, confirmType, buttonOverwrites, className, ...restProps }: PropsWithChildren<ConfirmDialogProps>) => react_jsx_runtime.JSX.Element;

type DiscardChangesDialogProps = Omit<ConfirmDialogProps, 'onDecline' | 'onConfirm' | 'buttonOverwrites' | 'titleElement' | 'description'> & {
    isShowingDecline?: boolean;
    requireAnswer?: boolean;
    onCancel: () => void;
    onSave: () => void;
    onDontSave: () => void;
    titleOverwrite?: ReactNode;
    descriptionOverwrite?: ReactNode;
};
declare const DiscardChangesDialog: ({ children, onCancel, onSave, onDontSave, titleOverwrite, descriptionOverwrite, ...props }: PropsWithChildren<DiscardChangesDialogProps>) => react_jsx_runtime.JSX.Element;

type UseDelayOptionsResolved = {
    delay: number;
    disabled: boolean;
};
type UseDelayOptions = Partial<UseDelayOptionsResolved>;
declare function useDelay(options?: UseDelayOptions): {
    restartTimer: (onDelayFinish: () => void) => void;
    clearTimer: () => void;
    hasActiveTimer: boolean;
};

type EditCompleteOptionsResolved = {
    onBlur: boolean;
    afterDelay: boolean;
    allowEnterComplete?: boolean;
} & Omit<UseDelayOptionsResolved, 'disabled'>;
type EditCompleteOptions = Partial<EditCompleteOptionsResolved>;
type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> & Partial<FormFieldDataHandling<string>> & Partial<FormFieldInteractionStates> & {
    'editCompleteOptions'?: EditCompleteOptions;
    'initialValue'?: string;
    'data-name'?: string;
};
/**
 * A Component for inputting text or other information
 *
 * Its state is managed must be managed by the parent
 */
declare const Input: react__default.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "value"> & Partial<FormFieldDataHandling<string>> & Partial<FormFieldInteractionStates> & {
    editCompleteOptions?: EditCompleteOptions;
    initialValue?: string;
    'data-name'?: string;
} & react__default.RefAttributes<HTMLInputElement>>;

type InputModalProps = ConfirmDialogProps & {
    inputs: InputProps[];
};
/**
 * A modal for receiving multiple inputs
 */
declare const InputDialog: ({ inputs, buttonOverwrites, ...props }: InputModalProps) => react_jsx_runtime.JSX.Element;

interface SelectIds {
    trigger: string;
    content: stri