π¨ [WB-2325] Phase 1 β Extend processStyleList to accept CSS Module class names#3073
Conversation
π¦ Changeset detectedLatest commit: 17510b3 The changes in this PR will be included in the next version bump. This PR includes changesets to release 33 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Contributor
|
Size Change: +122 B (+0.09%) Total Size: 129 kB π¦ View Changed
βΉοΈ View Unchanged
|
Contributor
npm Snapshot: Publishedπ Good news!! We've packaged up the latest commit from this PR (b7b42e4) and published all packages with changesets to npm. You can install the packages in ./dev/tools/deploy_wonder_blocks.js --tag="PR3073"Packages can also be installed manually by running: pnpm add @khanacademy/wonder-blocks-<package-name>@PR3073 |
Contributor
A new build was pushed to Chromatic! πhttps://5e1bf4b385e3fb0020b7073c-vfbvvnnujr.chromatic.com/ Chromatic results:
|
β¦ass names
Widen StyleType to also accept `string` (and nested arrays of strings) so
consumers can pass CSS Module identifiers alongside Aphrodite stylesheets,
inline objects, and falsy values.
Refactor processStyleList to sort each leaf into one of three buckets:
Aphrodite stylesheets (via the existing `_definition` symbol check) β
emitted through `css(...)`; plain strings β appended to `className`;
plain objects β forwarded as inline `style`. Non-string, non-object
truthy leaves are silently ignored.
Add a fast-path: when no Aphrodite stylesheet is present in the merge,
skip the `StyleSheet.create` rewrap (whose only purpose was to outweigh
Aphrodite's `!important`) and forward inline styles directly via the
`style` prop. This is the intentional behavioral change called out in
the changeset β DOM output for the no-Aphrodite case shifts from a
generated `inlineStyles_xxx` class to a real `style="..."` attribute.
Fix latent spread-of-StyleType bugs in Cell, DatePicker, and Modal that
the widened union now flags at type-check time. Behavior is preserved
or improved β no more accidental `{0: 'f', 1: 'o', ...}` results when a
non-object slipped into a spread.
π€ Built using Claude Code #ai-generated
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary:
Widen StyleType to also accept
string(and nested arrays of strings) soconsumers can pass CSS Module identifiers alongside Aphrodite stylesheets,
inline objects, and falsy values.
Refactor processStyleList to sort each leaf into one of three buckets:
Aphrodite stylesheets (via the existing
_definitionsymbol check) βemitted through
css(...); plain strings β appended toclassName;plain objects β forwarded as inline
style. Non-string, non-objecttruthy leaves are silently ignored.
Add a fast-path: when no Aphrodite stylesheet is present in the merge,
skip the
StyleSheet.createrewrap (whose only purpose was to outweighAphrodite's
!important) and forward inline styles directly via thestyleprop. This is the intentional behavioral change called out inthe changeset β DOM output for the no-Aphrodite case shifts from a
generated
inlineStyles_xxxclass to a realstyle="..."attribute.Fix latent spread-of-StyleType bugs in Cell, DatePicker, and Modal that
the widened union now flags at type-check time. Behavior is preserved
or improved β no more accidental
{0: 'f', 1: 'o', ...}results when anon-object slipped into a spread.
π€ Built using Claude Code #ai-generated
Issue: WB-2325
Test plan: