zyzz 0.0.0 → 0.0.2

package/src/babel/NativeEdits.ts

@@ -0,0 +1,273 @@
+/** Applies compiler replacements without reparsing unaffected authoring. @module */
+import type * as Babel from '@babel/core'
+import type * as Edits from '../compiler/internal/Edits.js'
+import * as NativeJsx from './NativeJsx.js'
+
+/** Retains original nodes and locations outside compiler-owned spans. */
+export function apply(
+  api: typeof Babel,
+  ast: Babel.types.File,
+  options: Babel.TransformOptions,
+  edits: readonly Edits.Edit[],
+  callables: WeakSet<Babel.types.Node>,
+) {
+  const expressions = edits.filter((edit) => edit.expression)
+  const parse = (source: string) => {
+    const ast = api.parseSync(source, {
+      babelrc: false,
+      configFile: false,
+      filename: options.filename,
+      parserOpts: options.parserOpts,
+    })
+    if (!ast) throw new Error('Babel did not parse native replacements.')
+    return ast.program.body
+  }
+  const compiled = expressions.length
+    ? parse(expressions.map((edit) => `(${edit.code});`).join('\n'))
+    : []
+  const replacements = new Map<
+    number,
+    { end: number; node: Babel.types.Expression }
+  >()
+  for (const [index, edit] of expressions.entries()) {
+    const statement = compiled[index]
+    if (!statement || !api.types.isExpressionStatement(statement))
+      throw new Error('Invalid compiled native expression.')
+    callables.add(statement.expression)
+    replacements.set(edit.start, { end: edit.end, node: statement.expression })
+  }
+  // Generated expressions map to their authoring call; unaffected nodes retain precise locations.
+  function locate(node: Babel.types.Node, original: Babel.types.Node) {
+    api.types.traverseFast(node, (child) => {
+      child.loc = original.loc ?? null
+      child.start = original.start ?? null
+      child.end = original.end ?? null
+    })
+  }
+  function rewrite(node: Babel.types.Node): Babel.types.Node {
+    const replacement =
+      api.types.isCallExpression(node) && replacements.get(node.start!)
+    if (replacement && replacement.end === node.end) {
+      locate(replacement.node, node)
+      api.types.inheritsComments(replacement.node, node)
+      return replacement.node
+    }
+    for (const key of api.types.VISITOR_KEYS[node.type] ?? []) {
+      const value: unknown = Reflect.get(node, key)
+      if (Array.isArray(value)) {
+        for (let index = 0; index < value.length; index++)
+          if (api.types.isNode(value[index]))
+            value[index] = rewrite(value[index])
+      } else if (api.types.isNode(value)) Reflect.set(node, key, rewrite(value))
+    }
+    return node
+  }
+  rewrite(ast)
+  for (const edit of edits) {
+    if (edit.expression) continue
+    const nodes = edit.code ? parse(edit.code) : []
+    if (edit.start === edit.end) {
+      for (const node of nodes) {
+        api.types.traverseFast(node, (child) => {
+          if (child.loc) {
+            child.loc.start = { line: 1, column: 0, index: 0 }
+            child.loc.end = { line: 1, column: 0, index: 0 }
+          }
+        })
+      }
+      ast.program.body.unshift(...nodes)
+      continue
+    }
+    const index = ast.program.body.findIndex(
+      (node) => node.start === edit.start && node.end === edit.end,
+    )
+    if (index < 0) throw new Error('Missing native statement replacement.')
+    for (const node of nodes) locate(node, ast.program.body[index]!)
+    ast.program.body.splice(index, 1, ...nodes)
+  }
+  merge(api, ast, expressions)
+}
+
+function merge(
+  api: typeof Babel,
+  ast: Babel.types.File,
+  expressions: readonly Edits.Edit[],
+) {
+  const starts = new Set(expressions.map((edit) => edit.start))
+  const body: Babel.types.Statement[] = []
+  let previous: Babel.types.VariableDeclaration | undefined
+  let merged = false
+  for (const statement of ast.program.body) {
+    const declaration =
+      api.types.isVariableDeclaration(statement) &&
+      statement.declarations.every(
+        (entry) => entry.init && starts.has(entry.init.start!),
+      )
+        ? statement
+        : undefined
+    if (declaration && previous?.kind === declaration.kind) {
+      previous.declarations.push(...declaration.declarations)
+      api.types.inheritsComments(previous, declaration)
+      previous.end = declaration.end ?? null
+      if (previous.loc && declaration.loc)
+        previous.loc = { ...previous.loc, end: declaration.loc.end }
+      merged = true
+    } else {
+      body.push(statement)
+      previous = declaration
+    }
+  }
+  if (merged) {
+    // Babel's block-scoping transform scans the scope once per declaration, regardless of its number of bindings.
+    ast.program.body = body
+  }
+}
+
+/** Parses rewritten source once and restores original locations from ordered edits. */
+export function parse(
+  api: typeof Babel,
+  source: string,
+  options: Babel.ParserOptions,
+  edits: readonly Edits.Edit[],
+  parser: (source: string, options: Babel.ParserOptions) => Babel.types.File,
+  callables: WeakSet<Babel.types.Node>,
+): Babel.types.File | undefined {
+  if (
+    options.tokens ||
+    options.ranges ||
+    (options.startLine !== undefined && options.startLine !== 1) ||
+    (options.startColumn !== undefined && options.startColumn !== 0) ||
+    (options.startIndex !== undefined && options.startIndex !== 0)
+  )
+    return undefined
+  if (!edits.length) return parser(source, options)
+
+  type Segment = {
+    start: number
+    original: number
+    replacement?: Edits.Edit
+  }
+  const segments: Segment[] = []
+  const chunks: string[] = []
+  let length = 0
+  let cursor = 0
+  for (const edit of [...edits].sort(
+    (a, b) => a.start - b.start || a.end - b.end,
+  )) {
+    if (edit.start < cursor) return undefined
+    if (edit.start > cursor) {
+      const chunk = source.slice(cursor, edit.start)
+      segments.push({
+        start: length,
+        original: cursor,
+      })
+      chunks.push(chunk)
+      length += chunk.length
+    }
+    if (edit.code) {
+      segments.push({
+        start: length,
+        original: edit.start,
+        replacement: edit,
+      })
+      chunks.push(edit.code)
+      length += edit.code.length
+    }
+    cursor = edit.end
+  }
+  segments.push({
+    start: length,
+    original: cursor,
+  })
+  chunks.push(source.slice(cursor))
+  const ast = parser(chunks.join(''), options)
+  const lines = [0]
+  for (let index = 0; index < source.length; index++) {
+    const character = source.charCodeAt(index)
+    if (character === 13 && source.charCodeAt(index + 1) === 10) index++
+    if (
+      character === 10 ||
+      character === 13 ||
+      character === 0x2028 ||
+      character === 0x2029
+    )
+      lines.push(index + 1)
+  }
+  function segmentAt(value: number): number {
+    let low = 0
+    let high = segments.length - 1
+    while (low < high) {
+      const middle = (low + high + 1) >>> 1
+      if (segments[middle]!.start <= value) low = middle
+      else high = middle - 1
+    }
+    return low
+  }
+  function offset(
+    value: number,
+    end: boolean,
+    index = segmentAt(value),
+  ): number {
+    const segment = segments[index]!
+    if (segment.replacement) {
+      if (end && value > segment.start) return segment.replacement.end
+      return segment.original
+    }
+    return segment.original + value - segment.start
+  }
+  function position(index: number) {
+    let low = 0
+    let high = lines.length - 1
+    while (low < high) {
+      const middle = (low + high + 1) >>> 1
+      if (lines[middle]! <= index) low = middle
+      else high = middle - 1
+    }
+    return { line: low + 1, column: index - lines[low]!, index }
+  }
+  function locate(node: Babel.types.Node | Babel.types.Comment) {
+    if (
+      node.start === undefined ||
+      node.start === null ||
+      node.end === undefined ||
+      node.end === null
+    )
+      return
+    const index = segmentAt(node.start)
+    const segment = segments[index]!
+    if (
+      node.type === 'CallExpression' &&
+      segment.replacement?.expression &&
+      node.start === segment.start &&
+      node.end === segment.start + segment.replacement.code.length
+    )
+      callables.add(node)
+    const endIndex =
+      node.end < (segments[index + 1]?.start ?? Infinity)
+        ? index
+        : segmentAt(node.end)
+    node.start = offset(node.start, false, index)
+    node.end = offset(node.end, true, endIndex)
+    if (node.loc)
+      node.loc = {
+        ...node.loc,
+        start: position(node.start),
+        end: position(node.end),
+      }
+    if ('extra' in node && typeof node.extra?.parenStart === 'number')
+      node.extra.parenStart = offset(node.extra.parenStart, false)
+  }
+  const jsx = NativeJsx.prepare(api, ast, callables)
+  api.types.traverseFast(ast, (node) => {
+    locate(node)
+    jsx?.enter(node)
+  })
+  for (const comment of ast.comments ?? []) locate(comment)
+  merge(
+    api,
+    ast,
+    edits.filter((edit) => edit.expression),
+  )
+  jsx?.finish()
+  return ast
+}

