@nu-art/thunderstorm-frontend 0.400.5

package/modules/ModuleFE_Thunderstorm.js

@@ -0,0 +1,122 @@
+/*
+ * Thunderstorm is a full web app framework!
+ *
+ * Typescript & Express backend infrastructure that natively runs on firebase function
+ * Typescript & React frontend infrastructure
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { _keys, BadImplementationException, Module } from '@nu-art/ts-common';
+import { ModuleFE_Toaster } from '../component-modules/ModuleFE_Toaster.js';
+import { composeURL } from './ModuleFE_BrowserHistory.js';
+import { HttpMethod } from '@nu-art/thunderstorm-shared';
+import { base64ToBlob } from '../utils/tools.js';
+import { ModuleFE_XHR } from './http/ModuleFE_XHR.js';
+import { dispatch_onClearWebsiteData } from './clearWebsiteDataDispatcher.js';
+class ModuleFE_Thunderstorm_Class extends Module {
+    constructor() {
+        super();
+        this.setDefaultConfig({ appName: 'Thunderstorm-WebApp' });
+    }
+    init() {
+        this.setAppName(this.config.appName);
+        this.setChromeThemeColor(this.config.themeColor);
+    }
+    setAppName(appName) {
+        document.title = appName;
+    }
+    setChromeThemeColor(themeColor) {
+        let themeTag = document.head.querySelector('meta[name="theme-color"]');
+        if (!themeTag) {
+            themeTag = document.createElement('meta');
+            themeTag.name = 'theme-color';
+            document.getElementsByTagName('head')[0].appendChild(themeTag);
+        }
+        themeTag.setAttribute('content', themeColor);
+    }
+    async clearWebsiteData() {
+        this.logInfo('Cleaning IDB called.');
+        return await dispatch_onClearWebsiteData.dispatchModuleAsync();
+    }
+    async copyToClipboard(toCopy, customSuccessMessage) {
+        try {
+            await navigator.clipboard.writeText(toCopy);
+            ModuleFE_Toaster.toastInfo(customSuccessMessage ?? `Copied to Clipboard:\n"${toCopy}"`);
+        }
+        catch (e) {
+            ModuleFE_Toaster.toastError(`Failed to copy to Clipboard:\n"${toCopy}"`);
+        }
+    }
+    async readFileContent(file) {
+        const fullUrl = URL.createObjectURL(file);
+        const content = ModuleFE_XHR.createRequest({ method: HttpMethod.GET, fullUrl, path: '' }).executeSync();
+        URL.revokeObjectURL(fullUrl);
+        return content;
+    }
+    async writeToClipboard(imageAsBase64, contentType = 'image/png') {
+        try {
+            // const clipboardItem = new ClipboardItem({'image/png': imageAsBase64});
+            const clipboardItem = new ClipboardItem({ contentType: await base64ToBlob(imageAsBase64) });
+            await navigator.clipboard.write([clipboardItem]);
+            // TODO: Render Blob in toast
+            ModuleFE_Toaster.toastInfo(`Copied image Clipboard`);
+        }
+        catch (error) {
+            ModuleFE_Toaster.toastError(`Failed to copy image to Clipboard`);
+        }
+    }
+    getAppName() {
+        return this.config.appName;
+    }
+    openUrl(url, target) {
+        if (!window)
+            throw new BadImplementationException('no window in vm context');
+        let urlObj = url;
+        if (typeof urlObj === 'string')
+            urlObj = { url: urlObj };
+        const params = urlObj.params || {};
+        const calculatedParams = _keys(params || {}).reduce((toRet, key) => {
+            const param = params[key];
+            if (typeof param === 'function') {
+                const value = param?.();
+                if (value)
+                    toRet[key] = value;
+            }
+            else
+                toRet[key] = param;
+            return toRet;
+        }, {});
+        window.open(composeURL(urlObj.url, calculatedParams), target || '_self');
+    }
+    downloadFile(props) {
+        if (!document)
+            return;
+        const element = document.createElement('a');
+        if (props.content) {
+            let content;
+            if (typeof props.content === 'string')
+                content = encodeURIComponent(props.content);
+            else
+                content = URL.createObjectURL(props.content);
+            element.setAttribute('href', `data:${props.mimeType || 'text/text'};charset=${props.charset || 'utf-8'},${content}`);
+        }
+        else {
+            element.setAttribute('href', props.url);
+        }
+        element.setAttribute('download', `${props.fileName}`);
+        element.click();
+    }
+}
+export const ModuleFE_Thunderstorm = new ModuleFE_Thunderstorm_Class();

package/modules/ModuleFE_Utils/ModuleFE_Utils.d.ts

@@ -0,0 +1,29 @@
+import { DB_Object, DBProto, Module } from '@nu-art/ts-common';
+import React from 'react';
+type Config = {};
+interface BaseRendererParam<K extends string, P> {
+    key: K;
+    props: P;
+}
+type RendererParams<T extends BaseRendererParam<string, any>> = {
+    [K in T['key']]: Extract<T, {
+        key: K;
+    }>['props'];
+};
+type AssertionCallbacksMapper<T extends DB_Object> = {
+    [key: string]: (item: T) => any;
+};
+declare class ModuleFE_Utils_Class<T extends BaseRendererParam<string, any>> extends Module<Config> {
+    renderers: Partial<{
+        [K in T['key']]: React.ComponentType<any>;
+    }>;
+    processors: Partial<AssertionCallbacksMapper<any>>;
+    registerRenderer<K extends string, P>(key: K, renderer: React.ComponentType<P>): ModuleFE_Utils_Class<BaseRendererParam<K, P>>;
+    removeRenderer<K extends T['key']>(key: K): void;
+    getRenderer<K extends T['key']>(key: K, props: RendererParams<T>[K]): React.ComponentType<RendererParams<T>[K]>;
+    registerProcessors<K extends string, T extends DBProto<any>>(key: K, assertionCallback: AssertionCallbacksMapper<T['dbType']>[K]): any;
+    removeProcessors<K extends T['key']>(key: K): void;
+    getProcessor<T extends DBProto<any>, K extends keyof AssertionCallbacksMapper<T['dbType']>>(key: K): AssertionCallbacksMapper<T['dbType']>[K];
+}
+export declare const ModuleFE_Utils: ModuleFE_Utils_Class<BaseRendererParam<string, any>>;
+export {};

package/modules/ModuleFE_Utils/ModuleFE_Utils.js

@@ -0,0 +1,43 @@
+import { Module } from '@nu-art/ts-common';
+//TODO: re think about the typing in this class its far from perfect
+class ModuleFE_Utils_Class extends Module {
+    renderers = {};
+    processors = {};
+    // renderers
+    // Method to register a renderer
+    registerRenderer(key, renderer) {
+        this.renderers[key] = renderer;
+        return this;
+    }
+    // Method to remove a renderer
+    removeRenderer(key) {
+        delete this.renderers[key];
+    }
+    // Method to get a renderer by key and pass props
+    getRenderer(key, props) {
+        const renderer = this.renderers[key];
+        if (!renderer) {
+            throw new Error(`Renderer not found for key: ${key}`);
+        }
+        return renderer;
+    }
+    // assertion callbacks
+    // Method to register a renderer
+    registerProcessors(key, assertionCallback) {
+        this.processors[key] = assertionCallback;
+        return this;
+    }
+    // Method to remove a renderer
+    removeProcessors(key) {
+        delete this.processors[key];
+    }
+    // Method to get a renderer by key and pass props
+    getProcessor(key) {
+        const callback = this.processors[key];
+        if (!callback) {
+            throw new Error(`assertion callback not found for key: ${key}`);
+        }
+        return callback;
+    }
+}
+export const ModuleFE_Utils = new ModuleFE_Utils_Class();

package/modules/ModuleFE_Window.d.ts

@@ -0,0 +1,19 @@
+import { Module } from '@nu-art/ts-common';
+type Config = {};
+export interface OnWindowResized {
+    __onWindowResized(): void;
+}
+export interface OnWindowReceivedFocus {
+    __onWindowReceivedFocus(): void;
+}
+export interface OnWindowLostFocus {
+    __onWindowLostFocus(): void;
+}
+export declare class ModuleFE_Window_Class extends Module<Config> {
+    protected init(): void;
+    private onWindowResized;
+    private onWindowReceivedFocus;
+    private onWindowLostFocus;
+}
+export declare const ModuleFE_Window: ModuleFE_Window_Class;
+export {};

package/modules/ModuleFE_Window.js

@@ -0,0 +1,42 @@
+/*
+ * Thunderstorm is a full web app framework!
+ *
+ * Typescript & Express backend infrastructure that natively runs on firebase function
+ * Typescript & React frontend infrastructure
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { Module, } from '@nu-art/ts-common';
+import { ThunderDispatcher } from '../core/thunder-dispatcher.js';
+const dispatch_WindowResized = new ThunderDispatcher('__onWindowResized');
+const dispatch_WindowReceivedFocus = new ThunderDispatcher('__onWindowReceivedFocus');
+const dispatch_WindowLostFocus = new ThunderDispatcher('__onWindowLostFocus');
+export class ModuleFE_Window_Class extends Module {
+    init() {
+        window.addEventListener('resize', this.onWindowResized);
+        window.addEventListener('focus', this.onWindowReceivedFocus);
+        window.addEventListener('blur', this.onWindowLostFocus);
+    }
+    onWindowResized = () => {
+        dispatch_WindowResized.dispatchAll();
+    };
+    onWindowReceivedFocus = () => {
+        dispatch_WindowReceivedFocus.dispatchAll();
+    };
+    onWindowLostFocus = () => {
+        dispatch_WindowLostFocus.dispatchAll();
+    };
+}
+export const ModuleFE_Window = new ModuleFE_Window_Class();

package/modules/ModuleFE_WindowMessenger.d.ts

@@ -0,0 +1,62 @@
+import { Logger, Module } from '@nu-art/ts-common';
+export declare const Key_UndefinedMessage = "undefined-message";
+/**
+ * Subset of interface Window, which contains postMessage functions
+ */
+interface Messagable {
+    postMessage(message: any, targetOrigin: string, transfer?: Transferable[]): void;
+    postMessage(message: any, options?: WindowPostMessageOptions): void;
+}
+export type Message = {
+    key: string;
+};
+declare class ModuleFE_WindowMessenger_Class extends Module {
+    readonly receivers: BaseReceiver<any>[];
+    private listener?;
+    addReceiver(receiver: BaseReceiver<any>): void;
+    removeReceiver(receiver: BaseReceiver<any>): void;
+    sendMessage<T extends Message>(message: T, target: Messagable): void;
+    createMessenger<T extends Message>(target: Messagable): Messenger<T>;
+    createReceiver<T extends Message>(origin?: string, transformer?: (data: any) => T[]): Receiver<T>;
+    createRawReceiver(execute: (message: any) => void, origin?: string): RawReceiver;
+}
+export declare const ModuleFE_WindowMessenger: ModuleFE_WindowMessenger_Class;
+export declare class Messenger<T extends Message> {
+    readonly target: Messagable;
+    constructor(target: Messagable);
+    sendMessage(message: T): void;
+}
+export declare abstract class BaseReceiver<T = any> extends Logger {
+    readonly origin: string;
+    private readonly regex;
+    private filter;
+    constructor(origin?: string);
+    mount(): this;
+    unmount(): this;
+    readonly execute: (origin: string, message: T) => void;
+    abstract executeImpl(message: T): void;
+    setFilter(filter: (message: any) => boolean): this;
+}
+export declare class RawReceiver extends BaseReceiver {
+    readonly execute: (message: any) => void;
+    constructor(execute: (message: any) => void, origin?: string);
+    executeImpl(message: any): void;
+}
+/**
+ * Need to add a processor per each key prop's value that can be returned in the transformer output.
+ */
+export declare class Receiver<T extends Message> extends BaseReceiver {
+    private readonly messageProcessorMap;
+    private readonly transform;
+    private defaultProcessor?;
+    /**
+     *
+     * @param origin window.origin
+     * @param transform Receives the MessageEvent and needs to transform it into an array of objects, each having prop "key". To each potential "key", you need to add an appropriate processor.
+     */
+    constructor(origin?: string, transform?: (data: any) => T[]);
+    setDefaultProcessor(processor: (transformedMessage: T, message: any) => void): this;
+    addProcessor<K extends T>(key: K['key'], processor: (message: K) => void): this;
+    executeImpl(message: any): void;
+}
+export {};

