Skip to content

fix(autocomplete,cascadeselect,dataview): enable generic type inference for options and slots#8489

Open
YevheniiKotyrlo wants to merge 2 commits intoprimefaces:masterfrom
YevheniiKotyrlo:fix/autocomplete-cascadeselect-dataview-generics
Open

fix(autocomplete,cascadeselect,dataview): enable generic type inference for options and slots#8489
YevheniiKotyrlo wants to merge 2 commits intoprimefaces:masterfrom
YevheniiKotyrlo:fix/autocomplete-cascadeselect-dataview-generics

Conversation

@YevheniiKotyrlo
Copy link
Copy Markdown

@YevheniiKotyrlo YevheniiKotyrlo commented Mar 11, 2026

Defect Fixes

Fixes #8486

AutoComplete, CascadeSelect, and DataView use any for their data arrays, slot scoped data, and event payloads. Developers get no type safety when working with suggestion/option slots or option-select events.

Same root cause as #8442DefineComponent's no-arg constructor prevents generic inference. Same fix pattern as #8444 (DataTable/DatePicker).

Related: #7426, #6041

Reproducer: StackBlitzbun run type-check (0 errors, typo undetected) → bun run patch && bun run type-check (TS2339 catches it)

Problem

<AutoComplete :suggestions="users" optionLabel="name">
  <template #option="{ option }">
    {{ option.naem }}
    <!-- No error — `option` is `any`, typo ships to production -->
  </template>
</AutoComplete>

After this fix, TypeScript infers T from the data binding and flows it to all slots and events:

<AutoComplete :suggestions="users" optionLabel="name">
  <template #option="{ option }">
    {{ option.naem }}
    <!-- TS2339: Property 'naem' does not exist on type 'User' -->
  </template>
</AutoComplete>

Event handlers also benefit — option-select and option-unselect now carry the inferred type:

const handleSelect = (event: AutoCompleteOptionSelectEvent<User>) => {
  console.log(event.value.name); // fully typed
};

Changes

AutoComplete and CascadeSelect:

  • [Component]Props<T = any>suggestions/options: T[], callback params (data: T) => ...
  • [Component]Slots<T = any>option: T, suggestions/options: T[] in header/footer slots
  • Generic constructor: new <T = any>(props) with $slots, $emit both wired to T
  • modelValue stays any — when optionValue is set, the value is the extracted scalar, not the option object

AutoComplete events (additional):

  • AutoCompleteOptionSelectEvent<T = any>value: T instead of value: any
  • AutoCompleteOptionUnselectEvent<T = any> — extends generic select event
  • AutoCompleteEmitsOptions<T = any> — select/unselect emits use generic event types
  • AutoCompleteEmits<T = any> — propagates T through EmitFn

DataView:

  • DataViewProps<T> already exists with value: T[] — props were already generic from a previous PR
  • DataViewSlots<T = unknown> — wires existing T to list and grid slot items: T[]
  • Generic constructor replaces DefineComponent — completing the generic plumbing that was left half-done

What gets typed

Slot/Callback/Event Before After
AutoComplete #option slot option any T
AutoComplete #header / #footer slot suggestions any[] T[]
AutoComplete optionLabel callback param any T
AutoComplete option-select event value any T
AutoComplete option-unselect event value any T
CascadeSelect #option slot option any T
CascadeSelect #header / #footer slot options any[] T[]
CascadeSelect optionLabel/optionValue/optionDisabled callback param any T
DataView #list / #grid slot items any T[]

Scope / Impact

  • No breaking changes — backward compatible, T defaults to any
  • No runtime changes — types only (.d.ts files)
  • 3 components: AutoComplete, CascadeSelect, DataView

Verification

Gate Result
pnpm run format:check PASS
pnpm run lint PASS
pnpm run test:unit Pre-existing failures only, 0 new
pnpm run build:packages PASS

Series

This is part of a series bringing generic type inference to all PrimeVue data components:

PR Components Status
#8444 DataTable, DatePicker Open
#8484 Select, MultiSelect, Listbox Open
#8485 Column (phantom of prop) Open
#8489 AutoComplete, CascadeSelect, DataView This PR
#8490 Carousel, Galleria, Timeline Open
#8491 OrderList, PickList Open
#8493 VirtualScroller, SelectButton, InputChips Open

After this series, every PrimeVue component with a collection prop will infer T from the binding and flow it to slots and events — giving developers full IDE autocomplete and compile-time type safety in templates.

@YevheniiKotyrlo YevheniiKotyrlo force-pushed the fix/autocomplete-cascadeselect-dataview-generics branch from a89287e to 52bab93 Compare March 25, 2026 14:36
…ference

Same approach as Select/MultiSelect/Listbox (PR primefaces#8484): when
optionGroupChildren is set, the #option slot receives child items, not
the group objects. A single T generic types the slot incorrectly.

AutoComplete now uses <T, C> with three constructor overloads:
- Function accessor: C inferred from optionGroupChildren return type
- String accessor: C falls back to any
- No groups: C = T (backward compatible)

CascadeSelect and DataView are not affected (CascadeSelect renders all
levels in a single #option slot; DataView has no optionGroup).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

AutoComplete, CascadeSelect, DataView: options/suggestions/value generic type not inferred

1 participant