RubyGems - proscenium - Versions diffs - 0.5.1-x86_64-darwin → 0.7.0-x86_64-darwin - Mend

proscenium 0.5.1-x86_64-darwin → 0.7.0-x86_64-darwin

Files changed (60) hide show

checksums.yaml +4 -4
data/README.md +128 -92
data/bin/proscenium +0 -0
data/bin/proscenium.h +109 -0
data/config/routes.rb +0 -3
data/lib/proscenium/css_module/class_names_resolver.rb +66 -0
data/lib/proscenium/css_module/resolver.rb +76 -0
data/lib/proscenium/css_module.rb +18 -39
data/lib/proscenium/esbuild/golib.rb +97 -0
data/lib/proscenium/esbuild.rb +32 -0
data/lib/proscenium/helper.rb +0 -23
data/lib/proscenium/log_subscriber.rb +26 -0
data/lib/proscenium/middleware/base.rb +28 -36
data/lib/proscenium/middleware/esbuild.rb +18 -44
data/lib/proscenium/middleware/url.rb +1 -6
data/lib/proscenium/middleware.rb +12 -16
data/lib/proscenium/phlex/component_concerns.rb +27 -0
data/lib/proscenium/phlex/page.rb +62 -0
data/lib/proscenium/phlex/react_component.rb +52 -8
data/lib/proscenium/phlex/resolve_css_modules.rb +67 -0
data/lib/proscenium/phlex.rb +34 -33
data/lib/proscenium/railtie.rb +41 -67
data/lib/proscenium/side_load/ensure_loaded.rb +25 -0
data/lib/proscenium/side_load/helper.rb +25 -0
data/lib/proscenium/side_load/monkey.rb +48 -0
data/lib/proscenium/side_load.rb +58 -52
data/lib/proscenium/version.rb +1 -1
data/lib/proscenium/view_component/react_component.rb +14 -0
data/lib/proscenium/view_component.rb +28 -18
data/lib/proscenium.rb +79 -2
metadata +35 -72
data/app/channels/proscenium/connection.rb +0 -13
data/app/channels/proscenium/reload_channel.rb +0 -9
data/bin/esbuild +0 -0
data/bin/lightningcss +0 -0
data/lib/proscenium/compiler.js +0 -84
data/lib/proscenium/compilers/esbuild/argument_error.js +0 -24
data/lib/proscenium/compilers/esbuild/compile_error.js +0 -148
data/lib/proscenium/compilers/esbuild/css/postcss.js +0 -67
data/lib/proscenium/compilers/esbuild/css_plugin.js +0 -172
data/lib/proscenium/compilers/esbuild/env_plugin.js +0 -46
data/lib/proscenium/compilers/esbuild/http_bundle_plugin.js +0 -53
data/lib/proscenium/compilers/esbuild/import_map.js +0 -59
data/lib/proscenium/compilers/esbuild/resolve_plugin.js +0 -205
data/lib/proscenium/compilers/esbuild/setup_plugin.js +0 -45
data/lib/proscenium/compilers/esbuild/solidjs_plugin.js +0 -24
data/lib/proscenium/compilers/esbuild.bench.js +0 -14
data/lib/proscenium/compilers/esbuild.js +0 -179
data/lib/proscenium/link_to_helper.rb +0 -40
data/lib/proscenium/middleware/lightningcss.rb +0 -64
data/lib/proscenium/middleware/outside_root.rb +0 -26
data/lib/proscenium/middleware/runtime.rb +0 -22
data/lib/proscenium/middleware/static.rb +0 -14
data/lib/proscenium/phlex/component.rb +0 -9
data/lib/proscenium/precompile.rb +0 -31
data/lib/proscenium/runtime/auto_reload.js +0 -40
data/lib/proscenium/runtime/react_shim/index.js +0 -1
data/lib/proscenium/runtime/react_shim/package.json +0 -5
data/lib/proscenium/utils.js +0 -8
data/lib/tasks/assets.rake +0 -19

