A voice sensor for react-beautiful-dnd, built with the Web Speech API 💁‍♀️

Usage no npm install needed!

<script type="module">
  import rbdVoiceSensor from 'https://cdn.skypack.dev/rbd-voice-sensor';


react beautiful dnd logo


What are sensors?

A sensor is a React Hook (or plain ol' function) that gives you access to RBD's Programmatic API, with that you're able to programmatically control drag and drop interactions with any input type you can think of.

Why Voice?

Imagine dragging and dropping Jira tickets in a standup using only your voice. Or improving accessiblity for people with a physical disability.

Get started 🏗


npm install --save rbd-voice-sensor or yarn add rbd-voice-sensor

Basic Example

import React from 'react';
import { DragDropContext } from 'react-beautiful-dnd';
import voiceSensor from 'rbd-voice-sensor';

function App() {
    return <DragDropContext sensors={[voiceSensor]}>{/*...*/}</DragDropContext>;

Resources 📖