Fix some false positives with ternary operators and cssMap

[dddlr]

What is this change?

Fix two edge cases:

• When using the same properties across two css function calls through ternary operators, we should not get an ESLint violation.

import { css } from '@compiled/react';

const oldStyles = css({
  font: '...',
  fontWeight: '...',
});
const newStyles = css({
  font: '...',
  fontWeight: '...',
});
const someCondition = true;
export const EmphasisText = ({ children }) => <span css={[someCondition ? oldStyles : newStyles]}>{children}</span>;

• When using the same properties across two keys in a cssMap function call, we should not get an ESLint violation.

import { cssMap } from '@compiled/react';

const styles = cssMap({
  warning: {
    borderColor: '...',
    borderTop: '...',
  },
  debug: {
    borderColor: '...',
    borderTop: '...',
  },
  normal: {
    borderColor: '...',
    borderTop: '...',
  },
});
export const EmphasisText = ({ children, appearance }) => <span css={styles[appearance]}>{children}</span>;

Note that there still remain a lot of other (pre-existing) edge cases -- this rule is really hard to make fully rigorous, sorry 🙇 For example, this will still cause a false positive:

import { css } from '@compiled/react';

const oldStyles = css({
  fontWeight: '...',
});
const newStyles = css({
  font: '...',
});

const someCondition = true;
export const EmphasisText = ({ children }) => <span css={[someCondition ? oldStyles : newStyles]}>{children}</span>;

Why are we making this change?

We've received an internal query about a false positive with css, and it looks like it's pretty easy to fix.

---

PR checklist

Don't delete me!

I have...

• Updated or added applicable tests
• Updated the documentation in website/
• Added a changeset (if making any changes that affect Compiled's behaviour)

[changeset-bot]

🦋 Changeset detected

Latest commit: a0f1be1

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

This PR includes changesets to release 1 package

Name	Type
@compiled/eslint-plugin	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

[netlify]

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

Name	Link
🔨 Latest commit	a0f1be1
🔍 Latest deploy log	https://app.netlify.com/sites/compiled-css-in-js/deploys/677de066d884290008c048db

[dddlr]

the false positive, if depth in correct order for shorthand properties in the same bucket for cssMap AND if key not static test case has been moved to the valid section, as I've fixed the false positive

It's now called depth in correct order for shorthand properties in the same bucket for cssMap AND if key not static on line 423

[dddlr]

slight optimisation

[dddlr]

this false negative already existed in the rule, it's just that we didn't have a test case for it

[kylorhall-atlassian]

I won't try to mentally run through the union stuff, but tests and the code that's obvious makes sense to me!