data/lib/proscenium/compilers/esbuild/css_plugin.js DELETED Viewed

@@ -1,172 +0,0 @@
-import { crypto } from 'std/crypto/mod.ts'
-import { join, dirname, basename } from 'std/path/mod.ts'
-import { fileExists } from '../../utils.js'
-import postcss from './css/postcss.js'
-import setup from './setup_plugin.js'
-export default setup('css', async (build, options) => {
-  const cwd = build.initialOptions.absWorkingDir
-  let customMedia
-  try {
-    customMedia = await Deno.readTextFile(join(cwd, 'config', 'custom_media_queries.css'))
-  } catch {
-    // do nothing, as we don't require custom media.
-  }
-  return [
-    {
-      type: 'onLoad',
-      filter: /\.css$/,
-      namespace: 'file',
-      async callback(args) {
-        const hash = await digest(args.path.slice(cwd.length))
-        const isCssModule = args.path.endsWith('.module.css')
-        // If path is a CSS module, imported from JS, and a side-loaded ViewComponent stylesheet,
-        // simply return a JS proxy of the class names. The stylesheet itself will have already been
-        // side loaded. This avoids compiling the CSS all over again.
-        if (isCssModule && args.pluginData?.importedFromJs && (await isViewComponent(args.path))) {
-          return {
-            resolveDir: cwd,
-            loader: 'js',
-            contents: cssModulesProxyTemplate(hash)
-          }
-        }
-        let cmd = [
-          options.lightningcssBin,
-          '--nesting',
-          '--error-recovery',
-          args.pluginData?.importedFromJs && '--minify',
-          '--targets',
-          '>= 0.25%'
-        ].filter(Boolean)
-        // This will process the CSS with Postcss only if it needs to.
-        let [tmpFile, contents] = await postcss(cwd, args.path)
-        // As custom media are defined in their own file, we have to append the file contents to our
-        // stylesheet, so that the custom media can be used.
-        if (customMedia) {
-          cmd.push('--custom-media')
-          if (!tmpFile && !contents) {
-            tmpFile = await Deno.makeTempFile()
-            contents = await Deno.readTextFile(args.path)
-          }
-          contents += customMedia
-        }
-        if (tmpFile && contents) {
-          await Deno.writeTextFile(tmpFile, contents)
-        }
-        if (isCssModule) {
-          cmd = cmd.concat(['--css-modules', '--css-modules-pattern', `[local]${hash}`])
-        }
-        const p = Deno.run({
-          cmd: [...cmd, tmpFile || args.path],
-          stdout: 'piped',
-          stderr: 'piped'
-        })
-        const { code } = await p.status()
-        const rawOutput = await p.output()
-        const rawError = await p.stderrOutput()
-        // Even though Deno docs say that reading the outputs (above) closes their pipes, warnings
-        // are raised during tests that the child process have not been closed. So we manually close
-        // here.
-        p.close()
-        // Success!
-        if (code === 0) {
-          let contents = new TextDecoder().decode(rawOutput)
-          if (isCssModule) {
-            contents = JSON.parse(contents)
-          }
-          // If stylesheet is imported from JS, then we return JS code that appends the stylesheet
-          // in a <style> in the <head> of the page, and if the stylesheet is a CSS module, it
-          // exports a plain object of class names.
-          if (args.pluginData?.importedFromJs) {
-            const code = isCssModule ? contents.code : contents
-            const mod = [
-              `let e = document.querySelector('#_${hash}');`,
-              'if (!e) {',
-              "e = document.createElement('style');",
-              `e.id = '_${hash}';`,
-              'document.head.appendChild(e);',
-              `e.appendChild(document.createTextNode(\`${code}\`));`,
-              '}'
-            ]
-            if (isCssModule) {
-              const classes = {}
-              for (const key in contents.exports) {
-                if (Object.hasOwnProperty.call(contents.exports, key)) {
-                  classes[key] = contents.exports[key].name
-                }
-              }
-              mod.push(`export default ${JSON.stringify(classes)};`)
-            }
-            // We are importing from JS, so return the entire result from LightningCSS via the js
-            // loader.
-            return {
-              resolveDir: cwd,
-              loader: 'js',
-              contents: mod.join('')
-            }
-          }
-          return { loader: 'css', contents: isCssModule ? contents.code : contents }
-        } else {
-          const errorString = new TextDecoder().decode(rawError)
-          throw errorString
-        }
-      }
-    }
-  ]
-})
-async function digest(value) {
-  value = new TextEncoder().encode(value)
-  const view = new DataView(await crypto.subtle.digest('SHA-1', value))
-  let hexCodes = ''
-  for (let index = 0; index < view.byteLength; index += 4) {
-    hexCodes += view.getUint32(index).toString(16).padStart(8, '0')
-  }
-  return hexCodes.slice(0, 8)
-}
-async function isViewComponent(path) {
-  const fileName = basename(path)
-  const dirName = dirname(path)
-  return (
-    (fileName === 'component.module.css' && (await fileExists(join(dirName, 'component.rb')))) ||
-    (fileName.endsWith('_component.module.css') &&
-      (await fileExists(join(dirName, fileName.replace(/\.module\.css$/, '.rb')))))
-  )
-}
-function cssModulesProxyTemplate(hash) {
-  return [
-    `export default new Proxy( {}, {`,
-    `  get(target, prop, receiver) {`,
-    `    if (prop in target || typeof prop === 'symbol') {`,
-    `      return Reflect.get(target, prop, receiver)`,
-    `    } else {`,
-    `      return prop + '${hash}'`,
-    `    }`,
-    `  }`,
-    `})`
-  ].join('')
-}

