xmlui 0.7.21 → 0.7.23

package/dist/scripts/src/components-core/markup-check.js

@@ -1,279 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.checkXmlUiMarkup = checkXmlUiMarkup;
-exports.visitComponent = visitComponent;
-const ParameterParser_1 = require("./script-runner/ParameterParser");
-const Parser_1 = require("../parsers/scripting/Parser");
-const descriptorHelper_1 = require("./descriptorHelper");
-const abstractions_1 = require("@components/abstractions");
-/**
- * This function checks the XMLUI markup for potential issues. It retrieves
- * a list of errors and warnings.
- * @param rootDef Root component definition
- * @param components Components referenced in the XMLUI markup
- * @param devMode Indicates if the check is performed in development mode
- * @returns List of errors and warnings
- */
-function checkXmlUiMarkup(rootDef, components, metadataHandler, devMode) {
-    const errorsCollected = [];
-    // --- Initialize the check
-    const continuation = {};
-    const componentIdsCollected = new Set();
-    const compoundIdsCollected = new Set();
-    // --- Visit the root component
-    if (rootDef) {
-        visitComponent(rootDef, null, componentDefVisitor, continuation, metadataHandler);
-    }
-    // --- Visit the compound components
-    if (!continuation.abort) {
-        for (const component of components) {
-            // --- Rule: Compound component name must be a valid JavaScript identifier
-            if (!isValidIdentifier(component.name)) {
-                reportError("M007", "Component", component.name);
-            }
-            // --- Rule: Compound component name cannot be 'Component'
-            if (component.name === "Component") {
-                reportError("M008", "Component", component.name);
-            }
-            // --- Rule: Compound component must not have the name of a registered component
-            if (metadataHandler.componentRegistered(component.name)) {
-                reportError("M009", "Component", component.name);
-            }
-            // --- Rule: Compound component name must be unique
-            if (compoundIdsCollected.has(component.name)) {
-                reportError("M010", "Component", component.name);
-            }
-            else {
-                compoundIdsCollected.add(component.name);
-            }
-            // --- Reset component ID scope
-            componentIdsCollected.clear();
-            // --- Visit the compount component's definition
-            visitComponent(component.component, null, componentDefVisitor, continuation, metadataHandler);
-        }
-    }
-    // --- Done.
-    return errorsCollected;
-    // --- This visitor checks the rules for a particular component
-    function componentDefVisitor(def, parent, before, continuation) {
-        var _a, _b, _c, _d, _e;
-        // --- This is the visitor function to check a ComponentDef markup
-        if (!before) {
-            // --- Do not visit the component definition after its children have been visited
-            return;
-        }
-        // --- Rule: Component name must be registered
-        if (!metadataHandler.componentRegistered(def.type)) {
-            reportError("M001", (_a = parent === null || parent === void 0 ? void 0 : parent.type) !== null && _a !== void 0 ? _a : "Root", def.type);
-            // continuation.cancel = true;
-            return;
-        }
-        // --- Rule: an ID must be a valid JavaScript identifier
-        if (def.uid) {
-            if (!isValidIdentifier(def.uid)) {
-                reportError("M002", def.type, def.type, def.uid);
-            }
-            else if (componentIdsCollected.has(def.uid)) {
-                reportError("M003", def.type, def.uid);
-            }
-            else {
-                componentIdsCollected.add(def.uid);
-            }
-        }
-        // --- Check all props of the component
-        const propDescriptors = (_b = metadataHandler.getComponentProps(def.type)) !== null && _b !== void 0 ? _b : {};
-        const currentProps = (_c = def.props) !== null && _c !== void 0 ? _c : {};
-        for (const propName of Object.keys(currentProps)) {
-            const propDescriptor = propDescriptors[propName];
-            // --- Rule: The property must be defined in the component descriptor or be a layout option
-            // --- or the component must accept arbitrary properties
-            if (propDescriptor) {
-                // --- The property has a descriptor, so it is allowed.
-                // --- Rule: The property value must be parseable
-                const propValue = currentProps[propName];
-                if (typeof propValue === "string") {
-                    try {
-                        (0, ParameterParser_1.parseParameterString)(propValue);
-                    }
-                    catch (error) {
-                        reportError("M006", def.type, propName, error.message);
-                    }
-                }
-            }
-            else {
-                // --- The property has no descriptor.
-                const propParts = propName.split("-");
-                // --- Check for a layout property
-                const validProp = 
-                // --- Layout property
-                (propParts.length === 1 && descriptorHelper_1.layoutOptionKeys.includes(propName)) ||
-                    // --- Layout property with viewport size
-                    (propParts.length === 2 &&
-                        descriptorHelper_1.layoutOptionKeys.includes(propParts[0]) &&
-                        abstractions_1.viewportSizeNames.includes(propParts[1])) ||
-                    // --- Arbitrary property is allowed
-                    metadataHandler.acceptArbitraryProps(def.type);
-                if (!validProp) {
-                    // --- The component does not accept arbitrary properties and
-                    // --- the property is not a layout option
-                    reportError("M005", def.type, def.type, propName);
-                }
-            }
-        }
-        // --- Check all events of the component
-        const eventDescriptors = (_d = metadataHandler.getComponentEvents(def.type)) !== null && _d !== void 0 ? _d : {};
-        const currentEvents = (_e = def.events) !== null && _e !== void 0 ? _e : {};
-        for (const eventName of Object.keys(currentEvents)) {
-            const eventDescriptor = eventDescriptors[eventName];
-            // --- Rule: The event must be defined in the component descriptor
-            if (eventDescriptor) {
-                // --- The event has a descriptor, so it is allowed.
-                const eventValue = currentEvents[eventName];
-                if (typeof eventValue === "string") {
-                    // --- Rule: The event value must be parseable
-                    const parser = new Parser_1.Parser(eventValue);
-                    try {
-                        parser.parseStatements();
-                        if (parser.errors.length > 0) {
-                            reportError("M012", def.type, eventName, parser.errors[0].text);
-                        }
-                    }
-                    catch (error) {
-                        reportError("M012", def.type, eventName, error.message);
-                    }
-                }
-            }
-            else {
-                reportError("M011", def.type, def.type, eventName);
-            }
-        }
-        // --- Check the component validator
-        const componentValidator = metadataHandler.getComponentValidator(def.type);
-        if (componentValidator) {
-            const validationErrors = componentValidator(def, devMode);
-            if (validationErrors) {
-                if (Array.isArray(validationErrors)) {
-                    for (const error of validationErrors) {
-                        reportError("M013", def.type, error);
-                    }
-                }
-                else {
-                    reportError("M013", def.type, validationErrors);
-                }
-            }
-        }
-    }
-    /**
-     * Checks if a string is a valid JavaScript identifier.
-     * @param identifier The string to check.
-     * @returns True if the string is a valid identifier, false otherwise.
-     */
-    function isValidIdentifier(identifier) {
-        const identifierRegex = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/;
-        return identifierRegex.test(identifier);
-    }
-    function reportError(code, name, ...args) {
-        _reportError(code, name, false, ...args);
-    }
-    function reportWarning(code, name, ...args) {
-        _reportError(code, name, true, ...args);
-    }
-    function _reportError(code, name, isWarning, ...args) {
-        var _a;
-        let errorText = (_a = errorMessages[code]) !== null && _a !== void 0 ? _a : "Unkonwn error";
-        if (args) {
-            args.forEach((a, idx) => (errorText = replace(errorText, `{${idx}}`, args[idx].toString())));
-        }
-        errorsCollected.push({ name, code, message: errorText, isWarning, args });
-        function replace(input, placeholder, replacement) {
-            do {
-                input = input.replace(placeholder, replacement);
-            } while (input.includes(placeholder));
-            return input;
-        }
-    }
-}
-// --- This function visits a component, its nested components and children
-function visitComponent(def, parent, visitor, continuation = {}, metadataHandler) {
-    var _a, _b, _c, _d;
-    // --- Visit the component (before)
-    visitor(def, parent, true, continuation);
-    if (continuation.abort || continuation.cancel) {
-        // --- Stop the visit
-        return;
-    }
-    // --- Visit the properties with "ComponentDef" value
-    const propDescriptors = (_a = metadataHandler.getComponentProps(def.type)) !== null && _a !== void 0 ? _a : {};
-    const currentProps = (_b = def.props) !== null && _b !== void 0 ? _b : {};
-    for (const propName of Object.keys(currentProps)) {
-        const propDescriptor = propDescriptors[propName];
-        if (!propDescriptor) {
-            // --- No descriptor for the property, skip it
-            continue;
-        }
-        const propValue = currentProps[propName];
-        if (propDescriptor.type === "ComponentDef" && propValue.type) {
-            // --- This property holds a nested component, visit it
-            visitComponent(propValue, def, visitor, continuation, metadataHandler);
-            if (continuation.abort || continuation.cancel) {
-                // --- Stop the visit
-                return;
-            }
-        }
-    }
-    // --- Visit events with nested components
-    const eventDescriptors = (_c = metadataHandler.getComponentEvents(def.type)) !== null && _c !== void 0 ? _c : {};
-    const currentEvents = (_d = def.events) !== null && _d !== void 0 ? _d : {};
-    for (const eventName of Object.keys(currentEvents)) {
-        const eventDescriptor = eventDescriptors[eventName];
-        if (!eventDescriptor) {
-            // --- No descriptor for the events, skip it
-            continue;
-        }
-        const eventValue = currentEvents[eventName];
-        if (typeof eventValue === "object" && eventValue.type) {
-            // --- This event holds a nested component, visit it
-            visitComponent(eventValue, def, visitor, continuation, metadataHandler);
-            if (continuation.abort) {
-                // --- Stop visiting this component
-                return;
-            }
-            if (continuation.cancel) {
-                // --- Skip the remaining items
-                break;
-            }
-        }
-    }
-    // --- Visit the component children
-    if (def.children) {
-        for (const child of def.children) {
-            visitComponent(child, def, visitor, continuation, metadataHandler);
-            if (continuation.abort) {
-                // --- Stop visiting this component
-                return;
-            }
-            if (continuation.cancel) {
-                // --- Skip the remaining items
-                break;
-            }
-        }
-    }
-    // --- Visit the component (after)
-    visitor(def, undefined, false, continuation);
-}
-// --- The error messages of error codes
-const errorMessages = {
-    M001: "The component '{0}' is not registered",
-    M002: "The '{0}' element has an invalid id: '{1}'",
-    M003: "Invalid component identifier: '{0}'",
-    M004: "Duplicated component identifier: '{0}'",
-    M005: "The '{0}' element has an invalid property: '{1}'",
-    M006: "Parsing property value of '{0}' failed: {1}",
-    M007: "The name of a reusable component is invalid: '{0}'",
-    M008: "The name of a reusable component must not be '{0}', as it is a reserved name",
-    M009: "A reusable component cannot have the name of a registered component: '{0}'",
-    M010: "Duplicated reusable component name: '{0}'",
-    M011: "The '{0}' element has an invalid event: '{1}'",
-    M012: "Parsing event value of '{0}' failed: {1}",
-    M013: "Component validation failed: '{0}'",
-};

