mn-option
v0.0.20
Published
a checkbox and radio component
Downloads
8
Maintainers
Readme
mn-option
Minimalist radio/checkbox component, agnostic to framworks.
See the demo
Install
npm install --save mn-option
And bundle dependencies and main files in dist/ with your preferred tool.
Usage
Add to your html, the tag mn-option
with respective type, default is checkbox, e.g.
<!-- checkbox -->
<mn-option placeholder="Stark" name="gender"></mn-option>
<mn-option placeholder="Lannister" name="gender"></mn-option>
<mn-option placeholder="Targaryen" name="gender"></mn-option>
To define as radio, use the attribute type
<!-- radio -->
<mn-option placeholder="Female" name="gender" type="radio"></mn-option>
<mn-option placeholder="Male" name="gender" type="radio"></mn-option>
Custom attributes
- placeholder - custom attribute, to define the text visible
- type (only checkbox and radio)
Natural checkbox or radio
Is just a css class, to define a minimal design. Useful in some cases. E.g.
<!-- checkboxes, but if you want radio, just implement the type attribute with radio value -->
<mn-option class="natural" placeholder="Stark" name="gender"></mn-option>
<mn-option class="natural" placeholder="Lannister" name="gender"></mn-option>
<mn-option class="natural" placeholder="Targaryen" name="gender"></mn-option>
The following attributes from inputs are supported in this component
Too works with a separted label
with an attribute for