import { JSX, Ref } from 'react';
import { Placement, UseFloatingOptions, UseDismissProps } from '@floating-ui/react';
import { ShallowMerge } from '@janbox/storefront-ui/types';
export interface WbCascaderOption {
    label: React.ReactNode;
    value: string;
    disabled?: boolean;
    children?: WbCascaderOption[];
}
interface WbCascaderExtendedProps {
    innerRef?: Ref<HTMLDivElement>;
    placement?: Placement;
    contentWidth?: number | 'fit-parent';
    onOpenChange?: UseFloatingOptions['onOpenChange'];
    visible?: boolean;
    dissmiss?: UseDismissProps;
    defaultValue?: string[];
    value?: string[] | null;
    options: WbCascaderOption[];
    /** Fires with the full value path and matching option path. */
    onChange?: (value: string[], options: WbCascaderOption[]) => void;
    /** How each column expands to reveal its children. Default: `click` */
    expandTrigger?: 'click' | 'hover';
    /** Allow committing a value at any level, not just leaves. Default: `false` */
    changeOnSelect?: boolean;
    placeholder?: string;
    /** Show a clear button when a value is selected. Default: `false` */
    allowClear?: boolean;
    /** Renders the selected path in the trigger. Defaults to labels joined by `separator`. */
    displayRender?: (labels: React.ReactNode[], options: WbCascaderOption[]) => React.ReactNode;
    separator?: React.ReactNode;
    prefix?: React.ReactNode;
    suffix?: React.ReactNode;
    size?: '28' | '32' | '36';
    columnWidth?: number;
    columnMaxHeight?: number;
    emptyText?: React.ReactNode;
}
export type WbCascaderProps = ShallowMerge<JSX.IntrinsicElements['button'], WbCascaderExtendedProps>;
export declare const WbCascader: (props: WbCascaderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
export {};