import { _ as _defineProperty } from './defineProperty-18999f8e.js';
import './es.array.concat-9f3136dc.js';
import './es.array.slice-e9c3dd03.js';
import { c as createId } from './utils-21c04279.js';
import BaseIcon from './BaseIcon-ab0cc22f.js';
import { n as normalizeComponent } from './normalize-component-63e8c7a0.js';
import './export-ecf4b1cb.js';
import './array-species-create-afb281e6.js';
import './create-property-c00b5c27.js';
import './array-method-has-species-support-d96108b0.js';
import './typeof-6c6d8d7a.js';
import './unsupportedIterableToArray-577176bf.js';
import './es.array.join-6ca857ff.js';
import './array-method-is-strict-903f485b.js';
import './es.array.map-093cfbca.js';
import './array-iteration-dec5536e.js';
import './function-bind-context-b3fabf77.js';
import './regexp-exec-abstract-04d119fc.js';
import './string-multibyte-88926e02.js';
import './regexp-flags-b5fc4ddb.js';
import './es.string.split-cd1f3afc.js';
import './is-regexp-5558fd03.js';
import './es.object.to-string-5a59fbfc.js';
import './classof-b10e7604.js';
import './es.regexp.to-string-784af81c.js';
import './es.string.replace-07eeebfe.js';
import './es.array.includes-1f433385.js';
import './object-keys-a5d351f7.js';
import './es.string.includes-53dbb113.js';
import './es.array.sort-92cbfa54.js';
import './web.dom-collections.for-each-917714ef.js';
import './dom-iterables-b6f5ef3b.js';
import './es.object.keys-6369b884.js';

//
/**
 * Checkbox and Radio Button Component
 */

var script = {
  name: 'BaseCheckmark',
  components: {
    BaseIcon: BaseIcon
  },
  model: {
    prop: 'checked',
    event: 'clicked'
  },
  props: {
    /**
     * choose the style <br>
     * valid values: 'radio' | 'checkbox'
     */
    markStyle: {
      type: String,
      default: 'radio',
      validator: function validator(val) {
        return val === 'radio' || val === 'checkbox';
      }
    },

    /**
     * specify a discriptive label <br>
     * this will not be displayed but is only there for usability purposes <br>
     * TODO: for radio button label should actually be visible!
     */
    label: {
      type: String,
      default: 'select'
    },

    /**
     * specify a value for the radio button - if none is specified the label will be used to
     * determine if radio button should be active!
     */
    radioValue: {
      type: String,
      default: ''
    },

    /**
     * define if label should be visible - default set false because
     * currentyl not needed in base project
     */
    showLabel: {
      type: Boolean,
      default: false
    },

    /**
     * checkbox checked or radio button checked can be set from outside, default
     * value depending on type of selector
     *
     * @model
     */
    checked: {
      type: [Boolean, String],
      default: false
    },

    /**
     * set the size of the checkBox <br>
     * valid values: 'large' | 'small'
     */
    checkBoxSize: {
      type: String,
      default: 'small',
      validator: function validator(val) {
        return val === 'small' || val === 'large';
      }
    }
  },
  data: function data() {
    return {
      checkedInt: false
    };
  },
  computed: {
    internalId: function internalId() {
      return createId();
    },
    radioValueInt: function radioValueInt() {
      return this.radioValue || this.label;
    }
  },
  watch: {
    checked: {
      handler: function handler(val) {
        this.checkedInt = val;
      },
      immediate: true
    }
  },
  methods: {
    clicked: function clicked() {
      if (this.markStyle === 'checkbox') {
        this.checkedInt = !this.checkedInt;
      }
      /**
       * event emitted on radio button / checkmark click,
       * emitting input label
       *
       * @type {string | boolean}
       */


      this.$emit('clicked', this.markStyle === 'checkbox' ? this.checkedInt : this.radioValueInt);
    }
  }
};

var __vue_script__ = script;
/* template */

