# chansencode-lib

> Component Library

Latest version **0.1.43** (published 2022-01-10) · MIT license · 0 weekly downloads

## Install

```sh
npm install chansencode-lib
pnpm add chansencode-lib
yarn add chansencode-lib
bun add chansencode-lib
```

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.43 |
| Published | 2022-01-10 |
| First published | 2021-10-31 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 11 |
| Unpacked size | 1.8 MB |
| Known vulnerabilities | 0 (+36 in 2 direct dependencies) |
| Install scripts | no |
| Author | Christoffer Hansen |
| Maintainers | chansendesign |

## Links

- npm: https://www.npmjs.com/package/chansencode-lib
- npm.io page: https://npm.io/package/chansencode-lib

## Dependencies (11)

- [next](https://npm.io/package/next.md) ^11.1.2
- [axios](https://npm.io/package/axios.md) ^0.24.0
- [react](https://npm.io/package/react.md) ^17.0.2
- [animejs](https://npm.io/package/animejs.md) ^3.2.1
- [react-dom](https://npm.io/package/react-dom.md) ^17.0.2
- [react-color](https://npm.io/package/react-color.md) ^2.19.3
- [react-icons](https://npm.io/package/react-icons.md) ^4.3.1
- [chansencode-lib](https://npm.io/package/chansencode-lib.md) ^0.1.18
- [lodash.debounce](https://npm.io/package/lodash.debounce.md) ^4.0.8
- [lodash.throttle](https://npm.io/package/lodash.throttle.md) ^4.1.1
- [use-resize-observer](https://npm.io/package/use-resize-observer.md) ^8.0.0

## Recent versions

- 0.1.43 (latest) — 2022-01-10
- 0.1.42 — 2021-12-30
- 0.1.41 — 2021-12-29
- 0.1.40 — 2021-12-29
- 0.1.39 — 2021-12-29
- 0.1.38 — 2021-12-16
- 0.1.37 — 2021-12-10
- 0.1.36 — 2021-12-08
- 0.1.35 — 2021-12-08
- 0.1.34 — 2021-12-07
- 0.1.33 — 2021-12-07
- 0.1.32 — 2021-12-05
- 0.1.31 — 2021-12-03
- 0.1.30 — 2021-12-01
- 0.1.29 — 2021-12-01
- … 26 more at https://npm.io/package/chansencode-lib/versions

## README

# Introduction

Component development environment.

View built on 'next.js',
exports handled with 'rollup.js'

<br>

## Installation

---

```
npm install
```

## Run

---

```javascript
npm run dev:        Starts dev env on 'localhost:3500'
npm run build:      Builds next static site to folder './out'
npm run build-lib:  Rollup compiles './components' to './dist'
```

<br>

## Motivation & Manifest

---

This program is built by a junior front-end web dev for consumption in various applications ranging from cms to web based interfaces. It comprises both view, presentation, simple & advanced components. This library will be built into .tsx with time but is for now written in .js format.

<br>

### 'Component design' - manifest

All components shall:

- K I S S
- Be able to render monochromatically following currentColor convention
- Documented clearly with example on lib.chansen.design

## List of components

---

| **name**  | **type**     |     |
| --------- | ------------ | --- |
| Button    | presentation |     |
| Hamburger | presentation |     |
| Logo      | presentation |     |

Explicit details and preview examples can be found on : ***https://lib.chansen.design***

<br>

## Folder Structure

---

<br>

### Exporting Components:

```javascript
//Target for rollup

file: '~/components/index.js';

export * from './Foo';
export * from './Bar';
```

```javascript
file: '~/components/Foo/index.js';

export * from './Foo';
```

```javascript
file: '~/components/Foo/Foo.js';

export const Foo = () => {
  return (
    <div>
      <h4>foo</h4>
    </div>
  );
};
```

<br>

### Importing Components

```javascript
import { Foo, Bar } from '~/components';

//or

import { Foo, Bar } from 'chansencode-lib';
```

<br>

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