'use strict';

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

var vue = require('vue');
require('../../../utils/index.js');
var breadcrumb = require('./breadcrumb.js');
var createNamespace = require('../../../utils/create-namespace.js');

"use strict";
const _hoisted_1 = ["onMouseenter"];
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{ name: "LlBreadcrumb" },
  __name: "breadcrumb",
  props: breadcrumb.breadcrumbProps,
  setup(__props) {
    const bem = createNamespace.createNamespace("breadcrumb");
    const attrs = vue.useAttrs();
    const slots = vue.useSlots();
    const props = __props;
    const activeIndex = vue.ref(null);
    const breadcrumbRef = vue.ref();
    const getIconColor = (index) => {
      const isLast = processedItems.value.length - 1 === index;
      const isActive = activeIndex.value === index;
      if (isLast) return props.lastIconColor;
      if (isActive) return props.hoverTitleColor;
      return props.iconColor;
    };
    const getTitleStyle = (index) => {
      const isLast = processedItems.value.length - 1 === index;
      const isActive = activeIndex.value === index;
      return {
        color: isLast ? props.lastTitleColor : isActive ? props.hoverTitleColor : props.titleColor
      };
    };
    const setActiveIndex = (index) => {
      if (index < processedItems.value.length - 1) {
        activeIndex.value = index;
      }
    };
    const hiddenItems = vue.ref([]);
    const processedItems = vue.computed(() => {
      if (!props.items || props.items.length === 0) return [];
      if (props.maxCount <= 0 || props.items.length <= props.maxCount) {
        return props.items;
      }
      const result = [];
      result.push(props.items[0]);
      result.push({
        type: "ellipsis",
        key: "breadcrumb-ellipsis",
        title: "..."
      });
      const startIndex = props.items.length - (props.maxCount - 1);
      for (let i = startIndex; i < props.items.length; i++) {
        result.push(props.items[i]);
      }
      return result;
    });
    const separatorStyle = vue.computed(() => ({
      "margin-inline": `${props.separatorSpace}px`,
      color: props.separatorColor
    }));
    const hasSlot = (name) => {
      return !!slots[name];
    };
    const handleItemClick = (event, item, index) => {
      if (item.onClick) {
        item.onClick(event, item, index);
      }
      if (item.url && props.isLinkSkip) {
        switch (item.target) {
          case "_blank":
            window.open(item.url, "_blank", "noopener,noreferrer");
            break;
          case "_parent":
            if (window.parent !== window) {
              window.parent.location.href = item.url;
            } else {
              window.location.href = item.url;
            }
            break;
          case "_top":
            window.top.location.href = item.url;
            break;
          case "_self":
          default:
            window.location.href = item.url;
            break;
        }
        return;
      }
    };
    vue.watch(
      () => [props.items, props.maxCount],
      () => {
        hiddenItems.value = [];
        if (!props.items || props.items.length === 0) return;
        if (props.maxCount <= 0 || props.items.length <= props.maxCount) return;
        const startIndex = props.items.length - (props.maxCount - 1);
        for (let i = 1; i < startIndex; i++) {
          hiddenItems.value.push(props.items[i]);
        }
      },
      { immediate: true, deep: true }
    );
    return (_ctx, _cache) => {
      const _component_ll_icon = vue.resolveComponent("ll-icon");
      const _component_ll_tooltip = vue.resolveComponent("ll-tooltip");
      const _component_a_breadcrumb_item = vue.resolveComponent("a-breadcrumb-item");
      const _component_a_breadcrumb = vue.resolveComponent("a-breadcrumb");
      return vue.openBlock(), vue.createBlock(_component_a_breadcrumb, vue.mergeProps(vue.unref(attrs), {
        ref_key: "breadcrumbRef",
        ref: breadcrumbRef,
        class: [
          vue.unref(bem).b(),
          vue.unref(bem).is(`${props.size}`),
          props.type === "card" ? vue.unref(bem).is("card") : vue.unref(bem).is("default")
        ]
      }), {
        separator: vue.withCtx(() => [
          !_ctx.$slots.separator ? (vue.openBlock(), vue.createElementBlock(
            "span",
            {
              key: 0,
              style: vue.normalizeStyle(separatorStyle.value)
            },
            vue.toDisplayString(props.separator),
            5
            /* TEXT, STYLE */
          )) : vue.renderSlot(_ctx.$slots, "separator", { key: 1 })
        ]),
        default: vue.withCtx(() => [
          props.items && props.items.length > 0 ? (vue.openBlock(true), vue.createElementBlock(
            vue.Fragment,
            { key: 0 },
            vue.renderList(processedItems.value, (item, index) => {
              return vue.openBlock(), vue.createBlock(_component_a_breadcrumb_item, {
                key: item.key || index,
                class: vue.normalizeClass([
                  vue.unref(bem).e("item"),
                  item.type === "ellipsis" ? vue.unref(bem).is("ellipsis") : ""
                ]),
                style: vue.normalizeStyle({
                  "margin-right": props.type === "card" ? `${props.separatorSpace}px` : ""
                }),
                href: item.type === "ellipsis" || !props.isLinkSkip ? void 0 : item.url,
                onClick: (e) => handleItemClick(e, item, index)
              }, {
                default: vue.withCtx(() => [
                  item.type === "ellipsis" ? (vue.openBlock(), vue.createElementBlock(
                    "div",
                    {
                      key: 0,
                      class: vue.normalizeClass(vue.unref(bem).e("ellipsis"))
                    },
                    [
                      props.showHiddenItem && hiddenItems.value.length > 0 ? (vue.openBlock(), vue.createBlock(_component_ll_tooltip, {
                        key: 0,
                        tip: hiddenItems.value.map((item2) => item2.title).join(` / `)
                      }, {
                        default: vue.withCtx(() => [
                          vue.createVNode(_component_ll_icon, { "icon-name": "icon-more" })
                        ]),
                        _: 1
                        /* STABLE */
                      }, 8, ["tip"])) : (vue.openBlock(), vue.createBlock(_component_ll_icon, {
                        key: 1,
                        "icon-name": "icon-more"
                      }))
                    ],
                    2
                    /* CLASS */
                  )) : (vue.openBlock(), vue.createElementBlock(
                    vue.Fragment,
                    { key: 1 },
                    [
                      item.key && hasSlot(item.key) && item.key !== "item" ? vue.renderSlot(_ctx.$slots, item.key, {
                        key: 0,
                        item,
                        index
                      }) : hasSlot("item") ? vue.renderSlot(_ctx.$slots, "item", {
                        key: 1,
                        item,
                        index
                      }) : (vue.openBlock(), vue.createElementBlock("div", {
                        key: 2,
                        class: vue.normalizeClass(vue.unref(bem).e("text-content")),
                        onMouseenter: ($event) => setActiveIndex(index),
                        onMouseleave: _cache[0] || (_cache[0] = ($event) => activeIndex.value = null)
                      }, [
                        _ctx.showIcon && item.icon ? (vue.openBlock(), vue.createBlock(_component_ll_icon, {
                          key: 0,
                          "icon-name": item.icon,
                          color: getIconColor(index)
                        }, null, 8, ["icon-name", "color"])) : vue.createCommentVNode("v-if", true),
                        item.title ? (vue.openBlock(), vue.createElementBlock(
                          "span",
                          {
                            key: 1,
                            style: vue.normalizeStyle(getTitleStyle(index)),
                            class: vue.normalizeClass([
                              processedItems.value.length - 1 === index ? "last-title" : "title"
                            ])
                          },
                          vue.toDisplayString(item.title),
                          7
                          /* TEXT, CLASS, STYLE */
                        )) : vue.createCommentVNode("v-if", true)
                      ], 42, _hoisted_1))
                    ],
                    64
                    /* STABLE_FRAGMENT */
                  ))
                ]),
                _: 2
                /* DYNAMIC */
              }, 1032, ["class", "style", "href", "onClick"]);
            }),
            128
            /* KEYED_FRAGMENT */
          )) : vue.renderSlot(_ctx.$slots, "default", { key: 1 })
        ]),
        _: 3
        /* FORWARDED */
      }, 16, ["class"]);
    };
  }
});

exports.default = _sfc_main;
//# sourceMappingURL=breadcrumb.vue2.js.map
