npm package: @ncdai/react-wheel-picker
Description: iOS-like wheel picker for React with smooth inertia scrolling and infinite loop support.
Author: Nguyen Chanh Dai
Latest version: 1.2.2

# React Wheel Picker

Backed by [▲Vercel OSS Program](https://vercel.com/blog/summer-2025-oss-program#react-wheel-picker)

iOS-like wheel picker for React with smooth inertia scrolling and infinite loop support.

- Natural touch scrolling with smooth inertia effect
- Mouse drag and scroll support for desktop
- Infinite loop scrolling
- Unstyled components for complete style customization
- Full keyboard navigation and type-ahead search
- Easy installation via shadcn CLI

→ Check out the live demo: https://react-wheel-picker.chanhdai.com

## Documentation

Please read the [documentation](https://react-wheel-picker.chanhdai.com/docs/getting-started) for setup and API usage.

## License

Licensed under the [MIT license](./LICENSE).

## Sponsors

This project is proudly supported by:

<table>
  <tbody>
    <tr>
      <td colspan="3"><strong>Open Source Program</strong></td>
    </tr>
    <tr>
      <td>
        <a href="https://vercel.com/blog/summer-2025-oss-program#react-wheel-picker">
          <img
            src="https://assets.chanhdai.com/images/sponsors/vercel-oss-program-2025.svg?v=2"
            alt="Vercel OSS Program"
          />
        </a>
      </td>
      <td>
        <a href="https://openpanel.dev?utm_source=react-wheel-picker">
          <img
            src="https://assets.chanhdai.com/images/sponsors/openpanel.svg?v=1"
            alt="OpenPanel"
          />
        </a>
      </td>
      <td>
        <a href="https://www.mintlify.com?utm_source=react-wheel-picker">
          <img
            src="https://assets.chanhdai.com/images/sponsors/mintlify.svg?v=1"
            alt="Mintlify"
          />
        </a>
      </td>
    </tr>
    <tr>
      <td colspan="3"><strong>Gold Sponsors</strong></td>
    </tr>
    <tr>
      <td>
        <a href="https://shadcnstudio.com?utm_source=chanhdai.com&utm_medium=banner&utm_campaign=github">
          <img src="https://assets.chanhdai.com/images/sponsors/shadcnstudio.svg?v=3" alt="shadcnstudio.com" />
        </a>
      </td>
      <td>
        <a href="https://shadcnspace.com">
          <img
            src="https://assets.chanhdai.com/images/sponsors/shadcnspace.svg?v=3"
            alt="Shadcn Space"
          />
        </a>
      </td>
      <td></td>
    </tr>
    <tr>
      <td colspan="3"><strong>Silver Sponsors</strong></td>
    </tr>
    <tr>
      <td>
        <a href="https://shadcncraft.com?utm_source=react-wheel-picker">
          <img
            src="https://assets.chanhdai.com/images/sponsors/shadcncraft.svg?v=2"
            alt="shadcncraft"
          />
        </a>
      </td>
      <td>
        <a href="https://www.shadcnblocks.com?utm_source=react-wheel-picker">
          <img
            src="https://assets.chanhdai.com/images/sponsors/shadcnblocks.svg?v=1"
            alt="Shadcnblocks"
          />
        </a>
      </td>
      <td>
        <a href="https://reactbits.dev?utm_source=react-wheel-picker">
          <img
            src="https://assets.chanhdai.com/images/sponsors/reactbits.svg?v=1"
            alt="React Bits"
          />
        </a>
      </td>
    </tr>
    <tr>
      <td colspan="3"><strong>Spark Supporters</strong></td>
    </tr>
    <tr>
      <td>
        <a href="https://uirules.com?utm_source=react-wheel-picker">
          <img
            src="https://assets.chanhdai.com/images/sponsors/uirules.svg?v=1"
            alt="UI Rules"
          />
        </a>
      </td>
      <td>
        <a href="https://shoogle.dev?utm_source=react-wheel-picker">
          <img
            src="https://assets.chanhdai.com/images/sponsors/shoogle.svg?v=1"
            alt="Shoogle"
          />
        </a>
      </td>
      <td></td>
    </tr>
  </tbody>
</table>

> Using this package at work? [Sponsor me](https://github.com/sponsors/ncdai) to help with support and maintenance.