# @rc-component/switch > switch ui component for react Latest version **1.0.3** (published 2025-11-28) · MIT license · 0 weekly downloads ## Install ```sh npm install @rc-component/switch pnpm add @rc-component/switch yarn add @rc-component/switch bun add @rc-component/switch ``` ## Health **Score 65/100 (B)** — status: stable. Positive: has types; esm support; no vulnerabilities; high maintenance score; high quality score. Warnings: low downloads. ## Facts | | | |---|---| | Version | 1.0.3 | | Published | 2025-11-28 | | First published | 2025-02-17 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 2 | | Unpacked size | 19.5 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 196 | | Maintainers | zombiej, afc163, madccc, peachscript, chenshuai2144 | | Keywords | react, react-component, react-switch, switch | ## Links - npm: https://www.npmjs.com/package/@rc-component/switch - Repository: https://github.com/react-component/switch - Homepage: http://github.com/react-component/switch - Issues: http://github.com/react-component/switch/issues - npm.io page: https://npm.io/package/@rc-component/switch ## Dependencies (2) - [clsx](https://npm.io/package/clsx.md) ^2.1.1 - [@rc-component/util](https://npm.io/package/@rc-component/util.md) ^1.3.0 ## Alternatives - [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads - [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads - [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads - [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads - [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads ## Recent versions - 1.0.3 (latest) — 2025-11-28 - 1.0.2 — 2025-09-19 - 1.0.1 — 2025-09-16 - 1.0.0 — 2025-02-17 ## README # 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 ## Install [![rc-switch](https://nodei.co/npm/rc-switch.png)](https://npmjs.org/package/rc-switch) ## Usage ```js import Switch from 'rc-switch'; export default () => ; ``` ## Compatibility | [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | [Electron](http://godban.github.io/browsers-support-badges/)
Electron | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | ## 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. | ## Development ``` npm install npm start ``` Online demo: http://react-component.github.io/switch/ ## License rc-switch is released under the MIT license. --- _Source: https://npm.io/package/@rc-component/switch · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._