@mittwald/flow-codemods 1.2.0-next.0 → 1.2.0-next.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mittwald/flow-codemods",
-  "version": "1.2.0-next.0",
+  "version": "1.2.0-next.10",
   "type": "module",
   "description": "Codemods and an upgrade CLI for consumers of Flow, mittwald's design system",
   "homepage": "https://flow.mittwald.de",
@@ -9,21 +9,20 @@
     "flow-codemods": "dist/cli.js"
   },
   "files": [
-    "dist",
-    "src/migrations/**/transform.ts",
-    "src/tools/to-remote-package.ts"
+    "dist"
   ],
   "engines": {
     "node": ">=22.0.0"
   },
   "scripts": {
-    "build": "tsx dev/generateCli.ts && tsc -p tsconfig.build.json",
+    "build": "tsx dev/generateCli.ts && tsc -p tsconfig.build.json && tsx dev/buildTransforms.ts",
     "test:compile": "tsc --noEmit",
     "test:unit": "vitest run"
   },
   "dependencies": {
     "@inquirer/prompts": "^7.9.0",
     "jscodeshift": "^17.3.0",
+    "package-manager-detector": "^1.8.0",
     "picocolors": "^1.1.1",
     "registry-url": "^7.2.0",
     "semver": "^7.8.5"
@@ -38,5 +37,5 @@
     "vitest": "^4.1.11",
     "yaml": "^2.8.1"
   },
-  "gitHead": "d43b17699970312ffb6c1eaafde8c3438bfc7f72"
+  "gitHead": "1a8de0c9ddcce49e78f0ca8a0c217e4d33a48615"
 }

package/src/migrations/accent-box-color-to-background-color/transform.ts