package/dist/scripts/src/components-core/rendering/AppContent.js

@@ -1,339 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AppContent = AppContent;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const AppRoot_1 = require("./AppRoot");
-const DebugViewProvider_1 = require("@components-core/DebugViewProvider");
-const ComponentRegistryContext_1 = require("@components/ComponentRegistryContext");
-const react_router_dom_1 = require("react-router-dom");
-const ConfirmationModalContextProvider_1 = require("@components/ModalDialog/ConfirmationModalContextProvider");
-const ThemeContext_1 = require("@components-core/theming/ThemeContext");
-const hooks_1 = require("@components-core/utils/hooks");
-const abstractions_1 = require("@components-core/theming/abstractions");
-const themeVars_1 = require("@components-core/theming/themeVars");
-const useApiInterceptorContext_1 = require("@components-core/interception/useApiInterceptorContext");
-const constants_1 = require("@components-core/constants");
-const AppStateContext_1 = require("@components/App/AppStateContext");
-const renderChild_1 = require("./renderChild");
-const AppContext_1 = require("@components-core/AppContext");
-const misc_1 = require("@components-core/utils/misc");
-const date_fns_1 = require("date-fns");
-const misc_utils_1 = require("@components-core/appContext/misc-utils");
-const lodash_es_1 = require("lodash-es");
-const react_hot_toast_1 = __importDefault(require("react-hot-toast"));
-const package_json_1 = require("../../../package.json");
-const date_functions_1 = require("@components-core/appContext/date-functions");
-const math_function_1 = require("@components-core/appContext/math-function");
-/**
- *  This component wraps the entire app into a container with these particular
- *  responsibilities:
- *  - Managing the application state
- *  - Helping the app with viewport-related functionality (e.g., information
- *    of viewport size, supporting responsive apps)
- *  - Providing xmlui-defined methods and properties for apps, such as
- *    `activeThemeId`, `navigate`, `toast`, and many others.
- */
-function AppContent({ rootContainer, routerBaseName, globalProps, standalone, trackContainerHeight, decorateComponentsWithTestId, debugEnabled, }) {
-    const [loggedInUser, setLoggedInUser] = (0, react_1.useState)(null);
-    const debugView = (0, DebugViewProvider_1.useDebugView)();
-    const componentRegistry = (0, ComponentRegistryContext_1.useComponentRegistry)();
-    const navigate = (0, react_router_dom_1.useNavigate)();
-    const { confirm } = (0, ConfirmationModalContextProvider_1.useConfirm)();
-    // --- Prepare theme-related variables. We will use them to manage the selected theme
-    // --- and also pass them to the app context.
-    const { activeThemeId, activeThemeTone, setActiveThemeId, setActiveThemeTone, availableThemeIds, root, toggleThemeTone, } = (0, ThemeContext_1.useThemes)();
-    // --- Handle special key combinations to change the theme and tone
-    (0, hooks_1.useDocumentKeydown)((event) => {
-        // --- Alt + Ctrl + Shift + T changes the current theme
-        if (event.code === "KeyT" && event.altKey && event.ctrlKey && event.shiftKey) {
-            setActiveThemeId(availableThemeIds[(availableThemeIds.indexOf(activeThemeId) + 1) % availableThemeIds.length]);
-        }
-        // --- Alt + Ctrl + Shift + O changes the current theme tone
-        if (event.code === "KeyO" && event.altKey && event.ctrlKey && event.shiftKey) {
-            setActiveThemeTone(abstractions_1.ThemeToneKeys[(abstractions_1.ThemeToneKeys.indexOf(activeThemeTone) + 1) % abstractions_1.ThemeToneKeys.length]);
-        }
-        // --- Alt + Ctrl + Shift + S toggles the current state view
-        if (event.code === "KeyS" && event.altKey && event.ctrlKey && event.shiftKey) {
-            debugView.setDisplayStateView(!debugView.displayStateView);
-        }
-    });
-    // --- We use the state variables to store the current media query values
-    const [maxWidthPhone, setMaxWidthPhone] = (0, react_1.useState)("0");
-    const [maxWidthPhoneLower, setMaxWidthPhoneLower] = (0, react_1.useState)("0");
-    const [maxWidthLandscapePhone, setMaxWidthLandscapePhone] = (0, react_1.useState)("0");
-    const [maxWidthLandscapePhoneLower, setMaxWidthLandscapePhoneLower] = (0, react_1.useState)("0");
-    const [maxWidthTablet, setMaxWidthTablet] = (0, react_1.useState)("0");
-    const [maxWidthTabletLower, setMaxWidthTabletLower] = (0, react_1.useState)("0");
-    const [maxWidthDesktop, setMaxWidthDesktop] = (0, react_1.useState)("0");
-    const [maxWidthDesktopLower, setMaxWidthDesktopLower] = (0, react_1.useState)("0");
-    const [maxWidthLargeDesktop, setMaxWidthLargeDesktop] = (0, react_1.useState)("0");
-    const [maxWidthLargeDesktopLower, setMaxWidthLargeDesktopLower] = (0, react_1.useState)("0");
-    // --- We create a lower dimension value for the media query using a range
-    const createLowerDimensionValue = (dimension) => {
-        const match = dimension.match(/^(\d+)px$/);
-        return match ? `${parseInt(match[1]) - 0.02}px` : "0";
-    };
-    // --- Whenever the size of the viewport changes, we update the values
-    // --- related to viewport size
-    const observer = (0, react_1.useRef)();
-    (0, hooks_1.useIsomorphicLayoutEffect)(() => {
-        if (trackContainerHeight) {
-            if (root && root !== document.body) {
-                // --- We are already observing old element
-                if (observer === null || observer === void 0 ? void 0 : observer.current) {
-                    observer.current.unobserve(root);
-                }
-                observer.current = new ResizeObserver((entries) => {
-                    root.style.setProperty("--containerHeight", entries[0].contentRect.height + "px");
-                });
-                if (observer.current) {
-                    observer.current.observe(root);
-                }
-            }
-        }
-        return () => {
-            if (observer === null || observer === void 0 ? void 0 : observer.current) {
-                observer.current.unobserve(root);
-            }
-        };
-    }, [root, observer, trackContainerHeight]);
-    // --- Whenever the application root DOM object or the active theme changes, we sync
-    // --- with the theme variable values (because we can't use css var in media queries)
-    (0, hooks_1.useIsomorphicLayoutEffect)(() => {
-        const mwPhone = getComputedStyle(root).getPropertyValue((0, themeVars_1.getVarKey)("media-max-width-phone"));
-        setMaxWidthPhone(mwPhone);
-        setMaxWidthPhoneLower(createLowerDimensionValue(mwPhone));
-        const mwLandscapePhone = getComputedStyle(root).getPropertyValue((0, themeVars_1.getVarKey)("media-max-width-landscape-phone"));
-        setMaxWidthLandscapePhone(mwLandscapePhone);
-        setMaxWidthLandscapePhoneLower(createLowerDimensionValue(mwLandscapePhone));
-        const mwTablet = getComputedStyle(root).getPropertyValue((0, themeVars_1.getVarKey)("media-max-width-tablet"));
-        setMaxWidthTablet(mwTablet);
-        setMaxWidthTabletLower(createLowerDimensionValue(mwTablet));
-        const mwDesktop = getComputedStyle(root).getPropertyValue((0, themeVars_1.getVarKey)("media-max-width-desktop"));
-        setMaxWidthDesktop(mwDesktop);
-        setMaxWidthDesktopLower(createLowerDimensionValue(mwDesktop));
-        const mwLargeDesktop = getComputedStyle(root).getPropertyValue((0, themeVars_1.getVarKey)("media-max-width-large-desktop"));
-        setMaxWidthLargeDesktop(mwLargeDesktop);
-        setMaxWidthLargeDesktopLower(createLowerDimensionValue(mwLargeDesktop));
-    }, [activeThemeId, root]);
-    // --- Set viewport size information
-    const isViewportPhone = (0, hooks_1.useMediaQuery)(`(max-width: ${maxWidthPhoneLower})`);
-    const isViewportLandscapePhone = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthPhone}) and (max-width: ${maxWidthLandscapePhoneLower})`);
-    const isViewportTablet = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthLandscapePhone}) and (max-width: ${maxWidthTabletLower})`);
-    const isViewportDesktop = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthTablet}) and (max-width: ${maxWidthDesktopLower})`);
-    const isViewportLargeDesktop = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthDesktop}) and (max-width: ${maxWidthLargeDesktopLower})`);
-    let vpSize = "xs";
-    let vpSizeIndex = 0;
-    const isViewportXlDesktop = (0, hooks_1.useMediaQuery)(`(min-width: ${maxWidthLargeDesktop})`);
-    if (isViewportXlDesktop) {
-        vpSize = "xxl";
-        vpSizeIndex = 5;
-    }
-    else if (isViewportLargeDesktop) {
-        vpSize = "xl";
-        vpSizeIndex = 4;
-    }
-    else if (isViewportDesktop) {
-        vpSize = "lg";
-        vpSizeIndex = 3;
-    }
-    else if (isViewportTablet) {
-        vpSize = "md";
-        vpSizeIndex = 2;
-    }
-    else if (isViewportLandscapePhone) {
-        vpSize = "sm";
-        vpSizeIndex = 1;
-    }
-    // --- Collect information about the current environment
-    const isInIFrame = (0, hooks_1.useIsInIFrame)();
-    const isWindowFocused = (0, hooks_1.useIsWindowFocused)();
-    const apiInterceptorContext = (0, useApiInterceptorContext_1.useApiInterceptorContext)();
-    const location = (0, react_router_dom_1.useLocation)();
-    const lastHash = (0, react_1.useRef)("");
-    // --- Listen to location change using useEffect with location as dependency
-    // https://jasonwatmore.com/react-router-v6-listen-to-location-route-change-without-history-listen
-    (0, react_1.useEffect)(() => {
-        if (location.hash) {
-            lastHash.current = location.hash.slice(1); // safe hash for further use after navigation
-        }
-        if (lastHash.current) {
-            setTimeout(() => {
-                var _a;
-                (_a = document
-                    .getElementById(lastHash.current)) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: "instant", block: "start" });
-                lastHash.current = "";
-            }, 100);
-        }
-    }, [location]);
-    // --- We collect all the actions defined in the app and pass them to the app context
-    const Actions = (0, react_1.useMemo)(() => {
-        const ret = {
-            _SUPPORT_IMPLICIT_CONTEXT: true,
-        };
-        for (const [key, value] of componentRegistry.actionFunctions) {
-            ret[key] = value;
-        }
-        return ret;
-    }, [componentRegistry.actionFunctions]);
-    // --- We collect information about app embedding and pass it to the app context
-    const embed = (0, react_1.useMemo)(() => {
-        return {
-            isInIFrame: isInIFrame,
-        };
-    }, [isInIFrame]);
-    // --- We collect information about the current environment and pass it to the app context
-    const environment = (0, react_1.useMemo)(() => {
-        return {
-            isWindowFocused,
-        };
-    }, [isWindowFocused]);
-    // --- We collect information about the current media size and pass it to the app context
-    const mediaSize = (0, react_1.useMemo)(() => {
-        return {
-            phone: isViewportPhone,
-            landscapePhone: isViewportLandscapePhone,
-            tablet: isViewportTablet,
-            desktop: isViewportDesktop,
-            largeDesktop: isViewportLargeDesktop,
-            xlDesktop: isViewportXlDesktop,
-            smallScreen: isViewportPhone || isViewportLandscapePhone || isViewportTablet,
-            largeScreen: !(isViewportPhone || isViewportLandscapePhone || isViewportTablet),
-            size: vpSize,
-            sizeIndex: vpSizeIndex,
-        };
-    }, [
-        isViewportPhone,
-        isViewportLandscapePhone,
-        isViewportTablet,
-        isViewportDesktop,
-        isViewportLargeDesktop,
-        isViewportXlDesktop,
-        vpSize,
-        vpSizeIndex,
-    ]);
-    // --- We extract the global properties from the app configuration and pass them to the app context
-    const appGlobals = (0, react_1.useMemo)(() => {
-        return globalProps ? Object.assign({}, globalProps) : constants_1.EMPTY_OBJECT;
-    }, [globalProps]);
-    // --- We assemble the app context object form the collected information
-    const appContextValue = (0, react_1.useMemo)(() => {
-        const ret = Object.assign(Object.assign(Object.assign(Object.assign({ 
-            // --- Engine-related
-            version: package_json_1.version,
-            // --- Actions namespace
-            Actions,
-            // --- App-specific
-            appGlobals,
-            debugEnabled,
-            decorateComponentsWithTestId,
-            environment,
-            mediaSize,
-            queryClient: AppRoot_1.queryClient,
-            standalone }, date_functions_1.dateFunctions), math_function_1.mathFunctions), { 
-            // --- File Utilities
-            formatFileSizeInBytes: misc_1.formatFileSizeInBytes,
-            getFileExtension: misc_1.getFileExtension,
-            // --- Navigation-related
-            navigate,
-            routerBaseName,
-            // --- Notifications and dialogs
-            confirm,
-            signError,
-            toast: react_hot_toast_1.default,
-            // --- Theme-related
-            activeThemeId,
-            activeThemeTone,
-            availableThemeIds, setTheme: setActiveThemeId, setThemeTone: setActiveThemeTone, toggleThemeTone,
-            // --- User-related
-            loggedInUser,
-            setLoggedInUser,
-            delay: misc_1.delay,
-            DateUtils,
-            embed,
-            apiInterceptorContext, getPropertyByPath: lodash_es_1.get }), misc_utils_1.miscellaneousUtils);
-        return ret;
-    }, [
-        Actions,
-        activeThemeId,
-        activeThemeTone,
-        apiInterceptorContext,
-        availableThemeIds,
-        confirm,
-        debugEnabled,
-        decorateComponentsWithTestId,
-        embed,
-        environment,
-        appGlobals,
-        loggedInUser,
-        mediaSize,
-        navigate,
-        routerBaseName,
-        setActiveThemeId,
-        setActiveThemeTone,
-        toggleThemeTone,
-        standalone,
-    ]);
-    // --- We prepare the helper infrastructure for the `AppState` component, which manages
-    // --- app-wide state using buckets (state sections).
-    const [appState, setAppState] = (0, react_1.useState)(constants_1.EMPTY_OBJECT);
-    const registerAppState = (0, react_1.useCallback)((bucket, initialValue) => {
-        setAppState((prev) => {
-            return Object.assign(Object.assign({}, prev), { [bucket]: initialValue });
-        });
-    }, []);
-    const update = (0, react_1.useCallback)((bucket, patch) => {
-        setAppState((prev) => {
-            return Object.assign(Object.assign({}, prev), { [bucket]: Object.assign(Object.assign({}, (prev[bucket] || {})), patch) });
-        });
-    }, []);
-    const appStateContextValue = (0, react_1.useMemo)(() => {
-        return {
-            registerAppState,
-            appState,
-            update,
-        };
-    }, [appState, registerAppState, update]);
-    const memoedVarsRef = (0, react_1.useRef)(new Map());
-    const renderedRoot = (0, renderChild_1.renderChild)({
-        node: rootContainer,
-        state: constants_1.EMPTY_OBJECT,
-        dispatch: constants_1.noop,
-        appContext: undefined,
-        lookupAction: constants_1.noop,
-        lookupSyncCallback: constants_1.noop,
-        registerComponentApi: constants_1.noop,
-        renderChild: constants_1.noop,
-        statePartChanged: constants_1.noop,
-        cleanup: constants_1.noop,
-        memoedVarsRef,
-    });
-    return ((0, jsx_runtime_1.jsx)(AppContext_1.AppContext.Provider, { value: appContextValue, children: (0, jsx_runtime_1.jsx)(AppStateContext_1.AppStateContext.Provider, { value: appStateContextValue, children: renderedRoot }) }));
-}
-// --- We pass these functions to the global app context
-const DateUtils = {
-    differenceInMinutes: (date1, date2) => {
-        return (0, date_fns_1.differenceInMinutes)(new Date(date1), new Date(date2));
-    },
-    isSameDay: (dateLeft, dateRight) => {
-        // console.log("IS SAME DAY", dateLeft, dateRight);
-        if (!dateLeft || !dateRight) {
-            return false;
-        }
-        return (0, date_fns_1.isSameDay)(new Date(dateLeft), new Date(dateRight));
-    },
-    isToday: (date) => {
-        return (0, date_fns_1.isToday)(new Date(date));
-    },
-    isThisYear: (date) => {
-        return (0, date_fns_1.isThisYear)(new Date(date));
-    },
-};
-// --- We pass this funtion to the global app context
-function signError(error) {
-    react_hot_toast_1.default.error(typeof error === "string" ? error : error.message || "Something went wrong");
-}