package/src/babel/NativeJsx.ts

@@ -0,0 +1,260 @@
+/** Subscribes native JSX consumers without conditional hooks in style callables. @module */
+import type * as Babel from '@babel/core'
+
+/** Reduces unshadowed immutable local style reads before Babel discovers scopes. */
+export function prepare(
+  api: typeof Babel,
+  ast: Babel.types.File,
+  callables: WeakSet<Babel.types.Node>,
+) {
+  const t = api.types
+  const bindings = new Map<string, Babel.types.Identifier>()
+  const initializers = new Map<
+    Babel.types.Identifier,
+    Babel.types.CallExpression
+  >()
+  for (const statement of ast.program.body) {
+    const declaration = t.isExportNamedDeclaration(statement)
+      ? statement.declaration
+      : statement
+    if (!t.isVariableDeclaration(declaration, { kind: 'const' })) continue
+    for (const entry of declaration.declarations)
+      if (t.isIdentifier(entry.id) && t.isCallExpression(entry.init)) {
+        bindings.set(entry.id.name, entry.id)
+        initializers.set(entry.id, entry.init)
+      }
+  }
+  if (!bindings.size) return
+  const attributes: Babel.types.JSXAttribute[] = []
+  let dynamicScope = false
+  function enter(node: Babel.types.Node) {
+    if (t.isTSParameterProperty(node) || t.isWithStatement(node))
+      dynamicScope = true
+    if (
+      t.isCallExpression(node) &&
+      t.isIdentifier(node.callee, { name: 'eval' })
+    )
+      dynamicScope = true
+    if (t.isJSXAttribute(node)) attributes.push(node)
+    if (
+      t.isVariableDeclarator(node) ||
+      t.isFunction(node) ||
+      t.isClass(node) ||
+      t.isCatchClause(node) ||
+      t.isImportSpecifier(node) ||
+      t.isImportDefaultSpecifier(node) ||
+      t.isImportNamespaceSpecifier(node) ||
+      t.isAssignmentExpression(node) ||
+      t.isUpdateExpression(node) ||
+      t.isForInStatement(node) ||
+      t.isForOfStatement(node) ||
+      (node.type.startsWith('TS') && node.type.endsWith('Declaration'))
+    ) {
+      for (const [name, identifiers] of Object.entries(
+        t.getBindingIdentifiers(node, true),
+      ))
+        if (identifiers.some((identifier) => bindings.get(name) !== identifier))
+          bindings.delete(name)
+      if (
+        'id' in node &&
+        t.isIdentifier(node.id) &&
+        bindings.get(node.id.name) !== node.id
+      )
+        bindings.delete(node.id.name)
+    }
+  }
+  function finish() {
+    if (dynamicScope) return
+    for (const [name, identifier] of bindings)
+      if (!callables.has(initializers.get(identifier)!)) bindings.delete(name)
+    if (!bindings.size) return
+    for (const attribute of attributes) {
+      if (
+        !t.isJSXIdentifier(attribute.name, { name: 'style' }) ||
+        !t.isJSXExpressionContainer(attribute.value)
+      )
+        continue
+      let value = attribute.value.expression
+      while (
+        t.isTSAsExpression(value) ||
+        t.isTSTypeAssertion(value) ||
+        t.isTSNonNullExpression(value) ||
+        t.isTSSatisfiesExpression(value) ||
+        t.isParenthesizedExpression(value)
+      )
+        value = value.expression
+      if (
+        !t.isMemberExpression(value) ||
+        value.computed ||
+        !t.isIdentifier(value.property, { name: 'style' }) ||
+        !t.isCallExpression(value.object) ||
+        value.object.arguments.length > 1 ||
+        !value.object.arguments.every((argument) => t.isExpression(argument)) ||
+        !t.isIdentifier(value.object.callee) ||
+        !bindings.has(value.object.callee.name)
+      )
+        continue
+      const call = value.object
+      const callee = value.object.callee
+      t.inheritsComments(callee, attribute.value.expression)
+      t.inheritsComments(callee, value)
+      t.inheritsComments(callee, call)
+      callables.add(callee)
+      attribute.value.expression = call.arguments.length ? call : callee
+    }
+  }
+  return { enter, finish }
+}
+
+/** Shares Babel's normal traversal and adds one context read per styled owner. */
+export function visitor(
+  api: typeof Babel,
+  callables: WeakSet<Babel.types.Node>,
+): Babel.Visitor<Babel.PluginPass> {
+  const t = api.types
+  type Bindings = Map<'props' | 'style', Babel.types.Identifier>
+  type Owners = Map<Babel.NodePath<Babel.types.Function>, Bindings>
+  const files = new WeakMap<Babel.BabelFile, Owners>()
+  return {
+    Program: {
+      enter(_, state) {
+        files.set(state.file, new Map())
+      },
+      exit(path, state) {
+        const owners = files.get(state.file)!
+        if (!owners.size) return
+        const hook = path.scope.generateUidIdentifier('useZyzzStyles')
+        path.unshiftContainer(
+          'body',
+          t.importDeclaration(
+            [t.importSpecifier(hook, t.identifier('useStyles'))],
+            t.stringLiteral('zyzz/react-native/react'),
+          ),
+        )
+        for (const [owner, bindings] of owners) {
+          if (!t.isBlockStatement(owner.node.body))
+            owner.node.body = t.blockStatement([
+              t.returnStatement(owner.node.body),
+            ])
+          const context =
+            bindings.size > 1
+              ? owner.scope.generateUidIdentifier('zyzzStyles')
+              : undefined
+          const declarations = context
+            ? [t.variableDeclarator(context, t.callExpression(hook, []))]
+            : []
+          for (const [method, binding] of bindings)
+            declarations.push(
+              t.variableDeclarator(
+                binding,
+                t.memberExpression(
+                  context ?? t.callExpression(hook, []),
+                  t.identifier(method),
+                ),
+              ),
+            )
+          owner.node.body.body.unshift(
+            t.variableDeclaration('var', declarations),
+          )
+        }
+      },
+    },
+    JSXAttribute(path, state) {
+      if (
+        !t.isJSXIdentifier(path.node.name, { name: 'style' }) ||
+        !t.isJSXExpressionContainer(path.node.value) ||
+        t.isJSXEmptyExpression(path.node.value.expression)
+      )
+        return
+      const binding = owner(path, files.get(state.file)!, 'style')
+      let inputs = [path.node.value.expression]
+      let value = path.node.value.expression
+      while (
+        t.isTSAsExpression(value) ||
+        t.isTSTypeAssertion(value) ||
+        t.isTSNonNullExpression(value) ||
+        t.isTSSatisfiesExpression(value) ||
+        t.isParenthesizedExpression(value)
+      )
+        value = value.expression
+      if (t.isIdentifier(value) && callables.has(value)) inputs = [value]
+      else if (
+        t.isCallExpression(value) &&
+        t.isIdentifier(value.callee) &&
+        callables.has(value.callee)
+      )
+        inputs = [
+          value.callee,
+          ...value.arguments.filter((argument) => t.isExpression(argument)),
+        ]
+      else if (
+        t.isMemberExpression(value) &&
+        !value.computed &&
+        t.isIdentifier(value.property, { name: 'style' }) &&
+        t.isCallExpression(value.object) &&
+        value.object.arguments.length <= 1 &&
+        value.object.arguments.every((argument) => t.isExpression(argument)) &&
+        t.isIdentifier(value.object.callee)
+      ) {
+        const declaration = path.scope.getBinding(value.object.callee.name)
+        if (
+          declaration?.constant &&
+          declaration.path.isVariableDeclarator() &&
+          declaration.path.node.init &&
+          callables.has(declaration.path.node.init)
+        ) {
+          t.inheritsComments(value.object.callee, path.node.value.expression)
+          t.inheritsComments(value.object.callee, value)
+          t.inheritsComments(value.object.callee, value.object)
+          const input = value.object.arguments[0]
+          inputs =
+            input && t.isExpression(input)
+              ? [value.object.callee, input]
+              : [value.object.callee]
+        }
+      }
+      path.node.value.expression = t.callExpression(binding, inputs)
+    },
+    JSXSpreadAttribute(path, state) {
+      const binding = owner(path, files.get(state.file)!, 'props')
+      path.node.argument = t.callExpression(binding, [path.node.argument])
+    },
+  }
+  function owner(
+    path: Babel.NodePath,
+    owners: Owners,
+    method: 'props' | 'style',
+  ): Babel.types.Identifier {
+    const parent = path.findParent((candidate) => {
+      if (!candidate.isFunction()) return false
+      let declaration = candidate.parentPath
+      while (declaration.isCallExpression())
+        declaration = declaration.parentPath
+      const name =
+        ('id' in candidate.node ? candidate.node.id?.name : undefined) ??
+        (declaration.isVariableDeclarator() &&
+        t.isIdentifier(declaration.node.id)
+          ? declaration.node.id.name
+          : undefined)
+      return (
+        (!!name && (/^[A-Z]/.test(name) || /^use[A-Z]/.test(name))) ||
+        candidate.parentPath.isExportDefaultDeclaration()
+      )
+    })
+    if (!parent?.isFunction() || parent.isClassMethod())
+      throw path.buildCodeFrameError(
+        'Native style props must be rendered in a function component or custom hook.',
+      )
+    let bindings = owners.get(parent)
+    if (!bindings) {
+      bindings = new Map()
+      owners.set(parent, bindings)
+    }
+    let binding = bindings.get(method)
+    if (!binding) {
+      binding = parent.scope.generateUidIdentifier(`zyzz${method}`)
+      bindings.set(method, binding)
+    }
+    return binding
+  }
+}