npm - element-plus - Versions diffs - 1.2.0-beta.5 → 1.2.0-beta.6 - Mend

element-plus 1.2.0-beta.5 → 1.2.0-beta.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (984) hide show

package/es/components/transfer/src/index.vue_vue_type_template_id_6c8b9070_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue_vue_type_template_id_6c8b9070_lang.mjs","sources":["../../../../../../packages/components/transfer/src/index.vue?vue&type=template&id=6c8b9070&lang.js"],"sourcesContent":["<template>\n <div class=\"el-transfer\">\n <transfer-panel\n ref=\"leftPanel\"\n :data=\"sourceData\"\n :option-render=\"optionRender\"\n :placeholder=\"panelFilterPlaceholder\"\n :title=\"leftPanelTitle\"\n :filterable=\"filterable\"\n :format=\"format\"\n :filter-method=\"filterMethod\"\n :default-checked=\"leftDefaultChecked\"\n :props=\"props\"\n @checked-change=\"onSourceCheckedChange\"\n >\n <slot name=\"left-footer\"></slot>\n </transfer-panel>\n <div class=\"el-transfer__buttons\">\n <el-button\n type=\"primary\"\n :class=\"['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']\"\n :disabled=\"rightChecked.length === 0\"\n @click=\"addToLeft\"\n >\n <el-icon><arrow-left /></el-icon>\n <span v-if=\"buttonTexts[0] !== undefined\">{{ buttonTexts[0] }}</span>\n </el-button>\n <el-button\n type=\"primary\"\n :class=\"['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']\"\n :disabled=\"leftChecked.length === 0\"\n @click=\"addToRight\"\n >\n <span v-if=\"buttonTexts[1] !== undefined\">{{ buttonTexts[1] }}</span>\n <el-icon><arrow-right /></el-icon>\n </el-button>\n </div>\n <transfer-panel\n ref=\"rightPanel\"\n :data=\"targetData\"\n :option-render=\"optionRender\"\n :placeholder=\"panelFilterPlaceholder\"\n :filterable=\"filterable\"\n :format=\"format\"\n :filter-method=\"filterMethod\"\n :title=\"rightPanelTitle\"\n :default-checked=\"rightDefaultChecked\"\n :props=\"props\"\n @checked-change=\"onTargetCheckedChange\"\n >\n <slot name=\"right-footer\"></slot>\n </transfer-panel>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n inject,\n h,\n reactive,\n ref,\n toRefs,\n watch,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport { elFormItemKey } from '@element-plus/tokens'\nimport { useLocale } from '@element-plus/hooks'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons'\nimport TransferPanel from './transfer-panel.vue'\nimport { useComputedData } from './useComputedData'\nimport {\n useCheckedChange,\n LEFT_CHECK_CHANGE_EVENT,\n RIGHT_CHECK_CHANGE_EVENT,\n} from './useCheckedChange'\nimport { useMove } from './useMove'\nimport { CHANGE_EVENT } from './transfer'\n\nimport type { PropType, VNode } from 'vue'\nimport type { ElFormItemContext } from '@element-plus/tokens'\nimport type { DataItem, Format, Key, Props, TargetOrder } from './transfer'\n\nexport default defineComponent({\n name: 'ElTransfer',\n\n components: {\n TransferPanel,\n ElButton,\n ElIcon,\n ArrowLeft,\n ArrowRight,\n },\n\n props: {\n data: {\n type: Array as PropType<DataItem[]>,\n default: () => [],\n },\n titles: {\n type: Array as PropType<any> as PropType<[string, string]>,\n default: () => [],\n },\n buttonTexts: {\n type: Array as PropType<any> as PropType<[string, string]>,\n default: () => [],\n },\n filterPlaceholder: {\n type: String,\n default: '',\n },\n filterMethod: Function as PropType<\n (query: string, item: DataItem) => boolean\n >,\n leftDefaultChecked: {\n type: Array as PropType<Key[]>,\n default: () => [],\n },\n rightDefaultChecked: {\n type: Array as PropType<Key[]>,\n default: () => [],\n },\n renderContent: Function as PropType<(h, option) => VNode>,\n modelValue: {\n type: Array as PropType<Key[]>,\n default: () => [],\n },\n format: {\n type: Object as PropType<Format>,\n default: () => ({}),\n },\n filterable: {\n type: Boolean,\n default: false,\n },\n props: {\n type: Object as PropType<Props>,\n default: () => ({\n label: 'label',\n key: 'key',\n disabled: 'disabled',\n }),\n },\n targetOrder: {\n type: String as PropType<TargetOrder>,\n default: 'original',\n validator: (val: string) => {\n return ['original', 'push', 'unshift'].includes(val)\n },\n },\n },\n\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n LEFT_CHECK_CHANGE_EVENT,\n RIGHT_CHECK_CHANGE_EVENT,\n ],\n\n setup(props, { emit, slots }) {\n const { t } = useLocale()\n const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n const checkedState = reactive({\n leftChecked: [],\n rightChecked: [],\n })\n\n const { propsKey, sourceData, targetData } = useComputedData(props)\n\n const { onSourceCheckedChange, onTargetCheckedChange } = useCheckedChange(\n checkedState,\n emit\n )\n\n const { addToLeft, addToRight } = useMove(\n props,\n checkedState,\n propsKey,\n emit\n )\n\n const leftPanel = ref(null)\n const rightPanel = ref(null)\n\n const clearQuery = (which: 'left' \| 'right') => {\n if (which === 'left') {\n leftPanel.value.query = ''\n } else if (which === 'right') {\n rightPanel.value.query = ''\n }\n }\n\n const hasButtonTexts = computed(() => props.buttonTexts.length === 2)\n\n const leftPanelTitle = computed(\n () => props.titles[0] \|\| t('el.transfer.titles.0')\n )\n\n const rightPanelTitle = computed(\n () => props.titles[1] \|\| t('el.transfer.titles.1')\n )\n\n const panelFilterPlaceholder = computed(\n () => props.filterPlaceholder \|\| t('el.transfer.filterPlaceholder')\n )\n\n watch(\n () => props.modelValue,\n () => {\n elFormItem.validate?.('change')\n }\n )\n\n const optionRender = computed(() => (option) => {\n if (props.renderContent) return props.renderContent(h, option)\n\n if (slots.default) return slots.default({ option })\n\n return h('span', option[props.props.label] \|\| option[props.props.key])\n })\n\n return {\n sourceData,\n targetData,\n onSourceCheckedChange,\n onTargetCheckedChange,\n addToLeft,\n addToRight,\n\n ...toRefs(checkedState),\n\n hasButtonTexts,\n leftPanelTitle,\n rightPanelTitle,\n panelFilterPlaceholder,\n clearQuery,\n\n optionRender,\n }\n },\n})\n</script>\n"],"names":["_createElementBlock","_createVNode","_renderSlot","_createElementVNode"],"mappings":";;qBACO,OAAM;qBAgBJ,OAAM;;;;;;;;;sBAhBbA,0BAAA;IACEC;MACE,KAAI;AAAA,MACH,MAAM;MACN,iBAAe;MACf,aAAa;MACb,OAAO;MACP,YAAY;MACZ,QAAQ;MACR,iBAAe;MACf,mBAAiB;MACjB,OAAO;MACP,iBAAgB;;uBAEjB;QAAAC;;;;IAEFC,0BAAA;MACEF;QACE,MAAK;AAAA,QACJ,8CAA+B;QAC/B,UAAU,kBAAa;QACvB,SAAO;;yBAER;UAAAA;6BAAS;cAAAA,YAAc;AAAA;AAAA;;UACX,wBAAmB,uBAA/BD,uDAA6C;;;;MAE/CC;QACE,MAAK;AAAA,QACJ,8CAA+B;QAC/B,UAAU,iBAAY;QACtB,SAAO;;yBAER;UAAY,wBAAmB,uBAA/BD,uDAA6C;UAC7CC;6BAAS;cAAAA,YAAe;AAAA;AAAA;;;;;;IAG5BA;MACE,KAAI;AAAA,MACH,MAAM;MACN,iBAAe;MACf,aAAa;MACb,YAAY;MACZ,QAAQ;MACR,iBAAe;MACf,OAAO;MACP,mBAAiB;MACjB,OAAO;MACP,iBAAgB;;uBAEjB;QAAAC;;;;;;;;;"}
1	+ {"version":3,"file":"index.vue_vue_type_template_id_6c8b9070_lang.mjs","sources":["../../../../../../packages/components/transfer/src/index.vue?vue&type=template&id=6c8b9070&lang.js"],"sourcesContent":["<template>\n <div class=\"el-transfer\">\n <transfer-panel\n ref=\"leftPanel\"\n :data=\"sourceData\"\n :option-render=\"optionRender\"\n :placeholder=\"panelFilterPlaceholder\"\n :title=\"leftPanelTitle\"\n :filterable=\"filterable\"\n :format=\"format\"\n :filter-method=\"filterMethod\"\n :default-checked=\"leftDefaultChecked\"\n :props=\"props\"\n @checked-change=\"onSourceCheckedChange\"\n >\n <slot name=\"left-footer\"></slot>\n </transfer-panel>\n <div class=\"el-transfer__buttons\">\n <el-button\n type=\"primary\"\n :class=\"['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']\"\n :disabled=\"rightChecked.length === 0\"\n @click=\"addToLeft\"\n >\n <el-icon><arrow-left /></el-icon>\n <span v-if=\"buttonTexts[0] !== undefined\">{{ buttonTexts[0] }}</span>\n </el-button>\n <el-button\n type=\"primary\"\n :class=\"['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']\"\n :disabled=\"leftChecked.length === 0\"\n @click=\"addToRight\"\n >\n <span v-if=\"buttonTexts[1] !== undefined\">{{ buttonTexts[1] }}</span>\n <el-icon><arrow-right /></el-icon>\n </el-button>\n </div>\n <transfer-panel\n ref=\"rightPanel\"\n :data=\"targetData\"\n :option-render=\"optionRender\"\n :placeholder=\"panelFilterPlaceholder\"\n :filterable=\"filterable\"\n :format=\"format\"\n :filter-method=\"filterMethod\"\n :title=\"rightPanelTitle\"\n :default-checked=\"rightDefaultChecked\"\n :props=\"props\"\n @checked-change=\"onTargetCheckedChange\"\n >\n <slot name=\"right-footer\"></slot>\n </transfer-panel>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n inject,\n h,\n reactive,\n ref,\n toRefs,\n watch,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport { elFormItemKey } from '@element-plus/tokens'\nimport { useLocale } from '@element-plus/hooks'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\nimport TransferPanel from './transfer-panel.vue'\nimport { useComputedData } from './useComputedData'\nimport {\n useCheckedChange,\n LEFT_CHECK_CHANGE_EVENT,\n RIGHT_CHECK_CHANGE_EVENT,\n} from './useCheckedChange'\nimport { useMove } from './useMove'\nimport { CHANGE_EVENT } from './transfer'\n\nimport type { PropType, VNode } from 'vue'\nimport type { ElFormItemContext } from '@element-plus/tokens'\nimport type { DataItem, Format, Key, Props, TargetOrder } from './transfer'\n\nexport default defineComponent({\n name: 'ElTransfer',\n\n components: {\n TransferPanel,\n ElButton,\n ElIcon,\n ArrowLeft,\n ArrowRight,\n },\n\n props: {\n data: {\n type: Array as PropType<DataItem[]>,\n default: () => [],\n },\n titles: {\n type: Array as PropType<any> as PropType<[string, string]>,\n default: () => [],\n },\n buttonTexts: {\n type: Array as PropType<any> as PropType<[string, string]>,\n default: () => [],\n },\n filterPlaceholder: {\n type: String,\n default: '',\n },\n filterMethod: Function as PropType<\n (query: string, item: DataItem) => boolean\n >,\n leftDefaultChecked: {\n type: Array as PropType<Key[]>,\n default: () => [],\n },\n rightDefaultChecked: {\n type: Array as PropType<Key[]>,\n default: () => [],\n },\n renderContent: Function as PropType<(h, option) => VNode>,\n modelValue: {\n type: Array as PropType<Key[]>,\n default: () => [],\n },\n format: {\n type: Object as PropType<Format>,\n default: () => ({}),\n },\n filterable: {\n type: Boolean,\n default: false,\n },\n props: {\n type: Object as PropType<Props>,\n default: () => ({\n label: 'label',\n key: 'key',\n disabled: 'disabled',\n }),\n },\n targetOrder: {\n type: String as PropType<TargetOrder>,\n default: 'original',\n validator: (val: string) => {\n return ['original', 'push', 'unshift'].includes(val)\n },\n },\n },\n\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n LEFT_CHECK_CHANGE_EVENT,\n RIGHT_CHECK_CHANGE_EVENT,\n ],\n\n setup(props, { emit, slots }) {\n const { t } = useLocale()\n const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n const checkedState = reactive({\n leftChecked: [],\n rightChecked: [],\n })\n\n const { propsKey, sourceData, targetData } = useComputedData(props)\n\n const { onSourceCheckedChange, onTargetCheckedChange } = useCheckedChange(\n checkedState,\n emit\n )\n\n const { addToLeft, addToRight } = useMove(\n props,\n checkedState,\n propsKey,\n emit\n )\n\n const leftPanel = ref(null)\n const rightPanel = ref(null)\n\n const clearQuery = (which: 'left' \| 'right') => {\n if (which === 'left') {\n leftPanel.value.query = ''\n } else if (which === 'right') {\n rightPanel.value.query = ''\n }\n }\n\n const hasButtonTexts = computed(() => props.buttonTexts.length === 2)\n\n const leftPanelTitle = computed(\n () => props.titles[0] \|\| t('el.transfer.titles.0')\n )\n\n const rightPanelTitle = computed(\n () => props.titles[1] \|\| t('el.transfer.titles.1')\n )\n\n const panelFilterPlaceholder = computed(\n () => props.filterPlaceholder \|\| t('el.transfer.filterPlaceholder')\n )\n\n watch(\n () => props.modelValue,\n () => {\n elFormItem.validate?.('change')\n }\n )\n\n const optionRender = computed(() => (option) => {\n if (props.renderContent) return props.renderContent(h, option)\n\n if (slots.default) return slots.default({ option })\n\n return h('span', option[props.props.label] \|\| option[props.props.key])\n })\n\n return {\n sourceData,\n targetData,\n onSourceCheckedChange,\n onTargetCheckedChange,\n addToLeft,\n addToRight,\n\n ...toRefs(checkedState),\n\n hasButtonTexts,\n leftPanelTitle,\n rightPanelTitle,\n panelFilterPlaceholder,\n clearQuery,\n\n optionRender,\n }\n },\n})\n</script>\n"],"names":["_createElementBlock","_createVNode","_renderSlot","_createElementVNode"],"mappings":";;qBACO,OAAM;qBAgBJ,OAAM;;;;;;;;;sBAhBbA,0BAAA;IACEC;MACE,KAAI;AAAA,MACH,MAAM;MACN,iBAAe;MACf,aAAa;MACb,OAAO;MACP,YAAY;MACZ,QAAQ;MACR,iBAAe;MACf,mBAAiB;MACjB,OAAO;MACP,iBAAgB;;uBAEjB;QAAAC;;;;IAEFC,0BAAA;MACEF;QACE,MAAK;AAAA,QACJ,8CAA+B;QAC/B,UAAU,kBAAa;QACvB,SAAO;;yBAER;UAAAA;6BAAS;cAAAA,YAAc;AAAA;AAAA;;UACX,wBAAmB,uBAA/BD,uDAA6C;;;;MAE/CC;QACE,MAAK;AAAA,QACJ,8CAA+B;QAC/B,UAAU,iBAAY;QACtB,SAAO;;yBAER;UAAY,wBAAmB,uBAA/BD,uDAA6C;UAC7CC;6BAAS;cAAAA,YAAe;AAAA;AAAA;;;;;;IAG5BA;MACE,KAAI;AAAA,MACH,MAAM;MACN,iBAAe;MACf,aAAa;MACb,YAAY;MACZ,QAAQ;MACR,iBAAe;MACf,OAAO;MACP,mBAAiB;MACjB,OAAO;MACP,iBAAgB;;uBAEjB;QAAAC;;;;;;;;;"}

package/es/components/transfer/src/transfer-panel.vue.d.ts CHANGED Viewed

