diff --git a/src/components/multi-select.tsx b/src/components/multi-select.tsx index ee5eeca..61b91a4 100644 --- a/src/components/multi-select.tsx +++ b/src/components/multi-select.tsx @@ -110,6 +110,18 @@ interface MultiSelectProps */ asChild?: boolean; + /** + * If true, a search input will be displayed at the top of the popover content. + * Optional, defaults to true. + */ + showSearch?: boolean; + + /** + * If true, a "Select All" option will be displayed at the top of the popover content. + * Optional, defaults to true. + */ + showSelectAll?: boolean; + /** * Additional class names to apply custom styles to the multi-select component. * Optional, can be used to add custom styles. @@ -132,6 +144,8 @@ export const MultiSelect = React.forwardRef< maxCount = 3, modalPopover = false, asChild = false, + showSearch = true, + showSelectAll = true, className, ...props }, @@ -284,30 +298,34 @@ export const MultiSelect = React.forwardRef< onEscapeKeyDown={() => setIsPopoverOpen(false)} > - + {showSearch ? ( + + ) : null} No results found. - -
- -
- (Select All) -
+
+ +
+ (Select All) + + ) : null} {options.map((option) => { const isSelected = selectedValues.includes(option.value); return (