{"library":"rc-checkbox","title":"React Checkbox Component","description":"rc-checkbox is a foundational, unstyled React UI component that provides a customizable checkbox input. It aims to offer a robust and accessible base for building more elaborate checkbox UIs. The current stable version is 3.5.0. While active development for this component has effectively transitioned to the `@rc-component/checkbox` namespace, `rc-checkbox` version 3.5.0 remains available on npm. Its release cadence was moderate, with a significant rewrite to TypeScript in v3.0.0, and it differentiates itself by offering a simple, highly composable core component without imposing specific styling frameworks. Users seeking the latest features and ongoing maintenance should consider migrating to the `@rc-component/checkbox` package.","language":"javascript","status":"renamed","last_verified":"Sun Apr 19","install":{"commands":["npm install rc-checkbox"],"cli":null},"imports":["import Checkbox from 'rc-checkbox';","import type { CheckboxProps } from 'rc-checkbox';","const Checkbox = require('rc-checkbox');"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import React, { useState } from 'react';\nimport Checkbox from 'rc-checkbox';\nimport 'rc-checkbox/assets/index.css'; // Don't forget to import the default styles if needed\n\nconst MyCheckboxComponent = () => {\n  const [isChecked, setIsChecked] = useState(false);\n\n  const handleChange = (e) => {\n    setIsChecked(e.target.checked);\n    console.log('Checkbox changed:', e.target.checked);\n  };\n\n  return (\n    <div>\n      <label>\n        <Checkbox\n          checked={isChecked}\n          onChange={handleChange}\n          name=\"myAwesomeCheckbox\"\n          id=\"my-awesome-checkbox\"\n        />\n        <span>{isChecked ? 'Checked' : 'Unchecked'}</span>\n      </label>\n      <br />\n      <label>\n        <Checkbox defaultChecked disabled />\n        <span>Disabled and Checked</span>\n      </label>\n      <br />\n      <label>\n        <Checkbox disabled />\n        <span>Disabled and Unchecked</span>\n      </label>\n    </div>\n  );\n};\n\nexport default MyCheckboxComponent;","lang":"typescript","description":"This quickstart demonstrates how to import and use the `rc-checkbox` component, managing its checked state and handling changes. It also shows examples of disabled checkboxes and the necessary CSS import.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}