import './es.array.map-093cfbca.js';
import './es.array.filter-9f634d7c.js';
import './es.object.to-string-5a59fbfc.js';
import './es.array.includes-1f433385.js';
import './es.string.includes-53dbb113.js';
import BaseButton from './BaseButton-16d830a6.js';
import { n as normalizeComponent } from './normalize-component-63e8c7a0.js';
import './export-ecf4b1cb.js';
import './array-iteration-dec5536e.js';
import './function-bind-context-b3fabf77.js';
import './array-species-create-afb281e6.js';
import './array-method-has-species-support-d96108b0.js';
import './classof-b10e7604.js';
import './object-keys-a5d351f7.js';
import './is-regexp-5558fd03.js';
import './es.symbol.description-3b56bced.js';
import './set-to-string-tag-452fb9b0.js';
import './utils-21c04279.js';
import './typeof-6c6d8d7a.js';
import './unsupportedIterableToArray-577176bf.js';
import './es.array.join-6ca857ff.js';
import './array-method-is-strict-903f485b.js';
import './regexp-exec-abstract-04d119fc.js';
import './string-multibyte-88926e02.js';
import './regexp-flags-b5fc4ddb.js';
import './es.string.split-cd1f3afc.js';
import './es.array.slice-e9c3dd03.js';
import './create-property-c00b5c27.js';
import './es.regexp.to-string-784af81c.js';
import './es.string.replace-07eeebfe.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';
import './BaseIcon-d03b1fa2.js';
import './es.array.concat-9f3136dc.js';
import './BaseBoxTooltip-29b1c51f.js';

/**
 * component to enable display of selected items and a select all
 */

var script = {
  name: 'BaseSelectOptions',
  components: {
    BaseButton: BaseButton
  },
  props: {
    /**
     * specify the text displayed for number of selected entries
     * x {selectText}
     */
    selectedNumberText: {
      type: String,
      default: 'entries selected'
    },

    /**
     * the text displayed for select / deselect all
     */
    selectText: {
      type: String,
      default: 'All'
    },

    /**
     * the text displayed for select / deselect all
     */
    deselectText: {
      type: String,
      default: 'None'
    },

    /**
     * provide a list of currently visible entries
     */
    list: {
      type: Array,
      default: function _default() {
        return [];
      }
    },

    /**
     * provide a list of selected entries
     */
    selectedList: {
      type: Array,
      default: function _default() {
        return [];
      }
    },

    /**
     * disable the button by setting this prop to true
     */
    selectAllDisabled: {
      type: Boolean,
      default: false
    },

    /**
     * By default, the "All/None" button appears on the right, and the counter of
     * selected items appears on the left. Set this to `true` to reverse the order.
     */
    reverse: {
      type: Boolean,
      default: false
    }
  },
  data: function data() {
    return {
      selectedInt: false,
      // used to change the flex direction of select options from 'row' to 'row-reverse' (#1692)
      flexDirection: 'row'
    };
  },
  computed: {
    numberSelected: function numberSelected() {
      return this.selectedList.length;
    },
    allSelected: function allSelected() {
      // not just calc comparing selectedList with list because with pagination
      // selectedList can contain entries that are currently not incluced in list
      var idList = this.selectedList.length && this.selectedList[0].id ? this.selectedList.map(function (entry) {
        return entry.id;
      }) : this.selectedList;
      var unselectedLength = this.list.filter(function (entry) {
        return !idList.includes(entry.id);
      }).length;
      return unselectedLength === 0;
    }
  },
  watch: {
    allSelected: {
      handler: function handler(val) {
        if (val !== this.selectedInt) {
          this.selectedInt = val;
        }
      },
      immediate: true
    }
  },
  created: function created() {
    // swap position of select options based on the 'reverse' prop (#1692)
    this.flexDirection = this.reverse ? 'row-reverse' : 'row';
  },
  methods: {
    select: function select() {
      this.selectedInt = !this.selectedInt;
      /**
       * emitted on select all button click
       *
       * @event selected
       * @param {boolean} selectedInt
       */

      this.$emit('selected', this.selectedInt);
    }
  }
};

/* script */
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', {
    staticClass: "base-select-options",
    style: {
      '--direction': _vm.flexDirection
    }
  }, [_c('div', {
    staticClass: "base-select-options__number-selected"
  }, [_vm._t("selectedText", function () {
    return [_vm._v("\n      " + _vm._s(_vm.numberSelected + " " + _vm.selectedNumberText) + "\n    ")];
  })], 2), _vm._v(" "), _c('BaseButton', {
    staticClass: "base-select-options__select-button",
    attrs: {
      "text": _vm.allSelected ? _vm.deselectText : _vm.selectText,
      "disabled": _vm.selectAllDisabled,
      "button-style": "secondary"
    },
    on: {
      "clicked": _vm.select
    }
  })], 1);
};

var __vue_staticRenderFns__ = [];
/* style */

var __vue_inject_styles__ = undefined;
/* scoped */

var __vue_scope_id__ = "data-v-384cd160";
/* 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 BaseSelectOptions = __vue_component__;

export { BaseSelectOptions as default };
