add-storybook-heroui

To configure Storybook for HeroUI, you need to integrate the Tailwind plugin, enable dark mode using a class strategy, and apply a global preview decorator to wrap your stories for consistent rendering.

Adding a global decorator to Storybook involves configuring the preview environment to automatically wrap HeroUI stories, ensuring that Tailwind styles and dark mode theming are consistently applied across all components.

Yes, Storybook with Vite supports HeroUI and Tailwind integration by configuring the internal Storybook architecture to include the HeroUI plugin in the Tailwind content layer and enabling MDX support.

Enabling class-based dark mode in Storybook requires enforcing a Tailwind setup that toggles dark mode via a class strategy, paired with a global decorator that switches the theme class for your HeroUI stories.

HeroUI styles may not render in Storybook if the Tailwind content configuration does not include the HeroUI plugin, or if a global preview decorator is missing to properly inject the necessary Tailwind and dark mode environment.

Configuring Storybook with MDX support and relevant addons is part of the setup process for HeroUI projects, allowing you to document component behaviors and Tailwind styling interactions effectively.