[Bug]: Boolean component not displaying

[Celtic-Bytes]

Describe the bug

I configured a boolean attribute like that:

const meta: Meta<typeof Button> = {
  title: 'components/Button',
  tags: ['autodocs'],
  component: Button,
  argTypes: {
    disabled: {
      control: 'boolean',
    },
    variant: {
      control: 'select',
      options: Object.values(Variant),
    }
  },
  parameters: {
    layout: 'centered',
  },
};

but when i start Storybook i dont see the toggle

I have to press that button to see the toogle. It's pretty anoying.
The select works perfectly.

What should i do to make it work ?

Reproduction link

https://stackblitz.com/edit/github-hifnwsor?file=src%2Fcomponents%2Fbutton%2FButton.stories.tsx

Reproduction steps

No response

System

Storybook Environment Info:

  System:
    OS: Windows 11 10.0.26100
    CPU: (16) x64 11th Gen Intel(R) Core(TM) i7-11800H @ 2.30GHz
  Binaries:
    Node: 22.12.0 - C:\Program Files\nodejs\node.EXE
    npm: 11.0.0 - C:\Program Files\nodejs\npm.CMD <----- active
  Browsers:
    Edge: Chromium (131.0.2903.112)
  npmPackages:
    @storybook/addon-essentials: ^8.6.3 => 8.6.3
    @storybook/addon-interactions: ^8.6.3 => 8.6.3
    @storybook/addon-onboarding: ^8.6.3 => 8.6.3
    @storybook/blocks: ^8.6.3 => 8.6.3
    @storybook/react: ^8.6.3 => 8.6.3
    @storybook/react-vite: ^8.6.3 => 8.6.3
    @storybook/test: ^8.6.3 => 8.6.3
    eslint-plugin-storybook: ^0.11.3 => 0.11.3
    storybook: ^8.6.3 => 8.6.3

Additional context

No response

[greptile-apps]

** Disclaimer** This information might be inaccurate, due to it being generated automatically
This appears to be a UI issue with the Controls panel. The boolean control should be visible by default. Based on your configuration, try adding a default value in your argTypes: typescript const meta: Meta<typeof Button> = { // ... argTypes: { disabled: { control: 'boolean', defaultValue: false // Add this line }, // ... } }; If that doesn't resolve it, check if you have defined the prop in your component's PropTypes/TypeScript interface. The control should match the component's prop type definition.

About Greptile

This response provides a starting point for your research, not a precise solution.

Help us improve! Please leave a 👍 if this is helpful and 👎 if it is irrelevant.

Edit Issue Bot Settings · Greptile