@@ -1,218 +0,0 @@
-import type { Transform } from "jscodeshift";
-
-/**
- * Moves the background value of `AccentBox` from `color` to `backgroundColor`
- * (alpha.786).
- *
- * `color` did not go away, it changed meaning: it used to set the background
- * (`"blue" | "green" | "gradient" | "neutral"`) and now sets the content color
- * (`"default" | "dark" | "light" | "dark-static" | "light-static"`). A blanket
- * rename would therefore break every element that already uses the new meaning.
- * The transform decides per value instead: a value from the new content-color
- * union stays on `color`, every other literal moves to `backgroundColor`.
- *
- * The scope is deliberately narrow. Only JSX elements that resolve to
- * `AccentBox` — imported (named or as a namespace) from
- * `@mittwald/flow-react-components` or
- * `@mittwald/flow-remote-react-components`, including their subpath entries —
- * are touched.
- *
- * Two cases are left alone, because both are undecidable without knowing the
- * value:
- *
- * - Values it cannot read (`color={expression}`), and expressions that mix both
- *   meanings (`color={flag ? "blue" : "dark"}`). The same expression means the
- *   background in old code and the content color in new code, and a mix has no
- *   single correct answer. An expression whose every value position is a
- *   literal on the same side of the split _is_ decidable and gets renamed:
- *   `color={flag ? "blue" : "green"}`.
- * - An element that already carries `backgroundColor`. Moving `color` there would
- *   silently overwrite the explicit value.
- *
- * Both keep their `color` prop and need a look by hand.
- */
-const accentBoxColorToBackgroundColorTransform: Transform = (
-  fileInfo,
-  { j },
-) => {
-  const flowPackages = [
-    "@mittwald/flow-react-components",
-    "@mittwald/flow-remote-react-components",
-  ];
-  const affectedComponents = new Set(["AccentBox"]);
-  /** Values `color` still accepts — everything else was a background color. */
-  const contentColors = new Set([
-    "default",
-    "dark",
-    "light",
-    "dark-static",
-    "light-static",
-  ]);
-
-  const isFlowImport = (source: string): boolean =>
-    flowPackages.some((pkg) => source === pkg || source.startsWith(`${pkg}/`));
-
-  /** The value of a string literal, or `undefined` for anything dynamic. */
-  const literalValue = (node: unknown): string | undefined => {
-    if (!node || typeof node !== "object" || !("type" in node)) {
-      return undefined;
-    }
-    const { type } = node as { type: string };
-    if (type !== "StringLiteral" && type !== "Literal") {
-      return undefined;
-    }
-    const { value } = node as { value?: unknown };
-    return typeof value === "string" ? value : undefined;
-  };
-
-  /**
-   * Every literal that could become this attribute's value, or `undefined` when
-   * any of those positions is something we cannot read. The positions are the
-   * expression itself, both ternary branches, and the operands of `??`/`||` —
-   * plus only the right operand of `&&`, since `&&` yields its left operand
-   * only when that operand is falsy and a non-empty string never is.
-   *
-   * A list, not a single value, because this transform decides per attribute,
-   * not per literal: `color={flag ? "blue" : "dark"}` mixes a background with a
-   * content colour, and no single rename is right for both.
-   */
-  const valueLiterals = (node: unknown): string[] | undefined => {
-    const literal = literalValue(node);
-    if (literal !== undefined) {
-      return [literal];
-    }
-    if (!node || typeof node !== "object" || !("type" in node)) {
-      return undefined;
-    }
-    const typed = node as {
-      type: string;
-      operator?: string;
-      consequent?: unknown;
-      alternate?: unknown;
-      left?: unknown;
-      right?: unknown;
-    };
-    if (typed.type === "ConditionalExpression") {
-      const consequent = valueLiterals(typed.consequent);
-      const alternate = valueLiterals(typed.alternate);
-      return consequent && alternate
-        ? [...consequent, ...alternate]
-        : undefined;
-    }
-    if (typed.type === "LogicalExpression") {
-      const right = valueLiterals(typed.right);
-      if (right === undefined) {
-        return undefined;
-      }
-      if (typed.operator === "&&") {
-        return right;
-      }
-      const left = valueLiterals(typed.left);
-      return left ? [...left, ...right] : undefined;
-    }
-    return undefined;
-  };
-
-  const root = j(fileInfo.source, { parser: "tsx" });
-
-  // Local JSX identifier -> canonical component name (resolves `as` aliases).
-  const localToComponent = new Map<string, string>();
-  // Local names of `import * as Flow` namespace imports from a Flow package.
-  const flowNamespaces = new Set<string>();
-
-  root
-    .find(j.ImportDeclaration)
-    .filter((path) => isFlowImport(String(path.node.source.value)))
-    .forEach((path) => {
-      for (const specifier of path.node.specifiers ?? []) {
-        if (
-          specifier.type === "ImportSpecifier" &&
-          specifier.imported.type === "Identifier" &&
-          affectedComponents.has(specifier.imported.name)
-        ) {
-          localToComponent.set(
-            String(specifier.local?.name ?? specifier.imported.name),
-            String(specifier.imported.name),
-          );
-        } else if (
-          specifier.type === "ImportNamespaceSpecifier" &&
-          specifier.local
-        ) {
-          flowNamespaces.add(String(specifier.local.name));
-        }
-      }
-    });
-
-  if (localToComponent.size === 0 && flowNamespaces.size === 0) {
-    return fileInfo.source;
-  }
-
-  root.find(j.JSXOpeningElement).forEach((path) => {
-    const name = path.node.name;
-
-    let isAffected = false;
-    if (name.type === "JSXIdentifier") {
-      isAffected = localToComponent.has(name.name);
-    } else if (
-      name.type === "JSXMemberExpression" &&
-      name.object.type === "JSXIdentifier" &&
-      name.property.type === "JSXIdentifier"
-    ) {
-      isAffected =
-        flowNamespaces.has(name.object.name) &&
-        affectedComponents.has(name.property.name);
-    }
-
-    if (!isAffected) {
-      return;
-    }
-
-    const attributes = path.node.attributes ?? [];
-
-    const isNamed = (attribute: unknown, key: string): boolean =>
-      !!attribute &&
-      typeof attribute === "object" &&
-      (attribute as { type?: string }).type === "JSXAttribute" &&
-      (attribute as { name?: { type?: string; name?: string } }).name?.type ===
-        "JSXIdentifier" &&
-      (attribute as { name?: { name?: string } }).name?.name === key;
-
-    // An explicit `backgroundColor` is the new API already — never overwrite it.
-    if (attributes.some((attribute) => isNamed(attribute, "backgroundColor"))) {
-      return;
-    }
-
-    for (const attribute of attributes) {
-      if (!isNamed(attribute, "color") || attribute.type !== "JSXAttribute") {
-        continue;
-      }
-
-      const value = attribute.value;
-
-      const literals =
-        value?.type === "JSXExpressionContainer"
-          ? valueLiterals(value.expression)
-          : valueLiterals(value);
-
-      if (literals === undefined || literals.length === 0) {
-        continue;
-      }
-
-      // All-or-nothing. Every value has to be a background colour for the
-      // rename to be right; all content colours means the element already uses
-      // the new meaning, and a mix has no single correct answer.
-      const backgrounds = literals.filter(
-        (literal) => !contentColors.has(literal),
-      );
-      if (backgrounds.length !== literals.length) {
-        continue;
-      }
-
-      attribute.name = j.jsxIdentifier("backgroundColor");
-    }
-  });
-
-  return root.toSource();
-};
-
-export default accentBoxColorToBackgroundColorTransform;

