import { MatchSorterOptions } from 'match-sorter'; import { MultiSelectFieldProps, MultiSelectFieldOption } from './types'; import { SyncFilterFn } from '../../../internal/functions/syncFilterUtils'; export type MultiSelectFieldSyncProps = Omit & { /** * The options to display in the multi-select field. */ options: MultiSelectFieldOption[]; /** * Controls how options are filtered and sorted when the user types a search value. * Can be a function that returns options in the desired display order, * or a MatchSorterOptions object to customize the default match-sorter behavior. * * Before any search is performed, options appear in the order they are supplied. * By default, options are filtered by `label` and `searchText` using match-sorter, * which also ranks results by match quality (best matches first). * * @example * { * return options.filter((option) => { * return option.label?.toLowerCase().includes(searchValue.toLowerCase()); * }); * }} * /> * * @example * */ filter?: SyncFilterFn | MatchSorterOptions; /** * Enables the "Select All" option at the top of the list. * Can be a boolean to enable with default label, or an object to customize the label. * Click handling and check state are managed automatically based on the options and value. * * Select All and Select Filtered are mutually exclusive: * - Select All is shown when the search input is empty. * - Select Filtered (if enabled) is shown when a search term is active. * * The label can be a string or a function that receives a boolean indicating whether all options are selected. * * @example * * * @example * * * @example * checked ? "Deselect All" : "Select All" }} * options={options} * {...props} * /> */ selectAll?: boolean | { label?: string | ((checked: boolean) => string); }; /** * Enables the "Select Filtered" option when a search term is active. * Can be a boolean to enable with default label, or a function that receives the * search value and returns a config object with a custom label. * Click handling and check state are managed automatically based on the filtered options and value. * * When clicked, all enabled options matching the current search term are selected (or deselected if all are already selected). * * Select All and Select Filtered are mutually exclusive: * - Select All (if enabled) is shown when the search input is empty. * - Select Filtered is shown when a search term is active. * * @example * * * @example * ({ * label: `Select items matching "${searchValue}"`, * })} * options={options} * {...props} * /> */ selectFiltered?: boolean | ((searchValue: string) => { label?: string; }); }; /** * MultiSelectFieldSync is a simplified version of MultiSelectField that is used to display a list of options in a multi-select field. * * Features: * - Accepts `options` instead of `loadOptions` and `lazy`. * - Performs client-side filtering of the options. * - Optionally accepts a function to filter the options, or a MatchSorterOptions object to customize the default filtering. * - Simplified `selectAll` prop that automatically handles click and check state. * - Simplified `selectFiltered` prop that automatically selects/deselects filtered options. * - Supports all the other props of MultiSelectField. */ export declare const MultiSelectFieldSync: (props: MultiSelectFieldSyncProps) => import("react/jsx-runtime").JSX.Element;