epic-designer-cjh
Version:
基于vue3的设计器,可视化开发页面表单
486 lines (485 loc) • 14 kB
JavaScript
import { i as B } from "./interopRequireDefault-40f894e3.js";
import { r as H } from "./_vue_commonjs-external-eb7fec7f.js";
import { r as k, a as te } from "./public_api-1267ff2a.js";
import { r as re, d as ne, e as se, f as ue } from "./useConfigInject-d85d8c62.js";
import { r as ie } from "./useFlexGapSupport-f3b1c137.js";
var P = {}, X = {}, J;
function le() {
if (J)
return X;
J = 1;
var l = B;
Object.defineProperty(X, "__esModule", {
value: !0
}), X.default = G, X.responsiveArray = void 0;
var o = l(k()), v = H, w = re();
const q = ["xxxl", "xxl", "xl", "lg", "md", "sm", "xs"];
X.responsiveArray = q;
const x = (f) => ({
xs: `(max-width: ${f.screenXSMax}px)`,
sm: `(min-width: ${f.screenSM}px)`,
md: `(min-width: ${f.screenMD}px)`,
lg: `(min-width: ${f.screenLG}px)`,
xl: `(min-width: ${f.screenXL}px)`,
xxl: `(min-width: ${f.screenXXL}px)`,
xxxl: `{min-width: ${f.screenXXXL}px}`
});
function G() {
const [, f] = (0, w.useToken)();
return (0, v.computed)(() => {
const S = x(f.value), m = /* @__PURE__ */ new Map();
let a = -1, t = {};
return {
matchHandlers: {},
dispatch(e) {
return t = e, m.forEach((u) => u(t)), m.size >= 1;
},
subscribe(e) {
return m.size || this.register(), a += 1, m.set(a, e), e(t), a;
},
unsubscribe(e) {
m.delete(e), m.size || this.unregister();
},
unregister() {
Object.keys(S).forEach((e) => {
const u = S[e], s = this.matchHandlers[u];
s == null || s.mql.removeListener(s == null ? void 0 : s.listener);
}), m.clear();
},
register() {
Object.keys(S).forEach((e) => {
const u = S[e], s = (n) => {
let {
matches: j
} = n;
this.dispatch((0, o.default)((0, o.default)({}, t), {
[e]: j
}));
}, r = window.matchMedia(u);
r.addListener(s), this.matchHandlers[u] = {
mql: r,
listener: s
}, s(r);
});
},
responsiveMap: S
};
});
}
return X;
}
var O = {}, Y;
function oe() {
if (Y)
return O;
Y = 1, Object.defineProperty(O, "__esModule", {
value: !0
}), O.useProvideRow = O.useInjectRow = O.default = O.RowContextKey = void 0;
var l = H;
const o = Symbol("rowContextKey");
O.RowContextKey = o;
const v = (x) => {
(0, l.provide)(o, x);
};
O.useProvideRow = v;
const w = () => (0, l.inject)(o, {
gutter: (0, l.computed)(() => {
}),
wrap: (0, l.computed)(() => {
}),
supportFlexGap: (0, l.computed)(() => {
})
});
O.useInjectRow = w;
var q = v;
return O.default = q, O;
}
var D = {}, Z;
function ae() {
if (Z)
return D;
Z = 1;
var l = B;
Object.defineProperty(D, "__esModule", {
value: !0
}), D.useRowStyle = D.useColStyle = void 0;
var o = l(k()), v = re();
const w = (a) => {
const {
componentCls: t
} = a;
return {
// Grid system
[t]: {
display: "flex",
flexFlow: "row wrap",
minWidth: 0,
"&::before, &::after": {
display: "flex"
},
"&-no-wrap": {
flexWrap: "nowrap"
},
// The origin of the X-axis
"&-start": {
justifyContent: "flex-start"
},
// The center of the X-axis
"&-center": {
justifyContent: "center"
},
// The opposite of the X-axis
"&-end": {
justifyContent: "flex-end"
},
"&-space-between": {
justifyContent: "space-between"
},
"&-space-around ": {
justifyContent: "space-around"
},
// Align at the top
"&-top": {
alignItems: "flex-start"
},
// Align at the center
"&-middle": {
alignItems: "center"
},
"&-bottom": {
alignItems: "flex-end"
}
}
};
}, q = (a) => {
const {
componentCls: t
} = a;
return {
// Grid system
[t]: {
position: "relative",
maxWidth: "100%",
// Prevent columns from collapsing when empty
minHeight: 1
}
};
}, x = (a, t) => {
const {
componentCls: e,
gridColumns: u
} = a, s = {};
for (let r = u; r >= 0; r--)
r === 0 ? (s[`${e}${t}-${r}`] = {
display: "none"
}, s[`${e}-push-${r}`] = {
insetInlineStart: "auto"
}, s[`${e}-pull-${r}`] = {
insetInlineEnd: "auto"
}, s[`${e}${t}-push-${r}`] = {
insetInlineStart: "auto"
}, s[`${e}${t}-pull-${r}`] = {
insetInlineEnd: "auto"
}, s[`${e}${t}-offset-${r}`] = {
marginInlineEnd: 0
}, s[`${e}${t}-order-${r}`] = {
order: 0
}) : (s[`${e}${t}-${r}`] = {
display: "block",
flex: `0 0 ${r / u * 100}%`,
maxWidth: `${r / u * 100}%`
}, s[`${e}${t}-push-${r}`] = {
insetInlineStart: `${r / u * 100}%`
}, s[`${e}${t}-pull-${r}`] = {
insetInlineEnd: `${r / u * 100}%`
}, s[`${e}${t}-offset-${r}`] = {
marginInlineStart: `${r / u * 100}%`
}, s[`${e}${t}-order-${r}`] = {
order: r
});
return s;
}, G = (a, t) => x(a, t), f = (a, t, e) => ({
[`@media (min-width: ${t}px)`]: (0, o.default)({}, G(a, e))
}), S = (0, v.genComponentStyleHook)("Grid", (a) => [w(a)]);
D.useRowStyle = S;
const m = (0, v.genComponentStyleHook)("Grid", (a) => {
const t = (0, v.mergeToken)(a, {
gridColumns: 24
// Row is divided into 24 parts in Grid
}), e = {
"-sm": t.screenSMMin,
"-md": t.screenMDMin,
"-lg": t.screenLGMin,
"-xl": t.screenXLMin,
"-xxl": t.screenXXLMin
};
return [q(t), G(t, ""), G(t, "-xs"), Object.keys(e).map((u) => f(t, e[u], u)).reduce((u, s) => (0, o.default)((0, o.default)({}, u), s), {})];
});
return D.useColStyle = m, D;
}
var z;
function me() {
if (z)
return P;
z = 1;
var l = B;
Object.defineProperty(P, "__esModule", {
value: !0
}), P.rowProps = P.default = void 0;
var o = H, v = l(te()), w = l(k()), q = l(ne()), x = e(le()), G = l(se()), f = l(ie()), S = l(oe()), m = ae(), a = ue();
function t(n) {
if (typeof WeakMap != "function")
return null;
var j = /* @__PURE__ */ new WeakMap(), g = /* @__PURE__ */ new WeakMap();
return (t = function(y) {
return y ? g : j;
})(n);
}
function e(n, j) {
if (!j && n && n.__esModule)
return n;
if (n === null || typeof n != "object" && typeof n != "function")
return { default: n };
var g = t(j);
if (g && g.has(n))
return g.get(n);
var y = {}, C = Object.defineProperty && Object.getOwnPropertyDescriptor;
for (var M in n)
if (M !== "default" && Object.prototype.hasOwnProperty.call(n, M)) {
var A = C ? Object.getOwnPropertyDescriptor(n, M) : null;
A && (A.get || A.set) ? Object.defineProperty(y, M, A) : y[M] = n[M];
}
return y.default = n, g && g.set(n, y), y;
}
const u = () => ({
align: (0, a.someType)([String, Object]),
justify: (0, a.someType)([String, Object]),
prefixCls: String,
gutter: (0, a.someType)([Number, Array, Object], 0),
wrap: {
type: Boolean,
default: void 0
}
});
P.rowProps = u;
var r = (0, o.defineComponent)({
compatConfig: {
MODE: 3
},
name: "ARow",
inheritAttrs: !1,
props: u(),
setup(n, j) {
let {
slots: g,
attrs: y
} = j;
const {
prefixCls: C,
direction: M
} = (0, G.default)("row", n), [A, K] = (0, m.useRowStyle)(C);
let F;
const h = (0, x.default)(), b = (0, o.ref)({
xs: !0,
sm: !0,
md: !0,
lg: !0,
xl: !0,
xxl: !0
}), $ = (0, o.ref)({
xs: !1,
sm: !1,
md: !1,
lg: !1,
xl: !1,
xxl: !1
}), _ = (i) => (0, o.computed)(() => {
if (typeof n[i] == "string")
return n[i];
if (typeof n[i] != "object")
return "";
for (let d = 0; d < x.responsiveArray.length; d++) {
const N = x.responsiveArray[d];
if (!$.value[N])
continue;
const R = n[i][N];
if (R !== void 0)
return R;
}
return "";
}), T = _("align"), p = _("justify"), L = (0, f.default)();
(0, o.onMounted)(() => {
F = h.value.subscribe((i) => {
$.value = i;
const d = n.gutter || 0;
(!Array.isArray(d) && typeof d == "object" || Array.isArray(d) && (typeof d[0] == "object" || typeof d[1] == "object")) && (b.value = i);
});
}), (0, o.onBeforeUnmount)(() => {
h.value.unsubscribe(F);
});
const I = (0, o.computed)(() => {
const i = [void 0, void 0], {
gutter: d = 0
} = n;
return (Array.isArray(d) ? d : [d, void 0]).forEach((R, Q) => {
if (typeof R == "object")
for (let U = 0; U < x.responsiveArray.length; U++) {
const V = x.responsiveArray[U];
if (b.value[V] && R[V] !== void 0) {
i[Q] = R[V];
break;
}
}
else
i[Q] = R;
}), i;
});
(0, S.default)({
gutter: I,
supportFlexGap: L,
wrap: (0, o.computed)(() => n.wrap)
});
const c = (0, o.computed)(() => (0, q.default)(C.value, {
[`${C.value}-no-wrap`]: n.wrap === !1,
[`${C.value}-${p.value}`]: p.value,
[`${C.value}-${T.value}`]: T.value,
[`${C.value}-rtl`]: M.value === "rtl"
}, y.class, K.value)), W = (0, o.computed)(() => {
const i = I.value, d = {}, N = i[0] != null && i[0] > 0 ? `${i[0] / -2}px` : void 0, R = i[1] != null && i[1] > 0 ? `${i[1] / -2}px` : void 0;
return N && (d.marginLeft = N, d.marginRight = N), L.value ? d.rowGap = `${i[1]}px` : R && (d.marginTop = R, d.marginBottom = R), d;
});
return () => {
var i;
return A((0, o.createVNode)("div", (0, v.default)((0, v.default)({}, y), {}, {
class: c.value,
style: (0, w.default)((0, w.default)({}, W.value), y.style)
}), [(i = g.default) === null || i === void 0 ? void 0 : i.call(g)]));
};
}
});
return P.default = r, P;
}
var E = {}, ee;
function ye() {
if (ee)
return E;
ee = 1;
var l = B;
Object.defineProperty(E, "__esModule", {
value: !0
}), E.default = E.colProps = void 0;
var o = H, v = l(te()), w = l(k()), q = l(ne()), x = l(se()), G = oe(), f = ae();
function S(e) {
return typeof e == "number" ? `${e} ${e} auto` : /^\d+(\.\d+)?(px|em|rem|%)$/.test(e) ? `0 0 ${e}` : e;
}
const m = () => ({
span: [String, Number],
order: [String, Number],
offset: [String, Number],
push: [String, Number],
pull: [String, Number],
xs: {
type: [String, Number, Object],
default: void 0
},
sm: {
type: [String, Number, Object],
default: void 0
},
md: {
type: [String, Number, Object],
default: void 0
},
lg: {
type: [String, Number, Object],
default: void 0
},
xl: {
type: [String, Number, Object],
default: void 0
},
xxl: {
type: [String, Number, Object],
default: void 0
},
prefixCls: String,
flex: [String, Number]
});
E.colProps = m;
const a = ["xs", "sm", "md", "lg", "xl", "xxl"];
var t = (0, o.defineComponent)({
compatConfig: {
MODE: 3
},
name: "ACol",
inheritAttrs: !1,
props: m(),
setup(e, u) {
let {
slots: s,
attrs: r
} = u;
const {
gutter: n,
supportFlexGap: j,
wrap: g
} = (0, G.useInjectRow)(), {
prefixCls: y,
direction: C
} = (0, x.default)("col", e), [M, A] = (0, f.useColStyle)(y), K = (0, o.computed)(() => {
const {
span: h,
order: b,
offset: $,
push: _,
pull: T
} = e, p = y.value;
let L = {};
return a.forEach((I) => {
let c = {};
const W = e[I];
typeof W == "number" ? c.span = W : typeof W == "object" && (c = W || {}), L = (0, w.default)((0, w.default)({}, L), {
[`${p}-${I}-${c.span}`]: c.span !== void 0,
[`${p}-${I}-order-${c.order}`]: c.order || c.order === 0,
[`${p}-${I}-offset-${c.offset}`]: c.offset || c.offset === 0,
[`${p}-${I}-push-${c.push}`]: c.push || c.push === 0,
[`${p}-${I}-pull-${c.pull}`]: c.pull || c.pull === 0,
[`${p}-rtl`]: C.value === "rtl"
});
}), (0, q.default)(p, {
[`${p}-${h}`]: h !== void 0,
[`${p}-order-${b}`]: b,
[`${p}-offset-${$}`]: $,
[`${p}-push-${_}`]: _,
[`${p}-pull-${T}`]: T
}, L, r.class, A.value);
}), F = (0, o.computed)(() => {
const {
flex: h
} = e, b = n.value, $ = {};
if (b && b[0] > 0) {
const _ = `${b[0] / 2}px`;
$.paddingLeft = _, $.paddingRight = _;
}
if (b && b[1] > 0 && !j.value) {
const _ = `${b[1] / 2}px`;
$.paddingTop = _, $.paddingBottom = _;
}
return h && ($.flex = S(h), g.value === !1 && !$.minWidth && ($.minWidth = 0)), $;
});
return () => {
var h;
return M((0, o.createVNode)("div", (0, v.default)((0, v.default)({}, r), {}, {
class: K.value,
style: [F.value, r.style]
}), [(h = s.default) === null || h === void 0 ? void 0 : h.call(s)]));
};
}
});
return E.default = t, E;
}
export {
me as a,
le as b,
ye as r
};