Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[icons][docs] Update README and docs page #41938

Merged
merged 7 commits into from
Jun 3, 2024
Merged

[icons][docs] Update README and docs page #41938

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
c036fd2
update README
danilo-leal Apr 17, 2024
66f445e
add note to the docs page as well
danilo-leal Apr 17, 2024
e9b9e80
quick iteration
danilo-leal Apr 17, 2024
ec523cc
change wording
danilo-leal Apr 17, 2024
30f9afe
wording change
danilo-leal Apr 17, 2024
9fb7844
Sam's review
danilo-leal May 29, 2024
edad8c9
Merge branch 'next' into update-icons-package-docs
danilo-leal May 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions docs/data/material/components/material-icons/material-icons.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,10 @@ pnpm add @mui/icons-material@next @mui/material@next @emotion/styled @emotion/re

See the [Installation](/material-ui/getting-started/installation/) page for additional docs about how to make sure everything is set up correctly.

:::info
Google has introduced an alternative set of icons called [Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols), which differs from Material Icons. `@mui/icons-material` only covers the latter, with no plans yet for supporting the former.
:::

<hr/>

## Search Material Icons
Expand Down
36 changes: 15 additions & 21 deletions packages/mui-icons-material/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,44 +1,38 @@
# @mui/icons-material

This package provides the Google [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons) converted to [`SvgIcon`](https://mui.com/material-ui/api/svg-icon/) components.
This package contains Google's [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons) converted to the Material UI [`SvgIcon`](https://mui.com/material-ui/icons/#svgicon) component.
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved

> **Note:** Google has introduced an alternative set of icons called [Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols), which differs from Material Icons. `@mui/icons-material` only covers the latter, with no plans yet for supporting the former.
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved

## Installation

Install the package in your project directory with:
The icons package depends on Material UI, so ensure you install both to use it.
Use the following command to install it:
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved

<!-- #default-branch-switch -->

```bash
npm install @mui/icons-material@next
npm install @mui/icons-material@next @mui/material@next @emotion/styled @emotion/react
```

<!-- #default-branch-switch -->

These components use the Material UI's [SvgIcon](https://next.mui.com/material-ui/api/svg-icon) component to render the SVG path for each icon.

If you are not already using Material UI in your project, you can add it with:

<!-- #default-branch-switch -->

```bash
npm install @mui/material@next
```

## Documentation

<!-- #default-branch-switch -->

- [The SvgIcon documentation](https://mui.com/material-ui/icons/#svgicon)
- [The Material Design icons search](https://mui.com/material-ui/material-icons/)
- Learn more about Material UI's [`SvgIcon` component](https://mui.com/material-ui/icons/#svgicon).
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved
- Quickly search through the available icons on the [Material Icons page](https://mui.com/material-ui/material-icons/).
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved

## Contributing

This icon set is meant to be in sync with Google's Material Icons.
Therefore, we don't accept fixes, additions, or any other contributions that would make this package diverge from the source.
The icons package is updated via a script that reads through the Material Icons set and extracts the SVG elements from there, as opposed to adding each icon individually. That said, we don't accept new icons that diverge from this source.

Check warning on line 29 in packages/mui-icons-material/README.md

View workflow job for this annotation

GitHub Actions / runner / vale 

[vale] reported by reviewdog 🐶
[Google.We] Try to avoid using first-person plural like 'we'.

Raw Output:
{"message": "[Google.We] Try to avoid using first-person plural like 'we'.", "location": {"path": "packages/mui-icons-material/README.md", "range": {"start": {"line": 29, "column": 183}}}, "severity": "WARNING"}
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved

To synchronize with Material Icons, do the following:
To update the `@mui/icons-material` package with the Material Icons set, run the following commands:
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved

1. Inside this workspace run `pnpm src:download`
2. Inside this workspace run `pnpm src:icons`
3. Inside the root run `pnpm docs:mdicons:synonyms`
1. In the "mui-icons-material" directory, run `pnpm src:download`
2. In the "mui-icons-material" directory, run `pnpm src:icons`
3. In the root of the Material UI repo, run `pnpm docs:mdicons:synonyms`
4. If the number of icons changes significantly, edit the icons/icons.md and material-icons/material-icons.md under docs/data/material/components and update the numbers.
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved

We run them roughly quarterly to make sure the package is up-to-date with the source.

Check warning on line 38 in packages/mui-icons-material/README.md

View workflow job for this annotation

GitHub Actions / runner / vale 

[vale] reported by reviewdog 🐶
[Google.We] Try to avoid using first-person plural like 'We'.

Raw Output:
{"message": "[Google.We] Try to avoid using first-person plural like 'We'.", "location": {"path": "packages/mui-icons-material/README.md", "range": {"start": {"line": 38, "column": 1}}}, "severity": "WARNING"}
danilo-leal marked this conversation as resolved.
Show resolved Hide resolved
Loading