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

Farris Vue, a Farris Design based Vue3 component library.

var Ut = Object.defineProperty;
var qt = (e, t, n) => t in e ? Ut(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
var ie = (e, t, n) => qt(e, typeof t != "symbol" ? t + "" : t, n);
import { ref as c, computed as T, watch as z, nextTick as te, reactive as ct, createVNode as a, withDirectives as Ne, resolveDirective as Yt, onMounted as ne, vModelText as rt, Fragment as Q, defineComponent as Y, shallowRef as Re, provide as Ue, inject as ae, onUnmounted as xe, isVNode as dt, resolveComponent as Xt, withModifiers as Kt, createTextVNode as K, watchEffect as ft, createApp as ze, Transition as vt, mergeProps as Pe, Teleport as mt, onBeforeMount as Jt, render as _e, h as Zt, cloneVNode as Qt, vShow as en, onUpdated as tn, onBeforeUnmount as nn } from "vue";
import { FNotifyService as an } from "../notify/index.esm.js";
import { getCustomClass as De, isMobilePhone as we, getCustomStyle as nt, withInstall as ln, getMaxZIndex as at, useGuid as on } from "../common/index.esm.js";
import sn from "../capsule/index.esm.js";
import { LocaleService as Z } from "../locale/index.esm.js";
import un from "../response-toolbar/index.esm.js";
import "bignumber.js";
import { cloneDeep as cn, debounce as pt } from "lodash-es";
import lt from "../section/index.esm.js";
import "../property-panel/index.esm.js";
import rn from "../button-edit/index.esm.js";
import { resolveAppearance as gt, createPropsResolver as Xe } from "../dynamic-resolver/index.esm.js";
import dn from "../list-view/index.esm.js";
import fn from "../loading/index.esm.js";
import { useDesignerComponent as ht } from "../designer-canvas/index.esm.js";
import { useFilter as vn, useIdentify as mn, useHierarchy as pn, useGroupData as gn, useDataView as hn, useSelection as yn, usePagination as bn, useRow as wn, useEdit as Cn, useVisualDataBound as xn, useVisualDataCell as Sn, useVisualDataRow as In, useVisualGroupRow as Tn, useVisualSummaryRow as Bn, useVisualData as kn, useSidebar as Fn, useColumn as Mn, useVirtualScroll as On, useScreen as Pn } from "../data-view/index.esm.js";
import { FCheckbox as Ke } from "../checkbox/index.esm.js";
import yt from "../popover/index.esm.js";
import "../button/index.esm.js";
import "../field-selector/index.esm.js";
import "../collection-property-editor/index.esm.js/src/use-button-items.designer";
import Vn from "../tags/index.esm.js";
import { useInputExpand as Rn } from "../common/index.esm.js/text-box/use-input-expand";
import Ln from "../drawer/index.esm.js";
const Hn = {
  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 }
}, En = {
  /** 标签页头部区域的展示类型 */
  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 },
  showHeader: { type: Boolean, default: !0 },
  /** 标签页选中前事件 */
  beforeTabSelect: { type: Function, default: null }
};
function Dn(e, t, n) {
  const u = new an(), l = c([]), o = c(e.activeId || "");
  let i = "";
  const s = c(!0), v = c([]), f = c(!0), r = c(0), p = T(() => {
    const b = l.value.find((P) => P.props.id === o.value);
    return (b == null ? void 0 : b.props.toolbarPosition) === "inHead";
  });
  let x;
  function S(b) {
    x = b;
  }
  function y(b, I = !0) {
    const P = b.findIndex((j) => j.props.show !== !1 && !j.props.disabled);
    if (P !== -1) {
      if (o.value = b[P].props.id, !I)
        return;
      v.value = [];
      const j = b[P];
      j && j.props.toolbar && j.props.toolbar.buttons && j.props.toolbar.buttons.length && (v.value = [...j.props.toolbar.buttons], f.value = j.props.toolbarVisible);
    }
  }
  function d(b) {
    o.value = b;
    const I = l.value.find((P) => P.props.id === b);
    v.value = [], I && I.props.toolbar && I.props.toolbar.buttons && I.props.toolbar.buttons.length && (v.value = [...I.props.toolbar.buttons], f.value = I.props.toolbarVisible), t.emit("update:activeId", b), t.emit("tabChange", {
      prevId: i,
      nextId: o.value
    });
  }
  async function w(b, I, P, j) {
    var R;
    const W = await ((R = e.beforeTabSelect) == null ? void 0 : R.call(e, {
      prevId: b,
      nextId: I
    }));
    (typeof W == "boolean" ? W : (W == null ? void 0 : W.canSelect) ?? !0) ? P && P() : (j && j(), typeof W != "boolean" && W.message && (u == null || u.warning({ message: W.message, position: "top-center" })));
  }
  function B(b) {
    let I = -1;
    if (!o.value) {
      if (I = b.findIndex((P) => o.value === P.props.id && P.props.show !== !1 && !P.props.disabled), I > -1)
        return;
      i = o.value;
    }
    y(b, !1), w(i, o.value, () => {
      d(o.value), x && x();
    }, () => {
      o.value = i;
    });
  }
  function C(b) {
    let I = !1;
    if (b) {
      const P = l.value.find((j) => j.props.id === b);
      I = !P || P.props.show === !1 || P.props.disabled === !0;
    }
    if (I)
      B(l.value);
    else if (o.value !== b) {
      const P = o.value;
      w(P, b, () => {
        i = P, o.value = b, d(o.value), x && x();
      }, () => {
        o.value = P, t.emit("update:activeId", P);
      });
    } else
      d(o.value);
  }
  z(() => e.activeId, (b, I) => {
    b !== I && e.activeId !== o.value && C(b);
  });
  function L(b) {
    var P;
    if (e.autoTitleWidth)
      return;
    const I = (P = b.value) == null ? void 0 : P.querySelectorAll(".st-tab-text");
    if (!(!I || e.tabType === "pill"))
      for (let j = 0; j < I.length; j++) {
        const W = I[j].parentNode;
        I[j].scrollWidth > W.offsetWidth ? I[j].classList.contains("farris-title-text-custom") || I[j].classList.add("farris-title-text-custom") : I[j].classList.remove("farris-title-text-custom");
      }
  }
  const k = (b) => {
    b.preventDefault(), b.stopPropagation();
  };
  function E(b, I, P = !1) {
    const j = l.value.findIndex((W) => W.props.id === I);
    l.value = l.value.filter((W) => W.props.id !== I), o.value === I && (i = I, o.value = "", y(l.value)), k(b), te(() => {
      r.value++, L(n), P && (s.value = !0), t.emit("tabRemove", {
        removeIndex: j,
        removeId: I,
        activeId: o.value
      });
    });
  }
  function V(b, I = !0) {
    const P = l.value.find((j) => j.props.id === b);
    P && (P.props.show === !1 && o.value === b ? (o.value = "", i = b, C("")) : P.props.show === !0 && !o.value && B(l.value), te(() => {
      r.value++, I && (s.value = !0);
    }));
  }
  function F(b) {
    o.value !== b && w(i, b, () => {
      i = o.value, d(b), x && x();
    }, null);
  }
  function m(b) {
    l.value.findIndex((P) => P.props.id === b.props.id) === -1 && l.value.push(b), r.value++;
  }
  function g(b) {
    l.value.findIndex((P) => P.props.id === b.props.id) !== -1 && (l.value.forEach((P) => {
      P.props.id === b.props.id && (P = b);
    }), b.props.id === o.value && p.value, te(() => {
      r.value++, L(n);
    }));
  }
  return {
    activeId: o,
    addTab: m,
    changeTitleStyle: L,
    removeTab: E,
    selectTab: F,
    tabPages: l,
    updateTab: g,
    toolbarItems: v,
    needUpdateNavigationLayout: r,
    checkActiveIdAndSelect: C,
    toggleShowTab: V,
    hasInHeadClass: p,
    setScrollToSelectedTabFunction: S,
    toolbarVisible: f
  };
}
function jn(e, t, n, u, l) {
  const {
    activeId: o,
    removeTab: i,
    selectTab: s
  } = l, v = T(() => {
    const C = {
      "st-tab-text": !0,
      "text-truncate": e.tabType === "pill" && !e.autoTitleWidth,
      "farris-title-auto": e.autoTitleWidth
    };
    return De(C, t.customTitleClass);
  }), f = T(() => ({
    "nav-item": !0,
    "d-none": t.show !== void 0 ? !t.show : !1,
    "f-state-active": t.id === o.value,
    "f-state-disabled": t.disabled
  })), r = T(() => ({
    width: `${t.tabWidth}px`
  })), p = T(() => ({
    "nav-link": !0,
    "tabs-text-truncate": !0,
    active: t.id === o.value,
    disabled: t.disabled
  })), x = ct({
    content: t.title,
    overflowShown: !0
  });
  function S() {
    return e.tabType !== "pill" && !e.autoTitleWidth ? Ne(a("span", {
      class: v.value,
      "data-tabid": t.id
    }, [t.title]), [[Yt("tooltip"), x]]) : a("span", {
      class: v.value,
      "data-tabid": t.id,
      title: t.title
    }, [t.title]);
  }
  const y = c(t.removeable);
  function d() {
    return y.value ? a("span", {
      class: "st-drop-close",
      onClick: (C) => i(C, t.id)
    }, [a("i", {
      class: "f-icon f-icon-close"
    }, null)]) : "";
  }
  function w(C) {
    s(t.id), e.tabType === "one-page" && u.scrollToByPaggId(t.id);
  }
  function B() {
    return n.slots.title ? a("a", {
      class: p.value,
      onClick: w,
      id: `${t.id}-tab-title`
    }, [n.slots.title(n), d()]) : t.titleRenderFunction ? a("a", {
      class: p.value,
      onClick: w,
      id: `${t.id}-tab-title`
    }, [t.titleRenderFunction(), d()]) : a("a", {
      class: p.value,
      onClick: w,
      id: `${t.id}-tab-title`
    }, [S(), d()]);
  }
  return a("li", {
    class: f.value,
    style: r.value
  }, [B()]);
}
function Nn(e, t, n, u, l) {
  const {
    shouldShowNavigationButtons: o
  } = n, {
    tabPages: i
  } = l, s = T(() => ({
    spacer: !0,
    "f-utils-fill": !0,
    "spacer-sides-dropdown": o.value
  })), v = T(() => ({
    width: "100%",
    "justify-content": e.justifyContent
  })), f = T(() => ({
    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: s.value,
    style: v.value
  }, [a("ul", {
    class: f.value,
    ref: t
  }, [i.value.map((r) => jn(e, r.props, r, u, l))])]);
}
function zn(e, t, n, u, l) {
  const o = c(), {
    shouldShowNavigationButtons: i
  } = n, {
    activeId: s,
    tabPages: v,
    selectTab: f
  } = l, r = c(s.value), p = T(() => v.value.map((d) => ({
    name: d.props.title,
    value: d.props.id,
    show: d.props.show,
    disabled: d.props.disabled
  }))), x = T(() => ({
    spacer: !0,
    "f-utils-fill": !0,
    "spacer-sides-dropdown": i.value
  })), S = T(() => ({
    width: "100%",
    display: "flex",
    "justify-content": e.justifyContent
  }));
  ne(() => {
    o.value && (t.value = o.value.$el);
  });
  function y(d) {
    f(d);
  }
  return z(() => s.value, (d) => {
    d !== r.value && (r.value = d);
  }, {
    immediate: !0
  }), () => a("div", {
    class: x.value,
    style: S.value
  }, [a(sn, {
    items: p.value,
    modelValue: r.value,
    "onUpdate:modelValue": (d) => r.value = d,
    onChange: y,
    ref: o
  }, null)]);
}
function An(e, t, n, u) {
  const l = c(), {
    activeId: o,
    removeTab: i,
    tabPages: s,
    selectTab: v
  } = u, {
    hideDropDown: f,
    searchTabText: r
  } = t, p = 600;
  let x = null;
  const S = T(() => {
    var b, I;
    let g = [];
    return e.searchBoxVisible ? g = (b = s.value) == null ? void 0 : b.filter((P) => P.props.title.includes(r.value)) : g = (I = s.value) == null ? void 0 : I.slice(), g;
  }), y = T(() => ({
    "dropdown-menu": !0,
    "tabs-pt28": e.searchBoxVisible,
    // 未看到样式定义
    show: !f.value,
    "d-none": f.value
  }));
  let d;
  function w(g) {
    d = g;
  }
  z(f, (g) => {
    if (d.value)
      if (g)
        l.value.style.width = null;
      else {
        const b = d.value.querySelector(".farris-tabs-header"), I = d.value.clientHeight - b.clientHeight - 20, j = b.querySelector(".farris-tabs-title").clientWidth - 20;
        l.value.style.maxWidth = j + "px", l.value.style.maxHeight = I + "px", te(() => {
          const {
            width: W
          } = l.value.getClientRects()[0];
          l.value.style.width = W ? W + "px" : null;
        });
      }
  });
  function B(g) {
    return {
      "dropdown-item": !0,
      "text-truncate": !0,
      "px-2": !0,
      disabled: g.props.disabled,
      active: g.props.id === o.value,
      "d-none": g.props.show !== !0
    };
  }
  function C(g) {
    g.preventDefault(), g.stopPropagation();
  }
  function L() {
    x && clearTimeout(x);
  }
  function k() {
    f.value || (x = setTimeout(() => {
      f.value = !0;
    }, p));
  }
  function E(g, b) {
    g.stopPropagation(), b.disabled || v(b.id), f.value = !0;
  }
  function V(g, b) {
    g.stopPropagation(), i(g, b, !0);
  }
  function F(g) {
    return g.slots.title ? a("a", {
      class: "dropdown-title",
      id: `${g.props.id}-dropdown-item`
    }, [g.slots.title(g)]) : g.props.titleRenderFunction ? a("a", {
      class: "dropdown-title",
      id: `${g.props.id}-dropdown-item`
    }, [g.props.titleRenderFunction()]) : a("a", {
      class: "dropdown-title",
      id: `${g.props.id}-dropdown-item`
    }, [g.props.title]);
  }
  function m() {
    return a("div", {
      ref: l,
      class: y.value,
      onMouseenter: () => L(),
      onMouseleave: () => k()
    }, [e.searchBoxVisible && a("div", {
      onClick: (g) => C(g),
      class: "pb-1 tabs-li-absolute"
    }, [Ne(a("input", {
      type: "text",
      class: "form-control",
      "onUpdate:modelValue": (g) => r.value = g
    }, null), [[rt, r.value]]), a("span", {
      class: "f-icon f-icon-page-title-query tabs-icon-search"
    }, null)]), S.value.length ? a("ul", {
      class: "tab-dropdown-menu--items flex-fill"
    }, [S.value.map((g) => a("li", {
      class: B(g),
      onClick: (b) => E(b, g.props)
    }, [g.props.removeable && g.props.disabled !== !0 && a("span", {
      class: "float-right st-drop-close",
      onClick: (b) => V(b, g.props.id)
    }, [a("i", {
      class: "f-icon f-icon-close"
    }, null)]), F(g)]))]) : a("div", {
      class: "dropdown-no-data"
    }, [Z.getLocaleValue("tabs.noData")])]);
  }
  return {
    renderDropdownMenu: m,
    setTabsRef: w
  };
}
function $n(e, t, n, u) {
  const {
    hideDropDown: l
  } = t, {
    renderDropdownMenu: o,
    setTabsRef: i
  } = An(e, t, n, u), s = c(e.showDropdown);
  function v() {
    return s.value && a(Q, null, [a("button", {
      class: "btn dropdown-toggle-split dropdown-toggle",
      onClick: () => {
        l.value = !1;
      }
    }, null), o()]);
  }
  return {
    renderMorePagesButtton: v,
    setTabsRef: i
  };
}
function Wn(e, t, n, u) {
  const l = c(!1), { selectTab: o, tabPages: i, needUpdateNavigationLayout: s, activeId: v } = u, f = 4, r = T(() => ({
    btn: !0,
    "sc-nav-btn": !0,
    "px-1": !0,
    "sc-nav-lr": !0,
    "d-none": !l.value
  })), p = T(() => ({
    "btn-group": !0,
    "sc-nav-btn": !0,
    dropdown: !0,
    "d-none": !l.value
  })), x = T(() => ({
    btn: !0,
    "sc-nav-rg": !0,
    "d-none": !l.value
  }));
  function S(C, L) {
    if (!t.value)
      return;
    const k = t.value.scrollLeft, E = t.value.scrollWidth - t.value.offsetWidth;
    if (L > 0) {
      if (t.value.scrollLeft >= E)
        return;
      t.value.scrollLeft = k + e.scrollStep + C;
    } else if (L < 0) {
      if (t.value.scrollLeft <= 0)
        return;
      t.value.scrollLeft = k - e.scrollStep - C;
    }
  }
  function y(C = -1) {
    if (!l.value || !t.value)
      return;
    C < 0 && (C = i.value.findIndex((F) => F.props.id === v.value));
    const L = e.tabType === "pills" ? ".f-capsule-item" : ".nav-item", k = t.value.querySelectorAll(L), { parentElement: E } = t.value, V = k[C];
    if (V && E) {
      const F = E.getBoundingClientRect().left, m = E.getBoundingClientRect().right, g = V.getBoundingClientRect().left, b = V.getBoundingClientRect().right;
      g < F ? S(F - g, -1) : m < b && S(b - m, 1), e.tabType === "one-page" && n.scrollTo(C);
    }
  }
  function d() {
    var k;
    if (!t.value)
      return;
    const C = t.value, L = (k = t.value) == null ? void 0 : k.parentElement;
    l.value = L && C && L.offsetWidth < C.scrollWidth - f, l.value && te(() => {
      y();
    });
  }
  function w(C) {
    C.disabled || o(C.id);
  }
  function B() {
    ["default", "one-page"].indexOf(e.tabType) > -1 && te(() => {
      y();
    });
  }
  return z(s, () => {
    d();
  }), {
    previousButtonClass: r,
    nextButtonGroupClass: p,
    nextButtonClass: x,
    scrollTab: S,
    selectAndScrollToTab: w,
    shouldShowNavigationButtons: l,
    updateNavigationLayout: d,
    scrollToSelectedTab: B
  };
}
function _n(e, t) {
  const { tabPages: n } = t, u = c(""), l = c(!0), o = T(() => e.searchBoxVisible), i = T(() => o.value ? n.value.filter((v) => v.props.title.includes(u.value)) : n.value.slice());
  return z(l, (s) => {
    s || (u.value = "");
  }), {
    searchTabText: u,
    hideDropDown: l,
    shouldShowSearchBox: o,
    tabsInDropdownMenu: i
  };
}
function Gn(e, t, n) {
  const u = ".farris-tab-page", { tabPages: l } = n;
  let o = -1;
  function i() {
    if (o < 0) {
      const f = document.querySelector(".farris-tabs-header");
      f && (o = f.clientHeight);
    }
    return o;
  }
  function s(f) {
    const r = t.value;
    if (r) {
      const p = t.value.querySelectorAll(u);
      if (p.length > 0) {
        const x = p[f], { offsetTop: S } = x, y = S - i();
        r.scrollTop = y > 0 ? y : 0;
      }
    }
  }
  function v(f) {
    const r = l.value.findIndex((p) => p.props.id === f);
    r > -1 && s(r);
  }
  return { scrollTo: s, scrollToByPaggId: v };
}
const Un = ["moz", "ms", "webkit"];
function qn() {
  let e = 0;
  return (t) => {
    const n = (/* @__PURE__ */ new Date()).getTime(), u = Math.max(0, 16 - (n - e)), l = setTimeout(() => {
      t(n + u);
    }, u);
    return e = n + u, l;
  };
}
function Yn() {
  if (typeof window > "u")
    return () => 0;
  if (window.requestAnimationFrame)
    return window.requestAnimationFrame.bind(window);
  const e = Un.filter((t) => `${t}RequestAnimationFrame` in window)[0];
  return e ? window[`${e}RequestAnimationFrame`] : qn();
}
Yn();
c("");
function bt() {
  const e = navigator.userAgent || navigator.vendor || window.opera, t = [
    /iPhone/i,
    /iPod/i,
    /Android.*Mobile/i,
    // Android 手机通常包含 "Mobile" 字样，而平板不包含
    /webOS/i,
    /BlackBerry/i,
    /IEMobile/i,
    /Opera Mini/i,
    /Harmony/i
  ], n = [
    /iPad/i,
    /Android(?!.*Mobile)/i,
    // Android 平板通常不含 "Mobile"
    /Tablet/i,
    /PlayBook/i,
    /Kindle/i,
    /Silk/i
  ];
  for (const s of n)
    if (s.test(e))
      return !1;
  for (const s of t)
    if (s.test(e))
      return !0;
  const u = "ontouchstart" in window || navigator.maxTouchPoints > 0, l = screen.width, o = screen.height, i = Math.min(l, o);
  return !!(u && i <= 768);
}
const Le = /* @__PURE__ */ Y({
  name: "FTabs",
  props: En,
  emits: ["tabChange", "tabRemove", "update:activeId", "Click"],
  setup(e, t) {
    const n = c(e.tabType), u = Re(), l = bt(), o = c(e.customClass), i = Re();
    Re();
    const s = c(), v = Dn(e, t, i), {
      activeId: f,
      changeTitleStyle: r,
      tabPages: p,
      addTab: x,
      updateTab: S,
      toolbarItems: y,
      checkActiveIdAndSelect: d,
      toggleShowTab: w,
      hasInHeadClass: B,
      toolbarVisible: C
    } = v, L = Gn(e, u, v), k = Wn(e, i, L, v), {
      previousButtonClass: E,
      nextButtonClass: V,
      nextButtonGroupClass: F,
      scrollTab: m,
      updateNavigationLayout: g,
      scrollToSelectedTab: b
    } = k;
    v.setScrollToSelectedTabFunction(b);
    const I = _n(e, v), P = Nn(e, i, k, L, v), j = P, W = zn(e, i, k, L, v), H = /* @__PURE__ */ new Map([["default", P], ["one-page", j], ["pills", W]]);
    T(() => {
      const G = p.value.find((ee) => ee.props.id === f.value);
      return G == null ? void 0 : G.slots;
    });
    const R = T(() => e.fill), N = (G, ee) => {
      t.emit("Click", G, ee, f.value);
    };
    Ue("tabs", {
      activeId: f,
      addTab: x,
      updateTab: S,
      tabPages: p,
      tabType: n,
      shouldFillParentContaner: R,
      toggleShowTab: w,
      toolbarVisible: C,
      clickToolbarItemHandler: N
    });
    let h = !1;
    const O = T(() => ({
      "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",
      "d-none": e.showHeader === !1
    })), D = T(() => {
      const G = {
        width: B.value && e.titleWidth ? `${e.titleWidth}%` : ""
      };
      return G.width && (G.flex = "unset"), G;
    }), $ = T(() => {
      const G = {
        "farris-tabs": !0,
        "f-tabs-content-fill": R.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 o.value && o.value.split(" ").reduce((ee, se) => (ee[se] = !0, ee), G), G;
    }), U = new ResizeObserver((G) => {
      G.length && g();
    });
    function re() {
      s.value && !h && (U.observe(s.value), h = !0);
    }
    z(() => e.visible, (G) => {
      te(() => {
        p.value.length && d(e.activeId || p.value[0].props.id), g(), r(i), re();
      });
    }), z(() => e.autoTitleWidth, (G) => {
      te(() => {
        g(), r(i);
      });
    }), ne(() => {
      e.visible && (p.value.length && d(e.activeId || p.value[0].props.id), te(() => {
        g(), r(i);
      }), re());
    });
    function oe() {
      return a("button", {
        title: Z.getLocaleValue("tabs.leftButton"),
        type: "button",
        class: E.value,
        onClick: () => {
          m(0, -1);
        }
      }, null);
    }
    function Se() {
      return a("button", {
        title: Z.getLocaleValue("tabs.rightButton"),
        type: "button",
        class: V.value,
        onClick: () => {
          m(0, 1);
        }
      }, null);
    }
    const {
      renderMorePagesButtton: he,
      setTabsRef: Ie
    } = $n(e, I, k, v);
    Ie(u);
    function Te() {
      return y.value.length ? a("div", {
        class: {
          "farris-tabs-toolbar": !0,
          "d-none": !C.value
        }
      }, [a(un, {
        class: "f-utils-fill",
        alignment: B.value ? "right" : "left",
        items: y.value,
        visible: C.value,
        onClick: N
      }, null)]) : null;
    }
    const de = H.get(e.tabType) || H.get("default");
    function Be() {
      var G, ee, se, Fe;
      return a("div", {
        class: O.value
      }, [a("div", {
        class: "farris-tabs-header-pre"
      }, [(ee = (G = t.slots).headerPrefix) == null ? void 0 : ee.call(G)]), a("div", {
        class: "farris-tabs-title scroll-tabs",
        style: D.value,
        ref: s
      }, [!l && oe(), de && de(), a("div", {
        hidden: l,
        class: F.value
      }, [Se(), he()])]), Te(), a("div", {
        class: "farris-tabs-header-post"
      }, [(Fe = (se = t.slots).headerSuffix) == null ? void 0 : Fe.call(se)])]);
    }
    T(() => ({
      "farris-tabs-content": !0,
      "f-utils-fill-flex-column": R.value
    }));
    function ke() {
      var G, ee;
      return (
        // <div class={tabsContentClass.value} ref={tabContentElementRef}>
        (ee = (G = t.slots).default) == null ? void 0 : ee.call(G)
      );
    }
    return () => e.visible ? a("div", {
      class: $.value,
      ref: u
    }, [Be(), ke()]) : null;
  }
}), Xn = {
  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 ot(e) {
  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !dt(e);
}
const qe = /* @__PURE__ */ Y({
  name: "FTabPage",
  props: Xn,
  emits: [],
  setup(e, t) {
    const n = ae("tabs");
    we();
    const u = c(e.show), l = {
      slots: t.slots,
      props: e
    }, o = c((n == null ? void 0 : n.tabType.value) || "default");
    ne(() => {
      const d = n == null ? void 0 : n.tabPages.value.findIndex((w) => w.props.id === e.id);
      (!d || d === -1) && (n == null || n.addTab(l));
    }), xe(() => {
    });
    const i = T(() => (e == null ? void 0 : e.id) === (n == null ? void 0 : n.activeId.value)), s = T(() => ({
      display: i.value ? "" : "none"
    }));
    z(() => e, (d) => {
      n == null || n.updateTab({
        props: d,
        slots: t.slots
      });
    }, {
      immediate: !0,
      deep: !0
    }), z(() => e.show, (d) => {
      u.value = d, n == null || n.toggleShowTab(e.id);
    }), z(() => e.toolbarVisible, (d) => {
      i.value && n && (n.toolbarVisible.value = d);
    });
    function v() {
      var w, B;
      const d = (B = (w = t.slots).default) == null ? void 0 : B.call(w);
      return a(lt, {
        "main-title": e.title,
        class: ["farris-tab-page", u.value ? "" : "f-tab-d-none"]
      }, ot(d) ? d : {
        default: () => [d]
      });
    }
    function f(d, w) {
      n && (n.activeId.value = e.id, n.clickToolbarItemHandler && n.clickToolbarItemHandler(d, w));
    }
    function r() {
      var w, B;
      const d = (B = (w = t.slots).default) == null ? void 0 : B.call(w);
      return a(lt, {
        customClass: "section-in-tab is-mobile",
        onClick: f,
        visible: e.show,
        "main-title": e.title,
        buttons: e.toolbar.buttons,
        "button-position": e.toolbar.position || e.toolbarPosition,
        "buttons-visible": e.toolbarVisible
      }, ot(d) ? d : {
        default: () => [d]
      });
    }
    const p = T(() => {
      var w;
      return {
        "farris-tab-page": !0,
        "f-tab-d-none": !u.value,
        "f-tab-active": i.value && n && ((w = n.shouldFillParentContaner) == null ? void 0 : w.value)
      };
    });
    function x() {
      var w, B;
      const d = (B = (w = t.slots).default) == null ? void 0 : B.call(w);
      return a("div", {
        class: p.value,
        style: s.value
      }, [d]);
    }
    const y = (/* @__PURE__ */ new Map([["default", x], ["one-page", v], ["mobile", r]])).get(o.value) || x;
    return () => y();
  }
});
Le.install = (e) => {
  e.component(Le.name, Le), e.component(qe.name, qe);
};
const Kn = /* @__PURE__ */ new Map([
  ["appearance", gt]
]), Jn = "https://json-schema.org/draft/2020-12/schema", Zn = "https://farris-design.gitee.io/search-box.schema.json", Qn = "search-box", ea = "A Farris Component", ta = "object", na = {
  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
  }
}, aa = [
  "id",
  "type"
], la = {
  $schema: Jn,
  $id: Zn,
  title: Qn,
  description: ea,
  type: ta,
  properties: na,
  required: aa
};
function oa(e, t, n) {
  return t;
}
const sa = "search-box", ia = "A Farris Component", ua = "object", ca = {
  basic: {
    description: "Basic Infomation",
    title: "基本信息",
    properties: {
      id: {
        description: "组件标识",
        title: "标识",
        type: "string",
        readonly: !0
      },
      type: {
        description: "组件类型",
        title: "控件类型",
        type: "select",
        editor: {
          type: "waiting for modification",
          enum: []
        }
      }
    }
  }
}, ra = {
  title: sa,
  description: ia,
  type: ua,
  categories: ca
}, 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 }
}, wt = Xe(Je, la, Kn, oa, ra), da = {
  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 }
}, Ct = /* @__PURE__ */ Y({
  name: "FSearchBoxContainer",
  props: da,
  emits: ["confirmResult", "searchedValue"],
  setup(e, t) {
    const n = c(e.data), u = c(), {
      slots: l
    } = t, o = T(() => ({
      "search-box-container": !0,
      "f-utils-overflow-xhya": !0,
      "position-relative": !0
    }));
    function i(r) {
      var p;
      (p = u.value) == null || p.search(r);
    }
    function s(r) {
      r.length && (t.emit("confirmResult", r[0][e.textField]), t.emit("searchedValue", r));
    }
    function v(r) {
      return l.default ? a(Q, null, [l.default(r)]) : a("span", null, [r.item[e.textField]]);
    }
    const f = T(() => {
      const r = {};
      return r.padding = "8px", e.maxHeight !== void 0 && e.maxHeight > 0 && (r.maxHeight = `${e.maxHeight}px`), r;
    });
    return z(() => e.loading, (r) => {
    }), z(() => e.data, (r) => {
      r !== n.value && (n.value = r), u.value.updateDataSource(r);
    }), t.expose({
      search: i
    }), () => {
      const r = {
        content: v
      };
      return a("div", {
        class: o.value,
        style: f.value
      }, [a(fn, {
        ref: "loadingInstance",
        isActive: e.loading
      }, null), a(dn, {
        ref: u,
        itemClass: "dropdown-item",
        data: n.value,
        view: "ContentView",
        onClickItem: (p) => s(p.data),
        idField: e.idField,
        textField: e.textField,
        titleField: e.textField,
        valueField: e.idField
      }, r)]);
    };
  }
}), ue = /* @__PURE__ */ Y({
  name: "FSearchBox",
  props: Je,
  emits: ["update:modelValue", "change", "selectedValue", "clickButton"],
  setup(e, t) {
    c(e.data);
    const n = c(), u = c(), l = c(e.placeholder), o = '<i class="f-icon f-icon-clockwise f-icon-spin"></i>', i = T(() => e.loading ? o : e.buttonContent);
    c(e.editable);
    const s = c(e.modelValue);
    z(s, (d) => {
      var w;
      (w = u.value) == null || w.search(d), t.emit("update:modelValue", d);
    }), z(() => e.modelValue, (d) => {
      s.value = d;
    });
    function v(d) {
      n.value.commitValue(d);
    }
    function f(d) {
      const w = s.value;
      t.emit("change", d, {
        oldValue: w,
        newValue: d
      });
    }
    function r(d) {
      t.emit("selectedValue", d);
    }
    function p(d) {
      t.emit("clickButton", d);
    }
    function x() {
      var d;
      (d = n.value) == null || d.togglePopup();
    }
    function S() {
      var d;
      (d = n.value) == null || d.hidePopup();
    }
    function y() {
      var d;
      (d = n.value) == null || d.showPopup();
    }
    return t.expose({
      togglePopup: x,
      hidePopup: S,
      showPopup: y
    }), () => {
      const d = {
        default: t.slots.default
      };
      return a(rn, {
        ref: n,
        "button-content": i.value,
        "custom-class": e.customClass,
        updateOn: e.updateOn,
        placeholder: l.value,
        onChange: (w) => f(w),
        onClickButton: (w) => p(w),
        disable: e.disable,
        "enable-clear": !0,
        "button-behavior": "Execute",
        modelValue: s.value,
        "onUpdate:modelValue": (w) => s.value = w,
        "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(Ct, {
          ref: u,
          data: e.data,
          idField: e.idField,
          textField: e.textField,
          onConfirmResult: v,
          onSearchedValue: (w) => r(w),
          loading: e.loading,
          maxHeight: e.maxHeight
        }, d)],
        ...t.slots
      });
    };
  }
}), fa = /* @__PURE__ */ Y({
  name: "FSearchBoxDesign",
  props: Je,
  emits: ["update:modelValue", "change"],
  setup(e, t) {
    const n = c(e.data), u = c(), l = c(), o = c("请输入关键词"), i = c('<i class="f-icon f-icon-search"></i>'), s = c(e.modelValue), v = c(), f = ae("design-item-context"), r = ht(v, f);
    ne(() => {
      v.value.componentInstance = r;
    }), t.expose(r.value), z(s, (S) => {
      var y;
      (y = l.value) == null || y.search(S), t.emit("update:modelValue", S);
    }), z(() => e.modelValue, (S) => {
      s.value = S;
    });
    function p(S) {
      u.value.commitValue(S);
    }
    function x(S) {
      t.emit("change", S);
    }
    return () => a("div", {
      ref: v
    }, [a(Xt("f-button-edit"), {
      ref: u,
      "button-content": i.value,
      placeholder: o.value,
      onChange: x,
      "enable-clear": !0,
      "button-behavior": "Execute",
      modelValue: s.value,
      "onUpdate:modelValue": (S) => s.value = S,
      "popup-host": e.popupHost,
      "popup-right-boundary": e.popupRightBoundary,
      "popup-offset-x": e.popupOffsetX,
      "popup-on-input": !0,
      "popup-on-focus": !0
    }, {
      default: () => [a(Ct, {
        ref: l,
        data: n.value,
        onConfirmResult: p
      }, null)]
    })]);
  }
});
ue.install = (e) => {
  e.component(ue.name, ue);
};
ue.register = (e, t, n, u) => {
  e["search-box"] = ue, t["search-box"] = wt;
};
ue.registerDesigner = (e, t, n) => {
  e["search-box"] = fa, t["search-box"] = wt;
};
const xt = {
  /** 列集合 */
  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 va(e, t) {
  function n(o) {
    const i = [];
    let s = o.nextNode();
    for (; s; )
      i.push(s), s = o.nextNode();
    return i;
  }
  function u(o, i) {
    const s = document.createTreeWalker(o, NodeFilter.SHOW_TEXT);
    return n(s).map((p) => ({ textNode: p, text: (p.textContent || "").toLocaleLowerCase() })).map(({ textNode: p, text: x }) => {
      const S = [];
      let y = 0;
      for (; y < x.length; ) {
        const d = x.indexOf(i, y);
        if (d === -1)
          break;
        S.push(d), y = d + i.length;
      }
      return S.map((d) => {
        const w = new Range();
        return w.setStart(p, d), w.setEnd(p, d + i.length), w;
      });
    }).flat();
  }
  function l(o) {
    if (!CSS.highlights || (CSS.highlights.clear(), !o || !t))
      return;
    const i = u(t.value, o.toLocaleLowerCase()), s = new Highlight(...i);
    CSS.highlights.set("search-result", s);
  }
  return { search: l };
}
function st(e, t, n, u, l, o, i, s, v, f) {
  const r = c(e.size), p = c(e.textField), x = c(e.titleField), S = c(e.disableField), y = T(() => {
    var g, b;
    return ((g = e.selection) == null ? void 0 : g.multiSelect) && ((b = e.selection) == null ? void 0 : b.showCheckbox);
  }), {
    onMouseenterItem: d,
    onMouseoverItem: w,
    onMouseoutItem: B
  } = o, {
    getKey: C,
    listViewItemClass: L,
    listViewItemStyle: k,
    onCheckItem: E,
    onClickItem: V
  } = i, F = T(() => {
    const g = {
      "text-overflow": "ellipsis",
      overflow: "hidden",
      "white-space": "nowrap"
    };
    return e.itemClass ? g : {
      margin: r.value === "small" ? "0.25rem 0" : "8px 0",
      ...g
    };
  });
  function m(g, b, I) {
    return g.checked = s.findIndexInSelectedItems(g) > -1, a("li", {
      class: L(g, b),
      id: C(g, b),
      key: C(g, b),
      style: k(g, b),
      onClick: (P) => V(g, b, P),
      onMouseenter: (P) => d(P, g, b),
      onMouseover: (P) => w(P, g, b),
      onMouseout: (P) => B(P, g, b)
    }, [y.value && a("div", {
      class: "f-list-select",
      onClick: (P) => P.stopPropagation()
    }, [a(Ke, {
      id: "list-" + C(g, b),
      customClass: "listview-checkbox float-left",
      disabled: g[S.value],
      checked: g.checked,
      "onUpdate:checked": (P) => g.checked = P,
      onChange: (P) => {
        E(g, b, !P.checked);
      }
    }, null)]), a("div", {
      class: "f-list-content"
    }, [a("div", {
      class: e.itemContentClass,
      style: F.value,
      title: g.raw[x.value] || g.raw[p.value]
    }, [g.raw[p.value]])])]);
  }
  return {
    renderItem: m
  };
}
function ma(e, t, n, u, l, o, i, s, v, f) {
  const r = c(e.multiSelect), p = c(e.disableField), x = c(e.textField), {
    onMouseenterItem: S,
    onMouseoverItem: y,
    onMouseoutItem: d
  } = o, {
    getKey: w,
    listViewItemClass: B,
    listViewItemStyle: C,
    onCheckItem: L,
    onClickItem: k,
    updateSelectedItems: E
  } = i;
  function V(m, g, b) {
    return e.contentTemplate ? a(Q, null, [e.contentTemplate({
      item: m.raw,
      index: g,
      selectedItem: b
    })]) : t.slots.content ? a(Q, null, [t.slots.content && t.slots.content({
      item: m.raw,
      index: g,
      selectedItem: b
    })]) : a("div", {
      style: "margin: 10px 0;"
    }, [m.raw[x.value || "name"]]);
  }
  function F(m, g, b) {
    return a("li", {
      class: B(m, g),
      id: w(m, g),
      key: w(m, g),
      style: C(m, g),
      onClick: (I) => k(m, g, I),
      onMouseenter: (I) => S(I, m, g),
      onMouseover: (I) => y(I, m, g),
      onMouseout: (I) => d(I, m, g)
    }, [r.value && a("div", {
      class: "f-list-select",
      onClick: (I) => I.stopPropagation()
    }, [a(Ke, {
      id: "list-" + w(m, g),
      customClass: "listview-checkbox",
      disabled: m[p.value],
      checked: m.checked,
      "onUpdate:checked": (I) => m.checked = I,
      onChange: (I) => {
        L(m, g, !I.checked), E();
      }
    }, null)]), a("div", {
      class: "f-list-content"
    }, [V(m, g, b)])]);
  }
  return {
    renderItem: F
  };
}
function pa(e, t, n, u, l, o, i, s, v, f) {
  const r = c(e.multiSelect), p = c(e.disableField), x = c(e.textField), {
    onMouseenterItem: S,
    onMouseoverItem: y,
    onMouseoutItem: d
  } = o, {
    getKey: w,
    listViewItemClass: B,
    onCheckItem: C,
    onClickItem: L
  } = i, {
    dragstart: k,
    dragenter: E,
    dragover: V,
    dragend: F
  } = u, {
    removeItem: m
  } = v, g = T(() => ({
    margin: r.value ? "10px 0" : "10px 0px 10px 14px"
  }));
  function b(H, R = "") {
    const N = H.target;
    N.title = N.scrollWidth > N.clientWidth ? R : "";
  }
  function I(H) {
    return a("div", {
      style: g.value,
      onMouseenter: (R) => b(R, H.raw[x.value || "name"])
    }, [H.raw[x.value || "name"]]);
  }
  function P() {
    return t.slots.itemContent ? t.slots.itemContent : I;
  }
  const j = P();
  function W(H, R, N) {
    return a("li", {
      class: B(H, R),
      id: w(H, R),
      key: w(H, R),
      onClick: (h) => L(H, R, h),
      onMouseenter: (h) => S(h, H, R),
      onMouseover: (h) => y(h, H, R),
      onMouseout: (h) => d(h, H, R),
      draggable: "true",
      onDragstart: (h) => k(h, H, R),
      onDragenter: (h) => E(h, R),
      onDragend: (h) => F(h, H),
      onDragover: (h) => V(h)
    }, [r.value && a("div", {
      class: "f-list-select",
      onClick: (h) => h.stopPropagation()
    }, [a(Ke, {
      id: "list-" + w(H, R),
      customClass: "listview-checkbox",
      disabled: H[p.value],
      checked: H.checked,
      "onUpdate:checked": (h) => H.checked = h,
      onChange: (h) => C(H, R, !h.checked)
    }, null)]), a("div", {
      class: "f-list-content"
    }, [j(H)]), e.allowDelete && a("div", {
      class: "f-list-remove",
      onClick: (h) => {
        h.stopPropagation(), m(R);
      }
    }, [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: W
  };
}
function ga(e, t, n, u, l, o, i, s, v, f) {
  var w;
  const r = c(((w = e.group) == null ? void 0 : w.groupFields) || []), {
    collpaseGroupIconClass: p
  } = l, {
    toggleGroupRow: x
  } = f;
  function S(B, C) {
    B.stopPropagation(), C.collapse = !C.collapse, n.value = x(C.collapse ? "collapse" : "expand", C, n.value);
  }
  function y(B, C, L) {
    return t.slots.group ? a(Q, null, [t.slots.content && t.slots.group({
      item: B.raw,
      index: C,
      selectedItem: L
    })]) : a("div", {
      class: "f-navlookup-recentHeader",
      onClick: (k) => S(k, B)
    }, [a("div", {
      class: "fv-grid-group-row-icon"
    }, [a("span", {
      class: p(B)
    }, null)]), a("div", {
      class: "f-navlookup-recommandLabel"
    }, [B.raw[r.value[B.layer]]])]);
  }
  function d(B, C, L) {
    return B.layer > -1 && y(B, C, L);
  }
  return {
    renderItem: d
  };
}
function ha(e, t, n, u) {
  const { dataView: l } = n, { updateSelectedItems: o } = u;
  function i(s) {
    if (s > -1 && s < l.value.length) {
      if (e != null && e.checkBeforeRemoveItem && !e.checkBeforeRemoveItem(l.value[s]))
        return;
      const v = l.value.splice(s, 1);
      o(), t.emit("removeItem", v[0]);
    }
  }
  return { removeItem: i };
}
function ya(e, t, n, u, l, o, i, s, v, f) {
  const r = c(e.view), p = c(e.view === "CardView"), x = c({}), S = ha(e, t, u, v), y = T(() => ({
    "f-list-view-group": !0,
    "f-list-view-group-multiselect": e.multiSelect,
    "d-flex": p.value,
    "flex-wrap": p.value
  })), d = T(() => !!n.value && n.value.length > 0), w = T(() => n.value.length === 0);
  T(() => w.value && !t.slots.empty);
  function B() {
    return r.value === "SingleView" ? st : r.value === "DraggableView" ? pa : (r.value === "ContentView" || r.value === "CardView") && (e.contentTemplate || t.slots.content) ? ma : st;
  }
  const C = B(), {
    renderItem: L
  } = C(e, t, n, f, l, o, v, i, S, s), {
    renderItem: k
  } = ga(e, t, n, f, l, o, v, i, S, s), E = [L, k];
  function V() {
    return n.value.filter((g) => g.visible !== !1).map((g, b) => E[g.type](g, b, x));
  }
  function F() {
    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() : Z.getLocaleValue("listView.emptyMessage")])]);
  }
  function m() {
    return a("ul", {
      class: y.value,
      style: "list-style: none;"
    }, [d.value && V(), w.value && F()]);
  }
  return {
    renderListArea: m
  };
}
function ba(e, t, n) {
  function u() {
    return t.slots.header && a("div", {
      class: "f-list-view-header"
    }, [t.slots.header()]);
  }
  return {
    renderHeader: u
  };
}
function it(e, t, n) {
  const u = c(e.headerClass), l = c(e.placeholder), o = c(""), i = T(() => !o.value), s = T(() => !!o.value);
  function v(x) {
    o.value = "";
  }
  z(o, (x) => {
    e.enableHighlightSearch && n.search(x), t.emit("afterSearch", x);
  });
  const f = T(() => {
    const x = {
      "form-group": !0,
      "farris-form-group": !0
    };
    return u.value && u.value.split(" ").reduce((y, d) => (y[d] = !0, y), x), x;
  });
  function r(x) {
  }
  function p() {
    return a("div", {
      class: "f-list-view-header",
      onClick: Kt(() => r, ["prevent", "stop"])
    }, [a("div", {
      class: f.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": (x) => o.value = x,
      name: "input-group-value",
      type: "text",
      placeholder: l.value,
      autocomplete: "off"
    }, null), [[rt, o.value]]), a("div", {
      class: "input-group-append"
    }, [s.value && a("span", {
      class: "input-group-text input-group-clear",
      onClick: (x) => v()
    }, [a("i", {
      class: "f-icon f-icon-close-circle"
    }, null)]), i.value && a("span", {
      class: "input-group-text"
    }, [a("span", {
      class: "f-icon f-icon-search"
    }, null)])])])])])])]);
  }
  return {
    renderHeader: p
  };
}
function wa() {
  const e = c(""), t = c(-1), n = c(""), u = c(-1), l = c(!1);
  function o(p, x, S) {
    u.value = S;
  }
  function i(p, x, S) {
    l.value || (u.value = S);
  }
  function s(p, x, S) {
    u.value = -1;
  }
  function v() {
    l.value = !0;
  }
  function f() {
    l.value = !1;
  }
  function r() {
    t.value = -1, e.value = "";
  }
  return {
    activeIndex: t,
    focusedItemId: n,
    hoverIndex: u,
    clearActiveItem: r,
    onMouseenterItem: o,
    onMouseoverItem: i,
    onMouseoutItem: s,
    resumeHover: f,
    suspendHover: v
  };
}
function Ca(e, t, n, u, l) {
  const o = c(e.idField), { dataView: i } = n, s = c(-1), v = c(!1), { activeIndex: f, focusedItemId: r, hoverIndex: p, resumeHover: x, suspendHover: S } = u;
  let y, d = 0, w = 0, B = null, C = null;
  const L = 10, k = 50;
  function E(H) {
    if (!H)
      return null;
    const { overflowY: R } = getComputedStyle(H);
    return R === "auto" || R === "scroll" ? H : E(H.parentElement);
  }