@zeroheight/adoption-cli 3.0.2 → 3.1.1-rc.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeroheight/adoption-cli",
-  "version": "3.0.2",
+  "version": "3.1.1-rc.1",
   "license": "ISC",
   "main": "dist/cli.js",
   "bin": {
@@ -15,8 +15,8 @@
     "setup": "npm run build && npm i -g",
     "start": "node dist/cli.js",
     "start-dev": "export NODE_ENV=dev && node dist/cli.js",
-    "build": "tsc",
-    "dev": "tsc --watch",
+    "build": "rsbuild build",
+    "dev": "rsbuild build --watch",
     "lint": "prettier --write .",
     "test": "vitest"
   },
@@ -25,8 +25,6 @@
     "CHANGELOG.md"
   ],
   "dependencies": {
-    "acorn": "^8.11.3",
-    "acorn-walk": "^8.3.2",
     "chalk": "^5.2.0",
     "commander": "^12.0.0",
     "glob": "^10.3.15",
@@ -46,18 +44,22 @@
     "yn": "^5.0.0"
   },
   "devDependencies": {
+    "@microsoft/api-extractor": "^7.52.7",
+    "@rsbuild/core": "^1.3.19",
     "@sindresorhus/tsconfig": "^3.0.1",
     "@types/react": "^18.0.32",
     "@typescript-eslint/eslint-plugin": "^7.7.1",
     "@typescript-eslint/parser": "^7.7.1",
     "@vdemedes/prettier-config": "^2.0.1",
     "@vitest/coverage-v8": "^2.1.2",
+    "@zeroheight/adoption-common": "^1.0.3",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "ink-testing-library": "^4.0.0",
     "memfs": "^4.9.2",
     "mock-stdin": "^1.0.0",
     "prettier": "^2.8.8",
+    "rsbuild-plugin-dts": "^0.6.9",
     "ts-node": "^10.9.1",
     "typescript": "^5.4.5",
     "vitest": "^2.1.2"
@@ -68,5 +70,8 @@
   "bugs": {
     "email": "support@zeroheight.com"
   },
-  "homepage": "https://zeroheight.com"
+  "homepage": "https://zeroheight.com",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  }
 }

package/dist/ast/analyze.d.ts

@@ -1,50 +0,0 @@
-import type { Node, Program, Identifier } from "acorn";
-type AttrValueType = "JSXExpressionContainer" | "NumericLiteral" | "StringLiteral" | "BooleanLiteral" | "Identifier" | "TemplateLiteral" | "ArrowFunctionExpression" | "StaticMemberExpression" | "CallExpression" | "TSAsExpression" | "ObjectExpression" | "ArrayExpression" | "BinaryExpression" | undefined;
-export interface PlainIdentifier extends Node {
-    type: "Identifier";
-    local: Identifier;
-}
-export interface Props {
-    name: string;
-    type?: AttrValueType[];
-    values: [string | number | typeof RUNTIME_VALUE | null | undefined];
-}
-export type VisitorState = {
-    components: Map<string, number>;
-    props: Map<string, Props[]>;
-    imports: Map<string, {
-        package: string;
-        name: string;
-    }>;
-};
-type PropValues = string | number | null | undefined;
-export type ComponentProps = {
-    [propName: string]: {
-        type?: AttrValueType[];
-        count?: number;
-        values: PropValues[];
-    };
-};
-export type RawUsage = {
-    name: string;
-    count: number;
-    package: string;
-    props: ComponentProps;
-};
-export type RawColorUsage = {
-    hex: string[];
-    rgb: string[];
-    hsla: string[];
-    oklab: string[];
-    hwb: string[];
-    lab: string[];
-    lch: string[];
-    colorSpace: string[];
-    totalCount: number;
-};
-declare const RUNTIME_VALUE = "zh-runtime-value";
-export declare const ARRAY_VALUE = "zh-array-value";
-export declare const BINARY_VALUE = "zh-binary-value";
-export declare const OBJECT_VALUE = "zh-object-value";
-export declare function analyze(ast: Program): RawUsage[];
-export {};

