@wfrog/vc-ui 1.11.10 → 1.11.11

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.
Files changed (134) hide show
  1. package/dist/es/chunk/Bw0Rhd-r.mjs +110 -0
  2. package/dist/es/chunk/CqTdDZkE.mjs +31 -0
  3. package/dist/es/chunk/{DAnWZLYj.mjs → CzWfBa_8.mjs} +96 -2
  4. package/dist/es/chunk/D229kQ56.mjs +28 -0
  5. package/dist/es/chunk/{Cxx_YWUC.mjs → DcouM6gM.mjs} +6 -548
  6. package/dist/es/chunk/Fo0dZYnz.mjs +128 -0
  7. package/dist/es/chunk/KanuIcmc.mjs +412 -0
  8. package/dist/es/chunk/{B71xEPfK.mjs → uuUHUjSk.mjs} +4 -35
  9. package/dist/es/components/backbottom/backbottom.mjs +3 -2
  10. package/dist/es/components/button/button.mjs +4 -5
  11. package/dist/es/components/choice/choice.mjs +4 -4
  12. package/dist/es/components/choice/index.css +1 -1
  13. package/dist/es/components/color-switch/color-switch.mjs +73 -1046
  14. package/dist/es/components/color-switch/index.css +1 -1
  15. package/dist/es/components/cropper/cropper.mjs +11 -117
  16. package/dist/es/components/cropper/index.css +1 -1
  17. package/dist/es/components/currency/currency.mjs +4 -5
  18. package/dist/es/components/daterange-picker/daterange-picker.mjs +8 -6253
  19. package/dist/es/components/dialog/dialog.mjs +7 -400
  20. package/dist/es/components/dialog/index.css +1 -1
  21. package/dist/es/components/dialog-camera-upload/dialog-camera-upload.mjs +10 -11
  22. package/dist/es/components/dialog-map-point/dialog-map-point.mjs +4 -3
  23. package/dist/es/components/dialog-upload-images/dialog-upload-images.mjs +9 -1374
  24. package/dist/es/components/dialog-upload-images/index.css +1 -1
  25. package/dist/es/components/drag-verify/drag-verify.mjs +3 -2
  26. package/dist/es/components/drawer/drawer.mjs +10 -352
  27. package/dist/es/components/drawer/index.css +1 -1
  28. package/dist/es/components/easy-pagination/easy-pagination.mjs +3 -2
  29. package/dist/es/components/explorer/explorer.mjs +3 -3
  30. package/dist/es/components/explorer-column-table/explorer-column-table.mjs +5 -7
  31. package/dist/es/components/explorer-column-table/index.css +1 -1
  32. package/dist/es/components/explorer-container/explorer-container.d.ts +1 -1
  33. package/dist/es/components/explorer-container/explorer-container.mjs +4 -3
  34. package/dist/es/components/explorer-filter/explorer-filter.mjs +5 -4
  35. package/dist/es/components/explorer-footer/explorer-footer.mjs +4 -8
  36. package/dist/es/components/explorer-form/explorer-form.mjs +4 -3
  37. package/dist/es/components/explorer-list/explorer-list.mjs +5 -4
  38. package/dist/es/components/explorer-modal-form/explorer-modal-form.mjs +4 -3
  39. package/dist/es/components/explorer-panel/explorer-panel.mjs +3 -3
  40. package/dist/es/components/explorer-query/explorer-query.mjs +9 -2201
  41. package/dist/es/components/explorer-query/index.css +1 -1
  42. package/dist/es/components/explorer-table/explorer-table.mjs +5 -8
  43. package/dist/es/components/explorer-tools/explorer-tools.mjs +13 -264
  44. package/dist/es/components/explorer-tools/index.css +1 -1
  45. package/dist/es/components/explorer-tree/explorer-tree.mjs +4 -5
  46. package/dist/es/components/icon-picker/icon-picker.mjs +8 -12
  47. package/dist/es/components/image/image.mjs +4 -4
  48. package/dist/es/components/info-tooltip/info-tooltip.mjs +336 -4
  49. package/dist/es/components/input/input.mjs +3 -2
  50. package/dist/es/components/input-number/input-number.mjs +3 -3
  51. package/dist/es/components/pca-picker/index.css +1 -1
  52. package/dist/es/components/pca-picker/pca-picker.mjs +443 -601
  53. package/dist/es/components/screenfull/screenfull.mjs +4 -3
  54. package/dist/es/components/scrollbar/scrollbar.mjs +3 -2
  55. package/dist/es/components/select/select.mjs +3 -5
  56. package/dist/es/components/single-player/index.css +1 -1
  57. package/dist/es/components/single-player/single-player.mjs +10 -1087
  58. package/dist/es/components/splitter/splitter.mjs +3 -3
  59. package/dist/es/components/splitter-panel/splitter-panel.mjs +3 -3
  60. package/dist/es/components/switch/index.css +1 -1
  61. package/dist/es/components/switch/switch.mjs +9 -395
  62. package/dist/es/components/tags/tags.mjs +7 -9
  63. package/dist/es/components/text-ellipsis/text-ellipsis.mjs +3 -3
  64. package/dist/es/components/thousand-input/thousand-input.mjs +33 -1
  65. package/dist/es/components/tinymce/tinymce.mjs +4 -3
  66. package/dist/es/components/transfer/transfer.mjs +3 -4
  67. package/dist/es/components/transfer-panel/transfer-panel.mjs +5 -4
  68. package/dist/es/components/tree-picker/popover-cascader.css +1 -1
  69. package/dist/es/components/tree-picker/tree-picker.mjs +5 -10
  70. package/dist/es/index.mjs +1 -1
  71. package/dist/index.css +13 -40
  72. package/package.json +1 -1
  73. package/dist/es/chunk/B-rxnVJv.mjs +0 -3
  74. package/dist/es/chunk/B5HpgPRt.mjs +0 -69
  75. package/dist/es/chunk/BBhZKpIc.mjs +0 -2179
  76. package/dist/es/chunk/BDcsaNYa.mjs +0 -59
  77. package/dist/es/chunk/BTSSEFfD.mjs +0 -319
  78. package/dist/es/chunk/BTpNRPQW.mjs +0 -55
  79. package/dist/es/chunk/BVBK1U57.mjs +0 -96
  80. package/dist/es/chunk/Bc6yUGLs.mjs +0 -45
  81. package/dist/es/chunk/BjVI1XMz.mjs +0 -40
  82. package/dist/es/chunk/BlzQCBDu.mjs +0 -5741
  83. package/dist/es/chunk/BpJKnxlF.mjs +0 -476
  84. package/dist/es/chunk/Brp-qSBw.mjs +0 -2003
  85. package/dist/es/chunk/BunQI8Jb.mjs +0 -390
  86. package/dist/es/chunk/C0XgBrDz.mjs +0 -775
  87. package/dist/es/chunk/C0pTANRX.mjs +0 -109
  88. package/dist/es/chunk/CBMjhoFP.mjs +0 -101
  89. package/dist/es/chunk/CBiNtNvQ.mjs +0 -242
  90. package/dist/es/chunk/CBlJeNBO.mjs +0 -890
  91. package/dist/es/chunk/CCVL_Zj-.mjs +0 -427
  92. package/dist/es/chunk/CEl4MyfJ.mjs +0 -252
  93. package/dist/es/chunk/CJK5_jsA.mjs +0 -53
  94. package/dist/es/chunk/CKOcwq5V.mjs +0 -44
  95. package/dist/es/chunk/COs9dJZa.mjs +0 -66
  96. package/dist/es/chunk/CPt6MxJW.mjs +0 -375
  97. package/dist/es/chunk/CVqW0jzp.mjs +0 -107
  98. package/dist/es/chunk/CccIsEqA.mjs +0 -128
  99. package/dist/es/chunk/CjLR27-a.mjs +0 -582
  100. package/dist/es/chunk/CoGexPPD.mjs +0 -2192
  101. package/dist/es/chunk/CsLIbnzG.mjs +0 -64
  102. package/dist/es/chunk/Ct6q2FXg.mjs +0 -5
  103. package/dist/es/chunk/Cuq5meQh.mjs +0 -184
  104. package/dist/es/chunk/CvYIOfT1.mjs +0 -23
  105. package/dist/es/chunk/CxHJBf4l.mjs +0 -31
  106. package/dist/es/chunk/CzdaOBtA.mjs +0 -66
  107. package/dist/es/chunk/D0QTifnI.mjs +0 -54
  108. package/dist/es/chunk/D1QnA2iT.mjs +0 -229
  109. package/dist/es/chunk/D3AvJlVX.mjs +0 -188
  110. package/dist/es/chunk/D9Lr0Bzb.mjs +0 -1136
  111. package/dist/es/chunk/DCkPv0hy.mjs +0 -29
  112. package/dist/es/chunk/DRwwUUhy.mjs +0 -49
  113. package/dist/es/chunk/DX-2VRY2.mjs +0 -836
  114. package/dist/es/chunk/DZ2oTFad.mjs +0 -687
  115. package/dist/es/chunk/D_bou1py.mjs +0 -55
  116. package/dist/es/chunk/Da199A5L.mjs +0 -314
  117. package/dist/es/chunk/DbhQlaOz.mjs +0 -94
  118. package/dist/es/chunk/Dgu95mOy.mjs +0 -237
  119. package/dist/es/chunk/DhGOsWxx.mjs +0 -6
  120. package/dist/es/chunk/Dm_Sj5aH.mjs +0 -487
  121. package/dist/es/chunk/Dmi-1GRO.mjs +0 -163
  122. package/dist/es/chunk/DodoD9a9.mjs +0 -52
  123. package/dist/es/chunk/DrrVDcwm.mjs +0 -955
  124. package/dist/es/chunk/Du_zJ1Fz.mjs +0 -49
  125. package/dist/es/chunk/DxxbB5jY.mjs +0 -34
  126. package/dist/es/chunk/Gk1J52Yw.mjs +0 -207
  127. package/dist/es/chunk/NsldgdCh.mjs +0 -704
  128. package/dist/es/chunk/V6KjsUQN.mjs +0 -35
  129. package/dist/es/chunk/eEsLFV3s.mjs +0 -76
  130. package/dist/es/chunk/fqiLhk0V.mjs +0 -2065
  131. package/dist/es/chunk/nxVM7re4.mjs +0 -35
  132. package/dist/es/chunk/s7HLrANj.mjs +0 -215
  133. package/dist/es/chunk/vPhxogl3.mjs +0 -19
  134. package/dist/es/components/icon/icon2.mjs +0 -27
