esupgrade 2025.0.0 → 2025.0.1

package/.pre-commit-config.yaml

@@ -32,6 +32,12 @@ repos:
         args: [--no-passive]
   - repo: local
     hooks:
+      - id: esupgrade
+        name: esupgrade
+        entry: npx .
+        args: [--write]
+        language: system
+        types_or: [javascript]
       - id: prettier
         name: prettier
         entry: prettier --check --write --ignore-unknown
@@ -40,14 +46,9 @@ repos:
         language: node
         additional_dependencies: ["prettier"]
         types_or: [javascript]
-#      - id: esupgrade
-#        name: esupgrade
-#        entry: npx . --check
-#        args: [--write]
-#        language: system
-#        types_or: [javascript]
 ci:
   autoupdate_schedule: weekly
   skip:
     - no-commit-to-branch
     - write-good
+    - esupgrade

package/README.md

@@ -6,17 +6,14 @@
   </picture>
 </p>
 
-# esupgrade
+# esupgrade [![npm version](https://img.shields.io/npm/v/esupgrade.svg?style=flat-square)](https://www.npmjs.com/package/esupgrade) [![coverage status](https://img.shields.io/codecov/c/github/codingjoe/esupgrade/main.svg?style=flat-square)](https://codecov.io/gh/codingjoe/esupgrade) [![license](https://img.shields.io/npm/l/esupgrade.svg?style=flat-square)](https://github.com/codingjoe/esupgrade/blob/main/LICENSE)
 
 Keeping your JavaScript and TypeScript code up to date with full browser compatibility.
 
 ## Usage
 
-### CLI
-
-```bash
-npx esupgrade --help
-```
+esupgrade is safe and meant to be used automatically on your codebase.
+We recommend integrating it into your development workflow using [pre-commit].
 
 ### pre-commit
 
@@ -28,7 +25,7 @@ uvx pre-commit install
 # .pre-commit-config.yaml
 repos:
   - repo: https://github.com/codingjoe/esupgrade
-    rev: v0.1.0  # Use the latest version
+    rev: 2025.0.0  # Use the latest version
     hooks:
       - id: esupgrade
 ```
@@ -37,31 +34,46 @@ repos:
 pre-commit run esupgrade --all-files
 ```
 
-## Browser Support & Baseline
+### CLI
 
-<picture>
-  <source media="(prefers-color-scheme: dark)" srcset="https://web-platform-dx.github.io/web-features/assets/img/baseline-widely-word-dark.svg">
-  <source media="(prefers-color-scheme: light)" srcset="https://web-platform-dx.github.io/web-features/assets/img/baseline-widely-word.svg">
-  <img alt="Baseline: widely available" src="https://web-platform-dx.github.io/web-features/assets/img/baseline-widely-word.svg" height="32" align="right">
-</picture>
+```bash
+npx esupgrade --help
+```
 
