@common-stack/frontend-stack-react 6.0.1-alpha.3 → 6.0.1-alpha.5

package/lib/entries/antui/components/ErrorBoundary.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare function ErrorBoundary(): React.JSX.Element;

package/lib/entries/antui/components/ErrorBoundary.js

@@ -0,0 +1,12 @@
+import*as React from'react';import {Error500}from'@admin-layout/ant-ui';import {useRouteError,isRouteErrorResponse}from'@remix-run/react';function ErrorBoundary() {
+    const error = useRouteError();
+    if (isRouteErrorResponse(error)) {
+        return React.createElement(Error500, { title: `Route Error: ${error.statusText}`, status: error.status, data: error.data });
+    }
+    else if (error instanceof Error) {
+        return React.createElement(Error500, { title: error.message, status: "500", data: error.stack });
+    }
+    else {
+        return React.createElement(Error500, { title: "Unknown Error", status: "500", data: error });
+    }
+}export{ErrorBoundary};

package/lib/entries/antui/components/ServerError.d.ts

@@ -0,0 +1,4 @@
+declare class ServerError extends Error {
+    constructor(error: any);
+}
+export { ServerError };

package/lib/entries/antui/components/ServerError.js

@@ -0,0 +1,9 @@
+class ServerError extends Error {
+    constructor(error) {
+        super();
+        for (const key of Object.getOwnPropertyNames(error)) {
+            this[key] = error[key];
+        }
+        this.name = 'ServerError';
+    }
+}export{ServerError};

package/lib/entries/antui/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ErrorBoundary';
+export * from './ServerError';

package/lib/entries/antui/components/index.js

@@ -0,0 +1 @@
+export{ErrorBoundary}from'./ErrorBoundary.js';export{ServerError}from'./ServerError.js';

package/lib/entries/antui/entry.client.d.ts

@@ -0,0 +1 @@
+import 'reflect-metadata';

package/lib/entries/antui/entry.client.js

@@ -0,0 +1,51 @@
+import*as React from'react';import {startTransition,StrictMode}from'react';import'reflect-metadata';import {RemixBrowser}from'@remix-run/react';import {hydrateRoot}from'react-dom/client';import {createCache,StyleProvider}from'@ant-design/cssinjs';import {ApolloProvider}from'@apollo/client/index.js';import {removeUniversalPortals,SlotFillProvider}from'@common-stack/components-pro';import {InversifyProvider}from'@common-stack/client-react';import {Provider}from'react-redux';import {PersistGate}from'redux-persist/integration/react';import {persistStore}from'redux-persist';import {CacheProvider}from'@emotion/react';import i18next from'i18next';import {initReactI18next,I18nextProvider}from'react-i18next';import LanguageDetector from'i18next-browser-languagedetector';import Backend from'i18next-http-backend';import {getInitialNamespaces}from'remix-i18next/client';import {createReduxStore}from'@app/frontend-stack-react/config/redux-config.js';import {createClientContainer}from'@app/frontend-stack-react/config/client.service';import clientModules from'@app/frontend-stack-react/modules.js';import createEmotionCache from'@app/frontend-stack-react/entries/common/createEmotionCache.js';import config from'@app/cde-webconfig.json';/**
+ * By default, Remix will handle hydrating your app on the client for you.
+ * You are free to delete this file if you'd like to, but if you ever want it revealed again, you can run `npx remix reveal` ✨
+ * For more information, see https://remix.run/file-conventions/entry.client
+ */
+const { apolloClient: client, container, serviceFunc } = createClientContainer();
+const { store } = createReduxStore(client, serviceFunc(), container);
+const persistor = persistStore(store);
+const antCache = createCache();
+const cache = createEmotionCache();
+window.__remixStore = store;
+removeUniversalPortals(window.__SLOT_FILLS__ || []);
+async function hydrate() {
+    if (!i18next.isInitialized && config.i18n.enabled) {
+        await i18next
+            .use(initReactI18next)
+            .use(LanguageDetector)
+            .use(Backend)
+            .init({
+            fallbackLng: config.i18n.fallbackLng,
+            defaultNS: config.i18n.defaultNS,
+            react: config.i18n.react,
+            supportedLngs: config.i18n.supportedLngs,
+            backend: config.i18n.backend,
+            ns: getInitialNamespaces(),
+            detection: {
+                order: ['htmlTag'],
+                caches: [],
+            },
+        });
+    }
+    startTransition(() => {
+        hydrateRoot(document, (React.createElement(I18nextProvider, { i18n: i18next },
+            React.createElement(StrictMode, null,
+                React.createElement(CacheProvider, { value: cache },
+                    React.createElement(StyleProvider, { cache: antCache },
+                        React.createElement(Provider, { store: store },
+                            React.createElement(SlotFillProvider, null,
+                                React.createElement(InversifyProvider, { container: container, modules: clientModules },
+                                    React.createElement(PersistGate, { loading: null, persistor: persistor }, () => (React.createElement(ApolloProvider, { client: client },
+                                        React.createElement(RemixBrowser, null)))))))))))));
+    });
+}
+if (window.requestIdleCallback) {
+    window.requestIdleCallback(hydrate);
+}
+else {
+    // Safari doesn't support requestIdleCallback
+    // https://caniuse.com/requestidlecallback
+    window.setTimeout(hydrate, 1);
+}

package/lib/entries/antui/entry.server.d.ts

@@ -0,0 +1,3 @@
+import type { EntryContext } from '@remix-run/node';
+import type { IAppLoadContext } from '@common-stack/client-core';
+export default function handleRequest(request: Request, responseStatusCode: number, responseHeaders: Headers, remixContext: EntryContext, loadContext: IAppLoadContext): Promise<unknown>;

package/lib/entries/antui/entry.server.js

@@ -0,0 +1,152 @@
+import*as React from'react';import {PassThrough,Transform}from'node:stream';import {createReadableStreamFromReadable}from'@remix-run/node';import {RemixServer}from'@remix-run/react';import {isbot}from'isbot';import {ApolloProvider}from'@apollo/client/index.js';import {SlotFillProvider}from'@common-stack/components-pro';import {InversifyProvider}from'@common-stack/client-react';import {renderToPipeableStream}from'react-dom/server';import {Provider}from'react-redux';import {LOCATION_CHANGE}from'@common-stack/remix-router-redux';import serialize from'serialize-javascript';import {createCache,StyleProvider,extractStyle}from'@ant-design/cssinjs';import {CacheProvider}from'@emotion/react';import {renderStylesToNodeStream}from'@emotion/server';import {createInstance}from'i18next';import {initReactI18next,I18nextProvider}from'react-i18next';import Backend from'i18next-fs-backend';import {resolve}from'node:path';import {i18nextInstance}from'@app/frontend-stack-react/i18n-localization/i18next.server.js';import config from'@app/cde-webconfig.json';import createEmotionCache from'@app/frontend-stack-react/entries/common/createEmotionCache';/**
+ * By default, Remix will handle generating the HTTP Response for you.
+ * You are free to delete this file if you'd like to, but if you ever want it revealed again, you can run `npx remix reveal` ✨
+ * For more information, see https://remix.run/file-conventions/entry.server
+ */
+global.__CLIENT__ = false;
+global.__SERVER__ = true;
+const ABORT_DELAY = 5_000;
+const antdCache = createCache();
+const cache = createEmotionCache();
+class ConstantsTransform extends Transform {
+    _fills;
+    _apolloState;
+    _reduxState;
+    _styleSheet;
+    constructor(fills, apolloState, reduxState, styleSheet) {
+        super();
+        this._fills = fills;
+        this._apolloState = apolloState;
+        this._reduxState = reduxState;
+        this._styleSheet = styleSheet;
+    }
+    _transform(chunk, encoding, callback) {
+        let transformedChunk = chunk.toString();
+        if (transformedChunk.includes('[__APOLLO_STATE__]')) {
+            transformedChunk = transformedChunk.replace('[__APOLLO_STATE__]', serialize(this._apolloState, { isJSON: true }));
+        }
+        if (transformedChunk.includes('[__PRELOADED_STATE__]')) {
+            transformedChunk = transformedChunk.replace('[__PRELOADED_STATE__]', serialize(this._reduxState, { isJSON: true }));
+        }
+        if (transformedChunk.includes('[__SLOT_FILLS__]')) {
+            transformedChunk = transformedChunk.replace('[__SLOT_FILLS__]', serialize(this._fills, { isJSON: true }));
+        }
+        if (transformedChunk.includes('[__STYLESHEET__]')) {
+            transformedChunk = transformedChunk.replace('[__STYLESHEET__]', this._styleSheet);
+        }
+        callback(null, transformedChunk);
+    }
+}
+async function handleRequest(request, responseStatusCode, responseHeaders, remixContext, 
+// This is ignored so we can keep it in the template for visibility.  Feel
+// free to delete this parameter in your app if you're not using it!
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+loadContext) {
+    const instance = createInstance();
+    const lng = await i18nextInstance.getLocale(request);
+    const ns = i18nextInstance.getRouteNamespaces(remixContext);
+    // First, we create a new instance of i18next so every request will have a
+    // completely unique instance and not share any state.
+    if (config.i18n.enabled) {
+        await instance
+            .use(initReactI18next) // Tell our instance to use react-i18next
+            .use(Backend) // Setup our backend.init({
+            .init({
+            fallbackLng: config.i18n.fallbackLng,
+            defaultNS: config.i18n.defaultNS,
+            react: config.i18n.react,
+            supportedLngs: config.i18n.supportedLngs,
+            lng, // The locale we detected above
+            ns, // The namespaces the routes about to render want to use
+            backend: {
+                loadPath: resolve(config.i18n.backend.loadServerPath),
+            },
+        });
+    }
+    return isbot(request.headers.get('user-agent') || '')
+        ? handleBotRequest(request, responseStatusCode, responseHeaders, remixContext, loadContext, instance)
+        : handleBrowserRequest(request, responseStatusCode, responseHeaders, remixContext, loadContext, instance);
+}
+function handleBotRequest(request, responseStatusCode, responseHeaders, remixContext, loadContext, i18nInstance) {
+    return new Promise((resolve, reject) => {
+        let shellRendered = false;
+        const { pipe, abort } = renderToPipeableStream(React.createElement(I18nextProvider, { i18n: i18nInstance },
+            React.createElement(RemixServer, { context: remixContext, url: request.url, abortDelay: ABORT_DELAY })), {
+            onAllReady() {
+                shellRendered = true;
+                const body = new PassThrough();
+                const stream = createReadableStreamFromReadable(body);
+                responseHeaders.set('Content-Type', 'text/html');
+                resolve(new Response(stream, {
+                    headers: responseHeaders,
+                    status: responseStatusCode,
+                }));
+                pipe(body);
+            },
+            onShellError(error) {
+                reject(error);
+            },
+            onError(error) {
+                responseStatusCode = 500;
+                // Log streaming rendering errors from inside the shell.  Don't log
+                // errors encountered during initial shell rendering since they'll
+                // reject and get logged in handleDocumentRequest.
+                if (shellRendered) {
+                    console.error(error);
+                }
+            },
+        });
+        setTimeout(abort, ABORT_DELAY);
+    });
+}
+function handleBrowserRequest(request, responseStatusCode, responseHeaders, remixContext, loadContext, i18nInstance) {
+    return new Promise((resolve, reject) => {
+        let shellRendered = false;
+        const slotFillContext = { fills: {} };
+        const { modules: clientModules, container, apolloClient: client, store, } = loadContext;
+        const { pathname, search, hash } = new URL(request.url);
+        store.dispatch({
+            type: LOCATION_CHANGE,
+            payload: { location: { pathname, search, hash }, action: 'POP' },
+        });
+        const { pipe, abort } = renderToPipeableStream((React.createElement(I18nextProvider, { i18n: i18nInstance },
+            React.createElement(CacheProvider, { value: cache },
+                React.createElement(StyleProvider, { cache: antdCache },
+                    React.createElement(Provider, { store: store },
+                        React.createElement(SlotFillProvider, { context: slotFillContext },
+                            React.createElement(InversifyProvider, { container: container, modules: clientModules },
+                                React.createElement(ApolloProvider, { client: client },
+                                    React.createElement(RemixServer, { context: remixContext, url: request.url, abortDelay: ABORT_DELAY }))))))))), {
+            onShellReady() {
+                shellRendered = true;
+                const body = new PassThrough();
+                const stream = createReadableStreamFromReadable(body);
+                const apolloState = { ...client.extract() };
+                const reduxState = { ...store.getState() };
+                const fills = Object.keys(slotFillContext.fills);
+                const styleSheet = extractStyle(antdCache);
+                const transform = new ConstantsTransform(fills, apolloState, reduxState, styleSheet);
+                responseHeaders.set('Content-Type', 'text/html');
+                resolve(new Response(stream, {
+                    headers: responseHeaders,
+                    status: responseStatusCode,
+                }));
+                pipe(transform).pipe(renderStylesToNodeStream()).pipe(body);
+            },
+            onShellError(error) {
+                reject(error);
+            },
+            onError(error) {
+                responseStatusCode = 500;
+                // Log streaming rendering errors from inside the shell.  Don't log
+                // errors encountered during initial shell rendering since they'll
+                // reject and get logged in handleDocumentRequest.
+                if (shellRendered) {
+                    console.error(error);
+                }
+                reject(error);
+            },
+        });
+        setTimeout(abort, ABORT_DELAY);
+    });
+}export{handleRequest as default};