package/modules/ModuleFE_WindowMessenger.js

@@ -0,0 +1,128 @@
+import { Logger, Module, removeItemFromArray } from '@nu-art/ts-common';
+export const Key_UndefinedMessage = 'undefined-message';
+class ModuleFE_WindowMessenger_Class extends Module {
+    //######################### Static #########################
+    receivers = [];
+    listener;
+    //######################### Life Cycle #########################
+    addReceiver(receiver) {
+        if (this.receivers.includes(receiver))
+            return;
+        this.receivers.push(receiver);
+        if (this.receivers.length > 0 && !this.listener)
+            window.addEventListener('message', this.listener = (e) => {
+                const { data, origin } = e;
+                this.receivers.forEach(receiver => receiver.execute(origin, data));
+            });
+    }
+    removeReceiver(receiver) {
+        removeItemFromArray(this.receivers, receiver);
+        if (this.receivers.length === 0) {
+            window.removeEventListener('message', this.listener);
+            delete this.listener;
+        }
+    }
+    sendMessage(message, target) {
+        target.postMessage(message, '*');
+    }
+    createMessenger(target) {
+        return new Messenger(target);
+    }
+    createReceiver(origin, transformer) {
+        return new Receiver(origin, transformer);
+    }
+    createRawReceiver(execute, origin) {
+        return new RawReceiver(execute, origin);
+    }
+}
+export const ModuleFE_WindowMessenger = new ModuleFE_WindowMessenger_Class();
+//Message Sender
+export class Messenger {
+    target;
+    constructor(target) {
+        this.target = target;
+    }
+    sendMessage(message) {
+        ModuleFE_WindowMessenger.sendMessage(message, this.target);
+    }
+}
+//Message Receiver
+export class BaseReceiver extends Logger {
+    origin;
+    regex;
+    filter = (message) => true;
+    constructor(origin = '.*') {
+        super();
+        this.setTag(`Receiver (${origin})`);
+        this.origin = origin;
+        this.regex = new RegExp(origin);
+    }
+    mount() {
+        ModuleFE_WindowMessenger.addReceiver(this);
+        return this;
+    }
+    unmount() {
+        ModuleFE_WindowMessenger.removeReceiver(this);
+        return this;
+    }
+    execute = (origin, message) => {
+        if (!this.regex.test(origin))
+            return;
+        if (!this.filter(message))
+            return;
+        this.executeImpl(message);
+    };
+    setFilter(filter) {
+        this.filter = filter;
+        return this;
+    }
+}
+export class RawReceiver extends BaseReceiver {
+    execute;
+    constructor(execute, origin = '.*') {
+        super(origin);
+        this.execute = execute;
+    }
+    executeImpl(message) {
+        this.execute(message);
+    }
+}
+/**
+ * Need to add a processor per each key prop's value that can be returned in the transformer output.
+ */
+export class Receiver extends BaseReceiver {
+    messageProcessorMap = {};
+    transform; // Receives one window message, returns array with 1 or more transformed messages., each message needs prop 'key' with a matching processor added.
+    defaultProcessor;
+    /**
+     *
+     * @param origin window.origin
+     * @param transform Receives the MessageEvent and needs to transform it into an array of objects, each having prop "key". To each potential "key", you need to add an appropriate processor.
+     */
+    constructor(origin = '.*', transform = data => [data]) {
+        super();
+        this.setTag(`Receiver (${origin})`);
+        this.transform = transform;
+    }
+    setDefaultProcessor(processor) {
+        this.defaultProcessor = processor;
+        return this;
+    }
+    addProcessor(key, processor) {
+        this.messageProcessorMap[key] = processor;
+        return this;
+    }
+    executeImpl(message) {
+        const transformedMessages = this.transform(message);
+        transformedMessages.forEach(_transformedMessage => {
+            const processor = this.messageProcessorMap[_transformedMessage.key];
+            if (processor) {
+                processor(_transformedMessage);
+                return;
+            }
+            this.logDebug(`No message processor defined for key ${message.key}`);
+            this.defaultProcessor?.(_transformedMessage, message);
+            return;
+        });
+    }
+}

