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.

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

feat!: New Component: IconList #1691

Merged
merged 27 commits into from
Apr 20, 2022
Merged

Conversation

brandonlenz
Copy link
Contributor

@brandonlenz brandonlenz commented Oct 13, 2021

Summary

Add new component: IconList

Related Issues or PRs

closes #1234
fixes a typo in one exported Icon in de855d8 Since the Icon API was changed to ensure no conflict between IconList and the Icon, List, (previous IconList, now Icon.List), this is a BREAKING CHANGE.

  • When merging and squashing, add the following text:

    BREAKING CHANGE: Icons no longer follow the pattern Icon{ICON_NAME}. They have are now prefixed components using "dot" notation as in Icon.{ICON_NAME}. The import therefore also changes, as you now only need to import { Icon } ....

  • Note that the side effects of this change are less efficient tree shaking. A consumer using any icon will effectively be importing ALL of the icons.

How To Test

  • Start up storybook (or use the ephemerally deployed storybook instance) and view/inspect the IconList examples.
  • Verify Unit test coverage is acceptable and passing

Screenshots (optional)

image

image

image

image

image

- Unify spacing in files with large lists of icons
- Add convenience hoc for internal use in deprecating components. Particularly useful for Icons which are generated.
- Deprecate IconVisiblity, to remove on next major release.
@brandonlenz brandonlenz changed the title feat: New Component: IconList feat!: New Component: IconList Oct 25, 2021
haworku
haworku previously approved these changes Nov 12, 2021
Copy link
Contributor

@haworku haworku left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approving this. We discussed IRL paying attention to how the change to exporting {Icon} influences our bundle size. This is our best attempt to handle icons for now.

@brandonlenz
Copy link
Contributor Author

Looks like there's some broken behavior of the input prefix/suffix with icons and this story:
image

I need to check that and fix before merging.

@brandonlenz
Copy link
Contributor Author

Looks like there's some broken behavior of the input prefix/suffix with icons and this story:
I need to check that and fix before merging.

Fixed in 9bc9119

@brandonlenz brandonlenz added the type: breaking This introduces breaking changes and will require a major version increase label Mar 28, 2022
@brandonlenz brandonlenz merged commit 86589ac into main Apr 20, 2022
@brandonlenz brandonlenz deleted the bl-new-component-icon-list-1234 branch April 20, 2022 21:17
brandonlenz added a commit that referenced this pull request Apr 25, 2022
## [3.0.0](2.9.0...3.0.0) (2022-04-25)


### ⚠ BREAKING CHANGES

* Previous deprecated features and props have been removed. Please see the following guidance for affected components:
  * Accordion: Default heading level has been removed. Consumers must now specify via the `headingLevel` prop.
  * Alert: Default heading level has been removed. Consumers must now specify via the `headingLevel` prop.
  * Button: 
    * `accent` has been removed. Use `accentStyle` instead.
    * `big`, `small`, and `size="small"` have been removed. Use `size="big"` or do not define the `size` prop for default sizing.
  * CollectionHeading: Default heading level has been removed. Consumers must now specify via the `headingLevel` prop.
  * Footer/Address: `big`, `medium`, and `slim` props have been removed. Use the `size` prop instead.
  * Footer/Footer: `big`, `medium`, and `slim` props have been removed. Use the `size` prop instead.
  * Footer/FooterNav: `big`, `medium`, and `small` props have been removed. Use the `size` prop instead.
  * Footer/Logo: `big`, `medium`, and `small` props have been removed. Use the `size` prop instead.
  * Search: `big`, and `small` props have been removed. Use the `size` prop instead.
  * Fieldset: `legendSrOnly` has been removed. Use `legendStyle="srOnly"` instead.
  * TextInput: `error`, and `success` props have been removed. Use the `validationStatus` prop instead.
  * header/NavList: `primary`, `secondary`, `subnav`, `megamenu`, and `footerSecondary` props have been removed. Use the `type` prop instead.
  * StepIndicator: Default heading level has been removed. Consumers must now specify via the `headingLevel` prop.
* SummaryBox now exposes sub-components (SummaryBoxHeading and SummaryBoxContent) for a more compositional API. Consumers will need to update their implementation to match.
* In order to accommodate IconList as a named component, Icons themselves needed to be refactored. All use of ReactUSWDS icons now follows the following syntax: <Icon.{IconName} /> instead of <Icon{IconName />. Furthermore, icons are no longer imported individually. Instead, Icon (the class) is imported to then use any <Icon.{IconName}> consumers require.

### Features

* add isInitiallyOpen option to modal ([#1971](#1971)) ([560564e](560564e))
* Make Summary Box more flexible ([#1929](#1929)) ([a46ed35](a46ed35))
* New Component: IconList ([#1691](#1691)) ([86589ac](86589ac))
* **ci:** add automerge priority label for Kodiak ([#1985](#1985)) ([9dc940e](9dc940e))


* Remove 1.x.x and 2.x.x deprecated properties ([#1988](#1988)) ([5dfadb1](5dfadb1))


### Documentation & Examples

* 404 page template added ([#2017](#2017)) ([0c9474d](0c9474d))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: breaking This introduces breaking changes and will require a major version increase
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[feat] New Component: Icon list
3 participants