vxrn 0.0.0

package/src/dev/createDevServer.ts

@@ -0,0 +1,243 @@
+import mime from 'mime/lite'
+
+import { HMRListener, StartOptions } from '../types'
+import { DEFAULT_PORT } from '../utils/constants'
+import { Server, createServer } from '../vendor/repack/dev-server/src'
+
+export async function createDevServer(
+  options: StartOptions,
+  {
+    indexJson,
+    listenForHMR,
+    getIndexBundle,
+    hotUpdatedCJSFiles,
+  }: {
+    indexJson: Object
+    getIndexBundle: () => Promise<string>
+    listenForHMR: (cb: HMRListener) => void
+    hotUpdatedCJSFiles: Map<string, string>
+  }
+) {
+  return await createServer({
+    options: {
+      rootDir: options.root,
+      host: options.host,
+      port: options.port ?? DEFAULT_PORT,
+      // https: args.https
+      //   ? {
+      //       cert: args.cert,
+      //       key: args.key,
+      //     }
+      //   : undefined,
+    },
+
+    delegate: (ctx): Server.Delegate => {
+      // if (args.interactive) {
+      //   bindKeypressInput(ctx)
+      // }
+
+      // if (reversePort && args.port) {
+      //   runAdbReverse(ctx, args.port)
+      // }
+
+      // let lastStats: webpack.StatsCompilation | undefined
+
+      // compiler.on('watchRun', ({ platform }) => {
+      //   ctx.notifyBuildStart(platform)
+      //   if (platform === 'android') {
+      //     runAdbReverse(ctx, args.port ?? DEFAULT_PORT)
+      //   }
+      // })
+
+      // compiler.on('invalid', ({ platform }) => {
+      //   ctx.notifyBuildStart(platform)
+      //   ctx.broadcastToHmrClients({ action: 'building' }, platform)
+      // })
+
+      const platform = 'ios'
+      listenForHMR((update) => {
+        ctx.notifyBuildEnd(platform)
+        ctx.broadcastToHmrClients(
+          {
+            action: 'built',
+            body: createHmrBody({
+              errors: [],
+              warnings: [],
+              hash: `${Math.random()}`,
+              modules: {},
+              name: '',
+              time: 0,
+            }),
+          },
+          platform
+        )
+      })
+
+      return {
+        hotFiles: {
+          getSource: (path) => {
+            const next = hotUpdatedCJSFiles.get(path)
+            // hotUpdatedCJSFiles.delete(path) // memory leak prevent
+            return next || ''
+          },
+        },
+
+        compiler: {
+          getAsset: async (filename, platform, sendProgress) => {
+            console.log('[GET] - ', filename)
+            if (filename === 'index.bundle') {
+              return await getIndexBundle()
+            }
+            return ''
+            // return (await compiler.getAsset(filename, platform, sendProgress)).data
+          },
+
+          getMimeType: (filename) => {
+            return mime.getType(filename) || 'application/javascript'
+          },
+
+          inferPlatform: (uri) => {
+            return 'ios'
+
+            const url = new URL(uri, 'protocol://domain')
+            if (!url.searchParams.get('platform')) {
+              const [, platform] = /^\/(.+)\/.+$/.exec(url.pathname) ?? []
+              return platform
+            }
+
+            return undefined
+          },
+        },
+
+        symbolicator: {
+          getSource: async (fileUrl) => {
+            console.log('get source', fileUrl)
+            // const { filename, platform } = parseFileUrl(fileUrl)
+            // return compiler.getSource(filename, platform)
+            return ''
+          },
+          getSourceMap: async (fileUrl) => {
+            // const { filename, platform } = parseFileUrl(fileUrl)
+            // if (!platform) {
+            //   throw new Error('Cannot infer platform for file URL')
+            // }
+
+            // return compiler.getSourceMap(filename, platform)
+            return ''
+          },
+          shouldIncludeFrame: (frame) => {
+            // If the frame points to internal bootstrap/module system logic, skip the code frame.
+            return !/webpack[/\\]runtime[/\\].+\s/.test(frame.file)
+          },
+        },
+
+        hmr: {
+          getUriPath: () => '/__hmr',
+          onClientConnected: (platform, clientId) => {
+            // biome-ignore lint/suspicious/noConsoleLog: <explanation>
+            // todo
+            // const lastStats = {}
+            // ctx.broadcastToHmrClients(
+            //   { action: 'sync', body: createHmrBody(lastStats) },
+            //   platform,
+            //   [clientId]
+            // )
+          },
+        },
+
+        messages: {
+          getHello: () => indexJson,
+          getStatus: () => 'packager-status:running',
+        },
+
+        logger: {
+          onMessage: (log) => {
+            const logEntry = makeLogEntryFromFastifyLog(log)
+            logEntry.issuer = 'DevServer'
+
+            // ignore for now
+            if (logEntry.type === 'debug') return
+
+            // error DevServer, warn DevServer
+            // biome-ignore lint/suspicious/noConsoleLog: <explanation>
+            console.log(
+              '[logger]',
+              logEntry.type === 'info' ? '' : logEntry.type,
+              logEntry.message
+                .map((m) => {
+                  return `${m.msg}`
+                })
+                .join(', ')
+            )
+            // reporter.process(logEntry)
+          },
+        },
+
+        api: {
+          // getPlatforms: async () => Object.keys(compiler.workers),
+          getPlatforms: async () => ['ios'],
+          getAssets: async (platform) => {
+            console.log('get assets', platform)
+            return []
+            // return Object.entries(compiler.assetsCache[platform] ?? {}).map(([name, asset]) => ({
+            //   name,
+            //   size: asset.info.size,
+            // })),
+          },
+          getCompilationStats: async (platform) => {
+            return null
+            // return compiler.statsCache[platform] ?? null
+          },
+        },
+      }
+    },
+  })
+}
+
+function createHmrBody(body: HMRMessageBody): HMRMessageBody | null {
+  return body
+}
+
+/**
+ * Represent Hot Module Replacement Update body.
+ *
+ * @internal
+ */
+export interface HMRMessageBody {
+  name: string
+  time: number
+  hash: string
+  warnings: any
+  errors: any
+  modules: Record<string, string>
+}
+
+/**
+ * Represent Hot Module Replacement Update message.
+ *
+ * @internal
+ */
+export interface HMRMessage {
+  action: 'building' | 'built' | 'sync'
+  body: HMRMessageBody | null
+}
+
+function makeLogEntryFromFastifyLog(data: any): any {
+  const { level, time, pid, hostname, ...rest } = data
+
+  const levelToTypeMapping: Record<number, any> = {
+    10: 'debug',
+    20: 'debug',
+    30: 'info',
+    40: 'warn',
+    50: 'error',
+    60: 'error',
+  }
+
+  return {
+    type: levelToTypeMapping[level],
+    timestamp: time,
+    issuer: '',
+    message: [rest],
+  }
+}

