WeDtSelectResourceFilter

A resource select filter component that extends WeDtSelectFilter by fetching items from an API endpoint. It supports single and multiple selection, search, infinite scroll, raw value emission, and integration with dynamic resources.

Selected items appear as chips in the activator area. Multiple selection is enabled by default. Items are loaded lazily or with pagination, and the component can wait for user interaction before fetching.

<template>
  <WeDtSelectResourceFilter
    v-model="filters.user"
    resource="users"
    label="User"
  />
</template>

<script setup>
const filters = ref({
  user: null,
})
</script>

Modes

The component can work in two modes:

1. Structured filter mode (default)

Emits an object like:

{
  operator: '=',
  value: true
}

2. Raw value mode

By enabling emitRawValue = true, the component emits only the toggled raw value without wrapping it in a filter object.

Props

Prop	Type	Default	Description
resource	String	Required	Name of the resource on the server
itemValue	String	'id'	Property name to use as the value
itemText	String | Function	'name'	Property name or function to use as display text
paginate	Boolean | Object	true	Whether to use pagination and pagination options
lazy	Boolean	false	Whether to use lazy loading/caching for API requests
extraParams	Object	{}	Additional parameters for the API request
label	String	null	Label shown in the activator and dropdown header
maxChips	Number	2	Maximum number of chips shown before collapsing with +N
emitRawValue	Boolean	false	When true, v-model returns only the raw toggled value instead of filter objects
width	String | Number	400px	Width of the dropdown menu
location	String	bottom end	Position of the dropdown menu
loading	Boolean	false	Displays loading animation in the search field and at the bottom of the dropdown
onIntersectLast	Function	undefined	Callback for infinite scrolling when the last item is intersected

Slots

Name	Props	Description
item-title	{ item }	Custom renderer for the item label inside the dropdown