npm - @element-plus/nightly - Versions diffs - 0.0.20220110 → 0.0.20220114 - Mend

@element-plus/nightly 0.0.20220110 → 0.0.20220114

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 (2520) hide show

package/lib/components/cascader/src/index.vue_vue_type_script_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/cascader/src/index.vue"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-model:visible=\"popperVisible\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-cascader__dropdown ${popperClass}`\"\n :popper-options=\"popperOptions\"\n :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n :stop-popper-mouse-event=\"false\"\n :gpu-acceleration=\"false\"\n placement=\"bottom-start\"\n transition=\"el-zoom-in-top\"\n effect=\"light\"\n pure\n persistent\n @hide=\"hideSuggestionPanel\"\n >\n <template #default>\n <div\n v-clickoutside:[popperPaneRef]=\"() => togglePopperVisible(false)\"\n :class=\"[\n 'el-cascader',\n realSize && `el-cascader--${realSize}`,\n { 'is-disabled': isDisabled },\n ]\"\n @click=\"() => togglePopperVisible(readonly ? undefined : true)\"\n @keydown=\"handleKeyDown\"\n @mouseenter=\"inputHover = true\"\n @mouseleave=\"inputHover = false\"\n >\n <el-input\n ref=\"input\"\n v-model.trim=\"inputValue\"\n :placeholder=\"inputPlaceholder\"\n :readonly=\"readonly\"\n :disabled=\"isDisabled\"\n :validate-event=\"false\"\n :size=\"realSize\"\n :class=\"{ 'is-focus': popperVisible }\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n @focus=\"(e) => $emit('focus', e)\"\n @blur=\"(e) => $emit('blur', e)\"\n @input=\"handleInput\"\n >\n <template #suffix>\n <el-icon\n v-if=\"clearBtnVisible\"\n key=\"clear\"\n class=\"el-input__icon icon-circle-close\"\n @click.stop=\"handleClear\"\n >\n <circle-close />\n </el-icon>\n <el-icon\n v-else\n key=\"arrow-down\"\n :class=\"[\n 'el-input__icon',\n 'icon-arrow-down',\n popperVisible && 'is-reverse',\n ]\"\n @click.stop=\"togglePopperVisible()\"\n >\n <arrow-down />\n </el-icon>\n </template>\n </el-input>\n\n <div v-if=\"multiple\" ref=\"tagWrapper\" class=\"el-cascader__tags\">\n <el-tag\n v-for=\"tag in presentTags\"\n :key=\"tag.key\"\n type=\"info\"\n :size=\"tagSize\"\n :hit=\"tag.hitState\"\n :closable=\"tag.closable\"\n disable-transitions\n @close=\"deleteTag(tag)\"\n >\n <span>{{ tag.text }}</span>\n </el-tag>\n <input\n v-if=\"filterable && !isDisabled\"\n v-model.trim=\"searchInputValue\"\n type=\"text\"\n class=\"el-cascader__search-input\"\n :placeholder=\"presentText ? '' : inputPlaceholder\"\n @input=\"(e) => handleInput(searchInputValue, e)\"\n @click.stop=\"togglePopperVisible(true)\"\n @keydown.delete=\"handleDelete\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n />\n </div>\n </div>\n </template>\n\n <template #content>\n <el-cascader-panel\n v-show=\"!filtering\"\n ref=\"panel\"\n v-model=\"checkedValue\"\n :options=\"options\"\n :props=\"props\"\n :border=\"false\"\n :render-label=\"$slots.default\"\n @expand-change=\"handleExpandChange\"\n @close=\"$nextTick(() => togglePopperVisible(false))\"\n />\n <el-scrollbar\n v-if=\"filterable\"\n v-show=\"filtering\"\n ref=\"suggestionPanel\"\n tag=\"ul\"\n class=\"el-cascader__suggestion-panel\"\n view-class=\"el-cascader__suggestion-list\"\n @keydown=\"handleSuggestionKeyDown\"\n >\n <template v-if=\"suggestions.length\">\n <li\n v-for=\"item in suggestions\"\n :key=\"item.uid\"\n :class=\"[\n 'el-cascader__suggestion-item',\n item.checked && 'is-checked',\n ]\"\n :tabindex=\"-1\"\n @click=\"handleSuggestionClick(item)\"\n >\n <span>{{ item.text }}</span>\n <el-icon v-if=\"item.checked\"><check /></el-icon>\n </li>\n </template>\n <slot v-else name=\"empty\">\n <li class=\"el-cascader__empty-text\">\n {{ t('el.cascader.noMatch') }}\n </li>\n </slot>\n </el-scrollbar>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n inject,\n nextTick,\n onMounted,\n onBeforeUnmount,\n ref,\n watch,\n} from 'vue'\nimport { isPromise } from '@vue/shared'\nimport debounce from 'lodash/debounce'\n\nimport { isClient } from '@vueuse/core'\nimport ElCascaderPanel, {\n CommonProps,\n} from '@element-plus/components/cascader-panel'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\n\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\nimport { ClickOutside as Clickoutside } from '@element-plus/directives'\nimport { useLocale, useSize } from '@element-plus/hooks'\n\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport {\n addResizeListener,\n removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { isKorean } from '@element-plus/utils/isDef'\nimport { CircleClose, Check, ArrowDown } from '@element-plus/icons-vue'\n\nimport type { Options } from '@element-plus/components/popper'\nimport type { ComputedRef, PropType, Ref } from 'vue'\nimport type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'\nimport type {\n CascaderValue,\n CascaderNode,\n Tag,\n} from '@element-plus/components/cascader-panel'\nimport type { ComponentSize } from '@element-plus/utils/types'\n\ntype cascaderPanelType = InstanceType<typeof ElCascaderPanel>\ntype tooltipType = InstanceType<typeof ElTooltip>\ntype inputType = InstanceType<typeof ElInput>\ntype suggestionPanelType = InstanceType<typeof ElScrollbar>\n\nconst DEFAULT_INPUT_HEIGHT = 40\n\nconst INPUT_HEIGHT_MAP = {\n large: 36,\n default: 32,\n small: 28,\n}\n\nconst popperOptions: Partial<Options> = {\n modifiers: [\n {\n name: 'arrowPosition',\n enabled: true,\n phase: 'main',\n fn: ({ state }) => {\n const { modifiersData, placement } = state as any\n if (['right', 'left'].includes(placement)) return\n modifiersData.arrow.x = 35\n },\n requires: ['arrow'],\n },\n ],\n}\n\nexport default defineComponent({\n name: 'ElCascader',\n\n components: {\n ElCascaderPanel,\n ElInput,\n ElTooltip,\n ElScrollbar,\n ElTag,\n ElIcon,\n CircleClose,\n Check,\n ArrowDown,\n },\n\n directives: {\n Clickoutside,\n },\n\n props: {\n ...CommonProps,\n size: {\n type: String as PropType<ComponentSize>,\n validator: isValidComponentSize,\n },\n placeholder: {\n type: String,\n },\n disabled: Boolean,\n clearable: Boolean,\n filterable: Boolean,\n filterMethod: {\n type: Function as PropType<\n (node: CascaderNode, keyword: string) => boolean\n >,\n default: (node: CascaderNode, keyword: string) =>\n node.text.includes(keyword),\n },\n separator: {\n type: String,\n default: ' / ',\n },\n showAllLevels: {\n type: Boolean,\n default: true,\n },\n collapseTags: Boolean,\n debounce: {\n type: Number,\n default: 300,\n },\n beforeFilter: {\n type: Function as PropType<(value: string) => boolean \| Promise<any>>,\n default: () => true,\n },\n popperClass: {\n type: String,\n default: '',\n },\n popperAppendToBody: {\n type: Boolean,\n default: true,\n },\n },\n\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'focus',\n 'blur',\n 'visible-change',\n 'expand-change',\n 'remove-tag',\n ],\n\n setup(props, { emit }) {\n let inputInitialHeight = 0\n let pressDeleteCount = 0\n\n const { t } = useLocale()\n const elForm = inject(elFormKey, {} as ElFormContext)\n const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n const tooltipRef: Ref<tooltipType \| null> = ref(null)\n const input: Ref<inputType \| null> = ref(null)\n const tagWrapper = ref(null)\n const panel: Ref<cascaderPanelType \| null> = ref(null)\n const suggestionPanel: Ref<suggestionPanelType \| null> = ref(null)\n const popperVisible = ref(false)\n const inputHover = ref(false)\n const filtering = ref(false)\n const inputValue = ref('')\n const searchInputValue = ref('')\n const presentTags: Ref<Tag[]> = ref([])\n const suggestions: Ref<CascaderNode[]> = ref([])\n const isOnComposition = ref(false)\n\n const isDisabled = computed(() => props.disabled \|\| elForm.disabled)\n const inputPlaceholder = computed(\n () => props.placeholder \|\| t('el.cascader.placeholder')\n )\n const realSize = useSize()\n const tagSize = computed(() =>\n ['small'].includes(realSize.value) ? 'small' : 'default'\n )\n const multiple = computed(() => !!props.props.multiple)\n const readonly = computed(() => !props.filterable \|\| multiple.value)\n const searchKeyword = computed(() =>\n multiple.value ? searchInputValue.value : inputValue.value\n )\n const checkedNodes: ComputedRef<CascaderNode[]> = computed(\n () => panel.value?.checkedNodes \|\| []\n )\n const clearBtnVisible = computed(() => {\n if (\n !props.clearable \|\|\n isDisabled.value \|\|\n filtering.value \|\|\n !inputHover.value\n )\n return false\n\n return !!checkedNodes.value.length\n })\n const presentText = computed(() => {\n const { showAllLevels, separator } = props\n const nodes = checkedNodes.value\n return nodes.length\n ? multiple.value\n ? ' '\n : nodes[0].calcText(showAllLevels, separator)\n : ''\n })\n\n const checkedValue = computed<CascaderValue>({\n get() {\n return props.modelValue\n },\n set(val) {\n emit(UPDATE_MODEL_EVENT, val)\n emit(CHANGE_EVENT, val)\n elFormItem.validate?.('change')\n },\n })\n\n const popperPaneRef = computed(() => {\n return tooltipRef.value?.popperRef?.contentRef\n })\n\n const togglePopperVisible = (visible?: boolean) => {\n if (isDisabled.value) return\n\n visible = visible ?? !popperVisible.value\n\n if (visible !== popperVisible.value) {\n popperVisible.value = visible\n input.value?.input?.setAttribute('aria-expanded', `${visible}`)\n\n if (visible) {\n updatePopperPosition()\n nextTick(panel.value?.scrollToExpandingNode)\n } else if (props.filterable) {\n const { value } = presentText\n inputValue.value = value\n searchInputValue.value = value\n }\n\n emit('visible-change', visible)\n }\n }\n\n const updatePopperPosition = () => {\n nextTick(() => {\n tooltipRef.value?.updatePopper()\n })\n }\n\n const hideSuggestionPanel = () => {\n filtering.value = false\n }\n\n const genTag = (node: CascaderNode): Tag => {\n const { showAllLevels, separator } = props\n return {\n node,\n key: node.uid,\n text: node.calcText(showAllLevels, separator),\n hitState: false,\n closable: !isDisabled.value && !node.isDisabled,\n }\n }\n\n const deleteTag = (tag: Tag) => {\n const node = tag.node as CascaderNode\n node.doCheck(false)\n panel.value?.calculateCheckedValue()\n emit('remove-tag', node.valueByOption)\n }\n\n const calculatePresentTags = () => {\n if (!multiple.value) return\n\n const nodes = checkedNodes.value\n const tags: Tag[] = []\n\n if (nodes.length) {\n const [first, ...rest] = nodes\n const restCount = rest.length\n\n tags.push(genTag(first))\n\n if (restCount) {\n if (props.collapseTags) {\n tags.push({\n key: -1,\n text: `+ ${restCount}`,\n closable: false,\n })\n } else {\n rest.forEach((node) => tags.push(genTag(node)))\n }\n }\n }\n\n presentTags.value = tags\n }\n\n const calculateSuggestions = () => {\n const { filterMethod, showAllLevels, separator } = props\n const res = panel.value\n ?.getFlattedNodes(!props.props.checkStrictly)\n ?.filter((node) => {\n if (node.isDisabled) return false\n node.calcText(showAllLevels, separator)\n return filterMethod(node, searchKeyword.value)\n })\n\n if (multiple.value) {\n presentTags.value.forEach((tag) => {\n tag.hitState = false\n })\n }\n\n filtering.value = true\n suggestions.value = res!\n updatePopperPosition()\n }\n\n const focusFirstNode = () => {\n let firstNode!: HTMLElement\n\n if (filtering.value && suggestionPanel.value) {\n firstNode = suggestionPanel.value.$el.querySelector(\n '.el-cascader__suggestion-item'\n )\n } else {\n firstNode = panel.value?.$el.querySelector(\n '.el-cascader-node[tabindex=\"-1\"]'\n )\n }\n\n if (firstNode) {\n firstNode.focus()\n !filtering.value && firstNode.click()\n }\n }\n\n const updateStyle = () => {\n const inputInner = input.value?.input\n const tagWrapperEl = tagWrapper.value\n const suggestionPanelEl = suggestionPanel.value?.$el\n\n if (!isClient \|\| !inputInner) return\n\n if (suggestionPanelEl) {\n const suggestionList = suggestionPanelEl.querySelector(\n '.el-cascader__suggestion-list'\n )\n suggestionList.style.minWidth = `${inputInner.offsetWidth}px`\n }\n\n if (tagWrapperEl) {\n const { offsetHeight } = tagWrapperEl\n const height =\n presentTags.value.length > 0\n ? `${Math.max(offsetHeight + 6, inputInitialHeight)}px`\n : `${inputInitialHeight}px`\n inputInner.style.height = height\n updatePopperPosition()\n }\n }\n\n const getCheckedNodes = (leafOnly: boolean) => {\n return panel.value?.getCheckedNodes(leafOnly)\n }\n\n const handleExpandChange = (value: CascaderValue) => {\n updatePopperPosition()\n emit('expand-change', value)\n }\n\n const handleComposition = (event: CompositionEvent) => {\n const text = (event.target as HTMLInputElement)?.value\n if (event.type === 'compositionend') {\n isOnComposition.value = false\n nextTick(() => handleInput(text))\n } else {\n const lastCharacter = text[text.length - 1] \|\| ''\n isOnComposition.value = !isKorean(lastCharacter)\n }\n }\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (isOnComposition.value) return\n\n switch (e.code) {\n case EVENT_CODE.enter:\n togglePopperVisible()\n break\n case EVENT_CODE.down:\n togglePopperVisible(true)\n nextTick(focusFirstNode)\n e.preventDefault()\n break\n case EVENT_CODE.esc:\n case EVENT_CODE.tab:\n togglePopperVisible(false)\n break\n }\n }\n\n const handleClear = () => {\n panel.value?.clearCheckedNodes()\n togglePopperVisible(false)\n }\n\n const handleSuggestionClick = (node: CascaderNode) => {\n const { checked } = node\n\n if (multiple.value) {\n panel.value?.handleCheckChange(node, !checked, false)\n } else {\n !checked && panel.value?.handleCheckChange(node, true, false)\n togglePopperVisible(false)\n }\n }\n\n const handleSuggestionKeyDown = (e: KeyboardEvent) => {\n const target = e.target as HTMLElement\n const { code } = e\n\n switch (code) {\n case EVENT_CODE.up:\n case EVENT_CODE.down: {\n const distance = code === EVENT_CODE.up ? -1 : 1\n focusNode(\n getSibling(\n target,\n distance,\n '.el-cascader__suggestion-item[tabindex=\"-1\"]'\n )\n )\n break\n }\n case EVENT_CODE.enter:\n target.click()\n break\n case EVENT_CODE.esc:\n case EVENT_CODE.tab:\n togglePopperVisible(false)\n break\n }\n }\n\n const handleDelete = () => {\n const tags = presentTags.value\n const lastTag = tags[tags.length - 1]\n pressDeleteCount = searchInputValue.value ? 0 : pressDeleteCount + 1\n\n if (!lastTag \|\| !pressDeleteCount) return\n\n if (lastTag.hitState) {\n deleteTag(lastTag)\n } else {\n lastTag.hitState = true\n }\n }\n\n const handleFilter = debounce(() => {\n const { value } = searchKeyword\n\n if (!value) return\n\n const passed = props.beforeFilter(value)\n\n if (isPromise(passed)) {\n passed.then(calculateSuggestions).catch(() => {\n /* prevent log error */\n })\n } else if (passed !== false) {\n calculateSuggestions()\n } else {\n hideSuggestionPanel()\n }\n }, props.debounce)\n\n const handleInput = (val: string, e?: KeyboardEvent) => {\n !popperVisible.value && togglePopperVisible(true)\n\n if (e?.isComposing) return\n\n val ? handleFilter() : hideSuggestionPanel()\n }\n\n watch(filtering, updatePopperPosition)\n\n watch([checkedNodes, isDisabled], calculatePresentTags)\n\n watch(presentTags, () => {\n nextTick(() => updateStyle())\n })\n\n watch(presentText, (val) => (inputValue.value = val), { immediate: true })\n\n onMounted(() => {\n const inputEl = input.value?.$el\n inputInitialHeight =\n inputEl?.offsetHeight \|\|\n INPUT_HEIGHT_MAP[realSize.value] \|\|\n DEFAULT_INPUT_HEIGHT\n addResizeListener(inputEl, updateStyle)\n })\n\n onBeforeUnmount(() => {\n removeResizeListener(input.value?.$el, updateStyle)\n })\n\n return {\n popperOptions,\n tooltipRef,\n popperPaneRef,\n input,\n tagWrapper,\n panel,\n suggestionPanel,\n popperVisible,\n inputHover,\n inputPlaceholder,\n filtering,\n presentText,\n checkedValue,\n inputValue,\n searchInputValue,\n presentTags,\n suggestions,\n isDisabled,\n isOnComposition,\n realSize,\n tagSize,\n multiple,\n readonly,\n clearBtnVisible,\n t,\n togglePopperVisible,\n hideSuggestionPanel,\n deleteTag,\n focusFirstNode,\n getCheckedNodes,\n handleExpandChange,\n handleKeyDown,\n handleComposition,\n handleClear,\n handleSuggestionClick,\n handleSuggestionKeyDown,\n handleDelete,\n handleInput,\n }\n },\n})\n</script>\n"],"names":["defineComponent","ElCascaderPanel","ElScrollbar","ElTag","ElIcon","CommonProps","UPDATE_MODEL_EVENT","CHANGE_EVENT","useLocale","ref","useSize","computed","nextTick","isKorean","EVENT_CODE","focusNode","getSibling","isPromise"],"mappings":"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"}
1	+ {"version":3,"file":"index.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/cascader/src/index.vue"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-model:visible=\"popperVisible\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-cascader__dropdown ${popperClass}`\"\n :popper-options=\"popperOptions\"\n :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n :stop-popper-mouse-event=\"false\"\n :gpu-acceleration=\"false\"\n placement=\"bottom-start\"\n transition=\"el-zoom-in-top\"\n effect=\"light\"\n pure\n persistent\n @hide=\"hideSuggestionPanel\"\n >\n <template #default>\n <div\n v-clickoutside:[popperPaneRef]=\"() => togglePopperVisible(false)\"\n :class=\"[\n 'el-cascader',\n realSize && `el-cascader--${realSize}`,\n { 'is-disabled': isDisabled },\n $attrs.class,\n ]\"\n :style=\"$attrs.style\"\n @click=\"() => togglePopperVisible(readonly ? undefined : true)\"\n @keydown=\"handleKeyDown\"\n @mouseenter=\"inputHover = true\"\n @mouseleave=\"inputHover = false\"\n >\n <el-input\n ref=\"input\"\n v-model.trim=\"inputValue\"\n :placeholder=\"inputPlaceholder\"\n :readonly=\"readonly\"\n :disabled=\"isDisabled\"\n :validate-event=\"false\"\n :size=\"realSize\"\n :class=\"{ 'is-focus': popperVisible }\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n @focus=\"(e) => $emit('focus', e)\"\n @blur=\"(e) => $emit('blur', e)\"\n @input=\"handleInput\"\n >\n <template #suffix>\n <el-icon\n v-if=\"clearBtnVisible\"\n key=\"clear\"\n class=\"el-input__icon icon-circle-close\"\n @click.stop=\"handleClear\"\n >\n <circle-close />\n </el-icon>\n <el-icon\n v-else\n key=\"arrow-down\"\n :class=\"[\n 'el-input__icon',\n 'icon-arrow-down',\n popperVisible && 'is-reverse',\n ]\"\n @click.stop=\"togglePopperVisible()\"\n >\n <arrow-down />\n </el-icon>\n </template>\n </el-input>\n\n <div v-if=\"multiple\" ref=\"tagWrapper\" class=\"el-cascader__tags\">\n <el-tag\n v-for=\"tag in presentTags\"\n :key=\"tag.key\"\n type=\"info\"\n :size=\"tagSize\"\n :hit=\"tag.hitState\"\n :closable=\"tag.closable\"\n disable-transitions\n @close=\"deleteTag(tag)\"\n >\n <span>{{ tag.text }}</span>\n </el-tag>\n <input\n v-if=\"filterable && !isDisabled\"\n v-model.trim=\"searchInputValue\"\n type=\"text\"\n class=\"el-cascader__search-input\"\n :placeholder=\"presentText ? '' : inputPlaceholder\"\n @input=\"(e) => handleInput(searchInputValue, e)\"\n @click.stop=\"togglePopperVisible(true)\"\n @keydown.delete=\"handleDelete\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n />\n </div>\n </div>\n </template>\n\n <template #content>\n <el-cascader-panel\n v-show=\"!filtering\"\n ref=\"panel\"\n v-model=\"checkedValue\"\n :options=\"options\"\n :props=\"props\"\n :border=\"false\"\n :render-label=\"$slots.default\"\n @expand-change=\"handleExpandChange\"\n @close=\"$nextTick(() => togglePopperVisible(false))\"\n />\n <el-scrollbar\n v-if=\"filterable\"\n v-show=\"filtering\"\n ref=\"suggestionPanel\"\n tag=\"ul\"\n class=\"el-cascader__suggestion-panel\"\n view-class=\"el-cascader__suggestion-list\"\n @keydown=\"handleSuggestionKeyDown\"\n >\n <template v-if=\"suggestions.length\">\n <li\n v-for=\"item in suggestions\"\n :key=\"item.uid\"\n :class=\"[\n 'el-cascader__suggestion-item',\n item.checked && 'is-checked',\n ]\"\n :tabindex=\"-1\"\n @click=\"handleSuggestionClick(item)\"\n >\n <span>{{ item.text }}</span>\n <el-icon v-if=\"item.checked\"><check /></el-icon>\n </li>\n </template>\n <slot v-else name=\"empty\">\n <li class=\"el-cascader__empty-text\">\n {{ t('el.cascader.noMatch') }}\n </li>\n </slot>\n </el-scrollbar>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n inject,\n nextTick,\n onMounted,\n onBeforeUnmount,\n ref,\n watch,\n} from 'vue'\nimport { isPromise } from '@vue/shared'\nimport debounce from 'lodash/debounce'\n\nimport { isClient } from '@vueuse/core'\nimport ElCascaderPanel, {\n CommonProps,\n} from '@element-plus/components/cascader-panel'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\n\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\nimport { ClickOutside as Clickoutside } from '@element-plus/directives'\nimport { useLocale, useSize } from '@element-plus/hooks'\n\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport {\n addResizeListener,\n removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { isKorean } from '@element-plus/utils/isDef'\nimport { CircleClose, Check, ArrowDown } from '@element-plus/icons-vue'\n\nimport type { Options } from '@element-plus/components/popper'\nimport type { ComputedRef, PropType, Ref } from 'vue'\nimport type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'\nimport type {\n CascaderValue,\n CascaderNode,\n Tag,\n} from '@element-plus/components/cascader-panel'\nimport type { ComponentSize } from '@element-plus/utils/types'\n\ntype cascaderPanelType = InstanceType<typeof ElCascaderPanel>\ntype tooltipType = InstanceType<typeof ElTooltip>\ntype inputType = InstanceType<typeof ElInput>\ntype suggestionPanelType = InstanceType<typeof ElScrollbar>\n\nconst DEFAULT_INPUT_HEIGHT = 40\n\nconst INPUT_HEIGHT_MAP = {\n large: 36,\n default: 32,\n small: 28,\n}\n\nconst popperOptions: Partial<Options> = {\n modifiers: [\n {\n name: 'arrowPosition',\n enabled: true,\n phase: 'main',\n fn: ({ state }) => {\n const { modifiersData, placement } = state as any\n if (['right', 'left'].includes(placement)) return\n modifiersData.arrow.x = 35\n },\n requires: ['arrow'],\n },\n ],\n}\n\nexport default defineComponent({\n name: 'ElCascader',\n\n components: {\n ElCascaderPanel,\n ElInput,\n ElTooltip,\n ElScrollbar,\n ElTag,\n ElIcon,\n CircleClose,\n Check,\n ArrowDown,\n },\n\n directives: {\n Clickoutside,\n },\n\n props: {\n ...CommonProps,\n size: {\n type: String as PropType<ComponentSize>,\n validator: isValidComponentSize,\n },\n placeholder: {\n type: String,\n },\n disabled: Boolean,\n clearable: Boolean,\n filterable: Boolean,\n filterMethod: {\n type: Function as PropType<\n (node: CascaderNode, keyword: string) => boolean\n >,\n default: (node: CascaderNode, keyword: string) =>\n node.text.includes(keyword),\n },\n separator: {\n type: String,\n default: ' / ',\n },\n showAllLevels: {\n type: Boolean,\n default: true,\n },\n collapseTags: Boolean,\n debounce: {\n type: Number,\n default: 300,\n },\n beforeFilter: {\n type: Function as PropType<(value: string) => boolean \| Promise<any>>,\n default: () => true,\n },\n popperClass: {\n type: String,\n default: '',\n },\n popperAppendToBody: {\n type: Boolean,\n default: true,\n },\n },\n\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'focus',\n 'blur',\n 'visible-change',\n 'expand-change',\n 'remove-tag',\n ],\n\n setup(props, { emit }) {\n let inputInitialHeight = 0\n let pressDeleteCount = 0\n\n const { t } = useLocale()\n const elForm = inject(elFormKey, {} as ElFormContext)\n const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n const tooltipRef: Ref<tooltipType \| null> = ref(null)\n const input: Ref<inputType \| null> = ref(null)\n const tagWrapper = ref(null)\n const panel: Ref<cascaderPanelType \| null> = ref(null)\n const suggestionPanel: Ref<suggestionPanelType \| null> = ref(null)\n const popperVisible = ref(false)\n const inputHover = ref(false)\n const filtering = ref(false)\n const inputValue = ref('')\n const searchInputValue = ref('')\n const presentTags: Ref<Tag[]> = ref([])\n const suggestions: Ref<CascaderNode[]> = ref([])\n const isOnComposition = ref(false)\n\n const isDisabled = computed(() => props.disabled \|\| elForm.disabled)\n const inputPlaceholder = computed(\n () => props.placeholder \|\| t('el.cascader.placeholder')\n )\n const realSize = useSize()\n const tagSize = computed(() =>\n ['small'].includes(realSize.value) ? 'small' : 'default'\n )\n const multiple = computed(() => !!props.props.multiple)\n const readonly = computed(() => !props.filterable \|\| multiple.value)\n const searchKeyword = computed(() =>\n multiple.value ? searchInputValue.value : inputValue.value\n )\n const checkedNodes: ComputedRef<CascaderNode[]> = computed(\n () => panel.value?.checkedNodes \|\| []\n )\n const clearBtnVisible = computed(() => {\n if (\n !props.clearable \|\|\n isDisabled.value \|\|\n filtering.value \|\|\n !inputHover.value\n )\n return false\n\n return !!checkedNodes.value.length\n })\n const presentText = computed(() => {\n const { showAllLevels, separator } = props\n const nodes = checkedNodes.value\n return nodes.length\n ? multiple.value\n ? ' '\n : nodes[0].calcText(showAllLevels, separator)\n : ''\n })\n\n const checkedValue = computed<CascaderValue>({\n get() {\n return props.modelValue\n },\n set(val) {\n emit(UPDATE_MODEL_EVENT, val)\n emit(CHANGE_EVENT, val)\n elFormItem.validate?.('change')\n },\n })\n\n const popperPaneRef = computed(() => {\n return tooltipRef.value?.popperRef?.contentRef\n })\n\n const togglePopperVisible = (visible?: boolean) => {\n if (isDisabled.value) return\n\n visible = visible ?? !popperVisible.value\n\n if (visible !== popperVisible.value) {\n popperVisible.value = visible\n input.value?.input?.setAttribute('aria-expanded', `${visible}`)\n\n if (visible) {\n updatePopperPosition()\n nextTick(panel.value?.scrollToExpandingNode)\n } else if (props.filterable) {\n const { value } = presentText\n inputValue.value = value\n searchInputValue.value = value\n }\n\n emit('visible-change', visible)\n }\n }\n\n const updatePopperPosition = () => {\n nextTick(() => {\n tooltipRef.value?.updatePopper()\n })\n }\n\n const hideSuggestionPanel = () => {\n filtering.value = false\n }\n\n const genTag = (node: CascaderNode): Tag => {\n const { showAllLevels, separator } = props\n return {\n node,\n key: node.uid,\n text: node.calcText(showAllLevels, separator),\n hitState: false,\n closable: !isDisabled.value && !node.isDisabled,\n }\n }\n\n const deleteTag = (tag: Tag) => {\n const node = tag.node as CascaderNode\n node.doCheck(false)\n panel.value?.calculateCheckedValue()\n emit('remove-tag', node.valueByOption)\n }\n\n const calculatePresentTags = () => {\n if (!multiple.value) return\n\n const nodes = checkedNodes.value\n const tags: Tag[] = []\n\n if (nodes.length) {\n const [first, ...rest] = nodes\n const restCount = rest.length\n\n tags.push(genTag(first))\n\n if (restCount) {\n if (props.collapseTags) {\n tags.push({\n key: -1,\n text: `+ ${restCount}`,\n closable: false,\n })\n } else {\n rest.forEach((node) => tags.push(genTag(node)))\n }\n }\n }\n\n presentTags.value = tags\n }\n\n const calculateSuggestions = () => {\n const { filterMethod, showAllLevels, separator } = props\n const res = panel.value\n ?.getFlattedNodes(!props.props.checkStrictly)\n ?.filter((node) => {\n if (node.isDisabled) return false\n node.calcText(showAllLevels, separator)\n return filterMethod(node, searchKeyword.value)\n })\n\n if (multiple.value) {\n presentTags.value.forEach((tag) => {\n tag.hitState = false\n })\n }\n\n filtering.value = true\n suggestions.value = res!\n updatePopperPosition()\n }\n\n const focusFirstNode = () => {\n let firstNode!: HTMLElement\n\n if (filtering.value && suggestionPanel.value) {\n firstNode = suggestionPanel.value.$el.querySelector(\n '.el-cascader__suggestion-item'\n )\n } else {\n firstNode = panel.value?.$el.querySelector(\n '.el-cascader-node[tabindex=\"-1\"]'\n )\n }\n\n if (firstNode) {\n firstNode.focus()\n !filtering.value && firstNode.click()\n }\n }\n\n const updateStyle = () => {\n const inputInner = input.value?.input\n const tagWrapperEl = tagWrapper.value\n const suggestionPanelEl = suggestionPanel.value?.$el\n\n if (!isClient \|\| !inputInner) return\n\n if (suggestionPanelEl) {\n const suggestionList = suggestionPanelEl.querySelector(\n '.el-cascader__suggestion-list'\n )\n suggestionList.style.minWidth = `${inputInner.offsetWidth}px`\n }\n\n if (tagWrapperEl) {\n const { offsetHeight } = tagWrapperEl\n const height =\n presentTags.value.length > 0\n ? `${Math.max(offsetHeight + 6, inputInitialHeight)}px`\n : `${inputInitialHeight}px`\n inputInner.style.height = height\n updatePopperPosition()\n }\n }\n\n const getCheckedNodes = (leafOnly: boolean) => {\n return panel.value?.getCheckedNodes(leafOnly)\n }\n\n const handleExpandChange = (value: CascaderValue) => {\n updatePopperPosition()\n emit('expand-change', value)\n }\n\n const handleComposition = (event: CompositionEvent) => {\n const text = (event.target as HTMLInputElement)?.value\n if (event.type === 'compositionend') {\n isOnComposition.value = false\n nextTick(() => handleInput(text))\n } else {\n const lastCharacter = text[text.length - 1] \|\| ''\n isOnComposition.value = !isKorean(lastCharacter)\n }\n }\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (isOnComposition.value) return\n\n switch (e.code) {\n case EVENT_CODE.enter:\n togglePopperVisible()\n break\n case EVENT_CODE.down:\n togglePopperVisible(true)\n nextTick(focusFirstNode)\n e.preventDefault()\n break\n case EVENT_CODE.esc:\n case EVENT_CODE.tab:\n togglePopperVisible(false)\n break\n }\n }\n\n const handleClear = () => {\n panel.value?.clearCheckedNodes()\n togglePopperVisible(false)\n }\n\n const handleSuggestionClick = (node: CascaderNode) => {\n const { checked } = node\n\n if (multiple.value) {\n panel.value?.handleCheckChange(node, !checked, false)\n } else {\n !checked && panel.value?.handleCheckChange(node, true, false)\n togglePopperVisible(false)\n }\n }\n\n const handleSuggestionKeyDown = (e: KeyboardEvent) => {\n const target = e.target as HTMLElement\n const { code } = e\n\n switch (code) {\n case EVENT_CODE.up:\n case EVENT_CODE.down: {\n const distance = code === EVENT_CODE.up ? -1 : 1\n focusNode(\n getSibling(\n target,\n distance,\n '.el-cascader__suggestion-item[tabindex=\"-1\"]'\n )\n )\n break\n }\n case EVENT_CODE.enter:\n target.click()\n break\n case EVENT_CODE.esc:\n case EVENT_CODE.tab:\n togglePopperVisible(false)\n break\n }\n }\n\n const handleDelete = () => {\n const tags = presentTags.value\n const lastTag = tags[tags.length - 1]\n pressDeleteCount = searchInputValue.value ? 0 : pressDeleteCount + 1\n\n if (!lastTag \|\| !pressDeleteCount) return\n\n if (lastTag.hitState) {\n deleteTag(lastTag)\n } else {\n lastTag.hitState = true\n }\n }\n\n const handleFilter = debounce(() => {\n const { value } = searchKeyword\n\n if (!value) return\n\n const passed = props.beforeFilter(value)\n\n if (isPromise(passed)) {\n passed.then(calculateSuggestions).catch(() => {\n /* prevent log error */\n })\n } else if (passed !== false) {\n calculateSuggestions()\n } else {\n hideSuggestionPanel()\n }\n }, props.debounce)\n\n const handleInput = (val: string, e?: KeyboardEvent) => {\n !popperVisible.value && togglePopperVisible(true)\n\n if (e?.isComposing) return\n\n val ? handleFilter() : hideSuggestionPanel()\n }\n\n watch(filtering, updatePopperPosition)\n\n watch([checkedNodes, isDisabled], calculatePresentTags)\n\n watch(presentTags, () => {\n nextTick(() => updateStyle())\n })\n\n watch(presentText, (val) => (inputValue.value = val), { immediate: true })\n\n onMounted(() => {\n const inputEl = input.value?.$el\n inputInitialHeight =\n inputEl?.offsetHeight \|\|\n INPUT_HEIGHT_MAP[realSize.value] \|\|\n DEFAULT_INPUT_HEIGHT\n addResizeListener(inputEl, updateStyle)\n })\n\n onBeforeUnmount(() => {\n removeResizeListener(input.value?.$el, updateStyle)\n })\n\n return {\n popperOptions,\n tooltipRef,\n popperPaneRef,\n input,\n tagWrapper,\n panel,\n suggestionPanel,\n popperVisible,\n inputHover,\n inputPlaceholder,\n filtering,\n presentText,\n checkedValue,\n inputValue,\n searchInputValue,\n presentTags,\n suggestions,\n isDisabled,\n isOnComposition,\n realSize,\n tagSize,\n multiple,\n readonly,\n clearBtnVisible,\n t,\n togglePopperVisible,\n hideSuggestionPanel,\n deleteTag,\n focusFirstNode,\n getCheckedNodes,\n handleExpandChange,\n handleKeyDown,\n handleComposition,\n handleClear,\n handleSuggestionClick,\n handleSuggestionKeyDown,\n handleDelete,\n handleInput,\n }\n },\n})\n</script>\n"],"names":["defineComponent","ElCascaderPanel","ElScrollbar","ElTag","ElIcon","CommonProps","UPDATE_MODEL_EVENT","CHANGE_EVENT","useLocale","ref","useSize","computed","nextTick","isKorean","EVENT_CODE","focusNode","getSibling","isPromise"],"mappings":"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"}

