apeman-react-checkbox
Version:
apeman react package for checkbox component.
135 lines (105 loc) • 10.7 kB
JavaScript
/**
* Checkbox component.
* @class ApCheckbox
*/
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _apemanReactIcon = require('apeman-react-icon');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var DEFAULT_ICON = 'ion ion-android-checkbox-outline-blank';
var DEFAULT_CHECKED_ICON = 'ion ion-android-checkbox';
/** @lends ApCheckbox */
var ApCheckbox = function (_Component) {
_inherits(ApCheckbox, _Component);
function ApCheckbox() {
_classCallCheck(this, ApCheckbox);
return _possibleConstructorReturn(this, (ApCheckbox.__proto__ || Object.getPrototypeOf(ApCheckbox)).apply(this, arguments));
}
_createClass(ApCheckbox, [{
key: 'render',
value: function render() {
var _iconClass;
var s = this;
var props = s.props;
var id = props.id;
var name = props.name;
var value = props.value;
var checked = props.checked;
var onChange = props.onChange;
var iconClass = (_iconClass = {
'ap-checkbox-icon-checked': checked
}, _defineProperty(_iconClass, props.checkedIcon, checked), _defineProperty(_iconClass, props.icon, !checked), _iconClass);
var className = (0, _classnames2.default)('ap-checkbox', props.className, {
'ap-checkbox-checked': checked
});
return _react2.default.createElement(
'label',
{ className: className,
htmlFor: id,
id: id + '-wrap' },
_react2.default.createElement(_apemanReactIcon.ApIcon, { className: (0, _classnames2.default)('ap-checkbox-icon', iconClass) }),
_react2.default.createElement('input', { type: 'checkbox',
className: (0, _classnames2.default)('ap-checkbox-input'),
id: id,
name: name,
value: value,
checked: checked,
onChange: onChange }),
_react2.default.createElement(
'span',
{ className: (0, _classnames2.default)('ap-checkbox-title') },
props.title
)
);
}
}]);
return ApCheckbox;
}(_react.Component);
Object.assign(ApCheckbox, {
// --------------------
// Specs
// --------------------
propTypes: {
/** Document id */
id: _react.PropTypes.string.isRequired,
/** Name of checkbox input */
name: _react.PropTypes.string.isRequired,
/** Value of checkbox input */
value: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.bool]).isRequired,
/** Label title */
title: _react.PropTypes.node,
/** Checked or not */
checked: _react.PropTypes.bool,
/** Handle for change event */
onChange: _react.PropTypes.func,
/** Icon class name for normal state */
icon: _react.PropTypes.string,
/** Icon class name for checked state */
checkedIcon: _react.PropTypes.string
},
defaultProps: {
id: null,
name: null,
value: '',
title: '',
checked: false,
onChange: null,
icon: DEFAULT_ICON,
checkedIcon: DEFAULT_CHECKED_ICON
},
DEFAULT_ICON: DEFAULT_ICON,
DEFAULT_CHECKED_ICON: DEFAULT_CHECKED_ICON
});
exports.default = ApCheckbox;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFwX2NoZWNrYm94LmpzeCJdLCJuYW1lcyI6WyJERUZBVUxUX0lDT04iLCJERUZBVUxUX0NIRUNLRURfSUNPTiIsIkFwQ2hlY2tib3giLCJzIiwicHJvcHMiLCJpZCIsIm5hbWUiLCJ2YWx1ZSIsImNoZWNrZWQiLCJvbkNoYW5nZSIsImljb25DbGFzcyIsImNoZWNrZWRJY29uIiwiaWNvbiIsImNsYXNzTmFtZSIsInRpdGxlIiwiT2JqZWN0IiwiYXNzaWduIiwicHJvcFR5cGVzIiwic3RyaW5nIiwiaXNSZXF1aXJlZCIsIm9uZU9mVHlwZSIsImJvb2wiLCJub2RlIiwiZnVuYyIsImRlZmF1bHRQcm9wcyJdLCJtYXBwaW5ncyI6IkFBQUE7Ozs7O0FBS0E7Ozs7Ozs7O0FBRUE7Ozs7QUFDQTs7OztBQUNBOzs7Ozs7Ozs7Ozs7QUFFQSxJQUFNQSxlQUFlLHdDQUFyQjtBQUNBLElBQU1DLHVCQUF1QiwwQkFBN0I7O0FBRUE7O0lBQ01DLFU7Ozs7Ozs7Ozs7OzZCQUNNO0FBQUE7O0FBQ1IsVUFBTUMsSUFBSSxJQUFWO0FBRFEsVUFFRkMsS0FGRSxHQUVRRCxDQUZSLENBRUZDLEtBRkU7QUFBQSxVQUtOQyxFQUxNLEdBVUpELEtBVkksQ0FLTkMsRUFMTTtBQUFBLFVBTU5DLElBTk0sR0FVSkYsS0FWSSxDQU1ORSxJQU5NO0FBQUEsVUFPTkMsS0FQTSxHQVVKSCxLQVZJLENBT05HLEtBUE07QUFBQSxVQVFOQyxPQVJNLEdBVUpKLEtBVkksQ0FRTkksT0FSTTtBQUFBLFVBU05DLFFBVE0sR0FVSkwsS0FWSSxDQVNOSyxRQVRNOzs7QUFZUixVQUFJQztBQUNGLG9DQUE0QkY7QUFEMUIscUNBRUFKLE1BQU1PLFdBRk4sRUFFcUJILE9BRnJCLCtCQUdBSixNQUFNUSxJQUhOLEVBR2MsQ0FBQ0osT0FIZixjQUFKOztBQU1BLFVBQUlLLFlBQVksMEJBQVcsYUFBWCxFQUEwQlQsTUFBTVMsU0FBaEMsRUFBMkM7QUFDekQsK0JBQXVCTDtBQURrQyxPQUEzQyxDQUFoQjtBQUdBLGFBQ0U7QUFBQTtBQUFBLFVBQU8sV0FBWUssU0FBbkI7QUFDTyxtQkFBVVIsRUFEakI7QUFFTyxjQUFPQSxFQUFQLFVBRlA7QUFHRSxpRUFBUSxXQUFZLDBCQUFXLGtCQUFYLEVBQStCSyxTQUEvQixDQUFwQixHQUhGO0FBSUUsaURBQU8sTUFBSyxVQUFaO0FBQ08scUJBQVksMEJBQVcsbUJBQVgsQ0FEbkI7QUFFTyxjQUFLTCxFQUZaO0FBR08sZ0JBQU9DLElBSGQ7QUFJTyxpQkFBUUMsS0FKZjtBQUtPLG1CQUFVQyxPQUxqQjtBQU1PLG9CQUFXQyxRQU5sQixHQUpGO0FBV0U7QUFBQTtBQUFBLFlBQU0sV0FBWSwwQkFBVyxtQkFBWCxDQUFsQjtBQUFzREwsZ0JBQU1VO0FBQTVEO0FBWEYsT0FERjtBQWVEOzs7Ozs7QUFHSEMsT0FBT0MsTUFBUCxDQUFjZCxVQUFkLEVBQTBCO0FBQ3hCO0FBQ0E7QUFDQTs7QUFFQWUsYUFBVztBQUNUO0FBQ0FaLFFBQUksaUJBQU1hLE1BQU4sQ0FBYUMsVUFGUjtBQUdUO0FBQ0FiLFVBQU0saUJBQU1ZLE1BQU4sQ0FBYUMsVUFKVjtBQUtUO0FBQ0FaLFdBQU8saUJBQU1hLFNBQU4sQ0FBZ0IsQ0FDckIsaUJBQU1GLE1BRGUsRUFFckIsaUJBQU1HLElBRmUsQ0FBaEIsRUFHSkYsVUFUTTtBQVVUO0FBQ0FMLFdBQU8saUJBQU1RLElBWEo7QUFZVDtBQUNBZCxhQUFTLGlCQUFNYSxJQWJOO0FBY1Q7QUFDQVosY0FBVSxpQkFBTWMsSUFmUDtBQWdCVDtBQUNBWCxVQUFNLGlCQUFNTSxNQWpCSDtBQWtCVDtBQUNBUCxpQkFBYSxpQkFBTU87QUFuQlYsR0FMYTs7QUEyQnhCTSxnQkFBYztBQUNabkIsUUFBSSxJQURRO0FBRVpDLFVBQU0sSUFGTTtBQUdaQyxXQUFPLEVBSEs7QUFJWk8sV0FBTyxFQUpLO0FBS1pOLGFBQVMsS0FMRztBQU1aQyxjQUFVLElBTkU7QUFPWkcsVUFBTVosWUFQTTtBQVFaVyxpQkFBYVY7QUFSRCxHQTNCVTs7QUFzQ3hCRCw0QkF0Q3dCO0FBdUN4QkM7O0FBdkN3QixDQUExQjs7a0JBMkNlQyxVIiwiZmlsZSI6ImFwX2NoZWNrYm94LmpzeCIsInNvdXJjZVJvb3QiOiJsaWIiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENoZWNrYm94IGNvbXBvbmVudC5cbiAqIEBjbGFzcyBBcENoZWNrYm94XG4gKi9cblxuJ3VzZSBzdHJpY3QnXG5cbmltcG9ydCBSZWFjdCwgeyBDb21wb25lbnQsIFByb3BUeXBlcyBhcyB0eXBlcyB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IGNsYXNzbmFtZXMgZnJvbSAnY2xhc3NuYW1lcydcbmltcG9ydCB7IEFwSWNvbiB9IGZyb20gJ2FwZW1hbi1yZWFjdC1pY29uJ1xuXG5jb25zdCBERUZBVUxUX0lDT04gPSAnaW9uIGlvbi1hbmRyb2lkLWNoZWNrYm94LW91dGxpbmUtYmxhbmsnXG5jb25zdCBERUZBVUxUX0NIRUNLRURfSUNPTiA9ICdpb24gaW9uLWFuZHJvaWQtY2hlY2tib3gnXG5cbi8qKiBAbGVuZHMgQXBDaGVja2JveCAqL1xuY2xhc3MgQXBDaGVja2JveCBleHRlbmRzIENvbXBvbmVudCB7XG4gIHJlbmRlciAoKSB7XG4gICAgY29uc3QgcyA9IHRoaXNcbiAgICBsZXQgeyBwcm9wcyB9ID0gc1xuXG4gICAgbGV0IHtcbiAgICAgIGlkLFxuICAgICAgbmFtZSxcbiAgICAgIHZhbHVlLFxuICAgICAgY2hlY2tlZCxcbiAgICAgIG9uQ2hhbmdlXG4gICAgfSA9IHByb3BzXG5cbiAgICBsZXQgaWNvbkNsYXNzID0ge1xuICAgICAgJ2FwLWNoZWNrYm94LWljb24tY2hlY2tlZCc6IGNoZWNrZWQsXG4gICAgICBbIHByb3BzLmNoZWNrZWRJY29uIF06IGNoZWNrZWQsXG4gICAgICBbIHByb3BzLmljb24gXTogIWNoZWNrZWRcbiAgICB9XG5cbiAgICBsZXQgY2xhc3NOYW1lID0gY2xhc3NuYW1lcygnYXAtY2hlY2tib3gnLCBwcm9wcy5jbGFzc05hbWUsIHtcbiAgICAgICdhcC1jaGVja2JveC1jaGVja2VkJzogY2hlY2tlZFxuICAgIH0pXG4gICAgcmV0dXJuIChcbiAgICAgIDxsYWJlbCBjbGFzc05hbWU9eyBjbGFzc05hbWUgfVxuICAgICAgICAgICAgIGh0bWxGb3I9eyBpZCB9XG4gICAgICAgICAgICAgaWQ9e2Ake2lkfS13cmFwYH0+XG4gICAgICAgIDxBcEljb24gY2xhc3NOYW1lPXsgY2xhc3NuYW1lcygnYXAtY2hlY2tib3gtaWNvbicsIGljb25DbGFzcykgfS8+XG4gICAgICAgIDxpbnB1dCB0eXBlPSdjaGVja2JveCdcbiAgICAgICAgICAgICAgIGNsYXNzTmFtZT17IGNsYXNzbmFtZXMoJ2FwLWNoZWNrYm94LWlucHV0JykgfVxuICAgICAgICAgICAgICAgaWQ9eyBpZCB9XG4gICAgICAgICAgICAgICBuYW1lPXsgbmFtZSB9XG4gICAgICAgICAgICAgICB2YWx1ZT17IHZhbHVlIH1cbiAgICAgICAgICAgICAgIGNoZWNrZWQ9eyBjaGVja2VkIH1cbiAgICAgICAgICAgICAgIG9uQ2hhbmdlPXsgb25DaGFuZ2UgfS8+XG4gICAgICAgIDxzcGFuIGNsYXNzTmFtZT17IGNsYXNzbmFtZXMoJ2FwLWNoZWNrYm94LXRpdGxlJykgfT57IHByb3BzLnRpdGxlIH08L3NwYW4+XG4gICAgICA8L2xhYmVsPlxuICAgIClcbiAgfVxufVxuXG5PYmplY3QuYXNzaWduKEFwQ2hlY2tib3gsIHtcbiAgLy8gLS0tLS0tLS0tLS0tLS0tLS0tLS1cbiAgLy8gU3BlY3NcbiAgLy8gLS0tLS0tLS0tLS0tLS0tLS0tLS1cblxuICBwcm9wVHlwZXM6IHtcbiAgICAvKiogRG9jdW1lbnQgaWQgKi9cbiAgICBpZDogdHlwZXMuc3RyaW5nLmlzUmVxdWlyZWQsXG4gICAgLyoqIE5hbWUgb2YgY2hlY2tib3ggaW5wdXQgKi9cbiAgICBuYW1lOiB0eXBlcy5zdHJpbmcuaXNSZXF1aXJlZCxcbiAgICAvKiogVmFsdWUgb2YgY2hlY2tib3ggaW5wdXQgKi9cbiAgICB2YWx1ZTogdHlwZXMub25lT2ZUeXBlKFtcbiAgICAgIHR5cGVzLnN0cmluZyxcbiAgICAgIHR5cGVzLmJvb2xcbiAgICBdKS5pc1JlcXVpcmVkLFxuICAgIC8qKiBMYWJlbCB0aXRsZSAqL1xuICAgIHRpdGxlOiB0eXBlcy5ub2RlLFxuICAgIC8qKiBDaGVja2VkIG9yIG5vdCAqL1xuICAgIGNoZWNrZWQ6IHR5cGVzLmJvb2wsXG4gICAgLyoqIEhhbmRsZSBmb3IgY2hhbmdlIGV2ZW50ICovXG4gICAgb25DaGFuZ2U6IHR5cGVzLmZ1bmMsXG4gICAgLyoqIEljb24gY2xhc3MgbmFtZSBmb3Igbm9ybWFsIHN0YXRlICovXG4gICAgaWNvbjogdHlwZXMuc3RyaW5nLFxuICAgIC8qKiBJY29uIGNsYXNzIG5hbWUgZm9yIGNoZWNrZWQgc3RhdGUgKi9cbiAgICBjaGVja2VkSWNvbjogdHlwZXMuc3RyaW5nXG4gIH0sXG5cbiAgZGVmYXVsdFByb3BzOiB7XG4gICAgaWQ6IG51bGwsXG4gICAgbmFtZTogbnVsbCxcbiAgICB2YWx1ZTogJycsXG4gICAgdGl0bGU6ICcnLFxuICAgIGNoZWNrZWQ6IGZhbHNlLFxuICAgIG9uQ2hhbmdlOiBudWxsLFxuICAgIGljb246IERFRkFVTFRfSUNPTixcbiAgICBjaGVja2VkSWNvbjogREVGQVVMVF9DSEVDS0VEX0lDT05cbiAgfSxcblxuICBERUZBVUxUX0lDT04sXG4gIERFRkFVTFRfQ0hFQ0tFRF9JQ09OXG5cbn0pXG5cbmV4cG9ydCBkZWZhdWx0IEFwQ2hlY2tib3hcbiJdfQ==