data/lib/proscenium/compilers/esbuild/env_plugin.js DELETED Viewed

@@ -1,46 +0,0 @@
-import setup from './setup_plugin.js'
-// Export environment variables as named exports only. You can also import from `env:ENV_VAR_NAME`,
-// which will return the value of the environment variable as the default export. This allows you to
-// safely import a variable regardless of its existence.
-export default setup('env', () => {
-  return [
-    {
-      type: 'onResolve',
-      filter: /^env(:.+)?$/,
-      callback({ path }) {
-        return { path, namespace: 'env' }
-      }
-    },
-    {
-      type: 'onLoad',
-      filter: /.*/,
-      namespace: 'env',
-      callback({ path }) {
-        if (path.includes(':')) {
-          const name = Deno.env.get(path.split(':')[1])
-          return {
-            loader: 'js',
-            contents: name ? `export default '${name}'` : `export default ${name}`
-          }
-        }
-        const env = Deno.env.toObject()
-        const contents = []
-        for (const key in env) {
-          if (Object.hasOwnProperty.call(env, key)) {
-            contents.push(`export const ${key} = '${env[key]}'`)
-          }
-        }
-        return {
-          loader: 'js',
-          contents: contents.join(';')
-        }
-      }
-    }
-  ]
-})

data/lib/proscenium/compilers/esbuild/http_bundle_plugin.js DELETED Viewed

@@ -1,53 +0,0 @@
-import setup from './setup_plugin.js'
-export default setup('httpBundle', () => {
-  return [
-    {
-      type: 'onResolve',
-      filter: /^https?:\/\//,
-      callback(args) {
-        let queryParams, suffix
-        if (args.path.includes('?')) {
-          const [path, query] = args.path.split('?')
-          queryParams = new URLSearchParams(query)
-          suffix = `?${query}`
-          args.path = path
-        }
-        if (queryParams?.has('bundle')) {
-          return { path: args.path, namespace: 'httpBundle', suffix }
-        } else {
-          return { external: true }
-        }
-      }
-    },
-    // Intercept all import paths inside downloaded files and resolve them against the original URL.
-    {
-      type: 'onResolve',
-      filter: /.*/,
-      namespace: 'httpBundle',
-      callback(args) {
-        return {
-          path: new URL(args.path, args.importer).toString(),
-          namespace: 'httpBundle'
-        }
-      }
-    },
-    // Download and return the content.
-    //
-    // TODO: cache this!
-    {
-      type: 'onLoad',
-      filter: /.*/,
-      namespace: 'httpBundle',
-      async callback(args) {
-        const textResponse = await fetch(args.path)
-        const contents = await textResponse.text()
-        return { contents }
-      }
-    }
-  ]
-})

