{"version":3,"file":"menu.mjs","sources":["../../../../../../packages/components/cascader-panel/src/menu.vue"],"sourcesContent":["<template>\r\n  <sg-scrollbar\r\n    :key=\"menuId\"\r\n    tag=\"ul\"\r\n    role=\"menu\"\r\n    class=\"sg-cascader-menu\"\r\n    wrap-class=\"sg-cascader-menu__wrap\"\r\n    :view-class=\"['sg-cascader-menu__list', isEmpty && 'is-empty']\"\r\n    @mousemove=\"handleMouseMove\"\r\n    @mouseleave=\"clearHoverZone\"\r\n  >\r\n    <sg-cascader-node\r\n      v-for=\"node in nodes\"\r\n      :key=\"node.uid\"\r\n      :node=\"node\"\r\n      :menu-id=\"menuId\"\r\n      @expand=\"handleExpand\"\r\n    />\r\n    <div v-if=\"isLoading\" class=\"sg-cascader-menu__empty-text\">\r\n      <sg-icon size=\"14\" class=\"is-loading\">\r\n<!--        <loading1 />-->\r\n      </sg-icon>\r\n      {{ t('sg.cascader.loading') }}\r\n    </div>\r\n    <div v-else-if=\"isEmpty\" class=\"sg-cascader-menu__empty-text\">\r\n      {{ emptyTips || t('sg.cascader.noData') }}\r\n    </div>\r\n    <svg\r\n      v-else-if=\"panel?.isHoverMenu\"\r\n      ref=\"hoverZone\"\r\n      class=\"sg-cascader-menu__hover-zone\"\r\n    ></svg>\r\n  </sg-scrollbar>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport { computed, defineComponent, getCurrentInstance, inject, ref } from 'vue'\r\nimport SgScrollbar from '@sgui-plus/components/scrollbar'\r\nimport { useLocale } from '@sgui-plus/hooks'\r\nimport { generateId } from '@sgui-plus/utils/util'\r\n// import { Loading1 } from '@sgui-plus/icons-vue'\r\nimport SgIcon from '@sgui-plus/components/icon'\r\nimport SgCascaderNode from './node.vue'\r\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\r\n\r\nimport type { default as CascaderNode } from './node'\r\nimport type { PropType } from 'vue'\r\nimport type { TimeoutHandle, Nullable } from '@sgui-plus/utils/types'\r\n\r\nexport default defineComponent({\r\n  name: 'SgCascaderMenu',\r\n\r\n  components: {\r\n    // Loading1,\r\n    SgIcon,\r\n    SgScrollbar,\r\n    SgCascaderNode,\r\n  },\r\n\r\n  props: {\r\n    nodes: {\r\n      type: Array as PropType<CascaderNode[]>,\r\n      required: true,\r\n    },\r\n    index: {\r\n      type: [Number , String],\r\n      required: true,\r\n    },\r\n    emptyTips: String\r\n  },\r\n\r\n  setup(props) {\r\n    const instance = getCurrentInstance()!\r\n    const { t } = useLocale()\r\n    const id = generateId()\r\n    let activeNode: Nullable<HTMLElement> = null\r\n    let hoverTimer: Nullable<TimeoutHandle> = null\r\n\r\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)!\r\n\r\n    const hoverZone = ref<null | SVGSVGElement>(null)\r\n\r\n    const isEmpty = computed(() => !props.nodes.length)\r\n    const isLoading = computed(() => !panel.initialLoaded)\r\n    const menuId = computed(() => `cascader-menu-${id}-${props.index}`)\r\n\r\n    const handleExpand = (e: MouseEvent) => {\r\n      activeNode = e.target as HTMLElement\r\n    }\r\n\r\n    const handleMouseMove = (e: MouseEvent) => {\r\n      if (!panel.isHoverMenu || !activeNode || !hoverZone.value) return\r\n\r\n      if (activeNode.contains(e.target as HTMLElement)) {\r\n        clearHoverTimer()\r\n\r\n        const el = instance.vnode.el as HTMLElement\r\n        const { left } = el.getBoundingClientRect()\r\n        const { offsetWidth, offsetHeight } = el\r\n        const startX = e.clientX - left\r\n        const top = activeNode.offsetTop\r\n        const bottom = top + activeNode.offsetHeight\r\n\r\n        hoverZone.value.innerHTML = `\r\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} 0 V${top} Z\" />\r\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z\" />\r\n        `\r\n      } else if (!hoverTimer) {\r\n        hoverTimer = window.setTimeout(\r\n          clearHoverZone,\r\n          panel.config.hoverThreshold\r\n        )\r\n      }\r\n    }\r\n\r\n    const clearHoverTimer = () => {\r\n      if (!hoverTimer) return\r\n      clearTimeout(hoverTimer)\r\n      hoverTimer = null\r\n    }\r\n\r\n    const clearHoverZone = () => {\r\n      if (!hoverZone.value) return\r\n      hoverZone.value.innerHTML = ''\r\n      clearHoverTimer()\r\n    }\r\n    return {\r\n      panel,\r\n      hoverZone,\r\n      isEmpty,\r\n      isLoading,\r\n      menuId,\r\n      t,\r\n      handleExpand,\r\n      handleMouseMove,\r\n      clearHoverZone,\r\n    }\r\n  },\r\n})\r\n</script>\r\n"],"names":["_resolveComponent","_openBlock","_createBlock","_createElementBlock","_Fragment","_renderList"],"mappings":";;;;MAkB0B,UAAM,GAAA;AAAA,EAAA,GAAA,EAAA,CAAA;;;MAMH,UAAM,GAAA;AAAA,EAAA,GAAA,EAAA,CAAA;;;MAK1B,UAAY,GAAA;AAAA,EACf,GAAK,EAAA,CAAA;AAAA,EAAA,GAAA,EAAA,WAAA;;;;;;kCA7BTA,gBA+Be,CAAA,cAAA,CAAA,CAAA;SA7BTC,SAAI,EAAA,EAAAC,WAAA,CAAA,uBAAA,EAAA;AAAA,IACR,KAAI,IAAC,CAAA,MAAA;AAAA,IACL,GAAK,EAAA,IAAA;AAAA,IACL,IAAA,EAAA,MAAA;AAAA,IACC,KAAA,EAAA,kBAAA;AAAA,IACA,YAAW,EAAA,wBAAA;AAAA,IACX,cAAY,CAAc,wBAAA,EAAA,IAAA,CAAA,OAAA,IAAA,UAAA,CAAA;AAAA,IAAA,WAAA,EAAA,IAAA,CAAA,eAAA;AAGJ,IAAA,YAAA,EAAA,IAAA,CAAA,cAAA;AAAA,GAAA,EAAA;;AACf,MAAA,IAAA,EAAA,CAAA;;AACK,SAAAD,SACH,CAAA,IAAA,CAAA,EAAAE,kBAAA,CAAAC,QAAA,EAAA,IAAA,EAAAC,UAAA,CAAA,IAAA,CAAA,KAAA,EAAA,CAAA,IAAA,KAAA;AAAA,UACP,OAAAJ,SAAA,EAAA,EAAAC,WAAA,CAAA,2BAAA,EAAA;AAAA,YAAA,GAAA,EAAA,IAAA,CAAA,GAAA;;YAEiB,SAAA,EAAA,IAAA,CAAA,MAAA;AAAA,YAApB,QAAA,EAAA,IAAA,CAAA,YAAA;AAAA,WACE,6BAAkB,EAAA,UAAA,CAAA,CAAA,CAAA;AAAA,SAAA,CAAA,EAAA,GAAA,CAAA;AAAmB,QAAA,IAAA,CAAA,SAAA,IAAAD,SAAA,EAAA,EAAAE,kBAAA,CAAA,KAAA,EAAA,UAAA,EAAA;;;;;;;;YAKhB,CAAA,EAAA,CAAA;AAAA,WAAA,CAAA;;;;;;;;;;;;"}