clarity-angular is AoT ready Clarity-Angular now supports Ahead-of-Time (AoT) compilation. Starting with 0.8.0, the clarity-angular npm package contains the files in es5 es2015 format that can be compiled with ngc compiler. In addition, the package contains clarity-angular.umd.js file. If your application is setup using systemJS, please update your systemJS configuration to point to the clarity-angular.umd.js file as shown in the README.

ClarityIcons API released As part of 0.8.0, we have created a publically accessible API for customizing the Clarity Icons library in your application. At a high level, `ClarityIcons` is now a namespace off of the browser `window` object. More documentation is coming soon! So make sure to keep an eye on our documentation.

Adding your own icons to ClarityIcons Using the newly released ClarityIcons API, you can now add your own icons to the publically available ClarityIcons architecture. Use the following call to add your icon to our library in your application: ClarityIcons.add({"shapeNameGoesHere": "<svg ... >[your SVG code goes here]</svg>"}); This API method will assign your SVG markup to the named shape you sent it. It can then be retrieved like in your application like any other icon in the ClarityIcons library. <clr-icon shape="shapeNameGoesHere"></clr-icon>

Creating custom aliases for ClarityIcons You can now create aliases for the icons in your application with a single API call: ClarityIcons.alias({"bell": ["alarm", "oh-noehz"]}); The above alias method call will assign "alarm" and "oh-noehz" names to the existing "bell" icon shape. Now you can use the "bell" icon with any of the new names you have assigned it. <clr-icon shape="bell"></clr-icon> <clr-icon shape="alarm"></clr-icon> <clr-icon shape="oh-noehz"></clr-icon>

Added new icons in Clarity Icons Clarity Icons now includes new icon shapes such as half-star , circle-check , and storage .

Implemented variant icons for existing icon set The architecture introduced in 0.7.5 to allow for solid, badged, and alerted icon variants has been extended to all applicable icons in Clarity. Use the following classnames with your clr-icon elements. <clr-icon shape="..."></clr-icon> <clr-icon shape="..." class="has-badge"></clr-icon> <clr-icon shape="..." class="has-badge--success"></clr-icon> <clr-icon shape="..." class="has-badge--error"></clr-icon> <clr-icon shape="..." class="has-badge--info"></clr-icon> <clr-icon shape="..." class="has-alert"></clr-icon> <clr-icon shape="..." class="is-solid"></clr-icon> <clr-icon shape="..." class="is-solid has-badge--success"></clr-icon> <clr-icon shape="..." class="is-solid has-badge--error"></clr-icon> <clr-icon shape="..." class="is-solid has-badge--info"></clr-icon> <clr-icon shape="..." class="is-solid has-alert"></clr-icon> Check out our icon documentation for more.