UNPKG

noist-beui

Version:

Vue 3 전용 UI 라이브러리

1,916 lines 101 kB
import { createElementBlock as c, openBlock as s, normalizeClass as g, renderSlot as A, createCommentVNode as $, createTextVNode as q, toDisplayString as T, mergeModels as I, useModel as G, Fragment as M, renderList as j, createBlock as ce, mergeProps as Lt, ref as B, computed as k, withDirectives as ne, vModelDynamic as lt, vModelText as Fe, onMounted as le, withModifiers as He, createElementVNode as h, vModelCheckbox as je, unref as oe, vModelRadio as Vt, watch as te, nextTick as Rt, normalizeStyle as U, shallowRef as Ot, getCurrentScope as Nt, onScopeDispose as At, shallowReadonly as ve, reactive as Mt, onUnmounted as at, Teleport as ot, createVNode as De, Transition as it, withCtx as Ee, resolveComponent as Be, onBeforeUnmount as Dt } from "vue"; const Et = ["href", "target"], st = { __name: "BeButton", props: { contentText: { type: String, default: "" }, brand: { type: String }, status: { type: String }, color: { type: String }, text: { type: Boolean }, border: { type: Boolean }, disabled: { type: Boolean }, fluid: { type: Boolean }, round: { type: Boolean }, compact: { type: Boolean }, outline: { type: Boolean }, icon: { type: Boolean }, withIcon: { type: String || Array, default: null }, iconPos: { type: String }, badge: { type: String }, badgeOption: { type: String }, link: { type: String, default: null }, linkTarget: { type: String, default: null }, size: { type: String, default: null } }, emits: ["onClick"], setup(e, { emit: t }) { const n = t, l = (a) => { n("onClick", a); }; return (a, o) => (s(), c("button", { class: g(["be-button", [ e.brand, e.status, e.color, e.size, { text: e.text }, { link: e.link }, { border: e.border }, { disabled: e.disabled }, { fluid: e.fluid }, { round: e.round }, { compact: e.compact }, { outline: e.outline }, { icon: e.icon }, { badge: e.badge } ]]), onClick: l }, [ A(a.$slots, "default", {}, () => [ e.withIcon && (e.iconPos === "left" || e.iconPos === "both") ? (s(), c("i", { key: 0, class: g(["icon", [ e.iconPos, typeof e.withIcon == "string" ? e.withIcon : e.withIcon[0] ]]) }, null, 2)) : $("", !0), e.icon ? (s(), c("i", { key: 1, class: g(["icon", e.icon]) }, null, 2)) : $("", !0), q(" " + T(e.contentText) + " ", 1), e.withIcon && (e.iconPos === "right" || e.iconPos === "both") ? (s(), c("i", { key: 2, class: g(["icon", [ e.iconPos, typeof e.withIcon == "string" ? e.withIcon : e.withIcon[1] ]]) }, null, 2)) : $("", !0), e.badge ? (s(), c("div", { key: 3, class: g(["in-badge", e.badgeOption]) }, T(e.badge), 3)) : $("", !0) ]), e.link ? (s(), c("a", { key: 0, href: e.link, target: e.linkTarget || "_self" }, null, 8, Et)) : $("", !0) ], 2)); } }, Pt = { __name: "BeButtons", props: /* @__PURE__ */ I({ buttons: { type: Array, required: !0 }, round: { type: Boolean, default: !1 }, border: { type: Boolean, default: !1 } }, { modelValue: {}, modelModifiers: {} }), emits: ["update:modelValue"], setup(e) { const t = G(e, "modelValue"), n = (l) => { t.value = l; }; return (l, a) => (s(), c("div", { class: g(["be-buttons", [{ round: e.round }, { border: e.border }]]) }, [ A(l.$slots, "default", {}, () => [ (s(!0), c(M, null, j(e.buttons, (o, i) => (s(), ce(st, Lt({ key: `btn-${i}`, ref_for: !0 }, typeof o == "string" ? { contentText: o } : o, { onClick: () => n(i), class: { selected: t.value === i } }), null, 16, ["onClick", "class"]))), 128)) ]) ], 2)); } }, It = ["data-unit"], Ft = ["type", "placeholder", "disabled", "readonly"], Ht = ["placeholder"], jt = { key: 3, class: "label" }, zt = { __name: "BeInput", props: /* @__PURE__ */ I({ type: { type: String, default: "input", validator(e) { return ["input", "textarea"].includes(e); } }, inputType: { type: String, default: "text" }, align: { type: String, default: "left", validator(e) { return ["left", "center", "right"].includes(e); } }, status: { type: String, default: null, validator(e) { return ["success", "error", "attention", "info", "importance"].includes( e ); } }, placeholder: { type: String, default: "" }, readonly: { type: Boolean, default: !1 }, round: { type: Boolean, default: !1 }, underline: { type: Boolean, default: !1 }, transparent: { type: Boolean, default: !1 }, compact: { type: Boolean, default: !1 }, fluid: { type: Boolean, default: !1 }, iconLeft: { type: String, default: null }, iconRight: { type: String, default: null }, clear: { type: Boolean, default: !1 }, badge: { type: String, default: null }, badgeOption: { type: String, default: null }, edit: { type: Boolean, default: !1 }, editMode: { type: Boolean, default: !1 }, unit: { type: String, default: null }, disabled: { type: Boolean, default: !1 }, labeled: { type: Boolean, default: !1 }, withButton: { type: Boolean, default: !1 }, attachStart: { type: Boolean, default: !1 }, attachEnd: { type: Boolean, default: !1 }, label: { type: String, default: null } }, { modelValue: {}, modelModifiers: {} }), emits: /* @__PURE__ */ I(["focus"], ["update:modelValue"]), setup(e, { emit: t }) { const n = e, l = G(e, "modelValue"), a = t, o = B(!1), i = B(null), u = k(() => n.iconLeft && n.iconRight ? "both" : n.iconLeft ? "left" : n.iconRight ? "right" : null), d = k(() => n.label ? " " : n.placeholder), r = () => { o.value || (o.value = !0, console.log("focus", o.value), a("focus", o.value)); }, f = () => { o.value = !1, a("focus", o.value); }, v = () => { console.log("value", l.value), l.value = ""; }; return (y, m) => (s(), c("div", { class: g(["be-input", [ e.status, { readonly: e.readonly }, { underline: e.underline }, { round: e.round }, { transparent: e.transparent }, { compact: e.compact }, { fluid: e.fluid }, { labeled: e.labeled }, { left: e.labeled && e.attachStart || e.withButton && e.attachStart }, { right: e.labeled && e.attachEnd || e.withButton && e.attachEnd }, { withButton: e.withButton }, { edit: e.edit }, { editable: e.editMode }, { icon: e.iconLeft || e.iconRight || e.clear }, u.value, { badge: e.badge }, { unit: e.unit }, { disabled: e.disabled } ]]), "data-unit": e.unit }, [ A(y.$slots, "start"), A(y.$slots, "default", {}, () => [ e.iconLeft ? (s(), c("i", { key: 0, class: g(`icon xi-${e.iconLeft}`) }, null, 2)) : $("", !0), e.type === "input" ? ne((s(), c("input", { key: 1, type: e.inputType, "onUpdate:modelValue": m[0] || (m[0] = (p) => l.value = p), placeholder: d.value, class: g([`aline-${e.align}`]), ref_key: "input", ref: i, disabled: e.disabled, readonly: e.readonly, onClick: m[1] || (m[1] = (p) => r()), onBlur: m[2] || (m[2] = (p) => f()) }, null, 42, Ft)), [ [lt, l.value] ]) : ne((s(), c("textarea", { key: 2, "onUpdate:modelValue": m[3] || (m[3] = (p) => l.value = p), rows: "3", placeholder: e.placeholder }, null, 8, Ht)), [ [Fe, l.value] ]), e.label ? (s(), c("label", jt, T(e.label), 1)) : $("", !0), e.clear ? (s(), c("i", { key: 4, class: g(["icon clear-btn xi-close", { disabled: l.value === "" }]), onMousedown: v }, null, 34)) : $("", !0), e.iconRight ? (s(), c("i", { key: 5, class: g(`icon xi-${e.iconRight}`) }, null, 2)) : e.badge ? (s(), c("span", { key: 6, class: g(["be-badge", e.badgeOption]) }, T(e.badge), 3)) : $("", !0) ]), A(y.$slots, "end") ], 10, It)); } }, Wt = { __name: "BeInputNumber", props: /* @__PURE__ */ I({ status: { type: String, default: null, validator(e) { return ["success", "error", "attention", "info", "importance"].includes( e ); } }, placeholder: { type: String, default: "" }, readonly: { type: Boolean, default: !1 }, compact: { type: Boolean, default: !1 }, fluid: { type: Boolean, default: !1 }, round: { type: Boolean, default: !1 }, iconLeft: { type: String, default: null }, iconRight: { type: String, default: null }, step: { type: Number, default: 1 }, controller: { type: String, default: "between" }, min: { type: Number }, max: { type: Number }, incIcon: { type: String, default: "xi-plus" }, decIcon: { type: String, default: "xi-minus" }, disabled: { type: Boolean, default: !1 } }, { modelValue: {}, modelModifiers: {} }), emits: /* @__PURE__ */ I(["focus"], ["update:modelValue"]), setup(e, { emit: t }) { const n = e, l = G(e, "modelValue"), a = t, o = B(!1), i = B(null); le(() => { l.value < n.min && (l.value = n.min), l.value > n.max && (l.value = n.max); }); const u = () => { o.value || (o.value = !0, console.log("fucus", o.value), a("focus", o.value)); }, d = () => { o.value = !1, a("focus", o.value); }, r = () => { l.value + n.step > n.max || (l.value += n.step); }, f = () => { l.value - n.step < n.min || (l.value -= n.step); }, v = (y) => { n.disabled || (y.keyCode === 38 && r(), y.keyCode === 40 && f()); }; return (y, m) => (s(), c("div", { class: g(["be-input button number", [e.status, { readonly: e.readonly, compact: e.compact, fluid: e.fluid, disabled: e.disabled, round: e.round }, e.controller]]), tabindex: "-1", onKeydown: He(v, ["prevent"]) }, [ A(y.$slots, "default", {}, () => [ ne(h("input", { type: "number", "onUpdate:modelValue": m[0] || (m[0] = (p) => l.value = p), ref_key: "input", ref: i, onClick: m[1] || (m[1] = (p) => u()), onBlur: m[2] || (m[2] = (p) => d()) }, null, 544), [ [Fe, l.value] ]) ]), h("button", { class: g(["be-button icon dec border", { disabled: e.disabled }]), onClick: f }, [ h("i", { class: g(["icon", e.decIcon]) }, null, 2) ], 2), h("button", { class: g(["be-button icon inc border", { disabled: e.disabled }]), onClick: r }, [ h("i", { class: g(["icon", e.incIcon]) }, null, 2) ], 2) ], 34)); } }, Ut = ["for"], Kt = ["name"], Xt = { __name: "BeCheckBox", props: /* @__PURE__ */ I({ type: { type: String, default: "checkbox", varidator: (e) => ["checkbox", "radio"].includes(e) }, name: { type: String }, labelText: { type: String, default: null }, indeter: { type: Boolean, default: !1 } }, { modelValue: {}, modelModifiers: {} }), emits: ["update:modelValue"], setup(e) { const t = G(e, "modelValue"); return (n, l) => (s(), c("label", { for: e.name, class: g(["be-checkbox", [e.type, { checked: t.value }, { indeter: e.indeter }]]) }, [ ne(h("input", { type: "checkbox", name: e.name, "onUpdate:modelValue": l[0] || (l[0] = (a) => t.value = a) }, null, 8, Kt), [ [je, t.value] ]), q(" " + T(e.labelText), 1) ], 10, Ut)); } }, Le = (e, t) => { const n = e.__vccOpts || e; for (const [l, a] of t) n[l] = a; return n; }, Gt = { class: "be-checkout-group" }, qt = ["for"], Yt = ["id", "onUpdate:modelValue"], Jt = { __name: "BeCheckBoxGroup", props: /* @__PURE__ */ I({ checkList: { type: Array, required: !0 } }, { result: {}, resultModifiers: {} }), emits: /* @__PURE__ */ I(["result"], ["update:result"]), setup(e, { emit: t }) { const n = e, l = Math.random().toString(36), a = t, o = G(e, "result"), i = B(new Array(n.checkList.length).fill(!1)); le(() => { o.value.forEach((d) => { const r = n.checkList.findIndex((f) => f === d); i.value[r] = !0; }); }); const u = () => { o.value = n.checkList.filter((d, r) => i.value[r]), a("result", o.value); }; return (d, r) => (s(), c("div", Gt, [ (s(!0), c(M, null, j(e.checkList, (f, v) => (s(), c("label", { key: f, class: g(["be-checkbox", { checked: i.value[v] }]), for: `${f}-${oe(l)}` }, [ ne(h("input", { type: "checkbox", id: `${f}-${oe(l)}`, "onUpdate:modelValue": (y) => i.value[v] = y, onChange: u }, null, 40, Yt), [ [je, i.value[v]] ]), q(" " + T(f), 1) ], 10, qt))), 128)) ])); } }, Qt = /* @__PURE__ */ Le(Jt, [["__scopeId", "data-v-8b51215e"]]), Zt = { class: "be-radio" }, _t = ["for"], en = ["id", "value"], tn = { __name: "BeRadio", props: /* @__PURE__ */ I({ optionList: { type: Array, required: !0 }, selected: { type: String, default: "" } }, { result: {}, resultModifiers: {} }), emits: /* @__PURE__ */ I(["result"], ["update:result"]), setup(e, { emit: t }) { const n = Math.random().toString(36), l = t, a = G(e, "result"), o = () => { l("result", a.value); }; return (i, u) => (s(), c("div", Zt, [ (s(!0), c(M, null, j(e.optionList, (d) => (s(), c("label", { key: d, class: g(["be-checkbox radio", { checked: d === a.value }]), for: `${d}-${oe(n)}` }, [ ne(h("input", { type: "radio", id: `${d}-${oe(n)}`, "onUpdate:modelValue": u[0] || (u[0] = (r) => a.value = r), value: d, onChange: o }, null, 40, en), [ [Vt, a.value] ]), q(" " + T(d), 1) ], 10, _t))), 128)) ])); } }, nn = /* @__PURE__ */ Le(tn, [["__scopeId", "data-v-1c67984c"]]), ln = ["onClick"], an = { key: 0, class: "item-img" }, on = ["src"], sn = { class: "item-title" }, un = { key: 0, class: "sub-title" }, cn = { key: 2, class: "btn-set" }, rn = { class: "be-button round icon" }, dn = ["Class"], fn = { __name: "BeList", props: /* @__PURE__ */ I({ options: { type: Array, default: () => [] }, selection: { type: Boolean, default: !1 }, selectedType: { type: String, default: "bg" }, icon: { type: Boolean, default: !1 }, image: { type: Boolean, default: !1 }, border: { type: Boolean, default: !1 } }, { modelValue: {}, modelModifiers: {} }), emits: ["update:modelValue"], setup(e) { const t = G(e, "modelValue"); return (n, l) => (s(), c("div", { class: g(["be-list", [{ selection: e.selection }, { border: e.border }, e.selectedType]]) }, [ (s(!0), c(M, null, j(e.options, (a) => (s(), c("div", { class: g(["item", { selected: t.value && t.value.option === a.option }]), key: a.option, onClick: (o) => t.value = a }, [ e.image ? (s(), c("div", an, [ h("img", { src: a.image }, null, 8, on) ])) : e.icon ? (s(), c("i", { key: 1, class: g(["list-icon icon", a.icon]) }, null, 2)) : $("", !0), h("div", sn, [ q(T(a.option) + " ", 1), a.sub ? (s(), c("div", un, T(a.sub), 1)) : $("", !0) ]), n.button ? (s(), c("div", cn, [ h("div", rn, [ h("i", { Class: a.icon }, null, 8, dn) ]) ])) : $("", !0) ], 10, ln))), 128)) ], 2)); } }, mn = { class: "title" }, vn = { class: "contents" }, yn = { __name: "BeMessage", props: { title: { type: String }, contents: { type: String }, icon: { type: String }, status: { type: String, default: null, varidator: (e) => ["success", "danger", "info", "attention", "importance"].includes( e ) }, statusType: { type: String, default: null, varidator: (e) => ["text", "bg", "border"].includes(e) }, selected: { type: Boolean, default: !1 }, disabled: { type: Boolean, default: !1 } }, setup(e) { const t = { success: "xi-check-circle", info: "xi-info", danger: "xi-error", attention: "xi-warning", importance: "xi-star" }, n = e, l = k(() => n.status ? t[n.status] : n.icon), a = k(() => n.statusType ? `${n.status}-${n.statusType}` : n.status); return (o, i) => (s(), c("div", { class: g(["be-message", [{ icon: e.icon }, a.value, { selected: e.selected, disabled: e.disabled }]]) }, [ e.icon ? (s(), c("i", { key: 0, class: g(["icon", l.value]) }, null, 2)) : $("", !0), A(o.$slots, "default", {}, () => [ h("div", mn, T(e.title), 1), h("div", vn, T(e.contents), 1) ]) ], 2)); } }, gn = { class: "pagination-page-wrapper" }, hn = ["onClick"], bn = { key: 1, class: "pagination-info" }, pn = { class: "pagination-nav current" }, xn = { class: "pagination-nav", last: "" }, wn = { __name: "BePagination", props: /* @__PURE__ */ I({ type: { type: String, default: "number", varidator: (e) => ["number", "page"].includes(e) }, round: { type: Boolean, default: !1 }, compact: { type: Boolean, default: !1 }, border: { type: Boolean, default: !1 }, align: { type: String, default: "left" }, limits: { type: Number, default: 5 }, currentPage: { type: Number, default: 1 }, pageLength: { type: Number, default: 1 }, itemClass: { type: String }, ellipsis: { type: Boolean, default: !1 }, color: { type: String }, firstText: { type: String, default: "F" }, lastText: { type: String, default: "L" }, activeType: { type: String, default: "button" // text } }, { modelValue: {}, modelModifiers: {} }), emits: /* @__PURE__ */ I(["change"], ["update:modelValue"]), setup(e, { emit: t }) { const n = e, l = B(null), a = G(e, "modelValue"), o = t, i = B(1), u = k(() => { if (m.value) return new Array(n.pageLength).fill(1).map((S, C) => S + C); if (n.ellipsis) { let S = 2, C = Math.floor(n.limits / 2); return r.value && (S = a.value - C), !f.value && r.value && (S = i.value - n.limits), new Array(n.limits).fill(0).map((O, z) => S + z); } else { let S = Math.min(d.value, n.pageLength - n.limits + 1); return new Array(n.limits).fill(S).map((C, O) => C + O); } }), d = k(() => Math.max(a.value - Math.ceil(n.limits * 0.5) + 1, 1)), r = k(() => a.value > Math.floor(n.limits / 2) + 2 && n.limits < i.value), f = k(() => a.value <= i.value - n.limits && n.limits < i.value), v = k(() => a.value + 1 > i.value), y = k(() => a.value - 1 <= 0), m = k(() => n.pageLength <= n.limits || !n.limits); te(n, () => { i.value = n.pageLength; }), le(async () => { await Rt(), l.value.focus(), i.value = n.pageLength; }); const p = (S) => { S > i.value || S <= 0 || (a.value = S, o("change", S)); }, b = () => { y.value || p(a.value - 1); }, x = () => { v.value || p(a.value + 1); }, w = () => { let S = a.value - n.limits <= 0 ? a.value - 1 : a.value - n.limits; p(S); }, R = () => { let S = a.value + n.limits > i.value ? a.value + 1 : a.value + n.limits; p(S); }; return (S, C) => (s(), c("div", { class: g(["be-pagination", [e.type, e.activeType, { round: e.round }, { compact: e.compact }, `align-${e.align}`, e.color]]), ref_key: "pageEl", ref: l }, [ !e.ellipsis && !m.value ? (s(), c("div", { key: 0, class: g(["pagination-nav first", [e.itemClass, { disabled: y.value }]]), onClick: C[0] || (C[0] = (O) => p(1)) }, [ e.firstText.indexOf("xi-") > -1 ? (s(), c("i", { key: 0, class: g(e.firstText) }, null, 2)) : (s(), c(M, { key: 1 }, [ q(T(e.firstText), 1) ], 64)) ], 2)) : $("", !0), h("div", { class: g(["pagination-nav prev", [e.itemClass, { disabled: y.value }]]), onClick: b }, C[4] || (C[4] = [ h("i", { class: "xi-angle-left" }, null, -1) ]), 2), e.ellipsis ? (s(), c(M, { key: 1 }, [ h("div", { class: g(["pagination-num", [e.itemClass, { active: a.value === 1 }]]), onClick: C[1] || (C[1] = (O) => p(1)) }, " 1 ", 2), r.value ? (s(), c("div", { key: 0, class: g(["pagination-num", [e.itemClass]]), onClick: w }, C[5] || (C[5] = [ h("i", { class: "xi-ellipsis-h" }, null, -1) ]), 2)) : $("", !0) ], 64)) : $("", !0), h("div", gn, [ e.type === "number" ? (s(!0), c(M, { key: 0 }, j(u.value, (O) => (s(), c("div", { class: g(["pagination-num", [e.itemClass, { active: O === a.value }]]), key: O, onClick: (z) => p(O) }, T(O), 11, hn))), 128)) : (s(), c("div", bn, [ h("div", pn, T(a.value), 1), C[6] || (C[6] = h("span", { class: "slash" }, "/", -1)), h("div", xn, T(i.value), 1) ])) ]), e.ellipsis && n.limits < n.pageLength ? (s(), c(M, { key: 2 }, [ f.value ? (s(), c("div", { key: 0, class: g(["pagination-nav", [e.itemClass]]), onClick: R }, C[7] || (C[7] = [ h("i", { class: "xi-ellipsis-h" }, null, -1) ]), 2)) : $("", !0), h("div", { class: g(["pagination-num", [e.itemClass, { active: i.value === a.value }]]), onClick: C[2] || (C[2] = (O) => p(i.value)) }, T(i.value), 3) ], 64)) : $("", !0), h("div", { class: g(["pagination-nav next", [e.itemClass, { disabled: v.value }]]), onClick: x }, C[8] || (C[8] = [ h("i", { class: "xi-angle-right" }, null, -1) ]), 2), !e.ellipsis && !m.value ? (s(), c("div", { key: 3, class: g(["pagination-nav last", [e.itemClass, { disabled: v.value }]]), onClick: C[3] || (C[3] = (O) => p(i.value)) }, [ e.lastText.indexOf("xi-") > -1 ? (s(), c("i", { key: 0, class: g(e.lastText) }, null, 2)) : (s(), c(M, { key: 1 }, [ q(T(e.lastText), 1) ], 64)) ], 2)) : $("", !0) ], 2)); } }, kn = { class: "title" }, Bn = { key: 0, class: "panel-toggle-btn" }, $n = { class: "content-wrapper" }, ut = { __name: "BePanel", props: { title: { type: String }, contents: { type: String }, border: { type: Boolean, default: !1 }, toggleIcon: { type: Array || String, default: null }, iconPos: { type: String, default: "" }, open: { type: Boolean, default: !1 }, collapse: { type: Boolean, default: !1 }, maxHeight: { type: Number, default: 200 } }, emits: ["show"], setup(e, { emit: t }) { const n = e, l = t, a = B(n.open), o = k(() => !n.toggleIcon && n.collapse ? "" : `icon ${n.iconPos}`), i = k(() => n.collapse ? { "--max-height": `${n.maxHeight}px` } : {}), u = () => { n.collapse && (a.value = !a.value, l("show", a.value)); }; return (d, r) => (s(), c("div", { class: g(["be-panel", [{ border: e.border, collapse: e.collapse }, o.value, { open: a.value }]]) }, [ h("div", { class: "panel-header", onClick: u }, [ h("div", kn, T(e.title), 1), e.collapse && e.toggleIcon ? (s(), c("span", Bn, [ typeof e.toggleIcon == "string" ? (s(), c("i", { key: 0, class: g(["icon", `${e.toggleIcon}`]) }, null, 2)) : (s(), c(M, { key: 1 }, [ a.value ? (s(), c("i", { key: 0, class: g(["icon", `${e.toggleIcon[1]}`]) }, null, 2)) : (s(), c("i", { key: 1, class: g(["icon", `${e.toggleIcon[0]}`]) }, null, 2)) ], 64)) ])) : $("", !0) ]), h("div", { class: "panel-content", style: U(i.value) }, [ h("div", $n, [ A(d.$slots, "contents", {}, () => [ q(T(e.contents), 1) ]) ]) ], 4) ], 2)); } }, Sn = { class: "be-accordion" }, Cn = { __name: "BeAccordion", props: { panelList: { type: Array, default: null }, toggleIcon: { type: String, default: "xi-angle-down" }, iconPos: { type: String, default: "left" } }, setup(e) { return (t, n) => (s(), c("div", Sn, [ A(t.$slots, "default", {}, () => [ (s(!0), c(M, null, j(e.panelList, (l, a) => (s(), ce(ut, { key: `panel-${a}`, title: l.title, contents: l.contents, "toggle-icon": e.toggleIcon, "icon-pos": e.iconPos, collapse: "", disabled: l.disabled }, null, 8, ["title", "contents", "toggle-icon", "icon-pos", "disabled"]))), 128)) ]) ])); } }, Tn = ["type", "name", "id", "value"], Ln = ["for"], Vn = { __name: "BeRadios", props: /* @__PURE__ */ I({ type: { type: String, default: "checkbox", varidator: (e) => ["checkbox", "radio"].includes(e) }, id: { type: String }, name: { type: String }, labelText: { type: String, default: "" } }, { modelValue: {}, modelModifiers: {} }), emits: ["update:modelValue"], setup(e) { const t = e, n = G(e, "modelValue"), l = k(() => t.type === "radio" ? n.value === t.id : n.value); return (a, o) => (s(), c("div", { class: g(["be-checkbox", [e.type, { checked: l.value }]]) }, [ ne(h("input", { type: e.type, name: e.name, id: e.id, "onUpdate:modelValue": o[0] || (o[0] = (i) => n.value = i), value: e.id }, null, 8, Tn), [ [lt, n.value] ]), h("label", { for: e.id }, [ A(a.$slots, "default", {}, () => [ q(T(e.labelText), 1) ]) ], 8, Ln) ], 2)); } }, Rn = ["onMouseenter", "onMousemove", "onClick"], On = { __name: "BeRate", props: { rateLength: { type: Number, default: 5 }, useHalf: { type: Boolean, default: !1 }, icon: { type: String, default: "xi-star" }, resultValue: { type: Number, default: 0 }, size: { type: String, default: null }, readonly: { type: Boolean, default: !1 }, color: { type: String, default: null }, border: { type: Boolean, default: !0 }, disabled: { type: Boolean, default: !1 }, clearable: { type: Boolean, default: !0 } }, emits: ["select"], setup(e, { emit: t }) { const n = e, l = t, a = B(0), o = B(0), i = B(!1), u = B(0), d = k(() => { const m = a.value * 10 % 10 * 10; return m === 0 ? {} : { width: `${m}%`, overflow: "hidden" }; }); te( () => n.resultValue, () => { a.value = n.resultValue, o.value = n.resultValue; }, { immediate: !0 } ), le(() => { u.value = a.value * 10 % 10 * 10; }); const r = (m) => { if (n.useHalf) { const p = event.target.getBoundingClientRect(); i.value = p.left + p.width / 2 - event.pageX > 0; } a.value = m; }, f = (m) => { n.useHalf && r(m); }, v = () => { a.value = o.value || 0; }, y = (m) => { n.clearable && (o.value = Math.ceil(o.value) === m ? 0 : o.value), o.value = o.value === m ? 0 : m, n.useHalf && (o.value = i.value ? m - 0.5 : m), l("select", o.value); }; return (m, p) => (s(), c("div", { class: g(["be-rate", [e.size, e.color, { readonly: e.readonly, disabled: e.disabled, border: e.border }]]) }, [ (s(!0), c(M, null, j(e.rateLength, (b) => (s(), c("span", { key: b, class: g(["rate-item", [ { check: Math.ceil(a.value) >= b }, { half: Math.ceil(a.value) === b && i.value } ]]), onMouseenter: (x) => r(b), onMouseleave: v, onMousemove: (x) => f(b), onClick: (x) => y(b) }, [ h("i", { class: g(["icon", `${e.icon}-o`]) }, null, 2), h("i", { class: g(["icon", e.icon]), style: U(Math.ceil(a.value) === b ? d.value : null) }, null, 6) ], 42, Rn))), 128)) ], 2)); } }, $e = Math.min, ue = Math.max, Se = Math.round, ke = Math.floor, Q = (e) => ({ x: e, y: e }), Nn = { left: "right", right: "left", bottom: "top", top: "bottom" }, An = { start: "end", end: "start" }; function Ge(e, t, n) { return ue(e, $e(t, n)); } function Ve(e, t) { return typeof e == "function" ? e(t) : e; } function re(e) { return e.split("-")[0]; } function Re(e) { return e.split("-")[1]; } function ct(e) { return e === "x" ? "y" : "x"; } function rt(e) { return e === "y" ? "height" : "width"; } const Mn = /* @__PURE__ */ new Set(["top", "bottom"]); function ae(e) { return Mn.has(re(e)) ? "y" : "x"; } function dt(e) { return ct(ae(e)); } function Dn(e, t, n) { n === void 0 && (n = !1); const l = Re(e), a = dt(e), o = rt(a); let i = a === "x" ? l === (n ? "end" : "start") ? "right" : "left" : l === "start" ? "bottom" : "top"; return t.reference[o] > t.floating[o] && (i = Ce(i)), [i, Ce(i)]; } function En(e) { const t = Ce(e); return [Pe(e), t, Pe(t)]; } function Pe(e) { return e.replace(/start|end/g, (t) => An[t]); } const qe = ["left", "right"], Ye = ["right", "left"], Pn = ["top", "bottom"], In = ["bottom", "top"]; function Fn(e, t, n) { switch (e) { case "top": case "bottom": return n ? t ? Ye : qe : t ? qe : Ye; case "left": case "right": return t ? Pn : In; default: return []; } } function Hn(e, t, n, l) { const a = Re(e); let o = Fn(re(e), n === "start", l); return a && (o = o.map((i) => i + "-" + a), t && (o = o.concat(o.map(Pe)))), o; } function Ce(e) { return e.replace(/left|right|bottom|top/g, (t) => Nn[t]); } function jn(e) { return { top: 0, right: 0, bottom: 0, left: 0, ...e }; } function zn(e) { return typeof e != "number" ? jn(e) : { top: e, right: e, bottom: e, left: e }; } function Te(e) { const { x: t, y: n, width: l, height: a } = e; return { width: l, height: a, top: n, left: t, right: t + l, bottom: n + a, x: t, y: n }; } function Je(e, t, n) { let { reference: l, floating: a } = e; const o = ae(t), i = dt(t), u = rt(i), d = re(t), r = o === "y", f = l.x + l.width / 2 - a.width / 2, v = l.y + l.height / 2 - a.height / 2, y = l[u] / 2 - a[u] / 2; let m; switch (d) { case "top": m = { x: f, y: l.y - a.height }; break; case "bottom": m = { x: f, y: l.y + l.height }; break; case "right": m = { x: l.x + l.width, y: v }; break; case "left": m = { x: l.x - a.width, y: v }; break; default: m = { x: l.x, y: l.y }; } switch (Re(t)) { case "start": m[i] -= y * (n && r ? -1 : 1); break; case "end": m[i] += y * (n && r ? -1 : 1); break; } return m; } const Wn = async (e, t, n) => { const { placement: l = "bottom", strategy: a = "absolute", middleware: o = [], platform: i } = n, u = o.filter(Boolean), d = await (i.isRTL == null ? void 0 : i.isRTL(t)); let r = await i.getElementRects({ reference: e, floating: t, strategy: a }), { x: f, y: v } = Je(r, l, d), y = l, m = {}, p = 0; for (let b = 0; b < u.length; b++) { const { name: x, fn: w } = u[b], { x: R, y: S, data: C, reset: O } = await w({ x: f, y: v, initialPlacement: l, placement: y, strategy: a, middlewareData: m, rects: r, platform: i, elements: { reference: e, floating: t } }); f = R ?? f, v = S ?? v, m = { ...m, [x]: { ...m[x], ...C } }, O && p <= 50 && (p++, typeof O == "object" && (O.placement && (y = O.placement), O.rects && (r = O.rects === !0 ? await i.getElementRects({ reference: e, floating: t, strategy: a }) : O.rects), { x: f, y: v } = Je(r, y, d)), b = -1); } return { x: f, y: v, placement: y, strategy: a, middlewareData: m }; }; async function ft(e, t) { var n; t === void 0 && (t = {}); const { x: l, y: a, platform: o, rects: i, elements: u, strategy: d } = e, { boundary: r = "clippingAncestors", rootBoundary: f = "viewport", elementContext: v = "floating", altBoundary: y = !1, padding: m = 0 } = Ve(t, e), p = zn(m), x = u[y ? v === "floating" ? "reference" : "floating" : v], w = Te(await o.getClippingRect({ element: (n = await (o.isElement == null ? void 0 : o.isElement(x))) == null || n ? x : x.contextElement || await (o.getDocumentElement == null ? void 0 : o.getDocumentElement(u.floating)), boundary: r, rootBoundary: f, strategy: d })), R = v === "floating" ? { x: l, y: a, width: i.floating.width, height: i.floating.height } : i.reference, S = await (o.getOffsetParent == null ? void 0 : o.getOffsetParent(u.floating)), C = await (o.isElement == null ? void 0 : o.isElement(S)) ? await (o.getScale == null ? void 0 : o.getScale(S)) || { x: 1, y: 1 } : { x: 1, y: 1 }, O = Te(o.convertOffsetParentRelativeRectToViewportRelativeRect ? await o.convertOffsetParentRelativeRectToViewportRelativeRect({ elements: u, rect: R, offsetParent: S, strategy: d }) : R); return { top: (w.top - O.top + p.top) / C.y, bottom: (O.bottom - w.bottom + p.bottom) / C.y, left: (w.left - O.left + p.left) / C.x, right: (O.right - w.right + p.right) / C.x }; } const Un = function(e) { return e === void 0 && (e = {}), { name: "flip", options: e, async fn(t) { var n, l; const { placement: a, middlewareData: o, rects: i, initialPlacement: u, platform: d, elements: r } = t, { mainAxis: f = !0, crossAxis: v = !0, fallbackPlacements: y, fallbackStrategy: m = "bestFit", fallbackAxisSideDirection: p = "none", flipAlignment: b = !0, ...x } = Ve(e, t); if ((n = o.arrow) != null && n.alignmentOffset) return {}; const w = re(a), R = ae(u), S = re(u) === u, C = await (d.isRTL == null ? void 0 : d.isRTL(r.floating)), O = y || (S || !b ? [Ce(u)] : En(u)), z = p !== "none"; !y && z && O.push(...Hn(u, b, p, C)); const N = [u, ...O], F = await ft(t, x), E = []; let W = ((l = o.flip) == null ? void 0 : l.overflows) || []; if (f && E.push(F[w]), v) { const D = Dn(a, i, C); E.push(F[D[0]], F[D[1]]); } if (W = [...W, { placement: a, overflows: E }], !E.every((D) => D <= 0)) { var me, se; const D = (((me = o.flip) == null ? void 0 : me.index) || 0) + 1, V = N[D]; if (V && (!(v === "alignment" ? R !== ae(V) : !1) || // We leave the current main axis only if every placement on that axis // overflows the main axis. W.every((K) => K.overflows[0] > 0 && ae(K.placement) === R))) return { data: { index: D, overflows: W }, reset: { placement: V } }; let H = (se = W.filter((P) => P.overflows[0] <= 0).sort((P, K) => P.overflows[1] - K.overflows[1])[0]) == null ? void 0 : se.placement; if (!H) switch (m) { case "bestFit": { var L; const P = (L = W.filter((K) => { if (z) { const ee = ae(K.placement); return ee === R || // Create a bias to the `y` side axis due to horizontal // reading directions favoring greater width. ee === "y"; } return !0; }).map((K) => [K.placement, K.overflows.filter((ee) => ee > 0).reduce((ee, Tt) => ee + Tt, 0)]).sort((K, ee) => K[1] - ee[1])[0]) == null ? void 0 : L[0]; P && (H = P); break; } case "initialPlacement": H = u; break; } if (a !== H) return { reset: { placement: H } }; } return {}; } }; }, Kn = /* @__PURE__ */ new Set(["left", "top"]); async function Xn(e, t) { const { placement: n, platform: l, elements: a } = e, o = await (l.isRTL == null ? void 0 : l.isRTL(a.floating)), i = re(n), u = Re(n), d = ae(n) === "y", r = Kn.has(i) ? -1 : 1, f = o && d ? -1 : 1, v = Ve(t, e); let { mainAxis: y, crossAxis: m, alignmentAxis: p } = typeof v == "number" ? { mainAxis: v, crossAxis: 0, alignmentAxis: null } : { mainAxis: v.mainAxis || 0, crossAxis: v.crossAxis || 0, alignmentAxis: v.alignmentAxis }; return u && typeof p == "number" && (m = u === "end" ? p * -1 : p), d ? { x: m * f, y: y * r } : { x: y * r, y: m * f }; } const Gn = function(e) { return e === void 0 && (e = 0), { name: "offset", options: e, async fn(t) { var n, l; const { x: a, y: o, placement: i, middlewareData: u } = t, d = await Xn(t, e); return i === ((n = u.offset) == null ? void 0 : n.placement) && (l = u.arrow) != null && l.alignmentOffset ? {} : { x: a + d.x, y: o + d.y, data: { ...d, placement: i } }; } }; }, qn = function(e) { return e === void 0 && (e = {}), { name: "shift", options: e, async fn(t) { const { x: n, y: l, placement: a } = t, { mainAxis: o = !0, crossAxis: i = !1, limiter: u = { fn: (x) => { let { x: w, y: R } = x; return { x: w, y: R }; } }, ...d } = Ve(e, t), r = { x: n, y: l }, f = await ft(t, d), v = ae(re(a)), y = ct(v); let m = r[y], p = r[v]; if (o) { const x = y === "y" ? "top" : "left", w = y === "y" ? "bottom" : "right", R = m + f[x], S = m - f[w]; m = Ge(R, m, S); } if (i) { const x = v === "y" ? "top" : "left", w = v === "y" ? "bottom" : "right", R = p + f[x], S = p - f[w]; p = Ge(R, p, S); } const b = u.fn({ ...t, [y]: m, [v]: p }); return { ...b, data: { x: b.x - n, y: b.y - l, enabled: { [y]: o, [v]: i } } }; } }; }; function Oe() { return typeof window < "u"; } function fe(e) { return ze(e) ? (e.nodeName || "").toLowerCase() : "#document"; } function X(e) { var t; return (e == null || (t = e.ownerDocument) == null ? void 0 : t.defaultView) || window; } function _(e) { var t; return (t = (ze(e) ? e.ownerDocument : e.document) || window.document) == null ? void 0 : t.documentElement; } function ze(e) { return Oe() ? e instanceof Node || e instanceof X(e).Node : !1; } function Y(e) { return Oe() ? e instanceof Element || e instanceof X(e).Element : !1; } function Z(e) { return Oe() ? e instanceof HTMLElement || e instanceof X(e).HTMLElement : !1; } function Qe(e) { return !Oe() || typeof ShadowRoot > "u" ? !1 : e instanceof ShadowRoot || e instanceof X(e).ShadowRoot; } const Yn = /* @__PURE__ */ new Set(["inline", "contents"]); function we(e) { const { overflow: t, overflowX: n, overflowY: l, display: a } = J(e); return /auto|scroll|overlay|hidden|clip/.test(t + l + n) && !Yn.has(a); } const Jn = /* @__PURE__ */ new Set(["table", "td", "th"]); function Qn(e) { return Jn.has(fe(e)); } const Zn = [":popover-open", ":modal"]; function Ne(e) { return Zn.some((t) => { try { return e.matches(t); } catch { return !1; } }); } const _n = ["transform", "translate", "scale", "rotate", "perspective"], el = ["transform", "translate", "scale", "rotate", "perspective", "filter"], tl = ["paint", "layout", "strict", "content"]; function We(e) { const t = Ue(), n = Y(e) ? J(e) : e; return _n.some((l) => n[l] ? n[l] !== "none" : !1) || (n.containerType ? n.containerType !== "normal" : !1) || !t && (n.backdropFilter ? n.backdropFilter !== "none" : !1) || !t && (n.filter ? n.filter !== "none" : !1) || el.some((l) => (n.willChange || "").includes(l)) || tl.some((l) => (n.contain || "").includes(l)); } function nl(e) { let t = ie(e); for (; Z(t) && !ge(t); ) { if (We(t)) return t; if (Ne(t)) return null; t = ie(t); } return null; } function Ue() { return typeof CSS > "u" || !CSS.supports ? !1 : CSS.supports("-webkit-backdrop-filter", "none"); } const ll = /* @__PURE__ */ new Set(["html", "body", "#document"]); function ge(e) { return ll.has(fe(e)); } function J(e) { return X(e).getComputedStyle(e); } function Ae(e) { return Y(e) ? { scrollLeft: e.scrollLeft, scrollTop: e.scrollTop } : { scrollLeft: e.scrollX, scrollTop: e.scrollY }; } function ie(e) { if (fe(e) === "html") return e; const t = ( // Step into the shadow DOM of the parent of a slotted node. e.assignedSlot || // DOM Element detected. e.parentNode || // ShadowRoot detected. Qe(e) && e.host || // Fallback. _(e) ); return Qe(t) ? t.host : t; } function mt(e) { const t = ie(e); return ge(t) ? e.ownerDocument ? e.ownerDocument.body : e.body : Z(t) && we(t) ? t : mt(t); } function xe(e, t, n) { var l; t === void 0 && (t = []), n === void 0 && (n = !0); const a = mt(e), o = a === ((l = e.ownerDocument) == null ? void 0 : l.body), i = X(a); if (o) { const u = Ie(i); return t.concat(i, i.visualViewport || [], we(a) ? a : [], u && n ? xe(u) : []); } return t.concat(a, xe(a, [], n)); } function Ie(e) { return e.parent && Object.getPrototypeOf(e.parent) ? e.frameElement : null; } function vt(e) { const t = J(e); let n = parseFloat(t.width) || 0, l = parseFloat(t.height) || 0; const a = Z(e), o = a ? e.offsetWidth : n, i = a ? e.offsetHeight : l, u = Se(n) !== o || Se(l) !== i; return u && (n = o, l = i), { width: n, height: l, $: u }; } function Ke(e) { return Y(e) ? e : e.contextElement; } function ye(e) { const t = Ke(e); if (!Z(t)) return Q(1); const n = t.getBoundingClientRect(), { width: l, height: a, $: o } = vt(t); let i = (o ? Se(n.width) : n.width) / l, u = (o ? Se(n.height) : n.height) / a; return (!i || !Number.isFinite(i)) && (i = 1), (!u || !Number.isFinite(u)) && (u = 1), { x: i, y: u }; } const al = /* @__PURE__ */ Q(0); function yt(e) { const t = X(e); return !Ue() || !t.visualViewport ? al : { x: t.visualViewport.offsetLeft, y: t.visualViewport.offsetTop }; } function ol(e, t, n) { return t === void 0 && (t = !1), !n || t && n !== X(e) ? !1 : t; } function de(e, t, n, l) { t === void 0 && (t = !1), n === void 0 && (n = !1); const a = e.getBoundingClientRect(), o = Ke(e); let i = Q(1); t && (l ? Y(l) && (i = ye(l)) : i = ye(e)); const u = ol(o, n, l) ? yt(o) : Q(0); let d = (a.left + u.x) / i.x, r = (a.top + u.y) / i.y, f = a.width / i.x, v = a.height / i.y; if (o) { const y = X(o), m = l && Y(l) ? X(l) : l; let p = y, b = Ie(p); for (; b && l && m !== p; ) { const x = ye(b), w = b.getBoundingClientRect(), R = J(b), S = w.left + (b.clientLeft + parseFloat(R.paddingLeft)) * x.x, C = w.top + (b.clientTop + parseFloat(R.paddingTop)) * x.y; d *= x.x, r *= x.y, f *= x.x, v *= x.y, d += S, r += C, p = X(b), b = Ie(p); } } return Te({ width: f, height: v, x: d, y: r }); } function Xe(e, t) { const n = Ae(e).scrollLeft; return t ? t.left + n : de(_(e)).left + n; } function gt(e, t, n) { n === void 0 && (n = !1); const l = e.getBoundingClientRect(), a = l.left + t.scrollLeft - (n ? 0 : ( // RTL <body> scrollbar. Xe(e, l) )), o = l.top + t.scrollTop; return { x: a, y: o }; } function il(e) { let { elements: t, rect: n, offsetParent: l, strategy: a } = e; const o = a === "fixed", i = _(l), u = t ? Ne(t.floating) : !1; if (l === i || u && o) return n; let d = { scrollLeft: 0, scrollTop: 0 }, r = Q(1); const f = Q(0), v = Z(l); if ((v || !v && !o) && ((fe(l) !== "body" || we(i)) && (d = Ae(l)), Z(l))) { const m = de(l); r = ye(l), f.x = m.x + l.clientLeft, f.y = m.y + l.clientTop; } const y = i && !v && !o ? gt(i, d, !0) : Q(0); return { width: n.width * r.x, height: n.height * r.y, x: n.x * r.x - d.scrollLeft * r.x + f.x + y.x, y: n.y * r.y - d.scrollTop * r.y + f.y + y.y }; } function sl(e) { return Array.from(e.getClientRects()); } function ul(e) { const t = _(e), n = Ae(e), l = e.ownerDocument.body, a = ue(t.scrollWidth, t.clientWidth, l.scrollWidth, l.clientWidth), o = ue(t.scrollHeight, t.clientHeight, l.scrollHeight, l.clientHeight); let i = -n.scrollLeft + Xe(e); const u = -n.scrollTop; return J(l).direction === "rtl" && (i += ue(t.clientWidth, l.clientWidth) - a), { width: a, height: o, x: i, y: u }; } function cl(e, t) { const n = X(e), l = _(e), a = n.visualViewport; let o = l.clientWidth, i = l.clientHeight, u = 0, d = 0; if (a) { o = a.width, i = a.height; const r = Ue(); (!r || r && t === "fixed") && (u = a.offsetLeft, d = a.offsetTop); } return { width: o, height: i, x: u, y: d }; } const rl = /* @__PURE__ */ new Set(["absolute", "fixed"]); function dl(e, t) { const n = de(e, !0, t === "fixed"), l = n.top + e.clientTop, a = n.left + e.clientLeft, o = Z(e) ? ye(e) : Q(1), i = e.clientWidth * o.x, u = e.clientHeight * o.y, d = a * o.x, r = l * o.y; return { width: i, height: u, x: d, y: r }; } function Ze(e, t, n) { let l; if (t === "viewport") l = cl(e, n); else if (t === "document") l = ul(_(e)); else if (Y(t)) l = dl(t, n); else { const a = yt(e); l = { x: t.x - a.x, y: t.y - a.y, width: t.width, height: t.height }; } return Te(l); } function ht(e, t) { const n = ie(e); return n === t || !Y(n) || ge(n) ? !1 : J(n).position === "fixed" || ht(n, t); } function fl(e, t) { const n = t.get(e); if (n) return n; let l = xe(e, [], !1).filter((u) => Y(u) && fe(u) !== "body"), a = null; const o = J(e).position === "fixed"; let i = o ? ie(e) : e; for (; Y(i) && !ge(i); ) { const u = J(i), d = We(i); !d && u.position === "fixed" && (a = null), (o ? !d && !a : !d && u.position === "static" && !!a && rl.has(a.position) || we(i) && !d && ht(e, i)) ? l = l.filter((f) => f !== i) : a = u, i = ie(i); } return t.set(e, l), l; } function ml(e) { let { element: t, boundary: n, rootBoundary: l, strategy: a } = e; const i = [...n === "clippingAncestors" ? Ne(t) ? [] : fl(t, this._c) : [].concat(n), l], u = i[0], d = i.reduce((r, f) => { const v = Ze(t, f, a); return r.top = ue(v.