package/modules/action-processor/ModuleFE_ActionProcessor.d.ts

@@ -0,0 +1,9 @@
+import { Module } from '@nu-art/ts-common';
+import { ApiDefCaller } from '../../shared.js';
+import { ApiStruct_ActionProcessing } from '@nu-art/thunderstorm-shared/action-processor/index';
+declare class ModuleFE_ActionProcessor_Class extends Module {
+    readonly vv1: ApiDefCaller<ApiStruct_ActionProcessing>['vv1'];
+    constructor();
+}
+export declare const ModuleFE_ActionProcessor: ModuleFE_ActionProcessor_Class;
+export {};

package/modules/action-processor/ModuleFE_ActionProcessor.js

@@ -0,0 +1,14 @@
+import { Module } from '@nu-art/ts-common';
+import { ApiDef_ActionProcessing } from '@nu-art/thunderstorm-shared/action-processor/index';
+import { apiWithBody, apiWithQuery } from '../../core/typed-api.js';
+class ModuleFE_ActionProcessor_Class extends Module {
+    vv1;
+    constructor() {
+        super();
+        this.vv1 = {
+            execute: apiWithBody(ApiDef_ActionProcessing.vv1.execute),
+            list: apiWithQuery(ApiDef_ActionProcessing.vv1.list),
+        };
+    }
+}
+export const ModuleFE_ActionProcessor = new ModuleFE_ActionProcessor_Class();