package/src/getVitePath.ts

@@ -0,0 +1,47 @@
+import { join, relative, dirname } from 'path'
+
+import resolve from 'esm-resolve'
+import { realpath } from 'fs-extra'
+
+export async function getVitePath(
+  rootPath: string,
+  importer: string,
+  moduleName: string,
+  absolute = false
+) {
+  // our virtual modules
+  if (moduleName === 'react-native') {
+    return 'react-native'
+  }
+  if (moduleName === 'react') {
+    return 'react'
+  }
+  if (moduleName === 'react/jsx-runtime') {
+    return 'react/jsx-runtime'
+  }
+  if (moduleName === 'react/jsx-dev-runtime') {
+    return 'react/jsx-dev-runtime'
+  }
+
+  if (moduleName[0] === '.') {
+    const rootAt = importer.indexOf(rootPath)
+    const base = join(dirname(importer.slice(rootAt)), moduleName)
+    return base + '.js'
+  } else {
+    const sourceFile = join(process.cwd(), 'index.js')
+    const resolved = resolve(sourceFile)(moduleName)
+    // figure out symlinks
+    if (!resolved) {
+      throw new Error(`❌ cant find`)
+    }
+    const real = await realpath(resolved)
+    let id = real
+    if (!absolute) {
+      id = relative(importer, real)
+    }
+    if (id.endsWith(`/react/jsx-dev-runtime.js`)) {
+      id = 'react/jsx-runtime'
+    }
+    return id
+  }
+}

