Skip to content

fix(css): stop emitting :host-context selectors in global stylesheets - #31516

Merged
ShaneK merged 1 commit into
mainfrom
fix/lightning-css
Oct 1, 2026
Merged

ShaneK merged 1 commit into
mainfrom
fix/lightning-css

Conversation

@ShaneK

@ShaneK ShaneK commented Oct 1, 2026 •

Copy link
Copy Markdown
Member

Issue number: resolves #30024


What is the current behavior?

Currently, float-elements.css (and ionic.bundle.css / utils.bundle.css, which include it) contains :host-context([dir=rtl]) .ion-float-* selectors from the rtl() mixin. Lightning CSS, the default CSS minifier in Vite 8, warns about every one of them. They can never match anyway, because these stylesheets apply to the document, not a shadow root.

What is the new behavior?

The rtl() mixin now skips its :host-context rule when $rtl-use-host-context is false, and float-elements.scss sets it. The float utilities still flip in RTL through the existing [dir=rtl] and :dir(rtl) rules. Component styles are unchanged, since they still need :host-context. A new spec compiles every global stylesheet and asserts none of them contain :host-context.

Does this introduce a breaking change?

  • Yes
  • No

Other information

The only output change is 10 removed :host-context rules in float-elements.css, which also come out of the two bundles that include it.

Dev build

9.0.7-dev.11790870774.174de601

@ShaneK
ShaneK requested a review from a team as a code owner October 1, 2026 15:59
@ShaneK
ShaneK requested a review from thetaPC October 1, 2026 15:59
@vercel

vercel Bot commented Oct 1, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
ionic-framework Ready Ready Preview Oct 1, 2026 3:59pm UTC

Request Review

@github-actions github-actions Bot added the package: core @ionic/core package label Oct 1, 2026

@thetaPC thetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM

@ShaneK
ShaneK added this pull request to the merge queue Oct 1, 2026
Merged via the queue into main with commit 35bd2fa Oct 1, 2026
70 checks passed
@ShaneK
ShaneK deleted the fix/lightning-css branch October 1, 2026 23:35

This branch was successfully deployed

1 active deployment
Preview — 74de6010 Deployed Oct 1, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: core @ionic/core package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug: warnings when compiling Ionic css with lightningcss - ionic outputs deprecated host-context pseudo-class

2 participants