Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
33 commits
Select commit Hold shift + click to select a range
3a083d4
chore: standardize repository config
afc163 Jun 26, 2026
58b06b5
fix: keep default CodeQL setup
afc163 Jun 26, 2026
b70ce21
chore: address AI review feedback
afc163 Jun 26, 2026
8274bc5
docs: standardize README release details
afc163 Jun 26, 2026
42387a0
ci: make surge preview non-blocking
afc163 Jun 26, 2026
547844f
ci: keep surge preview as fallback
afc163 Jun 26, 2026
6945552
docs: refine README usage and ecosystem note
afc163 Jun 27, 2026
e5291b5
ci: isolate surge preview token
afc163 Jun 27, 2026
e7e300e
chore: address review comments
afc163 Jun 27, 2026
2aa54df
docs: add Chinese README
afc163 Jun 27, 2026
356d8ff
docs: add Ant Design logo to README
afc163 Jun 27, 2026
93b7216
docs: refine bilingual README branding
afc163 Jun 27, 2026
622b1c9
chore: standardize rc tooling and docs
afc163 Jun 27, 2026
a7f3292
chore: address standardization review comments
afc163 Jun 27, 2026
5e6923d
chore: include father config in type checks
afc163 Jun 27, 2026
44e511e
docs: add license file
afc163 Jun 28, 2026
b645765
ci: use actions checkout v7
afc163 Jun 28, 2026
74baec6
chore: standardize package metadata
afc163 Jun 28, 2026
bbec15f
ci: standardize dependabot updates
afc163 Jun 28, 2026
e6c8f2d
chore: ignore generated docs artifacts
afc163 Jun 28, 2026
ead3aa2
chore: refine preview workflow ignores
afc163 Jun 28, 2026
5def596
docs: polish Chinese README wording
afc163 Jun 28, 2026
53210b6
chore: align tooling ignores and typescript
afc163 Jun 28, 2026
8fe76a0
docs: polish Chinese README wording
afc163 Jun 28, 2026
b26ebba
docs: document dumi dev server port
afc163 Jun 28, 2026
6b5435c
chore: standardize husky configuration
afc163 Jun 28, 2026
3e1004a
chore: standardize package type entry
afc163 Jun 28, 2026
6e2d36f
docs: normalize readme badges
afc163 Jun 28, 2026
3b1b5c3
ci: limit reusable workflow secrets
afc163 Jun 28, 2026
0ee74ca
ci: restore reusable workflow compatibility
afc163 Jun 28, 2026
b9ae748
docs: polish zh-CN readme wording
afc163 Jun 28, 2026
c068cb7
ci: narrow surge preview permissions
afc163 Jun 28, 2026
e17e09b
chore: limit reusable workflow secrets
afc163 Jun 29, 2026
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 14 additions & 7 deletions .dumirc.ts
Original file line number Diff line number Diff line change
@@ -1,15 +1,22 @@
// more config: https://d.umijs.org/config
import { defineConfig } from 'dumi';
import path from 'path';

const basePath = process.env.GH_PAGES ? '/switch/' : '/';
const publicPath = process.env.GH_PAGES ? '/switch/' : '/';

export default defineConfig({
alias: {
'@rc-component/switch$': path.resolve('src'),
'@rc-component/switch/es': path.resolve('src'),
'@rc-component/switch/assets': path.resolve('assets'),
},
mfsu: false,
favicons: ['https://avatars0.githubusercontent.com/u/9441414?s=200&v=4'],
themeConfig: {
name: 'rc-switch',
name: 'Switch',
logo: 'https://avatars0.githubusercontent.com/u/9441414?s=200&v=4',
},
outputPath: '.doc',
exportStatic: {},
base: '/switch',
publicPath: '/switch/',
hash: true,
outputPath: 'docs-dist',
base: basePath,
publicPath,
});
4 changes: 3 additions & 1 deletion .eslintignore
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
.eslintrc.js
es/
lib/
.doc/
.doc/
docs-dist/
.vercel/
2 changes: 2 additions & 0 deletions .github/FUNDING.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
github: ant-design
open_collective: ant-design
16 changes: 6 additions & 10 deletions .github/dependabot.yml
Original file line number Diff line number Diff line change
@@ -1,12 +1,8 @@
version: 2
updates:
- package-ecosystem: npm
directory: "/"
schedule:
interval: daily
time: "21:00"
open-pull-requests-limit: 10
ignore:
- dependency-name: less
versions:
- 4.1.0
- package-ecosystem: npm
directory: '/'
schedule:
interval: daily
time: '21:00'
open-pull-requests-limit: 10
43 changes: 43 additions & 0 deletions .github/workflows/codeql.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
name: 'CodeQL'

on:
push:
branches: ['master']
pull_request:
branches: ['master']
schedule:
- cron: '17 10 * * 1'

jobs:
analyze:
name: Analyze
runs-on: ubuntu-latest
permissions:
actions: read
contents: read
security-events: write