package/src/index.ts

@@ -0,0 +1,2 @@
+export { create } from './create'
+export { nativePlugin } from './nativePlugin'

package/src/nativePlugin.ts

@@ -0,0 +1,209 @@
+import { dirname } from 'path'
+
+import { parse } from 'es-module-lexer'
+import { OutputOptions } from 'rollup'
+import type { Plugin } from 'vite'
+
+import { getVitePath } from './getVitePath'
+
+const extensions = [
+  '.ios.js',
+  '.native.js',
+  '.native.ts',
+  '.native.tsx',
+  '.js',
+  '.jsx',
+  '.json',
+  '.ts',
+  '.tsx',
+  '.mjs',
+]
+
+export function nativePlugin(options: {
+  root: string
+  port: number
+  mode: 'build' | 'serve'
+}): Plugin {
+  return {
+    name: 'tamagui-native',
+    enforce: 'pre',
+
+    config: async (config) => {
+      config.define ||= {}
+      config.define['process.env.REACT_NATIVE_SERVER_PUBLIC_PORT'] = JSON.stringify(
+        `${options.port}`
+      )
+      config.define['process.env.REACT_NATIVE_PLATFORM'] = JSON.stringify(`ios`)
+
+      if (!config.build) config.build = {}
+
+      config.build.modulePreload = { polyfill: false }
+      // Ensures that even very large assets are inlined in your JavaScript.
+      config.build.assetsInlineLimit = 100000000
+      // Avoid warnings about large chunks.
+      config.build.chunkSizeWarningLimit = 100000000
+      // Emit all CSS as a single file, which `vite-plugin-singlefile` can then inline.
+      config.build.cssCodeSplit = false
+      // Avoids the extra step of testing Brotli compression, which isn't really pertinent to a file served locally.
+      config.build.reportCompressedSize = false
+      // Subfolder bases are not supported, and shouldn't be needed because we're embedding everything.
+      config.base = undefined
+
+      config.resolve ??= {}
+
+      config.resolve.extensions = extensions
+      // config.resolve.conditions = [
+      //   // for rn compat use require over exports
+      //   'require',
+      //   'default',
+      //   'import',
+      // ]
+
+      config.optimizeDeps ??= {}
+
+      config.optimizeDeps.disabled = true
+
+      config.optimizeDeps.esbuildOptions ??= {}
+      config.optimizeDeps.esbuildOptions.resolveExtensions = extensions
+
+      config.optimizeDeps.esbuildOptions.plugins ??= []
+
+      config.optimizeDeps.esbuildOptions.loader ??= {}
+      config.optimizeDeps.esbuildOptions.loader['.js'] = 'jsx'
+
+      config.optimizeDeps.esbuildOptions.plugins.push({
+        name: 'react-native-assets',
+        setup(build) {
+          build.onResolve(
+            {
+              filter: /\.(png|jpg|gif|webp)$/,
+            },
+            async ({ path, namespace }) => {
+              return {
+                path: '',
+                external: true,
+              }
+            }
+          )
+        },
+      })
+
+      config.build.rollupOptions ??= {}
+
+      config.build.rollupOptions.input = config.root
+
+      config.build.rollupOptions.output ??= {}
+
+      config.build.rollupOptions.plugins ??= []
+
+      // config.build.rollupOptions.external = [
+      //   'react-native',
+      //   'react',
+      //   'react/jsx-runtime',
+      //   'react/jsx-dev-runtime',
+      // ]
+
+      if (!Array.isArray(config.build.rollupOptions.plugins)) {
+        throw `x`
+      }
+
+      if (options.mode === 'build') {
+        config.plugins ||= []
+
+        // https://vitejs.dev/config/dep-optimization-options.html
+        // config.build.commonjsOptions ||= {}
+        // config.build.commonjsOptions.include = []
+
+        // CANT DO THIS BECAUSE TAMAGUI PLUGIN DOES THIS! they clobber each other!
+        // config.plugins.push(
+        //   viteCommonjs({
+        //     include: ['escape-string-regexp'],
+        //   })
+        // )
+
+        // config.resolve.alias = {
+        //   ...config.resolve.alias,
+        //   'react-native': virtualModuleId,
+        // }
+
+        config.build.rollupOptions.plugins.push({
+          name: `force-export-all`,
+
+          async transform(code, id) {
+            // if (!id.includes('/node_modules/')) {
+            //   return
+            // }
+
+            try {
+              const [imports, exports] = parse(code)
+
+              let forceExports = ''
+
+              // note that es-module-lexer parses export * from as an import (twice) for some reason
+              let counts = {}
+              for (const imp of imports) {
+                if (imp.n && imp.n[0] !== '.') {
+                  counts[imp.n] ||= 0
+                  counts[imp.n]++
+                  if (counts[imp.n] == 2) {
+                    // star export
+                    const path = await getVitePath(options.root, dirname(id), imp.n)
+                    forceExports += `Object.assign(exports, require("${path}"));`
+                  }
+                }
+              }
+
+              forceExports += exports
+                .map((e) => {
+                  if (e.n === 'default') {
+                    return ''
+                  }
+                  let out = ''
+                  if (e.ln !== e.n) {
+                    // forces the "as x" to be referenced so it gets exported
+                    out += `__ignore = typeof ${e.n} === 'undefined' ? 0 : 0;`
+                  }
+                  out += `globalThis.____forceExport = ${e.ln}`
+                  return out
+                })
+                .join(';')
+
+              return code + '\n' + forceExports
+            } catch (err) {
+              console.warn(`Error forcing exports, probably ok`, id)
+            }
+          },
+        })
+      }
+
+      if (process.env.DEBUG) {
+        // biome-ignore lint/suspicious/noConsoleLog: <explanation>
+        console.log('config..', config)
+      }
+
+      const updateOutputOptions = (out: OutputOptions) => {
+        out.preserveModules = true
+
+        // this fixes some warnings but breaks import { default as config }
+        // out.exports = 'named'
+
+        out.entryFileNames = (chunkInfo) => {
+          // ensures we have clean names for our require paths
+          return '[name].js'
+        }
+        // Ensure that as many resources as possible are inlined.
+        // out.inlineDynamicImports = true
+
+        // added by me (nate):
+        out.manualChunks = undefined
+      }
+
+      if (Array.isArray(config.build.rollupOptions.output)) {
+        for (const o in config.build.rollupOptions.output)
+          updateOutputOptions(o as OutputOptions)
+      } else {
+        updateOutputOptions(config.build.rollupOptions.output as OutputOptions)
+      }
+    },
+  }
+}