package/lib/components/cascader/src/index.vue_vue_type_template_id_0429c2db_lang.js CHANGED Viewed

@@ -45,8 +45,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         class: vue.normalizeClass([
           "el-cascader",
           _ctx.realSize && `el-cascader--${_ctx.realSize}`,
-          { "is-disabled": _ctx.isDisabled }
+          { "is-disabled": _ctx.isDisabled },
+          _ctx.$attrs.class
         ]),
+        style: vue.normalizeStyle(_ctx.$attrs.style),
         onClick: _cache[11] || (_cache[11] = () => _ctx.togglePopperVisible(_ctx.readonly ? void 0 : true)),
         onKeydown: _cache[12] || (_cache[12] = (...args) => _ctx.handleKeyDown && _ctx.handleKeyDown(...args)),
         onMouseenter: _cache[13] || (_cache[13] = ($event) => _ctx.inputHover = true),
@@ -135,7 +137,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             ]
           ]) : vue.createCommentVNode("v-if", true)
         ], 512)) : vue.createCommentVNode("v-if", true)
-      ], 34)), [
+      ], 38)), [
         [_directive_clickoutside, () => _ctx.togglePopperVisible(false), _ctx.popperPaneRef]
       ])
     ]),

package/lib/components/cascader/src/index.vue_vue_type_template_id_0429c2db_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue_vue_type_template_id_0429c2db_lang.js","sources":["../../../../../../packages/components/cascader/src/index.vue?vue&type=template&id=0429c2db&lang.js"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-model:visible=\"popperVisible\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-cascader__dropdown ${popperClass}`\"\n :popper-options=\"popperOptions\"\n :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n :stop-popper-mouse-event=\"false\"\n :gpu-acceleration=\"false\"\n placement=\"bottom-start\"\n transition=\"el-zoom-in-top\"\n effect=\"light\"\n pure\n persistent\n @hide=\"hideSuggestionPanel\"\n >\n <template #default>\n <div\n v-clickoutside:[popperPaneRef]=\"() => togglePopperVisible(false)\"\n :class=\"[\n 'el-cascader',\n realSize && `el-cascader--${realSize}`,\n { 'is-disabled': isDisabled },\n ]\"\n @click=\"() => togglePopperVisible(readonly ? undefined : true)\"\n @keydown=\"handleKeyDown\"\n @mouseenter=\"inputHover = true\"\n @mouseleave=\"inputHover = false\"\n >\n <el-input\n ref=\"input\"\n v-model.trim=\"inputValue\"\n :placeholder=\"inputPlaceholder\"\n :readonly=\"readonly\"\n :disabled=\"isDisabled\"\n :validate-event=\"false\"\n :size=\"realSize\"\n :class=\"{ 'is-focus': popperVisible }\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n @focus=\"(e) => $emit('focus', e)\"\n @blur=\"(e) => $emit('blur', e)\"\n @input=\"handleInput\"\n >\n <template #suffix>\n <el-icon\n v-if=\"clearBtnVisible\"\n key=\"clear\"\n class=\"el-input__icon icon-circle-close\"\n @click.stop=\"handleClear\"\n >\n <circle-close />\n </el-icon>\n <el-icon\n v-else\n key=\"arrow-down\"\n :class=\"[\n 'el-input__icon',\n 'icon-arrow-down',\n popperVisible && 'is-reverse',\n ]\"\n @click.stop=\"togglePopperVisible()\"\n >\n <arrow-down />\n </el-icon>\n </template>\n </el-input>\n\n <div v-if=\"multiple\" ref=\"tagWrapper\" class=\"el-cascader__tags\">\n <el-tag\n v-for=\"tag in presentTags\"\n :key=\"tag.key\"\n type=\"info\"\n :size=\"tagSize\"\n :hit=\"tag.hitState\"\n :closable=\"tag.closable\"\n disable-transitions\n @close=\"deleteTag(tag)\"\n >\n <span>{{ tag.text }}</span>\n </el-tag>\n <input\n v-if=\"filterable && !isDisabled\"\n v-model.trim=\"searchInputValue\"\n type=\"text\"\n class=\"el-cascader__search-input\"\n :placeholder=\"presentText ? '' : inputPlaceholder\"\n @input=\"(e) => handleInput(searchInputValue, e)\"\n @click.stop=\"togglePopperVisible(true)\"\n @keydown.delete=\"handleDelete\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n />\n </div>\n </div>\n </template>\n\n <template #content>\n <el-cascader-panel\n v-show=\"!filtering\"\n ref=\"panel\"\n v-model=\"checkedValue\"\n :options=\"options\"\n :props=\"props\"\n :border=\"false\"\n :render-label=\"$slots.default\"\n @expand-change=\"handleExpandChange\"\n @close=\"$nextTick(() => togglePopperVisible(false))\"\n />\n <el-scrollbar\n v-if=\"filterable\"\n v-show=\"filtering\"\n ref=\"suggestionPanel\"\n tag=\"ul\"\n class=\"el-cascader__suggestion-panel\"\n view-class=\"el-cascader__suggestion-list\"\n @keydown=\"handleSuggestionKeyDown\"\n >\n <template v-if=\"suggestions.length\">\n <li\n v-for=\"item in suggestions\"\n :key=\"item.uid\"\n :class=\"[\n 'el-cascader__suggestion-item',\n item.checked && 'is-checked',\n ]\"\n :tabindex=\"-1\"\n @click=\"handleSuggestionClick(item)\"\n >\n <span>{{ item.text }}</span>\n <el-icon v-if=\"item.checked\"><check /></el-icon>\n </li>\n </template>\n <slot v-else name=\"empty\">\n <li class=\"el-cascader__empty-text\">\n {{ t('el.cascader.noMatch') }}\n </li>\n </slot>\n </el-scrollbar>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n inject,\n nextTick,\n onMounted,\n onBeforeUnmount,\n ref,\n watch,\n} from 'vue'\nimport { isPromise } from '@vue/shared'\nimport debounce from 'lodash/debounce'\n\nimport { isClient } from '@vueuse/core'\nimport ElCascaderPanel, {\n CommonProps,\n} from '@element-plus/components/cascader-panel'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\n\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\nimport { ClickOutside as Clickoutside } from '@element-plus/directives'\nimport { useLocale, useSize } from '@element-plus/hooks'\n\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport {\n addResizeListener,\n removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { isKorean } from '@element-plus/utils/isDef'\nimport { CircleClose, Check, ArrowDown } from '@element-plus/icons-vue'\n\nimport type { Options } from '@element-plus/components/popper'\nimport type { ComputedRef, PropType, Ref } from 'vue'\nimport type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'\nimport type {\n CascaderValue,\n CascaderNode,\n Tag,\n} from '@element-plus/components/cascader-panel'\nimport type { ComponentSize } from '@element-plus/utils/types'\n\ntype cascaderPanelType = InstanceType<typeof ElCascaderPanel>\ntype tooltipType = InstanceType<typeof ElTooltip>\ntype inputType = InstanceType<typeof ElInput>\ntype suggestionPanelType = InstanceType<typeof ElScrollbar>\n\nconst DEFAULT_INPUT_HEIGHT = 40\n\nconst INPUT_HEIGHT_MAP = {\n large: 36,\n default: 32,\n small: 28,\n}\n\nconst popperOptions: Partial<Options> = {\n modifiers: [\n {\n name: 'arrowPosition',\n enabled: true,\n phase: 'main',\n fn: ({ state }) => {\n const { modifiersData, placement } = state as any\n if (['right', 'left'].includes(placement)) return\n modifiersData.arrow.x = 35\n },\n requires: ['arrow'],\n },\n ],\n}\n\nexport default defineComponent({\n name: 'ElCascader',\n\n components: {\n ElCascaderPanel,\n ElInput,\n ElTooltip,\n ElScrollbar,\n ElTag,\n ElIcon,\n CircleClose,\n Check,\n ArrowDown,\n },\n\n directives: {\n Clickoutside,\n },\n\n props: {\n ...CommonProps,\n size: {\n type: String as PropType<ComponentSize>,\n validator: isValidComponentSize,\n },\n placeholder: {\n type: String,\n },\n disabled: Boolean,\n clearable: Boolean,\n filterable: Boolean,\n filterMethod: {\n type: Function as PropType<\n (node: CascaderNode, keyword: string) => boolean\n >,\n default: (node: CascaderNode, keyword: string) =>\n node.text.includes(keyword),\n },\n separator: {\n type: String,\n default: ' / ',\n },\n showAllLevels: {\n type: Boolean,\n default: true,\n },\n collapseTags: Boolean,\n debounce: {\n type: Number,\n default: 300,\n },\n beforeFilter: {\n type: Function as PropType<(value: string) => boolean \| Promise<any>>,\n default: () => true,\n },\n popperClass: {\n type: String,\n default: '',\n },\n popperAppendToBody: {\n type: Boolean,\n default: true,\n },\n },\n\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'focus',\n 'blur',\n 'visible-change',\n 'expand-change',\n 'remove-tag',\n ],\n\n setup(props, { emit }) {\n let inputInitialHeight = 0\n let pressDeleteCount = 0\n\n const { t } = useLocale()\n const elForm = inject(elFormKey, {} as ElFormContext)\n const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n const tooltipRef: Ref<tooltipType \| null> = ref(null)\n const input: Ref<inputType \| null> = ref(null)\n const tagWrapper = ref(null)\n const panel: Ref<cascaderPanelType \| null> = ref(null)\n const suggestionPanel: Ref<suggestionPanelType \| null> = ref(null)\n const popperVisible = ref(false)\n const inputHover = ref(false)\n const filtering = ref(false)\n const inputValue = ref('')\n const searchInputValue = ref('')\n const presentTags: Ref<Tag[]> = ref([])\n const suggestions: Ref<CascaderNode[]> = ref([])\n const isOnComposition = ref(false)\n\n const isDisabled = computed(() => props.disabled \|\| elForm.disabled)\n const inputPlaceholder = computed(\n () => props.placeholder \|\| t('el.cascader.placeholder')\n )\n const realSize = useSize()\n const tagSize = computed(() =>\n ['small'].includes(realSize.value) ? 'small' : 'default'\n )\n const multiple = computed(() => !!props.props.multiple)\n const readonly = computed(() => !props.filterable \|\| multiple.value)\n const searchKeyword = computed(() =>\n multiple.value ? searchInputValue.value : inputValue.value\n )\n const checkedNodes: ComputedRef<CascaderNode[]> = computed(\n () => panel.value?.checkedNodes \|\| []\n )\n const clearBtnVisible = computed(() => {\n if (\n !props.clearable \|\|\n isDisabled.value \|\|\n filtering.value \|\|\n !inputHover.value\n )\n return false\n\n return !!checkedNodes.value.length\n })\n const presentText = computed(() => {\n const { showAllLevels, separator } = props\n const nodes = checkedNodes.value\n return nodes.length\n ? multiple.value\n ? ' '\n : nodes[0].calcText(showAllLevels, separator)\n : ''\n })\n\n const checkedValue = computed<CascaderValue>({\n get() {\n return props.modelValue\n },\n set(val) {\n emit(UPDATE_MODEL_EVENT, val)\n emit(CHANGE_EVENT, val)\n elFormItem.validate?.('change')\n },\n })\n\n const popperPaneRef = computed(() => {\n return tooltipRef.value?.popperRef?.contentRef\n })\n\n const togglePopperVisible = (visible?: boolean) => {\n if (isDisabled.value) return\n\n visible = visible ?? !popperVisible.value\n\n if (visible !== popperVisible.value) {\n popperVisible.value = visible\n input.value?.input?.setAttribute('aria-expanded', `${visible}`)\n\n if (visible) {\n updatePopperPosition()\n nextTick(panel.value?.scrollToExpandingNode)\n } else if (props.filterable) {\n const { value } = presentText\n inputValue.value = value\n searchInputValue.value = value\n }\n\n emit('visible-change', visible)\n }\n }\n\n const updatePopperPosition = () => {\n nextTick(() => {\n tooltipRef.value?.updatePopper()\n })\n }\n\n const hideSuggestionPanel = () => {\n filtering.value = false\n }\n\n const genTag = (node: CascaderNode): Tag => {\n const { showAllLevels, separator } = props\n return {\n node,\n key: node.uid,\n text: node.calcText(showAllLevels, separator),\n hitState: false,\n closable: !isDisabled.value && !node.isDisabled,\n }\n }\n\n const deleteTag = (tag: Tag) => {\n const node = tag.node as CascaderNode\n node.doCheck(false)\n panel.value?.calculateCheckedValue()\n emit('remove-tag', node.valueByOption)\n }\n\n const calculatePresentTags = () => {\n if (!multiple.value) return\n\n const nodes = checkedNodes.value\n const tags: Tag[] = []\n\n if (nodes.length) {\n const [first, ...rest] = nodes\n const restCount = rest.length\n\n tags.push(genTag(first))\n\n if (restCount) {\n if (props.collapseTags) {\n tags.push({\n key: -1,\n text: `+ ${restCount}`,\n closable: false,\n })\n } else {\n rest.forEach((node) => tags.push(genTag(node)))\n }\n }\n }\n\n presentTags.value = tags\n }\n\n const calculateSuggestions = () => {\n const { filterMethod, showAllLevels, separator } = props\n const res = panel.value\n ?.getFlattedNodes(!props.props.checkStrictly)\n ?.filter((node) => {\n if (node.isDisabled) return false\n node.calcText(showAllLevels, separator)\n return filterMethod(node, searchKeyword.value)\n })\n\n if (multiple.value) {\n presentTags.value.forEach((tag) => {\n tag.hitState = false\n })\n }\n\n filtering.value = true\n suggestions.value = res!\n updatePopperPosition()\n }\n\n const focusFirstNode = () => {\n let firstNode!: HTMLElement\n\n if (filtering.value && suggestionPanel.value) {\n firstNode = suggestionPanel.value.$el.querySelector(\n '.el-cascader__suggestion-item'\n )\n } else {\n firstNode = panel.value?.$el.querySelector(\n '.el-cascader-node[tabindex=\"-1\"]'\n )\n }\n\n if (firstNode) {\n firstNode.focus()\n !filtering.value && firstNode.click()\n }\n }\n\n const updateStyle = () => {\n const inputInner = input.value?.input\n const tagWrapperEl = tagWrapper.value\n const suggestionPanelEl = suggestionPanel.value?.$el\n\n if (!isClient \|\| !inputInner) return\n\n if (suggestionPanelEl) {\n const suggestionList = suggestionPanelEl.querySelector(\n '.el-cascader__suggestion-list'\n )\n suggestionList.style.minWidth = `${inputInner.offsetWidth}px`\n }\n\n if (tagWrapperEl) {\n const { offsetHeight } = tagWrapperEl\n const height =\n presentTags.value.length > 0\n ? `${Math.max(offsetHeight + 6, inputInitialHeight)}px`\n : `${inputInitialHeight}px`\n inputInner.style.height = height\n updatePopperPosition()\n }\n }\n\n const getCheckedNodes = (leafOnly: boolean) => {\n return panel.value?.getCheckedNodes(leafOnly)\n }\n\n const handleExpandChange = (value: CascaderValue) => {\n updatePopperPosition()\n emit('expand-change', value)\n }\n\n const handleComposition = (event: CompositionEvent) => {\n const text = (event.target as HTMLInputElement)?.value\n if (event.type === 'compositionend') {\n isOnComposition.value = false\n nextTick(() => handleInput(text))\n } else {\n const lastCharacter = text[text.length - 1] \|\| ''\n isOnComposition.value = !isKorean(lastCharacter)\n }\n }\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (isOnComposition.value) return\n\n switch (e.code) {\n case EVENT_CODE.enter:\n togglePopperVisible()\n break\n case EVENT_CODE.down:\n togglePopperVisible(true)\n nextTick(focusFirstNode)\n e.preventDefault()\n break\n case EVENT_CODE.esc:\n case EVENT_CODE.tab:\n togglePopperVisible(false)\n break\n }\n }\n\n const handleClear = () => {\n panel.value?.clearCheckedNodes()\n togglePopperVisible(false)\n }\n\n const handleSuggestionClick = (node: CascaderNode) => {\n const { checked } = node\n\n if (multiple.value) {\n panel.value?.handleCheckChange(node, !checked, false)\n } else {\n !checked && panel.value?.handleCheckChange(node, true, false)\n togglePopperVisible(false)\n }\n }\n\n const handleSuggestionKeyDown = (e: KeyboardEvent) => {\n const target = e.target as HTMLElement\n const { code } = e\n\n switch (code) {\n case EVENT_CODE.up:\n case EVENT_CODE.down: {\n const distance = code === EVENT_CODE.up ? -1 : 1\n focusNode(\n getSibling(\n target,\n distance,\n '.el-cascader__suggestion-item[tabindex=\"-1\"]'\n )\n )\n break\n }\n case EVENT_CODE.enter:\n target.click()\n break\n case EVENT_CODE.esc:\n case EVENT_CODE.tab:\n togglePopperVisible(false)\n break\n }\n }\n\n const handleDelete = () => {\n const tags = presentTags.value\n const lastTag = tags[tags.length - 1]\n pressDeleteCount = searchInputValue.value ? 0 : pressDeleteCount + 1\n\n if (!lastTag \|\| !pressDeleteCount) return\n\n if (lastTag.hitState) {\n deleteTag(lastTag)\n } else {\n lastTag.hitState = true\n }\n }\n\n const handleFilter = debounce(() => {\n const { value } = searchKeyword\n\n if (!value) return\n\n const passed = props.beforeFilter(value)\n\n if (isPromise(passed)) {\n passed.then(calculateSuggestions).catch(() => {\n /* prevent log error */\n })\n } else if (passed !== false) {\n calculateSuggestions()\n } else {\n hideSuggestionPanel()\n }\n }, props.debounce)\n\n const handleInput = (val: string, e?: KeyboardEvent) => {\n !popperVisible.value && togglePopperVisible(true)\n\n if (e?.isComposing) return\n\n val ? handleFilter() : hideSuggestionPanel()\n }\n\n watch(filtering, updatePopperPosition)\n\n watch([checkedNodes, isDisabled], calculatePresentTags)\n\n watch(presentTags, () => {\n nextTick(() => updateStyle())\n })\n\n watch(presentText, (val) => (inputValue.value = val), { immediate: true })\n\n onMounted(() => {\n const inputEl = input.value?.$el\n inputInitialHeight =\n inputEl?.offsetHeight \|\|\n INPUT_HEIGHT_MAP[realSize.value] \|\|\n DEFAULT_INPUT_HEIGHT\n addResizeListener(inputEl, updateStyle)\n })\n\n onBeforeUnmount(() => {\n removeResizeListener(input.value?.$el, updateStyle)\n })\n\n return {\n popperOptions,\n tooltipRef,\n popperPaneRef,\n input,\n tagWrapper,\n panel,\n suggestionPanel,\n popperVisible,\n inputHover,\n inputPlaceholder,\n filtering,\n presentText,\n checkedValue,\n inputValue,\n searchInputValue,\n presentTags,\n suggestions,\n isDisabled,\n isOnComposition,\n realSize,\n tagSize,\n multiple,\n readonly,\n clearBtnVisible,\n t,\n togglePopperVisible,\n hideSuggestionPanel,\n deleteTag,\n focusFirstNode,\n getCheckedNodes,\n handleExpandChange,\n handleKeyDown,\n handleComposition,\n handleClear,\n handleSuggestionClick,\n handleSuggestionKeyDown,\n handleDelete,\n handleInput,\n }\n },\n})\n</script>\n"],"names":["_createVNode","_withCtx","_renderSlot"],"mappings":";;;;;;;;;EAsE6B,KAAI;EAAa;;;;8CAmED;;;;;;;;;;;;;;wBAxI3C;IACE;IACQ;;IACP;IACA;IACA,kBAAgB;IAChB;IACA;IACA;IACD;IACA,UAAU,EAAC;IACX,MAAM,EAAC;;IAEP;;;;;;;;;;QAWK,2CAAa;;QAEbA,eAAU;;;;UAIT;;;;UAEC;UACA,UAAU;UACV,4BAAoB;UACpB,kBAAgB;UAChB,mBAAc;UACd;UACA,kBAAgB,wBAAmB;UACnC;UACA;;UAEA,MAAI;iBACC;;;;;qBAKC,EAACC;;;;;;;;;;;uBASE;;;;;kBAKL;;;;;;;;;;;;;;qBAUC,EAAE,OAAO;;;sCAGK;;kBAElB;;;;;;;;;mCAMqB;;;sGACS;;;iCAGhB;;;;oBAIb;oBACA;;;;;;;;;;;;;;;;;sBAQP;;aAEM;;;;QAGH,KAAK;QACL;QACA;QACA;QACA;;;;;;;;;;;;;;;;;kCAca;;;;;sBAKTC,eAAY;+EACqB;;;;;;iCAGL,aAAS;;;;;;;;"}
1	+ {"version":3,"file":"index.vue_vue_type_template_id_0429c2db_lang.js","sources":["../../../../../../packages/components/cascader/src/index.vue?vue&type=template&id=0429c2db&lang.js"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-model:visible=\"popperVisible\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-cascader__dropdown ${popperClass}`\"\n :popper-options=\"popperOptions\"\n :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n :stop-popper-mouse-event=\"false\"\n :gpu-acceleration=\"false\"\n placement=\"bottom-start\"\n transition=\"el-zoom-in-top\"\n effect=\"light\"\n pure\n persistent\n @hide=\"hideSuggestionPanel\"\n >\n <template #default>\n <div\n v-clickoutside:[popperPaneRef]=\"() => togglePopperVisible(false)\"\n :class=\"[\n 'el-cascader',\n realSize && `el-cascader--${realSize}`,\n { 'is-disabled': isDisabled },\n $attrs.class,\n ]\"\n :style=\"$attrs.style\"\n @click=\"() => togglePopperVisible(readonly ? undefined : true)\"\n @keydown=\"handleKeyDown\"\n @mouseenter=\"inputHover = true\"\n @mouseleave=\"inputHover = false\"\n >\n <el-input\n ref=\"input\"\n v-model.trim=\"inputValue\"\n :placeholder=\"inputPlaceholder\"\n :readonly=\"readonly\"\n :disabled=\"isDisabled\"\n :validate-event=\"false\"\n :size=\"realSize\"\n :class=\"{ 'is-focus': popperVisible }\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n @focus=\"(e) => $emit('focus', e)\"\n @blur=\"(e) => $emit('blur', e)\"\n @input=\"handleInput\"\n >\n <template #suffix>\n <el-icon\n v-if=\"clearBtnVisible\"\n key=\"clear\"\n class=\"el-input__icon icon-circle-close\"\n @click.stop=\"handleClear\"\n >\n <circle-close />\n </el-icon>\n <el-icon\n v-else\n key=\"arrow-down\"\n :class=\"[\n 'el-input__icon',\n 'icon-arrow-down',\n popperVisible && 'is-reverse',\n ]\"\n @click.stop=\"togglePopperVisible()\"\n >\n <arrow-down />\n </el-icon>\n </template>\n </el-input>\n\n <div v-if=\"multiple\" ref=\"tagWrapper\" class=\"el-cascader__tags\">\n <el-tag\n v-for=\"tag in presentTags\"\n :key=\"tag.key\"\n type=\"info\"\n :size=\"tagSize\"\n :hit=\"tag.hitState\"\n :closable=\"tag.closable\"\n disable-transitions\n @close=\"deleteTag(tag)\"\n >\n <span>{{ tag.text }}</span>\n </el-tag>\n <input\n v-if=\"filterable && !isDisabled\"\n v-model.trim=\"searchInputValue\"\n type=\"text\"\n class=\"el-cascader__search-input\"\n :placeholder=\"presentText ? '' : inputPlaceholder\"\n @input=\"(e) => handleInput(searchInputValue, e)\"\n @click.stop=\"togglePopperVisible(true)\"\n @keydown.delete=\"handleDelete\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n />\n </div>\n </div>\n </template>\n\n <template #content>\n <el-cascader-panel\n v-show=\"!filtering\"\n ref=\"panel\"\n v-model=\"checkedValue\"\n :options=\"options\"\n :props=\"props\"\n :border=\"false\"\n :render-label=\"$slots.default\"\n @expand-change=\"handleExpandChange\"\n @close=\"$nextTick(() => togglePopperVisible(false))\"\n />\n <el-scrollbar\n v-if=\"filterable\"\n v-show=\"filtering\"\n ref=\"suggestionPanel\"\n tag=\"ul\"\n class=\"el-cascader__suggestion-panel\"\n view-class=\"el-cascader__suggestion-list\"\n @keydown=\"handleSuggestionKeyDown\"\n >\n <template v-if=\"suggestions.length\">\n <li\n v-for=\"item in suggestions\"\n :key=\"item.uid\"\n :class=\"[\n 'el-cascader__suggestion-item',\n item.checked && 'is-checked',\n ]\"\n :tabindex=\"-1\"\n @click=\"handleSuggestionClick(item)\"\n >\n <span>{{ item.text }}</span>\n <el-icon v-if=\"item.checked\"><check /></el-icon>\n </li>\n </template>\n <slot v-else name=\"empty\">\n <li class=\"el-cascader__empty-text\">\n {{ t('el.cascader.noMatch') }}\n </li>\n </slot>\n </el-scrollbar>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n inject,\n nextTick,\n onMounted,\n onBeforeUnmount,\n ref,\n watch,\n} from 'vue'\nimport { isPromise } from '@vue/shared'\nimport debounce from 'lodash/debounce'\n\nimport { isClient } from '@vueuse/core'\nimport ElCascaderPanel, {\n CommonProps,\n} from '@element-plus/components/cascader-panel'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\n\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\nimport { ClickOutside as Clickoutside } from '@element-plus/directives'\nimport { useLocale, useSize } from '@element-plus/hooks'\n\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport {\n addResizeListener,\n removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { isKorean } from '@element-plus/utils/isDef'\nimport { CircleClose, Check, ArrowDown } from '@element-plus/icons-vue'\n\nimport type { Options } from '@element-plus/components/popper'\nimport type { ComputedRef, PropType, Ref } from 'vue'\nimport type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'\nimport type {\n CascaderValue,\n CascaderNode,\n Tag,\n} from '@element-plus/components/cascader-panel'\nimport type { ComponentSize } from '@element-plus/utils/types'\n\ntype cascaderPanelType = InstanceType<typeof ElCascaderPanel>\ntype tooltipType = InstanceType<typeof ElTooltip>\ntype inputType = InstanceType<typeof ElInput>\ntype suggestionPanelType = InstanceType<typeof ElScrollbar>\n\nconst DEFAULT_INPUT_HEIGHT = 40\n\nconst INPUT_HEIGHT_MAP = {\n large: 36,\n default: 32,\n small: 28,\n}\n\nconst popperOptions: Partial<Options> = {\n modifiers: [\n {\n name: 'arrowPosition',\n enabled: true,\n phase: 'main',\n fn: ({ state }) => {\n const { modifiersData, placement } = state as any\n if (['right', 'left'].includes(placement)) return\n modifiersData.arrow.x = 35\n },\n requires: ['arrow'],\n },\n ],\n}\n\nexport default defineComponent({\n name: 'ElCascader',\n\n components: {\n ElCascaderPanel,\n ElInput,\n ElTooltip,\n ElScrollbar,\n ElTag,\n ElIcon,\n CircleClose,\n Check,\n ArrowDown,\n },\n\n directives: {\n Clickoutside,\n },\n\n props: {\n ...CommonProps,\n size: {\n type: String as PropType<ComponentSize>,\n validator: isValidComponentSize,\n },\n placeholder: {\n type: String,\n },\n disabled: Boolean,\n clearable: Boolean,\n filterable: Boolean,\n filterMethod: {\n type: Function as PropType<\n (node: CascaderNode, keyword: string) => boolean\n >,\n default: (node: CascaderNode, keyword: string) =>\n node.text.includes(keyword),\n },\n separator: {\n type: String,\n default: ' / ',\n },\n showAllLevels: {\n type: Boolean,\n default: true,\n },\n collapseTags: Boolean,\n debounce: {\n type: Number,\n default: 300,\n },\n beforeFilter: {\n type: Function as PropType<(value: string) => boolean \| Promise<any>>,\n default: () => true,\n },\n popperClass: {\n type: String,\n default: '',\n },\n popperAppendToBody: {\n type: Boolean,\n default: true,\n },\n },\n\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'focus',\n 'blur',\n 'visible-change',\n 'expand-change',\n 'remove-tag',\n ],\n\n setup(props, { emit }) {\n let inputInitialHeight = 0\n let pressDeleteCount = 0\n\n const { t } = useLocale()\n const elForm = inject(elFormKey, {} as ElFormContext)\n const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n const tooltipRef: Ref<tooltipType \| null> = ref(null)\n const input: Ref<inputType \| null> = ref(null)\n const tagWrapper = ref(null)\n const panel: Ref<cascaderPanelType \| null> = ref(null)\n const suggestionPanel: Ref<suggestionPanelType \| null> = ref(null)\n const popperVisible = ref(false)\n const inputHover = ref(false)\n const filtering = ref(false)\n const inputValue = ref('')\n const searchInputValue = ref('')\n const presentTags: Ref<Tag[]> = ref([])\n const suggestions: Ref<CascaderNode[]> = ref([])\n const isOnComposition = ref(false)\n\n const isDisabled = computed(() => props.disabled \|\| elForm.disabled)\n const inputPlaceholder = computed(\n () => props.placeholder \|\| t('el.cascader.placeholder')\n )\n const realSize = useSize()\n const tagSize = computed(() =>\n ['small'].includes(realSize.value) ? 'small' : 'default'\n )\n const multiple = computed(() => !!props.props.multiple)\n const readonly = computed(() => !props.filterable \|\| multiple.value)\n const searchKeyword = computed(() =>\n multiple.value ? searchInputValue.value : inputValue.value\n )\n const checkedNodes: ComputedRef<CascaderNode[]> = computed(\n () => panel.value?.checkedNodes \|\| []\n )\n const clearBtnVisible = computed(() => {\n if (\n !props.clearable \|\|\n isDisabled.value \|\|\n filtering.value \|\|\n !inputHover.value\n )\n return false\n\n return !!checkedNodes.value.length\n })\n const presentText = computed(() => {\n const { showAllLevels, separator } = props\n const nodes = checkedNodes.value\n return nodes.length\n ? multiple.value\n ? ' '\n : nodes[0].calcText(showAllLevels, separator)\n : ''\n })\n\n const checkedValue = computed<CascaderValue>({\n get() {\n return props.modelValue\n },\n set(val) {\n emit(UPDATE_MODEL_EVENT, val)\n emit(CHANGE_EVENT, val)\n elFormItem.validate?.('change')\n },\n })\n\n const popperPaneRef = computed(() => {\n return tooltipRef.value?.popperRef?.contentRef\n })\n\n const togglePopperVisible = (visible?: boolean) => {\n if (isDisabled.value) return\n\n visible = visible ?? !popperVisible.value\n\n if (visible !== popperVisible.value) {\n popperVisible.value = visible\n input.value?.input?.setAttribute('aria-expanded', `${visible}`)\n\n if (visible) {\n updatePopperPosition()\n nextTick(panel.value?.scrollToExpandingNode)\n } else if (props.filterable) {\n const { value } = presentText\n inputValue.value = value\n searchInputValue.value = value\n }\n\n emit('visible-change', visible)\n }\n }\n\n const updatePopperPosition = () => {\n nextTick(() => {\n tooltipRef.value?.updatePopper()\n })\n }\n\n const hideSuggestionPanel = () => {\n filtering.value = false\n }\n\n const genTag = (node: CascaderNode): Tag => {\n const { showAllLevels, separator } = props\n return {\n node,\n key: node.uid,\n text: node.calcText(showAllLevels, separator),\n hitState: false,\n closable: !isDisabled.value && !node.isDisabled,\n }\n }\n\n const deleteTag = (tag: Tag) => {\n const node = tag.node as CascaderNode\n node.doCheck(false)\n panel.value?.calculateCheckedValue()\n emit('remove-tag', node.valueByOption)\n }\n\n const calculatePresentTags = () => {\n if (!multiple.value) return\n\n const nodes = checkedNodes.value\n const tags: Tag[] = []\n\n if (nodes.length) {\n const [first, ...rest] = nodes\n const restCount = rest.length\n\n tags.push(genTag(first))\n\n if (restCount) {\n if (props.collapseTags) {\n tags.push({\n key: -1,\n text: `+ ${restCount}`,\n closable: false,\n })\n } else {\n rest.forEach((node) => tags.push(genTag(node)))\n }\n }\n }\n\n presentTags.value = tags\n }\n\n const calculateSuggestions = () => {\n const { filterMethod, showAllLevels, separator } = props\n const res = panel.value\n ?.getFlattedNodes(!props.props.checkStrictly)\n ?.filter((node) => {\n if (node.isDisabled) return false\n node.calcText(showAllLevels, separator)\n return filterMethod(node, searchKeyword.value)\n })\n\n if (multiple.value) {\n presentTags.value.forEach((tag) => {\n tag.hitState = false\n })\n }\n\n filtering.value = true\n suggestions.value = res!\n updatePopperPosition()\n }\n\n const focusFirstNode = () => {\n let firstNode!: HTMLElement\n\n if (filtering.value && suggestionPanel.value) {\n firstNode = suggestionPanel.value.$el.querySelector(\n '.el-cascader__suggestion-item'\n )\n } else {\n firstNode = panel.value?.$el.querySelector(\n '.el-cascader-node[tabindex=\"-1\"]'\n )\n }\n\n if (firstNode) {\n firstNode.focus()\n !filtering.value && firstNode.click()\n }\n }\n\n const updateStyle = () => {\n const inputInner = input.value?.input\n const tagWrapperEl = tagWrapper.value\n const suggestionPanelEl = suggestionPanel.value?.$el\n\n if (!isClient \|\| !inputInner) return\n\n if (suggestionPanelEl) {\n const suggestionList = suggestionPanelEl.querySelector(\n '.el-cascader__suggestion-list'\n )\n suggestionList.style.minWidth = `${inputInner.offsetWidth}px`\n }\n\n if (tagWrapperEl) {\n const { offsetHeight } = tagWrapperEl\n const height =\n presentTags.value.length > 0\n ? `${Math.max(offsetHeight + 6, inputInitialHeight)}px`\n : `${inputInitialHeight}px`\n inputInner.style.height = height\n updatePopperPosition()\n }\n }\n\n const getCheckedNodes = (leafOnly: boolean) => {\n return panel.value?.getCheckedNodes(leafOnly)\n }\n\n const handleExpandChange = (value: CascaderValue) => {\n updatePopperPosition()\n emit('expand-change', value)\n }\n\n const handleComposition = (event: CompositionEvent) => {\n const text = (event.target as HTMLInputElement)?.value\n if (event.type === 'compositionend') {\n isOnComposition.value = false\n nextTick(() => handleInput(text))\n } else {\n const lastCharacter = text[text.length - 1] \|\| ''\n isOnComposition.value = !isKorean(lastCharacter)\n }\n }\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (isOnComposition.value) return\n\n switch (e.code) {\n case EVENT_CODE.enter:\n togglePopperVisible()\n break\n case EVENT_CODE.down:\n togglePopperVisible(true)\n nextTick(focusFirstNode)\n e.preventDefault()\n break\n case EVENT_CODE.esc:\n case EVENT_CODE.tab:\n togglePopperVisible(false)\n break\n }\n }\n\n const handleClear = () => {\n panel.value?.clearCheckedNodes()\n togglePopperVisible(false)\n }\n\n const handleSuggestionClick = (node: CascaderNode) => {\n const { checked } = node\n\n if (multiple.value) {\n panel.value?.handleCheckChange(node, !checked, false)\n } else {\n !checked && panel.value?.handleCheckChange(node, true, false)\n togglePopperVisible(false)\n }\n }\n\n const handleSuggestionKeyDown = (e: KeyboardEvent) => {\n const target = e.target as HTMLElement\n const { code } = e\n\n switch (code) {\n case EVENT_CODE.up:\n case EVENT_CODE.down: {\n const distance = code === EVENT_CODE.up ? -1 : 1\n focusNode(\n getSibling(\n target,\n distance,\n '.el-cascader__suggestion-item[tabindex=\"-1\"]'\n )\n )\n break\n }\n case EVENT_CODE.enter:\n target.click()\n break\n case EVENT_CODE.esc:\n case EVENT_CODE.tab:\n togglePopperVisible(false)\n break\n }\n }\n\n const handleDelete = () => {\n const tags = presentTags.value\n const lastTag = tags[tags.length - 1]\n pressDeleteCount = searchInputValue.value ? 0 : pressDeleteCount + 1\n\n if (!lastTag \|\| !pressDeleteCount) return\n\n if (lastTag.hitState) {\n deleteTag(lastTag)\n } else {\n lastTag.hitState = true\n }\n }\n\n const handleFilter = debounce(() => {\n const { value } = searchKeyword\n\n if (!value) return\n\n const passed = props.beforeFilter(value)\n\n if (isPromise(passed)) {\n passed.then(calculateSuggestions).catch(() => {\n /* prevent log error */\n })\n } else if (passed !== false) {\n calculateSuggestions()\n } else {\n hideSuggestionPanel()\n }\n }, props.debounce)\n\n const handleInput = (val: string, e?: KeyboardEvent) => {\n !popperVisible.value && togglePopperVisible(true)\n\n if (e?.isComposing) return\n\n val ? handleFilter() : hideSuggestionPanel()\n }\n\n watch(filtering, updatePopperPosition)\n\n watch([checkedNodes, isDisabled], calculatePresentTags)\n\n watch(presentTags, () => {\n nextTick(() => updateStyle())\n })\n\n watch(presentText, (val) => (inputValue.value = val), { immediate: true })\n\n onMounted(() => {\n const inputEl = input.value?.$el\n inputInitialHeight =\n inputEl?.offsetHeight \|\|\n INPUT_HEIGHT_MAP[realSize.value] \|\|\n DEFAULT_INPUT_HEIGHT\n addResizeListener(inputEl, updateStyle)\n })\n\n onBeforeUnmount(() => {\n removeResizeListener(input.value?.$el, updateStyle)\n })\n\n return {\n popperOptions,\n tooltipRef,\n popperPaneRef,\n input,\n tagWrapper,\n panel,\n suggestionPanel,\n popperVisible,\n inputHover,\n inputPlaceholder,\n filtering,\n presentText,\n checkedValue,\n inputValue,\n searchInputValue,\n presentTags,\n suggestions,\n isDisabled,\n isOnComposition,\n realSize,\n tagSize,\n multiple,\n readonly,\n clearBtnVisible,\n t,\n togglePopperVisible,\n hideSuggestionPanel,\n deleteTag,\n focusFirstNode,\n getCheckedNodes,\n handleExpandChange,\n handleKeyDown,\n handleComposition,\n handleClear,\n handleSuggestionClick,\n handleSuggestionKeyDown,\n handleDelete,\n handleInput,\n }\n },\n})\n</script>\n"],"names":["_createVNode","_withCtx","_renderSlot"],"mappings":";;;;;;;;;EAwE6B,KAAI;EAAa;;;;8CAmED;;;;;;;;;;;;;;wBA1I3C;IACE;IACQ;;IACP;IACA;IACA,kBAAgB;IAChB;IACA;IACA;IACD;IACA,UAAU,EAAC;IACX,MAAM,EAAC;;IAEP;;;;;;;;;;;QAYK,uBAAO,YAAO;QACd,2CAAa;;QAEbA,eAAU;;;;UAIT;;;;UAEC;UACA,UAAU;UACV,4BAAoB;UACpB,kBAAgB;UAChB,mBAAc;UACd;UACA,kBAAgB,wBAAmB;UACnC;UACA;;UAEA,MAAI;iBACC;;;;;qBAKC,EAACC;;;;;;;;;;;uBASE;;;;;kBAKL;;;;;;;;;;;;;;qBAUC,EAAE,OAAO;;;sCAGK;;kBAElB;;;;;;;;;mCAMqB;;;sGACS;;;iCAGhB;;;;oBAIb;oBACA;;;;;;;;;;;;;;;;;sBAQP;;aAEM;;;;QAGH,KAAK;QACL;QACA;QACA;QACA;;;;;;;;;;;;;;;;;kCAca;;;;;sBAKTC,eAAY;+EACqB;;;;;;iCAGL,aAAS;;;;;;;;"}

