# Mixpanel Common
[![Build Status](https://travis-ci.com/mixpanel/mixpanel-common.svg?token=QmvGfi8iLsZwayhttUqG&branch=master)](https://travis-ci.com/mixpanel/mixpanel-common)
[![NPM version](https://img.shields.io/npm/v/mixpanel-common.svg)](https://www.npmjs.com/package/mixpanel-common)


- components: low-level pre-styled web components
- report: mixpanel-specific app utilities
- stylesheets: default CSS and importable Stylus mixins
- util: data manipulation utilities
- widgets: composed pre-styled web components

### Mixpanel Design System

[https://design.mixpanel.com](https://design.mixpanel.com)

### Local development of components

- Install dependencies: `npm install`
- Start a server and build continuously: `npm start`
- Open [http://localhost:8081](http://localhost:8081)

#### TypeScript components
- Components written in TypeScript are compiled differently than normal JS because they use the TypeScript compiler and not Babel. Because they are compiled differently, they will not obey any babel-specified transformations. The right place to configure their transpilation is in `tsconfig.json`.

### Testing with Saucelabs
```sh
SAUCE_USERNAME=<your username> SAUCE_ACCESS_KEY=<your access key> npm run test-wct-sauce
```

### Unit Tests
Plain old mocha tests
```
npm run test-unit
```

With nyc coverage and html report.
Report can be seen in browser at .nyc_report/index.html
```
npm run test-unit-nyc && npm run coverage-report
```