data/lib/proscenium/compilers/esbuild/import_map.js DELETED Viewed

@@ -1,59 +0,0 @@
-import { join } from 'std/path/mod.ts'
-import { parseFromString } from 'import-maps/resolve'
-const baseURL = new URL('file://')
-class ImportMapError extends Error {
-  constructor(fileName, ...params) {
-    super(...params)
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, ImportMapError)
-    }
-    this.name = 'ImportMapError'
-    this.file = fileName
-  }
-}
-export function readImportMap(fileName, rootDir) {
-  let importMap
-  if (fileName) {
-    importMap = readFile(fileName, rootDir, true)
-  } else {
-    fileName = ['config/import_map.json', 'config/import_map.js'].find(f => {
-      const result = readFile(f, rootDir)
-      if (result) {
-        importMap = result
-        return true
-      }
-    })
-  }
-  return importMap
-}
-function readFile(file, rootDir, required = false) {
-  let contents = null
-  try {
-    contents = Deno.readTextFileSync(join(rootDir, file))
-  } catch (error) {
-    if (required) {
-      throw new ImportMapError(file, error.message, { cause: error })
-    }
-  }
-  if (contents === null) return null
-  try {
-    if (file.endsWith('.js')) {
-      contents = JSON.stringify(eval(contents)(Deno.env.get('RAILS_ENV')))
-    }
-    return parseFromString(contents, baseURL)
-  } catch (error) {
-    throw new ImportMapError(file, error.message, { cause: error })
-  }
-}

data/lib/proscenium/compilers/esbuild/resolve_plugin.js DELETED Viewed

