element-plus/es/components/tree/src/tree.vue.mjs.map

A Component Library for Vue 3

{"version":3,"file":"tree.vue.mjs","sources":["../../../../../../packages/components/tree/src/tree.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"el$\"\n    :class=\"[\n      ns.b(),\n      ns.is('dragging', !!dragState.draggingNode),\n      ns.is('drop-not-allow', !dragState.allowDrop),\n      ns.is('drop-inner', dragState.dropType === 'inner'),\n      { [ns.m('highlight-current')]: highlightCurrent },\n    ]\"\n    role=\"tree\"\n  >\n    <el-tree-node\n      v-for=\"child in root.childNodes\"\n      :key=\"getNodeKey(child)\"\n      :node=\"child\"\n      :props=\"props\"\n      :accordion=\"accordion\"\n      :render-after-expand=\"renderAfterExpand\"\n      :show-checkbox=\"showCheckbox\"\n      :render-content=\"renderContent\"\n      @node-expand=\"handleNodeExpand\"\n    />\n    <div v-if=\"isEmpty\" :class=\"ns.e('empty-block')\">\n      <slot name=\"empty\">\n        <span :class=\"ns.e('empty-text')\">\n          {{ emptyText ?? t('el.tree.emptyText') }}\n        </span>\n      </slot>\n    </div>\n    <div\n      v-show=\"dragState.showDropIndicator\"\n      ref=\"dropIndicator$\"\n      :class=\"ns.e('drop-indicator')\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  provide,\n  ref,\n  watch,\n} from 'vue'\nimport { isEqual } from 'lodash-unified'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { formItemContextKey } from '@element-plus/components/form'\nimport TreeStore from './model/tree-store'\nimport { getNodeKey as getNodeKeyUtil, handleCurrentChange } from './model/util'\nimport ElTreeNode from './tree-node.vue'\nimport { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'\nimport { useDragNodeHandler } from './model/useDragNode'\nimport { useKeydown } from './model/useKeydown'\nimport { ROOT_TREE_INJECTION_KEY } from './tokens'\nimport { treeEmits, treeProps } from './tree'\n\nimport type Node from './model/node'\nimport type { ComponentInternalInstance } from 'vue'\nimport type { Nullable } from '@element-plus/utils'\nimport type { FilterValue, TreeData, TreeKey, TreeNodeData } from './tree.type'\n\nexport default defineComponent({\n  name: 'ElTree',\n  components: { ElTreeNode },\n  props: treeProps,\n  emits: treeEmits,\n  setup(props, ctx) {\n    const { t } = useLocale()\n    const ns = useNamespace('tree')\n\n    const store = ref<TreeStore>(\n      new TreeStore({\n        key: props.nodeKey,\n        data: props.data,\n        lazy: props.lazy,\n        props: props.props,\n        load: props.load,\n        currentNodeKey: props.currentNodeKey,\n        checkStrictly: props.checkStrictly,\n        checkDescendants: props.checkDescendants,\n        defaultCheckedKeys: props.defaultCheckedKeys,\n        defaultExpandedKeys: props.defaultExpandedKeys,\n        autoExpandParent: props.autoExpandParent,\n        defaultExpandAll: props.defaultExpandAll,\n        filterNodeMethod: props.filterNodeMethod,\n      })\n    )\n\n    store.value.initialize()\n\n    const root = ref<Node>(store.value.root)\n    const currentNode = ref<Node | null>(null)\n    const el$ = ref<Nullable<HTMLElement>>(null)\n    const dropIndicator$ = ref<Nullable<HTMLElement>>(null)\n\n    const { broadcastExpanded } = useNodeExpandEventBroadcast(props)\n\n    const { dragState } = useDragNodeHandler({\n      props,\n      ctx,\n      el$,\n      dropIndicator$,\n      store,\n    })\n\n    useKeydown({ el$ }, store)\n\n    const instance = getCurrentInstance()\n\n    const isSelectTree = computed(() => {\n      let parent = instance?.parent\n      while (parent) {\n        if (parent.type.name === 'ElTreeSelect') {\n          return true\n        }\n        parent = parent.parent\n      }\n      return false\n    })\n\n    const isEmpty = computed(() => {\n      const { childNodes } = root.value\n      return (\n        (!childNodes ||\n          childNodes.length === 0 ||\n          childNodes.every(({ visible }) => !visible)) &&\n        !isSelectTree.value\n      )\n    })\n\n    watch(\n      () => props.currentNodeKey,\n      (newVal) => {\n        store.value.setCurrentNodeKey(newVal ?? null)\n      }\n    )\n\n    watch(\n      () => props.defaultCheckedKeys,\n      (newVal, oldVal) => {\n        if (isEqual(newVal, oldVal)) return\n\n        store.value.setDefaultCheckedKey(newVal ?? [])\n      }\n    )\n\n    watch(\n      () => props.defaultExpandedKeys,\n      (newVal) => {\n        store.value.setDefaultExpandedKeys(newVal ?? [])\n      }\n    )\n\n    watch(\n      () => props.data,\n      (newVal) => {\n        store.value.setData(newVal)\n      },\n      { deep: true }\n    )\n\n    watch(\n      () => props.checkStrictly,\n      (newVal) => {\n        store.value.checkStrictly = newVal\n      }\n    )\n\n    const filter = (value: FilterValue) => {\n      if (!props.filterNodeMethod)\n        throw new Error('[Tree] filterNodeMethod is required when filter')\n      store.value.filter(value)\n    }\n\n    const getNodeKey = (node: Node) => {\n      return getNodeKeyUtil(props.nodeKey, node.data)\n    }\n\n    const requireNodeKey = (methodName: string) => {\n      if (!props.nodeKey) {\n        throw new Error(`[Tree] nodeKey is required in ${methodName}`)\n      }\n    }\n\n    const getNodePath = (data: TreeKey | TreeNodeData) => {\n      requireNodeKey('getNodePath')\n\n      const node = store.value.getNode(data)\n      if (!node) return []\n      const path = [node.data]\n      let parent = node.parent\n      while (parent && parent !== root.value) {\n        path.push(parent.data)\n        parent = parent.parent\n      }\n      return path.reverse()\n    }\n\n    const getCheckedNodes = (\n      leafOnly?: boolean,\n      includeHalfChecked?: boolean\n    ): TreeNodeData[] => {\n      return store.value.getCheckedNodes(leafOnly, includeHalfChecked)\n    }\n\n    const getCheckedKeys = (leafOnly?: boolean): TreeKey[] => {\n      return store.value.getCheckedKeys(leafOnly)\n    }\n\n    const getCurrentNode = () => {\n      const currentNode = store.value.getCurrentNode()\n      return currentNode ? currentNode.data : null\n    }\n\n    const getCurrentKey = (): TreeKey | null => {\n      requireNodeKey('getCurrentKey')\n\n      const currentNode = getCurrentNode()\n      return currentNode ? currentNode[props.nodeKey!] : null\n    }\n\n    const setCheckedNodes = (nodes: Node[], leafOnly?: boolean) => {\n      requireNodeKey('setCheckedNodes')\n\n      store.value.setCheckedNodes(nodes, leafOnly)\n    }\n\n    const setCheckedKeys = (keys: TreeKey[], leafOnly?: boolean) => {\n      requireNodeKey('setCheckedKeys')\n\n      store.value.setCheckedKeys(keys, leafOnly)\n    }\n\n    const setChecked = (\n      data: TreeKey | TreeNodeData,\n      checked: boolean,\n      deep: boolean\n    ) => {\n      store.value.setChecked(data, checked, deep)\n    }\n\n    const getHalfCheckedNodes = (): TreeNodeData[] => {\n      return store.value.getHalfCheckedNodes()\n    }\n\n    const getHalfCheckedKeys = (): TreeKey[] => {\n      return store.value.getHalfCheckedKeys()\n    }\n\n    const setCurrentNode = (node: Node, shouldAutoExpandParent = true) => {\n      requireNodeKey('setCurrentNode')\n\n      handleCurrentChange(store, ctx.emit, () => {\n        broadcastExpanded(node)\n        store.value.setUserCurrentNode(node, shouldAutoExpandParent)\n      })\n    }\n\n    const setCurrentKey = (\n      key: TreeKey | null = null,\n      shouldAutoExpandParent = true\n    ) => {\n      requireNodeKey('setCurrentKey')\n\n      handleCurrentChange(store, ctx.emit, () => {\n        broadcastExpanded()\n        store.value.setCurrentNodeKey(key, shouldAutoExpandParent)\n      })\n    }\n\n    const getNode = (data: TreeKey | TreeNodeData): Node => {\n      return store.value.getNode(data)\n    }\n\n    const remove = (data: TreeNodeData | Node) => {\n      store.value.remove(data)\n    }\n\n    const append = (\n      data: TreeNodeData,\n      parentNode: TreeNodeData | TreeKey | Node\n    ) => {\n      store.value.append(data, parentNode)\n    }\n\n    const insertBefore = (\n      data: TreeNodeData,\n      refNode: TreeKey | TreeNodeData | Node\n    ) => {\n      store.value.insertBefore(data, refNode)\n    }\n\n    const insertAfter = (\n      data: TreeNodeData,\n      refNode: TreeKey | TreeNodeData | Node\n    ) => {\n      store.value.insertAfter(data, refNode)\n    }\n\n    const handleNodeExpand = (\n      nodeData: TreeNodeData,\n      node: Node,\n      instance: ComponentInternalInstance\n    ) => {\n      broadcastExpanded(node)\n      ctx.emit('node-expand', nodeData, node, instance)\n    }\n\n    const updateKeyChildren = (key: TreeKey, data: TreeData) => {\n      requireNodeKey('updateKeyChild')\n\n      store.value.updateChildren(key, data)\n    }\n\n    provide(ROOT_TREE_INJECTION_KEY, {\n      ctx,\n      props,\n      store,\n      root,\n      currentNode,\n      instance,\n    })\n\n    provide(formItemContextKey, undefined)\n\n    return {\n      ns,\n      // ref\n      store,\n      root,\n      currentNode,\n      dragState,\n      el$,\n      dropIndicator$,\n\n      // computed\n      isEmpty,\n\n      // methods\n      filter,\n      getNodeKey,\n      getNodePath,\n      getCheckedNodes,\n      getCheckedKeys,\n      getCurrentNode,\n      getCurrentKey,\n      setCheckedNodes,\n      setCheckedKeys,\n      setChecked,\n      getHalfCheckedNodes,\n      getHalfCheckedKeys,\n      setCurrentNode,\n      setCurrentKey,\n      t,\n      getNode,\n      remove,\n      append,\n      insertBefore,\n      insertAfter,\n      handleNodeExpand,\n      updateKeyChildren,\n    }\n  },\n})\n</script>\n"],"names":["_openBlock","_createElementBlock","_normalizeClass","_Fragment","_renderList","_createBlock","_renderSlot","_createElementVNode","_toDisplayString","_withDirectives","_vShow"],"mappings":";;;;;;AACE,EAAA,OAAAA,WAAA,EAAAC,kBAAA;AAAA,IAkCM,KAAA;AAAA,IAAA;AAAA,MAjCJ,GAAA,EAAI,KAAA;AAAA,MACH,OAAKC,cAAA,CAAA;AAAA,QAAU,IAAA,IAAG,CAAA,EAAC;AAAA,QAAU,IAAA,CAAA,GAAG,EAAA,CAAE,UAAA,EAAA,CAAA,CAAe,IAAA,CAAA,UAAU,YAAY,CAAA;AAAA,QAAS,KAAA,EAAA,CAAG,EAAA,CAAE,kBAAA,CAAoB,IAAA,CAAA,UAAU,SAAS,CAAA;AAAA,QAAS,KAAA,EAAA,CAAG,EAAA,CAAE,cAAe,IAAA,CAAA,SAAA,CAAU,aAAQ,OAAA,CAAA;AAAA,QAAA,EAAA,CAAwB,IAAA,CAAA,EAAA,CAAG,EAAC,mBAAA,CAAA,GAAwB,IAAA,CAAA,gBAAA;AAAgB,OAAA,CAAA;AAAA,MAOhP,IAAA,EAAK;AAAA,KAAA;AAAA;OAELF,SAAA,CAAA,IAAA,CAAA,EAAAC,kBAAA;AAAA,QAUEE,QAAA;AAAA,QAAA,IAAA;AAAA,QAAAC,UAAA,CATgB,IAAA,CAAA,IAAA,CAAK,UAAA,EAAU,CAAxB,KAAA,KAAK;8BADdC,WAAA,CAUE,uBAAA,EAAA;AAAA,YARC,GAAA,EAAK,IAAA,YAAW,KAAK,CAAA;AAAA,YACrB,IAAA,EAAM,KAAA;AAAA,YACN,OAAO,IAAA,CAAA,KAAA;AAAA,YACP,WAAW,IAAA,CAAA,SAAA;AAAA,YACX,uBAAqB,IAAA,CAAA,iBAAA;AAAA,YACrB,iBAAe,IAAA,CAAA,YAAA;AAAA,YACf,kBAAgB,IAAA,CAAA,aAAA;AAAA,YAChB,cAAa,IAAA,CAAA;AAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,eAAA,EAAA,gBAAA,EAAA,cAAA,CAAA,CAAA;AAAA;;;;MAEL,IAAA,CAAA,OAAA,IAAAL,SAAA,EAAA,EAAXC,kBAAA;AAAA,QAMM,KAAA;AAAA,QAAA;AAAA,UAAA,GAAA,EAAA,CAAA;AAAA,UANe,OAAKC,cAAA,CAAE,IAAA,IAAG,CAAA,CAAC,aAAA,CAAA;AAAA,SAAA;AAAA;UAC9BI,WAIO,IAAA,sBAJP,MAAA;;AAIO,YAAA,OAAA;AAAA,cAHLC,kBAAA;AAAA,gBAEO,MAAA;AAAA,gBAAA;AAAA,kBAFA,OAAKL,cAAA,CAAE,IAAA,CAAA,EAAA,CAAG,CAAA,CAAC,YAAA,CAAA;AAAA,iBAAA;AAAA,gBACbM,iBAAA,EAAA,GAAA,IAAA,CAAA,SAAA,KAAA,YAAa,IAAA,CAAA,CAAA,CAAC,mBAAA,CAAA,CAAA;AAAA,gBAAA;AAAA;AAAA;AAAA,aAAA;AAAA,UAAA,CAAA;AAAA;;;;MAIvBC,cAAA,CAAAF,kBAAA;AAAA,QAIE,KAAA;AAAA,QAAA;AAAA,UAFA,GAAA,EAAI,gBAAA;AAAA,UACH,OAAKL,cAAA,CAAE,IAAA,CAAA,EAAA,CAAG,CAAA,CAAC,gBAAA,CAAA;AAAA,SAAA;AAAA;;;;QAFJ,CAAAQ,KAAA,EAAA,IAAA,CAAA,SAAA,CAAU,iBAAiB;AAAA,OAAA;AAAA;;;;;;;;;"}