layui/package/component/es/select/index.js
2022-12-30 16:13:19 +08:00

233 lines
28 KiB
JavaScript

import { b as isArrayChildren, w as withInstall } from "../badge/index2.js";
import { defineComponent, useSlots, ref, onMounted, watch, onUnmounted, computed, provide, openBlock, createElementBlock, createVNode, withCtx, createElementVNode, Fragment, renderList, createBlock, mergeProps, createCommentVNode, renderSlot, unref, normalizeClass, withKeys, withModifiers } from "vue";
import { _ as _sfc_main$2E } from "../checkbox/index2.js";
import { _ as _sfc_main$4 } from "../input/index2.js";
import { _ as _sfc_main$3 } from "../tagInput/index2.js";
import { _ as _sfc_main$1 } from "../dropdown/index2.js";
import { _ as _sfc_main$2 } from "../selectOption/index2.js";
import "../dropdownMenu/index2.js";
import "../tag/index2.js";
import "../_chunks/@ctrl/index.js";
import "../tooltip/index2.js";
import "../_chunks/@vueuse/index.js";
var index = /* @__PURE__ */ (() => '.layui-checkbox[size=lg]{height:18px;line-height:18px}.layui-checkbox[size=lg] .layui-form-checkbox[lay-skin=primary] .layui-icon{width:18px;height:18px;font-size:16px}.layui-checkbox[size=lg] .layui-form-checkbox[lay-skin=primary] .layui-checkbox-label{height:18px;line-height:18px;font-size:16px}.layui-checkbox[size=md]{height:16px;line-height:16px}.layui-checkbox[size=md] .layui-form-checkbox[lay-skin=primary] .layui-icon{width:16px;height:16px;font-size:14px}.layui-checkbox[size=md] .layui-form-checkbox[lay-skin=primary] .layui-checkbox-label{height:16px;line-height:16px;font-size:14px}.layui-checkbox[size=sm]{height:14px;line-height:14px}.layui-checkbox[size=sm] .layui-form-checkbox[lay-skin=primary] .layui-icon{width:14px;height:14px;font-size:12px}.layui-checkbox[size=sm] .layui-form-checkbox[lay-skin=primary] .layui-checkbox-label{height:14px;line-height:14px;font-size:12px}.layui-checkbox[size=xs]{height:12px;line-height:12px}.layui-checkbox[size=xs] .layui-form-checkbox[lay-skin=primary] .layui-icon{width:12px;height:12px;font-size:10px}.layui-checkbox[size=xs] .layui-form-checkbox[lay-skin=primary] .layui-checkbox-label{height:12px;line-height:12px;font-size:10px}.layui-checkbox input[type=checkbox]{display:none}.layui-form-checkbox{position:relative;height:30px;line-height:30px;margin-right:10px;padding-right:30px;cursor:pointer;font-size:0;-webkit-transition:.1s linear;transition:.1s linear;box-sizing:border-box}.layui-form-checkbox span{padding:0 10px;height:100%;font-size:14px;border-radius:2px 0 0 2px;background-color:var(--global-neutral-color-6);color:#fff;overflow:hidden}.layui-form-checkbox:hover span{background-color:var(--global-neutral-color-8)}.layui-form-checkbox i{top:0;right:0;width:29px;height:28px;position:absolute;border-top:1px solid var(--global-neutral-color-6);border-bottom:1px solid var(--global-neutral-color-6);border-right:1px solid var(--global-neutral-color-6);border-radius:0 2px 2px 0;color:#fff;font-size:20px;text-align:center}.layui-form-checkbox:hover i{border-color:var(--global-neutral-color-8);color:var(--global-neutral-color-8)}.layui-form-checkbox[lay-skin=primary]{height:auto!important;line-height:normal!important;min-width:18px;min-height:18px;border:none!important;margin-right:0;padding-left:28px;padding-right:0;background:0 0}.layui-form-checkbox[lay-skin=primary] span{padding-left:0;padding-right:15px;line-height:18px;background:0 0;color:#666}.layui-form-checkbox[lay-skin=primary] i{right:auto;left:0;width:16px;height:16px;line-height:16px;border:1px solid var(--global-neutral-color-6);font-size:12px;border-radius:2px;background-color:#fff;-webkit-transition:.1s linear;transition:.1s linear}.layui-form-checkbox[lay-skin=primary]:hover i{border-color:var(--global-checked-color);color:#fff}.layui-form-checked,.layui-form-checked:hover{border-color:var(--global-checked-color)}.layui-form-checked i,.layui-form-checked:hover i{color:var(--global-checked-color)}.layui-form-checked span,.layui-form-checked:hover span{background-color:var(--global-checked-color)}.layui-form-checked[lay-skin=primary] i{border-color:var(--global-checked-color);background-color:var(--global-checked-color);color:#fff}.layui-form-checked[lay-skin=primary] span{background:0 0!important}.layui-checkbox-disabled[lay-skin=primary] span{background:0 0!important;color:var(--global-neutral-color-8)!important}.layui-checkbox-disabled[lay-skin=primary]:hover i{border-color:var(--global-neutral-color-6)}.layui-checkbox-disabled,.layui-checkbox-disabled i{border-color:var(--global-neutral-color-3)!important}.layui-checkbox-disabled span{background-color:var(--global-neutral-color-3)!important}.layui-checkbox-disabled em{color:var(--global-neutral-color-6)!important}.layui-checkbox-disabled:hover i{color:#fff!important}.layui-checkbox-disabled .layui-icon-ok,.layui-checkbox-disabled .layui-icon-subtraction{background-color:var(--global-neutral-color-3)!important;border-color:var(--global-neutral-color-3)!important}:root{--input-border-radius: var(--global-border-radius);--input-border-color: var(--global-neutral-color-3)}.layui-input{width:100%;height:38px;line-height:38px;border-width:1px;border-style:solid;border-color:var(--input-border-color);border-radius:var(--input-border-radius);display:inline-flex}.layui-input input{height:38px;line-height:38px;background-color:#fff;color:#000000d9;padding-left:10px;display:inline-block;border:none;height:100%;width:100%}.layui-input-append{background-color:#fafafa;border-left:1px solid var(--input-border-color);display:flex;padding:0 15px;flex:none;align-items:center}.layui-input-prepend{background-color:#fafafa;border-right:1px solid var(--input-border-color);display:flex;padding:0 15px;flex:none;align-items:center}.layui-input-wrapper{width:100%;display:inline-flex;border:none}.layui-input:hover,.layui-input:focus-within{border-color:#d2d2d2}.layui-input-clear,.layui-input-prefix,.layui-input-suffix,.layui-input-password{background-color:#fff}.layui-input-clear,.layui-input-password,.layui-input-prefix,.layui-input-suffix{display:flex;flex:none;align-items:center;padding:0 10px}.layui-input-has-prefix input{padding:0}.layui-input-clear,.layui-input-password{color:#00000073}.layui-input-clear:hover{opacity:.6}.layui-input input::-webkit-input-placeholder{line-height:1.3}.layui-input input::-ms-reveal{display:none}.layui-input-disabled{border-color:var(--input-border-color)!important}.layui-input-disabled{opacity:.6}.layui-input-disabled,.layui-input-disabled *{cursor:not-allowed!important}.layui-input[size=lg]{height:44px}.layui-input[size=lg] .layui-input{height:44px;line-height:44px}.layui-input[size=md]{height:38px}.layui-input[size=md] .layui-input{height:38px;line-height:38px}.layui-input[size=sm]{height:32px}.layui-input[size=sm] .layui-input{height:32px;line-height:32px}.layui-input[size=xs]{height:26px}.layui-input[size=xs] .layui-input{height:26px;line-height:26px}.layui-dropdown{position:relative;display:inline-block}.layui-dropdown-content{position:absolute;z-index:99999;background-color:#fff;box-sizing:border-box;border:1px solid #e4e7ed;border-radius:2px;box-shadow:0 2px 12px #0000001a}.layui-dropdown-content>.layui-dropdown-menu{border-radius:var(--global-border-radius);margin:5px 0}.layui-dropdown-content .layui-menu{position:relative;background-color:#fff}.layui-dropdown-content .layui-menu li,.layui-dropdown-content .layui-menu-body-title a{padding:5px 15px}.layui-dropdown-content .layui-menu li{position:relative;display:flex;margin:1px 0;line-height:26px;color:#000c;font-size:14px;white-space:nowrap;cursor:pointer}.layui-dropdown-content .layui-menu li:hover{background-color:var(--global-neutral-color-2)}.layui-dropdown-content .layui-menu-body-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layui-dropdown-menu-prefix{margin-right:8px}.layui-dropdown-menu-suffix{margin-left:15px}.layui-dropdown-content .layui-menu li.layui-disabled:hover{background-color:inherit}.layui-tag{--layui-tag-bg-color: #fafafa;--layui-tag-border-color: #f0f0f0;--layui-tag-hover-color: #FFF;--layui-tag-text-color: currentColor;display:inline-flex;align-items:baseline;vertical-align:middle;box-sizing:border-box;height:26px;line-height:26px;padding:0 8px;font-size:14px;font-weight:500;color:var(--layui-tag-text-color);background-color:var(--layui-tag-bg-color);border-width:1px;border-style:solid;border-color:transparent;border-radius:var(--global-border-radius)}.layui-tag-icon{margin-right:4px}.layui-tag-bordered{border-color:var(--layui-tag-border-color)}.layui-tag-disabled{opacity:.4;cursor:not-allowed}.layui-tag-disabled .layui-tag-close-icon .layui-icon:hover{cursor:not-allowed!important;opacity:1}.layui-tag-shap-square{border-radius:var(--global-border-radius)}.layui-tag-shap-round{border-radius:12px}.layui-tag .layui-tag-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layui-tag .layui-tag-close-icon{margin-left:4px;font-size:14px}.layui-tag .layui-tag-close-icon .layui-icon:hover{cursor:pointer;opacity:.5}.layui-tag-size-lg{height:30px;font-size:14px;line-height:30px}.layui-tag-size-md{height:26px;font-size:14px;line-height:26px}.layui-tag .layui-icon{font-size:14px}.layui-tag-size-sm{height:22px;font-size:12px;line-height:22px}.layui-tag-size-xs{height:18px;font-size:12px;line-height:18px}.layui-tag .layui-icon{font-size:12px}.layui-tag-primary{--layui-tag-bg-color: #009688;--layui-tag-border-color: transparent;--layui-tag-hover-color: #009688;--layui-tag-text-color: #FFF}.layui-tag-primary-bordered{--layui-tag-border-color: #009688}.layui-tag-primary.layui-tag-variant-light{--layui-tag-bg-color: #e6f5f3;--layui-tag-border-color: transparent;--layui-tag-hover-color: #e6f5f3;--layui-tag-text-color: #009688}.layui-tag-primary.layui-tag-variant-light-bordered{--layui-tag-border-color: #80cbc4}.layui-tag-primary.layui-tag-variant-plain{--layui-tag-bg-color: transparent;--layui-tag-hover-color: transparent;--layui-tag-text-color: #009688;--layui-tag-border-color: transparent}.layui-tag-primary.layui-tag-variant-plain-bordered{--layui-tag-border-color: #009688}.layui-tag-normal{--layui-tag-bg-color: #1e9fff;--layui-tag-border-color: transparent;--layui-tag-hover-color: #1e9fff;--layui-tag-text-color: #FFF}.layui-tag-normal-bordered{--layui-tag-border-color: #1e9fff}.layui-tag-normal.layui-tag-variant-light{--layui-tag-bg-color: #e9f5ff;--layui-tag-border-color: transparent;--layui-tag-hover-color: #e9f5ff;--layui-tag-text-color: #1e9fff}.layui-tag-normal.layui-tag-variant-light-bordered{--layui-tag-border-color: #8fcfff}.layui-tag-normal.layui-tag-variant-plain{--layui-tag-bg-color: transparent;--layui-tag-hover-color: transparent;--layui-tag-text-color: #1e9fff;--layui-tag-border-color: transparent}.layui-tag-normal.layui-tag-variant-plain-bordered{--layui-tag-border-color: #1e9fff}.layui-tag-warm{--layui-tag-bg-color: #ffb800;--layui-tag-border-color: transparent;--layui-tag-hover-color: #ffb800;--layui-tag-text-color: #FFF}.layui-tag-warm-bordered{--layui-tag-border-color: #ffb800}.layui-tag-warm.layui-tag-variant-light{--layui-tag-bg-color: #fff8e6;--layui-tag-border-color: transparent;--layui-tag-hover-color: #fff8e6;--layui-tag-text-color: #ffb800}.layui-tag-warm.layui-tag-variant-light-bordered{--layui-tag-border-color: #ffdc80}.layui-tag-warm.layui-tag-variant-plain{--layui-tag-bg-color: transparent;--layui-tag-hover-color: transparent;--layui-tag-text-color: #ffb800;--layui-tag-border-color: transparent}.layui-tag-warm.layui-tag-variant-plain-bordered{--layui-tag-border-color: #ffb800}.layui-tag-danger{--layui-tag-bg-color: #ff5722;--layui-tag-border-color: transparent;--layui-tag-hover-color: #ff5722;--layui-tag-text-color: #FFF}.layui-tag-danger-bordered{--layui-tag-border-color: #ff5722}.layui-tag-danger.layui-tag-variant-light{--layui-tag-bg-color: #ffeee9;--layui-tag-border-color: transparent;--layui-tag-hover-color: #ffeee9;--layui-tag-text-color: #ff5722}.layui-tag-danger.layui-tag-variant-light-bordered{--layui-tag-border-color: #ffab91}.layui-tag-danger.layui-tag-variant-plain{--layui-tag-bg-color: transparent;--layui-tag-hover-color: transparent;--layui-tag-text-color: #ff5722;--layui-tag-border-color: transparent}.layui-tag-danger.layui-tag-variant-plain-bordered{--layui-tag-border-color: #ff5722}.layui-popper{position:fixed;padding:10px;border-radius:3px;word-wrap:break-word;min-width:12px;min-height:12px;font-size:14px;box-sizing:border-box;box-shadow:0 2px 12px #00000026;background-color:#fff;color:#3a3a3a;border:1px solid #cecece;max-width:300px;z-index:99999}.layui-popper[position=top]{margin-bottom:6px}.layui-popper[position=top] .layui-popper-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#cecece}.layui-popper[position=top] .layui-popper-arrow:after{bottom:1px;border-bottom-width:0;margin-left:-6px;border-top-color:#fff}.layui-popper[position=bottom]{margin-top:6px}.layui-popper[position=bottom] .layui-popper-arrow{top:-6px;border-top-width:0;border-bottom-color:#cecece}.layui-popper[position=bottom] .layui-popper-arrow:after{top:1px;border-top-width:0;margin-left:-6px;border-bottom-color:#fff}.layui-popper[position=right]{margin-left:6px}.layui-popper[position=right] .layui-popper-arrow{left:-6px;border-left-width:0;border-right-color:#cecece}.layui-popper[position=right] .layui-popper-arrow:after{left:1px;border-left-width:0;margin-top:-6px;border-right-color:#fff}.layui-popper[position=left]{margin-right:6px}.layui-popper[position=left] .layui-popper-arrow{right:-6px;border-right-width:0;border-left-color:#cecece}.layui-popper[position=left] .layui-popper-arrow:after{right:1px;border-right-width:0;margin-top:-6px;border-left-color:#fff}.layui-popper[position=top] .layui-popper-arrow,.layui-popper[position=bottom] .layui-popper-arrow{left:-moz-calc(44%);left:-webkit-calc(44%);left:calc(50% - 6px)}.layui-popper[position=left] .layui-popper-arrow,.layui-popper[position=right] .layui-popper-arrow{top:-moz-calc(44%);top:-webkit-calc(44%);top:calc(50% - 6px)}.layui-popper:after{content:" ";position:absolute;display:block}.layui-popper[position=top]:after{bottom:-7px;left:0;width:100%;height:7px}.layui-popper[position=bottom]:after{top:-7px;left:0;width:100%;height:7px}.layui-popper[position=left]:after{right:-7px;bottom:0;height:100%;width:7px}.layui-popper[position=right]:after{left:-7px;bottom:0;height:100%;width:7px}.layui-popper .layui-popper-arrow,.layui-popper .layui-popper-arrow:after{position:absolute;display:block;width:0;height:0;border-width:6px;border-style:solid;border-color:transparent}.layui-popper .layui-popper-arrow:after{content:" "}.layui-popper.layui-dark{background-color:#353535;color:#fff;border:1px solid #353535}.layui-popper.layui-dark[position=top]{margin-bottom:6px}.layui-popper.layui-dark[position=top] .layui-popper-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#353535}.layui-popper.layui-dark[position=top] .layui-popper-arrow:after{bottom:1px;border-bottom-width:0;margin-left:-6px;border-top-color:#353535}.layui-popper.layui-dark[position=bottom]{margin-top:6px}.layui-popper.layui-dark[position=bottom] .layui-popper-arrow{top:-6px;border-top-width:0;border-bottom-color:#353535}.layui-popper.layui-dark[position=bottom] .layui-popper-arrow:after{top:1px;border-top-width:0;margin-left:-6px;border-bottom-color:#353535}.layui-popper.layui-dark[position=right]{margin-left:6px}.layui-popper.layui-dark[position=right] .layui-popper-arrow{left:-6px;border-left-width:0;border-right-color:#353535}.layui-popper.layui-dark[position=right] .layui-popper-arrow:after{left:1px;border-left-width:0;margin-top:-6px;border-right-color:#353535}.layui-popper.layui-dark[position=left]{margin-right:6px}.layui-popper.layui-dark[position=left] .layui-popper-arrow{right:-6px;border-right-width:0;border-left-color:#353535}.layui-popper.layui-dark[position=left] .layui-popper-arrow:after{right:1px;border-right-width:0;margin-top:-6px;border-left-color:#353535}.lay-tooltip-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.layui-tag-input{display:inline-flex;box-sizing:border-box;width:100%;border-width:1px;border-style:solid;border-color:var(--input-border-color);border-radius:var(--input-border-radius);cursor:text}.layui-tag-input-inner{flex:1;overflow:hidden;line-height:0;padding:2px 0}.layui-tag-input-mirror{position:absolute;top:0;left:0;white-space:pre;visibility:hidden;pointer-events:none}.layui-tag-input-clear{flex:none;display:flex;align-items:center;padding:0 10px;color:#00000073;cursor:pointer;visibility:hidden}.layui-tag-input-clear:hover{opacity:.8}.layui-tag-input .layui-tag-input-inner-input{box-sizing:border-box;border:none}.layui-tag-input-disabled{cursor:not-allowed;opacity:.6}.layui-tag-input-disabled *{cursor:not-allowed}.layui-tag-input .layui-tag{margin-right:5px;margin-top:2px;margin-bottom:2px;white-space:pre-wrap}.layui-tag-input-collapsed-panel{white-space:normal;display:flex;align-items:center;flex-wrap:wrap;width:100%;height:auto;overflow:hidden}.layui-tag-input-collapsed-panel .layui-tag{margin-right:5px;margin-bottom:4px}.layui-tag-input.layui-tag-input-lg{min-height:44px}.layui-tag-input.layui-tag-input-lg .layui-tag-input-inner-input{height:38px;vertical-align:middle}.layui-tag-input.layui-tag-input-lg .layui-tag-input-inner-input:disabled{background:transparent}.layui-tag-input.layui-tag-input-lg .layui-tag-input-inner{padding:2px 5px}.layui-tag-input.layui-tag-input-lg .layui-tag{margin-top:2px;margin-bottom:2px}.layui-tag-input.layui-tag-input-md{min-height:38px}.layui-tag-input.layui-tag-input-md .layui-tag-input-inner-input{height:32px;vertical-align:middle}.layui-tag-input.layui-tag-input-md .layui-tag-input-inner-input:disabled{background:transparent}.layui-tag-input.layui-tag-input-md .layui-tag-input-inner{padding:2px 5px}.layui-tag-input.layui-tag-input-md .layui-tag{margin-top:2px;margin-bottom:2px}.layui-tag-input.layui-tag-input-sm{min-height:32px}.layui-tag-input.layui-tag-input-sm .layui-tag-input-inner-input{height:28px;vertical-align:middle}.layui-tag-input.layui-tag-input-sm .layui-tag-input-inner-input:disabled{background:transparent}.layui-tag-input.layui-tag-input-sm .layui-tag-input-inner{padding:1px 5px}.layui-tag-input.layui-tag-input-sm .layui-tag{margin-top:1px;margin-bottom:1px}.layui-tag-input.layui-tag-input-xs{min-height:26px}.layui-tag-input.layui-tag-input-xs .layui-tag-input-inner-input{height:22px;vertical-align:middle}.layui-tag-input.layui-tag-input-xs .layui-tag-input-inner-input:disabled{background:transparent}.layui-tag-input.layui-tag-input-xs .layui-tag-input-inner{padding:1px 5px}.layui-tag-input.layui-tag-input-xs .layui-tag{margin-top:1px;margin-bottom:1px}.layui-tag-input-suffix{display:flex;flex:none;align-items:center;padding:0 10px}.layui-tag-input:not(.layui-tag-input-disabled):hover,.layui-tag-input:not(.layui-tag-input-disabled):focus-within{border-color:#d2d2d2!important}.layui-tag-input:not(.layui-tag-input-disabled):hover .layui-tag-input-clear,.layui-tag-input:not(.layui-tag-input-disabled):focus-within .layui-tag-input-clear{visibility:visible}.layui-select{width:220px;cursor:pointer}.layui-select .layui-tag-input{width:220px}.layui-select .layui-tag-input-clear{visibility:unset}.layui-unselect *{cursor:pointer}.layui-select-content{max-height:300px;padding:5px 0;overflow:auto}.layui-select .layui-icon-triangle-d{transition:all .3s;-webkit-transition:all .3s;color:var(--global-neutral-color-8)}.layui-select .layui-icon-triangle-d.triangle{transform:rotate(180deg)}.layui-select-content .layui-select-option{padding:0 10px;line-height:36px;height:36px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}.layui-select-content .layui-select-option.layui-disabled{color:var(--global-neutral-color-6)!important;cursor:not-allowed!important}.layui-select-content .layui-select-option .layui-form-checkbox[lay-skin=primary]{padding-left:12px}.layui-select-content .layui-select-option.layui-this{background-color:var(--global-neutral-color-2);color:var(--global-checked-color);font-weight:700}.layui-select-content .layui-select-option:hover{background-color:var(--global-neutral-color-2)}.layui-select-content .layui-select-option .layui-checkbox{margin-right:10px}.layui-select-search{padding:5px 10px}\n')();
const _hoisted_1 = { class: "layui-select" };
const _hoisted_2 = { class: "layui-select-content" };
const __default__ = {
name: "LaySelect"
};
const _sfc_main = defineComponent({
...__default__,
props: {
name: null,
disabled: { type: Boolean, default: false },
placeholder: null,
searchPlaceholder: null,
searchMethod: null,
modelValue: { default: null },
multiple: { type: Boolean, default: false },
items: null,
size: { default: "md" },
collapseTagsTooltip: { type: Boolean, default: true },
minCollapsedNum: { default: 3 },
allowClear: { type: Boolean, default: false },
showSearch: { type: Boolean, default: false },
contentClass: null,
contentStyle: null
},
emits: ["update:modelValue", "change", "search"],
setup(__props, { emit: emits }) {
const props = __props;
const slots = useSlots();
const selectRef = ref();
const searchValue = ref("");
const singleValue = ref("");
const multipleValue = ref([]);
const openState = ref(false);
const options = ref([]);
const composing = ref(false);
var timer;
const getOption = (nodes, newOptions) => {
nodes == null ? void 0 : nodes.map((item) => {
if (isArrayChildren(item, item.children)) {
getOption(item.children, newOptions);
} else {
if (item.type.name == _sfc_main$2.name) {
if (item.children) {
const label = item.children.default()[0].children;
if (typeof label == "string") {
item.props.label = label;
}
}
newOptions.push(item.props);
}
}
});
};
const intOption = () => {
const newOptions = [];
if (slots.default) {
getOption(slots.default(), newOptions);
}
Object.assign(newOptions, props.items);
if (JSON.stringify(newOptions) != JSON.stringify(options.value)) {
options.value = newOptions;
}
};
const handleRemove = (value) => {
if (Array.isArray(selectedValue.value)) {
selectedValue.value = selectedValue.value.filter((item) => item != value);
}
};
const onCompositionstart = () => {
composing.value = true;
};
const onCompositionend = (event) => {
composing.value = false;
handleSearch(event.target.value);
};
onMounted(() => {
intOption();
timer = setInterval(intOption, 500);
watch([selectedValue, options], () => {
var _a, _b;
if (multiple.value) {
multipleValue.value = (_a = selectedValue.value) == null ? void 0 : _a.map((value) => {
return options.value.find((item) => {
item.disabled == "" || item.disabled == true ? item.closable = false : item.closable = true;
return item.value === value;
});
});
} else {
searchValue.value = "";
singleValue.value = (_b = options.value.find((item) => {
return item.value === selectedValue.value;
})) == null ? void 0 : _b.label;
}
}, { immediate: true, deep: true });
});
onUnmounted(() => {
clearInterval(timer);
});
const selectedValue = computed({
get() {
return props.modelValue;
},
set(value) {
emits("update:modelValue", value);
emits("change", value);
}
});
const multiple = computed(() => {
return props.multiple;
});
const handleSearch = (value) => {
if (composing.value)
return;
emits("search", value);
searchValue.value = value;
};
const handleClear = () => {
if (multiple.value) {
selectedValue.value = [];
} else {
selectedValue.value = "";
}
};
const handleHide = () => {
searchValue.value = "";
openState.value = false;
};
provide("selectRef", selectRef);
provide("openState", openState);
provide("selectedValue", selectedValue);
provide("searchValue", searchValue);
provide("multiple", multiple);
provide("searchMethod", props.searchMethod);
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1, [
createVNode(_sfc_main$1, {
ref_key: "selectRef",
ref: selectRef,
disabled: __props.disabled,
contentClass: __props.contentClass,
contentStyle: __props.contentStyle,
"update-at-scroll": true,
autoFitWidth: true,
onHide: handleHide,
onShow: _cache[5] || (_cache[5] = ($event) => openState.value = true)
}, {
content: withCtx(() => [
createElementVNode("dl", _hoisted_2, [
__props.items ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(__props.items, (item, index2) => {
return openBlock(), createBlock(_sfc_main$2, mergeProps(item, { key: index2 }), null, 16);
}), 128)) : createCommentVNode("", true),
renderSlot(_ctx.$slots, "default")
])
]),
default: withCtx(() => [
unref(multiple) ? (openBlock(), createBlock(_sfc_main$3, {
key: 0,
modelValue: multipleValue.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => multipleValue.value = $event),
"input-value": searchValue.value,
"onUpdate:input-value": _cache[1] || (_cache[1] = ($event) => searchValue.value = $event),
"allow-clear": __props.allowClear,
placeholder: __props.placeholder,
collapseTagsTooltip: __props.collapseTagsTooltip,
minCollapsedNum: __props.minCollapsedNum,
disabled: __props.disabled,
disabledInput: !__props.showSearch,
size: __props.size,
class: normalizeClass({ "layui-unselect": true }),
onRemove: handleRemove,
onClear: handleClear,
onInputValueChange: handleSearch,
onKeyupCapture: [
_cache[2] || (_cache[2] = withKeys(withModifiers(() => {
}, ["prevent", "stop"]), ["delete"])),
_cache[3] || (_cache[3] = withKeys(withModifiers(() => {
}, ["prevent", "stop"]), ["backspace"]))
],
onKeydownCapture: _cache[4] || (_cache[4] = withKeys(withModifiers(() => {
}, ["prevent", "stop"]), ["enter"]))
}, {
suffix: withCtx(() => [
createVNode(unref(_sfc_main$2E), {
type: "layui-icon-triangle-d",
class: normalizeClass({ triangle: openState.value })
}, null, 8, ["class"])
]),
_: 1
}, 8, ["modelValue", "input-value", "allow-clear", "placeholder", "collapseTagsTooltip", "minCollapsedNum", "disabled", "disabledInput", "size"])) : (openBlock(), createBlock(_sfc_main$4, {
key: 1,
size: __props.size,
disabled: __props.disabled,
readonly: !__props.showSearch,
modelValue: singleValue.value,
"allow-clear": __props.allowClear,
placeholder: __props.placeholder,
class: normalizeClass({ "layui-unselect": !__props.showSearch }),
onCompositionstart,
onCompositionend,
onInput: handleSearch,
onClear: handleClear
}, {
suffix: withCtx(() => [
createVNode(unref(_sfc_main$2E), {
type: "layui-icon-triangle-d",
class: normalizeClass({ triangle: openState.value })
}, null, 8, ["class"])
]),
_: 1
}, 8, ["size", "disabled", "readonly", "modelValue", "allow-clear", "placeholder", "class"]))
]),
_: 3
}, 8, ["disabled", "contentClass", "contentStyle"])
]);
};
}
});
const component = withInstall(_sfc_main);
export { component as default };