@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
1,562 lines • 153 kB
JavaScript
var Yn = Object.defineProperty;
var Xn = (e, t, n) => t in e ? Yn(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
var Le = (e, t, n) => Xn(e, typeof t != "symbol" ? t + "" : t, n);
import { defineComponent as Ae, ref as m, computed as M, createVNode as i, Teleport as $t, createApp as Mt, onUnmounted as ft, Fragment as Ie, watch as de, nextTick as nt, onBeforeMount as qn, onMounted as it, watchEffect as Jn, Transition as _t, shallowRef as Zn, render as Tt, h as Qn, cloneVNode as Kn, mergeProps as Ct, inject as ht, withDirectives as eo, vShow as to, onUpdated as no, onBeforeUnmount as oo, createTextVNode as Ve, reactive as Ee, isVNode as Et, Comment as Ut, provide as ao, getCurrentInstance as Yt } from "vue";
import { LocaleService as We } from "../locale/index.esm.js";
import { isMobilePhone as lo, getMaxZIndex as Wt, useGuid as io, withInstall as Xt, useCommonUtils as qt, resolveField as ro, getCustomClass as uo } from "../common/index.esm.js";
import "../property-panel/index.esm.js";
import so from "../tags/index.esm.js";
import { debounce as co, isPlainObject as At, cloneDeep as Bt } from "lodash-es";
import fo from "../popover/index.esm.js";
import { useResizeObserver as mo } from "@vueuse/core";
import { SETTING_COLUMN_FIELD as vo, COMMAND_COLUMN_FIELD as go, CellMode as Jt, SETTING_COLUMN_DATA_TYPE as at, COMMAND_COLUMN_DATA_TYPE as lt, useMobile as ho, useIdentify as po, useGroupData as yo, useFilter as bo, useHierarchy as Co, useLoading as wo, useDataView as xo, usePagination as So, useSelection as To, useDataViewContainerStyle as Fo, useCommandColumn as Bo, useSettingColumn as ko, useColumn as Oo, useSort as Mo, useGroupColumn as Eo, useRow as Io, useEdit as Po, useVisualDataBound as Do, useVisualDataCell as Ro, useVisualDataRow as jo, useVisualGroupRow as Ho, useVisualSummaryRow as zo, useVisualData as No, useCellContentStyle as Lo, useCellPosition as Vo, useSidebar as Wo, useVirtualScroll as Ao, useFitColumn as Go, useFilterHistory as $o, useColumnFilter as _o, useDragColumn as Uo, getColumnHeader as Yo, getPagination as Xo, getSidebar as qo, getDisableMask as Jo, getSummary as Zo, getHorizontalScrollbar as Qo, getVerticalScrollbar as Ko, getFilterPanel as ea, getGroupPanel as ta, useNavigation as na, getEmpty as oa, ColumnSettingSolution as aa } from "../data-view/index.esm.js";
import la, { FDynamicForm as ia, FDynamicFormLabel as ra } from "../dynamic-form/index.esm.js";
import Gt from "../button/index.esm.js";
import ua from "../drawer/index.esm.js";
import { createPropsResolver as sa } from "../dynamic-resolver/index.esm.js";
const ca = {
/**
* 组件标识
*/
id: { type: String, default: "" },
/**
* 扩展按钮显示内容，这是一段现在扩展按钮中的html标签
*/
buttonContent: { type: String, default: '<i class="f-icon f-icon-lookup"></i>' },
buttonBehavior: { type: String, default: "Popup" },
/**
* 启用输入框自动完成功能
*/
autoComplete: { type: Boolean, default: !1 },
/**
* 组件自定义样式
*/
customClass: { type: String, default: "" },
/**
* 禁用组件，既不允许在输入框中录入，也不允许点击扩展按钮。
*/
disable: { type: Boolean, default: !1 },
/**
* 允许在输入框中录入文本。
*/
editable: { type: Boolean, default: !0 },
/**
* 显示清空文本按钮
*/
enableClear: { type: Boolean, default: !1 },
/**
* 组件值
*/
modelValue: { type: String, default: "" },
/**
* 将组件设置为只读，既不允许在输入框中录入，也不允许点击扩展按钮，但是允许复制输入框中的内容。
*/
readonly: { type: Boolean, default: !1 },
/**
* 禁用组件时，是否显示扩展按钮
*/
showButtonWhenDisabled: { type: Boolean, default: !1 },
/**
* 鼠标悬停在组件上时显示文本框内容。
*/
enableTitle: { type: Boolean, default: !1 },
/**
* 输入框类型
*/
inputType: { type: String, default: "text" },
/**
* 显示输入框提示信息
*/
forcePlaceholder: { type: Boolean, default: !1 },
/**
* 输入框提示文本
*/
placeholder: { type: String, default: "" },
/**
* 输入框最小长度
*/
minLength: Number,
/**
* 输入框最大长度
*/
maxLength: { type: Number },
/**
* 输入框Tab键索引
*/
tabIndex: Number,
popupHost: { type: Object },
popupRightBoundary: { type: Object },
popupOffsetX: { type: Object },
popupOnInput: { type: Boolean, default: !1 },
popupOnFocus: { type: Boolean, default: !1 },
popupOnClick: { type: Boolean, default: !1 },
/**
* 样式追加到弹出窗口
*/
popupClass: { type: String, default: "" },
popupMinWidth: { type: Number, default: 160 },
modalOptions: { type: Object, default: {} },
wrapText: { type: Boolean, default: !1 },
/**
* 可选，是否支持多选
* 默认`false`
*/
multiSelect: { type: Boolean, default: !1 },
/**
* 可选，分隔符
* 默认`,`
*/
separator: { type: String, default: "," },
/** 对齐方式 */
textAlign: { type: String, default: "left" },
/**
* 废弃
*/
beforeClickButton: { type: Function, default: null },
/**
* 作为内嵌编辑器被创建后默认获得焦点
*/
focusOnCreated: { type: Boolean, default: !1 },
/**
* 作为内嵌编辑器被创建后默认选中文本
*/
selectOnCreated: { type: Boolean, default: !1 },
/**
* 打开前
*/
beforeOpen: { type: Function, default: null },
/** 更新方式 blur | change */
updateOn: { type: String, default: "change" },
keepWidthWithReference: { type: Boolean, default: !0 },
placement: { type: String, default: "bottom-left" },
/**
* 根据空间大小重新调整，原下拉面板内容指定的高度
*/
limitContentBySpace: { type: Boolean, default: !1 },
beforeClosePopup: { type: Function, default: null }
}, da = {
popupContentPosition: { type: Object, default: { left: 0, top: 0 } },
host: { type: Object },
backgroundColor: { type: String, default: "" }
}, fa = /* @__PURE__ */ Ae({
name: "FOverlay",
props: da,
emits: ["click"],
setup(e, t) {
const n = m(e.popupContentPosition), o = m(e.host), a = M(() => ({
backgroundColor: e.backgroundColor || "",
pointerEvents: "auto"
}));
function s(c) {
t.emit("click"), c.preventDefault(), c.stopPropagation();
}
M(() => {
const c = o.value;
if (c) {
const y = c.getBoundingClientRect(), {
left: g,
top: p,
height: u
} = y;
return {
left: g,
top: p + u
};
}
return n.value;
});
const d = M(() => ({
// position: 'relative',
// left: `${position.value.left}px`,
// top: `${position.value.top}px`
}));
return () => i($t, {
to: "body"
}, {
default: () => {
var c, y;
return [i("div", {
class: "overlay-container",
onClick: (g) => s(g),
style: a.value
}, [i("div", {
style: d.value
}, [(y = (c = t.slots).default) == null ? void 0 : y.call(c)])])];
}
});
}
});
function ma(e) {
if (e.content && e.content.render)
return e.content.render;
if (e.render && typeof e.render == "function")
return e.render;
}
function va(e) {
const t = document.createElement("div");
t.style.display = "contents";
let n;
const o = e.onClickCallback || (() => {
}), a = () => {
o(), n && n.unmount();
};
return n = Mt({
setup() {
ft(() => {
document.body.removeChild(t);
});
const s = ma(e);
return () => i(fa, {
"popup-content-position": e.popupPosition,
host: e.host,
onClick: a,
backgroundColor: e.backgroundColor
}, {
default: () => [s && s()]
});
}
}), document.body.appendChild(t), n.mount(t), n;
}
class ga {
static show(t) {
return va(t);
}
}
const ha = {
/**
* 允许点击遮罩关闭对话框
*/
allowClickMaskToClose: { type: Boolean, default: !1 },
/**
* 关闭对话框前事件， 是个函数，返回true或者false
*/
beforeClose: { type: Function, default: () => !0 },
/**
* 自定义类
*/
class: { type: String, default: "" },
/**
* 自定义遮罩类
*/
maskClass: { type: String, default: "" },
/**
* 模态框标题
*/
title: { type: String, default: "" },
/**
* 模态框宽度
*/
width: { type: Number, default: 500 },
/**
* 模态框高度
*/
height: { type: Number, default: 320 },
/**
* 自定义按钮列表
*/
buttons: {
type: Array,
default: []
},
/**
* 是否展示模态框
*/
modelValue: { type: Boolean, default: !1 },
/**
* 是否模态
*/
mask: { type: Boolean, default: !0 },
/**
* 是否展示头部
*/
showHeader: { type: Boolean, default: !0 },
/**
* 是否展示默认按钮
*/
showButtons: { type: Boolean, default: !0 },
/**
* 是否启用自适应样式
*/
fitContent: { type: Boolean, default: !0 },
/**
* 是否展示右上角按钮
*/
showCloseButton: { type: Boolean, default: !0 },
showMaxButton: { type: Boolean, default: !1 },
minHeight: { type: Number },
maxHeight: { type: Number },
minWidth: { type: Number },
maxWidth: { type: Number },
containment: { type: Object, default: null },
resizeable: { type: Boolean, default: !1 },
draggable: { type: Boolean, default: !1 },
dragHandle: { type: Object, default: null },
closedCallback: { type: Function, default: null },
openedCallback: { type: Function, default: null },
// 窗口打开后的回调函数
resizeHandle: { type: Function, default: null },
render: { type: Function, default: null },
acceptCallback: { type: Function, default: null },
rejectCallback: { type: Function, default: null },
enableEsc: { type: Boolean, default: !0 },
enableEnter: { type: Boolean, default: !1 },
dialogType: { type: String, default: "" },
src: { type: String, default: "" },
footerHeight: { type: Number, default: 60 },
host: { type: Object, default: "body" },
isMessager: { type: Boolean, default: !1 },
maximized: { type: Boolean, default: !1 }
};
class ge {
constructor(t, n) {
this.x = t, this.y = n;
}
static getTransformInfo(t) {
const o = window.getComputedStyle(t).getPropertyValue("transform").replace(/[^-\d,]/g, "").split(",");
if (o.length >= 6) {
const a = parseInt(o[4], 10), s = parseInt(o[5], 10);
return { x: a, y: s };
}
return { x: 0, y: 0 };
}
static fromEvent(t, n = null) {
if (this.isMouseEvent(t))
return new ge(t.clientX, t.clientY);
if (n === null || t.changedTouches.length === 1)
return new ge(t.changedTouches[0].clientX, t.changedTouches[0].clientY);
for (let o = 0; o < t.changedTouches.length; o++)
if (t.changedTouches[o].target === n)
return new ge(t.changedTouches[o].clientX, t.changedTouches[o].clientY);
}
static isMouseEvent(t) {
return Object.prototype.toString.apply(t).indexOf("MouseEvent") === 8;
}
static isIPosition(t) {
return !!t && "x" in t && "y" in t;
}
static getCurrent(t) {
const n = new ge(0, 0);
if (window) {
const o = window.getComputedStyle(t);
if (o) {
const a = parseInt(o.getPropertyValue("left"), 10), s = parseInt(o.getPropertyValue("top"), 10);
n.x = isNaN(a) ? 0 : a, n.y = isNaN(s) ? 0 : s;
}
return n;
}
return null;
}
static copy(t) {
return new ge(0, 0).set(t);
}
get value() {
return { x: this.x, y: this.y };
}
add(t) {
return this.x += t.x, this.y += t.y, this;
}
subtract(t) {
return this.x -= t.x, this.y -= t.y, this;
}
multiply(t) {
this.x *= t, this.y *= t;
}
divide(t) {
this.x /= t, this.y /= t;
}
reset() {
return this.x = 0, this.y = 0, this;
}
set(t) {
return this.x = t.x, this.y = t.y, this;
}
}
class tt {
constructor(t, n) {
this.width = t, this.height = n;
}
static getCurrent(t) {
const n = new tt(0, 0);
if (window) {
const o = window.getComputedStyle(t);
return o && (n.width = parseInt(o.getPropertyValue("width"), 10), n.height = parseInt(o.getPropertyValue("height"), 10)), n;
}
return null;
}
static copy(t) {
return new tt(0, 0).set(t);
}
set(t) {
return this.width = t.width, this.height = t.height, this;
}
}
function pa(e, t) {
const n = m(), o = m(), a = m(), s = m(), d = m(), c = m(), y = m(), g = m(), p = m(), u = m(), w = m(), f = m(e.resizeable), r = m(), b = m(e.draggable), F = m(!1);
function x() {
const C = o.value || document.body, k = window.getComputedStyle(C);
if (!k || !n.value)
return;
const L = ge.getTransformInfo(n.value), N = {};
y.value && (N.deltaL = n.value.offsetLeft - y.value.x, N.deltaT = n.value.offsetTop - y.value.y);
const K = k.getPropertyValue("position");
N.width = C.clientWidth, N.height = C.clientHeight, N.pr = parseInt(k.getPropertyValue("padding-right"), 10), N.pb = parseInt(k.getPropertyValue("padding-bottom"), 10), N.position = k.getPropertyValue("position"), K === "static" && (C.style.position = "relative"), N.translateX = L.x, N.translateY = L.y, u.value = N;
}
function S(C) {
if (n.value) {
s.value = tt.getCurrent(n.value), d.value = ge.getCurrent(n.value), c.value = s.value ? tt.copy(s.value) : null, y.value = d.value ? ge.copy(d.value) : null, x();
const k = C.target.getAttribute("type") || "";
g.value = {
n: !!k.match(/n/),
s: !!k.match(/s/),
w: !!k.match(/w/),
e: !!k.match(/e/)
};
}
}
function H() {
var C, k, L, N;
if (n.value) {
const K = n.value;
g.value && ((g.value.n || g.value.s) && ((C = c.value) != null && C.height) && (K.style.height = c.value.height + "px"), (g.value.w || g.value.e) && ((k = c.value) != null && k.width) && (K.style.width = c.value.width + "px"), y.value && ((L = y.value) != null && L.x && (K.style.left = y.value.x + "px"), (N = y.value) != null && N.y && (K.style.top = y.value.y + "px")));
}
}
function q() {
const C = e.minHeight ? e.minHeight : 1, k = e.minWidth ? e.minWidth : 1;
c.value && y.value && g.value && s.value && (c.value.height < C && (c.value.height = C, g.value.n && d.value && (y.value.y = d.value.y + (s.value.height - C))), c.value.width < k && (c.value.width = k, g.value.w && d.value && (y.value.x = d.value.x + (s.value.width - k))), e.maxHeight && c.value.height > e.maxHeight && (c.value.height = e.maxHeight, d.value && g.value.n && (y.value.y = d.value.y + (s.value.height - e.maxHeight))), e.maxWidth && c.value.width > e.maxWidth && (c.value.width = e.maxWidth, g.value.w && d.value && (y.value.x = d.value.x + (s.value.width - e.maxWidth))));
}
function U() {
if (o.value) {
const C = u.value;
if (y.value && c.value && g.value && s.value) {
const k = C.width - C.pr - C.deltaL - C.translateX - y.value.x, L = C.height - C.pb - C.deltaT - C.translateY - y.value.y;
g.value.n && y.value.y + C.translateY < 0 && d.value && (y.value.y = -C.translateY, c.value.height = s.value.height + d.value.y + C.translateY), g.value.w && y.value.x + C.translateX < 0 && d.value && (y.value.x = -C.translateX, c.value.width = s.value.width + d.value.x + C.translateX), c.value.width > k && (c.value.width = k), c.value.height > L && (c.value.height = L);
}
}
}
function V(C) {
if (!a.value || !s.value || !d.value || !g.value)
return;
C.subtract(a.value);
const k = C.x, L = C.y;
g.value.n ? (y.value.y = d.value.y + L, c.value.height = s.value.height - L) : g.value.s && (c.value.height = s.value.height + L), g.value.e ? c.value.width = s.value.width + k : g.value.w && (c.value.width = s.value.width - k, y.value.x = d.value.x + k), U(), q(), H();
}
function O(C) {
if (!p.value)
return;
const k = ge.fromEvent(C);
k && V(k);
}
function E() {
if (n.value) {
const {
width: C,
height: k,
x: L,
y: N
} = n.value.getBoundingClientRect(), K = ge.getTransformInfo(n.value);
return {
size: {
width: C,
height: k
},
position: {
x: L - K.x,
y: N - K.y
}
};
}
return null;
}
function P(C) {
if (n.value) {
const k = E();
w.value = k;
}
a.value = void 0, s.value = null, d.value = null, c.value = null, y.value = null, g.value = null, p.value = null, document.removeEventListener("mousemove", O), document.removeEventListener("mouseup", P);
}
function B() {
document.addEventListener("mousemove", O), document.addEventListener("mouseup", P);
}
function D(C) {
C instanceof MouseEvent && C.button === 2 || b.value && (document.body.click(), C.stopPropagation(), C.preventDefault(), a.value = ge.fromEvent(C), p.value = C.target, S(C), B());
}
function Y(C) {
return n.value = C, f.value && i(Ie, null, [i("div", {
class: "fv-resizable-handle fv-resizable-n",
type: "n",
onMousedown: (k) => D(k)
}, null), i("div", {
class: "fv-resizable-handle fv-resizable-e",
type: "e",
onMousedown: (k) => D(k)
}, null), i("div", {
class: "fv-resizable-handle fv-resizable-s",
type: "s",
onMousedown: (k) => D(k)
}, null), i("div", {
class: "fv-resizable-handle fv-resizable-w",
type: "w",
onMousedown: (k) => D(k)
}, null), i("div", {
class: "fv-resizable-handle fv-resizable-ne",
type: "ne",
onMousedown: (k) => D(k)
}, null), i("div", {
class: "fv-resizable-handle fv-resizable-se fv-resizable-diagonal",
type: "se",
onMousedown: (k) => D(k)
}, null), i("div", {
class: "fv-resizable-handle fv-resizable-sw",
type: "sw",
onMousedown: (k) => D(k)
}, null), i("div", {
class: "fv-resizable-handle fv-resizable-nw",
type: "nw",
onMousedown: (k) => D(k)
}, null)]);
}
function Q(C = !0) {
document.body.click();
const k = o.value || document.body, L = tt.getCurrent(k), N = n.value;
C && N && (r.value = E(), r.value.transform = N.style.transform), L && N && (c.value = L, c.value.height -= 14, c.value.width -= 14, N.style.height = c.value.height + "px", N.style.width = c.value.width + "px", N.style.left = "7px", N.style.top = "7px", N.style.transform = "", w.value = {
size: c.value,
position: {
x: 0,
y: 0
}
}, b.value = !1, F.value = !0);
}
function le() {
var C, k;
if (document.body.click(), r.value) {
const L = {
width: r.value.size.width || 0,
height: r.value.size.height || 0
}, N = {
x: (window.innerWidth - L.width) / 2,
y: (window.innerHeight - L.height) / 2
};
(C = c.value) == null || C.set(L), (k = y.value) == null || k.set(N);
const K = n.value;
K.style.height = L.height + "px", K.style.width = L.width + "px", K.style.left = `${N.x}px`, K.style.top = `${N.y}px`, K.style.transform = "", w.value = {
size: L,
position: N
}, b.value = e.draggable, F.value = !1;
}
}
function ue() {
if (n.value) {
const C = tt.getCurrent(n.value);
if (C) {
const {
width: k,
height: L
} = C;
n.value.style.left = `${(window.innerWidth - k) / 2}px`, n.value.style.top = `${(window.innerHeight - L) / 2}px`, n.value.style.transform = "";
}
}
}
function _() {
const C = () => {
F.value ? Q(!1) : ue(), document.body.click();
};
return window.addEventListener("resize", C), () => {
window.removeEventListener("resize", C);
};
}
const j = _();
return {
renderResizeBar: Y,
boundingElement: o,
resizedEventParam: w,
maximize: Q,
restore: le,
allowDrag: b,
isMaximized: F,
unWindowResizeHandle: j,
moveToCenter: ue
};
}
function ya(e, t, n) {
const o = m(), a = m(e.draggable), s = m(e.lockAxis), d = m(), c = m(), y = m(!1), g = m(new ge(0, 0)), p = m(new ge(0, 0)), u = m(new ge(0, 0)), w = m(new ge(0, 0));
de(() => n.value, (O) => {
d.value.style.cursor = O ? "move" : "default";
});
function f(O, E) {
if (E.tagName === "BUTTON")
return !1;
if (E === O)
return !0;
for (const P in E.children)
if (Object.prototype.hasOwnProperty.call(E.children, P) && f(O, E.children[P]))
return !0;
return !1;
}
function r() {
var B, D;
let O = u.value.x + p.value.x, E = u.value.y + p.value.y;
s.value === "x" ? (O = ((B = g.value) == null ? void 0 : B.x) || 0, u.value.x = 0) : s.value === "y" && (E = ((D = g.value) == null ? void 0 : D.y) || 0, u.value.y = 0);
const P = `translate3d(${Math.round(O)}px, ${Math.round(E)}px, 0px)`;
o.value && (o.value.style.transform = P), w.value.x = O, w.value.y = E;
}
function b() {
if (!c.value || !o.value)
return null;
const O = c.value.getBoundingClientRect(), E = o.value.getBoundingClientRect(), P = {
top: O.top < E.top,
right: O.right > E.right,
bottom: O.bottom > E.bottom,
left: O.left < E.left
};
return P.top || (u.value.y -= E.top - O.top), P.bottom || (u.value.y -= E.bottom - O.bottom), P.right || (u.value.x -= E.right - O.right), P.left || (u.value.x -= E.left - O.left), r(), P;
}
function F(O) {
O && (g.value && O.subtract(g.value), u.value.set(O), r(), b());
}
function x(O) {
y.value && a.value && (O.stopPropagation(), O.preventDefault(), F(ge.fromEvent(O, d.value)));
}
function S() {
var O;
y.value && (y.value = !1, p.value.add(u.value), u.value.reset(), (O = o.value) == null || O.classList.remove("ng-dragging"), t.emit("stopMove"), document.removeEventListener("mousemove", x), document.removeEventListener("mouseup", S));
}
function H() {
!y.value && d.value && (y.value = !0, d.value.classList.add("ng-dragging"), document.addEventListener("mousemove", x), document.addEventListener("mouseup", S));
}
function q() {
if (o.value) {
const O = ge.getTransformInfo(o.value);
p.value.set(O);
return;
}
p.value.reset();
}
function U(O) {
if (!n.value || O instanceof MouseEvent && O.button === 2)
return;
const E = O.target || O.srcElement;
d.value !== void 0 && E && !f(E, d.value) || a.value !== !1 && (document.body.click(), O.stopPropagation(), O.preventDefault(), g.value = ge.fromEvent(O, o.value), q(), H());
}
function V(O, E, P) {
if (a.value && E) {
if (O)
d.value = O;
else if (e.dragHandle) {
if (e.dragHandle instanceof HTMLElement)
d.value = e.dragHandle;
else if (typeof e.dragHandle == "string") {
const B = E.querySelector(e.dragHandle);
B && (d.value = B);
}
}
o.value = E, c.value = P, d.value ? (d.value.classList.add("ng-draggable"), d.value.addEventListener("mousedown", U)) : a.value = !1;
}
}
return {
registerDraggle: V,
resetTranslate: q
};
}
function Zt(e, t) {
if (e) {
const n = (o) => {
o.key.toLowerCase() === e.toLowerCase() && t({ event: o, key: e });
};
return document.addEventListener("keydown", n), () => {
document.removeEventListener("keydown", n);
};
}
}
function ba(e, t) {
const n = m(e.enableEsc);
let o = null;
return n.value ? (o = Zt("Escape", (a) => {
t.emit("esc", { event: a.event, type: "esc" });
}), {
remove: o
}) : null;
}
function Ca(e, t) {
const n = m(e.enableEnter);
let o = null;
return n.value ? (o = Zt("Enter", (a) => {
t.emit("enter", { event: a.event, type: "enter" });
}), {
remove: o
}) : null;
}
const st = /* @__PURE__ */ Ae({
name: "FModal",
props: ha,
emits: ["update:modelValue", "accept", "cancel", "closed", "resize", "esc", "enter", "stopMove"],
setup(e, t) {
const n = m(e.width || 300), o = m(e.height || 200), a = m(e.modelValue), s = m(""), d = m(e.class), c = m(e.fitContent), y = m(e.showHeader), g = m(""), p = m(e.showCloseButton), u = m(e.showMaxButton), w = m(!1), f = m(e.dialogType), r = m(e.src), b = m(""), F = m(e.showButtons), x = m(e.title), S = m(e.containment || null), H = m();
x.value === "错误提示" && (x.value = We.getLocaleValue("messageBox.errorTitle"));
const q = m(!1);
function U(T, W) {
const oe = W ? "accept" : "cancel";
Promise.resolve().then(() => {
var ie;
return (ie = e.beforeClose) == null ? void 0 : ie.call(e, {
closeType: oe
});
}).then((ie) => {
ie && (a.value = !1, t.emit("update:modelValue", !1), W != null && t.emit(W ? "accept" : "cancel"), t.emit("closed", T));
});
}
const V = [{
name: "cancel",
text: We.getLocaleValue("messageBox.cancel") || "取消",
class: "btn btn-secondary",
handle: (T) => {
U(T, !1);
}
}, {
name: "accept",
text: We.getLocaleValue("messageBox.ok") || "确定",
class: "btn btn-primary",
handle: (T) => {
U(T, !0);
}
}], O = m(e.buttons && e.buttons.length ? e.buttons : V), E = M(() => !!g.value), P = M(() => !!F.value && !!O.value), B = m(), D = m(), Y = m(e.maximized || !1), {
renderResizeBar: Q,
maximize: le,
restore: ue,
boundingElement: _,
resizedEventParam: j,
allowDrag: C,
unWindowResizeHandle: k,
moveToCenter: L
} = pa(e), {
registerDraggle: N
} = ya(e, t, C);
function K() {
return !!document.querySelectorAll(".farris-modal").length && document.body.classList.contains("modal-open");
}
function ve() {
const T = document.querySelectorAll(".farris-modal").length;
(!T || T - 1 <= 0) && document.body.classList.remove("modal-open"), H.value && H.value.classList.remove("show");
}
de(() => e.title, (T, W) => {
T !== W && (x.value = T);
}), de(() => e.modelValue, (T, W) => {
T !== W && (a.value = T, a.value && e.draggable && nt(() => {
D.value && !S.value && (S.value = D.value.parentElement, _.value = S.value, N(B.value, D.value, _.value), L());
}), T || (S.value && (S.value = null), ve())), a.value ? q.value = K() : (Y.value = !1, C.value = e.draggable);
}), de(() => e.showHeader, (T, W) => {
T !== W && (y.value = T);
}), de(() => e.showButtons, (T, W) => {
T !== W && (F.value = T);
}), de(() => j.value, (T, W) => {
const oe = T || {}, ie = W || {};
JSON.stringify(oe) !== JSON.stringify(ie) && t.emit("resize", {
newSize: T,
oldSize: W,
isMaximized: Y.value
});
}), de([() => e.width, () => e.height], (T, W) => {
(T[0] !== W[0] || T[1] !== W[1]) && (n.value = T[0] || 500, o.value = T[1] || 600);
}), de(() => e.class, (T, W) => {
d.value = T;
});
const ce = M(() => (a.value && document.body.classList.add("modal-open"), a.value)), pe = M(() => {
var oe;
const T = {
modal: !0,
"farris-modal": !0,
fade: !0
};
T["f-modal-fitContent"] = !!c.value, T.show = !!ce.value;
const W = (oe = e.maskClass) == null ? void 0 : oe.split(" ");
return W == null || W.reduce((ie, ye) => (ie[ye] = !0, ie), T), T;
}), he = M(() => {
var oe;
const T = {
"modal-dialog": !0
}, W = (oe = d.value) == null ? void 0 : oe.split(" ");
return W == null || W.reduce((ie, ye) => (ie[ye] = !0, ie), T), T;
}), Re = () => lo() && !e.isMessager, be = M(() => {
const T = document.documentElement.clientWidth, W = document.documentElement.clientHeight;
if (Y.value)
return {
position: "fixed",
top: "0px",
left: "0px",
width: "100vw",
height: "100vh",
margin: "0"
};
const oe = Math.min(n.value, T), ie = c.value ? "auto" : `${Math.min(o.value, W - 10)}px`, ye = {
position: "absolute",
top: `${(window.innerHeight - parseInt(ie === "auto" ? "0" : ie)) / 2}px`,
left: `${(window.innerWidth - oe) / 2}px`,
width: `${oe}px`,
height: ie
};
return Re() && (ye.top = "0px", ye.left = "0px", ye.width = `${window.innerWidth}px`, ye.height = `${window.innerHeight}px`), e.mask || (ye.pointerEvents = "auto"), ye;
}), Fe = m(Wt() || 1050), Ye = M(() => {
const T = {
display: "block",
overflow: "hidden"
};
return e.mask || (T.pointerEvents = "none", T.backgroundColor = "transparent"), q.value && (T.backgroundColor = "transparent"), T.zIndex = Fe.value, T;
}), we = M(() => ({
"modal-content": !0,
"modal-content-has-header": y.value,
"is-mobile": Re()
})), je = M(() => {
const T = {
display: y.value ? "" : "none"
};
return T["pointer-events"] = C.value ? "auto" : "none", T;
}), De = M(() => ({
"f-icon": !0,
modal_maximize: !0,
modalrevert: Y.value
})), xe = M(() => ({
"modal-body": !0,
"f-utils-flex-column": f.value === "iframe",
"f-utils-fill": !0
}));
function fe() {
return {
height: `${e.footerHeight || 60}px`
};
}
const Xe = M(() => {
const T = {
textAlgin: b.value
}, W = fe();
return Object.assign(T, W);
});
function Be(T) {
if (T == null || T.stopPropagation(), Y.value) {
Y.value = !1, ue();
return;
}
le(), Y.value = !0;
}
async function Ge(T, W) {
T.handle && await T.handle(W, T) && t.emit("closed", W);
}
function ot(T) {
T.width && (n.value = T.width), T.height && (o.value = T.height), T.buttons && (O.value = T.buttons), T.title && (x.value = T.title);
}
let $e = null, ke = null;
qn(() => {
q.value = K();
}), it(() => {
D.value && !S.value && (S.value = D.value.parentElement, _.value = S.value, N(B.value, D.value, _.value)), ce.value && document.body.classList.add("modal-open"), $e = ba(e, t), ke = Ca(e, t);
}), ft(() => {
k && k(), $e && $e.remove(), ke && ke.remove();
}), t.expose({
modalElementRef: D,
updateModalOptions: ot,
close: U,
maxDialog: Be,
isMaximized: Y,
disableButtons: (T, W = !0) => {
O.value.forEach((oe) => {
oe.name && T.includes(oe.name) && (oe.disabled = W);
});
}
});
function _e() {
return i("ul", null, [w.value && i("li", {
class: "f-btn-icon f-bare"
}, [i("span", {
class: "f-icon modal_minimize"
}, null)]), u.value && i("li", {
onClick: Be,
class: "f-btn-icon f-bare",
style: "pointer-events: auto;"
}, [i("span", {
class: De.value
}, null)]), p.value && i("li", {
class: "f-btn-icon f-bare",
onClick: (T) => U(T, !1),
style: "pointer-events: auto;"
}, [i("span", {
class: "f-icon modal_close"
}, null)])]);
}
function Ue() {
return i("div", {
class: "modal-footer",
style: Xe.value
}, [O.value && O.value.map((T) => {
const W = m(T.disabled);
return i("button", {
name: T.name,
style: T.styles,
type: "button",
disabled: W.value,
class: T.class + (T.iconClass ? " btn-icontext" : ""),
onClick: (oe) => {
Ge(T, oe);
}
}, [!!T.iconClass && i("i", {
class: T.iconClass
}, null), T.text]);
})]);
}
function He(T) {
u.value && Be();
}
function ze() {
return i(Ie, null, [Y.value && i("div", {
class: "modal-header",
style: "position: absolute;background: transparent;height: 45px;width: 100%;",
onDblclick: (T) => He()
}, null), i("div", {
ref: B,
class: "modal-header",
style: je.value,
onDblclick: (T) => He()
}, [t.slots.headerTemplate ? t.slots.headerTemplate() : i("div", {
class: "modal-title"
}, [E.value && i("span", {
class: g.value,
style: "margin-right: 8px"
}, null), i("span", {
class: "modal-title-label"
}, [x.value])]), i("div", {
class: "actions"
}, [_e()])])]);
}
function qe() {
return t.slots.footerTemplate ? t.slots.footerTemplate() : P.value && Ue();
}
function Je(T) {
if (T.stopPropagation(), e.allowClickMaskToClose) {
if (T.target !== H.value)
return;
U(T, !1);
}
}
function re() {
var T, W;
return i("div", {
id: s.value,
class: he.value,
style: be.value,
ref: D
}, [i("div", {
class: we.value
}, [y.value && ze(), i("div", {
class: xe.value
}, [(W = (T = t.slots).default) == null ? void 0 : W.call(T), f.value === "iframe" && i("iframe", {
title: s.value,
class: "f-utils-fill",
width: "100%",
frameborder: "0",
src: r.value
}, null)]), qe()]), !c.value && D.value && !Y.value && Q(D.value)]);
}
function Ze(T) {
return T || "body";
}
return Jn(() => {
ce.value && (Fe.value = Wt() || 1050);
}), () => i($t, {
to: Ze(e.host)
}, {
default: () => [ce.value && i(_t, {
name: "fade",
appear: !0
}, {
default: () => [i("div", {
ref: H,
class: pe.value,
style: Ye.value,
onClick: Je
}, [re()])]
})]
});
}
});
function Qt(e) {
if (e.content && e.content.render)
return e.content.render;
if (e.render && typeof e.render == "function")
return e.render;
}
function wa(e) {
const t = document.createElement("div");
t.style.display = "contents";
const n = Mt({
setup(o, a) {
ft(() => {
document.body.removeChild(t);
});
const s = m(), d = m(e.class || ""), c = m(!!e.showButtons), y = m(!!e.showHeader), g = m(e.showCloseButton == null ? !0 : e.showCloseButton), p = m(!0), u = m(e.title || ""), w = e.acceptCallback || (() => {
}), f = e.rejectCallback || (() => {
}), r = e.closedCallback || ((H) => {
}), b = e.resizeHandle || ((H) => {
}), F = e.stopMoveHandle || ((H) => {
}), x = Qt(e), S = (H) => {
p.value = !1, n.unmount(), r(H);
};
return it(() => {
}), a.expose({
modalRef: s
}), () => i(st, {
ref: s,
class: d.value,
modelValue: p.value,
"onUpdate:modelValue": (H) => p.value = H,
title: u.value,
width: e.width,
height: e.height,
buttons: e.buttons,
"show-header": y.value,
"show-buttons": c.value,
"show-close-button": g.value,
"show-max-button": !1,
onAccept: w,
onCancel: f,
fitContent: e.fitContent == null ? !0 : e.fitContent,
onClosed: S,
onResize: b,
onStopMove: F
}, {
default: () => [x && x(n)]
});
}
});
return document.body.appendChild(t), n.use(We.i18n), n.mount(t), n;
}
class Kt {
// private activeModalInstance = computed(() => {
// return this.modalRefs[this.activeModalIndex.value];
// });
constructor(t) {
Le(this, "appContext", null);
Le(this, "modalRef", m());
Le(this, "activeModalIndex", m(0));
Le(this, "modalRefs", {});
Le(this, "isUseEscCloseModal", m(!1));
this.app = t, this.appContext = t ? t._context : null;
}
getCurrentModal() {
return this.modalRefs[this.activeModalIndex.value];
}
adaptToWindow(t, n) {
const {
width: o,
height: a
} = {
width: window.innerWidth,
height: window.innerHeight
};
return o < t && (t = o - 14), a < n && (n = a - 14), {
width: t,
height: n
};
}
static show(t) {
const n = Object.assign({
title: "",
showButtons: !0,
showHeader: !0
}, t);
return wa(n);
}
close(t) {
var n, o;
t ? (o = t.value) == null || o.close() : (n = this.getCurrentModal()) == null || n.close();
}
open(t) {
const n = document.createDocumentFragment();
t.showMaxButton && t.fitContent && (t.showMaxButton = !1);
const o = Zn(Object.assign({
title: "",
showButtons: !0,
showHeader: !0,
maximized: !1
}, t)), a = m(!0), s = o.value.acceptCallback || (() => {
}), d = o.value.rejectCallback || (() => {
}), c = o.value.closedCallback || ((E, P) => {
}), y = o.value.openedCallback || ((E) => {
}), g = o.value.resizeHandle || ((E) => {
}), p = t.stopMoveHandle || ((E) => {
});
let u;
const w = Qt(o.value), f = (E) => {
var B;
a.value = !1;
const P = (B = E == null ? void 0 : E.target) == null ? void 0 : B.classList.contains("modal_close");
c(E, this.isUseEscCloseModal.value ? "esc" : P ? "icon" : "button");
}, r = (E) => {
f(E), u && nt(() => {
if (this.modalRefs[this.activeModalIndex.value] && delete this.modalRefs[this.activeModalIndex.value], Tt(null, n), u = null, this.modalRef.value = null, this.modalRefs) {
const P = Object.keys(this.modalRefs).map((B) => Number(B));
P.length > 0 ? this.activeModalIndex.value = Math.max(...P) : this.activeModalIndex.value = 0;
}
this.isUseEscCloseModal.value = !1;
});
}, b = (E) => {
var P;
this.isUseEscCloseModal.value = !0, (P = this.getCurrentModal()) == null || P.close(E == null ? void 0 : E.event);
}, {
width: F,
height: x
} = o.value, S = this.adaptToWindow(F || 500, x || 320);
Object.assign(o.value, S);
const H = m(), q = () => i(st, Ct({
ref: H,
modelValue: a.value,
"onUpdate:modelValue": (E) => a.value = E
}, o.value, {
isMessager: o.value.class && o.value.class.indexOf("modal-message") > -1,
onAccept: s,
onCancel: d,
onClosed: r,
onResize: g,
onEsc: b,
onStopMove: p,
maximized: o.value.maximized
}), {
default: () => [w && w(this.app)]
});
u = ((E) => {
const P = Qn(q, E);
return P.appContext = this.appContext, Tt(P, n), P;
})({
...o.value
// 'onUpdate:modelValue': onUpdateModelValue,
}), this.activeModalIndex.value++;
const V = this.activeModalIndex.value;
this.modalRefs[V] = H.value;
const O = (E) => {
o.value = {
...o.value,
...E
}, u && Tt(Kn(u, {
...o
}), n);
};
return nt(() => {
this.modalRefs[V] = H.value, this.modalRef.value = H.value, y(new Event("opened"));
}), {
update: O,
destroy: r,
modalRef: this.modalRef,
close: () => {
this.modalRefs[V] && this.modalRefs[V].close();
},
disableButtons: (E, P = !0) => {
this.modalRefs[V] && this.modalRefs[V].disableButtons(E, P);
}
};
}
}
const ct = Symbol("FModalService");
st.install = (e) => {
e.component(st.name, st);
const t = new Kt(e);
e.provide(ct, t), e.provide("FModalService", t);
};
function en(e, t) {
function n() {
const o = e.beforeOpen || e.beforeClickButton || null;
let a = Promise.resolve(!0);
if (o) {
const s = o(t.value);
if (typeof s > "u")
return a;
typeof s == "boolean" ? a = Promise.resolve(s) : a = s;
}
return a;
}
return { judgeCanOpen: n };
}
function xa(e, t, n, o, a) {
const s = m(e.buttonBehavior), d = m(e.popupOnInput), c = M(() => ({
"input-group-append": !0,
"append-force-show": e.showButtonWhenDisabled && (e.readonly || e.disable)
})), { judgeCanOpen: y } = en(e, a), g = M(() => e.showButtonWhenDisabled || (!e.editable || !e.readonly) && !e.disable), p = ht(ct, null), u = m();
async function w(b) {
if (await y() && g.value) {
const F = !!t.slots.default;
if (s.value === "Modal") {
const x = e.modalOptions, S = p == null ? void 0 : p.open({
...x,
render: () => t.slots.default && t.slots.default()
});
u.value = S == null ? void 0 : S.modalRef;
}
s.value === "Overlay" && ga.show({
// host: buttonEditRef.value,
host: document.body,
backgroundColor: "rgba(0,0,0,.15)",
render: () => t.slots.default && t.slots.default()
}), F && s.value === "Popup" && o.togglePopup(!0), F && d.value && o.hidePopup(), t.emit("clickButton", { origin: b, value: e.modelValue });
}
}
function f(b) {
t.emit("mouseEnterIcon", b);
}
function r(b) {
t.emit("mouseLeaveIcon", b);
}
return {
buttonGroupClass: c,
onClickButton: w,
onMouseEnterButton: f,
onMouseLeaveButton: r,
modalRef: u
};
}
function Sa(e, t, n, o, a, s) {
const d = m(!1), c = M(() => e.enableClear && !e.readonly && !e.disable), { changeTextBoxValue: y, hasClearClass: g } = s;
function p(r) {
d.value = r, g.value = r;
}
de(a, () => {
p(!!a.value);
});
function u(r) {
const b = !e.readonly && !e.disable && e.editable, F = !e.editable;
r.stopPropagation(), (b || F) && (y(""), a.value = "", p(!d.value), t.emit("clear"));
}
function w(r) {
if (c.value) {
if (!n.value) {
p(!1);
return;
}
!e.disable && !e.readonly && p(!0);
}
}
function f(r) {
c.value && p(!1);
}
return {
enableClearButton: c,
showClearButton: d,
onClearValue: u,
onMouseEnterTextBox: w,
onMouseLeaveTextBox: f
};
}
function Ta(e, t, n, o, a) {
const s = M(() => e.popupOnInput), d = M(() => e.popupOnFocus), { shouldPopupContent: c, closeAllPopover: y } = a, g = m(!1), p = M(() => e.enableTitle ? n.value : ""), u = M(() => (e.disable || e.readonly) && !e.forcePlaceholder ? "" : e.placeholder), w = M(() => e.readonly || !e.editable), f = m(!1), r = M(() => !e.disable && f.value), b = M(() => ({
"text-left": e.textAlign === "left",
"text-center": e.textAlign === "center",
"text-right": e.textAlign === "right",
"form-control": !0,
"f-utils-fill": !0
})), F = M(() => ({
"input-group": !0,
"f-state-disabled": e.disable,
"f-state-editable": e.editable && !e.disable && !e.readonly,
"f-state-readonly": e.readonly,
"f-state-focus": r.value,
"input-group--has-clear": e.enableClear && g.value
}));
function x(D, Y = !0) {
n.value = D, Y && (t.emit("change", D), t.emit("update:modelValue", D));
}
function S(D) {
c.value = !1, x(D, !0);
}
de(
() => e.modelValue,
(D) => {
n.value = D;
}
);
function H(D) {
f.value = !1, t.emit("blur", D), D.stopPropagation();
}
function q(D) {
t.emit("click", D), y(), t.slots.default && !e.disable && !e.readonly && e.popupOnClick && a.togglePopup();
}
function U(D) {
!e.disable && !e.readonly && (f.value = !0, w.value || (t.emit("focus", D), d.value && !c.value && a.popup()));
}
function V(D) {
t.emit("input", D);
const Y = D.target.value;
o.value = Y, n.value !== Y && x(Y, e.updateOn === "change"), s.value && !c.value && a.popup();
}
function O(D) {
D.target.tagName !== "INPUT" && D.preventDefault(), D.stopPropagation();
}
function E(D) {
t.emit("keydown", D);
}
function P(D) {
D.key === "Enter" && (s.value || d.value) && a.hidePopup(), t.emit("keyup", D);
}
function B(D) {
const Y = D.target.value;
D.stopPropagation(), x(Y);
}
return {
hasFocusedTextBox: r,
isTextBoxReadonly: w,
textBoxClass: b,
textBoxPlaceholder: u,
textBoxTitle: p,
inputGroupClass: F,
hasClearClass: g,
changeTextBoxValue: x,
commitValue: S,
onBlurTextBox: H,
onClickTextBox: q,
onFocusTextBox: U,
onInput: V,
onKeyDownTextBox: E,
onKeyUpTextBox: P,
onMouseDownTextBox: O,
onTextBoxValueChange: B
};
}
const et = "FarrisVue_PopoverInstancesKey";
function Fa(e, t, n, o) {
const a = m(), s = m(!1), { judgeCanOpen: d } = en(e, o);
de(() => a.value, (f, r) => {
window[et] = window[et] || /* @__PURE__ */ new WeakMap(), f ? window[et].set(n.value, f) : window[et].delete(n.value);
});
function c() {
if (window[et]) {
const f = window[et];
document.querySelectorAll(".f-button-edit,.v-popover").forEach((r) => {
const b = f.get(r);
b && r !== n.value && !n.value.closest(".popover-fitcontent") && b.hide();
});
}
}
function y() {
const f = a.value;
f && f.show(n.value);
}
async function g(f = !1) {
if (!!t.slots.default) {
if (!f && !s.value && !await d())
return;
s.value = !s.value, s.value && (await nt(), y());
}
}
async function p(f = !1) {
if (!!t.slots.default) {
if (!f && !await d())
return;
s.value = !0, await nt(), y();
}
}
function u() {
s.value = !1;
}
function w() {
s.value = !0, nt(() => {
y();
});
}
return { hidePopup: u, showPopup: w, popup: p, shouldPopupContent: s, togglePopup: g, popoverRef: a, closeAllPopover: c };
}
function Ba(e, t, n) {
const o = m(), {
isTextBoxReadonly: a,
textBoxClass: s,
textBoxPlaceholder: d,
textBoxTitle: c,
onBlurTextBox: y,
onClickTextBox: g,
onFocusTextBox: p,
onInput: u,
onKeyDownTextBox: w,
onKeyUpTextBox: f,
onMouseDownTextBox: r,
onTextBoxValueChange: b
} = n, F = m(e.id), {
uuid: x
} = io(), S = M(() => ({
// 'border-top-right-radius': '6px',
// 'border-bottom-right-radius': '6px'
}));
it(() => {
var O, E;
e.selectOnCreated && ((O = o.value) == null || O.select()), e.focusOnCreated && ((E = o.value) == null || E.focus({
preventScroll: !0
})), F.value || (F.value = "button-edit_" + x(8)), F.value = F.value + "-textbox";
});
const H = m(!1), q = (O) => {
O.preventDefault(), H.value = !0;
}, U = (O) => {
O.preventDefault(), H.value = !1, u(O);
};
function V(O) {
H.value || u(O);
}
return () => i("input", {
id: e.id ? e.id + "-textbox" : void 0,
ref: o,
name: "input-group-value",
autocomplete: e.autoComplete ? "on" : "off",
class: s.value,
style: S.value,
disabled: e.disable,
maxlength: e.maxLength,
minlength: e.minLength,
placeholder: d.value,
readonly: a.value,
tabindex: e.tabIndex,
title: c.value,
type: e.inputType,
value: t.value,
onBlur: y,
onChange: b,
onClick: g,
onFocus: p,
onInput: V,
onKeydown: w,
onKeyup: f,
onMousedown: r,
onCompositionend: U,
onCompositionstart: q
}, null);
}
function ka(e, t, n) {
const o = m(e.separator), a = M(() => e.readonly || e.disable), {
changeTextBoxValue: s,
onFocusTextBox: d,
onBlurTextBox: c,
onClickTextBox: y,
textBoxPlaceholder: g
} = n, p = M(() => t.value ? t.value.split(o.value).map((r) => ({
name: r,
selectable: !0
})) : []);
function u(r) {
s(r.map((b) => b.name).join(o.value), !0);
}
de(() => e.separator, (r) => {
o.value = r;
});
const w = m(!e.disable && !e.readonly);
de([() => e.disable, () => e.readonly], ([r, b], [F, x]) => {
w.value = !r && !b;
});
function f(r) {
y(r);
}
return () => i(so, {
tabindex: e.tabIndex,
onFocus: d,
onBlur: c,
id: `${e.id}-tag-editor`,
class: "form-control",
placeholder: g.value,
data: p.value,
showClose: !a.value,
showInput: !0,
disable: a.value,
onChange: u,
onClick: f
}, null);
}
function Oa(e, t, n, o) {
const {
buttonGroupClass: a,
onClickButton: s,
onMouseEnterButton: d,
onMouseLeaveButton: c
} = n, {
enableClearButton: y,
showClearButton: g,
onClearValue: p
} = o, u = m(), w = co((r) => {
s(r);
}, e.buttonBehavior === "Modal" ? 0 : 200), f = () => {
t.emit("beforeClearValue");
};
return {
renderButtonGroup: () => i("div", {
id: e.id ? `${e.id}-button-group` : void 0,
class: a.value
}, [y.value && eo(i("span", {
class: "input-group-text input-group-clear",
onClick: p,
onMousedown: f
}, [i("i", {
class: "f-icon modal_close"
}, null)]), [[to, g.value]]), t.slots.buttonContent ? i("span", {
class: "input-group-text input-group-append-button",
onClick: w,
onMouseenter: d,
onMouseleave: c
}, [t.slots.buttonContent()]) : e.buttonContent ? i("span", {
class: "input-group-text input-group-append-button",
innerHTML: e.buttonContent,
ref: u,
onClick: (r) => w(r),
onMouseenter: d,
onMouseleave: c
}, null) : null]),
buttonHandleElement: u
};
}
function Ma(e, t, n) {
const o = m(e.popupMinWidth), {
hidePopup: a,
popoverRef: s
} = n, d = () => {
t.emit("shown");
};
return () => i(fo, {
id: `${e.id}-popover`,
ref: s,
placement: e.placement,
host: e.popupHost,
"keep-width-with-reference": e.keepWidthWithReference,
fitContent: !0,
"right-boundary": e.popupRightBoundary,
minWidth: o.value,
class: e.popupClass,
offsetX: e.popupOffsetX,
onHidden: a,
onShown: d,
beforeClose: e.beforeClosePopup,
limitContentBySpace: e.limitContentBySpace
}, {
default: () => {
var c, y;
return [(y = (c = t.slots).default) == null ? void 0 : y.call(c)];
}
});
}
const tn = /* @__PURE__ */ Ae({
name: "FButtonEdit",
props: ca,
emits: ["updateExtendInfo", "clear", "change", "click", "clickButton", "blur", "focus", "mouseEnterIcon", "mouseLeaveIcon", "keyup", "keydown", "inputClick", "input", "update:modelValue", "beforeClearValue", "shown"],
setup(e, t) {
const n = m(), o = m(e.customClass), a = m(e.modelValue), s = Fa(e, t, n, a), {
shouldPopupContent: d,
hidePopup: c,
showPopup: y,
togglePopup: g
} = s, p = xa(e, t, n, s, a), u = m(""), w = Ta(e, t, a, u, s), {
hasFocusedTextBox: f,
commitValue: r,
inputGroupClass: b
} = w, F = Sa(e, t, a, f, u, w), {
onMouseEnterTextBox: x,
onMouseLeaveTextBox: S
} = F, H = m(!1), q = M(() => {
const _ = {
"f-button-edit": !0,
"f-cmp-inputgroup": !0,
"f-button-edit-nowrap": !e.wrapText
};
return o.value && o.value.split(" ").reduce((j, C) => (j[C] = !0, j), _), _;
}), U = M(() => ({
overflow: e.wrapText ? "hidden" : ""
})), V = M(() => ({
// paddingLeft: '3px',
// backgroundColor: '#fff'
}));
function O() {
if (!e.multiSelect || e.