@@ -1,2065 +0,0 @@
1
- import { defineComponent, inject, createVNode, Comment, computed, createElementBlock, openBlock, normalizeClass, unref, createCommentVNode, createBlock, withModifiers, withCtx, createElementVNode, Fragment, getCurrentInstance, ref, renderList, createTextVNode, toDisplayString, renderSlot, useSlots, provide, reactive, watch, onBeforeUpdate, onMounted, nextTick, useAttrs, withDirectives, vShow, normalizeStyle, createSlots, resolveDynamicComponent, withKeys, vModelText, useTemplateRef, onBeforeUnmount, mergeProps, isRef } from 'vue';
2
- import { isClient, useDebounceFn, useResizeObserver, useCssVar, useVModel } from '@vueuse/core';
3
- import { E as ElInput } from './DX-2VRY2.mjs';
4
- import { g as unique, c as castArray, u as useTooltipContentProps, E as Ee, a as ElTooltip } from './CoGexPPD.mjs';
5
- import { E as ElScrollbar } from './CjLR27-a.mjs';
6
- import { t as tagProps, E as ElTag } from './Dmi-1GRO.mjs';
7
- import { E as ElIcon } from './D0QTifnI.mjs';
8
- import { Check, Loading, ArrowRight, CircleClose, ArrowDown } from '@element-plus/icons-vue';
9
- import { u as useNamespace, c as isArray, f as isFunction, b as buildProps, N as NOOP, d as definePropType, a as debugWarn, k as isPromise } from './Gk1J52Yw.mjs';
10
- import { u as useSizeProp } from './vPhxogl3.mjs';
11
- import { i as iconPropType } from '../components/icon/icon2.mjs';
12
- import { u as useEmptyValuesProps, a as useEmptyValues } from './COs9dJZa.mjs';
13
- import { C as CHANGE_EVENT, U as UPDATE_MODEL_EVENT } from './Ct6q2FXg.mjs';
14
- import { a as isEmpty, c as isUndefined, g as isPropAbsent, d as isBoolean } from './Bc6yUGLs.mjs';
15
- import { _ as _export_sfc, w as withInstall } from './V6KjsUQN.mjs';
16
- import { C as ClickOutside } from './eEsLFV3s.mjs';
17
- import { u as useLocale } from './CEl4MyfJ.mjs';
18
- import { u as useFormItem, a as useFormDisabled, c as useFormSize } from './CBMjhoFP.mjs';
19
- import { a as useComposition, u as useFocusController } from './CVqW0jzp.mjs';
20
- import { g as getEventCode, E as EVENT_CODE } from './BTpNRPQW.mjs';
21
- import { b as isLeaf, c as focusNode, g as getSibling } from './CsLIbnzG.mjs';
22
- import { c as cloneDeep } from './DCkPv0hy.mjs';
23
- import { a as ElCheckbox } from './NsldgdCh.mjs';
24
- import { b as ElRadio } from './CCVL_Zj-.mjs';
25
- import { E as ElTree } from './Brp-qSBw.mjs';
26
- import './DbhQlaOz.mjs';
27
- import { u as useId } from './nxVM7re4.mjs';
28
- import { i as isEqual } from './B71xEPfK.mjs';
29
- import { s as scrollIntoView } from './CccIsEqA.mjs';
30
- import { b as baseFlatten } from './BunQI8Jb.mjs';
31
- import { _ as _export_sfc$1 } from './pcqpp-6-.mjs';
32
-
33
- /** Used as references for various `Number` constants. */
34
- var INFINITY = 1 / 0;
35
-
36
- /**
37
- * Recursively flattens `array`.
38
- *
39
- * @static
40
- * @memberOf _
41
- * @since 3.0.0
42
- * @category Array
43
- * @param {Array} array The array to flatten.
44
- * @returns {Array} Returns the new flattened array.
45
- * @example
46
- *
47
- * _.flattenDeep([1, [2, [3, [4]], 5]]);
48
- * // => [1, 2, 3, 4, 5]
49
- */
50
- function flattenDeep(array) {
51
- var length = array == null ? 0 : array.length;
52
- return length ? baseFlatten(array, INFINITY) : [];
53
- }
54
-
55
- const CASCADER_PANEL_INJECTION_KEY = Symbol();
56
-
57
- function isVNodeEmpty(vnodes) {
58
- return !!(isArray(vnodes) ? vnodes.every(({
59
- type
60
- }) => type === Comment) : (vnodes == null ? void 0 : vnodes.type) === Comment);
61
- }
62
- var NodeContent = defineComponent({
63
- name: "NodeContent",
64
- props: {
65
- node: {
66
- type: Object,
67
- required: true
68
- }
69
- },
70
- setup(props) {
71
- const ns = useNamespace("cascader-node");
72
- const {
73
- renderLabelFn
74
- } = inject(CASCADER_PANEL_INJECTION_KEY);
75
- const {
76
- node
77
- } = props;
78
- const {
79
- data,
80
- label: nodeLabel
81
- } = node;
82
- const label = () => {
83
- const renderLabel = renderLabelFn == null ? void 0 : renderLabelFn({
84
- node,
85
- data
86
- });
87
- return isVNodeEmpty(renderLabel) ? nodeLabel : renderLabel != null ? renderLabel : nodeLabel;
88
- };
89
- return () => createVNode("span", {
90
- "class": ns.e("label")
91
- }, [label()]);
92
- }
93
- });
94
-
95
- const _hoisted_1$1 = ["id", "aria-haspopup", "aria-owns", "aria-expanded", "tabindex"];
96
- const _sfc_main$4 = defineComponent({
97
- ...{
98
- name: "ElCascaderNode"
99
- },
100
- __name: "node",
101
- props: {
102
- node: {
103
- type: Object,
104
- required: true
105
- },
106
- menuId: String
107
- },
108
- emits: ["expand"],
109
- setup(__props, { emit: __emit }) {
110
- const props = __props;
111
- const emit = __emit;
112
- const panel = inject(CASCADER_PANEL_INJECTION_KEY);
113
- const ns = useNamespace("cascader-node");
114
- const isHoverMenu = computed(() => panel.isHoverMenu);
115
- const multiple = computed(() => panel.config.multiple);
116
- const checkStrictly = computed(() => panel.config.checkStrictly);
117
- const showPrefix = computed(() => panel.config.showPrefix);
118
- const checkedNodeId = computed(() => {
119
- var _a;
120
- return (_a = panel.checkedNodes[0]) == null ? void 0 : _a.uid;
121
- });
122
- const isDisabled = computed(() => props.node.isDisabled);
123
- const isLeaf = computed(() => props.node.isLeaf);
124
- const expandable = computed(
125
- () => checkStrictly.value && !isLeaf.value || !isDisabled.value
126
- );
127
- const inExpandingPath = computed(() => isInPath(panel.expandingNode));
128
- const inCheckedPath = computed(
129
- () => checkStrictly.value && panel.checkedNodes.some(isInPath)
130
- );
131
- const isInPath = (node) => {
132
- var _a;
133
- const { level, uid } = props.node;
134
- return ((_a = node == null ? void 0 : node.pathNodes[level - 1]) == null ? void 0 : _a.uid) === uid;
135
- };
136
- const doExpand = () => {
137
- if (inExpandingPath.value)
138
- return;
139
- panel.expandNode(props.node);
140
- };
141
- const doCheck = (checked) => {
142
- const { node } = props;
143
- if (checked === node.checked)
144
- return;
145
- panel.handleCheckChange(node, checked);
146
- };
147
- const doLoad = () => {
148
- panel.lazyLoad(props.node, () => {
149
- if (!isLeaf.value)
150
- doExpand();
151
- });
152
- };
153
- const handleHoverExpand = (e) => {
154
- if (!isHoverMenu.value)
155
- return;
156
- handleExpand();
157
- !isLeaf.value && emit("expand", e);
158
- };
159
- const handleExpand = () => {
160
- const { node } = props;
161
- if (!expandable.value || node.loading)
162
- return;
163
- node.loaded ? doExpand() : doLoad();
164
- };
165
- const handleClick = () => {
166
- if (isLeaf.value && !isDisabled.value && !checkStrictly.value && !multiple.value) {
167
- handleCheck(true);
168
- } else if ((panel.config.checkOnClickNode && (multiple.value || checkStrictly.value) || isLeaf.value && panel.config.checkOnClickLeaf) && !isDisabled.value) {
169
- handleSelectCheck(!props.node.checked);
170
- } else if (!isHoverMenu.value) {
171
- handleExpand();
172
- }
173
- };
174
- const handleSelectCheck = (checked) => {
175
- if (checkStrictly.value) {
176
- doCheck(checked);
177
- if (props.node.loaded) {
178
- doExpand();
179
- }
180
- } else {
181
- handleCheck(checked);
182
- }
183
- };
184
- const handleCheck = (checked) => {
185
- if (!props.node.loaded) {
186
- doLoad();
187
- } else {
188
- doCheck(checked);
189
- !checkStrictly.value && doExpand();
190
- }
191
- };
192
- return (_ctx, _cache) => {
193
- return openBlock(), createElementBlock("li", {
194
- id: `${__props.menuId}-${__props.node.uid}`,
195
- role: "menuitem",
196
- "aria-haspopup": !isLeaf.value,
197
- "aria-owns": isLeaf.value ? void 0 : __props.menuId,
198
- "aria-expanded": inExpandingPath.value,
199
- tabindex: expandable.value ? -1 : void 0,
200
- class: normalizeClass([
201
- unref(ns).b(),
202
- unref(ns).is("selectable", checkStrictly.value),
203
- unref(ns).is("active", __props.node.checked),
204
- unref(ns).is("disabled", !expandable.value),
205
- inExpandingPath.value && "in-active-path",
206
- inCheckedPath.value && "in-checked-path"
207
- ]),
208
- onMouseenter: handleHoverExpand,
209
- onFocus: handleHoverExpand,
210
- onClick: handleClick
211
- }, [
212
- createCommentVNode(" prefix "),
213
- multiple.value && showPrefix.value ? (openBlock(), createBlock(unref(ElCheckbox), {
214
- key: 0,
215
- "model-value": __props.node.checked,
216
- indeterminate: __props.node.indeterminate,
217
- disabled: isDisabled.value,
218
- onClick: _cache[0] || (_cache[0] = withModifiers(() => {
219
- }, ["stop"])),
220
- "onUpdate:modelValue": handleSelectCheck
221
- }, null, 8, ["model-value", "indeterminate", "disabled"])) : checkStrictly.value && showPrefix.value ? (openBlock(), createBlock(unref(ElRadio), {
222
- key: 1,
223
- "model-value": checkedNodeId.value,
224
- label: __props.node.uid,
225
- disabled: isDisabled.value,
226
- "onUpdate:modelValue": handleSelectCheck,
227
- onClick: _cache[1] || (_cache[1] = withModifiers(() => {
228
- }, ["stop"]))
229
- }, {
230
- default: withCtx(() => [
231
- createCommentVNode("\n Add an empty element to avoid render label,\n do not use empty fragment here for https://github.com/vuejs/vue-next/pull/2485\n "),
232
- _cache[2] || (_cache[2] = createElementVNode(
233
- "span",
234
- null,
235
- null,
236
- -1
237
- ))
238
- ]),
239
- _: 1
240
- }, 8, ["model-value", "label", "disabled"])) : isLeaf.value && __props.node.checked ? (openBlock(), createBlock(unref(ElIcon), {
241
- key: 2,
242
- class: normalizeClass(unref(ns).e("prefix"))
243
- }, {
244
- default: withCtx(() => [
245
- createVNode(unref(Check))
246
- ]),
247
- _: 1
248
- }, 8, ["class"])) : createCommentVNode("v-if", true),
249
- createCommentVNode(" content "),
250
- createVNode(unref(NodeContent), { node: __props.node }, null, 8, ["node"]),
251
- createCommentVNode(" postfix "),
252
- !isLeaf.value ? (openBlock(), createElementBlock(
253
- Fragment,
254
- { key: 3 },
255
- [
256
- __props.node.loading ? (openBlock(), createBlock(unref(ElIcon), {
257
- key: 0,
258
- class: normalizeClass([unref(ns).is("loading"), unref(ns).e("postfix")])
259
- }, {
260
- default: withCtx(() => [
261
- createVNode(unref(Loading))
262
- ]),
263
- _: 1
264
- }, 8, ["class"])) : (openBlock(), createBlock(unref(ElIcon), {
265
- key: 1,
266
- class: normalizeClass(["arrow-right", unref(ns).e("postfix")])
267
- }, {
268
- default: withCtx(() => [
269
- createVNode(unref(ArrowRight))
270
- ]),
271
- _: 1
272
- }, 8, ["class"]))
273
- ],
274
- 64
275
- )) : createCommentVNode("v-if", true)
276
- ], 42, _hoisted_1$1);
277
- };
278
- }
279
- });
280
- var ElCascaderNode = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/cascader-panel/src/node.vue"]]);
281
-
282
- const _sfc_main$3 = defineComponent({
283
- ...{
284
- name: "ElCascaderMenu"
285
- },
286
- __name: "menu",
287
- props: {
288
- nodes: {
289
- type: Array,
290
- required: true
291
- },
292
- index: {
293
- type: Number,
294
- required: true
295
- }
296
- },
297
- setup(__props) {
298
- const props = __props;
299
- const instance = getCurrentInstance();
300
- const ns = useNamespace("cascader-menu");
301
- const { t } = useLocale();
302
- const id = useId();
303
- let activeNode;
304
- let hoverTimer;
305
- const panel = inject(CASCADER_PANEL_INJECTION_KEY);
306
- const hoverZone = ref();
307
- const isEmpty = computed(() => !props.nodes.length);
308
- const isLoading = computed(() => !panel.initialLoaded);
309
- const menuId = computed(() => `${id.value}-${props.index}`);
310
- const handleExpand = (e) => {
311
- activeNode = e.target;
312
- };
313
- const handleMouseMove = (e) => {
314
- var _a;
315
- if (!panel.isHoverMenu || !activeNode || !hoverZone.value)
316
- return;
317
- if (activeNode.contains(e.target)) {
318
- clearHoverTimer();
319
- const el = instance.vnode.el;
320
- const { left } = el.getBoundingClientRect();
321
- const { offsetWidth, offsetHeight } = el;
322
- const startX = e.clientX - left;
323
- const top = activeNode.offsetTop;
324
- const bottom = top + activeNode.offsetHeight;
325
- const scrollTop = ((_a = el.querySelector(`.${ns.e("wrap")}`)) == null ? void 0 : _a.scrollTop) || 0;
326
- hoverZone.value.innerHTML = `
327
- <path style="pointer-events: auto;" fill="transparent" d="M${startX} ${top} L${offsetWidth} ${scrollTop} V${top} Z" />
328
- <path style="pointer-events: auto;" fill="transparent" d="M${startX} ${bottom} L${offsetWidth} ${offsetHeight + scrollTop} V${bottom} Z" />
329
- `;
330
- } else if (!hoverTimer) {
331
- hoverTimer = window.setTimeout(clearHoverZone, panel.config.hoverThreshold);
332
- }
333
- };
334
- const clearHoverTimer = () => {
335
- if (!hoverTimer)
336
- return;
337
- clearTimeout(hoverTimer);
338
- hoverTimer = void 0;
339
- };
340
- const clearHoverZone = () => {
341
- if (!hoverZone.value)
342
- return;
343
- hoverZone.value.innerHTML = "";
344
- clearHoverTimer();
345
- };
346
- return (_ctx, _cache) => {
347
- return openBlock(), createBlock(unref(ElScrollbar), {
348
- key: menuId.value,
349
- tag: "ul",
350
- role: "menu",
351
- class: normalizeClass(unref(ns).b()),
352
- "wrap-class": unref(ns).e("wrap"),
353
- "view-class": [unref(ns).e("list"), unref(ns).is("empty", isEmpty.value)],
354
- onMousemove: handleMouseMove,
355
- onMouseleave: clearHoverZone
356
- }, {
357
- default: withCtx(() => {
358
- var _a;
359
- return [
360
- (openBlock(true), createElementBlock(
361
- Fragment,
362
- null,
363
- renderList(__props.nodes, (node) => {
364
- return openBlock(), createBlock(ElCascaderNode, {
365
- key: node.uid,
366
- node,
367
- "menu-id": menuId.value,
368
- onExpand: handleExpand
369
- }, null, 8, ["node", "menu-id"]);
370
- }),
371
- 128
372
- )),
373
- isLoading.value ? (openBlock(), createElementBlock(
374
- "div",
375
- {
376
- key: 0,
377
- class: normalizeClass(unref(ns).e("empty-text"))
378
- },
379
- [
380
- createVNode(unref(ElIcon), {
381
- size: "14",
382
- class: normalizeClass(unref(ns).is("loading"))
383
- }, {
384
- default: withCtx(() => [
385
- createVNode(unref(Loading))
386
- ]),
387
- _: 1
388
- }, 8, ["class"]),
389
- createTextVNode(
390
- " " + toDisplayString(unref(t)("el.cascader.loading")),
391
- 1
392
- )
393
- ],
394
- 2
395
- )) : isEmpty.value ? (openBlock(), createElementBlock(
396
- "div",
397
- {
398
- key: 1,
399
- class: normalizeClass(unref(ns).e("empty-text"))
400
- },
401
- [
402
- renderSlot(_ctx.$slots, "empty", {}, () => [
403
- createTextVNode(
404
- toDisplayString(unref(t)("el.cascader.noData")),
405
- 1
406
- )
407
- ])
408
- ],
409
- 2
410
- )) : ((_a = unref(panel)) == null ? void 0 : _a.isHoverMenu) ? (openBlock(), createElementBlock(
411
- Fragment,
412
- { key: 2 },
413
- [
414
- createCommentVNode(" eslint-disable vue/html-self-closing "),
415
- (openBlock(), createElementBlock(
416
- "svg",
417
- {
418
- ref_key: "hoverZone",
419
- ref: hoverZone,
420
- class: normalizeClass(unref(ns).e("hover-zone"))
421
- },
422
- null,
423
- 2
424
- ))
425
- ],
426
- 2112
427
- )) : createCommentVNode("v-if", true),
428
- createCommentVNode(" eslint-enable vue/html-self-closing ")
429
- ];
430
- }),
431
- _: 3
432
- }, 8, ["class", "wrap-class", "view-class"]);
433
- };
434
- }
435
- });
436
- var ElCascaderMenu = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/cascader-panel/src/menu.vue"]]);
437
-
438
- let uid = 0;
439
- const calculatePathNodes = (node) => {
440
- const nodes = [node];
441
- let { parent } = node;
442
- while (parent) {
443
- nodes.unshift(parent);
444
- parent = parent.parent;
445
- }
446
- return nodes;
447
- };
448
- class Node {
449
- constructor(data, config, parent, root = false) {
450
- this.data = data;
451
- this.config = config;
452
- this.parent = parent;
453
- this.root = root;
454
- this.uid = uid++;
455
- this.checked = false;
456
- this.indeterminate = false;
457
- this.loading = false;
458
- const { value: valueKey, label: labelKey, children: childrenKey } = config;
459
- const childrenData = data[childrenKey];
460
- const pathNodes = calculatePathNodes(this);
461
- this.level = root ? 0 : parent ? parent.level + 1 : 1;
462
- this.value = data[valueKey];
463
- this.label = data[labelKey];
464
- this.pathNodes = pathNodes;
465
- this.pathValues = pathNodes.map((node) => node.value);
466
- this.pathLabels = pathNodes.map((node) => node.label);
467
- this.childrenData = childrenData;
468
- this.children = (childrenData || []).map(
469
- (child) => new Node(child, config, this)
470
- );
471
- this.loaded = !config.lazy || this.isLeaf || !isEmpty(childrenData);
472
- this.text = "";
473
- }
474
- get isDisabled() {
475
- const { data, parent, config } = this;
476
- const { disabled, checkStrictly } = config;
477
- const isDisabled = isFunction(disabled) ? disabled(data, this) : !!data[disabled];
478
- return isDisabled || !checkStrictly && !!(parent == null ? void 0 : parent.isDisabled);
479
- }
480
- get isLeaf() {
481
- const { data, config, childrenData, loaded } = this;
482
- const { lazy, leaf } = config;
483
- const isLeaf = isFunction(leaf) ? leaf(data, this) : data[leaf];
484
- return isUndefined(isLeaf) ? lazy && !loaded ? false : !(isArray(childrenData) && childrenData.length) : !!isLeaf;
485
- }
486
- get valueByOption() {
487
- return this.config.emitPath ? this.pathValues : this.value;
488
- }
489
- appendChild(childData) {
490
- const { childrenData, children } = this;
491
- const node = new Node(childData, this.config, this);
492
- if (isArray(childrenData)) {
493
- childrenData.push(childData);
494
- } else {
495
- this.childrenData = [childData];
496
- }
497
- children.push(node);
498
- return node;
499
- }
500
- calcText(allLevels, separator) {
501
- const text = allLevels ? this.pathLabels.join(separator) : this.label;
502
- this.text = text;
503
- return text;
504
- }
505
- broadcast(checked) {
506
- this.children.forEach((child) => {
507
- var _a;
508
- if (child) {
509
- child.broadcast(checked);
510
- (_a = child.onParentCheck) == null ? void 0 : _a.call(child, checked);
511
- }
512
- });
513
- }
514
- emit() {
515
- var _a;
516
- const { parent } = this;
517
- if (parent) {
518
- (_a = parent.onChildCheck) == null ? void 0 : _a.call(parent);
519
- parent.emit();
520
- }
521
- }
522
- onParentCheck(checked) {
523
- if (!this.isDisabled) {
524
- this.setCheckState(checked);
525
- }
526
- }
527
- onChildCheck() {
528
- const { children } = this;
529
- const validChildren = children.filter((child) => !child.isDisabled);
530
- const checked = validChildren.length ? validChildren.every((child) => child.checked) : false;
531
- this.setCheckState(checked);
532
- }
533
- setCheckState(checked) {
534
- const totalNum = this.children.length;
535
- const checkedNum = this.children.reduce((c, p) => {
536
- const num = p.checked ? 1 : p.indeterminate ? 0.5 : 0;
537
- return c + num;
538
- }, 0);
539
- this.checked = this.loaded && this.children.filter((child) => !child.isDisabled).every((child) => child.loaded && child.checked) && checked;
540
- this.indeterminate = this.loaded && checkedNum !== totalNum && checkedNum > 0;
541
- }
542
- doCheck(checked) {
543
- if (this.checked === checked)
544
- return;
545
- const { checkStrictly, multiple } = this.config;
546
- if (checkStrictly || !multiple) {
547
- this.checked = checked;
548
- } else {
549
- this.broadcast(checked);
550
- this.setCheckState(checked);
551
- this.emit();
552
- }
553
- }
554
- }
555
-
556
- const flatNodes = (nodes, leafOnly) => {
557
- return nodes.reduce((res, node) => {
558
- if (node.isLeaf) {
559
- res.push(node);
560
- } else {
561
- !leafOnly && res.push(node);
562
- res = res.concat(flatNodes(node.children, leafOnly));
563
- }
564
- return res;
565
- }, []);
566
- };
567
- class Store {
568
- constructor(data, config) {
569
- this.config = config;
570
- const nodes = (data || []).map(
571
- (nodeData) => new Node(nodeData, this.config)
572
- );
573
- this.nodes = nodes;
574
- this.allNodes = flatNodes(nodes, false);
575
- this.leafNodes = flatNodes(nodes, true);
576
- }
577
- getNodes() {
578
- return this.nodes;
579
- }
580
- getFlattedNodes(leafOnly) {
581
- return leafOnly ? this.leafNodes : this.allNodes;
582
- }
583
- appendNode(nodeData, parentNode) {
584
- const node = parentNode ? parentNode.appendChild(nodeData) : new Node(nodeData, this.config);
585
- if (!parentNode)
586
- this.nodes.push(node);
587
- this.appendAllNodesAndLeafNodes(node);
588
- }
589
- appendNodes(nodeDataList, parentNode) {
590
- if (nodeDataList.length > 0) {
591
- nodeDataList.forEach((nodeData) => this.appendNode(nodeData, parentNode));
592
- } else {
593
- parentNode && parentNode.isLeaf && this.leafNodes.push(parentNode);
594
- }
595
- }
596
- appendAllNodesAndLeafNodes(node) {
597
- this.allNodes.push(node);
598
- node.isLeaf && this.leafNodes.push(node);
599
- if (node.children) {
600
- node.children.forEach((subNode) => {
601
- this.appendAllNodesAndLeafNodes(subNode);
602
- });
603
- }
604
- }
605
- getNodeByValue(value, leafOnly = false) {
606
- if (isPropAbsent(value))
607
- return null;
608
- const node = this.getFlattedNodes(leafOnly).find(
609
- (node2) => isEqual(node2.value, value) || isEqual(node2.pathValues, value)
610
- );
611
- return node || null;
612
- }
613
- getSameNode(node) {
614
- if (!node)
615
- return null;
616
- const node_ = this.getFlattedNodes(false).find(
617
- ({ value, level }) => isEqual(node.value, value) && node.level === level
618
- );
619
- return node_ || null;
620
- }
621
- }
622
-
623
- const CommonProps = buildProps({
624
- modelValue: {
625
- type: definePropType([Number, String, Array, Object])
626
- },
627
- options: {
628
- type: definePropType(Array),
629
- default: () => []
630
- },
631
- props: {
632
- type: definePropType(Object),
633
- default: () => ({})
634
- }
635
- });
636
- const DefaultProps = {
637
- expandTrigger: "click",
638
- multiple: false,
639
- checkStrictly: false,
640
- emitPath: true,
641
- lazy: false,
642
- lazyLoad: NOOP,
643
- value: "value",
644
- label: "label",
645
- children: "children",
646
- leaf: "leaf",
647
- disabled: "disabled",
648
- hoverThreshold: 500,
649
- checkOnClickNode: false,
650
- checkOnClickLeaf: true,
651
- showPrefix: true
652
- };
653
- const cascaderPanelProps = buildProps({
654
- ...CommonProps,
655
- border: {
656
- type: Boolean,
657
- default: true
658
- },
659
- renderLabel: {
660
- type: Function
661
- }
662
- });
663
- const emitChangeFn$1 = (value) => true;
664
- const cascaderPanelEmits = {
665
- [UPDATE_MODEL_EVENT]: emitChangeFn$1,
666
- [CHANGE_EVENT]: emitChangeFn$1,
667
- close: () => true,
668
- "expand-change": (value) => value
669
- };
670
- const useCascaderConfig = (props) => {
671
- return computed(() => ({
672
- ...DefaultProps,
673
- ...props.props
674
- }));
675
- };
676
-
677
- const getMenuIndex = (el) => {
678
- if (!el)
679
- return 0;
680
- const pieces = el.id.split("-");
681
- return Number(pieces[pieces.length - 2]);
682
- };
683
- const checkNode = (el) => {
684
- if (!el)
685
- return;
686
- const input = el.querySelector("input");
687
- if (input) {
688
- input.click();
689
- } else if (isLeaf(el)) {
690
- el.click();
691
- }
692
- };
693
- const sortByOriginalOrder = (oldNodes, newNodes) => {
694
- const newNodesCopy = newNodes.slice(0);
695
- const newIds = newNodesCopy.map((node) => node.uid);
696
- const res = oldNodes.reduce((acc, item) => {
697
- const index = newIds.indexOf(item.uid);
698
- if (index > -1) {
699
- acc.push(item);
700
- newNodesCopy.splice(index, 1);
701
- newIds.splice(index, 1);
702
- }
703
- return acc;
704
- }, []);
705
- res.push(...newNodesCopy);
706
- return res;
707
- };
708
-
709
- const _sfc_main$2 = defineComponent({
710
- ...{
711
- name: "ElCascaderPanel"
712
- },
713
- __name: "index",
714
- props: cascaderPanelProps,
715
- emits: cascaderPanelEmits,
716
- setup(__props, { expose: __expose, emit: __emit }) {
717
- const props = __props;
718
- const emit = __emit;
719
- let manualChecked = false;
720
- const ns = useNamespace("cascader");
721
- const config = useCascaderConfig(props);
722
- const slots = useSlots();
723
- let store;
724
- const initialLoaded = ref(true);
725
- const initialLoadedOnce = ref(false);
726
- const menuList = ref([]);
727
- const checkedValue = ref();
728
- const menus = ref([]);
729
- const expandingNode = ref();
730
- const checkedNodes = ref([]);
731
- const isHoverMenu = computed(() => config.value.expandTrigger === "hover");
732
- const renderLabelFn = computed(() => props.renderLabel || slots.default);
733
- const initStore = () => {
734
- const { options } = props;
735
- const cfg = config.value;
736
- manualChecked = false;
737
- store = new Store(options, cfg);
738
- menus.value = [store.getNodes()];
739
- if (cfg.lazy && isEmpty(props.options)) {
740
- initialLoaded.value = false;
741
- lazyLoad(void 0, (list) => {
742
- if (list) {
743
- store = new Store(list, cfg);
744
- menus.value = [store.getNodes()];
745
- }
746
- initialLoaded.value = true;
747
- syncCheckedValue(false, true);
748
- });
749
- } else {
750
- syncCheckedValue(false, true);
751
- }
752
- };
753
- const lazyLoad = (node, cb) => {
754
- const cfg = config.value;
755
- node = node || new Node({}, cfg, void 0, true);
756
- node.loading = true;
757
- const resolve = (dataList) => {
758
- const _node = node;
759
- const parent = _node.root ? null : _node;
760
- _node.loading = false;
761
- _node.loaded = true;
762
- _node.childrenData = _node.childrenData || [];
763
- dataList && (store == null ? void 0 : store.appendNodes(dataList, parent));
764
- dataList && (cb == null ? void 0 : cb(dataList));
765
- if (node.level === 0) {
766
- initialLoadedOnce.value = true;
767
- }
768
- };
769
- const reject = () => {
770
- node.loading = false;
771
- node.loaded = false;
772
- if (node.level === 0) {
773
- initialLoaded.value = true;
774
- }
775
- };
776
- cfg.lazyLoad(node, resolve, reject);
777
- };
778
- const expandNode = (node, silent) => {
779
- var _a;
780
- const { level } = node;
781
- const newMenus = menus.value.slice(0, level);
782
- let newExpandingNode;
783
- if (node.isLeaf) {
784
- newExpandingNode = node.pathNodes[level - 2];
785
- } else {
786
- newExpandingNode = node;
787
- newMenus.push(node.children);
788
- }
789
- if (((_a = expandingNode.value) == null ? void 0 : _a.uid) !== (newExpandingNode == null ? void 0 : newExpandingNode.uid)) {
790
- expandingNode.value = node;
791
- menus.value = newMenus;
792
- !silent && emit("expand-change", (node == null ? void 0 : node.pathValues) || []);
793
- }
794
- };
795
- const handleCheckChange = (node, checked, emitClose = true) => {
796
- const { checkStrictly, multiple } = config.value;
797
- const oldNode = checkedNodes.value[0];
798
- manualChecked = true;
799
- !multiple && (oldNode == null ? void 0 : oldNode.doCheck(false));
800
- node.doCheck(checked);
801
- calculateCheckedValue();
802
- emitClose && !multiple && !checkStrictly && emit("close");
803
- !emitClose && !multiple && expandParentNode(node);
804
- };
805
- const expandParentNode = (node) => {
806
- if (!node)
807
- return;
808
- node = node.parent;
809
- expandParentNode(node);
810
- node && expandNode(node);
811
- };
812
- const getFlattedNodes = (leafOnly) => store == null ? void 0 : store.getFlattedNodes(leafOnly);
813
- const getCheckedNodes = (leafOnly) => {
814
- var _a;
815
- return (_a = getFlattedNodes(leafOnly)) == null ? void 0 : _a.filter(({ checked }) => checked !== false);
816
- };
817
- const clearCheckedNodes = () => {
818
- checkedNodes.value.forEach((node) => node.doCheck(false));
819
- calculateCheckedValue();
820
- menus.value = menus.value.slice(0, 1);
821
- expandingNode.value = void 0;
822
- emit("expand-change", []);
823
- };
824
- const calculateCheckedValue = () => {
825
- var _a;
826
- const { checkStrictly, multiple } = config.value;
827
- const oldNodes = checkedNodes.value;
828
- const newNodes = getCheckedNodes(!checkStrictly);
829
- const nodes = sortByOriginalOrder(oldNodes, newNodes);
830
- const values = nodes.map((node) => node.valueByOption);
831
- checkedNodes.value = nodes;
832
- checkedValue.value = multiple ? values : (_a = values[0]) != null ? _a : null;
833
- };
834
- const syncCheckedValue = (loaded = false, forced = false) => {
835
- const { modelValue } = props;
836
- const { lazy, multiple, checkStrictly } = config.value;
837
- const leafOnly = !checkStrictly;
838
- if (!initialLoaded.value || manualChecked || !forced && isEqual(modelValue, checkedValue.value))
839
- return;
840
- if (lazy && !loaded) {
841
- const values = unique(
842
- flattenDeep(castArray(modelValue))
843
- );
844
- const nodes = values.map((val) => store == null ? void 0 : store.getNodeByValue(val)).filter((node) => !!node && !node.loaded && !node.loading);
845
- if (nodes.length) {
846
- nodes.forEach((node) => {
847
- lazyLoad(node, () => syncCheckedValue(false, forced));
848
- });
849
- } else {
850
- syncCheckedValue(true, forced);
851
- }
852
- } else {
853
- const values = multiple ? castArray(modelValue) : [modelValue];
854
- const nodes = unique(
855
- values.map(
856
- (val) => store == null ? void 0 : store.getNodeByValue(val, leafOnly)
857
- )
858
- );
859
- syncMenuState(nodes, forced);
860
- checkedValue.value = cloneDeep(modelValue != null ? modelValue : void 0);
861
- }
862
- };
863
- const syncMenuState = (newCheckedNodes, reserveExpandingState = true) => {
864
- const { checkStrictly } = config.value;
865
- const oldNodes = checkedNodes.value;
866
- const newNodes = newCheckedNodes.filter(
867
- (node) => !!node && (checkStrictly || node.isLeaf)
868
- );
869
- const oldExpandingNode = store == null ? void 0 : store.getSameNode(expandingNode.value);
870
- const newExpandingNode = reserveExpandingState && oldExpandingNode || newNodes[0];
871
- if (newExpandingNode) {
872
- newExpandingNode.pathNodes.forEach((node) => expandNode(node, true));
873
- } else {
874
- expandingNode.value = void 0;
875
- }
876
- oldNodes.forEach((node) => node.doCheck(false));
877
- reactive(newNodes).forEach((node) => node.doCheck(true));
878
- checkedNodes.value = newNodes;
879
- nextTick(scrollToExpandingNode);
880
- };
881
- const scrollToExpandingNode = () => {
882
- if (!isClient)
883
- return;
884
- menuList.value.forEach((menu) => {
885
- const menuElement = menu == null ? void 0 : menu.$el;
886
- if (menuElement) {
887
- const container = menuElement.querySelector(
888
- `.${ns.namespace.value}-scrollbar__wrap`
889
- );
890
- let activeNode = menuElement.querySelector(
891
- `.${ns.b("node")}.in-active-path`
892
- );
893
- if (!activeNode) {
894
- const activeElements = menuElement.querySelectorAll(
895
- `.${ns.b("node")}.${ns.is("active")}`
896
- );
897
- activeNode = activeElements[activeElements.length - 1];
898
- }
899
- scrollIntoView(container, activeNode);
900
- }
901
- });
902
- };
903
- const handleKeyDown = (e) => {
904
- const target = e.target;
905
- const code = getEventCode(e);
906
- switch (code) {
907
- case EVENT_CODE.up:
908
- case EVENT_CODE.down: {
909
- e.preventDefault();
910
- const distance = code === EVENT_CODE.up ? -1 : 1;
911
- focusNode(
912
- getSibling(
913
- target,
914
- distance,
915
- `.${ns.b("node")}[tabindex="-1"]`
916
- )
917
- );
918
- break;
919
- }
920
- case EVENT_CODE.left: {
921
- e.preventDefault();
922
- const preMenu = menuList.value[getMenuIndex(target) - 1];
923
- const expandedNode = preMenu == null ? void 0 : preMenu.$el.querySelector(
924
- `.${ns.b("node")}[aria-expanded="true"]`
925
- );
926
- focusNode(expandedNode);
927
- break;
928
- }
929
- case EVENT_CODE.right: {
930
- e.preventDefault();
931
- const nextMenu = menuList.value[getMenuIndex(target) + 1];
932
- const firstNode = nextMenu == null ? void 0 : nextMenu.$el.querySelector(
933
- `.${ns.b("node")}[tabindex="-1"]`
934
- );
935
- focusNode(firstNode);
936
- break;
937
- }
938
- case EVENT_CODE.enter:
939
- case EVENT_CODE.numpadEnter:
940
- checkNode(target);
941
- break;
942
- }
943
- };
944
- provide(
945
- CASCADER_PANEL_INJECTION_KEY,
946
- reactive({
947
- config,
948
- expandingNode,
949
- checkedNodes,
950
- isHoverMenu,
951
- initialLoaded,
952
- renderLabelFn,
953
- lazyLoad,
954
- expandNode,
955
- handleCheckChange
956
- })
957
- );
958
- watch(
959
- config,
960
- (newVal, oldVal) => {
961
- if (isEqual(newVal, oldVal))
962
- return;
963
- initStore();
964
- },
965
- {
966
- immediate: true
967
- }
968
- );
969
- watch(() => props.options, initStore, {
970
- deep: true
971
- });
972
- watch(
973
- () => props.modelValue,
974
- () => {
975
- manualChecked = false;
976
- syncCheckedValue();
977
- },
978
- {
979
- deep: true
980
- }
981
- );
982
- watch(
983
- () => checkedValue.value,
984
- (val) => {
985
- if (!isEqual(val, props.modelValue)) {
986
- emit(UPDATE_MODEL_EVENT, val);
987
- emit(CHANGE_EVENT, val);
988
- }
989
- }
990
- );
991
- const loadLazyRootNodes = () => {
992
- if (initialLoadedOnce.value)
993
- return;
994
- initStore();
995
- };
996
- onBeforeUpdate(() => menuList.value = []);
997
- onMounted(() => !isEmpty(props.modelValue) && syncCheckedValue());
998
- __expose({
999
- menuList,
1000
- menus,
1001
- checkedNodes,
1002
- handleKeyDown,
1003
- handleCheckChange,
1004
- getFlattedNodes,
1005
- getCheckedNodes,
1006
- clearCheckedNodes,
1007
- calculateCheckedValue,
1008
- scrollToExpandingNode,
1009
- loadLazyRootNodes
1010
- });
1011
- return (_ctx, _cache) => {
1012
- return openBlock(), createElementBlock(
1013
- "div",
1014
- {
1015
- class: normalizeClass([unref(ns).b("panel"), unref(ns).is("bordered", _ctx.border)]),
1016
- onKeydown: handleKeyDown
1017
- },
1018
- [
1019
- (openBlock(true), createElementBlock(
1020
- Fragment,
1021
- null,
1022
- renderList(menus.value, (menu, index) => {
1023
- return openBlock(), createBlock(ElCascaderMenu, {
1024
- key: index,
1025
- ref_for: true,
1026
- ref: (item) => menuList.value[index] = item,
1027
- index,
1028
- nodes: [...menu]
1029
- }, {
1030
- empty: withCtx(() => [
1031
- renderSlot(_ctx.$slots, "empty")
1032
- ]),
1033
- _: 3
1034
- }, 8, ["index", "nodes"]);
1035
- }),
1036
- 128
1037
- ))
1038
- ],
1039
- 34
1040
- );
1041
- };
1042
- }
1043
- });
1044
- var CascaderPanel = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/cascader-panel/src/index.vue"]]);
1045
-
1046
- const ElCascaderPanel = withInstall(CascaderPanel);
1047
-
1048
- const cascaderProps = buildProps({
1049
- ...CommonProps,
1050
- size: useSizeProp,
1051
- placeholder: String,
1052
- disabled: {
1053
- type: Boolean,
1054
- default: void 0
1055
- },
1056
- clearable: Boolean,
1057
- clearIcon: {
1058
- type: iconPropType,
1059
- default: CircleClose
1060
- },
1061
- filterable: Boolean,
1062
- filterMethod: {
1063
- type: definePropType(
1064
- Function
1065
- ),
1066
- default: (node, keyword) => node.text.includes(keyword)
1067
- },
1068
- separator: {
1069
- type: String,
1070
- default: " / "
1071
- },
1072
- showAllLevels: {
1073
- type: Boolean,
1074
- default: true
1075
- },
1076
- collapseTags: Boolean,
1077
- maxCollapseTags: {
1078
- type: Number,
1079
- default: 1
1080
- },
1081
- collapseTagsTooltip: Boolean,
1082
- maxCollapseTagsTooltipHeight: {
1083
- type: [String, Number]
1084
- },
1085
- debounce: {
1086
- type: Number,
1087
- default: 300
1088
- },
1089
- beforeFilter: {
1090
- type: definePropType(Function),
1091
- default: () => true
1092
- },
1093
- placement: {
1094
- type: definePropType(String),
1095
- values: Ee,
1096
- default: "bottom-start"
1097
- },
1098
- fallbackPlacements: {
1099
- type: definePropType(Array),
1100
- default: ["bottom-start", "bottom", "top-start", "top", "right", "left"]
1101
- },
1102
- popperClass: useTooltipContentProps.popperClass,
1103
- popperStyle: useTooltipContentProps.popperStyle,
1104
- teleported: useTooltipContentProps.teleported,
1105
- effect: {
1106
- type: definePropType(String),
1107
- default: "light"
1108
- },
1109
- tagType: { ...tagProps.type, default: "info" },
1110
- tagEffect: { ...tagProps.effect, default: "light" },
1111
- validateEvent: {
1112
- type: Boolean,
1113
- default: true
1114
- },
1115
- persistent: {
1116
- type: Boolean,
1117
- default: true
1118
- },
1119
- showCheckedStrategy: {
1120
- type: String,
1121
- values: ["parent", "child"],
1122
- default: "child"
1123
- },
1124
- checkOnClickNode: Boolean,
1125
- showPrefix: {
1126
- type: Boolean,
1127
- default: true
1128
- },
1129
- ...useEmptyValuesProps
1130
- });
1131
- const emitChangeFn = (value) => true;
1132
- const cascaderEmits = {
1133
- [UPDATE_MODEL_EVENT]: emitChangeFn,
1134
- [CHANGE_EVENT]: emitChangeFn,
1135
- focus: (evt) => evt instanceof FocusEvent,
1136
- blur: (evt) => evt instanceof FocusEvent,
1137
- clear: () => true,
1138
- visibleChange: (val) => isBoolean(val),
1139
- expandChange: (val) => !!val,
1140
- removeTag: (val) => !!val
1141
- };
1142
-
1143
- const _hoisted_1 = ["placeholder"];
1144
- const _hoisted_2 = ["onClick"];
1145
- const _sfc_main$1 = defineComponent({
1146
- ...{
1147
- name: "ElCascader"
1148
- },
1149
- __name: "cascader",
1150
- props: cascaderProps,
1151
- emits: cascaderEmits,
1152
- setup(__props, { expose: __expose, emit: __emit }) {
1153
- const popperOptions = {
1154
- modifiers: [
1155
- {
1156
- name: "arrowPosition",
1157
- enabled: true,
1158
- phase: "main",
1159
- fn: ({ state }) => {
1160
- const { modifiersData, placement } = state;
1161
- if (["right", "left", "bottom", "top"].includes(placement))
1162
- return;
1163
- if (modifiersData.arrow) {
1164
- modifiersData.arrow.x = 35;
1165
- }
1166
- },
1167
- requires: ["arrow"]
1168
- }
1169
- ]
1170
- };
1171
- const props = __props;
1172
- const emit = __emit;
1173
- const attrs = useAttrs();
1174
- const slots = useSlots();
1175
- let inputInitialHeight = 0;
1176
- let pressDeleteCount = 0;
1177
- const nsCascader = useNamespace("cascader");
1178
- const nsInput = useNamespace("input");
1179
- const sizeMapPadding = {
1180
- small: 7,
1181
- default: 11,
1182
- large: 15
1183
- };
1184
- const { t } = useLocale();
1185
- const { formItem } = useFormItem();
1186
- const isDisabled = useFormDisabled();
1187
- const { valueOnClear } = useEmptyValues(props);
1188
- const { isComposing, handleComposition } = useComposition({
1189
- afterComposition(event) {
1190
- var _a;
1191
- const text = (_a = event.target) == null ? void 0 : _a.value;
1192
- handleInput(text);
1193
- }
1194
- });
1195
- const tooltipRef = ref();
1196
- const tagTooltipRef = ref();
1197
- const inputRef = ref();
1198
- const tagWrapper = ref();
1199
- const cascaderPanelRef = ref();
1200
- const suggestionPanel = ref();
1201
- const popperVisible = ref(false);
1202
- const inputHover = ref(false);
1203
- const filtering = ref(false);
1204
- const inputValue = ref("");
1205
- const searchInputValue = ref("");
1206
- const tags = ref([]);
1207
- const suggestions = ref([]);
1208
- const showTagList = computed(() => {
1209
- if (!props.props.multiple) {
1210
- return [];
1211
- }
1212
- return props.collapseTags ? tags.value.slice(0, props.maxCollapseTags) : tags.value;
1213
- });
1214
- const collapseTagList = computed(() => {
1215
- if (!props.props.multiple) {
1216
- return [];
1217
- }
1218
- return props.collapseTags ? tags.value.slice(props.maxCollapseTags) : [];
1219
- });
1220
- const cascaderStyle = computed(() => {
1221
- return attrs.style;
1222
- });
1223
- const inputPlaceholder = computed(
1224
- () => {
1225
- var _a;
1226
- return (_a = props.placeholder) != null ? _a : t("el.cascader.placeholder");
1227
- }
1228
- );
1229
- const currentPlaceholder = computed(
1230
- () => searchInputValue.value || tags.value.length > 0 || isComposing.value ? "" : inputPlaceholder.value
1231
- );
1232
- const realSize = useFormSize();
1233
- const tagSize = computed(
1234
- () => realSize.value === "small" ? "small" : "default"
1235
- );
1236
- const multiple = computed(() => !!props.props.multiple);
1237
- const readonly = computed(() => !props.filterable || multiple.value);
1238
- const searchKeyword = computed(
1239
- () => multiple.value ? searchInputValue.value : inputValue.value
1240
- );
1241
- const checkedNodes = computed(
1242
- () => {
1243
- var _a;
1244
- return ((_a = cascaderPanelRef.value) == null ? void 0 : _a.checkedNodes) || [];
1245
- }
1246
- );
1247
- const { wrapperRef, isFocused, handleBlur } = useFocusController(inputRef, {
1248
- disabled: isDisabled,
1249
- beforeBlur(event) {
1250
- var _a, _b;
1251
- return ((_a = tooltipRef.value) == null ? void 0 : _a.isFocusInsideContent(event)) || ((_b = tagTooltipRef.value) == null ? void 0 : _b.isFocusInsideContent(event));
1252
- },
1253
- afterBlur() {
1254
- var _a;
1255
- if (props.validateEvent) {
1256
- (_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "blur").catch((err) => debugWarn(err));
1257
- }
1258
- }
1259
- });
1260
- const clearBtnVisible = computed(() => {
1261
- if (!props.clearable || isDisabled.value || filtering.value || !inputHover.value && !isFocused.value)
1262
- return false;
1263
- return !!checkedNodes.value.length;
1264
- });
1265
- const presentText = computed(() => {
1266
- const { showAllLevels, separator } = props;
1267
- const nodes = checkedNodes.value;
1268
- return nodes.length ? multiple.value ? "" : nodes[0].calcText(showAllLevels, separator) : "";
1269
- });
1270
- const validateState = computed(() => (formItem == null ? void 0 : formItem.validateState) || "");
1271
- const checkedValue = computed({
1272
- get() {
1273
- return cloneDeep(props.modelValue);
1274
- },
1275
- set(val) {
1276
- const value = val != null ? val : valueOnClear.value;
1277
- emit(UPDATE_MODEL_EVENT, value);
1278
- emit(CHANGE_EVENT, value);
1279
- if (props.validateEvent) {
1280
- formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
1281
- }
1282
- }
1283
- });
1284
- const cascaderKls = computed(() => {
1285
- return [
1286
- nsCascader.b(),
1287
- nsCascader.m(realSize.value),
1288
- nsCascader.is("disabled", isDisabled.value),
1289
- attrs.class
1290
- ];
1291
- });
1292
- const cascaderIconKls = computed(() => {
1293
- return [
1294
- nsInput.e("icon"),
1295
- "icon-arrow-down",
1296
- nsCascader.is("reverse", popperVisible.value)
1297
- ];
1298
- });
1299
- const inputClass = computed(() => nsCascader.is("focus", isFocused.value));
1300
- const contentRef = computed(() => {
1301
- var _a, _b;
1302
- return (_b = (_a = tooltipRef.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.contentRef;
1303
- });
1304
- const handleClickOutside = (event) => {
1305
- if (isFocused.value) {
1306
- const _event = new FocusEvent("blur", event);
1307
- handleBlur(_event);
1308
- }
1309
- togglePopperVisible(false);
1310
- };
1311
- const togglePopperVisible = (visible) => {
1312
- var _a, _b;
1313
- if (isDisabled.value)
1314
- return;
1315
- visible = visible != null ? visible : !popperVisible.value;
1316
- if (visible !== popperVisible.value) {
1317
- popperVisible.value = visible;
1318
- (_b = (_a = inputRef.value) == null ? void 0 : _a.input) == null ? void 0 : _b.setAttribute("aria-expanded", `${visible}`);
1319
- if (visible) {
1320
- updatePopperPosition();
1321
- cascaderPanelRef.value && nextTick(cascaderPanelRef.value.scrollToExpandingNode);
1322
- } else if (props.filterable) {
1323
- syncPresentTextValue();
1324
- }
1325
- emit("visibleChange", visible);
1326
- }
1327
- };
1328
- const updatePopperPosition = () => {
1329
- nextTick(() => {
1330
- var _a;
1331
- (_a = tooltipRef.value) == null ? void 0 : _a.updatePopper();
1332
- });
1333
- };
1334
- const hideSuggestionPanel = () => {
1335
- filtering.value = false;
1336
- };
1337
- const genTag = (node) => {
1338
- const { showAllLevels, separator } = props;
1339
- return {
1340
- node,
1341
- key: node.uid,
1342
- text: node.calcText(showAllLevels, separator),
1343
- hitState: false,
1344
- closable: !isDisabled.value && !node.isDisabled
1345
- };
1346
- };
1347
- const deleteTag = (tag) => {
1348
- var _a;
1349
- const node = tag.node;
1350
- node.doCheck(false);
1351
- (_a = cascaderPanelRef.value) == null ? void 0 : _a.calculateCheckedValue();
1352
- emit("removeTag", node.valueByOption);
1353
- };
1354
- const getStrategyCheckedNodes = () => {
1355
- switch (props.showCheckedStrategy) {
1356
- case "child":
1357
- return checkedNodes.value;
1358
- case "parent": {
1359
- const clickedNodes = getCheckedNodes(false);
1360
- const clickedNodesValue = clickedNodes.map((o) => o.value);
1361
- const parentNodes = clickedNodes.filter(
1362
- (o) => !o.parent || !clickedNodesValue.includes(o.parent.value)
1363
- );
1364
- return parentNodes;
1365
- }
1366
- default:
1367
- return [];
1368
- }
1369
- };
1370
- const calculatePresentTags = () => {
1371
- if (!multiple.value)
1372
- return;
1373
- const nodes = getStrategyCheckedNodes();
1374
- const allTags = [];
1375
- nodes.forEach((node) => allTags.push(genTag(node)));
1376
- tags.value = allTags;
1377
- };
1378
- const calculateSuggestions = () => {
1379
- var _a, _b;
1380
- const { filterMethod, showAllLevels, separator } = props;
1381
- const res = (_b = (_a = cascaderPanelRef.value) == null ? void 0 : _a.getFlattedNodes(!props.props.checkStrictly)) == null ? void 0 : _b.filter((node) => {
1382
- if (node.isDisabled)
1383
- return false;
1384
- node.calcText(showAllLevels, separator);
1385
- return filterMethod(node, searchKeyword.value);
1386
- });
1387
- if (multiple.value) {
1388
- tags.value.forEach((tag) => {
1389
- tag.hitState = false;
1390
- });
1391
- }
1392
- filtering.value = true;
1393
- suggestions.value = res;
1394
- updatePopperPosition();
1395
- };
1396
- const focusFirstNode = () => {
1397
- var _a;
1398
- let firstNode;
1399
- if (filtering.value && suggestionPanel.value) {
1400
- firstNode = suggestionPanel.value.$el.querySelector(
1401
- `.${nsCascader.e("suggestion-item")}`
1402
- );
1403
- } else {
1404
- firstNode = (_a = cascaderPanelRef.value) == null ? void 0 : _a.$el.querySelector(
1405
- `.${nsCascader.b("node")}[tabindex="-1"]`
1406
- );
1407
- }
1408
- if (firstNode) {
1409
- firstNode.focus();
1410
- !filtering.value && firstNode.click();
1411
- }
1412
- };
1413
- const updateStyle = () => {
1414
- var _a, _b, _c;
1415
- const inputInner = (_a = inputRef.value) == null ? void 0 : _a.input;
1416
- const tagWrapperEl = tagWrapper.value;
1417
- const suggestionPanelEl = (_b = suggestionPanel.value) == null ? void 0 : _b.$el;
1418
- if (!isClient || !inputInner)
1419
- return;
1420
- if (suggestionPanelEl) {
1421
- const suggestionList = suggestionPanelEl.querySelector(
1422
- `.${nsCascader.e("suggestion-list")}`
1423
- );
1424
- suggestionList.style.minWidth = `${inputInner.offsetWidth}px`;
1425
- }
1426
- if (tagWrapperEl) {
1427
- const { offsetHeight } = tagWrapperEl;
1428
- const height = tags.value.length > 0 ? `${Math.max(offsetHeight, inputInitialHeight) - 2}px` : `${inputInitialHeight}px`;
1429
- inputInner.style.height = height;
1430
- if (slots.prefix) {
1431
- const prefix = (_c = inputRef.value) == null ? void 0 : _c.$el.querySelector(
1432
- `.${nsInput.e("prefix")}`
1433
- );
1434
- let left = 0;
1435
- if (prefix) {
1436
- left = prefix.offsetWidth;
1437
- if (left > 0) {
1438
- left += sizeMapPadding[realSize.value || "default"];
1439
- }
1440
- }
1441
- tagWrapperEl.style.left = `${left}px`;
1442
- } else {
1443
- tagWrapperEl.style.left = `0`;
1444
- }
1445
- updatePopperPosition();
1446
- }
1447
- };
1448
- const getCheckedNodes = (leafOnly) => {
1449
- var _a;
1450
- return (_a = cascaderPanelRef.value) == null ? void 0 : _a.getCheckedNodes(leafOnly);
1451
- };
1452
- const handleExpandChange = (value) => {
1453
- updatePopperPosition();
1454
- emit("expandChange", value);
1455
- };
1456
- const handleKeyDown = (e) => {
1457
- if (isComposing.value)
1458
- return;
1459
- const code = getEventCode(e);
1460
- switch (code) {
1461
- case EVENT_CODE.enter:
1462
- case EVENT_CODE.numpadEnter:
1463
- togglePopperVisible();
1464
- break;
1465
- case EVENT_CODE.down:
1466
- togglePopperVisible(true);
1467
- nextTick(focusFirstNode);
1468
- e.preventDefault();
1469
- break;
1470
- case EVENT_CODE.esc:
1471
- if (popperVisible.value === true) {
1472
- e.preventDefault();
1473
- e.stopPropagation();
1474
- togglePopperVisible(false);
1475
- }
1476
- break;
1477
- case EVENT_CODE.tab:
1478
- togglePopperVisible(false);
1479
- break;
1480
- }
1481
- };
1482
- const handleClear = () => {
1483
- var _a;
1484
- (_a = cascaderPanelRef.value) == null ? void 0 : _a.clearCheckedNodes();
1485
- if (!popperVisible.value && props.filterable) {
1486
- syncPresentTextValue();
1487
- }
1488
- togglePopperVisible(false);
1489
- emit("clear");
1490
- };
1491
- const syncPresentTextValue = () => {
1492
- const { value } = presentText;
1493
- inputValue.value = value;
1494
- searchInputValue.value = value;
1495
- };
1496
- const handleSuggestionClick = (node) => {
1497
- var _a, _b;
1498
- const { checked } = node;
1499
- if (multiple.value) {
1500
- (_a = cascaderPanelRef.value) == null ? void 0 : _a.handleCheckChange(node, !checked, false);
1501
- } else {
1502
- !checked && ((_b = cascaderPanelRef.value) == null ? void 0 : _b.handleCheckChange(node, true, false));
1503
- togglePopperVisible(false);
1504
- }
1505
- };
1506
- const handleSuggestionKeyDown = (e) => {
1507
- const target = e.target;
1508
- const code = getEventCode(e);
1509
- switch (code) {
1510
- case EVENT_CODE.up:
1511
- case EVENT_CODE.down: {
1512
- e.preventDefault();
1513
- const distance = code === EVENT_CODE.up ? -1 : 1;
1514
- focusNode(
1515
- getSibling(
1516
- target,
1517
- distance,
1518
- `.${nsCascader.e("suggestion-item")}[tabindex="-1"]`
1519
- )
1520
- );
1521
- break;
1522
- }
1523
- case EVENT_CODE.enter:
1524
- case EVENT_CODE.numpadEnter:
1525
- target.click();
1526
- break;
1527
- }
1528
- };
1529
- const handleDelete = () => {
1530
- const lastTag = tags.value[tags.value.length - 1];
1531
- pressDeleteCount = searchInputValue.value ? 0 : pressDeleteCount + 1;
1532
- if (!lastTag || !pressDeleteCount || props.collapseTags && tags.value.length > 1)
1533
- return;
1534
- if (lastTag.hitState) {
1535
- deleteTag(lastTag);
1536
- } else {
1537
- lastTag.hitState = true;
1538
- }
1539
- };
1540
- const debounce = computed(() => props.debounce);
1541
- const handleFilter = useDebounceFn(() => {
1542
- const { value } = searchKeyword;
1543
- if (!value)
1544
- return;
1545
- const passed = props.beforeFilter(value);
1546
- if (isPromise(passed)) {
1547
- passed.then(calculateSuggestions).catch(() => {
1548
- });
1549
- } else if (passed !== false) {
1550
- calculateSuggestions();
1551
- } else {
1552
- hideSuggestionPanel();
1553
- }
1554
- }, debounce);
1555
- const handleInput = (val, e) => {
1556
- !popperVisible.value && togglePopperVisible(true);
1557
- if (e == null ? void 0 : e.isComposing)
1558
- return;
1559
- val ? handleFilter() : hideSuggestionPanel();
1560
- };
1561
- const getInputInnerHeight = (inputInner) => Number.parseFloat(
1562
- useCssVar(nsInput.cssVarName("input-height"), inputInner).value
1563
- ) - 2;
1564
- const focus = () => {
1565
- var _a;
1566
- (_a = inputRef.value) == null ? void 0 : _a.focus();
1567
- };
1568
- const blur = () => {
1569
- var _a;
1570
- (_a = inputRef.value) == null ? void 0 : _a.blur();
1571
- };
1572
- watch(filtering, updatePopperPosition);
1573
- watch(
1574
- [
1575
- checkedNodes,
1576
- isDisabled,
1577
- () => props.collapseTags,
1578
- () => props.maxCollapseTags
1579
- ],
1580
- calculatePresentTags
1581
- );
1582
- watch(tags, () => {
1583
- nextTick(() => updateStyle());
1584
- });
1585
- watch(realSize, async () => {
1586
- await nextTick();
1587
- const inputInner = inputRef.value.input;
1588
- inputInitialHeight = getInputInnerHeight(inputInner) || inputInitialHeight;
1589
- updateStyle();
1590
- });
1591
- watch(presentText, syncPresentTextValue, { immediate: true });
1592
- watch(
1593
- () => popperVisible.value,
1594
- (val) => {
1595
- var _a;
1596
- if (val && props.props.lazy && props.props.lazyLoad) {
1597
- (_a = cascaderPanelRef.value) == null ? void 0 : _a.loadLazyRootNodes();
1598
- }
1599
- }
1600
- );
1601
- onMounted(() => {
1602
- const inputInner = inputRef.value.input;
1603
- const inputInnerHeight = getInputInnerHeight(inputInner);
1604
- inputInitialHeight = inputInner.offsetHeight || inputInnerHeight;
1605
- useResizeObserver(inputInner, updateStyle);
1606
- });
1607
- __expose({
1608
- getCheckedNodes,
1609
- cascaderPanelRef,
1610
- togglePopperVisible,
1611
- contentRef,
1612
- presentText,
1613
- focus,
1614
- blur
1615
- });
1616
- return (_ctx, _cache) => {
1617
- return openBlock(), createBlock(unref(ElTooltip), {
1618
- ref_key: "tooltipRef",
1619
- ref: tooltipRef,
1620
- visible: popperVisible.value,
1621
- teleported: _ctx.teleported,
1622
- "popper-class": [unref(nsCascader).e("dropdown"), _ctx.popperClass],
1623
- "popper-style": _ctx.popperStyle,
1624
- "popper-options": popperOptions,
1625
- "fallback-placements": _ctx.fallbackPlacements,
1626
- "stop-popper-mouse-event": false,
1627
- "gpu-acceleration": false,
1628
- placement: _ctx.placement,
1629
- transition: `${unref(nsCascader).namespace.value}-zoom-in-top`,
1630
- effect: _ctx.effect,
1631
- pure: "",
1632
- persistent: _ctx.persistent,
1633
- onHide: hideSuggestionPanel
1634
- }, {
1635
- default: withCtx(() => [
1636
- withDirectives((openBlock(), createElementBlock(
1637
- "div",
1638
- {
1639
- ref_key: "wrapperRef",
1640
- ref: wrapperRef,
1641
- class: normalizeClass(cascaderKls.value),
1642
- style: normalizeStyle(cascaderStyle.value),
1643
- onClick: _cache[8] || (_cache[8] = () => togglePopperVisible(readonly.value ? void 0 : true)),
1644
- onKeydown: handleKeyDown,
1645
- onMouseenter: _cache[9] || (_cache[9] = ($event) => inputHover.value = true),
1646
- onMouseleave: _cache[10] || (_cache[10] = ($event) => inputHover.value = false)
1647
- },
1648
- [
1649
- createVNode(unref(ElInput), {
1650
- ref_key: "inputRef",
1651
- ref: inputRef,
1652
- modelValue: inputValue.value,
1653
- "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inputValue.value = $event),
1654
- placeholder: currentPlaceholder.value,
1655
- readonly: readonly.value,
1656
- disabled: unref(isDisabled),
1657
- "validate-event": false,
1658
- size: unref(realSize),
1659
- class: normalizeClass(inputClass.value),
1660
- tabindex: multiple.value && _ctx.filterable && !unref(isDisabled) ? -1 : void 0,
1661
- onCompositionstart: unref(handleComposition),
1662
- onCompositionupdate: unref(handleComposition),
1663
- onCompositionend: unref(handleComposition),
1664
- onInput: handleInput
1665
- }, createSlots({
1666
- suffix: withCtx(() => [
1667
- clearBtnVisible.value ? (openBlock(), createBlock(unref(ElIcon), {
1668
- key: "clear",
1669
- class: normalizeClass([unref(nsInput).e("icon"), "icon-circle-close"]),
1670
- onClick: withModifiers(handleClear, ["stop"])
1671
- }, {
1672
- default: withCtx(() => [
1673
- (openBlock(), createBlock(resolveDynamicComponent(_ctx.clearIcon)))
1674
- ]),
1675
- _: 1
1676
- }, 8, ["class"])) : (openBlock(), createBlock(unref(ElIcon), {
1677
- key: "arrow-down",
1678
- class: normalizeClass(cascaderIconKls.value),
1679
- onClick: _cache[0] || (_cache[0] = withModifiers(($event) => togglePopperVisible(), ["stop"]))
1680
- }, {
1681
- default: withCtx(() => [
1682
- createVNode(unref(ArrowDown))
1683
- ]),
1684
- _: 1
1685
- }, 8, ["class"]))
1686
- ]),
1687
- _: 2
1688
- }, [
1689
- _ctx.$slots.prefix ? {
1690
- name: "prefix",
1691
- fn: withCtx(() => [
1692
- renderSlot(_ctx.$slots, "prefix")
1693
- ]),
1694
- key: "0"
1695
- } : void 0
1696
- ]), 1032, ["modelValue", "placeholder", "readonly", "disabled", "size", "class", "tabindex", "onCompositionstart", "onCompositionupdate", "onCompositionend"]),
1697
- multiple.value ? (openBlock(), createElementBlock(
1698
- "div",
1699
- {
1700
- key: 0,
1701
- ref_key: "tagWrapper",
1702
- ref: tagWrapper,
1703
- class: normalizeClass([
1704
- unref(nsCascader).e("tags"),
1705
- unref(nsCascader).is("validate", Boolean(validateState.value))
1706
- ])
1707
- },
1708
- [
1709
- renderSlot(_ctx.$slots, "tag", {
1710
- data: tags.value,
1711
- deleteTag
1712
- }, () => [
1713
- (openBlock(true), createElementBlock(
1714
- Fragment,
1715
- null,
1716
- renderList(showTagList.value, (tag) => {
1717
- return openBlock(), createBlock(unref(ElTag), {
1718
- key: tag.key,
1719
- type: _ctx.tagType,
1720
- size: tagSize.value,
1721
- effect: _ctx.tagEffect,
1722
- hit: tag.hitState,
1723
- closable: tag.closable,
1724
- "disable-transitions": "",
1725
- onClose: ($event) => deleteTag(tag)
1726
- }, {
1727
- default: withCtx(() => [
1728
- createElementVNode(
1729
- "span",
1730
- null,
1731
- toDisplayString(tag.text),
1732
- 1
1733
- )
1734
- ]),
1735
- _: 2
1736
- }, 1032, ["type", "size", "effect", "hit", "closable", "onClose"]);
1737
- }),
1738
- 128
1739
- ))
1740
- ]),
1741
- _ctx.collapseTags && tags.value.length > _ctx.maxCollapseTags ? (openBlock(), createBlock(unref(ElTooltip), {
1742
- key: 0,
1743
- ref_key: "tagTooltipRef",
1744
- ref: tagTooltipRef,
1745
- disabled: popperVisible.value || !_ctx.collapseTagsTooltip,
1746
- "fallback-placements": ["bottom", "top", "right", "left"],
1747
- placement: "bottom",
1748
- "popper-class": _ctx.popperClass,
1749
- "popper-style": _ctx.popperStyle,
1750
- effect: _ctx.effect,
1751
- persistent: _ctx.persistent
1752
- }, {
1753
- default: withCtx(() => [
1754
- createVNode(unref(ElTag), {
1755
- closable: false,
1756
- size: tagSize.value,
1757
- type: _ctx.tagType,
1758
- effect: _ctx.tagEffect,
1759
- "disable-transitions": ""
1760
- }, {
1761
- default: withCtx(() => [
1762
- createElementVNode(
1763
- "span",
1764
- {
1765
- class: normalizeClass(unref(nsCascader).e("tags-text"))
1766
- },
1767
- " + " + toDisplayString(tags.value.length - _ctx.maxCollapseTags),
1768
- 3
1769
- )
1770
- ]),
1771
- _: 1
1772
- }, 8, ["size", "type", "effect"])
1773
- ]),
1774
- content: withCtx(() => [
1775
- createVNode(unref(ElScrollbar), { "max-height": _ctx.maxCollapseTagsTooltipHeight }, {
1776
- default: withCtx(() => [
1777
- createElementVNode(
1778
- "div",
1779
- {
1780
- class: normalizeClass(unref(nsCascader).e("collapse-tags"))
1781
- },
1782
- [
1783
- (openBlock(true), createElementBlock(
1784
- Fragment,
1785
- null,
1786
- renderList(collapseTagList.value, (tag, idx) => {
1787
- return openBlock(), createElementBlock(
1788
- "div",
1789
- {
1790
- key: idx,
1791
- class: normalizeClass(unref(nsCascader).e("collapse-tag"))
1792
- },
1793
- [
1794
- (openBlock(), createBlock(unref(ElTag), {
1795
- key: tag.key,
1796
- class: "in-tooltip",
1797
- type: _ctx.tagType,
1798
- size: tagSize.value,
1799
- effect: _ctx.tagEffect,
1800
- hit: tag.hitState,
1801
- closable: tag.closable,
1802
- "disable-transitions": "",
1803
- onClose: ($event) => deleteTag(tag)
1804
- }, {
1805
- default: withCtx(() => [
1806
- createElementVNode(
1807
- "span",
1808
- null,
1809
- toDisplayString(tag.text),
1810
- 1
1811
- )
1812
- ]),
1813
- _: 2
1814
- }, 1032, ["type", "size", "effect", "hit", "closable", "onClose"]))
1815
- ],
1816
- 2
1817
- );
1818
- }),
1819
- 128
1820
- ))
1821
- ],
1822
- 2
1823
- )
1824
- ]),
1825
- _: 1
1826
- }, 8, ["max-height"])
1827
- ]),
1828
- _: 1
1829
- }, 8, ["disabled", "popper-class", "popper-style", "effect", "persistent"])) : createCommentVNode("v-if", true),
1830
- _ctx.filterable && !unref(isDisabled) ? withDirectives((openBlock(), createElementBlock("input", {
1831
- key: 1,
1832
- "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => searchInputValue.value = $event),
1833
- type: "text",
1834
- class: normalizeClass(unref(nsCascader).e("search-input")),
1835
- placeholder: presentText.value ? "" : inputPlaceholder.value,
1836
- onInput: _cache[3] || (_cache[3] = (e) => handleInput(searchInputValue.value, e)),
1837
- onClick: _cache[4] || (_cache[4] = withModifiers(($event) => togglePopperVisible(true), ["stop"])),
1838
- onKeydown: withKeys(handleDelete, ["delete"]),
1839
- onCompositionstart: _cache[5] || (_cache[5] = (...args) => unref(handleComposition) && unref(handleComposition)(...args)),
1840
- onCompositionupdate: _cache[6] || (_cache[6] = (...args) => unref(handleComposition) && unref(handleComposition)(...args)),
1841
- onCompositionend: _cache[7] || (_cache[7] = (...args) => unref(handleComposition) && unref(handleComposition)(...args))
1842
- }, null, 42, _hoisted_1)), [
1843
- [vModelText, searchInputValue.value]
1844
- ]) : createCommentVNode("v-if", true)
1845
- ],
1846
- 2
1847
- )) : createCommentVNode("v-if", true)
1848
- ],
1849
- 38
1850
- )), [
1851
- [unref(ClickOutside), handleClickOutside, contentRef.value]
1852
- ])
1853
- ]),
1854
- content: withCtx(() => [
1855
- _ctx.$slots.header ? (openBlock(), createElementBlock(
1856
- "div",
1857
- {
1858
- key: 0,
1859
- class: normalizeClass(unref(nsCascader).e("header")),
1860
- onClick: _cache[11] || (_cache[11] = withModifiers(() => {
1861
- }, ["stop"]))
1862
- },
1863
- [
1864
- renderSlot(_ctx.$slots, "header")
1865
- ],
1866
- 2
1867
- )) : createCommentVNode("v-if", true),
1868
- withDirectives(createVNode(unref(ElCascaderPanel), {
1869
- ref_key: "cascaderPanelRef",
1870
- ref: cascaderPanelRef,
1871
- modelValue: checkedValue.value,
1872
- "onUpdate:modelValue": _cache[12] || (_cache[12] = ($event) => checkedValue.value = $event),
1873
- options: _ctx.options,
1874
- props: props.props,
1875
- border: false,
1876
- "render-label": _ctx.$slots.default,
1877
- onExpandChange: handleExpandChange,
1878
- onClose: _cache[13] || (_cache[13] = ($event) => _ctx.$nextTick(() => togglePopperVisible(false)))
1879
- }, {
1880
- empty: withCtx(() => [
1881
- renderSlot(_ctx.$slots, "empty")
1882
- ]),
1883
- _: 3
1884
- }, 8, ["modelValue", "options", "props", "render-label"]), [
1885
- [vShow, !filtering.value]
1886
- ]),
1887
- _ctx.filterable ? withDirectives((openBlock(), createBlock(unref(ElScrollbar), {
1888
- key: 1,
1889
- ref_key: "suggestionPanel",
1890
- ref: suggestionPanel,
1891
- tag: "ul",
1892
- class: normalizeClass(unref(nsCascader).e("suggestion-panel")),
1893
- "view-class": unref(nsCascader).e("suggestion-list"),
1894
- onKeydown: handleSuggestionKeyDown
1895
- }, {
1896
- default: withCtx(() => [
1897
- suggestions.value.length ? (openBlock(true), createElementBlock(
1898
- Fragment,
1899
- { key: 0 },
1900
- renderList(suggestions.value, (item) => {
1901
- return openBlock(), createElementBlock("li", {
1902
- key: item.uid,
1903
- class: normalizeClass([
1904
- unref(nsCascader).e("suggestion-item"),
1905
- unref(nsCascader).is("checked", item.checked)
1906
- ]),
1907
- tabindex: -1,
1908
- onClick: ($event) => handleSuggestionClick(item)
1909
- }, [
1910
- renderSlot(_ctx.$slots, "suggestion-item", { item }, () => [
1911
- createElementVNode(
1912
- "span",
1913
- null,
1914
- toDisplayString(item.text),
1915
- 1
1916
- ),
1917
- item.checked ? (openBlock(), createBlock(unref(ElIcon), { key: 0 }, {
1918
- default: withCtx(() => [
1919
- createVNode(unref(Check))
1920
- ]),
1921
- _: 1
1922
- })) : createCommentVNode("v-if", true)
1923
- ])
1924
- ], 10, _hoisted_2);
1925
- }),
1926
- 128
1927
- )) : renderSlot(_ctx.$slots, "empty", { key: 1 }, () => [
1928
- createElementVNode(
1929
- "li",
1930
- {
1931
- class: normalizeClass(unref(nsCascader).e("empty-text"))
1932
- },
1933
- toDisplayString(unref(t)("el.cascader.noMatch")),
1934
- 3
1935
- )
1936
- ])
1937
- ]),
1938
- _: 3
1939
- }, 8, ["class", "view-class"])), [
1940
- [vShow, filtering.value]
1941
- ]) : createCommentVNode("v-if", true),
1942
- _ctx.$slots.footer ? (openBlock(), createElementBlock(
1943
- "div",
1944
- {
1945
- key: 2,
1946
- class: normalizeClass(unref(nsCascader).e("footer")),
1947
- onClick: _cache[14] || (_cache[14] = withModifiers(() => {
1948
- }, ["stop"]))
1949
- },
1950
- [
1951
- renderSlot(_ctx.$slots, "footer")
1952
- ],
1953
- 2
1954
- )) : createCommentVNode("v-if", true)
1955
- ]),
1956
- _: 3
1957
- }, 8, ["visible", "teleported", "popper-class", "popper-style", "fallback-placements", "placement", "transition", "effect", "persistent"]);
1958
- };
1959
- }
1960
- });
1961
- var Cascader = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/cascader/src/cascader.vue"]]);
1962
-
1963
- const ElCascader = withInstall(Cascader);
1964
-
1965
- const _sfc_main = /* @__PURE__ */ defineComponent({
1966
- __name: "popover-cascader",
1967
- props: {
1968
- modelValue: {},
1969
- multiple: { type: Boolean },
1970
- emptyText: { default: "尚未选择" },
1971
- props: {},
1972
- options: {}
1973
- },
1974
- emits: ["update:modelValue", "change", "expandChange", "choiced"],
1975
- setup(__props, { emit: __emit }) {
1976
- const props = __props;
1977
- const emits = __emit;
1978
- const myValue = useVModel(props, "modelValue", emits);
1979
- const cascaderProps = computed(() => ({
1980
- label: props.props.label || "label",
1981
- value: props.props.value || "value",
1982
- children: props.props.children || "children",
1983
- multiple: props.multiple,
1984
- emitPath: false,
1985
- ...props.props
1986
- }));
1987
- const treeProps = computed(() => ({
1988
- label: props.props.label || "label",
1989
- children: props.props.children || "children"
1990
- }));
1991
- function filterNode(value, data) {
1992
- if (!value) {
1993
- return false;
1994
- }
1995
- return value.includes(data[cascaderProps.value.value]);
1996
- }
1997
- const treeRef = useTemplateRef("treeRef");
1998
- function filterTree(val) {
1999
- nextTick(() => treeRef.value?.filter(val));
2000
- emits("expandChange");
2001
- }
2002
- const cascaderPanelRef = useTemplateRef("cascaderPanelRef");
2003
- function handleCascaderChange(val) {
2004
- const node = cascaderPanelRef.value?.getCheckedNodes(true);
2005
- emits("change", val, node);
2006
- if (!props.multiple) {
2007
- emits("choiced");
2008
- } else {
2009
- filterTree(val);
2010
- }
2011
- }
2012
- const filterTreeWatch = watch(myValue, (val) => props.multiple && filterTree(val || ""), { immediate: true });
2013
- onBeforeUnmount(() => filterTreeWatch.stop());
2014
- return (_ctx, _cache) => {
2015
- const _component_ElTree = ElTree;
2016
- const _component_ElScrollbar = ElScrollbar;
2017
- const _component_ElCascaderPanel = ElCascaderPanel;
2018
- return openBlock(), createElementBlock(Fragment, null, [
2019
- __props.multiple ? (openBlock(), createElementBlock("div", {
2020
- key: 0,
2021
- class: normalizeClass(_ctx.$style.selected)
2022
- }, [
2023
- createVNode(_component_ElScrollbar, null, {
2024
- default: withCtx(() => [
2025
- createVNode(_component_ElTree, {
2026
- ref_key: "treeRef",
2027
- ref: treeRef,
2028
- "default-expand-all": "",
2029
- "node-key": unref(cascaderProps).value,
2030
- props: unref(treeProps),
2031
- "empty-text": __props.emptyText,
2032
- data: __props.options,
2033
- "filter-node-method": filterNode
2034
- }, null, 8, ["node-key", "props", "empty-text", "data"])
2035
- ]),
2036
- _: 1
2037
- })
2038
- ], 2)) : createCommentVNode("", true),
2039
- createVNode(_component_ElCascaderPanel, mergeProps({
2040
- ref_key: "cascaderPanelRef",
2041
- ref: cascaderPanelRef,
2042
- modelValue: unref(myValue),
2043
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(myValue) ? myValue.value = $event : null),
2044
- props: unref(cascaderProps),
2045
- options: __props.options
2046
- }, _ctx.$attrs, {
2047
- onExpandChange: _cache[1] || (_cache[1] = ($event) => emits("expandChange")),
2048
- onChange: handleCascaderChange
2049
- }), null, 16, ["modelValue", "props", "options"])
2050
- ], 64);
2051
- };
2052
- }
2053
- });
2054
-
2055
- /* unplugin-vue-components disabled */const selected = "_selected_1r65k_1";
2056
- const style0 = {
2057
- selected: selected
2058
- };
2059
-
2060
- const cssModules = {
2061
- "$style": style0
2062
- };
2063
- const PopoverCascader = /* @__PURE__ */ _export_sfc$1(_sfc_main, [["__cssModules", cssModules]]);
2064
-
2065
- export { ElCascader as E, PopoverCascader as P };