export const allButtonStates = (styles: IButtonStates, nested?: object, debugMode?: boolean) => {
    const allStates = styles.allStates !== undefined ? styles.allStates : {};
    const noState = styles.noState !== undefined ? styles.noState : {};

    const output = {
        ...allStates,
        ...noState,
        $nest: {
            "&:hover": { ...allStates, ...styles.hover },
            "&:focus": { ...allStates, ...styles.focus },
            "&:focus:not(.focus-visible)": { ...allStates, ...styles.focusNotKeyboard },
            "&&.focus-visible": { ...allStates, ...styles.accessibleFocus },
            "&:active": { ...allStates, ...styles.active },
            ...nested,
        },
    };

    if (debugMode) {
        log("allButtonStates: ");
        log("style: ", styles);
        log("nested: ", nested);
        log("output: ", output);
    }

    return output;
};

    function styleCreator(...objects: Array<NestedCSSProperties | string | symbol>): string {
        if (objects.length === 0) {
            return style();
        }

        let debugName = componentName;
        let shouldLogDebug = false;
        let styleObjs: Array<NestedCSSProperties | undefined> = objects as any;
        if (objects[0] === DEBUG_STYLES) {
            styleObjs.shift();
            shouldLogDebug = true;
        }
        if (typeof objects[0] === "string") {
            const [subcomponentName, ...restObjects] = styleObjs;
            debugName += `-${subcomponentName}`;
            styleObjs = restObjects;
        }

        if (shouldLogDebug) {
            logWarning(`Debugging component ${debugName}`);
            log(styleObjs);
        }

        return style({ $debugName: debugName }, ...styleObjs);
    }

    .then(() => {
        log("Bootstrapping complete.");
        // Mount all data-react components.
        onContent(e => {
            _mountComponents(e.target);
        });

        const contentEvent = new CustomEvent("X-DOMContentReady", { bubbles: true, cancelable: false });
        document.dispatchEvent(contentEvent);
    })

tplEval: (tpl, map) => log(map),

 * @license GPL-2.0-only
 */

import { onContent, getMeta, _executeReady, _mountComponents } from "@library/utility/appUtils";
import { log, logError, debug } from "@library/utility/utils";
import gdn from "@library/gdn";
import apiv2 from "@library/apiv2";

// Inject the debug flag into the utility.
const debugValue = getMeta("context.debug", getMeta("debug", false));
debug(debugValue);

// Export the API to the global object.
gdn.apiv2 = apiv2;

log("Bootstrapping");
_executeReady()
    .then(() => {
        log("Bootstrapping complete.");
        // Mount all data-react components.
        onContent(e => {
            _mountComponents(e.target);
        });

        const contentEvent = new CustomEvent("X-DOMContentReady", { bubbles: true, cancelable: false });
        document.dispatchEvent(contentEvent);
    })
    .catch(error => {
        logError(error);
    });