open-index/open-npm huggingface dataset:
npm package: @rcp/use.uncontrolled
Description: Make props.value piped to state, and exposes `onChange`, make react component is **uncontrolled & controlled**
Author: imcuttle
Latest version: 3.0.0

# @rcp/use.uncontrolled

[![NPM version](https://img.shields.io/npm/v/@rcp/use.uncontrolled.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/use.uncontrolled)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/use.uncontrolled.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/use.uncontrolled)

Make props.value piped to state, and exposes `onChange`, make react component is **uncontrolled & controlled**

## Installation

```bash
npm install @rcp/use.uncontrolled
# or use yarn
yarn add @rcp/use.uncontrolled
```

## Usage

```javascript
import useUncontrolled from '@rcp/use.uncontrolled'
```

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

### useUncontrolled

#### Parameters

- `value` {T} - Piped value
- `defaultValue` {T} - Initialize value firstly
- `onChange` {(value: T) => void} - Bind `onChange` handler when value updating
- `useEffect` {typeof React.useLayoutEffect}
- `eq` {(a: T, b: T) => boolean}

#### Examples

```javascript
function Input({ value, onChangeValue, defaultValue }) {
  const [valueState, setValue] = useUncontrolled({ value, onChange: onChangeValue, defaultValue })

  return <input type="text" value={valueState} onChange={(evt) => setValue(evt.target.value)} />
}
```

Returns **[Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)** `[T, ((value: T) => T | T) => void]`

## Related

## Authors

This library is written and maintained by imcuttle, <a href="mailto:moyuyc95@gmail.com">moyuyc95@gmail.com</a>.

## License

MIT
npm package: @rcp/use.valuesstate
Description: The useful methods exported for values state
Author: imcuttle
Latest version: 2.0.0

# @rcp/use.valuesstate

[![NPM version](https://img.shields.io/npm/v/@rcp/use.valuesstate.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/use.valuesstate)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/use.valuesstate.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/use.valuesstate)

The useful methods exported for values state

## Installation

```bash
npm install @rcp/use.valuesstate
# or use yarn
yarn add @rcp/use.valuesstate
```

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

### ValuesHelper

Type: [Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Parameters

-   `values`  {T\[]}
-   `setValues`  {(values: T\[]) => void}
-   `remove`  {(value: T) => void}
-   `add`  {(value: T) => void}
-   `toggle`  {(value: T) => void}
-   `indexOf`  {(value: T) => number}
-   `has`  {(value: T) => boolean}

### useValuesHelper

#### Parameters

-   `stateValues`  {T\[]}
-   `setValues`  {(values: T\[]) => void}

Returns **[ValuesHelper](#valueshelper)** 

### useValuesState

#### Parameters

-   `values`  {any\[]}

#### Examples

```javascript
import useValuesState from '@rcp/use.valuesstate'

function App() {
   const {values, add, remove} = useValuesState([])
   return <button onClick={() => add('something')}>Add</button>
}
```

Returns **[ValuesHelper](#valueshelper)** 

## Related

## Authors

This library is written and maintained by imcuttle, <a href="mailto:moyuyc95@gmail.com">moyuyc95@gmail.com</a>.

## License

MIT
npm package: @rcp/util.createlogger
Description: Create namespace isomorphic logger
Author: imcuttle
Latest version: 2.0.0

# @rcp/util.createlogger

[![NPM version](https://img.shields.io/npm/v/@rcp/util.createlogger.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/util.createlogger)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/util.createlogger.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/util.createlogger)

The internal about common isomorphic logger with namespace.

## Installation

```bash
npm install @rcp/util.createlogger
# or use yarn
yarn add @rcp/util.createlogger
```

## Usage

```javascript
import createLogger from '@rcp/util.createlogger'
const logger = createLogger('@rcp/hoc.i18n')

logger.info('%s abc', 'ok') // alias `log`
logger.success({ a: '222' }, 'ok')
logger.warn({})
logger.debug()
logger.error()
logger.invariant(typeof document !== 'undefined', 'the library should be used in browser environment.')
```

## API

### `createLogger(namespace?: string, opts)`

#### Parameters

##### `namespace`

The namespace of logger.

##### `opts`

- **prefix**: (default: `'('`)

- **suffix**: (default: `')'`)

- **typeMap**: eg

  ```
  {
    Log: "I'm a Log",
    Success: "Wow!",
    Warning: "Warn!",
    Error: "Error happened",
  }
  ```

The formatted string are composed by `{type}{prefix}{namespace}{suffix}: {message}`.

e.g. `Success(foo): Done!`

#### Returns

##### `info`: (alias: `log`)

- Type: `function`

##### `success`

- Type: `function`

##### `warn`

- Type: `function`

##### `debug`

- Type: `function`

##### `error`

- Type: `function`

##### `invariant`

It will throw Error with `message` when `check` is false

- Type: `(check: boolean, message?: string) => void`

## Related

## Authors

This library is written and maintained by imcuttle, <mailto:moyuyc95@gmail.com>.

## License

MIT
npm package: @rcp/util.createmount
Description: The utility for creating mountable view
Author: imcuttle
Latest version: 2.0.0

# @rcp/util.createmount

[![NPM version](https://img.shields.io/npm/v/@rcp/util.createmount.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/util.createmount)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/util.createmount.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/util.createmount)

The utility for creating mountable view

## Installation

```bash
npm install @rcp/util.createmount
# or use yarn
yarn add @rcp/util.createmount
```

## Usage

```javascript
import createMount from '@rcp/util.createmount'
const center = createMount({
  // default's opts in `open` function
})

// The `element` would be mounted on `mountNode`
// and `attributes` is the container node's attributes
center.open({
  element: <div>hahahaha</div>,
  attributes: {
    id: 'container',
    className: 'i-container'
    style: {
      position: 'absolute'
    }
  },
  mountNode: document.body
})
```

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

### createMountCenter

#### Parameters

-   `opts` **IMountOptions&lt;P>** 
    -   `opts.mountNode` **[Node](https://developer.mozilla.org/docs/Web/API/Node/nextSibling)** mountNode fallback in `open` function (optional, default `document.body`)
    -   `opts.attributes` **any?** attributes fallback in `open` function
    -   `opts.element` **ReactElement&lt;P>?** element fallback in `open` function

Returns **IMountCenter** 

## Related

## Authors

This library is written and maintained by imcuttle, <mailto:moyuyc95@gmail.com>.

## License

MIT
npm package: @rcp/util.displayname
Description: The utility for getting display name
Author: imcuttle
Latest version: 2.0.0

# @rcp/util.displayname

[![NPM version](https://img.shields.io/npm/v/@rcp/util.displayname.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/util.displayname)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/util.displayname.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/util.displayname)

The utility for getting display name

## Installation

```bash
npm install @rcp/util.displayname
# or use yarn
yarn add @rcp/util.displayname
```

## Usage

```javascript
import displayName from '@rcp/util.displayname'

class A extends React.Component {}
displayName(A) === 'A'

class Foo extends React.Component {
  static displayName = 'FooFoo'
}
displayName(Foo) === 'FooFoo'
```

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

### displayName

The utility for getting display name

#### Parameters

-   `component` **(React.ComponentType | React.ReactElement&lt;any> | IFunction | [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String))** 

Returns **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** 

## Authors

This library is written and maintained by imcuttle, <a href="mailto:moyuyc95@gmail.com">moyuyc95@gmail.com</a>.

## License

MIT
npm package: @rcp/util.iscompclass
Description: The utility for checking component class
Author: imcuttle
Latest version: 2.0.0

# @rcp/util.iscompclass

[![NPM version](https://img.shields.io/npm/v/@rcp/util.iscompclass.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/util.iscompclass)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/util.iscompclass.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/util.iscompclass)

The utility for checking react component class

## Installation

```bash
npm install @rcp/util.iscompclass
# or use yarn
yarn add @rcp/util.iscompclass
```

## Usage

```javascript
import isComponentClass from '@rcp/util.iscompclass'
import * as createClass from 'create-react-class'
import * as React from 'react'

// es6
class View extends React.Component {}
isComponentClass(View) // true

// es5
const Comp = createClass({
  render() {
    return <div>hi</div>
  }
})
isComponentClass(Comp) // true

isComponentClass(<Comp />) // false
```

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

### isComponentInstance

Determine react component instance

#### Parameters

-   `instance`  {any}

#### Examples

```javascript
import { isComponentInstance } from '@rcp/util.iscompclass'
class View extends React.Component {}

isComponentInstance(View.prototype)
```

Returns **[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** 

### isComponentClass

-   **See: [how-to-determine-if-js-object-is-react-component](https://discuss.reactjs.org/t/how-to-determine-if-js-object-is-react-component/2825/5)**

Determine react component class

#### Parameters

-   `component`  {any}

Returns **[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** 

## Related

-   [@rcp/util.iselemof](../util.iselemof) - The utility for determinate the input is element of the component class

## Authors

This library is written and maintained by imcuttle, <a href="mailto:moyuyc95@gmail.com">moyuyc95@gmail.com</a>.

## License

MIT
npm package: @rcp/util.iselemof
Description: The utility determinating the input is element of the component class
Author: imcuttle
Latest version: 2.0.0

# @rcp/util.iselemof

[![NPM version](https://img.shields.io/npm/v/@rcp/util.iselemof.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/util.iselemof)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/util.iselemof.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/util.iselemof)

The utility for determinate the input is element of the component class

## Installation

```bash
npm install @rcp/util.iselemof
# or use yarn
yarn add @rcp/util.iselemof
```

## Usage

```javascript
import isElementOf from '@rcp/util.iselemof'

class Comp extends React.Component {}
isElementOf(Comp)(<Comp />) // true
```

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

### isElementOf

Determinate the input is element of the component class

#### Parameters

-   `Component` **React.ComponentType** 

## Related

-   [@rcp/util.iscompclass](../util.iscompclass) - The utility for checking react component class

## Authors

This library is written and maintained by imcuttle, <a href="mailto:moyuyc95@gmail.com">moyuyc95@gmail.com</a>.

## License

MIT
npm package: @rcp/util.open
Description: Open react element standalone
Author: 余聪
Latest version: 2.0.0

# @rcp/util.open

[![NPM version](https://img.shields.io/npm/v/@rcp/util.open.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/util.open)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/util.open.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/util.open)

Open react element standalone

## Installation

```bash
npm install @rcp/util.open
# or use yarn
yarn add @rcp/util.open
```

## Usage

```javascript
import open from '@rcp/util.open'
```

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

## Related

## Authors

This library is written and maintained by 余聪, <a href="mailto:yucong06@meituan.com">yucong06@meituan.com</a>.

## License

MIT
npm package: @rcp/util.tocompclass
Description: The utility converting stateless to be component class
Author: imcuttle
Latest version: 2.0.0

# @rcp/util.tocompclass

[![NPM version](https://img.shields.io/npm/v/@rcp/util.tocompclass.svg?style=flat-square)](https://www.npmjs.com/package/@rcp/util.tocompclass)
[![NPM Downloads](https://img.shields.io/npm/dm/@rcp/util.tocompclass.svg?style=flat-square&maxAge=43200)](https://www.npmjs.com/package/@rcp/util.tocompclass)

The utility converting stateless to be component class

## Installation

```bash
npm install @rcp/util.tocompclass
# or use yarn
yarn add @rcp/util.tocompclass
```

## Usage

```javascript
import toComponentClass from '@rcp/util.tocompclass'

const StatelessView = () => <h1>123</h1>
// with lifeCycle
const ConvertedView = toComponentClass(StatelessView)
ConvertedView === StatelessView // false

class View extends React.Component {
  render() {
    return <h1>123</h1>
  }
}
View === toComponentClass(View) // true
```

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

### toComponentClass

Convert stateless component class to be component class

#### Parameters

-   `component` **React.ComponentType** 

Returns **React.ComponentClass&lt;P, S>** 

## Related

-   [@rcp/util.iscompclass](../util.iscompclass) - The utility for checking react component class

## Authors

This library is written and maintained by imcuttle, <a href="mailto:moyuyc95@gmail.com">moyuyc95@gmail.com</a>.

## License

MIT
npm package: @rcpswap/sdk
Description: 🛠 An SDK for building applications on top of RCPswap.
Latest version: 1.3.0

# RCPswap SDK

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
[![Actions Status](https://github.com/MoonsDusts/rcpswap-sdk/workflows/CI/badge.svg)](https://github.com/MoonsDusts/rcpswap-sdk)
[![npm version](https://img.shields.io/npm/v/@rcpswap/sdk/latest.svg)](https://www.npmjs.com/package/@rcpswap/sdk/v/latest)
[![npm bundle size (scoped version)](https://img.shields.io/bundlephobia/minzip/@rcpswap/sdk/latest.svg)](https://bundlephobia.com/result?p=@rcpswap/sdk@latest)

In-depth documentation on this SDK is available at [uniswap.org](https://uniswap.org/docs/v2/SDK/getting-started/).

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/MoonsDusts/rcpswap-sdk.git
```

Move into the uniswap-sdk working directory

```sh
cd uniswap-sdk/
```

Install dependencies

```sh
yarn install
```

Run tests

```sh
yarn test
```

You should see output like the following:

```sh
yarn run v1.22.4
$ tsdx test
 PASS  test/constants.test.ts
 PASS  test/pair.test.ts
 PASS  test/fraction.test.ts
 PASS  test/miscellaneous.test.ts
 PASS  test/entities.test.ts
 PASS  test/trade.test.ts

Test Suites: 1 skipped, 6 passed, 6 of 7 total
Tests:       3 skipped, 82 passed, 85 total
Snapshots:   0 total
Time:        5.091s
Ran all test suites.
✨  Done in 6.61s.
```
npm package: @rcpswap/sdk-extra
Description: 🛠 A specific SDK/toolkit for building applications on top of RCPswap.
Latest version: 1.2.1

# rcpswap SDK Extra

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
[![npm version](https://img.shields.io/npm/v/@rcpswap/sdk-extra/latest.svg)](https://www.npmjs.com/package/@rcpswap/sdk-extra/v/latest)
[![npm bundle size (scoped version)](https://img.shields.io/bundlephobia/minzip/@rcpswap/sdk-extra/latest.svg)](https://bundlephobia.com/result?p=@rcpswap/sdk-extra@latest)

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/MoonsDusts/rcpswap-sdk-extra.git
```

Move into the rcpswap-sdk-extra working directory

```sh
cd rcpswap-sdk-extra/
```

Install dependencies

```sh
yarn install
```

Run tests

```sh
yarn test
```
npm package: @rcrdk-ignite-ui/react
Description: I developed this project during classes and as a challenge of my latest studies on React lessons at [Rocketseat](https://www.rocketseat.com.br). The documentation is available [here](https://rcrdk.github.io/design-system-ignite/).
Latest version: 3.0.1

# Ignite Call Design System
I developed this project during classes and as a challenge of my latest studies on React lessons at [Rocketseat](https://www.rocketseat.com.br). The documentation is available [here](https://rcrdk.github.io/design-system-ignite/).

## Usage
```shell
npm i @rcrdk-ignite-ui/react
```

## Components
- Text
- Heading
- Button
- Box
- Text Input
- Text Area
- Checkbox
- Multi Step
- Avatar
- Toast
- Tooltip

## Links
- [Docs](https://rcrdk.github.io/design-system-ignite/)
- [GitHub Repo]()
npm package: @rcrdk-ignite-ui/tokens
Description: I developed this project during classes and as a challenge of my latest studies on React lessons at [Rocketseat](https://www.rocketseat.com.br). The documentation is available [here](https://rcrdk.github.io/design-system-ignite/).
Latest version: 3.0.1

# Ignite Call Design System
I developed this project during classes and as a challenge of my latest studies on React lessons at [Rocketseat](https://www.rocketseat.com.br). The documentation is available [here](https://rcrdk.github.io/design-system-ignite/).

## Usage
```shell
npm i @rcrdk-ignite-ui/tokens
```

## Links
- [Docs](https://rcrdk.github.io/design-system-ignite/)
- [GitHub Repo](https://github.com/rcrdk/design-system-ignite/tree/%40rcrdk-ignite-ui/tokens%403.0.0)