package/src/types.ts

@@ -0,0 +1,11 @@
+import { InlineConfig } from 'vite'
+
+export type StartOptions = {
+  root: string
+  host?: string
+  port?: number
+  webConfig?: InlineConfig
+  buildConfig?: InlineConfig
+}
+
+export type HMRListener = (update: { file: string; contents: string }) => void

package/src/utils/constants.ts

@@ -0,0 +1 @@
+export const DEFAULT_PORT = 8081

package/src/utils.ts

@@ -0,0 +1,9 @@
+const disposers = new Set<Function>()
+
+export function registerDispose(cb: () => void) {
+  disposers.add(cb)
+}
+
+export function disposeAll() {
+  disposers.forEach((cb) => cb())
+}

package/src/vendor/debugger-app/index.d.ts

@@ -0,0 +1,2 @@
+const debuggerAppPath: string
+export default debuggerAppPath

package/src/vendor/debugger-app/index.js

@@ -0,0 +1,3 @@
+import { URL, fileURLToPath } from 'url';
+
+export default fileURLToPath(new URL('./dist', import.meta.url));

package/src/vendor/debugger-app/public/index.html

@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" href="data:;base64,iVBORw0KGgo=" />
+    <title>React Native Debugger</title>
+  </head>
+  <body>
+    <!-- <noscript>You need to enable JavaScript to run Learning Lab.</noscript>
+    <div id="root"></div> -->
+    <div class="content">
+      <label for="dark">
+        <input type="checkbox" id="dark" onclick="Page.toggleDarkTheme()" />
+        Dark Theme
+      </label>
+      <label for="maintain-priority">
+        <input
+          type="checkbox"
+          id="maintain-priority"
+          onclick="Page.togglePriorityMaintenance()"
+        />
+        Maintain Priority
+      </label>
+      <p>
+        React Native JS code runs as a web worker inside this tab.
+      </p>
+      <p>
+        Press <kbd id="shortcut" class="shortcut">⌘⌥I</kbd> to open Developer
+        Tools. Enable
+        <a href="https://stackoverflow.com/a/17324511/232122" target="_blank"
+          >Pause On Caught Exceptions</a
+        >
+        for a better debugging experience.
+      </p>
+      <p>
+        You may also install
+        <a href="https://www.npmjs.com/package/react-devtools" target="_blank"
+          >the standalone version of React Developer Tools</a
+        >
+        to inspect the React component hierarchy, their props, and state.
+      </p>
+      <p>Status: <span id="status">Loading...</span></p>
+      <button class="reload-btn" onclick="window.onReloadClicked()">
+        Reload app
+      </button>
+    </div>
+  </body>
+</html>

