search

primefaces / primevue

Next Generation Vue UI Component Library
https://primevue.org
MIT License
10.85k stars 1.24k forks source link

Step: Cannot disable custom step element #6763

Closed TechSupportJosh closed 1 week ago

TechSupportJosh commented 2 weeks ago

Describe the bug

When using a custom slot element for Step, the disabled attribute is not exposed / passed to the element. When this is combined with a linear Stepper, the step is still clickable even when it should be disabled.

Reproducer

https://stackblitz.com/edit/primevue-4-ts-vite-issue-template-epse6t?file=src%2FApp.vue

PrimeVue version

4.1.1

Vue version

3.x

Language

TypeScript

Build / Runtime

Vue CLI App

Browser(s)

No response

Steps to reproduce the behavior

  1. Create a custom "asChild" value for the Step element.
  2. Bind the a11y attributes as mentioned within the documentation.
  3. Note that step header does not get disabled.

In the Stackblitz link, linear is enabled on the stepper, however the third content step is not disabled

Expected behavior

The binded a11y attributes would include the p-disabled attribute set to true, disabling the element.

From what I can tell, the component exposes the active value to the component: https://github.com/primefaces/primevue/blob/5c6d80f4396d3b09fff3a82ae931b0d571d0a7ff/packages/primevue/src/step/Step.vue#L11C1-L11C127

However, it does not pass the disabled / isStepDisabled attribute down. Not sure whether the a11y attributes are incorrect because it's relying upon this.disabled, instead of isStepDisabled.