Skip to content

[core] Move MultistepDialog inline styles to CSS#8099

Open
dokson wants to merge 1 commit into
palantir:developfrom
dokson:ac/multistep-dialog-no-inline-styles
Open

[core] Move MultistepDialog inline styles to CSS#8099
dokson wants to merge 1 commit into
palantir:developfrom
dokson:ac/multistep-dialog-no-inline-styles

Conversation

@dokson
Copy link
Copy Markdown

@dokson dokson commented May 4, 2026

Summary

Fixes #7710.

MultistepDialog applied min-width: 800px and padding-bottom: 0 via the underlying Dialog's inline style attribute, forcing consumers to use !important to override (as shown in the issue's screenshot).

This moves both defaults into _multistep-dialog.scss under a single .bp6-multistep-dialog class so they can be overridden with normal CSS specificity:

// before (consumer)
.my-dialog {
  /* stylelint-disable-next-line declaration-no-important */
  min-width: 400px !important;
  width: 400px;
}

// after
.my-dialog {
  min-width: 400px;
  width: 400px;
}

The Classes.MULTISTEP_DIALOG (bp6-multistep-dialog) class constant already existed but was never applied to the rendered element; it is now added to the Dialog className.

The user-provided style prop continues to pass through via {...otherProps}, so <MultistepDialog style={{ minWidth: 600 }} /> still works (inline beats class).

Test plan

  • pnpm --filter @blueprintjs/core run compile
  • pnpm --filter @blueprintjs/core run test:typeCheck
  • pnpm --filter @blueprintjs/core run test:vitest:run — 1250 passed
  • npx prettier --check on changed files
  • Manual smoke check in docs app (deferred to reviewer)

MultistepDialog applied min-width: 800px and padding-bottom: 0 via inline
style on the underlying Dialog, forcing consumers to use !important to
override. Move both defaults into _multistep-dialog.scss under a single
.bp6-multistep-dialog class so they can be overridden with normal CSS
specificity. The MULTISTEP_DIALOG class constant already existed but was
never applied; it is now added to the rendered Dialog className.

The user-provided style prop continues to pass through via {...otherProps}.

Fixes palantir#7710.
@changelog-app
Copy link
Copy Markdown

changelog-app Bot commented May 4, 2026

Generate changelog in packages/core/changelog/@unreleased

Type (Select exactly one)

  • Feature (Adding new functionality)
  • Improvement (Improving existing functionality)
  • Fix (Fixing an issue with existing functionality)
  • Break (Creating a new major version by breaking public APIs)
  • Deprecation (Removing functionality in a non-breaking way)
  • Migration (Automatically moving data/functionality to a new system)

Description

[core] Move MultistepDialog inline styles to CSS

Check the box to generate changelog(s)

  • Generate changelog entry

@dokson
Copy link
Copy Markdown
Author

dokson commented May 4, 2026

@ryannono — this addresses the inline style override issue you reported in #7710. The !important in your screenshot should no longer be needed once this lands.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Remove inline styles on multistep dialog

1 participant