Fix the `cx()` function's class collection at runtime as it generated class instances rather than strings.

kylorhall-atlassian commented 3 months ago

Alternative to https://github.com/atlassian-labs/compiled/pull/1696

Migrate from ac() which generates AtomicGroups classes to ax() which strictly generates strings (I think that's what this all does).

This is because passing <Component xcss={cx(style, style)}> around resulted in errors, 'cls.split is not a function' trying to iterate over non-strings.

Previously this generated classes collected into ac like:

[
  '_1bah1yb4',
  undefined,
  ['_16jlkb7n', undefined], // from `xcss={[…]}`, not accounted for in this PR, however, not real
  AtomicGroups { // from `xcss={cx(…)}`
    values: Map(2) { '_1bsb' => '_1bsb1osq', '_16jl' => '_16jlkb7n' }
  }
]

PR checklist

I have...

[x] Updated or added applicable tests
[x] Chosen not to document this in website/

changeset-bot[bot] commented 3 months ago

🦋 Changeset detected

Latest commit: f0f18993965e669a26dc44eca33b434cb6585e11

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

| Name | Type | | --------------- | ----- | | @compiled/react | Patch |

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](https://github.com/atlassian-labs/compiled/new/fix-cx-class-collection?filename=.changeset/blue-coins-sort.md&value=---%0A%22%40compiled%2Freact%22%3A%20patch%0A---%0A%0AFix%20the%20%60cx()%60%20function's%20class%20collection%20at%20runtime%20as%20it%20generated%20class%20instances%20rather%20than%20strings.%0A)

netlify[bot] commented 3 months ago

Deploy Preview for compiled-css-in-js canceled.

Name	Link
Latest commit	f0f18993965e669a26dc44eca33b434cb6585e11
Latest deploy log	https://app.netlify.com/sites/compiled-css-in-js/deploys/6699bf8ffe440600087425c4

atlassian-labs / compiled