123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712 |
- 'use strict';
- Object.defineProperty(exports, '__esModule', { value: true });
- var vue = require('vue');
- var shared = require('@vue/shared');
- var lodashUnified = require('lodash-unified');
- var core = require('@vueuse/core');
- var index = require('../../cascader-panel/index.js');
- var index$1 = require('../../input/index.js');
- var index$2 = require('../../tooltip/index.js');
- var index$3 = require('../../scrollbar/index.js');
- var index$4 = require('../../tag/index.js');
- var index$5 = require('../../icon/index.js');
- require('../../../directives/index.js');
- require('../../../hooks/index.js');
- require('../../../utils/index.js');
- require('../../../constants/index.js');
- var iconsVue = require('@element-plus/icons-vue');
- var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
- var index$6 = require('../../../directives/click-outside/index.js');
- var config = require('../../cascader-panel/src/config.js');
- var validator = require('../../../utils/vue/validator.js');
- var content = require('../../tooltip/src/content.js');
- var tag = require('../../tag/src/tag.js');
- var event = require('../../../constants/event.js');
- var index$7 = require('../../../hooks/use-namespace/index.js');
- var index$8 = require('../../../hooks/use-locale/index.js');
- var index$9 = require('../../../hooks/use-form-item/index.js');
- var index$a = require('../../../hooks/use-common-props/index.js');
- var error = require('../../../utils/error.js');
- var i18n = require('../../../utils/i18n.js');
- var aria = require('../../../constants/aria.js');
- var aria$1 = require('../../../utils/dom/aria.js');
- 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 COMPONENT_NAME = "ElCascader";
- const _sfc_main = vue.defineComponent({
- name: COMPONENT_NAME,
- components: {
- ElCascaderPanel: index["default"],
- ElInput: index$1.ElInput,
- ElTooltip: index$2.ElTooltip,
- ElScrollbar: index$3.ElScrollbar,
- ElTag: index$4.ElTag,
- ElIcon: index$5.ElIcon,
- CircleClose: iconsVue.CircleClose,
- Check: iconsVue.Check,
- ArrowDown: iconsVue.ArrowDown
- },
- directives: {
- Clickoutside: index$6["default"]
- },
- props: {
- ...config.CommonProps,
- size: {
- type: String,
- validator: validator.isValidComponentSize
- },
- placeholder: {
- type: String
- },
- disabled: Boolean,
- clearable: Boolean,
- filterable: Boolean,
- filterMethod: {
- type: Function,
- default: (node, keyword) => node.text.includes(keyword)
- },
- separator: {
- type: String,
- default: " / "
- },
- showAllLevels: {
- type: Boolean,
- default: true
- },
- collapseTags: Boolean,
- collapseTagsTooltip: {
- type: Boolean,
- default: false
- },
- debounce: {
- type: Number,
- default: 300
- },
- beforeFilter: {
- type: Function,
- default: () => true
- },
- popperClass: {
- type: String,
- default: ""
- },
- teleported: content.useTooltipContentProps.teleported,
- tagType: { ...tag.tagProps.type, default: "info" },
- validateEvent: {
- type: Boolean,
- default: true
- }
- },
- emits: [
- event.UPDATE_MODEL_EVENT,
- event.CHANGE_EVENT,
- "focus",
- "blur",
- "visible-change",
- "expand-change",
- "remove-tag"
- ],
- setup(props, { emit }) {
- let inputInitialHeight = 0;
- let pressDeleteCount = 0;
- const nsCascader = index$7.useNamespace("cascader");
- const nsInput = index$7.useNamespace("input");
- const { t } = index$8.useLocale();
- const { form, formItem } = index$9.useFormItem();
- const tooltipRef = vue.ref(null);
- const input = vue.ref(null);
- const tagWrapper = vue.ref(null);
- const panel = vue.ref(null);
- const suggestionPanel = vue.ref(null);
- const popperVisible = vue.ref(false);
- const inputHover = vue.ref(false);
- const filtering = vue.ref(false);
- const inputValue = vue.ref("");
- const searchInputValue = vue.ref("");
- const presentTags = vue.ref([]);
- const allPresentTags = vue.ref([]);
- const suggestions = vue.ref([]);
- const isOnComposition = vue.ref(false);
- 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 ? "" : inputPlaceholder.value);
- const realSize = index$a.useSize();
- const tagSize = vue.computed(() => ["small"].includes(realSize.value) ? "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 = panel.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 checkedValue = vue.computed({
- get() {
- return lodashUnified.cloneDeep(props.modelValue);
- },
- set(val) {
- emit(event.UPDATE_MODEL_EVENT, val);
- emit(event.CHANGE_EVENT, val);
- if (props.validateEvent) {
- formItem == null ? void 0 : formItem.validate("change").catch((err) => error.debugWarn(err));
- }
- }
- });
- const popperPaneRef = 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 = panel.value) == null ? void 0 : _c.scrollToExpandingNode);
- } else if (props.filterable) {
- syncPresentTextValue();
- }
- emit("visible-change", 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 = panel.value) == null ? void 0 : _a.calculateCheckedValue();
- emit("remove-tag", 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) {
- const [first, ...rest] = nodes;
- const restCount = rest.length;
- tags.push(genTag(first));
- 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 = panel.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 = panel.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 + 6, inputInitialHeight)}px` : `${inputInitialHeight}px`;
- inputInner.style.height = height;
- updatePopperPosition();
- }
- };
- const getCheckedNodes = (leafOnly) => {
- var _a;
- return (_a = panel.value) == null ? void 0 : _a.getCheckedNodes(leafOnly);
- };
- const handleExpandChange = (value) => {
- updatePopperPosition();
- emit("expand-change", value);
- };
- const handleComposition = (event) => {
- var _a;
- const text = (_a = event.target) == null ? void 0 : _a.value;
- if (event.type === "compositionend") {
- isOnComposition.value = false;
- vue.nextTick(() => handleInput(text));
- } else {
- const lastCharacter = text[text.length - 1] || "";
- isOnComposition.value = !i18n.isKorean(lastCharacter);
- }
- };
- const handleKeyDown = (e) => {
- if (isOnComposition.value)
- return;
- switch (e.code) {
- case aria.EVENT_CODE.enter:
- 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 = panel.value) == null ? void 0 : _a.clearCheckedNodes();
- if (!popperVisible.value && props.filterable) {
- syncPresentTextValue();
- }
- togglePopperVisible(false);
- };
- const syncPresentTextValue = () => {
- const { value } = presentText;
- inputValue.value = value;
- searchInputValue.value = value;
- };
- const handleSuggestionClick = (node) => {
- var _a, _b;
- const { checked } = node;
- if (multiple.value) {
- (_a = panel.value) == null ? void 0 : _a.handleCheckChange(node, !checked, false);
- } else {
- !checked && ((_b = panel.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: {
- 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:
- 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 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();
- };
- vue.watch(filtering, updatePopperPosition);
- vue.watch([checkedNodes, isDisabled], calculatePresentTags);
- vue.watch(presentTags, () => {
- vue.nextTick(() => updateStyle());
- });
- vue.watch(presentText, syncPresentTextValue, { immediate: true });
- vue.onMounted(() => {
- const inputInner = input.value.input;
- const inputInnerHeight = Number.parseFloat(core.useCssVar(nsInput.cssVarName("input-height"), inputInner).value) - 2;
- inputInitialHeight = inputInner.offsetHeight || inputInnerHeight;
- core.useResizeObserver(inputInner, updateStyle);
- });
- return {
- popperOptions,
- tooltipRef,
- popperPaneRef,
- input,
- tagWrapper,
- panel,
- suggestionPanel,
- popperVisible,
- inputHover,
- inputPlaceholder,
- currentPlaceholder,
- filtering,
- presentText,
- checkedValue,
- inputValue,
- searchInputValue,
- presentTags,
- allPresentTags,
- suggestions,
- isDisabled,
- isOnComposition,
- realSize,
- tagSize,
- multiple,
- readonly,
- clearBtnVisible,
- nsCascader,
- nsInput,
- t,
- togglePopperVisible,
- hideSuggestionPanel,
- deleteTag,
- focusFirstNode,
- getCheckedNodes,
- handleExpandChange,
- handleKeyDown,
- handleComposition,
- handleClear,
- handleSuggestionClick,
- handleSuggestionKeyDown,
- handleDelete,
- handleInput
- };
- }
- });
- const _hoisted_1 = { key: 0 };
- const _hoisted_2 = ["placeholder"];
- const _hoisted_3 = ["onClick"];
- function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
- const _component_circle_close = vue.resolveComponent("circle-close");
- const _component_el_icon = vue.resolveComponent("el-icon");
- const _component_arrow_down = vue.resolveComponent("arrow-down");
- const _component_el_input = vue.resolveComponent("el-input");
- const _component_el_tag = vue.resolveComponent("el-tag");
- const _component_el_tooltip = vue.resolveComponent("el-tooltip");
- const _component_el_cascader_panel = vue.resolveComponent("el-cascader-panel");
- const _component_check = vue.resolveComponent("check");
- const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
- const _directive_clickoutside = vue.resolveDirective("clickoutside");
- return vue.openBlock(), vue.createBlock(_component_el_tooltip, {
- ref: "tooltipRef",
- visible: _ctx.popperVisible,
- teleported: _ctx.teleported,
- "popper-class": [_ctx.nsCascader.e("dropdown"), _ctx.popperClass],
- "popper-options": _ctx.popperOptions,
- "fallback-placements": [
- "bottom-start",
- "bottom",
- "top-start",
- "top",
- "right",
- "left"
- ],
- "stop-popper-mouse-event": false,
- "gpu-acceleration": false,
- placement: "bottom-start",
- transition: `${_ctx.nsCascader.namespace.value}-zoom-in-top`,
- effect: "light",
- pure: "",
- persistent: "",
- onHide: _ctx.hideSuggestionPanel
- }, {
- default: vue.withCtx(() => [
- vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
- class: vue.normalizeClass([
- _ctx.nsCascader.b(),
- _ctx.nsCascader.m(_ctx.realSize),
- _ctx.nsCascader.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),
- onMouseleave: _cache[14] || (_cache[14] = ($event) => _ctx.inputHover = false)
- }, [
- vue.createVNode(_component_el_input, {
- ref: "input",
- modelValue: _ctx.inputValue,
- "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.inputValue = $event),
- placeholder: _ctx.currentPlaceholder,
- readonly: _ctx.readonly,
- disabled: _ctx.isDisabled,
- "validate-event": false,
- size: _ctx.realSize,
- class: vue.normalizeClass(_ctx.nsCascader.is("focus", _ctx.popperVisible)),
- onCompositionstart: _ctx.handleComposition,
- onCompositionupdate: _ctx.handleComposition,
- onCompositionend: _ctx.handleComposition,
- onFocus: _cache[2] || (_cache[2] = (e) => _ctx.$emit("focus", e)),
- onBlur: _cache[3] || (_cache[3] = (e) => _ctx.$emit("blur", e)),
- onInput: _ctx.handleInput
- }, {
- suffix: vue.withCtx(() => [
- _ctx.clearBtnVisible ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
- key: "clear",
- class: vue.normalizeClass([_ctx.nsInput.e("icon"), "icon-circle-close"]),
- onClick: vue.withModifiers(_ctx.handleClear, ["stop"])
- }, {
- default: vue.withCtx(() => [
- vue.createVNode(_component_circle_close)
- ]),
- _: 1
- }, 8, ["class", "onClick"])) : (vue.openBlock(), vue.createBlock(_component_el_icon, {
- key: "arrow-down",
- class: vue.normalizeClass([
- _ctx.nsInput.e("icon"),
- "icon-arrow-down",
- _ctx.nsCascader.is("reverse", _ctx.popperVisible)
- ]),
- onClick: _cache[0] || (_cache[0] = vue.withModifiers(($event) => _ctx.togglePopperVisible(), ["stop"]))
- }, {
- default: vue.withCtx(() => [
- vue.createVNode(_component_arrow_down)
- ]),
- _: 1
- }, 8, ["class"]))
- ]),
- _: 1
- }, 8, ["modelValue", "placeholder", "readonly", "disabled", "size", "class", "onCompositionstart", "onCompositionupdate", "onCompositionend", "onInput"]),
- _ctx.multiple ? (vue.openBlock(), vue.createElementBlock("div", {
- key: 0,
- ref: "tagWrapper",
- class: vue.normalizeClass(_ctx.nsCascader.e("tags"))
- }, [
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.presentTags, (tag) => {
- return vue.openBlock(), vue.createBlock(_component_el_tag, {
- key: tag.key,
- type: _ctx.tagType,
- size: _ctx.tagSize,
- hit: tag.hitState,
- closable: tag.closable,
- "disable-transitions": "",
- onClose: ($event) => _ctx.deleteTag(tag)
- }, {
- default: vue.withCtx(() => [
- tag.isCollapseTag === false ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1, vue.toDisplayString(tag.text), 1)) : (vue.openBlock(), vue.createBlock(_component_el_tooltip, {
- key: 1,
- disabled: _ctx.popperVisible || !_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(_ctx.nsCascader.e("collapse-tags"))
- }, [
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.allPresentTags.slice(1), (tag2, idx) => {
- return vue.openBlock(), vue.createElementBlock("div", {
- key: idx,
- class: vue.normalizeClass(_ctx.nsCascader.e("collapse-tag"))
- }, [
- (vue.openBlock(), vue.createBlock(_component_el_tag, {
- key: tag2.key,
- class: "in-tooltip",
- type: _ctx.tagType,
- size: _ctx.tagSize,
- hit: tag2.hitState,
- closable: tag2.closable,
- "disable-transitions": "",
- onClose: ($event) => _ctx.deleteTag(tag2)
- }, {
- default: vue.withCtx(() => [
- vue.createElementVNode("span", null, vue.toDisplayString(tag2.text), 1)
- ]),
- _: 2
- }, 1032, ["type", "size", "hit", "closable", "onClose"]))
- ], 2);
- }), 128))
- ], 2)
- ]),
- _: 2
- }, 1032, ["disabled"]))
- ]),
- _: 2
- }, 1032, ["type", "size", "hit", "closable", "onClose"]);
- }), 128)),
- _ctx.filterable && !_ctx.isDisabled ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
- key: 0,
- "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => _ctx.searchInputValue = $event),
- type: "text",
- class: vue.normalizeClass(_ctx.nsCascader.e("search-input")),
- placeholder: _ctx.presentText ? "" : _ctx.inputPlaceholder,
- onInput: _cache[5] || (_cache[5] = (e) => _ctx.handleInput(_ctx.searchInputValue, e)),
- onClick: _cache[6] || (_cache[6] = vue.withModifiers(($event) => _ctx.togglePopperVisible(true), ["stop"])),
- onKeydown: _cache[7] || (_cache[7] = vue.withKeys((...args) => _ctx.handleDelete && _ctx.handleDelete(...args), ["delete"])),
- onCompositionstart: _cache[8] || (_cache[8] = (...args) => _ctx.handleComposition && _ctx.handleComposition(...args)),
- onCompositionupdate: _cache[9] || (_cache[9] = (...args) => _ctx.handleComposition && _ctx.handleComposition(...args)),
- onCompositionend: _cache[10] || (_cache[10] = (...args) => _ctx.handleComposition && _ctx.handleComposition(...args))
- }, null, 42, _hoisted_2)), [
- [vue.vModelText, _ctx.searchInputValue]
- ]) : vue.createCommentVNode("v-if", true)
- ], 2)) : vue.createCommentVNode("v-if", true)
- ], 38)), [
- [_directive_clickoutside, () => _ctx.togglePopperVisible(false), _ctx.popperPaneRef]
- ])
- ]),
- content: vue.withCtx(() => [
- vue.withDirectives(vue.createVNode(_component_el_cascader_panel, {
- ref: "panel",
- modelValue: _ctx.checkedValue,
- "onUpdate:modelValue": _cache[15] || (_cache[15] = ($event) => _ctx.checkedValue = $event),
- options: _ctx.options,
- props: _ctx.props,
- border: false,
- "render-label": _ctx.$slots.default,
- onExpandChange: _ctx.handleExpandChange,
- onClose: _cache[16] || (_cache[16] = ($event) => _ctx.$nextTick(() => _ctx.togglePopperVisible(false)))
- }, null, 8, ["modelValue", "options", "props", "render-label", "onExpandChange"]), [
- [vue.vShow, !_ctx.filtering]
- ]),
- _ctx.filterable ? vue.withDirectives((vue.openBlock(), vue.createBlock(_component_el_scrollbar, {
- key: 0,
- ref: "suggestionPanel",
- tag: "ul",
- class: vue.normalizeClass(_ctx.nsCascader.e("suggestion-panel")),
- "view-class": _ctx.nsCascader.e("suggestion-list"),
- onKeydown: _ctx.handleSuggestionKeyDown
- }, {
- default: vue.withCtx(() => [
- _ctx.suggestions.length ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.suggestions, (item) => {
- return vue.openBlock(), vue.createElementBlock("li", {
- key: item.uid,
- class: vue.normalizeClass([
- _ctx.nsCascader.e("suggestion-item"),
- _ctx.nsCascader.is("checked", item.checked)
- ]),
- tabindex: -1,
- onClick: ($event) => _ctx.handleSuggestionClick(item)
- }, [
- vue.createElementVNode("span", null, vue.toDisplayString(item.text), 1),
- item.checked ? (vue.openBlock(), vue.createBlock(_component_el_icon, { key: 0 }, {
- default: vue.withCtx(() => [
- vue.createVNode(_component_check)
- ]),
- _: 1
- })) : vue.createCommentVNode("v-if", true)
- ], 10, _hoisted_3);
- }), 128)) : vue.renderSlot(_ctx.$slots, "empty", { key: 1 }, () => [
- vue.createElementVNode("li", {
- class: vue.normalizeClass(_ctx.nsCascader.e("empty-text"))
- }, vue.toDisplayString(_ctx.t("el.cascader.noMatch")), 3)
- ])
- ]),
- _: 3
- }, 8, ["class", "view-class", "onKeydown"])), [
- [vue.vShow, _ctx.filtering]
- ]) : vue.createCommentVNode("v-if", true)
- ]),
- _: 3
- }, 8, ["visible", "teleported", "popper-class", "popper-options", "transition", "onHide"]);
- }
- var Cascader = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/element-plus/element-plus/packages/components/cascader/src/index.vue"]]);
- exports["default"] = Cascader;
- //# sourceMappingURL=index.js.map
|