package/lib/entries/antui/root.d.ts

@@ -0,0 +1,18 @@
+import 'reflect-metadata';
+import * as React from 'react';
+import { ErrorBoundary } from '@app/frontend-stack-react/entries/antui/components/ErrorBoundary';
+export declare const loader: ({ request }: {
+    request: any;
+}) => Promise<import("@remix-run/server-runtime").TypedResponse<{
+    __ENV__: any;
+    locale: any;
+}>>;
+export declare const handle: {
+    i18n: string;
+};
+export declare function shouldRevalidate(params: any): boolean;
+export declare function Layout({ children }: {
+    children: React.ReactNode;
+}): React.JSX.Element;
+export default function App(): React.JSX.Element;
+export { ErrorBoundary };

package/lib/entries/antui/root.js

@@ -0,0 +1,56 @@
+import'reflect-metadata';import*as React from'react';import {Outlet,json,useLoaderData,Meta,Links,ScrollRestoration,Scripts}from'@remix-run/react';import publicEnv from'@src/config/public-config';import {PluginArea}from'@common-stack/client-react';import {subscribeReduxRouter}from'@common-stack/remix-router-redux';import {ApplicationErrorHandler}from'@admin-layout/ant-ui';import {ConfigProvider}from'antd';import clientModules,{plugins}from'@app/frontend-stack-react/modules.js';import {useChangeLanguage}from'remix-i18next/react';import {useTranslation}from'react-i18next';import {i18nextInstance}from'@app/frontend-stack-react/i18n-localization/i18next.server.js';export{ErrorBoundary}from'@app/frontend-stack-react/entries/antui/components/ErrorBoundary';const loader = async ({ request }) => {
+    const locale = await i18nextInstance.getLocale(request);
+    return json({
+        __ENV__: publicEnv,
+        locale,
+    });
+};
+const handle = {
+    i18n: 'common',
+};
+function shouldRevalidate(params) {
+    return params.defaultShouldRevalidate && params.currentUrl.pathname !== params.nextUrl.pathname;
+}
+function Layout({ children }) {
+    const data = useLoaderData();
+    const locale = data?.locale;
+    const { i18n } = useTranslation();
+    useChangeLanguage(locale);
+    React.useEffect(() => {
+        subscribeReduxRouter({ store: window.__remixStore, router: window.__remixRouter });
+    }, []);
+    const getConstants = () => {
+        if (typeof window === 'undefined') {
+            return (React.createElement(React.Fragment, null,
+                React.createElement("script", { dangerouslySetInnerHTML: {
+                        __html: `window.__ENV__ = ${JSON.stringify(data?.__ENV__)}`,
+                    } }),
+                React.createElement("script", { src: "https://cdnjs.cloudflare.com/ajax/libs/reflect-metadata/0.1.13/Reflect.min.js", integrity: "sha512-jvbPH2TH5BSZumEfOJZn9IV+5bSwwN+qG4dvthYe3KCGC3/9HmxZ4phADbt9Pfcp+XSyyfc2vGZ/RMsSUZ9tbQ==", crossOrigin: "anonymous", referrerPolicy: "no-referrer" }),
+                React.createElement("script", null, "window.__APOLLO_STATE__=[__APOLLO_STATE__]"),
+                React.createElement("script", null, "window.__PRELOADED_STATE__=[__PRELOADED_STATE__]"),
+                React.createElement("script", null, "window.__SLOT_FILLS__=[__SLOT_FILLS__]"),
+                React.createElement("script", { dangerouslySetInnerHTML: {
+                        __html: `if (global === undefined) { var global = window; }`,
+                    } })));
+        }
+        return null;
+    };
+    return (React.createElement("html", { lang: locale, dir: i18n.dir() },
+        React.createElement("head", null,
+            React.createElement("meta", { charSet: "utf-8" }),
+            React.createElement("meta", { name: "viewport", content: "width=device-width, initial-scale=1" }),
+            React.createElement(Meta, null),
+            React.createElement(Links, null),
+            typeof window === 'undefined' ? `[__STYLESHEET__]` : ''),
+        React.createElement("body", null,
+            React.createElement(PluginArea, null),
+            clientModules.getWrappedRoot(children),
+            React.createElement(ScrollRestoration, null),
+            React.createElement(Scripts, null),
+            getConstants())));
+}
+function App() {
+    return (React.createElement(ApplicationErrorHandler, { plugins: plugins },
+        React.createElement(ConfigProvider, null,
+            React.createElement(Outlet, null))));
+}export{Layout,App as default,handle,loader,shouldRevalidate};

