open-index/open-npm huggingface dataset:
npm package: @opc-mock/opc-app-header
Description: Webcomponent opc-app-header following open-wc recommendations
Author: opc-app-header
Latest version: 0.0.1

# \<opc-app-header>

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation
```bash
npm i opc-app-header
```

## Usage
```html
<script type="module">
  import 'opc-app-header/opc-app-header.js';
</script>

<opc-app-header></opc-app-header>
```

## Linting with ESLint, Prettier, and Types
To scan the project for linting errors, run
```bash
npm run lint
```

You can lint with ESLint and Prettier individually as well
```bash
npm run lint:eslint
```
```bash
npm run lint:prettier
```

To automatically fix many linting errors, run
```bash
npm run format
```

You can format using ESLint and Prettier individually as well
```bash
npm run format:eslint
```
```bash
npm run format:prettier
```

## Testing with Karma
To run the suite of karma tests, run
```bash
npm run test
```

To run the tests in watch mode (for <abbr title="test driven development">TDD</abbr>, for example), run

```bash
npm run test:watch
```

## Demoing with Storybook
To run a local instance of Storybook for your component, run
```bash
npm run storybook
```

To build a production version of Storybook, run
```bash
npm run storybook:build
```


## Tooling configs

For most of the tools, the configuration is in the `package.json` to reduce the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `es-dev-server`
```bash
npm start
```
To run a local development server that serves the basic demo located in `demo/index.html`
npm package: @opc-mock/opc-back-to-top
Description: Webcomponent opc-back-to-top following open-wc recommendations
Author: opc-back-to-top
Latest version: 0.0.1

# \<opc-back-to-top>

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation
```bash
npm i opc-back-to-top
```

## Usage
```html
<script type="module">
  import 'opc-back-to-top/opc-back-to-top.js';
</script>

<opc-back-to-top></opc-back-to-top>
```



## Tooling configs

For most of the tools, the configuration is in the `package.json` to reduce the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `es-dev-server`
```bash
npm start
```
To run a local development server that serves the basic demo located in `demo/index.html`
npm package: @opcat-labs/openapi
Description: NestJS API Gateway with OpenAPI v3 support
Author: opcat-labs
Latest version: 1.0.3

# @opcat-labs/openapi

A TypeScript SDK for interacting with the OpCat Labs OpenAPI, providing type-safe access to blockchain data including blocks, transactions, addresses, UTXOs, and tokens.

## Installation

```bash
npm install @opcat-labs/openapi
```

or

```bash
yarn add @opcat-labs/openapi
```

## Quick Start

```typescript
import { healthCheck, getBlockByHash, getTransactionById } from '@opcat-labs/openapi';

// Check service health
const health = await healthCheck();

// Get block by hash
const block = await getBlockByHash({
  params: { hash: 'your-block-hash-here' }
});

// Get transaction by ID
const transaction = await getTransactionById({
  params: { txid: 'your-transaction-id-here' }
});
```

## API Reference

All api reference here: https://testnet-openapi.opcatlabs.io/
npm package: @opchat/opchatjs-weblogger
Description: 用于浏览器的日志，支持彩色输出
Author: Truraly
Latest version: 1.0.0

# opchatjs-webLogger

用于浏览器的Logger

## 安装

```bash
npm install @opchat/opchatjs-weblogger
```

## 使用

```ts
// ts
import { webLogger } from '@opchat/opchatjs-weblogger'
// js
const { webLogger } = require('@opchat/opchatjs-weblogger')



let logger = webLogger('test')
logger.debug('这是一条debug日志')   // 蓝色
logger.info('这是一条info日志')     // 绿色
logger.warn('这是一条warn日志')     // 黄色
logger.error('这是一条error日志')   // 红色
logger.log('这是一条log日志')       // 随机颜色，取决于传入的logger名
```


## 更新日志

### 1.0.0

> 2023-9-10

- 初始版本
npm package: @opcjs/zoro
Description: a redux framework, complete async await
Author: Faure Wu
Latest version: 3.0.5

2.* 文档 | [1.* 文档](https://github.com/FaureWu/zoro/blob/master/README-V1.md)

# zoro

[![](https://img.shields.io/npm/v/@opcjs/zoro.svg?style=flat-square)](https://npmjs.org/package/@opcjs/zoro)
[![](https://img.shields.io/npm/dt/@opcjs/zoro.svg?style=flat-square)](https://npmjs.org/package/@opcjs/zoro)
[![](https://img.shields.io/npm/l/@opcjs/zoro.svg?style=flat-square)](https://npmjs.org/package/@opcjs/zoro)

基于 [redux](https://github.com/reactjs/redux)、[async/await](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function)的轻量级前端框架，用于快速接入redux，省去配置redux的一堆繁琐操作

> 目前不支持创建多个实例

---

🎉🎉🎉至`3.0.0`版本后，已全面基于typescript重写，现已支持typescript

🎉🎉🎉至`2.3.6`版本后，支持通过[umi-plugin-zoro](https://github.com/FaureWu/umi-plugin-zoro)一键接入[umi](https://github.com/umijs/umi)框架中了，详细接入方式查看[umi接入文档](https://faurewu.github.io/zoro/GUIDE/UMI.html)

## 文档
* [API文档](https://faurewu.github.io/zoro/)

## 特性

* 轻量化，api少，可快速接入
* 可扩展，完整的插件机制，支持自定义插件编写
* 框架提供多个内置常用插件，如全局loading插件，mixins扩展插件
* 全局错误捕获，统一处理
* 拦截器机制实现

## 教程

* [打造前端大秘宝系列之REDUX状态处理框架ZORO-基本简介](https://www.jianshu.com/p/19f852252500)
* [打造前端大秘宝系列之REDUX状态处理框架ZORO-插件介绍](https://www.jianshu.com/p/d262c2920537)
* [微信小程序及h5,基于taro，zoro最佳实践探索](https://www.jianshu.com/p/7c27dbbc080f)

## 应用案例

<img src="https://img.baobeicang.com/user_upload/rc-upload-1539741270100-2.jpeg" width="150" />

## 更新日志

[版本更新记录](https://github.com/FaureWu/zoro/releases)

## 开发交流

请添加微信 `Faure5` 备注 `zoro` 咨询，开源不易，如果好用，欢迎star

<img src="https://img.baobeicang.com/user_upload/rc-upload-1539676937885-2.jpeg" width="150" />

## License

[MIT](https://tldrlegal.com/license/mit-license)
npm package: @opcjs/zoro-plugin
Description: the plugin for zoro
Author: Faure Wu
Latest version: 3.0.0

# zoro-plugin

[![](https://img.shields.io/npm/v/@opcjs/zoro-plugin.svg?style=flat-square)](https://npmjs.org/package/@opcjs/zoro-plugin)
[![](https://img.shields.io/npm/dt/@opcjs/zoro-plugin.svg?style=flat-square)](https://npmjs.org/package/@opcjs/zoro-plugin)
[![](https://img.shields.io/npm/l/@opcjs/zoro-plugin.svg?style=flat-square)](https://npmjs.org/package/@opcjs/zoro-plugin)

为[redux](https://github.com/reactjs/redux)框架[zoro](https://github.com/FaureWu/zoro) 提供各式各样方便使用的插件

---

相关文档已经归档于[zoro官方文档](https://faurewu.github.io/zoro/PLUGIN/)，请前往查看
npm package: @opctl/sdk
Description: Javascript SDK for opctl
Latest version: 0.0.0-alpha.5

[![Build Status](https://travis-ci.org/opctl/sdk-js.svg?branch=master)](https://travis-ci.org/opctl/sdk-js)
[![Coverage](https://codecov.io/gh/opctl/sdk-js/branch/master/graph/badge.svg)](https://codecov.io/gh/opctl/sdk-js)

> *Be advised: this project is currently at Major version zero. Per the
> semantic versioning spec: "Major version zero (0.y.z) is for initial
> development. Anything may change at any time. The public API should
> not be considered stable."*

Javascript SDK for [opctl](https://opctl.io)

# Supported runtimes

This library is isomorphic & should be consumable from either nodejs or
web browsers.

# Installation

```shell
npm install --save @opctl/sdk
```

# Typescript

This library is written in typescript. The package published to NPM targets ES2015 and includes type declarations.

# Usage

## API client

```javascript
import {
  eventStreamGet,
  livenessGet,
  opKill,
  opStart
} from '@opctl/sdk/dist/api/client'

// opctl api available from nodes via localhost:42224/api
const apiBaseUrl = 'localhost:42224/api'

// get the liveness of the api
await livenessGet(
  apiBaseUrl
)

// start an op
const rootOpId = await opStart(
  apiBaseUrl,
  {
    rawValue: {
      string: 'hello base64 url encoded world!',
    },
  },
  {
    ref: 'github.com/opctl-pkgs/base64url.encode#1.0.0',
  }
)

// kill the op we started
await opKill(
  apiBaseUrl,
  rootOpId
)

// replay events from our op via stream
await eventStreamGet(
  apiBaseUrl,
  {
    filter: {
      roots: [rootOpId],
    },
    onEvent: event => console.log(`received op event: ${JSON.stringify(event)}`),
    onError: err => console.log(`error streaming op events; error was: ${JSON.stringify(err)}`),
  }
)
```

# Support

join us on
[![Slack](https://opctl-slackin.herokuapp.com/badge.svg)](https://opctl-slackin.herokuapp.com/)
or [open an issue](https://github.com/opctl/sdk-js/issues)

# Releases

releases are versioned according to
[![semver 2.0.0](https://img.shields.io/badge/semver-2.0.0-brightgreen.svg)](http://semver.org/spec/v2.0.0.html)
and [tagged](https://git-scm.com/book/en/v2/Git-Basics-Tagging); see
[CHANGELOG.md](CHANGELOG.md) for release notes

# Contributing

see [CONTRIBUTING.md](CONTRIBUTING.md)
npm package: @opctl/sdk-react
Description: React SDK for opctl
Latest version: 0.0.0-alpha.17

[![Build Status](https://travis-ci.org/opctl/sdk-react.svg?branch=master)](https://travis-ci.org/opctl/sdk-react)
[![Coverage](https://codecov.io/gh/opctl/sdk-react/branch/master/graph/badge.svg)](https://codecov.io/gh/opctl/sdk-react)

> *Be advised: this project is currently at Major version zero. Per the
> semantic versioning spec: "Major version zero (0.y.z) is for initial
> development. Anything may change at any time. The public API should
> not be considered stable."*

React SDK for [opctl](https://opctl.io)

# Supported runtimes

This library is isomorphic & should be consumable from either nodejs or
web browsers.

# Installation

```shell
npm install --save @opctl/sdk-react
```

# Typescript

This library is written in typescript. The package published to NPM targets ES2015 and includes type declarations.

# Usage

## API client

```typescript
import Op from '@opctl/sdk-react/lib/Op'
```

# Support

join us on
[![Slack](https://opctl-slackin.herokuapp.com/badge.svg)](https://opctl-slackin.herokuapp.com/)
or [open an issue](https://github.com/opctl/sdk-react/issues)

# Releases

releases are versioned according to
[![semver 2.0.0](https://img.shields.io/badge/semver-2.0.0-brightgreen.svg)](http://semver.org/spec/v2.0.0.html)
and [tagged](https://git-scm.com/book/en/v2/Git-Basics-Tagging); see
[CHANGELOG.md](CHANGELOG.md) for release notes

# Contributing

see [CONTRIBUTING.md](CONTRIBUTING.md)
npm package: @opd/ava
Description: React component wrapper for AVA
Author: kagawagao
Latest version: 1.0.0

# AVA React

> React component wrapper for [`AVA`](https://github.com/antvis/AVA)

[![build](https://github.com/open-data-plan/ava-react/workflows/build/badge.svg)](https://github.com/open-data-plan/ava-react/actions?query=workflow%3Abuild)
[![npm](https://img.shields.io/npm/v/@opd/ava.svg)](https://www.npmjs.com/package/@opd/ava)
[![npm](https://img.shields.io/npm/dm/@opd/ava.svg)](https://www.npmjs.com/package/@opd/ava)
[![npm](https://img.shields.io/npm/l/@opd/ava.svg)](https://www.npmjs.com/package/@opd/ava)
[![codecov](https://codecov.io/gh/open-data-plan/ava-react/branch/master/graph/badge.svg)](https://codecov.io/gh/open-data-plan/ava-react)

## Install

```bash
npm install @opd/ava
```

## Usage

```tsx | pure
import React from 'react'
import AVAChart from '@opd/ava'

const data = [
  { field1: 'a', field2: 100 },
  { field1: 'b', field2: 300 },
  { field1: 'c', field2: 800 },
]

export default () => <AVAChart data={data} toolbar />
```

## Develop

```bash
npm install
npm run build
```
npm package: @opd/babel-preset-app
Description: babel preset used by react app in pangu
Author: kagawagao
Latest version: 1.13.6

# `@opd/babel-preset-app`

> babel preset used by react app in pangu

## Usage

```js
// babel.config.js
module.exports = {
  presets: ['@opd/babel-preset-app'],
}
```

## Features

- [x] `TypeScript`
- [x] `React`(include [`react-hot-loader`](https://github.com/gaearon/react-hot-loader))
- [x] `NODE_ENV`/`BABEL_ENV` support
  - [x] `development`: used in development mode
  - [x] `test`: used in test
  - [x] `production`: used in production mode
npm package: @opd/babel-preset-component
Description: babel preset used by react component in pangu
Author: kagawagao
Latest version: 1.13.6

# `@opd/babel-preset-component`

> babel preset used by react component in pangu

## Usage

```bash
npm i @opd/babel-preset-component -D
```

```json
{
  "presets": ["@opd/babel-preset-component"]
}
```

## Features

- [x] `TypeScript`
- [x] `React`
- [x] `NODE_ENV`/`BABEL_ENV` support
  - [x] `commonjs`: used in build commonjs modules
  - [x] `test`: used in test
  - [x] other: used default
npm package: @opd/babel-preset-lib
Description: babel preset used by ts lib in pangu
Author: kagawagao
Latest version: 1.13.6

# `@opd/babel-preset-lib`

> babel preset used by ts lib in pangu

## Usage

```bash
npm i @opd/babel-preset-lib -D
```

```json
{
  "presets": ["@opd/babel-preset-lib"]
}
```

## Features

- [x] `TypeScript`
- [x] `NODE_ENV`/`BABEL_ENV` support
  - [x] `commonjs`: used in build commonjs modules
  - [x] other: used default
npm package: @opd/crawler
Description: web crawler based on Puppeteer
Author: kagawagao
Latest version: 1.7.0

# crawler

> Web crawler based on [`Puppeteer`](https://github.com/GoogleChrome/puppeteer)

[![node (scoped)](https://img.shields.io/node/v/@opd/crawler.svg)](https://www.npmjs.com/package/@opd/crawler)
[![npm (scoped)](https://img.shields.io/npm/v/@opd/crawler.svg)](https://www.npmjs.com/package/@opd/crawler)
![build](https://github.com/open-data-plan/crawler/workflows/build/badge.svg)
[![Build Status](https://dev.azure.com/kagawagao/OPD/_apis/build/status/open-data-plan.crawler?branchName=master)](https://dev.azure.com/kagawagao/OPD/_build/latest?definitionId=3&branchName=master)
[![Coverage Status](https://coveralls.io/repos/github/open-data-plan/crawler/badge.svg?branch=master)](https://coveralls.io/github/open-data-plan/crawler?branch=master)

## Install

```bash
npm install @opd/crawler
```

## Use

```js
import Crawler from '@opd/crawler'
// or commonjs
const Crawler = require('@opd/crawler').default

const crawler = new Crawler(options)
```

## API

### `new Crawler(options)`

create crawler instance

`options`: crawler instance config

- `parallel`: maximum number of crawlers, default is `5`
- `pageEvaluate`: evaluate function on current page, see [`Puppeteer`](https://pptr.dev/#?product=Puppeteer&version=v1.18.1&show=api-pageevaluatepagefunction-args), **cannot support extra args now**

### `crawler.launch([options])`

launch browser use [`puppeteer.launch`](https://pptr.dev/#?product=Puppeteer&version=v1.18.1&show=api-puppeteerlaunchoptions)

### `crawler.queue(urls)`

add urls to crawler queue

> Note: check url **strictly**, means url must start with `https?`

### `crawler.start([urls]): PageResult[]`

start crawl page, if `urls` is presented, will call `crawler.queue` firstly.

```js
const result = await crawler.start()
console.log(result)

// [
//   {
//     url, // page url
//     result // crawled result
//   }
// ]
```

> Note: if you call `start` before `launch`, `browser` will also be launched, but with no extra launch options
npm package: @opd/create-pangu
Description: scaffold tool for pangu
Author: kagawagao
Latest version: 1.13.8

# `@opd/create-pangu`

> scaffold tool for pangu

## Usage

### Use `npm create` or `npm init` (**recommend**)

```bash
npm create pangu demo
# or
npm init pangu demo
```

### Use `npx`

```bash
npx @opd/create-pangu demo
```

### Use global package (**NOT** recommend)

```bash
npm i @opd/create-pangu -g
create-pangu demo
```
npm package: @opd/css-modules-typings-loader
Description: css modules typings loader for webpack
Author: kagawagao
Latest version: 1.4.1

# css-modules-typings-loader

> css modules typings loader for webpack, compatible with [`css-loader`](https://github.com/webpack-contrib/css-loader) `v4`

[![build](https://github.com/kagawagao/css-modules-typings-loader/workflows/build/badge.svg)](https://github.com/kagawagao/css-modules-typings-loader/actions?query=workflow%3Abuild)
[![npm](https://img.shields.io/npm/v/@opd/css-modules-typings-loader.svg)](https://www.npmjs.com/package/@opd/css-modules-typings-loader)
[![npm](https://img.shields.io/npm/l/@opd/css-modules-typings-loader.svg)](https://www.npmjs.com/package/@opd/css-modules-typings-loader)
[![codecov](https://codecov.io/gh/kagawagao/css-modules-typings-loader/branch/master/graph/badge.svg)](https://codecov.io/gh/kagawagao/css-modules-typings-loader)

## Install

```bash
npm i @opd/css-modules-typings-loader --save--dev
```

## Usage

```js
// webpack config
module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          {
            loader: '@opd/css-modules-typings-loader',
          },
          {
            loader: 'css-loader',
            options,
          },
        ],
      },
    ],
  },
}
```
npm package: @opd/eslint-config
Description: eslint config used by react app in pangu
Author: kagawagao
Latest version: 2.0.2

# `@opd/eslint-config`

> eslint config used by react app in pangu

## Usage

```bash
npm install @opd/eslint-config -D
```

```json
{
  "extends": ["@opd/eslint-config"]
}
```
npm package: @opd/eslint-config-javascript
Description: eslint config used by react app in pangu
Author: kagawagao
Latest version: 1.13.7

# `@opd/eslint-config-javascript`

> eslint config used by `JavaScript` react app in pangu

## Usage

```bash
npm install @opd/eslint-config-javascript -D
```

```json
{
  "extends": ["@opd/eslint-config-javascript"]
}
```
npm package: @opd/eslint-config-pangu
Description: eslint config used by react app in pangu
Author: kagawagao
Latest version: 1.14.0

# `@opd/eslint-config-pangu`

> eslint config used by react app in pangu

## Usage

```bash
npm install @opd/eslint-config-pangu -D
```

```json
{
  "extends": ["@opd/eslint-config-pangu"]
}
```
npm package: @opd/eslint-config-typescript
Description: eslint config used by react app in pangu
Author: kagawagao
Latest version: 1.13.7

# `@opd/eslint-config-typescript`

> eslint config used by `TypeScript` react app in pangu

## Usage

```bash
npm install @opd/eslint-config-typescript -D
```

```json
{
  "extends": ["@opd/eslint-config-typescript"]
}
```
npm package: @opd/g2plot-react
Description: G2Plot for React
Author: kagawagao
Latest version: 2.13.5

<p align="center">
<img src="./assets/logo.svg">
</p>

# @opd/g2plot-react

> [G2Plot](https://g2plot.antv.vision/) for React

[![Build Status](https://dev.azure.com/kagawagao/OPD/_apis/build/status/open-data-plan.g2plot-react?branchName=master)](https://dev.azure.com/kagawagao/OPD/_build/latest?definitionId=1&branchName=master)
[![build](https://github.com/open-data-plan/g2plot-react/workflows/build/badge.svg)](https://github.com/open-data-plan/g2plot-react/actions?query=workflow%3Abuild)
[![npm](https://img.shields.io/npm/v/@opd/g2plot-react.svg)](https://www.npmjs.com/package/@opd/g2plot-react)
[![npm](https://img.shields.io/npm/dm/@opd/g2plot-react.svg)](https://www.npmjs.com/package/@opd/g2plot-react)
[![npm](https://img.shields.io/npm/l/@opd/g2plot-react.svg)](https://www.npmjs.com/package/@opd/g2plot-react)
[![codecov](https://codecov.io/gh/open-data-plan/g2plot-react/branch/master/graph/badge.svg)](https://codecov.io/gh/open-data-plan/g2plot-react)
[![FOSSA Status](https://app.fossa.com/api/projects/git%2Bgithub.com%2Fopen-data-plan%2Fg2plot-react.svg?type=shield)](https://app.fossa.com/projects/git%2Bgithub.com%2Fopen-data-plan%2Fg2plot-react?ref=badge_shield)

## Install

```
npm install @opd/g2plot-react
```

## Usage

```tsx
import React, { useRef } from 'react'
import { LineChart, LineChartProps } from '@opd/g2plot-react'

const config: LineChartProps = {
  height: 350,
  autoFit: true,
  xField: 'year',
  yField: 'value',
  smooth: true,
  meta: {
    value: {
      max: 15,
    },
  },
  data: [
    { year: '1991', value: 3 },
    { year: '1992', value: 4 },
    { year: '1993', value: 3.5 },
    { year: '1994', value: 5 },
    { year: '1995', value: 4.9 },
    { year: '1996', value: 6 },
    { year: '1997', value: 7 },
    { year: '1998', value: 9 },
    { year: '1999', value: 11 },
  ],
}

export default () => {
  const chartRef = useRef()
  return <LineChart {...config} chartRef={chartRef} />
}
```

[![Edit g2plot-react-example](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/g2plot-react-example-xx3gp?fontsize=14&hidenavigation=1&theme=dark)

## API

All config defined in `G2Plot` [document](https://g2plot.antv.vision/zh/docs/manual/introduction) can be used as `props`

## Develop

```
npm install
npm run build
```


## License
[![FOSSA Status](https://app.fossa.com/api/projects/git%2Bgithub.com%2Fopen-data-plan%2Fg2plot-react.svg?type=large)](https://app.fossa.com/projects/git%2Bgithub.com%2Fopen-data-plan%2Fg2plot-react?ref=badge_large)
npm package: @opd/gbt2260
Description: latest Chinese administrative divisions
Author: kagawagao
Latest version: 2.1.3-202312

# GBT2260

[![gbt/2260](https://img.shields.io/static/v1?label=GB/T&message=2260&color=brightgreen)](http://www.gb688.cn/bzgk/gb/newGbInfo?hcno=C9C488FD717AFDCD52157F41C3302C6D)
[![node](https://img.shields.io/node/v/@opd/gbt2260.svg)](https://www.npmjs.com/package/@opd/gbt2260)
[![npm](https://img.shields.io/npm/v/@opd/gbt2260.svg)](https://www.npmjs.com/package/@opd/gbt2260)
[![license](https://img.shields.io/npm/l/@opd/gbt2260.svg)](https://github.com/open-data-plan/gbt2260/blob/master/LICENSE)
[![Build Status](https://travis-ci.org/open-data-plan/gbt2260.svg?branch=master)](https://travis-ci.org/open-data-plan/gbt2260)
[![Standard - JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](http://standardjs.com/)
[![Coverage Status](https://coveralls.io/repos/github/open-data-plan/gbt2260/badge.svg?branch=master)](https://coveralls.io/github/open-data-plan/gbt2260?branch=master)
[![Known Vulnerabilities](https://snyk.io/test/github/open-data-plan/gbt2260/badge.svg?targetFile=package.json)](https://snyk.io/test/github/open-data-plan/gbt2260?targetFile=package.json)

> latest Chinese administrative divisions from [`MCA`](https://www.mca.gov.cn/n156/n2679/index.html), and based on [`gb2260`](https://github.com/cn/GB2260.js)

## Install

```bash
npm i @opd/gbt2260
```

## Use

```js
const gbt2260 = require('@opd/gbt2260')
```

### API

- `gbt2260.provinces()`: 获取省级行政区划
- `gbt2260.prefectures()`: 获取市级行政区划，若为直辖市，则返回辖区
- `gbt2260.counties()`: 获取县级行政区划

## Crawl Data

```bash
npm run generate
```

### Difference with [`gb2260`](https://github.com/cn/GB2260.js)

1. `gb2260` looks like a dead project, no one in maintain
2. rewrite `prefectures()`
npm package: @opd/pangu
Description: develop tool for pangu project
Author: kagawagao
Latest version: 1.13.8

# `@opd/pangu`

> pangu devtools for ui engine

## Usage

- Install

  ```bash
  npm i @opd/pangu --dev
  # help
  pangu --help
  ```

- Local Develop

  ```bash
  pangu dev
  # help
  pangu dev --help
  ```

- Build

  ```bash
  pangu build
  # help
  pangu build --help
  ```

## Custom `Webpack` Config

- Function

  ```js
  // webpack.config.js
  module.exports = function (config) {
    // update config
    return config
  }
  ```

- Object

  ```js
  // webpack.config.js
  module.exports = {
    // your config
  }
  ```

  config will be merged by [`webpack-merge`](https://github.com/survivejs/webpack-merge)

## App Config

you can use `app.json` to customize app config

```json
{
  "appName": "App Name"
}
```

### Fields

- `appName`: `document.title` and `process.env.APP_NAME`

## Theme

you can use `theme.json` to customize app theme

- Support `extends`
- Support all `Ant Design` theme variables

```json
{
  "extends": "@ant-design/dark-theme",
  "primary-color": "#1890ff"
}
```

## Environment Variables

### Build Time

- `process.env.NODE_ENV`: `development`/`production`
- `process.env.PORT`: Dev Server Port
- `process.env.HOST`: Dev Server Host

### Run Time

- `process.env.APP_NAME`: APP Name
- `process.env.APP_ENV`:
  - `development`: `0`
  - `test`: `1`
  - `preproduction`: `2`
  - `production`: `3`
- `process.env.NODE_ENV`: `development`/`production`

## Mock Server

> Based on [`json-server`](https://github.com/typicode/json-server)

you can use `mocks/db.json` to setup mock server, see [`json-server`](https://github.com/typicode/json-server) for more
npm package: @opd/prettier-config
Description: prettier config used by react app in pangu
Author: kagawagao
Latest version: 2.0.0

# `@opd/prettier-config`

> prettier config used by react app in pangu

## Usage

```bash
npm install @opd/prettier-config -D
```

add `prettier` field in `package.json`

```json
{
  "prettier": "@opd/prettier-config"
}
```
npm package: @opd/prettier-config-pangu
Description: prettier config used by react app in pangu
Author: kagawagao
Latest version: 1.14.0

# `@opd/prettier-config-pangu`

> prettier config used by react app in pangu

## Usage

```bash
npm install @opd/prettier-config-pangu -D
```

add `prettier` field in `package.json`

```json
{
  "prettier": "@opd/prettier-config-pangu"
}
```
npm package: @opd/schema-form
Description: use Ant Design Form with schema
Author: kagawagao
Latest version: 1.0.1

# @opd/schema-form

> schema form based on antd

## Install

```bash
npm i @opd/schema-form
```

## Usage

```jsx
import React from 'react'
import SchemaForm from '@opd/schema-form'

export default () => <SchemaForm fieldItems={[]} />
```

## Develop

```bash
npm install
npm run build
```
npm package: @opdb/base
Description: OpDB Base Classes
Author: OpDB / Marvin Scharle
Latest version: 0.0.3

# @opdb/base

This is an abstraction layer for database connections, connection and transaction handling.

The package contains two major things:

1. Base classes to coordinate database connections
2. Interfaces to implement database drivers

## Base Classes

### Base

Main class. Maintains a connection to a database connection pool. 

To execute an SQL query run this:

```typescript
import { Base } from '@opdb/base';

// Returns Promise<any[]>, representing any line that shall be returned.
Base.execute(`SELECT * FROM users`);

// You can supply an interface to have a type-safe response.
Base.execute<{id: string, username: string}>(`SELECT * FROM users`);

// You can use placeholders to escape your SQL query. The placeholders will be replaced correctly
// for each database adapter automatically.
// This will run the SQL query `SELECT * FROM users WHERE id = 1`
Base.execute<{id: string, username: string}>(`SELECT * FROM users WHERE id = $id`, {id: 1});
```

To start a new transaction run this:

```typescript
import { Base } from '@opdb/base';

// Method `transaction` accepts a block. Any statement within the block is run inside the transaction
// This example will run the following SQL statements:
// - BEGIN;
// - UPDATE users SET username = `marc` WHERE id = 1;
// - COMMIT;
Base.transaction(async () => {
  await Base.execute(`UPDATE users SET username = $username WHERE id = $id`, {
    id: 1,
    username: 'marc',
  });
});

// If any exception occurs during the transaction, the transaction will be rolled back.
// This example will run the following SQL statements:
// - BEGIN
// - UPDATE users SET username = `marc` WHERE id = 1;
// - ROLLBACK;
Base.transaction(async () => {
  await Base.execute(`UPDATE users SET username = $username WHERE id = $id`, {
    id: 1,
    username: 'marc',
  });
  throw new Error();
});
```

### ConnectionPool

This class manages a pool of database connections. The connections themselves are managed by the database adapters.

To register a new adapter run this:

```typescript
import { ConnectionPool, DatabaseAdapter } from '@opdb/base';

class FancyDatabaseAdapter implements DatabaseAdapter {
  // Custom Implementation here
}

ConnectionPool.registerAdapter(FancyDatabaseAdapter);
```

To connect a given database adapter run this:

```typescript
import { Base } from '@opdb/base';

Base.connectionPool.connect({
  adapter: 'fancy-adapter',
  // Adapter specific config
});
```

To get a database connection from the connection pool, use this method:

```typescript
import { Base } from '@opdb/base';

// This will return a Promise<DatabaseClient> which will handle the database connection.
Base.connectionPool.getConnection();
```

## Important Notes
@opdb/base uses [zone.js](https://github.com/angular/angular/tree/master/packages/zone.js) for handling transactions.

At the moment, zone.js is unable to use native node async/await.

Therefore, you should use TypeScript or Babel to compile your code in ES2015.
npm package: @opdb/mysql
Description: OpDB MySQL Adapter
Author: OpDB / Marvin Scharle
Latest version: 0.0.3

# @opdb/mysql

This is an adapter for `@opdb/base` for connecting to MySQL servers.

Run this to register and setup your MySQL connection:

```typescript
import { Base } from '@opdb/base';
import { provideMysqlConnection } from '@opdb/mysql';

provideMysqlConnection({
  // your MySQL config here
  // You can supply your connection url using field `url`.
  // Config options: https://github.com/mysqljs/mysql#connection-options
});

// Will be executed using your MySQL connection, see @opdb/base for more details
Base.execute('SELECT * FROM users');
```

## More Information

- [@opdb/base](https://www.npmjs.com/package/@opdb/base)
- [MySQL connection options](https://github.com/mysqljs/mysql#connection-options)
npm package: @opdb/postgres
Description: OpDB PostrgeSQL Adapter
Author: OpDB / Marvin Scharle
Latest version: 0.0.3

# @opdb/postgres

This is an adapter for `@opdb/base` for connecting to PostgreSQL servers.

Run this to register and setup your PostgreSQL connection:

```typescript
import { Base } from '@opdb/base';
import { providePostgresConnection } from '@opdb/postgres';

providePostgresConnection({
  // your PostgreSQL config here
  // Config options: https://node-postgres.com/api/client, https://node-postgres.com/api/pool
});

// Will be executed using your PostgreSQL connection, see @opdb/base for more details
Base.execute('SELECT * FROM users');
```

## More Information

- [@opdb/base](https://www.npmjs.com/package/@opdb/base)
- [pg.Client](https://node-postgres.com/api/client)
- [pg.Pool](https://node-postgres.com/api/pool)
npm package: @opdev1004/cssfactory
Description: Simple CSS Library Generation Tool
Author: Victor Chanil Park
Latest version: 0.0.5
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# 🏭 CSS Factory

Simple CSS Library Generation Tool

## 🤔 Background

Building CSS libaray is bothersome. So I have built this tool to provide CSS libraries development environment. Just put css files in directories and build with configuration. The most simple way to build CSS library!

## 📢 Notice

### 👍 Releasing 0.0.1

Have a look at test directory of repo for use.

## ▶️ Installation

Install with a boilerplate project

```
npm create cssfactory@latest
```

Manually using it from your project:

```
npm i @opdev1004/cssfactory@latest
```

or

```
npm i -D @opdev1004/cssfactory@latest
```

## 📖 Example

cssfactory-config.json:

```
{
  "main": {
    "rootDirs": ["./src/common", "./src/pages"],
    "outDir": "./dist/",
    "includeChildDir": false
  },
  "theme": {
    "rootDirs": ["./src/themes/dark", "./src/themes/light"],
    "outDir": "./dist/",
    "includeChildDir": true
  }
}
```

index.ts:

```
import { CSSFactory } from "cssfactory";
import * as path from "path";

const configpath = path.resolve(__dirname, "./cssfactory-config.json");
const cssfactory = new CSSFactory(configpath);
cssfactory.combineCSS();
```

node.js:

```
const CSSFactory = require("cssfactory");
const path = require("path");

const configpath = path.resolve(__dirname, "./cssfactory-config.json");

const cssfactory = new CSSFactory.CSSFactory(configpath);
cssfactory.combineCSS();

```

## 💪 Support CSS Factory!

### 👼 Become a Sponsor

- [Ko-fi](https://ko-fi.com/opdev1004)
- [Github sponsor page](https://github.com/sponsors/opdev1004)

## 👨‍💻 Author

[Victor Chanil Park](https://github.com/opdev1004)

## 💯 License

MIT, See [LICENSE](./LICENSE).