This commit is contained in:
2025-09-19 14:25:20 +08:00
parent 269893a435
commit fbf3f77229
24949 changed files with 2839404 additions and 0 deletions

View File

@@ -0,0 +1,14 @@
import Select from './src/select.vue';
import Option from './src/option.vue';
import OptionGroup from './src/option-group.vue';
import type { SFCWithInstall } from 'element-plus/es/utils';
export declare const ElSelect: SFCWithInstall<typeof Select> & {
Option: typeof Option;
OptionGroup: typeof OptionGroup;
};
export default ElSelect;
export declare const ElOption: SFCWithInstall<typeof Option>;
export declare const ElOptionGroup: SFCWithInstall<typeof OptionGroup>;
export * from './src/token';
export * from './src/select';
export type { SelectContext, OptionPublicInstance as SelectOptionProxy, OptionBasic, } from './src/type';

View File

@@ -0,0 +1,27 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var select$1 = require('./src/select2.js');
var option = require('./src/option2.js');
var optionGroup = require('./src/option-group.js');
var token = require('./src/token.js');
var select = require('./src/select.js');
var install = require('../../utils/vue/install.js');
const ElSelect = install.withInstall(select$1["default"], {
Option: option["default"],
OptionGroup: optionGroup["default"]
});
const ElOption = install.withNoopInstall(option["default"]);
const ElOptionGroup = install.withNoopInstall(optionGroup["default"]);
exports.selectGroupKey = token.selectGroupKey;
exports.selectKey = token.selectKey;
exports.selectEmits = select.selectEmits;
exports.selectProps = select.selectProps;
exports.ElOption = ElOption;
exports.ElOptionGroup = ElOptionGroup;
exports.ElSelect = ElSelect;
exports["default"] = ElSelect;
//# sourceMappingURL=index.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.js","sources":["../../../../../packages/components/select/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils'\nimport Select from './src/select.vue'\nimport Option from './src/option.vue'\nimport OptionGroup from './src/option-group.vue'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElSelect: SFCWithInstall<typeof Select> & {\n Option: typeof Option\n OptionGroup: typeof OptionGroup\n} = withInstall(Select, {\n Option,\n OptionGroup,\n})\nexport default ElSelect\nexport const ElOption: SFCWithInstall<typeof Option> = withNoopInstall(Option)\nexport const ElOptionGroup: SFCWithInstall<typeof OptionGroup> =\n withNoopInstall(OptionGroup)\n\nexport * from './src/token'\nexport * from './src/select'\n\nexport type {\n SelectContext,\n OptionPublicInstance as SelectOptionProxy,\n OptionBasic,\n} from './src/type'\n"],"names":["withInstall","Select","Option","OptionGroup","withNoopInstall"],"mappings":";;;;;;;;;;;AAIY,MAAC,QAAQ,GAAGA,mBAAW,CAACC,mBAAM,EAAE;AAC5C,UAAEC,iBAAM;AACR,eAAEC,sBAAW;AACb,CAAC,EAAE;AAES,MAAC,QAAQ,GAAGC,uBAAe,CAACF,iBAAM,EAAE;AACpC,MAAC,aAAa,GAAGE,uBAAe,CAACD,sBAAW;;;;;;;;;;;"}

View File

@@ -0,0 +1,90 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var core = require('@vueuse/core');
var token = require('./token.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var index = require('../../../hooks/use-namespace/index.js');
var lodashUnified = require('lodash-unified');
var shared = require('@vue/shared');
const _sfc_main = vue.defineComponent({
name: "ElOptionGroup",
componentName: "ElOptionGroup",
props: {
label: String,
disabled: Boolean
},
setup(props) {
const ns = index.useNamespace("select");
const groupRef = vue.ref();
const instance = vue.getCurrentInstance();
const children = vue.ref([]);
vue.provide(token.selectGroupKey, vue.reactive({
...vue.toRefs(props)
}));
const visible = vue.computed(() => children.value.some((option) => option.visible === true));
const isOption = (node) => {
var _a;
return node.type.name === "ElOption" && !!((_a = node.component) == null ? void 0 : _a.proxy);
};
const flattedChildren = (node) => {
const nodes = lodashUnified.castArray(node);
const children2 = [];
nodes.forEach((child) => {
var _a;
if (!vue.isVNode(child))
return;
if (isOption(child)) {
children2.push(child.component.proxy);
} else if (shared.isArray(child.children) && child.children.length) {
children2.push(...flattedChildren(child.children));
} else if ((_a = child.component) == null ? void 0 : _a.subTree) {
children2.push(...flattedChildren(child.component.subTree));
}
});
return children2;
};
const updateChildren = () => {
children.value = flattedChildren(instance.subTree);
};
vue.onMounted(() => {
updateChildren();
});
core.useMutationObserver(groupRef, updateChildren, {
attributes: true,
subtree: true,
childList: true
});
return {
groupRef,
visible,
ns
};
}
});
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("ul", {
ref: "groupRef",
class: vue.normalizeClass(_ctx.ns.be("group", "wrap"))
}, [
vue.createElementVNode("li", {
class: vue.normalizeClass(_ctx.ns.be("group", "title"))
}, vue.toDisplayString(_ctx.label), 3),
vue.createElementVNode("li", null, [
vue.createElementVNode("ul", {
class: vue.normalizeClass(_ctx.ns.b("group"))
}, [
vue.renderSlot(_ctx.$slots, "default")
], 2)
])
], 2)), [
[vue.vShow, _ctx.visible]
]);
}
var OptionGroup = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "option-group.vue"]]);
exports["default"] = OptionGroup;
//# sourceMappingURL=option-group.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,43 @@
declare const _default: import("vue").DefineComponent<{
/**
* @description name of the group
*/
label: StringConstructor;
/**
* @description whether to disable all options in this group
*/
disabled: BooleanConstructor;
}, {
groupRef: import("vue").Ref<HTMLElement | undefined>;
visible: import("vue").ComputedRef<boolean>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
/**
* @description name of the group
*/
label: StringConstructor;
/**
* @description whether to disable all options in this group
*/
disabled: BooleanConstructor;
}>>, {
disabled: boolean;
}>;
export default _default;

View File

@@ -0,0 +1,17 @@
export declare const COMPONENT_NAME = "ElOption";
export declare const optionProps: {
value: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>>;
readonly required: true;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
label: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
created: BooleanConstructor;
disabled: BooleanConstructor;
};

View File

@@ -0,0 +1,22 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var runtime = require('../../../utils/vue/props/runtime.js');
const COMPONENT_NAME = "ElOption";
const optionProps = runtime.buildProps({
value: {
type: [String, Number, Boolean, Object],
required: true
},
label: {
type: [String, Number]
},
created: Boolean,
disabled: Boolean
});
exports.COMPONENT_NAME = COMPONENT_NAME;
exports.optionProps = optionProps;
//# sourceMappingURL=option.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"option.js","sources":["../../../../../../packages/components/select/src/option.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\n\nexport const COMPONENT_NAME = 'ElOption'\nexport const optionProps = buildProps({\n /**\n * @description value of option\n */\n value: {\n type: [String, Number, Boolean, Object],\n required: true as const,\n },\n /**\n * @description label of option, same as `value` if omitted\n */\n label: {\n type: [String, Number],\n },\n created: Boolean,\n /**\n * @description whether option is disabled\n */\n disabled: Boolean,\n})\n"],"names":["buildProps"],"mappings":";;;;;;AACY,MAAC,cAAc,GAAG,WAAW;AAC7B,MAAC,WAAW,GAAGA,kBAAU,CAAC;AACtC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC;AAC3C,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,EAAE,QAAQ,EAAE,OAAO;AACnB,CAAC;;;;;"}

View File

@@ -0,0 +1,71 @@
declare const _default: import("vue").DefineComponent<{
value: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>>;
readonly required: true;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
label: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
created: BooleanConstructor;
disabled: BooleanConstructor;
}, {
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
id: import("vue").Ref<string>;
containerKls: import("vue").ComputedRef<string[]>;
currentLabel: import("vue").ComputedRef<boolean | import("element-plus/es/utils").EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
itemSelected: import("vue").ComputedRef<boolean>;
isDisabled: import("vue").ComputedRef<boolean>;
select: import("./type").SelectContext;
visible: import("vue").Ref<boolean>;
hover: import("vue").Ref<boolean>;
states: {
index: number;
groupDisabled: boolean;
visible: boolean;
hover: boolean;
};
hoverItem: () => void;
updateOption: (query: string) => void;
selectOptionClick: () => void;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
value: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>>;
readonly required: true;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
label: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
created: BooleanConstructor;
disabled: BooleanConstructor;
}>>, {
disabled: boolean;
created: boolean;
}>;
export default _default;

View File

@@ -0,0 +1,97 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var useOption = require('./useOption.js');
var option = require('./option.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var index = require('../../../hooks/use-namespace/index.js');
var index$1 = require('../../../hooks/use-id/index.js');
const _sfc_main = vue.defineComponent({
name: option.COMPONENT_NAME,
componentName: option.COMPONENT_NAME,
props: option.optionProps,
setup(props) {
const ns = index.useNamespace("select");
const id = index$1.useId();
const containerKls = vue.computed(() => [
ns.be("dropdown", "item"),
ns.is("disabled", vue.unref(isDisabled)),
ns.is("selected", vue.unref(itemSelected)),
ns.is("hovering", vue.unref(hover))
]);
const states = vue.reactive({
index: -1,
groupDisabled: false,
visible: true,
hover: false
});
const {
currentLabel,
itemSelected,
isDisabled,
select,
hoverItem,
updateOption
} = useOption.useOption(props, states);
const { visible, hover } = vue.toRefs(states);
const vm = vue.getCurrentInstance().proxy;
select.onOptionCreate(vm);
vue.onBeforeUnmount(() => {
const key = vm.value;
vue.nextTick(() => {
const { selected: selectedOptions } = select.states;
const doesSelected = selectedOptions.some((item) => {
return item.value === vm.value;
});
if (select.states.cachedOptions.get(key) === vm && !doesSelected) {
select.states.cachedOptions.delete(key);
}
});
select.onOptionDestroy(key, vm);
});
function selectOptionClick() {
if (!isDisabled.value) {
select.handleOptionSelect(vm);
}
}
return {
ns,
id,
containerKls,
currentLabel,
itemSelected,
isDisabled,
select,
visible,
hover,
states,
hoverItem,
updateOption,
selectOptionClick
};
}
});
function _sfc_render(_ctx, _cache) {
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("li", {
id: _ctx.id,
class: vue.normalizeClass(_ctx.containerKls),
role: "option",
"aria-disabled": _ctx.isDisabled || void 0,
"aria-selected": _ctx.itemSelected,
onMousemove: _ctx.hoverItem,
onClick: vue.withModifiers(_ctx.selectOptionClick, ["stop"])
}, [
vue.renderSlot(_ctx.$slots, "default", {}, () => [
vue.createElementVNode("span", null, vue.toDisplayString(_ctx.currentLabel), 1)
])
], 42, ["id", "aria-disabled", "aria-selected", "onMousemove", "onClick"])), [
[vue.vShow, _ctx.visible]
]);
}
var Option = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "option.vue"]]);
exports["default"] = Option;
//# sourceMappingURL=option2.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,5 @@
import type { VNode } from 'vue';
declare const _default: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
export default _default;

View File