@@ -43,9 +43,9 @@ declare const _default: import("vue").DefineComponent<{
     data: unknown[];
     filterable: boolean;
 } & {
-    placeholder?: string | undefined;
-    title?: string | undefined;
     props?: Record<string, any> | undefined;
+    title?: string | undefined;
+    placeholder?: string | undefined;
     filterMethod?: Function | undefined;
     format?: Record<string, any> | undefined;
     optionRender?: Function | undefined;

package/es/components/transfer/src/transfer-panel.vue_vue_type_script_lang.mjs CHANGED Viewed

@@ -3,7 +3,7 @@ import '../../../hooks/index.mjs';
 import { ElCheckboxGroup, ElCheckbox } from '../../checkbox/index.mjs';
 import { ElIcon } from '../../icon/index.mjs';
 import { ElInput } from '../../input/index.mjs';
-import { CircleClose, Search } from '@element-plus/icons';
+import { CircleClose, Search } from '@element-plus/icons-vue';
 import { useCheckProps, CHECKED_CHANGE_EVENT, useCheck } from './useCheck.mjs';
 import { useLocale } from '../../../hooks/use-locale/index.mjs';

package/es/components/transfer/src/transfer-panel.vue_vue_type_script_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"transfer-panel.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/transfer/src/transfer-panel.vue"],"sourcesContent":["<template>\n <div class=\"el-transfer-panel\">\n <p class=\"el-transfer-panel__header\">\n <el-checkbox\n v-model=\"allChecked\"\n :indeterminate=\"isIndeterminate\"\n @change=\"handleAllCheckedChange\"\n >\n {{ title }}\n <span>{{ checkedSummary }}</span>\n </el-checkbox>\n </p>\n\n <div\n :class=\"['el-transfer-panel__body', hasFooter ? 'is-with-footer' : '']\"\n >\n <el-input\n v-if=\"filterable\"\n v-model=\"query\"\n class=\"el-transfer-panel__filter\"\n size=\"small\"\n :placeholder=\"placeholder\"\n @mouseenter=\"inputHover = true\"\n @mouseleave=\"inputHover = false\"\n >\n <template #prefix>\n <el-icon v-if=\"inputIcon\" class=\"el-input__icon\" @click=\"clearQuery\">\n <component :is=\"inputIcon\" />\n </el-icon>\n </template>\n </el-input>\n <el-checkbox-group\n v-show=\"!hasNoMatch && data.length > 0\"\n v-model=\"checked\"\n :class=\"{ 'is-filterable': filterable }\"\n class=\"el-transfer-panel__list\"\n >\n <el-checkbox\n v-for=\"item in filteredData\"\n :key=\"item[keyProp]\"\n class=\"el-transfer-panel__item\"\n :label=\"item[keyProp]\"\n :disabled=\"item[disabledProp]\"\n >\n <option-content :option=\"optionRender(item)\" />\n </el-checkbox>\n </el-checkbox-group>\n <p\n v-show=\"hasNoMatch \|\| data.length === 0\"\n class=\"el-transfer-panel__empty\"\n >\n {{ hasNoMatch ? t('el.transfer.noMatch') : t('el.transfer.noData') }}\n </p>\n </div>\n <p v-if=\"hasFooter\" class=\"el-transfer-panel__footer\">\n <slot></slot>\n </p>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, reactive, toRefs } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { ElCheckbox, ElCheckboxGroup } from '@element-plus/components/checkbox'\nimport ElIcon from '@element-plus/components/icon'\nimport ElInput from '@element-plus/components/input'\nimport { CircleClose, Search } from '@element-plus/icons'\nimport { useCheck, useCheckProps, CHECKED_CHANGE_EVENT } from './useCheck'\n\nexport default defineComponent({\n name: 'ElTransferPanel',\n\n components: {\n ElCheckboxGroup,\n ElCheckbox,\n ElInput,\n ElIcon,\n OptionContent: ({ option }) => option,\n },\n\n props: useCheckProps,\n\n emits: [CHECKED_CHANGE_EVENT],\n\n setup(props, { slots }) {\n const { t } = useLocale()\n\n const panelState = reactive({\n checked: [],\n allChecked: false,\n query: '',\n inputHover: false,\n checkChangeByUser: true,\n })\n\n const {\n labelProp,\n keyProp,\n disabledProp,\n filteredData,\n checkedSummary,\n isIndeterminate,\n handleAllCheckedChange,\n } = useCheck(props, panelState)\n\n const hasNoMatch = computed(() => {\n return panelState.query.length > 0 && filteredData.value.length === 0\n })\n\n const inputIcon = computed(() => {\n return panelState.query.length > 0 && panelState.inputHover\n ? CircleClose\n : Search\n })\n\n const hasFooter = computed(() => !!slots.default()[0].children.length)\n\n const clearQuery = () => {\n if (inputIcon.value === CircleClose) {\n panelState.query = ''\n }\n }\n\n const { checked, allChecked, query, inputHover, checkChangeByUser } =\n toRefs(panelState)\n\n return {\n labelProp,\n keyProp,\n disabledProp,\n filteredData,\n checkedSummary,\n isIndeterminate,\n handleAllCheckedChange,\n\n checked,\n allChecked,\n query,\n inputHover,\n checkChangeByUser,\n\n hasNoMatch,\n inputIcon,\n hasFooter,\n clearQuery,\n\n t,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;AAqEA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe,CAAC,EAAE,aAAa;AAAA;AAAA,EAGjC,OAAO;AAAA,EAEP,OAAO,CAAC;AAAA,EAER,MAAM,OAAO,EAAE,SAAS;AACtB,UAAM,EAAE,MAAM;AAEd,UAAM,aAAa,SAAS;AAAA,MAC1B,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,mBAAmB;AAAA;AAGrB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,SAAS,OAAO;AAEpB,UAAM,aAAa,SAAS,MAAM;AAChC,aAAO,WAAW,MAAM,SAAS,KAAK,aAAa,MAAM,WAAW;AAAA;AAGtE,UAAM,YAAY,SAAS,MAAM;AAC/B,aAAO,WAAW,MAAM,SAAS,KAAK,WAAW,aAC7C,cACA;AAAA;AAGN,UAAM,YAAY,SAAS,MAAM,CAAC,CAAC,MAAM,UAAU,GAAG,SAAS;AAE/D,UAAM,aAAa,MAAM;AACvB,UAAI,UAAU,UAAU,aAAa;AACnC,mBAAW,QAAQ;AAAA;AAAA;AAIvB,UAAM,EAAE,SAAS,YAAY,OAAO,YAAY,sBAC9C,OAAO;AAET,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA;AAAA;AAAA;;;;"}
1	+ {"version":3,"file":"transfer-panel.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/transfer/src/transfer-panel.vue"],"sourcesContent":["<template>\n <div class=\"el-transfer-panel\">\n <p class=\"el-transfer-panel__header\">\n <el-checkbox\n v-model=\"allChecked\"\n :indeterminate=\"isIndeterminate\"\n @change=\"handleAllCheckedChange\"\n >\n {{ title }}\n <span>{{ checkedSummary }}</span>\n </el-checkbox>\n </p>\n\n <div\n :class=\"['el-transfer-panel__body', hasFooter ? 'is-with-footer' : '']\"\n >\n <el-input\n v-if=\"filterable\"\n v-model=\"query\"\n class=\"el-transfer-panel__filter\"\n size=\"small\"\n :placeholder=\"placeholder\"\n @mouseenter=\"inputHover = true\"\n @mouseleave=\"inputHover = false\"\n >\n <template #prefix>\n <el-icon v-if=\"inputIcon\" class=\"el-input__icon\" @click=\"clearQuery\">\n <component :is=\"inputIcon\" />\n </el-icon>\n </template>\n </el-input>\n <el-checkbox-group\n v-show=\"!hasNoMatch && data.length > 0\"\n v-model=\"checked\"\n :class=\"{ 'is-filterable': filterable }\"\n class=\"el-transfer-panel__list\"\n >\n <el-checkbox\n v-for=\"item in filteredData\"\n :key=\"item[keyProp]\"\n class=\"el-transfer-panel__item\"\n :label=\"item[keyProp]\"\n :disabled=\"item[disabledProp]\"\n >\n <option-content :option=\"optionRender(item)\" />\n </el-checkbox>\n </el-checkbox-group>\n <p\n v-show=\"hasNoMatch \|\| data.length === 0\"\n class=\"el-transfer-panel__empty\"\n >\n {{ hasNoMatch ? t('el.transfer.noMatch') : t('el.transfer.noData') }}\n </p>\n </div>\n <p v-if=\"hasFooter\" class=\"el-transfer-panel__footer\">\n <slot></slot>\n </p>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, reactive, toRefs } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { ElCheckbox, ElCheckboxGroup } from '@element-plus/components/checkbox'\nimport ElIcon from '@element-plus/components/icon'\nimport ElInput from '@element-plus/components/input'\nimport { CircleClose, Search } from '@element-plus/icons-vue'\nimport { useCheck, useCheckProps, CHECKED_CHANGE_EVENT } from './useCheck'\n\nexport default defineComponent({\n name: 'ElTransferPanel',\n\n components: {\n ElCheckboxGroup,\n ElCheckbox,\n ElInput,\n ElIcon,\n OptionContent: ({ option }) => option,\n },\n\n props: useCheckProps,\n\n emits: [CHECKED_CHANGE_EVENT],\n\n setup(props, { slots }) {\n const { t } = useLocale()\n\n const panelState = reactive({\n checked: [],\n allChecked: false,\n query: '',\n inputHover: false,\n checkChangeByUser: true,\n })\n\n const {\n labelProp,\n keyProp,\n disabledProp,\n filteredData,\n checkedSummary,\n isIndeterminate,\n handleAllCheckedChange,\n } = useCheck(props, panelState)\n\n const hasNoMatch = computed(() => {\n return panelState.query.length > 0 && filteredData.value.length === 0\n })\n\n const inputIcon = computed(() => {\n return panelState.query.length > 0 && panelState.inputHover\n ? CircleClose\n : Search\n })\n\n const hasFooter = computed(() => !!slots.default()[0].children.length)\n\n const clearQuery = () => {\n if (inputIcon.value === CircleClose) {\n panelState.query = ''\n }\n }\n\n const { checked, allChecked, query, inputHover, checkChangeByUser } =\n toRefs(panelState)\n\n return {\n labelProp,\n keyProp,\n disabledProp,\n filteredData,\n checkedSummary,\n isIndeterminate,\n handleAllCheckedChange,\n\n checked,\n allChecked,\n query,\n inputHover,\n checkChangeByUser,\n\n hasNoMatch,\n inputIcon,\n hasFooter,\n clearQuery,\n\n t,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;AAqEA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe,CAAC,EAAE,aAAa;AAAA;AAAA,EAGjC,OAAO;AAAA,EAEP,OAAO,CAAC;AAAA,EAER,MAAM,OAAO,EAAE,SAAS;AACtB,UAAM,EAAE,MAAM;AAEd,UAAM,aAAa,SAAS;AAAA,MAC1B,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,mBAAmB;AAAA;AAGrB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,SAAS,OAAO;AAEpB,UAAM,aAAa,SAAS,MAAM;AAChC,aAAO,WAAW,MAAM,SAAS,KAAK,aAAa,MAAM,WAAW;AAAA;AAGtE,UAAM,YAAY,SAAS,MAAM;AAC/B,aAAO,WAAW,MAAM,SAAS,KAAK,WAAW,aAC7C,cACA;AAAA;AAGN,UAAM,YAAY,SAAS,MAAM,CAAC,CAAC,MAAM,UAAU,GAAG,SAAS;AAE/D,UAAM,aAAa,MAAM;AACvB,UAAI,UAAU,UAAU,aAAa;AACnC,mBAAW,QAAQ;AAAA;AAAA;AAIvB,UAAM,EAAE,SAAS,YAAY,OAAO,YAAY,sBAC9C,OAAO;AAET,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA;AAAA;AAAA;;;;"}

