@wix/zero-config

CLI and library to generate component manifests from React TypeScript and CSS files. Consumes .ts/.tsx entry files and produces EditorReactComponent manifests.

Installation

yarn add -D @wix/zero-config

Peer dependencies: react (^18 || ^19), react-dom (^18 || ^19), typescript (^5).

Usage

Programmatic

import { extractComponentManifest, extractComponentManifestResult } from '@wix/zero-config'

const manifest = await extractComponentManifest(
  './src/MyComponent.tsx',
  './dist/index.js', // path to the compiled JS entry of the component's package
)

console.log(manifest.component) // EditorReactComponent
console.log(manifest.errors) // non-fatal ExtractionError[]

// If you prefer neverthrow ResultAsync semantics:
const result = await extractComponentManifestResult('./src/MyComponent.tsx', './dist/index.js')
result.match(
  (manifestResult) => {
    console.log(manifestResult.component)
    console.log(manifestResult.errors)
  },
  (error) => console.error(error),
)

CLI

npx @wix/zero-config ./src/MyComponent.tsx
# or
npx @wix/zero-config
# then enter path when prompted

Scripts

| Script | Description | |--------|-------------| | yarn build | Build with Vite; output in dist/ | | yarn dev | Run CLI in dev (vite-node) | | yarn start | Run built CLI: node dist/cli.js | | yarn lint | Biome check on src/ | | yarn test | Vitest | | yarn docs | Generate TypeDoc markdown into docs-audit/ |

API layers

• Tier 1 — High-level: extractComponentManifest() — one call, default pipeline (Promise<ManifestResult>).
• Tier 1 (neverthrow variant): extractComponentManifestResult() — same pipeline with ResultAsync return.
• Tier 2 — Pipeline building blocks: compileTsFile, extractAllComponentInfo, extractCssImports, processComponent, runExtractors, ExtractorStore, buildElementTree, createPropTrackerExtractor, createCssPropertiesExtractor, parseCss, toEditorReactComponent, and exported types (e.g. ComponentInfo, PropInfo, ExtractionResult, ReactExtractor).
• Tier 3 — Low-level: renderWithExtractors, CreateElementListener for custom createElement/JSX interception.

Full API reference: docs-audit/README.md (generate with yarn docs).

Structure

• src/cli.ts — CLI entry (bin: zero-config)
• src/index.ts — Library exports and main API
• src/ts-compiler.ts — TypeScript compilation
• src/manifest-pipeline.ts — Per-component pipeline (load → render → CSS → conversion)
• src/component-loader.ts — Resolve and load component package
• src/component-renderer/ — React createElement interception and renderWithExtractors
• src/information-extractors/ — TS (AST), CSS (css-tree), React (prop tracking, DOM coupling)
• src/converters/ — To EditorReactComponent and data items
• src/errors.ts — BaseError, NotFoundError, ParseError, etc.