package/dist/ast/analyze.js

@@ -1,247 +0,0 @@
-import * as walk from "acorn-walk";
-import logger from "../common/logging.js";
-const DYNAMIC_EXPRESSIONS = [
-    "Identifier",
-    "TemplateLiteral",
-    "ArrowFunctionExpression",
-    "StaticMemberExpression",
-    "CallExpression",
-    "TSAsExpression",
-];
-const RUNTIME_VALUE = "zh-runtime-value";
-export const ARRAY_VALUE = "zh-array-value";
-export const BINARY_VALUE = "zh-binary-value";
-export const OBJECT_VALUE = "zh-object-value";
-function transformVisitorStateToRawUsage(visitorState) {
-    const transformedUsageMap = new Map();
-    for (const [name, count] of visitorState.components) {
-        const importInfo = visitorState.imports.get(name);
-        const actualName = importInfo?.name ?? name;
-        const packageName = importInfo?.package ?? "";
-        const key = `package:${packageName} name:${actualName}`;
-        const currentValue = transformedUsageMap.get(key) ?? {
-            name: actualName,
-            count: 0,
-            package: importInfo?.package ?? "",
-            props: {},
-        };
-        transformedUsageMap.set(key, {
-            ...currentValue,
-            count: currentValue.count + count,
-            props: {},
-        });
-    }
-    for (const [name, props] of visitorState.props) {
-        const importInfo = visitorState.imports.get(name);
-        const actualName = importInfo?.name ?? name;
-        const packageName = importInfo?.package ?? "";
-        const key = `package:${packageName} name:${actualName}`;
-        const currentValue = transformedUsageMap.get(key);
-        const componentProps = currentValue.props;
-        props.forEach((prop) => {
-            componentProps[prop.name] = {
-                type: Array.from(new Set([
-                    ...(componentProps[prop.name]?.type ?? []),
-                    ...(prop.type ?? []),
-                ])),
-                values: [...(componentProps[prop.name]?.values ?? []), ...prop.values],
-            };
-        });
-        transformedUsageMap.set(key, {
-            ...currentValue,
-            props: componentProps,
-        });
-    }
-    return Array.from(transformedUsageMap.values());
-}
-export function analyze(ast) {
-    const visitorState = {
-        components: new Map(),
-        props: new Map(),
-        imports: new Map(),
-    };
-    const visitorFunctions = {
-        CatchClause() { },
-        CatchParameter() { },
-        ComputedMemberExpression() { },
-        JSXText() { },
-        NullLiteral() { },
-        NumericLiteral() { },
-        BooleanLiteral() { },
-        ObjectExpression() { },
-        ObjectProperty() { },
-        StringLiteral() { },
-        TSAsExpression() { },
-        TSEnumDeclaration() { },
-        TSInterfaceDeclaration() { },
-        TSTypeAliasDeclaration() { },
-        TSModuleDeclaration() { },
-        TSSatisfiesExpression() { },
-        StaticMemberExpression() { },
-        RegExpLiteral() { },
-        TSNonNullExpression() { },
-        JSXEmptyExpression() { },
-        JSXFragment(node, state) {
-            node.children.forEach((child) => walk.recursive(child, state, visitorFunctions, walk.base));
-        },
-        IfStatement(node, state) {
-            walk.recursive(node.consequent, state, visitorFunctions, walk.base);
-            if (node.alternate) {
-                walk.recursive(node.alternate, state, visitorFunctions, walk.base);
-            }
-        },
-        VariableDeclaration(node, state) {
-            node.declarations.forEach((child) => {
-                walk.recursive(child, state, visitorFunctions, walk.base);
-            });
-        },
-        ArrowFunctionExpression(node, state) {
-            if (node.body.type === "FunctionBody") {
-                walk.recursive(node.body, state, visitorFunctions, walk.base);
-            }
-        },
-        ParenthesizedExpression(node, state) {
-            walk.recursive(node.expression, state, visitorFunctions, walk.base);
-        },
-        ReturnStatement(node, state) {
-            if (node.argument) {
-                walk.recursive(node.argument, state, visitorFunctions, walk.base);
-            }
-        },
-        FunctionBody(node, state) {
-            node.statements.forEach((child) => walk.recursive(child, state, visitorFunctions, walk.base));
-        },
-        Program(node, state) {
-            node.body.forEach((child) => {
-                walk.recursive(child, state, visitorFunctions, walk.base);
-            });
-        },
-        JSXElement(node, state) {
-            const el = node.openingElement;
-            const elName = el.name.name;
-            // Ignore html tags e.g. div, h1, span
-            if (elName?.[0] !== elName?.[0]?.toLocaleLowerCase()) {
-                if (el.attributes.length > 0) {
-                    const attrProps = [];
-                    el.attributes.forEach((attr) => {
-                        // We won't have a name if it is a JSXSpreadAttribute
-                        if (attr.name) {
-                            if (attr.value?.type === "JSXExpressionContainer") {
-                                const expressionType = attr.value.expression.type;
-                                // These are props determined at runtime so we cannot parse them
-                                if (expressionType &&
-                                    DYNAMIC_EXPRESSIONS.includes(expressionType)) {
-                                    attrProps.push({
-                                        name: attr.name.name,
-                                        type: [expressionType],
-                                        values: [RUNTIME_VALUE],
-                                    });
-                                }
-                                else if (expressionType &&
-                                    expressionType === "ObjectExpression") {
-                                    attrProps.push({
-                                        name: attr.name.name,
-                                        type: [expressionType],
-                                        values: [OBJECT_VALUE],
-                                    });
-                                }
-                                else if (expressionType &&
-                                    expressionType === "ArrayExpression") {
-                                    attrProps.push({
-                                        name: attr.name.name,
-                                        type: [expressionType],
-                                        values: [ARRAY_VALUE],
-                                    });
-                                }
-                                else if (expressionType &&
-                                    expressionType === "BinaryExpression") {
-                                    attrProps.push({
-                                        name: attr.name.name,
-                                        type: [expressionType],
-                                        values: [BINARY_VALUE],
-                                    });
-                                }
-                                else {
-                                    attrProps.push({
-                                        name: attr.name.name,
-                                        type: [expressionType],
-                                        values: [
-                                            attr.value.expression.value || attr.value.expression.name,
-                                        ],
-                                    });
-                                }
-                            }
-                            else {
-                                attrProps.push({
-                                    name: attr.name.name,
-                                    type: [attr.value?.type],
-                                    values: [attr.value?.value],
-                                });
-                            }
-                        }
-                    });
-                    const existingProps = state.props.get(elName) ?? [];
-                    state.props.set(elName, [...attrProps, ...existingProps]);
-                }
-                state.components.set(elName, (state.components.get(elName) ?? 0) + 1);
-            }
-            node.children.forEach((child) => {
-                walk.recursive(child, state, visitorFunctions, walk.base);
-            });
-        },
-        CallExpression(node, state) {
-            node.arguments.forEach((child) => walk.recursive(child, state, visitorFunctions, walk.base));
-        },
-        ExportDefaultDeclaration(node, state) {
-            if (node.declaration.type === "FunctionDeclaration") {
-                const { statements } = node.declaration.body;
-                statements.forEach((child) => {
-                    walk.recursive(child, state, visitorFunctions, walk.base);
-                });
-            }
-        },
-        JSXExpressionContainer(node, state) {
-            walk.recursive(node.expression, state, visitorFunctions, walk.base);
-        },
-        ImportDeclaration(node, state) {
-            const packageName = node.source.value?.toString() ?? "";
-            node.specifiers?.forEach((specifier) => {
-                // not handling namespace imports as we can't determine the actual name
-                // e.g. import * as MyIconLibrary from 'my-icon-library'
-                if (specifier.type === "ImportNamespaceSpecifier") {
-                    return;
-                }
-                let name = specifier.local.name;
-                if (specifier.type === "ImportDefaultSpecifier" ||
-                    specifier.type === "Identifier") {
-                    // handles the following cases:
-                    // import Icon from 'my-icon-library'
-                    name = specifier.local.name;
-                }
-                else if (specifier.type === "ImportSpecifier") {
-                    // handles the following cases:
-                    // import { Icon } from 'my-icon-library'
-                    // import { Icon as MyIcon } from 'my-icon-library'
-                    name =
-                        specifier.imported.type === "Literal"
-                            ? specifier.imported.value
-                            : specifier.imported.name;
-                }
-                state.imports.set(specifier.local.name, {
-                    package: packageName,
-                    name,
-                });
-            });
-        },
-        // FIXME: Not the best typing but there are additional types not in acorn
-    };
-    try {
-        walk.recursive(ast, visitorState, visitorFunctions, walk.base);
-    }
-    catch (e) {
-        logger.error({ error: e, ast }, "Error analyzing file");
-    }
-    finally {
-        return transformVisitorStateToRawUsage(visitorState);
-    }
-}