package/src/migrations/action-prop-to-on-action/transform.ts

@@ -1,110 +0,0 @@
-import type { Transform } from "jscodeshift";
-
-/**
- * Renames the `action` prop to `onAction` on `Action`.
- *
- * The scope is deliberately narrow. Only JSX elements that resolve to `Action`
- * — imported (named or as a namespace) from `@mittwald/flow-react-components`
- * or `@mittwald/flow-remote-react-components`, including their subpath entries
- * — are touched. `Action` is not one of the generated remote components, but
- * the remote package re-exports the `flr-universal` surface, which carries it.
- * Same-named components from other packages are left untouched, and so is the
- * `action` attribute of a plain `<form>`.
- *
- * An element that already carries `onAction` keeps it and only loses the stale
- * `action` prop, which mirrors what the runtime fallback does: an explicit
- * `onAction` wins.
- */
-const actionPropToOnActionTransform: Transform = (fileInfo, { j }) => {
-  const flowPackages = [
-    "@mittwald/flow-react-components",
-    "@mittwald/flow-remote-react-components",
-  ];
-  const affectedComponents = new Set(["Action"]);
-
-  const isFlowImport = (source: string): boolean =>
-    flowPackages.some((pkg) => source === pkg || source.startsWith(`${pkg}/`));
-
-  const root = j(fileInfo.source, { parser: "tsx" });
-
-  // Local JSX identifier -> canonical component name (resolves `as` aliases).
-  const localToComponent = new Map<string, string>();
-  // Local names of `import * as Flow` namespace imports from a Flow package.
-  const flowNamespaces = new Set<string>();
-
-  root
-    .find(j.ImportDeclaration)
-    .filter((path) => isFlowImport(String(path.node.source.value)))
-    .forEach((path) => {
-      for (const specifier of path.node.specifiers ?? []) {
-        if (
-          specifier.type === "ImportSpecifier" &&
-          specifier.imported.type === "Identifier" &&
-          affectedComponents.has(specifier.imported.name)
-        ) {
-          localToComponent.set(
-            String(specifier.local?.name ?? specifier.imported.name),
-            String(specifier.imported.name),
-          );
-        } else if (
-          specifier.type === "ImportNamespaceSpecifier" &&
-          specifier.local
-        ) {
-          flowNamespaces.add(String(specifier.local.name));
-        }
-      }
-    });
-
-  if (localToComponent.size === 0 && flowNamespaces.size === 0) {
-    return fileInfo.source;
-  }
-
-  root.find(j.JSXOpeningElement).forEach((path) => {
-    const name = path.node.name;
-
-    let isAffected = false;
-    if (name.type === "JSXIdentifier") {
-      isAffected = localToComponent.has(name.name);
-    } else if (
-      name.type === "JSXMemberExpression" &&
-      name.object.type === "JSXIdentifier" &&
-      name.property.type === "JSXIdentifier"
-    ) {
-      isAffected =
-        flowNamespaces.has(name.object.name) &&
-        affectedComponents.has(name.property.name);
-    }
-
-    if (!isAffected) {
-      return;
-    }
-
-    const attributes = path.node.attributes ?? [];
-
-    const isNamed = (attribute: (typeof attributes)[number], key: string) =>
-      attribute.type === "JSXAttribute" &&
-      attribute.name.type === "JSXIdentifier" &&
-      attribute.name.name === key;
-
-    const hasOnAction = attributes.some((attribute) =>
-      isNamed(attribute, "onAction"),
-    );
-
-    if (hasOnAction) {
-      path.node.attributes = attributes.filter(
-        (attribute) => !isNamed(attribute, "action"),
-      );
-      return;
-    }
-
-    for (const attribute of attributes) {
-      if (isNamed(attribute, "action") && attribute.type === "JSXAttribute") {
-        attribute.name.name = "onAction";
-      }
-    }
-  });
-
-  return root.toSource();
-};
-
-export default actionPropToOnActionTransform;