package/es/components/transfer/src/transfer-panel.vue_vue_type_template_id_1a7d1f9c_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"transfer-panel.vue_vue_type_template_id_1a7d1f9c_lang.mjs","sources":["../../../../../../packages/components/transfer/src/transfer-panel.vue?vue&type=template&id=1a7d1f9c&lang.js"],"sourcesContent":["<template>\n <div class=\"el-transfer-panel\">\n <p class=\"el-transfer-panel__header\">\n <el-checkbox\n v-model=\"allChecked\"\n :indeterminate=\"isIndeterminate\"\n @change=\"handleAllCheckedChange\"\n >\n {{ title }}\n <span>{{ checkedSummary }}</span>\n </el-checkbox>\n </p>\n\n <div\n :class=\"['el-transfer-panel__body', hasFooter ? 'is-with-footer' : '']\"\n >\n <el-input\n v-if=\"filterable\"\n v-model=\"query\"\n class=\"el-transfer-panel__filter\"\n size=\"small\"\n :placeholder=\"placeholder\"\n @mouseenter=\"inputHover = true\"\n @mouseleave=\"inputHover = false\"\n >\n <template #prefix>\n <el-icon v-if=\"inputIcon\" class=\"el-input__icon\" @click=\"clearQuery\">\n <component :is=\"inputIcon\" />\n </el-icon>\n </template>\n </el-input>\n <el-checkbox-group\n v-show=\"!hasNoMatch && data.length > 0\"\n v-model=\"checked\"\n :class=\"{ 'is-filterable': filterable }\"\n class=\"el-transfer-panel__list\"\n >\n <el-checkbox\n v-for=\"item in filteredData\"\n :key=\"item[keyProp]\"\n class=\"el-transfer-panel__item\"\n :label=\"item[keyProp]\"\n :disabled=\"item[disabledProp]\"\n >\n <option-content :option=\"optionRender(item)\" />\n </el-checkbox>\n </el-checkbox-group>\n <p\n v-show=\"hasNoMatch \|\| data.length === 0\"\n class=\"el-transfer-panel__empty\"\n >\n {{ hasNoMatch ? t('el.transfer.noMatch') : t('el.transfer.noData') }}\n </p>\n </div>\n <p v-if=\"hasFooter\" class=\"el-transfer-panel__footer\">\n <slot></slot>\n </p>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, reactive, toRefs } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { ElCheckbox, ElCheckboxGroup } from '@element-plus/components/checkbox'\nimport ElIcon from '@element-plus/components/icon'\nimport ElInput from '@element-plus/components/input'\nimport { CircleClose, Search } from '@element-plus/icons'\nimport { useCheck, useCheckProps, CHECKED_CHANGE_EVENT } from './useCheck'\n\nexport default defineComponent({\n name: 'ElTransferPanel',\n\n components: {\n ElCheckboxGroup,\n ElCheckbox,\n ElInput,\n ElIcon,\n OptionContent: ({ option }) => option,\n },\n\n props: useCheckProps,\n\n emits: [CHECKED_CHANGE_EVENT],\n\n setup(props, { slots }) {\n const { t } = useLocale()\n\n const panelState = reactive({\n checked: [],\n allChecked: false,\n query: '',\n inputHover: false,\n checkChangeByUser: true,\n })\n\n const {\n labelProp,\n keyProp,\n disabledProp,\n filteredData,\n checkedSummary,\n isIndeterminate,\n handleAllCheckedChange,\n } = useCheck(props, panelState)\n\n const hasNoMatch = computed(() => {\n return panelState.query.length > 0 && filteredData.value.length === 0\n })\n\n const inputIcon = computed(() => {\n return panelState.query.length > 0 && panelState.inputHover\n ? CircleClose\n : Search\n })\n\n const hasFooter = computed(() => !!slots.default()[0].children.length)\n\n const clearQuery = () => {\n if (inputIcon.value === CircleClose) {\n panelState.query = ''\n }\n }\n\n const { checked, allChecked, query, inputHover, checkChangeByUser } =\n toRefs(panelState)\n\n return {\n labelProp,\n keyProp,\n disabledProp,\n filteredData,\n checkedSummary,\n isIndeterminate,\n handleAllCheckedChange,\n\n checked,\n allChecked,\n query,\n inputHover,\n checkChangeByUser,\n\n hasNoMatch,\n inputIcon,\n hasFooter,\n clearQuery,\n\n t,\n }\n },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_createVNode","_createBlock","_renderSlot"],"mappings":";;qBACO,OAAM;qBACN,OAAM;;;EAoDW,OAAM;AAAA;;;;;;;sBArD5BA,0BAAA;IACEC,wBAAA;MACEC;oBACW;qEAAA;QACR,eAAe;QACf,UAAQ;;yBAET;0CAAG;UACHD,iDAAS;;;;;IAIbA;MACG,kDAAmC;;MAG5B,gCADRE;;oBAEW;qEAAA;QACT,OAAM;AAAA,QACN,MAAK;AAAA,QACJ,aAAa;QACb,oDAAY;QACZ,oDAAY;;QAEF,gBACT;UAAe,+BAAfA;;YAA0B,OAAM;AAAA,YAAkB,SAAO;;6BACvD;4BAAAA,oCAAgB;;;;;;;qBAItBD;oBAEW;qEAAA;QACR,0CAA0B,mBACrB;AAAA;yBAGJ;4BADFF,8CACiB,oBAAR;gCADTG;cAEG,KAAK,KAAK;cACX,OAAM;AAAA,cACL,OAAO,KAAK;cACZ,UAAU,KAAK;;+BAEhB;gBAAAD;kBAAiB,QAAQ,kBAAa;AAAA;;;;;;;;iBAZ/B,mBAAc,UAAK;;qBAe9BD,0BAEE,OAAM,8CAEH,kBAAa,gCAA2B;gBAHnC,mBAAc,UAAK;;;IAMtB,+BAATD,wBAAA;MACEI;;;;;;;"}
1	+ {"version":3,"file":"transfer-panel.vue_vue_type_template_id_1a7d1f9c_lang.mjs","sources":["../../../../../../packages/components/transfer/src/transfer-panel.vue?vue&type=template&id=1a7d1f9c&lang.js"],"sourcesContent":["<template>\n <div class=\"el-transfer-panel\">\n <p class=\"el-transfer-panel__header\">\n <el-checkbox\n v-model=\"allChecked\"\n :indeterminate=\"isIndeterminate\"\n @change=\"handleAllCheckedChange\"\n >\n {{ title }}\n <span>{{ checkedSummary }}</span>\n </el-checkbox>\n </p>\n\n <div\n :class=\"['el-transfer-panel__body', hasFooter ? 'is-with-footer' : '']\"\n >\n <el-input\n v-if=\"filterable\"\n v-model=\"query\"\n class=\"el-transfer-panel__filter\"\n size=\"small\"\n :placeholder=\"placeholder\"\n @mouseenter=\"inputHover = true\"\n @mouseleave=\"inputHover = false\"\n >\n <template #prefix>\n <el-icon v-if=\"inputIcon\" class=\"el-input__icon\" @click=\"clearQuery\">\n <component :is=\"inputIcon\" />\n </el-icon>\n </template>\n </el-input>\n <el-checkbox-group\n v-show=\"!hasNoMatch && data.length > 0\"\n v-model=\"checked\"\n :class=\"{ 'is-filterable': filterable }\"\n class=\"el-transfer-panel__list\"\n >\n <el-checkbox\n v-for=\"item in filteredData\"\n :key=\"item[keyProp]\"\n class=\"el-transfer-panel__item\"\n :label=\"item[keyProp]\"\n :disabled=\"item[disabledProp]\"\n >\n <option-content :option=\"optionRender(item)\" />\n </el-checkbox>\n </el-checkbox-group>\n <p\n v-show=\"hasNoMatch \|\| data.length === 0\"\n class=\"el-transfer-panel__empty\"\n >\n {{ hasNoMatch ? t('el.transfer.noMatch') : t('el.transfer.noData') }}\n </p>\n </div>\n <p v-if=\"hasFooter\" class=\"el-transfer-panel__footer\">\n <slot></slot>\n </p>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, reactive, toRefs } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { ElCheckbox, ElCheckboxGroup } from '@element-plus/components/checkbox'\nimport ElIcon from '@element-plus/components/icon'\nimport ElInput from '@element-plus/components/input'\nimport { CircleClose, Search } from '@element-plus/icons-vue'\nimport { useCheck, useCheckProps, CHECKED_CHANGE_EVENT } from './useCheck'\n\nexport default defineComponent({\n name: 'ElTransferPanel',\n\n components: {\n ElCheckboxGroup,\n ElCheckbox,\n ElInput,\n ElIcon,\n OptionContent: ({ option }) => option,\n },\n\n props: useCheckProps,\n\n emits: [CHECKED_CHANGE_EVENT],\n\n setup(props, { slots }) {\n const { t } = useLocale()\n\n const panelState = reactive({\n checked: [],\n allChecked: false,\n query: '',\n inputHover: false,\n checkChangeByUser: true,\n })\n\n const {\n labelProp,\n keyProp,\n disabledProp,\n filteredData,\n checkedSummary,\n isIndeterminate,\n handleAllCheckedChange,\n } = useCheck(props, panelState)\n\n const hasNoMatch = computed(() => {\n return panelState.query.length > 0 && filteredData.value.length === 0\n })\n\n const inputIcon = computed(() => {\n return panelState.query.length > 0 && panelState.inputHover\n ? CircleClose\n : Search\n })\n\n const hasFooter = computed(() => !!slots.default()[0].children.length)\n\n const clearQuery = () => {\n if (inputIcon.value === CircleClose) {\n panelState.query = ''\n }\n }\n\n const { checked, allChecked, query, inputHover, checkChangeByUser } =\n toRefs(panelState)\n\n return {\n labelProp,\n keyProp,\n disabledProp,\n filteredData,\n checkedSummary,\n isIndeterminate,\n handleAllCheckedChange,\n\n checked,\n allChecked,\n query,\n inputHover,\n checkChangeByUser,\n\n hasNoMatch,\n inputIcon,\n hasFooter,\n clearQuery,\n\n t,\n }\n },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_createVNode","_createBlock","_renderSlot"],"mappings":";;qBACO,OAAM;qBACN,OAAM;;;EAoDW,OAAM;AAAA;;;;;;;sBArD5BA,0BAAA;IACEC,wBAAA;MACEC;oBACW;qEAAA;QACR,eAAe;QACf,UAAQ;;yBAET;0CAAG;UACHD,iDAAS;;;;;IAIbA;MACG,kDAAmC;;MAG5B,gCADRE;;oBAEW;qEAAA;QACT,OAAM;AAAA,QACN,MAAK;AAAA,QACJ,aAAa;QACb,oDAAY;QACZ,oDAAY;;QAEF,gBACT;UAAe,+BAAfA;;YAA0B,OAAM;AAAA,YAAkB,SAAO;;6BACvD;4BAAAA,oCAAgB;;;;;;;qBAItBD;oBAEW;qEAAA;QACR,0CAA0B,mBACrB;AAAA;yBAGJ;4BADFF,8CACiB,oBAAR;gCADTG;cAEG,KAAK,KAAK;cACX,OAAM;AAAA,cACL,OAAO,KAAK;cACZ,UAAU,KAAK;;+BAEhB;gBAAAD;kBAAiB,QAAQ,kBAAa;AAAA;;;;;;;;iBAZ/B,mBAAc,UAAK;;qBAe9BD,0BAEE,OAAM,8CAEH,kBAAa,gCAA2B;gBAHnC,mBAAc,UAAK;;;IAMtB,+BAATD,wBAAA;MACEI;;;;;;;"}

package/es/components/tree/index.d.ts CHANGED Viewed

