UNPKG

@xiaolxl/ygui

Version:

一个可扩展,轻量化,新拟态的基于vue3的UI框架

488 lines (487 loc) 14.1 kB
import { openBlock as c, createElementBlock as f, Fragment as M, pushScopeId as H, popScopeId as K, createElementVNode as d, resolveComponent as T, normalizeClass as y, renderSlot as b, createBlock as m, createCommentVNode as v, createVNode as X, TransitionGroup as q, withCtx as O, renderList as z, createTextVNode as W, toDisplayString as J, createApp as Q } from "vue"; import Z from "animejs"; var ee = typeof global == "object" && global && global.Object === Object && global; const P = ee; var te = typeof self == "object" && self && self.Object === Object && self, ne = P || te || Function("return this")(); const F = ne; var oe = F.Symbol; const x = oe; var V = Object.prototype, re = V.hasOwnProperty, ae = V.toString, _ = x ? x.toStringTag : void 0; function ie(e) { var n = re.call(e, _), t = e[_]; try { e[_] = void 0; var o = !0; } catch { } var a = ae.call(e); return o && (n ? e[_] = t : delete e[_]), a; } var se = Object.prototype, ce = se.toString; function ue(e) { return ce.call(e); } var le = "[object Null]", de = "[object Undefined]", S = x ? x.toStringTag : void 0; function j(e) { return e == null ? e === void 0 ? de : le : S && S in Object(e) ? ie(e) : ue(e); } function B(e) { return e != null && typeof e == "object"; } var fe = Array.isArray; const D = fe; function pe(e) { var n = typeof e; return e != null && (n == "object" || n == "function"); } function _e(e) { return e; } var ge = "[object AsyncFunction]", ye = "[object Function]", be = "[object GeneratorFunction]", me = "[object Proxy]"; function he(e) { if (!pe(e)) return !1; var n = j(e); return n == ye || n == be || n == ge || n == me; } function ve(e, n) { for (var t = -1, o = e == null ? 0 : e.length; ++t < o && n(e[t], t, e) !== !1; ) ; return e; } var xe = 9007199254740991, Te = /^(?:0|[1-9]\d*)$/; function $e(e, n) { var t = typeof e; return n = n == null ? xe : n, !!n && (t == "number" || t != "symbol" && Te.test(e)) && e > -1 && e % 1 == 0 && e < n; } var je = 9007199254740991; function U(e) { return typeof e == "number" && e > -1 && e % 1 == 0 && e <= je; } function C(e) { return e != null && U(e.length) && !he(e); } var Be = Object.prototype; function Ae(e) { var n = e && e.constructor, t = typeof n == "function" && n.prototype || Be; return e === t; } function Oe(e, n) { for (var t = -1, o = Array(e); ++t < e; ) o[t] = n(t); return o; } var Se = "[object Arguments]"; function w(e) { return B(e) && j(e) == Se; } var N = Object.prototype, we = N.hasOwnProperty, Ie = N.propertyIsEnumerable, Ye = w(function() { return arguments; }()) ? w : function(e) { return B(e) && we.call(e, "callee") && !Ie.call(e, "callee"); }; const ke = Ye; function Ee() { return !1; } var L = typeof exports == "object" && exports && !exports.nodeType && exports, I = L && typeof module == "object" && module && !module.nodeType && module, Me = I && I.exports === L, Y = Me ? F.Buffer : void 0, Pe = Y ? Y.isBuffer : void 0, Fe = Pe || Ee; const Ve = Fe; var De = "[object Arguments]", Ue = "[object Array]", Ce = "[object Boolean]", Ne = "[object Date]", Le = "[object Error]", Ge = "[object Function]", Re = "[object Map]", He = "[object Number]", Ke = "[object Object]", Xe = "[object RegExp]", qe = "[object Set]", ze = "[object String]", We = "[object WeakMap]", Je = "[object ArrayBuffer]", Qe = "[object DataView]", Ze = "[object Float32Array]", et = "[object Float64Array]", tt = "[object Int8Array]", nt = "[object Int16Array]", ot = "[object Int32Array]", rt = "[object Uint8Array]", at = "[object Uint8ClampedArray]", it = "[object Uint16Array]", st = "[object Uint32Array]", r = {}; r[Ze] = r[et] = r[tt] = r[nt] = r[ot] = r[rt] = r[at] = r[it] = r[st] = !0; r[De] = r[Ue] = r[Je] = r[Ce] = r[Qe] = r[Ne] = r[Le] = r[Ge] = r[Re] = r[He] = r[Ke] = r[Xe] = r[qe] = r[ze] = r[We] = !1; function ct(e) { return B(e) && U(e.length) && !!r[j(e)]; } function ut(e) { return function(n) { return e(n); }; } var G = typeof exports == "object" && exports && !exports.nodeType && exports, g = G && typeof module == "object" && module && !module.nodeType && module, lt = g && g.exports === G, $ = lt && P.process, dt = function() { try { var e = g && g.require && g.require("util").types; return e || $ && $.binding && $.binding("util"); } catch { } }(); const k = dt; var E = k && k.isTypedArray, ft = E ? ut(E) : ct; const pt = ft; var _t = Object.prototype, gt = _t.hasOwnProperty; function yt(e, n) { var t = D(e), o = !t && ke(e), a = !t && !o && Ve(e), i = !t && !o && !a && pt(e), s = t || o || a || i, u = s ? Oe(e.length, String) : [], h = u.length; for (var l in e) (n || gt.call(e, l)) && !(s && (l == "length" || a && (l == "offset" || l == "parent") || i && (l == "buffer" || l == "byteLength" || l == "byteOffset") || $e(l, h))) && u.push(l); return u; } function bt(e, n) { return function(t) { return e(n(t)); }; } var mt = bt(Object.keys, Object); const ht = mt; var vt = Object.prototype, xt = vt.hasOwnProperty; function Tt(e) { if (!Ae(e)) return ht(e); var n = []; for (var t in Object(e)) xt.call(e, t) && t != "constructor" && n.push(t); return n; } function $t(e) { return C(e) ? yt(e) : Tt(e); } function jt(e) { return function(n, t, o) { for (var a = -1, i = Object(n), s = o(n), u = s.length; u--; ) { var h = s[e ? u : ++a]; if (t(i[h], h, i) === !1) break; } return n; }; } var Bt = jt(); const At = Bt; function Ot(e, n) { return e && At(e, n, $t); } function St(e, n) { return function(t, o) { if (t == null) return t; if (!C(t)) return e(t, o); for (var a = t.length, i = n ? a : -1, s = Object(t); (n ? i-- : ++i < a) && o(s[i], i, s) !== !1; ) ; return t; }; } var wt = St(Ot); const It = wt; function Yt(e) { return typeof e == "function" ? e : _e; } function kt(e, n) { var t = D(e) ? ve : It; return t(e, Yt(n)); } const p = (e, n) => { const t = e.__vccOpts || e; for (const [o, a] of n) t[o] = a; return t; }, Et = {}, R = (e) => (H("data-v-283175f7"), e = e(), K(), e), Mt = /* @__PURE__ */ R(() => /* @__PURE__ */ d("div", { class: "loading_back" }, null, -1)), Pt = /* @__PURE__ */ R(() => /* @__PURE__ */ d("svg", { xmlns: "http://www.w3.org/2000/svg", class: "loading", viewBox: "0 0 100 100", preserveAspectRatio: "xMidYMid" }, [ /* @__PURE__ */ d("circle", { cx: "50", cy: "50", r: "32", "stroke-width": "8", stroke: "#71c3fe", "stroke-dasharray": "50.26548245743669 50.26548245743669", fill: "none", "stroke-linecap": "round" }, [ /* @__PURE__ */ d("animateTransform", { attributeName: "transform", type: "rotate", repeatCount: "indefinite", dur: "1s", keyTimes: "0;1", values: "0 50 50;360 50 50" }) ]) ], -1)); function Ft(e, n, t, o, a, i) { return c(), f(M, null, [ Mt, Pt ], 64); } const A = /* @__PURE__ */ p(Et, [["render", Ft], ["__scopeId", "data-v-283175f7"]]); const Vt = { name: "YuBlock", props: { loading: { type: Boolean, default: !1 } }, components: { "yu-loading": A } }; function Dt(e, n, t, o, a, i) { const s = T("yu-loading"); return c(), f("div", { class: y(["block", t.loading ? "loading_fix" : ""]) }, [ b(e.$slots, "default", {}, void 0, !0), t.loading ? (c(), m(s, { key: 0 })) : v("", !0) ], 2); } const Ut = /* @__PURE__ */ p(Vt, [["render", Dt], ["__scopeId", "data-v-c2b64651"]]); const Ct = { name: "YuButton", props: { cycle: { type: Boolean, default: !1 }, loading: { type: Boolean, default: !1 }, disabled: { type: Boolean, default: !1 } }, components: { "yu-loading": A } }, Nt = ["disabled"]; function Lt(e, n, t, o, a, i) { const s = T("yu-loading"); return c(), f("button", { disabled: t.disabled, class: y([ "button", t.loading || t.disabled ? "disabled_button" : "enable_button", t.disabled ? "disabled_back" : "", t.cycle ? "cycle_button" : "common_button" ]) }, [ b(e.$slots, "default", {}, void 0, !0), t.loading ? (c(), m(s, { key: 0 })) : v("", !0) ], 10, Nt); } const Gt = /* @__PURE__ */ p(Ct, [["render", Lt], ["__scopeId", "data-v-758e6d49"]]); const Rt = { name: "YuInput", emits: ["update:modelValue"], props: { modelValue: { type: String, default: "" }, placeholder: { type: String, default: "" } }, methods: { upData(e) { this.$emit("update:modelValue", e.target.value); } } }, Ht = ["value", "placeholder"]; function Kt(e, n, t, o, a, i) { return c(), f("input", { type: "text", class: "input", value: t.modelValue, onInput: n[0] || (n[0] = (...s) => i.upData && i.upData(...s)), placeholder: t.placeholder }, null, 40, Ht); } const Xt = /* @__PURE__ */ p(Rt, [["render", Kt], ["__scopeId", "data-v-9d47f897"]]); const qt = { name: "YuText", emits: ["update:modelValue"], props: { modelValue: { type: String, default: "" }, placeholder: { type: String, default: "" }, autoHeight: { type: Boolean, default: !1 } }, methods: { upData(e) { this.$emit("update:modelValue", e.target.value), this.autoHeight && (e.target.style.height = e.target.style.minHeight, e.target.style.height = e.target.scrollHeight + 2 + "px"); } } }, zt = ["value", "placeholder"]; function Wt(e, n, t, o, a, i) { return c(), f("textarea", { class: "text", value: t.modelValue, onInput: n[0] || (n[0] = (...s) => i.upData && i.upData(...s)), placeholder: t.placeholder }, null, 40, zt); } const Jt = /* @__PURE__ */ p(qt, [["render", Wt], ["__scopeId", "data-v-56322464"]]); const Qt = { name: "YuSides", components: { YuLoading: A }, props: { column: { type: Boolean, default: !1 }, loading: { type: Boolean, default: !1 } }, data() { return { nowSide: 0 }; }, methods: { flip() { let e = Z.timeline({ autoplay: !1 }), n; this.nowSide === 0 ? (n = ["0deg", "180deg"], this.nowSide = 1) : (n = ["180deg", "0deg"], this.nowSide = 0), this.column ? e.add({ targets: this.$refs.sides, rotateX: n, easing: "easeOutBounce", duration: 800 }) : e.add({ targets: this.$refs.sides, rotateY: n, easing: "easeOutBounce", duration: 800 }), e.play(); } } }, Zt = { class: "front" }, en = { class: "back" }; function tn(e, n, t, o, a, i) { const s = T("yu-loading"); return c(), f("div", { ref: "sides", class: y(t.column ? "column_root" : "row_root") }, [ d("div", Zt, [ b(e.$slots, "front", {}, void 0, !0), t.loading ? (c(), m(s, { key: 0 })) : v("", !0) ]), d("div", en, [ b(e.$slots, "back", {}, void 0, !0), t.loading ? (c(), m(s, { key: 0 })) : v("", !0) ]) ], 2); } const nn = /* @__PURE__ */ p(Qt, [["render", tn], ["__scopeId", "data-v-caffebeb"]]), on = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({ __proto__: null, YuBlock: Ut, YuButton: Gt, YuInput: Xt, YuText: Jt, YuSides: nn }, Symbol.toStringTag, { value: "Module" })); const rn = { name: "TipBox", props: ["item"], emits: ["deleteMe"], created() { this.item.time == null && (this.item.time = 2e3), this.item.type == null && (this.item.type = "info"), setTimeout(() => { this.$emit("deleteMe", this.item); }, this.item.time); } }, an = { class: "icon" }, sn = { class: "text" }; function cn(e, n, t, o, a, i) { return c(), f("div", { ref: "tipBox", class: y(["tipBox", [ t.item.type === "info" ? "info" : "", t.item.type === "success" ? "success" : "", t.item.type === "warning" ? "warning" : "", t.item.type === "error" ? "error" : "" ]]) }, [ d("div", an, [ d("i", { class: y(["bi", [ t.item.type === "info" ? "bi-info-circle-fill" : "", t.item.type === "success" ? "bi-check-circle-fill" : "", t.item.type === "warning" ? "bi-exclamation-circle-fill" : "", t.item.type === "error" ? "bi-x-circle-fill" : "" ]]) }, null, 2) ]), d("div", sn, [ b(e.$slots, "default", {}, void 0, !0) ]) ], 2); } const un = /* @__PURE__ */ p(rn, [["render", cn], ["__scopeId", "data-v-36e01a94"]]); function ln() { let e = [], n = "0123456789abcdef"; for (let t = 0; t < 36; t++) e[t] = n.substring(Math.floor(Math.random() * 16), Math.floor(Math.random() * 16) + 1); return e[14] = "4", e[19] = n.substring(e[19] & 3 | 8, (e[19] & 3 | 8) + 1), e[8] = e[13] = e[18] = e[23] = "-", e.join(""); } const dn = { name: "YuTipBox", components: { TipBox: un }, data() { return { messages: [] }; }, methods: { deleteMe(e) { let n = -1; for (let t = 0; t < this.messages.length; t++) this.messages[t].id === e.id && (n = t); n > -1 && this.messages.splice(n, 1); }, Tip(e) { e.id = ln(), this.messages.push(e); } } }, fn = { class: "tipBoxRoot", id: "YuTipBoxRoot" }; function pn(e, n, t, o, a, i) { const s = T("tip-box"); return c(), f("div", fn, [ X(q, { name: "tip" }, { default: O(() => [ (c(!0), f(M, null, z(a.messages, (u) => (c(), m(s, { key: u.id, onDeleteMe: i.deleteMe, item: u }, { default: O(() => [ W(J(u.text), 1) ]), _: 2 }, 1032, ["onDeleteMe", "item"]))), 128)) ]), _: 1 }) ]); } const _n = /* @__PURE__ */ p(dn, [["render", pn], ["__scopeId", "data-v-e0480d42"]]), bn = { install: (e) => { kt(on, (a) => { e.component(a.name, a); }); let n = document.createElement("div"); document.body.appendChild(n); let o = Q(_n).mount(n); e.config.globalProperties.$tip = o.Tip; } }; export { bn as YgUi };