@@ -1,205 +0,0 @@
-import { join, resolve } from 'std/path/mod.ts'
-import { resolve as resolveFromImportMap } from 'import-maps/resolve'
-import { cache } from 'cache'
-import setup from './setup_plugin.js'
-const importKinds = ['import-statement', 'dynamic-import', 'require-call', 'import-rule']
-export default setup('resolve', (build, options) => {
-  const { runtimeDir, importMap } = options
-  const cwd = build.initialOptions.absWorkingDir
-  const runtimeCwdAlias = `${cwd}/proscenium-runtime`
-  let bundled = false
-  const env = Deno.env.get('RAILS_ENV')
-  const isProd = env === 'production'
-  return [
-    {
-      // Filters for imports starting with `url:http://` or `url:https://`; returning the path
-      // without the `url:` prefix, and a namespace of 'url`
-      type: 'onResolve',
-      filter: /^url:https?:\/\//,
-      callback(args) {
-        return {
-          path: args.path.slice(4),
-          namespace: 'url'
-        }
-      }
-    },
-    {
-      type: 'onResolve',
-      filter: /.*/,
-      namespace: 'url',
-      callback(args) {
-        if (!isBareModule(args.path)) {
-          return {
-            path: new URL(args.path, args.importer).toString(),
-            namespace: 'url'
-          }
-        }
-      }
-    },
-    {
-      type: 'onLoad',
-      filter: /.*/,
-      namespace: 'url',
-      async callback(args) {
-        const file = await cache(args.path)
-        const contents = await Deno.readTextFile(file.path)
-        return { contents }
-      }
-    },
-    {
-      type: 'onResolve',
-      filter: /.*/,
-      async callback(args) {
-        if (args.path.includes('?')) {
-          const [path, query] = args.path.split('?')
-          args.path = path
-          args.suffix = `?${query}`
-          args.queryParams = new URLSearchParams(query)
-        } else if (options.cacheQueryString && options.cacheQueryString !== '') {
-          args.suffix = `?${options.cacheQueryString}`
-        }
-        // Mark remote modules as external. If not css, then the path is prefixed with "url:", which
-        // is then handled by the Url Middleware.
-        if (
-          !args.importer.endsWith('.css') &&
-          (args.path.startsWith('http://') || args.path.startsWith('https://'))
-        ) {
-          return { path: `/url:${encodeURIComponent(args.path)}`, external: true }
-        }
-        // Rewrite the path to the actual runtime directory.
-        if (args.path.startsWith(runtimeCwdAlias)) {
-          return { path: join(runtimeDir, args.path.slice(runtimeCwdAlias.length)) }
-        }
-        // Everything else is unbundled.
-        if (importKinds.includes(args.kind)) {
-          return await unbundleImport(args)
-        }
-      }
-    }
-  ]
-  // Resolve the given `params.path` to a path relative to the Rails root.
-  //
-  // Examples:
-  //  'react' -> '/.../node_modules/react/index.js'
-  //  './my_module' -> '/.../app/my_module.js'
-  //  '/app/my_module' -> '/.../app/my_module.js'
-  async function unbundleImport(params) {
-    const result = { path: params.path, suffix: params.suffix }
-    if (importMap) {
-      let baseURL
-      if (params.importer.startsWith('https://') || params.importer.startsWith('http://')) {
-        baseURL = new URL(params.importer)
-      } else {
-        baseURL = new URL(params.importer.slice(cwd.length), 'file://')
-      }
-      const { matched, resolvedImport } = resolveFromImportMap(params.path, importMap, baseURL)
-      if (matched) {
-        if (resolvedImport.protocol === 'file:') {
-          params.path = resolvedImport.pathname
-        } else {
-          if (params.importer.endsWith('.css')) {
-            return { path: resolvedImport.href, external: true }
-          }
-          return { path: `/url:${encodeURIComponent(resolvedImport.href)}`, external: true }
-        }
-      }
-    }
-    // Absolute path - append to current working dir.
-    if (params.path.startsWith('/')) {
-      result.path = resolve(cwd, params.path.slice(1))
-    }
-    const resOptions = {
-      // If path is a bare module (node_modules), and resolveDir is the Proscenium runtime dir, or
-      // is the current working dir, then use `cwd` as the `resolveDir`, otherwise pass it through
-      // as is. This ensures that nested node_modules are resolved correctly.
-      resolveDir:
-        isBareModule(result.path) &&
-        (!params.resolveDir.startsWith(cwd) || params.resolveDir.startsWith(runtimeDir))
-          ? cwd
-          : params.resolveDir,
-      kind: params.kind,
-      pluginData: {
-        // We use this property later on, as we should ignore this resolution call.
-        isResolvingPath: true
-      }
-    }
-    // Resolve the path using esbuild's internal resolution. This allows us to import node packages
-    // and extension-less paths without custom code, as esbuild with resolve them for us.
-    const resolveResult = await build.resolve(result.path, resOptions)
-    // Simple return the resolved result if we have an error. Usually happens when module is not
-    // found.
-    if (resolveResult.errors.length > 0) return resolveResult
-    // If 'bundle-all' queryParam is defined, return the resolveResult.
-    if (bundled || params.queryParams?.has('bundle-all')) {
-      bundled = true
-      return { ...resolveResult, suffix: '?bundle-all' }
-    }
-    // If 'bundle' queryParam is defined, return the resolveResult.
-    if (params.queryParams?.has('bundle')) {
-      return { ...resolveResult, suffix: '?bundle' }
-    }
-    if (resolveResult.path.startsWith(runtimeDir)) {
-      result.path = '/proscenium-runtime' + resolveResult.path.slice(runtimeDir.length)
-    } else if (!resolveResult.path.startsWith(cwd) && !isProd) {
-      // Resolved path is not in the current working directory. It could be linked to a file outside
-      // the CWD, or it's just invalid. If not in production, return as an outsideRoot namespaced,
-      // and externally suffixed path. This lets the Rails Proscenium::Middleware::OutsideRoot
-      // handle the import.
-      return {
-        ...resolveResult,
-        namespace: 'outsideRoot',
-        path: `${resolveResult.path}?outsideRoot`,
-        external: true
-      }
-    } else {
-      result.path = resolveResult.path.slice(cwd.length)
-    }
-    result.sideEffects = resolveResult.sideEffects
-    if (
-      params.path.endsWith('.css') &&
-      params.kind === 'import-statement' &&
-      /\.jsx?$/.test(params.importer)
-    ) {
-      // We're importing a CSS file from JS(X).
-      return { ...resolveResult, pluginData: { importedFromJs: true } }
-    } else {
-      result.external = true
-    }
-    if (result.suffix && result.suffix !== '') {
-      result.path = `${result.path}${result.suffix}`
-    }
-    return result
-  }
-})
-function isBareModule(mod) {
-  return !mod.startsWith('/') && !mod.startsWith('.')
-}