package/dist/ast/parser.d.ts

@@ -1,13 +0,0 @@
-/**
- * Parse code and return AST
- *
- * This extends the acorn parser with support for TypeScript and JSX
- *
- * @param code The string containing JS?X/TS?X
- * @param sourceFilename a filename to help with inference
- * @returns Parsed AST
- */
-export declare function parse(code: string, sourceFilename?: string): {
-    ast: any;
-    errors: string[];
-};

package/dist/ast/parser.js

@@ -1,14 +0,0 @@
-import oxc from "oxc-parser";
-/**
- * Parse code and return AST
- *
- * This extends the acorn parser with support for TypeScript and JSX
- *
- * @param code The string containing JS?X/TS?X
- * @param sourceFilename a filename to help with inference
- * @returns Parsed AST
- */
-export function parse(code, sourceFilename) {
-    const result = oxc.parseSync(code, { sourceFilename, sourceType: "module" });
-    return { ast: JSON.parse(result.program), errors: result.errors };
-}

package/dist/commands/analyze.d.ts

@@ -1,16 +0,0 @@
-import { RenderOptions } from "ink";
-import { Command } from "commander";
-import { RawColorUsage, RawUsage } from "../ast/analyze.js";
-interface AnalyzeOptions {
-    extensions: string;
-    ignore: string[];
-    repoName?: string;
-    interactive: boolean;
-    componentUsage: boolean;
-    colorUsage: boolean;
-}
-export type RawComponentUsageMap = Map<string, RawUsage[]>;
-export type RawColorUsageMap = Map<string, RawColorUsage>;
-export declare function analyzeAction(options: AnalyzeOptions, renderOptions?: RenderOptions): Promise<void>;
-export declare function analyzeCommand(): Command;
-export {};