@@ -0,0 +1,49 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var lodashUnified = require('lodash-unified');
var token = require('./token.js');
var shared = require('@vue/shared');
var ElOptions = vue.defineComponent({
name: "ElOptions",
setup(_, { slots }) {
const select = vue.inject(token.selectKey);
let cachedValueList = [];
return () => {
var _a, _b;
const children = (_a = slots.default) == null ? void 0 : _a.call(slots);
const valueList = [];
function filterOptions(children2) {
if (!shared.isArray(children2))
return;
children2.forEach((item) => {
var _a2, _b2, _c, _d;
const name = (_a2 = (item == null ? void 0 : item.type) || {}) == null ? void 0 : _a2.name;
if (name === "ElOptionGroup") {
filterOptions(!shared.isString(item.children) && !shared.isArray(item.children) && shared.isFunction((_b2 = item.children) == null ? void 0 : _b2.default) ? (_c = item.children) == null ? void 0 : _c.default() : item.children);
} else if (name === "ElOption") {
valueList.push((_d = item.props) == null ? void 0 : _d.value);
} else if (shared.isArray(item.children)) {
filterOptions(item.children);
}
});
}
if (children.length) {
filterOptions((_b = children[0]) == null ? void 0 : _b.children);
}
if (!lodashUnified.isEqual(valueList, cachedValueList)) {
cachedValueList = valueList;
if (select) {
select.states.optionValues = valueList;
}
}
return children;
};
}
});
exports["default"] = ElOptions;
//# sourceMappingURL=options.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"options.js","sources":["../../../../../../packages/components/select/src/options.ts"],"sourcesContent":["import { defineComponent, inject } from 'vue'\nimport { isEqual } from 'lodash-unified'\nimport { isArray, isFunction, isString } from '@element-plus/utils'\nimport { selectKey } from './token'\n\nimport type { Component, VNode, VNodeNormalizedChildren } from 'vue'\nimport type { OptionValue } from './type'\n\nexport default defineComponent({\n name: 'ElOptions',\n setup(_, { slots }) {\n const select = inject(selectKey)\n let cachedValueList: OptionValue[] = []\n\n return () => {\n const children = slots.default?.()!\n const valueList: OptionValue[] = []\n\n function filterOptions(children?: VNodeNormalizedChildren) {\n if (!isArray(children)) return\n ;(children as VNode[]).forEach((item) => {\n const name = ((item?.type || {}) as Component)?.name\n\n if (name === 'ElOptionGroup') {\n filterOptions(\n !isString(item.children) &&\n !isArray(item.children) &&\n isFunction(item.children?.default)\n ? item.children?.default()\n : item.children\n )\n } else if (name === 'ElOption') {\n valueList.push(item.props?.value)\n } else if (isArray(item.children)) {\n filterOptions(item.children)\n }\n })\n }\n\n if (children.length) {\n filterOptions(children[0]?.children)\n }\n\n if (!isEqual(valueList, cachedValueList)) {\n cachedValueList = valueList\n if (select) {\n select.states.optionValues = valueList\n }\n }\n\n return children\n }\n },\n})\n"],"names":["defineComponent","inject","selectKey","isArray","isString","isFunction","isEqual"],"mappings":";;;;;;;;;AAIA,gBAAeA,mBAAe,CAAC;AAC/B,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE,KAAK,CAAC,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE;AACtB,IAAI,MAAM,MAAM,GAAGC,UAAM,CAACC,eAAS,CAAC,CAAC;AACrC,IAAI,IAAI,eAAe,GAAG,EAAE,CAAC;AAC7B,IAAI,OAAO,MAAM;AACjB,MAAM,IAAI,EAAE,EAAE,EAAE,CAAC;AACjB,MAAM,MAAM,QAAQ,GAAG,CAAC,EAAE,GAAG,KAAK,CAAC,OAAO,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AAC9E,MAAM,MAAM,SAAS,GAAG,EAAE,CAAC;AAC3B,MAAM,SAAS,aAAa,CAAC,SAAS,EAAE;AACxC,QAAQ,IAAI,CAACC,cAAO,CAAC,SAAS,CAAC;AAC/B,UAAU,OAAO;AACjB,QAAQ,SAAS,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK;AACpC,UAAU,IAAI,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC;AAC/B,UAAU,MAAM,IAAI,GAAG,CAAC,GAAG,GAAG,CAAC,IAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC,IAAI,KAAK,EAAE,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,GAAG,CAAC,IAAI,CAAC;AACrG,UAAU,IAAI,IAAI,KAAK,eAAe,EAAE;AACxC,YAAY,aAAa,CAAC,CAACC,eAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAACD,cAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAIE,iBAAU,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,QAAQ,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,QAAQ,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;AAC1N,WAAW,MAAM,IAAI,IAAI,KAAK,UAAU,EAAE;AAC1C,YAAY,SAAS,CAAC,IAAI,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,CAAC;AAC1E,WAAW,MAAM,IAAIF,cAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;AAC7C,YAAY,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AACzC,WAAW;AACX,SAAS,CAAC,CAAC;AACX,OAAO;AACP,MAAM,IAAI,QAAQ,CAAC,MAAM,EAAE;AAC3B,QAAQ,aAAa,CAAC,CAAC,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC;AACzE,OAAO;AACP,MAAM,IAAI,CAACG,qBAAO,CAAC,SAAS,EAAE,eAAe,CAAC,EAAE;AAChD,QAAQ,eAAe,GAAG,SAAS,CAAC;AACpC,QAAQ,IAAI,MAAM,EAAE;AACpB,UAAU,MAAM,CAAC,MAAM,CAAC,YAAY,GAAG,SAAS,CAAC;AACjD,SAAS;AACT,OAAO;AACP,MAAM,OAAO,QAAQ,CAAC;AACtB,KAAK,CAAC;AACN,GAAG;AACH,CAAC,CAAC;;;;"}

View File

@@ -0,0 +1,67 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var core = require('@vueuse/core');
var token = require('./token.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var form = require('../../../constants/form.js');
var index = require('../../../hooks/use-namespace/index.js');
const _sfc_main = vue.defineComponent({
name: "ElSelectDropdown",
componentName: "ElSelectDropdown",
setup() {
const select = vue.inject(token.selectKey);
const ns = index.useNamespace("select");
const popperClass = vue.computed(() => select.props.popperClass);
const isMultiple = vue.computed(() => select.props.multiple);
const isFitInputWidth = vue.computed(() => select.props.fitInputWidth);
const minWidth = vue.ref("");
function updateMinWidth() {
var _a;
const offsetWidth = (_a = select.selectRef) == null ? void 0 : _a.offsetWidth;
if (offsetWidth) {
minWidth.value = `${offsetWidth - form.BORDER_HORIZONTAL_WIDTH}px`;
} else {
minWidth.value = "";
}
}
vue.onMounted(() => {
updateMinWidth();
core.useResizeObserver(select.selectRef, updateMinWidth);
});
return {
ns,
minWidth,
popperClass,
isMultiple,
isFitInputWidth
};
}
});
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return vue.openBlock(), vue.createElementBlock("div", {
class: vue.normalizeClass([_ctx.ns.b("dropdown"), _ctx.ns.is("multiple", _ctx.isMultiple), _ctx.popperClass]),
style: vue.normalizeStyle({ [_ctx.isFitInputWidth ? "width" : "minWidth"]: _ctx.minWidth })
}, [
_ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("div", {
key: 0,
class: vue.normalizeClass(_ctx.ns.be("dropdown", "header"))
}, [
vue.renderSlot(_ctx.$slots, "header")
], 2)) : vue.createCommentVNode("v-if", true),
vue.renderSlot(_ctx.$slots, "default"),
_ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("div", {
key: 1,
class: vue.normalizeClass(_ctx.ns.be("dropdown", "footer"))
}, [
vue.renderSlot(_ctx.$slots, "footer")
], 2)) : vue.createCommentVNode("v-if", true)
], 6);
}
var ElSelectMenu = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "select-dropdown.vue"]]);
exports["default"] = ElSelectMenu;
//# sourceMappingURL=select-dropdown.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"select-dropdown.js","sources":["../../../../../../packages/components/select/src/select-dropdown.vue"],"sourcesContent":["<template>\n <div\n :class=\"[ns.b('dropdown'), ns.is('multiple', isMultiple), popperClass]\"\n :style=\"{ [isFitInputWidth ? 'width' : 'minWidth']: minWidth }\"\n >\n <div v-if=\"$slots.header\" :class=\"ns.be('dropdown', 'header')\">\n <slot name=\"header\" />\n </div>\n <slot />\n <div v-if=\"$slots.footer\" :class=\"ns.be('dropdown', 'footer')\">\n <slot name=\"footer\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject, onMounted, ref } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { useNamespace } from '@element-plus/hooks'\nimport { selectKey } from './token'\nimport { BORDER_HORIZONTAL_WIDTH } from '@element-plus/constants'\n\nexport default defineComponent({\n name: 'ElSelectDropdown',\n\n componentName: 'ElSelectDropdown',\n\n setup() {\n const select = inject(selectKey)!\n const ns = useNamespace('select')\n\n // computed\n const popperClass = computed(() => select.props.popperClass)\n const isMultiple = computed(() => select.props.multiple)\n const isFitInputWidth = computed(() => select.props.fitInputWidth)\n const minWidth = ref('')\n\n function updateMinWidth() {\n const offsetWidth = select.selectRef?.offsetWidth\n if (offsetWidth) {\n minWidth.value = `${offsetWidth - BORDER_HORIZONTAL_WIDTH}px`\n } else {\n minWidth.value = ''\n }\n }\n\n onMounted(() => {\n // TODO: updatePopper\n // popper.value.update()\n updateMinWidth()\n useResizeObserver(select.selectRef, updateMinWidth)\n })\n\n return {\n ns,\n minWidth,\n popperClass,\n isMultiple,\n isFitInputWidth,\n }\n },\n})\n</script>\n"],"names":["defineComponent","inject","selectKey","useNamespace","computed","ref","BORDER_HORIZONTAL_WIDTH","onMounted","useResizeObserver","_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_renderSlot","_createCommentVNode","_export_sfc"],"mappings":";;;;;;;;;;;AAsBA,MAAK,YAAaA,mBAAa,CAAA;AAAA,EAC7B,IAAM,EAAA,kBAAA;AAAA,EAEN,aAAe,EAAA,kBAAA;AAAA,EAEf,KAAQ,GAAA;AACN,IAAM,MAAA,MAAA,GAASC,WAAOC,eAAS,CAAA,CAAA;AAC/B,IAAM,MAAA,EAAA,GAAKC,mBAAa,QAAQ,CAAA,CAAA;AAGhC,IAAA,MAAM,WAAc,GAAAC,YAAA,CAAS,MAAM,MAAA,CAAO,MAAM,WAAW,CAAA,CAAA;AAC3D,IAAA,MAAM,UAAa,GAAAA,YAAA,CAAS,MAAM,MAAA,CAAO,MAAM,QAAQ,CAAA,CAAA;AACvD,IAAA,MAAM,eAAkB,GAAAA,YAAA,CAAS,MAAM,MAAA,CAAO,MAAM,aAAa,CAAA,CAAA;AACjE,IAAM,MAAA,QAAA,GAAWC,QAAI,EAAE,CAAA,CAAA;AAEvB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAM,IAAA,EAAA,CAAA;AACN,MAAA,MAAiB,WAAA,GAAA,CAAA,EAAA,GAAA,MAAA,CAAA,SAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,WAAA,CAAA;AACf,MAAS,IAAA,WAAA,EAAA;AAAgD,QACpD,QAAA,CAAA,KAAA,GAAA,CAAA,EAAA,WAAA,GAAAC,4BAAA,CAAA,EAAA,CAAA,CAAA;AACL,OAAA,MAAA;AAAiB,QACnB,QAAA,CAAA,KAAA,GAAA,EAAA,CAAA;AAAA,OACF;AAEA,KAAA;AAGE,IAAeC,aAAA,CAAA,MAAA;AACf,MAAkB,cAAA,EAAA,CAAA;AAAgC,MACnDC,sBAAA,CAAA,MAAA,CAAA,SAAA,EAAA,cAAA,CAAA,CAAA;AAED,KAAO,CAAA,CAAA;AAAA,IACL,OAAA;AAAA,MACA,EAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACF,eAAA;AAAA,KACF,CAAA;AACF,GAAC;;AA5DC,SAAA,WAAA,CAAA,IAAA,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA;AAAA,EAWM,OAAAC,aAAA,EAAA,EAAAC,sBAAA,CAAA,KAAA,EAAA;AAAA,IAAA,KAAA,EAAAC,kBAAA,CAAA,CAAA,IAAA,CAAA,EAAA,CAAA,CAAA,CAAA,UAAA,CAAA,EAAA,IAAA,CAAA,EAAA,CAAA,EAAA,CAAA,UAAA,EAAA,IAAA,CAAA,UAAA,CAAA,EAAA,IAAA,CAAA,WAAA,CAAA,CAAA;AAAA,IAVH,KAAA,EAAAC,kBAAQ,CAAA,EAAA,CAAA,IAAA,CAAA,eAAI,GAAc,UAAK,UAAA,GAAa,IAAU,CAAA,QAAA,EAAA,CAAA;AAAc,GAAA,EAAA;AACT,IAAA,IAAA,CAAA,MAAA,CAAA,MAAA,IAAAH,aAAA,EAAA,EAAAC,sBAAA,CAAA,KAAA,EAAA;;AAEjD,MAAA,KAAA,EAAAC,kBAAX,CAAA,IAAA,CAAA,EAAA,CAAA,EAAA,CAAA,UAAA,EAAA,QAAA,CAAA,CAAA;AAAA,KAEM,EAAA;AAAA,MAAAE,cAAA,CAAA,IAAA,CAAA,MAAA,EAAA,QAAA,CAAA;AAAA,KAAA,EAAA,CAAA,CAAA,IAAAC,sBAAA,CAAA,MAAA,EAAA,IAAA,CAAA;kBAF0B,CAAA,IAAA,CAAA,MAAA,EAAA;AAAO,IAAA,IAAA,CAAA,MAAA,CAAA,MAAA,IAAAL,aAAA,EAAA,EAAAC,sBAAA,CAAA,KAAA,EAAA;;WACf,EAAAC,kBAAA,CAAA,IAAA,CAAA,EAAA,CAAA,EAAA,CAAA,UAAA,EAAA,QAAA,CAAA,CAAA;AAAA,KAAA,EAAA;;;;;AAGxB,mBAEM,gBAAAI,iCAAA,CAAA,SAAA,EAAA,CAAA,CAAA,QAAA,EAAA,WAAA,CAAA,EAAA,CAAA,QAAA,EAAA,qBAAA,CAAA,CAAA,CAAA;;;;"}

View File

