This addon provides access to the heroicons SVG icons within your Ember applications.
ember install ember-heroicons
The basic usage:
The HeroIcon
component supports the following arguments:
@icon
- the name of the icon to render@type
- one ofoutline
,solid
,mini
ormicro
By default, all icons for all types will be available within your application. Additionally, the default icon type
, if not specified, will be outline
.
If you know you will only be using a subset of icons, then you can reduce the size of your app by customizing the configuration.
You can customize defaults and available icons by adding a ember-heroicons
configuration object to your application's ember-cli-build.js
and environment.js
files. As an example:
// ember-cli-build.js
module.exports = function (defaults) {
let app = new EmberApp(defaults, {
// instruct ember-heroicons to include/omit specific icons/sets
"ember-heroicons": {
// default type to use if not specified to the HeroIcon component
defaultType: "outline",
// omit matching icons (array of string or RegExp)
omit: [/chevron/, "camera"],
// include only certain matching icons (array of string or RegExp)
include: [/.*/],
// include only certain types (outline, solid, mini, micro)
types: ["outline"],
},
});
return app.toTree();
};
// environment.js
module.exports = function (environment) {
let ENV = {
// at runtime, if no type is given, you can specify which type to use
"ember-heroicons": {
// default type to use if not specified to the HeroIcon component
// this takes precedence over the value provided in ember-cli-build.js
defaultType: "mini",
},
};
// ...
return ENV;
};
- Ember.js v4.8 or above
- Ember CLI v4.8 or above
- Node.js v18 or above
See the Contributing guide for details.
This project is licensed under the MIT License.