react-1poll component

A simple Doodle-like poll component that makes it easy for contributors to add more options. Star it on npm and on github.

Made with React.js and Material-UI. Thanks to Romain Dardour for his help!

Demo / examples of use

• Official demo
• 1task's landing page (and source code)

How to install and use

Using npm

First, install it in your project's directory:

npm install react-1poll

Then, integrate it in your javascript project:

var PollForm = require('./PollForm.jsx');
var options = [
  { name: 'Option A', defaultCheck: true },
  { name: 'Option B' },
  { name: 'Option C' }
];
function onValidSubmit(selectedItems) {
  assert.equal(selectedItems, [ 'Option A' ]);
}
ReactDOM.render(<PollForm
  options={options}
  onNewOption={console.log}
  onValidSubmit={onValidSubmit} />, appDiv);

Component API reference

Properties

• options: an Array of Objects that accept the following fields:
  • name: (String) name of the option, seen as a checkbox.
  • checked: (Boolean) true if the checkbox is checked.
  • defaultChecked: (Boolean) true if the checkbox should be checked initially.
• allowNewEntries: (optional boolean) set to false to hide the option entry field.
• onNewOption: (optional) Function({ name: String, defaultChecked: Boolean }) overrides the function that adds the new option to the options state Array.
• onSelectionChange: (optional) Function([ { name: String, checked: true } ]) passes an Array of option Objects (as in the options property), which are currently selected (i.e. have their checked field set to true).
• labelStyle: an optional Object to override the inline-style of the Checkbox labels.
• autoFocus: (Boolean) if set to true, the option entry field will be focused (ready to type) by default.