@@ -0,0 +1,25 @@
declare const _default: import("vue").DefineComponent<{}, {
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
minWidth: import("vue").Ref<string>;
popperClass: import("vue").ComputedRef<string>;
isMultiple: import("vue").ComputedRef<boolean>;
isFitInputWidth: import("vue").ComputedRef<boolean>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
export default _default;

View File

@@ -0,0 +1,132 @@
import type { EmitFn } from 'element-plus/es/utils';
import type { CSSProperties, ExtractPropTypes, __ExtractPublicPropTypes } from 'vue';
import type Select from './select.vue';
import type { Options, Placement, PopperEffect } from 'element-plus/es/components/popper';
import type { Props } from 'element-plus/es/components/select-v2/src/useProps';
export declare const selectProps: {
ariaLabel: StringConstructor;
emptyValues: ArrayConstructor;
valueOnClear: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null) | ((new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null))[], unknown, unknown, undefined, boolean>;
name: StringConstructor;
id: StringConstructor;
modelValue: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number | boolean | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[]) | (() => import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[] | null) | ((new (...args: any[]) => string | number | boolean | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[]) | (() => import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[] | null))[], unknown, unknown, undefined, boolean>;
autocomplete: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
automaticDropdown: BooleanConstructor;
size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", never>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
effect: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => PopperEffect) | ((new (...args: any[]) => string) | (() => PopperEffect))[], unknown, unknown, string, boolean>;
disabled: BooleanConstructor;
clearable: BooleanConstructor;
filterable: BooleanConstructor;
allowCreate: BooleanConstructor;
loading: BooleanConstructor;
popperClass: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
popperStyle: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | CSSProperties) | (() => string | CSSProperties) | ((new (...args: any[]) => string | CSSProperties) | (() => string | CSSProperties))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
popperOptions: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | ((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>))[], unknown, unknown, () => Partial<Options>, boolean>;
remote: BooleanConstructor;
loadingText: StringConstructor;
noMatchText: StringConstructor;
noDataText: StringConstructor;
remoteMethod: {
readonly type: import("vue").PropType<(query: string) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
filterMethod: {
readonly type: import("vue").PropType<(query: string) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
multiple: BooleanConstructor;
multipleLimit: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
placeholder: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
defaultFirstOption: BooleanConstructor;
reserveKeyword: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
valueKey: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
collapseTags: BooleanConstructor;
collapseTagsTooltip: BooleanConstructor;
maxCollapseTags: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
persistent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
clearIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
fitInputWidth: BooleanConstructor;
suffixIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
tagType: {
default: string;
type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown>>;
required: false;
validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
tagEffect: {
default: string;
type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "dark" | "light" | "plain", unknown>>;
required: false;
validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
validateEvent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
remoteShowSuffix: BooleanConstructor;
showArrow: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
placement: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement) | ((new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement))[], Placement, unknown, string, boolean>;
fallbackPlacements: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => Placement[]) | (() => Placement[]) | ((new (...args: any[]) => Placement[]) | (() => Placement[]))[], unknown, unknown, string[], boolean>;
tabindex: import("element-plus/es/utils").EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, number, boolean>;
appendTo: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>) | ((new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
options: {
readonly type: import("vue").PropType<Record<string, any>[]>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
props: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => Props) | (() => Props) | ((new (...args: any[]) => Props) | (() => Props))[], unknown, unknown, () => Required<Props>, boolean>;
};
export declare const selectEmits: {
"update:modelValue": (val: SelectProps["modelValue"]) => boolean;
change: (val: SelectProps["modelValue"]) => boolean;
'popup-scroll': ({ scrollTop, scrollLeft, }: {
scrollTop: number;
scrollLeft: number;
}) => boolean;
'remove-tag': (val: unknown) => boolean;
'visible-change': (visible: boolean) => boolean;
focus: (evt: FocusEvent) => boolean;
blur: (evt: FocusEvent) => boolean;
clear: () => boolean;
};
export type SelectProps = ExtractPropTypes<typeof selectProps>;
export type SelectPropsPublic = __ExtractPublicPropTypes<typeof selectProps>;
export type SelectEmits = EmitFn<typeof selectEmits>;
export type SelectInstance = InstanceType<typeof Select> & unknown;
export type SelectOptionProps = Props;

View File

@@ -0,0 +1,156 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var core = require('@popperjs/core');
var iconsVue = require('@element-plus/icons-vue');
var useProps = require('../../select-v2/src/useProps.js');
var scrollbar = require('../../scrollbar/src/scrollbar.js');
var runtime = require('../../../utils/vue/props/runtime.js');
var index = require('../../../hooks/use-size/index.js');
var content = require('../../tooltip/src/content.js');
var icon = require('../../../utils/vue/icon.js');
var tag = require('../../tag/src/tag.js');
var index$1 = require('../../../hooks/use-empty-values/index.js');
var index$2 = require('../../../hooks/use-aria/index.js');
var event = require('../../../constants/event.js');
const selectProps = runtime.buildProps({
name: String,
id: String,
modelValue: {
type: runtime.definePropType([
Array,
String,
Number,
Boolean,
Object
]),
default: void 0
},
autocomplete: {
type: String,
default: "off"
},
automaticDropdown: Boolean,
size: index.useSizeProp,
effect: {
type: runtime.definePropType(String),
default: "light"
},
disabled: Boolean,
clearable: Boolean,
filterable: Boolean,
allowCreate: Boolean,
loading: Boolean,
popperClass: {
type: String,
default: ""
},
popperStyle: {
type: runtime.definePropType([String, Object])
},
popperOptions: {
type: runtime.definePropType(Object),
default: () => ({})
},
remote: Boolean,
loadingText: String,
noMatchText: String,
noDataText: String,
remoteMethod: {
type: runtime.definePropType(Function)
},
filterMethod: {
type: runtime.definePropType(Function)
},
multiple: Boolean,
multipleLimit: {
type: Number,
default: 0
},
placeholder: {
type: String
},
defaultFirstOption: Boolean,
reserveKeyword: {
type: Boolean,
default: true
},
valueKey: {
type: String,
default: "value"
},
collapseTags: Boolean,
collapseTagsTooltip: Boolean,
maxCollapseTags: {
type: Number,
default: 1
},
teleported: content.useTooltipContentProps.teleported,
persistent: {
type: Boolean,
default: true
},
clearIcon: {
type: icon.iconPropType,
default: iconsVue.CircleClose
},
fitInputWidth: Boolean,
suffixIcon: {
type: icon.iconPropType,
default: iconsVue.ArrowDown
},
tagType: { ...tag.tagProps.type, default: "info" },
tagEffect: { ...tag.tagProps.effect, default: "light" },
validateEvent: {
type: Boolean,
default: true
},
remoteShowSuffix: Boolean,
showArrow: {
type: Boolean,
default: true
},
offset: {
type: Number,
default: 12
},
placement: {
type: runtime.definePropType(String),
values: core.placements,
default: "bottom-start"
},
fallbackPlacements: {
type: runtime.definePropType(Array),
default: ["bottom-start", "top-start", "right", "left"]
},
tabindex: {
type: [String, Number],
default: 0
},
appendTo: content.useTooltipContentProps.appendTo,
options: {
type: runtime.definePropType(Array)
},
props: {
type: runtime.definePropType(Object),
default: () => useProps.defaultProps
},
...index$1.useEmptyValuesProps,
...index$2.useAriaProps(["ariaLabel"])
});
const selectEmits = {
[event.UPDATE_MODEL_EVENT]: (val) => true,
[event.CHANGE_EVENT]: (val) => true,
"popup-scroll": scrollbar.scrollbarEmits.scroll,
"remove-tag": (val) => true,
"visible-change": (visible) => true,
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true
};
exports.selectEmits = selectEmits;
exports.selectProps = selectProps;
//# sourceMappingURL=select.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,428 @@
declare const _default: import("vue").DefineComponent<{
ariaLabel: StringConstructor;
emptyValues: ArrayConstructor;
valueOnClear: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null) | ((new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null))[], unknown, unknown, undefined, boolean>;
name: StringConstructor;
id: StringConstructor;
modelValue: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number | boolean | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[]) | (() => import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[] | null) | ((new (...args: any[]) => string | number | boolean | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[]) | (() => import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[] | null))[], unknown, unknown, undefined, boolean>;
autocomplete: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
automaticDropdown: BooleanConstructor;
size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", never>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
effect: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => import("element-plus").PopperEffect) | ((new (...args: any[]) => string) | (() => import("element-plus").PopperEffect))[], unknown, unknown, string, boolean>;
disabled: BooleanConstructor;
clearable: BooleanConstructor;
filterable: BooleanConstructor;
allowCreate: BooleanConstructor;
loading: BooleanConstructor;
popperClass: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
popperStyle: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").CSSProperties) | (() => string | import("vue").CSSProperties) | ((new (...args: any[]) => string | import("vue").CSSProperties) | (() => string | import("vue").CSSProperties))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
popperOptions: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => Partial<import("element-plus").Options>) | (() => Partial<import("element-plus").Options>) | ((new (...args: any[]) => Partial<import("element-plus").Options>) | (() => Partial<import("element-plus").Options>))[], unknown, unknown, () => Partial<import("element-plus").Options>, boolean>;
remote: BooleanConstructor;
loadingText: StringConstructor;
noMatchText: StringConstructor;
noDataText: StringConstructor;
remoteMethod: {
readonly type: import("vue").PropType<(query: string) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
filterMethod: {
readonly type: import("vue").PropType<(query: string) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
multiple: BooleanConstructor;
multipleLimit: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
placeholder: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
defaultFirstOption: BooleanConstructor;
reserveKeyword: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
valueKey: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
collapseTags: BooleanConstructor;
collapseTagsTooltip: BooleanConstructor;
maxCollapseTags: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
persistent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
clearIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
fitInputWidth: BooleanConstructor;
suffixIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
tagType: {
default: string;
type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown>>;
required: false;
validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
tagEffect: {
default: string;
type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "dark" | "light" | "plain", unknown>>;
required: false;
validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
validateEvent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
remoteShowSuffix: BooleanConstructor;
showArrow: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
placement: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], import("element-plus").Placement, unknown, string, boolean>;
fallbackPlacements: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("element-plus").Placement[]) | (() => import("element-plus").Placement[]) | ((new (...args: any[]) => import("element-plus").Placement[]) | (() => import("element-plus").Placement[]))[], unknown, unknown, string[], boolean>;
tabindex: import("element-plus/es/utils").EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, number, boolean>;
appendTo: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>) | ((new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
options: {
readonly type: import("vue").PropType<Record<string, any>[]>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
props: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("element-plus/es/components/select-v2/src/useProps").Props) | (() => import("element-plus/es/components/select-v2/src/useProps").Props) | ((new (...args: any[]) => import("element-plus/es/components/select-v2/src/useProps").Props) | (() => import("element-plus/es/components/select-v2/src/useProps").Props))[], unknown, unknown, () => Required<import("element-plus/es/components/select-v2/src/useProps").Props>, boolean>;
}, {
modelValue: import("vue").ComputedRef<string | number | boolean | any[] | Record<string, any> | null | undefined>;
selectedLabel: import("vue").ComputedRef<string | string[]>;
calculatorRef: import("vue").ShallowRef<HTMLElement | undefined>;
inputStyle: import("vue").ComputedRef<{
minWidth: string;
}>;
getLabel: (option: import("../../select-v2/src/select.types.js").Option) => any;
getValue: (option: import("../../select-v2/src/select.types.js").Option) => any;
getOptions: (option: import("../../select-v2/src/select.types.js").Option) => any;
getDisabled: (option: import("../../select-v2/src/select.types.js").Option) => any;
getOptionProps: (option: Record<string, any>) => {
label: any;
value: any;
disabled: any;
};
inputId: import("vue").Ref<string | undefined>;
contentId: import("vue").Ref<string>;
nsSelect: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
nsInput: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
states: {
inputValue: string;
options: Map<import("./type").OptionValue, import("./type").OptionPublicInstance>;
cachedOptions: Map<import("./type").OptionValue, import("./type").OptionPublicInstance>;
optionValues: import("./type").OptionValue[];
selected: {
index: number;
value: import("./type").OptionValue;
currentLabel: import("./type").OptionPublicInstance["currentLabel"];
isDisabled?: import("./type").OptionPublicInstance["isDisabled"] | undefined;
}[];
hoveringIndex: number;
inputHovering: boolean;
selectionWidth: number;
collapseItemWidth: number;
previousQuery: string | null;
selectedLabel: string;
menuVisibleOnFocus: boolean;
isBeforeHide: boolean;
};
isFocused: import("vue").Ref<boolean>;
expanded: import("vue").Ref<boolean>;
optionsArray: import("vue").ComputedRef<import("./type").OptionPublicInstance[]>;
hoverOption: import("vue").Ref<any>;
selectSize: import("vue").ComputedRef<"" | "small" | "default" | "large">;
filteredOptionsCount: import("vue").ComputedRef<number>;
updateTooltip: () => void;
updateTagTooltip: () => void;
debouncedOnInputChange: import("lodash").DebouncedFunc<() => void>;
onInput: (event: Event) => void;
deletePrevTag: (e: KeyboardEvent) => void;
deleteTag: (event: MouseEvent, tag: import("./type").OptionBasic) => void;
deleteSelected: (event: Event) => void;
handleOptionSelect: (option: import("./type").OptionPublicInstance) => void;
scrollToOption: (option: import("./type").OptionPublicInstance | import("./type").OptionPublicInstance[] | import("./type").SelectStates["selected"]) => void;
hasModelValue: import("vue").ComputedRef<boolean>;
shouldShowPlaceholder: import("vue").ComputedRef<boolean>;
currentPlaceholder: import("vue").ComputedRef<string>;
mouseEnterEventName: import("vue").ComputedRef<"mouseenter" | null>;
needStatusIcon: import("vue").ComputedRef<boolean>;
showClearBtn: import("vue").ComputedRef<boolean>;
iconComponent: import("vue").ComputedRef<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown> | undefined>;
iconReverse: import("vue").ComputedRef<string>;
validateState: import("vue").ComputedRef<"" | "error" | "success" | "validating">;
validateIcon: import("vue").ComputedRef<"" | import("vue").Component>;
showNewOption: import("vue").ComputedRef<boolean>;
updateOptions: () => void;
collapseTagSize: import("vue").ComputedRef<"default" | "small">;
setSelected: () => void;
selectDisabled: import("vue").ComputedRef<boolean>;
emptyText: import("vue").ComputedRef<string | null>;
handleCompositionStart: (event: CompositionEvent) => void;
handleCompositionUpdate: (event: CompositionEvent) => void;
handleCompositionEnd: (event: CompositionEvent) => void;
onOptionCreate: (vm: import("./type").OptionPublicInstance) => void;
onOptionDestroy: (key: import("./type").OptionValue, vm: import("./type").OptionPublicInstance) => void;
handleMenuEnter: () => void;
focus: () => void;
blur: () => void;
handleClearClick: (event: Event) => void;
handleClickOutside: (event: Event) => void;
handleEsc: () => void;
toggleMenu: () => void;
selectOption: () => void;
getValueKey: (item: import("./type").OptionPublicInstance | import("./type").SelectStates["selected"][0]) => any;
navigateOptions: (direction: "prev" | "next") => void;
dropdownMenuVisible: import("vue").WritableComputedRef<boolean>;
showTagList: import("vue").ComputedRef<{
index: number;
value: import("./type").OptionValue;
currentLabel: import("./type").OptionPublicInstance["currentLabel"];
isDisabled?: import("./type").OptionPublicInstance["isDisabled"] | undefined;
}[]>;
collapseTagList: import("vue").ComputedRef<{
index: number;
value: import("./type").OptionValue;
currentLabel: import("./type").OptionPublicInstance["currentLabel"];
isDisabled?: import("./type").OptionPublicInstance["isDisabled"] | undefined;
}[]>;
popupScroll: (data: {
scrollTop: number;
scrollLeft: number;
}) => void;
getOption: (value: import("./type").OptionValue) => {
index: number;
value: import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>;
currentLabel: any;
} | {
index: number;
value: import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>;
currentLabel: string | number | boolean;
readonly isDisabled: boolean;
};
tagStyle: import("vue").ComputedRef<{
maxWidth: string;
}>;
collapseTagStyle: import("vue").ComputedRef<{
maxWidth: string;
}>;
popperRef: import("vue").ComputedRef<HTMLElement | undefined>;
inputRef: import("vue").Ref<HTMLInputElement | undefined>;
tooltipRef: import("vue").Ref<import("element-plus/es/components/tooltip").TooltipInstance | undefined>;
tagTooltipRef: import("vue").Ref<import("element-plus/es/components/tooltip").TooltipInstance | undefined>;
prefixRef: import("vue").Ref<HTMLElement | undefined>;
suffixRef: import("vue").Ref<HTMLElement | undefined>;
selectRef: import("vue").Ref<HTMLElement | undefined>;
wrapperRef: import("vue").ShallowRef<HTMLElement | undefined>;
selectionRef: import("vue").Ref<HTMLElement | undefined>;
scrollbarRef: import("vue").Ref<import("element-plus/es/components/scrollbar").ScrollbarInstance | undefined>;
menuRef: import("vue").Ref<HTMLElement | undefined>;
tagMenuRef: import("vue").Ref<HTMLElement | undefined>;
collapseItemRef: import("vue").Ref<HTMLElement | undefined>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("focus" | "clear" | "update:modelValue" | "change" | "blur" | "visible-change" | "remove-tag" | "popup-scroll")[], "focus" | "clear" | "update:modelValue" | "change" | "blur" | "visible-change" | "remove-tag" | "popup-scroll", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
ariaLabel: StringConstructor;
emptyValues: ArrayConstructor;
valueOnClear: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null) | ((new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null))[], unknown, unknown, undefined, boolean>;
name: StringConstructor;
id: StringConstructor;
modelValue: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number | boolean | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[]) | (() => import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[] | null) | ((new (...args: any[]) => string | number | boolean | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[]) | (() => import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[] | null))[], unknown, unknown, undefined, boolean>;
autocomplete: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
automaticDropdown: BooleanConstructor;
size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", never>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
effect: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => import("element-plus").PopperEffect) | ((new (...args: any[]) => string) | (() => import("element-plus").PopperEffect))[], unknown, unknown, string, boolean>;
disabled: BooleanConstructor;
clearable: BooleanConstructor;
filterable: BooleanConstructor;
allowCreate: BooleanConstructor;
loading: BooleanConstructor;
popperClass: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
popperStyle: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").CSSProperties) | (() => string | import("vue").CSSProperties) | ((new (...args: any[]) => string | import("vue").CSSProperties) | (() => string | import("vue").CSSProperties))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
popperOptions: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => Partial<import("element-plus").Options>) | (() => Partial<import("element-plus").Options>) | ((new (...args: any[]) => Partial<import("element-plus").Options>) | (() => Partial<import("element-plus").Options>))[], unknown, unknown, () => Partial<import("element-plus").Options>, boolean>;
remote: BooleanConstructor;
loadingText: StringConstructor;
noMatchText: StringConstructor;
noDataText: StringConstructor;
remoteMethod: {
readonly type: import("vue").PropType<(query: string) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
filterMethod: {
readonly type: import("vue").PropType<(query: string) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
multiple: BooleanConstructor;
multipleLimit: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
placeholder: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
defaultFirstOption: BooleanConstructor;
reserveKeyword: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
valueKey: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
collapseTags: BooleanConstructor;
collapseTagsTooltip: BooleanConstructor;
maxCollapseTags: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
persistent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
clearIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
fitInputWidth: BooleanConstructor;
suffixIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
tagType: {
default: string;
type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown>>;
required: false;
validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
tagEffect: {
default: string;
type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "dark" | "light" | "plain", unknown>>;
required: false;
validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
validateEvent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
remoteShowSuffix: BooleanConstructor;
showArrow: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
placement: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], import("element-plus").Placement, unknown, string, boolean>;
fallbackPlacements: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("element-plus").Placement[]) | (() => import("element-plus").Placement[]) | ((new (...args: any[]) => import("element-plus").Placement[]) | (() => import("element-plus").Placement[]))[], unknown, unknown, string[], boolean>;
tabindex: import("element-plus/es/utils").EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, number, boolean>;
appendTo: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>) | ((new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
options: {
readonly type: import("vue").PropType<Record<string, any>[]>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
props: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("element-plus/es/components/select-v2/src/useProps").Props) | (() => import("element-plus/es/components/select-v2/src/useProps").Props) | ((new (...args: any[]) => import("element-plus/es/components/select-v2/src/useProps").Props) | (() => import("element-plus/es/components/select-v2/src/useProps").Props))[], unknown, unknown, () => Required<import("element-plus/es/components/select-v2/src/useProps").Props>, boolean>;
}>> & {
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
onChange?: ((...args: any[]) => any) | undefined;
onFocus?: ((...args: any[]) => any) | undefined;
onBlur?: ((...args: any[]) => any) | undefined;
onClear?: ((...args: any[]) => any) | undefined;
"onVisible-change"?: ((...args: any[]) => any) | undefined;
"onRemove-tag"?: ((...args: any[]) => any) | undefined;
"onPopup-scroll"?: ((...args: any[]) => any) | undefined;
}, {
disabled: boolean;
tabindex: import("element-plus/es/utils").EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>;
offset: number;
multiple: boolean;
props: import("element-plus/es/components/select-v2/src/useProps").Props;
loading: boolean;
modelValue: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number | boolean | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[]) | (() => import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[] | null) | ((new (...args: any[]) => string | number | boolean | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[]) | (() => import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown> | import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>[] | null))[], unknown, unknown>;
placement: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], import("element-plus").Placement, unknown>;
effect: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string) | (() => import("element-plus").PopperEffect) | ((new (...args: any[]) => string) | (() => import("element-plus").PopperEffect))[], unknown, unknown>;
valueOnClear: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null) | ((new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null))[], unknown, unknown>;
autocomplete: string;
validateEvent: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
clearable: boolean;
fallbackPlacements: import("element-plus").Placement[];
popperOptions: Partial<import("element-plus").Options>;
popperClass: string;
teleported: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
persistent: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
showArrow: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
valueKey: string;
fitInputWidth: boolean;
filterable: boolean;
collapseTags: boolean;
maxCollapseTags: number;
collapseTagsTooltip: boolean;
tagType: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown>;
tagEffect: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "dark" | "light" | "plain", unknown>;
multipleLimit: number;
reserveKeyword: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
allowCreate: boolean;
automaticDropdown: boolean;
defaultFirstOption: boolean;
remote: boolean;
remoteShowSuffix: boolean;
}>;
export default _default;

