import GlDropdownItem from '../../../../../../base/dropdown/dropdown_item';
import GlIcon from '../../../../../../base/icon/icon';
import { categoriesValidator } from '../utils';
import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';

var script = {
  name: 'GlDuoChatContextItemMenuCategoryItems',
  components: {
    GlIcon,
    GlDropdownItem
  },
  props: {
    categories: {
      type: Array,
      required: true,
      validator: categoriesValidator
    },
    activeIndex: {
      type: Number,
      required: true
    }
  },
  methods: {
    selectCategory(category) {
      this.$emit('select', category);
    },
    setActiveIndex(index) {
      this.$emit('active-index-change', index);
    }
  }
};

/* script */
const __vue_script__ = script;

/* template */
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('ul',{staticClass:"gl-mb-0 gl-list-none gl-pl-0"},_vm._l((_vm.categories),function(category,index){return _c('gl-dropdown-item',{key:category.value,class:{ 'active-command': index === _vm.activeIndex },attrs:{"data-testid":"category-item"},on:{"click":function($event){return _vm.selectCategory(category)}}},[_c('div',{staticClass:"gl-flex gl-items-center",on:{"mouseenter":function($event){return _vm.setActiveIndex(index)}}},[_c('gl-icon',{staticClass:"gl-mr-2",attrs:{"name":category.icon}}),_vm._v("\n      "+_vm._s(category.label)+"\n    ")],1)])}),1)};
var __vue_staticRenderFns__ = [];

  /* style */
  const __vue_inject_styles__ = undefined;
  /* scoped */
  const __vue_scope_id__ = undefined;
  /* module identifier */
  const __vue_module_identifier__ = undefined;
  /* functional template */
  const __vue_is_functional_template__ = false;
  /* style inject */
  
  /* style inject SSR */
  
  /* style inject shadow dom */
  

  
  const __vue_component__ = __vue_normalize__(
    { 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
  );

export default __vue_component__;