package/lib/entries/chakraui/components/Error500.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+interface Error500Props {
+    title: string;
+    status: string | number;
+    data?: any;
+}
+declare const Error500: React.FC<Error500Props>;
+export default Error500;

package/lib/entries/chakraui/components/Error500.js

@@ -0,0 +1,14 @@
+import*as React from'react';import {Box,VStack,Heading,Text,Code,Button}from'@chakra-ui/react';const Error500 = ({ title, status, data }) => {
+    const handleReload = () => {
+        window.location.reload();
+    };
+    return (React.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center", height: "100vh" },
+        React.createElement(VStack, { spacing: 4, textAlign: "center" },
+            React.createElement(Heading, { as: "h1", size: "xl" },
+                "Error ",
+                status),
+            React.createElement(Text, null, title),
+            data && (React.createElement(Box, { maxW: "md", mx: "auto", overflow: "auto" },
+                React.createElement(Code, { p: 4, display: "block", whiteSpace: "pre", textAlign: "left" }, typeof data === 'string' ? data : JSON.stringify(data, null, 2)))),
+            React.createElement(Button, { colorScheme: "teal", onClick: handleReload }, "Reload"))));
+};export{Error500 as default};

package/lib/entries/chakraui/components/ErrorBoundary.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare function ErrorBoundary(): React.JSX.Element;

package/lib/entries/chakraui/components/ErrorBoundary.js

@@ -0,0 +1,15 @@
+import*as React from'react';import {useRouteError,isRouteErrorResponse}from'@remix-run/react';import Error500 from'./Error500.js';function ErrorBoundary() {
+    const error = useRouteError();
+    React.useEffect(() => {
+        console.trace(error);
+    }, [error]);
+    if (isRouteErrorResponse(error)) {
+        return React.createElement(Error500, { title: error.statusText, status: error.status, data: error.data });
+    }
+    else if (error instanceof Error) {
+        return React.createElement(Error500, { title: error.message, status: "500", data: error.stack });
+    }
+    else {
+        return React.createElement(Error500, { title: "Unknown Error", status: "500", data: error });
+    }
+}export{ErrorBoundary};

package/lib/entries/chakraui/components/ServerError.d.ts

@@ -0,0 +1,4 @@
+declare class ServerError extends Error {
+    constructor(error: any);
+}
+export { ServerError };

package/lib/entries/chakraui/components/ServerError.js

@@ -0,0 +1,9 @@
+class ServerError extends Error {
+    constructor(error) {
+        super();
+        for (const key of Object.getOwnPropertyNames(error)) {
+            this[key] = error[key];
+        }
+        this.name = 'ServerError';
+    }
+}export{ServerError};

package/lib/entries/chakraui/components/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Error500';
+export * from './ErrorBoundary';
+export * from './ServerError';

package/lib/entries/chakraui/components/index.js

@@ -0,0 +1 @@
+import'react';import'@chakra-ui/react';export{ErrorBoundary}from'./ErrorBoundary.js';export{ServerError}from'./ServerError.js';

package/lib/entries/chakraui/context.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export interface ServerStyleContextData {
+    key: string;
+    ids: Array<string>;
+    css: string;
+}
+export declare const ServerStyleContext: React.Context<ServerStyleContextData[]>;
+export interface ClientStyleContextData {
+    reset: () => void;
+}
+export declare const ClientStyleContext: React.Context<ClientStyleContextData>;

package/lib/entries/chakraui/context.js

@@ -0,0 +1,3 @@
+import {createContext}from'react';// context.tsx
+const ServerStyleContext = createContext(null);
+const ClientStyleContext = createContext(null);export{ClientStyleContext,ServerStyleContext};

package/lib/entries/chakraui/entry.client.d.ts

@@ -0,0 +1 @@
+import 'reflect-metadata';

package/lib/entries/chakraui/entry.client.js