View File

@@ -0,0 +1,537 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var index$2 = require('../../tooltip/index.js');
var index$1 = require('../../scrollbar/index.js');
var index = require('../../tag/index.js');
var index$3 = require('../../icon/index.js');
var useProps = require('../../select-v2/src/useProps.js');
var option = require('./option2.js');
var selectDropdown = require('./select-dropdown.js');
var useSelect = require('./useSelect.js');
var token = require('./token.js');
var options = require('./options.js');
var select = require('./select.js');
var optionGroup = require('./option-group.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var index$4 = require('../../../directives/click-outside/index.js');
var event = require('../../../constants/event.js');
var shared = require('@vue/shared');
var index$5 = require('../../../hooks/use-calc-input-width/index.js');
var vnode = require('../../../utils/vue/vnode.js');
const COMPONENT_NAME = "ElSelect";
const _sfc_main = vue.defineComponent({
name: COMPONENT_NAME,
componentName: COMPONENT_NAME,
components: {
ElSelectMenu: selectDropdown["default"],
ElOption: option["default"],
ElOptions: options["default"],
ElOptionGroup: optionGroup["default"],
ElTag: index.ElTag,
ElScrollbar: index$1.ElScrollbar,
ElTooltip: index$2.ElTooltip,
ElIcon: index$3.ElIcon
},
directives: { ClickOutside: index$4["default"] },
props: select.selectProps,
emits: [
event.UPDATE_MODEL_EVENT,
event.CHANGE_EVENT,
"remove-tag",
"clear",
"visible-change",
"focus",
"blur",
"popup-scroll"
],
setup(props, { emit, slots }) {
const instance = vue.getCurrentInstance();
instance.appContext.config.warnHandler = (...args) => {
if (!args[0] || args[0].includes('Slot "default" invoked outside of the render function')) {
return;
}
console.warn(...args);
};
const modelValue = vue.computed(() => {
const { modelValue: rawModelValue, multiple } = props;
const fallback = multiple ? [] : void 0;
if (shared.isArray(rawModelValue)) {
return multiple ? rawModelValue : fallback;
}
return multiple ? fallback : rawModelValue;
});
const _props = vue.reactive({
...vue.toRefs(props),
modelValue
});
const API = useSelect.useSelect(_props, emit);
const { calculatorRef, inputStyle } = index$5.useCalcInputWidth();
const { getLabel, getValue, getOptions, getDisabled } = useProps.useProps(props);
const getOptionProps = (option) => ({
label: getLabel(option),
value: getValue(option),
disabled: getDisabled(option)
});
const flatTreeSelectData = (data) => {
return data.reduce((acc, item) => {
acc.push(item);
if (item.children && item.children.length > 0) {
acc.push(...flatTreeSelectData(item.children));
}
return acc;
}, []);
};
const manuallyRenderSlots = (vnodes) => {
const children = vnode.flattedChildren(vnodes || []);
children.forEach((item) => {
var _a;
if (shared.isObject(item) && (item.type.name === "ElOption" || item.type.name === "ElTree")) {
const _name = item.type.name;
if (_name === "ElTree") {
const treeData = ((_a = item.props) == null ? void 0 : _a.data) || [];
const flatData = flatTreeSelectData(treeData);
flatData.forEach((treeItem) => {
treeItem.currentLabel = treeItem.label || (shared.isObject(treeItem.value) ? "" : treeItem.value);
API.onOptionCreate(treeItem);
});
} else if (_name === "ElOption") {
const obj = { ...item.props };
obj.currentLabel = obj.label || (shared.isObject(obj.value) ? "" : obj.value);
API.onOptionCreate(obj);
}
}
});
};
vue.watch(() => {
var _a;
const slotsContent = (_a = slots.default) == null ? void 0 : _a.call(slots);
return slotsContent;
}, (newSlot) => {
if (props.persistent) {
return;
}
manuallyRenderSlots(newSlot);
}, {
immediate: true
});
vue.provide(token.selectKey, vue.reactive({
props: _props,
states: API.states,
selectRef: API.selectRef,
optionsArray: API.optionsArray,
setSelected: API.setSelected,
handleOptionSelect: API.handleOptionSelect,
onOptionCreate: API.onOptionCreate,
onOptionDestroy: API.onOptionDestroy
}));
const selectedLabel = vue.computed(() => {
if (!props.multiple) {
return API.states.selectedLabel;
}
return API.states.selected.map((i) => i.currentLabel);
});
vue.onBeforeUnmount(() => {
instance.appContext.config.warnHandler = void 0;
});
return {
...API,
modelValue,
selectedLabel,
calculatorRef,
inputStyle,
getLabel,
getValue,
getOptions,
getDisabled,
getOptionProps
};
}
});
function _sfc_render(_ctx, _cache) {
const _component_el_tag = vue.resolveComponent("el-tag");
const _component_el_tooltip = vue.resolveComponent("el-tooltip");
const _component_el_icon = vue.resolveComponent("el-icon");
const _component_el_option = vue.resolveComponent("el-option");
const _component_el_option_group = vue.resolveComponent("el-option-group");
const _component_el_options = vue.resolveComponent("el-options");
const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
const _component_el_select_menu = vue.resolveComponent("el-select-menu");
const _directive_click_outside = vue.resolveDirective("click-outside");
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
ref: "selectRef",
class: vue.normalizeClass([_ctx.nsSelect.b(), _ctx.nsSelect.m(_ctx.selectSize)]),
[vue.toHandlerKey(_ctx.mouseEnterEventName)]: ($event) => _ctx.states.inputHovering = true,
onMouseleave: ($event) => _ctx.states.inputHovering = false
}, [
vue.createVNode(_component_el_tooltip, {
ref: "tooltipRef",
visible: _ctx.dropdownMenuVisible,
placement: _ctx.placement,
teleported: _ctx.teleported,
"popper-class": [_ctx.nsSelect.e("popper"), _ctx.popperClass],
"popper-style": _ctx.popperStyle,
"popper-options": _ctx.popperOptions,
"fallback-placements": _ctx.fallbackPlacements,
effect: _ctx.effect,
pure: "",
trigger: "click",
transition: `${_ctx.nsSelect.namespace.value}-zoom-in-top`,
"stop-popper-mouse-event": false,
"gpu-acceleration": false,
persistent: _ctx.persistent,
"append-to": _ctx.appendTo,
"show-arrow": _ctx.showArrow,
offset: _ctx.offset,
onBeforeShow: _ctx.handleMenuEnter,
onHide: ($event) => _ctx.states.isBeforeHide = false
}, {
default: vue.withCtx(() => {
var _a;
return [
vue.createElementVNode("div", {
ref: "wrapperRef",
class: vue.normalizeClass([
_ctx.nsSelect.e("wrapper"),
_ctx.nsSelect.is("focused", _ctx.isFocused),
_ctx.nsSelect.is("hovering", _ctx.states.inputHovering),
_ctx.nsSelect.is("filterable", _ctx.filterable),
_ctx.nsSelect.is("disabled", _ctx.selectDisabled)
]),
onClick: vue.withModifiers(_ctx.toggleMenu, ["prevent"])
}, [
_ctx.$slots.prefix ? (vue.openBlock(), vue.createElementBlock("div", {
key: 0,
ref: "prefixRef",
class: vue.normalizeClass(_ctx.nsSelect.e("prefix"))
}, [
vue.renderSlot(_ctx.$slots, "prefix")
], 2)) : vue.createCommentVNode("v-if", true),
vue.createElementVNode("div", {
ref: "selectionRef",
class: vue.normalizeClass([
_ctx.nsSelect.e("selection"),
_ctx.nsSelect.is("near", _ctx.multiple && !_ctx.$slots.prefix && !!_ctx.states.selected.length)
])
}, [
_ctx.multiple ? vue.renderSlot(_ctx.$slots, "tag", {
key: 0,
data: _ctx.states.selected,
deleteTag: _ctx.deleteTag,
selectDisabled: _ctx.selectDisabled
}, () => [
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.showTagList, (item) => {
return vue.openBlock(), vue.createElementBlock("div", {
key: _ctx.getValueKey(item),
class: vue.normalizeClass(_ctx.nsSelect.e("selected-item"))
}, [
vue.createVNode(_component_el_tag, {
closable: !_ctx.selectDisabled && !item.isDisabled,
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
"disable-transitions": "",
style: vue.normalizeStyle(_ctx.tagStyle),
onClose: ($event) => _ctx.deleteTag($event, item)
}, {
default: vue.withCtx(() => [
vue.createElementVNode("span", {
class: vue.normalizeClass(_ctx.nsSelect.e("tags-text"))
}, [
vue.renderSlot(_ctx.$slots, "label", {
index: item.index,
label: item.currentLabel,
value: item.value
}, () => [
vue.createTextVNode(vue.toDisplayString(item.currentLabel), 1)
])
], 2)
]),
_: 2
}, 1032, ["closable", "size", "type", "effect", "style", "onClose"])
], 2);
}), 128)),
_ctx.collapseTags && _ctx.states.selected.length > _ctx.maxCollapseTags ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, {
key: 0,
ref: "tagTooltipRef",
disabled: _ctx.dropdownMenuVisible || !_ctx.collapseTagsTooltip,
"fallback-placements": ["bottom", "top", "right", "left"],
effect: _ctx.effect,
placement: "bottom",
"popper-class": _ctx.popperClass,
"popper-style": _ctx.popperStyle,
teleported: _ctx.teleported
}, {
default: vue.withCtx(() => [
vue.createElementVNode("div", {
ref: "collapseItemRef",
class: vue.normalizeClass(_ctx.nsSelect.e("selected-item"))
}, [
vue.createVNode(_component_el_tag, {
closable: false,
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
"disable-transitions": "",
style: vue.normalizeStyle(_ctx.collapseTagStyle)
}, {
default: vue.withCtx(() => [
vue.createElementVNode("span", {
class: vue.normalizeClass(_ctx.nsSelect.e("tags-text"))
}, " + " + vue.toDisplayString(_ctx.states.selected.length - _ctx.maxCollapseTags), 3)
]),
_: 1
}, 8, ["size", "type", "effect", "style"])
], 2)
]),
content: vue.withCtx(() => [
vue.createElementVNode("div", {
ref: "tagMenuRef",
class: vue.normalizeClass(_ctx.nsSelect.e("selection"))
}, [
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.collapseTagList, (item) => {
return vue.openBlock(), vue.createElementBlock("div", {
key: _ctx.getValueKey(item),
class: vue.normalizeClass(_ctx.nsSelect.e("selected-item"))
}, [
vue.createVNode(_component_el_tag, {
class: "in-tooltip",
closable: !_ctx.selectDisabled && !item.isDisabled,
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
"disable-transitions": "",
onClose: ($event) => _ctx.deleteTag($event, item)
}, {
default: vue.withCtx(() => [
vue.createElementVNode("span", {
class: vue.normalizeClass(_ctx.nsSelect.e("tags-text"))
}, [
vue.renderSlot(_ctx.$slots, "label", {
index: item.index,
label: item.currentLabel,
value: item.value
}, () => [
vue.createTextVNode(vue.toDisplayString(item.currentLabel), 1)
])
], 2)
]),
_: 2
}, 1032, ["closable", "size", "type", "effect", "onClose"])
], 2);
}), 128))
], 2)
]),
_: 3
}, 8, ["disabled", "effect", "popper-class", "popper-style", "teleported"])) : vue.createCommentVNode("v-if", true)
]) : vue.createCommentVNode("v-if", true),
vue.createElementVNode("div", {
class: vue.normalizeClass([
_ctx.nsSelect.e("selected-item"),
_ctx.nsSelect.e("input-wrapper"),
_ctx.nsSelect.is("hidden", !_ctx.filterable)
])
}, [
vue.withDirectives(vue.createElementVNode("input", {
id: _ctx.inputId,
ref: "inputRef",
"onUpdate:modelValue": ($event) => _ctx.states.inputValue = $event,
type: "text",
name: _ctx.name,
class: vue.normalizeClass([_ctx.nsSelect.e("input"), _ctx.nsSelect.is(_ctx.selectSize)]),
disabled: _ctx.selectDisabled,
autocomplete: _ctx.autocomplete,
style: vue.normalizeStyle(_ctx.inputStyle),
tabindex: _ctx.tabindex,
role: "combobox",
readonly: !_ctx.filterable,
spellcheck: "false",
"aria-activedescendant": ((_a = _ctx.hoverOption) == null ? void 0 : _a.id) || "",
"aria-controls": _ctx.contentId,
"aria-expanded": _ctx.dropdownMenuVisible,
"aria-label": _ctx.ariaLabel,
"aria-autocomplete": "none",
"aria-haspopup": "listbox",
onKeydown: [
vue.withKeys(vue.withModifiers(($event) => _ctx.navigateOptions("next"), ["stop", "prevent"]), ["down"]),
vue.withKeys(vue.withModifiers(($event) => _ctx.navigateOptions("prev"), ["stop", "prevent"]), ["up"]),
vue.withKeys(vue.withModifiers(_ctx.handleEsc, ["stop", "prevent"]), ["esc"]),
vue.withKeys(vue.withModifiers(_ctx.selectOption, ["stop", "prevent"]), ["enter"]),
vue.withKeys(vue.withModifiers(_ctx.deletePrevTag, ["stop"]), ["delete"])
],
onCompositionstart: _ctx.handleCompositionStart,
onCompositionupdate: _ctx.handleCompositionUpdate,
onCompositionend: _ctx.handleCompositionEnd,
onInput: _ctx.onInput,
onClick: vue.withModifiers(_ctx.toggleMenu, ["stop"])
}, null, 46, ["id", "onUpdate:modelValue", "name", "disabled", "autocomplete", "tabindex", "readonly", "aria-activedescendant", "aria-controls", "aria-expanded", "aria-label", "onKeydown", "onCompositionstart", "onCompositionupdate", "onCompositionend", "onInput", "onClick"]), [
[vue.vModelText, _ctx.states.inputValue]
]),
_ctx.filterable ? (vue.openBlock(), vue.createElementBlock("span", {
key: 0,
ref: "calculatorRef",
"aria-hidden": "true",
class: vue.normalizeClass(_ctx.nsSelect.e("input-calculator")),
textContent: vue.toDisplayString(_ctx.states.inputValue)
}, null, 10, ["textContent"])) : vue.createCommentVNode("v-if", true)
], 2),
_ctx.shouldShowPlaceholder ? (vue.openBlock(), vue.createElementBlock("div", {
key: 1,
class: vue.normalizeClass([
_ctx.nsSelect.e("selected-item"),
_ctx.nsSelect.e("placeholder"),
_ctx.nsSelect.is("transparent", !_ctx.hasModelValue || _ctx.expanded && !_ctx.states.inputValue)
])
}, [
_ctx.hasModelValue ? vue.renderSlot(_ctx.$slots, "label", {
key: 0,
index: _ctx.getOption(_ctx.modelValue).index,
label: _ctx.currentPlaceholder,
value: _ctx.modelValue
}, () => [
vue.createElementVNode("span", null, vue.toDisplayString(_ctx.currentPlaceholder), 1)
]) : (vue.openBlock(), vue.createElementBlock("span", { key: 1 }, vue.toDisplayString(_ctx.currentPlaceholder), 1))
], 2)) : vue.createCommentVNode("v-if", true)
], 2),
vue.createElementVNode("div", {
ref: "suffixRef",
class: vue.normalizeClass(_ctx.nsSelect.e("suffix"))
}, [
_ctx.iconComponent && !_ctx.showClearBtn ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
key: 0,
class: vue.normalizeClass([_ctx.nsSelect.e("caret"), _ctx.nsSelect.e("icon"), _ctx.iconReverse])
}, {
default: vue.withCtx(() => [
(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.iconComponent)))
]),
_: 1
}, 8, ["class"])) : vue.createCommentVNode("v-if", true),
_ctx.showClearBtn && _ctx.clearIcon ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
key: 1,
class: vue.normalizeClass([
_ctx.nsSelect.e("caret"),
_ctx.nsSelect.e("icon"),
_ctx.nsSelect.e("clear")
]),
onClick: _ctx.handleClearClick
}, {
default: vue.withCtx(() => [
(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.clearIcon)))
]),
_: 1
}, 8, ["class", "onClick"])) : vue.createCommentVNode("v-if", true),
_ctx.validateState && _ctx.validateIcon && _ctx.needStatusIcon ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
key: 2,
class: vue.normalizeClass([
_ctx.nsInput.e("icon"),
_ctx.nsInput.e("validateIcon"),
_ctx.nsInput.is("loading", _ctx.validateState === "validating")
])
}, {
default: vue.withCtx(() => [
(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.validateIcon)))
]),
_: 1
}, 8, ["class"])) : vue.createCommentVNode("v-if", true)
], 2)
], 10, ["onClick"])
];
}),
content: vue.withCtx(() => [
vue.createVNode(_component_el_select_menu, { ref: "menuRef" }, {
default: vue.withCtx(() => [
_ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("div", {
key: 0,
class: vue.normalizeClass(_ctx.nsSelect.be("dropdown", "header")),
onClick: vue.withModifiers(() => {
}, ["stop"])
}, [
vue.renderSlot(_ctx.$slots, "header")
], 10, ["onClick"])) : vue.createCommentVNode("v-if", true),
vue.withDirectives(vue.createVNode(_component_el_scrollbar, {
id: _ctx.contentId,
ref: "scrollbarRef",
tag: "ul",
"wrap-class": _ctx.nsSelect.be("dropdown", "wrap"),
"view-class": _ctx.nsSelect.be("dropdown", "list"),
class: vue.normalizeClass([_ctx.nsSelect.is("empty", _ctx.filteredOptionsCount === 0)]),
role: "listbox",
"aria-label": _ctx.ariaLabel,
"aria-orientation": "vertical",
onScroll: _ctx.popupScroll
}, {
default: vue.withCtx(() => [
_ctx.showNewOption ? (vue.openBlock(), vue.createBlock(_component_el_option, {
key: 0,
value: _ctx.states.inputValue,
created: true
}, null, 8, ["value"])) : vue.createCommentVNode("v-if", true),
vue.createVNode(_component_el_options, null, {
default: vue.withCtx(() => [
vue.renderSlot(_ctx.$slots, "default", {}, () => [
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.options, (option, index) => {
var _a;
return vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: index }, [
((_a = _ctx.getOptions(option)) == null ? void 0 : _a.length) ? (vue.openBlock(), vue.createBlock(_component_el_option_group, {
key: 0,
label: _ctx.getLabel(option),
disabled: _ctx.getDisabled(option)
}, {
default: vue.withCtx(() => [
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.getOptions(option), (item) => {
return vue.openBlock(), vue.createBlock(_component_el_option, vue.mergeProps({
key: _ctx.getValue(item)
}, _ctx.getOptionProps(item)), null, 16);
}), 128))
]),
_: 2
}, 1032, ["label", "disabled"])) : (vue.openBlock(), vue.createBlock(_component_el_option, vue.normalizeProps(vue.mergeProps({ key: 1 }, _ctx.getOptionProps(option))), null, 16))
], 64);
}), 128))
])
]),
_: 3
})
]),
_: 3
}, 8, ["id", "wrap-class", "view-class", "class", "aria-label", "onScroll"]), [
[vue.vShow, _ctx.states.options.size > 0 && !_ctx.loading]
]),
_ctx.$slots.loading && _ctx.loading ? (vue.openBlock(), vue.createElementBlock("div", {
key: 1,
class: vue.normalizeClass(_ctx.nsSelect.be("dropdown", "loading"))
}, [
vue.renderSlot(_ctx.$slots, "loading")
], 2)) : _ctx.loading || _ctx.filteredOptionsCount === 0 ? (vue.openBlock(), vue.createElementBlock("div", {
key: 2,
class: vue.normalizeClass(_ctx.nsSelect.be("dropdown", "empty"))
}, [
vue.renderSlot(_ctx.$slots, "empty", {}, () => [
vue.createElementVNode("span", null, vue.toDisplayString(_ctx.emptyText), 1)
])
], 2)) : vue.createCommentVNode("v-if", true),
_ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("div", {
key: 3,
class: vue.normalizeClass(_ctx.nsSelect.be("dropdown", "footer")),
onClick: vue.withModifiers(() => {
}, ["stop"])
}, [
vue.renderSlot(_ctx.$slots, "footer")
], 10, ["onClick"])) : vue.createCommentVNode("v-if", true)
]),
_: 3
}, 512)
]),
_: 3
}, 8, ["visible", "placement", "teleported", "popper-class", "popper-style", "popper-options", "fallback-placements", "effect", "transition", "persistent", "append-to", "show-arrow", "offset", "onBeforeShow", "onHide"])
], 16, ["onMouseleave"])), [
[_directive_click_outside, _ctx.handleClickOutside, _ctx.popperRef]
]);
}
var Select = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "select.vue"]]);
exports["default"] = Select;
//# sourceMappingURL=select2.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,4 @@
import type { InjectionKey } from 'vue';
import type { SelectContext, SelectGroupContext } from './type';
export declare const selectGroupKey: InjectionKey<SelectGroupContext>;
export declare const selectKey: InjectionKey<SelectContext>;