package/src/migrations/align-to-combine/transform.ts

@@ -1,212 +0,0 @@
-import type { Transform } from "jscodeshift";
-
-/**
- * Renames the `Align` component to `Combine`, and `AlignProps` to
- * `CombineProps`.
- *
- * Only names imported from `@mittwald/flow-react-components` or
- * `@mittwald/flow-remote-react-components` (including their subpath entries)
- * are touched, so a same-named import from another package is left alone. An
- * `Align` imported under a local alias (`import { Align as Row }`) keeps its
- * alias — only the imported name changes. Namespace usages (`<Flow.Align />`,
- * `Flow.AlignProps`) are rewritten as well.
- */
-const alignToCombineTransform: Transform = (fileInfo, { j }) => {
-  const flowPackages = [
-    "@mittwald/flow-react-components",
-    "@mittwald/flow-remote-react-components",
-  ];
-  const renames = new Map([
-    ["Align", "Combine"],
-    ["AlignProps", "CombineProps"],
-  ]);
-
-  const isFlowImport = (source: string): boolean =>
-    flowPackages.some((pkg) => source === pkg || source.startsWith(`${pkg}/`));
-
-  // ast-types models `importKind` on the declaration only, while babel also
-  // puts it on the specifier — which is where a per-specifier `type X` lives.
-  const isTypeOnly = (specifier: object): boolean =>
-    (specifier as { importKind?: string }).importKind === "type";
-  const makeValueImport = (specifier: object): void => {
-    (specifier as { importKind?: string }).importKind = "value";
-  };
-
-  const root = j(fileInfo.source, { parser: "tsx" });
-
-  /** Local identifiers that refer to a renamed export, mapped to the new name. */
-  const localRenames = new Map<string, string>();
-  /**
-   * Whether any import specifier was rewritten. An aliased `Align as Row` adds
-   * nothing to `localRenames` — its local name stays `Row` — so counting those
-   * alone would treat an alias-only file as untouched and discard the rewrite.
-   */
-  let renamedAnImport = false;
-  /** Local names of `import * as Flow` namespace imports from a Flow package. */
-  const flowNamespaces = new Set<string>();
-
-  const flowImports = root
-    .find(j.ImportDeclaration)
-    .filter((path) => isFlowImport(String(path.node.source.value)));
-
-  /**
-   * `imported:local` pairs the file already binds without a rename. A rename
-   * that lands on one of these must not add a second specifier for it — the
-   * name is available from the import that already carries it, which is also
-   * the entry that really exports it.
-   */
-  const claimed = new Set<string>();
-
-  flowImports.forEach((path) => {
-    for (const specifier of path.node.specifiers ?? []) {
-      if (
-        specifier.type === "ImportNamespaceSpecifier" &&
-        specifier.local?.name
-      ) {
-        flowNamespaces.add(String(specifier.local.name));
-        continue;
-      }
-
-      if (
-        specifier.type !== "ImportSpecifier" ||
-        specifier.imported.type !== "Identifier" ||
-        renames.has(specifier.imported.name)
-      ) {
-        continue;
-      }
-
-      claimed.add(
-        `${specifier.imported.name}:${String(
-          specifier.local?.name ?? specifier.imported.name,
-        )}`,
-      );
-    }
-  });
-
-  flowImports.forEach((path) => {
-    const specifiers = path.node.specifiers ?? [];
-    const survivors: typeof specifiers = [];
-
-    for (const specifier of specifiers) {
-      if (
-        specifier.type !== "ImportSpecifier" ||
-        specifier.imported.type !== "Identifier"
-      ) {
-        survivors.push(specifier);
-        continue;
-      }
-
-      const imported = specifier.imported.name;
-      const renamed = renames.get(imported);
-      if (!renamed) {
-        survivors.push(specifier);
-        continue;
-      }
-
-      const local = String(specifier.local?.name ?? imported);
-      const isAlias = local !== imported;
-      const newLocal = isAlias ? local : renamed;
-      const key = `${renamed}:${newLocal}`;
-
-      renamedAnImport = true;
-      if (!isAlias) {
-        // An aliased import keeps its local name and needs no further change.
-        localRenames.set(local, renamed);
-      }
-
-      // Renaming can collide with a name the file already binds — directly, or
-      // because a second old name maps onto the same new one. Either way the
-      // binding already exists, so this specifier goes away instead of
-      // producing a duplicate declaration, which would not parse.
-      const collision = claimed.has(key);
-      claimed.add(key);
-      if (collision) {
-        // A value import must not lose out to a type-only one.
-        if (!isTypeOnly(specifier)) {
-          for (const kept of survivors) {
-            if (
-              kept.type === "ImportSpecifier" &&
-              kept.imported.type === "Identifier" &&
-              `${kept.imported.name}:${String(
-                kept.local?.name ?? kept.imported.name,
-              )}` === key
-            ) {
-              makeValueImport(kept);
-            }
-          }
-        }
-        continue;
-      }
-
-      // Mutate in place so an `import type` / `type X` modifier survives.
-      specifier.imported.name = renamed;
-      if (!isAlias && specifier.local) {
-        specifier.local.name = renamed;
-      }
-      survivors.push(specifier);
-    }
-
-    if (survivors.length === specifiers.length) {
-      return;
-    }
-
-    // Every specifier moved to an import that already binds the name. Leaving
-    // the declaration behind would turn it into a side-effect import of an
-    // entry the file no longer uses.
-    if (survivors.length === 0) {
-      j(path).remove();
-      return;
-    }
-
-    path.node.specifiers = survivors;
-  });
-
-  if (!renamedAnImport && flowNamespaces.size === 0) {
-    return fileInfo.source;
-  }
-
-  /**
-   * `JSXIdentifier` extends `Identifier`, so this one pass covers JSX tags,
-   * value references and type references alike. Positions where the name is not
-   * a reference to the import — an object key, a member's property, a JSX
-   * attribute name — are skipped.
-   */
-  root.find(j.Identifier).forEach((path) => {
-    const parent = path.parent.node;
-
-    const isNamespaceMember =
-      (parent.type === "MemberExpression" ||
-        parent.type === "JSXMemberExpression") &&
-      parent.property === path.node;
-
-    if (isNamespaceMember) {
-      const object = parent.object;
-      if (object.type === "Identifier" || object.type === "JSXIdentifier") {
-        const renamed = renames.get(path.node.name);
-        if (renamed && flowNamespaces.has(String(object.name))) {
-          path.node.name = renamed;
-        }
-      }
-      return;
-    }
-
-    if (
-      parent.type === "ImportSpecifier" ||
-      parent.type === "JSXAttribute" ||
-      ((parent.type === "ObjectProperty" || parent.type === "Property") &&
-        parent.key === path.node &&
-        !parent.computed)
-    ) {
-      return;
-    }
-
-    const renamed = localRenames.get(path.node.name);
-    if (renamed) {
-      path.node.name = renamed;
-    }
-  });
-
-  return root.toSource();
-};
-
-export default alignToCombineTransform;