package/lib/components/cascader/style/css.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import '@element-plus/components/base/style/css';
-import '@element-plus/theme-chalk/el-cascader.css';
-import '@element-plus/components/input/style/css';
-import '@element-plus/components/popper/style/css';
-import '@element-plus/components/tag/style/css';
-import '@element-plus/components/cascader-panel/style/css';
+import 'element-plus/es/components/base/style/css';
+import 'element-plus/theme-chalk/el-cascader.css';
+import 'element-plus/es/components/input/style/css';
+import 'element-plus/es/components/popper/style/css';
+import 'element-plus/es/components/tag/style/css';
+import 'element-plus/es/components/cascader-panel/style/css';

package/lib/components/cascader/style/index.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import '@element-plus/components/base/style';
-import '@element-plus/theme-chalk/src/cascader.scss';
-import '@element-plus/components/input/style/index';
-import '@element-plus/components/popper/style/index';
-import '@element-plus/components/tag/style/index';
-import '@element-plus/components/cascader-panel/style/index';
+import 'element-plus/es/components/base/style';
+import 'element-plus/theme-chalk/src/cascader.scss';
+import 'element-plus/es/components/input/style/index';
+import 'element-plus/es/components/popper/style/index';
+import 'element-plus/es/components/tag/style/index';
+import 'element-plus/es/components/cascader-panel/style/index';