View File

@@ -0,0 +1,10 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
const selectGroupKey = Symbol("ElSelectGroup");
const selectKey = Symbol("ElSelect");
exports.selectGroupKey = selectGroupKey;
exports.selectKey = selectKey;
//# sourceMappingURL=token.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"token.js","sources":["../../../../../../packages/components/select/src/token.ts"],"sourcesContent":["import type { InjectionKey } from 'vue'\nimport type { SelectContext, SelectGroupContext } from './type'\n\n// For individual build sharing injection key, we had to make `Symbol` to string\nexport const selectGroupKey: InjectionKey<SelectGroupContext> =\n Symbol('ElSelectGroup')\n\nexport const selectKey: InjectionKey<SelectContext> = Symbol('ElSelect')\n"],"names":[],"mappings":";;;;AAAY,MAAC,cAAc,GAAG,MAAM,CAAC,eAAe,EAAE;AAC1C,MAAC,SAAS,GAAG,MAAM,CAAC,UAAU;;;;;"}

View File

@@ -0,0 +1,65 @@
import type { ComponentInternalInstance, ComponentPublicInstance, ComputedRef, ExtractPropTypes, Ref, __ExtractPublicPropTypes } from 'vue';
import type { SelectProps } from './select';
import type { optionProps } from './option';
export interface SelectGroupContext {
disabled: boolean;
}
export interface SelectContext {
props: SelectProps;
states: SelectStates;
selectRef: HTMLElement | undefined;
optionsArray: OptionPublicInstance[];
setSelected(): void;
onOptionCreate(vm: OptionPublicInstance): void;
onOptionDestroy(key: OptionValue, vm: OptionPublicInstance): void;
handleOptionSelect(vm: OptionPublicInstance): void;
}
export type SelectStates = {
inputValue: string;
options: Map<OptionValue, OptionPublicInstance>;
cachedOptions: Map<OptionValue, OptionPublicInstance>;
optionValues: OptionValue[];
selected: OptionBasic[];
hoveringIndex: number;
inputHovering: boolean;
selectionWidth: number;
collapseItemWidth: number;
previousQuery: string | null;
selectedLabel: string;
menuVisibleOnFocus: boolean;
isBeforeHide: boolean;
};
export type OptionProps = ExtractPropTypes<typeof optionProps>;
export type OptionPropsPublic = __ExtractPublicPropTypes<typeof optionProps>;
export interface OptionStates {
index: number;
groupDisabled: boolean;
visible: boolean;
hover: boolean;
}
export interface OptionExposed {
ns: unknown;
id: unknown;
containerKls: unknown;
currentLabel: ComputedRef<string | number | boolean>;
itemSelected: ComputedRef<boolean>;
isDisabled: ComputedRef<boolean>;
visible: Ref<boolean>;
hover: Ref<boolean>;
states: OptionStates;
select: SelectContext;
hoverItem: () => void;
updateOption: (query: string) => void;
selectOptionClick: () => void;
}
export type OptionPublicInstance = ComponentPublicInstance<OptionProps, OptionExposed>;
export type OptionInternalInstance = ComponentInternalInstance & {
proxy: OptionPublicInstance;
};
export type OptionValue = OptionProps['value'];
export type OptionBasic = {
index: number;
value: OptionValue;
currentLabel: OptionPublicInstance['currentLabel'];
isDisabled?: OptionPublicInstance['isDisabled'];
};

