UNPKG

apeman-react-checkbox

Version:
189 lines (124 loc) 5.36 kB
apeman-react-checkbox ========== <!--- This file is generated by ape-tmpl. Do not update manually. ---> <!-- Badge Start --> <a name="badges"></a> [![Build Status][bd_travis_shield_url]][bd_travis_url] [![Code Climate][bd_codeclimate_shield_url]][bd_codeclimate_url] [![Code Coverage][bd_codeclimate_coverage_shield_url]][bd_codeclimate_url] [![npm Version][bd_npm_shield_url]][bd_npm_url] [![JS Standard][bd_standard_shield_url]][bd_standard_url] [bd_repo_url]: https://github.com/apeman-react-labo/apeman-react-checkbox [bd_travis_url]: http://travis-ci.org/apeman-react-labo/apeman-react-checkbox [bd_travis_shield_url]: http://img.shields.io/travis/apeman-react-labo/apeman-react-checkbox.svg?style=flat [bd_license_url]: https://github.com/apeman-react-labo/apeman-react-checkbox/blob/master/LICENSE [bd_codeclimate_url]: http://codeclimate.com/github/apeman-react-labo/apeman-react-checkbox [bd_codeclimate_shield_url]: http://img.shields.io/codeclimate/github/apeman-react-labo/apeman-react-checkbox.svg?style=flat [bd_codeclimate_coverage_shield_url]: http://img.shields.io/codeclimate/coverage/github/apeman-react-labo/apeman-react-checkbox.svg?style=flat [bd_gemnasium_url]: https://gemnasium.com/apeman-react-labo/apeman-react-checkbox [bd_gemnasium_shield_url]: https://gemnasium.com/apeman-react-labo/apeman-react-checkbox.svg [bd_npm_url]: http://www.npmjs.org/package/apeman-react-checkbox [bd_npm_shield_url]: http://img.shields.io/npm/v/apeman-react-checkbox.svg?style=flat [bd_standard_url]: http://standardjs.com/ [bd_standard_shield_url]: https://img.shields.io/badge/code%20style-standard-brightgreen.svg <!-- Badge End --> <!-- Description Start --> <a name="description"></a> apeman react package for checkbox component. <!-- Description End --> <!-- Overview Start --> <a name="overview"></a> <!-- Overview End --> <!-- Sections Start --> <a name="sections"></a> <!-- Section from "doc/guides/01.Installation.md.hbs" Start --> <a name="section-doc-guides-01-installation-md"></a> Installation ----- ```bash $ npm install apeman-react-checkbox --save ``` <!-- Section from "doc/guides/01.Installation.md.hbs" End --> <!-- Section from "doc/guides/02.Demo.md.hbs" Start --> <a name="section-doc-guides-02-demo-md"></a> Demo ----- [Live demo][demo_url] is hosted on GitHub Pages. [![Demo Image](./doc/images/screenshot.png)][demo_url] [demo_url]: http://apeman-react-labo.github.io/apeman-react-checkbox/demo/demo.html <!-- Section from "doc/guides/02.Demo.md.hbs" End --> <!-- Section from "doc/guides/03.Usage.md.hbs" Start --> <a name="section-doc-guides-03-usage-md"></a> Usage --------- ```jsx 'use strict' import React from 'react' import {ApIonIconStyle} from 'apeman-react-basic' import {ApCheckbox, ApCheckboxStyle} from 'apeman-react-checkbox' const ExampleComponent = React.createClass({ render () { return ( <div> <ApCheckbox id="favor-checkbox-orange" name="favor" value="orange" title="I like orange." onChange={ () => { /* ... */ } }/> <ApCheckbox id="favor-checkbox-apple" name="favor" value="apple" title="I like apple." onChange={ () => { /* ... */ } }/> </div> ) } }) ``` <!-- Section from "doc/guides/03.Usage.md.hbs" End --> <!-- Section from "doc/guides/04.Components.md.hbs" Start --> <a name="section-doc-guides-04-components-md"></a> Components ----- ### ApCheckboxGroup **Props** | Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | prefix | string | null | | Document id prefix | | name | string | null | | Name of checkbox input | | options | object | {} | | Value and label titles | | checked | object | {} | | Checked state for each values | | onChange | func | null | | Handle for change event | | icon | string | ApCheckbox.DEFAULT_ICON | | Icon class name for normal state | | checkedIcon | string | ApCheckbox.DEFAULT_CHECKED_ICON | | Icon class name for checked state | | title | | &#x27;&#x27; | | | ### ApCheckboxStyle **Props** | Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | style | object | {} | | | | highlightColor | string | &#x27;#38E&#x27; | | | ### ApCheckbox **Props** | Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | id | string | null | | Document id | | name | string | null | | Name of checkbox input | | value | string | null | | Value of checkbox input | | title | string | &#x27;&#x27; | | Label title | | checked | bool | false | | Checked or not | | onChange | func | null | | Handle for change event | | icon | string | &#x27;ion ion-android-checkbox-outline-blank&#x27; | | Icon class name for normal state | | checkedIcon | string | &#x27;ion ion-android-checkbox&#x27; | | Icon class name for checked state | <!-- Section from "doc/guides/04.Components.md.hbs" End --> <!-- Sections Start --> <!-- LICENSE Start --> <a name="license"></a> License ------- This software is released under the [MIT License](https://github.com/apeman-react-labo/apeman-react-checkbox/blob/master/LICENSE). <!-- LICENSE End --> <!-- Links Start --> <a name="links"></a> Links ------ + [apeman](https://github.com/apeman-labo/apeman) + [apeman-react-labo](https://github.com/apeman-react-labo) + [React](https://facebook.github.io/react/) <!-- Links End -->