@cn-ui/core
Version:
The @cn-ui/core is a collection of UI components and utilities for building modern web applications with SolidJS.
1,509 lines • 190 kB
JavaScript
import { OriginComponent as k, useFloatingCover as Rr, computed as V, PortalEasy as Dr, extendsEvent as J, useMapper as ne, ensureFunctionResult as Y, atom as B, NullAtom as Q, OriginDiv as re, classNames as K, toCSSPx as q, ComponentSlots as Ln, atomization as At, classHelper as de, zIndexManager as yt, usePromise as jn, createCtx as ve, useBreakPointMapper as Bn, spanToWidth as Pt, firstClass as ke, genArray as Vn, initDayjs as Hn, useCalendarSelect as Nn, dayjs as Fr, useDateCalendar as Wn, splitOneChild as Yn, ArrayAtom as qn, useSelect as Vt, DebounceAtom as Kn, debounce as Un, ensureArrayReturn as nt, createBlackBoard as Lr, useFileExplorer as Xn, autoResource as Gn, StoreToAtom as Zn, DefaultAC as ft, extendsComponents as Jn, SelectableList as Qn, reflect as ei } from "@cn-ui/reactive";
import { Switch as Ue, Match as se, Show as I, onMount as Pe, onCleanup as Xe, mergeProps as he, createSignal as jr, createComputed as Br, startTransition as ti, createMemo as T, For as G, createEffect as ie, untrack as ri, lazy as Vr, createComponent as ni, children as Hr, Suspense as ii, splitProps as li } from "solid-js";
import { createComponent as s, getNextElement as b, insert as m, memo as L, effect as E, style as le, template as x, spread as Z, mergeProps as A, runHydrationEvents as D, getNextMarker as M, className as R, use as ee, setAttribute as F, render as oi, Dynamic as Nr, delegateEvents as oe, addEventListener as Ce, Show as Mt, setProperty as Ht } from "solid-js/web";
export * from "@cn-ui/sortable";
import { AiFillCheckCircle as ai, AiFillInfoCircle as si, AiFillWarning as ci, AiFillCloseCircle as ui, AiOutlineClose as ot, AiOutlineLoading3Quarters as di, AiFillEye as gi, AiFillEyeInvisible as hi, AiOutlineCloseCircle as Wr, AiOutlineDoubleLeft as mr, AiOutlineLeft as Rt, AiOutlineSearch as fi, AiOutlineDown as mi, AiOutlineCheck as Nt, AiOutlineRight as Wt, AiOutlineSwapRight as Yr, AiOutlineCalendar as qr, AiOutlineArrowLeft as vi, AiOutlineArrowRight as bi, AiOutlineArrowUp as yi, AiOutlinePlus as Kr, AiOutlineEllipsis as vr, AiOutlineInfo as xi, AiOutlineAlert as $i, AiOutlineCaretDown as wi, AiOutlineCaretRight as Si } from "solid-icons/ai";
import { Key as fe } from "@solid-primitives/keyed";
import { TransitionGroup as Ge, Transition as Yt } from "solid-transition-group";
import { useResizeObserver as Ci, nextTick as Ur, watch as qt, useElementHover as Kt, useScrollLock as _i, toAccessor as pi, useEventListener as Ne, onClickOutside as Xr, useOffsetPagination as Oi, useScroll as ki, useStepper as Pi } from "solidjs-use";
import { useDark as Au } from "solidjs-use";
import { createStore as Gr, reconcile as Mi } from "solid-js/store";
import { debounce as $t, pick as Ei, range as zi } from "radash";
import { createTable as Ti, getCoreRowModel as Ii, getSortedRowModel as Ai, getExpandedRowModel as Ri } from "@cn-ui/table-core";
import Di from "async-validator";
import { DotsMove3 as Fi } from "@cn-ui/svg-spinner";
import { qr as Li } from "headless-qr";
import { Ranger as ji } from "@tanstack/ranger";
import Bi from "split.js";
var Vi = /* @__PURE__ */ x("<div>"), Hi = /* @__PURE__ */ x('<div class="cn-badge relative pointer-events-none"><sup class="absolute bg-error-400 text-white rounded-full p-[0.35rem] pointer-events-auto cursor-default">');
const qc = k((e) => {
const t = Rr(e), r = V(() => typeof e.count == "number" && !Number.isNaN(e.count)), n = V(() => typeof e.count == "number" && e.count > (e.overflowCount ?? 99)), i = V(() => e.dot || e.count === 0);
return s(Dr, {
get children() {
var l = b(Hi), o = l.firstChild;
return m(o, s(Ue, {
get fallback() {
return e.children;
},
get children() {
return [s(se, {
get when() {
return n();
},
get children() {
return [L(() => e.overflowCount ?? 99), "+"];
}
}), s(se, {
get when() {
return i();
},
get children() {
var a = b(Vi);
return m(a, () => e.showZero && 0), a;
}
}), s(se, {
get when() {
return r();
},
get children() {
return e.count;
}
})];
}
})), E((a) => {
var c = t.coverStyle(), u = {
top: "-4px",
right: "-4px",
...e.style()
};
return a.e = le(l, c, a.e), a.t = le(o, u, a.t), a;
}, {
e: void 0,
t: void 0
}), l;
}
});
});
var Ni = /* @__PURE__ */ x("<span>"), Wi = /* @__PURE__ */ x("<button type=button>");
const W = k((e) => (() => {
var t = b(Ni);
return Z(t, A({
get "aria-hidden"() {
return !e.clickable;
},
get role() {
return e.clickable ? "button" : void 0;
},
get class() {
return e.class(e.spin && "animate-spin", "inline-flex items-center text-center leading-[0]");
},
get style() {
return {
...e.style,
"vertical-align": "-0.125em"
};
}
}, () => J(e)), !1, !0), m(t, () => e.children), D(), t;
})()), Et = k((e) => (() => {
var t = b(Wi);
return Z(t, A({
get class() {
return e.class(e.spin && "animate-spin", "inline-flex items-center text-center leading-[0] cursor-pointer hover:bg-gray-300 p-2 rounded-md transition-colors");
},
get style() {
return {
...e.style,
"vertical-align": "-0.125em"
};
}
}, () => J(e)), !1, !0), m(t, () => e.children), D(), t;
})());
var Yi = /* @__PURE__ */ x('<div><h3 class="flex items-center"><!$><!/><span class=flex-1></span><!$><!/></h3><p class=pl-6>');
const qi = k((e) => {
const t = "text-xl pr-2", r = ne(e.type ?? "default", {
success() {
return s(W, {
class: `text-green-600 ${t}`,
get children() {
return s(ai, {});
}
});
},
info() {
return s(W, {
class: `text-blue-600 ${t}`,
get children() {
return s(si, {});
}
});
},
warning() {
return s(W, {
class: `text-yellow-600 ${t}`,
get children() {
return s(ci, {});
}
});
},
error() {
return s(W, {
class: `text-red-600 ${t}`,
get children() {
return s(ui, {});
}
});
},
default() {
return null;
}
});
return (() => {
var n = b(Yi), i = n.firstChild, l = i.firstChild, [o, a] = M(l.nextSibling), c = o.nextSibling, u = c.nextSibling, [d, h] = M(u.nextSibling), f = i.nextSibling;
return m(i, (() => {
var g = L(() => typeof e.icon == "boolean");
return () => g() ? r() : Y(e.icon);
})(), o, a), m(c, () => Y(e.message)), m(i, s(I, {
get when() {
return e.closable;
},
get children() {
return s(W, {
class: "cursor-pointer transition-color",
get onclick() {
return e?.onClose;
},
get children() {
return s(ot, {});
}
});
}
}), d, h), f.style.setProperty("line-break", "anywhere"), m(f, () => Y(e.description)), E(() => R(n, e.class(e.round && "rounded-md", "p-2 overflow-hidden border-1 border-design-separator"))), n;
})();
}), Ut = (e) => {
const t = B(0), r = B(0), n = V(() => e()?.parentElement);
Pe(() => n.recomputed());
let i;
return Pe(() => {
i = Ci(n, ([l]) => {
const { width: o, height: a } = l.contentRect, { paddingLeft: c, paddingRight: u, paddingTop: d, paddingBottom: h } = getComputedStyle(
l.target
), f = Number.parseInt(c) || 0, g = Number.parseInt(u) || 0, v = Number.parseInt(d) || 0, y = Number.parseInt(h) || 0;
t(o - f - g), r(a - v - y);
}).stop;
}), Xe(() => {
i?.();
}), {
sizer: n,
width: t,
height: r
};
};
function Ve(e, t, r) {
let n = r.initialDeps ?? [], i;
return () => {
let l;
r.key && r.debug?.() && (l = Date.now());
const o = e();
if (!(o.length !== n.length || o.some((u, d) => n[d] !== u)))
return i;
n = o;
let c;
if (r.key && r.debug?.() && (c = Date.now()), i = t(...o), r.key && r.debug?.()) {
const u = Math.round((Date.now() - l) * 100) / 100, d = Math.round((Date.now() - c) * 100) / 100, h = d / 16, f = (g, v) => {
for (g = String(g); g.length < v; )
g = ` ${g}`;
return g;
};
console.info(
`%c⏱ ${f(d, 5)} /${f(u, 5)} ms`,
`
font-size: .6rem;
font-weight: bold;
color: hsl(${Math.max(
0,
Math.min(120 - 120 * h, 120)
)}deg 100% 31%);`,
r?.key
);
}
return r?.onChange?.(i), i;
};
}
function zt(e, t) {
if (e === void 0)
throw new Error("Unexpected undefined");
return e;
}
const Ki = (e, t) => Math.abs(e - t) < 1, Ui = (e) => e, Xi = (e) => {
const t = Math.max(e.startIndex - e.overscan, 0), r = Math.min(e.endIndex + e.overscan, e.count - 1), n = [];
for (let i = t; i <= r; i++)
n.push(i);
return n;
}, Gi = (e, t) => {
const r = e.scrollElement;
if (!r)
return;
const n = (l) => {
const { width: o, height: a } = l;
t({ width: Math.round(o), height: Math.round(a) });
};
n(r.getBoundingClientRect());
const i = new ResizeObserver((l) => {
const o = l[0];
if (o?.borderBoxSize) {
const a = o.borderBoxSize[0];
if (a) {
n({ width: a.inlineSize, height: a.blockSize });
return;
}
}
n(r.getBoundingClientRect());
});
return i.observe(r, { box: "border-box" }), () => {
i.unobserve(r);
};
}, Zi = (e, t) => {
const r = e.scrollElement;
if (!r)
return;
const n = () => {
t(e.getElementOffset(e));
};
return n(), r.addEventListener("scroll", n, {
passive: !0
}), () => {
r.removeEventListener("scroll", n);
};
}, Ji = (e, t, r) => {
if (t?.borderBoxSize) {
const n = t.borderBoxSize[0];
if (n)
return Math.round(n[r.options.horizontal ? "inlineSize" : "blockSize"]);
}
return Math.round(
e.getBoundingClientRect()[r.options.horizontal ? "width" : "height"]
);
}, Qi = (e, { adjustments: t = 0, behavior: r }, n) => {
const i = e + t;
n.scrollElement?.scrollTo?.({
[n.options.horizontal ? "left" : "top"]: i,
behavior: r
});
};
class el {
// biome-ignore lint/suspicious/noConfusingVoidType: <explanation>
unsubs = [];
options;
scrollElement = null;
isScrolling = !1;
isScrollingTimeoutId = null;
scrollToIndexTimeoutId = null;
measurementsCache = [];
itemSizeCache = /* @__PURE__ */ new Map();
pendingMeasuredCacheIndexes = [];
scrollRect;
scrollOffset;
scrollDirection = null;
scrollAdjustments = 0;
measureElementCache = /* @__PURE__ */ new Map();
observer = /* @__PURE__ */ (() => {
let t = null;
const r = () => t || (typeof ResizeObserver < "u" ? t = new ResizeObserver((n) => {
n.forEach((i) => {
this._measureElement(i.target, i);
});
}) : null);
return {
disconnect: () => r()?.disconnect(),
observe: (n) => r()?.observe(n, { box: "border-box" }),
unobserve: (n) => r()?.unobserve(n)
};
})();
range = null;
constructor(t) {
this.setOptions(t), this.scrollRect = this.options.initialRect, this.scrollOffset = this.options.initialOffset, this.measurementsCache = this.options.initialMeasurementsCache, this.measurementsCache.forEach((r) => {
this.itemSizeCache.set(r.key, r.size);
}), this.maybeNotify(), this.options.getElementOffset && (this.getElementOffset = this.options.getElementOffset);
}
getElementOffset(t) {
if (t.scrollElement === null) throw Error(" ScrollElement Void");
return t.scrollElement instanceof Window ? Math.abs(
t.scrollElement[t.options.horizontal ? "scrollX" : "scrollY"]
) : Math.abs(
t.scrollElement[t.options.horizontal ? "scrollLeft" : "scrollTop"]
);
}
setOptions = (t) => {
Object.entries(t).forEach(([r, n]) => {
typeof n > "u" && Reflect.deleteProperty(t, r);
}), this.options = {
debug: !1,
initialOffset: 0,
overscan: 1,
paddingStart: 0,
paddingEnd: 0,
scrollPaddingStart: 0,
scrollPaddingEnd: 0,
horizontal: !1,
getItemKey: Ui,
rangeExtractor: Xi,
onChange: () => {
},
measureElement: Ji,
initialRect: { width: 0, height: 0 },
scrollMargin: 0,
scrollingDelay: 150,
indexAttribute: "data-index",
initialMeasurementsCache: [],
lanes: 1,
...t
};
};
notify = (t) => {
this.options.onChange?.(this, t);
};
maybeNotify = Ve(
() => (this.calculateRange(), [
this.isScrolling,
this.range ? this.range.startIndex : null,
this.range ? this.range.endIndex : null
]),
(t) => {
this.notify(t);
},
{
key: process.env.NODE_ENV !== "production" && "maybeNotify",
debug: () => this.options.debug,
initialDeps: [
this.isScrolling,
this.range ? this.range.startIndex : null,
this.range ? this.range.endIndex : null
]
}
);
cleanup = () => {
this.unsubs.filter(Boolean).forEach((t) => t()), this.unsubs = [], this.scrollElement = null;
};
_didMount = () => (this.measureElementCache.forEach(this.observer.observe), () => {
this.observer.disconnect(), this.cleanup();
});
_willUpdate = () => {
const t = this.options.getScrollElement();
this.scrollElement !== t && (this.cleanup(), this.scrollElement = t, this._scrollToOffset(this.scrollOffset, {
adjustments: void 0,
behavior: void 0
}), this.unsubs.push(
this.options.observeElementRect(this, (r) => {
this.scrollRect = r, this.maybeNotify();
})
), this.unsubs.push(
this.options.observeElementOffset(this, (r) => {
this.scrollAdjustments = 0, this.scrollOffset !== r && (this.isScrollingTimeoutId !== null && (clearTimeout(this.isScrollingTimeoutId), this.isScrollingTimeoutId = null), this.isScrolling = !0, this.scrollDirection = this.scrollOffset < r ? "forward" : "backward", this.scrollOffset = r, this.maybeNotify(), this.isScrollingTimeoutId = setTimeout(() => {
this.isScrollingTimeoutId = null, this.isScrolling = !1, this.scrollDirection = null, this.maybeNotify();
}, this.options.scrollingDelay));
})
));
};
getSize = () => this.scrollRect[this.options.horizontal ? "width" : "height"];
memoOptions = Ve(
() => [
this.options.count,
this.options.paddingStart,
this.options.scrollMargin,
this.options.getItemKey
],
(t, r, n, i) => (this.pendingMeasuredCacheIndexes = [], {
count: t,
paddingStart: r,
scrollMargin: n,
getItemKey: i
}),
{
key: !1
}
);
getFurthestMeasurement = (t, r) => {
const n = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map();
for (let l = r - 1; l >= 0; l--) {
const o = t[l];
if (n.has(o.lane))
continue;
const a = i.get(o.lane);
if (a == null || o.end > a.end ? i.set(o.lane, o) : o.end < a.end && n.set(o.lane, !0), n.size === this.options.lanes)
break;
}
return i.size === this.options.lanes ? Array.from(i.values()).sort((l, o) => l.end === o.end ? l.index - o.index : l.end - o.end)[0] : void 0;
};
getMeasurements = Ve(
() => [this.memoOptions(), this.itemSizeCache],
({ count: t, paddingStart: r, scrollMargin: n, getItemKey: i }, l) => {
const o = this.pendingMeasuredCacheIndexes.length > 0 ? Math.min(...this.pendingMeasuredCacheIndexes) : 0;
this.pendingMeasuredCacheIndexes = [];
const a = this.measurementsCache.slice(0, o);
for (let c = o; c < t; c++) {
const u = i(c), d = this.options.lanes === 1 ? a[c - 1] : this.getFurthestMeasurement(a, c), h = d ? d.end : r + n, f = l.get(u), g = typeof f == "number" ? f : this.options.estimateSize(c), v = h + g, y = d ? d.lane : c % this.options.lanes;
a[c] = {
index: c,
id: u,
start: h,
size: g,
end: v,
key: u,
lane: y
};
}
return this.measurementsCache = a, a;
},
{
key: process.env.NODE_ENV !== "production" && "getMeasurements",
debug: () => this.options.debug
}
);
calculateRange = Ve(
() => [this.getMeasurements(), this.getSize(), this.scrollOffset],
(t, r, n) => this.range = t.length > 0 && r > 0 ? tl({
measurements: t,
outerSize: r,
scrollOffset: n
}) : null,
{
key: process.env.NODE_ENV !== "production" && "calculateRange",
debug: () => this.options.debug
}
);
getIndexes = Ve(
() => [
this.options.rangeExtractor,
this.calculateRange(),
this.options.overscan,
this.options.count
],
(t, r, n, i) => r === null ? [] : t({
...r,
overscan: n,
count: i
}),
{
key: process.env.NODE_ENV !== "production" && "getIndexes",
debug: () => this.options.debug
}
);
indexFromElement = (t) => {
const r = this.options.indexAttribute, n = t.getAttribute(r);
return n ? Number.parseInt(n, 10) : (console.warn(`Missing attribute name '${r}={index}' on measured element.`), -1);
};
_measureElement = (t, r) => {
const n = this.measurementsCache[this.indexFromElement(t)];
if (!n || !t.isConnected) {
this.measureElementCache.forEach((o, a) => {
o === t && (this.observer.unobserve(t), this.measureElementCache.delete(a));
});
return;
}
const i = this.measureElementCache.get(n.key);
i !== t && (i && this.observer.unobserve(i), this.observer.observe(t), this.measureElementCache.set(n.key, t));
const l = this.options.measureElement(t, r, this);
this.resizeItem(n, l);
};
resizeItem = (t, r) => {
const n = this.itemSizeCache.get(t.key) ?? t.size, i = r - n;
i !== 0 && (t.start < this.scrollOffset + this.scrollAdjustments && (process.env.NODE_ENV !== "production" && this.options.debug && console.info("correction", i), this._scrollToOffset(this.scrollOffset, {
// biome-ignore lint/suspicious/noAssignInExpressions: <explanation>
adjustments: this.scrollAdjustments += i,
behavior: void 0
})), this.pendingMeasuredCacheIndexes.push(t.index), this.itemSizeCache = new Map(this.itemSizeCache.set(t.key, r)), this.notify(!1));
};
measureElement = (t) => {
t && this._measureElement(t, void 0);
};
getVirtualItems = Ve(
() => [this.getIndexes(), this.getMeasurements()],
(t, r) => {
const n = [];
for (let i = 0, l = t.length; i < l; i++) {
const o = t[i], a = r[o];
n.push(a);
}
return n;
},
{
key: process.env.NODE_ENV !== "production" && "getIndexes",
debug: () => this.options.debug
}
);
getVirtualItemForOffset = (t) => {
const r = this.getMeasurements();
return zt(
r[Zr(
0,
r.length - 1,
(n) => zt(r[n]).start,
t
)]
);
};
getOffsetForAlignment = (t, r) => {
const n = this.getSize();
r === "auto" && (t <= this.scrollOffset ? r = "start" : t >= this.scrollOffset + n ? r = "end" : r = "start"), r === "start" || (r === "end" ? t = t - n : r === "center" && (t = t - n / 2));
const i = this.options.horizontal ? "scrollWidth" : "scrollHeight", o = (this.scrollElement ? "document" in this.scrollElement ? this.scrollElement.document.documentElement[i] : this.scrollElement[i] : 0) - this.getSize();
return Math.max(Math.min(o, t), 0);
};
getOffsetForIndex = (t, r = "auto") => {
t = Math.max(0, Math.min(t, this.options.count - 1));
const n = zt(this.getMeasurements()[t]);
if (r === "auto")
if (n.end >= this.scrollOffset + this.getSize() - this.options.scrollPaddingEnd)
r = "end";
else if (n.start <= this.scrollOffset + this.options.scrollPaddingStart)
r = "start";
else
return [this.scrollOffset, r];
const i = r === "end" ? n.end + this.options.scrollPaddingEnd : n.start - this.options.scrollPaddingStart;
return [this.getOffsetForAlignment(i, r), r];
};
isDynamicMode = () => this.measureElementCache.size > 0;
cancelScrollToIndex = () => {
this.scrollToIndexTimeoutId !== null && (clearTimeout(this.scrollToIndexTimeoutId), this.scrollToIndexTimeoutId = null);
};
scrollToOffset = (t, { align: r = "start", behavior: n } = {}) => {
this.cancelScrollToIndex(), n === "smooth" && this.isDynamicMode() && console.warn("The `smooth` scroll behavior is not fully supported with dynamic size."), this._scrollToOffset(this.getOffsetForAlignment(t, r), {
adjustments: void 0,
behavior: n
});
};
scrollToIndex = (t, { align: r = "auto", behavior: n } = {}) => {
t = Math.max(0, Math.min(t, this.options.count - 1)), this.cancelScrollToIndex(), n === "smooth" && this.isDynamicMode() && console.warn("The `smooth` scroll behavior is not fully supported with dynamic size.");
const [i, l] = this.getOffsetForIndex(t, r);
this._scrollToOffset(i, { adjustments: void 0, behavior: n }), n !== "smooth" && this.isDynamicMode() && (this.scrollToIndexTimeoutId = setTimeout(() => {
if (this.scrollToIndexTimeoutId = null, this.measureElementCache.has(this.options.getItemKey(t))) {
const [a] = this.getOffsetForIndex(t, l);
Ki(a, this.scrollOffset) || this.scrollToIndex(t, { align: l, behavior: n });
} else
this.scrollToIndex(t, { align: l, behavior: n });
}));
};
scrollBy = (t, { behavior: r } = {}) => {
this.cancelScrollToIndex(), r === "smooth" && this.isDynamicMode() && console.warn("The `smooth` scroll behavior is not fully supported with dynamic size."), this._scrollToOffset(this.scrollOffset + t, {
adjustments: void 0,
behavior: r
});
};
getTotalSize = () => {
const t = this.getMeasurements();
let r;
return t.length === 0 ? r = this.options.paddingStart : r = this.options.lanes === 1 ? t[t.length - 1]?.end ?? 0 : Math.max(...t.slice(-this.options.lanes).map((n) => n.end)), r - this.options.scrollMargin + this.options.paddingEnd;
};
_scrollToOffset = (t, {
adjustments: r,
behavior: n
}) => {
this.options.scrollToFn(t, { behavior: n, adjustments: r }, this);
};
measure = () => {
this.itemSizeCache = /* @__PURE__ */ new Map(), this.notify(!1);
};
}
const Zr = (e, t, r, n) => {
for (; e <= t; ) {
const i = (e + t) / 2 | 0, l = r(i);
if (l < n)
e = i + 1;
else if (l > n)
t = i - 1;
else
return i;
}
return e > 0 ? e - 1 : 0;
};
function tl({
measurements: e,
outerSize: t,
scrollOffset: r
}) {
const n = e.length - 1, l = Zr(0, n, (a) => e[a].start, r);
let o = l;
for (; o < n && e[o].end < r + t; )
o++;
return { startIndex: l, endIndex: o };
}
function rl(e) {
let t = !1, r = 0;
function n(...i) {
t && cancelAnimationFrame(r), r = requestAnimationFrame(() => {
t = !1, e(...i);
}), t = !0;
}
return n;
}
function nl(e) {
const t = he(e), r = new el(t), [n, i] = Gr(r.getVirtualItems()), [l, o] = jr(r.getTotalSize()), a = {
get(d, h) {
switch (h) {
case "getVirtualItems":
return () => n;
case "getTotalSize":
return () => l();
default:
return Reflect.get(d, h);
}
}
}, c = new Proxy(r, a);
c.setOptions(t), Pe(() => {
const d = c._didMount();
c._willUpdate(), Xe(d);
});
const u = rl((d, h) => {
d._willUpdate(), ti(() => {
i(Mi(d.getVirtualItems(), {
key: "id"
}));
}), o(d.getTotalSize()), e.onChange?.(d, h);
});
return Br(() => {
c.setOptions(he(t, e, {
onChange: u
})), Ur(() => {
c.measure();
});
}), {
...c,
updateView: u
};
}
function it(e) {
return nl(he({
observeElementRect: Gi,
observeElementOffset: Zi,
scrollToFn: Qi
}, e));
}
var il = /* @__PURE__ */ x("<div>"), ll = /* @__PURE__ */ x('<div class="cn-virtual-list-container flex-none relative">');
const Jr = k(function(e) {
const t = Q(null), r = it({
get count() {
return e.each.length;
},
getItemKey: e.getItemKey,
estimateSize() {
return e.estimateSize ?? 24;
},
getScrollElement: () => t(),
get horizontal() {
return !!e.horizontal;
},
get overscan() {
return e.overscan ?? Math.min(20, Math.floor(Math.sqrt(e.each.length)));
}
});
e.expose?.({
virtualizer: r
});
const {
height: n,
width: i
} = Ut(() => t()), l = () => s(fe, {
by: "key",
get each() {
return r.getVirtualItems();
},
get fallback() {
return Y(e.fallback);
},
children: (o) => {
const a = B(""), c = Q(null), u = {
itemClass: a,
itemRef: c
}, d = T((h) => e.each[o().index] === void 0 ? h : e.children(e.each[o().index], () => o().index, u));
return (() => {
var h = b(il);
return ee((f) => {
c(f), queueMicrotask(() => r.measureElement(f));
}, h), m(h, d), E((f) => {
var g = K("cn-virtual-list-item absolute ", e.horizontal ? "h-full" : "w-full", a()), v = o().index, y = {
[e.horizontal ? e.reverse ? "right" : "left" : e.reverse ? "bottom" : "top"]: `${o().start}px`
};
return g !== f.e && R(h, f.e = g), v !== f.t && F(h, "data-index", f.t = v), f.a = le(h, y, f.a), f;
}, {
e: void 0,
t: void 0,
a: void 0
}), h;
})();
}
});
return s(re, {
prop: e,
ref: t,
get class() {
return K("cn-virtual-list overflow-auto relative", e.horizontal ? "h-full" : "w-full", e.reverse ? `cn-virtual-list-reverse flex ${e.horizontal ? "flex-row-reverse" : "flex-col-reverse"}` : "cn-virtual-list-normal", e.horizontal);
},
get "data-height"() {
return n();
},
get style() {
return {
width: e.horizontal ? q(i(), "400px") : "auto",
height: e.horizontal ? "auto" : q(e.containerHeight ?? n(), "400px")
};
},
get children() {
var o = b(ll);
return m(o, (() => {
var a = L(() => !!e.transitionName);
return () => a() ? s(Ge, {
get name() {
return e.transitionName;
},
get children() {
return s(l, {});
}
}) : s(l, {});
})()), E((a) => {
var c = e.horizontal ? `${r.getTotalSize()}px` : "100%", u = e.horizontal ? "100%" : `${r.getTotalSize()}px`;
return c !== a.e && ((a.e = c) != null ? o.style.setProperty("width", c) : o.style.removeProperty("width")), u !== a.t && ((a.t = u) != null ? o.style.setProperty("height", u) : o.style.removeProperty("height")), a;
}, {
e: void 0,
t: void 0
}), o;
}
});
});
var ol = /* @__PURE__ */ x("<div>"), al = /* @__PURE__ */ x("<div class=absolute>"), sl = /* @__PURE__ */ x('<div><div class="cn-virtual-list-container flex-none">');
function Kc(e) {
const t = Q(null), r = it({
get count() {
return e.each.length;
},
getItemKey: e.getItemKey,
estimateSize() {
return e.estimateWidth ?? 24;
},
measureElement: typeof window < "u" && navigator.userAgent.indexOf("Firefox") === -1 ? (a) => a?.getBoundingClientRect().height : void 0,
getScrollElement: () => t(),
overscan: e.overscan ?? 3
}), n = it({
get count() {
return e.colSize ?? e.each[0].length;
},
getItemKey: e.getItemKey,
estimateSize() {
return e.estimateHeight ?? 24;
},
getScrollElement: () => t(),
horizontal: !0,
get overscan() {
return e.overscan ?? Math.min(20, Math.floor(Math.sqrt(e.each.length)));
}
}), {
height: i,
width: l
} = Ut(() => t()?.parentElement), o = s(fe, {
by: "key",
get each() {
return r.getVirtualItems();
},
children: (a) => {
const c = B(""), u = Q(null), d = {
itemClass: c,
itemRef: u
}, h = T((f) => e.each[a().index] ?? f);
return (() => {
var f = b(ol);
return ee((g) => {
u(g), queueMicrotask(() => {
n.measureElement(g);
});
}, f), m(f, s(G, {
get each() {
return n.getVirtualItems();
},
children: (g) => {
const v = T((y) => h()[a().index] === void 0 ? y : e.children(h()[g.index], () => a().index, d));
return (() => {
var y = b(al);
return ee((C) => {
queueMicrotask(() => {
n.measureElement(C);
});
}, y), m(y, v), E((C) => {
var S = g.index, w = `${g.start}px`;
return S !== C.e && F(y, "data-index", C.e = S), w !== C.t && ((C.t = w) != null ? y.style.setProperty("left", w) : y.style.removeProperty("left")), C;
}, {
e: void 0,
t: void 0
}), y;
})();
}
})), E((g) => {
var v = K("cn-virtual-list-item absolute w-full", c()), y = a().index, C = {
[e.reverse ? "bottom" : "top"]: `${a().start}px`
};
return v !== g.e && R(f, g.e = v), y !== g.t && F(f, "data-index", g.t = y), g.a = le(f, C, g.a), g;
}, {
e: void 0,
t: void 0,
a: void 0
}), f;
})();
}
});
return (() => {
var a = b(sl), c = a.firstChild;
return ee(t, a), a.style.setProperty("overflow", "auto"), a.style.setProperty("position", "relative"), c.style.setProperty("position", "relative"), m(c, (() => {
var u = L(() => !!e.transitionName);
return () => u() ? s(Ge, {
get name() {
return e.transitionName;
},
children: o
}) : o;
})()), E((u) => {
var d = K("cn-virtual-list", e.reverse ? "cn-virtual-list-reverse flex flex-col-reverse" : "cn-virtual-list-normal"), h = q(i(), "400px"), f = q(l(), "400px"), g = `${n.getTotalSize()}px`, v = `${r.getTotalSize()}px`;
return d !== u.e && R(a, u.e = d), h !== u.t && ((u.t = h) != null ? a.style.setProperty("height", h) : a.style.removeProperty("height")), f !== u.a && ((u.a = f) != null ? a.style.setProperty("width", f) : a.style.removeProperty("width")), g !== u.o && ((u.o = g) != null ? c.style.setProperty("width", g) : c.style.removeProperty("width")), v !== u.i && ((u.i = v) != null ? c.style.setProperty("height", v) : c.style.removeProperty("height")), u;
}, {
e: void 0,
t: void 0,
a: void 0,
o: void 0,
i: void 0
}), a;
})();
}
var cl = /* @__PURE__ */ x("<div>");
const br = ["top-left", "top-right", "bottom-left", "bottom-right", "top", "bottom"], ul = k(function(e) {
const {
position: t,
modalShowPosition: r
} = dl(e);
return s(I, {
get when() {
return e.model();
},
get children() {
return s(re, {
prop: e,
get class() {
return K(e.stack !== !1 && e.each.length >= (e.maxStackItem ?? 5) && "cn-modal-stack", "cn-modal-list fixed overflow-y-auto overflow-x-visible h-96 w-96 ", t());
},
get style() {
return {
"--modal-show-position": r(),
width: q(e.itemSize?.width, "24rem")
};
},
get children() {
return s(Jr, {
get each() {
return e.each;
},
get reverse() {
return e.position?.startsWith("bottom");
},
getItemKey: (n) => e.by(e.each[n], n),
get estimateSize() {
return e.itemSize?.height ?? 64;
},
transitionName: "cn-fade",
children: (n, i, {
itemClass: l
}) => (l("px-3 py-2"), (() => {
var o = b(cl);
return m(o, () => e.children(n, i)), E(() => R(o, K("w-full rounded-xl flex-none shadow-1 bg-design-card"))), o;
})())
});
}
});
}
});
});
function dl(e) {
const t = ne(() => e.position ?? "top-left", {
"top-left": "top-4 left-0",
"top-right": "top-4 right-0",
"bottom-left": "bottom-4 left-0",
"bottom-right": "bottom-4 right-0",
top: "top-4 left-[50%] -translate-x-1/2",
bottom: "bottom-4 left-[50%] -translate-x-1/2"
}), r = ne(() => e.position ?? "top-left", {
"top-left": "-120px",
"top-right": "120px",
"bottom-left": "-120px",
"bottom-right": "120px",
top: "0 -120px",
bottom: "0 120px"
});
return {
position: t,
modalShowPosition: r
};
}
const Qr = (e) => {
if (!globalThis.window) {
console.warn("CN-UI | Runtime Render Cancel");
return;
}
const t = document.getElementById(e);
if (t)
return t.innerHTML = "", t;
const r = document.createElement("div");
return r.id = e, document.body.appendChild(r), r;
}, gl = (e, t) => {
const r = Qr(e);
if (r)
return oi(t, r);
};
class wt {
constructor(t) {
this.id = t;
}
store = B([]);
createArea() {
return gl(this.id, () => this.render()), this;
}
render() {
return [];
}
}
class hl extends wt {
render() {
const t = this;
return L(() => t.store());
}
addRender(t, r) {
this.cache.has(t) || (this.store((n) => [...n, r]), this.cache.set(t, r));
}
removeRender(t) {
if (!this.cache.has(t)) return;
const r = this.cache.get(t);
this.cache.delete(t), this.store((n) => n.filter((l) => r !== l));
}
// biome-ignore lint/suspicious/noExplicitAny: symbol will cause typescript error
cache = /* @__PURE__ */ new WeakMap();
Portal = function(t) {
const r = Symbol();
return ie(() => {
t.children || console.warn("EasyPortal: children is undefined"), t.show() ? this.addRender(r, t.children) : this.removeRender(r);
}), Xe(() => {
this.removeRender(r);
}), [];
}.bind(this);
}
const en = new Ln("Button", {
loadingIcon: () => s(W, {
class: "pr-1",
"aria-label": "loading icon",
get children() {
return s(di, {
class: " cn-animate-spin"
});
}
})
});
function fl(e) {
const t = "opacity-50";
return ne(() => e.type ?? "default", {
primary() {
return `${t}`;
},
dashed() {
return `${this.default()} border-dashed`;
},
link() {
const r = e.danger ? "text-error-500" : "text-primary-500";
return `${this.default()} border-none ${r}`;
},
text() {
return this.link();
},
default: () => `border cursor-not-allowed ${t}`
});
}
function ml(e) {
return ne(() => e.type ?? "default", {
primary: () => `${e.danger ? "bg-error-500 hover:bg-error-400" : "bg-primary-500 hover:bg-primary-400"} text-white `,
dashed() {
return `${this.default()} border-dashed`;
},
link() {
const t = e.danger ? "text-error-500" : "text-primary-500";
return `${this.default()} border-none ${t}`;
},
text() {
return "hover:bg-gray-200";
},
default: () => `border-design-separator border ${e.danger ? "hover:border-error-400 hover:text-error-400 active:bg-error-50" : "hover:border-primary-400 hover:text-primary-400 active:bg-primary-50"} bg-transparent`
});
}
var vl = /* @__PURE__ */ x("<button>");
const Dt = k((e) => {
const t = ml(e), r = fl(e);
return (() => {
var n = b(vl), i = e.ref;
return typeof i == "function" ? ee(i, n) : e.ref = n, Z(n, A({
get id() {
return e.id;
},
get type() {
return e.htmlType ?? "button";
},
get class() {
return e.class("cn-button transition-colors outline-none select-none ", e.loading && "pointer-events-none opacity-50", e.circle ? "rounded-full px-2 py-1" : "rounded-md px-4 py-1 ", e.block && "block w-full", e.disabled ? r() : t());
},
get style() {
return e.style();
},
get disabled() {
return e.disabled;
},
get "aria-live"() {
return e.loading ? "polite" : void 0;
}
}, () => J(e)), !1, !0), m(n, s(Ue, {
get fallback() {
return [L(() => Y(e.icon)), L(() => e.children)];
},
get children() {
return s(se, {
get when() {
return e.loading;
},
get children() {
return [L(() => en.renderSlotAsDefault("loadingIcon", e.loadingIcon)), L(() => e.loadingText ?? "加载中")];
}
});
}
})), D(), n;
})();
}), De = (e) => ({
name: e.name,
placeholder: e.placeholder,
readonly: e.readonly,
disabled: e.disabled,
required: e.required,
error: e.error
});
function bl(e, t = {}) {
if (!e)
return;
e.focus(t);
const { cursor: r } = t;
if (r) {
const n = e.value.length;
switch (r) {
case "start":
e.setSelectionRange(0, 0);
break;
case "end":
e.setSelectionRange(n, n);
break;
default:
e.setSelectionRange(0, n);
break;
}
}
}
var yl = /* @__PURE__ */ x("<span><!$><!/> <!$><!/>");
const xl = (e) => (() => {
var t = b(yl), r = t.firstChild, [n, i] = M(r.nextSibling), l = n.nextSibling, o = l.nextSibling, [a, c] = M(o.nextSibling);
return m(t, () => e.count, n, i), m(t, () => e.max ? ` / ${e.max}` : null, a, c), E(() => R(t, K("text-sm text-nowrap ", e.max && (e.max ?? Number.POSITIVE_INFINITY) < e.count ? "text-rose-500" : "text-design-text"))), t;
})(), $l = (e) => {
const t = V(() => {
let r = e.count ?? {};
return typeof e.count == "boolean" && (r = {}), {
strategy(n) {
return n.length;
},
exceedFormatter(n, i) {
return i.max && !e.allowExceed ? n.slice(0, i.max) : n;
},
...r
};
});
return {
TextCount: s(I, {
get when() {
return e.count;
},
get children() {
return s(xl, {
get max() {
return t().max;
},
get count() {
return t().strategy(e.model());
}
});
}
}),
countOptional: t,
textLengthControl() {
qt(e.model, () => {
e.count !== !1 && e.model((r) => t().exceedFormatter(r, t()));
});
}
};
};
var wl = /* @__PURE__ */ x('<span class="mr-1 flex-none">'), Sl = /* @__PURE__ */ x('<span class="ml-1 text-gray-400 flex-none"><!$><!/><!$><!/>'), Cl = /* @__PURE__ */ x("<span><!$><!/><!$><!/><!$><!/>");
const Le = k((e) => {
e = he({
placeholder: "请输入文本",
rounded: !0
}, e);
const t = Q(null), r = Q(null), n = At(e.type ?? "text"), i = Kt(r), l = {
inputType: n,
model: e.model,
focus(h) {
bl(t(), h);
},
isHovering: i,
disabled: () => !!e.disabled
};
Pe(() => {
e.expose?.(l);
});
const o = V(() => {
const h = Y(e.prefixIcon, [l]);
return s(I, {
when: h,
get children() {
return (() => {
var f = b(wl);
return m(f, h), f;
})();
}
});
}), {
TextCount: a,
textLengthControl: c
} = $l(e);
c();
const u = V(() => {
const h = Y(e.suffixIcon, [l]);
return s(I, {
when: h || a,
get children() {
var f = b(Sl), g = f.firstChild, [v, y] = M(g.nextSibling), C = v.nextSibling, [S, w] = M(C.nextSibling);
return m(f, h, v, y), m(f, a, S, w), f;
}
});
}), d = T(() => e.type === "textarea");
return (() => {
var h = b(Cl), f = h.firstChild, [g, v] = M(f.nextSibling), y = g.nextSibling, [C, S] = M(y.nextSibling), w = C.nextSibling, [_, $] = M(w.nextSibling);
return ee((p) => (r(p), e.wrapperRef?.(p)), h), m(h, o, g, v), m(h, s(Nr, A({
get component() {
return d() ? "textarea" : "input";
},
ref: (p) => (t(p), e.ref?.(p)),
get id() {
return e.id;
},
get type() {
return n();
},
get class() {
return de.base("bg-transparent appearance-none outline-none w-full", !e.resize && "resize-none")(e.disabled && " cursor-not-allowed");
}
}, () => De(e), () => e.$input(), () => J(e))), C, S), m(h, u, _, $), E((p) => {
var P = e.disabled, N = e.class(de.base("cn-base-input transition inline-flex border py-1 px-3 text-sm text-design-primary ", d() && e.autoSize && "cn-textarea-auto-size", e.rounded && "rounded")(e.readonly && "border-design-separator cursor-default", e.disabled && "border-design-separator bg-gray-100 text-gray-400 opacity-50", e.error && "border-red-300", "border-design-separator hover:border-blue-400")), U = d() && e.autoSize ? e.model() : void 0, O = e.style();
return P !== p.e && F(h, "aria-disabled", p.e = P), N !== p.t && R(h, p.t = N), U !== p.a && F(h, "data-replicated-value", p.a = U), p.o = le(h, O, p.o), p;
}, {
e: void 0,
t: void 0,
a: void 0,
o: void 0
}), h;
})();
}), Uc = Le;
var _l = /* @__PURE__ */ x("<style>.cn-base-input:hover .cn-clear-btn { opacity: 1 !important; }");
const Xc = (e) => {
const t = ne(
// @ts-ignore
e.inputType,
{
password: s(gi, {}),
text: s(hi, {})
}
);
return s(W, {
"aria-label": "更改密码显隐",
clickable: !0,
get "aria-disabled"() {
return e.disabled();
},
onclick: () => {
e.disabled() || e.inputType((r) => r === "password" ? "text" : "password");
},
get children() {
return t();
}
});
}, tn = (e) => s(W, {
clickable: !0,
"aria-label": "清空按钮",
class: "cn-clear-btn opacity-0 transition cursor-pointer",
onclick: () => {
e.model?.(""), e.onClear?.();
},
get children() {
return [s(Wr, {
color: "#777"
}), b(_l)];
}
}), pl = k((e) => {
const t = e.model.sync(() => e.model() ?? "", (r) => r ?? null);
return s(Le, A(e, {
"v-model": t
}));
}), Ol = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
FormInput: pl
}, Symbol.toStringTag, { value: "Module" }));
var kl = /* @__PURE__ */ x('<div class="description text-design-secondary">'), Pl = /* @__PURE__ */ x('<nav class="bg-design-regular rounded-xl text-center px-4 pb-2 pt-4 shadow-1 max-w-screen min-w-[15rem] w-fit min-h-[9rem] flex flex-col justify-evenly"><div class="text-design-primary mb-1"></div><!$><!/><!$><!/><nav class="flex mt-2"><!$><!/><!$><!/>'), Ml = /* @__PURE__ */ x('<div class="cn-mask fixed top-0 left-0 h-screen w-screen bg-design-ultra-thin">'), El = /* @__PURE__ */ x("<div class=cn-message-box><!$><!/><!$><!/>"), zl = /* @__PURE__ */ x('<div class="fixed top-[50%] left-[50%] -translate-x-[50%] -translate-y-[50%]">');
const Tl = k((e) => (() => {
var t = b(Pl), r = t.firstChild, n = r.nextSibling, [i, l] = M(n.nextSibling), o = i.nextSibling, [a, c] = M(o.nextSibling), u = a.nextSibling, d = u.firstChild, [h, f] = M(d.nextSibling), g = h.nextSibling, [v, y] = M(g.nextSibling);
return Z(t, A(() => J(e)), !1, !0), m(r, () => e.title), m(t, s(I, {
get when() {
return e.description;
},
get children() {
var C = b(kl);
return m(C, () => e.description), C;
}
}), i, l), m(t, () => Y(e.messageSlot, [e]), a, c), m(u, s(I, {
get when() {
return e.cancelable;
},
get children() {
return s(Dt, {
type: "text",
block: !0,
get onclick() {
return e.onCancel;
},
children: "取消"
});
}
}), h, f), m(u, s(Dt, {
type: "text",
class: "font-bold text-primary-600 ",
block: !0,
get onclick() {
return e.onConfirm;
},
children: "确认"
}), v, y), D(), t;
})());
class Il extends wt {
render() {
const t = this;
return (() => {
var r = b(El), n = r.firstChild, [i, l] = M(n.nextSibling), o = i.nextSibling, [a, c] = M(o.nextSibling);
return m(r, s(I, {
get when() {
return L(() => !!t.store().length)() && t.store().some((u) => u.mask);
},
get children() {
var u = b(Ml);
return u.$$click = () => {
t.store().map((d) => d.onCancel());
}, D(), u;
}
}), i, l), m(r, s(Ge, {
name: "cn-fade",
get children() {
return s(G, {
get each() {
return t.store();
},
children: (u) => (() => {
var d = b(zl);
return m(d, s(Tl, u)), E((h) => (h = yt.getIndex()) != null ? d.style.setProperty("z-index", h) : d.style.removeProperty("z-index")), d;
})()
});
}
}), a, c), r;
})();
}
base(t, r, n = {}, i) {
const l = jn(), o = {
...n,
title: t,
description: r,
onConfirm: () => {
l.resolve(i?.()), a();
},
onCancel: () => {
a();
}
};
this.store((c) => [...c, o]);
const a = () => {
this.store((c) => c.filter((u) => u !== o)), l.reject();
};
return l.promise;
}
alert(t, r, n = {}) {
return this.base(t, r, {
...n,
cancelable: !1
});
}
prompt(t, r, n = {}) {
const i = B("");
return this.base(t, r, {
...n,
messageSlot() {
return s(Le, {
"v-model": i,
class: "my-2",
type: "text"
});
},
cancelable: !0
}, () => ({
text: i()
}));
}
confirm(t, r, n = {}) {
return this.base(t, r, {
...n,
cancelable: !0
});
}
}
const Gc = /* @__PURE__ */ new Il("cn-ui-modal-layers").createArea();
oe(["click"]);
var Al = /* @__PURE__ */ x('<nav class="h-full w-full fixed z-[200] bg-gray-700/70 top-0 left-0">');
class Rl extends wt {
show = B(!1);
events = [];
onClick(t) {
this.events.push(t), Xe(() => {
this.events = this.events.filter((r) => r !== t);
}), this.show(!1);
}
/** 绑定数据模型 */
bindModel(t) {
ie(() => {
this.show(t());
}), this.onClick(() => {
t(!1);
});
}
render() {
const [t, r] = _i(document.body);
ie(() => {
r(this.show());
});
const n = this;
return s(Yt, {
name: "cn-opacity-fade",
get children() {
return s(I, {
get when() {
return n.show();
},
get children() {
var i = b(Al);
return i.$$click = () => {
n.events.map((l) => Y(l));
}, D(), i;
}
});
}
});
}
}
const Dl = /* @__PURE__ */ new Rl("cn-ui-mask").createArea();
oe(["click"]);
var Fl = /* @__PURE__ */ x('<nav><header class="flex p-4 text-xl border-b border-design-separator "><!$><!/><h3 class="flex-1 font-bold "></h3></header><div class=p-4>');
const Zc = k((e) => {
const t = Qr("cn-ui-modal-layers");
return Dl.bindModel(e.model), s(Dr, {
mount: t,
portalled: !0,
get children() {
return s(Yt, {
get name() {
return e.placement === "left" ? "cn-slide-from-left" : "cn-slide-from-right";
},
get children() {
return s(I, {
get when() {
return e.model();
},
get children() {
var r = b(Fl), n = r.firstChild, i = n.firstChild, [l, o] = M(i.nextSibling), a = l.nextSibling, c = n.nextSibling;
return m(n, s(W, {
class: "cursor-pointer text-design-secondary pr-4",
onclick: () => {
e.model(!1);
},
get children() {
return s(ot, {});
}
}), l, o), m(a, () => e.title), m(c, () => e.children), E((u) => {
var d = e.class("cn-drawer", "fixed top-0 h-screen bg-design-thick min-w-[15rem] shadow-1", e.placement === "left" ? "left-0" : "right-0"), h = yt.getIndex();
return d !== u.e && R(r, u.e = d), h !== u.t && ((u.t = h) != null ? r.style.setProperty("z-index", h) : r.style.removeProperty("z-index")), u;
}, {
e: void 0,
t: void 0
}), r;
}
});
}
});
}
});
});
class Ll extends wt {
constructor(t) {
super(t), this.id = t, this.PStore = br.reduce((r, n) => (r[n] = B([]), r), {});
}
PStore;
removeMessage(t) {
const r = this.getPosFromId(t);
return this.PStore[r]((n) => n.filter((i) => i.id !== t));
}
render() {
const t = this;
return s(G, {
each: br,
children: (r) => {
const n = t.PStore[r];
return s(ul, {
id: `cn-message-${r}`,
"v-model": () => !0,
get each() {
return n();
},
by: (i) => i.id,
position: r,
children: (i) => s(qi, {
class: "h-full bg-design-primary-elevated shadow-lg",
get type() {
return i.type;
},
round: !0,
get message() {
return i.title;
},
get description() {
return i.description;
},
icon: !0,
get closable() {
return i.closable;
},
onClose: () => t.removeMessage(i.id)
})
});
}
});
}
autoKey = 1;
getPosFromInfo(t) {
return t.position ?? "top";
}
getPosFromId(t) {
return t.split(":", 1)[0];
}
create(t, r, n = {}) {
const i = this.getPosFromInfo(n), o = {
id: `${i}:${(this.autoKey++).toString()}`,
title: t,
type: r,
...n
};
return this.PStore[i]((a) => [o, ...a]), this.durationClose(o, o.duration), o;
}
close(t) {
throw t.id && this.removeMessage(t.id), new Error("需要输入一个 id 来关闭 Message");
}
durationClose(t, r = 3e3) {
r <= 0 || setTimeout(() => {
this.removeMessage(t.id);
}, r);
}
info(t, r) {
return this.create(t, "info", r);