open-index/open-npm huggingface dataset:
npm package: @swift-school/ant-design-draggable-modal
Description: Modal from Ant Design, draggable.
Author: ben-swift
Latest version: 1.0.0

<h1 align="center">Ant Design Draggable Modal</h1>

<div align="center">

Modal from Ant Design, draggable.

Forked from [DylanVann/ant-design-draggable-modal](https://github.com/DylanVann/ant-design-draggable-modal)

[![Version][version-badge]][package]

Changes to initialHeight/initialWidth now triggers a separate event (propsResize). This allows us to resize the modal after measuring its inner content.

<!--
Links:
-->

<!-- prettier-ignore-start -->

[package]: https://www.npmjs.com/package/@swift-school/ant-design-draggable-modal
[version-badge]: https://img.shields.io/npm/v/ant-design-draggable-modal.svg?style=flat-square

<!-- prettier-ignore-end -->
npm package: @swift-school/dts-css-modules-loader
Description: webpack loader to generate typings for css modules
Latest version: 1.0.1

# dts-css-modules-loader
A small Webpack loader to generate typings for your CSS-Modules. Created as a replacement for the frozend [typings-for-css-modules-loader](https://github.com/Jimdo/typings-for-css-modules-loader). This loader does not make any changes in content of styles, just creates `*.d.ts` file during the work. It is assumed that the content will be preprocessed first by [css-loader](https://github.com/webpack-contrib/css-loader).

## Installation
```bash
npm i -D dts-css-modules-loader
# or
yarn add -D dts-css-modules-loader
```

## Usage
```js
{
  test: /\.scss$/,
  use: [
    {
      loader: 'style-loader',
      options: {
        esModule: false,
      },
    },
    {
      loader: 'dts-css-modules-loader',
      options: {
        namedExport: true
      }
    },
    {
      loader: 'css-loader',
      options: {
        // options for the v5 of css-loader
        modules: {
          exportLocalsConvention: 'camelCaseOnly',
          localIdentName: '[local]'
        }
      }
    },
    'sass-loader'
  ]
}
```

## Options
### `namedExport`
When the option is switched on classes exported as variables. Be sure you using `camelCase` option of [css-loader](https://github.com/webpack-contrib/css-loader) to avoid invalid name of variables.

```ts
// This file is generated automatically.
export const button: string;
export const buttonActive: string;
```

When option is off:
```ts
// This file is generated automatically.
export interface I_buttonScss {
  'button': string
  'buttonActive': string
}
declare const styles: I_buttonScss;
export = styles;
```

### `banner`
Adds a "banner" prefix to each generated file.

### `customTypings`
A function that accepts classes (an array of string) and returns the content of declaration file:
```js
customTypings: classes => {
  let content = '// This file is generated automatically\ndeclare const styles: {\n';
  for (const c of classes) {
    content += `  ${c}: string;\n`;
  }
  content += '};\nexport default styles;\n';
  return content;
}
```
`namedExport` and `banner` option will be ignored

### `dropEmptyFile`
If there are no classes, the typings file will not be generated, and the existing will be deleted.

## Usage in Typescript
```ts
import * as styles from './_button.scss';
```

To avoid errors about the absent module, you need to determine this:
```ts
/**
 * Trap for `*.scss.d.ts` files which are not generated yet.
 */
declare module '*.scss' {
  var classes: any;
  export = classes;
}
```
When you add new classname Typescript compiler may not find the generated variable so you need to compile twice your files.

## License
Licensed under the MIT license.
npm package: @swiftcarrot/analytics
Description: ## Installation
Author: Wang Zuo
Latest version: 0.2.1

# @swiftcarrot/analytics

## Installation

```sh
yarn add @swiftcarrot/analytics
```

## Usage

```javascript
import { Analytics } from "@swiftcarrot/analytics";

const analytics = new Analytics("http://localhost:8000");

analytics.identify("carrot");

analytics.track("play track", {
  id: "2gZUPNdnz5Y45eiGxpHGSc",
});
```

## License

MIT
npm package: @swiftcarrot/babel
Description: zkit babel preset
Author: Wang Zuo
Latest version: 0.5.0
Deprecated: @swiftcarrot/babel is renamed to babel-preset-swiftcarrot

# @swiftcarrot/babel

[![npm](https://img.shields.io/npm/v/@swiftcarrot/babel.svg)](https://www.npmjs.com/package/@swiftcarrot/babel)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/babel.svg)](https://www.npmjs.com/package/@swiftcarrot/babel)
[![Build Status](https://travis-ci.org/swiftcarrot/babel.svg?branch=master)](https://travis-ci.org/swiftcarrot/babel)
[![codecov](https://codecov.io/gh/swiftcarrot/babel/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/babel)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

### Installation

```sh
yarn add @swiftcarrot/babel --dev
npm install @swiftcarrot/babel --save-dev
```

### Usage

```json
{
  "presets": ["@swiftcarrot/babel"]
}
```

### License

MIT
npm package: @swiftcarrot/chatkit
Description: ```sh npm install @swiftcarrot/chatkit --save yarn install @swiftcarrot/chatkit ```
Author: Wang Zuo
Latest version: 0.2.0

# chatkit

```sh
npm install @swiftcarrot/chatkit --save
yarn install @swiftcarrot/chatkit
```

chatkit js sdk

```javascript
const chatkit = new Chatkit('chatkit-demo.caitouyun.com', {
  token: '<token>',
  ssl: false
});

const currentUser = await chatkit.connect();
const rooms = await currentUser.findRoom();
const room = rooms[0];
const channel = await currentUser.joinRoom(rooms.id);
channel.sendMessage({ type: 'text', payload: { text: 'hello world' } });

const activites = await currentUser.findRoomActivities(room.id, {});
```

```javascript
chatkit.admin.findRoom({ where: {} });
chatkit.admin.insertRoom({ object: {} });
chatkit.admin.findUser({ where: {} });
chatkit.admin.insertUser({ object: {} });
chatkit.admin.insertActivity({ object: {} });
```
npm package: @swiftcarrot/color-fns
Description: color functions for node and browser
Author: Wang Zuo
Latest version: 3.2.0

# @swiftcarrot/color-fns

[![npm](https://img.shields.io/npm/v/@swiftcarrot/color-fns.svg)](https://www.npmjs.com/package/@swiftcarrot/color-fns)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/color-fns.svg)](https://www.npmjs.com/package/@swiftcarrot/color-fns)
[![Build Status](https://travis-ci.com/swiftcarrot/color-fns.svg?branch=master)](https://travis-ci.com/swiftcarrot/color-fns)
[![codecov](https://codecov.io/gh/swiftcarrot/color-fns/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/color-fns)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

Color functions for node and browser

### Installation

```sh
npm install @swiftcarrot/color-fns --save
yarn add @swiftcarrot/color-fns
```

### Usage

```javascript
// commonjs
const { hex2rgb } = require('@swiftcarrot/color-fns');

// es module
import { hex2rgb, cssColor } from '@swiftcarrot/color-fns';
import * as fns from '@swiftcarrot/color-fns';
```

### Available functions

- `cssColor`: parse a valid css [color value](https://developer.mozilla.org/en/docs/Web/CSS/color_value) to rgba format
- `hex2hsl`
- `hex2hsv`
- `hex2rgb`
- `hsl2hsv`
- `hsl2rgb`
- `hsv2hex`
- `hsv2hsl`
- `hsv2rgb`
- `rgb2hex`
- `rgb2hsv`
- `rgba`
- `rgba2hex`
- `rgba2rgb`

check [test](https://github.com/swiftcarrot/color-fns/blob/master/src/__tests__/index.js) for more examples

### License

MIT
npm package: @swiftcarrot/ionicons
Description: ionicons svg component for react
Author: Wang Zuo
Latest version: 0.2.4

# react-ionicons

[![npm](https://img.shields.io/npm/v/@swiftcarrot/ionicons.svg)](https://www.npmjs.com/package/@swiftcarrot/ionicons)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/ionicons.svg)](https://www.npmjs.com/package/@swiftcarrot/ionicons)
[![Build Status](https://travis-ci.org/swiftcarrot/react-ionicons.svg?branch=master)](https://travis-ci.org/swiftcarrot/react-ionicons)
[![codecov](https://codecov.io/gh/swiftcarrot/react-ionicons/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/react-ionicons)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

ionicons svg component for react

### Installation

```sh
npm install @swiftcarrot/ionicons --save
yarn add @swiftcarrot/ionicons
```

### Usage

```javascript
import { IosAddCircleOutline } from '@swiftcarrot/ionicons';
```

### License

MIT
npm package: @swiftcarrot/kit
Description: ### Installation
Author: Wang Zuo
Latest version: 0.7.1

# @swiftcarrot/kit

### Installation

```sh
yarn add react react-dom @swiftcarrot/kit
```

### Usage

```javascript
import React from 'react';
import { Kit, Container, Heading } from '@swiftcarrot/kit';

const App = () => {
  return (
    <Kit>
      <Container>
        <Heading>Kit</Heading>
      </Container>
    </Kit>
  );
};
```
npm package: @swiftcarrot/primitives
Description: react primitives for web
Author: Wang Zuo
Latest version: 0.1.1

# primitives

[![npm](https://img.shields.io/npm/v/@swiftcarrot/primitives.svg)](https://www.npmjs.com/package/@swiftcarrot/primitives)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/primitives.svg)](https://www.npmjs.com/package/@swiftcarrot/primitives)
[![Build Status](https://travis-ci.org/swiftcarrot/primitives.svg?branch=master)](https://travis-ci.org/swiftcarrot/primitives)
[![codecov](https://codecov.io/gh/swiftcarrot/primitives/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/primitives)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

react primitives for web

```sh
yarn add @swiftcarrot/primitives
```

### Usage

```javascript
import { View, Text } from '@swiftcarrot/primitives';
```

### License

MIT
npm package: @swiftcarrot/react-auth
Description: Authentication in React and React Native
Author: Wang Zuo
Latest version: 0.3.0

# @swiftcarrot/react-auth

[![npm](https://img.shields.io/npm/v/@swiftcarrot/react-auth.svg)](https://www.npmjs.com/package/@swiftcarrot/react-auth)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/react-auth.svg)](https://www.npmjs.com/package/@swiftcarrot/react-auth)
[![Build Status](https://travis-ci.org/swiftcarrot/react-auth.svg?branch=master)](https://travis-ci.org/swiftcarrot/react-auth)
[![codecov](https://codecov.io/gh/swiftcarrot/react-auth/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/react-auth)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

Authentication in React and React Native

### Installation

```sh
yarn add @swiftcarrot/react-auth
```

### Usage

```javascript
import React from 'react';
import { AuthProvider, AuthProtected, useAuth } from '@swiftcarrot/react-auth';

const getCurrentUser = () => fetch('/user');

const App = () => {
  return (
    <AuthProvider getCurrentUser={getCurrentUser}>
      <AuthProtected renderLoading={Loading} renderLogin={LoginPage}>
        <Dashboard />
      </AuthProtected>
    </AuthProvider>
  );
};

const Dashboard = () => {
  const { currentUser } = useAuth();
  return <div>{currentUser.name}</div>;
};
```

### API

#### AuthProvider

- getCurrentUser
- beforeLoginUser
- afterLoginUser
- beforeLogoutUser
- afterLogoutUser
- renderLoading

#### AuthProtected

- renderLoading
- renderLogin

#### AuthContext

#### useAuth

#### Methods

- loading
- setLoading
- currentUser
- setCurrentUser
- loginuser
- logoutUser

### License

MIT
npm package: @swiftcarrot/react-date-picker
Description: Date picker for React and React Native
Author: Wang Zuo
Latest version: 0.1.8

# react-date-picker

Date picker for React and React Native

```sh
npm install @swiftcarrot/react-date-picker --save
yarn add @swiftcarrot/react-date-picker
```

### Usage

```javascript
import DatePicker from '@swiftcarrot/react-date-picker';
```

### Styles

### React Native usage

### License

MIT
npm package: @swiftcarrot/react-form
Description: React form with context and hook
Author: Wang Zuo
Latest version: 1.1.2

# react-form

[![npm](https://img.shields.io/npm/v/@swiftcarrot/react-form.svg)](https://www.npmjs.com/package/@swiftcarrot/react-form)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/react-form.svg)](https://www.npmjs.com/package/@swiftcarrot/react-form)
[![Build Status](https://travis-ci.org/swiftcarrot/react-form.svg?branch=master)](https://travis-ci.org/swiftcarrot/react-form)
[![codecov](https://codecov.io/gh/swiftcarrot/react-form/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/react-form)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

Easy React form with context and hook

## Features

- Easy form components
- Auto disable on submit
- Multiple submit buttons support
- Nested attributes support

## Installation

```sh
yarn install @swiftcarrot/react-form
# npm install @swiftcarrot/react-form --save
```

## Quick start

```javascript
import React from 'react';
import {
  Form,
  FormLabel,
  FormControl,
  FormError,
  FormSubmit,
} from '@swiftcarrot/react-form';

function App() {
  function handleSubmit(values) {
    console.log(values);
  }

  return (
    <Form onSubmit={handleSubmit}>
      <FormLabel name="name">Name</FormLabel>
      <FormControl name="name" />
      <FormError name="name" />
      <FormSubmit />
    </Form>
  );
}
```

## License

MIT
npm package: @swiftcarrot/react-ionicons
Description: ionicons svg component for react
Author: Wang Zuo
Latest version: 6.0.2

# react-ionicons

[![npm](https://img.shields.io/npm/v/@swiftcarrot/react-ionicons.svg)](https://www.npmjs.com/package/@swiftcarrot/react-ionicons)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/react-ionicons.svg)](https://www.npmjs.com/package/@swiftcarrot/react-ionicons)
[![Build Status](https://travis-ci.org/swiftcarrot/react-ionicons.svg?branch=master)](https://travis-ci.org/swiftcarrot/react-ionicons)
[![codecov](https://codecov.io/gh/swiftcarrot/react-ionicons/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/react-ionicons)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

ionicons svg component for react

### Installation

```sh
npm install @swiftcarrot/react-ionicons --save
yarn add @swiftcarrot/react-ionicons
```

### Usage

```javascript
import { Accessibility } from '@swiftcarrot/react-ionicons';
```

```css
.ionicon {
  fill: currentColor;
  stroke: currentColor;
}

.ionicon-fill-none {
  fill: none;
}

.ionicon-stroke-width {
  stroke-width: 32px;
}
```

### License

MIT
npm package: @swiftcarrot/request
Description: [![npm](https://img.shields.io/npm/v/@swiftcarrot/request.svg)](https://www.npmjs.com/package/@swiftcarrot/request) [![npm](https://img.shields.io/npm/dm/@swiftcarrot/request.svg)](https://www.npmjs.com/package/@swiftcarrot/request) [![Build Status](https
Author: Wang Zuo
Latest version: 0.2.2

# request

[![npm](https://img.shields.io/npm/v/@swiftcarrot/request.svg)](https://www.npmjs.com/package/@swiftcarrot/request)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/request.svg)](https://www.npmjs.com/package/@swiftcarrot/request)
[![Build Status](https://travis-ci.org/swiftcarrot/request.svg?branch=master)](https://travis-ci.org/swiftcarrot/request)
[![codecov](https://codecov.io/gh/swiftcarrot/request/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/request)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

request

### Usage

```javascript
import Request from '@swiftcarrot/request';

const req = new Request('https://api.example.com/v1').timeout(5000);

req.get('/articles', { page: 1 });
req
  .post('/login', { name: 'test', password: '123' })
  .then(({ token }) => req.token(token));
req.post('/articles', { title: 'test' });
req.delete('/logout').then(() => req.token(null));
```

### onError

```javascript
const request = new Request();

request.onError(err => {
  console.warn(err);
});
```

### add fetch Polyfill

```javascript
// yarn add cross-fetch
import 'cross-fetch/polyfill';
```

### License

MIT
npm package: @swiftcarrot/utils
Description: utils
Author: Wang Zuo
Latest version: 0.1.2

# utils

JavaScript utils

### Usage

```javascript
import { uid, IS_BROWSER } from '@swiftcarrot/utils';
```

### Methods

- uid
- uuid
- encodeQueryString
- decodeQueryString
- decodeLocationSearch
- hashCode
- sleep

### Constants

- IS_BROWSER
- IS_IOS

### License

MIT
npm package: @swiftcarrot/webpacker
Description: rails webpacker in node
Author: Wang Zuo
Latest version: 3.0.1

# webpacker

[![npm](https://img.shields.io/npm/v/@swiftcarrot/webpacker.svg)](https://www.npmjs.com/package/@swiftcarrot/webpacker)
[![npm](https://img.shields.io/npm/dm/@swiftcarrot/webpacker.svg)](https://www.npmjs.com/package/@swiftcarrot/webpacker)
[![Build Status](https://travis-ci.org/swiftcarrot/webpacker.svg?branch=master)](https://travis-ci.org/swiftcarrot/webpacker)
[![codecov](https://codecov.io/gh/swiftcarrot/webpacker/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/webpacker)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

### Install

```sh
npm install @swiftcarrot/webpacker --save-dev
yarn add @swiftcarrot/webpacker --dev
```

### Usage

```sh
webpacker dev-server -l http://localhost:5000
webpacker watch
webpacker build
webpacker analyze
```

### Features

- multiple entries support (`packs/*.js`, `packs/*.html`)
- zero config
  - `.js` with [babel-preset-swiftcarrot](https://github.com/swiftcarrot/babel-preset-swiftcarrot)
  - `.css`
  - `.module.css` css module
  - `.(scss|sass)` with [sass-loader](https://github.com/webpack-contrib/sass-loader)
  - `.module.(scss|sass)` css module with sass
  - `.yaml` with [@swiftcarrot/yaml-loader](https://github.com/swiftcarrot/yaml-loader)
  - `.toml` with [toml-laoder](https://github.com/KyleAMathews/toml-loader)
  - `.(jpg|jpeg|png|gif|svg|eot|ttf|woff|woff2)` with [file-loader](https://github.com/webpack-contrib/file-loader)
  - `icons/*.svg` with [@svgr/webpack](https://www.npmjs.com/package/@svgr/webpack)
- custom webpack config through `webpacker.config.js`

### License

MIT
npm package: @swiftcarrot/yaml-loader
Description: yaml loader
Author: Wang Zuo
Latest version: 0.2.3

# @swiftcarrot/yaml-loader

```sh
yarn add @swiftcarrot/yaml-loader --dev
```

```javascript
rules: [
  {
    test: /\.ya?ml$/,
    use: '@swiftcarrot/yaml-loader',
  },
];
```