package/dist/commands/analyze.js

@@ -1,53 +0,0 @@
-import * as React from "react";
-import { render } from "ink";
-import { Command, Option } from "commander";
-import yn from "yn";
-import { analyzeFiles, analyzeRawColorUsage, parseGlobList, } from "./analyze.utils.js";
-import Analyze from "../components/analyze/analyze.js";
-import NonInteractiveAnalyze from "../components/analyze/non-interactive-analyze.js";
-import logger, { setStdErrStream } from "../common/logging.js";
-export async function analyzeAction(options, renderOptions) {
-    if (options.interactive) {
-        render(React.createElement(Analyze, { onAnalyzeFiles: () => analyzeFiles(options.extensions, options.ignore), onAnalyzeColorUsage: () => analyzeRawColorUsage(options.extensions, options.ignore), repoName: options.repoName }), renderOptions);
-    }
-    else {
-        render(React.createElement(NonInteractiveAnalyze, { repoName: options.repoName, onAnalyzeFiles: () => analyzeFiles(options.extensions, options.ignore), onAnalyzeColorUsage: () => analyzeRawColorUsage(options.extensions, options.ignore), shouldAnalyzeComponentUsage: options.componentUsage, shouldAnalyzeTokenUsage: options.colorUsage }));
-    }
-}
-export function analyzeCommand() {
-    const command = new Command();
-    return command
-        .command("analyze")
-        .description("Analyze your codebase to determine component usage metrics")
-        .configureHelp({
-        showGlobalOptions: true,
-    })
-        .addOption(new Option("-e, --extensions [ext]", "file extensions to include when searching for components").default("**/*.{js,jsx,ts,tsx}", "glob pattern to determine file extensions"))
-        .addOption(new Option("-i, --ignore [patterns]", "files to ignore when searching for components, use multiple times to add more than one glob pattern")
-        .default(["**/*.{test,spec}.*", "**/*.d.ts"], "*.test.*, *.spec.* and *.d.ts files")
-        .argParser(parseGlobList))
-        .addOption(new Option("-r, --repo-name <string>", "name of the repository"))
-        .addOption(new Option("-in, --interactive [boolean]", "disable to skip input (useful when running in CI)")
-        .default(true)
-        .argParser((value) => yn(value)))
-        .addOption(new Option("-cu, --component-usage [boolean]", "gather data about component and prop usage")
-        .default(true)
-        .argParser((value) => yn(value)))
-        .addOption(new Option("-cou, --color-usage [boolean]", "gather data about color usage")
-        .default(true)
-        .argParser((value) => yn(value)))
-        .action(async (options) => {
-        if (!options.interactive) {
-            setStdErrStream();
-        }
-        // If no option is passed in aka `true`, use empty list of ignore patterns
-        const ignorePattern = typeof options.ignore === "boolean" ? [] : options.ignore;
-        try {
-            await analyzeAction({ ...options, ignore: ignorePattern });
-        }
-        catch (e) {
-            logger.error({ error: e }, "Unhandled exception running analyze command");
-            process.exitCode = 1;
-        }
-    });
-}

