Fix: restore color prop functionality for StyledOcticon

[rezrah]

Restores color prop functionality to StyledOcticon, which now works with both native and functional colours.

Other changes:

• Docs updated to reflect correct usage
  • Updated prop tables to new format
  • Added component status

Before

After

Merge checklist

• Added/updated tests
• Added/updated documentation
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge

[changeset-bot]

🦋 Changeset detected

Latest commit: d40abc7

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

This PR includes changesets to release 1 package

Name	Type
@primer/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

[github-actions]

size-limit report 📦

Path	Size
dist/browser.esm.js	59.94 KB (+0.04% 🔺)
dist/browser.umd.js	60.3 KB (+0.04% 🔺)

[siddharthkp]

Nice! Ship it

[siddharthkp]

Sidenote: How does https://github.com/primer/eslint-plugin-primer-react know that it has to ignore color, which resembles a styled-system prop, on this specific component?

[rezrah]

Sidenote: How does https://github.com/primer/eslint-plugin-primer-react know that it has to ignore color, which resembles a styled-system prop, on this specific component?

Looking at the rule source, there's an exclusion but interestingly color isn't defined there. It also looks like it's looking for a type signature that matches the one exported by styled-system, which this doesn't. It would probably be a bit limiting if we couldn't use props like color anymore tbh.

[siddharthkp]

It also looks like it's looking for a type signature that matches the one exported by styled-system, which this doesn't.

Trying to understand the source, are you referring to this line? rules/no-system-props.js#L66:

letsystemProps=Object.values(pick(propsByNameObject))

definition of pick: @styled-system/props/index.js#L45-L52