123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646 |
- 'use strict';
- Object.defineProperty(exports, '__esModule', { value: true });
- var vue = require('vue');
- var lodashUnified = require('lodash-unified');
- var core = require('@vueuse/core');
- var index$9 = require('../../cascader-panel/index.js');
- var index$5 = require('../../input/index.js');
- var index$4 = require('../../tooltip/index.js');
- var index$a = require('../../scrollbar/index.js');
- var index$7 = require('../../tag/index.js');
- var index$6 = require('../../icon/index.js');
- var iconsVue = require('@element-plus/icons-vue');
- var cascader = require('./cascader2.js');
- var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
- var index$8 = require('../../../directives/click-outside/index.js');
- var index = require('../../../hooks/use-namespace/index.js');
- var index$1 = require('../../../hooks/use-locale/index.js');
- var useFormItem = require('../../form/src/hooks/use-form-item.js');
- var index$2 = require('../../../hooks/use-empty-values/index.js');
- var index$3 = require('../../../hooks/use-composition/index.js');
- var useFormCommonProps = require('../../form/src/hooks/use-form-common-props.js');
- var event = require('../../../constants/event.js');
- var error = require('../../../utils/error.js');
- var shared = require('@vue/shared');
- var aria = require('../../../constants/aria.js');
- var aria$1 = require('../../../utils/dom/aria.js');
- const COMPONENT_NAME = "ElCascader";
- const __default__ = vue.defineComponent({
- name: COMPONENT_NAME
- });
- const _sfc_main = /* @__PURE__ */ vue.defineComponent({
- ...__default__,
- props: cascader.cascaderProps,
- emits: cascader.cascaderEmits,
- setup(__props, { expose, emit }) {
- const props = __props;
- const popperOptions = {
- modifiers: [
- {
- name: "arrowPosition",
- enabled: true,
- phase: "main",
- fn: ({ state }) => {
- const { modifiersData, placement } = state;
- if (["right", "left", "bottom", "top"].includes(placement))
- return;
- modifiersData.arrow.x = 35;
- },
- requires: ["arrow"]
- }
- ]
- };
- const attrs = vue.useAttrs();
- let inputInitialHeight = 0;
- let pressDeleteCount = 0;
- const nsCascader = index.useNamespace("cascader");
- const nsInput = index.useNamespace("input");
- const { t } = index$1.useLocale();
- const { form, formItem } = useFormItem.useFormItem();
- const { valueOnClear } = index$2.useEmptyValues(props);
- const { isComposing, handleComposition } = index$3.useComposition({
- afterComposition(event) {
- var _a;
- const text = (_a = event.target) == null ? void 0 : _a.value;
- handleInput(text);
- }
- });
- const tooltipRef = vue.ref(null);
- const input = vue.ref(null);
- const tagWrapper = vue.ref(null);
- const cascaderPanelRef = vue.ref(null);
- const suggestionPanel = vue.ref(null);
- const popperVisible = vue.ref(false);
- const inputHover = vue.ref(false);
- const filtering = vue.ref(false);
- const filterFocus = vue.ref(false);
- const inputValue = vue.ref("");
- const searchInputValue = vue.ref("");
- const presentTags = vue.ref([]);
- const allPresentTags = vue.ref([]);
- const suggestions = vue.ref([]);
- const cascaderStyle = vue.computed(() => {
- return attrs.style;
- });
- const isDisabled = vue.computed(() => props.disabled || (form == null ? void 0 : form.disabled));
- const inputPlaceholder = vue.computed(() => props.placeholder || t("el.cascader.placeholder"));
- const currentPlaceholder = vue.computed(() => searchInputValue.value || presentTags.value.length > 0 || isComposing.value ? "" : inputPlaceholder.value);
- const realSize = useFormCommonProps.useFormSize();
- const tagSize = vue.computed(() => realSize.value === "small" ? "small" : "default");
- const multiple = vue.computed(() => !!props.props.multiple);
- const readonly = vue.computed(() => !props.filterable || multiple.value);
- const searchKeyword = vue.computed(() => multiple.value ? searchInputValue.value : inputValue.value);
- const checkedNodes = vue.computed(() => {
- var _a;
- return ((_a = cascaderPanelRef.value) == null ? void 0 : _a.checkedNodes) || [];
- });
- const clearBtnVisible = vue.computed(() => {
- if (!props.clearable || isDisabled.value || filtering.value || !inputHover.value)
- return false;
- return !!checkedNodes.value.length;
- });
- const presentText = vue.computed(() => {
- const { showAllLevels, separator } = props;
- const nodes = checkedNodes.value;
- return nodes.length ? multiple.value ? "" : nodes[0].calcText(showAllLevels, separator) : "";
- });
- const validateState = vue.computed(() => (formItem == null ? void 0 : formItem.validateState) || "");
- const checkedValue = vue.computed({
- get() {
- return lodashUnified.cloneDeep(props.modelValue);
- },
- set(val) {
- const value = val != null ? val : valueOnClear.value;
- emit(event.UPDATE_MODEL_EVENT, value);
- emit(event.CHANGE_EVENT, value);
- if (props.validateEvent) {
- formItem == null ? void 0 : formItem.validate("change").catch((err) => error.debugWarn(err));
- }
- }
- });
- const cascaderKls = vue.computed(() => {
- return [
- nsCascader.b(),
- nsCascader.m(realSize.value),
- nsCascader.is("disabled", isDisabled.value),
- attrs.class
- ];
- });
- const cascaderIconKls = vue.computed(() => {
- return [
- nsInput.e("icon"),
- "icon-arrow-down",
- nsCascader.is("reverse", popperVisible.value)
- ];
- });
- const inputClass = vue.computed(() => {
- return nsCascader.is("focus", popperVisible.value || filterFocus.value);
- });
- const contentRef = vue.computed(() => {
- var _a, _b;
- return (_b = (_a = tooltipRef.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.contentRef;
- });
- const togglePopperVisible = (visible) => {
- var _a, _b, _c;
- if (isDisabled.value)
- return;
- visible = visible != null ? visible : !popperVisible.value;
- if (visible !== popperVisible.value) {
- popperVisible.value = visible;
- (_b = (_a = input.value) == null ? void 0 : _a.input) == null ? void 0 : _b.setAttribute("aria-expanded", `${visible}`);
- if (visible) {
- updatePopperPosition();
- vue.nextTick((_c = cascaderPanelRef.value) == null ? void 0 : _c.scrollToExpandingNode);
- } else if (props.filterable) {
- syncPresentTextValue();
- }
- emit("visibleChange", visible);
- }
- };
- const updatePopperPosition = () => {
- vue.nextTick(() => {
- var _a;
- (_a = tooltipRef.value) == null ? void 0 : _a.updatePopper();
- });
- };
- const hideSuggestionPanel = () => {
- filtering.value = false;
- };
- const genTag = (node) => {
- const { showAllLevels, separator } = props;
- return {
- node,
- key: node.uid,
- text: node.calcText(showAllLevels, separator),
- hitState: false,
- closable: !isDisabled.value && !node.isDisabled,
- isCollapseTag: false
- };
- };
- const deleteTag = (tag) => {
- var _a;
- const node = tag.node;
- node.doCheck(false);
- (_a = cascaderPanelRef.value) == null ? void 0 : _a.calculateCheckedValue();
- emit("removeTag", node.valueByOption);
- };
- const calculatePresentTags = () => {
- if (!multiple.value)
- return;
- const nodes = checkedNodes.value;
- const tags = [];
- const allTags = [];
- nodes.forEach((node) => allTags.push(genTag(node)));
- allPresentTags.value = allTags;
- if (nodes.length) {
- nodes.slice(0, props.maxCollapseTags).forEach((node) => tags.push(genTag(node)));
- const rest = nodes.slice(props.maxCollapseTags);
- const restCount = rest.length;
- if (restCount) {
- if (props.collapseTags) {
- tags.push({
- key: -1,
- text: `+ ${restCount}`,
- closable: false,
- isCollapseTag: true
- });
- } else {
- rest.forEach((node) => tags.push(genTag(node)));
- }
- }
- }
- presentTags.value = tags;
- };
- const calculateSuggestions = () => {
- var _a, _b;
- const { filterMethod, showAllLevels, separator } = props;
- const res = (_b = (_a = cascaderPanelRef.value) == null ? void 0 : _a.getFlattedNodes(!props.props.checkStrictly)) == null ? void 0 : _b.filter((node) => {
- if (node.isDisabled)
- return false;
- node.calcText(showAllLevels, separator);
- return filterMethod(node, searchKeyword.value);
- });
- if (multiple.value) {
- presentTags.value.forEach((tag) => {
- tag.hitState = false;
- });
- allPresentTags.value.forEach((tag) => {
- tag.hitState = false;
- });
- }
- filtering.value = true;
- suggestions.value = res;
- updatePopperPosition();
- };
- const focusFirstNode = () => {
- var _a;
- let firstNode;
- if (filtering.value && suggestionPanel.value) {
- firstNode = suggestionPanel.value.$el.querySelector(`.${nsCascader.e("suggestion-item")}`);
- } else {
- firstNode = (_a = cascaderPanelRef.value) == null ? void 0 : _a.$el.querySelector(`.${nsCascader.b("node")}[tabindex="-1"]`);
- }
- if (firstNode) {
- firstNode.focus();
- !filtering.value && firstNode.click();
- }
- };
- const updateStyle = () => {
- var _a, _b;
- const inputInner = (_a = input.value) == null ? void 0 : _a.input;
- const tagWrapperEl = tagWrapper.value;
- const suggestionPanelEl = (_b = suggestionPanel.value) == null ? void 0 : _b.$el;
- if (!core.isClient || !inputInner)
- return;
- if (suggestionPanelEl) {
- const suggestionList = suggestionPanelEl.querySelector(`.${nsCascader.e("suggestion-list")}`);
- suggestionList.style.minWidth = `${inputInner.offsetWidth}px`;
- }
- if (tagWrapperEl) {
- const { offsetHeight } = tagWrapperEl;
- const height = presentTags.value.length > 0 ? `${Math.max(offsetHeight, inputInitialHeight) - 2}px` : `${inputInitialHeight}px`;
- inputInner.style.height = height;
- updatePopperPosition();
- }
- };
- const getCheckedNodes = (leafOnly) => {
- var _a;
- return (_a = cascaderPanelRef.value) == null ? void 0 : _a.getCheckedNodes(leafOnly);
- };
- const handleExpandChange = (value) => {
- updatePopperPosition();
- emit("expandChange", value);
- };
- const handleKeyDown = (e) => {
- if (isComposing.value)
- return;
- switch (e.code) {
- case aria.EVENT_CODE.enter:
- case aria.EVENT_CODE.numpadEnter:
- togglePopperVisible();
- break;
- case aria.EVENT_CODE.down:
- togglePopperVisible(true);
- vue.nextTick(focusFirstNode);
- e.preventDefault();
- break;
- case aria.EVENT_CODE.esc:
- if (popperVisible.value === true) {
- e.preventDefault();
- e.stopPropagation();
- togglePopperVisible(false);
- }
- break;
- case aria.EVENT_CODE.tab:
- togglePopperVisible(false);
- break;
- }
- };
- const handleClear = () => {
- var _a;
- (_a = cascaderPanelRef.value) == null ? void 0 : _a.clearCheckedNodes();
- if (!popperVisible.value && props.filterable) {
- syncPresentTextValue();
- }
- togglePopperVisible(false);
- emit("clear");
- };
- const syncPresentTextValue = () => {
- const { value } = presentText;
- inputValue.value = value;
- searchInputValue.value = value;
- };
- const handleSuggestionClick = (node) => {
- var _a, _b;
- const { checked } = node;
- if (multiple.value) {
- (_a = cascaderPanelRef.value) == null ? void 0 : _a.handleCheckChange(node, !checked, false);
- } else {
- !checked && ((_b = cascaderPanelRef.value) == null ? void 0 : _b.handleCheckChange(node, true, false));
- togglePopperVisible(false);
- }
- };
- const handleSuggestionKeyDown = (e) => {
- const target = e.target;
- const { code } = e;
- switch (code) {
- case aria.EVENT_CODE.up:
- case aria.EVENT_CODE.down: {
- e.preventDefault();
- const distance = code === aria.EVENT_CODE.up ? -1 : 1;
- aria$1.focusNode(aria$1.getSibling(target, distance, `.${nsCascader.e("suggestion-item")}[tabindex="-1"]`));
- break;
- }
- case aria.EVENT_CODE.enter:
- case aria.EVENT_CODE.numpadEnter:
- target.click();
- break;
- }
- };
- const handleDelete = () => {
- const tags = presentTags.value;
- const lastTag = tags[tags.length - 1];
- pressDeleteCount = searchInputValue.value ? 0 : pressDeleteCount + 1;
- if (!lastTag || !pressDeleteCount || props.collapseTags && tags.length > 1)
- return;
- if (lastTag.hitState) {
- deleteTag(lastTag);
- } else {
- lastTag.hitState = true;
- }
- };
- const handleFocus = (e) => {
- const el = e.target;
- const name = nsCascader.e("search-input");
- if (el.className === name) {
- filterFocus.value = true;
- }
- emit("focus", e);
- };
- const handleBlur = (e) => {
- filterFocus.value = false;
- emit("blur", e);
- };
- const handleFilter = lodashUnified.debounce(() => {
- const { value } = searchKeyword;
- if (!value)
- return;
- const passed = props.beforeFilter(value);
- if (shared.isPromise(passed)) {
- passed.then(calculateSuggestions).catch(() => {
- });
- } else if (passed !== false) {
- calculateSuggestions();
- } else {
- hideSuggestionPanel();
- }
- }, props.debounce);
- const handleInput = (val, e) => {
- !popperVisible.value && togglePopperVisible(true);
- if (e == null ? void 0 : e.isComposing)
- return;
- val ? handleFilter() : hideSuggestionPanel();
- };
- const getInputInnerHeight = (inputInner) => Number.parseFloat(core.useCssVar(nsInput.cssVarName("input-height"), inputInner).value) - 2;
- vue.watch(filtering, updatePopperPosition);
- vue.watch([checkedNodes, isDisabled, () => props.collapseTags], calculatePresentTags);
- vue.watch(presentTags, () => {
- vue.nextTick(() => updateStyle());
- });
- vue.watch(realSize, async () => {
- await vue.nextTick();
- const inputInner = input.value.input;
- inputInitialHeight = getInputInnerHeight(inputInner) || inputInitialHeight;
- updateStyle();
- });
- vue.watch(presentText, syncPresentTextValue, { immediate: true });
- vue.onMounted(() => {
- const inputInner = input.value.input;
- const inputInnerHeight = getInputInnerHeight(inputInner);
- inputInitialHeight = inputInner.offsetHeight || inputInnerHeight;
- core.useResizeObserver(inputInner, updateStyle);
- });
- expose({
- getCheckedNodes,
- cascaderPanelRef,
- togglePopperVisible,
- contentRef,
- presentText
- });
- return (_ctx, _cache) => {
- return vue.openBlock(), vue.createBlock(vue.unref(index$4.ElTooltip), {
- ref_key: "tooltipRef",
- ref: tooltipRef,
- visible: popperVisible.value,
- teleported: _ctx.teleported,
- "popper-class": [vue.unref(nsCascader).e("dropdown"), _ctx.popperClass],
- "popper-options": popperOptions,
- "fallback-placements": _ctx.fallbackPlacements,
- "stop-popper-mouse-event": false,
- "gpu-acceleration": false,
- placement: _ctx.placement,
- transition: `${vue.unref(nsCascader).namespace.value}-zoom-in-top`,
- effect: "light",
- pure: "",
- persistent: _ctx.persistent,
- onHide: hideSuggestionPanel
- }, {
- default: vue.withCtx(() => [
- vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
- class: vue.normalizeClass(vue.unref(cascaderKls)),
- style: vue.normalizeStyle(vue.unref(cascaderStyle)),
- onClick: () => togglePopperVisible(vue.unref(readonly) ? void 0 : true),
- onKeydown: handleKeyDown,
- onMouseenter: ($event) => inputHover.value = true,
- onMouseleave: ($event) => inputHover.value = false
- }, [
- vue.createVNode(vue.unref(index$5.ElInput), {
- ref_key: "input",
- ref: input,
- modelValue: inputValue.value,
- "onUpdate:modelValue": ($event) => inputValue.value = $event,
- placeholder: vue.unref(currentPlaceholder),
- readonly: vue.unref(readonly),
- disabled: vue.unref(isDisabled),
- "validate-event": false,
- size: vue.unref(realSize),
- class: vue.normalizeClass(vue.unref(inputClass)),
- tabindex: vue.unref(multiple) && _ctx.filterable && !vue.unref(isDisabled) ? -1 : void 0,
- onCompositionstart: vue.unref(handleComposition),
- onCompositionupdate: vue.unref(handleComposition),
- onCompositionend: vue.unref(handleComposition),
- onFocus: handleFocus,
- onBlur: handleBlur,
- onInput: handleInput
- }, vue.createSlots({
- suffix: vue.withCtx(() => [
- vue.unref(clearBtnVisible) ? (vue.openBlock(), vue.createBlock(vue.unref(index$6.ElIcon), {
- key: "clear",
- class: vue.normalizeClass([vue.unref(nsInput).e("icon"), "icon-circle-close"]),
- onClick: vue.withModifiers(handleClear, ["stop"])
- }, {
- default: vue.withCtx(() => [
- vue.createVNode(vue.unref(iconsVue.CircleClose))
- ]),
- _: 1
- }, 8, ["class", "onClick"])) : (vue.openBlock(), vue.createBlock(vue.unref(index$6.ElIcon), {
- key: "arrow-down",
- class: vue.normalizeClass(vue.unref(cascaderIconKls)),
- onClick: vue.withModifiers(($event) => togglePopperVisible(), ["stop"])
- }, {
- default: vue.withCtx(() => [
- vue.createVNode(vue.unref(iconsVue.ArrowDown))
- ]),
- _: 1
- }, 8, ["class", "onClick"]))
- ]),
- _: 2
- }, [
- _ctx.$slots.prefix ? {
- name: "prefix",
- fn: vue.withCtx(() => [
- vue.renderSlot(_ctx.$slots, "prefix")
- ])
- } : void 0
- ]), 1032, ["modelValue", "onUpdate:modelValue", "placeholder", "readonly", "disabled", "size", "class", "tabindex", "onCompositionstart", "onCompositionupdate", "onCompositionend"]),
- vue.unref(multiple) ? (vue.openBlock(), vue.createElementBlock("div", {
- key: 0,
- ref_key: "tagWrapper",
- ref: tagWrapper,
- class: vue.normalizeClass([
- vue.unref(nsCascader).e("tags"),
- vue.unref(nsCascader).is("validate", Boolean(vue.unref(validateState)))
- ])
- }, [
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(presentTags.value, (tag) => {
- return vue.openBlock(), vue.createBlock(vue.unref(index$7.ElTag), {
- key: tag.key,
- type: _ctx.tagType,
- size: vue.unref(tagSize),
- effect: _ctx.tagEffect,
- hit: tag.hitState,
- closable: tag.closable,
- "disable-transitions": "",
- onClose: ($event) => deleteTag(tag)
- }, {
- default: vue.withCtx(() => [
- tag.isCollapseTag === false ? (vue.openBlock(), vue.createElementBlock("span", { key: 0 }, vue.toDisplayString(tag.text), 1)) : (vue.openBlock(), vue.createBlock(vue.unref(index$4.ElTooltip), {
- key: 1,
- disabled: popperVisible.value || !_ctx.collapseTagsTooltip,
- "fallback-placements": ["bottom", "top", "right", "left"],
- placement: "bottom",
- effect: "light"
- }, {
- default: vue.withCtx(() => [
- vue.createElementVNode("span", null, vue.toDisplayString(tag.text), 1)
- ]),
- content: vue.withCtx(() => [
- vue.createElementVNode("div", {
- class: vue.normalizeClass(vue.unref(nsCascader).e("collapse-tags"))
- }, [
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(allPresentTags.value.slice(_ctx.maxCollapseTags), (tag2, idx) => {
- return vue.openBlock(), vue.createElementBlock("div", {
- key: idx,
- class: vue.normalizeClass(vue.unref(nsCascader).e("collapse-tag"))
- }, [
- (vue.openBlock(), vue.createBlock(vue.unref(index$7.ElTag), {
- key: tag2.key,
- class: "in-tooltip",
- type: _ctx.tagType,
- size: vue.unref(tagSize),
- effect: _ctx.tagEffect,
- hit: tag2.hitState,
- closable: tag2.closable,
- "disable-transitions": "",
- onClose: ($event) => deleteTag(tag2)
- }, {
- default: vue.withCtx(() => [
- vue.createElementVNode("span", null, vue.toDisplayString(tag2.text), 1)
- ]),
- _: 2
- }, 1032, ["type", "size", "effect", "hit", "closable", "onClose"]))
- ], 2);
- }), 128))
- ], 2)
- ]),
- _: 2
- }, 1032, ["disabled"]))
- ]),
- _: 2
- }, 1032, ["type", "size", "effect", "hit", "closable", "onClose"]);
- }), 128)),
- _ctx.filterable && !vue.unref(isDisabled) ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
- key: 0,
- "onUpdate:modelValue": ($event) => searchInputValue.value = $event,
- type: "text",
- class: vue.normalizeClass(vue.unref(nsCascader).e("search-input")),
- placeholder: vue.unref(presentText) ? "" : vue.unref(inputPlaceholder),
- onInput: (e) => handleInput(searchInputValue.value, e),
- onClick: vue.withModifiers(($event) => togglePopperVisible(true), ["stop"]),
- onKeydown: vue.withKeys(handleDelete, ["delete"]),
- onCompositionstart: vue.unref(handleComposition),
- onCompositionupdate: vue.unref(handleComposition),
- onCompositionend: vue.unref(handleComposition),
- onFocus: handleFocus,
- onBlur: handleBlur
- }, null, 42, ["onUpdate:modelValue", "placeholder", "onInput", "onClick", "onKeydown", "onCompositionstart", "onCompositionupdate", "onCompositionend"])), [
- [vue.vModelText, searchInputValue.value]
- ]) : vue.createCommentVNode("v-if", true)
- ], 2)) : vue.createCommentVNode("v-if", true)
- ], 46, ["onClick", "onMouseenter", "onMouseleave"])), [
- [vue.unref(index$8["default"]), () => togglePopperVisible(false), vue.unref(contentRef)]
- ])
- ]),
- content: vue.withCtx(() => [
- vue.withDirectives(vue.createVNode(vue.unref(index$9.ElCascaderPanel), {
- ref_key: "cascaderPanelRef",
- ref: cascaderPanelRef,
- modelValue: vue.unref(checkedValue),
- "onUpdate:modelValue": ($event) => vue.isRef(checkedValue) ? checkedValue.value = $event : null,
- options: _ctx.options,
- props: props.props,
- border: false,
- "render-label": _ctx.$slots.default,
- onExpandChange: handleExpandChange,
- onClose: ($event) => _ctx.$nextTick(() => togglePopperVisible(false))
- }, {
- empty: vue.withCtx(() => [
- vue.renderSlot(_ctx.$slots, "empty")
- ]),
- _: 3
- }, 8, ["modelValue", "onUpdate:modelValue", "options", "props", "render-label", "onClose"]), [
- [vue.vShow, !filtering.value]
- ]),
- _ctx.filterable ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(index$a.ElScrollbar), {
- key: 0,
- ref_key: "suggestionPanel",
- ref: suggestionPanel,
- tag: "ul",
- class: vue.normalizeClass(vue.unref(nsCascader).e("suggestion-panel")),
- "view-class": vue.unref(nsCascader).e("suggestion-list"),
- onKeydown: handleSuggestionKeyDown
- }, {
- default: vue.withCtx(() => [
- suggestions.value.length ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(suggestions.value, (item) => {
- return vue.openBlock(), vue.createElementBlock("li", {
- key: item.uid,
- class: vue.normalizeClass([
- vue.unref(nsCascader).e("suggestion-item"),
- vue.unref(nsCascader).is("checked", item.checked)
- ]),
- tabindex: -1,
- onClick: ($event) => handleSuggestionClick(item)
- }, [
- vue.renderSlot(_ctx.$slots, "suggestion-item", { item }, () => [
- vue.createElementVNode("span", null, vue.toDisplayString(item.text), 1),
- item.checked ? (vue.openBlock(), vue.createBlock(vue.unref(index$6.ElIcon), { key: 0 }, {
- default: vue.withCtx(() => [
- vue.createVNode(vue.unref(iconsVue.Check))
- ]),
- _: 1
- })) : vue.createCommentVNode("v-if", true)
- ])
- ], 10, ["onClick"]);
- }), 128)) : vue.renderSlot(_ctx.$slots, "empty", { key: 1 }, () => [
- vue.createElementVNode("li", {
- class: vue.normalizeClass(vue.unref(nsCascader).e("empty-text"))
- }, vue.toDisplayString(vue.unref(t)("el.cascader.noMatch")), 3)
- ])
- ]),
- _: 3
- }, 8, ["class", "view-class"])), [
- [vue.vShow, filtering.value]
- ]) : vue.createCommentVNode("v-if", true)
- ]),
- _: 3
- }, 8, ["visible", "teleported", "popper-class", "fallback-placements", "placement", "transition", "persistent"]);
- };
- }
- });
- var Cascader = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "cascader.vue"]]);
- exports["default"] = Cascader;
- //# sourceMappingURL=cascader.js.map
|