View File

@@ -0,0 +1,3 @@
'use strict';
//# sourceMappingURL=type.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"type.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

View File

@@ -0,0 +1,10 @@
import type { OptionProps, OptionStates } from './type';
export declare function useOption(props: OptionProps, states: OptionStates): {
select: import("./type").SelectContext;
currentLabel: import("vue").ComputedRef<boolean | import("element-plus/es/utils").EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
currentValue: import("vue").ComputedRef<true | Record<string, any> | import("element-plus/es/utils").EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
itemSelected: import("vue").ComputedRef<boolean>;
isDisabled: import("vue").ComputedRef<boolean>;
hoverItem: () => void;
updateOption: (query: string) => void;
};

View File

@@ -0,0 +1,94 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var lodashUnified = require('lodash-unified');
var token = require('./token.js');
var option = require('./option.js');
var strings = require('../../../utils/strings.js');
var error = require('../../../utils/error.js');
var shared = require('@vue/shared');
function useOption(props, states) {
const select = vue.inject(token.selectKey);
if (!select) {
error.throwError(option.COMPONENT_NAME, "usage: <el-select><el-option /></el-select/>");
}
const selectGroup = vue.inject(token.selectGroupKey, { disabled: false });
const itemSelected = vue.computed(() => {
return contains(lodashUnified.castArray(select.props.modelValue), props.value);
});
const limitReached = vue.computed(() => {
var _a;
if (select.props.multiple) {
const modelValue = lodashUnified.castArray((_a = select.props.modelValue) != null ? _a : []);
return !itemSelected.value && modelValue.length >= select.props.multipleLimit && select.props.multipleLimit > 0;
} else {
return false;
}
});
const currentLabel = vue.computed(() => {
var _a;
return (_a = props.label) != null ? _a : shared.isObject(props.value) ? "" : props.value;
});
const currentValue = vue.computed(() => {
return props.value || props.label || "";
});
const isDisabled = vue.computed(() => {
return props.disabled || states.groupDisabled || limitReached.value;
});
const instance = vue.getCurrentInstance();
const contains = (arr = [], target) => {
if (!shared.isObject(props.value)) {
return arr && arr.includes(target);
} else {
const valueKey = select.props.valueKey;
return arr && arr.some((item) => {
return vue.toRaw(lodashUnified.get(item, valueKey)) === lodashUnified.get(target, valueKey);
});
}
};
const hoverItem = () => {
if (!props.disabled && !selectGroup.disabled) {
select.states.hoveringIndex = select.optionsArray.indexOf(instance.proxy);
}
};
const updateOption = (query) => {
const regexp = new RegExp(strings.escapeStringRegexp(query), "i");
states.visible = regexp.test(String(currentLabel.value)) || props.created;
};
vue.watch(() => currentLabel.value, () => {
if (!props.created && !select.props.remote)
select.setSelected();
});
vue.watch(() => props.value, (val, oldVal) => {
const { remote, valueKey } = select.props;
const shouldUpdate = remote ? val !== oldVal : !lodashUnified.isEqual(val, oldVal);
if (shouldUpdate) {
select.onOptionDestroy(oldVal, instance.proxy);
select.onOptionCreate(instance.proxy);
}
if (!props.created && !remote) {
if (valueKey && shared.isObject(val) && shared.isObject(oldVal) && val[valueKey] === oldVal[valueKey]) {
return;
}
select.setSelected();
}
});
vue.watch(() => selectGroup.disabled, () => {
states.groupDisabled = selectGroup.disabled;
}, { immediate: true });
return {
select,
currentLabel,
currentValue,
itemSelected,
isDisabled,
hoverItem,
updateOption
};
}
exports.useOption = useOption;
//# sourceMappingURL=useOption.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,157 @@
import type { Component } from 'vue';
import type { TooltipInstance } from 'element-plus/es/components/tooltip';
import type { ScrollbarInstance } from 'element-plus/es/components/scrollbar';
import type { SelectEmits, SelectProps } from './select';
import type { OptionBasic, OptionPublicInstance, OptionValue, SelectStates } from './type';
export declare const useSelect: (props: SelectProps, emit: SelectEmits) => {
inputId: import("vue").Ref<string | undefined>;
contentId: import("vue").Ref<string>;
nsSelect: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
nsInput: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
states: {
inputValue: string;
options: Map<OptionValue, OptionPublicInstance>;
cachedOptions: Map<OptionValue, OptionPublicInstance>;
optionValues: OptionValue[];
selected: {
index: number;
value: OptionValue;
currentLabel: OptionPublicInstance["currentLabel"];
isDisabled?: OptionPublicInstance["isDisabled"] | undefined;
}[];
hoveringIndex: number;
inputHovering: boolean;
selectionWidth: number;
collapseItemWidth: number;
previousQuery: string | null;
selectedLabel: string;
menuVisibleOnFocus: boolean;
isBeforeHide: boolean;
};
isFocused: import("vue").Ref<boolean>;
expanded: import("vue").Ref<boolean>;
optionsArray: import("vue").ComputedRef<OptionPublicInstance[]>;
hoverOption: import("vue").Ref<any>;
selectSize: import("vue").ComputedRef<"" | "small" | "default" | "large">;
filteredOptionsCount: import("vue").ComputedRef<number>;
updateTooltip: () => void;
updateTagTooltip: () => void;
debouncedOnInputChange: import("lodash").DebouncedFunc<() => void>;
onInput: (event: Event) => void;
deletePrevTag: (e: KeyboardEvent) => void;
deleteTag: (event: MouseEvent, tag: OptionBasic) => void;
deleteSelected: (event: Event) => void;
handleOptionSelect: (option: OptionPublicInstance) => void;
scrollToOption: (option: OptionPublicInstance | OptionPublicInstance[] | SelectStates["selected"]) => void;
hasModelValue: import("vue").ComputedRef<boolean>;
shouldShowPlaceholder: import("vue").ComputedRef<boolean>;
currentPlaceholder: import("vue").ComputedRef<string>;
mouseEnterEventName: import("vue").ComputedRef<"mouseenter" | null>;
needStatusIcon: import("vue").ComputedRef<boolean>;
showClearBtn: import("vue").ComputedRef<boolean>;
iconComponent: import("vue").ComputedRef<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | Component) & {}) | (() => string | Component) | ((new (...args: any[]) => (string | Component) & {}) | (() => string | Component))[], unknown, unknown> | undefined>;
iconReverse: import("vue").ComputedRef<string>;
validateState: import("vue").ComputedRef<"" | "error" | "success" | "validating">;
validateIcon: import("vue").ComputedRef<"" | Component>;
showNewOption: import("vue").ComputedRef<boolean>;
updateOptions: () => void;
collapseTagSize: import("vue").ComputedRef<"default" | "small">;
setSelected: () => void;
selectDisabled: import("vue").ComputedRef<boolean>;
emptyText: import("vue").ComputedRef<string | null>;
handleCompositionStart: (event: CompositionEvent) => void;
handleCompositionUpdate: (event: CompositionEvent) => void;
handleCompositionEnd: (event: CompositionEvent) => void;
onOptionCreate: (vm: OptionPublicInstance) => void;
onOptionDestroy: (key: OptionValue, vm: OptionPublicInstance) => void;
handleMenuEnter: () => void;
focus: () => void;
blur: () => void;
handleClearClick: (event: Event) => void;
handleClickOutside: (event: Event) => void;
handleEsc: () => void;
toggleMenu: () => void;
selectOption: () => void;
getValueKey: (item: OptionPublicInstance | SelectStates["selected"][0]) => any;
navigateOptions: (direction: "prev" | "next") => void;
dropdownMenuVisible: import("vue").WritableComputedRef<boolean>;
showTagList: import("vue").ComputedRef<{
index: number;
value: OptionValue;
currentLabel: OptionPublicInstance["currentLabel"];
isDisabled?: OptionPublicInstance["isDisabled"] | undefined;
}[]>;
collapseTagList: import("vue").ComputedRef<{
index: number;
value: OptionValue;
currentLabel: OptionPublicInstance["currentLabel"];
isDisabled?: OptionPublicInstance["isDisabled"] | undefined;
}[]>;
popupScroll: (data: {
scrollTop: number;
scrollLeft: number;
}) => void;
getOption: (value: OptionValue) => {
index: number;
value: import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>;
currentLabel: any;
} | {
index: number;
value: import("element-plus/es/utils").EpPropMergeType<(ObjectConstructor | BooleanConstructor | NumberConstructor | StringConstructor)[], unknown, unknown>;
currentLabel: string | number | boolean;
readonly isDisabled: boolean;
};
tagStyle: import("vue").ComputedRef<{
maxWidth: string;
}>;
collapseTagStyle: import("vue").ComputedRef<{
maxWidth: string;
}>;
popperRef: import("vue").ComputedRef<HTMLElement | undefined>;
inputRef: import("vue").Ref<HTMLInputElement | undefined>;
tooltipRef: import("vue").Ref<TooltipInstance | undefined>;
tagTooltipRef: import("vue").Ref<TooltipInstance | undefined>;
prefixRef: import("vue").Ref<HTMLElement | undefined>;
suffixRef: import("vue").Ref<HTMLElement | undefined>;
selectRef: import("vue").Ref<HTMLElement | undefined>;
wrapperRef: import("vue").ShallowRef<HTMLElement | undefined>;
selectionRef: import("vue").Ref<HTMLElement | undefined>;
scrollbarRef: import("vue").Ref<ScrollbarInstance | undefined>;
menuRef: import("vue").Ref<HTMLElement | undefined>;
tagMenuRef: import("vue").Ref<HTMLElement | undefined>;
collapseItemRef: import("vue").Ref<HTMLElement | undefined>;
};