package/src/vendor/debugger-app/src/debuggerWorker.js

@@ -0,0 +1,84 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+/* global __fbBatchedBridge, importScripts */
+/* eslint no-unused-vars: 0 */
+/* eslint no-restricted-globals: 0 */
+
+onmessage = (function () {
+  var visibilityState;
+  var showVisibilityWarning = (function () {
+    var hasWarned = false;
+    return function () {
+      // Wait until `YellowBox` gets initialized before displaying the warning.
+      if (hasWarned || console.warn.toString().includes('[native code]')) {
+        return;
+      }
+      hasWarned = true;
+      console.warn(
+        'Remote debugger is in a background tab which may cause apps to ' +
+          'perform slowly. Fix this by foregrounding the tab (or opening it in ' +
+          'a separate window).'
+      );
+    };
+  })();
+
+  var messageHandlers = {
+    executeApplicationScript: function (message, sendReply) {
+      for (var key in message.inject) {
+        self[key] = JSON.parse(message.inject[key]);
+      }
+      var error;
+      try {
+        importScripts(message.url);
+      } catch (err) {
+        error = err.message;
+      }
+      sendReply(null /* result */, error);
+    },
+    setDebuggerVisibility: function (message) {
+      visibilityState = message.visibilityState;
+    },
+  };
+
+  return function (message) {
+    if (visibilityState === 'hidden') {
+      showVisibilityWarning();
+    }
+
+    var object = message.data;
+
+    var sendReply = function (result, error) {
+      postMessage({ replyID: object.id, result: result, error: error });
+    };
+
+    var handler = messageHandlers[object.method];
+    if (handler) {
+      // Special cased handlers
+      handler(object, sendReply);
+    } else {
+      // Other methods get called on the bridge
+      var returnValue = [[], [], [], 0];
+      var error;
+      try {
+        if (typeof __fbBatchedBridge === 'object') {
+          returnValue = __fbBatchedBridge[object.method].apply(
+            null,
+            object.arguments
+          );
+        } else {
+          error = 'Failed to call function, __fbBatchedBridge is undefined';
+        }
+      } catch (err) {
+        error = err.message;
+      } finally {
+        sendReply(JSON.stringify(returnValue), error);
+      }
+    }
+  };
+})();