@@ -416,9 +416,9 @@ declare const _Tree: SFCWithInstall<import("vue").DefineComponent<{
     draggable: boolean;
     highlightCurrent: boolean;
 } & {
-    emptyText?: string | undefined;
     icon?: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions> | undefined;
     load?: import("./src/tree.type").LoadFunction | undefined;
+    emptyText?: string | undefined;
     renderContent?: Function | undefined;
     defaultCheckedKeys?: import("./src/tree.type").TreeKey[] | undefined;
     defaultExpandedKeys?: import("./src/tree.type").TreeKey[] | undefined;
@@ -876,9 +876,9 @@ export declare const ElTree: SFCWithInstall<import("vue").DefineComponent<{
     draggable: boolean;
     highlightCurrent: boolean;
 } & {
-    emptyText?: string | undefined;
     icon?: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions> | undefined;
     load?: import("./src/tree.type").LoadFunction | undefined;
+    emptyText?: string | undefined;
     renderContent?: Function | undefined;
     defaultCheckedKeys?: import("./src/tree.type").TreeKey[] | undefined;
     defaultExpandedKeys?: import("./src/tree.type").TreeKey[] | undefined;

package/es/components/tree/src/tree-node.vue_vue_type_script_lang.mjs CHANGED Viewed

@@ -3,7 +3,7 @@ import { isFunction, isString } from '@vue/shared';
 import _CollapseTransition from '../../collapse-transition/index.mjs';
 import { ElCheckbox } from '../../checkbox/index.mjs';
 import { ElIcon } from '../../icon/index.mjs';
-import { Loading, CaretRight } from '@element-plus/icons';
+import { Loading, CaretRight } from '@element-plus/icons-vue';
 import { debugWarn } from '../../../utils/error.mjs';
 import './tree-node-content.mjs';
 import { getNodeKey } from './model/util.mjs';

package/es/components/tree/src/tree-node.vue_vue_type_script_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tree-node.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/tree/src/tree-node.vue"],"sourcesContent":["<template>\n <div\n v-show=\"node.visible\"\n ref=\"node$\"\n class=\"el-tree-node\"\n :class=\"{\n 'is-expanded': expanded,\n 'is-current': node.isCurrent,\n 'is-hidden': !node.visible,\n 'is-focusable': !node.disabled,\n 'is-checked': !node.disabled && node.checked,\n ...getNodeClass(node),\n }\"\n role=\"treeitem\"\n tabindex=\"-1\"\n :aria-expanded=\"expanded\"\n :aria-disabled=\"node.disabled\"\n :aria-checked=\"node.checked\"\n :draggable=\"tree.props.draggable\"\n :data-key=\"getNodeKey(node)\"\n @click.stop=\"handleClick\"\n @contextmenu=\"handleContextMenu\"\n @dragstart.stop=\"handleDragStart\"\n @dragover.stop=\"handleDragOver\"\n @dragend.stop=\"handleDragEnd\"\n @drop.stop=\"handleDrop\"\n >\n <div\n class=\"el-tree-node__content\"\n :style=\"{ paddingLeft: (node.level - 1) * tree.props.indent + 'px' }\"\n >\n <el-icon\n v-if=\"tree.props.icon \|\| CaretRight\"\n :class=\"[\n {\n 'is-leaf': node.isLeaf,\n expanded: !node.isLeaf && expanded,\n },\n 'el-tree-node__expand-icon',\n ]\"\n @click.stop=\"handleExpandIconClick\"\n >\n <component :is=\"tree.props.icon \|\| CaretRight\"></component>\n </el-icon>\n <el-checkbox\n v-if=\"showCheckbox\"\n :model-value=\"node.checked\"\n :indeterminate=\"node.indeterminate\"\n :disabled=\"!!node.disabled\"\n @click.stop\n @change=\"handleCheckChange\"\n />\n <el-icon\n v-if=\"node.loading\"\n class=\"el-tree-node__loading-icon is-loading\"\n >\n <loading />\n </el-icon>\n <node-content :node=\"node\" :render-content=\"renderContent\" />\n </div>\n <el-collapse-transition>\n <div\n v-if=\"!renderAfterExpand \|\| childNodeRendered\"\n v-show=\"expanded\"\n class=\"el-tree-node__children\"\n role=\"group\"\n :aria-expanded=\"expanded\"\n >\n <el-tree-node\n v-for=\"child in node.childNodes\"\n :key=\"getNodeKey(child)\"\n :render-content=\"renderContent\"\n :render-after-expand=\"renderAfterExpand\"\n :show-checkbox=\"showCheckbox\"\n :node=\"child\"\n :props=\"props\"\n @node-expand=\"handleChildNodeExpand\"\n />\n </div>\n </el-collapse-transition>\n </div>\n</template>\n<script lang=\"ts\">\nimport {\n defineComponent,\n getCurrentInstance,\n ref,\n watch,\n nextTick,\n inject,\n provide,\n} from 'vue'\nimport { isString, isFunction } from '@vue/shared'\nimport ElCollapseTransition from '@element-plus/components/collapse-transition'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { CaretRight, Loading } from '@element-plus/icons'\nimport { debugWarn } from '@element-plus/utils/error'\nimport NodeContent from './tree-node-content.vue'\nimport { getNodeKey as getNodeKeyUtil } from './model/util'\nimport { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'\nimport { dragEventsKey } from './model/useDragNode'\nimport Node from './model/node'\n\nimport type { ComponentInternalInstance, PropType } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type { TreeOptionProps, TreeNodeData, RootTreeType } from './tree.type'\n\nexport default defineComponent({\n name: 'ElTreeNode',\n components: {\n ElCollapseTransition,\n ElCheckbox,\n NodeContent,\n ElIcon,\n Loading,\n },\n props: {\n node: {\n type: Node,\n default: () => ({}),\n },\n props: {\n type: Object as PropType<TreeOptionProps>,\n default: () => ({}),\n },\n accordion: Boolean,\n renderContent: Function,\n renderAfterExpand: Boolean,\n showCheckbox: {\n type: Boolean,\n default: false,\n },\n },\n emits: ['node-expand'],\n setup(props, ctx) {\n const { broadcastExpanded } = useNodeExpandEventBroadcast(props)\n const tree = inject<RootTreeType>('RootTree')\n const expanded = ref(false)\n const childNodeRendered = ref(false)\n const oldChecked = ref<boolean>(null)\n const oldIndeterminate = ref<boolean>(null)\n const node$ = ref<Nullable<HTMLElement>>(null)\n const dragEvents = inject(dragEventsKey)\n const instance = getCurrentInstance()\n\n provide('NodeInstance', instance)\n if (!tree) {\n debugWarn('Tree', \"Can not find node's tree.\")\n }\n\n if (props.node.expanded) {\n expanded.value = true\n childNodeRendered.value = true\n }\n\n const childrenKey = tree.props['children'] \|\| 'children'\n watch(\n () => {\n const children = props.node.data[childrenKey]\n return children && [...children]\n },\n () => {\n props.node.updateChildren()\n }\n )\n\n watch(\n () => props.node.indeterminate,\n (val) => {\n handleSelectChange(props.node.checked, val)\n }\n )\n\n watch(\n () => props.node.checked,\n (val) => {\n handleSelectChange(val, props.node.indeterminate)\n }\n )\n\n watch(\n () => props.node.expanded,\n (val) => {\n nextTick(() => (expanded.value = val))\n if (val) {\n childNodeRendered.value = true\n }\n }\n )\n\n const getNodeKey = (node: Node): any => {\n return getNodeKeyUtil(tree.props.nodeKey, node.data)\n }\n\n const getNodeClass = (node: Node) => {\n const nodeClassFunc = props.props.class\n if (!nodeClassFunc) {\n return {}\n }\n let className\n if (isFunction(nodeClassFunc)) {\n const { data } = node\n className = nodeClassFunc(data, node)\n } else {\n className = nodeClassFunc\n }\n\n if (isString(className)) {\n return { [className]: true }\n } else {\n return className\n }\n }\n\n const handleSelectChange = (checked: boolean, indeterminate: boolean) => {\n if (\n oldChecked.value !== checked \|\|\n oldIndeterminate.value !== indeterminate\n ) {\n tree.ctx.emit('check-change', props.node.data, checked, indeterminate)\n }\n oldChecked.value = checked\n oldIndeterminate.value = indeterminate\n }\n\n const handleClick = () => {\n const store = tree.store.value\n store.setCurrentNode(props.node)\n tree.ctx.emit(\n 'current-change',\n store.currentNode ? store.currentNode.data : null,\n store.currentNode\n )\n tree.currentNode.value = props.node\n\n if (tree.props.expandOnClickNode) {\n handleExpandIconClick()\n }\n\n if (tree.props.checkOnClickNode && !props.node.disabled) {\n handleCheckChange(null, {\n target: { checked: !props.node.checked },\n })\n }\n tree.ctx.emit('node-click', props.node.data, props.node, instance)\n }\n\n const handleContextMenu = (event: Event) => {\n if (tree.instance.vnode.props['onNodeContextmenu']) {\n event.stopPropagation()\n event.preventDefault()\n }\n tree.ctx.emit(\n 'node-contextmenu',\n event,\n props.node.data,\n props.node,\n instance\n )\n }\n\n const handleExpandIconClick = () => {\n if (props.node.isLeaf) return\n if (expanded.value) {\n tree.ctx.emit('node-collapse', props.node.data, props.node, instance)\n props.node.collapse()\n } else {\n props.node.expand()\n ctx.emit('node-expand', props.node.data, props.node, instance)\n }\n }\n\n const handleCheckChange = (value, ev) => {\n props.node.setChecked(ev.target.checked, !tree.props.checkStrictly)\n nextTick(() => {\n const store = tree.store.value\n tree.ctx.emit('check', props.node.data, {\n checkedNodes: store.getCheckedNodes(),\n checkedKeys: store.getCheckedKeys(),\n halfCheckedNodes: store.getHalfCheckedNodes(),\n halfCheckedKeys: store.getHalfCheckedKeys(),\n })\n })\n }\n\n const handleChildNodeExpand = (\n nodeData: TreeNodeData,\n node: Node,\n instance: ComponentInternalInstance\n ) => {\n broadcastExpanded(node)\n tree.ctx.emit('node-expand', nodeData, node, instance)\n }\n\n const handleDragStart = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragStart({ event, treeNode: props })\n }\n\n const handleDragOver = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragOver({\n event,\n treeNode: { $el: node$.value, node: props.node },\n })\n event.preventDefault()\n }\n\n const handleDrop = (event: DragEvent) => {\n event.preventDefault()\n }\n\n const handleDragEnd = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragEnd(event)\n }\n\n return {\n node$,\n tree,\n expanded,\n childNodeRendered,\n oldChecked,\n oldIndeterminate,\n getNodeKey,\n getNodeClass,\n handleSelectChange,\n handleClick,\n handleContextMenu,\n handleExpandIconClick,\n handleCheckChange,\n handleChildNodeExpand,\n handleDragStart,\n handleDragOver,\n handleDrop,\n handleDragEnd,\n CaretRight,\n }\n },\n})\n</script>\n"],"names":["ElCollapseTransition","NodeContent","getNodeKey","getNodeKeyUtil"],"mappings":"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"}
1	+ {"version":3,"file":"tree-node.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/tree/src/tree-node.vue"],"sourcesContent":["<template>\n <div\n v-show=\"node.visible\"\n ref=\"node$\"\n class=\"el-tree-node\"\n :class=\"{\n 'is-expanded': expanded,\n 'is-current': node.isCurrent,\n 'is-hidden': !node.visible,\n 'is-focusable': !node.disabled,\n 'is-checked': !node.disabled && node.checked,\n ...getNodeClass(node),\n }\"\n role=\"treeitem\"\n tabindex=\"-1\"\n :aria-expanded=\"expanded\"\n :aria-disabled=\"node.disabled\"\n :aria-checked=\"node.checked\"\n :draggable=\"tree.props.draggable\"\n :data-key=\"getNodeKey(node)\"\n @click.stop=\"handleClick\"\n @contextmenu=\"handleContextMenu\"\n @dragstart.stop=\"handleDragStart\"\n @dragover.stop=\"handleDragOver\"\n @dragend.stop=\"handleDragEnd\"\n @drop.stop=\"handleDrop\"\n >\n <div\n class=\"el-tree-node__content\"\n :style=\"{ paddingLeft: (node.level - 1) * tree.props.indent + 'px' }\"\n >\n <el-icon\n v-if=\"tree.props.icon \|\| CaretRight\"\n :class=\"[\n {\n 'is-leaf': node.isLeaf,\n expanded: !node.isLeaf && expanded,\n },\n 'el-tree-node__expand-icon',\n ]\"\n @click.stop=\"handleExpandIconClick\"\n >\n <component :is=\"tree.props.icon \|\| CaretRight\"></component>\n </el-icon>\n <el-checkbox\n v-if=\"showCheckbox\"\n :model-value=\"node.checked\"\n :indeterminate=\"node.indeterminate\"\n :disabled=\"!!node.disabled\"\n @click.stop\n @change=\"handleCheckChange\"\n />\n <el-icon\n v-if=\"node.loading\"\n class=\"el-tree-node__loading-icon is-loading\"\n >\n <loading />\n </el-icon>\n <node-content :node=\"node\" :render-content=\"renderContent\" />\n </div>\n <el-collapse-transition>\n <div\n v-if=\"!renderAfterExpand \|\| childNodeRendered\"\n v-show=\"expanded\"\n class=\"el-tree-node__children\"\n role=\"group\"\n :aria-expanded=\"expanded\"\n >\n <el-tree-node\n v-for=\"child in node.childNodes\"\n :key=\"getNodeKey(child)\"\n :render-content=\"renderContent\"\n :render-after-expand=\"renderAfterExpand\"\n :show-checkbox=\"showCheckbox\"\n :node=\"child\"\n :props=\"props\"\n @node-expand=\"handleChildNodeExpand\"\n />\n </div>\n </el-collapse-transition>\n </div>\n</template>\n<script lang=\"ts\">\nimport {\n defineComponent,\n getCurrentInstance,\n ref,\n watch,\n nextTick,\n inject,\n provide,\n} from 'vue'\nimport { isString, isFunction } from '@vue/shared'\nimport ElCollapseTransition from '@element-plus/components/collapse-transition'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { CaretRight, Loading } from '@element-plus/icons-vue'\nimport { debugWarn } from '@element-plus/utils/error'\nimport NodeContent from './tree-node-content.vue'\nimport { getNodeKey as getNodeKeyUtil } from './model/util'\nimport { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'\nimport { dragEventsKey } from './model/useDragNode'\nimport Node from './model/node'\n\nimport type { ComponentInternalInstance, PropType } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type { TreeOptionProps, TreeNodeData, RootTreeType } from './tree.type'\n\nexport default defineComponent({\n name: 'ElTreeNode',\n components: {\n ElCollapseTransition,\n ElCheckbox,\n NodeContent,\n ElIcon,\n Loading,\n },\n props: {\n node: {\n type: Node,\n default: () => ({}),\n },\n props: {\n type: Object as PropType<TreeOptionProps>,\n default: () => ({}),\n },\n accordion: Boolean,\n renderContent: Function,\n renderAfterExpand: Boolean,\n showCheckbox: {\n type: Boolean,\n default: false,\n },\n },\n emits: ['node-expand'],\n setup(props, ctx) {\n const { broadcastExpanded } = useNodeExpandEventBroadcast(props)\n const tree = inject<RootTreeType>('RootTree')\n const expanded = ref(false)\n const childNodeRendered = ref(false)\n const oldChecked = ref<boolean>(null)\n const oldIndeterminate = ref<boolean>(null)\n const node$ = ref<Nullable<HTMLElement>>(null)\n const dragEvents = inject(dragEventsKey)\n const instance = getCurrentInstance()\n\n provide('NodeInstance', instance)\n if (!tree) {\n debugWarn('Tree', \"Can not find node's tree.\")\n }\n\n if (props.node.expanded) {\n expanded.value = true\n childNodeRendered.value = true\n }\n\n const childrenKey = tree.props['children'] \|\| 'children'\n watch(\n () => {\n const children = props.node.data[childrenKey]\n return children && [...children]\n },\n () => {\n props.node.updateChildren()\n }\n )\n\n watch(\n () => props.node.indeterminate,\n (val) => {\n handleSelectChange(props.node.checked, val)\n }\n )\n\n watch(\n () => props.node.checked,\n (val) => {\n handleSelectChange(val, props.node.indeterminate)\n }\n )\n\n watch(\n () => props.node.expanded,\n (val) => {\n nextTick(() => (expanded.value = val))\n if (val) {\n childNodeRendered.value = true\n }\n }\n )\n\n const getNodeKey = (node: Node): any => {\n return getNodeKeyUtil(tree.props.nodeKey, node.data)\n }\n\n const getNodeClass = (node: Node) => {\n const nodeClassFunc = props.props.class\n if (!nodeClassFunc) {\n return {}\n }\n let className\n if (isFunction(nodeClassFunc)) {\n const { data } = node\n className = nodeClassFunc(data, node)\n } else {\n className = nodeClassFunc\n }\n\n if (isString(className)) {\n return { [className]: true }\n } else {\n return className\n }\n }\n\n const handleSelectChange = (checked: boolean, indeterminate: boolean) => {\n if (\n oldChecked.value !== checked \|\|\n oldIndeterminate.value !== indeterminate\n ) {\n tree.ctx.emit('check-change', props.node.data, checked, indeterminate)\n }\n oldChecked.value = checked\n oldIndeterminate.value = indeterminate\n }\n\n const handleClick = () => {\n const store = tree.store.value\n store.setCurrentNode(props.node)\n tree.ctx.emit(\n 'current-change',\n store.currentNode ? store.currentNode.data : null,\n store.currentNode\n )\n tree.currentNode.value = props.node\n\n if (tree.props.expandOnClickNode) {\n handleExpandIconClick()\n }\n\n if (tree.props.checkOnClickNode && !props.node.disabled) {\n handleCheckChange(null, {\n target: { checked: !props.node.checked },\n })\n }\n tree.ctx.emit('node-click', props.node.data, props.node, instance)\n }\n\n const handleContextMenu = (event: Event) => {\n if (tree.instance.vnode.props['onNodeContextmenu']) {\n event.stopPropagation()\n event.preventDefault()\n }\n tree.ctx.emit(\n 'node-contextmenu',\n event,\n props.node.data,\n props.node,\n instance\n )\n }\n\n const handleExpandIconClick = () => {\n if (props.node.isLeaf) return\n if (expanded.value) {\n tree.ctx.emit('node-collapse', props.node.data, props.node, instance)\n props.node.collapse()\n } else {\n props.node.expand()\n ctx.emit('node-expand', props.node.data, props.node, instance)\n }\n }\n\n const handleCheckChange = (value, ev) => {\n props.node.setChecked(ev.target.checked, !tree.props.checkStrictly)\n nextTick(() => {\n const store = tree.store.value\n tree.ctx.emit('check', props.node.data, {\n checkedNodes: store.getCheckedNodes(),\n checkedKeys: store.getCheckedKeys(),\n halfCheckedNodes: store.getHalfCheckedNodes(),\n halfCheckedKeys: store.getHalfCheckedKeys(),\n })\n })\n }\n\n const handleChildNodeExpand = (\n nodeData: TreeNodeData,\n node: Node,\n instance: ComponentInternalInstance\n ) => {\n broadcastExpanded(node)\n tree.ctx.emit('node-expand', nodeData, node, instance)\n }\n\n const handleDragStart = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragStart({ event, treeNode: props })\n }\n\n const handleDragOver = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragOver({\n event,\n treeNode: { $el: node$.value, node: props.node },\n })\n event.preventDefault()\n }\n\n const handleDrop = (event: DragEvent) => {\n event.preventDefault()\n }\n\n const handleDragEnd = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragEnd(event)\n }\n\n return {\n node$,\n tree,\n expanded,\n childNodeRendered,\n oldChecked,\n oldIndeterminate,\n getNodeKey,\n getNodeClass,\n handleSelectChange,\n handleClick,\n handleContextMenu,\n handleExpandIconClick,\n handleCheckChange,\n handleChildNodeExpand,\n handleDragStart,\n handleDragOver,\n handleDrop,\n handleDragEnd,\n CaretRight,\n }\n },\n})\n</script>\n"],"names":["ElCollapseTransition","NodeContent","getNodeKey","getNodeKeyUtil"],"mappings":"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"}