View File

@@ -0,0 +1,667 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var lodashUnified = require('lodash-unified');
var core = require('@vueuse/core');
var index = require('../../../hooks/use-locale/index.js');
var index$1 = require('../../../hooks/use-id/index.js');
var index$2 = require('../../../hooks/use-namespace/index.js');
var useFormItem = require('../../form/src/hooks/use-form-item.js');
var index$3 = require('../../../hooks/use-empty-values/index.js');
var index$4 = require('../../../hooks/use-composition/index.js');
var index$5 = require('../../../hooks/use-focus-controller/index.js');
var error = require('../../../utils/error.js');
var shared = require('@vue/shared');
var icon = require('../../../utils/vue/icon.js');
var useFormCommonProps = require('../../form/src/hooks/use-form-common-props.js');
var types = require('../../../utils/types.js');
var aria = require('../../../constants/aria.js');
var event = require('../../../constants/event.js');
var scroll = require('../../../utils/dom/scroll.js');
var form = require('../../../constants/form.js');
const useSelect = (props, emit) => {
const { t } = index.useLocale();
const contentId = index$1.useId();
const nsSelect = index$2.useNamespace("select");
const nsInput = index$2.useNamespace("input");
const states = vue.reactive({
inputValue: "",
options: /* @__PURE__ */ new Map(),
cachedOptions: /* @__PURE__ */ new Map(),
optionValues: [],
selected: [],
selectionWidth: 0,
collapseItemWidth: 0,
selectedLabel: "",
hoveringIndex: -1,
previousQuery: null,
inputHovering: false,
menuVisibleOnFocus: false,
isBeforeHide: false
});
const selectRef = vue.ref();
const selectionRef = vue.ref();
const tooltipRef = vue.ref();
const tagTooltipRef = vue.ref();
const inputRef = vue.ref();
const prefixRef = vue.ref();
const suffixRef = vue.ref();
const menuRef = vue.ref();
const tagMenuRef = vue.ref();
const collapseItemRef = vue.ref();
const scrollbarRef = vue.ref();
const expanded = vue.ref(false);
const hoverOption = vue.ref();
const { form: form$1, formItem } = useFormItem.useFormItem();
const { inputId } = useFormItem.useFormItemInputId(props, {
formItemContext: formItem
});
const { valueOnClear, isEmptyValue } = index$3.useEmptyValues(props);
const {
isComposing,
handleCompositionStart,
handleCompositionUpdate,
handleCompositionEnd
} = index$4.useComposition({
afterComposition: (e) => onInput(e)
});
const selectDisabled = vue.computed(() => props.disabled || !!(form$1 == null ? void 0 : form$1.disabled));
const { wrapperRef, isFocused, handleBlur } = index$5.useFocusController(inputRef, {
disabled: selectDisabled,
afterFocus() {
if (props.automaticDropdown && !expanded.value) {
expanded.value = true;
states.menuVisibleOnFocus = true;
}
},
beforeBlur(event) {
var _a, _b;
return ((_a = tooltipRef.value) == null ? void 0 : _a.isFocusInsideContent(event)) || ((_b = tagTooltipRef.value) == null ? void 0 : _b.isFocusInsideContent(event));
},
afterBlur() {
var _a;
expanded.value = false;
states.menuVisibleOnFocus = false;
if (props.validateEvent) {
(_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "blur").catch((err) => error.debugWarn());
}
}
});
const hasModelValue = vue.computed(() => {
return shared.isArray(props.modelValue) ? props.modelValue.length > 0 : !isEmptyValue(props.modelValue);
});
const needStatusIcon = vue.computed(() => {
var _a;
return (_a = form$1 == null ? void 0 : form$1.statusIcon) != null ? _a : false;
});
const showClearBtn = vue.computed(() => {
return props.clearable && !selectDisabled.value && hasModelValue.value && (isFocused.value || states.inputHovering);
});
const iconComponent = vue.computed(() => props.remote && props.filterable && !props.remoteShowSuffix ? "" : props.suffixIcon);
const iconReverse = vue.computed(() => nsSelect.is("reverse", !!(iconComponent.value && expanded.value)));
const validateState = vue.computed(() => (formItem == null ? void 0 : formItem.validateState) || "");
const validateIcon = vue.computed(() => validateState.value && icon.ValidateComponentsMap[validateState.value]);
const debounce = vue.computed(() => props.remote ? 300 : 0);
const isRemoteSearchEmpty = vue.computed(() => props.remote && !states.inputValue && states.options.size === 0);
const emptyText = vue.computed(() => {
if (props.loading) {
return props.loadingText || t("el.select.loading");
} else {
if (props.filterable && states.inputValue && states.options.size > 0 && filteredOptionsCount.value === 0) {
return props.noMatchText || t("el.select.noMatch");
}
if (states.options.size === 0) {
return props.noDataText || t("el.select.noData");
}
}
return null;
});
const filteredOptionsCount = vue.computed(() => optionsArray.value.filter((option) => option.visible).length);
const optionsArray = vue.computed(() => {
const list = Array.from(states.options.values());
const newList = [];
states.optionValues.forEach((item) => {
const index = list.findIndex((i) => i.value === item);
if (index > -1) {
newList.push(list[index]);
}
});
return newList.length >= list.length ? newList : list;
});
const cachedOptionsArray = vue.computed(() => Array.from(states.cachedOptions.values()));
const showNewOption = vue.computed(() => {
const hasExistingOption = optionsArray.value.filter((option) => {
return !option.created;
}).some((option) => {
return option.currentLabel === states.inputValue;
});
return props.filterable && props.allowCreate && states.inputValue !== "" && !hasExistingOption;
});
const updateOptions = () => {
if (props.filterable && shared.isFunction(props.filterMethod))
return;
if (props.filterable && props.remote && shared.isFunction(props.remoteMethod))
return;
optionsArray.value.forEach((option) => {
var _a;
(_a = option.updateOption) == null ? void 0 : _a.call(option, states.inputValue);
});
};
const selectSize = useFormCommonProps.useFormSize();
const collapseTagSize = vue.computed(() => ["small"].includes(selectSize.value) ? "small" : "default");
const dropdownMenuVisible = vue.computed({
get() {
return expanded.value && !isRemoteSearchEmpty.value;
},
set(val) {
expanded.value = val;
}
});
const shouldShowPlaceholder = vue.computed(() => {
if (props.multiple && !types.isUndefined(props.modelValue)) {
return lodashUnified.castArray(props.modelValue).length === 0 && !states.inputValue;
}
const value = shared.isArray(props.modelValue) ? props.modelValue[0] : props.modelValue;
return props.filterable || types.isUndefined(value) ? !states.inputValue : true;
});
const currentPlaceholder = vue.computed(() => {
var _a;
const _placeholder = (_a = props.placeholder) != null ? _a : t("el.select.placeholder");
return props.multiple || !hasModelValue.value ? _placeholder : states.selectedLabel;
});
const mouseEnterEventName = vue.computed(() => core.isIOS ? null : "mouseenter");
vue.watch(() => props.modelValue, (val, oldVal) => {
if (props.multiple) {
if (props.filterable && !props.reserveKeyword) {
states.inputValue = "";
handleQueryChange("");
}
}
setSelected();
if (!lodashUnified.isEqual(val, oldVal) && props.validateEvent) {
formItem == null ? void 0 : formItem.validate("change").catch((err) => error.debugWarn());
}
}, {
flush: "post",
deep: true
});
vue.watch(() => expanded.value, (val) => {
if (val) {
handleQueryChange(states.inputValue);
} else {
states.inputValue = "";
states.previousQuery = null;
states.isBeforeHide = true;
}
emit("visible-change", val);
});
vue.watch(() => states.options.entries(), () => {
if (!core.isClient)
return;
setSelected();
if (props.defaultFirstOption && (props.filterable || props.remote) && filteredOptionsCount.value) {
checkDefaultFirstOption();
}
}, {
flush: "post"
});
vue.watch([() => states.hoveringIndex, optionsArray], ([val]) => {
if (types.isNumber(val) && val > -1) {
hoverOption.value = optionsArray.value[val] || {};
} else {
hoverOption.value = {};
}
optionsArray.value.forEach((option) => {
option.hover = hoverOption.value === option;
});
});
vue.watchEffect(() => {
if (states.isBeforeHide)
return;
updateOptions();
});
const handleQueryChange = (val) => {
if (states.previousQuery === val || isComposing.value) {
return;
}
states.previousQuery = val;
if (props.filterable && shared.isFunction(props.filterMethod)) {
props.filterMethod(val);
} else if (props.filterable && props.remote && shared.isFunction(props.remoteMethod)) {
props.remoteMethod(val);
}
if (props.defaultFirstOption && (props.filterable || props.remote) && filteredOptionsCount.value) {
vue.nextTick(checkDefaultFirstOption);
} else {
vue.nextTick(updateHoveringIndex);
}
};
const checkDefaultFirstOption = () => {
const optionsInDropdown = optionsArray.value.filter((n) => n.visible && !n.disabled && !n.states.groupDisabled);
const userCreatedOption = optionsInDropdown.find((n) => n.created);
const firstOriginOption = optionsInDropdown[0];
const valueList = optionsArray.value.map((item) => item.value);
states.hoveringIndex = getValueIndex(valueList, userCreatedOption || firstOriginOption);
};
const setSelected = () => {
if (!props.multiple) {
const value = shared.isArray(props.modelValue) ? props.modelValue[0] : props.modelValue;
const option = getOption(value);
states.selectedLabel = option.currentLabel;
states.selected = [option];
return;
} else {
states.selectedLabel = "";
}
const result = [];
if (!types.isUndefined(props.modelValue)) {
lodashUnified.castArray(props.modelValue).forEach((value) => {
result.push(getOption(value));
});
}
states.selected = result;
};
const getOption = (value) => {
let option;
const isObjectValue = shared.isPlainObject(value);
for (let i = states.cachedOptions.size - 1; i >= 0; i--) {
const cachedOption = cachedOptionsArray.value[i];
const isEqualValue = isObjectValue ? lodashUnified.get(cachedOption.value, props.valueKey) === lodashUnified.get(value, props.valueKey) : cachedOption.value === value;
if (isEqualValue) {
option = {
index: optionsArray.value.filter((opt) => !opt.created).indexOf(cachedOption),
value,
currentLabel: cachedOption.currentLabel,
get isDisabled() {
return cachedOption.isDisabled;
}
};
break;
}
}
if (option)
return option;
const label = isObjectValue ? value.label : value != null ? value : "";
const newOption = {
index: -1,
value,
currentLabel: label
};
return newOption;
};
const updateHoveringIndex = () => {
states.hoveringIndex = optionsArray.value.findIndex((item) => states.selected.some((selected) => getValueKey(selected) === getValueKey(item)));
};
const resetSelectionWidth = () => {
states.selectionWidth = Number.parseFloat(window.getComputedStyle(selectionRef.value).width);
};
const resetCollapseItemWidth = () => {
states.collapseItemWidth = collapseItemRef.value.getBoundingClientRect().width;
};
const updateTooltip = () => {
var _a, _b;
(_b = (_a = tooltipRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
};
const updateTagTooltip = () => {
var _a, _b;
(_b = (_a = tagTooltipRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
};
const onInputChange = () => {
if (states.inputValue.length > 0 && !expanded.value) {
expanded.value = true;
}
handleQueryChange(states.inputValue);
};
const onInput = (event) => {
states.inputValue = event.target.value;
if (props.remote) {
debouncedOnInputChange();
} else {
return onInputChange();
}
};
const debouncedOnInputChange = lodashUnified.debounce(() => {
onInputChange();
}, debounce.value);
const emitChange = (val) => {
if (!lodashUnified.isEqual(props.modelValue, val)) {
emit(event.CHANGE_EVENT, val);
}
};
const getLastNotDisabledIndex = (value) => lodashUnified.findLastIndex(value, (it) => {
const option = states.cachedOptions.get(it);
return option && !option.disabled && !option.states.groupDisabled;
});
const deletePrevTag = (e) => {
if (!props.multiple)
return;
if (e.code === aria.EVENT_CODE.delete)
return;
if (e.target.value.length <= 0) {
const value = lodashUnified.castArray(props.modelValue).slice();
const lastNotDisabledIndex = getLastNotDisabledIndex(value);
if (lastNotDisabledIndex < 0)
return;
const removeTagValue = value[lastNotDisabledIndex];
value.splice(lastNotDisabledIndex, 1);
emit(event.UPDATE_MODEL_EVENT, value);
emitChange(value);
emit("remove-tag", removeTagValue);
}
};
const deleteTag = (event$1, tag) => {
const index = states.selected.indexOf(tag);
if (index > -1 && !selectDisabled.value) {
const value = lodashUnified.castArray(props.modelValue).slice();
value.splice(index, 1);
emit(event.UPDATE_MODEL_EVENT, value);
emitChange(value);
emit("remove-tag", tag.value);
}
event$1.stopPropagation();
focus();
};
const deleteSelected = (event$1) => {
event$1.stopPropagation();
const value = props.multiple ? [] : valueOnClear.value;
if (props.multiple) {
for (const item of states.selected) {
if (item.isDisabled)
value.push(item.value);
}
}
emit(event.UPDATE_MODEL_EVENT, value);
emitChange(value);
states.hoveringIndex = -1;
expanded.value = false;
emit("clear");
focus();
};
const handleOptionSelect = (option) => {
var _a;
if (props.multiple) {
const value = lodashUnified.castArray((_a = props.modelValue) != null ? _a : []).slice();
const optionIndex = getValueIndex(value, option);
if (optionIndex > -1) {
value.splice(optionIndex, 1);
} else if (props.multipleLimit <= 0 || value.length < props.multipleLimit) {
value.push(option.value);
}
emit(event.UPDATE_MODEL_EVENT, value);
emitChange(value);
if (option.created) {
handleQueryChange("");
}
if (props.filterable && !props.reserveKeyword) {
states.inputValue = "";
}
} else {
!lodashUnified.isEqual(props.modelValue, option.value) && emit(event.UPDATE_MODEL_EVENT, option.value);
emitChange(option.value);
expanded.value = false;
}
focus();
if (expanded.value)
return;
vue.nextTick(() => {
scrollToOption(option);
});
};
const getValueIndex = (arr, option) => {
if (types.isUndefined(option))
return -1;
if (!shared.isObject(option.value))
return arr.indexOf(option.value);
return arr.findIndex((item) => {
return lodashUnified.isEqual(lodashUnified.get(item, props.valueKey), getValueKey(option));
});
};
const scrollToOption = (option) => {
var _a, _b, _c, _d, _e;
const targetOption = shared.isArray(option) ? option[0] : option;
let target = null;
if (targetOption == null ? void 0 : targetOption.value) {
const options = optionsArray.value.filter((item) => item.value === targetOption.value);
if (options.length > 0) {
target = options[0].$el;
}
}
if (tooltipRef.value && target) {
const menu = (_d = (_c = (_b = (_a = tooltipRef.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.contentRef) == null ? void 0 : _c.querySelector) == null ? void 0 : _d.call(_c, `.${nsSelect.be("dropdown", "wrap")}`);
if (menu) {
scroll.scrollIntoView(menu, target);
}
}
(_e = scrollbarRef.value) == null ? void 0 : _e.handleScroll();
};
const onOptionCreate = (vm) => {
states.options.set(vm.value, vm);
states.cachedOptions.set(vm.value, vm);
};
const onOptionDestroy = (key, vm) => {
if (states.options.get(key) === vm) {
states.options.delete(key);
}
};
const popperRef = vue.computed(() => {
var _a, _b;
return (_b = (_a = tooltipRef.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.contentRef;
});
const handleMenuEnter = () => {
states.isBeforeHide = false;
vue.nextTick(() => {
var _a;
(_a = scrollbarRef.value) == null ? void 0 : _a.update();
scrollToOption(states.selected);
});
};
const focus = () => {
var _a;
(_a = inputRef.value) == null ? void 0 : _a.focus();
};
const blur = () => {
var _a;
if (expanded.value) {
expanded.value = false;
vue.nextTick(() => {
var _a2;
return (_a2 = inputRef.value) == null ? void 0 : _a2.blur();
});
return;
}
(_a = inputRef.value) == null ? void 0 : _a.blur();
};
const handleClearClick = (event) => {
deleteSelected(event);
};
const handleClickOutside = (event) => {
expanded.value = false;
if (isFocused.value) {
const _event = new FocusEvent("blur", event);
vue.nextTick(() => handleBlur(_event));
}
};
const handleEsc = () => {
if (states.inputValue.length > 0) {
states.inputValue = "";
} else {
expanded.value = false;
}
};
const toggleMenu = () => {
if (selectDisabled.value)
return;
if (core.isIOS)
states.inputHovering = true;
if (states.menuVisibleOnFocus) {
states.menuVisibleOnFocus = false;
} else {
expanded.value = !expanded.value;
}
};
const selectOption = () => {
if (!expanded.value) {
toggleMenu();
} else {
const option = optionsArray.value[states.hoveringIndex];
if (option && !option.isDisabled) {
handleOptionSelect(option);
}
}
};
const getValueKey = (item) => {
return shared.isObject(item.value) ? lodashUnified.get(item.value, props.valueKey) : item.value;
};
const optionsAllDisabled = vue.computed(() => optionsArray.value.filter((option) => option.visible).every((option) => option.isDisabled));
const showTagList = vue.computed(() => {
if (!props.multiple) {
return [];
}
return props.collapseTags ? states.selected.slice(0, props.maxCollapseTags) : states.selected;
});
const collapseTagList = vue.computed(() => {
if (!props.multiple) {
return [];
}
return props.collapseTags ? states.selected.slice(props.maxCollapseTags) : [];
});
const navigateOptions = (direction) => {
if (!expanded.value) {
expanded.value = true;
return;
}
if (states.options.size === 0 || filteredOptionsCount.value === 0 || isComposing.value)
return;
if (!optionsAllDisabled.value) {
if (direction === "next") {
states.hoveringIndex++;
if (states.hoveringIndex === states.options.size) {
states.hoveringIndex = 0;
}
} else if (direction === "prev") {
states.hoveringIndex--;
if (states.hoveringIndex < 0) {
states.hoveringIndex = states.options.size - 1;
}
}
const option = optionsArray.value[states.hoveringIndex];
if (option.isDisabled || !option.visible) {
navigateOptions(direction);
}
vue.nextTick(() => scrollToOption(hoverOption.value));
}
};
const getGapWidth = () => {
if (!selectionRef.value)
return 0;
const style = window.getComputedStyle(selectionRef.value);
return Number.parseFloat(style.gap || "6px");
};
const tagStyle = vue.computed(() => {
const gapWidth = getGapWidth();
const inputSlotWidth = props.filterable ? gapWidth + form.MINIMUM_INPUT_WIDTH : 0;
const maxWidth = collapseItemRef.value && props.maxCollapseTags === 1 ? states.selectionWidth - states.collapseItemWidth - gapWidth - inputSlotWidth : states.selectionWidth - inputSlotWidth;
return { maxWidth: `${maxWidth}px` };
});
const collapseTagStyle = vue.computed(() => {
return { maxWidth: `${states.selectionWidth}px` };
});
const popupScroll = (data) => {
emit("popup-scroll", data);
};
core.useResizeObserver(selectionRef, resetSelectionWidth);
core.useResizeObserver(wrapperRef, updateTooltip);
core.useResizeObserver(tagMenuRef, updateTagTooltip);
core.useResizeObserver(collapseItemRef, resetCollapseItemWidth);
let stop;
vue.watch(() => dropdownMenuVisible.value, (newVal) => {
if (newVal) {
stop = core.useResizeObserver(menuRef, updateTooltip).stop;
} else {
stop == null ? void 0 : stop();
stop = void 0;
}
});
vue.onMounted(() => {
setSelected();
});
return {
inputId,
contentId,
nsSelect,
nsInput,
states,
isFocused,
expanded,
optionsArray,
hoverOption,
selectSize,
filteredOptionsCount,
updateTooltip,
updateTagTooltip,
debouncedOnInputChange,
onInput,
deletePrevTag,
deleteTag,
deleteSelected,
handleOptionSelect,
scrollToOption,
hasModelValue,
shouldShowPlaceholder,
currentPlaceholder,
mouseEnterEventName,
needStatusIcon,
showClearBtn,
iconComponent,
iconReverse,
validateState,
validateIcon,
showNewOption,
updateOptions,
collapseTagSize,
setSelected,
selectDisabled,
emptyText,
handleCompositionStart,
handleCompositionUpdate,
handleCompositionEnd,
onOptionCreate,
onOptionDestroy,
handleMenuEnter,
focus,
blur,
handleClearClick,
handleClickOutside,
handleEsc,
toggleMenu,
selectOption,
getValueKey,
navigateOptions,
dropdownMenuVisible,
showTagList,
collapseTagList,
popupScroll,
getOption,
tagStyle,
collapseTagStyle,
popperRef,
inputRef,
tooltipRef,
tagTooltipRef,
prefixRef,
suffixRef,
selectRef,
wrapperRef,
selectionRef,
scrollbarRef,
menuRef,
tagMenuRef,
collapseItemRef
};
};
exports.useSelect = useSelect;
//# sourceMappingURL=useSelect.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,7 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/es/components/tag/style/css';
import 'element-plus/es/components/option/style/css';
import 'element-plus/es/components/option-group/style/css';
import 'element-plus/es/components/scrollbar/style/css';
import 'element-plus/es/components/popper/style/css';
import 'element-plus/theme-chalk/el-select.css';

View File

@@ -0,0 +1,11 @@
'use strict';
require('../../base/style/css.js');
require('../../tag/style/css.js');
require('../../option/style/css.js');
require('../../option-group/style/css.js');
require('../../scrollbar/style/css.js');
require('../../popper/style/css.js');
require('element-plus/theme-chalk/el-select.css');
//# sourceMappingURL=css.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

View File

@@ -0,0 +1,7 @@
import 'element-plus/es/components/base/style';
import 'element-plus/es/components/tag/style';
import 'element-plus/es/components/option/style';
import 'element-plus/es/components/option-group/style';
import 'element-plus/es/components/scrollbar/style';
import 'element-plus/es/components/popper/style';
import 'element-plus/theme-chalk/src/select.scss';

View File

@@ -0,0 +1,11 @@
'use strict';
require('../../base/style/index.js');
require('../../tag/style/index.js');
require('../../option/style/index.js');
require('../../option-group/style/index.js');
require('../../scrollbar/style/index.js');
require('../../popper/style/index.js');
require('element-plus/theme-chalk/src/select.scss');
//# sourceMappingURL=index.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}