@teambit/ui 0.0.636 → 0.0.640

package/dist/{ssr/render-middleware.js → ssr-middleware/ssr-middleware.js}

@@ -39,10 +39,10 @@ function fs() {
   return data;
 }
 
-function _requestBrowser() {
-  const data = require("./request-browser");
+function _extractBrowserData() {
+  const data = require("./extract-browser-data");
 
-  _requestBrowser = function () {
+  _extractBrowserData = function () {
     return data;
   };
 
@@ -82,7 +82,7 @@ async function createSsrMiddleware({
       query,
       url
     } = req;
-    const browser = (0, _requestBrowser().requestToObj)(req, port);
+    const browser = (0, _extractBrowserData().extractBrowserData)(req, port);
 
     if (denyList.test(url)) {
       logger.debug(`[ssr] skipping static denyList file ${url}`);
@@ -195,4 +195,4 @@ function getAssets(manifest) {
   return assets;
 }
 
-//# sourceMappingURL=render-middleware.js.map
+//# sourceMappingURL=ssr-middleware.js.map

package/dist/ssr-middleware/ssr-middleware.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ssr-middleware.ts"],"names":["denyList","createSsrMiddleware","root","port","title","logger","runtime","loadRuntime","undefined","render","assets","serverRenderMiddleware","req","res","next","query","url","browser","test","debug","rendering","method","server","request","response","props","rendered","set","send","e","error","entryFilepath","path","join","fs","existsSync","warn","manifestFilepath","parseManifest","imported","filepath","file","readFile","contents","toString","parsed","JSON","parse","getAssets","process","exit","manifest","css","js","entrypoints","filter","x","endsWith","map"],"mappings":"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","sourcesContent":["import type { Assets } from '@teambit/ui-foundation.ui.rendering.html';\nimport { Request, Response, NextFunction } from 'express';\nimport path from 'path';\nimport * as fs from 'fs-extra';\nimport type { Logger } from '@teambit/logger';\nimport type { SsrContent } from '../react-ssr';\nimport { extractBrowserData } from './extract-browser-data';\n\nconst denyList = /^\\/favicon.ico$/;\n\ntype ssrRenderProps = {\n  root: string;\n  port: number;\n  title: string;\n  logger: Logger;\n};\n\ntype ManifestFile = {\n  files?: Record<string, string>;\n  entrypoints?: string[];\n};\n\nexport async function createSsrMiddleware({ root, port, title, logger }: ssrRenderProps) {\n  const runtime = await loadRuntime(root, { logger });\n  if (!runtime) return undefined;\n\n  const { render } = runtime;\n  const assets = { ...runtime.assets, title };\n\n  return async function serverRenderMiddleware(req: Request, res: Response, next: NextFunction) {\n    const { query, url } = req;\n\n    const browser = extractBrowserData(req, port);\n\n    if (denyList.test(url)) {\n      logger.debug(`[ssr] skipping static denyList file ${url}`);\n      next();\n      return;\n    }\n\n    if (query.rendering === 'client') {\n      logger.debug(`[ssr] skipping ${url}`);\n      next();\n      return;\n    }\n\n    logger.debug(`[ssr] ${req.method} ${url}`);\n    const server = { port, request: req, response: res };\n    const props: SsrContent = { assets, browser, server };\n\n    try {\n      const rendered = await render(props);\n      res.set('Cache-Control', 'no-cache');\n      res.send(rendered);\n      logger.debug(`[ssr] success '${url}'`);\n    } catch (e: any) {\n      logger.error(`[ssr] failed at '${url}'`, e);\n      next();\n    }\n  };\n}\n\nasync function loadRuntime(root: string, { logger }: { logger: Logger }) {\n  let render: (...arg: any[]) => any;\n  let assets: Assets | undefined;\n\n  try {\n    const entryFilepath = path.join(root, 'ssr', 'index.js');\n    if (!fs.existsSync(entryFilepath)) {\n      logger.warn(`[ssr] - Skipping setup - failed finding ssr bundle at \"${entryFilepath}\"`);\n      return undefined;\n    }\n\n    const manifestFilepath = path.join(root, 'asset-manifest.json');\n    if (!fs.existsSync(manifestFilepath)) {\n      logger.warn('[ssr] - Skipping setup (cannot find asset manifest file)');\n      return undefined;\n    }\n\n    assets = await parseManifest(manifestFilepath);\n    if (!assets) {\n      logger.warn('[ssr] - Skipping setup (failed parsing assets manifest)');\n      return undefined;\n    }\n\n    const imported = await import(entryFilepath);\n    render = imported?.render;\n\n    if (!render || typeof render !== 'function') {\n      logger.warn('[ssr] - index file does not export a render() function. Skipping setup.');\n      return undefined;\n    }\n  } catch (e: any) {\n    logger.error(e);\n    return undefined;\n  }\n\n  return {\n    render,\n    assets,\n  };\n}\n\nasync function parseManifest(filepath: string, logger?: Logger) {\n  try {\n    const file = await fs.readFile(filepath);\n    logger?.debug('[ssr] - ✓ aread manifest file');\n    const contents = file.toString();\n    const parsed: ManifestFile = JSON.parse(contents);\n    logger?.debug('[ssr] - ✓ prased manifest file', parsed);\n    const assets = getAssets(parsed);\n    logger?.debug('[ssr] - ✓ extracted data from manifest file', assets);\n\n    return assets;\n  } catch (e: any) {\n    logger?.error('[ssr] - error parsing asset manifest', e);\n    process.exit();\n    return undefined;\n  }\n}\n\nfunction getAssets(manifest: ManifestFile) {\n  const assets: Assets = { css: [], js: [] };\n\n  assets.css = manifest.entrypoints?.filter((x) => x.endsWith('css')).map((x) => path.join('/', x));\n  assets.js = manifest.entrypoints?.filter((x) => x.endsWith('js')).map((x) => path.join('/', x));\n\n  return assets;\n}\n"]}

package/dist/ui-server.js

@@ -101,10 +101,10 @@ function _webpackDevServer() {
   return data;
 }
 
-function _renderMiddleware() {
-  const data = require("./ssr/render-middleware");
+function _ssrMiddleware() {
+  const data = require("./ssr-middleware");
 
-  _renderMiddleware = function () {
+  _ssrMiddleware = function () {
     return data;
   };
 
@@ -239,7 +239,7 @@ class UIServer {
     var _this$buildOptions;
 
     if (!((_this$buildOptions = this.buildOptions) !== null && _this$buildOptions !== void 0 && _this$buildOptions.ssr)) return;
-    const ssrMiddleware = await (0, _renderMiddleware().createSsrMiddleware)({
+    const ssrMiddleware = await (0, _ssrMiddleware().createSsrMiddleware)({
       root,
       port,
       title: this.uiRoot.name,

package/dist/ui-server.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ui-server.ts"],"names":["UIServer","constructor","graphql","expressExtension","ui","uiRoot","uiRootExtension","logger","publicDir","plugins","Promise","resolve","setReady","getName","name","port","_port","host","fullUrl","buildOptions","getDevConfig","aspects","resolveAspects","UIRuntime","path","generateRoot","whenReady","all","startPromise","map","x","start","portRange","app","createApp","root","server","createServer","configureProxy","use","express","static","index","Port","getPortFromRange","setupServerSideRendering","listen","info","getPluginsComponents","plugin","render","ssr","ssrMiddleware","title","warn","get","debug","proxServer","httpProxy","createProxyServer","on","e","error","message","proxyEntries","getProxyFromPlugins","req","socket","head","entry","find","proxy","context","some","item","url","ws","target","forEach","route","res","web","originalUrl","dev","devServerPort","selectPort","expressAppPort","config","compiler","devServerConfig","getDevServerConfig","devServer","WebpackDevServer","proxiesByPlugin","getProxy","gqlProxies","changeOrigin","concat","appPort","gqlPort","devServerConf","create","props","startPlugins"],"mappings":"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","sourcesContent":["import { flatten } from 'lodash';\nimport { ExpressMain } from '@teambit/express';\nimport { GraphqlMain } from '@teambit/graphql';\nimport { Logger } from '@teambit/logger';\nimport express, { Express } from 'express';\nimport fallback from 'express-history-api-fallback';\nimport { Port } from '@teambit/toolbox.network.get-port';\nimport { Server } from 'http';\nimport httpProxy from 'http-proxy';\nimport { join } from 'path';\nimport webpack from 'webpack';\nimport WebpackDevServer, { Configuration as WdsConfiguration } from 'webpack-dev-server';\nimport { createSsrMiddleware } from './ssr/render-middleware';\nimport { StartPlugin } from './start-plugin';\nimport { ProxyEntry, UIRoot } from './ui-root';\nimport { UIRuntime } from './ui.aspect';\nimport { UiMain } from './ui.main.runtime';\n\nimport { devConfig } from './webpack/webpack.dev.config';\n\nexport type UIServerProps = {\n  graphql: GraphqlMain;\n  express: ExpressMain;\n  ui: UiMain;\n  uiRoot: UIRoot;\n  uiRootExtension: string;\n  logger: Logger;\n  publicDir: string;\n  startPlugins: StartPlugin[];\n};\n\nexport type StartOptions = {\n  /**\n   * port range for the UI server to bind. default is a port range of 4000-4200.\n   */\n  portRange?: number[] | number;\n};\n\nexport class UIServer {\n  constructor(\n    private graphql: GraphqlMain,\n    private expressExtension: ExpressMain,\n    private ui: UiMain,\n    private uiRoot: UIRoot,\n    private uiRootExtension: string,\n    private logger: Logger,\n    private publicDir: string,\n    private plugins: StartPlugin[]\n  ) {}\n\n  getName() {\n    return this.uiRoot.name;\n  }\n\n  private _port = 0;\n\n  get port() {\n    return this._port;\n  }\n\n  /** the hostname for the server to listen at. Currently statically 'localhost' */\n  get host() {\n    return 'localhost';\n  }\n\n  /** the server listens at this url */\n  get fullUrl() {\n    const port = this.port !== 80 ? `:${this.port}` : '';\n    return `http://${this.host}${port}`;\n  }\n\n  get buildOptions() {\n    return this.uiRoot.buildOptions;\n  }\n\n  /**\n   * get the webpack configuration of the UI server.\n   */\n  async getDevConfig() {\n    const aspects = await this.uiRoot.resolveAspects(UIRuntime.name);\n\n    return devConfig(this.uiRoot.path, [await this.ui.generateRoot(aspects, this.uiRootExtension)], this.uiRoot.name);\n  }\n\n  private setReady: () => void;\n  private startPromise = new Promise<void>((resolve) => (this.setReady = resolve));\n  get whenReady() {\n    return Promise.all([this.startPromise, ...this.plugins.map((x) => x?.whenReady)]);\n  }\n\n  /**\n   * start a UI server.\n   */\n  async start({ portRange }: StartOptions = {}) {\n    const app = this.expressExtension.createApp();\n    const publicDir = `/${this.publicDir}`;\n    const root = join(this.uiRoot.path, publicDir);\n    const server = await this.graphql.createServer({ app });\n\n    // set up proxy, for things like preview, e.g. '/preview/teambit.react/react'\n    await this.configureProxy(app, server);\n\n    // pass through files from public /folder:\n    // setting `index: false` so index.html will be served by the fallback() middleware\n    app.use(express.static(root, { index: false }));\n\n    const port = await Port.getPortFromRange(portRange || [3100, 3200]);\n\n    await this.setupServerSideRendering({ root, port, app });\n\n    // in any and all other cases, serve index.html.\n    // No any other endpoints past this will execute\n    app.use(fallback('index.html', { root }));\n\n    server.listen(port);\n    this._port = port;\n\n    // important: we use the string of the following message for the http.e2e.ts. if you change the message,\n    // please make sure you change the `HTTP_SERVER_READY_MSG` const.\n    this.logger.info(`UI server of ${this.uiRootExtension} is listening to port ${port}`);\n\n    this.setReady();\n  }\n\n  getPluginsComponents() {\n    return this.plugins.map((plugin) => plugin.render);\n  }\n\n  private async setupServerSideRendering({ root, port, app }: { root: string; port: number; app: Express }) {\n    if (!this.buildOptions?.ssr) return;\n\n    const ssrMiddleware = await createSsrMiddleware({\n      root,\n      port,\n      title: this.uiRoot.name,\n      logger: this.logger,\n    });\n\n    if (!ssrMiddleware) {\n      this.logger.warn('[ssr] middleware failed setup');\n      return;\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-misused-promises\n    app.get('*', ssrMiddleware);\n    this.logger.debug('[ssr] serving for \"*\"');\n  }\n\n  private async configureProxy(app: Express, server: Server) {\n    const proxServer = httpProxy.createProxyServer();\n    proxServer.on('error', (e) => this.logger.error(e.message));\n    const proxyEntries = await this.getProxyFromPlugins();\n    server.on('upgrade', function (req, socket, head) {\n      const entry = proxyEntries.find((proxy) => proxy.context.some((item) => item === req.url));\n      if (!entry) return;\n      proxServer.ws(req, socket, head, {\n        target: entry.target,\n      });\n    });\n\n    proxyEntries.forEach((entry) => {\n      entry.context.forEach((route) => {\n        app.use(`${route}/*`, (req, res) => {\n          proxServer.web(req, res, { ...entry, target: `${entry.target}/${req.originalUrl}` });\n        });\n      });\n    });\n  }\n\n  /**\n   * start a UI dev server.\n   */\n  async dev({ portRange }: StartOptions = {}) {\n    const devServerPort = await this.selectPort(portRange);\n    await this.start({ portRange: [4100, 4200] });\n    const expressAppPort = this._port;\n\n    const config = await this.getDevConfig();\n    const compiler = webpack(config);\n    const devServerConfig = await this.getDevServerConfig(devServerPort, expressAppPort, config.devServer);\n    // @ts-ignore in the capsules it throws an error about compatibilities issues between webpack.compiler and webpackDevServer/webpack/compiler\n    const devServer = new WebpackDevServer(devServerConfig, compiler);\n\n    await devServer.start();\n    this._port = devServerPort;\n    return devServer;\n  }\n\n  private async selectPort(portRange?: number[] | number) {\n    return Port.getPortFromRange(portRange || [3100, 3200]);\n  }\n\n  private async getProxyFromPlugins(): Promise<ProxyEntry[]> {\n    const proxiesByPlugin = this.plugins.map((plugin) => {\n      return plugin.getProxy ? plugin.getProxy() : [];\n    });\n\n    return flatten(await Promise.all(proxiesByPlugin));\n  }\n\n  private async getProxy(port = 4000) {\n    const proxyEntries = await this.getProxyFromPlugins();\n\n    const gqlProxies: ProxyEntry[] = [\n      {\n        context: ['/graphql', '/api'],\n        target: `http://${this.host}:${port}`,\n        changeOrigin: true,\n      },\n      {\n        context: ['/subscriptions'],\n        target: `ws://${this.host}:${port}`,\n        ws: true,\n      },\n    ];\n\n    return gqlProxies.concat(proxyEntries);\n  }\n\n  private async getDevServerConfig(\n    appPort: number,\n    gqlPort: number,\n    config?: WdsConfiguration\n  ): Promise<WdsConfiguration> {\n    const proxy = await this.getProxy(gqlPort);\n    const devServerConf = { ...config, proxy, port: appPort };\n\n    return devServerConf;\n  }\n\n  static create(props: UIServerProps) {\n    return new UIServer(\n      props.graphql,\n      props.express,\n      props.ui,\n      props.uiRoot,\n      props.uiRootExtension,\n      props.logger,\n      props.publicDir,\n      props.startPlugins\n    );\n  }\n}\n"]}
+{"version":3,"sources":["ui-server.ts"],"names":["UIServer","constructor","graphql","expressExtension","ui","uiRoot","uiRootExtension","logger","publicDir","plugins","Promise","resolve","setReady","getName","name","port","_port","host","fullUrl","buildOptions","getDevConfig","aspects","resolveAspects","UIRuntime","path","generateRoot","whenReady","all","startPromise","map","x","start","portRange","app","createApp","root","server","createServer","configureProxy","use","express","static","index","Port","getPortFromRange","setupServerSideRendering","listen","info","getPluginsComponents","plugin","render","ssr","ssrMiddleware","title","warn","get","debug","proxServer","httpProxy","createProxyServer","on","e","error","message","proxyEntries","getProxyFromPlugins","req","socket","head","entry","find","proxy","context","some","item","url","ws","target","forEach","route","res","web","originalUrl","dev","devServerPort","selectPort","expressAppPort","config","compiler","devServerConfig","getDevServerConfig","devServer","WebpackDevServer","proxiesByPlugin","getProxy","gqlProxies","changeOrigin","concat","appPort","gqlPort","devServerConf","create","props","startPlugins"],"mappings":"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","sourcesContent":["import { flatten } from 'lodash';\nimport { ExpressMain } from '@teambit/express';\nimport { GraphqlMain } from '@teambit/graphql';\nimport { Logger } from '@teambit/logger';\nimport express, { Express } from 'express';\nimport fallback from 'express-history-api-fallback';\nimport { Port } from '@teambit/toolbox.network.get-port';\nimport { Server } from 'http';\nimport httpProxy from 'http-proxy';\nimport { join } from 'path';\nimport webpack from 'webpack';\nimport WebpackDevServer, { Configuration as WdsConfiguration } from 'webpack-dev-server';\nimport { createSsrMiddleware } from './ssr-middleware';\nimport { StartPlugin } from './start-plugin';\nimport { ProxyEntry, UIRoot } from './ui-root';\nimport { UIRuntime } from './ui.aspect';\nimport { UiMain } from './ui.main.runtime';\n\nimport { devConfig } from './webpack/webpack.dev.config';\n\nexport type UIServerProps = {\n  graphql: GraphqlMain;\n  express: ExpressMain;\n  ui: UiMain;\n  uiRoot: UIRoot;\n  uiRootExtension: string;\n  logger: Logger;\n  publicDir: string;\n  startPlugins: StartPlugin[];\n};\n\nexport type StartOptions = {\n  /**\n   * port range for the UI server to bind. default is a port range of 4000-4200.\n   */\n  portRange?: number[] | number;\n};\n\nexport class UIServer {\n  constructor(\n    private graphql: GraphqlMain,\n    private expressExtension: ExpressMain,\n    private ui: UiMain,\n    private uiRoot: UIRoot,\n    private uiRootExtension: string,\n    private logger: Logger,\n    private publicDir: string,\n    private plugins: StartPlugin[]\n  ) {}\n\n  getName() {\n    return this.uiRoot.name;\n  }\n\n  private _port = 0;\n\n  get port() {\n    return this._port;\n  }\n\n  /** the hostname for the server to listen at. Currently statically 'localhost' */\n  get host() {\n    return 'localhost';\n  }\n\n  /** the server listens at this url */\n  get fullUrl() {\n    const port = this.port !== 80 ? `:${this.port}` : '';\n    return `http://${this.host}${port}`;\n  }\n\n  get buildOptions() {\n    return this.uiRoot.buildOptions;\n  }\n\n  /**\n   * get the webpack configuration of the UI server.\n   */\n  async getDevConfig() {\n    const aspects = await this.uiRoot.resolveAspects(UIRuntime.name);\n\n    return devConfig(this.uiRoot.path, [await this.ui.generateRoot(aspects, this.uiRootExtension)], this.uiRoot.name);\n  }\n\n  private setReady: () => void;\n  private startPromise = new Promise<void>((resolve) => (this.setReady = resolve));\n  get whenReady() {\n    return Promise.all([this.startPromise, ...this.plugins.map((x) => x?.whenReady)]);\n  }\n\n  /**\n   * start a UI server.\n   */\n  async start({ portRange }: StartOptions = {}) {\n    const app = this.expressExtension.createApp();\n    const publicDir = `/${this.publicDir}`;\n    const root = join(this.uiRoot.path, publicDir);\n    const server = await this.graphql.createServer({ app });\n\n    // set up proxy, for things like preview, e.g. '/preview/teambit.react/react'\n    await this.configureProxy(app, server);\n\n    // pass through files from public /folder:\n    // setting `index: false` so index.html will be served by the fallback() middleware\n    app.use(express.static(root, { index: false }));\n\n    const port = await Port.getPortFromRange(portRange || [3100, 3200]);\n\n    await this.setupServerSideRendering({ root, port, app });\n\n    // in any and all other cases, serve index.html.\n    // No any other endpoints past this will execute\n    app.use(fallback('index.html', { root }));\n\n    server.listen(port);\n    this._port = port;\n\n    // important: we use the string of the following message for the http.e2e.ts. if you change the message,\n    // please make sure you change the `HTTP_SERVER_READY_MSG` const.\n    this.logger.info(`UI server of ${this.uiRootExtension} is listening to port ${port}`);\n\n    this.setReady();\n  }\n\n  getPluginsComponents() {\n    return this.plugins.map((plugin) => plugin.render);\n  }\n\n  private async setupServerSideRendering({ root, port, app }: { root: string; port: number; app: Express }) {\n    if (!this.buildOptions?.ssr) return;\n\n    const ssrMiddleware = await createSsrMiddleware({\n      root,\n      port,\n      title: this.uiRoot.name,\n      logger: this.logger,\n    });\n\n    if (!ssrMiddleware) {\n      this.logger.warn('[ssr] middleware failed setup');\n      return;\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-misused-promises\n    app.get('*', ssrMiddleware);\n    this.logger.debug('[ssr] serving for \"*\"');\n  }\n\n  private async configureProxy(app: Express, server: Server) {\n    const proxServer = httpProxy.createProxyServer();\n    proxServer.on('error', (e) => this.logger.error(e.message));\n    const proxyEntries = await this.getProxyFromPlugins();\n    server.on('upgrade', function (req, socket, head) {\n      const entry = proxyEntries.find((proxy) => proxy.context.some((item) => item === req.url));\n      if (!entry) return;\n      proxServer.ws(req, socket, head, {\n        target: entry.target,\n      });\n    });\n\n    proxyEntries.forEach((entry) => {\n      entry.context.forEach((route) => {\n        app.use(`${route}/*`, (req, res) => {\n          proxServer.web(req, res, { ...entry, target: `${entry.target}/${req.originalUrl}` });\n        });\n      });\n    });\n  }\n\n  /**\n   * start a UI dev server.\n   */\n  async dev({ portRange }: StartOptions = {}) {\n    const devServerPort = await this.selectPort(portRange);\n    await this.start({ portRange: [4100, 4200] });\n    const expressAppPort = this._port;\n\n    const config = await this.getDevConfig();\n    const compiler = webpack(config);\n    const devServerConfig = await this.getDevServerConfig(devServerPort, expressAppPort, config.devServer);\n    // @ts-ignore in the capsules it throws an error about compatibilities issues between webpack.compiler and webpackDevServer/webpack/compiler\n    const devServer = new WebpackDevServer(devServerConfig, compiler);\n\n    await devServer.start();\n    this._port = devServerPort;\n    return devServer;\n  }\n\n  private async selectPort(portRange?: number[] | number) {\n    return Port.getPortFromRange(portRange || [3100, 3200]);\n  }\n\n  private async getProxyFromPlugins(): Promise<ProxyEntry[]> {\n    const proxiesByPlugin = this.plugins.map((plugin) => {\n      return plugin.getProxy ? plugin.getProxy() : [];\n    });\n\n    return flatten(await Promise.all(proxiesByPlugin));\n  }\n\n  private async getProxy(port = 4000) {\n    const proxyEntries = await this.getProxyFromPlugins();\n\n    const gqlProxies: ProxyEntry[] = [\n      {\n        context: ['/graphql', '/api'],\n        target: `http://${this.host}:${port}`,\n        changeOrigin: true,\n      },\n      {\n        context: ['/subscriptions'],\n        target: `ws://${this.host}:${port}`,\n        ws: true,\n      },\n    ];\n\n    return gqlProxies.concat(proxyEntries);\n  }\n\n  private async getDevServerConfig(\n    appPort: number,\n    gqlPort: number,\n    config?: WdsConfiguration\n  ): Promise<WdsConfiguration> {\n    const proxy = await this.getProxy(gqlPort);\n    const devServerConf = { ...config, proxy, port: appPort };\n\n    return devServerConf;\n  }\n\n  static create(props: UIServerProps) {\n    return new UIServer(\n      props.graphql,\n      props.express,\n      props.ui,\n      props.uiRoot,\n      props.uiRootExtension,\n      props.logger,\n      props.publicDir,\n      props.startPlugins\n    );\n  }\n}\n"]}

package/dist/ui.ui.runtime.d.ts

@@ -3,14 +3,10 @@ import { SlotRegistry } from '@teambit/harmony';
 import type { ReactRouterUI } from '@teambit/react-router';
 import React, { ReactNode, ComponentType } from 'react';
 import { UIRootFactory } from './ui-root.ui';
-import type { SsrContent } from './ssr/ssr-content';
-import { RenderLifecycle } from './render-lifecycle';
-export declare type ContextProps<T = any> = {
-    renderCtx?: T;
-    children: ReactNode;
-};
+import type { SsrContent } from './react-ssr/ssr-content';
+import { ContextProps, RenderPlugins } from './react-ssr/render-lifecycle';
 declare type HudSlot = SlotRegistry<ReactNode>;
-declare type renderLifecycleSlot = SlotRegistry<RenderLifecycle>;
+declare type RenderPluginsSlot = SlotRegistry<RenderPlugins>;
 declare type UIRootRegistry = SlotRegistry<UIRootFactory>;
 /**
  * extension
@@ -27,7 +23,7 @@ export declare class UiUI {
     /** slot for overlay ui elements */
     private hudSlot;
     /** hooks into the ssr render process */
-    private lifecycleSlot;
+    private renderPluginsSlot;
     constructor(
     /**
      * react-router extension.
@@ -40,11 +36,11 @@ export declare class UiUI {
     /** slot for overlay ui elements */
     hudSlot: HudSlot, 
     /** hooks into the ssr render process */
-    lifecycleSlot: renderLifecycleSlot);
+    renderPluginsSlot: RenderPluginsSlot);
     /** render and rehydrate client-side */
     render(rootExtension: string): Promise<void>;
     /** render dehydrated server-side */
-    renderSsr(rootExtension: string, { assets, browser, server }?: SsrContent): Promise<string>;
+    renderSsr(rootExtension: string, ssrContent: SsrContent): Promise<string>;
     /** adds elements to the Heads Up Display */
     registerHudItem: (element: ReactNode) => void;
     /**
@@ -53,19 +49,11 @@ export declare class UiUI {
      */
     registerContext<T>(context: ComponentType<ContextProps<T>>): void;
     registerRoot(uiRoot: UIRootFactory): void;
-    registerRenderHooks<T, Y>(hooks: RenderLifecycle<T, Y>): void;
-    private triggerBrowserInit;
-    private triggerServerInit;
-    private getReactContexts;
-    private onBeforeRender;
-    private triggerBeforeHydrateHook;
-    private triggerHydrateHook;
-    private serialize;
-    private deserialize;
+    registerRenderHooks<T, Y>(hooks: RenderPlugins<T, Y>): void;
     private getRoot;
     static slots: ((registerFn: () => string) => SlotRegistry<React.ReactNode>)[];
     static dependencies: import("@teambit/harmony").Aspect[];
     static runtime: import("@teambit/harmony").RuntimeDefinition;
-    static provider([GraphqlUi, router]: [GraphqlUI, ReactRouterUI], config: any, [uiRootSlot, hudSlot, renderLifecycleSlot]: [UIRootRegistry, HudSlot, renderLifecycleSlot]): Promise<UiUI>;
+    static provider([GraphqlUi, router]: [GraphqlUI, ReactRouterUI], config: any, [uiRootSlot, hudSlot, renderLifecycleSlot]: [UIRootRegistry, HudSlot, RenderPluginsSlot]): Promise<UiUI>;
 }
 export {};

package/dist/ui.ui.runtime.js

@@ -53,26 +53,6 @@ function _reactRouter() {
   return data;
 }
 
-function _uiFoundationUiRendering() {
-  const data = require("@teambit/ui-foundation.ui.rendering.html");
-
-  _uiFoundationUiRendering = function () {
-    return data;
-  };
-
-  return data;
-}
-
-function _webpackMerge() {
-  const data = require("webpack-merge");
-
-  _webpackMerge = function () {
-    return data;
-  };
-
-  return data;
-}
-
 function _react() {
   const data = _interopRequireDefault(require("react"));
 
@@ -83,60 +63,30 @@ function _react() {
   return data;
 }
 
-function _reactDom() {
-  const data = _interopRequireDefault(require("react-dom"));
-
-  _reactDom = function () {
-    return data;
-  };
-
-  return data;
-}
-
-function _server() {
-  const data = _interopRequireDefault(require("react-dom/server"));
-
-  _server = function () {
-    return data;
-  };
-
-  return data;
-}
-
-function _lodash() {
-  const data = _interopRequireDefault(require("lodash.compact"));
-
-  _lodash = function () {
-    return data;
-  };
-
-  return data;
-}
-
-function _compose() {
-  const data = require("./compose");
+function _ui() {
+  const data = require("./ui.aspect");
 
-  _compose = function () {
+  _ui = function () {
     return data;
   };
 
   return data;
 }
 
-function _ui() {
-  const data = require("./ui.aspect");
+function _clientContext() {
+  const data = require("./ui/client-context");
 
-  _ui = function () {
+  _clientContext = function () {
     return data;
   };
 
   return data;
 }
 
-function _clientContext() {
-  const data = require("./ui/client-context");
+function _reactSsr() {
+  const data = require("./react-ssr/react-ssr");
 
-  _clientContext = function () {
+  _reactSsr = function () {
     return data;
   };
 
@@ -159,11 +109,11 @@ class UiUI {
   /** slot for overlay ui elements */
   hudSlot,
   /** hooks into the ssr render process */
-  lifecycleSlot) {
+  renderPluginsSlot) {
     this.router = router;
     this.uiRootSlot = uiRootSlot;
     this.hudSlot = hudSlot;
-    this.lifecycleSlot = lifecycleSlot;
+    this.renderPluginsSlot = renderPluginsSlot;
     (0, _defineProperty2().default)(this, "registerHudItem", element => {
       this.hudSlot.register(element);
     });
@@ -180,74 +130,26 @@ class UiUI {
       initialLocation
     });
     const hudItems = this.hudSlot.values();
-    const lifecycleHooks = this.lifecycleSlot.toArray(); // TODO - extract the logic from here down as reusable ssr machine
-
-    const deserializedState = await this.deserialize(lifecycleHooks);
-    let renderContexts = await this.triggerBrowserInit(lifecycleHooks, deserializedState);
-    const reactContexts = this.getReactContexts(lifecycleHooks, renderContexts);
-
-    const app = /*#__PURE__*/_react().default.createElement(_compose().Compose, {
-      components: reactContexts
-    }, /*#__PURE__*/_react().default.createElement(_clientContext().ClientContext, null, hudItems, routes));
-
-    renderContexts = await this.triggerBeforeHydrateHook(renderContexts, lifecycleHooks, app);
-    const mountPoint = document.getElementById(_uiFoundationUiRendering().mountPointId); // .render() already runs `.hydrate()` behind the scenes.
-    // in the future, we may want to replace it with .hydrate()
-
-    _reactDom().default.render(app, mountPoint);
-
-    await this.triggerHydrateHook(renderContexts, lifecycleHooks, mountPoint); // remove ssr only styles
-
-    (0, _uiFoundationUiRendering().ssrCleanup)();
+    const lifecycleHooks = this.renderPluginsSlot.toArray();
+    const reactSsr = new (_reactSsr().ReactSSR)(lifecycleHooks);
+    await reactSsr.renderBrowser( /*#__PURE__*/_react().default.createElement(_clientContext().ClientContext, null, hudItems, routes));
   }
   /** render dehydrated server-side */
 
 
-  async renderSsr(rootExtension, {
-    assets,
-    browser,
-    server
-  } = {}) {
+  async renderSsr(rootExtension, ssrContent) {
+    var _ssrContent$browser;
+
     const rootFactory = this.getRoot(rootExtension);
     if (!rootFactory) throw new Error(`root: ${rootExtension} was not found`);
     const uiRoot = rootFactory();
     const routes = this.router.renderRoutes(uiRoot.routes, {
-      initialLocation: browser === null || browser === void 0 ? void 0 : browser.location.url
+      initialLocation: ssrContent === null || ssrContent === void 0 ? void 0 : (_ssrContent$browser = ssrContent.browser) === null || _ssrContent$browser === void 0 ? void 0 : _ssrContent$browser.location.url
     });
-    const hudItems = this.hudSlot.values(); // create array once to keep consistent indexes
-
-    const lifecycleHooks = this.lifecycleSlot.toArray(); // TODO - extract the logic from here down as reusable ssr machine
-    // (1) init
-
-    let renderContexts = await this.triggerServerInit(lifecycleHooks, browser, server);
-    const reactContexts = this.getReactContexts(lifecycleHooks, renderContexts); // (2) make (virtual) dom
-
-    const app = /*#__PURE__*/_react().default.createElement(_uiFoundationUiRendering().MountPoint, null, /*#__PURE__*/_react().default.createElement(_compose().Compose, {
-      components: reactContexts
-    }, /*#__PURE__*/_react().default.createElement(_clientContext().ClientContext, null, hudItems, routes))); // (3) render
-
-
-    renderContexts = await this.onBeforeRender(renderContexts, lifecycleHooks, app);
-
-    const renderedApp = _server().default.renderToString(app); // (3) render html-template
-
-
-    const realtimeAssets = await this.serialize(lifecycleHooks, renderContexts, app); // @ts-ignore // TODO upgrade 'webpack-merge'
-
-    const totalAssets = (0, _webpackMerge().merge)(assets, realtimeAssets);
-
-    const html = /*#__PURE__*/_react().default.createElement(_uiFoundationUiRendering().Html, {
-      assets: totalAssets,
-      withDevTools: true,
-      fullHeight: true,
-      ssr: true
-    });
-
-    const renderedHtml = `<!DOCTYPE html>${_server().default.renderToStaticMarkup(html)}`;
-
-    const fullHtml = _uiFoundationUiRendering().Html.fillContent(renderedHtml, renderedApp); // (4) serve
-
-
+    const hudItems = this.hudSlot.values();
+    const lifecycleHooks = this.renderPluginsSlot.toArray();
+    const reactSsr = new (_reactSsr().ReactSSR)(lifecycleHooks);
+    const fullHtml = await reactSsr.renderServer( /*#__PURE__*/_react().default.createElement(_clientContext().ClientContext, null, hudItems, routes), ssrContent);
     return fullHtml;
   }
   /** adds elements to the Heads Up Display */
@@ -258,7 +160,7 @@ class UiUI {
    * @deprecated replace with `.registerRenderHooks({ reactContext })`.
    */
   registerContext(context) {
-    this.lifecycleSlot.register({
+    this.renderPluginsSlot.register({
       reactContext: context
     });
   }
@@ -268,99 +170,7 @@ class UiUI {
   }
 
   registerRenderHooks(hooks) {
-    return this.lifecycleSlot.register(hooks);
-  }
-
-  triggerBrowserInit(lifecycleHooks, deserializedState) {
-    return Promise.all(lifecycleHooks.map(([, hooks], idx) => {
-      var _hooks$browserInit;
-
-      return (_hooks$browserInit = hooks.browserInit) === null || _hooks$browserInit === void 0 ? void 0 : _hooks$browserInit.call(hooks, deserializedState[idx]);
-    }));
-  }
-
-  triggerServerInit(lifecycleHooks, browser, server) {
-    return Promise.all(lifecycleHooks.map(([, hooks]) => {
-      var _hooks$serverInit;
-
-      return (_hooks$serverInit = hooks.serverInit) === null || _hooks$serverInit === void 0 ? void 0 : _hooks$serverInit.call(hooks, {
-        browser,
-        server
-      });
-    }));
-  }
-
-  getReactContexts(lifecycleHooks, renderContexts) {
-    return (0, _lodash().default)(lifecycleHooks.map(([, hooks], idx) => {
-      const renderCtx = renderContexts[idx];
-      const props = {
-        renderCtx
-      };
-      return hooks.reactContext ? [hooks.reactContext, props] : undefined;
-    }));
-  }
-
-  async onBeforeRender(renderContexts, lifecycleHooks, app) {
-    await Promise.all(lifecycleHooks.map(async ([, hooks], idx) => {
-      var _hooks$onBeforeRender;
-
-      const ctx = renderContexts[idx];
-      const nextCtx = await ((_hooks$onBeforeRender = hooks.onBeforeRender) === null || _hooks$onBeforeRender === void 0 ? void 0 : _hooks$onBeforeRender.call(hooks, ctx, app));
-      return nextCtx || ctx;
-    }));
-    return renderContexts;
-  }
-
-  triggerBeforeHydrateHook(renderContexts, lifecycleHooks, app) {
-    return Promise.all(lifecycleHooks.map(async ([, hooks], idx) => {
-      var _hooks$onBeforeHydrat;
-
-      const ctx = renderContexts[idx];
-      const nextCtx = await ((_hooks$onBeforeHydrat = hooks.onBeforeHydrate) === null || _hooks$onBeforeHydrat === void 0 ? void 0 : _hooks$onBeforeHydrat.call(hooks, ctx, app));
-      return nextCtx || ctx;
-    }));
-  }
-
-  async triggerHydrateHook(renderContexts, lifecycleHooks, mountPoint) {
-    await Promise.all(lifecycleHooks.map(([, hooks], idx) => {
-      var _hooks$onHydrate;
-
-      return (_hooks$onHydrate = hooks.onHydrate) === null || _hooks$onHydrate === void 0 ? void 0 : _hooks$onHydrate.call(hooks, renderContexts[idx], mountPoint);
-    }));
-  }
-
-  async serialize(lifecycleHooks, renderContexts, app) {
-    const json = {};
-    await Promise.all(lifecycleHooks.map(async ([key, hooks], idx) => {
-      var _hooks$serialize;
-
-      const renderCtx = renderContexts[idx];
-      const result = await ((_hooks$serialize = hooks.serialize) === null || _hooks$serialize === void 0 ? void 0 : _hooks$serialize.call(hooks, renderCtx, app));
-      if (!result) return;
-      if (result.json) json[key] = result.json;
-    })); // more assets will be available in the future
-
-    return {
-      json
-    };
-  }
-
-  async deserialize(lifecycleHooks) {
-    const rawAssets = _uiFoundationUiRendering().Html.popAssets();
-
-    const deserialized = await Promise.all(lifecycleHooks.map(async ([key, hooks]) => {
-      try {
-        var _hooks$deserialize;
-
-        const raw = rawAssets.get(key);
-        return (_hooks$deserialize = hooks.deserialize) === null || _hooks$deserialize === void 0 ? void 0 : _hooks$deserialize.call(hooks, raw);
-      } catch (e) {
-        // eslint-disable-next-line no-console
-        console.error(`failed deserializing server state for aspect ${key}`, e);
-        return undefined;
-      }
-    }));
-    return deserialized;
+    return this.renderPluginsSlot.register(hooks);
   }
 
   getRoot(rootExtension) {
@@ -369,7 +179,7 @@ class UiUI {
 
   static async provider([GraphqlUi, router], config, [uiRootSlot, hudSlot, renderLifecycleSlot]) {
     const uiUi = new UiUI(router, uiRootSlot, hudSlot, renderLifecycleSlot);
-    uiUi.registerRenderHooks(GraphqlUi.renderHooks);
+    uiUi.registerRenderHooks(GraphqlUi.renderPlugins);
     return uiUi;
   }
 

package/dist/ui.ui.runtime.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ui.ui.runtime.tsx"],"names":["UiUI","constructor","router","uiRootSlot","hudSlot","lifecycleSlot","element","register","render","rootExtension","rootFactory","getRoot","Error","uiRoot","initialLocation","window","location","pathname","search","hash","routes","renderRoutes","hudItems","values","lifecycleHooks","toArray","deserializedState","deserialize","renderContexts","triggerBrowserInit","reactContexts","getReactContexts","app","triggerBeforeHydrateHook","mountPoint","document","getElementById","mountPointId","ReactDOM","triggerHydrateHook","renderSsr","assets","browser","server","url","triggerServerInit","onBeforeRender","renderedApp","ReactDOMServer","renderToString","realtimeAssets","serialize","totalAssets","html","renderedHtml","renderToStaticMarkup","fullHtml","Html","fillContent","registerContext","context","reactContext","registerRoot","registerRenderHooks","hooks","Promise","all","map","idx","browserInit","serverInit","renderCtx","props","undefined","ctx","nextCtx","onBeforeHydrate","onHydrate","json","key","result","rawAssets","popAssets","deserialized","raw","get","e","console","error","provider","GraphqlUi","config","renderLifecycleSlot","uiUi","renderHooks","Slot","withType","GraphqlAspect","ReactRouterAspect","UIRuntime","UIAspect","addRuntime"],"mappings":"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","sourcesContent":["import type { GraphqlUI } from '@teambit/graphql';\nimport { GraphqlAspect } from '@teambit/graphql';\nimport { Slot, SlotRegistry } from '@teambit/harmony';\nimport type { ReactRouterUI } from '@teambit/react-router';\nimport { ReactRouterAspect } from '@teambit/react-router';\nimport { Html, MountPoint, mountPointId, ssrCleanup, Assets } from '@teambit/ui-foundation.ui.rendering.html';\n\nimport { merge } from 'webpack-merge';\nimport React, { ReactNode, ComponentType } from 'react';\nimport ReactDOM from 'react-dom';\nimport ReactDOMServer from 'react-dom/server';\nimport compact from 'lodash.compact';\n\nimport { Compose, Wrapper } from './compose';\nimport { UIRootFactory } from './ui-root.ui';\nimport { UIAspect, UIRuntime } from './ui.aspect';\nimport { ClientContext } from './ui/client-context';\nimport type { SsrContent } from './ssr/ssr-content';\nimport type { RequestServer } from './ssr/request-server';\nimport type { BrowserData } from './ssr/request-browser';\nimport { RenderLifecycle } from './render-lifecycle';\n\nexport type ContextProps<T = any> = { renderCtx?: T; children: ReactNode };\n\ntype HudSlot = SlotRegistry<ReactNode>;\ntype renderLifecycleSlot = SlotRegistry<RenderLifecycle>;\ntype UIRootRegistry = SlotRegistry<UIRootFactory>;\n\n/**\n * extension\n */\nexport class UiUI {\n  constructor(\n    /**\n     * react-router extension.\n     */\n    private router: ReactRouterUI,\n    /**\n     * ui root registry.\n     */\n    private uiRootSlot: UIRootRegistry,\n    /** slot for overlay ui elements */\n    private hudSlot: HudSlot,\n    /** hooks into the ssr render process */\n    private lifecycleSlot: renderLifecycleSlot\n  ) {}\n\n  /** render and rehydrate client-side */\n  async render(rootExtension: string): Promise<void> {\n    const rootFactory = this.getRoot(rootExtension);\n    if (!rootFactory) throw new Error(`root: ${rootExtension} was not found`);\n    const uiRoot = rootFactory();\n    const initialLocation = `${window.location.pathname}${window.location.search}${window.location.hash}`;\n    const routes = this.router.renderRoutes(uiRoot.routes, { initialLocation });\n    const hudItems = this.hudSlot.values();\n    const lifecycleHooks = this.lifecycleSlot.toArray();\n\n    // TODO - extract the logic from here down as reusable ssr machine\n    const deserializedState = await this.deserialize(lifecycleHooks);\n    let renderContexts = await this.triggerBrowserInit(lifecycleHooks, deserializedState);\n    const reactContexts = this.getReactContexts(lifecycleHooks, renderContexts);\n\n    const app = (\n      <Compose components={reactContexts}>\n        <ClientContext>\n          {hudItems}\n          {routes}\n        </ClientContext>\n      </Compose>\n    );\n\n    renderContexts = await this.triggerBeforeHydrateHook(renderContexts, lifecycleHooks, app);\n\n    const mountPoint = document.getElementById(mountPointId);\n    // .render() already runs `.hydrate()` behind the scenes.\n    // in the future, we may want to replace it with .hydrate()\n    ReactDOM.render(app, mountPoint);\n\n    await this.triggerHydrateHook(renderContexts, lifecycleHooks, mountPoint);\n\n    // remove ssr only styles\n    ssrCleanup();\n  }\n\n  /** render dehydrated server-side */\n  async renderSsr(rootExtension: string, { assets, browser, server }: SsrContent = {}): Promise<string> {\n    const rootFactory = this.getRoot(rootExtension);\n    if (!rootFactory) throw new Error(`root: ${rootExtension} was not found`);\n\n    const uiRoot = rootFactory();\n    const routes = this.router.renderRoutes(uiRoot.routes, { initialLocation: browser?.location.url });\n    const hudItems = this.hudSlot.values();\n\n    // create array once to keep consistent indexes\n    const lifecycleHooks = this.lifecycleSlot.toArray();\n\n    // TODO - extract the logic from here down as reusable ssr machine\n    // (1) init\n    let renderContexts = await this.triggerServerInit(lifecycleHooks, browser, server);\n    const reactContexts = this.getReactContexts(lifecycleHooks, renderContexts);\n\n    // (2) make (virtual) dom\n    const app = (\n      <MountPoint>\n        <Compose components={reactContexts}>\n          <ClientContext>\n            {hudItems}\n            {routes}\n          </ClientContext>\n        </Compose>\n      </MountPoint>\n    );\n\n    // (3) render\n    renderContexts = await this.onBeforeRender(renderContexts, lifecycleHooks, app);\n\n    const renderedApp = ReactDOMServer.renderToString(app);\n\n    // (3) render html-template\n    const realtimeAssets = await this.serialize(lifecycleHooks, renderContexts, app);\n    // @ts-ignore // TODO upgrade 'webpack-merge'\n    const totalAssets = merge(assets, realtimeAssets) as Assets;\n\n    const html = <Html assets={totalAssets} withDevTools fullHeight ssr />;\n    const renderedHtml = `<!DOCTYPE html>${ReactDOMServer.renderToStaticMarkup(html)}`;\n    const fullHtml = Html.fillContent(renderedHtml, renderedApp);\n\n    // (4) serve\n    return fullHtml;\n  }\n\n  /** adds elements to the Heads Up Display */\n  registerHudItem = (element: ReactNode) => {\n    this.hudSlot.register(element);\n  };\n\n  /**\n   * adds global context at the ui root\n   * @deprecated replace with `.registerRenderHooks({ reactContext })`.\n   */\n  registerContext<T>(context: ComponentType<ContextProps<T>>) {\n    this.lifecycleSlot.register({\n      reactContext: context,\n    });\n  }\n\n  registerRoot(uiRoot: UIRootFactory) {\n    return this.uiRootSlot.register(uiRoot);\n  }\n\n  registerRenderHooks<T, Y>(hooks: RenderLifecycle<T, Y>) {\n    return this.lifecycleSlot.register(hooks);\n  }\n\n  private triggerBrowserInit(lifecycleHooks: [string, RenderLifecycle<any, any>][], deserializedState: any[]) {\n    return Promise.all(lifecycleHooks.map(([, hooks], idx) => hooks.browserInit?.(deserializedState[idx])));\n  }\n\n  private triggerServerInit(\n    lifecycleHooks: [string, RenderLifecycle<any, any>][],\n    browser?: BrowserData,\n    server?: RequestServer\n  ) {\n    return Promise.all(lifecycleHooks.map(([, hooks]) => hooks.serverInit?.({ browser, server })));\n  }\n\n  private getReactContexts(lifecycleHooks: [string, RenderLifecycle<any>][], renderContexts: any[]): Wrapper[] {\n    return compact(\n      lifecycleHooks.map(([, hooks], idx) => {\n        const renderCtx = renderContexts[idx];\n        const props = { renderCtx };\n        return hooks.reactContext ? [hooks.reactContext, props] : undefined;\n      })\n    );\n  }\n\n  private async onBeforeRender(\n    renderContexts: any[],\n    lifecycleHooks: [string, RenderLifecycle<any>][],\n    app: JSX.Element\n  ) {\n    await Promise.all(\n      lifecycleHooks.map(async ([, hooks], idx) => {\n        const ctx = renderContexts[idx];\n        const nextCtx = await hooks.onBeforeRender?.(ctx, app);\n        return nextCtx || ctx;\n      })\n    );\n    return renderContexts;\n  }\n\n  private triggerBeforeHydrateHook(\n    renderContexts: any[],\n    lifecycleHooks: [string, RenderLifecycle<any>][],\n    app: JSX.Element\n  ) {\n    return Promise.all(\n      lifecycleHooks.map(async ([, hooks], idx) => {\n        const ctx = renderContexts[idx];\n        const nextCtx = await hooks.onBeforeHydrate?.(ctx, app);\n        return nextCtx || ctx;\n      })\n    );\n  }\n\n  private async triggerHydrateHook(\n    renderContexts: any[],\n    lifecycleHooks: [string, RenderLifecycle<any, any>][],\n    mountPoint: HTMLElement | null\n  ) {\n    await Promise.all(lifecycleHooks.map(([, hooks], idx) => hooks.onHydrate?.(renderContexts[idx], mountPoint)));\n  }\n\n  private async serialize(\n    lifecycleHooks: [string, RenderLifecycle][],\n    renderContexts: any[],\n    app: ReactNode\n  ): Promise<Assets> {\n    const json = {};\n\n    await Promise.all(\n      lifecycleHooks.map(async ([key, hooks], idx) => {\n        const renderCtx = renderContexts[idx];\n        const result = await hooks.serialize?.(renderCtx, app);\n\n        if (!result) return;\n        if (result.json) json[key] = result.json;\n      })\n    );\n\n    // more assets will be available in the future\n    return { json };\n  }\n\n  private async deserialize(lifecycleHooks: [string, RenderLifecycle][]) {\n    const rawAssets = Html.popAssets();\n\n    const deserialized = await Promise.all(\n      lifecycleHooks.map(async ([key, hooks]) => {\n        try {\n          const raw = rawAssets.get(key);\n          return hooks.deserialize?.(raw);\n        } catch (e) {\n          // eslint-disable-next-line no-console\n          console.error(`failed deserializing server state for aspect ${key}`, e);\n          return undefined;\n        }\n      })\n    );\n\n    return deserialized;\n  }\n\n  private getRoot(rootExtension: string) {\n    return this.uiRootSlot.get(rootExtension);\n  }\n\n  static slots = [Slot.withType<UIRootFactory>(), Slot.withType<ReactNode>(), Slot.withType<RenderLifecycle>()];\n\n  static dependencies = [GraphqlAspect, ReactRouterAspect];\n\n  static runtime = UIRuntime;\n\n  static async provider(\n    [GraphqlUi, router]: [GraphqlUI, ReactRouterUI],\n    config,\n    [uiRootSlot, hudSlot, renderLifecycleSlot]: [UIRootRegistry, HudSlot, renderLifecycleSlot]\n  ) {\n    const uiUi = new UiUI(router, uiRootSlot, hudSlot, renderLifecycleSlot);\n\n    uiUi.registerRenderHooks(GraphqlUi.renderHooks);\n\n    return uiUi;\n  }\n}\n\nUIAspect.addRuntime(UiUI);\n"]}
+{"version":3,"sources":["ui.ui.runtime.tsx"],"names":["UiUI","constructor","router","uiRootSlot","hudSlot","renderPluginsSlot","element","register","render","rootExtension","rootFactory","getRoot","Error","uiRoot","initialLocation","window","location","pathname","search","hash","routes","renderRoutes","hudItems","values","lifecycleHooks","toArray","reactSsr","ReactSSR","renderBrowser","renderSsr","ssrContent","browser","url","fullHtml","renderServer","registerContext","context","reactContext","registerRoot","registerRenderHooks","hooks","get","provider","GraphqlUi","config","renderLifecycleSlot","uiUi","renderPlugins","Slot","withType","GraphqlAspect","ReactRouterAspect","UIRuntime","UIAspect","addRuntime"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAMA;AACA;AACA;AACO,MAAMA,IAAN,CAAW;AAChBC,EAAAA,WAAW;AACT;AACJ;AACA;AACYC,EAAAA,MAJC;AAKT;AACJ;AACA;AACYC,EAAAA,UARC;AAST;AACQC,EAAAA,OAVC;AAWT;AACQC,EAAAA,iBAZC,EAaT;AAAA,SATQH,MASR,GATQA,MASR;AAAA,SALQC,UAKR,GALQA,UAKR;AAAA,SAHQC,OAGR,GAHQA,OAGR;AAAA,SADQC,iBACR,GADQA,iBACR;AAAA,6DA6CiBC,OAAD,IAAwB;AACxC,WAAKF,OAAL,CAAaG,QAAb,CAAsBD,OAAtB;AACD,KA/CC;AAAE;AAEJ;;;AACY,QAANE,MAAM,CAACC,aAAD,EAAuC;AACjD,UAAMC,WAAW,GAAG,KAAKC,OAAL,CAAaF,aAAb,CAApB;AACA,QAAI,CAACC,WAAL,EAAkB,MAAM,IAAIE,KAAJ,CAAW,SAAQH,aAAc,gBAAjC,CAAN;AAClB,UAAMI,MAAM,GAAGH,WAAW,EAA1B;AACA,UAAMI,eAAe,GAAI,GAAEC,MAAM,CAACC,QAAP,CAAgBC,QAAS,GAAEF,MAAM,CAACC,QAAP,CAAgBE,MAAO,GAAEH,MAAM,CAACC,QAAP,CAAgBG,IAAK,EAApG;AACA,UAAMC,MAAM,GAAG,KAAKlB,MAAL,CAAYmB,YAAZ,CAAyBR,MAAM,CAACO,MAAhC,EAAwC;AAAEN,MAAAA;AAAF,KAAxC,CAAf;AACA,UAAMQ,QAAQ,GAAG,KAAKlB,OAAL,CAAamB,MAAb,EAAjB;AACA,UAAMC,cAAc,GAAG,KAAKnB,iBAAL,CAAuBoB,OAAvB,EAAvB;AAEA,UAAMC,QAAQ,GAAG,KAAIC,oBAAJ,EAAaH,cAAb,CAAjB;AACA,UAAME,QAAQ,CAACE,aAAT,eACJ,+BAAC,8BAAD,QACGN,QADH,EAEGF,MAFH,CADI,CAAN;AAMD;AAED;;;AACe,QAATS,SAAS,CAACpB,aAAD,EAAwBqB,UAAxB,EAAiE;AAAA;;AAC9E,UAAMpB,WAAW,GAAG,KAAKC,OAAL,CAAaF,aAAb,CAApB;AACA,QAAI,CAACC,WAAL,EAAkB,MAAM,IAAIE,KAAJ,CAAW,SAAQH,aAAc,gBAAjC,CAAN;AAElB,UAAMI,MAAM,GAAGH,WAAW,EAA1B;AACA,UAAMU,MAAM,GAAG,KAAKlB,MAAL,CAAYmB,YAAZ,CAAyBR,MAAM,CAACO,MAAhC,EAAwC;AAAEN,MAAAA,eAAe,EAAEgB,UAAF,aAAEA,UAAF,8CAAEA,UAAU,CAAEC,OAAd,wDAAE,oBAAqBf,QAArB,CAA8BgB;AAAjD,KAAxC,CAAf;AACA,UAAMV,QAAQ,GAAG,KAAKlB,OAAL,CAAamB,MAAb,EAAjB;AAEA,UAAMC,cAAc,GAAG,KAAKnB,iBAAL,CAAuBoB,OAAvB,EAAvB;AAEA,UAAMC,QAAQ,GAAG,KAAIC,oBAAJ,EAAaH,cAAb,CAAjB;AACA,UAAMS,QAAQ,GAAG,MAAMP,QAAQ,CAACQ,YAAT,eACrB,+BAAC,8BAAD,QACGZ,QADH,EAEGF,MAFH,CADqB,EAKrBU,UALqB,CAAvB;AAQA,WAAOG,QAAP;AACD;AAED;;;AAKA;AACF;AACA;AACA;AACEE,EAAAA,eAAe,CAAIC,OAAJ,EAA6C;AAC1D,SAAK/B,iBAAL,CAAuBE,QAAvB,CAAgC;AAC9B8B,MAAAA,YAAY,EAAED;AADgB,KAAhC;AAGD;;AAEDE,EAAAA,YAAY,CAACzB,MAAD,EAAwB;AAClC,WAAO,KAAKV,UAAL,CAAgBI,QAAhB,CAAyBM,MAAzB,CAAP;AACD;;AAED0B,EAAAA,mBAAmB,CAAOC,KAAP,EAAmC;AACpD,WAAO,KAAKnC,iBAAL,CAAuBE,QAAvB,CAAgCiC,KAAhC,CAAP;AACD;;AAEO7B,EAAAA,OAAO,CAACF,aAAD,EAAwB;AACrC,WAAO,KAAKN,UAAL,CAAgBsC,GAAhB,CAAoBhC,aAApB,CAAP;AACD;;AAQoB,eAARiC,QAAQ,CACnB,CAACC,SAAD,EAAYzC,MAAZ,CADmB,EAEnB0C,MAFmB,EAGnB,CAACzC,UAAD,EAAaC,OAAb,EAAsByC,mBAAtB,CAHmB,EAInB;AACA,UAAMC,IAAI,GAAG,IAAI9C,IAAJ,CAASE,MAAT,EAAiBC,UAAjB,EAA6BC,OAA7B,EAAsCyC,mBAAtC,CAAb;AAEAC,IAAAA,IAAI,CAACP,mBAAL,CAAyBI,SAAS,CAACI,aAAnC;AAEA,WAAOD,IAAP;AACD;;AArGe;;;gCAAL9C,I,WAqFI,CAACgD,gBAAKC,QAAL,EAAD,EAAiCD,gBAAKC,QAAL,EAAjC,EAA6DD,gBAAKC,QAAL,EAA7D,C;gCArFJjD,I,kBAuFW,CAACkD,wBAAD,EAAgBC,gCAAhB,C;gCAvFXnD,I,aAyFMoD,e;;AAenBC,eAASC,UAAT,CAAoBtD,IAApB","sourcesContent":["import type { GraphqlUI } from '@teambit/graphql';\nimport { GraphqlAspect } from '@teambit/graphql';\nimport { Slot, SlotRegistry } from '@teambit/harmony';\nimport type { ReactRouterUI } from '@teambit/react-router';\nimport { ReactRouterAspect } from '@teambit/react-router';\n\nimport React, { ReactNode, ComponentType } from 'react';\n\nimport { UIRootFactory } from './ui-root.ui';\nimport { UIAspect, UIRuntime } from './ui.aspect';\nimport { ClientContext } from './ui/client-context';\nimport type { SsrContent } from './react-ssr/ssr-content';\nimport { ContextProps, RenderPlugins } from './react-ssr/render-lifecycle';\nimport { ReactSSR } from './react-ssr/react-ssr';\n\ntype HudSlot = SlotRegistry<ReactNode>;\ntype RenderPluginsSlot = SlotRegistry<RenderPlugins>;\ntype UIRootRegistry = SlotRegistry<UIRootFactory>;\n\n/**\n * extension\n */\nexport class UiUI {\n  constructor(\n    /**\n     * react-router extension.\n     */\n    private router: ReactRouterUI,\n    /**\n     * ui root registry.\n     */\n    private uiRootSlot: UIRootRegistry,\n    /** slot for overlay ui elements */\n    private hudSlot: HudSlot,\n    /** hooks into the ssr render process */\n    private renderPluginsSlot: RenderPluginsSlot\n  ) {}\n\n  /** render and rehydrate client-side */\n  async render(rootExtension: string): Promise<void> {\n    const rootFactory = this.getRoot(rootExtension);\n    if (!rootFactory) throw new Error(`root: ${rootExtension} was not found`);\n    const uiRoot = rootFactory();\n    const initialLocation = `${window.location.pathname}${window.location.search}${window.location.hash}`;\n    const routes = this.router.renderRoutes(uiRoot.routes, { initialLocation });\n    const hudItems = this.hudSlot.values();\n    const lifecycleHooks = this.renderPluginsSlot.toArray();\n\n    const reactSsr = new ReactSSR(lifecycleHooks);\n    await reactSsr.renderBrowser(\n      <ClientContext>\n        {hudItems}\n        {routes}\n      </ClientContext>\n    );\n  }\n\n  /** render dehydrated server-side */\n  async renderSsr(rootExtension: string, ssrContent: SsrContent): Promise<string> {\n    const rootFactory = this.getRoot(rootExtension);\n    if (!rootFactory) throw new Error(`root: ${rootExtension} was not found`);\n\n    const uiRoot = rootFactory();\n    const routes = this.router.renderRoutes(uiRoot.routes, { initialLocation: ssrContent?.browser?.location.url });\n    const hudItems = this.hudSlot.values();\n\n    const lifecycleHooks = this.renderPluginsSlot.toArray();\n\n    const reactSsr = new ReactSSR(lifecycleHooks);\n    const fullHtml = await reactSsr.renderServer(\n      <ClientContext>\n        {hudItems}\n        {routes}\n      </ClientContext>,\n      ssrContent\n    );\n\n    return fullHtml;\n  }\n\n  /** adds elements to the Heads Up Display */\n  registerHudItem = (element: ReactNode) => {\n    this.hudSlot.register(element);\n  };\n\n  /**\n   * adds global context at the ui root\n   * @deprecated replace with `.registerRenderHooks({ reactContext })`.\n   */\n  registerContext<T>(context: ComponentType<ContextProps<T>>) {\n    this.renderPluginsSlot.register({\n      reactContext: context,\n    });\n  }\n\n  registerRoot(uiRoot: UIRootFactory) {\n    return this.uiRootSlot.register(uiRoot);\n  }\n\n  registerRenderHooks<T, Y>(hooks: RenderPlugins<T, Y>) {\n    return this.renderPluginsSlot.register(hooks);\n  }\n\n  private getRoot(rootExtension: string) {\n    return this.uiRootSlot.get(rootExtension);\n  }\n\n  static slots = [Slot.withType<UIRootFactory>(), Slot.withType<ReactNode>(), Slot.withType<RenderPlugins>()];\n\n  static dependencies = [GraphqlAspect, ReactRouterAspect];\n\n  static runtime = UIRuntime;\n\n  static async provider(\n    [GraphqlUi, router]: [GraphqlUI, ReactRouterUI],\n    config,\n    [uiRootSlot, hudSlot, renderLifecycleSlot]: [UIRootRegistry, HudSlot, RenderPluginsSlot]\n  ) {\n    const uiUi = new UiUI(router, uiRootSlot, hudSlot, renderLifecycleSlot);\n\n    uiUi.registerRenderHooks(GraphqlUi.renderPlugins);\n\n    return uiUi;\n  }\n}\n\nUIAspect.addRuntime(UiUI);\n"]}