data/lib/proscenium/compilers/esbuild/setup_plugin.js DELETED Viewed

@@ -1,45 +0,0 @@
-export default (pluginName, pluginFn) => {
-  return (options = {}) => ({
-    name: pluginName,
-    async setup(build) {
-      const callbacks = await pluginFn(build, options)
-      callbacks.forEach(({ type, callback, filter, namespace }) => {
-        if (type === 'onResolve') {
-          build.onResolve({ filter, namespace }, async params => {
-            if (params.pluginData?.isResolvingPath) return
-            let results
-            if (options.debug) {
-              console.debug()
-              console.group(`plugin(${pluginName}):onResolve`, { filter, namespace })
-              console.debug('params:', params)
-              try {
-                results = await callback(params)
-                console.debug('results:', results)
-              } finally {
-                console.groupEnd()
-              }
-            } else {
-              results = await callback(params)
-            }
-            return results
-          })
-        } else if (type === 'onLoad') {
-          build.onLoad({ filter, namespace }, async params => {
-            options.debug && console.debug(`plugin(${pluginName}):onLoad`, { params })
-            const results = await callback(params)
-            options.debug && console.debug(`plugin(${pluginName}):onLoad`, { results })
-            return results
-          })
-        }
-      })
-    }
-  })
-}

data/lib/proscenium/compilers/esbuild/solidjs_plugin.js DELETED Viewed

@@ -1,24 +0,0 @@
-import { basename } from 'std/path/mod.ts'
-import { transformAsync } from '@babel/core'
-import solid from 'babel-preset-solid'
-import { setup } from './setup_plugin.js'
-export default setup('solidjs', () => {
-  return [
-    {
-      type: 'onLoad',
-      filter: /\.jsx$/,
-      async callback(args) {
-        const source = await Deno.readTextFile(args.path)
-        const { code } = await transformAsync(source, {
-          presets: [solid],
-          filename: basename(args.path)
-        })
-        return { contents: code, loader: 'js' }
-      }
-    }
-  ]
-})

data/lib/proscenium/compilers/esbuild.bench.js DELETED Viewed

@@ -1,14 +0,0 @@
-import { join } from 'std/path/mod.ts'
-import compile from './esbuild.js'
-const root = join(Deno.cwd(), 'test', 'internal')
-const lightningcssBin = join(Deno.cwd(), 'bin', 'lightningcss')
-Deno.bench('esbuild js', async () => {
-  await compile(['lib/foo.js'], { root, lightningcssBin })
-})
-Deno.bench('esbuild css', async () => {
-  await compile(['lib/foo.css'], { root, lightningcssBin })
-})