@@ -0,0 +1,50 @@
+import React__default,{StrictMode,useState}from'react';import'reflect-metadata';import {RemixBrowser}from'@remix-run/react';import {hydrateRoot}from'react-dom/client';import {ApolloProvider}from'@apollo/client/index.js';import {removeUniversalPortals,SlotFillProvider}from'@common-stack/components-pro';import {InversifyProvider}from'@common-stack/client-react';import {Provider}from'react-redux';import {PersistGate}from'redux-persist/integration/react';import {persistStore}from'redux-persist';import {CacheProvider}from'@emotion/react';import createEmotionCache,{defaultCache}from'@app/frontend-stack-react/entries/common/createEmotionCache';import {createReduxStore}from'@app/frontend-stack-react/config/redux-config.js';import {createClientContainer}from'@app/frontend-stack-react/config/client.service';import clientModules from'@app/frontend-stack-react/modules.js';import i18next from'i18next';import {initReactI18next,I18nextProvider}from'react-i18next';import LanguageDetector from'i18next-browser-languagedetector';import Backend from'i18next-http-backend';import {getInitialNamespaces}from'remix-i18next/client';import config from'@app/cde-webconfig.json';import {ClientStyleContext}from'@app/frontend-stack-react/entries/chakraui/context.js';const { apolloClient: client, container, serviceFunc } = createClientContainer();
+const { store } = createReduxStore(client, serviceFunc(), container);
+const persistor = persistStore(store);
+window.__remixStore = store;
+removeUniversalPortals(window.__SLOT_FILLS__ || []);
+function ClientCacheProvider({ children }) {
+    const [cache, setCache] = useState(defaultCache);
+    function reset() {
+        setCache(createEmotionCache());
+    }
+    return (React__default.createElement(ClientStyleContext.Provider, { value: { reset } },
+        React__default.createElement(CacheProvider, { value: cache }, children)));
+}
+async function hydrate() {
+    if (!i18next.isInitialized && config.i18n.enabled) {
+        await i18next
+            .use(initReactI18next)
+            .use(LanguageDetector)
+            .use(Backend)
+            .init({
+            fallbackLng: config.i18n.fallbackLng,
+            defaultNS: config.i18n.defaultNS,
+            react: config.i18n.react,
+            supportedLngs: config.i18n.supportedLngs,
+            backend: config.i18n.backend,
+            ns: getInitialNamespaces(),
+            detection: {
+                order: ['htmlTag'],
+                caches: [],
+            },
+        });
+    }
+    hydrateRoot(document.getElementById('root'), React__default.createElement(StrictMode, null,
+        React__default.createElement(I18nextProvider, { i18n: i18next },
+            React__default.createElement(ClientCacheProvider, null,
+                React__default.createElement(ApolloProvider, { client: client },
+                    React__default.createElement(Provider, { store: store },
+                        React__default.createElement(SlotFillProvider, null,
+                            React__default.createElement(InversifyProvider, { container: container, modules: clientModules },
+                                React__default.createElement(PersistGate, { loading: null, persistor: persistor }, () => React__default.createElement(RemixBrowser, null))))))))));
+    // });
+}
+if (typeof requestIdleCallback === 'function') {
+    requestIdleCallback(hydrate);
+}
+else {
+    // Safari doesn't support requestIdleCallback
+    // https://caniuse.com/requestidlecallback
+    setTimeout(hydrate, 1);
+}

package/lib/entries/chakraui/entry.server.d.ts

@@ -0,0 +1,2 @@
+import type { AppLoadContext, EntryContext } from '@remix-run/node';
+export default function handleRequest(request: Request, responseStatusCode: number, responseHeaders: Headers, remixContext: EntryContext, loadContext: AppLoadContext): Promise<unknown>;

package/lib/entries/chakraui/entry.server.js