strategy:
fail-fast: false
matrix:
language: [javascript]

steps:
- name: Checkout
uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0
with:
persist-credentials: false

- name: Initialize CodeQL
uses: github/codeql-action/init@8aad20d150bbac5944a9f9d289da16a4b0d87c1e
with:
languages: ${{ matrix.language }}
queries: +security-and-quality

- name: Autobuild
uses: github/codeql-action/autobuild@8aad20d150bbac5944a9f9d289da16a4b0d87c1e

- name: Perform CodeQL Analysis
uses: github/codeql-action/analyze@8aad20d150bbac5944a9f9d289da16a4b0d87c1e
with:
category: '/language:${{ matrix.language }}'
6 changes: 0 additions & 6 deletions .github/workflows/main.yml

This file was deleted.

12 changes: 12 additions & 0 deletions .github/workflows/react-component-ci.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
name: ✅ test
on:
push:
branches: [master]
pull_request:
branches: [master]
permissions:
contents: read
jobs:
test:
uses: react-component/rc-test/.github/workflows/test-utoo.yml@main
secrets: inherit
27 changes: 27 additions & 0 deletions .github/workflows/react-doctor.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
name: React Doctor

on:
pull_request:
types: [opened, synchronize, reopened, ready_for_review]
push:
branches: [master]

permissions:
contents: read
pull-requests: write
issues: write
statuses: write

concurrency:
group: react-doctor-${{ github.event.pull_request.number || github.ref }}
cancel-in-progress: true

jobs:
react-doctor:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0
with:
fetch-depth: 0
persist-credentials: false
- uses: millionco/react-doctor@0b4f4f4bd248a154e64eb508a48347f71154b3f3
39 changes: 39 additions & 0 deletions .github/workflows/surge-preview.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
name: Surge Preview

on:
pull_request:

concurrency:
group: ${{ github.workflow }}-${{ github.event.pull_request.number }}
cancel-in-progress: true

permissions:
contents: read
pull-requests: write
checks: write
statuses: write

jobs:
preview:
runs-on: ubuntu-latest
env:
SURGE_TOKEN: ${{ secrets.SURGE_TOKEN }}
PREVIEW: true
steps:
- uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0
with:
persist-credentials: false
- uses: afc163/surge-preview@bf90a5a86111f6311ca42f0a5a0f80fb0fb03cec
if: ${{ env.SURGE_TOKEN != '' }}
with:
surge_token: ${{ env.SURGE_TOKEN }}
github_token: ${{ secrets.GITHUB_TOKEN }}
dist: docs-dist
failOnError: true
setCommitStatus: true
build: |
npm install
npm run build
- name: Skip Surge preview
if: ${{ env.SURGE_TOKEN == '' }}
run: echo "SURGE_TOKEN is not configured; skip Surge preview."
21 changes: 14 additions & 7 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
*.iml
*.log
*.log.*
.idea/
.ipr
.iws
Expand All @@ -20,20 +21,26 @@ Thumbs.db
.build
node_modules
.cache
dist
assets/**/*.css
build
lib
es
/coverage
yarn.lock
package-lock.json
pnpm-lock.yaml
coverage/
.doc
docs-dist
.vercel
.storybook

# dumi
.dumi/tmp
.dumi/tmp-test
.dumi/tmp-production
# umi
.umi
.umi-production
.umi-test
.env.local
.doc/
.dumi/

bun.lockb
bun.lockb
bun.lock
116 changes: 64 additions & 52 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,74 +1,86 @@
# rc-switch

---

Switch ui component for react.

[![NPM version][npm-image]][npm-url]
[![npm download][download-image]][download-url]
[![build status][github-actions-image]][github-actions-url]
[![Test coverage][codecov-image]][codecov-url]
[![bundle size][bundlephobia-image]][bundlephobia-url]

[npm-image]: http://img.shields.io/npm/v/rc-switch.svg?style=flat-square
[npm-url]: http://npmjs.org/package/rc-switch
[travis-image]: https://img.shields.io/travis/react-component/switch/master?style=flat-square
[travis-url]: https://travis-ci.com/react-component/switch
[github-actions-image]: https://github.com/react-component/switch/workflows/CI/badge.svg
[github-actions-url]: https://github.com/react-component/switch/actions
[codecov-image]: https://img.shields.io/codecov/c/github/react-component/switch/master.svg?style=flat-square
[codecov-url]: https://app.codecov.io/gh/react-component/switch
[david-url]: https://david-dm.org/react-component/switch
[david-image]: https://david-dm.org/react-component/switch/status.svg?style=flat-square
[david-dev-url]: https://david-dm.org/react-component/switch?type=dev
[david-dev-image]: https://david-dm.org/react-component/switch/dev-status.svg?style=flat-square
[download-image]: https://img.shields.io/npm/dm/rc-switch.svg?style=flat-square
[download-url]: https://npmjs.org/package/rc-switch
[bundlephobia-url]: https://bundlephobia.com/package/rc-switch
[bundlephobia-image]: https://badgen.net/bundlephobia/minzip/rc-switch
<div align="center">
<h1>@rc-component/switch</h1>
<p>🔘 Accessible React switch for boolean state with controlled and uncontrolled modes.</p>
<p>
<img alt="Ant Design" src="https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*FBw7Rr5aC7AAAAAAAAAAAAAADrJ8AQ/original" height="24" />
</p>
<p>Part of the Ant Design ecosystem.</p>