package/dist/commands/analyze.utils.d.ts

@@ -1,27 +0,0 @@
-import type { Option } from "commander";
-import { RawColorUsageMap, RawComponentUsageMap } from "./analyze.js";
-import { RawColorUsage } from "../ast/analyze.js";
-/**
- * Get a list of files matching extensions, skips hidden files and node_modules
- * @param base starting directory
- * @param extensions glob syntax of files to look for, e.g. **\/*.{js,jsx,ts,tsx}
- * @param ignorePattern glob syntax of files to ignore, e.g. **\/*.{test,spec}.*
- * @param gitIgnore contents of .gitignore file
- * @returns list of file paths
- */
-export declare function findFiles(base: string, extensions: string, ignorePattern: string[]): Promise<string[]>;
-export declare function analyzeFiles(extensions: string, ignorePattern: string[]): Promise<{
-    errorFile: string | null;
-    usage: RawComponentUsageMap;
-}>;
-export declare function calculateNumberOfComponents(usageResult: RawComponentUsageMap): number;
-export declare function calculateNumberOfColors(usageResult: RawColorUsageMap): number;
-export declare function countColorOccurrences(fileContent: string): RawColorUsage;
-export declare function analyzeRawColorUsage(extensions: string, ignorePattern: string[]): Promise<{
-    errorFile: string | null;
-    usage: RawColorUsageMap;
-}>;
-/**
- * Parse the ignore array and format correctly
- */
-export declare function parseGlobList(this: Option, value: string, previous: unknown): any[];