mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-14 18:01:06 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(multi-select): fix filterItem return type (#1972)

Browse source
This commit is contained in:
Eytan 2024-08-08 21:34:58 +02:00 • committed by GitHub
commit 6140c3c5a9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 7 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

2
COMPONENT_INDEX.md
View file

@ -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 | | 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 | | 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 | | 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 | | 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 | | 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 | | placeholder | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the placeholder text |

2
docs/src/COMPONENT_API.json
View file

@ -7123,7 +7123,7 @@
"name": "filterItem", "name": "filterItem",
"kind": "let", "kind": "let",
"description": "Override the filtering logic\nThe default filtering is an exact string comparison", "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())", "value": "(item, value) => item.text.toLowerCase().includes(value.trim().toLowerCase())",
"isFunction": true, "isFunction": true,
"isFunctionDeclaration": false, "isFunctionDeclaration": false,

2
src/MultiSelect/MultiSelect.svelte
View file

@ -69,7 +69,7 @@
/** /**
* Override the filtering logic * Override the filtering logic
* The default filtering is an exact string comparison * 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) => export let filterItem = (item, value) =>
item.text.toLowerCase().includes(value.trim().toLowerCase()); item.text.toLowerCase().includes(value.trim().toLowerCase());

3
tests/MultiSelect.test.svelte
View file

@ -127,6 +127,9 @@
<MultiSelect <MultiSelect
filterable filterable
filterItem="{(item, query) => {
return item.text.toLowerCase().includes(query.toLowerCase());
}}"
titleText="Contact" titleText="Contact"
placeholder="Filter contact methods..." placeholder="Filter contact methods..."
items="{[ items="{[

2
types/MultiSelect/MultiSelect.svelte.d.ts vendored
View file

@ -90,7 +90,7 @@ export interface MultiSelectProps extends RestProps {
* The default filtering is an exact string comparison * The default filtering is an exact string comparison
* @default (item, value) => item.text.toLowerCase().includes(value.trim().toLowerCase()) * @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 * Set to `true` to open the dropdown