-
Notifications
You must be signed in to change notification settings - Fork 1.6k
Description
Describe the bug
The headercheckboxicon slot in the Column component is documented in the type definitions and API, but it does not work in practice. The relevant template in the HeaderCheckbox component is commented out or missing, so any custom content provided to the headercheckboxicon slot is ignored and the default checkbox icon is always rendered.
This prevents users from customizing the header checkbox icon in DataTable selection columns, which is important for consistent UI/UX and theming.
Expected:
Custom content provided to the headercheckboxicon slot should be rendered in the header checkbox.
Actual:
The slot is ignored and the default icon is always shown, making
Pull Request Link
Reproducer
https://stackblitz.com/edit/primevue-4-vite-issue-template-o5sngxzt?file=src%2FApp.vue
Environment
The issue doesn't depend on the environment.
Vue version
3.5.13
PrimeVue version
4.3.6
Node version
22.16.0
Browser(s)
No response
Steps to reproduce the behavior
- import
Datatablefrom PrimeVue 4.3.6 - Use
selectionMode="multiple"prop for the first column of the table - Try overriding
rowcheckboxiconandheadercheckboxiconslots with any content
<DataTable
v-model:selection="selectedProducts"
:value="products"
dataKey="id"
tableStyle="min-width: 50rem"
>
<Column selectionMode="multiple" headerStyle="width: 3rem">
<template #rowcheckboxicon>x</template>
<template #headercheckboxicon>x</template>
</Column>
<Column field="code" header="Code"></Column>
<Column field="name" header="Name"></Column>
<Column field="category" header="Category"></Column>
<Column field="quantity" header="Quantity"></Column>
</DataTable>
Actual behaviour:
The x symbol is rendered inside only the body rows' checkboxes, not in the header.
Expected behavior
The x symbol is rendered inside every checkbox, both in the body rows of the table and the header.
Metadata
Metadata
Assignees
Labels
Type
Projects
Status