package/lib/components/cascader-panel/index.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { SFCWithInstall } from '@element-plus/utils/types';
+import type { SFCWithInstall } from 'element-plus/es/utils/types';
 declare const _CascaderPanel: SFCWithInstall<import("vue").DefineComponent<{
     border: {
         type: BooleanConstructor;
@@ -139,16 +139,16 @@ declare const _CascaderPanel: SFCWithInstall<import("vue").DefineComponent<{
     clearCheckedNodes: () => void;
     calculateCheckedValue: () => void;
     scrollToExpandingNode: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "close" | "update:modelValue" | "expand-change")[], "change" | "close" | "update:modelValue" | "expand-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "close" | "expand-change")[], "update:modelValue" | "change" | "close" | "expand-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     border?: unknown;
     renderLabel?: unknown;
     modelValue?: unknown;
     options?: unknown;
     props?: unknown;
 } & {
+    props: import("./src/node").CascaderProps;
     border: boolean;
     options: import("./src/node").CascaderOption[];
-    props: import("./src/node").CascaderProps;
 } & {
     modelValue?: import("./src/node").CascaderValue | undefined;
     renderLabel?: import("./src/node").RenderLabel | undefined;
@@ -158,9 +158,9 @@ declare const _CascaderPanel: SFCWithInstall<import("vue").DefineComponent<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     "onExpand-change"?: ((...args: any[]) => any) | undefined;
 }, {
+    props: import("./src/node").CascaderProps;
     border: boolean;
     options: import("./src/node").CascaderOption[];
-    props: import("./src/node").CascaderProps;
 }>>;
 export default _CascaderPanel;
 export declare const ElCascaderPanel: SFCWithInstall<import("vue").DefineComponent<{
@@ -303,16 +303,16 @@ export declare const ElCascaderPanel: SFCWithInstall<import("vue").DefineCompone
     clearCheckedNodes: () => void;
     calculateCheckedValue: () => void;
     scrollToExpandingNode: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "close" | "update:modelValue" | "expand-change")[], "change" | "close" | "update:modelValue" | "expand-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "close" | "expand-change")[], "update:modelValue" | "change" | "close" | "expand-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     border?: unknown;
     renderLabel?: unknown;
     modelValue?: unknown;
     options?: unknown;
     props?: unknown;
 } & {
+    props: import("./src/node").CascaderProps;
     border: boolean;
     options: import("./src/node").CascaderOption[];
-    props: import("./src/node").CascaderProps;
 } & {
     modelValue?: import("./src/node").CascaderValue | undefined;
     renderLabel?: import("./src/node").RenderLabel | undefined;
@@ -322,9 +322,9 @@ export declare const ElCascaderPanel: SFCWithInstall<import("vue").DefineCompone
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     "onExpand-change"?: ((...args: any[]) => any) | undefined;
 }, {
+    props: import("./src/node").CascaderProps;
     border: boolean;
     options: import("./src/node").CascaderOption[];
-    props: import("./src/node").CascaderProps;
 }>>;
 export * from './src/types';
 export * from './src/config';