@@ -0,0 +1,151 @@
+import React__default from'react';import {PassThrough}from'node:stream';import {createReadableStreamFromReadable}from'@remix-run/node';import {RemixServer}from'@remix-run/react';import {isbot}from'isbot';import {ApolloProvider}from'@apollo/client/index.js';import {SlotFillProvider}from'@common-stack/components-pro';import {InversifyProvider}from'@common-stack/client-react';import {renderToPipeableStream,renderToString}from'react-dom/server';import {Provider}from'react-redux';import {LOCATION_CHANGE}from'@common-stack/remix-router-redux';import serialize from'serialize-javascript';import {CacheProvider}from'@emotion/react';import createEmotionServer from'@emotion/server/create-instance';import Backend from'i18next-fs-backend';import {renderHeadToString}from'remix-island';import publicEnv from'@src/config/public-config';import {initReactI18next,I18nextProvider}from'react-i18next';import {createInstance}from'i18next';import {resolve}from'node:path';import {defaultCache}from'@app/frontend-stack-react/entries/common/createEmotionCache.js';import config from'@app/cde-webconfig.json';import {Head}from'./root.js';import {ServerStyleContext}from'@app/frontend-stack-react/entries/chakraui/context.js';import {i18nextInstance}from'@app/frontend-stack-react/i18n-localization/i18next.server.js';/**
+ * By default, Remix will handle generating the HTTP Response for you.
+ * You are free to delete this file if you'd like to, but if you ever want it revealed again, you can run `npx remix reveal` ✨
+ * For more information, see https://remix.run/file-conventions/entry.server
+ */
+// @ts-nocheck
+global.__CLIENT__ = false;
+global.__SERVER__ = true;
+const { extractCriticalToChunks } = createEmotionServer(defaultCache);
+const ABORT_DELAY = 5000;
+const COMMON_HEAD = `
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width,initial-scale=1" />
+`;
+function handleRequest(request, responseStatusCode, responseHeaders, remixContext, 
+// This is ignored so we can keep it in the template for visibility.  Feel
+// free to delete this parameter in your app if you're not using it!
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+loadContext) {
+    return isbot(request.headers.get('user-agent') || '')
+        ? handleBotRequest(request, responseStatusCode, responseHeaders, remixContext)
+        : handleBrowserRequest(request, responseStatusCode, responseHeaders, remixContext, loadContext);
+}
+function handleBotRequest(request, responseStatusCode, responseHeaders, remixContext, loadContext) {
+    return new Promise((resolve, reject) => {
+        let shellRendered = false;
+        const { pipe, abort } = renderToPipeableStream(React__default.createElement(RemixServer, { context: remixContext, url: request.url, abortDelay: ABORT_DELAY }), {
+            onAllReady() {
+                shellRendered = true;
+                const head = renderHeadToString({ request, remixContext, Head });
+                const body = new PassThrough();
+                responseHeaders.set('Content-Type', 'text/html');
+                const stream = createReadableStreamFromReadable(body);
+                resolve(new Response(stream, {
+                    headers: responseHeaders,
+                    status: responseStatusCode,
+                }));
+                body.write(`<!DOCTYPE html><html><head>${COMMON_HEAD}${head}</head><body><div id="root">`);
+                pipe(body);
+                body.write(`</div></body></html>`);
+            },
+            onShellError(error) {
+                reject(error);
+            },
+            onError(error) {
+                responseStatusCode = 500;
+                // Log streaming rendering errors from inside the shell.  Don't log
+                // errors encountered during initial shell rendering since they'll
+                // reject and get logged in handleDocumentRequest.
+                if (shellRendered) {
+                    console.error(error);
+                }
+            },
+        });
+        setTimeout(abort, ABORT_DELAY);
+    });
+}
+async function handleBrowserRequest(request, responseStatusCode, responseHeaders, remixContext, loadContext) {
+    const instance = createInstance();
+    // Then we could detect locale from the request
+    const lng = await i18nextInstance.getLocale(request);
+    // And here we detect what namespaces the routes about to render want to use
+    const ns = i18nextInstance.getRouteNamespaces(remixContext);
+    const slotFillContext = { fills: {} };
+    const { modules: clientModules, container, apolloClient: client, store, } = loadContext;
+    // First, we create a new instance of i18next so every request will have a
+    // completely unique instance and not share any state.
+    if (config.i18n.enabled) {
+        await instance
+            .use(initReactI18next) // Tell our instance to use react-i18next
+            .use(Backend) // Setup our backend.init({
+            .init({
+            fallbackLng: config.i18n.fallbackLng,
+            defaultNS: config.i18n.defaultNS,
+            react: config.i18n.react,
+            supportedLngs: config.i18n.supportedLngs,
+            lng, // The locale we detected above
+            ns, // The namespaces the routes about to render want to use
+            backend: {
+                loadPath: resolve(config.i18n.backend.loadServerPath),
+            },
+        });
+    }
+    const html = renderToString(React__default.createElement(I18nextProvider, { i18n: instance },
+        React__default.createElement(CacheProvider, { value: defaultCache },
+            React__default.createElement(ApolloProvider, { client: client },
+                React__default.createElement(Provider, { store: store },
+                    React__default.createElement(SlotFillProvider, { context: slotFillContext },
+                        React__default.createElement(InversifyProvider, { container: container, modules: clientModules },
+                            React__default.createElement(RemixServer, { context: remixContext, url: request.url }))))))));
+    const chunks = extractCriticalToChunks(html);
+    return new Promise((resolve, reject) => {
+        let shellRendered = false;
+        const { pathname, search, hash } = new URL(request.url);
+        store.dispatch({
+            type: LOCATION_CHANGE,
+            payload: { location: { pathname, search, hash }, action: 'POP' },
+        });
+        const { pipe, abort } = renderToPipeableStream((React__default.createElement(I18nextProvider, { i18n: instance },
+            React__default.createElement(ServerStyleContext.Provider, { value: chunks.styles },
+                React__default.createElement(CacheProvider, { value: defaultCache },
+                    React__default.createElement(ApolloProvider, { client: client },
+                        React__default.createElement(Provider, { store: store },
+                            React__default.createElement(SlotFillProvider, { context: slotFillContext },
+                                React__default.createElement(InversifyProvider, { container: container, modules: clientModules },
+                                    React__default.createElement(RemixServer, { context: remixContext, url: request.url, abortDelay: ABORT_DELAY }))))))))), {
+            onShellReady() {
+                shellRendered = true;
+                const head = renderHeadToString({ request, remixContext, Head });
+                const body = new PassThrough();
+                const stream = createReadableStreamFromReadable(body);
+                const apolloState = { ...client.extract() };
+                const reduxState = { ...store.getState() };
+                const fills = Object.keys(slotFillContext.fills);
+                // const transform = new ConstantsTransform(fills, apolloState, reduxState);
+                let customHead = `<script>window.__ENV__=${JSON.stringify(publicEnv)}</script>`;
+                customHead += `<script>window.__APOLLO_STATE__=${serialize(apolloState, {
+                    isJSON: true,
+                })}</script>`;
+                customHead += `<script>window.__PRELOADED_STATE__=${serialize(reduxState, {
+                    isJSON: true,
+                })}</script>`;
+                customHead += `<script>window.__SLOT_FILLS__=${serialize(fills, { isJSON: true })}</script>`;
+                customHead += `<script>if (global === undefined) { var global = window; }</script>`;
+                responseHeaders.set('Content-Type', 'text/html');
+                resolve(new Response(stream, {
+                    headers: responseHeaders,
+                    status: responseStatusCode,
+                }));
+                body.write(`<!DOCTYPE html><html lng=${lng}><head>${COMMON_HEAD}${customHead}${head}</head><body><div id="root">`);
+                pipe(body);
+                body.write(`</div></body></html>`);
+                // pipe(transform).pipe(renderStylesToNodeStream()).pipe(body);
+            },
+            onShellError(error) {
+                reject(error);
+            },
+            onError(error) {
+                responseStatusCode = 500;
+                // Log streaming rendering errors from inside the shell.  Don't log
+                // errors encountered during initial shell rendering since they'll
+                // reject and get logged in handleDocumentRequest.
+                if (shellRendered) {
+                    console.error(error);
+                }
+                reject(error);
+            },
+        });
+        setTimeout(abort, ABORT_DELAY);
+    });
+}export{handleRequest as default};

