react-input-checkbox/lib/react-input-checkbox.es.js

Simple and stylable checkbox UI component for React apps

import React from 'react';
import { node, bool, string, func } from 'prop-types';

function _typeof(obj) {
  "@babel/helpers - typeof";

  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
    _typeof = function (obj) {
      return typeof obj;
    };
  } else {
    _typeof = function (obj) {
      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
    };
  }

  return _typeof(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;
}

var classConcat = function classConcat(classes) {
  var type = _typeof(classes);

  if (type === "string" || type === "number") return classes || "";

  if (Array.isArray(classes) && classes.length > 0) {
    return classes.reduce(function (concated, className) {
      return className ? concated.concat("".concat(className, " ")) : concated;
    }, "");
  } else {
    return Object.keys(classes).reduce(function (concated, className) {
      return classes[className] ? concated.concat("".concat(className, " ")) : concated;
    }, "");
  }
};

var Checkbox = function Checkbox(props) {
  var _classConcat, _classConcat2, _classConcat3, _classConcat4;

  return /*#__PURE__*/React.createElement("label", {
    className: classConcat((_classConcat = {
      'Checkbox_themed': props.theme
    }, _defineProperty(_classConcat, props.theme, props.theme), _defineProperty(_classConcat, props.modification, props.modification), _classConcat)),
    onClick: function onClick() {
      return setTimeout(function () {
        document.activeElement.blur();
      }, 0);
    }
  }, /*#__PURE__*/React.createElement("input", {
    type: "checkbox",
    className: classConcat((_classConcat2 = {
      'Checkbox__input_themed': props.theme,
      'Checkbox__input_themed_indeterminate': props.indeterminate
    }, _defineProperty(_classConcat2, "".concat(props.theme, "__input"), props.theme), _defineProperty(_classConcat2, "".concat(props.theme, "__input_indeterminate"), props.indeterminate), _defineProperty(_classConcat2, props.modification, props.modification), _classConcat2)),
    disabled: props.disabled,
    checked: props.value,
    onChange: props.onChange
  }), props.theme && /*#__PURE__*/React.createElement("span", {
    className: classConcat((_classConcat3 = {
      'Checkbox__image_themed': true
    }, _defineProperty(_classConcat3, "".concat(props.theme, "__image"), true), _defineProperty(_classConcat3, props.modification, props.modification), _classConcat3))
  }), /*#__PURE__*/React.createElement("span", {
    className: classConcat((_classConcat4 = {}, _defineProperty(_classConcat4, "".concat(props.theme, "__label"), props.theme), _defineProperty(_classConcat4, props.modification, props.modification), _classConcat4))
  }, props.children));
};
Checkbox.propTypes = {
  children: node.isRequired,
  disabled: bool,
  indeterminate: bool,
  modification: string,
  onChange: func.isRequired,
  theme: string,
  value: bool.isRequired
};
Checkbox.defaultProps = {
  disabled: false,
  indeterminate: false,
  modification: null,
  theme: null
};

export { Checkbox };