/**
 * ldesign v0.2.14
 * (c) 2022/11/2 16:16 built by swimly
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var VueCompositionAPI = require('@vue/composition-api');
var iconsVue = require('@ldesign/icons-vue');
var isFunction = require('lodash/isFunction');
var components_divider_index = require('../divider/index.js');
var hooks_useConfig = require('../../hooks/use-config.js');
var hooks_useGlobalIcon = require('../../hooks/use-global-icon.js');
var components_dropdown_dropdownItem = require('./dropdown-item.js');
var components_dropdown_props = require('./props.js');
require('../../utils/with-install.js');
require('vue');
require('lodash');
require('../../config.js');
require('../divider/divider.js');
require('../../utils/render-node.js');
require('../config-provider/config-receiver.js');
require('lodash/mergeWith');
require('../config-provider/context.js');
require('../../chunks/zh_CN.js');
require('../../utils/mixins.js');
require('../divider/props.js');
require('../config-provider/useConfig.js');
require('../../hooks/lnode.js');
require('lodash/isEmpty');
require('lodash/camelCase');
require('lodash/kebabCase');
require('../../hooks/render-lnode.js');
require('../../utils/helper.js');
require('../../utils/ripple.js');
require('../../chunks/set-style.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var isFunction__default = /*#__PURE__*/_interopDefaultLegacy(isFunction);

var _DropdownMenu = VueCompositionAPI.defineComponent({
  name: "LDropdownMenu",
  props: {
    ...components_dropdown_props.DropdownProps
  },
  setup(props, _ref) {
    let {
      emit
    } = _ref;
    const dropdownClass = hooks_useConfig.usePrefixClass("dropdown");
    const dropdownMenuClass = hooks_useConfig.usePrefixClass("dropdown__menu");
    const handleItemClick = (optionItem, options) => {
      var _data$onClick, _props$onClick;
      if (optionItem.disabled || optionItem.children) return;
      const {
        data,
        context
      } = options;
      data === null || data === void 0 ? void 0 : (_data$onClick = data.onClick) === null || _data$onClick === void 0 ? void 0 : _data$onClick.call(data, data, context);
      (_props$onClick = props.onClick) === null || _props$onClick === void 0 ? void 0 : _props$onClick.call(props, data, context);
      emit("click", data, context);
    };
    return {
      dropdownClass,
      dropdownMenuClass,
      handleItemClick
    };
  },
  methods: {
    renderOptionContent(content) {
      if (isFunction__default["default"](content)) return content(VueCompositionAPI.h);
      return content;
    },
    renderOptions(data) {
      var _data$forEach;
      const h = this.$createElement;
      const {
        ChevronRightIcon,
        ChevronLeftIcon
      } = hooks_useGlobalIcon.useGlobalIcon({
        ChevronRightIcon: iconsVue.ChevronRightIcon,
        ChevronLeftIcon: iconsVue.ChevronLeftIcon
      });
      const arr = [];
      let renderContent;
      (_data$forEach = data.forEach) === null || _data$forEach === void 0 ? void 0 : _data$forEach.call(data, (menu, idx) => {
        const optionItem = {
          ...menu
        };
        if (optionItem.children) {
          optionItem.children = this.renderOptions(optionItem.children);
          renderContent = h("div", {
            "key": idx
          }, [h(components_dropdown_dropdownItem["default"], {
            "class": [`${this.dropdownClass}__item`, `${this.dropdownClass}__item--suffix`, optionItem.class],
            "props": {
              ...{
                value: optionItem.value,
                theme: optionItem.theme,
                active: optionItem.active,
                prefixIcon: optionItem.prefixIcon,
                disabled: optionItem.disabled,
                minColumnWidth: this.minColumnWidth,
                maxColumnWidth: this.maxColumnWidth,
                isSubmenu: true
              }
            }
          }, [this.direction === "right" ? h("div", {
            "class": `${this.dropdownClass}__item-content`
          }, [h("span", {
            "class": `${this.dropdownClass}__item-text`
          }, [this.renderOptionContent(optionItem.content)]), h(ChevronRightIcon, {
            "class": `${this.dropdownClass}__item-direction`,
            "attrs": {
              "size": "16"
            }
          })]) : h("div", {
            "class": `${this.dropdownClass}__item-content`
          }, [h(ChevronLeftIcon, {
            "class": `${this.dropdownClass}__item-direction`,
            "attrs": {
              "size": "16"
            }
          }), h("span", {
            "class": `${this.dropdownClass}__item-text`
          }, [this.renderOptionContent(optionItem.content)])]), h("div", {
            "class": [`${this.dropdownClass}__submenu`, {
              [`${this.dropdownClass}__submenu--disabled`]: optionItem.disabled,
              [`${this.dropdownClass}__submenu--${this.direction}`]: this.direction
            }],
            "style": {
              top: `${idx * 30}px`
            }
          }, [h("ul", [optionItem.children])])]), optionItem.divider ? h(components_divider_index.Divider) : null]);
        } else {
          renderContent = h("div", {
            "key": idx
          }, [h(components_dropdown_dropdownItem["default"], {
            "class": [`${this.dropdownClass}__item`, optionItem.class],
            "props": {
              ...{
                value: optionItem.value,
                theme: optionItem.theme,
                active: optionItem.active,
                prefixIcon: optionItem.prefixIcon,
                disabled: optionItem.disabled,
                minColumnWidth: this.minColumnWidth,
                maxColumnWidth: this.maxColumnWidth,
                onClick: (value, context) => this.handleItemClick({
                  disabled: optionItem.disabled,
                  children: optionItem.children
                }, {
                  data: optionItem,
                  context
                })
              }
            }
          }, [h("span", {
            "class": `${this.dropdownClass}__item-text`
          }, [this.renderOptionContent(optionItem.content)])]), optionItem.divider ? h(components_divider_index.Divider) : null]);
        }
        arr.push(renderContent);
      });
      return arr;
    }
  },
  render() {
    const h = arguments[0];
    return h("div", {
      "class": [this.dropdownMenuClass, `${this.dropdownMenuClass}--${this.direction}`],
      "style": {
        maxHeight: `${this.maxHeight}px`
      }
    }, [this.renderOptions(this.options)]);
  }
});

exports["default"] = _DropdownMenu;
//# sourceMappingURL=dropdown-menu.js.map
