@koi-design/uxd-ui 14.0.39 → 14.0.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/components/Calendar/Calendar.vue.d.ts +3 -3
- package/es/components/Calendar/Header.vue.d.ts +3 -3
- package/es/components/Calendar/index.d.ts +6 -6
- package/es/components/Cascader/Cascader.d.ts +1 -1
- package/es/components/DatePicker/DatePicker.vue.d.ts +3 -3
- package/es/components/DatePicker/Panel/DatePickerPanel.vue.d.ts +3 -3
- package/es/components/DatePicker/index.d.ts +6 -6
- package/es/components/Select/RefSelect.vue.d.ts +59 -1017
- package/es/components/Select/Select.d.ts +4 -4
- package/es/components/Select/Select.type.d.ts +1 -1
- package/es/components/Select/Select.type.mjs +1 -1
- package/es/components/Select/Select.type.mjs.map +1 -1
- package/es/components/Select/Selection/Multiple.vue.d.ts +2 -2
- package/es/components/Select/Selection/Multiple.vue_vue_type_script_lang.mjs +1 -1
- package/es/components/Select/Selection/Multiple.vue_vue_type_script_lang.mjs.map +1 -1
- package/es/components/Select/Selection/MultipleBase.d.ts +253 -0
- package/es/components/Select/Selection/MultipleBase.mjs +317 -0
- package/es/components/Select/Selection/MultipleBase.mjs.map +1 -0
- package/es/components/Select/Selection/MultipleOverFlow.mjs +202 -0
- package/es/components/Select/Selection/MultipleOverFlow.mjs.map +1 -0
- package/es/components/Select/Selection/MultipleOverFlow.vue.d.ts +1191 -0
- package/es/components/Select/Selection/MultipleOverFlow.vue_vue_type_script_lang.mjs +265 -0
- package/es/components/Select/Selection/MultipleOverFlow.vue_vue_type_script_lang.mjs.map +1 -0
- package/es/components/Select/Selection/Selection.mjs +90 -67
- package/es/components/Select/Selection/Selection.mjs.map +1 -1
- package/es/components/Select/Selection/Selection.vue.d.ts +57 -1015
- package/es/components/Select/hooks/useMultipleBase.d.ts +32 -0
- package/es/components/Select/hooks/useMultipleBase.mjs +211 -0
- package/es/components/Select/hooks/useMultipleBase.mjs.map +1 -0
- package/es/components/Select/index.d.ts +3 -3
- package/es/components/TreeSelect/TreeSelect.vue.d.ts +57 -1015
- package/es/components/TreeSelect/index.d.ts +1065 -2981
- package/lib/components/Calendar/Calendar.vue.d.ts +3 -3
- package/lib/components/Calendar/Header.vue.d.ts +3 -3
- package/lib/components/Calendar/index.d.ts +6 -6
- package/lib/components/Cascader/Cascader.d.ts +1 -1
- package/lib/components/DatePicker/DatePicker.vue.d.ts +3 -3
- package/lib/components/DatePicker/Panel/DatePickerPanel.vue.d.ts +3 -3
- package/lib/components/DatePicker/index.d.ts +6 -6
- package/lib/components/Select/RefSelect.vue.d.ts +59 -1017
- package/lib/components/Select/Select.d.ts +4 -4
- package/lib/components/Select/Select.type.d.ts +1 -1
- package/lib/components/Select/Select.type.js +1 -1
- package/lib/components/Select/Select.type.js.map +1 -1
- package/lib/components/Select/Selection/Multiple.vue.d.ts +2 -2
- package/lib/components/Select/Selection/Multiple.vue_vue_type_script_lang.js +1 -1
- package/lib/components/Select/Selection/Multiple.vue_vue_type_script_lang.js.map +1 -1
- package/lib/components/Select/Selection/MultipleBase.d.ts +253 -0
- package/lib/components/Select/Selection/MultipleBase.js +326 -0
- package/lib/components/Select/Selection/MultipleBase.js.map +1 -0
- package/lib/components/Select/Selection/MultipleOverFlow.js +206 -0
- package/lib/components/Select/Selection/MultipleOverFlow.js.map +1 -0
- package/lib/components/Select/Selection/MultipleOverFlow.vue.d.ts +1191 -0
- package/lib/components/Select/Selection/MultipleOverFlow.vue_vue_type_script_lang.js +269 -0
- package/lib/components/Select/Selection/MultipleOverFlow.vue_vue_type_script_lang.js.map +1 -0
- package/lib/components/Select/Selection/Selection.js +89 -66
- package/lib/components/Select/Selection/Selection.js.map +1 -1
- package/lib/components/Select/Selection/Selection.vue.d.ts +57 -1015
- package/lib/components/Select/hooks/useMultipleBase.d.ts +32 -0
- package/lib/components/Select/hooks/useMultipleBase.js +216 -0
- package/lib/components/Select/hooks/useMultipleBase.js.map +1 -0
- package/lib/components/Select/index.d.ts +3 -3
- package/lib/components/TreeSelect/TreeSelect.vue.d.ts +57 -1015
- package/lib/components/TreeSelect/index.d.ts +1065 -2981
- package/package.json +1 -1
- package/styles/components/cascader/index.css +1 -1
- package/styles/components/form/index.css +1 -1
- package/styles/components/form/index.less +12 -1
- package/styles/components/form/var.less +1 -1
- package/styles/components/select/index.css +1 -1
- package/styles/components/select/index.less +10 -0
- package/styles/index.css +1 -1
- package/types/components/Calendar/Calendar.vue.d.ts +3 -3
- package/types/components/Calendar/Header.vue.d.ts +3 -3
- package/types/components/Calendar/index.d.ts +6 -6
- package/types/components/Cascader/Cascader.d.ts +1 -1
- package/types/components/DatePicker/DatePicker.vue.d.ts +3 -3
- package/types/components/DatePicker/Panel/DatePickerPanel.vue.d.ts +3 -3
- package/types/components/DatePicker/index.d.ts +6 -6
- package/types/components/Select/RefSelect.vue.d.ts +59 -1017
- package/types/components/Select/Select.d.ts +4 -4
- package/types/components/Select/Select.type.d.ts +1 -1
- package/types/components/Select/Selection/Multiple.vue.d.ts +2 -2
- package/types/components/Select/Selection/MultipleBase.d.ts +253 -0
- package/types/components/Select/Selection/MultipleOverFlow.vue.d.ts +1191 -0
- package/types/components/Select/Selection/Selection.vue.d.ts +57 -1015
- package/types/components/Select/hooks/useMultipleBase.d.ts +32 -0
- package/types/components/Select/index.d.ts +3 -3
- package/types/components/TreeSelect/TreeSelect.vue.d.ts +57 -1015
- package/types/components/TreeSelect/index.d.ts +1065 -2981
- package/uxd-ui.css +1 -1
- package/uxd-ui.esm.min.mjs +7 -7
- package/uxd-ui.esm.mjs +722 -535
- package/uxd-ui.umd.js +722 -535
- package/uxd-ui.umd.min.js +7 -7
|
@@ -0,0 +1,326 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var vue = require('vue');
|
|
6
|
+
var index$1 = require('../../Icon/index.js');
|
|
7
|
+
var index = require('../../Popover/index.js');
|
|
8
|
+
var lucideVueNext = require('lucide-vue-next');
|
|
9
|
+
var ResizeObserver = require('../../base/ResizeObserver.js');
|
|
10
|
+
var slots = require('../../../utils/slots.js');
|
|
11
|
+
var useMultipleBase = require('../hooks/useMultipleBase.js');
|
|
12
|
+
var Input = require('./Input.js');
|
|
13
|
+
|
|
14
|
+
function _isSlot(s) {
|
|
15
|
+
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
|
|
16
|
+
}
|
|
17
|
+
const defaultMaxTagPlaceholder = (ommittedValus) => `+ ${ommittedValus.length}...`;
|
|
18
|
+
const multipleBaseProps = {
|
|
19
|
+
prefixCls: {
|
|
20
|
+
type: String
|
|
21
|
+
},
|
|
22
|
+
values: {
|
|
23
|
+
type: Array,
|
|
24
|
+
default: () => []
|
|
25
|
+
},
|
|
26
|
+
searchValue: {
|
|
27
|
+
type: String
|
|
28
|
+
},
|
|
29
|
+
filterable: {
|
|
30
|
+
type: Boolean,
|
|
31
|
+
default: false
|
|
32
|
+
},
|
|
33
|
+
disabled: {
|
|
34
|
+
type: Boolean,
|
|
35
|
+
default: void 0
|
|
36
|
+
},
|
|
37
|
+
open: {
|
|
38
|
+
type: Boolean,
|
|
39
|
+
default: void 0
|
|
40
|
+
},
|
|
41
|
+
inputRef: {
|
|
42
|
+
type: Function
|
|
43
|
+
},
|
|
44
|
+
tagTransitionName: {
|
|
45
|
+
type: String
|
|
46
|
+
},
|
|
47
|
+
maxTagCount: {
|
|
48
|
+
type: Number
|
|
49
|
+
},
|
|
50
|
+
maxTagTextLength: {
|
|
51
|
+
type: [Number, String]
|
|
52
|
+
},
|
|
53
|
+
maxTagPlaceholder: {
|
|
54
|
+
type: Function,
|
|
55
|
+
default: defaultMaxTagPlaceholder
|
|
56
|
+
},
|
|
57
|
+
maxTagTooltip: {
|
|
58
|
+
type: Boolean,
|
|
59
|
+
default: false
|
|
60
|
+
},
|
|
61
|
+
maxTagTooltipWidth: {
|
|
62
|
+
type: Number,
|
|
63
|
+
default: 99900
|
|
64
|
+
},
|
|
65
|
+
tagRender: {
|
|
66
|
+
type: Function
|
|
67
|
+
},
|
|
68
|
+
removeIcon: {
|
|
69
|
+
type: [String, Object]
|
|
70
|
+
},
|
|
71
|
+
isShowTagTooltip: {
|
|
72
|
+
type: Boolean,
|
|
73
|
+
default: false
|
|
74
|
+
},
|
|
75
|
+
popoverProps: {
|
|
76
|
+
type: Object,
|
|
77
|
+
default: () => ({})
|
|
78
|
+
},
|
|
79
|
+
itemWidth: {
|
|
80
|
+
type: Number,
|
|
81
|
+
default: 10
|
|
82
|
+
},
|
|
83
|
+
containerWrapperWidth: {
|
|
84
|
+
type: [Number, null],
|
|
85
|
+
default: null
|
|
86
|
+
},
|
|
87
|
+
enableOverflow: {
|
|
88
|
+
type: Boolean,
|
|
89
|
+
default: false
|
|
90
|
+
}
|
|
91
|
+
};
|
|
92
|
+
const multipleBaseEmits = ["select", "input-mousedown", "input-change", "input-keydown", "input-compositionstart", "input-compositionend", "input-paste"];
|
|
93
|
+
function renderSelectionItem(item, props, {
|
|
94
|
+
prefixCls,
|
|
95
|
+
isNotRender,
|
|
96
|
+
closable,
|
|
97
|
+
onClose,
|
|
98
|
+
values
|
|
99
|
+
}) {
|
|
100
|
+
const {
|
|
101
|
+
tagRender,
|
|
102
|
+
removeIcon,
|
|
103
|
+
maxTagTooltip,
|
|
104
|
+
maxTagTooltipWidth,
|
|
105
|
+
popoverProps,
|
|
106
|
+
isShowTagTooltip
|
|
107
|
+
} = props;
|
|
108
|
+
if (isNotRender) {
|
|
109
|
+
const content = vue.createVNode("span", {
|
|
110
|
+
"class": {
|
|
111
|
+
[`${item.class}`]: item.class,
|
|
112
|
+
[`${prefixCls}-selection-item`]: true,
|
|
113
|
+
[`${prefixCls}-selection-item-disabled`]: item.disabled
|
|
114
|
+
}
|
|
115
|
+
}, [item.key === useMultipleBase.REST_TAG_KEY || isShowTagTooltip ? vue.createVNode(index.UPopover, vue.mergeProps({
|
|
116
|
+
"disabled": !maxTagTooltip,
|
|
117
|
+
"trigger": "hover",
|
|
118
|
+
"dropdown-class": `${prefixCls}-dropdown-tooltip`,
|
|
119
|
+
"show-arrow": true,
|
|
120
|
+
"placement": "top"
|
|
121
|
+
}, popoverProps), {
|
|
122
|
+
default: () => vue.createVNode("span", {
|
|
123
|
+
"class": `${prefixCls}-selection-item-content`,
|
|
124
|
+
"title": item.title
|
|
125
|
+
}, [slots.getRender(item.displayLabel)()]),
|
|
126
|
+
content: () => vue.createVNode("div", {
|
|
127
|
+
"class": `${prefixCls}-selection-tooltip`,
|
|
128
|
+
"style": {
|
|
129
|
+
maxWidth: `${maxTagTooltipWidth}px`
|
|
130
|
+
}
|
|
131
|
+
}, [values.map((tipItem) => vue.createVNode("span", {
|
|
132
|
+
"key": tipItem.key,
|
|
133
|
+
"class": {
|
|
134
|
+
[`${prefixCls}-selection-item`]: true
|
|
135
|
+
}
|
|
136
|
+
}, [vue.createVNode("span", {
|
|
137
|
+
"class": `${prefixCls}-selection-item-content`,
|
|
138
|
+
"title": tipItem.title
|
|
139
|
+
}, [slots.getRender(tipItem.displayLabel)()]), closable(tipItem) && vue.createVNode(index$1.UIcon, vue.mergeProps({
|
|
140
|
+
"class": `${prefixCls}-selection-item-remove`
|
|
141
|
+
}, {
|
|
142
|
+
onMousedown: (e) => {
|
|
143
|
+
e.stopPropagation();
|
|
144
|
+
e.preventDefault();
|
|
145
|
+
}
|
|
146
|
+
}, {
|
|
147
|
+
"onClick": (e) => onClose(tipItem.value, e)
|
|
148
|
+
}), {
|
|
149
|
+
default: () => [vue.createVNode(lucideVueNext.X, null, null)]
|
|
150
|
+
})]))])
|
|
151
|
+
}) : vue.createVNode(vue.Fragment, null, [vue.createVNode("span", {
|
|
152
|
+
"class": `${prefixCls}-selection-item-content`,
|
|
153
|
+
"title": item.title
|
|
154
|
+
}, [slots.getRender(item.displayLabel)()]), closable(item) && vue.createVNode(index$1.UIcon, vue.mergeProps({
|
|
155
|
+
"class": `${prefixCls}-selection-item-remove`
|
|
156
|
+
}, {
|
|
157
|
+
onMousedown: (e) => {
|
|
158
|
+
e.stopPropagation();
|
|
159
|
+
e.preventDefault();
|
|
160
|
+
}
|
|
161
|
+
}, {
|
|
162
|
+
"onClick": (e) => onClose(item.value, e)
|
|
163
|
+
}), {
|
|
164
|
+
default: () => [removeIcon ? vue.createVNode(vue.resolveComponent("component"), {
|
|
165
|
+
"is": removeIcon
|
|
166
|
+
}, null) : vue.createVNode(lucideVueNext.X, null, null)]
|
|
167
|
+
})])]);
|
|
168
|
+
return content;
|
|
169
|
+
}
|
|
170
|
+
return vue.createVNode("span", {
|
|
171
|
+
"class": item.class,
|
|
172
|
+
"onMousedown": (e) => {
|
|
173
|
+
e.stopPropagation();
|
|
174
|
+
e.preventDefault();
|
|
175
|
+
}
|
|
176
|
+
}, [tagRender == null ? void 0 : tagRender({
|
|
177
|
+
...item,
|
|
178
|
+
closable: closable(item),
|
|
179
|
+
onClose: (e) => {
|
|
180
|
+
onClose(item.value, e);
|
|
181
|
+
}
|
|
182
|
+
})]);
|
|
183
|
+
}
|
|
184
|
+
function renderSearchInput(props, {
|
|
185
|
+
prefixCls,
|
|
186
|
+
inputRef,
|
|
187
|
+
disabled,
|
|
188
|
+
inputEditable,
|
|
189
|
+
inputValue,
|
|
190
|
+
inputWidth,
|
|
191
|
+
measureRef,
|
|
192
|
+
onInputMouseDown,
|
|
193
|
+
onInputChange,
|
|
194
|
+
onInputKeydown,
|
|
195
|
+
onInputCompositionStart,
|
|
196
|
+
onInputCompositionEnd,
|
|
197
|
+
onInputPaste
|
|
198
|
+
}) {
|
|
199
|
+
return vue.createVNode("span", {
|
|
200
|
+
"class": `${prefixCls}-selection-search`,
|
|
201
|
+
"style": {
|
|
202
|
+
width: `${inputWidth}px`
|
|
203
|
+
}
|
|
204
|
+
}, [vue.createVNode(Input["default"], {
|
|
205
|
+
"input-ref": inputRef,
|
|
206
|
+
"prefix-cls": prefixCls,
|
|
207
|
+
"autocomplete": "off",
|
|
208
|
+
"disabled": disabled,
|
|
209
|
+
"editable": inputEditable,
|
|
210
|
+
"value": inputValue,
|
|
211
|
+
"onMousedown": onInputMouseDown,
|
|
212
|
+
"onChange": onInputChange,
|
|
213
|
+
"onKeydown": onInputKeydown,
|
|
214
|
+
"onCompositionstart": onInputCompositionStart,
|
|
215
|
+
"onCompositionend": onInputCompositionEnd,
|
|
216
|
+
"onPaste": onInputPaste
|
|
217
|
+
}, null), vue.createVNode("span", {
|
|
218
|
+
"ref": measureRef,
|
|
219
|
+
"class": `${prefixCls}-selection-search-mirror`,
|
|
220
|
+
"aria-hidden": true
|
|
221
|
+
}, [inputValue, vue.createTextVNode("\xA0")])]);
|
|
222
|
+
}
|
|
223
|
+
function renderPlaceholder(showPlaceholder, prefixCls, slots) {
|
|
224
|
+
var _a;
|
|
225
|
+
return showPlaceholder ? vue.createVNode("div", {
|
|
226
|
+
"class": `${prefixCls}-selection-placeholder`
|
|
227
|
+
}, [(_a = slots.placeholder) == null ? void 0 : _a.call(slots)]) : null;
|
|
228
|
+
}
|
|
229
|
+
var MultipleBase = vue.defineComponent({
|
|
230
|
+
name: "MultipleBase",
|
|
231
|
+
props: multipleBaseProps,
|
|
232
|
+
emits: multipleBaseEmits,
|
|
233
|
+
setup(props, {
|
|
234
|
+
emit,
|
|
235
|
+
slots
|
|
236
|
+
}) {
|
|
237
|
+
const baseState = useMultipleBase["default"](props, emit);
|
|
238
|
+
return () => {
|
|
239
|
+
let _slot;
|
|
240
|
+
const {
|
|
241
|
+
displayValues,
|
|
242
|
+
isNotRender,
|
|
243
|
+
closable,
|
|
244
|
+
onClose,
|
|
245
|
+
inputValue,
|
|
246
|
+
inputWidth,
|
|
247
|
+
measureRef,
|
|
248
|
+
showPlaceholder,
|
|
249
|
+
onInputMouseDown,
|
|
250
|
+
onInputChange,
|
|
251
|
+
onInputKeydown,
|
|
252
|
+
onInputCompositionStart,
|
|
253
|
+
onInputCompositionEnd,
|
|
254
|
+
onInputPaste,
|
|
255
|
+
onOverflowItemResize,
|
|
256
|
+
onSuffixResize,
|
|
257
|
+
displayRest
|
|
258
|
+
} = baseState;
|
|
259
|
+
return vue.createVNode(vue.Fragment, null, [displayValues.value.map((item, index) => {
|
|
260
|
+
const content = renderSelectionItem(item, props, {
|
|
261
|
+
prefixCls: props.prefixCls,
|
|
262
|
+
isNotRender: isNotRender.value,
|
|
263
|
+
displayRest: displayRest.value,
|
|
264
|
+
closable,
|
|
265
|
+
onClose,
|
|
266
|
+
values: props.values
|
|
267
|
+
});
|
|
268
|
+
return props.enableOverflow ? vue.createVNode(ResizeObserver["default"], {
|
|
269
|
+
"key": item.key,
|
|
270
|
+
"onResize": (e) => onOverflowItemResize(e, item)
|
|
271
|
+
}, {
|
|
272
|
+
default: () => [vue.createVNode("div", {
|
|
273
|
+
"class": `${props.prefixCls}-selection-item-wrapper`,
|
|
274
|
+
"style": {
|
|
275
|
+
opacity: index > baseState.mergedDisplayCount.value && item.key !== useMultipleBase.REST_TAG_KEY || !displayRest.value && item.key === useMultipleBase.REST_TAG_KEY ? 0 : 1,
|
|
276
|
+
height: index > baseState.mergedDisplayCount.value && item.key !== useMultipleBase.REST_TAG_KEY || !displayRest.value && item.key === useMultipleBase.REST_TAG_KEY ? 0 : void 0,
|
|
277
|
+
overflowY: index > baseState.mergedDisplayCount.value && item.key !== useMultipleBase.REST_TAG_KEY || !displayRest.value && item.key === useMultipleBase.REST_TAG_KEY ? "hidden" : void 0,
|
|
278
|
+
pointerEvents: index > baseState.mergedDisplayCount.value && item.key !== useMultipleBase.REST_TAG_KEY || !displayRest.value && item.key === useMultipleBase.REST_TAG_KEY ? "none" : void 0,
|
|
279
|
+
position: index > baseState.mergedDisplayCount.value && item.key !== useMultipleBase.REST_TAG_KEY || !displayRest.value && item.key === useMultipleBase.REST_TAG_KEY ? "absolute" : void 0
|
|
280
|
+
}
|
|
281
|
+
}, [content])]
|
|
282
|
+
}) : content;
|
|
283
|
+
}), props.enableOverflow ? vue.createVNode(ResizeObserver["default"], {
|
|
284
|
+
"onResize": onSuffixResize
|
|
285
|
+
}, _isSlot(_slot = renderSearchInput(props, {
|
|
286
|
+
prefixCls: props.prefixCls,
|
|
287
|
+
inputRef: props.inputRef,
|
|
288
|
+
disabled: props.disabled,
|
|
289
|
+
inputEditable: baseState.inputEditable.value,
|
|
290
|
+
inputValue: inputValue.value,
|
|
291
|
+
inputWidth,
|
|
292
|
+
measureRef,
|
|
293
|
+
onInputMouseDown,
|
|
294
|
+
onInputChange,
|
|
295
|
+
onInputKeydown,
|
|
296
|
+
onInputCompositionStart,
|
|
297
|
+
onInputCompositionEnd,
|
|
298
|
+
onInputPaste
|
|
299
|
+
})) ? _slot : {
|
|
300
|
+
default: () => [_slot]
|
|
301
|
+
}) : renderSearchInput(props, {
|
|
302
|
+
prefixCls: props.prefixCls,
|
|
303
|
+
inputRef: props.inputRef,
|
|
304
|
+
disabled: props.disabled,
|
|
305
|
+
inputEditable: baseState.inputEditable.value,
|
|
306
|
+
inputValue: inputValue.value,
|
|
307
|
+
inputWidth,
|
|
308
|
+
measureRef,
|
|
309
|
+
onInputMouseDown,
|
|
310
|
+
onInputChange,
|
|
311
|
+
onInputKeydown,
|
|
312
|
+
onInputCompositionStart,
|
|
313
|
+
onInputCompositionEnd,
|
|
314
|
+
onInputPaste
|
|
315
|
+
}), renderPlaceholder(showPlaceholder.value, props.prefixCls, slots)]);
|
|
316
|
+
};
|
|
317
|
+
}
|
|
318
|
+
});
|
|
319
|
+
|
|
320
|
+
exports["default"] = MultipleBase;
|
|
321
|
+
exports.multipleBaseEmits = multipleBaseEmits;
|
|
322
|
+
exports.multipleBaseProps = multipleBaseProps;
|
|
323
|
+
exports.renderPlaceholder = renderPlaceholder;
|
|
324
|
+
exports.renderSearchInput = renderSearchInput;
|
|
325
|
+
exports.renderSelectionItem = renderSelectionItem;
|
|
326
|
+
//# sourceMappingURL=MultipleBase.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MultipleBase.js","sources":["../../../../../src/components/Select/Selection/MultipleBase.tsx"],"sourcesContent":["import { defineComponent } from 'vue';\nimport type { PropType, ComponentPublicInstance, VNodeChild } from 'vue';\nimport UIcon from '@uxd-ui/components/Icon';\nimport UPopover from '@uxd-ui/components/Popover';\nimport { X } from 'lucide-vue-next';\nimport type { JSX } from 'vue/jsx-runtime';\nimport ResizeObserver from '../../base/ResizeObserver';\nimport { getRender } from '../../../utils/slots';\nimport useMultipleBase, { REST_TAG_KEY } from '../hooks/useMultipleBase';\nimport SelectInput from './Input.vue';\nimport type { DisplayOption, SingleValueType, TagRenderFunction } from '../Select.type';\nimport type { IconPropType } from '../../../utils/globalType';\nimport type { PopoverProps } from '../../Popover';\n\nconst defaultMaxTagPlaceholder = (ommittedValus: string[]) => `+ ${ommittedValus.length}...`;\n\nexport const multipleBaseProps = {\n prefixCls: {\n type: String\n },\n values: {\n type: Array as PropType<DisplayOption[]>,\n default: () => [] as DisplayOption[]\n },\n searchValue: {\n type: String\n },\n filterable: {\n type: Boolean,\n default: false\n },\n disabled: {\n type: Boolean,\n default: undefined as undefined\n },\n open: {\n type: Boolean,\n default: undefined as undefined\n },\n inputRef: {\n type: Function as PropType<(el: Element | ComponentPublicInstance | null) => void>\n },\n tagTransitionName: {\n type: String\n },\n maxTagCount: {\n type: Number\n },\n maxTagTextLength: {\n type: [Number, String] as PropType<number | 'responsive'>\n },\n maxTagPlaceholder: {\n type: Function as PropType<(rest: DisplayOption[]) => string | VNodeChild | JSX.Element>,\n default: defaultMaxTagPlaceholder\n },\n maxTagTooltip: {\n type: Boolean,\n default: false\n },\n maxTagTooltipWidth: {\n type: Number,\n default: 99900\n },\n tagRender: {\n type: Function as PropType<TagRenderFunction>\n },\n removeIcon: {\n type: [String, Object] as PropType<IconPropType>\n },\n isShowTagTooltip: {\n type: Boolean,\n default: false\n },\n popoverProps: {\n type: Object as PropType<PopoverProps>,\n default: () => ({})\n },\n\n itemWidth: {\n type: Number,\n default: 10\n },\n containerWrapperWidth: {\n type: [Number, null] as PropType<number | null>,\n default: null as null\n },\n enableOverflow: {\n type: Boolean,\n default: false\n }\n};\n\nexport const multipleBaseEmits = [\n 'select',\n 'input-mousedown',\n 'input-change',\n 'input-keydown',\n 'input-compositionstart',\n 'input-compositionend',\n 'input-paste'\n];\n\nexport function renderSelectionItem(\n item: DisplayOption,\n props: any,\n {\n prefixCls,\n isNotRender,\n closable,\n onClose,\n values\n }: {\n prefixCls: string;\n isNotRender: boolean;\n closable: (displayItem: DisplayOption) => boolean;\n onClose: (value: SingleValueType, e: any) => void;\n values: DisplayOption[];\n displayRest: boolean;\n }\n) {\n const { tagRender, removeIcon, maxTagTooltip, maxTagTooltipWidth, popoverProps, isShowTagTooltip } = props;\n\n if (isNotRender) {\n const content = (\n <span\n class={{\n [`${item.class}`]: item.class,\n [`${prefixCls}-selection-item`]: true,\n [`${prefixCls}-selection-item-disabled`]: item.disabled\n }}\n >\n {item.key === REST_TAG_KEY || isShowTagTooltip ? (\n <UPopover\n disabled={!maxTagTooltip}\n trigger=\"hover\"\n dropdown-class={`${prefixCls}-dropdown-tooltip`}\n show-arrow={true}\n placement=\"top\"\n {...popoverProps}\n >\n {{\n default: () => (\n <span class={`${prefixCls}-selection-item-content`} title={item.title}>\n {getRender(item.displayLabel)()}\n </span>\n ),\n content: () => (\n <div class={`${prefixCls}-selection-tooltip`} style={{ maxWidth: `${maxTagTooltipWidth}px` }}>\n {values.map((tipItem) => (\n <span\n key={tipItem.key}\n class={{\n [`${prefixCls}-selection-item`]: true\n }}\n >\n <span class={`${prefixCls}-selection-item-content`} title={tipItem.title}>\n {getRender(tipItem.displayLabel)()}\n </span>\n {closable(tipItem) && (\n <UIcon\n class={`${prefixCls}-selection-item-remove`}\n {...({\n onMousedown: (e: MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n }\n } as any)}\n onClick={(e: any) => onClose(tipItem.value, e)}\n >\n <X />\n </UIcon>\n )}\n </span>\n ))}\n </div>\n )\n }}\n </UPopover>\n ) : (\n <>\n <span class={`${prefixCls}-selection-item-content`} title={item.title}>\n {getRender(item.displayLabel)()}\n </span>\n {closable(item) && (\n <UIcon\n class={`${prefixCls}-selection-item-remove`}\n {...({\n onMousedown: (e: MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n }\n } as any)}\n onClick={(e: any) => onClose(item.value, e)}\n >\n {removeIcon ? <component is={removeIcon} /> : <X />}\n </UIcon>\n )}\n </>\n )}\n </span>\n );\n\n return content;\n }\n return (\n <span\n class={item.class}\n onMousedown={(e: any) => {\n e.stopPropagation();\n e.preventDefault();\n }}\n >\n {tagRender?.({\n ...item,\n closable: closable(item),\n onClose: (e: any) => {\n onClose(item.value, e);\n }\n })}\n </span>\n );\n}\n\nexport function renderSearchInput(\n props: any,\n {\n prefixCls,\n inputRef,\n disabled,\n inputEditable,\n inputValue,\n inputWidth,\n measureRef,\n onInputMouseDown,\n onInputChange,\n onInputKeydown,\n onInputCompositionStart,\n onInputCompositionEnd,\n onInputPaste\n }: any\n) {\n return (\n <span class={`${prefixCls}-selection-search`} style={{ width: `${inputWidth}px` }}>\n <SelectInput\n input-ref={inputRef}\n prefix-cls={prefixCls}\n autocomplete=\"off\"\n disabled={disabled}\n editable={inputEditable}\n value={inputValue}\n onMousedown={onInputMouseDown}\n onChange={onInputChange}\n onKeydown={onInputKeydown}\n onCompositionstart={onInputCompositionStart}\n onCompositionend={onInputCompositionEnd}\n onPaste={onInputPaste}\n />\n <span ref={measureRef} class={`${prefixCls}-selection-search-mirror`} aria-hidden>\n {inputValue} \n </span>\n </span>\n );\n}\n\nexport function renderPlaceholder(showPlaceholder: boolean, prefixCls: string, slots: any) {\n return showPlaceholder ? <div class={`${prefixCls}-selection-placeholder`}>{slots.placeholder?.()}</div> : null;\n}\n\nexport default defineComponent({\n name: 'MultipleBase',\n props: multipleBaseProps,\n emits: multipleBaseEmits,\n setup(props, { emit, slots }) {\n const baseState = useMultipleBase(props, emit);\n\n return () => {\n const {\n displayValues,\n isNotRender,\n closable,\n onClose,\n inputValue,\n inputWidth,\n measureRef,\n showPlaceholder,\n onInputMouseDown,\n onInputChange,\n onInputKeydown,\n onInputCompositionStart,\n onInputCompositionEnd,\n onInputPaste,\n onOverflowItemResize,\n onSuffixResize,\n displayRest\n } = baseState;\n\n return (\n <>\n {displayValues.value.map((item: DisplayOption, index: number) => {\n const content = renderSelectionItem(item, props, {\n prefixCls: props.prefixCls,\n isNotRender: isNotRender.value,\n displayRest: displayRest.value,\n closable,\n onClose,\n values: props.values\n });\n\n return props.enableOverflow ? (\n <ResizeObserver key={item.key} onResize={(e) => onOverflowItemResize(e, item)}>\n <div\n class={`${props.prefixCls}-selection-item-wrapper`}\n style={{\n opacity:\n (index > baseState.mergedDisplayCount.value && item.key !== REST_TAG_KEY) || (!displayRest.value && item.key === REST_TAG_KEY)\n ? 0\n : 1,\n height:\n (index > baseState.mergedDisplayCount.value && item.key !== REST_TAG_KEY) || (!displayRest.value && item.key === REST_TAG_KEY)\n ? 0\n : undefined,\n overflowY:\n (index > baseState.mergedDisplayCount.value && item.key !== REST_TAG_KEY) || (!displayRest.value && item.key === REST_TAG_KEY)\n ? 'hidden'\n : undefined,\n pointerEvents:\n (index > baseState.mergedDisplayCount.value && item.key !== REST_TAG_KEY) || (!displayRest.value && item.key === REST_TAG_KEY)\n ? 'none'\n : undefined,\n position:\n (index > baseState.mergedDisplayCount.value && item.key !== REST_TAG_KEY) || (!displayRest.value && item.key === REST_TAG_KEY)\n ? 'absolute'\n : undefined\n }}\n >\n {content}\n </div>\n </ResizeObserver>\n ) : (\n content\n );\n })}\n\n {props.enableOverflow ? (\n <ResizeObserver onResize={onSuffixResize}>\n {renderSearchInput(props, {\n prefixCls: props.prefixCls,\n inputRef: props.inputRef,\n disabled: props.disabled,\n inputEditable: baseState.inputEditable.value,\n inputValue: inputValue.value,\n inputWidth,\n measureRef,\n onInputMouseDown,\n onInputChange,\n onInputKeydown,\n onInputCompositionStart,\n onInputCompositionEnd,\n onInputPaste\n })}\n </ResizeObserver>\n ) : (\n renderSearchInput(props, {\n prefixCls: props.prefixCls,\n inputRef: props.inputRef,\n disabled: props.disabled,\n inputEditable: baseState.inputEditable.value,\n inputValue: inputValue.value,\n inputWidth,\n measureRef,\n onInputMouseDown,\n onInputChange,\n onInputKeydown,\n onInputCompositionStart,\n onInputCompositionEnd,\n onInputPaste\n })\n )}\n\n {renderPlaceholder(showPlaceholder.value, props.prefixCls, slots)}\n </>\n );\n };\n }\n});\n"],"names":["_isSlot","s","Object","prototype","toString","call","_isVNode","defaultMaxTagPlaceholder","ommittedValus","length","multipleBaseProps","prefixCls","type","String","values","Array","default","searchValue","filterable","Boolean","disabled","undefined","open","inputRef","Function","tagTransitionName","maxTagCount","Number","maxTagTextLength","maxTagPlaceholder","maxTagTooltip","maxTagTooltipWidth","tagRender","removeIcon","isShowTagTooltip","popoverProps","itemWidth","containerWrapperWidth","enableOverflow","multipleBaseEmits","renderSelectionItem","item","props","isNotRender","closable","onClose","content","_createVNode","class","key","REST_TAG_KEY","UPopover","_mergeProps","title","getRender","displayLabel","maxWidth","map","tipItem","UIcon","onMousedown","e","stopPropagation","preventDefault","value","X","_Fragment","_resolveComponent","renderSearchInput","inputEditable","inputValue","inputWidth","measureRef","onInputMouseDown","onInputChange","onInputKeydown","onInputCompositionStart","onInputCompositionEnd","onInputPaste","width","SelectInput","_createTextVNode","renderPlaceholder","showPlaceholder","slots","placeholder","defineComponent","name","emits","setup","emit","baseState","useMultipleBase","_slot","displayValues","onOverflowItemResize","onSuffixResize","displayRest","index","ResizeObserver","opacity","mergedDisplayCount","height","overflowY","pointerEvents","position"],"mappings":"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"}
|
|
@@ -0,0 +1,206 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var MultipleOverFlow_vue_vue_type_script_lang = require('./MultipleOverFlow.vue_vue_type_script_lang.js');
|
|
6
|
+
var vue = require('vue');
|
|
7
|
+
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
|
|
8
|
+
|
|
9
|
+
const _hoisted_1 = { style: { "display": "flex", "align-items": "center" } };
|
|
10
|
+
const _hoisted_2 = ["title"];
|
|
11
|
+
const _hoisted_3 = ["title"];
|
|
12
|
+
const _hoisted_4 = {
|
|
13
|
+
key: 1,
|
|
14
|
+
style: { "display": "flex", "align-items": "center" }
|
|
15
|
+
};
|
|
16
|
+
const _hoisted_5 = ["title"];
|
|
17
|
+
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
18
|
+
const _component_X = vue.resolveComponent("X");
|
|
19
|
+
const _component_UIcon = vue.resolveComponent("UIcon");
|
|
20
|
+
const _component_Render = vue.resolveComponent("Render");
|
|
21
|
+
const _component_UPopover = vue.resolveComponent("UPopover");
|
|
22
|
+
const _component_ResizeObserver = vue.resolveComponent("ResizeObserver");
|
|
23
|
+
const _component_SelectInput = vue.resolveComponent("SelectInput");
|
|
24
|
+
return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
|
|
25
|
+
vue.createCommentVNode(' <transition-group :appear="motionAppear" :name="tagTransitionName"> '),
|
|
26
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.displayValues, (item, index) => {
|
|
27
|
+
return vue.openBlock(), vue.createBlock(_component_ResizeObserver, {
|
|
28
|
+
key: item.key,
|
|
29
|
+
onResize: ($event) => _ctx.onOverflowItemResize($event, item)
|
|
30
|
+
}, {
|
|
31
|
+
default: vue.withCtx(() => [
|
|
32
|
+
vue.createElementVNode("div", {
|
|
33
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-item-wrapper`),
|
|
34
|
+
style: vue.normalizeStyle({
|
|
35
|
+
opacity: index > _ctx.mergedDisplayCount && item.key !== _ctx.REST_TAG_KEY || !_ctx.displayRest && item.key === _ctx.REST_TAG_KEY ? 0 : 1,
|
|
36
|
+
height: index > _ctx.mergedDisplayCount && item.key !== _ctx.REST_TAG_KEY || !_ctx.displayRest && item.key === _ctx.REST_TAG_KEY ? 0 : void 0,
|
|
37
|
+
overflowY: index > _ctx.mergedDisplayCount && item.key !== _ctx.REST_TAG_KEY || !_ctx.displayRest && item.key === _ctx.REST_TAG_KEY ? "hidden" : void 0,
|
|
38
|
+
pointerEvents: index > _ctx.mergedDisplayCount && item.key !== _ctx.REST_TAG_KEY || !_ctx.displayRest && item.key === _ctx.REST_TAG_KEY ? "none" : void 0,
|
|
39
|
+
position: index > _ctx.mergedDisplayCount && item.key !== _ctx.REST_TAG_KEY || !_ctx.displayRest && item.key === _ctx.REST_TAG_KEY ? "absolute" : void 0
|
|
40
|
+
})
|
|
41
|
+
}, [
|
|
42
|
+
_ctx.isNotRender ? (vue.openBlock(), vue.createElementBlock("span", {
|
|
43
|
+
key: 0,
|
|
44
|
+
class: vue.normalizeClass({
|
|
45
|
+
[`${item.class}`]: item.class,
|
|
46
|
+
[`${_ctx.prefixCls}-selection-item`]: true,
|
|
47
|
+
[`${_ctx.prefixCls}-selection-item-disabled`]: item.disabled
|
|
48
|
+
})
|
|
49
|
+
}, [
|
|
50
|
+
item.key === _ctx.REST_TAG_KEY || _ctx.isShowTagTooltip ? (vue.openBlock(), vue.createBlock(_component_UPopover, vue.mergeProps({
|
|
51
|
+
key: 0,
|
|
52
|
+
disabled: !_ctx.maxTagTooltip,
|
|
53
|
+
trigger: "hover",
|
|
54
|
+
"dropdown-class": `${_ctx.prefixCls}-dropdown-tooltip`,
|
|
55
|
+
"show-arrow": true,
|
|
56
|
+
placement: "top",
|
|
57
|
+
ref_for: true
|
|
58
|
+
}, _ctx.popoverProps), {
|
|
59
|
+
content: vue.withCtx(() => [
|
|
60
|
+
vue.createElementVNode("div", {
|
|
61
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-tooltip`),
|
|
62
|
+
style: vue.normalizeStyle({ maxWidth: `${_ctx.maxTagTooltipWidth}px` })
|
|
63
|
+
}, [
|
|
64
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.values, (tipItem) => {
|
|
65
|
+
return vue.openBlock(), vue.createElementBlock("span", {
|
|
66
|
+
key: tipItem.key,
|
|
67
|
+
class: vue.normalizeClass({
|
|
68
|
+
[`${_ctx.prefixCls}-selection-item`]: true
|
|
69
|
+
})
|
|
70
|
+
}, [
|
|
71
|
+
vue.createElementVNode("span", {
|
|
72
|
+
class: vue.normalizeClass([`${_ctx.prefixCls}-selection-item-content`, "ldlldlldl"]),
|
|
73
|
+
title: tipItem.title
|
|
74
|
+
}, [
|
|
75
|
+
vue.createVNode(_component_Render, {
|
|
76
|
+
render: _ctx.getRender(tipItem.displayLabel)
|
|
77
|
+
}, null, 8, ["render"])
|
|
78
|
+
], 10, _hoisted_3),
|
|
79
|
+
_ctx.closable(tipItem) ? (vue.openBlock(), vue.createBlock(_component_UIcon, {
|
|
80
|
+
key: 0,
|
|
81
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-item-remove`),
|
|
82
|
+
onMousedown: _cache[1] || (_cache[1] = vue.withModifiers(() => {
|
|
83
|
+
}, ["stop", "prevent"])),
|
|
84
|
+
onClick: (e) => _ctx.onClose(tipItem.value, e)
|
|
85
|
+
}, {
|
|
86
|
+
default: vue.withCtx(() => [
|
|
87
|
+
vue.createVNode(_component_X)
|
|
88
|
+
]),
|
|
89
|
+
_: 2
|
|
90
|
+
}, 1032, ["class", "onClick"])) : vue.createCommentVNode("v-if", true)
|
|
91
|
+
], 2);
|
|
92
|
+
}), 128))
|
|
93
|
+
], 6)
|
|
94
|
+
]),
|
|
95
|
+
default: vue.withCtx(() => [
|
|
96
|
+
vue.createElementVNode("div", _hoisted_1, [
|
|
97
|
+
vue.createElementVNode("span", {
|
|
98
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-item-content`),
|
|
99
|
+
title: item.title
|
|
100
|
+
}, vue.toDisplayString(item.displayLabel), 11, _hoisted_2),
|
|
101
|
+
_ctx.closable(item) ? (vue.openBlock(), vue.createBlock(_component_UIcon, {
|
|
102
|
+
key: 0,
|
|
103
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-item-remove`),
|
|
104
|
+
style: { "opacity": "0" },
|
|
105
|
+
onMousedown: _cache[0] || (_cache[0] = vue.withModifiers(() => {
|
|
106
|
+
}, ["stop", "prevent"]))
|
|
107
|
+
}, {
|
|
108
|
+
default: vue.withCtx(() => [
|
|
109
|
+
vue.createVNode(_component_X)
|
|
110
|
+
]),
|
|
111
|
+
_: 1
|
|
112
|
+
}, 8, ["class"])) : vue.createCommentVNode("v-if", true)
|
|
113
|
+
])
|
|
114
|
+
]),
|
|
115
|
+
_: 2
|
|
116
|
+
}, 1040, ["disabled", "dropdown-class"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
|
|
117
|
+
vue.createElementVNode("span", {
|
|
118
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-item-content`),
|
|
119
|
+
title: item.title
|
|
120
|
+
}, [
|
|
121
|
+
vue.createVNode(_component_Render, {
|
|
122
|
+
render: _ctx.getRender(item.displayLabel)
|
|
123
|
+
}, null, 8, ["render"])
|
|
124
|
+
], 10, _hoisted_5),
|
|
125
|
+
_ctx.closable(item) ? (vue.openBlock(), vue.createBlock(_component_UIcon, {
|
|
126
|
+
key: 0,
|
|
127
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-item-remove`),
|
|
128
|
+
onMousedown: _cache[2] || (_cache[2] = vue.withModifiers(() => {
|
|
129
|
+
}, ["stop", "prevent"])),
|
|
130
|
+
onClick: (e) => _ctx.onClose(item.value, e)
|
|
131
|
+
}, {
|
|
132
|
+
default: vue.withCtx(() => [
|
|
133
|
+
_ctx.removeIcon ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.removeIcon), { key: 0 })) : (vue.openBlock(), vue.createBlock(_component_X, { key: 1 }))
|
|
134
|
+
]),
|
|
135
|
+
_: 2
|
|
136
|
+
}, 1032, ["class", "onClick"])) : vue.createCommentVNode("v-if", true)
|
|
137
|
+
]))
|
|
138
|
+
], 2)) : (vue.openBlock(), vue.createElementBlock("span", {
|
|
139
|
+
key: 1,
|
|
140
|
+
class: vue.normalizeClass(item.class),
|
|
141
|
+
onMousedown: _cache[3] || (_cache[3] = vue.withModifiers(() => {
|
|
142
|
+
}, ["stop", "prevent"]))
|
|
143
|
+
}, [
|
|
144
|
+
vue.createVNode(_component_Render, {
|
|
145
|
+
render: () => {
|
|
146
|
+
var _a;
|
|
147
|
+
return (_a = _ctx.tagRender) == null ? void 0 : _a.call(_ctx, {
|
|
148
|
+
...item,
|
|
149
|
+
closable: _ctx.closable(item),
|
|
150
|
+
onClose: (e) => {
|
|
151
|
+
_ctx.onClose(item.value, e);
|
|
152
|
+
}
|
|
153
|
+
});
|
|
154
|
+
}
|
|
155
|
+
}, null, 8, ["render"])
|
|
156
|
+
], 34))
|
|
157
|
+
], 6)
|
|
158
|
+
]),
|
|
159
|
+
_: 2
|
|
160
|
+
}, 1032, ["onResize"]);
|
|
161
|
+
}), 128)),
|
|
162
|
+
vue.createCommentVNode(" </transition-group> "),
|
|
163
|
+
vue.createElementVNode("span", {
|
|
164
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-search`),
|
|
165
|
+
style: vue.normalizeStyle({ width: `${_ctx.inputWidth}px` })
|
|
166
|
+
}, [
|
|
167
|
+
vue.createVNode(_component_ResizeObserver, {
|
|
168
|
+
onResize: _cache[4] || (_cache[4] = ($event) => _ctx.onSuffixResize($event))
|
|
169
|
+
}, {
|
|
170
|
+
default: vue.withCtx(() => [
|
|
171
|
+
vue.createVNode(_component_SelectInput, {
|
|
172
|
+
"input-ref": _ctx.inputRef,
|
|
173
|
+
"prefix-cls": _ctx.prefixCls,
|
|
174
|
+
autocomplete: "off",
|
|
175
|
+
disabled: _ctx.disabled,
|
|
176
|
+
editable: _ctx.inputEditable,
|
|
177
|
+
value: _ctx.inputValue,
|
|
178
|
+
onMousedown: _ctx.onInputMouseDown,
|
|
179
|
+
onChange: _ctx.onInputChange,
|
|
180
|
+
onKeydown: _ctx.onInputKeydown,
|
|
181
|
+
onCompositionstart: _ctx.onInputCompositionStart,
|
|
182
|
+
onCompositionend: _ctx.onInputCompositionEnd,
|
|
183
|
+
onPaste: _ctx.onInputPaste
|
|
184
|
+
}, null, 8, ["input-ref", "prefix-cls", "disabled", "editable", "value", "onMousedown", "onChange", "onKeydown", "onCompositionstart", "onCompositionend", "onPaste"])
|
|
185
|
+
]),
|
|
186
|
+
_: 1
|
|
187
|
+
}),
|
|
188
|
+
vue.createElementVNode("span", {
|
|
189
|
+
ref: "measureRef",
|
|
190
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-search-mirror`),
|
|
191
|
+
"aria-hidden": ""
|
|
192
|
+
}, vue.toDisplayString(_ctx.inputValue) + "\xA0 ", 3)
|
|
193
|
+
], 6),
|
|
194
|
+
vue.withDirectives(vue.createElementVNode("div", {
|
|
195
|
+
class: vue.normalizeClass(`${_ctx.prefixCls}-selection-placeholder`)
|
|
196
|
+
}, [
|
|
197
|
+
vue.renderSlot(_ctx.$slots, "placeholder")
|
|
198
|
+
], 2), [
|
|
199
|
+
[vue.vShow, _ctx.showPlaceholder]
|
|
200
|
+
])
|
|
201
|
+
], 64);
|
|
202
|
+
}
|
|
203
|
+
var MultipleOverFlow = /* @__PURE__ */ pluginVue_exportHelper["default"](MultipleOverFlow_vue_vue_type_script_lang["default"], [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Select/Selection/MultipleOverFlow.vue"]]);
|
|
204
|
+
|
|
205
|
+
exports["default"] = MultipleOverFlow;
|
|
206
|
+
//# sourceMappingURL=MultipleOverFlow.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MultipleOverFlow.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|