package/dist/scripts/src/components-core/rendering/AppRoot.js

@@ -1,55 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.queryClient = void 0;
-exports.AppRoot = AppRoot;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const react_query_1 = require("@tanstack/react-query");
-const immer_1 = require("immer");
-const reportEngineError_1 = require("@components-core/reportEngineError");
-const ComponentProvider_1 = require("@components/ComponentProvider");
-const DebugViewProvider_1 = require("../DebugViewProvider");
-const AppWrapper_1 = require("./AppWrapper");
-// --- We want to enable the produce method of `immer` on Map objects
-(0, immer_1.enableMapSet)();
-// --- We use this object in the app context to represent the `QlientQuery`
-// --- of the react-query package.
-exports.queryClient = new react_query_1.QueryClient({
-    defaultOptions: {
-        queries: {
-            refetchOnWindowFocus: false,
-        },
-    },
-});
-/**
- * This component is responsible for running a pre-compiled xmlui app. It
- * receives the internal representation of the app markup and code (coming
- * from either code-behind files or inlined markup expressions) and executes
- * the app accordingly.
- */
-function AppRoot({ apiInterceptor, contributes, node, decorateComponentsWithTestId, debugEnabled, defaultTheme, defaultTone, resources, globalProps, standalone, trackContainerHeight, routerBaseName, previewMode, resourceMap, sources, extensionManager, }) {
-    // --- Make sure, the root node is wrapped in a `Theme` component. Also, 
-    // --- the root node must be wrapped in a `Container` component managing 
-    // --- the app's top-level state.
-    const rootNode = (0, react_1.useMemo)(() => {
-        const themedRoot = node.type === "Theme"
-            ? Object.assign(Object.assign({}, node), { props: Object.assign(Object.assign({}, node.props), { root: true }) }) : {
-            type: "Theme",
-            props: {
-                root: true,
-            },
-            children: [node],
-        };
-        return {
-            type: "Container",
-            uid: "root",
-            children: [themedRoot],
-            uses: [],
-        };
-    }, [node]);
-    // --- Start with an error-free state
-    (0, reportEngineError_1.resetErrors)();
-    // --- Render the app providing a component registry (in which the engine finds a 
-    // --- component definition by its name). Ensure the app has a context for debugging.
-    return ((0, jsx_runtime_1.jsx)(ComponentProvider_1.ComponentProvider, { contributes: contributes, extensionManager: extensionManager, children: (0, jsx_runtime_1.jsx)(DebugViewProvider_1.DebugViewProvider, { debugConfig: globalProps === null || globalProps === void 0 ? void 0 : globalProps.debug, children: (0, jsx_runtime_1.jsx)(AppWrapper_1.AppWrapper, { resourceMap: resourceMap, apiInterceptor: apiInterceptor, node: rootNode, contributes: contributes, resources: resources, routerBaseName: routerBaseName, decorateComponentsWithTestId: decorateComponentsWithTestId, debugEnabled: debugEnabled, defaultTheme: defaultTheme, defaultTone: defaultTone, globalProps: globalProps, standalone: standalone, trackContainerHeight: trackContainerHeight, previewMode: previewMode, sources: sources }) }) }));
-}