[Fab] Rename round -> circular for consistency

[kodai3]

Breaking change

• Rename round to circular for consistency. The possible values should be adjectives, not nouns:

  -<Fab variant="round">
  +<Fab variant="circular">

• I have followed (at least) the PR section of the contributing guide.

[Fab] Rename Fab round -> circle for consistency

I thought we should do the same on Pagination and PaginationItem

Part of #21964

[mui-pr-bot]

Details of bundle changes

Generated by 🚫 dangerJS against f9615a8

[oliviertassinari]

@kodai3 Thanks for working on it, the latest discussion we had on the topic with @mbrookes is #18116 (comment). A benchmark:

• Pagination (& Item): shape: PropTypes.oneOf(['round', 'rounded']),
• Fab: variant: PropTypes.oneOf(['extended', 'round']),
• Avatar: variant: PropTypes.oneOf(['circle', 'rounded', 'square']),
• Badge: overlap: PropTypes.oneOf(['circle', 'rectangle']),
• Skeleton: variant: PropTypes.oneOf(['circle', 'rect', 'text']),

If we look at the semantic of circle vs round:

• Circle is a noun describing a very precisely defined 2-D geometric shape that has a center and a radius and every point on the circle has a defined relationship with the center.
• Round is an adjective. Very loose.

1. shaped like or approximately like a circle or cylinder."she was seated at a small, round table"synonyms:circular, ring-shaped, disk-shaped, hoop-shaped; More
2. shaped like or approximately like a sphere."a round glass ball"

I would vote for circle so we stay close to the geometric semantic field we have with square and rectangle. It's an accurate representation of the geometric shape of the component. It also minimizes BCs.

---

Also, check how we should harmonize rectangle vs rect. I would vote for the former.

[kodai3]

I totally agree with you.
addition to that, having similar spell like 'round' | 'rounded', felt unintuitive at least for me.

[kodai3]

Also, check how we should harmonize rectangle vs rect. I would vote for the former.

i would do for the former too👍

[oliviertassinari]

Cool, let's wait to get more feedback before moving in any direction.

[mbrookes]

circle [is] an accurate representation of the geometric shape

A Fab or Button as a noun would be described by the adjective "round" (or "circular"), "rounded", "rectangular", "square"* etc.

A square button.
A round button / A circular button.
A rounded button.
A rectangular button.

A circle is round (or circular), but a round button isn't a circle. (Perhaps, if it has an outline; but it still sounds odd to say "a circle button".

That said, we've allowed "rect", "rectangle" and "circle", so if the vote is for consistency over correctness, in order to minimise breaking changes, I'm not going to argue.

---

*"Square" is a bit of an anomaly here, as the noun and adjective are the same word.

[oliviertassinari]

I like the idea to use the adjective over the noun, it seems more consistent and accurate.

[oliviertassinari]

So?

- Pagination (& Item): `shape: PropTypes.oneOf(['round', 'rounded']),`
- Fab: `variant: PropTypes.oneOf(['extended', 'round']),`
- Avatar: `variant: PropTypes.oneOf(['circle', 'rounded', 'square']),`
- Badge: `overlap: PropTypes.oneOf(['circle', 'rectangle']),`
- Skeleton: `variant: PropTypes.oneOf(['circle', 'rect', 'text']),`
+ Pagination (& Item): `shape: PropTypes.oneOf(['circular', 'rounded']),`
+ Fab: `variant: PropTypes.oneOf(['extended', 'circular']),`
+ Avatar: `variant: PropTypes.oneOf(['circular', 'rounded', 'square']),`
+ Badge: `overlap: PropTypes.oneOf(['circular', 'rectangular']),`
+ Skeleton: `variant: PropTypes.oneOf(['circular', 'rectangular', 'text']),`

[kodai3]

@oliviertassinari Do you think it is ok to step forward with #21903 (comment) ?

or maybe should we create a dedicated issue to get more feedback?

[oliviertassinari]

I think that we should wait @mbrookes feedback first. It's not a small change.

[mbrookes]

The API LGTM, but I agree it would be good to get broader support for this change before diving into a PR. @kodai3 do you want to create an RFC issue?

[kodai3]

@oliviertassinari @mbrookes created the issue.
Thanks!

[kodai3]

@oliviertassinari @mbrookes changed to circular, should be ready for review