Fixed #6481 - Tree Filter

pull/6483/head
tugcekucukoglu 2024-09-26 10:47:26 +03:00
parent 6065a4e2b5
commit acae251bcd
3 changed files with 52 additions and 4 deletions

View File

@ -56,6 +56,26 @@ export default {
type: Boolean, type: Boolean,
default: null default: null
}, },
filter: {
type: Boolean,
default: false
},
filterBy: {
type: [String, Function],
default: 'label'
},
filterMode: {
type: String,
default: 'lenient'
},
filterPlaceholder: {
type: String,
default: null
},
filterLocale: {
type: String,
default: undefined
},
inputId: { inputId: {
type: String, type: String,
default: null default: null

View File

@ -209,10 +209,6 @@ export interface TreeSelectProps {
* @defaultValue null * @defaultValue null
*/ */
fluid?: boolean | undefined; fluid?: boolean | undefined;
/**
* Style class of the overlay panel.
*/
panelClass?: any;
/** /**
* A valid query selector or an HTMLElement to specify where the overlay gets attached. * A valid query selector or an HTMLElement to specify where the overlay gets attached.
* @defaultValue body * @defaultValue body
@ -234,6 +230,29 @@ export interface TreeSelectProps {
* @defaultValue false * @defaultValue false
*/ */
metaKeySelection?: boolean | undefined; metaKeySelection?: boolean | undefined;
/**
* When specified, displays an input field to filter the items.
* @defaultValue false
*/
filter?: boolean | undefined;
/**
* When filtering is enabled, filterBy decides which field or fields (comma separated) to search against. A callable taking a TreeNode can be provided instead of a list of field names.
* @defaultValue label
*/
filterBy?: string | ((node: TreeNode) => string) | undefined;
/**
* Mode for filtering.
* @defaultValue lenient
*/
filterMode?: 'lenient' | 'strict' | undefined;
/**
* Placeholder text to show when filter input is empty.
*/
filterPlaceholder?: string | undefined;
/**
* Locale to use in filtering. The default locale is the host environment's current locale.
*/
filterLocale?: string | undefined;
/** /**
* Identifier of the underlying input element. * Identifier of the underlying input element.
*/ */
@ -250,6 +269,10 @@ export interface TreeSelectProps {
* Used to pass all properties of the HTMLInputElement to the focusable input element inside the component. * Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.
*/ */
inputProps?: InputHTMLAttributes | undefined; inputProps?: InputHTMLAttributes | undefined;
/**
* Style class of the overlay panel.
*/
panelClass?: any;
/** /**
* Establishes relationships between the component and label(s) where its value should be one or more element IDs. * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
*/ */

View File

@ -64,6 +64,11 @@
:id="listId" :id="listId"
:value="options" :value="options"
:selectionMode="selectionMode" :selectionMode="selectionMode"
:filter="filter"
:filterBy="filterBy"
:filterMode="filterMode"
:filterPlaceholder="filterPlaceholder"
:filterLocale="filterLocale"
@update:selectionKeys="onSelectionChange" @update:selectionKeys="onSelectionChange"
:selectionKeys="modelValue" :selectionKeys="modelValue"
:expandedKeys="expandedKeys" :expandedKeys="expandedKeys"