@bmsuisse/ui 0.7.0 → 0.8.0

package/dist/index.d.ts

@@ -356,6 +356,67 @@ type ComboboxProps = ComboboxSingleProps | ComboboxMultiProps;
  */
 declare function Combobox(props: ComboboxProps): ReactElement;
 
+interface TagComboboxOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+    /** Groups this option under a header with the given key, rendered as a bold label
+     * plus a tri-state "select all" checkbox (unchecked/checked/indeterminate, reflecting
+     * how many of the group's members are selected — toggling it selects or clears the
+     * whole group). Options sharing a `group` must be contiguous in `options` — see
+     * `Combobox`'s own `group` doc for the same constraint and the reasoning behind it. */
+    group?: string;
+}
+interface TagComboboxProps {
+    /** The full option list. Filtering happens client-side against `label`,
+     * unless `onSearchChange` is given (see below). */
+    options: TagComboboxOption[];
+    /** Selected options' `value`s. */
+    value: string[];
+    /** Called with the full updated selection after a toggle or a chip removal. */
+    onChange: (value: string[]) => void;
+    /** Shown in the field when nothing is selected and nothing is typed. Defaults to `"Select…"`. */
+    placeholder?: string;
+    /** Shown when the search term matches nothing. Defaults to `"No matches."`. */
+    emptyMessage?: string;
+    disabled?: boolean;
+    /** Shows `loadingMessage` in the option list instead of `emptyMessage`, for a
+     * combobox whose `options` are still being fetched (e.g. a server search whose
+     * request hasn't resolved yet). Defaults to `false`. */
+    loading?: boolean;
+    /** Message shown in the option list while `loading` is true. Defaults to `"Loading…"`. */
+    loadingMessage?: string;
+    className?: string;
+    id?: string;
+    /** Forwarded to the field, for test targeting (e.g. Playwright/Testing Library). */
+    "data-testid"?: string;
+    /** Switches the search input to server-driven mode: called with the raw search
+     * text on every keystroke, and `options` is rendered as-is instead of being
+     * filtered locally against `label`. Omit for the default client-side filtering
+     * behavior — see `Combobox`'s own `onSearchChange` for the same contract. */
+    onSearchChange?: (search: string) => void;
+    /** Portal target for the popover, forwarded to the underlying `PopoverContent`.
+     * Needed when the combobox is opened from inside a modal Dialog/Sheet — pass the
+     * Dialog/Sheet content element so the popover portals inside it instead of
+     * `document.body`, which would otherwise fight with the Dialog's focus trap. */
+    container?: ComponentProps<typeof PopoverContent>["container"];
+    /** Display label for a group key (`TagComboboxOption.group`). Falls back to the raw
+     * key when an entry is missing. Only relevant when at least one option sets `group`. */
+    groupLabels?: Record<string, string>;
+}
+/**
+ * A tags-and-search multi-select: selected options render as removable chips
+ * inline inside one bordered field, with a search input immediately after
+ * the last chip. Typing opens a popover listing matches below the field;
+ * picking one adds a chip right where the caret was and clears the search
+ * term so the user can keep typing. Complements `Combobox`'s `multiple`
+ * mode (a trigger button + a summary count) for the case where every
+ * individual selection needs to stay visible and removable at a glance —
+ * built on the same `Popover`/keyboard-nav shape rather than forking it,
+ * so both patterns share one mental model.
+ */
+declare function TagCombobox({ options, value, onChange, placeholder, emptyMessage, disabled, loading, loadingMessage, className, id, onSearchChange, container, groupLabels, ...rest }: TagComboboxProps): ReactElement;
+
 type AlertBoxVariant = "error" | "warning" | "info" | "success";
 interface AlertBoxProps {
     /** Determines the color scheme and the default icon. */
@@ -572,4 +633,4 @@ declare function useSidebarCollapsed(): boolean;
 /** Merges conditional class names, then dedupes conflicting Tailwind utility classes. */
 declare function cn(...inputs: ClassValue[]): string;
 
-export { AlertBox, type AlertBoxProps, type AlertBoxVariant, Badge, type BadgeProps, Button, ButtonGroup, type ButtonGroupOption, type ButtonGroupProps, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Combobox, type ComboboxMultiProps, type ComboboxOption, type ComboboxProps, type ComboboxSingleProps, ConfirmDialog, type ConfirmDialogProps, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FormField, type FormFieldProps, FormModal, type FormModalProps, Input, type InputProps, Label, LoadingOverlay, type LoadingOverlayProps, LoadingSpinner, type LoadingSpinnerProps, Modal, type ModalProps, NavGroup, type NavGroupProps, type NavIconProps, NavItem, type NavItemProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ScrollArea, ScrollBar, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarNav, type SidebarNavProps, type SidebarProps, Skeleton, StatusBadge, type StatusBadgeProps, type StatusTone, Switch, type SwitchProps, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, loadingSpinnerIconVariants, sheetVariants, useSidebarCollapsed };
+export { AlertBox, type AlertBoxProps, type AlertBoxVariant, Badge, type BadgeProps, Button, ButtonGroup, type ButtonGroupOption, type ButtonGroupProps, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Combobox, type ComboboxMultiProps, type ComboboxOption, type ComboboxProps, type ComboboxSingleProps, ConfirmDialog, type ConfirmDialogProps, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FormField, type FormFieldProps, FormModal, type FormModalProps, Input, type InputProps, Label, LoadingOverlay, type LoadingOverlayProps, LoadingSpinner, type LoadingSpinnerProps, Modal, type ModalProps, NavGroup, type NavGroupProps, type NavIconProps, NavItem, type NavItemProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ScrollArea, ScrollBar, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarNav, type SidebarNavProps, type SidebarProps, Skeleton, StatusBadge, type StatusBadgeProps, type StatusTone, Switch, type SwitchProps, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TagCombobox, type TagComboboxOption, type TagComboboxProps, Textarea, type TextareaProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, loadingSpinnerIconVariants, sheetVariants, useSidebarCollapsed };