'use strict';Object.defineProperty(exports,'__esModule',{value:true});var normalizeComponent=require('./normalize-component-d9981c57.js');require('./es.symbol.description-bf683260.js'),require('./es.array.sort-7d68b195.js'),require('./es.object.to-string-f27a75a8.js'),require('./es.number.constructor-daccdeab.js'),require('./es.object.keys-c57f02bd.js'),require('./es.array.includes-3990bfec.js'),require('./es.json.stringify-f88f52bf.js'),require('./regexp-exec-abstract-216cd44a.js'),require('./es.string.replace-25e9e098.js');var BaseButton=require('./BaseButton-0200f360.js');require('./es.string.split-98e29ede.js'),require('./es.regexp.to-string-5606f728.js'),require('./utils-2e136d65.js'),require('./web.dom-collections.for-each-c07b0e22.js');var BaseIcon=require('./BaseIcon-1ed3bf6e.js'),i18n=require('./i18n-68e039d3.js');require('./export-61511812.js'),require('./array-species-create-c414c2ec.js'),require('./object-keys-12f2c5e5.js'),require('./set-to-string-tag-240bb3b0.js'),require('./array-iteration-f8b4483d.js'),require('./function-bind-context-e4685306.js'),require('./create-property-240c71a5.js'),require('./array-method-has-species-support-983ac207.js'),require('./array-method-is-strict-99341ee3.js'),require('./classof-819fc780.js'),require('./object-set-prototype-of-dfa14cf5.js'),require('./string-multibyte-a2dff6e3.js'),require('./regexp-flags-abc49c4a.js'),require('./BaseBoxTooltip-59ec05c0.js'),require('./is-regexp-d6f1551e.js'),require('./typeof-6b9e62b8.js'),require('./unsupportedIterableToArray-40a00645.js'),require('./es.array.join-88750c41.js'),require('./es.array.map-4cfed4ef.js'),require('./es.string.includes-ec03e639.js'),require('./dom-iterables-e2602b7e.js'),require('./es.array.concat-bb8715dc.js');var script$1 = {
  name: 'BaseExpandListRow',
  components: {
    BaseToggle: function BaseToggle() {
      return Promise.resolve().then(function(){return require('./BaseToggle-aedfaea7.js')});
    },
    BaseButton: function BaseButton() {
      return Promise.resolve().then(function(){return require('./BaseButton-0200f360.js')});
    },
    BaseExpandListRow: BaseExpandListRow,
    BaseIcon: BaseIcon["default"]
  },
  mixins: [i18n.i],
  props: {
    /**
     * data object: { label: 'String', data: [{ value: 'String', }],
     *  [hidden]: boolean, [count]: number }<br><br>
     * optional properties:<br>
     *  count: used for the number shown in brackets
     *    (else the array length will be used)<br>
     *  hidden: used to set visibility and is set in edit mode to toggle item<br><br>
     * rendered variants: <br>
     *  expandable row: data object contains property 'label'<br>
     *  entry row: data object contains property 'value'
     */
    data: {
      type: Object,
      default: function _default() {}
    },

    /**
     * set edit mode
     */
    edit: {
      type: Boolean,
      default: false
    },

    /**
     * expand multiple items
     */
    multiple: {
      type: Boolean,
      default: false
    },

    /**
     * render component as e.g.: 'div' | 'li'
     */
    renderAs: {
      type: String,
      default: 'div'
    },

    /**
     * button text to hide item
     */
    editHideText: {
      type: String,
      default: 'Hide'
    },

    /**
     * button text to show item
     */
    editShowText: {
      type: String,
      default: 'Show'
    },

    /**
     * specify the type of visibility switch in edit mode<br>
     *  <b>button</b>: a [BaseButton](#basebutton) without text<br>
     *  <b>button</b>: a [BaseToggle](#basetoggle) element without text<br>
     */
    controlType: {
      type: String,
      default: 'button',
      validator: function validator(val) {
        return ['button', 'toggle'].includes(val);
      }
    },

    /**
     * index of parent element
     * used to expand item from outside
     */
    parentIndex: {
      type: [Number, String],
      default: 0
    },

    /**
     * option to disable the edit functionalities of the element (toggle and draggable)
     */
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data: function data() {
    return {
      // toggle item
      expanded: false,
      // referenced in BaseExpandList
      movable: false,
      // referenced in BaseExpandList
      useSupportiveText: true,
      // internal representation of data
      dataInt: null,
      // fade out overlays
      fadeOutLeft: false,
      fadeOutRight: true
    };
  },
  computed: {
    itemVisible: {
      set: function set(val) {
        this.$set(this.dataInt, 'hidden', !val);
      },
      get: function get() {
        return !this.dataInt.hidden;
      }
    }
  },
  watch: {
    /**
     * Set focus to active movable item
     *
     * @params {string}
     */
    movable: function movable(val) {
      var dragHandle = this.$el.querySelector('.base-expand-item__handle');

      if (val) {
        dragHandle.focus();
      } // check if dragHandle has focus


      if (document.activeElement === dragHandle) {
        // emit supportive text for aria-live
        this.supportiveText(this.movable ? 'activated' : 'activate');
      } // enable supportive text (disabled by moveItem())


      this.useSupportiveText = true;
    },
    dataInt: {
      handler: function handler(val) {
        // check if data has values (and is not initial null) and if it differs
        // from parent data
        if (!!val && JSON.stringify(val) !== JSON.stringify(this.data)) {
          // if yes update parent data
          this.$emit('update:data', val);
        }
      },
      deep: true,
      immediate: true
    },
    data: {
      handler: function handler(val) {
        // check if parent data differ from internal data - if yes update
        if (JSON.stringify(val) !== JSON.stringify(this.dataInt)) {
          this.dataInt = JSON.parse(JSON.stringify(val));
        }
      },
      deep: true,
      immediate: true
    }
  },
  mounted: function mounted() {
    var _this = this;

    if (this.$refs.listItemScrollable) {
      var scrollable = this.$refs.listItemScrollable;
      scrollable.addEventListener('scroll', function () {
        return _this.scrollHandler(scrollable);
      });
    }
  },
  destroyed: function destroyed() {
    var _this2 = this;

    if (this.$refs.listItemScrollable) {
      var scrollable = this.$refs.listItemScrollable;
      scrollable.removeEventListener('scroll', function () {
        return _this2.scrollHandler(scrollable);
      });
    }
  },
  methods: {
    /**
     * cancel movable state, stop propagation if needed<br>
     *   e.g. further esc key event
     * @param {KeyboardEvent} e - event
     */
    cancelMovable: function cancelMovable(e) {
      if (this.movable) {
        e.stopPropagation();
        e.stopImmediatePropagation();
        e.preventDefault();
        e.cancelBubble = false;
        this.movable = false;
      }
    },

    /**
     * set visibility if button was clicked
     */
    setVisibility: function setVisibility(val) {
      this.itemVisible = val;
    },

    /**
     * move item
     *
     * @param {string} direction values: 'up' | 'down'
     */
    moveItem: function moveItem() {
      var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'up ';

      if (this.movable) {
        // disable supportive text to avoid message cue
        this.useSupportiveText = false;
        this.movable = false;
        this.$emit('sorted', {
          direction: direction
        });
      }
    },

    /**
     * expand item
     */
    expand: function expand() {
      // which element(s) are currently expanded
      // eg: level1, first item = 0; level2, second item: 0-1
      var currentState = this.$vnode.key.toString().split('-');

      if (this.expanded) {
        this.expanded = false; // remove current level and emit expanded state

        this.emitExpandedState(currentState.length > 1 ? currentState.slice(-1) : '');
        return;
      } // close expanded rows


      if (!this.multiple) {
        var rows = this.$parent.$refs.baseExpandListRow;

        if (rows) {
          rows.forEach(function (row) {
            // eslint-disable-next-line
            row.expanded = false;
          });
        }
      }

      this.expanded = true;
      this.emitExpandedState(currentState);
    },

    /**
     * emit expanded state of items
     * each array element represents the index of the expanded item per level
     * eg: [0,1]: level1 first item, level2 second item is expanded
     *
     * @param {Array} value - value to emit
     */
    emitExpandedState: function emitExpandedState(value) {
      /**
       * event triggered when expanded state changes
       *
       * @event expanded-state
       * @type { array }
       */
      this.$emit('expanded-state', value);
    },

    /**
     * calc max height for transition
     *
     * @params {object} el
     */
    maxHeight: function maxHeight(el) {
      var elementHeight = this.$el.querySelector('.base-expand-item').offsetHeight;
      var maxHeight = elementHeight + elementHeight * this.dataInt.data.length;
      el.setAttribute('style', "max-height: ".concat(maxHeight, "px"));
    },

    /**
     * close expanded rows
     *
     * @params {array} rows
     */
    closeRows: function closeRows(rows) {
      if (rows) {
        rows.forEach(function (row) {
          // eslint-disable-next-line
          row.expanded = false;
        });
      }
    },

    /**
     * event triggered on enter transition
     *
     * @params {object} el
     */
    enter: function enter(el) {
      this.maxHeight(el);
    },

    /**
     * event triggered on finished enter transition
     *
     * @params {object} el
     */
    afterEnter: function afterEnter(el) {
      el.style.removeProperty('max-height');
    },

    /**
     * event triggered on leave transition
     *
     * @params {object} el
     */
    leave: function leave(el) {
      var elementHeight = this.$el.offsetHeight;
      el.setAttribute('style', "max-height: ".concat(elementHeight, "px"));
    },

    /**
     * event triggered on before leave transition
     */
    beforeLeave: function beforeLeave() {
      // close expanded rows of current level
      if (!this.multiple) {
        this.closeRows(this.$refs.baseExpandListRow);
      }
    },

    /**
     * supportive text for screen readers
     */
    supportiveText: function supportiveText() {
      var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'activate';

      if (!this.useSupportiveText) {
        return;
      }
      /**
       * event emitted on dragHandle toggle
       *
       * @event supportive
       * @property {string} type
       */


      this.$emit('supportive', type);
    },

    /**
     * set fadeOut elements depending on scroll position
     *
     * @param {object} row
     */
    scrollHandler: function scrollHandler(row) {
      this.fadeOutLeft = !!row.scrollLeft;
      this.fadeOutRight = row.scrollWidth - row.scrollLeft !== row.offsetWidth;
    }
  }
};/* script */
var __vue_script__$1 = script$1;
/* template */

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

  var _h = _vm.$createElement;

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

  return _c(_vm.renderAs, {
    tag: "component",
    class: [{
      'base-expand': !_vm.edit,
      'expanded': _vm.expanded
    }]
  }, [!_vm.edit && _vm.dataInt.label ? [_c('button', {
    staticClass: "base-expand__head base-expand-item",
    attrs: {
      "id": 'base-expand-control-' + _vm._uid,
      "aria-expanded": _vm.expanded ? 'true' : 'false',
      "aria-controls": 'base-expand-region-' + _vm._uid,
      "type": "button"
    },
    on: {
      "click": _vm.expand
    }
  }, [_c('span', {
    staticClass: "base-expand-item__col base-expand-item__label base-text-fade-out"
  }, [_c('span', {
    staticClass: "base-expand__head__label"
  }, [_vm._v(_vm._s(_vm.dataInt.label))]), _vm._v(" "), _c('span', {
    staticClass: "base-expand__head__additional"
  }, [_vm._v("\n          (" + _vm._s(_vm.dataInt.count !== undefined ? _vm.dataInt.count : _vm.dataInt.data.length) + ")\n        ")])]), _vm._v(" "), _c('base-icon', {
    staticClass: "base-expand-item__col base-expand__head__icon",
    attrs: {
      "name": "drop-down"
    }
  })], 1), _vm._v(" "), _c('transition', {
    attrs: {
      "name": "expand"
    },
    on: {
      "enter": _vm.enter,
      "after-enter": _vm.afterEnter,
      "leave": _vm.leave,
      "before-leave": _vm.beforeLeave
    }
  }, [_c('ul', {
    directives: [{
      name: "show",
      rawName: "v-show",
      value: _vm.expanded,
      expression: "expanded"
    }],
    staticClass: "base-expand__body",
    attrs: {
      "id": 'base-expand-region-' + _vm._uid,
      "aria-labelledby": 'base-expand-control-' + _vm._uid,
      "aria-hidden": !_vm.expanded ? 'true' : 'false'
    }
  }, _vm._l(_vm.dataInt.data, function (items, index) {
    return _c('base-expand-list-row', {
      key: _vm.parentIndex + "-" + index,
      ref: "baseExpandListRow",
      refInFor: true,
      attrs: {
        "data": items,
        "multiple": _vm.multiple,
        "render-as": "li"
      },
      on: {
        "expanded-state": _vm.emitExpandedState
      },
      scopedSlots: _vm._u([{
        key: "content",
        fn: function fn(dataNextLevel) {
          return [_vm._t("content", null, {
            "data": dataNextLevel.data
          })];
        }
      }], null, true)
    });
  }), 1)])] : _vm._e(), _vm._v(" "), !_vm.edit && _vm.dataInt.value ? [_c('div', {
    class: ['base-expand-item', 'base-expand-item--intend', {
      'base-text-fade-out-left': _vm.fadeOutLeft,
      'base-text-fade-out': _vm.fadeOutRight
    }]
  }, [_c('span', {
    ref: "listItemScrollable",
    staticClass: "base-expand-item__col base-expand-item__label"
  }, [_vm._t("content", function () {
    return [_vm._v("\n          " + _vm._s(_vm.dataInt.value) + "\n        ")];
  }, {
    "data": _vm.dataInt
  })], 2)])] : _vm._e(), _vm._v(" "), _vm.edit ? [_c('div', {
    class: ['base-expand-item', {
      'base-expand-item--movable': _vm.movable
    }]
  }, [_c('span', {
    ref: "baseExpandItemHandle",
    staticClass: "base-expand-item__col base-expand-item__handle",
    attrs: {
      "title": _vm.dataInt.label,
      "tabindex": "0"
    },
    on: {
      "keydown": [function ($event) {
        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "down", 40, $event.key, ["Down", "ArrowDown"])) {
          return null;
        }

        $event.preventDefault();
        $event.stopPropagation();
        return _vm.moveItem('down');
      }, function ($event) {
        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "up", 38, $event.key, ["Up", "ArrowUp"])) {
          return null;
        }

        $event.preventDefault();
        $event.stopPropagation();
        return _vm.moveItem('up');
      }, function ($event) {
        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "space", 32, $event.key, [" ", "Spacebar"])) {
          return null;
        }

        $event.preventDefault();
        $event.stopPropagation();
        _vm.movable = !_vm.movable;
      }],
      "focus": function focus($event) {
        return _vm.supportiveText('activate');
      },
      "keyup": function keyup($event) {
        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "esc", 27, $event.key, ["Esc", "Escape"])) {
          return null;
        }

        return _vm.cancelMovable.apply(null, arguments);
      },
      "blur": _vm.cancelMovable
    }
  }, [_c('base-icon', {
    attrs: {
      "name": "drag-lines"
    }
  })], 1), _vm._v(" "), _c('div', {
    staticClass: "base-expand-item__col base-expand-item__label base-text-fade-out"
  }, [!_vm.itemVisible ? _c('div', {
    staticClass: "base-expand-item__overlay"
  }) : _vm._e(), _vm._v(" "), _c('span', {
    class: ['base-expand__head__label', {
      'base-expand__head__label--disabled': !_vm.itemVisible
    }]
  }, [_vm._v("\n          " + _vm._s(_vm.dataInt.label) + "\n        ")]), _vm._v(" "), _c('span', {
    staticClass: "base-expand__head__additional"
  }, [_vm._v("\n          (" + _vm._s(_vm.dataInt.count !== undefined ? _vm.dataInt.count : _vm.dataInt.data.length) + ")\n        ")])]), _vm._v(" "), _c('div', {
    staticClass: "base-expand-item__col base-expand-item__controls"
  }, [_vm.controlType === 'button' ? _c('base-button', {
    attrs: {
      "icon": _vm.itemVisible ? 'eye' : 'eye-hide',
      "text": '',
      "has-background-color": false,
      "disabled": _vm.disabled,
      "aria-label": (_vm.itemVisible ? _vm.editHideText : _vm.editShowText) + " " + _vm.dataInt.label,
      "icon-size": "large",
      "icon-position": "left"
    },
    on: {
      "clicked": function clicked($event) {
        return _vm.setVisibility(!_vm.itemVisible);
      }
    }
  }) : _vm.controlType === 'toggle' ? _c('BaseToggle', {
    staticClass: "base-expand-item__toggle",
    attrs: {
      "disabled": _vm.disabled,
      "hide-label": true,
      "label": _vm.editShowText + " " + _vm.dataInt.label
    },
    model: {
      value: _vm.itemVisible,
      callback: function callback($$v) {
        _vm.itemVisible = $$v;
      },
      expression: "itemVisible"
    }
  }) : _vm._e()], 1)])] : _vm._e()], 2);
};

