@jay-js/ui/components/Base/Base.js

A library of UI components for Jay JS with Tailwind CSS and daisyUI.

function _object_without_properties(source, excluded) {
    if (source == null) return {};
    var target = _object_without_properties_loose(source, excluded);
    var key, i;
    if (Object.getOwnPropertySymbols) {
        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
        for(i = 0; i < sourceSymbolKeys.length; i++){
            key = sourceSymbolKeys[i];
            if (excluded.indexOf(key) >= 0) continue;
            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
            target[key] = source[key];
        }
    }
    return target;
}
function _object_without_properties_loose(source, excluded) {
    if (source == null) return {};
    var target = {};
    var sourceKeys = Object.keys(source);
    var key, i;
    for(i = 0; i < sourceKeys.length; i++){
        key = sourceKeys[i];
        if (excluded.indexOf(key) >= 0) continue;
        target[key] = source[key];
    }
    return target;
}
import { mergeClasses } from "../../utils/mergeClasses.js";
import { uniKey } from "../../utils/uniKey.js";
export function Base(_param = {
    tag: "div"
}) {
    var { id, tag, ref, style, children, dataset, className, listeners, onmount } = _param, props = _object_without_properties(_param, [
        "id",
        "tag",
        "ref",
        "style",
        "children",
        "dataset",
        "className",
        "listeners",
        "onmount"
    ]);
    const base = document.createElement(tag || "div");
    ref && (ref.current = base);
    id ? base.id = id : base.id = uniKey();
    if (className) {
        if (typeof className === "function" && className.name.includes("_set_value_effect")) {
            className(base, "className");
        } else {
            base.className = mergeClasses([
                className
            ]);
        }
    }
    listeners && Object.entries(listeners).forEach(([key, value])=>{
        base.addEventListener(key, value);
    });
    style && Object.entries(style).forEach(([key, value])=>{
        if (key === "parentRule" || key === "length") return;
        base.style[key] = value;
    });
    dataset && Object.entries(dataset).forEach(([key, value])=>{
        base.dataset[key] = value;
    });
    onmount && setTimeout(()=>onmount(base));
    if (children) {
        if (children instanceof Promise) {
            const elementSlot = document.createElement("jayjs-lazy-slot");
            base.appendChild(elementSlot);
            children.then((resolvedChild)=>{
                if (resolvedChild && typeof resolvedChild !== "boolean") {
                    elementSlot.replaceWith(resolvedChild);
                }
            }).catch((error)=>{
                console.error("Failed to resolve child promise:", error);
            });
        } else {
            if (Array.isArray(children)) {
                children.forEach((child)=>{
                    if (child) {
                        if (typeof child !== "boolean") {
                            appendChildToBase(base, child);
                        }
                    }
                });
            } else {
                if (typeof children !== "boolean") {
                    appendChildToBase(base, children);
                }
            }
        }
    }
    props && Object.entries(props).forEach(([key, value])=>{
        try {
            base[key] = value;
        } catch (error) {
            if (error instanceof TypeError) {
                console.warn(`JayJS: Cannot set property "${key}" of type "${typeof value}" to "${value}".`);
                throw error;
            }
        }
    });
    return base;
}
function appendChildToBase(base, child) {
    if (child instanceof Promise) {
        const elementSlot = document.createElement("jayjs-lazy-slot");
        base.appendChild(elementSlot);
        child.then((resolvedChild)=>{
            if (resolvedChild && typeof resolvedChild !== "boolean") {
                elementSlot.replaceWith(resolvedChild);
            }
        });
        return;
    }
    if (typeof child === "string") {
        base.appendChild(document.createTextNode(child));
        return;
    }
    if (child && typeof child !== "boolean") {
        base.appendChild(child);
    }
}