qwikifiers / qwik-ui

Qwik's Headless and styled component library
https://qwikui.com
MIT License
633 stars 144 forks source link

[🐞] Select Component Doesn't React to Disabled State Change #821

Closed Toeler closed 5 months ago

Toeler commented 5 months ago

Which package is affected?

Headless Kit

Describe the bug

When changing the disabled attribute on a Select.Root component after the component has been created, the component state doesn't change to reflect the new value

Reproduction

https://stackblitz.com/edit/qwik-starter-msxbxx?file=src/routes/index.tsx

Steps to reproduce

  1. Click on the select button to confirm that no popover is displayed
  2. Uncheck the disabled checkbox
  3. Click on the select button

Expected:

Actual:

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 18.20.3 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.2.3 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    @builder.io/qwik: ^1.4.3 => 1.5.5 
    @builder.io/qwik-city: ^1.4.3 => 1.4.3 
    @qwik-ui/headless: ^0.4.2 => 0.4.2 
    typescript: 5.3.3 => 5.3.3 
    undici: 5.28.2 => 5.28.2 
    vite: 4.5.2 => 4.5.2

Additional Information

This works in the reverse as well. Change the signal initial value to false (enabled) and then check the checkbox and the select also doesn't become disabled.

At a guess, it's because this is trying to track a boolean value and not a signal, so the task isn't firing after the first time:

    useTask$(({ track }) => {
      context.disabled = track(() => disabled);
    });
thejackshelton commented 5 months ago

Hey @Toeler! It should be fixed. The new patch release will be out tomorrow morning 😄