@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
1,753 lines • 97.4 kB
JavaScript
var Nt = Object.defineProperty;
var Lt = (n, e, t) => e in n ? Nt(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
var q = (n, e, t) => Lt(n, typeof e != "symbol" ? e + "" : e, t);
import { defineComponent as me, ref as j, computed as Q, watch as pe, createVNode as x, createTextVNode as be, getCurrentInstance as Ft, onMounted as ve, onUnmounted as it, nextTick as _e, inject as ie, provide as Vt, onBeforeUnmount as Ht, withModifiers as qt } from "vue";
import { isPlainObject as et, cloneDeep as je } from "lodash-es";
import Ut from "../response-toolbar/index.esm.js";
import { getCustomClass as Ce, withInstall as Wt } from "../common/index.esm.js";
import { useDesignerInnerComponent as zt, useDesignerComponent as Xt } from "../designer-canvas/index.esm.js";
const at = {}, st = {};
function $e(n) {
const { properties: e, title: t, ignore: o } = n, i = o && Array.isArray(o), a = Object.keys(e).reduce((c, g) => ((!i || !o.find((f) => f === g)) && (c[g] = e[g].type === "object" && e[g].properties ? $e(e[g]) : je(e[g].default)), c), {});
if (t && (!i || !o.find((c) => c === "id"))) {
const c = t.toLowerCase().replace(/-/g, "_");
a.id = `${c}_${Math.random().toString().slice(2, 6)}`;
}
return a;
}
function Yt(n) {
const { properties: e, title: t, required: o } = n;
if (o && Array.isArray(o)) {
const i = o.reduce((a, c) => (a[c] = e[c].type === "object" && e[c].properties ? $e(e[c]) : je(e[c].default), a), {});
if (t && o.find((a) => a === "id")) {
const a = t.toLowerCase().replace(/-/g, "_");
i.id = `${a}_${Math.random().toString().slice(2, 6)}`;
}
return i;
}
return {
type: t
};
}
function he(n, e = {}, t) {
const o = at[n];
if (o) {
let i = Yt(o);
const a = st[n];
return i = a ? a({ getSchemaByType: he }, i, e, t) : i, i;
}
return null;
}
function Gt(n, e) {
const t = $e(e);
return Object.keys(t).reduce((o, i) => (Object.prototype.hasOwnProperty.call(n, i) && (o[i] && et(o[i]) && et(n[i] || !n[i]) ? Object.assign(o[i], n[i] || {}) : o[i] = n[i]), o), t), t;
}
function lt(n, e) {
return Object.keys(n).filter((o) => n[o] != null).reduce((o, i) => {
if (e.has(i)) {
const a = e.get(i);
if (typeof a == "string")
o[a] = n[i];
else {
const c = a(i, n[i], n);
Object.assign(o, c);
}
} else
o[i] = n[i];
return o;
}, {});
}
function Qt(n, e, t = /* @__PURE__ */ new Map()) {
const o = Gt(n, e);
return lt(o, t);
}
function Jt(n = {}) {
function e(u, v, l, p) {
if (typeof l == "number")
return p[u].length === l;
if (typeof l == "object") {
const r = Object.keys(l)[0], s = l[r];
if (r === "not")
return Number(p[u].length) !== Number(s);
if (r === "moreThan")
return Number(p[u].length) >= Number(s);
if (r === "lessThan")
return Number(p[u].length) <= Number(s);
}
return !1;
}
function t(u, v, l, p) {
return p[u] && p[u].propertyValue && String(p[u].propertyValue.value) === String(l);
}
const o = /* @__PURE__ */ new Map([
["length", e],
["getProperty", t]
]);
Object.keys(n).reduce((u, v) => (u.set(v, n[v]), u), o);
function i(u, v) {
const l = u;
return typeof v == "number" ? [{ target: l, operator: "length", param: null, value: Number(v) }] : typeof v == "boolean" ? [{ target: l, operator: "getProperty", param: u, value: !!v }] : typeof v == "object" ? Object.keys(v).map((p) => {
if (p === "length")
return { target: l, operator: "length", param: null, value: v[p] };
const r = p, s = v[p];
return { target: l, operator: "getProperty", param: r, value: s };
}) : [];
}
function a(u) {
return Object.keys(u).reduce((l, p) => {
const r = i(p, u[p]);
return l.push(...r), l;
}, []);
}
function c(u, v) {
if (o.has(u.operator)) {
const l = o.get(u.operator);
return l && l(u.target, u.param, u.value, v) || !1;
}
return !1;
}
function g(u, v) {
return a(u).reduce((r, s) => r && c(s, v), !0);
}
function f(u, v) {
const l = Object.keys(u), p = l.includes("allOf"), r = l.includes("anyOf"), s = p || r, _ = (s ? u[s ? p ? "allOf" : "anyOf" : "allOf"] : [u]).map((M) => g(M, v));
return p ? !_.includes(!1) : _.includes(!0);
}
return { parseValueSchema: f };
}
const Zt = {
button: { type: "button", name: "按钮" },
"response-toolbar": { type: "response-toolbar", name: "工具栏" },
"response-toolbar-item": { type: "response-toolbar-item", name: "按钮" },
"content-container": { type: "content-container", name: "容器" },
"input-group": { type: "input-group", name: "文本" },
textarea: { type: "textarea", name: "多行文本" },
lookup: { type: "lookup", name: "帮助" },
"number-spinner": { type: "number-spinner", name: "数值" },
"date-picker": { type: "date-picker", name: "日期" },
switch: { type: "switch", name: "开关" },
"radio-group": { type: "radio-group", name: "单选组" },
"check-box": { type: "check-box", name: "复选框" },
"check-group": { type: "check-group", name: "复选框组" },
"combo-list": { type: "combo-list", name: "下拉列表" },
"response-form": { type: "response-form", name: "卡片面板" },
"response-layout": { type: "response-layout", name: "布局容器", icon: "response-layout-3" },
"response-layout-item": { type: "response-layout-item", name: "布局", icon: "response-layout-1" },
"tree-grid": { type: "tree-grid", name: "树表格" },
"tree-grid-column": { type: "tree-grid-column", name: "树表格列" },
"data-grid": { type: "data-grid", name: "表格" },
"data-grid-column": { type: "data-grid-column", name: "表格列" },
module: { type: "Module", name: "模块" },
component: { type: "component", name: "组件" },
tabs: { type: "tabs", name: "标签页" },
"tab-page": { type: "tab-page", name: "标签页项", dependentParentControl: "Tab" },
"tab-toolbar-item": { type: "tab-toolbar-item", name: "标签页工具栏按钮" },
"time-picker": { type: "time-picker", name: "时间选择" },
section: { type: "section", name: "分组面板" },
"section-toolbar": { type: "section-toolbar", name: "分组面板工具栏" },
"section-toolbar-item": { type: "section-toolbar-item", name: "分组面板按钮" },
splitter: { type: "splitter", name: "分栏面板" },
"splitter-pane": { type: "splitter-pane", name: "分栏面板项", dependentParentControl: "Splitter" },
"component-ref": { type: "component-ref", name: "组件引用节点" },
uploader: { type: "uploader", name: "附件上传" },
"page-header": { type: "page-header", name: "页头" },
"page-footer": { type: "page-footer", name: "页脚" },
"tab-toolbar": { type: "tab-toolbar", name: "标签页工具栏" },
fieldset: { type: "fieldset", name: "分组" },
"query-solution": { type: "query-solution", name: "筛选方案" },
drawer: { type: "drawer", name: "抽屉" }
}, Kt = {}, en = {};
Jt();
function Ne(n, e, t = /* @__PURE__ */ new Map(), o = (c, g, f, u) => g, i = {}, a = (c) => c) {
return at[e.title] = e, st[e.title] = o, Kt[e.title] = i, en[e.title] = a, (c = {}, g = !0) => {
if (!g)
return lt(c, t);
const f = Qt(c, e, t), u = Object.keys(n).reduce((v, l) => (v[l] = n[l].default, v), {});
return Object.assign(u, f);
};
}
function ct(n, e) {
return { customClass: e.class, customStyle: e.style };
}
function tn(n, e) {
const t = [];
return e == null || e.buttons.map((o) => {
const i = {};
Object.keys(o).map((a) => {
var c;
a === "appearance" ? i.class = ((c = o[a]) == null ? void 0 : c.class) || "" : i[a] = o[a];
}), t.push(i);
}), { buttons: t };
}
function nn() {
function n(e, t) {
var g;
const o = (g = e.toolbar) == null ? void 0 : g.buttons;
if (!o || o.length < 1)
return null;
const [i, a] = t.payloads, c = o.find((f) => f.id === a);
return c ? c.onClick || c.click : null;
}
return {
resolve: n
};
}
function on() {
function n(e, t) {
const o = e.buttons;
if (!o || o.length < 1)
return null;
const [i, a] = t.payloads, c = o.find((g) => g.id === a);
return c ? c.onClick || c.click : null;
}
return {
resolve: n
};
}
function rn(n, e, t) {
var i;
const o = t.toolbar;
return { buttonClass: (i = o == null ? void 0 : o.appearance) == null ? void 0 : i.class };
}
const an = /* @__PURE__ */ new Map([
["appearance", ct],
["toolbar", tn],
["buttonClass", rn]
]), sn = "https://json-schema.org/draft/2020-12/schema", ln = "https://farris-design.gitee.io/page-header.schema.json", cn = "page-header", un = "A Farris Container Component", dn = "object", fn = {
id: {
description: "The unique identifier for a Page Header",
type: "string"
},
type: {
description: "The type string of Page Header component",
type: "string",
default: "page-header"
},
appearance: {
description: "",
type: "object",
properties: {
class: {
type: "string"
},
style: {
type: "string"
}
},
default: {}
},
showIcon: {
description: "",
type: "boolean",
default: !0
},
icon: {
description: "",
type: "string",
default: "f-icon-page-title-record"
},
iconClass: {
description: "",
type: "string",
default: "f-text-orna-bill"
},
title: {
description: "",
type: "string",
default: ""
},
subTitle: {
description: "",
type: "string",
default: ""
},
toolbar: {
description: "",
type: "object",
properties: {
appearance: {
description: "",
type: "object",
properties: {
class: {
type: "string",
default: "col-6"
}
}
},
id: {
description: "",
type: "string"
},
type: {
description: "",
type: "string",
default: "response-toolbar"
},
alignment: {
description: "The alignment of Response Toolbar Button.",
type: "string",
default: "right"
},
buttons: {
description: "The items of Response Toolbar.",
type: "array",
default: []
}
}
},
buttonClass: {
description: "",
type: "string",
default: "col-6"
},
titleContentClass: {
description: "",
type: "string",
default: ""
},
contentClass: {
description: "",
type: "string",
default: ""
},
downContentClass: {
description: "",
type: "string",
default: ""
},
showPagination: {
description: "",
type: "boolean",
default: !1
},
prePaginationDisabled: {
description: "",
type: "boolean",
default: !0
},
nextPaginationDisabled: {
description: "",
type: "boolean",
default: !1
}
}, pn = [
"id",
"type"
], mn = {
$schema: sn,
$id: ln,
title: cn,
description: un,
type: dn,
properties: fn,
required: pn
};
function gn(n, e, t) {
return e.title = "标题", e;
}
const Le = {
/** 组件自定义样式 */
customClass: { type: String, default: "" },
/** 是否显示图标 */
showIcon: { type: Boolean, default: !0 },
/** 图标的名称 */
icon: { type: String, default: "f-icon-page-title-record" },
/** 图标自定义样式，比如颜色、背景 */
iconClass: { type: String, default: "f-text-orna-bill" },
/** 主标题 */
title: { type: String, default: "" },
/** 副标题 */
subTitle: { type: String, default: "" },
/** 按钮组的样式 */
buttonClass: { type: String, default: "col-6" },
/** 按钮组 */
buttons: { type: Array, default: [] },
/** 标题区域模板自定义样式 */
titleContentClass: { type: String, default: "" },
/** 内容区域模板自定义样式 */
contentClass: { type: String, default: "" },
/** 下方扩展区域模板自定义样式 */
downContentClass: { type: String, default: "" },
/** 是否显示翻页图标 */
showPagination: { type: Boolean, default: !1 },
/** 向前翻页是否禁用 */
prePaginationDisabled: { type: Boolean, default: !0 },
/** 向后翻页是否禁用 */
nextPaginationDisabled: { type: Boolean, default: !1 }
}, vn = Object.assign({}, Le, {
componentId: { type: String, default: "" }
}), tt = Ne(Le, mn, an, gn), hn = nn(), Re = /* @__PURE__ */ me({
name: "FPageHeader",
props: Le,
emits: ["click", "prePaginationClick", "nextPaginationClick"],
setup(n, e) {
const t = j(n.buttons), o = (M, $) => {
e.emit("click", M, $);
};
function i(M, $) {
M && $ && $.split(" ").reduce((C, m) => (C[m] = !0, C), M);
}
const a = Q(() => {
const M = {
"f-page-header": !0
};
return i(M, n.customClass), M;
}), c = Q(() => {
const M = {
"f-title-icon": !0
};
return i(M, n.iconClass), M;
}), g = Q(() => {
const M = {
"f-icon": !0
};
return i(M, n.icon), M;
}), f = Q(() => {
const M = {
"f-title": !0
};
return i(M, n.titleContentClass), M;
}), u = Q(() => {
const M = {
"f-content": !0
};
return i(M, n.contentClass), M;
}), v = Q(() => {
const M = {
"f-content": !0
};
return i(M, n.downContentClass), M;
}), l = Q(() => ({
"f-icon f-icon-arrow-w": !0,
"f-state-disabled": n.prePaginationDisabled
})), p = Q(() => ({
"f-icon f-icon-arrow-e": !0,
"f-state-disabled": n.nextPaginationDisabled
}));
function r(M) {
n.prePaginationDisabled || e.emit("prePaginationClick", M);
}
function s(M) {
n.nextPaginationDisabled || e.emit("nextPaginationClick", M);
}
function h() {
return e.slots.titleContent ? x("div", {
class: f.value
}, [be(" "), e.slots.titleContent()]) : x("div", {
class: "f-title"
}, [n.showIcon && n.icon ? x("span", {
class: c.value
}, [x("i", {
class: g.value
}, null)]) : "", x("h4", {
class: "f-title-text"
}, [n.title]), n.subTitle ? x("h5", {
class: "f-title-subtitle"
}, [n.subTitle]) : "", n.showPagination ? x("div", {
class: "f-title-pagination"
}, [x("span", {
class: l.value,
onClick: r
}, null), x("span", {
class: p.value,
onClick: s
}, null)]) : ""]);
}
function B() {
return e.slots.content ? x("div", {
class: u.value
}, [be(" "), e.slots.content()]) : "";
}
function _() {
if (n.buttons && n.buttons.length > 0)
return x(Ut, {
customClass: n.buttonClass,
items: t.value,
onClick: o
}, null);
}
function V() {
return e.slots.downContent ? x("div", {
class: v.value
}, [be(" "), e.slots.downContent()]) : "";
}
return pe(() => n.buttons, (M) => {
t.value = M;
}, {
deep: !0
}), () => x("div", {
class: a.value
}, [x("nav", {
class: "f-page-header-base"
}, [h(), B(), _()]), V()]);
}
});
function yn(n, e, t) {
var C;
const o = t && t.getStyles && t.getStyles() || "", i = t && t.getDesignerClass && t.getDesignerClass() || "", a = j();
function c() {
return (e == null ? void 0 : e.schema.componentType) === "frame" ? !1 : t && t.checkCanMoveComponent ? t.checkCanMoveComponent() : !0;
}
function g() {
return !1;
}
function f() {
return (e == null ? void 0 : e.schema.componentType) === "frame" ? !1 : t && t.checkCanDeleteComponent ? t.checkCanDeleteComponent() : !0;
}
function u() {
return (e == null ? void 0 : e.schema.componentType) === "frame" ? !0 : t && t.hideNestedPaddingInDesginerView ? t.hideNestedPaddingInDesginerView() : !1;
}
function v(m) {
if (!m || !m.value)
return null;
if (m.value.schema && m.value.schema.type === "component")
return m.value;
const E = j(m == null ? void 0 : m.value.parent), I = v(E);
return I || null;
}
function l(m = e) {
var b;
if (t != null && t.getDraggableDesignItemElement)
return t.getDraggableDesignItemElement(m);
const { componentInstance: E, designerItemElementRef: I } = m;
if (!E || !E.value)
return null;
const { getCustomButtons: R } = E.value;
return E.value.canMove || R && ((b = R()) != null && b.length) ? I : l(m.parent);
}
function p(m) {
return !!t && t.canAccepts(m);
}
function r() {
return (e == null ? void 0 : e.schema.label) || (e == null ? void 0 : e.schema.title) || (e == null ? void 0 : e.schema.name);
}
function s() {
}
function h(m, E) {
var I;
!m || !E || (t != null && t.onAcceptMovedChildElement && t.onAcceptMovedChildElement(m, E), (I = e == null ? void 0 : e.setupContext) == null || I.emit("dragEnd"));
}
function B(m, E) {
const { componentType: I } = m;
let R = he(I, m, E);
t && t.onResolveNewComponentSchema && (R = t.onResolveNewComponentSchema(m, R));
const b = I.toLowerCase().replace(/-/g, "_");
return R && !R.id && R.type === I && (R.id = `${b}_${Math.random().toString().slice(2, 6)}`), R;
}
function _(m) {
m && t != null && t.onChildElementMovedOut && t.onChildElementMovedOut(m);
}
function V(...m) {
if (t && t.getPropsConfig)
return t.getPropsConfig(...m);
}
function M() {
t && t.onRemoveComponent && t.onRemoveComponent(), e != null && e.schema.contents && e.schema.contents.map((m) => {
let E = m.id;
m.type === "component-ref" && (E = m.component);
const I = n.value.querySelectorAll(`#${E}-design-item`);
I != null && I.length && Array.from(I).map((R) => {
var b;
(b = R == null ? void 0 : R.componentInstance) != null && b.value.onRemoveComponent && R.componentInstance.value.onRemoveComponent();
});
});
}
function $() {
if (t && t.getCustomButtons)
return t.getCustomButtons();
}
function T(m) {
if (t && t.onPropertyChanged)
return t.onPropertyChanged(m);
}
return a.value = {
canMove: c(),
canSelectParent: g(),
canDelete: f(),
canNested: !u(),
contents: e == null ? void 0 : e.schema.contents,
elementRef: n,
parent: (C = e == null ? void 0 : e.parent) == null ? void 0 : C.componentInstance,
schema: e == null ? void 0 : e.schema,
styles: o,
designerClass: i,
canAccepts: p,
getBelongedComponentInstance: v,
getDraggableDesignItemElement: l,
getDraggingDisplayText: r,
getPropConfig: V,
getDragScopeElement: s,
onAcceptMovedChildElement: h,
onChildElementMovedOut: _,
addNewChildComponentSchema: B,
triggerBelongedComponentToMoveWhenMoved: !!t && t.triggerBelongedComponentToMoveWhenMoved || j(!1),
triggerBelongedComponentToDeleteWhenDeleted: !!t && t.triggerBelongedComponentToDeleteWhenDeleted || j(!1),
onRemoveComponent: M,
getCustomButtons: $,
onPropertyChanged: T
}, a;
}
const bn = j(0);
function Cn() {
bn.value++;
}
const we = j(0);
function wn(n, e) {
const t = e.getBoundingClientRect(), o = n.getBoundingClientRect(), i = o.top >= t.top, a = o.top <= t.bottom;
return i && a;
}
function Tn(n) {
const e = n.querySelector(".component-btn-group");
if (!e)
return;
e.style.display = "";
const t = e.getBoundingClientRect();
if (!(t.top === 0 && t.left === 0)) {
const o = e.querySelector("div");
if (o) {
const i = o.getBoundingClientRect();
o.style.top = t.top + "px";
let a = t.left - i.width;
const c = document.querySelector(".editorDiv");
if (c) {
const g = c.getBoundingClientRect();
a < g.left && ({ left: a } = n.getBoundingClientRect());
}
o.style.left = a + "px";
}
}
}
function Sn(n) {
if (!window.scrollContainerList)
return;
const e = Array.from(window.scrollContainerList);
if (e.length && e.length === 1) {
const t = e[0], o = document.querySelector(`[id=${t}]`);
if (o && o.contains(n))
return o;
}
}
function ut(n) {
if (!n)
return;
const e = n.getBoundingClientRect();
if (e.width === 0 && e.height === 0)
return;
const t = n.querySelector(".component-btn-group");
if (t) {
let o = !0;
const i = Sn(n);
if (i && (o = wn(n, i)), !o) {
t.style.display = "none";
return;
}
Tn(n);
}
}
function Pn(n) {
if (!n)
return;
let e;
n.className.includes("dgComponentSelected") ? e = n : e = n.querySelector(".dgComponentSelected"), e && ut(e);
}
class Se {
constructor(e, t) {
q(this, "componentId");
q(this, "viewModelId");
q(this, "eventsEditorUtils");
q(this, "formSchemaUtils");
q(this, "formMetadataConverter");
q(this, "designViewModelUtils");
q(this, "designViewModelField");
q(this, "controlCreatorUtils");
q(this, "designerHostService");
q(this, "schemaService", null);
q(this, "metadataService", null);
q(this, "propertyConfig", {
type: "object",
categories: {}
});
var o;
this.componentId = e, this.designerHostService = t, this.eventsEditorUtils = t.eventsEditorUtils, this.formSchemaUtils = t.formSchemaUtils, this.formMetadataConverter = t.formMetadataConverter, this.viewModelId = ((o = this.formSchemaUtils) == null ? void 0 : o.getViewModelIdByComponentId(e)) || "", this.designViewModelUtils = t.designViewModelUtils, this.controlCreatorUtils = t.controlCreatorUtils, this.metadataService = t.metadataService, this.schemaService = t.schemaService;
}
getTableInfo() {
var e;
return (e = this.schemaService) == null ? void 0 : e.getTableInfoByViewModelId(this.viewModelId);
}
setDesignViewModelField(e) {
var o;
const t = e.binding && e.binding.type === "Form" && e.binding.field;
if (t) {
if (!this.designViewModelField) {
const i = this.designViewModelUtils.getDgViewModel(this.viewModelId);
this.designViewModelField = i.fields.find((a) => a.id === t);
}
e.updateOn = (o = this.designViewModelField) == null ? void 0 : o.updateOn;
}
}
getBasicPropConfig(e) {
return {
description: "Basic Information",
title: "基本信息",
properties: {
id: {
description: "组件标识",
title: "标识",
type: "string",
readonly: !0
},
type: {
description: "组件类型",
title: "控件类型",
type: "select",
editor: {
type: "combo-list",
textField: "name",
valueField: "value",
editable: !1,
data: [{ value: e.type, name: Zt[e.type].name }]
}
}
}
};
}
getAppearanceConfig(e = null) {
return {
title: "外观",
description: "Appearance",
properties: {
class: {
title: "class样式",
type: "string",
description: "组件的CSS样式",
$converter: "/converter/appearance.converter"
},
style: {
title: "style样式",
type: "string",
description: "组件的样式",
$converter: "/converter/appearance.converter"
}
},
setPropertyRelates(t, o) {
if (t)
switch (t && t.propertyID) {
case "class":
case "style": {
we.value++;
break;
}
}
}
};
}
/**
*
* @param propertyId
* @param componentInstance
* @returns
*/
updateElementByParentContainer(e, t) {
const o = t && t.parent && t.parent.schema;
if (!o)
return;
const i = o.contents.findIndex((c) => c.id === e), a = je(o.contents[i]);
o.contents.splice(i, 1), o.contents.splice(i, 0, a), Cn();
}
}
class Dn extends Se {
constructor(e, t) {
super(e, t);
}
getPropertyConfig(e) {
return this.propertyConfig.categories.basic = this.getBasicPropConfig(e), this.propertyConfig.categories.appearance = this.getAppearanceProperties(e), this.propertyConfig;
}
getAppearanceProperties(e) {
return {
title: "外观",
description: "Appearance",
properties: {
class: {
title: "class样式",
type: "string",
description: "组件的CSS样式"
},
icon: {
title: "图标",
type: "string",
description: "图标"
},
title: {
title: "标题",
type: "string",
description: "标题"
}
},
setPropertyRelates(t, o) {
if (t)
switch (t && t.propertyID) {
case "title": {
t.needRefreshControlTree = !0;
break;
}
}
}
};
}
}
function En(n, e) {
function t(g) {
return !1;
}
function o() {
return !1;
}
function i() {
return !1;
}
function a() {
return !0;
}
function c(g) {
return new Dn(g, e).getPropertyConfig(n);
}
return {
canAccepts: t,
hideNestedPaddingInDesginerView: a,
getPropsConfig: c,
checkCanDeleteComponent: o,
checkCanMoveComponent: i
};
}
class dt {
constructor(e) {
/** 工具栏项标识 */
q(this, "id", "");
/** 工具栏项自定义样式 */
q(this, "class", "btn-secondary");
/** 图标 */
q(this, "icon", "");
/** 所属分组 */
q(this, "groupId", "");
/** 收藏顺序 */
q(this, "order", -1);
/** 是否作为下拉菜单的顶层按钮 */
q(this, "asDropDownTop", !1);
/** 文本 */
q(this, "text", "");
/** 是否可见 */
q(this, "visible", !0);
q(this, "responsed", !1);
/** 是否启用提示消息 */
q(this, "tipsEnable", !1);
/** 提示消息内容 */
q(this, "tipsText", "");
/** 记录宽度 */
q(this, "width", 0);
q(this, "onClick", () => {
});
q(this, "options");
var o, i;
this.options = e;
const t = [
"id",
"class",
"icon",
"groupId",
"order",
"asDropDownTop",
"text",
"isDP",
"visible",
"responsed",
"width",
"tipsEnable",
"tipsText",
"onClick"
];
Object.keys(e).filter((a) => t.indexOf(a) > -1).forEach((a) => {
this[a] = e[a];
}), (o = e.appearance) != null && o.class && (this.class = (i = e.appearance) == null ? void 0 : i.class);
}
/** 是否可用 */
get enable() {
return Object.keys(this.options).indexOf("disabled") > -1 ? !this.options.disabled : Q(() => !0);
}
/** 设置宽度 */
setWidth(e) {
this.width = parseInt(e, 10);
}
/** 获取宽度 */
getWidth() {
return this.visible ? this.width : !1;
}
}
class kn extends dt {
constructor(e) {
super(e);
}
}
function ft() {
function n(e) {
const t = [];
return e.reduce((o, i) => (i.children && i.children.length > 0 ? o.push(new ge(i)) : o.push(new kn(i)), o), t), t;
}
return { buildResponseToolbarItems: n };
}
const { buildResponseToolbarItems: Mn } = ft();
class ge extends dt {
constructor(t) {
super(t);
q(this, "placement", "");
// 下拉位置
/** 下拉class */
q(this, "dropdownClass", "");
/** 下拉菜单class */
q(this, "menuClass", "");
/** 是否用分开的下拉按钮 */
q(this, "split", !1);
q(this, "children", []);
q(this, "expanded", !1);
const o = ["isDP", "class", "dropdownClass", "menuClass", "placement", "split", "expanded"];
Object.keys(t).filter((i) => o.indexOf(i) > -1).forEach((i) => {
this[i] = t[i];
}), t.children && t.children.length && (this.children = Mn(t.children));
}
}
const xn = /* @__PURE__ */ new Map([
["buttons", "items"],
["appearance", ct]
]);
function pt(n, e, t) {
return e;
}
const Bn = "https://json-schema.org/draft/2020-12/schema", In = "https://farris-design.gitee.io/response-toolbar.schema.json", An = "response-toolbar", On = "A Farris Toolbar Component", Rn = "object", _n = {
id: {
description: "The unique identifier for a Response Toolbar",
type: "string"
},
type: {
description: "The type string of Response Toolbar",
type: "string",
default: "response-toolbar"
},
appearance: {
description: "",
type: "object",
properties: {
class: {
type: "string",
default: ""
}
}
},
alignment: {
description: "The alignment of Response Toolbar Button.",
type: "string",
default: "right"
},
buttons: {
description: "The items of Response Toolbar.",
type: "array",
default: []
},
buttonSize: {
type: "string",
default: ""
}
}, jn = [
"id",
"type",
"buttons"
], $n = {
$schema: Bn,
$id: In,
title: An,
description: On,
type: Rn,
properties: _n,
required: jn
}, Nn = "https://json-schema.org/draft/2020-12/schema", Ln = "https://farris-design.gitee.io/response-toolbar-item.schema.json", Fn = "response-toolbar-item", Vn = "A Farris Toolbar Item Component", Hn = "object", qn = {
id: {
description: "The unique identifier for a Response Toolbar",
type: "string"
},
type: {
description: "The type string of Response Toolbar",
type: "string",
default: "response-toolbar-item"
},
appearance: {
description: "",
type: "object",
properties: {
class: {
type: "string",
default: "btn-secondary"
}
}
},
alignment: {
description: "对齐",
type: "string",
default: "right"
},
text: {
description: "文本",
type: "string",
default: "按钮"
},
icon: {
description: "图标",
type: "string",
default: ""
},
disabled: {
description: "禁用",
type: "boolean",
default: !1
},
onClick: {
description: "点击事件",
type: "string",
default: ""
}
}, Un = [
"id",
"type",
"text"
], Wn = {
$schema: Nn,
$id: Ln,
title: Fn,
description: Vn,
type: Hn,
properties: qn,
required: Un
}, Fe = {
/** 组件自定义样式 */
customClass: { type: String, default: "" },
/** 按钮尺寸 sm 小号 lg 大号 空值 默认 */
buttonSize: { type: String, default: "" },
alignment: { Type: String, default: "right" },
items: {
Type: Array,
default: []
}
}, zn = Object.assign({}, Fe, {
componentId: { type: String, default: "" }
}), Ve = Ne(
Fe,
$n,
xn,
pt
), mt = {
id: { type: String, default: "" },
items: { type: Object, default: {} },
class: { type: String, default: "" },
text: { type: String, default: "" },
// disabled: {type: Boolean, default: false},
icon: { type: String, default: "" },
componentId: { type: String, default: "" },
alignment: { Type: String, default: "right" }
}, Xn = Ne(
mt,
Wn,
void 0,
pt
), Yn = on();
function Gn() {
function n(t) {
const o = {
"f-icon": !0
};
if (t.icon) {
const i = t.icon.trim().split(" ");
i && i.length && i.reduce((a, c) => (a[c] = !0, a), o);
}
return o;
}
function e(t) {
return !!(t.icon && t.icon.trim());
}
return { iconClass: n, shouldShowIcon: e };
}
function Qn(n, e) {
function t(r) {
const s = {
"dropdown-menu": !0
};
if (r.class) {
const h = r.menuClass.split(" ");
h && h.length && h.reduce((B, _) => (B[_] = !0, B), s);
}
return s;
}
function o(r) {
const s = {
disabled: !r.enable,
"dropdown-submenu": !0,
"f-rt-dropdown": !0,
"text-truncate": !0
}, h = r.dropdownClass.split(" ");
return h && h.length && h.reduce((B, _) => (B[_] = !0, B), s), s;
}
function i(r) {
const s = {
disabled: !r.enable,
"dropdown-item": !0,
"f-rt-btn": !0,
"text-truncate": !0
}, h = r.class.split(" ");
return h && h.length && h.reduce((B, _) => (B[_] = !0, B), s), s;
}
let a;
const c = /* @__PURE__ */ new Map();
function g(r, s, h) {
var _;
((_ = r.target) == null ? void 0 : _.id) === s.id && r.stopPropagation();
const B = h ? h.id : "__top_item__";
if (s.children && s.children.length && (s.expanded = !s.expanded, s.expanded ? c.set(B, s) : c.delete(B)), c.has(B) && c.get(B) !== s) {
const V = c.get(B);
V && (V.expanded = !1);
}
}
function f(r, s) {
document.body.click(), s.enable && (typeof s.onClick == "function" && s.onClick(r, s.id), n.emit("click", r, s.id));
}
function u(r, s) {
const h = r.target;
h.className.indexOf("dropdown-item") < 0 || (h.title = h.scrollWidth > h.clientWidth ? s : "");
}
function v(r) {
return r.children.map((s) => s.children && s.children.length ? x("li", {
class: o(s),
id: s.id,
onClick: (h) => s.enable && g(h, s, r)
}, [x("span", {
id: s.id,
class: i(s),
onMouseover: (h) => s.enable && g(h, s, r)
}, [s.text, x("i", {
class: "f-icon f-icon-arrow-chevron-right",
style: "display: inline-block;float: right;line-height: 1.25rem;"
}, null)]), a(s, s)]) : x("li", {
class: i(s),
id: s.id,
onClick: (h) => f(h, s),
onMouseover: (h) => s.enable && g(h, s, r),
onMouseenter: (h) => u(h, s.text)
}, [e.shouldShowIcon(s) && x("i", {
class: e.iconClass(s)
}, null), s.text]));
}
function l(r, s, h) {
var $;
const B = {
display: r.expanded ? "block" : "none",
position: "fixed",
maxWidth: "300px",
width: "180px",
minWidth: "120px",
zIndex: 1e4
}, _ = ($ = document.getElementsByTagName("body")[0].getClientRects()[0]) == null ? void 0 : $.width, V = s, M = V == null ? void 0 : V.getClientRects();
if (V && M && M.length) {
const {
top: T,
width: C,
left: m,
right: E,
height: I
} = M[0], R = Math.ceil(I + T);
B.top = `${R}px`, B.left = `${m}px`;
const b = r.id + "_menu", F = s ? s.querySelector("#" + b) : null;
if (F) {
F.style.visibility = "hidden", F.style.display = "block";
const k = F.offsetHeight;
B.display === "block" && (F.style.display = "block");
const S = F.getBoundingClientRect();
if (h) {
B.top = `${T - 6}px`;
const y = Math.ceil(C + m);
B.left = `${y}px`;
}
_ - m - C < S.width && (B.left = `${(h ? m : E) - S.width}px`), window.innerHeight - T - I < k && (T > k ? B.top = `${T - k - 6}px` : (B.maxHeight = `${T - 16}px`, B.overflowY = "auto", T - I > window.innerHeight - T && (B.top = "10px"))), F.style.visibility = "visible";
}
}
return B;
}
a = function(r, s) {
var V, M;
const h = Ft(), B = s ? s.id : r.id, _ = (M = (V = h == null ? void 0 : h.exposed) == null ? void 0 : V.elementRef.value) == null ? void 0 : M.querySelector("#" + B);
return x("ul", {
class: t(r),
style: l(r, _, s),
id: r.id + "_menu"
}, [v(r)]);
};
function p() {
c.forEach((r) => {
r.expanded = !1;
}), c.clear();
}
return {
renderDropdownMenu: a,
clearAllDropDownMenu: p
};
}
function Jn(n, e, t) {
const o = j(n.alignment), {
renderDropdownMenu: i,
clearAllDropDownMenu: a
} = Qn(e, t);
function c(l) {
const p = {
"btn-group": !0,
"f-rt-dropdown": !0,
"f-btn-ml": o.value === "right" || o.value === "center",
"f-btn-mr": o.value === "left"
}, r = l.dropdownClass.split(" ");
return r && r.length && r.reduce((s, h) => (s[h] = !0, s), p), p;
}
function g(l) {
const p = {
btn: !0,
disabled: !l.enable,
"f-rt-btn": !0,
"btn-icontext": !!(l.icon && l.icon.trim())
};
if (l.class) {
const r = l.class.split(" ");
r && r.length && r.reduce((s, h) => (s[h] = !0, s), p);
}
return p;
}
function f(l, p) {
l.stopPropagation();
const r = p.expanded;
document.body.click(), p.expanded = !r;
}
function u(l, p = !0) {
return x("div", {
id: l.id,
class: c(l)
}, [x("div", {
class: g(l),
style: "display: flex;padding-right: 0.1rem;border-top-right-radius: 6px;border-bottom-right-radius: 6px",
onClick: (r) => l.enable && f(r, l)
}, [t.shouldShowIcon(l) && x("i", {
class: t.iconClass(l)
}, null), x("span", null, [l.text]), x("i", {
class: "f-icon f-icon-arrow-chevron-down",
style: "display: inline-block;float: right;line-height: 1.25rem;margin-left: .25rem;margin-right: .25rem;"
}, null)]), p && i(l)]);
}
function v() {
a();
}
return {
renderToolbarDropdown: u,
clearAllDropDown: v
};
}
const {
buildResponseToolbarItems: nt
} = ft(), Te = /* @__PURE__ */ me({
name: "FResponseToolbar",
props: Fe,
emits: ["click"],
setup(n, e) {
const t = j(nt(n.items)), o = j(), i = j(), a = j(), c = j(n.alignment), g = {
id: "__more_buttons__",
text: "更多"
}, f = j(new ge(g)), u = {
id: g.id + "width",
text: g.text
}, v = j(-1), l = Gn(), p = Q(() => f.value.children.length > 0), r = Q(() => {
const y = {
"f-toolbar": !0,
"f-response-toolbar": !0,
"position-relative": !0,
"f-response-toolbar-sm": n.buttonSize === "sm",
"f-response-toolbar-lg": n.buttonSize === "lg"
};
return Ce(y, n.customClass);
}), s = Q(() => ({
"w-100": !0,
"d-flex": !0,
"flex-nowrap": !0,
"justify-content-end": c.value === "right",
"justify-content-start": c.value === "left",
"justify-content-center": c.value === "center"
})), {
renderToolbarDropdown: h,
clearAllDropDown: B
} = Jn(n, e, l);
function _(y) {
y && y.target.closest("ul.dropdown-menu") && y.type === "wheel" || (t.value.filter((P) => P.children && P.children.length > 0).forEach((P) => {
P.expanded = !1;
}), f.value.expanded = !1, B());
}
function V(y, P) {
var Z;
const H = {
btn: !0,
"f-rt-btn": !0,
"f-btn-ml": c.value === "right" || P > 0 && c.value === "center",
"f-btn-mr": c.value === "left",
"btn-icontext": !!(y.icon && y.icon.trim())
}, Y = ((Z = y == null ? void 0 : y.appearance) == null ? void 0 : Z.class) || y.class;
if (Y) {
const W = Y.split(" ");
W && W.length && W.reduce((N, X) => (N[X] = !0, N), H);
}
return H;
}
function M(y, P) {
document.body.click(), typeof P.onClick == "function" && P.onClick(y, P.id), e.emit("click", y, P.id);
}
function $(y, P) {
return x("button", {
type: "button",
class: V(y, P),
id: y.id,
disabled: !y.enable,
onClick: (H) => M(H, y)
}, [l.shouldShowIcon(y) && x("i", {
class: l.iconClass(y)
}, null), y.text]);
}
let T = /* @__PURE__ */ new Map(), C = [];
function m(y) {
const P = y.computedStyleMap().get("margin-left"), H = y.computedStyleMap().get("margin-right");
return (P ? P.value : 0) + y.getBoundingClientRect().width + (H ? H.value : 0);
}
function E(y, P, H) {
if (P < v.value) {
let Y = H - 1;
for (; Y >= 0; Y--) {
const Z = y[Y], W = m(Z);
if (P += W, P >= v.value)
break;
}
H = Y;
}
return P -= v.value, {
start: H,
space: P
};
}
function I(y) {
const P = a.value;
let H = y;
const Z = Array.from(P.children).filter((K) => K.id !== "__more_buttons__"), W = Z.length;
let N = !1, X = 0;
for (; X < W; X++) {
const K = Z[X], L = m(K);
if (L <= H)
H -= L;
else {
const se = E(Z, H, X);
X = se.start, H = se.space, N = !0;
break;
}
}
if (!N && C.length > 0) {
const K = E(Z, H, X);
X = K.start, H = K.space;
}
const oe = C.length > 0;
for (; X < W; X++) {
const K = Z[X], L = m(K);
T.set(K.id, !0), C[oe ? "unshift" : "push"]({
id: K.id,
width: L
});
}
return H;
}
function R(y) {
let P = I(y);
if (C.length) {
let W = 0;
for (; W < C.length; W++) {
const N = n.items.find((X) => X.id === C[W].id);
if (N && N.visible !== !1) {
const X = C[W].width;
if (P >= X || W === C.length - 1 && P + v.value >= X)
P -= X;
else
break;
}
}
for (let N = 0; N < W; N++)
T.delete(C[N].id);
C.splice(0, W - 1);
}
const H = Object.assign({}, f.value);
H.children = [];
const Y = new ge(H), Z = t.value.reduce((W, N) => {
const X = n.items.find((oe) => oe.id === N.id);
return T.has(N.id) ? (Y.children.push(N), N.visible = !1) : N.visible = X.visible !== !1, W.push(N), W;
}, []);
f.value = Y, t.value = Z;
}
function b(y = -1) {
var Y;
if (y === 0)
return;
y < 0 && (y = ((Y = i.value) == null ? void 0 : Y.getBoundingClientRect().width) || -1);
const H = a.value.getBoundingClientRect().width;
(y >= 0 && y < H || C.length) && (R(y), _());
}
function F() {
return v.value < 0 && x("div", {
style: "position:absolute;top:-30px;visibility:hidden;"
}, [h(new ge(u))]);
}
const k = new ResizeObserver((y) => {
if (y.length) {
const H = y[0].contentRect.width;
b(H);
}
});
function S() {
T = /* @__PURE__ */ new Map(), C = [];
}
return ve(() => {
if (v.value < 0) {
const P = o.value.querySelector("#" + u.id);
P && (v.value = m(P));
}
b();
const y = i.value;
k.observe(y), document.body.addEventListener("click", _), document.body.addEventListener("wheel", _);
}), it(() => {
k.disconnect(), document.body.removeEventListener("click", _), document.body.removeEventListener("wheel", _);
}), pe(() => n.items, () => {
t.value = nt(n.items), _e(() => {
S(), b();
});
}, {
deep: !0
}), e.expose({
elementRef: o
}), () => x("div", {
class: r.value,
ref: o,
style: {
"overflow-y": v.value < 0 ? "hidden" : "initial"
}
}, [F(), x("div", {
ref: i,
class: s.value
}, [x("div", {
ref: a,
class: "d-inline-block f-response-content",
style: "white-space: nowrap;"
}, [t.value.filter((y) => y.visible).map((y, P) => y.children && y.children.length > 0 ? h(y) : $(y, P)), p.value && h(f.value)])])]);
}
});
class Zn extends Se {
constructor(e, t) {
super(e, t);
}
getPropertyConfig(e) {
return this.propertyConfig.categories.basic = this.getBasicPropConfig(e), this.getAppearancePropConfig(e), this.propertyConfig;
}
getAppearancePropConfig(e) {
this.propertyConfig.categories.appearance = {
title: "外观",
description: "Appearance",
properties: {
class: {
title: "class样式",
type: "string",
description: "组件的CSS样式",
$converter: "/converter/appearance.converter"
}
}
};
}
getBehaviorProperties(e) {
this.propertyConfig.categories.behavior = {
title: "行为",
description: "",
properties: {
alignment: {
title: "对齐方式",
description: "在工具栏区域内按钮组的位置",
type: "enum",
editor: {
type: "combo-list",
textField: "name",
valueField: "value",
data: [
{
value: "left",
name: "左对齐"
},
{
value: "center",
name: "居中"
},
{
value: "right",
name: "右对齐"
}
]
}
}
}
};
}
}
function Kn(n, e) {
const t = n.schema;
function o(p) {
return !1;
}
function i(p, r) {
return r.text = p.label, r;
}
function a() {
return !1;
}
function c() {
return !1;
}
function g() {
return !0;
}
function f() {
return !0;
}
function u(p) {
return new Zn(p, e).getPropertyConfig(t);
}
function v(p) {
p && (p.stopPropagation(), p.preventDefault());
const { schema: r } = n;
r.buttons || (r.buttons = []);
const s = he("response-toolbar-item");
s.id = `toolbar_item_${Math.random().toString().slice(2, 6)}`, s.appearance = { class: "btn btn-secondary" }, r.buttons.push(s);
}
function l() {
return [
{
id: "appendItem",
title: "新增按钮",
icon: "f-icon f-icon-plus-circle text-white",
onClick: (p) => v(p)
}
];
}
return {
canAccepts: o,
checkCanAddComponent: g,
checkCanDeleteComponent: c,
checkCanMoveComponent: a,
hideNestedPaddingInDesginerView: f,
onResolveNewComponentSchema: i,
getPropsConfig: u,
getCustomButtons: l
};
}
const eo = {
id: { type: String, default: "" },
componentId: { type: String, default: "" },
canAdd: { type: Boolean, default: !1 },
canDelete: { type: Boolean, default: !1 },
canMove: { type: Boolean, default: !1 },
contentKey: { type: String, default: "contents" },
childLabel: { type: String, default: "" },
childType: { type: String, default: "" },
/**
* 组件值
*/
modelValue: { type: Object }
};
function to(n, e, t) {
var T;
const o = "", i = j();
function a() {
return !0;
}
function c() {
return !1;
}
function g() {
return !0;
}
function f() {
return !0;
}
function u() {
return !0;
}
function v(C) {
if (!C || !C.value)
return null;
const m = j(C == null ? void 0 : C.value.parent), E = v(m);
return E || null;
}
function l(C = e) {
const { componentInstance: m, designerItemElementRef: E } = C;
return !m || !m.value ? null : m.value.canMove || m.value.canAdd || m.value.canDelete ? E : l(C.parent);
}
function p(C) {
return !!t;
}
function r() {
return (e == null ? void 0 : e.schema.label) || (e == null ? void 0 : e.schema.title) || (e == null ? void 0 : e.schema.name);
}
function s() {
}
function h(C, m) {
}
function B(C) {
const { componentType: m } = C, E = ie("designer-host-service");
let I = he(m, C, E);
const R = m.toLowerCase().replace(/-/g, "_");
return I && !I.id && I.type === m && (I.id = `${R}_${Math.random().toString().slice(2, 6)}`), I;
}
function _(C) {
}
function V(...C) {
return [];
}
function M() {
}
function $(C) {
}
return i.value = {
canMove: a(),
canSelectParent: c(),
canAdd: f(),
canDelete: g(),
canNested: !u(),
contents: [],
elementRef: n,
parent: (T = e.parent) == null ? void 0 : T.componentInstance,
schema: e.schema,
styles: o,
canAccepts: p,
getBelongedComponentInstance: v,
getDraggableDesignItemElement: l,
getDraggingDisplayText: r,
getPropConfig: V,
getDragScopeElement: s,
onAcceptMovedChildElement: h,
onChildElementMovedOut: _,
addNewChildComponentSchema: B,
onRemoveComponent: M,
triggerBelongedComponentToMoveWhenMoved: j(!1),
triggerBelongedComponentToDeleteWhenDeleted: j(!1),
onPropertyChanged: $
}, i;
}
const gt = /* @__PURE__ */ me({
name: "FDesignerInnerItem",
props: eo,
emits: ["selectionChange", "addComponent", "removeComponent"],
setup(n, e) {
const t = j(n.canMove), o = j(n.canAdd), i = j(n.canDelete), a = j(!1), c = j(n.contentKey), g = j(n.childType), f = j(n.childLabel), u = j(n.modelValue), v = j(""), l = j(), p = ie("canvas-dragula"), r = j(), s = ie("design-item-context"), h = {
designerItemElementRef: l,
componentInstance: r,
schema: u.value,
parent: s,
setupContext: e
};
Vt("design-item-context", h);
const B = Q(() => ({
"farris-component": !0,
// 受position-relative影响，整个容器的高度不能被撑起
"flex-fill": n.id === "root-component",
"position-relative": t.value || i.value,
"farris-nested": a.value,
"can-move": t.value,
"d-none": l.value && l.value.classList.contains("d-none")
})), _ = Q(() => {
const k = {};
return v.value && v.value.split(";").reduce((S, y) => {
const [P, H] = y.split(":");
return P && (S[P] = H), S;
}, k), k;
});
function V(k, S) {
if (s && s.schema[c.value]) {
const y = s.schema[c.value].findIndex((P) => P.id === S.id);
if (y > -1) {
const P = s.schema[c.value].length, H = s.schema[c.value][y % P];
s.designerItemElementRef.value.querySelector(`#${H.id}-design-item`), s.schema[c.value].splice(y, 1), we.value++, e.emit("removeComponent"), e.emit("selectionChange");
}
}
}
function M(k) {
if (r.value.addNewChildComponentSchema) {
const S = {
componentType: g.value,
label: f.value,
parentComponentInstance: r.value,
targetPosition: -1
}, y = r.value.addNewChildComponentSchema(S);
u.value[c.value].push(y), e.emit("addComponent");
}
}
function $() {
return o.value && x("div", {
role: "button",
class: "btn component-settings-button",
title: "新增",
ref: "removeComponent",
onClick: (k) => {
M();
}
}, [x("i", {
class: "f-icon f-icon-plus-circle"
}, null)]);
}
function T(k) {
return i.value && x("div", {
role: "button",
class: "btn component-settings-button",
title: "删除",
ref: "removeComponent",
onClick: qt((S) => V(S, k), ["stop"])
}, [x("i", {
class: "f-icon f-icon-yxs_delete"
}, null)]);
}
function C() {
return t.value && x("div", {
role: "button",
class: "btn component-settings-button",
title: "移动",
ref: "moveComponent"
}, [x("i", {
"data-dragging-icon": "true",
class: "cmp_move f-icon f-icon-yxs_move"
}, null)]);
}
function m(k) {
return x("div", {
class: "component-btn-group",
"data-noattach": "true"
}, [x("div", null, [$(), C(), T(k)])]);
}
pe(() => n.modelValue, (k) => {
u.value = k, h.schema = k;
});
function E(k) {
window.scrollContainerList || (window.scrollContainerList = /* @__PURE__ */ new Set());
const S = k.getAttribute("id");
S && window.scrollContainerList.add(S);
}
function I(k) {
const S = k.target;
E(S), Pn(S);
}
function R() {
var k, S;
(S = (k = u.value) == null ? void 0 : k.contents