var __vue_staticRenderFns__$1 = [];
/* style */

var __vue_inject_styles__$1 = undefined;
/* scoped */

var __vue_scope_id__$1 = "data-v-654464d6";
/* module identifier */

var __vue_module_identifier__$1 = "data-v-654464d6";
/* functional template */

var __vue_is_functional_template__$1 = false;
/* style inject */

/* style inject SSR */

/* style inject shadow dom */

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

var BaseExpandListRow = __vue_component__$1;var script = {
  name: 'BaseExpandList',
  components: {
    BaseButton: BaseButton["default"],
    BaseExpandListRow: BaseExpandListRow,
    Draggable: function Draggable() {
      return Promise.resolve().then(function(){return require('./vuedraggable.umd-72cec8f4.js')}).then(function(n){return n.v}).then(function (m) {
        return m.default || m;
      });
    }
  },
  props: {
    /**
     * data object: [{ label: 'String', id: 'String', data: [{ value: 'String', }],
     *  [hidden]: boolean, [count]: number }]<br><br>
     * optional properties:<br>
     *  count: used for the number shown in brackets
     *    (else the array length will be used)<br>
     *  hidden: used to set visibility and is set in edit mode to toggle item<br><br>
     * rendered variants: <br>
     *  expandable row: data object contains property 'label'<br>
     *  entry row: data object contains property 'value'
     */
    data: {
      type: Array,
      default: function _default() {
        return [];
      }
    },

    /**
     * set edit mode from outside
     */
    edit: {
      type: Boolean,
      default: false
    },

    /**
     * specify number of minimal displayed items
     */
    minItems: {
      type: Number,
      default: 3
    },

    /**
     * expand multiple items
     */
    multiple: {
      type: Boolean,
      default: false
    },

    /**
     * button text to show more content
     */
    showMoreText: {
      type: String,
      default: 'Show all'
    },

    /**
     * button text to show less content
     */
    showLessText: {
      type: String,
      default: 'Show less'
    },

    /**
     * button text to hide item
     */
    editHideText: {
      type: String,
      default: 'Hide'
    },

    /**
     * button text to show item
     */
    editShowText: {
      type: String,
      default: 'Show'
    },

    /**
     * additional texts for screen-reader users to order items<br>
     *   object that needs to have the following properties:<br>
     *   <b>activate</b>: Text read when item is focused, use variable {state} to
     *    announce item visibility - specify text used in properties 'hidden' and 'visible'
     *   <b>activated</b>: Text read after item was activated (selected by spacebar)
     *   <b>description</b>: Text read on initial list focus
     *   <b>moved</b>: Text read after item was moved
     *   <b>visible</b>: string substituted to 'activate' text for state variable if item is visible
     *   <b>hidden</b>: string substituted to 'activate' text for state variable if item is hidden
     *   { activate: 'aaa', activated: 'bbb', description: 'ccc', moved: 'ddd' }<br>
     *   property moved can contain variables {pos} and {total}
     */
    supportiveText: {
      type: Object,
      default: function _default() {
        return {
          activate: 'Click Spacebar to select item. Item is currently {state}',
          activated: 'Item selected. Use arrow keys to order item.',
          description: 'Use Tab key to navigate to item an order item.',
          moved: 'Item moved: {pos} of {total}',
          visible: 'visible',
          hidden: 'hidden'
        };
      },
      validator: function validator(val) {
        return Object.keys(val).every(function (key) {
          return ['activate', 'activated', 'description', 'moved', 'visible', 'hidden'].includes(key);
        });
      }
    },

    /**
     * specify the type of visibility switch in edit mode<br>
     *  <b>button</b>: a [BaseButton](#basebutton) without text<br>
     *  <b>button</b>: a [BaseToggle](#basetoggle) element without text<br>
     */
    controlType: {
      type: String,
      default: 'button',
      validator: function validator(val) {
        return ['button', 'toggle'].includes(val);
      }
    },

    /**
     * define which items are expanded
     */
    expanded: {
      type: Array,
      default: function _default() {
        return [];
      }
    },

    /**
     * option to disable the edit functionalities of the element (toggle and draggable)
     */
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data: function data() {
    return {
      assertiveText: '',
      showAll: false,
      dataSorted: null,
      originalData: null,
      dragHandle: ''
    };
  },
  computed: {
    // the data array computed for draggable
    dataInt: {
      get: function get() {
        return this.dataSorted || this.data;
      },
      set: function set(val) {
        this.dataSorted = val;
      }
    }
  },
  watch: {
    dataSorted: {
      handler: function handler(val) {
        // check if update is actually done by user during edit mode
        // (this is the only time internal data should change!)
        if (this.edit && JSON.stringify(val) !== JSON.stringify(this.data)) {
          this.$emit('update:data', val);
        }
      },
      deep: true
    },
    data: {
      handler: function handler(val) {
        if (JSON.stringify(val) !== JSON.stringify(this.dataSorted)) {
          this.dataInt = JSON.parse(JSON.stringify(val));
        }
      },
      deep: true,
      immediate: true
    },

    /**
     * watch edit to create a copy of the data for the reset function
     */
    edit: function edit(val) {
      var _this = this;

      this.assertiveText = '';

      if (val) {
        this.$nextTick(function () {
          // set focus draggable area on edit start
          _this.$refs.baseExpandListDraggable.focus({
            preventScroll: true
          });
        }); // save a copy of original data in variable on edit activation

        this.originalData = JSON.parse(JSON.stringify(this.data));
      }
    },

    /**
     * watch expanded state and expand items
     */
    expanded: function expanded(val) {
      this.expandItems(val);
    }
  },
  mounted: function mounted() {
    // set draggable area depending on device touch capabilities
    // ssr: check when component is mounted because isTouchCapable() uses window object
    this.dragHandle = this.isTouchCapable() ? ['.base-expand-item__handle'] : ['.base-expand-item__handle', '.base-expand-item__label'];
  },
  methods: {
    /**
     * expand items
     *
     * @param {Array} state - expanded state, eg: [0, 1]: level1 first item,
     *  level2 second item is expanded
     */
    expandItems: function expandItems(state) {
      if (!state.length) {
        return;
      } // show all list items


      if (state[0] >= this.minItems && this.$refs.baseExpandListRow[state[0]]) {
        this.showAll = true;
      } // first level


      if (state[0] !== undefined && this.$refs.baseExpandListRow[state[0]]) {
        this.$refs.baseExpandListRow[state[0]].expanded = true;
      } // second level


      if (state[1] !== undefined && this.$refs.baseExpandListRow[state[0]].$refs.baseExpandListRow[state[1]]) {
        this.$refs.baseExpandListRow[state[0]].$refs.baseExpandListRow[state[1]].expanded = true;
      }
    },

    /**
     * emit expanded state of items
     * each array element represents the index of the expanded item per level
     * eg: [0, 1]: level1 first item, level2 second item is expanded
     *
     * @param {Array} value - value to emit
     */
    emitExpandedState: function emitExpandedState(value) {
      /**
       * event triggered when expanded state changes
       *
       * @event expanded-state
       * @type { array }
       */
      this.$emit('expanded-state', value);
    },

    /**
     * function called from BaseExpandListRow in case a prop of the data variable
     * changes (e.g. hidden)
     * @param {Object} rowData - the updated data of the BaseExpandListRow
     * @param {number} index - the index in the dataInt array
     */
    updateData: function updateData(rowData, index) {
      this.$set(this.dataSorted, index, rowData);
    },

    /**
     * sort list
     *
     * @param {object} obj
     * @property {string} obj.direction - 'up' or 'down'
     * @param {number} index - the previous index of the item in the array
     */
    sort: function sort(_ref, index) {
      var direction = _ref.direction;

      // check list boundary
      if (direction === 'up' && index - 1 < 0 || direction === 'down' && index + 1 >= this.dataInt.length) {
        // current movable item (focus) needs to stay the same
        this.$refs.baseExpandListRow[index].useSupportiveText = false;
        this.$refs.baseExpandListRow[index].movable = true;
        return;
      } // set object to new position


      var to = direction === 'up' ? index - 1 : index + 1;
      var from = index;
      var data = this.dataInt;
      data.splice(to, 0, data.splice(from, 1)[0]);
      this.dataInt = data; // set assertive text

      this.assertiveText = this.supportiveText.moved.replace('{pos}', to + 1).replace('{total}', this.dataInt.length); // set current item movable (focus)

      this.$refs.baseExpandListRow[to].useSupportiveText = false;
      this.$refs.baseExpandListRow[to].movable = true;
    },

    /**
     * reset list data - this always restores the state of the data on
     * last save() triggered (=was triggered in parent)
     * @public
     */
    reset: function reset() {
      this.dataInt = JSON.parse(JSON.stringify(this.originalData)); // watcher on sortedData is not triggered here (because edit is already false)
      // - need to propagate event to parent manually

      this.$emit('update:data', this.dataInt);
    },

    /**
     * save changed data
     * @public
     */
    save: function save() {
      /**
       * triggered on button click
       *
       * @type {object}
       */
      this.$emit('saved', this.dataInt); // update reset data copy

      this.originalData = JSON.parse(JSON.stringify(this.dataInt));
    },

    /**
     * set supportiveText for screen readers
     *
     * @param {string} type
     * @param {number} index
     */
    supportive: function supportive(type, index) {
      var _this2 = this;

      var visibilityText = this.dataInt[index].hidden ? this.supportiveText.hidden : this.supportiveText.visible;
      var currentSupportString = this.supportiveText[type].replace('{state}', visibilityText);

      if (this.assertiveText === currentSupportString) {
        // clear temporary to trigger screen reader
        this.assertiveText = ''; // screen reader needs delay to trigger aria-live message

        setTimeout(function () {
          _this2.assertiveText = currentSupportString;
        }, 1);
        return;
      }

      this.assertiveText = currentSupportString;
    },

    /**
     * check touch capabilities of current device
     *
     * @returns {boolean|*}
     */
    isTouchCapable: function isTouchCapable() {
      return 'ontouchstart' in window || window.DocumentTouch && document instanceof window.DocumentTouch || navigator.maxTouchPoints > 0 || window.navigator.msMaxTouchPoints > 0;
    }
  }
};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-expand-list"
  }, [_vm._ssrNode("<div" + _vm._ssrClass(null, ['base-box-shadow', {
    'base-box-shadow--edit': _vm.edit
  }]) + " data-v-14761239>", "</div>", [!_vm.edit ? _vm._ssrNode("<ul data-v-14761239>", "</ul>", _vm._l(_vm.data, function (items, index) {
    return _c('base-expand-list-row', {
      directives: [{
        name: "show",
        rawName: "v-show",
        value: index < (_vm.showAll ? _vm.data.length : _vm.minItems),
        expression: "index < (showAll ? data.length : minItems)"
      }],
      key: index,
      ref: "baseExpandListRow",
      refInFor: true,
      attrs: {
        "parent-index": index,
        "data": items,
        "multiple": _vm.multiple,
        "render-as": "li"
      },
      on: {
        "expanded-state": _vm.emitExpandedState
      },
      scopedSlots: _vm._u([{
        key: "content",
        fn: function fn(props) {
          return [_vm._t("content", null, {
            "data": props.data
          })];
        }
      }], null, true)
    });
  }), 1) : _vm._e(), _vm._ssrNode(" "), _vm.edit ? [_vm._ssrNode("<div aria-live=\"assertive\" class=\"supportive-text\" data-v-14761239>" + _vm._ssrEscape("\n        " + _vm._s(_vm.assertiveText) + "\n      ") + "</div> <p" + _vm._ssrAttr("id", "draggable-" + _vm._uid) + " class=\"supportive-text\" data-v-14761239>" + _vm._ssrEscape("\n        " + _vm._s(_vm.supportiveText['description']) + "\n      ") + "</p> "), _vm._ssrNode("<div tabindex=\"0\"" + _vm._ssrAttr("aria-labelledby", "draggable-" + _vm._uid) + " class=\"base-expand-list__draggable\" data-v-14761239>", "</div>", [_c('draggable', {
    staticClass: "base-expand-list__draggable",
    attrs: {
      "draggable": '.base-expand-list__draggable__item',
      "handle": _vm.dragHandle,
      "disabled": _vm.disabled,
      "animation": "150"
    },
    model: {
      value: _vm.dataInt,
      callback: function callback($$v) {
        _vm.dataInt = $$v;
      },
      expression: "dataInt"
    }
  }, _vm._l(_vm.dataInt, function (item, index) {
    return _c('base-expand-list-row', {
      key: index,
      ref: "baseExpandListRow",
      refInFor: true,
      staticClass: "base-expand-list__draggable__item",
      attrs: {
        "data": item,
        "edit": true,
        "edit-hide-text": _vm.editHideText,
        "edit-show-text": _vm.editShowText,
        "control-type": _vm.controlType,
        "disabled": _vm.disabled
      },
      on: {
        "supportive": function supportive($event) {
          return _vm.supportive($event, index);
        },
        "sorted": function sorted($event) {
          return _vm.sort($event, index);
        },
        "update:data": function updateData($event) {
          return _vm.updateData($event, index);
        }
      }
    });
  }), 1)], 1)] : _vm._e()], 2), _vm._ssrNode(" "), !_vm.edit && _vm.data.length > _vm.minItems ? _c('base-button', {
    class: {
      'base-button-icon-rotate-180': _vm.showAll
    },
    attrs: {
      "id": "base-expand-list-" + _vm._uid,
      "aria-expanded": _vm.showAll ? 'true' : 'false',
      "has-background-color": false,
      "icon": "drop-down",
      "icon-position": "right",
      "text": _vm.showAll ? _vm.showLessText : _vm.showMoreText
    },
    on: {
      "clicked": function clicked($event) {
        _vm.showAll = !_vm.showAll;
      }
    }
  }) : _vm._e()], 2);
};

var __vue_staticRenderFns__ = [];
/* style */

var __vue_inject_styles__ = undefined;
/* scoped */

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

var __vue_module_identifier__ = "data-v-14761239";
/* functional template */

var __vue_is_functional_template__ = false;
/* style inject */

/* style inject SSR */

/* style inject shadow dom */

var __vue_component__ = /*#__PURE__*/normalizeComponent.n({
  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 BaseExpandList = __vue_component__;var Plugin = {
  install: function install(Vue) {
    normalizeComponent.r(Vue, BaseExpandList);
  }
};
normalizeComponent.u(Plugin);exports.BaseExpandList=BaseExpandList;exports["default"]=Plugin;