package/lib/entries/chakraui/root.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { ErrorBoundary } from '@app/frontend-stack-react/entries/chakraui/components/ErrorBoundary.js';
+interface DocumentProps {
+    children: React.ReactNode;
+}
+export declare const Head: any;
+export declare const Document: React.FC<DocumentProps & React.ClassAttributes<any>>;
+export declare let loader: ({ request }: {
+    request: any;
+}) => Promise<import("@remix-run/node").TypedResponse<{
+    locale: any;
+}>>;
+export declare let handle: {
+    i18n: string;
+};
+export declare function shouldRevalidate(params: any): boolean;
+export default function App(): React.JSX.Element;
+export { ErrorBoundary };

package/lib/entries/chakraui/root.js

@@ -0,0 +1,47 @@
+import*as React from'react';import {useContext}from'react';import {Meta,Links,ScrollRestoration,Scripts,useLoaderData,Outlet}from'@remix-run/react';import {json}from'@remix-run/node';import {PluginArea}from'@common-stack/client-react';import {subscribeReduxRouter}from'@common-stack/remix-router-redux';import {ApplicationErrorHandler}from'@admin-layout/chakra-ui';import clientModules,{plugins}from'@app/frontend-stack-react/modules.js';import {createHead}from'remix-island';import {ServerStyleContext,ClientStyleContext}from'./context.js';import {withEmotionCache}from'@emotion/react';import {useChangeLanguage}from'remix-i18next/react';import {i18nextInstance}from'@app/frontend-stack-react/i18n-localization/i18next.server.js';export{ErrorBoundary}from'@app/frontend-stack-react/entries/chakraui/components/ErrorBoundary.js';// @ts-nocheck
+const Head = createHead(() => (React.createElement(React.Fragment, null,
+    React.createElement(Meta, null),
+    React.createElement(Links, null))));
+const Document = withEmotionCache(({ children }, emotionCache) => {
+    const serverStyleData = useContext(ServerStyleContext);
+    const clientStyleData = useContext(ClientStyleContext);
+    React.useEffect(() => {
+        // re-link sheet container
+        emotionCache.sheet.container = document.head;
+        // re-inject tags
+        const tags = emotionCache.sheet.tags;
+        emotionCache.sheet.flush();
+        tags.forEach((tag) => {
+            emotionCache.sheet._insertTag(tag);
+        });
+        // reset cache to reapply global styles
+        clientStyleData?.reset();
+    }, []);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Head, null),
+        serverStyleData?.map(({ key, ids, css }) => (React.createElement("style", { key: key, "data-emotion": `${key} ${ids.join(' ')}`, dangerouslySetInnerHTML: { __html: css } }))),
+        React.createElement("script", { src: "https://cdnjs.cloudflare.com/ajax/libs/reflect-metadata/0.1.13/Reflect.min.js", integrity: "sha512-jvbPH2TH5BSZumEfOJZn9IV+5bSwwN+qG4dvthYe3KCGC3/9HmxZ4phADbt9Pfcp+XSyyfc2vGZ/RMsSUZ9tbQ==", crossOrigin: "anonymous", referrerPolicy: "no-referrer" }),
+        React.createElement(PluginArea, null),
+        children,
+        React.createElement(ScrollRestoration, null),
+        React.createElement(Scripts, null)));
+});
+let loader = async ({ request }) => {
+    let locale = await i18nextInstance.getLocale(request);
+    return json({ locale });
+};
+let handle = {
+    i18n: 'common',
+};
+function shouldRevalidate(params) {
+    return params.defaultShouldRevalidate && params.currentUrl.pathname !== params.nextUrl.pathname;
+}
+function App() {
+    let { locale } = useLoaderData();
+    useChangeLanguage(locale);
+    React.useEffect(() => {
+        subscribeReduxRouter({ store: window.__remixStore, router: window.__remixRouter });
+    }, []);
+    return (React.createElement(ApplicationErrorHandler, { plugins: plugins },
+        React.createElement(Document, null, clientModules.getWrappedRoot(React.createElement(Outlet, null)))));
+}export{Document,Head,App as default,handle,loader,shouldRevalidate};

package/lib/entries/common/AntStyles.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export declare const styleSheet: string;
+export declare const AntSytles: ({ children }: {
+    children: React.ReactNode;
+}) => React.JSX.Element;

package/lib/entries/common/AntStyles.js

@@ -0,0 +1,3 @@
+import*as React from'react';import {createCache,extractStyle,StyleProvider}from'@ant-design/cssinjs';const antdCache = createCache();
+const styleSheet = extractStyle(antdCache);
+const AntSytles = ({ children }) => (React.createElement(StyleProvider, { cache: antdCache }, children));export{AntSytles,styleSheet};

package/lib/entries/common/createEmotionCache.d.ts

@@ -0,0 +1,2 @@
+export declare const defaultCache: import("@emotion/cache").EmotionCache;
+export default function createEmotionCache(): import("@emotion/cache").EmotionCache;

package/lib/entries/common/createEmotionCache.js

@@ -0,0 +1,4 @@
+import createCache from'@emotion/cache';const defaultCache = createEmotionCache();
+function createEmotionCache() {
+    return createCache({ key: 'css', prepend: true });
+}export{createEmotionCache as default,defaultCache};

package/lib/entries/common/index.d.ts

@@ -0,0 +1,3 @@
+export * from './AntStyles';
+export * from './createEmotionCache';
+export * from './utils';

