# def-clr-angular

> Angular components for Clarity

Latest version **0.2.0** (published 2021-09-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install def-clr-angular
pnpm add def-clr-angular
yarn add def-clr-angular
bun add def-clr-angular
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; large bundle; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.0 |
| Published | 2021-09-03 |
| First published | 2021-08-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 10.5 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 6390 |
| Author | Clarity Design System |
| Maintainers | patchamuthu |
| Keywords | ng-add, clarity, angular, components |

## Links

- npm: https://www.npmjs.com/package/def-clr-angular
- Repository: git@github.com:vmware/clarity
- Homepage: https://clarity.design/
- Issues: https://github.com/vmware/clarity/issues
- npm.io page: https://npm.io/package/def-clr-angular

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^2.0.0

## Recent versions

- 0.2.0 (latest) — 2021-09-03
- 0.1.0 — 2021-09-03
- 4.0.16 — 2021-08-16

## README

## Installing Clarity Angular

The easiest way is to use the Angular CLI to automatically install Angular into your project

```
ng add @def/clr-angular
```

Then it should be setup automatically

## Manual Installation

If you are unable to use the automatic method above, follow these steps.

1.  Install DEF-Clarity packages through npm:

    ```
    npm install @def/clr-icons @def/clr-ui @def/clr-angular
    ```

2.  Import the ClarityModule into your Angular application's module. Your application's main module might look like this:

    ```
    import { NgModule } from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    import { ClarityModule } from '@def/clr-angular';
    import { AppComponent } from './app.component';

    @NgModule({
        imports: [
            BrowserModule,
            ClarityModule,
            ....
         ],
         declarations: [ AppComponent ],
         bootstrap: [ AppComponent ]
    })
    export class AppModule {    }
    ```

---
_Source: https://npm.io/package/def-clr-angular · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._