feat(fuselage): Add renderItem prop to the PaginatedMultiSelect c…

…omponent (#1203) Co-authored-by: Douglas Fabris <[email protected]>
RocketChat · Oct 19, 2023 · da8cf6a · da8cf6a
1 parent 5720081
commit da8cf6a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 0 deletions.
diff --git a/.changeset/twelve-yaks-study.md b/.changeset/twelve-yaks-study.md
@@ -0,0 +1,5 @@
+---
+"@rocket.chat/fuselage": minor
+---
+
+feat(fuselage): Add `renderItem` prop to the `PaginatedMultiSelect` component
diff --git a/packages/fuselage/src/components/PaginatedSelect/PaginatedMultiSelect.tsx b/packages/fuselage/src/components/PaginatedSelect/PaginatedMultiSelect.tsx
@@ -16,6 +16,7 @@ import Chip from '../Chip';
 import Flex from '../Flex';
 import { Icon } from '../Icon';
 import Margins from '../Margins';
+import Option from '../Option';
 import { useVisible } from '../Options/useVisible';
 import { OptionsPaginated } from '../OptionsPaginated';
 import Position from '../Position';
@@ -41,6 +42,7 @@ type PaginatedMultiSelectProps = Omit<
   renderOptions?: (
     props: ComponentProps<typeof OptionsPaginated>
   ) => ReactElement | null;
+  renderItem?: (props: ComponentProps<typeof Option>) => ReactElement | null;
   anchor?: any;
 };
 
@@ -55,6 +57,7 @@ const PaginatedMultiSelect = ({
   onChange = () => {},
   placeholder,
   renderOptions: OptionsComponent = OptionsPaginated,
+  renderItem = Option,
   endReached,
   ...props
 }: PaginatedMultiSelectProps) => {
@@ -191,6 +194,7 @@ const PaginatedMultiSelect = ({
             options={options}
             cursor={-1}
             endReached={endReached}
+            renderItem={renderItem}
             onSelect={([value]) => {
               toggleOption(value);
             }}