package/es/components/tree/src/tree-node.vue_vue_type_template_id_62959aba_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tree-node.vue_vue_type_template_id_62959aba_lang.mjs","sources":["../../../../../../packages/components/tree/src/tree-node.vue?vue&type=template&id=62959aba&lang.js"],"sourcesContent":["<template>\n <div\n v-show=\"node.visible\"\n ref=\"node$\"\n class=\"el-tree-node\"\n :class=\"{\n 'is-expanded': expanded,\n 'is-current': node.isCurrent,\n 'is-hidden': !node.visible,\n 'is-focusable': !node.disabled,\n 'is-checked': !node.disabled && node.checked,\n ...getNodeClass(node),\n }\"\n role=\"treeitem\"\n tabindex=\"-1\"\n :aria-expanded=\"expanded\"\n :aria-disabled=\"node.disabled\"\n :aria-checked=\"node.checked\"\n :draggable=\"tree.props.draggable\"\n :data-key=\"getNodeKey(node)\"\n @click.stop=\"handleClick\"\n @contextmenu=\"handleContextMenu\"\n @dragstart.stop=\"handleDragStart\"\n @dragover.stop=\"handleDragOver\"\n @dragend.stop=\"handleDragEnd\"\n @drop.stop=\"handleDrop\"\n >\n <div\n class=\"el-tree-node__content\"\n :style=\"{ paddingLeft: (node.level - 1) * tree.props.indent + 'px' }\"\n >\n <el-icon\n v-if=\"tree.props.icon \|\| CaretRight\"\n :class=\"[\n {\n 'is-leaf': node.isLeaf,\n expanded: !node.isLeaf && expanded,\n },\n 'el-tree-node__expand-icon',\n ]\"\n @click.stop=\"handleExpandIconClick\"\n >\n <component :is=\"tree.props.icon \|\| CaretRight\"></component>\n </el-icon>\n <el-checkbox\n v-if=\"showCheckbox\"\n :model-value=\"node.checked\"\n :indeterminate=\"node.indeterminate\"\n :disabled=\"!!node.disabled\"\n @click.stop\n @change=\"handleCheckChange\"\n />\n <el-icon\n v-if=\"node.loading\"\n class=\"el-tree-node__loading-icon is-loading\"\n >\n <loading />\n </el-icon>\n <node-content :node=\"node\" :render-content=\"renderContent\" />\n </div>\n <el-collapse-transition>\n <div\n v-if=\"!renderAfterExpand \|\| childNodeRendered\"\n v-show=\"expanded\"\n class=\"el-tree-node__children\"\n role=\"group\"\n :aria-expanded=\"expanded\"\n >\n <el-tree-node\n v-for=\"child in node.childNodes\"\n :key=\"getNodeKey(child)\"\n :render-content=\"renderContent\"\n :render-after-expand=\"renderAfterExpand\"\n :show-checkbox=\"showCheckbox\"\n :node=\"child\"\n :props=\"props\"\n @node-expand=\"handleChildNodeExpand\"\n />\n </div>\n </el-collapse-transition>\n </div>\n</template>\n<script lang=\"ts\">\nimport {\n defineComponent,\n getCurrentInstance,\n ref,\n watch,\n nextTick,\n inject,\n provide,\n} from 'vue'\nimport { isString, isFunction } from '@vue/shared'\nimport ElCollapseTransition from '@element-plus/components/collapse-transition'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { CaretRight, Loading } from '@element-plus/icons'\nimport { debugWarn } from '@element-plus/utils/error'\nimport NodeContent from './tree-node-content.vue'\nimport { getNodeKey as getNodeKeyUtil } from './model/util'\nimport { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'\nimport { dragEventsKey } from './model/useDragNode'\nimport Node from './model/node'\n\nimport type { ComponentInternalInstance, PropType } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type { TreeOptionProps, TreeNodeData, RootTreeType } from './tree.type'\n\nexport default defineComponent({\n name: 'ElTreeNode',\n components: {\n ElCollapseTransition,\n ElCheckbox,\n NodeContent,\n ElIcon,\n Loading,\n },\n props: {\n node: {\n type: Node,\n default: () => ({}),\n },\n props: {\n type: Object as PropType<TreeOptionProps>,\n default: () => ({}),\n },\n accordion: Boolean,\n renderContent: Function,\n renderAfterExpand: Boolean,\n showCheckbox: {\n type: Boolean,\n default: false,\n },\n },\n emits: ['node-expand'],\n setup(props, ctx) {\n const { broadcastExpanded } = useNodeExpandEventBroadcast(props)\n const tree = inject<RootTreeType>('RootTree')\n const expanded = ref(false)\n const childNodeRendered = ref(false)\n const oldChecked = ref<boolean>(null)\n const oldIndeterminate = ref<boolean>(null)\n const node$ = ref<Nullable<HTMLElement>>(null)\n const dragEvents = inject(dragEventsKey)\n const instance = getCurrentInstance()\n\n provide('NodeInstance', instance)\n if (!tree) {\n debugWarn('Tree', \"Can not find node's tree.\")\n }\n\n if (props.node.expanded) {\n expanded.value = true\n childNodeRendered.value = true\n }\n\n const childrenKey = tree.props['children'] \|\| 'children'\n watch(\n () => {\n const children = props.node.data[childrenKey]\n return children && [...children]\n },\n () => {\n props.node.updateChildren()\n }\n )\n\n watch(\n () => props.node.indeterminate,\n (val) => {\n handleSelectChange(props.node.checked, val)\n }\n )\n\n watch(\n () => props.node.checked,\n (val) => {\n handleSelectChange(val, props.node.indeterminate)\n }\n )\n\n watch(\n () => props.node.expanded,\n (val) => {\n nextTick(() => (expanded.value = val))\n if (val) {\n childNodeRendered.value = true\n }\n }\n )\n\n const getNodeKey = (node: Node): any => {\n return getNodeKeyUtil(tree.props.nodeKey, node.data)\n }\n\n const getNodeClass = (node: Node) => {\n const nodeClassFunc = props.props.class\n if (!nodeClassFunc) {\n return {}\n }\n let className\n if (isFunction(nodeClassFunc)) {\n const { data } = node\n className = nodeClassFunc(data, node)\n } else {\n className = nodeClassFunc\n }\n\n if (isString(className)) {\n return { [className]: true }\n } else {\n return className\n }\n }\n\n const handleSelectChange = (checked: boolean, indeterminate: boolean) => {\n if (\n oldChecked.value !== checked \|\|\n oldIndeterminate.value !== indeterminate\n ) {\n tree.ctx.emit('check-change', props.node.data, checked, indeterminate)\n }\n oldChecked.value = checked\n oldIndeterminate.value = indeterminate\n }\n\n const handleClick = () => {\n const store = tree.store.value\n store.setCurrentNode(props.node)\n tree.ctx.emit(\n 'current-change',\n store.currentNode ? store.currentNode.data : null,\n store.currentNode\n )\n tree.currentNode.value = props.node\n\n if (tree.props.expandOnClickNode) {\n handleExpandIconClick()\n }\n\n if (tree.props.checkOnClickNode && !props.node.disabled) {\n handleCheckChange(null, {\n target: { checked: !props.node.checked },\n })\n }\n tree.ctx.emit('node-click', props.node.data, props.node, instance)\n }\n\n const handleContextMenu = (event: Event) => {\n if (tree.instance.vnode.props['onNodeContextmenu']) {\n event.stopPropagation()\n event.preventDefault()\n }\n tree.ctx.emit(\n 'node-contextmenu',\n event,\n props.node.data,\n props.node,\n instance\n )\n }\n\n const handleExpandIconClick = () => {\n if (props.node.isLeaf) return\n if (expanded.value) {\n tree.ctx.emit('node-collapse', props.node.data, props.node, instance)\n props.node.collapse()\n } else {\n props.node.expand()\n ctx.emit('node-expand', props.node.data, props.node, instance)\n }\n }\n\n const handleCheckChange = (value, ev) => {\n props.node.setChecked(ev.target.checked, !tree.props.checkStrictly)\n nextTick(() => {\n const store = tree.store.value\n tree.ctx.emit('check', props.node.data, {\n checkedNodes: store.getCheckedNodes(),\n checkedKeys: store.getCheckedKeys(),\n halfCheckedNodes: store.getHalfCheckedNodes(),\n halfCheckedKeys: store.getHalfCheckedKeys(),\n })\n })\n }\n\n const handleChildNodeExpand = (\n nodeData: TreeNodeData,\n node: Node,\n instance: ComponentInternalInstance\n ) => {\n broadcastExpanded(node)\n tree.ctx.emit('node-expand', nodeData, node, instance)\n }\n\n const handleDragStart = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragStart({ event, treeNode: props })\n }\n\n const handleDragOver = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragOver({\n event,\n treeNode: { $el: node$.value, node: props.node },\n })\n event.preventDefault()\n }\n\n const handleDrop = (event: DragEvent) => {\n event.preventDefault()\n }\n\n const handleDragEnd = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragEnd(event)\n }\n\n return {\n node$,\n tree,\n expanded,\n childNodeRendered,\n oldChecked,\n oldIndeterminate,\n getNodeKey,\n getNodeClass,\n handleSelectChange,\n handleClick,\n handleContextMenu,\n handleExpandIconClick,\n handleCheckChange,\n handleChildNodeExpand,\n handleDragStart,\n handleDragOver,\n handleDrop,\n handleDragEnd,\n CaretRight,\n }\n },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_createBlock","_createVNode"],"mappings":";;;;;;;;;;;sCACEA;IAEE,KAAI;AAAA,IACJ,uBAAM;;;;;;;;IASN,MAAK;AAAA,IACL,UAAS;AAAA,IACR,iBAAe;IACf,iBAAe,UAAK;AAAA,IACpB,gBAAc,UAAK;AAAA,IACnB,WAAW,UAAK,MAAM;AAAA,IACtB,YAAU,gBAAW;IACrB,8DAAY;IACZ,sDAAa;IACb,kEAAgB;IAChB,iEAAe;IACf,gEAAc;IACd,6DAAW;;IAEZC;MACE,OAAM;AAAA,MACL,qCAAuB,WAAK,aAAa,UAAK,MAAM;;MAG7C,UAAK,MAAM,QAAQ,gCAD3BC;;QAEG;;;;;;;QAOA,uBAAY;;yBAEb;wBAAAA,oCAAgB,UAAK,MAAM,QAAQ;;;;MAG7B,kCADRA;;QAEG,eAAa,UAAK;AAAA,QAClB,eAAe,UAAK;AAAA,QACpB,YAAY,UAAK;AAAA,QACjB,iDAAD;;QACC,UAAQ;;MAGH,UAAK,wBADbA;;QAEE,OAAM;AAAA;yBAEN;UAAAC;;;;MAEFA;QAAe,MAAM;QAAO,kBAAgB;;;IAE9CA;uBACE;SACS,0BAAqB,sDAD9BH;;UAGE,OAAM;AAAA,UACN,MAAK;AAAA,UACJ,iBAAe;;4BAEhBA,8CACkB,UAAK,aAAd;gCADTE;cAEG,KAAK,gBAAW;AAAA,cAChB,kBAAgB;cAChB,uBAAqB;cACrB,iBAAe;cACf,MAAM;AAAA,cACN,OAAO;cACP,cAAa;;;;kBAbR;;;;;;YA7DJ,UAAK;AAAA;AAAA;;;;"}
1	+ {"version":3,"file":"tree-node.vue_vue_type_template_id_62959aba_lang.mjs","sources":["../../../../../../packages/components/tree/src/tree-node.vue?vue&type=template&id=62959aba&lang.js"],"sourcesContent":["<template>\n <div\n v-show=\"node.visible\"\n ref=\"node$\"\n class=\"el-tree-node\"\n :class=\"{\n 'is-expanded': expanded,\n 'is-current': node.isCurrent,\n 'is-hidden': !node.visible,\n 'is-focusable': !node.disabled,\n 'is-checked': !node.disabled && node.checked,\n ...getNodeClass(node),\n }\"\n role=\"treeitem\"\n tabindex=\"-1\"\n :aria-expanded=\"expanded\"\n :aria-disabled=\"node.disabled\"\n :aria-checked=\"node.checked\"\n :draggable=\"tree.props.draggable\"\n :data-key=\"getNodeKey(node)\"\n @click.stop=\"handleClick\"\n @contextmenu=\"handleContextMenu\"\n @dragstart.stop=\"handleDragStart\"\n @dragover.stop=\"handleDragOver\"\n @dragend.stop=\"handleDragEnd\"\n @drop.stop=\"handleDrop\"\n >\n <div\n class=\"el-tree-node__content\"\n :style=\"{ paddingLeft: (node.level - 1) * tree.props.indent + 'px' }\"\n >\n <el-icon\n v-if=\"tree.props.icon \|\| CaretRight\"\n :class=\"[\n {\n 'is-leaf': node.isLeaf,\n expanded: !node.isLeaf && expanded,\n },\n 'el-tree-node__expand-icon',\n ]\"\n @click.stop=\"handleExpandIconClick\"\n >\n <component :is=\"tree.props.icon \|\| CaretRight\"></component>\n </el-icon>\n <el-checkbox\n v-if=\"showCheckbox\"\n :model-value=\"node.checked\"\n :indeterminate=\"node.indeterminate\"\n :disabled=\"!!node.disabled\"\n @click.stop\n @change=\"handleCheckChange\"\n />\n <el-icon\n v-if=\"node.loading\"\n class=\"el-tree-node__loading-icon is-loading\"\n >\n <loading />\n </el-icon>\n <node-content :node=\"node\" :render-content=\"renderContent\" />\n </div>\n <el-collapse-transition>\n <div\n v-if=\"!renderAfterExpand \|\| childNodeRendered\"\n v-show=\"expanded\"\n class=\"el-tree-node__children\"\n role=\"group\"\n :aria-expanded=\"expanded\"\n >\n <el-tree-node\n v-for=\"child in node.childNodes\"\n :key=\"getNodeKey(child)\"\n :render-content=\"renderContent\"\n :render-after-expand=\"renderAfterExpand\"\n :show-checkbox=\"showCheckbox\"\n :node=\"child\"\n :props=\"props\"\n @node-expand=\"handleChildNodeExpand\"\n />\n </div>\n </el-collapse-transition>\n </div>\n</template>\n<script lang=\"ts\">\nimport {\n defineComponent,\n getCurrentInstance,\n ref,\n watch,\n nextTick,\n inject,\n provide,\n} from 'vue'\nimport { isString, isFunction } from '@vue/shared'\nimport ElCollapseTransition from '@element-plus/components/collapse-transition'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { CaretRight, Loading } from '@element-plus/icons-vue'\nimport { debugWarn } from '@element-plus/utils/error'\nimport NodeContent from './tree-node-content.vue'\nimport { getNodeKey as getNodeKeyUtil } from './model/util'\nimport { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'\nimport { dragEventsKey } from './model/useDragNode'\nimport Node from './model/node'\n\nimport type { ComponentInternalInstance, PropType } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type { TreeOptionProps, TreeNodeData, RootTreeType } from './tree.type'\n\nexport default defineComponent({\n name: 'ElTreeNode',\n components: {\n ElCollapseTransition,\n ElCheckbox,\n NodeContent,\n ElIcon,\n Loading,\n },\n props: {\n node: {\n type: Node,\n default: () => ({}),\n },\n props: {\n type: Object as PropType<TreeOptionProps>,\n default: () => ({}),\n },\n accordion: Boolean,\n renderContent: Function,\n renderAfterExpand: Boolean,\n showCheckbox: {\n type: Boolean,\n default: false,\n },\n },\n emits: ['node-expand'],\n setup(props, ctx) {\n const { broadcastExpanded } = useNodeExpandEventBroadcast(props)\n const tree = inject<RootTreeType>('RootTree')\n const expanded = ref(false)\n const childNodeRendered = ref(false)\n const oldChecked = ref<boolean>(null)\n const oldIndeterminate = ref<boolean>(null)\n const node$ = ref<Nullable<HTMLElement>>(null)\n const dragEvents = inject(dragEventsKey)\n const instance = getCurrentInstance()\n\n provide('NodeInstance', instance)\n if (!tree) {\n debugWarn('Tree', \"Can not find node's tree.\")\n }\n\n if (props.node.expanded) {\n expanded.value = true\n childNodeRendered.value = true\n }\n\n const childrenKey = tree.props['children'] \|\| 'children'\n watch(\n () => {\n const children = props.node.data[childrenKey]\n return children && [...children]\n },\n () => {\n props.node.updateChildren()\n }\n )\n\n watch(\n () => props.node.indeterminate,\n (val) => {\n handleSelectChange(props.node.checked, val)\n }\n )\n\n watch(\n () => props.node.checked,\n (val) => {\n handleSelectChange(val, props.node.indeterminate)\n }\n )\n\n watch(\n () => props.node.expanded,\n (val) => {\n nextTick(() => (expanded.value = val))\n if (val) {\n childNodeRendered.value = true\n }\n }\n )\n\n const getNodeKey = (node: Node): any => {\n return getNodeKeyUtil(tree.props.nodeKey, node.data)\n }\n\n const getNodeClass = (node: Node) => {\n const nodeClassFunc = props.props.class\n if (!nodeClassFunc) {\n return {}\n }\n let className\n if (isFunction(nodeClassFunc)) {\n const { data } = node\n className = nodeClassFunc(data, node)\n } else {\n className = nodeClassFunc\n }\n\n if (isString(className)) {\n return { [className]: true }\n } else {\n return className\n }\n }\n\n const handleSelectChange = (checked: boolean, indeterminate: boolean) => {\n if (\n oldChecked.value !== checked \|\|\n oldIndeterminate.value !== indeterminate\n ) {\n tree.ctx.emit('check-change', props.node.data, checked, indeterminate)\n }\n oldChecked.value = checked\n oldIndeterminate.value = indeterminate\n }\n\n const handleClick = () => {\n const store = tree.store.value\n store.setCurrentNode(props.node)\n tree.ctx.emit(\n 'current-change',\n store.currentNode ? store.currentNode.data : null,\n store.currentNode\n )\n tree.currentNode.value = props.node\n\n if (tree.props.expandOnClickNode) {\n handleExpandIconClick()\n }\n\n if (tree.props.checkOnClickNode && !props.node.disabled) {\n handleCheckChange(null, {\n target: { checked: !props.node.checked },\n })\n }\n tree.ctx.emit('node-click', props.node.data, props.node, instance)\n }\n\n const handleContextMenu = (event: Event) => {\n if (tree.instance.vnode.props['onNodeContextmenu']) {\n event.stopPropagation()\n event.preventDefault()\n }\n tree.ctx.emit(\n 'node-contextmenu',\n event,\n props.node.data,\n props.node,\n instance\n )\n }\n\n const handleExpandIconClick = () => {\n if (props.node.isLeaf) return\n if (expanded.value) {\n tree.ctx.emit('node-collapse', props.node.data, props.node, instance)\n props.node.collapse()\n } else {\n props.node.expand()\n ctx.emit('node-expand', props.node.data, props.node, instance)\n }\n }\n\n const handleCheckChange = (value, ev) => {\n props.node.setChecked(ev.target.checked, !tree.props.checkStrictly)\n nextTick(() => {\n const store = tree.store.value\n tree.ctx.emit('check', props.node.data, {\n checkedNodes: store.getCheckedNodes(),\n checkedKeys: store.getCheckedKeys(),\n halfCheckedNodes: store.getHalfCheckedNodes(),\n halfCheckedKeys: store.getHalfCheckedKeys(),\n })\n })\n }\n\n const handleChildNodeExpand = (\n nodeData: TreeNodeData,\n node: Node,\n instance: ComponentInternalInstance\n ) => {\n broadcastExpanded(node)\n tree.ctx.emit('node-expand', nodeData, node, instance)\n }\n\n const handleDragStart = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragStart({ event, treeNode: props })\n }\n\n const handleDragOver = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragOver({\n event,\n treeNode: { $el: node$.value, node: props.node },\n })\n event.preventDefault()\n }\n\n const handleDrop = (event: DragEvent) => {\n event.preventDefault()\n }\n\n const handleDragEnd = (event: DragEvent) => {\n if (!tree.props.draggable) return\n dragEvents.treeNodeDragEnd(event)\n }\n\n return {\n node$,\n tree,\n expanded,\n childNodeRendered,\n oldChecked,\n oldIndeterminate,\n getNodeKey,\n getNodeClass,\n handleSelectChange,\n handleClick,\n handleContextMenu,\n handleExpandIconClick,\n handleCheckChange,\n handleChildNodeExpand,\n handleDragStart,\n handleDragOver,\n handleDrop,\n handleDragEnd,\n CaretRight,\n }\n },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_createBlock","_createVNode"],"mappings":";;;;;;;;;;;sCACEA;IAEE,KAAI;AAAA,IACJ,uBAAM;;;;;;;;IASN,MAAK;AAAA,IACL,UAAS;AAAA,IACR,iBAAe;IACf,iBAAe,UAAK;AAAA,IACpB,gBAAc,UAAK;AAAA,IACnB,WAAW,UAAK,MAAM;AAAA,IACtB,YAAU,gBAAW;IACrB,8DAAY;IACZ,sDAAa;IACb,kEAAgB;IAChB,iEAAe;IACf,gEAAc;IACd,6DAAW;;IAEZC;MACE,OAAM;AAAA,MACL,qCAAuB,WAAK,aAAa,UAAK,MAAM;;MAG7C,UAAK,MAAM,QAAQ,gCAD3BC;;QAEG;;;;;;;QAOA,uBAAY;;yBAEb;wBAAAA,oCAAgB,UAAK,MAAM,QAAQ;;;;MAG7B,kCADRA;;QAEG,eAAa,UAAK;AAAA,QAClB,eAAe,UAAK;AAAA,QACpB,YAAY,UAAK;AAAA,QACjB,iDAAD;;QACC,UAAQ;;MAGH,UAAK,wBADbA;;QAEE,OAAM;AAAA;yBAEN;UAAAC;;;;MAEFA;QAAe,MAAM;QAAO,kBAAgB;;;IAE9CA;uBACE;SACS,0BAAqB,sDAD9BH;;UAGE,OAAM;AAAA,UACN,MAAK;AAAA,UACJ,iBAAe;;4BAEhBA,8CACkB,UAAK,aAAd;gCADTE;cAEG,KAAK,gBAAW;AAAA,cAChB,kBAAgB;cAChB,uBAAqB;cACrB,iBAAe;cACf,MAAM;AAAA,cACN,OAAO;cACP,cAAa;;;;kBAbR;;;;;;YA7DJ,UAAK;AAAA;AAAA;;;;"}

package/es/components/tree/src/tree.vue.d.ts CHANGED Viewed

