@uva-glass/component-library/dist/components/SelectListbox/SelectListbox.d.ts

React components UvA

import { PropsWithChildren } from 'react';
import { OptionValue, SelectValue } from './SelectProvider';
import { SelectOptionProps } from './components/SelectOption';
export interface SelectListboxProps {
    /** The possible options to select. */
    options: OptionValue[];
    /** The selected value by default. */
    defaultValue?: SelectValue;
    /** The max height of the options. */
    maxOptionHeight?: `${number}${'px' | 'rem'}`;
    /** `true` to disable the select box; otherwise, `false`. The default is `false`. */
    disabled?: boolean;
    /** The name of the property in the options structure that contains the label of the options. */
    buttonLabelProp?: string;
    /** `true` to render the labels in bold; otherwise, `false`. The default is `false`. */
    buttonLabelBold?: boolean;
    /** The variant of the select box. */
    variant?: 'noborder' | 'pill' | 'pillLeft' | 'pillRight' | 'darkBorder';
    /** If true sets the option dropdown min-width to the width of the select button. */
    fullWidth?: boolean;
    /** The size of the select box. */
    size?: 'small' | 'medium' | 'default';
    /** `true` to align the right side of the options with the select box; otherwise, `false` to align on the left side. */
    optionPositionRight?: boolean;
    /** The breakpoint at which to switch to the mobile view. */
    mobileBreakpoint?: `${number}${'px' | 'rem'}`;
    /** The callback function that is invoked when an option is selected. */
    onChange?: (option: OptionValue) => void;
    /** Option to add a devider after a given amout of ouptions in the select option box. */
    dividerAfter?: number;
}
/** Represents a component to render a select list box. */
export declare const SelectListbox: {
    ({ options, variant, fullWidth, size, optionPositionRight, defaultValue, maxOptionHeight, disabled, buttonLabelProp, buttonLabelBold, onChange, dividerAfter, children, }: PropsWithChildren<SelectListboxProps>): import("react/jsx-runtime").JSX.Element;
    SelectOption: ({ option, index, dividerAfter, children }: SelectOptionProps) => import("react/jsx-runtime").JSX.Element;
};