<p>
<a href="https://www.npmjs.com/package/@rc-component/switch"><img src="https://img.shields.io/npm/v/@rc-component/switch.svg?style=flat-square" alt="npm version" /></a>
<a href="https://www.npmjs.com/package/@rc-component/switch"><img src="https://img.shields.io/npm/dm/@rc-component/switch.svg?style=flat-square" alt="npm downloads" /></a>
<a href="https://github.com/react-component/switch/actions"><img src="https://github.com/react-component/switch/actions/workflows/react-component-ci.yml/badge.svg" alt="CI" /></a>
<a href="https://codecov.io/gh/react-component/switch"><img src="https://img.shields.io/codecov/c/github/react-component/switch/master.svg?style=flat-square" alt="Codecov" /></a>
<a href="https://bundlephobia.com/package/@rc-component/switch"><img src="https://badgen.net/bundlephobia/minzip/@rc-component/switch" alt="bundle size" /></a>
<a href="https://github.com/umijs/dumi"><img src="https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square" alt="dumi" /></a>
</p>
</div>

## Highlights

- Renders a native button with `role="switch"` and `aria-checked` state.
- Supports controlled and uncontrolled checked state.
- Handles click and keyboard toggles with left and right arrow keys.
- Provides content class/style slots for checked and unchecked labels.

## Install

[![rc-switch](https://nodei.co/npm/rc-switch.png)](https://npmjs.org/package/rc-switch)
```bash
npm install @rc-component/switch
```

## Usage

```js
import Switch from 'rc-switch';
```tsx pure
import Switch from '@rc-component/switch';
import '@rc-component/switch/assets/index.css';

export default () => <Switch />;
export default () => <Switch checkedChildren="On" unCheckedChildren="Off" />;
```

## Compatibility

| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Electron |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
Online preview: https://switch.react-component.vercel.app/

## API

| Property | Type | Default | Description |
| -------------- | ------------------------ | --------- | -------------------------------------------------------- |
| prefixCls | String | rc-switch | |
| className | String | '' | additional class name of root node |
| checked | boolean | false | whether switch is checked |
| defaultChecked | boolean | false | whether switch is checked on init |
| onChange | Function(checked, event) | | called when switch is checked or unchecked |
| tabIndex | number | | tab-index of switch node |
| onClick | Function(checked, event) | | called when switch is clicked |
| autoFocus | boolean | | get focus when mounts |
| disabled | boolean | false | whether switch is disabled |
| loadingIcon | React.ReactNode | | specific the extra node. generally used in loading icon. |
| Name | Type | Default | Description |
| ------------------- | ----------------------------------- | ------------- | ------------------------------------------ |
| `autoFocus` | boolean | - | Focus the switch on mount. |
| `checked` | boolean | - | Controlled checked state. |
| `checkedChildren` | React.ReactNode | - | Content shown when checked. |
| `className` | string | - | Additional class name. |
| `classNames` | `{ content?: string }` | - | Semantic class names for internal content. |
| `defaultChecked` | boolean | false | Initial checked state. |
| `disabled` | boolean | false | Disable interaction. |
| `loadingIcon` | React.ReactNode | - | Extra loading icon node. |
| `onChange` | `(checked, event) => void` | - | Triggered after checked state changes. |
| `onClick` | `(checked, event) => void` | - | Triggered after click. |
| `onKeyDown` | React.KeyboardEventHandler | - | Key down handler. |
| `prefixCls` | string | `'rc-switch'` | Prefix class name. |
| `style` | React.CSSProperties | - | Root style. |
| `styles` | `{ content?: React.CSSProperties }` | - | Semantic styles for internal content. |
| `tabIndex` | number | - | Tab index. |
| `title` | string | - | Native title attribute. |
| `unCheckedChildren` | React.ReactNode | - | Content shown when unchecked. |

## Development

```
```bash
npm install
npm start
npm test
npm run tsc
npm run compile
npm run build
```

## Release

```bash
npm run prepublishOnly
```

Online demo: http://react-component.github.io/switch/
`prepublishOnly` builds the package with Father and publishes through `rc-np`. Run `npm run gh-pages` to deploy the dumi site.

## License

rc-switch is released under the MIT license.
@rc-component/switch is released under the MIT license.
2 changes: 1 addition & 1 deletion docs/index.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
hero:
title: rc-switch
title: '@rc-component/switch'
description: React Switch Component
---

Expand Down
Loading
Loading