package/lib/components/cascader-panel/src/index.vue.d.ts CHANGED Viewed

@@ -141,16 +141,16 @@ declare const _default: import("vue").DefineComponent<{
     clearCheckedNodes: () => void;
     calculateCheckedValue: () => void;
     scrollToExpandingNode: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "close" | "update:modelValue" | "expand-change")[], "change" | "close" | "update:modelValue" | "expand-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "close" | "expand-change")[], "update:modelValue" | "change" | "close" | "expand-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     border?: unknown;
     renderLabel?: unknown;
     modelValue?: unknown;
     options?: unknown;
     props?: unknown;
 } & {
+    props: import("./node").CascaderProps;
     border: boolean;
     options: CascaderOption[];
-    props: import("./node").CascaderProps;
 } & {
     modelValue?: CascaderValue | undefined;
     renderLabel?: RenderLabel | undefined;
@@ -160,8 +160,8 @@ declare const _default: import("vue").DefineComponent<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     "onExpand-change"?: ((...args: any[]) => any) | undefined;
 }, {
+    props: import("./node").CascaderProps;
     border: boolean;
     options: CascaderOption[];
-    props: import("./node").CascaderProps;
 }>;
 export default _default;

package/lib/components/cascader-panel/src/menu.vue.d.ts CHANGED Viewed

