Files
xiaobaifupan/app/frontend/shared/components.js
T

55 lines
1.9 KiB
JavaScript

(function exposeSharedComponents(global) {
"use strict";
const ui = global.XiaobaiUI;
if (!ui) throw new Error("XiaobaiUI must load before shared components");
function resolveElement(target, root = document) {
if (target instanceof Element) return target;
if (typeof target !== "string" || !target) return null;
return target.startsWith("#") ? root.querySelector(target) : root.getElementById?.(target);
}
function classNames(...values) {
return values.flatMap((value) => String(value || "").split(/\s+/)).filter(Boolean).join(" ");
}
function emptyStateHtml(message, options = {}) {
const classes = classNames("empty-state", options.className);
const attributes = options.role ? ` role="${ui.escapeHtml(options.role)}"` : "";
return `<div class="${ui.escapeHtml(classes)}"${attributes}>${ui.escapeHtml(message)}</div>`;
}
function renderEmptyState(target, message, options = {}) {
const element = resolveElement(target, options.root);
if (!element) return false;
element.innerHTML = emptyStateHtml(message, options);
return true;
}
function setText(target, value, options = {}) {
const element = resolveElement(target, options.root);
if (!element) return false;
element.textContent = value == null ? "" : String(value);
return true;
}
function renderCollection(target, items, renderItem, options = {}) {
const element = resolveElement(target, options.root);
if (!element) return 0;
const rows = Array.isArray(items) ? items : [];
element.innerHTML = rows.length
? rows.map((item, index) => renderItem(item, index)).join("")
: emptyStateHtml(options.emptyMessage || "", options.emptyOptions);
return rows.length;
}
global.XiaobaiComponents = Object.freeze({
classNames,
emptyStateHtml,
renderCollection,
renderEmptyState,
setText,
});
})(window);