-All transformations are based on [Web Platform Baseline](https://web.dev/baseline) features. Baseline tracks which web platform features are safe to use across browsers.
+## Browser Support & Baseline
+
+All transformations are based on [Web Platform Baseline][baseline] features. Baseline tracks which web platform features are safe to use across browsers.
 
 By default, `esupgrade` uses **widely available** features, meaning they work in all major browsers (Chrome, Edge, Safari, Firefox) for at least 30 months. This ensures full compatibility while keeping your code modern.
 
 You can opt into **newly available** features (available in all browsers for 0-30 months) with:
 
 ```bash
-npx esupgrade --baseline newly-available src/
+npx esupgrade --baseline newly-available <files>
 ```
 
-For more information about Baseline browser support, visit [web.dev/baseline](https://web.dev/baseline).
+For more information about Baseline browser support, visit [web.dev/baseline][baseline].
+
+## Supported File Types & Languages
+
+- `.js` - JavaScript
+- `.jsx` - React/JSX
+- `.ts` - TypeScript
+- `.tsx` - TypeScript with JSX
+- `.mjs` - ES Modules
+- `.cjs` - CommonJS
 
 ## Transformations
 
-All transformations are safe and behavior-preserving. Here's what `esupgrade` does:
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://web-platform-dx.github.io/web-features/assets/img/baseline-widely-word-dark.svg">
+  <source media="(prefers-color-scheme: light)" srcset="https://web-platform-dx.github.io/web-features/assets/img/baseline-widely-word.svg">
+  <img alt="Baseline: widely available" src="https://web-platform-dx.github.io/web-features/assets/img/baseline-widely-word.svg" height="32" align="right">
+</picture>
+
+### Widely available
 
-### 1. `var` → `let`/`const`
+#### `var` → `let`/`const`
 
 ```diff
 -var x = 1;
@@ -72,7 +84,7 @@ All transformations are safe and behavior-preserving. Here's what `esupgrade` do
 +y = 3;
 ```
 
-### 2. String concatenation → Template literals
+#### String concatenation → Template literals
 
 ```diff
 -const greeting = 'Hello ' + name + '!';
@@ -81,7 +93,7 @@ All transformations are safe and behavior-preserving. Here's what `esupgrade` do
 +const message = `You have ${count} items`;
 ```
 
-### 3. `Array.from().forEach()` → `for...of` loops
+#### `Array.from().forEach()` → `for...of` loops
 
 ```diff
 -Array.from(items).forEach(item => {
@@ -92,7 +104,7 @@ All transformations are safe and behavior-preserving. Here's what `esupgrade` do
 +}
 ```
 
-### 4. `Object.assign({}, ...)` → Object spread
+#### `Object.assign({}, ...)` → Object spread
 
 ```diff
 -const obj = Object.assign({}, obj1, obj2);
@@ -101,7 +113,7 @@ All transformations are safe and behavior-preserving. Here's what `esupgrade` do
 +const copy = { ...original };
 ```
 
-### 5. `.concat()` → Array spread
+#### `.concat()` → Array spread
 
 ```diff
 -const combined = arr1.concat(arr2, arr3);
@@ -110,7 +122,7 @@ All transformations are safe and behavior-preserving. Here's what `esupgrade` do
 +const withItem = [...array, item];
 ```
 
-### 6. Function expressions → Arrow functions
+#### Function expressions → Arrow functions
 
 ```diff
 -const fn = function(x) { return x * 2; };
@@ -119,34 +131,31 @@ All transformations are safe and behavior-preserving. Here's what `esupgrade` do
 +items.map(item => { return item.name; });
 ```
 
-**Note:** Functions using `this`, `arguments`, or `super` are not converted to preserve semantics.
+> [!NOTE]
+> Functions using `this`, `arguments`, or `super` are not converted to preserve semantics.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://web-platform-dx.github.io/web-features/assets/img/baseline-newly-word-dark.svg">
+  <source media="(prefers-color-scheme: light)" srcset="https://web-platform-dx.github.io/web-features/assets/img/baseline-newly-word.svg">
+  <img alt="Baseline: Newly available" src="https://web-platform-dx.github.io/web-features/assets/img/baseline-newly-word.svg" height="32" align="right">
+</picture>
+
+### Newly available
+
+> [!CAUTION]
+> These transformations are mainly to harden code for future releases and should be used with caution.
 
-### Complete Example
+#### `new Promise((resolve) => { ... })` → `Promise.try(() => { ... })`
 
 ```diff
--var userName = 'John';
--var userAge = 30;
--var greeting = 'Hello, ' + userName + '!';
-+const userName = 'John';
-+const userAge = 30;
-+const greeting = `Hello, ${userName}!`;
-
--Array.from(users).forEach(function(user) {
--  console.log('User: ' + user.name);
+-new Promise((resolve) => {
+-  const result = doSomething();
+-  resolve(result);
 -});
-+for (const user of users) {
-+  console.log(`User: ${user.name}`);
-+}
-
--var settings = Object.assign({}, defaultSettings, userSettings);
-+const settings = { ...defaultSettings, ...userSettings };
++Promise.try(() => {
++  return doSomething();
++});
 ```
 
-## Supported File Types
-
-- `.js` - JavaScript
-- `.jsx` - React/JSX
-- `.ts` - TypeScript
-- `.tsx` - TypeScript with JSX
-- `.mjs` - ES Modules
-- `.cjs` - CommonJS
+[baseline]: https://web.dev/baseline/
+[pre-commit]: https://pre-commit.com/

package/bin/esupgrade.js

@@ -2,7 +2,7 @@
 
 import fs from "fs"
 import path from "path"
-import { Command } from "commander"
+import { Command, Option } from "commander"
 import { transform } from "../src/index.js"
 
 /**
@@ -14,12 +14,11 @@ const program = new Command()
 program
   .name("esupgrade")
   .description("Auto-upgrade your JavaScript syntax")
-  .version("0.1.0")
   .argument("[files...]", "Files or directories to process")
-  .option(
-    "--baseline <level>",
-    "Set baseline level: widely-available (default) or newly-available",
-    "widely-available",
+  .addOption(
+    new Option("--baseline <level>", "Set baseline level for transformations")
+      .choices(["widely-available", "newly-available"])
+      .default("widely-available"),
   )
   .option("--check", "Report which files need upgrading and exit with code 1 if any do")
   .option(
@@ -32,13 +31,6 @@ program
       program.help()
     }
 
-    // Validate baseline option
-    if (!["widely-available", "newly-available"].includes(options.baseline)) {
-      console.error(`Error: Invalid baseline level '${options.baseline}'`)
-      console.error(`Must be 'widely-available' or 'newly-available'`)
-      process.exit(1)
-    }
-
     // Handle check/write options - they are not mutually exclusive
     // Default: write is true unless ONLY --check is specified (no --write)
     const shouldWrite = options.write !== undefined ? options.write : !options.check
@@ -102,7 +94,7 @@ function walkDirectory(dir) {
 function processFile(filePath, options) {
   try {
     const code = fs.readFileSync(filePath, "utf8")
-    const result = transform(code, { baseline: options.baseline })
+    const result = transform(code, options.baseline)
 
     if (result.modified) {
       if (options.check) {
@@ -154,13 +146,7 @@ function processFile(filePath, options) {
 }
 
 function processFiles(patterns, options) {
-  let files = []
-  try {
-    files = findFiles(patterns)
-  } catch (error) {
-    console.error(`Error finding files: ${error.message}`)
-    process.exit(1)
-  }
+  const files = findFiles(patterns)
 
   if (files.length === 0) {
     console.log("No JavaScript files found")

package/images/logo-dark.svg

@@ -1,11 +1,10 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="640" height="320" font-family="Segoe UI, system-ui, sans-serif" viewBox="0 0 1280 640">
   <circle cx="260" cy="320" r="200" fill="#f7df1e"/>
-  <path fill="none" stroke="#191919" stroke-width="48" d="m175 405 95-95 95 95m415 50"/>
-  <path fill="none" stroke="#191919" stroke-width="48" d="m175 315 95-95 95 95m415 50"/>
-  <text x="241" y="148" font-size="92" font-weight="bold" transform="matrix(1.6 0 0 1.6 120 120)" fill="#C9D1D9">
+  <path fill="none" stroke="#191919" stroke-width="48" d="m167 409 95-95 95 95m-190 -95 95-95 95 95m415 50"/>
+  <text x="241" y="148" fill="#c9d1d9" font-size="92" font-weight="bold" transform="matrix(1.6 0 0 1.6 120 120)">
     esupgrade
   </text>
-  <text x="241" y="192" font-size="28" font-style="italic" transform="matrix(1.6 0 0 1.6 120 120)" fill="#C9D1D9">
+  <text x="241" y="192" fill="#c9d1d9" font-size="28" font-style="italic" transform="matrix(1.6 0 0 1.6 120 120)">
     Auto-upgrade your JavaScript syntax
   </text>
 </svg>

package/images/logo-light.svg

@@ -1,7 +1,6 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="640" height="320" font-family="Segoe UI, system-ui, sans-serif" viewBox="0 0 1280 640">
   <circle cx="260" cy="320" r="200" fill="#f7df1e"/>
-  <path fill="none" stroke="#191919" stroke-width="48" d="m175 405 95-95 95 95m415 50"/>
-  <path fill="none" stroke="#191919" stroke-width="48" d="m175 315 95-95 95 95m415 50"/>
+  <path fill="none" stroke="#191919" stroke-width="48" d="m167 409 95-95 95 95m-190 -95 95-95 95 95m415 50"/>
   <text x="241" y="148" font-size="92" font-weight="bold" transform="matrix(1.6 0 0 1.6 120 120)">
     esupgrade
   </text>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "esupgrade",
-  "version": "2025.0.0",
+  "version": "2025.0.1",
   "description": "Auto-upgrade your JavaScript syntax",
   "type": "module",
   "main": "src/index.js",