From 6140c3c5a91a879889be33080e1aa8b9183982d4 Mon Sep 17 00:00:00 2001
From: Eytan <101130926+eytanProxi@users.noreply.github.com>
Date: Thu, 8 Aug 2024 21:34:58 +0200
Subject: [PATCH] fix(multi-select): fix `filterItem` return type (#1972)

---
 COMPONENT_INDEX.md                        | 2 +-
 docs/src/COMPONENT_API.json               | 2 +-
 src/MultiSelect/MultiSelect.svelte        | 2 +-
 tests/MultiSelect.test.svelte             | 3 +++
 types/MultiSelect/MultiSelect.svelte.d.ts | 2 +-
 5 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index aaf27ef9d1..a328325e65 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -2378,7 +2378,7 @@ export interface MultiSelectItem {
 | selectionFeedback        | No       | <code>let</code> | No       | <code>"top" &#124; "fixed" &#124; "top-after-reopen"</code>                                                | <code>"top-after-reopen"</code>                                                            | Specify the selection feedback after selecting items                                                                                                                  |
 | disabled                 | No       | <code>let</code> | No       | <code>boolean</code>                                                                                       | <code>false</code>                                                                         | Set to `true` to disable the dropdown                                                                                                                                 |
 | filterable               | No       | <code>let</code> | No       | <code>boolean</code>                                                                                       | <code>false</code>                                                                         | Set to `true` to filter items                                                                                                                                         |
-| filterItem               | No       | <code>let</code> | No       | <code>(item: MultiSelectItem, value: string) => string</code>                                              | <code>(item, value) => item.text.toLowerCase().includes(value.trim().toLowerCase())</code> | Override the filtering logic<br />The default filtering is an exact string comparison                                                                                 |
+| filterItem               | No       | <code>let</code> | No       | <code>(item: MultiSelectItem, value: string) => boolean</code>                                             | <code>(item, value) => item.text.toLowerCase().includes(value.trim().toLowerCase())</code> | Override the filtering logic<br />The default filtering is an exact string comparison                                                                                 |
 | light                    | No       | <code>let</code> | No       | <code>boolean</code>                                                                                       | <code>false</code>                                                                         | Set to `true` to enable the light variant                                                                                                                             |
 | locale                   | No       | <code>let</code> | No       | <code>string</code>                                                                                        | <code>"en"</code>                                                                          | Specify the locale                                                                                                                                                    |
 | placeholder              | No       | <code>let</code> | No       | <code>string</code>                                                                                        | <code>""</code>                                                                            | Specify the placeholder text                                                                                                                                          |
diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json
index 49caf480a8..bded77366b 100644
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@@ -7123,7 +7123,7 @@
           "name": "filterItem",
           "kind": "let",
           "description": "Override the filtering logic\nThe default filtering is an exact string comparison",
-          "type": "(item: MultiSelectItem, value: string) => string",
+          "type": "(item: MultiSelectItem, value: string) => boolean",
           "value": "(item, value) =>     item.text.toLowerCase().includes(value.trim().toLowerCase())",
           "isFunction": true,
           "isFunctionDeclaration": false,
diff --git a/src/MultiSelect/MultiSelect.svelte b/src/MultiSelect/MultiSelect.svelte
index ad3464afdb..032dde90c7 100644
--- a/src/MultiSelect/MultiSelect.svelte
+++ b/src/MultiSelect/MultiSelect.svelte
@@ -69,7 +69,7 @@
   /**
    * Override the filtering logic
    * The default filtering is an exact string comparison
-   * @type {(item: MultiSelectItem, value: string) => string}
+   * @type {(item: MultiSelectItem, value: string) => boolean}
    */
   export let filterItem = (item, value) =>
     item.text.toLowerCase().includes(value.trim().toLowerCase());
diff --git a/tests/MultiSelect.test.svelte b/tests/MultiSelect.test.svelte
index 48c9f37e17..9947cb51d1 100644
--- a/tests/MultiSelect.test.svelte
+++ b/tests/MultiSelect.test.svelte
@@ -127,6 +127,9 @@
 
 <MultiSelect
   filterable
+  filterItem="{(item, query) => {
+    return item.text.toLowerCase().includes(query.toLowerCase());
+  }}"
   titleText="Contact"
   placeholder="Filter contact methods..."
   items="{[
diff --git a/types/MultiSelect/MultiSelect.svelte.d.ts b/types/MultiSelect/MultiSelect.svelte.d.ts
index c27b91db0f..ed2bdde931 100644
--- a/types/MultiSelect/MultiSelect.svelte.d.ts
+++ b/types/MultiSelect/MultiSelect.svelte.d.ts
@@ -90,7 +90,7 @@ export interface MultiSelectProps extends RestProps {
    * The default filtering is an exact string comparison
    * @default (item, value) => item.text.toLowerCase().includes(value.trim().toLowerCase())
    */
-  filterItem?: (item: MultiSelectItem, value: string) => string;
+  filterItem?: (item: MultiSelectItem, value: string) => boolean;
 
   /**
    * Set to `true` to open the dropdown