@@ -419,9 +419,9 @@ declare const _default: import("vue").DefineComponent<{
     draggable: boolean;
     highlightCurrent: boolean;
 } & {
-    emptyText?: string | undefined;
     icon?: string | Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions> | undefined;
     load?: import("./tree.type").LoadFunction | undefined;
+    emptyText?: string | undefined;
     renderContent?: Function | undefined;
     defaultCheckedKeys?: TreeKey[] | undefined;
     defaultExpandedKeys?: TreeKey[] | undefined;

package/es/components/tree-v2/index.d.ts CHANGED Viewed

@@ -77,8 +77,8 @@ export declare const ElTreeV2: import("../../utils/types").SFCWithInstall<import
     highlightCurrent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     perfMode: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
 } & {
-    emptyText?: string | undefined;
     icon?: string | undefined;
+    emptyText?: string | undefined;
     filterMethod?: import("./src/types").FilterMethod | undefined;
     currentNodeKey?: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<import("./src/types").TreeKey>, unknown, unknown> | undefined;
 }> & {
@@ -90,11 +90,11 @@ export declare const ElTreeV2: import("../../utils/types").SFCWithInstall<import
     "onNode-contextmenu"?: ((event: Event, data: import("../tree/src/tree.type").TreeNodeData, node: import("./src/types").TreeNode) => any) | undefined;
     "onNode-collapse"?: ((data: import("../tree/src/tree.type").TreeNodeData, node: import("./src/types").TreeNode) => any) | undefined;
 }, {
-    emptyText: string;
     icon: string;
     props: import("./src/types").TreeOptionProps;
     data: import("./src/types").TreeData;
     height: number;
+    emptyText: string;
     checkStrictly: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     filterMethod: import("./src/types").FilterMethod;
     accordion: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;

package/es/components/tree-v2/src/composables/useTree.d.ts ADDED Viewed

@@ -0,0 +1,29 @@
+import type { TreeProps, TreeNodeData, TreeKey, TreeNode, TreeData, Tree } from '../types';
+export declare function useTree(props: TreeProps, emit: any): {
+    tree: import("@vue/reactivity").ShallowRef<Tree | undefined>;
+    flattenTree: import("vue").ComputedRef<TreeNode[]>;
+    isNotEmpty: import("vue").ComputedRef<boolean>;
+    getKey: (node: TreeNodeData) => TreeKey;
+    getChildren: (node: TreeNodeData) => TreeNodeData[];
+    toggleExpand: (node: TreeNode) => void;
+    toggleCheckbox: (node: TreeNode, isChecked: boolean, nodeClick?: boolean) => void;
+    isExpanded: (node: TreeNode) => boolean;
+    isChecked: (node: TreeNode) => boolean;
+    isIndeterminate: (node: TreeNode) => boolean;
+    isDisabled: (node: TreeNode) => boolean;
+    isCurrent: (node: TreeNode) => boolean;
+    isForceHiddenExpandIcon: (node: TreeNode) => boolean;
+    handleNodeClick: (node: TreeNode) => void;
+    handleNodeCheck: (node: TreeNode, checked: boolean) => void;
+    getCurrentNode: () => TreeNodeData | undefined;
+    getCurrentKey: () => TreeKey | undefined;
+    setCurrentKey: (key: TreeKey) => void;
+    getCheckedKeys: (leafOnly?: boolean) => TreeKey[];
+    getCheckedNodes: (leafOnly?: boolean) => TreeNodeData[];
+    getHalfCheckedKeys: () => TreeKey[];
+    getHalfCheckedNodes: () => TreeNodeData[];
+    setChecked: (key: TreeKey, isChecked: boolean) => void;
+    setCheckedKeys: (keys: TreeKey[]) => void;
+    filter: (query: string) => void;
+    setData: (data: TreeData) => void;
+};

package/es/components/tree-v2/src/tree-node.vue.d.ts CHANGED Viewed

@@ -34,11 +34,11 @@ declare const _default: import("vue").DefineComponent<{
 } & {
     disabled: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     expanded: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    current: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     indeterminate: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     checked: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     node: import("./types").TreeNode;
     showCheckbox: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
-    current: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     hiddenExpandIcon: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
 } & {}> & {
     onClick?: ((node: import("./types").TreeNode) => any) | undefined;
@@ -47,11 +47,11 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     disabled: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     expanded: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    current: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     indeterminate: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     checked: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     node: import("./types").TreeNode;
     showCheckbox: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
-    current: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     hiddenExpandIcon: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
 }>;
 export default _default;

package/es/components/tree-v2/src/tree-node.vue_vue_type_script_lang.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import { defineComponent, inject, computed } from 'vue';
-import { CaretRight } from '@element-plus/icons';
+import { CaretRight } from '@element-plus/icons-vue';
 import { ElIcon } from '../../icon/index.mjs';
 import { ElCheckbox } from '../../checkbox/index.mjs';
 import ElNodeContent from './tree-node-content.mjs';

package/es/components/tree-v2/src/tree-node.vue_vue_type_script_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tree-node.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/tree-v2/src/tree-node.vue"],"sourcesContent":["<template>\n <div\n ref=\"node$\"\n class=\"el-tree-node\"\n :class=\"{\n 'is-expanded': expanded,\n 'is-current': current,\n 'is-focusable': !disabled,\n 'is-checked': !disabled && checked,\n }\"\n role=\"treeitem\"\n tabindex=\"-1\"\n :aria-expanded=\"expanded\"\n :aria-disabled=\"disabled\"\n :aria-checked=\"checked\"\n :data-key=\"node?.key\"\n @click.stop=\"handleClick\"\n @contextmenu=\"handleContextMenu\"\n >\n <div\n class=\"el-tree-node__content\"\n :style=\"{ paddingLeft: `${(node.level - 1) * indent}px` }\"\n >\n <el-icon\n v-if=\"icon\"\n :class=\"[\n {\n 'is-leaf': node?.isLeaf,\n 'is-hidden': hiddenExpandIcon,\n expanded: !node?.isLeaf && expanded,\n },\n 'el-tree-node__expand-icon',\n ]\"\n @click.stop=\"handleExpandIconClick\"\n >\n <component :is=\"icon\" />\n </el-icon>\n <el-checkbox\n v-if=\"showCheckbox\"\n :model-value=\"checked\"\n :indeterminate=\"indeterminate\"\n :disabled=\"disabled\"\n @change=\"handleCheckChange\"\n @click.stop\n />\n <el-node-content :node=\"node\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject } from 'vue'\nimport { CaretRight } from '@element-plus/icons'\nimport ElIcon from '@element-plus/components/icon'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport ElNodeContent from './tree-node-content'\nimport {\n ROOT_TREE_INJECTION_KEY,\n NODE_CONTEXTMENU,\n treeNodeEmits,\n treeNodeProps,\n} from './virtual-tree'\n\nconst DEFAULT_ICON = 'caret-right'\n\nexport default defineComponent({\n name: 'ElTreeNode',\n components: {\n ElIcon,\n CaretRight,\n ElCheckbox,\n ElNodeContent,\n },\n props: treeNodeProps,\n emits: treeNodeEmits,\n setup(props, { emit }) {\n const tree = inject(ROOT_TREE_INJECTION_KEY)\n\n const indent = computed(() => {\n return tree?.props.indent ?? 16\n })\n\n const icon = computed(() => {\n return tree?.props.icon ?? DEFAULT_ICON\n })\n\n const handleClick = () => {\n emit('click', props.node)\n }\n const handleExpandIconClick = () => {\n emit('toggle', props.node)\n }\n const handleCheckChange = (value: boolean) => {\n emit('check', props.node, value)\n }\n const handleContextMenu = (event: Event) => {\n if (tree?.instance?.vnode?.props?.['onNodeContextmenu']) {\n event.stopPropagation()\n event.preventDefault()\n }\n tree?.ctx.emit(NODE_CONTEXTMENU, event, props.node?.data, props.node)\n }\n\n return {\n indent,\n icon,\n handleClick,\n handleExpandIconClick,\n handleCheckChange,\n handleContextMenu,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;AA+DA,MAAM,eAAe;AAErB,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAEF,OAAO;AAAA,EACP,OAAO;AAAA,EACP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,OAAO,OAAO;AAEpB,UAAM,SAAS,SAAS,MAAM;;AAC5B,aAAO,mCAAM,MAAM,WAAZ,YAAsB;AAAA;AAG/B,UAAM,OAAO,SAAS,MAAM;;AAC1B,aAAO,mCAAM,MAAM,SAAZ,YAAoB;AAAA;AAG7B,UAAM,cAAc,MAAM;AACxB,WAAK,SAAS,MAAM;AAAA;AAEtB,UAAM,wBAAwB,MAAM;AAClC,WAAK,UAAU,MAAM;AAAA;AAEvB,UAAM,oBAAoB,CAAC,UAAmB;AAC5C,WAAK,SAAS,MAAM,MAAM;AAAA;AAE5B,UAAM,oBAAoB,CAAC,UAAiB;;AAC1C,UAAI,+CAAM,aAAN,mBAAgB,UAAhB,mBAAuB,UAAvB,mBAA+B,sBAAsB;AACvD,cAAM;AACN,cAAM;AAAA;AAER,mCAAM,IAAI,KAAK,kBAAkB,OAAO,YAAM,SAAN,mBAAY,MAAM,MAAM;AAAA;AAGlE,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}
1	+ {"version":3,"file":"tree-node.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/tree-v2/src/tree-node.vue"],"sourcesContent":["<template>\n <div\n ref=\"node$\"\n class=\"el-tree-node\"\n :class=\"{\n 'is-expanded': expanded,\n 'is-current': current,\n 'is-focusable': !disabled,\n 'is-checked': !disabled && checked,\n }\"\n role=\"treeitem\"\n tabindex=\"-1\"\n :aria-expanded=\"expanded\"\n :aria-disabled=\"disabled\"\n :aria-checked=\"checked\"\n :data-key=\"node?.key\"\n @click.stop=\"handleClick\"\n @contextmenu=\"handleContextMenu\"\n >\n <div\n class=\"el-tree-node__content\"\n :style=\"{ paddingLeft: `${(node.level - 1) * indent}px` }\"\n >\n <el-icon\n v-if=\"icon\"\n :class=\"[\n {\n 'is-leaf': node?.isLeaf,\n 'is-hidden': hiddenExpandIcon,\n expanded: !node?.isLeaf && expanded,\n },\n 'el-tree-node__expand-icon',\n ]\"\n @click.stop=\"handleExpandIconClick\"\n >\n <component :is=\"icon\" />\n </el-icon>\n <el-checkbox\n v-if=\"showCheckbox\"\n :model-value=\"checked\"\n :indeterminate=\"indeterminate\"\n :disabled=\"disabled\"\n @change=\"handleCheckChange\"\n @click.stop\n />\n <el-node-content :node=\"node\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject } from 'vue'\nimport { CaretRight } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport ElNodeContent from './tree-node-content'\nimport {\n ROOT_TREE_INJECTION_KEY,\n NODE_CONTEXTMENU,\n treeNodeEmits,\n treeNodeProps,\n} from './virtual-tree'\n\nconst DEFAULT_ICON = 'caret-right'\n\nexport default defineComponent({\n name: 'ElTreeNode',\n components: {\n ElIcon,\n CaretRight,\n ElCheckbox,\n ElNodeContent,\n },\n props: treeNodeProps,\n emits: treeNodeEmits,\n setup(props, { emit }) {\n const tree = inject(ROOT_TREE_INJECTION_KEY)\n\n const indent = computed(() => {\n return tree?.props.indent ?? 16\n })\n\n const icon = computed(() => {\n return tree?.props.icon ?? DEFAULT_ICON\n })\n\n const handleClick = () => {\n emit('click', props.node)\n }\n const handleExpandIconClick = () => {\n emit('toggle', props.node)\n }\n const handleCheckChange = (value: boolean) => {\n emit('check', props.node, value)\n }\n const handleContextMenu = (event: Event) => {\n if (tree?.instance?.vnode?.props?.['onNodeContextmenu']) {\n event.stopPropagation()\n event.preventDefault()\n }\n tree?.ctx.emit(NODE_CONTEXTMENU, event, props.node?.data, props.node)\n }\n\n return {\n indent,\n icon,\n handleClick,\n handleExpandIconClick,\n handleCheckChange,\n handleContextMenu,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;AA+DA,MAAM,eAAe;AAErB,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAEF,OAAO;AAAA,EACP,OAAO;AAAA,EACP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,OAAO,OAAO;AAEpB,UAAM,SAAS,SAAS,MAAM;;AAC5B,aAAO,mCAAM,MAAM,WAAZ,YAAsB;AAAA;AAG/B,UAAM,OAAO,SAAS,MAAM;;AAC1B,aAAO,mCAAM,MAAM,SAAZ,YAAoB;AAAA;AAG7B,UAAM,cAAc,MAAM;AACxB,WAAK,SAAS,MAAM;AAAA;AAEtB,UAAM,wBAAwB,MAAM;AAClC,WAAK,UAAU,MAAM;AAAA;AAEvB,UAAM,oBAAoB,CAAC,UAAmB;AAC5C,WAAK,SAAS,MAAM,MAAM;AAAA;AAE5B,UAAM,oBAAoB,CAAC,UAAiB;;AAC1C,UAAI,+CAAM,aAAN,mBAAgB,UAAhB,mBAAuB,UAAvB,mBAA+B,sBAAsB;AACvD,cAAM;AACN,cAAM;AAAA;AAER,mCAAM,IAAI,KAAK,kBAAkB,OAAO,YAAM,SAAN,mBAAY,MAAM,MAAM;AAAA;AAGlE,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/tree-v2/src/tree-node.vue_vue_type_template_id_71d8f826_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tree-node.vue_vue_type_template_id_71d8f826_lang.mjs","sources":["../../../../../../packages/components/tree-v2/src/tree-node.vue?vue&type=template&id=71d8f826&lang.js"],"sourcesContent":["<template>\n <div\n ref=\"node$\"\n class=\"el-tree-node\"\n :class=\"{\n 'is-expanded': expanded,\n 'is-current': current,\n 'is-focusable': !disabled,\n 'is-checked': !disabled && checked,\n }\"\n role=\"treeitem\"\n tabindex=\"-1\"\n :aria-expanded=\"expanded\"\n :aria-disabled=\"disabled\"\n :aria-checked=\"checked\"\n :data-key=\"node?.key\"\n @click.stop=\"handleClick\"\n @contextmenu=\"handleContextMenu\"\n >\n <div\n class=\"el-tree-node__content\"\n :style=\"{ paddingLeft: `${(node.level - 1) * indent}px` }\"\n >\n <el-icon\n v-if=\"icon\"\n :class=\"[\n {\n 'is-leaf': node?.isLeaf,\n 'is-hidden': hiddenExpandIcon,\n expanded: !node?.isLeaf && expanded,\n },\n 'el-tree-node__expand-icon',\n ]\"\n @click.stop=\"handleExpandIconClick\"\n >\n <component :is=\"icon\" />\n </el-icon>\n <el-checkbox\n v-if=\"showCheckbox\"\n :model-value=\"checked\"\n :indeterminate=\"indeterminate\"\n :disabled=\"disabled\"\n @change=\"handleCheckChange\"\n @click.stop\n />\n <el-node-content :node=\"node\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject } from 'vue'\nimport { CaretRight } from '@element-plus/icons'\nimport ElIcon from '@element-plus/components/icon'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport ElNodeContent from './tree-node-content'\nimport {\n ROOT_TREE_INJECTION_KEY,\n NODE_CONTEXTMENU,\n treeNodeEmits,\n treeNodeProps,\n} from './virtual-tree'\n\nconst DEFAULT_ICON = 'caret-right'\n\nexport default defineComponent({\n name: 'ElTreeNode',\n components: {\n ElIcon,\n CaretRight,\n ElCheckbox,\n ElNodeContent,\n },\n props: treeNodeProps,\n emits: treeNodeEmits,\n setup(props, { emit }) {\n const tree = inject(ROOT_TREE_INJECTION_KEY)\n\n const indent = computed(() => {\n return tree?.props.indent ?? 16\n })\n\n const icon = computed(() => {\n return tree?.props.icon ?? DEFAULT_ICON\n })\n\n const handleClick = () => {\n emit('click', props.node)\n }\n const handleExpandIconClick = () => {\n emit('toggle', props.node)\n }\n const handleCheckChange = (value: boolean) => {\n emit('check', props.node, value)\n }\n const handleContextMenu = (event: Event) => {\n if (tree?.instance?.vnode?.props?.['onNodeContextmenu']) {\n event.stopPropagation()\n event.preventDefault()\n }\n tree?.ctx.emit(NODE_CONTEXTMENU, event, props.node?.data, props.node)\n }\n\n return {\n indent,\n icon,\n handleClick,\n handleExpandIconClick,\n handleCheckChange,\n handleContextMenu,\n }\n },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_createBlock","_createVNode"],"mappings":";;;;;;;;sBACEA;IACE,KAAI;AAAA,IACJ,uBAAM;;;;;;IAON,MAAK;AAAA,IACL,UAAS;AAAA,IACR,iBAAe;IACf,iBAAe;IACf,gBAAc;IACd,YAAU,oBAAA,mBAAM;AAAA,IAChB,8DAAY;IACZ,sDAAa;;IAEdC;MACE,OAAM;AAAA,MACL,wCAA0B,WAAK,aAAa;;MAGrC,0BADRC;;QAEG;;;;;;;;QAQA,uBAAY;;yBAEb;wBAAAA,oCAAgB;;;;MAGV,kCADRA;;QAEG,eAAa;QACb,eAAe;QACf,UAAU;QACV,UAAQ;QACR,iDAAD;;;MAEFC,0CAAkB,MAAM;;;;;;;"}
1	+ {"version":3,"file":"tree-node.vue_vue_type_template_id_71d8f826_lang.mjs","sources":["../../../../../../packages/components/tree-v2/src/tree-node.vue?vue&type=template&id=71d8f826&lang.js"],"sourcesContent":["<template>\n <div\n ref=\"node$\"\n class=\"el-tree-node\"\n :class=\"{\n 'is-expanded': expanded,\n 'is-current': current,\n 'is-focusable': !disabled,\n 'is-checked': !disabled && checked,\n }\"\n role=\"treeitem\"\n tabindex=\"-1\"\n :aria-expanded=\"expanded\"\n :aria-disabled=\"disabled\"\n :aria-checked=\"checked\"\n :data-key=\"node?.key\"\n @click.stop=\"handleClick\"\n @contextmenu=\"handleContextMenu\"\n >\n <div\n class=\"el-tree-node__content\"\n :style=\"{ paddingLeft: `${(node.level - 1) * indent}px` }\"\n >\n <el-icon\n v-if=\"icon\"\n :class=\"[\n {\n 'is-leaf': node?.isLeaf,\n 'is-hidden': hiddenExpandIcon,\n expanded: !node?.isLeaf && expanded,\n },\n 'el-tree-node__expand-icon',\n ]\"\n @click.stop=\"handleExpandIconClick\"\n >\n <component :is=\"icon\" />\n </el-icon>\n <el-checkbox\n v-if=\"showCheckbox\"\n :model-value=\"checked\"\n :indeterminate=\"indeterminate\"\n :disabled=\"disabled\"\n @change=\"handleCheckChange\"\n @click.stop\n />\n <el-node-content :node=\"node\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject } from 'vue'\nimport { CaretRight } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport ElNodeContent from './tree-node-content'\nimport {\n ROOT_TREE_INJECTION_KEY,\n NODE_CONTEXTMENU,\n treeNodeEmits,\n treeNodeProps,\n} from './virtual-tree'\n\nconst DEFAULT_ICON = 'caret-right'\n\nexport default defineComponent({\n name: 'ElTreeNode',\n components: {\n ElIcon,\n CaretRight,\n ElCheckbox,\n ElNodeContent,\n },\n props: treeNodeProps,\n emits: treeNodeEmits,\n setup(props, { emit }) {\n const tree = inject(ROOT_TREE_INJECTION_KEY)\n\n const indent = computed(() => {\n return tree?.props.indent ?? 16\n })\n\n const icon = computed(() => {\n return tree?.props.icon ?? DEFAULT_ICON\n })\n\n const handleClick = () => {\n emit('click', props.node)\n }\n const handleExpandIconClick = () => {\n emit('toggle', props.node)\n }\n const handleCheckChange = (value: boolean) => {\n emit('check', props.node, value)\n }\n const handleContextMenu = (event: Event) => {\n if (tree?.instance?.vnode?.props?.['onNodeContextmenu']) {\n event.stopPropagation()\n event.preventDefault()\n }\n tree?.ctx.emit(NODE_CONTEXTMENU, event, props.node?.data, props.node)\n }\n\n return {\n indent,\n icon,\n handleClick,\n handleExpandIconClick,\n handleCheckChange,\n handleContextMenu,\n }\n },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_createBlock","_createVNode"],"mappings":";;;;;;;;sBACEA;IACE,KAAI;AAAA,IACJ,uBAAM;;;;;;IAON,MAAK;AAAA,IACL,UAAS;AAAA,IACR,iBAAe;IACf,iBAAe;IACf,gBAAc;IACd,YAAU,oBAAA,mBAAM;AAAA,IAChB,8DAAY;IACZ,sDAAa;;IAEdC;MACE,OAAM;AAAA,MACL,wCAA0B,WAAK,aAAa;;MAGrC,0BADRC;;QAEG;;;;;;;;QAQA,uBAAY;;yBAEb;wBAAAA,oCAAgB;;;;MAGV,kCADRA;;QAEG,eAAa;QACb,eAAe;QACf,UAAU;QACV,UAAQ;QACR,iDAAD;;;MAEFC,0CAAkB,MAAM;;;;;;;"}

package/es/components/tree-v2/src/tree.vue.d.ts CHANGED Viewed

@@ -77,8 +77,8 @@ declare const _default: import("vue").DefineComponent<{
     highlightCurrent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     perfMode: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
 } & {
-    emptyText?: string | undefined;
     icon?: string | undefined;
+    emptyText?: string | undefined;
     filterMethod?: import("./types").FilterMethod | undefined;
     currentNodeKey?: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<import("./types").TreeKey>, unknown, unknown> | undefined;
 }> & {
@@ -90,11 +90,11 @@ declare const _default: import("vue").DefineComponent<{
     "onNode-contextmenu"?: ((event: Event, data: import("../../tree/src/tree.type").TreeNodeData, node: import("./types").TreeNode) => any) | undefined;
     "onNode-collapse"?: ((data: import("../../tree/src/tree.type").TreeNodeData, node: import("./types").TreeNode) => any) | undefined;
 }, {
-    emptyText: string;
     icon: string;
     props: import("./types").TreeOptionProps;
     data: import("./types").TreeData;
     height: number;
+    emptyText: string;
     checkStrictly: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     filterMethod: import("./types").FilterMethod;
     accordion: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;

package/es/components/upload/src/upload-list.vue_vue_type_script_lang.mjs CHANGED Viewed

@@ -1,15 +1,15 @@
 import { defineComponent, ref } from 'vue';
 import { NOOP } from '@vue/shared';
 import { ElIcon } from '../../icon/index.mjs';
-import { Document, Delete, Close, ZoomIn, Check, CircleCheck } from '@element-plus/icons';
+import { Document, Delete, Close, ZoomIn, Check, CircleCheck } from '@element-plus/icons-vue';
 import '../../../hooks/index.mjs';
-import _Progress from '../../progress/index.mjs';
+import { ElProgress } from '../../progress/index.mjs';
 import { useLocale } from '../../../hooks/use-locale/index.mjs';
 var script = defineComponent({
   name: "ElUploadList",
   components: {
-    ElProgress: _Progress,
+    ElProgress,
     ElIcon,
     Document,
     Delete,

package/es/components/upload/src/upload-list.vue_vue_type_script_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"upload-list.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/upload/src/upload-list.vue"],"sourcesContent":["<template>\n <transition-group\n tag=\"ul\"\n :class=\"[\n 'el-upload-list',\n 'el-upload-list--' + listType,\n { 'is-disabled': disabled },\n ]\"\n name=\"el-list\"\n >\n <li\n v-for=\"file in files\"\n :key=\"file.uid \|\| file\"\n :class=\"[\n 'el-upload-list__item',\n 'is-' + file.status,\n focusing ? 'focusing' : '',\n ]\"\n tabindex=\"0\"\n @keydown.delete=\"!disabled && handleRemove($event, file)\"\n @focus=\"focusing = true\"\n @blur=\"focusing = false\"\n @click=\"onFileClicked\"\n >\n <slot :file=\"file\">\n <img\n v-if=\"\n file.status !== 'uploading' &&\n ['picture-card', 'picture'].includes(listType)\n \"\n class=\"el-upload-list__item-thumbnail\"\n :src=\"file.url\"\n alt=\"\"\n />\n <a class=\"el-upload-list__item-name\" @click=\"handleClick(file)\">\n <el-icon class=\"el-icon--document\"><document /></el-icon>\n {{ file.name }}\n </a>\n <label class=\"el-upload-list__item-status-label\">\n <el-icon\n v-if=\"listType === 'text'\"\n class=\"el-icon--upload-success el-icon--circle-check\"\n >\n <circle-check />\n </el-icon>\n <el-icon\n v-else-if=\"['picture-card', 'picture'].includes(listType)\"\n class=\"el-icon--upload-success el-icon--check\"\n >\n <check />\n </el-icon>\n </label>\n <el-icon\n v-if=\"!disabled\"\n class=\"el-icon--close\"\n @click=\"handleRemove($event, file)\"\n >\n <close />\n </el-icon>\n <!-- Due to close btn only appears when li gets focused disappears after li gets blurred, thus keyboard navigation can never reach close btn-->\n <!-- This is a bug which needs to be fixed -->\n <!-- TODO: Fix the incorrect navigation interaction -->\n <i v-if=\"!disabled\" class=\"el-icon--close-tip\">{{\n t('el.upload.deleteTip')\n }}</i>\n <el-progress\n v-if=\"file.status === 'uploading'\"\n :type=\"listType === 'picture-card' ? 'circle' : 'line'\"\n :stroke-width=\"listType === 'picture-card' ? 6 : 2\"\n :percentage=\"+file.percentage\"\n />\n <span\n v-if=\"listType === 'picture-card'\"\n class=\"el-upload-list__item-actions\"\n >\n <span\n class=\"el-upload-list__item-preview\"\n @click=\"handlePreview(file)\"\n >\n <el-icon class=\"el-icon--zoom-in\"><zoom-in /></el-icon>\n </span>\n <span\n v-if=\"!disabled\"\n class=\"el-upload-list__item-delete\"\n @click=\"handleRemove($event, file)\"\n >\n <el-icon class=\"el-icon--delete\"><delete /></el-icon>\n </span>\n </span>\n </slot>\n </li>\n </transition-group>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n Document,\n Delete,\n Close,\n ZoomIn,\n Check,\n CircleCheck,\n} from '@element-plus/icons'\nimport { useLocale } from '@element-plus/hooks'\nimport ElProgress from '@element-plus/components/progress'\n\nimport type { PropType } from 'vue'\nimport type { UploadFile } from './upload.type'\n\nexport default defineComponent({\n name: 'ElUploadList',\n components: {\n ElProgress,\n ElIcon,\n Document,\n Delete,\n Close,\n ZoomIn,\n Check,\n CircleCheck,\n },\n props: {\n files: {\n type: Array as PropType<UploadFile[]>,\n default: () => [] as File[],\n },\n disabled: {\n type: Boolean,\n default: false,\n },\n handlePreview: {\n type: Function as PropType<(file: UploadFile) => void>,\n default: () => NOOP,\n },\n listType: {\n type: String as PropType<'picture' \| 'picture-card' \| 'text'>,\n default: 'text',\n },\n },\n emits: ['remove'],\n setup(props, { emit }) {\n const { t } = useLocale()\n\n const handleClick = (file: UploadFile) => {\n props.handlePreview(file)\n }\n\n const onFileClicked = (e: Event) => {\n ;(e.target as HTMLElement).focus()\n }\n\n const handleRemove = (e: Event, file: UploadFile) => {\n emit('remove', file)\n }\n return {\n focusing: ref(false),\n handleClick,\n handleRemove,\n onFileClicked,\n t,\n }\n },\n})\n</script>\n"],"names":[~~"ElProgress"~~],"mappings":";;;;;;;;AA+GA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,~~gBACVA~~;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAEF,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS,MAAM;AAAA;AAAA,IAEjB,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;AAAA,IAEX,eAAe;AAAA,MACb,MAAM;AAAA,MACN,SAAS,MAAM;AAAA;AAAA,IAEjB,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAGb,OAAO,CAAC;AAAA,EACR,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,EAAE,MAAM;AAEd,UAAM,cAAc,CAAC,SAAqB;AACxC,YAAM,cAAc;AAAA;AAGtB,UAAM,gBAAgB,CAAC,MAAa;AAClC;AAAC,MAAC,EAAE,OAAuB;AAAA;AAG7B,UAAM,eAAe,CAAC,GAAU,SAAqB;AACnD,WAAK,UAAU;AAAA;AAEjB,WAAO;AAAA,MACL,UAAU,IAAI;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}
1	+ {"version":3,"file":"upload-list.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/upload/src/upload-list.vue"],"sourcesContent":["<template>\n <transition-group\n tag=\"ul\"\n :class=\"[\n 'el-upload-list',\n 'el-upload-list--' + listType,\n { 'is-disabled': disabled },\n ]\"\n name=\"el-list\"\n >\n <li\n v-for=\"file in files\"\n :key=\"file.uid \|\| file\"\n :class=\"[\n 'el-upload-list__item',\n 'is-' + file.status,\n focusing ? 'focusing' : '',\n ]\"\n tabindex=\"0\"\n @keydown.delete=\"!disabled && handleRemove($event, file)\"\n @focus=\"focusing = true\"\n @blur=\"focusing = false\"\n @click=\"onFileClicked\"\n >\n <slot :file=\"file\">\n <img\n v-if=\"\n file.status !== 'uploading' &&\n ['picture-card', 'picture'].includes(listType)\n \"\n class=\"el-upload-list__item-thumbnail\"\n :src=\"file.url\"\n alt=\"\"\n />\n <a class=\"el-upload-list__item-name\" @click=\"handleClick(file)\">\n <el-icon class=\"el-icon--document\"><document /></el-icon>\n {{ file.name }}\n </a>\n <label class=\"el-upload-list__item-status-label\">\n <el-icon\n v-if=\"listType === 'text'\"\n class=\"el-icon--upload-success el-icon--circle-check\"\n >\n <circle-check />\n </el-icon>\n <el-icon\n v-else-if=\"['picture-card', 'picture'].includes(listType)\"\n class=\"el-icon--upload-success el-icon--check\"\n >\n <check />\n </el-icon>\n </label>\n <el-icon\n v-if=\"!disabled\"\n class=\"el-icon--close\"\n @click=\"handleRemove($event, file)\"\n >\n <close />\n </el-icon>\n <!-- Due to close btn only appears when li gets focused disappears after li gets blurred, thus keyboard navigation can never reach close btn-->\n <!-- This is a bug which needs to be fixed -->\n <!-- TODO: Fix the incorrect navigation interaction -->\n <i v-if=\"!disabled\" class=\"el-icon--close-tip\">{{\n t('el.upload.deleteTip')\n }}</i>\n <el-progress\n v-if=\"file.status === 'uploading'\"\n :type=\"listType === 'picture-card' ? 'circle' : 'line'\"\n :stroke-width=\"listType === 'picture-card' ? 6 : 2\"\n :percentage=\"+file.percentage\"\n />\n <span\n v-if=\"listType === 'picture-card'\"\n class=\"el-upload-list__item-actions\"\n >\n <span\n class=\"el-upload-list__item-preview\"\n @click=\"handlePreview(file)\"\n >\n <el-icon class=\"el-icon--zoom-in\"><zoom-in /></el-icon>\n </span>\n <span\n v-if=\"!disabled\"\n class=\"el-upload-list__item-delete\"\n @click=\"handleRemove($event, file)\"\n >\n <el-icon class=\"el-icon--delete\"><delete /></el-icon>\n </span>\n </span>\n </slot>\n </li>\n </transition-group>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n Document,\n Delete,\n Close,\n ZoomIn,\n Check,\n CircleCheck,\n} from '@element-plus/icons-vue'\nimport { useLocale } from '@element-plus/hooks'\nimport ElProgress from '@element-plus/components/progress'\n\nimport type { PropType } from 'vue'\nimport type { UploadFile } from './upload.type'\n\nexport default defineComponent({\n name: 'ElUploadList',\n components: {\n ElProgress,\n ElIcon,\n Document,\n Delete,\n Close,\n ZoomIn,\n Check,\n CircleCheck,\n },\n props: {\n files: {\n type: Array as PropType<UploadFile[]>,\n default: () => [] as File[],\n },\n disabled: {\n type: Boolean,\n default: false,\n },\n handlePreview: {\n type: Function as PropType<(file: UploadFile) => void>,\n default: () => NOOP,\n },\n listType: {\n type: String as PropType<'picture' \| 'picture-card' \| 'text'>,\n default: 'text',\n },\n },\n emits: ['remove'],\n setup(props, { emit }) {\n const { t } = useLocale()\n\n const handleClick = (file: UploadFile) => {\n props.handlePreview(file)\n }\n\n const onFileClicked = (e: Event) => {\n ;(e.target as HTMLElement).focus()\n }\n\n const handleRemove = (e: Event, file: UploadFile) => {\n emit('remove', file)\n }\n return {\n focusing: ref(false),\n handleClick,\n handleRemove,\n onFileClicked,\n t,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;AA+GA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAEF,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS,MAAM;AAAA;AAAA,IAEjB,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;AAAA,IAEX,eAAe;AAAA,MACb,MAAM;AAAA,MACN,SAAS,MAAM;AAAA;AAAA,IAEjB,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAGb,OAAO,CAAC;AAAA,EACR,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,EAAE,MAAM;AAEd,UAAM,cAAc,CAAC,SAAqB;AACxC,YAAM,cAAc;AAAA;AAGtB,UAAM,gBAAgB,CAAC,MAAa;AAClC;AAAC,MAAC,EAAE,OAAuB;AAAA;AAG7B,UAAM,eAAe,CAAC,GAAU,SAAqB;AACnD,WAAK,UAAU;AAAA;AAEjB,WAAO;AAAA,MACL,UAAU,IAAI;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/upload/src/upload-list.vue_vue_type_template_id_192277b6_lang.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"upload-list.vue_vue_type_template_id_192277b6_lang.mjs","sources":["../../../../../../packages/components/upload/src/upload-list.vue?vue&type=template&id=192277b6&lang.js"],"sourcesContent":["<template>\n <transition-group\n tag=\"ul\"\n :class=\"[\n 'el-upload-list',\n 'el-upload-list--' + listType,\n { 'is-disabled': disabled },\n ]\"\n name=\"el-list\"\n >\n <li\n v-for=\"file in files\"\n :key=\"file.uid \|\| file\"\n :class=\"[\n 'el-upload-list__item',\n 'is-' + file.status,\n focusing ? 'focusing' : '',\n ]\"\n tabindex=\"0\"\n @keydown.delete=\"!disabled && handleRemove($event, file)\"\n @focus=\"focusing = true\"\n @blur=\"focusing = false\"\n @click=\"onFileClicked\"\n >\n <slot :file=\"file\">\n <img\n v-if=\"\n file.status !== 'uploading' &&\n ['picture-card', 'picture'].includes(listType)\n \"\n class=\"el-upload-list__item-thumbnail\"\n :src=\"file.url\"\n alt=\"\"\n />\n <a class=\"el-upload-list__item-name\" @click=\"handleClick(file)\">\n <el-icon class=\"el-icon--document\"><document /></el-icon>\n {{ file.name }}\n </a>\n <label class=\"el-upload-list__item-status-label\">\n <el-icon\n v-if=\"listType === 'text'\"\n class=\"el-icon--upload-success el-icon--circle-check\"\n >\n <circle-check />\n </el-icon>\n <el-icon\n v-else-if=\"['picture-card', 'picture'].includes(listType)\"\n class=\"el-icon--upload-success el-icon--check\"\n >\n <check />\n </el-icon>\n </label>\n <el-icon\n v-if=\"!disabled\"\n class=\"el-icon--close\"\n @click=\"handleRemove($event, file)\"\n >\n <close />\n </el-icon>\n <!-- Due to close btn only appears when li gets focused disappears after li gets blurred, thus keyboard navigation can never reach close btn-->\n <!-- This is a bug which needs to be fixed -->\n <!-- TODO: Fix the incorrect navigation interaction -->\n <i v-if=\"!disabled\" class=\"el-icon--close-tip\">{{\n t('el.upload.deleteTip')\n }}</i>\n <el-progress\n v-if=\"file.status === 'uploading'\"\n :type=\"listType === 'picture-card' ? 'circle' : 'line'\"\n :stroke-width=\"listType === 'picture-card' ? 6 : 2\"\n :percentage=\"+file.percentage\"\n />\n <span\n v-if=\"listType === 'picture-card'\"\n class=\"el-upload-list__item-actions\"\n >\n <span\n class=\"el-upload-list__item-preview\"\n @click=\"handlePreview(file)\"\n >\n <el-icon class=\"el-icon--zoom-in\"><zoom-in /></el-icon>\n </span>\n <span\n v-if=\"!disabled\"\n class=\"el-upload-list__item-delete\"\n @click=\"handleRemove($event, file)\"\n >\n <el-icon class=\"el-icon--delete\"><delete /></el-icon>\n </span>\n </span>\n </slot>\n </li>\n </transition-group>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n Document,\n Delete,\n Close,\n ZoomIn,\n Check,\n CircleCheck,\n} from '@element-plus/icons'\nimport { useLocale } from '@element-plus/hooks'\nimport ElProgress from '@element-plus/components/progress'\n\nimport type { PropType } from 'vue'\nimport type { UploadFile } from './upload.type'\n\nexport default defineComponent({\n name: 'ElUploadList',\n components: {\n ElProgress,\n ElIcon,\n Document,\n Delete,\n Close,\n ZoomIn,\n Check,\n CircleCheck,\n },\n props: {\n files: {\n type: Array as PropType<UploadFile[]>,\n default: () => [] as File[],\n },\n disabled: {\n type: Boolean,\n default: false,\n },\n handlePreview: {\n type: Function as PropType<(file: UploadFile) => void>,\n default: () => NOOP,\n },\n listType: {\n type: String as PropType<'picture' \| 'picture-card' \| 'text'>,\n default: 'text',\n },\n },\n emits: ['remove'],\n setup(props, { emit }) {\n const { t } = useLocale()\n\n const handleClick = (file: UploadFile) => {\n props.handlePreview(file)\n }\n\n const onFileClicked = (e: Event) => {\n ;(e.target as HTMLElement).focus()\n }\n\n const handleRemove = (e: Event, file: UploadFile) => {\n emit('remove', file)\n }\n return {\n focusing: ref(false),\n handleClick,\n handleRemove,\n onFileClicked,\n t,\n }\n },\n})\n</script>\n"],"names":["_createBlock","_createElementBlock","_renderSlot","_createElementVNode","_createVNode","_createCommentVNode"],"mappings":";;;;;qBAsCe,OAAM;;;EAwBO,OAAM;AAAA;;;EAWxB,OAAM;AAAA;;;;;;;;;;;;sBAxEdA;IACE,KAAI;AAAA,IACH;;;;;IAKD,MAAK;AAAA;qBAGH;wBADFC,8CACiB,aAAR;4BADTA;UAEG,KAAK,KAAK,OAAO;AAAA,UACjB;;;;;UAKD,UAAS;AAAA,UACR,iCAAiB,iBAAY,kBAAa,QAAQ;UAClD,+CAAO;UACP,8CAAM;UACN,gDAAO;;UAERC,qCAAO,QAAP;+GACED;;cAKE,OAAM;AAAA,cACL,KAAK,KAAK;AAAA,cACX,KAAI;AAAA;YAENE;cAAG,OAAM;AAAA,cAA6B,qBAAO,iBAAY;AAAA;cACvDC,kCAAS,OAAM;iCAAoB;kBAAAA,YAAY;AAAA;AAAA;;oDAC5C,KAAK;;YAEVD,4BAAA;cAEU,yCADRH;;gBAEE,OAAM;AAAA;iCAEN;kBAAAI;;;gDAGuC,SAAS,+BADlDJ;;gBAEE,OAAM;AAAA;iCAEN;kBAAAI;;;;;aAIK,8BADTJ;;cAEE,OAAM;AAAA,cACL,qBAAO,kBAAa,QAAQ;AAAA;+BAE7B;gBAAAI;;;;YAEFC;YACAA;YACAA;aACU,8BAAVJ,wBAAA,4BACE;YAGM,KAAK,uCADbD;;cAEG,MAAM;cACN,gBAAc;cACd,aAAa,KAAK;AAAA;YAGb,iDADRC,2BAAA;cAIEE;gBACE,OAAM;AAAA,gBACL,qBAAO,mBAAc;AAAA;gBAEtBC,kCAAS,OAAM;mCAAmB;oBAAAA,YAAW;AAAA;AAAA;;;eAGtC,8BADTH;;gBAEE,OAAM;AAAA,gBACL,qBAAO,kBAAa,QAAQ;AAAA;gBAE7BG,kCAAS,OAAM;mCAAkB;oBAAAA,YAAU;AAAA;AAAA;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"upload-list.vue_vue_type_template_id_192277b6_lang.mjs","sources":["../../../../../../packages/components/upload/src/upload-list.vue?vue&type=template&id=192277b6&lang.js"],"sourcesContent":["<template>\n <transition-group\n tag=\"ul\"\n :class=\"[\n 'el-upload-list',\n 'el-upload-list--' + listType,\n { 'is-disabled': disabled },\n ]\"\n name=\"el-list\"\n >\n <li\n v-for=\"file in files\"\n :key=\"file.uid \|\| file\"\n :class=\"[\n 'el-upload-list__item',\n 'is-' + file.status,\n focusing ? 'focusing' : '',\n ]\"\n tabindex=\"0\"\n @keydown.delete=\"!disabled && handleRemove($event, file)\"\n @focus=\"focusing = true\"\n @blur=\"focusing = false\"\n @click=\"onFileClicked\"\n >\n <slot :file=\"file\">\n <img\n v-if=\"\n file.status !== 'uploading' &&\n ['picture-card', 'picture'].includes(listType)\n \"\n class=\"el-upload-list__item-thumbnail\"\n :src=\"file.url\"\n alt=\"\"\n />\n <a class=\"el-upload-list__item-name\" @click=\"handleClick(file)\">\n <el-icon class=\"el-icon--document\"><document /></el-icon>\n {{ file.name }}\n </a>\n <label class=\"el-upload-list__item-status-label\">\n <el-icon\n v-if=\"listType === 'text'\"\n class=\"el-icon--upload-success el-icon--circle-check\"\n >\n <circle-check />\n </el-icon>\n <el-icon\n v-else-if=\"['picture-card', 'picture'].includes(listType)\"\n class=\"el-icon--upload-success el-icon--check\"\n >\n <check />\n </el-icon>\n </label>\n <el-icon\n v-if=\"!disabled\"\n class=\"el-icon--close\"\n @click=\"handleRemove($event, file)\"\n >\n <close />\n </el-icon>\n <!-- Due to close btn only appears when li gets focused disappears after li gets blurred, thus keyboard navigation can never reach close btn-->\n <!-- This is a bug which needs to be fixed -->\n <!-- TODO: Fix the incorrect navigation interaction -->\n <i v-if=\"!disabled\" class=\"el-icon--close-tip\">{{\n t('el.upload.deleteTip')\n }}</i>\n <el-progress\n v-if=\"file.status === 'uploading'\"\n :type=\"listType === 'picture-card' ? 'circle' : 'line'\"\n :stroke-width=\"listType === 'picture-card' ? 6 : 2\"\n :percentage=\"+file.percentage\"\n />\n <span\n v-if=\"listType === 'picture-card'\"\n class=\"el-upload-list__item-actions\"\n >\n <span\n class=\"el-upload-list__item-preview\"\n @click=\"handlePreview(file)\"\n >\n <el-icon class=\"el-icon--zoom-in\"><zoom-in /></el-icon>\n </span>\n <span\n v-if=\"!disabled\"\n class=\"el-upload-list__item-delete\"\n @click=\"handleRemove($event, file)\"\n >\n <el-icon class=\"el-icon--delete\"><delete /></el-icon>\n </span>\n </span>\n </slot>\n </li>\n </transition-group>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n Document,\n Delete,\n Close,\n ZoomIn,\n Check,\n CircleCheck,\n} from '@element-plus/icons-vue'\nimport { useLocale } from '@element-plus/hooks'\nimport ElProgress from '@element-plus/components/progress'\n\nimport type { PropType } from 'vue'\nimport type { UploadFile } from './upload.type'\n\nexport default defineComponent({\n name: 'ElUploadList',\n components: {\n ElProgress,\n ElIcon,\n Document,\n Delete,\n Close,\n ZoomIn,\n Check,\n CircleCheck,\n },\n props: {\n files: {\n type: Array as PropType<UploadFile[]>,\n default: () => [] as File[],\n },\n disabled: {\n type: Boolean,\n default: false,\n },\n handlePreview: {\n type: Function as PropType<(file: UploadFile) => void>,\n default: () => NOOP,\n },\n listType: {\n type: String as PropType<'picture' \| 'picture-card' \| 'text'>,\n default: 'text',\n },\n },\n emits: ['remove'],\n setup(props, { emit }) {\n const { t } = useLocale()\n\n const handleClick = (file: UploadFile) => {\n props.handlePreview(file)\n }\n\n const onFileClicked = (e: Event) => {\n ;(e.target as HTMLElement).focus()\n }\n\n const handleRemove = (e: Event, file: UploadFile) => {\n emit('remove', file)\n }\n return {\n focusing: ref(false),\n handleClick,\n handleRemove,\n onFileClicked,\n t,\n }\n },\n})\n</script>\n"],"names":["_createBlock","_createElementBlock","_renderSlot","_createElementVNode","_createVNode","_createCommentVNode"],"mappings":";;;;;qBAsCe,OAAM;;;EAwBO,OAAM;AAAA;;;EAWxB,OAAM;AAAA;;;;;;;;;;;;sBAxEdA;IACE,KAAI;AAAA,IACH;;;;;IAKD,MAAK;AAAA;qBAGH;wBADFC,8CACiB,aAAR;4BADTA;UAEG,KAAK,KAAK,OAAO;AAAA,UACjB;;;;;UAKD,UAAS;AAAA,UACR,iCAAiB,iBAAY,kBAAa,QAAQ;UAClD,+CAAO;UACP,8CAAM;UACN,gDAAO;;UAERC,qCAAO,QAAP;+GACED;;cAKE,OAAM;AAAA,cACL,KAAK,KAAK;AAAA,cACX,KAAI;AAAA;YAENE;cAAG,OAAM;AAAA,cAA6B,qBAAO,iBAAY;AAAA;cACvDC,kCAAS,OAAM;iCAAoB;kBAAAA,YAAY;AAAA;AAAA;;oDAC5C,KAAK;;YAEVD,4BAAA;cAEU,yCADRH;;gBAEE,OAAM;AAAA;iCAEN;kBAAAI;;;gDAGuC,SAAS,+BADlDJ;;gBAEE,OAAM;AAAA;iCAEN;kBAAAI;;;;;aAIK,8BADTJ;;cAEE,OAAM;AAAA,cACL,qBAAO,kBAAa,QAAQ;AAAA;+BAE7B;gBAAAI;;;;YAEFC;YACAA;YACAA;aACU,8BAAVJ,wBAAA,4BACE;YAGM,KAAK,uCADbD;;cAEG,MAAM;cACN,gBAAc;cACd,aAAa,KAAK;AAAA;YAGb,iDADRC,2BAAA;cAIEE;gBACE,OAAM;AAAA,gBACL,qBAAO,mBAAc;AAAA;gBAEtBC,kCAAS,OAAM;mCAAmB;oBAAAA,YAAW;AAAA;AAAA;;;eAGtC,8BADTH;;gBAEE,OAAM;AAAA,gBACL,qBAAO,kBAAa,QAAQ;AAAA;gBAE7BG,kCAAS,OAAM;mCAAkB;oBAAAA,YAAU;AAAA;AAAA;;;;;;;;;;;;;;"}

package/es/components/virtual-list/src/builders/build-list.d.ts CHANGED Viewed

@@ -71,11 +71,11 @@ declare const createList: ({ name, getOffset, getItemSize, getItemOffset, getEst
     readonly total?: unknown;
     readonly itemSize?: unknown;
 } & {
-    total: number;
     data: any[];
     height: import("../../../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
     layout: import("../../../../utils/props").BuildPropType<StringConstructor, "horizontal" | "vertical", never>;
     direction: import("../../../../utils/props").BuildPropType<StringConstructor, "ltr" | "rtl", never>;
+    total: number;
     className: string;
     scrollbarAlwaysOn: import("../../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     perfMode: import("../../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;

package/es/components/virtual-list/src/components/dynamic-size-list.d.ts CHANGED Viewed

@@ -69,11 +69,11 @@ declare const DynamicSizeList: import("vue").DefineComponent<{
     readonly total?: unknown;
     readonly itemSize?: unknown;
 } & {
-    total: number;
     data: any[];
     height: import("../../../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
     layout: import("../../../../utils/props").BuildPropType<StringConstructor, "horizontal" | "vertical", never>;
     direction: import("../../../../utils/props").BuildPropType<StringConstructor, "ltr" | "rtl", never>;
+    total: number;
     className: string;
     scrollbarAlwaysOn: import("../../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     perfMode: import("../../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;