var __vue_render__ = function __vue_render__() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c('div', {
    class: ['base-checkbox-container', 'base-checkbox-container-' + _vm.checkBoxSize],
    on: {
      "click": function click($event) {
        $event.stopPropagation();
        return _vm.clicked.apply(null, arguments);
      }
    }
  }, [(_vm.markStyle === 'checkbox' ? 'checkbox' : 'radio') === 'checkbox' ? _c('input', {
    directives: [{
      name: "model",
      rawName: "v-model",
      value: _vm.checkedInt,
      expression: "checkedInt"
    }],
    class: ['base-checkbox-input', {
      'base-checkbox-checked': _vm.checkedInt
    }],
    attrs: {
      "id": _vm.internalId,
      "name": _vm.label,
      "type": "checkbox"
    },
    domProps: {
      "value": _vm.radioValueInt,
      "checked": Array.isArray(_vm.checkedInt) ? _vm._i(_vm.checkedInt, _vm.radioValueInt) > -1 : _vm.checkedInt
    },
    on: {
      "keydown": function keydown($event) {
        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "enter", 13, $event.key, "Enter")) {
          return null;
        }

        $event.preventDefault();
      },
      "change": function change($event) {
        var $$a = _vm.checkedInt,
            $$el = $event.target,
            $$c = $$el.checked ? true : false;

        if (Array.isArray($$a)) {
          var $$v = _vm.radioValueInt,
              $$i = _vm._i($$a, $$v);

          if ($$el.checked) {
            $$i < 0 && (_vm.checkedInt = $$a.concat([$$v]));
          } else {
            $$i > -1 && (_vm.checkedInt = $$a.slice(0, $$i).concat($$a.slice($$i + 1)));
          }
        } else {
          _vm.checkedInt = $$c;
        }
      }
    }
  }) : (_vm.markStyle === 'checkbox' ? 'checkbox' : 'radio') === 'radio' ? _c('input', {
    directives: [{
      name: "model",
      rawName: "v-model",
      value: _vm.checkedInt,
      expression: "checkedInt"
    }],
    class: ['base-checkbox-input', {
      'base-checkbox-checked': _vm.checkedInt
    }],
    attrs: {
      "id": _vm.internalId,
      "name": _vm.label,
      "type": "radio"
    },
    domProps: {
      "value": _vm.radioValueInt,
      "checked": _vm._q(_vm.checkedInt, _vm.radioValueInt)
    },
    on: {
      "keydown": function keydown($event) {
        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "enter", 13, $event.key, "Enter")) {
          return null;
        }

        $event.preventDefault();
      },
      "change": function change($event) {
        _vm.checkedInt = _vm.radioValueInt;
      }
    }
  }) : _c('input', {
    directives: [{
      name: "model",
      rawName: "v-model",
      value: _vm.checkedInt,
      expression: "checkedInt"
    }],
    class: ['base-checkbox-input', {
      'base-checkbox-checked': _vm.checkedInt
    }],
    attrs: {
      "id": _vm.internalId,
      "name": _vm.label,
      "type": _vm.markStyle === 'checkbox' ? 'checkbox' : 'radio'
    },
    domProps: _defineProperty({
      "value": _vm.radioValueInt
    }, "value", _vm.checkedInt),
    on: {
      "keydown": function keydown($event) {
        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "enter", 13, $event.key, "Enter")) {
          return null;
        }

        $event.preventDefault();
      },
      "input": function input($event) {
        if ($event.target.composing) {
          return;
        }

        _vm.checkedInt = $event.target.value;
      }
    }
  }), _vm._v(" "), _c('div', {
    class: ['base-checkmark-container', 'base-checkmark-container-' + _vm.checkBoxSize, {
      'base-radiomark': _vm.markStyle === 'radio' && _vm.checkedInt === _vm.radioValueInt
    }]
  }, [_vm.markStyle === 'checkbox' && _vm.checkedInt ? _c('base-icon', {
    class: ['base-checkmark', 'base-checkmark-' + _vm.checkBoxSize],
    attrs: {
      "name": "check-mark"
    }
  }) : _vm._e()], 1), _vm._v(" "), _c('label', {
    class: ['base-checkbox-labeltext', {
      'hide': !_vm.showLabel
    }],
    attrs: {
      "for": _vm.internalId
    }
  }, [_vm._v(_vm._s(_vm.label))])]);
};

var __vue_staticRenderFns__ = [];
/* style */

var __vue_inject_styles__ = undefined;
/* scoped */

var __vue_scope_id__ = "data-v-441efacd";
/* module identifier */

var __vue_module_identifier__ = undefined;
/* functional template */

var __vue_is_functional_template__ = false;
/* style inject */

/* style inject SSR */

/* style inject shadow dom */

var __vue_component__ = /*#__PURE__*/normalizeComponent({
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);

var BaseCheckmark = __vue_component__;

export { BaseCheckmark as default };