package/modules/archiving/ModuleFE_Archiving.d.ts

@@ -0,0 +1,8 @@
+import { Module } from '@nu-art/ts-common';
+import { ApiDefCaller, ApiStruct_Archiving } from '@nu-art/thunderstorm-shared';
+declare class ModuleFE_Archiving_Class extends Module {
+    readonly vv1: ApiDefCaller<ApiStruct_Archiving>['vv1'];
+    constructor();
+}
+export declare const ModuleFE_Archiving: ModuleFE_Archiving_Class;
+export {};

package/modules/archiving/ModuleFE_Archiving.js

@@ -0,0 +1,15 @@
+import { Module } from '@nu-art/ts-common';
+import { ApiDef_Archiving } from '@nu-art/thunderstorm-shared';
+import { apiWithBody, apiWithQuery } from '../../core/typed-api.js';
+class ModuleFE_Archiving_Class extends Module {
+    vv1;
+    constructor() {
+        super();
+        this.vv1 = {
+            hardDeleteAll: apiWithQuery(ApiDef_Archiving.vv1.hardDeleteAll),
+            hardDeleteUnique: apiWithBody(ApiDef_Archiving.vv1.hardDeleteUnique),
+            getDocumentHistory: apiWithQuery(ApiDef_Archiving.vv1.getDocumentHistory)
+        };
+    }
+}
+export const ModuleFE_Archiving = new ModuleFE_Archiving_Class();