@@ -15,7 +15,7 @@ declare const _default: import("vue").DefineComponent<{
     isEmpty: import("vue").ComputedRef<boolean>;
     isLoading: import("vue").ComputedRef<boolean>;
     menuId: import("vue").ComputedRef<string>;
-    t: import("@element-plus/hooks").Translator;
+    t: import("element-plus/es/hooks").Translator;
     handleExpand: (e: MouseEvent) => void;
     handleMouseMove: (e: MouseEvent) => void;
     clearHoverZone: () => void;

package/lib/components/cascader-panel/src/store.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import Node from './node';
-import type { Nullable } from '@element-plus/utils/types';
+import type { Nullable } from 'element-plus/es/utils/types';
 import type { CascaderNodeValue, CascaderNodePathValue, CascaderOption, CascaderConfig } from './node';
 export default class Store {
     readonly config: CascaderConfig;

package/lib/components/cascader-panel/src/types.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import type { VNode, InjectionKey } from 'vue';
-import type { Nullable } from '@element-plus/utils/types';
+import type { Nullable } from 'element-plus/es/utils/types';
 import type { default as CascaderNode } from './node';
 export type { CascaderNode };
 export declare type CascaderNodeValue = string | number;

package/lib/components/cascader-panel/style/css.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import '@element-plus/components/base/style/css';
-import '@element-plus/theme-chalk/el-cascader-panel.css';
-import '@element-plus/components/checkbox/style/css';
-import '@element-plus/components/radio/style/css';
-import '@element-plus/components/scrollbar/style/css';
+import 'element-plus/es/components/base/style/css';
+import 'element-plus/theme-chalk/el-cascader-panel.css';
+import 'element-plus/es/components/checkbox/style/css';
+import 'element-plus/es/components/radio/style/css';
+import 'element-plus/es/components/scrollbar/style/css';

package/lib/components/cascader-panel/style/index.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import '@element-plus/components/base/style';
-import '@element-plus/theme-chalk/src/cascader-panel.scss';
-import '@element-plus/components/checkbox/style/index';
-import '@element-plus/components/radio/style/index';
-import '@element-plus/components/scrollbar/style/index';
+import 'element-plus/es/components/base/style';
+import 'element-plus/theme-chalk/src/cascader-panel.scss';
+import 'element-plus/es/components/checkbox/style/index';
+import 'element-plus/es/components/radio/style/index';
+import 'element-plus/es/components/scrollbar/style/index';

package/lib/components/check-tag/style/css.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import '@element-plus/components/base/style/css';
-import '@element-plus/theme-chalk/el-check-tag.css';
+import 'element-plus/es/components/base/style/css';
+import 'element-plus/theme-chalk/el-check-tag.css';

package/lib/components/check-tag/style/index.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import '@element-plus/components/base/style';
-import '@element-plus/theme-chalk/src/check-tag.scss';
+import 'element-plus/es/components/base/style';
+import 'element-plus/theme-chalk/src/check-tag.scss';