@layui/layui-vue/es/cascader/index2.js

a component library for Vue 3 base on layui-vue

import { defineComponent as se, provide as de, computed as T, useSlots as ie, ref as s, watch as j, nextTick as re, openBlock as n, createElementBlock as V, unref as y, normalizeClass as B, createVNode as C, withCtx as h, withDirectives as R, createSlots as ce, renderList as $, renderSlot as H, createCommentVNode as ne, vShow as P, createElementVNode as ve, Fragment as pe, toDisplayString as me, createBlock as _, withKeys as fe, withModifiers as ye } from "vue";
/* empty css           */
import { LayIcon as W } from "@layui/icons-vue";
import he from "../dropdown/index2.js";
import ge from "../input/index2.js";
import be from "../tagInput/index2.js";
import Ve from "../scroll/index2.js";
import Ce from "../empty/index2.js";
import Se from "../cascaderPanel/index2.js";
import ke from "./index.hooks.js";
import { CASCADER_CONTEXT_KEY as we } from "./cascader.js";
import Be from "../cascaderPanel/index.hook.js";
import { isValueArray as xe } from "../utils/arrayUtil.js";
const ze = ["size"], Ke = { key: 0, class: "slot-area" }, Te = { key: 1 }, _e = ["onClick"], He = se({ name: "LayCascader", __name: "index", props: { options: { default: void 0 }, modelValue: { default: "" }, decollator: { default: "/" }, placeholder: { default: "" }, onlyLastLevel: { type: Boolean, default: !1 }, disabled: { type: Boolean, default: !1 }, replaceFields: { default: () => ({ label: "label", value: "value", children: "children" }) }, allowClear: { type: Boolean, default: !1 }, size: {}, trigger: { default: () => ["click"] }, contentClass: {}, contentStyle: { type: [Boolean, null, String, Object, Array] }, changeOnSelect: { type: Boolean, default: !1 }, multiple: { type: Boolean, default: !1 }, lazy: { type: Boolean, default: !1 }, load: { type: Function, default: void 0 }, checkStrictly: { type: Boolean, default: !1 }, fullpath: { type: Boolean, default: !0 }, search: { type: Boolean }, searchMethod: {}, minCollapsedNum: { default: 3 }, collapseTagsTooltip: { type: Boolean, default: !0 }, teleportProps: {} }, emits: ["update:modelValue", "change", "clear"], setup(X, { emit: Y }) {
  var A, D, U;
  const a = X, E = Be(a);
  de(we, E);
  const q = T(() => p.value ? xe(a.modelValue) : !!a.modelValue), { size: L } = ke(a), v = Y, N = ie(), S = s(), f = s(!1), g = s(!1), x = s(""), z = s([]), o = T(() => E), G = s(a.options), p = s(a.multiple), K = s(a.decollator), J = s(a.onlyLastLevel), Q = s(a.disabled), F = s(a.checkStrictly), Z = s({ label: ((A = a.replaceFields) == null ? void 0 : A.label) ?? "label", value: ((D = a.replaceFields) == null ? void 0 : D.value) ?? "value", children: ((U = a.replaceFields) == null ? void 0 : U.children) ?? "children" }), u = s(o.value.selectKeys.value), b = T({ get: () => o.value.selectLabel.value, set: (e) => {
  } }), ee = s(a.changeOnSelect), I = () => {
    o.value.multipleSelectItem.value.forEach((e) => e.checked = e.indeterminate = !1), o.value.buildMultipleStatus(), o.value.multipleSelectItem.value.clear(), o.value.selectKeys.value = [], u.value = [], v("update:modelValue", p.value ? [] : void 0), v("clear");
  }, le = (e, t) => {
    var c;
    let l = e.split(K.value);
    const d = l.shift();
    let i = o.value.flatData.value.find((r) => r.label === d);
    for (; i && l.length; ) {
      const r = l.shift();
      i = (c = i.children) == null ? void 0 : c.find((k) => k.label === r);
    }
    i !== void 0 && o.value.selectKeys.value.splice(o.value.selectKeys.value.findIndex((r) => r === i.value), 1), i.checked = i.indeterminate = !1, o.value.multipleSelectItem.value.delete(i.value), o.value.buildMultipleStatus(), u.value = [...u.value.filter((r) => r !== i.value)], v("update:modelValue", u.value), S.value.hide();
  }, ae = (e) => {
    o.value.selectKeys.value = typeof e == "string" ? e.split(a.decollator) : e, p.value || S.value.hide();
    let t = typeof a.modelValue == "string" ? typeof e == "string" ? e : e.join(a.decollator) : e;
    v("update:modelValue", t);
  }, te = (e) => {
    v("update:modelValue", Array.from(e.keys()));
  }, ue = (e) => {
    v("update:modelValue", e);
  }, M = (e, t = !1) => {
    let l = e, d = [];
    for (; l; )
      d.push(t ? l.value : l.label), l = l.parent;
    return t ? d.reverse() : d.reverse().join(K.value);
  }, O = (e) => {
    var t;
    g.value = e.length > 0, g.value && (S.value.show(), z.value = (t = e, a.search && a.searchMethod && o.value.sanitizer(a.searchMethod(t), void 0) || o.value.flatData.value.filter((l) => l.label.includes(t))));
  };
  return j(() => f.value, (e) => {
    e || (!p.value && a.search && (o.value.selectKeys.value = [], re(() => {
      o.value.selectKeys.value = o.value.showKeys.value = u.value;
    })), g.value = !1, x.value = "");
  }), j(() => a.modelValue, () => {
    o.value.modelValue.value = a.modelValue;
  }), (e, t) => (n(), V("div", { size: y(L), class: B([{ "layui-cascader-opend": f.value, "layui-cascader-disabled": e.disabled, "layui-cascader": !0, "layui-cascader-multiple": e.multiple, "has-content": q.value, "has-clear": e.allowClear }]) }, [C(he, { ref_key: "dropdownRef", ref: S, trigger: e.trigger, autoFitMinWidth: !1, disabled: e.disabled, contentClass: e.contentClass, contentStyle: e.contentStyle, onShow: t[5] || (t[5] = (l) => f.value = !0), onHide: t[6] || (t[6] = (l) => f.value = !1) }, { content: h(() => [R(C(Se, { modelValue: u.value, "onUpdate:modelValue": [t[4] || (t[4] = (l) => u.value = l), ae], options: G.value, "replace-fields": Z.value, multiple: p.value, decollator: K.value, "only-last-level": J.value, disabled: Q.value, "check-strictly": F.value, lazy: a.lazy, load: a.load, changeOnSelect: ee.value, fullpath: a.fullpath, onChange: ue, "onUpdate:multipleSelectItem": te }, ce({ _: 2 }, [$(y(N), (l, d) => ({ name: d, fn: h(() => [d != "default" ? H(e.$slots, d, { key: 0 }) : ne("", !0)]) }))]), 1032, ["modelValue", "options", "replace-fields", "multiple", "decollator", "only-last-level", "disabled", "check-strictly", "lazy", "load", "changeOnSelect", "fullpath"]), [[P, !g.value]]), R(ve("div", null, [C(Ve, { height: "200px", class: "layui-cascader-search-result-list" }, { default: h(() => [z.value.length > 0 ? (n(!0), V(pe, { key: 0 }, $(z.value, (l, d) => (n(), V("div", { class: B(["layui-cascader-search-result-item", { "layui-cascader-search-result-item-active": e.multiple ? u.value.includes(l.value) : u.value.at(u.value.length - 1) == l.value }]), key: d, onClick: (i) => ((c) => {
    if (p.value)
      if (F.value)
        u.value.includes(c.value) ? u.value.splice(u.value.indexOf(c.value), 1) : u.value.push(c.value);
      else {
        const r = [], k = (m) => {
          var w;
          (w = m.children) != null && w.length ? m.children.forEach((oe) => k(oe)) : r.push(m);
        };
        k(c), r.forEach((m) => {
          u.value.includes(m.value) ? u.value = [...u.value.filter((w) => w !== m.value)] : u.value = [...u.value, m.value];
        });
      }
    else
      u.value = M(c, !0);
    v("update:modelValue", u.value);
  })(l) }, me(M(l)), 11, _e))), 128)) : (n(), _(Ce, { key: 1, class: "layui-cascader-empty" }))]), _: 1 })], 512), [[P, g.value]])]), default: h(() => [y(N).default ? (n(), V("div", Ke, [H(e.$slots, "default")])) : (n(), V("div", Te, [p.value ? (n(), _(be, { key: 1, modelValue: b.value, "onUpdate:modelValue": t[1] || (t[1] = (l) => b.value = l), "input-value": x.value, "onUpdate:inputValue": [t[2] || (t[2] = (l) => x.value = l), O], placeholder: e.placeholder, "allow-clear": e.allowClear, disabled: e.disabled, readonly: !e.search, minCollapsedNum: e.minCollapsedNum, collapseTagsTooltip: e.collapseTagsTooltip, onClear: I, onRemove: le, onKeyupCapture: t[3] || (t[3] = fe(ye(() => {
  }, ["prevent", "stop"]), ["delete"])) }, { suffix: h(() => [C(y(W), { class: B({ "is-expand": f.value }), type: "layui-icon-triangle-d" }, null, 8, ["class"])]), _: 1 }, 8, ["modelValue", "input-value", "placeholder", "allow-clear", "disabled", "readonly", "minCollapsedNum", "collapseTagsTooltip"])) : (n(), _(ge, { key: 0, modelValue: b.value, "onUpdate:modelValue": t[0] || (t[0] = (l) => b.value = l), "suffix-icon": "layui-icon-triangle-d", placeholder: e.placeholder, title: b.value, "allow-clear": e.allowClear, disabled: e.disabled, readonly: !e.search, size: y(L), onClear: I, onInput: O }, { suffix: h(() => [C(y(W), { class: B({ "is-expand": f.value }), type: "layui-icon-triangle-d" }, null, 8, ["class"])]), _: 1 }, 8, ["modelValue", "placeholder", "title", "allow-clear", "disabled", "readonly", "size"]))]))]), _: 3 }, 8, ["trigger", "disabled", "contentClass", "contentStyle"])], 10, ze));
} });
export {
  He as default
};