package/modules/clearWebsiteDataDispatcher.d.ts

@@ -0,0 +1,5 @@
+import { ThunderDispatcher } from '../core/thunder-dispatcher.js';
+export interface OnClearWebsiteData {
+    __onClearWebsiteData(): void;
+}
+export declare const dispatch_onClearWebsiteData: ThunderDispatcher<OnClearWebsiteData, "__onClearWebsiteData", [], void>;

package/modules/clearWebsiteDataDispatcher.js

@@ -0,0 +1,2 @@
+import { ThunderDispatcher } from '../core/thunder-dispatcher.js';
+export const dispatch_onClearWebsiteData = new ThunderDispatcher('__onClearWebsiteData');

package/modules/component-loader/ReactEntryComponentInjector.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { OnRequestListener } from '@nu-art/thunderstorm-shared/request-types';
+export type LoaderProps = {
+    progress: number;
+};
+type Props = {
+    loader?: React.ElementType<LoaderProps>;
+    src: string;
+};
+type State = {
+    loading: boolean;
+    progress: number;
+};
+export declare class ReactEntryComponentInjector extends React.Component<Props, State> implements OnRequestListener {
+    private myRef;
+    constructor(props: Props);
+    __onRequestCompleted: (key: string, success: boolean) => void;
+    private injectComponent;
+    componentDidMount(): void;
+    render(): import("react/jsx-runtime").JSX.Element;
+    private extracted;
+}
+export {};

