@farris/ui-vue/components/schema-selector/index.esm.js

Farris Vue, a Farris Design based Vue3 component library.

var Nt = Object.defineProperty;
var zt = (e, t, n) => t in e ? Nt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
var ce = (e, t, n) => zt(e, typeof t != "symbol" ? t + "" : t, n);
import { ref as c, computed as I, watch as A, nextTick as ne, reactive as it, createVNode as a, withDirectives as Ne, resolveDirective as At, onMounted as ee, vModelText as ut, Fragment as Z, defineComponent as q, shallowRef as Re, provide as Ge, inject as ae, onUnmounted as Ie, isVNode as ct, resolveComponent as $t, withModifiers as Wt, createTextVNode as K, watchEffect as rt, createApp as ze, Transition as dt, mergeProps as Ve, Teleport as ft, onBeforeMount as _t, render as We, h as Gt, cloneVNode as Ut, vShow as qt, onUpdated as Xt, onBeforeUnmount as Yt } from "vue";
import { getCustomClass as He, isMobilePhone as Xe, getCustomStyle as et, withInstall as Kt, getMaxZIndex as tt, useGuid as Jt } from "../common/index.esm.js";
import Zt from "../capsule/index.esm.js";
import { LocaleService as J } from "../locale/index.esm.js";
import Qt from "../response-toolbar/index.esm.js";
import nt from "../section/index.esm.js";
import "../property-panel/index.esm.js";
import en from "../button-edit/index.esm.js";
import { resolveAppearance as vt, createPropsResolver as Ye } from "../dynamic-resolver/index.esm.js";
import tn from "../list-view/index.esm.js";
import nn from "../loading/index.esm.js";
import { useDesignerComponent as pt } from "../designer-canvas/index.esm.js";
import { useFilter as an, useIdentify as ln, useHierarchy as on, useGroupData as sn, useDataView as un, useSelection as cn, usePagination as rn, useRow as dn, useEdit as fn, useVisualDataBound as vn, useVisualDataCell as pn, useVisualDataRow as mn, useVisualGroupRow as gn, useVisualSummaryRow as hn, useVisualData as yn, useSidebar as bn, useColumn as wn, useVirtualScroll as Cn } from "../data-view/index.esm.js";
import { FCheckbox as Ke } from "../checkbox/index.esm.js";
import { cloneDeep as xn, debounce as Sn } from "lodash-es";
import In from "../tags/index.esm.js";
import Tn from "../popover/index.esm.js";
const Bn = {
  injectSymbolToken: { type: Symbol },
  /** 待选数据视图集合 */
  viewOptions: { type: Array, default: [] },
  /** 数据视图类型 */
  viewType: { type: String, default: "Tabs" },
  editorParams: { type: Object, default: null },
  showFooter: { type: Boolean, default: !1 },
  validateFunction: { type: Function, default: null }
}, kn = {
  /** 标签页头部区域的展示类型 */
  tabType: { type: String, default: "default" },
  /** 标题自适应宽度 */
  autoTitleWidth: { type: Boolean, default: !1 },
  titleLength: { type: Number, default: 7 },
  position: { type: String, default: "top" },
  showDropdown: { type: Boolean, default: !0 },
  scrollStep: { type: Number, default: 10 },
  autoResize: { type: Boolean, default: !1 },
  width: { type: Number },
  height: { type: Number },
  searchBoxVisible: { type: Boolean, default: !0 },
  titleWidth: { type: Number, default: 0 },
  customClass: { type: String, default: "" },
  /** 指定当前活动Id */
  activeId: { type: String },
  /** 标签页内容区域是否填充 */
  fill: { type: Boolean, default: !1 },
  justifyContent: { type: String, default: "left" },
  /** 控制是否可见 */
  visible: { type: Boolean, default: !0 }
};
function Fn(e, t, n) {
  const i = c([]), l = c(e.activeId || "");
  let s = "";
  const u = c(!0), o = c([]), v = c(!0), d = c(0), p = I(() => {
    const r = i.value.find((S) => S.props.id === l.value);
    return (r == null ? void 0 : r.props.toolbarPosition) === "inHead";
  });
  function m(r, f = !0) {
    const S = r.findIndex((B) => B.props.show !== !1 && !B.props.disabled);
    if (o.value = [], S !== -1) {
      if (l.value = r[S].props.id, !f)
        return;
      const B = r[S];
      B && B.props.toolbar && B.props.toolbar.buttons && B.props.toolbar.buttons.length && (o.value = [...B.props.toolbar.buttons], v.value = B.props.toolbarVisible);
    }
  }
  function w(r) {
    l.value = r;
    const f = i.value.find((S) => S.props.id === r);
    o.value = [], f && f.props.toolbar && f.props.toolbar.buttons && f.props.toolbar.buttons.length && (o.value = [...f.props.toolbar.buttons], v.value = f.props.toolbarVisible), t.emit("update:activeId", r), t.emit("tabChange", {
      prevId: s,
      nextId: l.value
    });
  }
  function C(r) {
    let f = -1;
    if (l.value) {
      if (f = r.findIndex((S) => l.value === S.props.id && S.props.show !== !1 && !S.props.disabled), f > -1)
        return;
      s = l.value;
    }
    m(r, !1), w(l.value);
  }
  function h(r) {
    let f = !1;
    if (r) {
      const S = i.value.find((B) => B.props.id === r);
      f = !S || S.props.show === !1 || S.props.disabled === !0;
    }
    f ? C(i.value) : (l.value !== r && (s = l.value, l.value = r), w(l.value));
  }
  A(() => e.activeId, (r, f) => {
    r !== f && e.activeId !== l.value && h(r);
  });
  function g(r) {
    var S;
    if (e.autoTitleWidth)
      return;
    const f = (S = r.value) == null ? void 0 : S.querySelectorAll(".st-tab-text");
    if (!(!f || e.tabType === "pill"))
      for (let B = 0; B < f.length; B++) {
        const E = f[B].parentNode;
        f[B].scrollWidth > E.offsetWidth ? f[B].classList.contains("farris-title-text-custom") || f[B].classList.add("farris-title-text-custom") : f[B].classList.remove("farris-title-text-custom");
      }
  }
  const y = (r) => {
    r.preventDefault(), r.stopPropagation();
  };
  function T(r, f, S = !1) {
    const B = i.value.findIndex((E) => E.props.id === f);
    i.value = i.value.filter((E) => E.props.id !== f), l.value === f && (s = f, l.value = "", m(i.value)), y(r), ne(() => {
      d.value++, g(n), S && (u.value = !0), t.emit("tabRemove", {
        removeIndex: B,
        removeId: f,
        activeId: l.value
      });
    });
  }
  function b(r, f = !0) {
    const S = i.value.find((B) => B.props.id === r);
    S && (S.props.show === !1 && l.value === r ? (l.value = "", s = r, h("")) : S.props.show === !0 && !l.value && C(i.value), ne(() => {
      d.value++, f && (u.value = !0);
    }));
  }
  let V;
  function O(r) {
    V = r;
  }
  function j(r) {
    l.value !== r && (s = l.value, w(r), V && V());
  }
  function P(r) {
    i.value.findIndex((S) => S.props.id === r.props.id) === -1 && i.value.push(r), d.value++;
  }
  function k(r) {
    i.value.findIndex((S) => S.props.id === r.props.id) !== -1 && (i.value.forEach((S) => {
      S.props.id === r.props.id && (S = r);
    }), r.props.id === l.value && p.value, ne(() => {
      d.value++, g(n);
    }));
  }
  return {
    activeId: l,
    addTab: P,
    changeTitleStyle: g,
    removeTab: T,
    selectTab: j,
    tabPages: i,
    updateTab: k,
    toolbarItems: o,
    needUpdateNavigationLayout: d,
    checkActiveIdAndSelect: h,
    toggleShowTab: b,
    hasInHeadClass: p,
    setScrollToSelectedTabFunction: O,
    toolbarVisible: v
  };
}
function Mn(e, t, n, i, l) {
  const {
    activeId: s,
    removeTab: u,
    selectTab: o
  } = l, v = I(() => {
    const b = {
      "st-tab-text": !0,
      "text-truncate": e.tabType === "pill" && !e.autoTitleWidth,
      "farris-title-auto": e.autoTitleWidth
    };
    return He(b, t.customTitleClass);
  }), d = I(() => ({
    "nav-item": !0,
    "d-none": t.show !== void 0 ? !t.show : !1,
    "f-state-active": t.id === s.value,
    "f-state-disabled": t.disabled
  })), p = I(() => ({
    width: `${t.tabWidth}px`
  })), m = I(() => ({
    "nav-link": !0,
    "tabs-text-truncate": !0,
    active: t.id === s.value,
    disabled: t.disabled
  })), w = it({
    content: t.title,
    overflowShown: !0
  });
  function C() {
    return e.tabType !== "pill" && !e.autoTitleWidth ? Ne(a("span", {
      class: v.value,
      "data-tabid": t.id
    }, [t.title]), [[At("tooltip"), w]]) : a("span", {
      class: v.value,
      "data-tabid": t.id,
      title: t.title
    }, [t.title]);
  }
  const h = c(t.removeable);
  function g() {
    return h.value ? a("span", {
      class: "st-drop-close",
      onClick: (b) => u(b, t.id)
    }, [a("i", {
      class: "f-icon f-icon-close"
    }, null)]) : "";
  }
  function y(b) {
    o(t.id), e.tabType === "one-page" && i.scrollToByPaggId(t.id);
  }
  function T() {
    return n.slots.title ? a("a", {
      class: m.value,
      onClick: y,
      id: `${t.id}-design-item`
    }, [n.slots.title(n), g()]) : t.titleRenderFunction ? a("a", {
      class: m.value,
      onClick: y,
      id: `${t.id}-design-item`
    }, [t.titleRenderFunction(), g()]) : a("a", {
      class: m.value,
      onClick: y,
      id: `${t.id}-design-item`
    }, [C(), g()]);
  }
  return a("li", {
    class: d.value,
    style: p.value
  }, [T()]);
}
function On(e, t, n, i, l) {
  const {
    shouldShowNavigationButtons: s
  } = n, {
    tabPages: u
  } = l, o = I(() => ({
    spacer: !0,
    "f-utils-fill": !0,
    "spacer-sides-dropdown": s.value
  })), v = I(() => ({
    width: "100%",
    "justify-content": e.justifyContent
  })), d = I(() => ({
    nav: !0,
    "farris-nav-tabs": !0,
    "flex-nowrap": !0,
    "nav-fill": e.tabType === "fill",
    "nav-pills": e.tabType === "pills",
    "flex-row": e.position === "top" || e.position === "bottom",
    "flex-column": e.position === "left" || e.position === "right"
  }));
  return () => a("div", {
    class: o.value,
    style: v.value
  }, [a("ul", {
    class: d.value,
    ref: t
  }, [u.value.map((p) => Mn(e, p.props, p, i, l))])]);
}
function Pn(e, t, n, i, l) {
  const s = c(), {
    shouldShowNavigationButtons: u
  } = n, {
    activeId: o,
    tabPages: v,
    selectTab: d
  } = l, p = c(o.value), m = I(() => v.value.map((g) => ({
    name: g.props.title,
    value: g.props.id,
    show: g.props.show,
    disabled: g.props.disabled
  }))), w = I(() => ({
    spacer: !0,
    "f-utils-fill": !0,
    "spacer-sides-dropdown": u.value
  })), C = I(() => ({
    width: "100%",
    display: "flex",
    "justify-content": e.justifyContent
  }));
  ee(() => {
    s.value && (t.value = s.value.$el);
  });
  function h(g) {
    d(g);
  }
  return A(() => o.value, (g) => {
    g !== p.value && (p.value = g);
  }, {
    immediate: !0
  }), () => a("div", {
    class: w.value,
    style: C.value
  }, [a(Zt, {
    items: m.value,
    modelValue: p.value,
    "onUpdate:modelValue": (g) => p.value = g,
    onChange: h,
    ref: s
  }, null)]);
}
function Vn(e, t, n, i) {
  const l = c(), {
    activeId: s,
    removeTab: u,
    tabPages: o,
    selectTab: v
  } = i, {
    hideDropDown: d,
    searchTabText: p
  } = t, m = 600;
  let w = null;
  const C = I(() => {
    var S, B;
    let f = [];
    return e.searchBoxVisible ? f = (S = o.value) == null ? void 0 : S.filter((E) => E.props.title.includes(p.value)) : f = (B = o.value) == null ? void 0 : B.slice(), f;
  }), h = I(() => ({
    "dropdown-menu": !0,
    "tabs-pt28": e.searchBoxVisible,
    // 未看到样式定义
    show: !d.value,
    "d-none": d.value
  }));
  let g;
  function y(f) {
    g = f;
  }
  A(d, (f) => {
    if (g.value)
      if (f)
        l.value.style.width = null;
      else {
        const S = g.value.querySelector(".farris-tabs-header"), B = g.value.clientHeight - S.clientHeight - 20, G = S.querySelector(".farris-tabs-title").clientWidth - 20;
        l.value.style.maxWidth = G + "px", l.value.style.maxHeight = B + "px", ne(() => {
          const {
            width: N
          } = l.value.getClientRects()[0];
          l.value.style.width = N ? N + "px" : null;
        });
      }
  });
  function T(f) {
    return {
      "dropdown-item": !0,
      "text-truncate": !0,
      "px-2": !0,
      disabled: f.props.disabled,
      active: f.props.id === s.value,
      "d-none": f.props.show !== !0
    };
  }
  function b(f) {
    f.preventDefault(), f.stopPropagation();
  }
  function V() {
    w && clearTimeout(w);
  }
  function O() {
    d.value || (w = setTimeout(() => {
      d.value = !0;
    }, m));
  }
  function j(f, S) {
    f.stopPropagation(), S.disabled || v(S.id), d.value = !0;
  }
  function P(f, S) {
    f.stopPropagation(), u(f, S, !0);
  }
  function k(f) {
    return f.slots.title ? a("a", {
      class: "dropdown-title",
      id: `${f.props.id}-dropdown-item`
    }, [f.slots.title(f)]) : f.props.titleRenderFunction ? a("a", {
      class: "dropdown-title",
      id: `${f.props.id}-dropdown-item`
    }, [f.props.titleRenderFunction()]) : a("a", {
      class: "dropdown-title",
      id: `${f.props.id}-dropdown-item`
    }, [f.props.title]);
  }
  function r() {
    return a("div", {
      ref: l,
      class: h.value,
      onMouseenter: () => V(),
      onMouseleave: () => O()
    }, [e.searchBoxVisible && a("div", {
      onClick: (f) => b(f),
      class: "pb-1 tabs-li-absolute"
    }, [Ne(a("input", {
      type: "text",
      class: "form-control",
      "onUpdate:modelValue": (f) => p.value = f
    }, null), [[ut, p.value]]), a("span", {
      class: "f-icon f-icon-page-title-query tabs-icon-search"
    }, null)]), C.value.length ? a("ul", {
      class: "tab-dropdown-menu--items flex-fill"
    }, [C.value.map((f) => a("li", {
      class: T(f),
      onClick: (S) => j(S, f.props)
    }, [f.props.removeable && f.props.disabled !== !0 && a("span", {
      class: "float-right st-drop-close",
      onClick: (S) => P(S, f.props.id)
    }, [a("i", {
      class: "f-icon f-icon-close"
    }, null)]), k(f)]))]) : a("div", {
      class: "dropdown-no-data"
    }, [J.getLocaleValue("tabs.noData")])]);
  }
  return {
    renderDropdownMenu: r,
    setTabsRef: y
  };
}
function Rn(e, t, n, i) {
  const {
    hideDropDown: l
  } = t, {
    renderDropdownMenu: s,
    setTabsRef: u
  } = Vn(e, t, n, i), o = c(e.showDropdown);
  function v() {
    return o.value && a(Z, null, [a("button", {
      class: "btn dropdown-toggle-split dropdown-toggle",
      onClick: () => {
        l.value = !1;
      }
    }, null), s()]);
  }
  return {
    renderMorePagesButtton: v,
    setTabsRef: u
  };
}
function Ln(e, t, n, i) {
  const l = c(!1), { selectTab: s, tabPages: u, needUpdateNavigationLayout: o, activeId: v } = i, d = 4, p = I(() => ({
    btn: !0,
    "sc-nav-btn": !0,
    "px-1": !0,
    "sc-nav-lr": !0,
    "d-none": !l.value
  })), m = I(() => ({
    "btn-group": !0,
    "sc-nav-btn": !0,
    dropdown: !0,
    "d-none": !l.value
  })), w = I(() => ({
    btn: !0,
    "sc-nav-rg": !0,
    "d-none": !l.value
  }));
  function C(b, V) {
    if (!t.value)
      return;
    const O = t.value.scrollLeft, j = t.value.scrollWidth - t.value.offsetWidth;
    if (V > 0) {
      if (t.value.scrollLeft >= j)
        return;
      t.value.scrollLeft = O + e.scrollStep + b;
    } else if (V < 0) {
      if (t.value.scrollLeft <= 0)
        return;
      t.value.scrollLeft = O - e.scrollStep - b;
    }
  }
  function h(b = -1) {
    if (!l.value || !t.value)
      return;
    b < 0 && (b = u.value.findIndex((k) => k.props.id === v.value));
    const V = e.tabType === "pills" ? ".f-capsule-item" : ".nav-item", O = t.value.querySelectorAll(V), { parentElement: j } = t.value, P = O[b];
    if (P && j) {
      const k = j.getBoundingClientRect().left, r = j.getBoundingClientRect().right, f = P.getBoundingClientRect().left, S = P.getBoundingClientRect().right;
      f < k ? C(k - f, -1) : r < S && C(S - r, 1), e.tabType === "one-page" && n.scrollTo(b);
    }
  }
  function g() {
    var O;
    if (!t.value)
      return;
    const b = t.value, V = (O = t.value) == null ? void 0 : O.parentElement;
    l.value = V && b && V.offsetWidth < b.scrollWidth - d, l.value && ne(() => {
      h();
    });
  }
  function y(b) {
    b.disabled || s(b.id);
  }
  function T() {
    ["default", "one-page"].indexOf(e.tabType) > -1 && ne(() => {
      h();
    });
  }
  return A(o, () => {
    g();
  }), {
    previousButtonClass: p,
    nextButtonGroupClass: m,
    nextButtonClass: w,
    scrollTab: C,
    selectAndScrollToTab: y,
    shouldShowNavigationButtons: l,
    updateNavigationLayout: g,
    scrollToSelectedTab: T
  };
}
function jn(e, t) {
  const { tabPages: n } = t, i = c(""), l = c(!0), s = I(() => e.searchBoxVisible), u = I(() => s.value ? n.value.filter((v) => v.props.title.includes(i.value)) : n.value.slice());
  return A(l, (o) => {
    o || (i.value = "");
  }), {
    searchTabText: i,
    hideDropDown: l,
    shouldShowSearchBox: s,
    tabsInDropdownMenu: u
  };
}
function En(e, t, n) {
  const i = ".farris-tab-page", { tabPages: l } = n;
  function s(o) {
    const v = t.value;
    if (v) {
      const d = t.value.querySelectorAll(i);
      if (d.length > 0) {
        const p = d[o], { offsetTop: m } = p, w = m - 32 > 0 ? m - 32 : 0;
        v.scrollTop = w;
      }
    }
  }
  function u(o) {
    const v = l.value.findIndex((d) => d.props.id === o);
    v > -1 && s(v);
  }
  return { scrollTo: s, scrollToByPaggId: u };
}
const Le = /* @__PURE__ */ q({
  name: "FTabs",
  props: kn,
  emits: ["tabChange", "tabRemove", "update:activeId", "Click"],
  setup(e, t) {
    const n = c(e.tabType), i = Re(), l = Xe(), s = c(e.customClass), u = Re(), o = Re(), v = c(), d = Fn(e, t, u), {
      activeId: p,
      changeTitleStyle: m,
      tabPages: w,
      addTab: C,
      updateTab: h,
      toolbarItems: g,
      checkActiveIdAndSelect: y,
      toggleShowTab: T,
      hasInHeadClass: b,
      toolbarVisible: V
    } = d, O = En(e, o, d), j = Ln(e, u, O, d), {
      previousButtonClass: P,
      nextButtonClass: k,
      nextButtonGroupClass: r,
      scrollTab: f,
      updateNavigationLayout: S,
      scrollToSelectedTab: B
    } = j;
    d.setScrollToSelectedTabFunction(B);
    const E = jn(e, d), G = On(e, u, j, O, d), N = G, R = Pn(e, u, j, O, d), F = /* @__PURE__ */ new Map([["default", G], ["one-page", N], ["pills", R]]);
    I(() => {
      const _ = w.value.find((te) => te.props.id === p.value);
      return _ == null ? void 0 : _.slots;
    });
    const D = I(() => e.fill), x = (_, te) => {
      t.emit("Click", _, te, p.value);
    };
    Ge("tabs", {
      activeId: p,
      addTab: C,
      updateTab: h,
      tabPages: w,
      tabType: n,
      shouldFillParentContaner: D,
      toggleShowTab: T,
      toolbarVisible: V,
      clickToolbarItemHandler: x
    });
    let L = !1;
    const H = I(() => ({
      "farris-tabs-header": !0,
      "farris-tabs-inHead": b.value,
      "farris-tabs-inContent": !b.value,
      "farris-tabs-nav-fill": e.tabType === "fill",
      "farris-tabs-nav-pills": e.tabType === "pills"
    })), z = I(() => {
      const _ = {
        width: b.value && e.titleWidth ? `${e.titleWidth}%` : ""
      };
      return _.width && (_.flex = "unset"), _;
    }), U = I(() => {
      const _ = {
        "farris-tabs": !0,
        "f-tabs-content-fill": D.value,
        "flex-column": e.position === "top",
        "flex-column-reverse": e.position === "bottom",
        "flex-row": e.position === "left",
        "flex-row-reverse": e.position === "right",
        "one-page": e.tabType === "one-page"
      };
      return s.value && s.value.split(" ").reduce((te, ue) => (te[ue] = !0, te), _), _;
    });
    let ie = null;
    function se() {
      v.value && !L && (!ie && typeof ResizeObserver < "u" && (ie = new ResizeObserver((_) => {
        _.length && S();
      })), ie && (ie.observe(v.value), L = !0));
    }
    A(() => e.visible, (_) => {
      ne(() => {
        w.value.length && y(e.activeId || w.value[0].props.id), S(), m(u), se();
      });
    }), A(() => e.autoTitleWidth, (_) => {
      ne(() => {
        S(), m(u);
      });
    }), ee(() => {
      e.visible && (w.value.length && y(e.activeId || w.value[0].props.id), ne(() => {
        S(), m(u);
      }), se());
    });
    function Te() {
      return a("button", {
        title: J.getLocaleValue("tabs.leftButton"),
        type: "button",
        class: P.value,
        onClick: () => {
          f(0, -1);
        }
      }, null);
    }
    function ye() {
      return a("button", {
        title: J.getLocaleValue("tabs.rightButton"),
        type: "button",
        class: k.value,
        onClick: () => {
          f(0, 1);
        }
      }, null);
    }
    const {
      renderMorePagesButtton: be,
      setTabsRef: Be
    } = Rn(e, E, j, d);
    Be(i);
    function we() {
      return g.value.length ? a("div", {
        class: {
          "farris-tabs-toolbar": !0,
          "d-none": !V.value
        }
      }, [a(Qt, {
        class: "f-utils-fill",
        alignment: b.value ? "right" : "left",
        items: g.value,
        visible: V.value,
        onClick: x
      }, null)]) : null;
    }
    const Ce = F.get(e.tabType) || F.get("default");
    function ke() {
      var _, te, ue, fe;
      return !l && a("div", {
        class: H.value
      }, [a("div", {
        class: "farris-tabs-header-pre"
      }, [(te = (_ = t.slots).headerPrefix) == null ? void 0 : te.call(_)]), a("div", {
        class: "farris-tabs-title scroll-tabs",
        style: z.value,
        ref: v
      }, [Te(), Ce && Ce(), a("div", {
        class: r.value
      }, [ye(), be()])]), we(), a("div", {
        class: "farris-tabs-header-post"
      }, [(fe = (ue = t.slots).headerSuffix) == null ? void 0 : fe.call(ue)])]);
    }
    const Fe = I(() => ({
      "farris-tabs-content": !0,
      "f-utils-fill-flex-column": D.value
    }));
    function Me() {
      var _, te;
      return a("div", {
        class: Fe.value,
        ref: o
      }, [(te = (_ = t.slots).default) == null ? void 0 : te.call(_)]);
    }
    return () => e.visible ? a("div", {
      class: U.value,
      ref: i
    }, [ke(), Me()]) : null;
  }
}), Hn = {
  tabWidth: { type: Number },
  id: { type: String, default: "" },
  customTitleClass: { type: String, default: "" },
  // 暂未被用到
  titleOverflow: { type: Boolean, default: !1 },
  title: { type: String, default: "" },
  // 暂未被用到
  selected: { type: Boolean, default: !1 },
  // 禁用
  disabled: { type: Boolean, default: !1 },
  removeable: { type: Boolean, default: !1 },
  // 是否可见
  show: { type: Boolean, default: !0 },
  // 工具栏
  toolbar: { type: Object, default: {} },
  // 工具栏位置
  toolbarPosition: { type: String, default: "inHead" },
  // 工具栏是否可见
  toolbarVisible: { type: Boolean, default: !0 },
  /** 标题 */
  titleRenderFunction: { type: Function }
};
function at(e) {
  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !ct(e);
}
const Ue = /* @__PURE__ */ q({
  name: "FTabPage",
  props: Hn,
  emits: [],
  setup(e, t) {
    const n = ae("tabs"), i = Xe(), l = c(e.show), s = {
      slots: t.slots,
      props: e
    }, u = c((n == null ? void 0 : n.tabType.value) || "default");
    ee(() => {
      const y = n == null ? void 0 : n.tabPages.value.findIndex((T) => T.props.id === e.id);
      (!y || y === -1) && (n == null || n.addTab(s));
    }), Ie(() => {
    });
    const o = I(() => (e == null ? void 0 : e.id) === (n == null ? void 0 : n.activeId.value)), v = I(() => ({
      display: o.value ? "" : "none"
    }));
    A(() => e, (y) => {
      n == null || n.updateTab({
        props: y,
        slots: t.slots
      });
    }, {
      immediate: !0,
      deep: !0
    }), A(() => e.show, (y) => {
      l.value = y, n == null || n.toggleShowTab(e.id);
    }), A(() => e.toolbarVisible, (y) => {
      o.value && n && (n.toolbarVisible.value = y);
    });
    function d() {
      var T, b;
      const y = (b = (T = t.slots).default) == null ? void 0 : b.call(T);
      return a(nt, {
        "main-title": e.title,
        class: ["farris-tab-page", l.value ? "" : "f-tab-d-none"]
      }, at(y) ? y : {
        default: () => [y]
      });
    }
    function p(y, T) {
      n && (n.activeId.value = e.id, n.clickToolbarItemHandler && n.clickToolbarItemHandler(y, T));
    }
    function m() {
      var T, b;
      const y = (b = (T = t.slots).default) == null ? void 0 : b.call(T);
      return a(nt, {
        customClass: "section-in-tab is-mobile",
        onClick: p,
        visible: e.show,
        "main-title": e.title,
        buttons: e.toolbar.buttons,
        "button-position": e.toolbar.position || e.toolbarPosition,
        "buttons-visible": e.toolbarVisible
      }, at(y) ? y : {
        default: () => [y]
      });
    }
    const w = I(() => {
      var T;
      return {
        "farris-tab-page": !0,
        "f-tab-d-none": !l.value,
        "f-tab-active": o.value && n && ((T = n.shouldFillParentContaner) == null ? void 0 : T.value)
      };
    });
    function C() {
      var T, b;
      const y = (b = (T = t.slots).default) == null ? void 0 : b.call(T);
      return a("div", {
        class: w.value,
        style: v.value
      }, [y]);
    }
    const g = i ? m : (/* @__PURE__ */ new Map([["default", C], ["one-page", d], ["mobile", m]])).get(u.value) || C;
    return () => g();
  }
});
Le.install = (e) => {
  e.component(Le.name, Le), e.component(Ue.name, Ue);
};
const Dn = /* @__PURE__ */ new Map([
  ["appearance", vt]
]), Nn = "https://json-schema.org/draft/2020-12/schema", zn = "https://farris-design.gitee.io/search-box.schema.json", An = "search-box", $n = "A Farris Component", Wn = "object", _n = {
  id: {
    description: "The unique identifier for a search-box",
    type: "string"
  },
  type: {
    description: "The type string of search-box component",
    type: "string",
    default: "search-box"
  },
  appearance: {
    description: "",
    type: "object",
    properties: {
      class: {
        type: "string"
      },
      style: {
        type: "string"
      }
    },
    default: {}
  },
  binding: {
    description: "",
    type: "object",
    default: {}
  },
  disable: {
    type: "string",
    default: !1
  },
  editable: {
    description: "",
    type: "boolean",
    default: !0
  },
  placeholder: {
    description: "",
    type: "string",
    default: ""
  },
  readonly: {
    description: "",
    type: "boolean",
    default: !1
  },
  require: {
    description: "",
    type: "boolean",
    default: !1
  },
  tabindex: {
    description: "",
    type: "number",
    default: -1
  },
  visible: {
    description: "",
    type: "boolean",
    default: !0
  }
}, Gn = [
  "id",
  "type"
], Un = {
  $schema: Nn,
  $id: zn,
  title: An,
  description: $n,
  type: Wn,
  properties: _n,
  required: Gn
};
function qn(e, t, n) {
  return t;
}
const Xn = "search-box", Yn = "A Farris Component", Kn = "object", Jn = {
  basic: {
    description: "Basic Infomation",
    title: "基本信息",
    properties: {
      id: {
        description: "组件标识",
        title: "标识",
        type: "string",
        readonly: !0
      },
      type: {
        description: "组件类型",
        title: "控件类型",
        type: "select",
        editor: {
          type: "waiting for modification",
          enum: []
        }
      }
    }
  }
}, Zn = {
  title: Xn,
  description: Yn,
  type: Kn,
  categories: Jn
}, Je = {
  /**
   * 自定义图标
   */
  buttonContent: { type: String, default: '<i class="f-icon f-icon-search"></i>' },
  /** 自定义样式 */
  customClass: { type: String, default: "" },
  /** 组件初始搜索值 */
  modelValue: { type: String, default: "" },
  popupHost: { type: Object },
  /** */
  popupRightBoundary: { type: Object },
  popupOffsetX: { type: Object },
  /** 搜索框数据 */
  data: { type: Array, default: [] },
  placeholder: { type: String, default: "请输入关键词" },
  /**
  * 可选，数据源id字段
  * 默认为`id`
  */
  idField: { default: "id", type: String },
  /**
  * 可选，数据源的title
  * 默认为`name`
  */
  textField: { default: "name", type: String },
  /**
  * 可选，最大高度
  * 默认`350`
  */
  maxHeight: { default: 350, type: Number },
  /**
   * 是否处于加载状态
   */
  loading: { default: !1, type: Boolean },
  /**
   * 是否处于只读状态
   */
  disable: { default: !1, type: Boolean },
  /**
   * 是否展示搜索结果面板
   */
  showDropdown: { default: !0, type: Boolean },
  /**
   * popupOnFoucs TODO
   */
  /**
   * 值变化事件触发时机
   */
  updateOn: { default: "change", type: String }
}, mt = Ye(Je, Un, Dn, qn, Zn), Qn = {
  data: { type: Array, default: [] },
  /** 确认结果事件 */
  onConfirmResult: { type: Function, default: () => {
  } },
  /** 搜索点击后返回值 */
  onSearchedValue: { type: Function, default: () => {
  } },
  /**
  * 可选，数据源id字段
  * 默认为`id`
  */
  idField: { default: "id", type: String },
  /**
  * 可选，数据源的title
  * 默认为`name`
  */
  textField: { default: "name", type: String },
  /**
  * 可选，最大高度
  * 默认`350`
  */
  maxHeight: { default: 350, type: Number },
  loading: { default: !1, type: Boolean }
}, gt = /* @__PURE__ */ q({
  name: "FSearchBoxContainer",
  props: Qn,
  emits: ["confirmResult", "searchedValue"],
  setup(e, t) {
    const n = c(e.data), i = c(), {
      slots: l
    } = t, s = I(() => ({
      "search-box-container": !0,
      "f-utils-overflow-xhya": !0,
      "position-relative": !0
    }));
    function u(p) {
      var m;
      (m = i.value) == null || m.search(p);
    }
    function o(p) {
      p.length && (t.emit("confirmResult", p[0][e.textField]), t.emit("searchedValue", p));
    }
    function v(p) {
      return l.default ? a(Z, null, [l.default(p)]) : a("span", null, [p.item[e.textField]]);
    }
    const d = I(() => {
      const p = {};
      return p.padding = "8px", e.maxHeight !== void 0 && e.maxHeight > 0 && (p.maxHeight = `${e.maxHeight}px`), p;
    });
    return A(() => e.loading, (p) => {
    }), A(() => e.data, (p) => {
      p !== n.value && (n.value = p), i.value.updateDataSource(p);
    }), t.expose({
      search: u
    }), () => {
      const p = {
        content: v
      };
      return a("div", {
        class: s.value,
        style: d.value
      }, [a(nn, {
        ref: "loadingInstance",
        isActive: e.loading
      }, null), a(tn, {
        ref: i,
        itemClass: "dropdown-item",
        data: n.value,
        view: "ContentView",
        onClickItem: (m) => o(m.data),
        idField: e.idField,
        textField: e.textField,
        titleField: e.textField,
        valueField: e.idField
      }, p)]);
    };
  }
}), re = /* @__PURE__ */ q({
  name: "FSearchBox",
  props: Je,
  emits: ["update:modelValue", "change", "selectedValue", "clickButton"],
  setup(e, t) {
    c(e.data);
    const n = c(), i = c(), l = c(e.placeholder), s = '<i class="f-icon f-icon-clockwise f-icon-spin"></i>', u = I(() => e.loading ? s : e.buttonContent);
    c(e.editable);
    const o = c(e.modelValue);
    A(o, (g) => {
      var y;
      (y = i.value) == null || y.search(g), t.emit("update:modelValue", g);
    }), A(() => e.modelValue, (g) => {
      o.value = g;
    });
    function v(g) {
      n.value.commitValue(g);
    }
    function d(g) {
      const y = o.value;
      t.emit("change", g, {
        oldValue: y,
        newValue: g
      });
    }
    function p(g) {
      t.emit("selectedValue", g);
    }
    function m(g) {
      t.emit("clickButton", g);
    }
    function w() {
      var g;
      (g = n.value) == null || g.togglePopup();
    }
    function C() {
      var g;
      (g = n.value) == null || g.hidePopup();
    }
    function h() {
      var g;
      (g = n.value) == null || g.showPopup();
    }
    return t.expose({
      togglePopup: w,
      hidePopup: C,
      showPopup: h
    }), () => {
      const g = {
        default: t.slots.default
      };
      return a(en, {
        ref: n,
        "button-content": u.value,
        "custom-class": e.customClass,
        updateOn: e.updateOn,
        placeholder: l.value,
        onChange: (y) => d(y),
        onClickButton: (y) => m(y),
        disable: e.disable,
        "enable-clear": !0,
        "button-behavior": "Execute",
        modelValue: o.value,
        "onUpdate:modelValue": (y) => o.value = y,
        "popup-host": e.popupHost,
        "popup-right-boundary": e.popupRightBoundary,
        "popup-offset-x": e.popupOffsetX,
        "popup-on-input": e.showDropdown,
        "popup-on-focus": e.showDropdown,
        limitContentBySpace: !0,
        placement: "auto"
      }, {
        default: () => [e.showDropdown && a(gt, {
          ref: i,
          data: e.data,
          idField: e.idField,
          textField: e.textField,
          onConfirmResult: v,
          onSearchedValue: (y) => p(y),
          loading: e.loading,
          maxHeight: e.maxHeight
        }, g)],
        ...t.slots
      });
    };
  }
}), ea = /* @__PURE__ */ q({
  name: "FSearchBoxDesign",
  props: Je,
  emits: ["update:modelValue", "change"],
  setup(e, t) {
    const n = c(e.data), i = c(), l = c(), s = c("请输入关键词"), u = c('<i class="f-icon f-icon-search"></i>'), o = c(e.modelValue), v = c(), d = ae("design-item-context"), p = pt(v, d);
    ee(() => {
      v.value.componentInstance = p;
    }), t.expose(p.value), A(o, (C) => {
      var h;
      (h = l.value) == null || h.search(C), t.emit("update:modelValue", C);
    }), A(() => e.modelValue, (C) => {
      o.value = C;
    });
    function m(C) {
      i.value.commitValue(C);
    }
    function w(C) {
      t.emit("change", C);
    }
    return () => a("div", {
      ref: v
    }, [a($t("f-button-edit"), {
      ref: i,
      "button-content": u.value,
      placeholder: s.value,
      onChange: w,
      "enable-clear": !0,
      "button-behavior": "Execute",
      modelValue: o.value,
      "onUpdate:modelValue": (C) => o.value = C,
      "popup-host": e.popupHost,
      "popup-right-boundary": e.popupRightBoundary,
      "popup-offset-x": e.popupOffsetX,
      "popup-on-input": !0,
      "popup-on-focus": !0
    }, {
      default: () => [a(gt, {
        ref: l,
        data: n.value,
        onConfirmResult: m
      }, null)]
    })]);
  }
});
re.install = (e) => {
  e.component(re.name, re);
};
re.register = (e, t, n, i) => {
  e["search-box"] = re, t["search-box"] = mt;
};
re.registerDesigner = (e, t, n) => {
  e["search-box"] = ea, t["search-box"] = mt;
};
const ht = {
  /** 列集合 */
  columns: {
    type: Array,
    default: [
      { field: "name", title: "", dataType: "string" }
    ]
  },
  customClass: { type: String, default: "" },
  data: { type: Array, default: [] },
  draggable: { type: Boolean, default: !1 },
  multiSelect: { type: Boolean, default: !1 },
  // multiSelectMode: { type: String as PropType<MultiSelectMode>, default: 'OnCheck' },
  idField: { type: String, default: "id" },
  valueField: { type: String, default: "id" },
  textField: { type: String, default: "name" },
  titleField: { type: String, default: "name" },
  view: { type: String, default: "ContentView" },
  size: { type: String, default: "default" },
  placeholder: { type: String, default: "" },
  header: { type: String, default: "ContentHeader" },
  headerClass: { type: String, default: "" },
  /** 可能根据数据每各项的样式不同 */
  itemClass: {
    type: [String, Function],
    default: "",
    validator: (e) => typeof e == "string" || typeof e == "function"
  },
  itemStyle: {
    type: [String, Function],
    default: "",
    validator: (e) => typeof e == "string" || typeof e == "function"
  },
  itemContentClass: { type: String, default: "" },
  selectionValues: { type: Array, default: [] },
  /** 分组配置 */
  group: { type: Object },
  /** 选择配置 */
  selection: {
    type: Object,
    default: {
      enableSelectRow: !0,
      multiSelect: !1,
      multiSelectMode: "DependOnCheck",
      showCheckbox: !1,
      showSelectAll: !1,
      showSelection: !0
    }
  },
  keepOrder: { type: Boolean, default: !1 },
  disableField: { type: String, default: "disabled" },
  // 搜索启用高亮
  enableHighlightSearch: { type: Boolean, default: !0 },
  /** 虚拟化渲染数据 */
  virtualized: { type: Boolean, default: !0 },
  /** 删除数据前的检查方法，返回值为true时可以删除当前数据 */
  checkBeforeRemoveItem: { type: Function, default: null },
  /** 头部模板 */
  headerTemplate: { type: Object },
  /** 内容模板 */
  contentTemplate: { type: Object },
  /** 底部模板 */
  footerTemplate: { type: Object },
  /** 空数据模板 */
  emptyTemplate: { type: Object },
  /** 分页 */
  pagination: { type: Object, default: { enable: !1, size: 20 } },
  /** 定义属性，开启时，当多选开启时，展示选中项的背景色等样式；不开启时，不展示选中项的背景色等样式 */
  showActiveWhenMultiSelect: { type: Boolean, default: !0 },
  /** 允许删除 */
  allowDelete: { type: Boolean, default: !0 }
};
function ta(e, t) {
  function n(s) {
    const u = [];
    let o = s.nextNode();
    for (; o; )
      u.push(o), o = s.nextNode();
    return u;
  }
  function i(s, u) {
    const o = document.createTreeWalker(s, NodeFilter.SHOW_TEXT);
    return n(o).map((m) => ({ textNode: m, text: (m.textContent || "").toLocaleLowerCase() })).map(({ textNode: m, text: w }) => {
      const C = [];
      let h = 0;
      for (; h < w.length; ) {
        const g = w.indexOf(u, h);
        if (g === -1)
          break;
        C.push(g), h = g + u.length;
      }
      return C.map((g) => {
        const y = new Range();
        return y.setStart(m, g), y.setEnd(m, g + u.length), y;
      });
    }).flat();
  }
  function l(s) {
    if (!CSS.highlights || (CSS.highlights.clear(), !s || !t))
      return;
    const u = i(t.value, s.toLocaleLowerCase()), o = new Highlight(...u);
    CSS.highlights.set("search-result", o);
  }
  return { search: l };
}
function lt(e, t, n, i, l, s, u, o, v, d) {
  const p = c(e.size), m = c(e.textField), w = c(e.titleField), C = c(e.disableField), h = I(() => {
    var f, S;
    return ((f = e.selection) == null ? void 0 : f.multiSelect) && ((S = e.selection) == null ? void 0 : S.showCheckbox);
  }), {
    onMouseenterItem: g,
    onMouseoverItem: y,
    onMouseoutItem: T
  } = s, {
    getKey: b,
    listViewItemClass: V,
    listViewItemStyle: O,
    onCheckItem: j,
    onClickItem: P
  } = u, k = I(() => {
    const f = {
      "text-overflow": "ellipsis",
      overflow: "hidden",
      "white-space": "nowrap"
    };
    return e.itemClass ? f : {
      margin: p.value === "small" ? "0.25rem 0" : "8px 0",
      ...f
    };
  });
  function r(f, S, B) {
    return f.checked = o.findIndexInSelectedItems(f) > -1, a("li", {
      class: V(f, S),
      id: b(f, S),
      key: b(f, S),
      style: O(f, S),
      onClick: (E) => P(f, S, E),
      onMouseenter: (E) => g(E, f, S),
      onMouseover: (E) => y(E, f, S),
      onMouseout: (E) => T(E, f, S)
    }, [h.value && a("div", {
      class: "f-list-select",
      onClick: (E) => E.stopPropagation()
    }, [a(Ke, {
      id: "list-" + b(f, S),
      customClass: "listview-checkbox float-left",
      disabled: f[C.value],
      checked: f.checked,
      "onUpdate:checked": (E) => f.checked = E,
      onChange: (E) => {
        j(f, S, !E.checked);
      }
    }, null)]), a("div", {
      class: "f-list-content"
    }, [a("div", {
      class: e.itemContentClass,
      style: k.value,
      title: f.raw[w.value] || f.raw[m.value]
    }, [f.raw[m.value]])])]);
  }
  return {
    renderItem: r
  };
}
function na(e, t, n, i, l, s, u, o, v, d) {
  const p = c(e.multiSelect), m = c(e.disableField), w = c(e.textField), {
    onMouseenterItem: C,
    onMouseoverItem: h,
    onMouseoutItem: g
  } = s, {
    getKey: y,
    listViewItemClass: T,
    listViewItemStyle: b,
    onCheckItem: V,
    onClickItem: O,
    updateSelectedItems: j
  } = u;
  function P(r, f, S) {
    return e.contentTemplate ? a(Z, null, [e.contentTemplate({
      item: r.raw,
      index: f,
      selectedItem: S
    })]) : t.slots.content ? a(Z, null, [t.slots.content && t.slots.content({
      item: r.raw,
      index: f,
      selectedItem: S
    })]) : a("div", {
      style: "margin: 10px 0;"
    }, [r.raw[w.value || "name"]]);
  }
  function k(r, f, S) {
    return a("li", {
      class: T(r, f),
      id: y(r, f),
      key: y(r, f),
      style: b(r, f),
      onClick: (B) => O(r, f, B),
      onMouseenter: (B) => C(B, r, f),
      onMouseover: (B) => h(B, r, f),
      onMouseout: (B) => g(B, r, f)
    }, [p.value && a("div", {
      class: "f-list-select",
      onClick: (B) => B.stopPropagation()
    }, [a(Ke, {
      id: "list-" + y(r, f),
      customClass: "listview-checkbox",
      disabled: r[m.value],
      checked: r.checked,
      "onUpdate:checked": (B) => r.checked = B,
      onChange: (B) => {
        V(r, f, !B.checked), j();
      }
    }, null)]), a("div", {
      class: "f-list-content"
    }, [P(r, f, S)])]);
  }
  return {
    renderItem: k
  };
}
function aa(e, t, n, i, l, s, u, o, v, d) {
  const p = c(e.multiSelect), m = c(e.disableField), w = c(e.textField), {
    onMouseenterItem: C,
    onMouseoverItem: h,
    onMouseoutItem: g
  } = s, {
    getKey: y,
    listViewItemClass: T,
    onCheckItem: b,
    onClickItem: V
  } = u, {
    dragstart: O,
    dragenter: j,
    dragover: P,
    dragend: k
  } = i, {
    removeItem: r
  } = v, f = I(() => ({
    margin: p.value ? "10px 0" : "10px 0px 10px 14px"
  }));
  function S(R, F = "") {
    const D = R.target;
    D.title = D.scrollWidth > D.clientWidth ? F : "";
  }
  function B(R) {
    return a("div", {
      style: f.value,
      onMouseenter: (F) => S(F, R.raw[w.value || "name"])
    }, [R.raw[w.value || "name"]]);
  }
  function E() {
    return t.slots.itemContent ? t.slots.itemContent : B;
  }
  const G = E();
  function N(R, F, D) {
    return a("li", {
      class: T(R, F),
      id: y(R, F),
      key: y(R, F),
      onClick: (x) => V(R, F, x),
      onMouseenter: (x) => C(x, R, F),
      onMouseover: (x) => h(x, R, F),
      onMouseout: (x) => g(x, R, F),
      draggable: "true",
      onDragstart: (x) => O(x, R, F),
      onDragenter: (x) => j(x, F),
      onDragend: (x) => k(x, R),
      onDragover: (x) => P(x)
    }, [p.value && a("div", {
      class: "f-list-select",
      onClick: (x) => x.stopPropagation()
    }, [a(Ke, {
      id: "list-" + y(R, F),
      customClass: "listview-checkbox",
      disabled: R[m.value],
      checked: R.checked,
      "onUpdate:checked": (x) => R.checked = x,
      onChange: (x) => b(R, F, !x.checked)
    }, null)]), a("div", {
      class: "f-list-content"
    }, [G(R)]), e.allowDelete && a("div", {
      class: "f-list-remove",
      onClick: (x) => {
        x.stopPropagation(), r(F);
      }
    }, [a("div", {
      class: "f-list-remove-icon"
    }, [a("i", {
      class: "f-icon f-icon-remove_face"
    }, null)])]), a("div", {
      class: "f-list-handle"
    }, [a("div", null, [a("i", {
      class: "f-icon f-icon-drag-vertical"
    }, null)])])]);
  }
  return {
    renderItem: N
  };
}
function la(e, t, n, i, l, s, u, o, v, d) {
  var y;
  const p = c(((y = e.group) == null ? void 0 : y.groupFields) || []), {
    collpaseGroupIconClass: m
  } = l, {
    toggleGroupRow: w
  } = d;
  function C(T, b) {
    T.stopPropagation(), b.collapse = !b.collapse, n.value = w(b.collapse ? "collapse" : "expand", b, n.value);
  }
  function h(T, b, V) {
    return t.slots.group ? a(Z, null, [t.slots.content && t.slots.group({
      item: T.raw,
      index: b,
      selectedItem: V
    })]) : a("div", {
      class: "f-navlookup-recentHeader",
      onClick: (O) => C(O, T)
    }, [a("div", {
      class: "fv-grid-group-row-icon"
    }, [a("span", {
      class: m(T)
    }, null)]), a("div", {
      class: "f-navlookup-recommandLabel"
    }, [T.raw[p.value[T.layer]]])]);
  }
  function g(T, b, V) {
    return T.layer > -1 && h(T, b, V);
  }
  return {
    renderItem: g
  };
}
function oa(e, t, n, i) {
  const { dataView: l } = n, { updateSelectedItems: s } = i;
  function u(o) {
    if (o > -1 && o < l.value.length) {
      if (e != null && e.checkBeforeRemoveItem && !e.checkBeforeRemoveItem(l.value[o]))
        return;
      const v = l.value.splice(o, 1);
      s(), t.emit("removeItem", v[0]);
    }
  }
  return { removeItem: u };
}
function sa(e, t, n, i, l, s, u, o, v, d) {
  const p = c(e.view), m = c(e.view === "CardView"), w = c({}), C = oa(e, t, i, v), h = I(() => ({
    "f-list-view-group": !0,
    "f-list-view-group-multiselect": e.multiSelect,
    "d-flex": m.value,
    "flex-wrap": m.value
  })), g = I(() => !!n.value && n.value.length > 0), y = I(() => n.value.length === 0);
  I(() => y.value && !t.slots.empty);
  function T() {
    return p.value === "SingleView" ? lt : p.value === "DraggableView" ? aa : (p.value === "ContentView" || p.value === "CardView") && (e.contentTemplate || t.slots.content) ? na : lt;
  }
  const b = T(), {
    renderItem: V
  } = b(e, t, n, d, l, s, v, u, C, o), {
    renderItem: O
  } = la(e, t, n, d, l, s, v, u, C, o), j = [V, O];
  function P() {
    return n.value.filter((f) => f.visible !== !1).map((f, S) => j[f.type](f, S, w));
  }
  function k() {
    return a("div", {
      class: "f-list-view-emptydata",
      style: "margin: 0 auto;"
    }, [a("p", {
      class: "f-empty-title"
    }, [e.emptyTemplate ? e.emptyTemplate() : t.slots.empty ? t.slots.empty() : J.getLocaleValue("listView.emptyMessage")])]);
  }
  function r() {
    return a("ul", {
      class: h.value,
      style: "list-style: none;"
    }, [g.value && P(), y.value && k()]);
  }
  return {
    renderListArea: r
  };
}
function ia(e, t, n) {
  function i() {
    return t.slots.header && a("div", {
      class: "f-list-view-header"
    }, [t.slots.header()]);
  }
  return {
    renderHeader: i
  };
}
function ot(e, t, n) {
  const i = c(e.headerClass), l = c(e.placeholder), s = c(""), u = I(() => !s.value), o = I(() => !!s.value);
  function v(w) {
    s.value = "";
  }
  A(s, (w) => {
    e.enableHighlightSearch && n.search(w), t.emit("afterSearch", w);
  });
  const d = I(() => {
    const w = {
      "form-group": !0,
      "farris-form-group": !0
    };
    return i.value && i.value.split(" ").reduce((h, g) => (h[g] = !0, h), w), w;
  });
  function p(w) {
  }
  function m() {
    return a("div", {
      class: "f-list-view-header",
      onClick: Wt(() => p, ["prevent", "stop"])
    }, [a("div", {
      class: d.value
    }, [a("div", {
      class: "farris-input-wrap"
    }, [a("div", {
      class: "f-cmp-inputgroup"
    }, [a("div", {
      class: "input-group f-state-editable"
    }, [Ne(a("input", {
      class: "form-control f-utils-fill text-left",
      "onUpdate:modelValue": (w) => s.value = w,
      name: "input-group-value",
      type: "text",
      placeholder: l.value,
      autocomplete: "off"
    }, null), [[ut, s.value]]), a("div", {
      class: "input-group-append"
    }, [o.value && a("span", {
      class: "input-group-text input-group-clear",
      onClick: (w) => v()
    }, [a("i", {
      class: "f-icon f-icon-close-circle"
    }, null)]), u.value && a("span", {
      class: "input-group-text"
    }, [a("span", {
      class: "f-icon f-icon-search"
    }, null)])])])])])])]);
  }
  return {
    renderHeader: m
  };
}
function ua() {
  const e = c(""), t = c(-1), n = c(""), i = c(-1), l = c(!1);
  function s(m, w, C) {
    i.value = C;
  }
  function u(m, w, C) {
    l.value || (i.value = C);
  }
  function o(m, w, C) {
    i.value = -1;
  }
  function v() {
    l.value = !0;
  }
  function d() {
    l.value = !1;
  }
  function p() {
    t.value = -1, e.value = "";
  }
  return {
    activeIndex: t,
    focusedItemId: n,
    hoverIndex: i,
    clearActiveItem: p,
    onMouseenterItem: s,
    onMouseoverItem: u,
    onMouseoutItem: o,
    resumeHover: d,
    suspendHover: v
  };
}
function ca(e, t, n, i, l) {
  const s = c(e.idField), { dataView: u } = n, o = c(-1), v = c(!1), { activeIndex: d, focusedItemId: p, hoverIndex: m, resumeHover: w, suspendHover: C } = i;
  let h, g = 0, y = 0, T = null, b = null;
  const V = 10, O = 50;
  function j(R) {
    if (!R)
      return null;
    const { overflowY: F } = getComputedStyle(R);
    return F === "auto" || F === "scroll" ? R : j(R.parentElement);
  }
  function P(R, F) {
    b && clearInterval(b), b = window.setInterval(() => {
      F === "up" ? R.scrollTop -= V : R.scrollTop += V;
    }, 16);
  }
  function k() {
    b && (clearInterval(b), b = null);
  }
  function r(R) {
    const F = R.target;
    if (T || (T = j(F)), !T) {
      k();
      return;
    }
    const D = T.getBoundingClientRect(), x = R.clientY, L = x - D.top, H = D.bottom - x;
    L < O && T.scrollTop > 0 ? P(T, "up") : H < O && T.scrollTop < T.scrollHeight - T.clientHeight ? P(T, "down") : k();
  }
  function f(R, F) {
    const D = R - g, x = F - y;
    h.style.left = parseInt(h.style.left) + D + "px", h.style.top = parseInt(h.style.top) + x + "px", g = R, y = F;
  }
  function S(R) {
    const { left: F, top: D } = R.getBoundingClientRect(), x = R.cloneNode(!0);
    return x.className = x.className + " f-listview-drag-moving", x.style.cssText = `
        position:absolute;
        left:${F}px;
        top:${document.documentElement.scrollTop ? D + document.documentElement.scrollTop : D}px;
        z-index: 999999;
        pointer-events: none;
        border-radius: 10px;
        margin: 4px 2px;    
        display: flex;
        align-items: center;
        float: none;
        text-align: initial;
        width:${getComputedStyle(R).width};
        height:${getComputedStyle(R).height};
        `, x.children[0].style.cssText = "padding: 0 0 0 14px", x.children[0].children[0].style.cssText = `
        margin: 10px 0px 10px 14px;
        overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
        `, x.children[1].style.cssText = "flex:1 1 auto; width:100%", x.children[2].style.cssText = "padding: 0 14px 0 0", x.children[2].children[0].style.cssText = "display: initial", document.body.appendChild(x), x;
  }
  function B(R, F, D) {
    if (R.stopPropagation(), C(), F) {
      if (h = S(R.target), R.dataTransfer) {
        const x = new Image();
        x.src = "", R.dataTransfer.setDragImage(x, 0, 0);
      }
      g = R.pageX, y = R.pageY, setTimeout(() => {
        o.value = D, v.value = !0, F.moving = !0;
      });
    }
  }
  function E(R, F) {
    if (R.preventDefault(), o.value !== F && o.value !== -1) {
      const D = u.value[o.value], x = l.value[o.value];
      D && x && (u.value.splice(o.value, 1), u.value.splice(F, 0, D), l.value.splice(o.value, 1), l.value.splice(F, 0, x), l.value.forEach((L, H) => {
        L.index = H, L.raw.__fv_index__ = H;
      }), o.value = F, f(R.pageX, R.pageY));
    }
  }
  function G(R) {
    R.preventDefault(), R.dataTransfer && (R.dataTransfer.dropEffect = "move"), f(R.pageX, R.pageY), r(