Skip to content

Commit

Permalink
feat(customIcon): update readme based on feedback
Browse files Browse the repository at this point in the history
  • Loading branch information
ByronDWall committed May 10, 2024
1 parent f5eeb87 commit 40a4b86
Showing 1 changed file with 3 additions and 5 deletions.
8 changes: 3 additions & 5 deletions packages/components/icons/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,9 @@ This component can be used wherever it is necessary to display a themed icon.

## Custom Icon

The custom icon is a an eye-catching visual element that should be used when an additional visual prominence is needed for displaying a custom SVG icon in the UI.
This component is meant to be used whenever consumers need to render an icon which is not part of the [ui-kit icon set](https://uikit.commercetools.com/?path=/story/components-icons--all-icons).

In order to keep visual consistency, we want to keep the available sizes of all icons equal. Bear in mind we would expect custom SVG icons to not contain size attributes so it can be controlled based on the components size attribute.

The component is exported as a separate entry point:

Expand All @@ -132,7 +134,3 @@ const app = () => <Icon icon={<YourCustomIcon />} />;
| `size` | `string` | | '10', '20', '30', '40' | '20' | Specifies the icon size |
| `icon` | `union`<br/>Possible values:<br/>`, ReactElement, string` | - | A `ReactNode` or `string` that display a custom SVG | | Icon displayed as a child of this component |
| `hasBorder` | `boolean` | | `true`, `false` | `false` | Specifies whether the element displays a border |

### Where to use

This component can be used wherever it is necessary to display an icon that is not a UI Kit `<Icon/>` component.

0 comments on commit 40a4b86

Please sign in to comment.