package/modules/component-loader/ReactEntryComponentInjector.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*
+ * Thunderstorm is a full web app framework!
+ *
+ * Typescript & Express backend infrastructure that natively runs on firebase function
+ * Typescript & React frontend infrastructure
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import * as React from 'react';
+import { EntryComponentLoadingModule } from './entry-component-loading-module.js';
+export class ReactEntryComponentInjector extends React.Component {
+    myRef = React.createRef();
+    constructor(props) {
+        super(props);
+        this.state = { loading: false, progress: 0 };
+    }
+    __onRequestCompleted = (key, success) => {
+        if (key !== this.props.src)
+            return;
+        if (!success)
+            // Need to add error handling here...
+            return;
+        this.injectComponent(EntryComponentLoadingModule.getNode(key));
+    };
+    injectComponent(node) {
+        this.myRef.current?.appendChild(node);
+        this.setState({ loading: false });
+    }
+    componentDidMount() {
+        const src = this.props.src;
+        const node = EntryComponentLoadingModule.getNode(src);
+        if (node)
+            return this.injectComponent(node);
+        EntryComponentLoadingModule.loadScript(src, (progress) => this.setState({ progress }));
+        this.setState({ loading: true });
+    }
+    render() {
+        return _jsx("div", { ref: this.myRef, id: this.props.src, children: this.extracted() });
+    }
+    extracted() {
+        const Loader = this.props.loader;
+        if (Loader)
+            return _jsx(Loader, { progress: this.state.progress });
+        return _jsxs("div", { style: { width: '100%', height: '100%' }, children: [this.state.progress, " %"] });
+    }
+}

package/modules/component-loader/entry-component-loading-module.d.ts

@@ -0,0 +1,7 @@
+import { Module } from '@nu-art/ts-common';
+export declare class PageLoadingModule_Class extends Module<{}> {
+    private readonly injected;
+    loadScript(src: string, progressListener: (progress: number) => void): void;
+    getNode(src: string): HTMLScriptElement;
+}
+export declare const EntryComponentLoadingModule: PageLoadingModule_Class;

package/modules/component-loader/entry-component-loading-module.js

@@ -0,0 +1,52 @@
+/*
+ * Thunderstorm is a full web app framework!
+ *
+ * Typescript & Express backend infrastructure that natively runs on firebase function
+ * Typescript & React frontend infrastructure
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { Module } from '@nu-art/ts-common';
+// noinspection TypeScriptPreferShortImport
+import { ModuleFE_XHR } from '../http/ModuleFE_XHR.js';
+import { ModuleFE_BrowserHistory } from '../ModuleFE_BrowserHistory.js';
+import { HttpMethod } from '@nu-art/thunderstorm-shared';
+export class PageLoadingModule_Class extends Module {
+    injected = {};
+    loadScript(src, progressListener) {
+        const apiDef = {
+            method: HttpMethod.GET,
+            baseUrl: ModuleFE_BrowserHistory.getOrigin(),
+            path: src
+        };
+        ModuleFE_XHR
+            .createRequest(apiDef)
+            .setOnProgressListener((ev) => {
+            const progress = ev.loaded / ev.total;
+            progressListener(progress);
+        })
+            .execute(response => {
+            const divElement = document.createElement('script');
+            // divElement.innerHTML = response;
+            divElement.id = src;
+            divElement.async = true;
+            this.injected[src] = divElement;
+        });
+    }
+    getNode(src) {
+        return this.injected[src];
+    }
+}
+export const EntryComponentLoadingModule = new PageLoadingModule_Class();

package/modules/component-loader/index.d.ts

@@ -0,0 +1,2 @@
+export * from './entry-component-loading-module.js';
+export * from './ReactEntryComponentInjector.js';

package/modules/component-loader/index.js

@@ -0,0 +1,2 @@
+export * from './entry-component-loading-module.js';
+export * from './ReactEntryComponentInjector.js';