SCascader.js 35 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235
  1. import { computed as y, shallowRef as Te, ref as X, watchEffect as ie, provide as We, inject as je, watch as be, createVNode as T, defineComponent as xe, onMounted as He, toRef as pe, toRefs as Be, openBlock as ze, createElementBlock as Xe, unref as Ue } from "vue";
  2. import { _ as k, w as qe, i as Ge, c as Se, u as Ye, K as Y, a as Z, b as De, d as oe, o as we, e as Je, P as ye, g as Qe, t as Ze, f as et, h as tt, j as nt, k as lt, l as at, m as ot, L as st, R as it, n as rt, p as Ve, q as ct } from "./index2.js";
  3. import { u as Ie, a as ut, B as dt, b as vt, c as pt, g as ht } from "./index3.js";
  4. import { u as ke } from "./useMergedState.js";
  5. import { c as ft, u as mt, a as Ce, g as gt } from "./index4.js";
  6. import "./index5.js";
  7. import { g as Ct, a as St } from "./statusUtils.js";
  8. import { u as yt, F as bt } from "./FormItemContext.js";
  9. const Pe = "__RC_CASCADER_SPLIT__", $e = "SHOW_PARENT", Ne = "SHOW_CHILD";
  10. function ee(e) {
  11. return e.join(Pe);
  12. }
  13. function se(e) {
  14. return e.map(ee);
  15. }
  16. function xt(e) {
  17. return e.split(Pe);
  18. }
  19. function wt(e) {
  20. const {
  21. label: a,
  22. value: t,
  23. children: n
  24. } = e || {}, l = t || "value";
  25. return {
  26. label: a || "label",
  27. value: l,
  28. key: l,
  29. children: n || "children"
  30. };
  31. }
  32. function ce(e, a) {
  33. var t, n;
  34. return (t = e.isLeaf) !== null && t !== void 0 ? t : !(!((n = e[a.children]) === null || n === void 0) && n.length);
  35. }
  36. function It(e) {
  37. const a = e.parentElement;
  38. if (!a)
  39. return;
  40. const t = e.offsetTop - a.offsetTop;
  41. t - a.scrollTop < 0 ? a.scrollTo({
  42. top: t
  43. }) : t + e.offsetHeight - a.scrollTop > a.offsetHeight && a.scrollTo({
  44. top: t + e.offsetHeight - a.offsetHeight
  45. });
  46. }
  47. const Pt = (e, a) => y(() => ft(e.value, {
  48. fieldNames: a.value,
  49. initWrapper: (n) => k(k({}, n), {
  50. pathKeyEntities: {}
  51. }),
  52. processEntity: (n, l) => {
  53. const i = n.nodes.map((r) => r[a.value.value]).join(Pe);
  54. l.pathKeyEntities[i] = n, n.key = i;
  55. }
  56. }).pathKeyEntities);
  57. function Ot(e) {
  58. const a = Te(!1), t = X({});
  59. return ie(() => {
  60. if (!e.value) {
  61. a.value = !1, t.value = {};
  62. return;
  63. }
  64. let n = {
  65. matchInputWidth: !0,
  66. limit: 50
  67. };
  68. e.value && typeof e.value == "object" && (n = k(k({}, n), e.value)), n.limit <= 0 && (delete n.limit, process.env.NODE_ENV !== "production" && qe(!1, "'limit' of showSearch should be positive number or false.")), a.value = !0, t.value = n;
  69. }), {
  70. showSearch: a,
  71. searchConfig: t
  72. };
  73. }
  74. const ue = "__rc_cascader_search_mark__", Vt = (e, a, t) => {
  75. let {
  76. label: n
  77. } = t;
  78. return a.some((l) => String(l[n]).toLowerCase().includes(e.toLowerCase()));
  79. }, kt = (e) => {
  80. let {
  81. path: a,
  82. fieldNames: t
  83. } = e;
  84. return a.map((n) => n[t.label]).join(" / ");
  85. }, _t = (e, a, t, n, l, i) => y(() => {
  86. const {
  87. filter: r = Vt,
  88. render: d = kt,
  89. limit: v = 50,
  90. sort: c
  91. } = l.value, o = [];
  92. if (!e.value)
  93. return [];
  94. function C(P, b) {
  95. P.forEach((D) => {
  96. if (!c && v > 0 && o.length >= v)
  97. return;
  98. const m = [...b, D], x = D[t.value.children];
  99. // If is leaf option
  100. (!x || x.length === 0 || // If is changeOnSelect
  101. i.value) && r(e.value, m, {
  102. label: t.value.label
  103. }) && o.push(k(k({}, D), {
  104. [t.value.label]: d({
  105. inputValue: e.value,
  106. path: m,
  107. prefixCls: n.value,
  108. fieldNames: t.value
  109. }),
  110. [ue]: m
  111. })), x && C(D[t.value.children], m);
  112. });
  113. }
  114. return C(a.value, []), c && o.sort((P, b) => c(P[ue], b[ue], e.value, t.value)), v > 0 ? o.slice(0, v) : o;
  115. });
  116. function _e(e, a, t) {
  117. const n = new Set(e);
  118. return e.filter((l) => {
  119. const i = a[l], r = i ? i.parent : null, d = i ? i.children : null;
  120. return t === Ne ? !(d && d.some((v) => v.key && n.has(v.key))) : !(r && !r.node.disabled && n.has(r.key));
  121. });
  122. }
  123. function de(e, a, t) {
  124. let n = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : !1;
  125. var l;
  126. let i = a;
  127. const r = [];
  128. for (let d = 0; d < e.length; d += 1) {
  129. const v = e[d], c = i == null ? void 0 : i.findIndex((C) => {
  130. const P = C[t.value];
  131. return n ? String(P) === String(v) : P === v;
  132. }), o = c !== -1 ? i == null ? void 0 : i[c] : null;
  133. r.push({
  134. value: (l = o == null ? void 0 : o[t.value]) !== null && l !== void 0 ? l : v,
  135. index: c,
  136. option: o
  137. }), i = o == null ? void 0 : o[t.children];
  138. }
  139. return r;
  140. }
  141. const At = (e, a, t) => y(() => {
  142. const n = [], l = [];
  143. return t.value.forEach((i) => {
  144. de(i, e.value, a.value).every((d) => d.option) ? l.push(i) : n.push(i);
  145. }), [l, n];
  146. }), Et = (e, a, t, n, l) => y(() => {
  147. const i = l.value || // Default displayRender
  148. ((r) => {
  149. let {
  150. labels: d
  151. } = r;
  152. const v = n.value ? d.slice(-1) : d, c = " / ";
  153. return v.every((o) => ["string", "number"].includes(typeof o)) ? v.join(c) : v.reduce((o, C, P) => {
  154. const b = Ge(C) ? Se(C, {
  155. key: P
  156. }) : C;
  157. return P === 0 ? [b] : [...o, c, b];
  158. }, []);
  159. });
  160. return e.value.map((r) => {
  161. const d = de(r, a.value, t.value), v = i({
  162. labels: d.map((o) => {
  163. let {
  164. option: C,
  165. value: P
  166. } = o;
  167. var b;
  168. return (b = C == null ? void 0 : C[t.value.label]) !== null && b !== void 0 ? b : P;
  169. }),
  170. selectedOptions: d.map((o) => {
  171. let {
  172. option: C
  173. } = o;
  174. return C;
  175. })
  176. }), c = ee(r);
  177. return {
  178. label: v,
  179. value: c,
  180. key: c,
  181. valueCells: r
  182. };
  183. });
  184. }), Re = Symbol("CascaderContextKey"), Tt = (e) => {
  185. We(Re, e);
  186. }, he = () => je(Re), Dt = () => {
  187. const e = Ie(), {
  188. values: a
  189. } = he(), [t, n] = Ye([]);
  190. return be(() => e.open, () => {
  191. if (e.open && !e.multiple) {
  192. const l = a.value[0];
  193. n(l || []);
  194. }
  195. }, {
  196. immediate: !0
  197. }), [t, n];
  198. }, $t = (e, a, t, n, l, i) => {
  199. const r = Ie(), d = y(() => r.direction === "rtl"), [v, c, o] = [X([]), X(), X([])];
  200. ie(() => {
  201. let m = -1, x = a.value;
  202. const p = [], w = [], E = n.value.length;
  203. for (let _ = 0; _ < E && x; _ += 1) {
  204. const N = x.findIndex(($) => $[t.value.value] === n.value[_]);
  205. if (N === -1)
  206. break;
  207. m = N, p.push(m), w.push(n.value[_]), x = x[m][t.value.children];
  208. }
  209. let O = a.value;
  210. for (let _ = 0; _ < p.length - 1; _ += 1)
  211. O = O[p[_]][t.value.children];
  212. [v.value, c.value, o.value] = [w, m, O];
  213. });
  214. const C = (m) => {
  215. l(m);
  216. }, P = (m) => {
  217. const x = o.value.length;
  218. let p = c.value;
  219. p === -1 && m < 0 && (p = x);
  220. for (let w = 0; w < x; w += 1) {
  221. p = (p + m + x) % x;
  222. const E = o.value[p];
  223. if (E && !E.disabled) {
  224. const O = E[t.value.value], _ = v.value.slice(0, -1).concat(O);
  225. C(_);
  226. return;
  227. }
  228. }
  229. }, b = () => {
  230. if (v.value.length > 1) {
  231. const m = v.value.slice(0, -1);
  232. C(m);
  233. } else
  234. r.toggleOpen(!1);
  235. }, D = () => {
  236. var m;
  237. const p = (((m = o.value[c.value]) === null || m === void 0 ? void 0 : m[t.value.children]) || []).find((w) => !w.disabled);
  238. if (p) {
  239. const w = [...v.value, p[t.value.value]];
  240. C(w);
  241. }
  242. };
  243. e.expose({
  244. // scrollTo: treeRef.current?.scrollTo,
  245. onKeydown: (m) => {
  246. const {
  247. which: x
  248. } = m;
  249. switch (x) {
  250. case Y.UP:
  251. case Y.DOWN: {
  252. let p = 0;
  253. x === Y.UP ? p = -1 : x === Y.DOWN && (p = 1), p !== 0 && P(p);
  254. break;
  255. }
  256. case Y.LEFT: {
  257. d.value ? D() : b();
  258. break;
  259. }
  260. case Y.RIGHT: {
  261. d.value ? b() : D();
  262. break;
  263. }
  264. case Y.BACKSPACE: {
  265. r.searchValue || b();
  266. break;
  267. }
  268. case Y.ENTER: {
  269. if (v.value.length) {
  270. const p = o.value[c.value], w = (p == null ? void 0 : p[ue]) || [];
  271. w.length ? i(w.map((E) => E[t.value.value]), w[w.length - 1]) : i(v.value, p);
  272. }
  273. break;
  274. }
  275. case Y.ESC:
  276. r.toggleOpen(!1), open && m.stopPropagation();
  277. }
  278. },
  279. onKeyup: () => {
  280. }
  281. });
  282. };
  283. function fe(e) {
  284. let {
  285. prefixCls: a,
  286. checked: t,
  287. halfChecked: n,
  288. disabled: l,
  289. onClick: i
  290. } = e;
  291. const {
  292. customSlots: r,
  293. checkable: d
  294. } = he(), v = d.value !== !1 ? r.value.checkable : d.value, c = typeof v == "function" ? v() : typeof v == "boolean" ? null : v;
  295. return T("span", {
  296. class: {
  297. [a]: !0,
  298. [`${a}-checked`]: t,
  299. [`${a}-indeterminate`]: !t && n,
  300. [`${a}-disabled`]: l
  301. },
  302. onClick: i
  303. }, [c]);
  304. }
  305. fe.props = ["prefixCls", "checked", "halfChecked", "disabled", "onClick"];
  306. fe.displayName = "Checkbox";
  307. fe.inheritAttrs = !1;
  308. const Le = "__cascader_fix_label__";
  309. function me(e) {
  310. let {
  311. prefixCls: a,
  312. multiple: t,
  313. options: n,
  314. activeValue: l,
  315. prevValuePath: i,
  316. onToggleOpen: r,
  317. onSelect: d,
  318. onActive: v,
  319. checkedSet: c,
  320. halfCheckedSet: o,
  321. loadingKeys: C,
  322. isSelectable: P
  323. } = e;
  324. var b, D, m, x, p, w;
  325. const E = `${a}-menu`, O = `${a}-menu-item`, {
  326. fieldNames: _,
  327. changeOnSelect: N,
  328. expandTrigger: $,
  329. expandIcon: U,
  330. loadingIcon: J,
  331. dropdownMenuColumnStyle: q,
  332. customSlots: M
  333. } = he(), F = (b = U.value) !== null && b !== void 0 ? b : (m = (D = M.value).expandIcon) === null || m === void 0 ? void 0 : m.call(D), W = (x = J.value) !== null && x !== void 0 ? x : (w = (p = M.value).loadingIcon) === null || w === void 0 ? void 0 : w.call(p), te = $.value === "hover";
  334. return T("ul", {
  335. class: E,
  336. role: "menu"
  337. }, [n.map((R) => {
  338. var h;
  339. const {
  340. disabled: I
  341. } = R, s = R[ue], S = (h = R[Le]) !== null && h !== void 0 ? h : R[_.value.label], g = R[_.value.value], V = ce(R, _.value), K = s ? s.map((u) => u[_.value.value]) : [...i, g], j = ee(K), H = C.includes(j), Q = c.has(j), ne = o.has(j), le = () => {
  342. !I && (!te || !V) && v(K);
  343. }, B = () => {
  344. P(R) && d(K, V);
  345. };
  346. let G;
  347. return typeof R.title == "string" ? G = R.title : typeof S == "string" && (G = S), T("li", {
  348. key: j,
  349. class: [O, {
  350. [`${O}-expand`]: !V,
  351. [`${O}-active`]: l === g,
  352. [`${O}-disabled`]: I,
  353. [`${O}-loading`]: H
  354. }],
  355. style: q.value,
  356. role: "menuitemcheckbox",
  357. title: G,
  358. "aria-checked": Q,
  359. "data-path-key": j,
  360. onClick: () => {
  361. le(), (!t || V) && B();
  362. },
  363. onDblclick: () => {
  364. N.value && r(!1);
  365. },
  366. onMouseenter: () => {
  367. te && le();
  368. },
  369. onMousedown: (u) => {
  370. u.preventDefault();
  371. }
  372. }, [t && T(fe, {
  373. prefixCls: `${a}-checkbox`,
  374. checked: Q,
  375. halfChecked: ne,
  376. disabled: I,
  377. onClick: (u) => {
  378. u.stopPropagation(), B();
  379. }
  380. }, null), T("div", {
  381. class: `${O}-content`
  382. }, [S]), !H && F && !V && T("div", {
  383. class: `${O}-expand-icon`
  384. }, [Se(F)]), H && W && T("div", {
  385. class: `${O}-loading-icon`
  386. }, [Se(W)])]);
  387. })]);
  388. }
  389. me.props = ["prefixCls", "multiple", "options", "activeValue", "prevValuePath", "onToggleOpen", "onSelect", "onActive", "checkedSet", "halfCheckedSet", "loadingKeys", "isSelectable"];
  390. me.displayName = "Column";
  391. me.inheritAttrs = !1;
  392. const Nt = xe({
  393. compatConfig: {
  394. MODE: 3
  395. },
  396. name: "OptionList",
  397. inheritAttrs: !1,
  398. setup(e, a) {
  399. const {
  400. attrs: t,
  401. slots: n
  402. } = a, l = Ie(), i = X(), r = y(() => l.direction === "rtl"), {
  403. options: d,
  404. values: v,
  405. halfValues: c,
  406. fieldNames: o,
  407. changeOnSelect: C,
  408. onSelect: P,
  409. searchOptions: b,
  410. dropdownPrefixCls: D,
  411. loadData: m,
  412. expandTrigger: x,
  413. customSlots: p
  414. } = he(), w = y(() => D.value || l.prefixCls), E = Te([]), O = (h) => {
  415. if (!m.value || l.searchValue)
  416. return;
  417. const s = de(h, d.value, o.value).map((g) => {
  418. let {
  419. option: V
  420. } = g;
  421. return V;
  422. }), S = s[s.length - 1];
  423. if (S && !ce(S, o.value)) {
  424. const g = ee(h);
  425. E.value = [...E.value, g], m.value(s);
  426. }
  427. };
  428. ie(() => {
  429. E.value.length && E.value.forEach((h) => {
  430. const I = xt(h), s = de(I, d.value, o.value, !0).map((g) => {
  431. let {
  432. option: V
  433. } = g;
  434. return V;
  435. }), S = s[s.length - 1];
  436. (!S || S[o.value.children] || ce(S, o.value)) && (E.value = E.value.filter((g) => g !== h));
  437. });
  438. });
  439. const _ = y(() => new Set(se(v.value))), N = y(() => new Set(se(c.value))), [$, U] = Dt(), J = (h) => {
  440. U(h), O(h);
  441. }, q = (h) => {
  442. const {
  443. disabled: I
  444. } = h, s = ce(h, o.value);
  445. return !I && (s || C.value || l.multiple);
  446. }, M = function(h, I) {
  447. let s = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
  448. P(h), !l.multiple && (I || C.value && (x.value === "hover" || s)) && l.toggleOpen(!1);
  449. }, F = y(() => l.searchValue ? b.value : d.value), W = y(() => {
  450. const h = [{
  451. options: F.value
  452. }];
  453. let I = F.value;
  454. for (let s = 0; s < $.value.length; s += 1) {
  455. const S = $.value[s], g = I.find((K) => K[o.value.value] === S), V = g == null ? void 0 : g[o.value.children];
  456. if (!(V != null && V.length))
  457. break;
  458. I = V, h.push({
  459. options: V
  460. });
  461. }
  462. return h;
  463. });
  464. $t(a, F, o, $, J, (h, I) => {
  465. q(I) && M(h, ce(I, o.value), !0);
  466. });
  467. const R = (h) => {
  468. h.preventDefault();
  469. };
  470. return He(() => {
  471. be($, (h) => {
  472. var I;
  473. for (let s = 0; s < h.length; s += 1) {
  474. const S = h.slice(0, s + 1), g = ee(S), V = (I = i.value) === null || I === void 0 ? void 0 : I.querySelector(`li[data-path-key="${g.replace(/\\{0,2}"/g, '\\"')}"]`);
  475. V && It(V);
  476. }
  477. }, {
  478. flush: "post",
  479. immediate: !0
  480. });
  481. }), () => {
  482. var h, I, s, S, g;
  483. const {
  484. notFoundContent: V = ((h = n.notFoundContent) === null || h === void 0 ? void 0 : h.call(n)) || ((s = (I = p.value).notFoundContent) === null || s === void 0 ? void 0 : s.call(I)),
  485. multiple: K,
  486. toggleOpen: j
  487. } = l, H = !(!((g = (S = W.value[0]) === null || S === void 0 ? void 0 : S.options) === null || g === void 0) && g.length), Q = [{
  488. [o.value.value]: "__EMPTY__",
  489. [Le]: V,
  490. disabled: !0
  491. }], ne = k(k({}, t), {
  492. multiple: !H && K,
  493. onSelect: M,
  494. onActive: J,
  495. onToggleOpen: j,
  496. checkedSet: _.value,
  497. halfCheckedSet: N.value,
  498. loadingKeys: E.value,
  499. isSelectable: q
  500. }), B = (H ? [{
  501. options: Q
  502. }] : W.value).map((G, u) => {
  503. const f = $.value.slice(0, u), A = $.value[u];
  504. return T(me, Z(Z({
  505. key: u
  506. }, ne), {}, {
  507. prefixCls: w.value,
  508. options: G.options,
  509. prevValuePath: f,
  510. activeValue: A
  511. }), null);
  512. });
  513. return T("div", {
  514. class: [`${w.value}-menus`, {
  515. [`${w.value}-menu-empty`]: H,
  516. [`${w.value}-rtl`]: r.value
  517. }],
  518. onMousedown: R,
  519. ref: i
  520. }, [B]);
  521. };
  522. }
  523. });
  524. function Rt() {
  525. return k(k({}, we(vt(), ["tokenSeparators", "mode", "showSearch"])), {
  526. // MISC
  527. id: String,
  528. prefixCls: String,
  529. fieldNames: Je(),
  530. children: Array,
  531. // Value
  532. value: {
  533. type: [String, Number, Array]
  534. },
  535. defaultValue: {
  536. type: [String, Number, Array]
  537. },
  538. changeOnSelect: {
  539. type: Boolean,
  540. default: void 0
  541. },
  542. displayRender: Function,
  543. checkable: {
  544. type: Boolean,
  545. default: void 0
  546. },
  547. showCheckedStrategy: {
  548. type: String,
  549. default: $e
  550. },
  551. // Search
  552. showSearch: {
  553. type: [Boolean, Object],
  554. default: void 0
  555. },
  556. searchValue: String,
  557. onSearch: Function,
  558. // Trigger
  559. expandTrigger: String,
  560. // Options
  561. options: Array,
  562. /** @private Internal usage. Do not use in your production. */
  563. dropdownPrefixCls: String,
  564. loadData: Function,
  565. // Open
  566. /** @deprecated Use `open` instead */
  567. popupVisible: {
  568. type: Boolean,
  569. default: void 0
  570. },
  571. dropdownClassName: String,
  572. dropdownMenuColumnStyle: {
  573. type: Object,
  574. default: void 0
  575. },
  576. /** @deprecated Use `dropdownStyle` instead */
  577. popupStyle: {
  578. type: Object,
  579. default: void 0
  580. },
  581. dropdownStyle: {
  582. type: Object,
  583. default: void 0
  584. },
  585. /** @deprecated Use `placement` instead */
  586. popupPlacement: String,
  587. placement: String,
  588. /** @deprecated Use `onDropdownVisibleChange` instead */
  589. onPopupVisibleChange: Function,
  590. onDropdownVisibleChange: Function,
  591. // Icon
  592. expandIcon: ye.any,
  593. loadingIcon: ye.any
  594. });
  595. }
  596. function Ke() {
  597. return k(k({}, Rt()), {
  598. onChange: Function,
  599. customSlots: Object
  600. });
  601. }
  602. function Lt(e) {
  603. return Array.isArray(e) && Array.isArray(e[0]);
  604. }
  605. function Ae(e) {
  606. return e ? Lt(e) ? e : (e.length === 0 ? [] : [e]).map((a) => Array.isArray(a) ? a : [a]) : [];
  607. }
  608. const Kt = xe({
  609. compatConfig: {
  610. MODE: 3
  611. },
  612. name: "Cascader",
  613. inheritAttrs: !1,
  614. props: De(Ke(), {}),
  615. setup(e, a) {
  616. let {
  617. attrs: t,
  618. expose: n,
  619. slots: l
  620. } = a;
  621. const i = ut(pe(e, "id")), r = y(() => !!e.checkable), [d, v] = ke(e.defaultValue, {
  622. value: y(() => e.value),
  623. postState: Ae
  624. }), c = y(() => wt(e.fieldNames)), o = y(() => e.options || []), C = Pt(o, c), P = (u) => {
  625. const f = C.value;
  626. return u.map((A) => {
  627. const {
  628. nodes: L
  629. } = f[A];
  630. return L.map((z) => z[c.value.value]);
  631. });
  632. }, [b, D] = ke("", {
  633. value: y(() => e.searchValue),
  634. postState: (u) => u || ""
  635. }), m = (u, f) => {
  636. D(u), f.source !== "blur" && e.onSearch && e.onSearch(u);
  637. }, {
  638. showSearch: x,
  639. searchConfig: p
  640. } = Ot(pe(e, "showSearch")), w = _t(b, o, c, y(() => e.dropdownPrefixCls || e.prefixCls), p, pe(e, "changeOnSelect")), E = At(o, c, d), [O, _, N] = [X([]), X([]), X([])], {
  641. maxLevel: $,
  642. levelEntities: U
  643. } = mt(C);
  644. ie(() => {
  645. const [u, f] = E.value;
  646. if (!r.value || !d.value.length) {
  647. [O.value, _.value, N.value] = [u, [], f];
  648. return;
  649. }
  650. const A = se(u), L = C.value, {
  651. checkedKeys: z,
  652. halfCheckedKeys: re
  653. } = Ce(A, !0, L, $.value, U.value);
  654. [O.value, _.value, N.value] = [P(z), P(re), f];
  655. });
  656. const J = y(() => {
  657. const u = se(O.value), f = _e(u, C.value, e.showCheckedStrategy);
  658. return [...N.value, ...P(f)];
  659. }), q = Et(J, o, c, r, pe(e, "displayRender")), M = (u) => {
  660. if (v(u), e.onChange) {
  661. const f = Ae(u), A = f.map((re) => de(re, o.value, c.value).map((ve) => ve.option)), L = r.value ? f : f[0], z = r.value ? A : A[0];
  662. e.onChange(L, z);
  663. }
  664. }, F = (u) => {
  665. if (D(""), !r.value)
  666. M(u);
  667. else {
  668. const f = ee(u), A = se(O.value), L = se(_.value), z = A.includes(f), re = N.value.some((ae) => ee(ae) === f);
  669. let ve = O.value, Oe = N.value;
  670. if (re && !z)
  671. Oe = N.value.filter((ae) => ee(ae) !== f);
  672. else {
  673. const ae = z ? A.filter((Fe) => Fe !== f) : [...A, f];
  674. let ge;
  675. z ? {
  676. checkedKeys: ge
  677. } = Ce(ae, {
  678. checked: !1,
  679. halfCheckedKeys: L
  680. }, C.value, $.value, U.value) : {
  681. checkedKeys: ge
  682. } = Ce(ae, !0, C.value, $.value, U.value);
  683. const Me = _e(ge, C.value, e.showCheckedStrategy);
  684. ve = P(Me);
  685. }
  686. M([...Oe, ...ve]);
  687. }
  688. }, W = (u, f) => {
  689. if (f.type === "clear") {
  690. M([]);
  691. return;
  692. }
  693. const {
  694. valueCells: A
  695. } = f.values[0];
  696. F(A);
  697. };
  698. process.env.NODE_ENV !== "production" && ie(() => {
  699. oe(!e.onPopupVisibleChange, "Cascader", "`popupVisibleChange` is deprecated. Please use `dropdownVisibleChange` instead."), oe(e.popupVisible === void 0, "Cascader", "`popupVisible` is deprecated. Please use `open` instead."), oe(e.popupPlacement === void 0, "Cascader", "`popupPlacement` is deprecated. Please use `placement` instead."), oe(e.popupStyle === void 0, "Cascader", "`popupStyle` is deprecated. Please use `dropdownStyle` instead.");
  700. });
  701. const te = y(() => e.open !== void 0 ? e.open : e.popupVisible), R = y(() => e.dropdownStyle || e.popupStyle || {}), h = y(() => e.placement || e.popupPlacement), I = (u) => {
  702. var f, A;
  703. (f = e.onDropdownVisibleChange) === null || f === void 0 || f.call(e, u), (A = e.onPopupVisibleChange) === null || A === void 0 || A.call(e, u);
  704. }, {
  705. changeOnSelect: s,
  706. checkable: S,
  707. dropdownPrefixCls: g,
  708. loadData: V,
  709. expandTrigger: K,
  710. expandIcon: j,
  711. loadingIcon: H,
  712. dropdownMenuColumnStyle: Q,
  713. customSlots: ne,
  714. dropdownClassName: le
  715. } = Be(e);
  716. Tt({
  717. options: o,
  718. fieldNames: c,
  719. values: O,
  720. halfValues: _,
  721. changeOnSelect: s,
  722. onSelect: F,
  723. checkable: S,
  724. searchOptions: w,
  725. dropdownPrefixCls: g,
  726. loadData: V,
  727. expandTrigger: K,
  728. expandIcon: j,
  729. loadingIcon: H,
  730. dropdownMenuColumnStyle: Q,
  731. customSlots: ne
  732. });
  733. const B = X();
  734. n({
  735. focus() {
  736. var u;
  737. (u = B.value) === null || u === void 0 || u.focus();
  738. },
  739. blur() {
  740. var u;
  741. (u = B.value) === null || u === void 0 || u.blur();
  742. },
  743. scrollTo(u) {
  744. var f;
  745. (f = B.value) === null || f === void 0 || f.scrollTo(u);
  746. }
  747. });
  748. const G = y(() => we(e, [
  749. "id",
  750. "prefixCls",
  751. "fieldNames",
  752. // Value
  753. "defaultValue",
  754. "value",
  755. "changeOnSelect",
  756. "onChange",
  757. "displayRender",
  758. "checkable",
  759. // Search
  760. "searchValue",
  761. "onSearch",
  762. "showSearch",
  763. // Trigger
  764. "expandTrigger",
  765. // Options
  766. "options",
  767. "dropdownPrefixCls",
  768. "loadData",
  769. // Open
  770. "popupVisible",
  771. "open",
  772. "dropdownClassName",
  773. "dropdownMenuColumnStyle",
  774. "popupPlacement",
  775. "placement",
  776. "onDropdownVisibleChange",
  777. "onPopupVisibleChange",
  778. // Icon
  779. "expandIcon",
  780. "loadingIcon",
  781. "customSlots",
  782. "showCheckedStrategy",
  783. // Children
  784. "children"
  785. ]));
  786. return () => {
  787. const u = !(b.value ? w.value : o.value).length, {
  788. dropdownMatchSelectWidth: f = !1
  789. } = e, A = (
  790. // Search to match width
  791. b.value && p.value.matchInputWidth || // Empty keep the width
  792. u ? {} : {
  793. minWidth: "auto"
  794. }
  795. );
  796. return T(dt, Z(Z(Z({}, G.value), t), {}, {
  797. ref: B,
  798. id: i,
  799. prefixCls: e.prefixCls,
  800. dropdownMatchSelectWidth: f,
  801. dropdownStyle: k(k({}, R.value), A),
  802. displayValues: q.value,
  803. onDisplayValuesChange: W,
  804. mode: r.value ? "multiple" : void 0,
  805. searchValue: b.value,
  806. onSearch: m,
  807. showSearch: x.value,
  808. OptionList: Nt,
  809. emptyOptions: u,
  810. open: te.value,
  811. dropdownClassName: le.value,
  812. placement: h.value,
  813. onDropdownVisibleChange: I,
  814. getRawInputElement: () => {
  815. var L;
  816. return (L = l.default) === null || L === void 0 ? void 0 : L.call(l);
  817. }
  818. }), l);
  819. };
  820. }
  821. }), Mt = (e) => {
  822. const {
  823. prefixCls: a,
  824. componentCls: t,
  825. antCls: n
  826. } = e, l = `${t}-menu-item`, i = `
  827. &${l}-expand ${l}-expand-icon,
  828. ${l}-loading-icon
  829. `, r = Math.round((e.controlHeight - e.fontSize * e.lineHeight) / 2);
  830. return [
  831. // =====================================================
  832. // == Control ==
  833. // =====================================================
  834. {
  835. [t]: {
  836. width: e.controlWidth
  837. }
  838. },
  839. // =====================================================
  840. // == Popup ==
  841. // =====================================================
  842. {
  843. [`${t}-dropdown`]: [
  844. // ==================== Checkbox ====================
  845. gt(`${a}-checkbox`, e),
  846. {
  847. [`&${n}-select-dropdown`]: {
  848. padding: 0
  849. }
  850. },
  851. {
  852. [t]: {
  853. // ================== Checkbox ==================
  854. "&-checkbox": {
  855. top: 0,
  856. marginInlineEnd: e.paddingXS
  857. },
  858. // ==================== Menu ====================
  859. // >>> Menus
  860. "&-menus": {
  861. display: "flex",
  862. flexWrap: "nowrap",
  863. alignItems: "flex-start",
  864. [`&${t}-menu-empty`]: {
  865. [`${t}-menu`]: {
  866. width: "100%",
  867. height: "auto",
  868. [l]: {
  869. color: e.colorTextDisabled
  870. }
  871. }
  872. }
  873. },
  874. // >>> Menu
  875. "&-menu": {
  876. flexGrow: 1,
  877. minWidth: e.controlItemWidth,
  878. height: e.dropdownHeight,
  879. margin: 0,
  880. padding: e.paddingXXS,
  881. overflow: "auto",
  882. verticalAlign: "top",
  883. listStyle: "none",
  884. "-ms-overflow-style": "-ms-autohiding-scrollbar",
  885. "&:not(:last-child)": {
  886. borderInlineEnd: `${e.lineWidth}px ${e.lineType} ${e.colorSplit}`
  887. },
  888. "&-item": k(k({}, Ze), {
  889. display: "flex",
  890. flexWrap: "nowrap",
  891. alignItems: "center",
  892. padding: `${r}px ${e.paddingSM}px`,
  893. lineHeight: e.lineHeight,
  894. cursor: "pointer",
  895. transition: `all ${e.motionDurationMid}`,
  896. borderRadius: e.borderRadiusSM,
  897. "&:hover": {
  898. background: e.controlItemBgHover
  899. },
  900. "&-disabled": {
  901. color: e.colorTextDisabled,
  902. cursor: "not-allowed",
  903. "&:hover": {
  904. background: "transparent"
  905. },
  906. [i]: {
  907. color: e.colorTextDisabled
  908. }
  909. },
  910. [`&-active:not(${l}-disabled)`]: {
  911. "&, &:hover": {
  912. fontWeight: e.fontWeightStrong,
  913. backgroundColor: e.controlItemBgActive
  914. }
  915. },
  916. "&-content": {
  917. flex: "auto"
  918. },
  919. [i]: {
  920. marginInlineStart: e.paddingXXS,
  921. color: e.colorTextDescription,
  922. fontSize: e.fontSizeIcon
  923. },
  924. "&-keyword": {
  925. color: e.colorHighlight
  926. }
  927. })
  928. }
  929. }
  930. }
  931. ]
  932. },
  933. // =====================================================
  934. // == RTL ==
  935. // =====================================================
  936. {
  937. [`${t}-dropdown-rtl`]: {
  938. direction: "rtl"
  939. }
  940. },
  941. // =====================================================
  942. // == Space Compact ==
  943. // =====================================================
  944. et(e)
  945. ];
  946. }, Ft = Qe("Cascader", (e) => [Mt(e)], {
  947. controlWidth: 184,
  948. controlItemWidth: 111,
  949. dropdownHeight: 180
  950. });
  951. var Wt = function(e, a) {
  952. var t = {};
  953. for (var n in e) Object.prototype.hasOwnProperty.call(e, n) && a.indexOf(n) < 0 && (t[n] = e[n]);
  954. if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var l = 0, n = Object.getOwnPropertySymbols(e); l < n.length; l++)
  955. a.indexOf(n[l]) < 0 && Object.prototype.propertyIsEnumerable.call(e, n[l]) && (t[n[l]] = e[n[l]]);
  956. return t;
  957. };
  958. function jt(e, a, t) {
  959. const n = e.toLowerCase().split(a).reduce((r, d, v) => v === 0 ? [d] : [...r, a, d], []), l = [];
  960. let i = 0;
  961. return n.forEach((r, d) => {
  962. const v = i + r.length;
  963. let c = e.slice(i, v);
  964. i = v, d % 2 === 1 && (c = T("span", {
  965. class: `${t}-menu-item-keyword`,
  966. key: "seperator"
  967. }, [c])), l.push(c);
  968. }), l;
  969. }
  970. const Ht = (e) => {
  971. let {
  972. inputValue: a,
  973. path: t,
  974. prefixCls: n,
  975. fieldNames: l
  976. } = e;
  977. const i = [], r = a.toLowerCase();
  978. return t.forEach((d, v) => {
  979. v !== 0 && i.push(" / ");
  980. let c = d[l.label];
  981. const o = typeof c;
  982. (o === "string" || o === "number") && (c = jt(String(c), r, n)), i.push(c);
  983. }), i;
  984. };
  985. function Bt() {
  986. return k(k({}, we(Ke(), ["customSlots", "checkable", "options"])), {
  987. multiple: {
  988. type: Boolean,
  989. default: void 0
  990. },
  991. size: String,
  992. bordered: {
  993. type: Boolean,
  994. default: void 0
  995. },
  996. placement: {
  997. type: String
  998. },
  999. suffixIcon: ye.any,
  1000. status: String,
  1001. options: Array,
  1002. popupClassName: String,
  1003. /** @deprecated Please use `popupClassName` instead */
  1004. dropdownClassName: String,
  1005. "onUpdate:value": Function
  1006. });
  1007. }
  1008. const zt = xe({
  1009. compatConfig: {
  1010. MODE: 3
  1011. },
  1012. name: "ACascader",
  1013. inheritAttrs: !1,
  1014. props: De(Bt(), {
  1015. bordered: !0,
  1016. choiceTransitionName: "",
  1017. allowClear: !0
  1018. }),
  1019. setup(e, a) {
  1020. let {
  1021. attrs: t,
  1022. expose: n,
  1023. slots: l,
  1024. emit: i
  1025. } = a;
  1026. process.env.NODE_ENV !== "production" && oe(!e.dropdownClassName, "Cascader", "`dropdownClassName` is deprecated. Please use `popupClassName` instead.");
  1027. const r = yt(), d = bt.useInject(), v = y(() => Ct(d.status, e.status)), {
  1028. prefixCls: c,
  1029. rootPrefixCls: o,
  1030. getPrefixCls: C,
  1031. direction: P,
  1032. getPopupContainer: b,
  1033. renderEmpty: D,
  1034. size: m,
  1035. disabled: x
  1036. } = nt("cascader", e), p = y(() => C("select", e.prefixCls)), {
  1037. compactSize: w,
  1038. compactItemClassnames: E
  1039. } = lt(p, P), O = y(() => w.value || m.value), _ = at(), N = y(() => {
  1040. var s;
  1041. return (s = x.value) !== null && s !== void 0 ? s : _.value;
  1042. }), [$, U] = pt(p), [J] = Ft(c), q = y(() => P.value === "rtl");
  1043. process.env.NODE_ENV !== "production" && ie(() => {
  1044. oe(!e.multiple || !e.displayRender || !l.displayRender, "Cascader", "`displayRender` not work on `multiple`. Please use `tagRender` instead.");
  1045. });
  1046. const M = y(() => {
  1047. if (!e.showSearch)
  1048. return e.showSearch;
  1049. let s = {
  1050. render: Ht
  1051. };
  1052. return typeof e.showSearch == "object" && (s = k(k({}, s), e.showSearch)), s;
  1053. }), F = y(() => ot(e.popupClassName || e.dropdownClassName, `${c.value}-dropdown`, {
  1054. [`${c.value}-dropdown-rtl`]: q.value
  1055. }, U.value)), W = X();
  1056. n({
  1057. focus() {
  1058. var s;
  1059. (s = W.value) === null || s === void 0 || s.focus();
  1060. },
  1061. blur() {
  1062. var s;
  1063. (s = W.value) === null || s === void 0 || s.blur();
  1064. }
  1065. });
  1066. const te = function() {
  1067. for (var s = arguments.length, S = new Array(s), g = 0; g < s; g++)
  1068. S[g] = arguments[g];
  1069. i("update:value", S[0]), i("change", ...S), r.onFieldChange();
  1070. }, R = function() {
  1071. for (var s = arguments.length, S = new Array(s), g = 0; g < s; g++)
  1072. S[g] = arguments[g];
  1073. i("blur", ...S), r.onFieldBlur();
  1074. }, h = y(() => e.showArrow !== void 0 ? e.showArrow : e.loading || !e.multiple), I = y(() => e.placement !== void 0 ? e.placement : P.value === "rtl" ? "bottomRight" : "bottomLeft");
  1075. return () => {
  1076. var s, S;
  1077. const {
  1078. notFoundContent: g = (s = l.notFoundContent) === null || s === void 0 ? void 0 : s.call(l),
  1079. expandIcon: V = (S = l.expandIcon) === null || S === void 0 ? void 0 : S.call(l),
  1080. multiple: K,
  1081. bordered: j,
  1082. allowClear: H,
  1083. choiceTransitionName: Q,
  1084. transitionName: ne,
  1085. id: le = r.id.value
  1086. } = e, B = Wt(e, ["notFoundContent", "expandIcon", "multiple", "bordered", "allowClear", "choiceTransitionName", "transitionName", "id"]), G = g || D("Cascader");
  1087. let u = V;
  1088. V || (u = q.value ? T(st, null, null) : T(it, null, null));
  1089. const f = T("span", {
  1090. class: `${p.value}-menu-item-loading-icon`
  1091. }, [T(rt, {
  1092. spin: !0
  1093. }, null)]), {
  1094. suffixIcon: A,
  1095. removeIcon: L,
  1096. clearIcon: z
  1097. } = ht(k(k({}, e), {
  1098. hasFeedback: d.hasFeedback,
  1099. feedbackIcon: d.feedbackIcon,
  1100. multiple: K,
  1101. prefixCls: p.value,
  1102. showArrow: h.value
  1103. }), l);
  1104. return J($(T(Kt, Z(Z(Z({}, B), t), {}, {
  1105. id: le,
  1106. prefixCls: p.value,
  1107. class: [c.value, {
  1108. [`${p.value}-lg`]: O.value === "large",
  1109. [`${p.value}-sm`]: O.value === "small",
  1110. [`${p.value}-rtl`]: q.value,
  1111. [`${p.value}-borderless`]: !j,
  1112. [`${p.value}-in-form-item`]: d.isFormItemInput
  1113. }, St(p.value, v.value, d.hasFeedback), E.value, t.class, U.value],
  1114. disabled: N.value,
  1115. direction: P.value,
  1116. placement: I.value,
  1117. notFoundContent: G,
  1118. allowClear: H,
  1119. showSearch: M.value,
  1120. expandIcon: u,
  1121. inputIcon: A,
  1122. removeIcon: L,
  1123. clearIcon: z,
  1124. loadingIcon: f,
  1125. checkable: !!K,
  1126. dropdownClassName: F.value,
  1127. dropdownPrefixCls: c.value,
  1128. choiceTransitionName: Ve(o.value, "", Q),
  1129. transitionName: Ve(o.value, ct(I.value), ne),
  1130. getPopupContainer: b == null ? void 0 : b.value,
  1131. customSlots: k(k({}, l), {
  1132. checkable: () => T("span", {
  1133. class: `${c.value}-checkbox-inner`
  1134. }, null)
  1135. }),
  1136. tagRender: e.tagRender || l.tagRender,
  1137. displayRender: e.displayRender || l.displayRender,
  1138. maxTagPlaceholder: e.maxTagPlaceholder || l.maxTagPlaceholder,
  1139. showArrow: d.hasFeedback || e.showArrow,
  1140. onChange: te,
  1141. onBlur: R,
  1142. ref: W
  1143. }), l)));
  1144. };
  1145. }
  1146. }), Ee = tt(k(zt, {
  1147. SHOW_CHILD: Ne,
  1148. SHOW_PARENT: $e
  1149. })), Xt = { class: "s-cascader-common" }, tn = {
  1150. __name: "SCascader",
  1151. props: {
  1152. // 支持清空
  1153. clear: {
  1154. type: Boolean,
  1155. default: !0
  1156. },
  1157. // 默认选中项,支持 v-model 双向绑定
  1158. modelValue: {
  1159. type: [String, Array],
  1160. default() {
  1161. return "";
  1162. }
  1163. },
  1164. // 占位符 - 文案提示
  1165. placeholder: {
  1166. type: String,
  1167. default: "请选择"
  1168. },
  1169. // 树节点数据
  1170. options: {
  1171. type: Array,
  1172. default() {
  1173. return [];
  1174. }
  1175. },
  1176. // 禁用
  1177. disabled: {
  1178. type: Boolean,
  1179. default: !1
  1180. },
  1181. // 菜单展开方式
  1182. expandTrigger: {
  1183. type: String,
  1184. default: "click"
  1185. },
  1186. // options 配字段置项
  1187. fieldNames: {
  1188. type: Object,
  1189. default() {
  1190. return {
  1191. label: "name",
  1192. value: "value",
  1193. children: "children"
  1194. };
  1195. }
  1196. },
  1197. // 显示数量
  1198. maxTagCount: {
  1199. type: Number,
  1200. default: 1
  1201. },
  1202. // 多选
  1203. multiple: {
  1204. type: Boolean,
  1205. default: !0
  1206. }
  1207. },
  1208. setup(e) {
  1209. const a = e, t = X("");
  1210. return be(() => a.modelValue, (n) => {
  1211. n != null && n.length && (t.value = n);
  1212. }, { immediate: !0 }), (n, l) => {
  1213. const i = Ee;
  1214. return ze(), Xe("div", Xt, [
  1215. T(i, {
  1216. options: e.options,
  1217. allowClear: e.clear,
  1218. disabled: e.disabled,
  1219. multiple: e.multiple,
  1220. fieldNames: e.fieldNames,
  1221. maxTagCount: e.maxTagCount,
  1222. placeholder: e.placeholder,
  1223. value: t.value,
  1224. "onUpdate:value": l[0] || (l[0] = (r) => t.value = r),
  1225. expandTrigger: e.expandTrigger,
  1226. showCheckedStrategy: Ue(Ee).SHOW_CHILD,
  1227. style: { width: "100%" }
  1228. }, null, 8, ["options", "allowClear", "disabled", "multiple", "fieldNames", "maxTagCount", "placeholder", "value", "expandTrigger", "showCheckedStrategy"])
  1229. ]);
  1230. };
  1231. }
  1232. };
  1233. export {
  1234. tn as default
  1235. };