Skip to content

feat(angular): add enhanced icon support with addIcons - #28009

Merged
liamdebeasi merged 12 commits into
FW-4612from
FW-4767
Aug 22, 2023
Merged

feat(angular): add enhanced icon support with addIcons#28009
liamdebeasi merged 12 commits into
FW-4612from
FW-4767

Conversation

@liamdebeasi

@liamdebeasi liamdebeasi commented Aug 16, 2023

Copy link
Copy Markdown
Contributor

Issue number: N/A


What is the current behavior?

Developers have no easy way of passing icon data to the ion-icon component. The icon component also has no support for switching icons based on mode.

What is the new behavior?

  • Update test apps to use dev build of ionicons with new addIcons feature
  • Added tests

Does this introduce a breaking change?

  • Yes
  • No

Other information

@bolt-new-by-stackblitz

Copy link
Copy Markdown

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@github-actions github-actions Bot added the package: angular @ionic/angular package label Aug 16, 2023
@liamdebeasi liamdebeasi changed the title Fw 4767 feat(angular): add provideIcons provider and enhanced icon support Aug 16, 2023
@sean-perkins
sean-perkins force-pushed the sp/angular-standalone-proxies branch from bed7575 to 8e354d1 Compare August 17, 2023 16:59
Base automatically changed from sp/angular-standalone-proxies to FW-4612 August 18, 2023 15:02
@github-actions github-actions Bot added the package: core @ionic/core package label Aug 21, 2023
@github-actions github-actions Bot removed the package: core @ionic/core package label Aug 21, 2023
@liamdebeasi liamdebeasi changed the title feat(angular): add provideIcons provider and enhanced icon support feat(angular): add enhanced icon support with addIcons Aug 21, 2023
@liamdebeasi
liamdebeasi marked this pull request as ready for review August 21, 2023 15:41
import { logoIonic, logoIonitron, logoApple, logoAndroid } from 'ionicons/icons';
import { addIcons } from 'ionicons';

addIcons({ logoIonic, logoIonitron, logoApple, logoAndroid });

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Played with this locally, everything looks/works good 👍

It seems to work consistently if you have this outside the class or within the constructor. Does not work (too late in the execution cycle, after connectedCallback fires) if you try to add icons in the ngOnInit lifecycle.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Good catch! We'll want to note this in the docs

@liamdebeasi

Copy link
Copy Markdown
Contributor Author

Going to merge, but I'll make sure to review the test app once the new version of Ionicons ships.

@liamdebeasi
liamdebeasi merged commit e5b7f5f into FW-4612 Aug 22, 2023
@liamdebeasi
liamdebeasi deleted the FW-4767 branch August 22, 2023 13:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: angular @ionic/angular package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants