├── .browserslistrc ├── .changeset └── config.json ├── .codesandbox └── ci.json ├── .commitlintrc ├── .editorconfig ├── .eslintignore ├── .eslintrc.cjs ├── .github └── workflows │ ├── ci.yml │ ├── codeql.yml │ ├── release.yml │ └── size-limit.yml ├── .gitignore ├── .lintstagedrc.cjs ├── .npmrc ├── .nvmrc ├── .postcssrc.cjs ├── .prettierignore ├── .prettierrc ├── .remarkrc ├── .renovaterc ├── .simple-git-hooks.cjs ├── .stylelintignore ├── .stylelintrc ├── CHANGELOG.md ├── LICENSE ├── README.md ├── auto-imports.d.ts ├── docs ├── App.tsx ├── components │ ├── ReactQrcodeDemo.tsx │ ├── ReactQriousDemo.tsx │ ├── code.tsx │ ├── index.ts │ └── react-rx │ │ ├── index.tsx │ │ └── store.ts ├── global.scss ├── index.tsx ├── tsconfig.json └── types.ts ├── index.html ├── package.json ├── packages ├── @react-enhanced │ ├── eslint-plugin │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ └── tsconfig.json │ ├── hooks │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── shim.d.ts │ │ ├── src │ │ │ ├── api.ts │ │ │ ├── computed.ts │ │ │ ├── constant.ts │ │ │ ├── helper.ts │ │ │ ├── index.ts │ │ │ ├── lifecycle.ts │ │ │ ├── observable.ts │ │ │ ├── promise.ts │ │ │ ├── storage.ts │ │ │ ├── timer.ts │ │ │ └── types.ts │ │ ├── test │ │ │ ├── api.spec.ts │ │ │ └── storage.spec.ts │ │ └── tsconfig.json │ ├── plugins │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── src │ │ │ └── index.ts │ │ └── tsconfig.json │ ├── shared │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── src │ │ │ ├── constant.ts │ │ │ ├── http.ts │ │ │ ├── index.ts │ │ │ └── timer.ts │ │ └── tsconfig.json │ ├── translate │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── shim.d.ts │ │ ├── src │ │ │ ├── component.tsx │ │ │ ├── constants.ts │ │ │ ├── context.ts │ │ │ ├── helpers.ts │ │ │ ├── hook.ts │ │ │ ├── index.ts │ │ │ └── types.ts │ │ └── tsconfig.json │ ├── types │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── src │ │ │ ├── builtin.ts │ │ │ ├── context.ts │ │ │ ├── error.ts │ │ │ ├── helper.ts │ │ │ └── index.ts │ │ └── tsconfig.json │ └── utils │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── src │ │ ├── constant.ts │ │ ├── header.ts │ │ ├── helper.ts │ │ ├── index.ts │ │ ├── number.ts │ │ ├── object.ts │ │ ├── observe-dom.ts │ │ ├── operator.ts │ │ ├── promise.ts │ │ ├── storage.ts │ │ └── url.ts │ │ └── tsconfig.json ├── react-qrcode │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── src │ │ ├── index.ts │ │ ├── qrcode.ts │ │ ├── types.ts │ │ └── use-qrcode.ts │ └── tsconfig.json └── react-qrious │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── qrious.d.ts │ ├── src │ ├── QRious.ts │ ├── index.ts │ └── use-qrious.ts │ ├── tsconfig.json │ └── typings.d.ts ├── pnpm-lock.yaml ├── pnpm-workspace.yaml ├── tsconfig.base.json ├── tsconfig.json ├── vercel.json ├── vite.config.ts └── vitest.config.ts /.browserslistrc: -------------------------------------------------------------------------------- 1 | extends @1stg/browserslist-config/modern 2 | -------------------------------------------------------------------------------- /.changeset/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://unpkg.com/@changesets/config/schema.json", 3 | "changelog": [ 4 | "@changesets/changelog-github", 5 | { 6 | "repo": "rx-ts/react" 7 | } 8 | ], 9 | "commit": false, 10 | "linked": [], 11 | "access": "restricted", 12 | "baseBranch": "master", 13 | "updateInternalDependencies": "minor", 14 | "ignore": [] 15 | } 16 | -------------------------------------------------------------------------------- /.codesandbox/ci.json: -------------------------------------------------------------------------------- 1 | { 2 | "node": "16", 3 | "installCommand": "codesandbox:install", 4 | "sandboxes": [] 5 | } 6 | -------------------------------------------------------------------------------- /.commitlintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "@1stg" 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = space 5 | indent_size = 2 6 | tab_width = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | coverage 2 | dist 3 | lib 4 | packages/*/CHANGELOG.md 5 | /auto-imports.d.ts 6 | /pnpm-lock.yaml 7 | !/.github 8 | !/.*.js 9 | -------------------------------------------------------------------------------- /.eslintrc.cjs: -------------------------------------------------------------------------------- 1 | const { getGlobals } = require('eslint-plugin-mdx') 2 | 3 | module.exports = { 4 | root: true, 5 | extends: '@1stg', 6 | rules: { 7 | 'react/react-in-jsx-scope': 'off', 8 | }, 9 | overrides: [ 10 | { 11 | files: 'packages/**/README.md', 12 | extends: 'plugin:mdx/overrides', 13 | globals: getGlobals(['ReactQriousDemo', 'ReactQrcodeDemo']), 14 | parserOptions: { 15 | extensions: '.md', 16 | }, 17 | }, 18 | ], 19 | } 20 | -------------------------------------------------------------------------------- /.github/workflows/ci.yml: -------------------------------------------------------------------------------- 1 | name: CI 2 | 3 | on: 4 | - push 5 | - pull_request 6 | 7 | jobs: 8 | ci: 9 | name: Lint and Test with Node.js ${{ matrix.node }} 10 | strategy: 11 | matrix: 12 | node: 13 | - 16 14 | - 18 15 | runs-on: ubuntu-latest 16 | steps: 17 | - name: Checkout Repo 18 | uses: actions/checkout@v3 19 | 20 | - name: Setup pnpm 21 | uses: pnpm/action-setup@v2 22 | with: 23 | version: latest 24 | 25 | - name: Setup Node.js ${{ matrix.node }} 26 | uses: actions/setup-node@v3 27 | with: 28 | node-version: ${{ matrix.node }} 29 | cache: pnpm 30 | 31 | - name: Install Dependencies 32 | run: pnpm i 33 | 34 | - name: Build, Lint and Test 35 | run: pnpm run-s build lint test 36 | env: 37 | EFF_NO_LINK_RULES: true 38 | PARSER_NO_WATCH: true 39 | 40 | - name: Codecov 41 | uses: codecov/codecov-action@v3 42 | -------------------------------------------------------------------------------- /.github/workflows/codeql.yml: -------------------------------------------------------------------------------- 1 | name: 'CodeQL' 2 | 3 | on: 4 | push: 5 | branches: ['master'] 6 | pull_request: 7 | branches: ['master'] 8 | schedule: 9 | - cron: '28 6 * * 1' 10 | 11 | jobs: 12 | analyze: 13 | name: Analyze 14 | runs-on: ubuntu-latest 15 | permissions: 16 | actions: read 17 | contents: read 18 | security-events: write 19 | 20 | strategy: 21 | fail-fast: false 22 | matrix: 23 | language: [javascript] 24 | 25 | steps: 26 | - name: Checkout 27 | uses: actions/checkout@v3 28 | 29 | - name: Initialize CodeQL 30 | uses: github/codeql-action/init@v2 31 | with: 32 | languages: ${{ matrix.language }} 33 | queries: +security-and-quality 34 | 35 | - name: Autobuild 36 | uses: github/codeql-action/autobuild@v2 37 | 38 | - name: Perform CodeQL Analysis 39 | uses: github/codeql-action/analyze@v2 40 | with: 41 | category: '/language:${{ matrix.language }}' 42 | -------------------------------------------------------------------------------- /.github/workflows/release.yml: -------------------------------------------------------------------------------- 1 | name: Release 2 | 3 | on: 4 | push: 5 | branches: 6 | - master 7 | 8 | jobs: 9 | release: 10 | name: Release 11 | runs-on: ubuntu-latest 12 | steps: 13 | - name: Checkout Repo 14 | uses: actions/checkout@v3 15 | with: 16 | # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits 17 | fetch-depth: 0 18 | 19 | - name: Setup pnpm 20 | uses: pnpm/action-setup@v2 21 | with: 22 | version: latest 23 | 24 | - name: Setup Node.js 16 25 | uses: actions/setup-node@v3 26 | with: 27 | node-version: 16 28 | cache: pnpm 29 | 30 | - name: Install Dependencies 31 | run: pnpm i 32 | 33 | - name: Create Release Pull Request or Publish to npm 34 | id: changesets 35 | uses: changesets/action@v1 36 | with: 37 | publish: pnpm release 38 | version: pnpm run version 39 | commit: 'chore: release package(s)' 40 | title: 'chore: release package(s)' 41 | env: 42 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 43 | NPM_TOKEN: ${{ secrets.NPM_TOKEN }} 44 | -------------------------------------------------------------------------------- /.github/workflows/size-limit.yml: -------------------------------------------------------------------------------- 1 | name: Size Limit 2 | 3 | on: 4 | pull_request: 5 | branches: 6 | - master 7 | 8 | jobs: 9 | size-limit: 10 | runs-on: ubuntu-latest 11 | steps: 12 | - uses: actions/checkout@v3 13 | 14 | - name: Setup pnpm 15 | uses: pnpm/action-setup@v2 16 | with: 17 | version: latest 18 | 19 | - name: Setup Node.js 16 20 | uses: actions/setup-node@v3 21 | with: 22 | node-version: 16 23 | cache: pnpm 24 | 25 | - name: Install Dependencies 26 | run: pnpm i 27 | 28 | - uses: andresz1/size-limit-action@v1 29 | with: 30 | github_token: ${{ secrets.GITHUB_TOKEN }} 31 | skip_step: install 32 | script: pnpm size-limit --json 33 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | *.log 2 | *.tsbuildinfo 3 | .*cache 4 | .type-coverage 5 | .vercel 6 | coverage 7 | dist 8 | lib 9 | node_modules 10 | -------------------------------------------------------------------------------- /.lintstagedrc.cjs: -------------------------------------------------------------------------------- 1 | module.exports = require('@1stg/lint-staged/tsc') 2 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | auto-install-peers=true 2 | enable-pre-post-scripts=true 3 | prefer-workspace-packages=true 4 | public-hoist-pattern[]=@1stg/* 5 | public-hoist-pattern[]=@commitlint/* 6 | public-hoist-pattern[]=@pkgr/* 7 | public-hoist-pattern[]=@size-limit/* 8 | public-hoist-pattern[]=@types/* 9 | public-hoist-pattern[]=cross-env 10 | public-hoist-pattern[]=core-js 11 | public-hoist-pattern[]=*eslint* 12 | public-hoist-pattern[]=lint-staged 13 | public-hoist-pattern[]=*/loader 14 | public-hoist-pattern[]=*-loader 15 | public-hoist-pattern[]=npm-run-all 16 | public-hoist-pattern[]=*prettier* 17 | public-hoist-pattern[]=simple-git-hooks 18 | public-hoist-pattern[]=*stylelint* 19 | public-hoist-pattern[]=tslib 20 | strict-peer-dependencies=false 21 | -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | lts/* 2 | -------------------------------------------------------------------------------- /.postcssrc.cjs: -------------------------------------------------------------------------------- 1 | module.exports = require('@1stg/postcss-config')() 2 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | coverage 2 | dist 3 | /auto-imports.d.ts 4 | /pnpm-lock.yaml 5 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | "@1stg/prettier-config" 2 | -------------------------------------------------------------------------------- /.remarkrc: -------------------------------------------------------------------------------- 1 | { 2 | "plugins": [ 3 | "@1stg/preset" 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /.renovaterc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "github>1stG/configs" 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /.simple-git-hooks.cjs: -------------------------------------------------------------------------------- 1 | module.exports = require('@1stg/simple-git-hooks') 2 | -------------------------------------------------------------------------------- /.stylelintignore: -------------------------------------------------------------------------------- 1 | coverage 2 | dist 3 | lib 4 | LICENSE 5 | *.json 6 | *.log 7 | *.patch 8 | *.ts 9 | *.tsbuildinfo 10 | *.tsx 11 | *.yaml 12 | *.yml 13 | -------------------------------------------------------------------------------- /.stylelintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "@1stg/stylelint-config" 3 | } 4 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | - [@react-enhanced/eslint-plugin](./packages/@react-enhanced/eslint-plugin/CHANGELOG.md) 7 | - [@react-enhanced/hooks](./packages/@react-enhanced/hooks/CHANGELOG.md) 8 | - [@react-enhanced/plugins](./packages/@react-enhanced/plugins/CHANGELOG.md) 9 | - [@react-enhanced/shared](./packages/@react-enhanced/shared/CHANGELOG.md) 10 | - [@react-enhanced/translate](./packages/@react-enhanced/translate/CHANGELOG.md) 11 | - [@react-enhanced/types](./packages/@react-enhanced/types/CHANGELOG.md) 12 | - [@react-enhanced/utils](./packages/@react-enhanced/utils/CHANGELOG.md) 13 | - [react-qrcode](./packages/react-qrcode/CHANGELOG.md) 14 | - [react-qrious](./packages/react-qrious/CHANGELOG.md) 15 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017-present JounQin 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 |

12 | 13 | [![GitHub Actions](https://github.com/rx-ts/react/workflows/CI/badge.svg)](https://github.com/rx-ts/react/actions/workflows/ci.yml) 14 | [![type-coverage](https://img.shields.io/badge/dynamic/json.svg?label=type-coverage&prefix=%E2%89%A5&suffix=%&query=$.typeCoverage.atLeast&uri=https%3A%2F%2Fraw.githubusercontent.com%2Frx-ts%2Freact%2Fmaster%2Fpackage.json)](https://github.com/plantain-00/type-coverage) 15 | [![GitHub release](https://img.shields.io/github/release/rx-ts/react)](https://github.com/rx-ts/react/releases) 16 | 17 | [![Conventional Commits](https://img.shields.io/badge/conventional%20commits-1.0.0-yellow.svg)](https://conventionalcommits.org) 18 | [![Renovate enabled](https://img.shields.io/badge/renovate-enabled-brightgreen.svg)](https://renovatebot.com) 19 | [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com) 20 | [![Code Style: Prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier) 21 | [![changesets](https://img.shields.io/badge/maintained%20with-changesets-176de3.svg)](https://github.com/changesets/changesets) 22 | 23 | > Make [React][] greater with [RxTS][] 24 | 25 | ## TOC 26 | 27 | - [Homepage](#homepage) 28 | - [Packages](#packages) 29 | - [Install](#install) 30 | - [Sponsors](#sponsors) 31 | - [Backers](#backers) 32 | - [Changelog](#changelog) 33 | - [License](#license) 34 | 35 | ## Homepage 36 | 37 | react-rx 38 | 39 | ## Packages 40 | 41 | This repository is a monorepo managed by [changesets][] what means we actually publish several packages to npm from same codebase, including: 42 | 43 | | Package | Description | Version | 44 | | -------------------------------------------------------------------------- | ----------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | 45 | | [`@react-enhanced/eslint-plugin`](/packages/@react-enhanced/eslint-plugin) | An incredible ESLint plugin for @react-enhanced Hooks | [![npm](https://img.shields.io/npm/v/@react-enhanced/eslint-plugin.svg)](https://www.npmjs.com/package/@react-enhanced/eslint-plugin) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/@react-enhanced/eslint-plugin) | 46 | | [`@react-enhanced/hooks`](/packages/@react-enhanced/hooks) | 🔥 Enhanced React Hooks | [![npm](https://img.shields.io/npm/v/@react-enhanced/hooks.svg)](https://www.npmjs.com/package/@react-enhanced/hooks) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/@react-enhanced/hooks) | 47 | | [`@react-enhanced/plugins`](/packages/@react-enhanced/plugins) | 🔥 Enhanced React Plugins | [![npm](https://img.shields.io/npm/v/@react-enhanced/plugins.svg)](https://www.npmjs.com/package/@react-enhanced/plugins) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/@react-enhanced/plugins) | 48 | | [`@react-enhanced/shared`](/packages/@react-enhanced/shared) | 🔥 Enhanced React Shared codes between sever and client | [![npm](https://img.shields.io/npm/v/@react-enhanced/shared.svg)](https://www.npmjs.com/package/@react-enhanced/shared) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/@react-enhanced/shared) | 49 | | [`@react-enhanced/translate`](/packages/@react-enhanced/translate) | 🔥 Enhanced React Translate Plugin | [![npm](https://img.shields.io/npm/v/@react-enhanced/translate.svg)](https://www.npmjs.com/package/@react-enhanced/translate) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/@react-enhanced/translate) | 50 | | [`@react-enhanced/types`](/packages/@react-enhanced/types) | 🔥 Enhanced React Types | [![npm](https://img.shields.io/npm/v/@react-enhanced/types.svg)](https://www.npmjs.com/package/@react-enhanced/types) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/@react-enhanced/types) | 51 | | [`@react-enhanced/utils`](/packages/@react-enhanced/utils) | 🔥 Enhanced React Utils | [![npm](https://img.shields.io/npm/v/@react-enhanced/utils.svg)](https://www.npmjs.com/package/@react-enhanced/utils) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/@react-enhanced/utils) | 52 | | [`react-qrcode`](/packages/react-qrcode) | 🤳 A React component for QR code generation with [qrcode][] | [![npm](https://img.shields.io/npm/v/react-qrcode.svg)](https://www.npmjs.com/package/react-qrcode) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/react-qrcode) | 53 | | [`react-qrious`](/packages/react-qrious) | 🤳 A React component for QR code generation with [qrious][] | [![npm](https://img.shields.io/npm/v/react-qrious.svg)](https://www.npmjs.com/package/react-qrious) [![View changelog](https://img.shields.io/badge/changelog-explore-brightgreen)](https://changelogs.xyz/react-qrious) | 54 | 55 | ## Install 56 | 57 | ```sh 58 | # yarn 59 | yarn add @react-enhanced/{hooks,plugins} react-{qrcode,qrious} 60 | 61 | # pnpm 62 | pnpm add @react-enhanced/{hooks,plugins} react-{qrcode,qrious} 63 | 64 | # npm 65 | npm i @react-enhanced/{hooks,plugins} react-{qrcode,qrious} 66 | ``` 67 | 68 | ## Sponsors 69 | 70 | | 1stG | RxTS | UnTS | 71 | | ---------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | 72 | | [![1stG Open Collective backers and sponsors](https://opencollective.com/1stG/organizations.svg)](https://opencollective.com/1stG) | [![RxTS Open Collective backers and sponsors](https://opencollective.com/rxts/organizations.svg)](https://opencollective.com/rxts) | [![UnTS Open Collective backers and sponsors](https://opencollective.com/unts/organizations.svg)](https://opencollective.com/unts) | 73 | 74 | ## Backers 75 | 76 | | 1stG | RxTS | UnTS | 77 | | -------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- | 78 | | [![1stG Open Collective backers and sponsors](https://opencollective.com/1stG/individuals.svg)](https://opencollective.com/1stG) | [![RxTS Open Collective backers and sponsors](https://opencollective.com/rxts/individuals.svg)](https://opencollective.com/rxts) | [![UnTS Open Collective backers and sponsors](https://opencollective.com/unts/individuals.svg)](https://opencollective.com/unts) | 79 | 80 | ## Changelog 81 | 82 | Detailed changes for each release are documented in [CHANGELOG.md](./CHANGELOG.md). 83 | 84 | ## License 85 | 86 | [MIT][] © [JounQin][]@[1stG.me][] 87 | 88 | [1stg.me]: https://www.1stg.me 89 | [changesets]: https://github.com/changesets/changesets 90 | [jounqin]: https://GitHub.com/JounQin 91 | [mit]: http://opensource.org/licenses/MIT 92 | [qrcode]: https://github.com/soldair/node-qrcode 93 | [qrious]: https://github.com/neocotic/qrious 94 | [react]: https://reactjs.org 95 | [rxts]: https://rxjs.dev 96 | -------------------------------------------------------------------------------- /auto-imports.d.ts: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | /* prettier-ignore */ 3 | // @ts-nocheck 4 | // Generated by unplugin-auto-import 5 | export {} 6 | declare global { 7 | const afterAll: typeof import('vitest')['afterAll'] 8 | const afterEach: typeof import('vitest')['afterEach'] 9 | const assert: typeof import('vitest')['assert'] 10 | const beforeAll: typeof import('vitest')['beforeAll'] 11 | const beforeEach: typeof import('vitest')['beforeEach'] 12 | const chai: typeof import('vitest')['chai'] 13 | const describe: typeof import('vitest')['describe'] 14 | const expect: typeof import('vitest')['expect'] 15 | const it: typeof import('vitest')['it'] 16 | const suite: typeof import('vitest')['suite'] 17 | const test: typeof import('vitest')['test'] 18 | const vi: typeof import('vitest')['vi'] 19 | const vitest: typeof import('vitest')['vitest'] 20 | } 21 | -------------------------------------------------------------------------------- /docs/App.tsx: -------------------------------------------------------------------------------- 1 | import { lazy, Suspense } from 'react' 2 | import { 3 | BrowserRouter as Router, 4 | Navigate, 5 | Route, 6 | Routes, 7 | useParams, 8 | } from 'react-router-dom' 9 | 10 | import 'github-markdown-css' 11 | import './global.scss' 12 | 13 | import { ReactRxDemo } from './components' 14 | 15 | const Readme = () => { 16 | const { pkgName, name } = useParams<'name' | 'pkgName'>() 17 | const Readme = lazy(() => 18 | // eslint-disable-next-line @typescript-eslint/no-unsafe-return 19 | pkgName 20 | ? import(`../packages/@react-enhanced/${pkgName}/README.md`) 21 | : name 22 | ? import(`../packages/${name}/README.md`) 23 | : import('../README.md'), 24 | ) 25 | return ( 26 | 27 | 28 | 29 | ) 30 | } 31 | 32 | const Changelog = () => { 33 | const { pkgName, name } = useParams<'name' | 'pkgName'>() 34 | const Changelog = lazy(() => 35 | // eslint-disable-next-line @typescript-eslint/no-unsafe-return 36 | pkgName 37 | ? import(`../packages/@react-enhanced/${pkgName}/CHANGELOG.md`) 38 | : name 39 | ? import(`../packages/${name}/CHANGELOG.md`) 40 | : import('../CHANGELOG.md'), 41 | ) 42 | return ( 43 | 44 | 45 | 46 | ) 47 | } 48 | 49 | export const App = () => ( 50 | 51 | 52 | } 55 | > 56 | } 59 | /> 60 | } 63 | /> 64 | } 67 | /> 68 | } 71 | /> 72 | } 75 | /> 76 | } 79 | /> 80 | } 83 | > 84 | 85 | 86 | ) 87 | -------------------------------------------------------------------------------- /docs/components/ReactQrcodeDemo.tsx: -------------------------------------------------------------------------------- 1 | import { get, merge, set } from 'lodash' 2 | import { FC, useState } from 'react' 3 | 4 | import { ChangeEvent } from '../types' 5 | 6 | import { 7 | LEVELS, 8 | MASK_PATTERNS, 9 | MODES, 10 | MaskPattern, 11 | QRCode, 12 | QRCodeProps, 13 | QRCodeSegment, 14 | TYPES, 15 | } from 'react-qrcode' 16 | 17 | const DEFAULT_TEXT = 'https://www.1stg.me' 18 | 19 | export type FormModel = Omit< 20 | QRCodeProps, 21 | 'maskPattern' | 'version' | 'width' 22 | > & { 23 | manualMode?: boolean 24 | maskPattern?: MaskPattern | '' 25 | width?: number | '' 26 | version?: number | '' 27 | } 28 | 29 | export const ReactQrcodeDemo: FC = () => { 30 | const [{ manualMode, ...options }, setState] = useState({ 31 | version: '', 32 | errorCorrectionLevel: 'M', 33 | maskPattern: '', 34 | margin: 4, 35 | scale: 4, 36 | color: { 37 | dark: '#000000', 38 | light: '#ffffff', 39 | }, 40 | type: 'image/png', 41 | quality: 0.92, 42 | width: '', 43 | value: DEFAULT_TEXT, 44 | }) 45 | 46 | const setOptions = (newOptions: Partial) => 47 | setState(oldOptions => merge({}, oldOptions, newOptions)) 48 | 49 | const fieldProps = (name: string, onChange?: (value: unknown) => void) => { 50 | const defaultOnChange = (e: ChangeEvent) => { 51 | const { type, value } = e.currentTarget 52 | setOptions( 53 | set( 54 | {}, 55 | name, 56 | type === 'number' 57 | ? value.trim() === '' 58 | ? '' 59 | : Number.parseFloat(value) 60 | : value, 61 | ), 62 | ) 63 | } 64 | return { 65 | onChange(e: ChangeEvent) { 66 | if (onChange) { 67 | onChange(e.currentTarget.value) 68 | } else { 69 | defaultOnChange(e) 70 | } 71 | }, 72 | value: get(options, name) as number | string, 73 | } 74 | } 75 | 76 | return ( 77 |
78 |
    79 |
  • 80 | 81 | 91 |
  • 92 |
  • 93 | 94 | 99 |
  • 100 |
  • 101 | 102 | 107 |
  • 108 |
  • 109 | 110 | 114 |
  • 115 |
  • 116 |
  • 117 | 118 | 122 |
  • 123 |
  • 124 | 125 | 129 |
  • 130 |
  • 131 | 132 | 136 |
  • 137 |
  • 138 | 139 | 143 |
  • 144 |
  • 145 | 146 | 151 |
  • 152 |
  • 153 | 154 | 159 |
  • 160 |
  • 161 | 180 |
  • 181 |
  • 182 | 202 | {manualMode ? ( 203 |
      204 | {(options.value as QRCodeSegment[]).map((_, index, value) => ( 205 |
    • 206 | {value.length <= 1 || ( 207 | 216 | )} 217 |
      218 | 219 | 224 |
      225 |
      226 | 227 |