Skip to content

Conversation

mrginglymus
Copy link
Contributor

@mrginglymus mrginglymus commented Sep 3, 2025

What I did

Export types for adodn-pseudo parameters and add to preview definition for typing in csf4.

Checklist for Contributors

Testing

The changes in this PR are covered in the following automated tests:

  • stories
  • unit tests
  • integration tests
  • end-to-end tests

Manual testing

This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!

Documentation

  • Add or update documentation reflecting your changes
  • If you are deprecating/removing a feature, make sure to update
    MIGRATION.MD

Checklist for Maintainers

  • When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli-storybook/src/sandbox-templates.ts

  • Make sure this PR contains one of the labels below:

    Available labels
    • bug: Internal changes that fixes incorrect behavior.
    • maintenance: User-facing maintenance tasks.
    • dependencies: Upgrading (sometimes downgrading) dependencies.
    • build: Internal-facing build tooling & test updates. Will not show up in release changelog.
    • cleanup: Minor cleanup style change. Will not show up in release changelog.
    • documentation: Documentation only changes. Will not show up in release changelog.
    • feature request: Introducing a new feature.
    • BREAKING CHANGE: Changes that break compatibility in some way with current major version.
    • other: Changes that don't fit in the above categories.

🦋 Canary release

This PR does not have a canary release associated. You can request a canary release of this pull request by mentioning the @storybookjs/core team here.

core team members can create a canary release here or locally with gh workflow run --repo storybookjs/storybook canary-release-pr.yml --field pr=<PR_NUMBER>

Greptile Summary

Updated On: 2025-09-03 10:31:08 UTC

This PR enhances TypeScript support for the addon-pseudo-states by adding comprehensive parameter typings for CSF4 (Component Story Format 4) integration. The changes reorganize type definitions by moving the PseudoState type from constants.ts to a new dedicated types.ts file, which now contains a complete type system including PseudoStateConfig, PseudoParameter, PseudoParameters, and PseudoTypes interfaces.

The new type system enables proper IntelliSense and type checking when configuring pseudo-state parameters in stories. The PseudoTypes interface is specifically designed to integrate with Storybook's addon system through definePreviewAddon<PseudoTypes>(), providing type safety for the pseudo parameter that controls pseudo-state behavior like hover, focus, and other CSS pseudo-states.

The refactoring consolidates all type definitions in types.ts, updates imports in withPseudoState.ts to use the centralized types, and modifies index.ts to export the new types while applying generic typing to the preview addon definition. This follows Storybook's modern addon patterns and improves the developer experience without changing any runtime behavior.

PR Description Notes:

  • Typo in PR description: "adodn-pseudo" should be "addon-pseudo"

Confidence score: 5/5

  • This PR is safe to merge with minimal risk as it only adds TypeScript type definitions without changing runtime behavior
  • Score reflects the non-breaking nature of type-only changes that improve developer experience and follow established Storybook patterns
  • No files require special attention as all changes are straightforward type definitions and imports

Copy link
Contributor

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

4 files reviewed, no comments

Edit Code Review Bot Settings | Greptile

Copy link

nx-cloud bot commented Sep 3, 2025

View your CI Pipeline Execution ↗ for commit 3b70a9b

Command Status Duration Result
nx run-many -t build --parallel=3 ✅ Succeeded 44s View ↗

☁️ Nx Cloud last updated this comment at 2025-09-08 14:31:30 UTC

@Sidnioulz Sidnioulz self-assigned this Sep 8, 2025
@storybook-pr-benchmarking
Copy link

storybook-pr-benchmarking bot commented Sep 8, 2025

Package Benchmarks

Commit: 3b70a9b, ran on 8 September 2025 at 14:17:06 UTC

The following packages have significant changes to their size or dependencies:

@storybook/builder-webpack5

Before After Difference
Dependency count 186 186 0
Self size 68 KB 68 KB 0 B
Dependency size 31.39 MB 31.47 MB 🚨 +80 KB 🚨
Bundle Size Analyzer Link Link