package/lib/entries/common/index.js

@@ -0,0 +1 @@
+export{AntSytles,styleSheet}from'./AntStyles.js';export{defaultCache}from'./createEmotionCache.js';export{jsonToString}from'./utils.js';

package/lib/entries/common/utils.d.ts

@@ -0,0 +1 @@
+export declare function jsonToString(json: any): any;

package/lib/entries/common/utils.js

@@ -0,0 +1,12 @@
+import {isEmpty}from'lodash-es';function jsonToString(json) {
+    if (isEmpty(json)) {
+        return '';
+    }
+    if (Array.isArray(json)) {
+        let arr = json.map((a) => jsonToString(a));
+        return arr.join(' ');
+    }
+    const str = JSON.stringify(json);
+    const arr = str.split(',');
+    return Array.isArray(arr) ? arr.join(' ') : str;
+}export{jsonToString};

package/lib/entries/index.d.ts

@@ -0,0 +1,7 @@
+export * as ac from './antui/entry.client';
+export * as as from './antui/entry.server';
+export * as ar from './antui/root';
+export * as cc from './chakraui/entry.client';
+export * as cs from './chakraui/entry.server';
+export * as cr from './chakraui/root';
+export * as common from './common';

package/lib/index.d.ts

@@ -5,4 +5,7 @@ export * from './backend/middlewares/cors';
 export * from './backend/middlewares/container';
 export * from './backend/middlewares/error';
 export * from './load-context.server';
+export * from './entries';
 export * from './i18n-localization/i18next.server';
+export * as au from './entries/antui/components';
+export * as cu from './entries/chakraui/components';

package/lib/index.js

@@ -1 +1 @@
-export{UtilityClass,logger}from'./utils/index.js';export{createClientContainer}from'./config/client.service.js';export{createReduxStore,epicMiddlewareFunc,persistConfig}from'./config/redux-config.js';export{clientLoaderWithMiddleware}from'./tools/clientLoaderWithMiddleware.js';export{loaderWithMiddleware}from'./tools/loaderWithMiddleware.js';export{corsMiddleware}from'./backend/middlewares/cors.js';export{TYPES,containerMiddleware}from'./backend/middlewares/container.js';export{errorMiddleware}from'./backend/middlewares/error.js';export{loadContext}from'./load-context.server.js';export{i18nextInstance}from'./i18n-localization/i18next.server.js';
+export{UtilityClass,logger}from'./utils/index.js';export{createClientContainer}from'./config/client.service.js';export{createReduxStore,epicMiddlewareFunc,persistConfig}from'./config/redux-config.js';export{clientLoaderWithMiddleware}from'./tools/clientLoaderWithMiddleware.js';export{loaderWithMiddleware}from'./tools/loaderWithMiddleware.js';export{corsMiddleware}from'./backend/middlewares/cors.js';export{TYPES,containerMiddleware}from'./backend/middlewares/container.js';export{errorMiddleware}from'./backend/middlewares/error.js';export{loadContext}from'./load-context.server.js';import*as entry_client from'./entries/antui/entry.client.js';export{entry_client as ac };import*as entry_server from'./entries/antui/entry.server.js';export{entry_server as as };import*as root from'./entries/antui/root.js';export{root as ar };import*as entry_client$1 from'./entries/chakraui/entry.client.js';export{entry_client$1 as cc };import*as entry_server$1 from'./entries/chakraui/entry.server.js';export{entry_server$1 as cs };import*as root$1 from'./entries/chakraui/root.js';export{root$1 as cr };import*as index$2 from'./entries/common/index.js';export{index$2 as common };export{i18nextInstance}from'./i18n-localization/i18next.server.js';import*as index from'./entries/antui/components/index.js';export{index as au };import*as index$1 from'./entries/chakraui/components/index.js';export{index$1 as cu };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@common-stack/frontend-stack-react",
-    "version": "6.0.1-alpha.3",
+    "version": "6.0.1-alpha.5",
     "description": "Client Module for react app",
     "homepage": "https://github.com/cdmbase/fullstack-pro#readme",
     "bugs": {
@@ -29,15 +29,10 @@
         "watch": "npm run build:lib:watch"
     },
     "dependencies": {
-        "@chakra-ui/react": "^2.8.2",
         "@common-stack/client-react": "6.0.1-alpha.0",
         "@common-stack/core": "6.0.1-alpha.0",
-        "@nx/devkit": "19.5.1",
         "@reduxjs/toolkit": "^2.2.6",
         "@sentry/browser": "~5.11.2",
-        "apollo-link-debounce": "^3.0.0",
-        "apollo-link-logger": "^2.0.0",
-        "apollo-server-errors": "^3.3.1",
         "cors": "^2.8.5",
         "cross-fetch": "^4.0.0",
         "graphql": "^16.0.0",
@@ -54,6 +49,11 @@
     "devDependencies": {
         "@admin-layout/ant-ui": "^7.3.7-alpha.4",
         "@admin-layout/chakra-ui": "^7.3.7-alpha.4",
+        "@chakra-ui/react": "^2.8.2",
+        "@emotion/react": "^11.0.0",
+        "@emotion/server": "^11.0.0",
+        "antd": "^5.10.1",
+        "isbot": "^4.1.0",
         "jest-fetch-mock": "^3.0.3",
         "vite": "^5.2.12"
     },
@@ -69,5 +69,5 @@
     "typescript": {
         "definition": "lib/index.d.ts"
     },
-    "gitHead": "58290c6f35e6bd2565abc8ee4a6b711c6c0a17b8"
+    "gitHead": "a8430902d49f77c8e09217250e9a625ec5aac8c1"
 }