storybook

Before After Difference
Dependency count 48 48 0
Self size 30.74 MB 30.62 MB 🎉 -117 KB 🎉
Dependency size 17.61 MB 17.61 MB 🚨 +3 KB 🚨
Bundle Size Analyzer Link Link

@storybook/angular

Before After Difference
Dependency count 186 186 0
Self size 134 KB 134 KB 0 B
Dependency size 29.62 MB 29.69 MB 🚨 +77 KB 🚨
Bundle Size Analyzer Link Link

@storybook/ember

Before After Difference
Dependency count 191 191 0
Self size 17 KB 17 KB 0 B
Dependency size 28.11 MB 28.19 MB 🚨 +80 KB 🚨
Bundle Size Analyzer Link Link

@storybook/nextjs

Before After Difference
Dependency count 529 529 0
Self size 928 KB 928 KB 0 B
Dependency size 58.29 MB 58.44 MB 🚨 +157 KB 🚨
Bundle Size Analyzer Link Link

@storybook/nextjs-vite

Before After Difference
Dependency count 130 130 0
Self size 4.00 MB 4.00 MB 🎉 -9 B 🎉
Dependency size 21.39 MB 21.70 MB 🚨 +310 KB 🚨
Bundle Size Analyzer Link Link

@storybook/react-native-web-vite

Before After Difference
Dependency count 163 163 0
Self size 31 KB 31 KB 🎉 -24 B 🎉
Dependency size 22.78 MB 23.09 MB 🚨 +310 KB 🚨
Bundle Size Analyzer Link Link

@storybook/react-vite

Before After Difference
Dependency count 120 120 0
Self size 36 KB 36 KB 0 B
Dependency size 19.33 MB 19.64 MB 🚨 +310 KB 🚨
Bundle Size Analyzer Link Link

@storybook/react-webpack5

Before After Difference
Dependency count 272 272 0
Self size 25 KB 25 KB 🎉 -18 B 🎉
Dependency size 43.03 MB 43.18 MB 🚨 +157 KB 🚨
Bundle Size Analyzer Link Link

@storybook/server-webpack5

Before After Difference
Dependency count 198 198 0
Self size 17 KB 17 KB 0 B
Dependency size 32.64 MB 32.72 MB 🚨 +80 KB 🚨
Bundle Size Analyzer Link Link

@storybook/cli

Before After Difference
Dependency count 204 219 🚨 +15 🚨
Self size 879 KB 879 KB 🎉 -90 B 🎉
Dependency size 81.71 MB 81.90 MB 🚨 +181 KB 🚨
Bundle Size Analyzer Link Link

@storybook/codemod

Before After Difference
Dependency count 173 188 🚨 +15 🚨
Self size 35 KB 35 KB 🎉 -54 B 🎉
Dependency size 76.79 MB 76.97 MB 🚨 +181 KB 🚨
Bundle Size Analyzer Link Link

create-storybook

Before After Difference
Dependency count 49 49 0
Self size 1.52 MB 1.52 MB 0 B
Dependency size 48.35 MB 48.24 MB 🎉 -114 KB 🎉
Bundle Size Analyzer node node

eslint-plugin-storybook

Before After Difference
Dependency count 35 35 0
Self size 139 KB 139 KB 🚨 +6 B 🚨
Dependency size 3.41 MB 3.48 MB 🚨 +77 KB 🚨
Bundle Size Analyzer Link Link

@storybook/preset-create-react-app

Before After Difference
Dependency count 68 68 0
Self size 26 KB 26 KB 0 B
Dependency size 5.97 MB 6.05 MB 🚨 +77 KB 🚨
Bundle Size Analyzer Link Link

@storybook/preset-react-webpack

Before After Difference
Dependency count 170 170 0
Self size 26 KB 26 KB 0 B
Dependency size 30.55 MB 30.63 MB 🚨 +80 KB 🚨
Bundle Size Analyzer Link Link

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants