Convert version-badge to TypeScript

.changeset/ts-version-badge.md

@@ -0,0 +1,5 @@
+---
+'markdown-magic-version-badge': minor
+---
+
+TypeScript: ship type declarations

packages/version-badge/README.md

@@ -10,14 +10,14 @@ npm i markdown-magic markdown-magic-version-badge --save-dev
 
 ## Adding the plugin
 
-See `example.js` for usage.
+See `example.ts` for usage.
 
-<!-- AUTO-GENERATED-CONTENT:START (CODE:src=./example.js) -->
+<!-- AUTO-GENERATED-CONTENT:START (CODE:src=./example.ts) -->
 
-```js
+```ts
 import path from 'path';
 import { markdownMagic } from 'markdown-magic';
-import VERSIONBADGE from './index.js';
+import VERSIONBADGE from './index.ts';
 
 const config = {
   matchWord: 'AUTO-GENERATED-CONTENT',

packages/version-badge/example.js → packages/version-badge/example.ts

@@ -1,6 +1,6 @@
 import path from 'path';
 import { markdownMagic } from 'markdown-magic';
-import VERSIONBADGE from './index.js';
+import VERSIONBADGE from './index.ts';
 
 const config = {
   matchWord: 'AUTO-GENERATED-CONTENT',

packages/version-badge/index.spec.js → packages/version-badge/index.spec.ts

@@ -1,6 +1,6 @@
 import path from 'path';
 import { describe, expect, it } from 'vitest';
-import format from './index.js';
+import format from './index.ts';
 
 const srcPath = path.join(import.meta.dirname, 'README.md');
 

packages/version-badge/index.js → packages/version-badge/index.ts

@@ -2,12 +2,15 @@ import path from 'path';
 import { readFileSync } from 'fs';
 import { findUpSync } from 'find-up';
 import semver from 'semver';
+import type { TransformArgs, TransformOptions } from './types.ts';
 
-function encode(value) {
+export type { TransformArgs, TransformOptions } from './types.ts';
+
+function encode(value: string): string {
   return value.replace(/-/g, '--').replace(/_/g, '__').replace(/ /g, '_');
 }
 
-function findPkg(dir) {
+function findPkg(dir: string): string {
   const pkgPath = findUpSync('package.json', { cwd: dir });
 
   if (!pkgPath) {
@@ -17,8 +20,11 @@ function findPkg(dir) {
   return pkgPath;
 }
 
-function getPackage(options, srcPath) {
-  let pkgPath;
+function getPackage(
+  options: TransformOptions,
+  srcPath: string,
+): { name: string; version: string } {
+  let pkgPath: string;
 
   if (options?.pkg) {
     pkgPath = path.resolve(path.dirname(srcPath), options.pkg);
@@ -29,12 +35,17 @@ function getPackage(options, srcPath) {
   return JSON.parse(readFileSync(pkgPath, 'utf8'));
 }
 
-function getPrefix(options) {
+function getPrefix(options: TransformOptions): string {
   return options?.prefix || 'npm';
 }
 
-function renderBadge(prefix, name, version, { color: _color } = {}) {
-  let color;
+function renderBadge(
+  prefix: string,
+  name: string,
+  version: string,
+  { color: _color }: TransformOptions = {},
+): string {
+  let color: string;
 
   if (_color) {
     color = _color;
@@ -53,7 +64,7 @@ function renderBadge(prefix, name, version, { color: _color } = {}) {
   return `![${prefix}](${img})`;
 }
 
-function linkify(name, img, options) {
+function linkify(name: string, img: string, options: TransformOptions): string {
   if (options?.link === 'false') return img;
   const url = options?.link || `https://www.npmjs.com/package/${name}`;
   return `[${img}](${url})`;
@@ -63,7 +74,7 @@ export default function VERSIONBADGE({
   content: _content,
   options = {},
   srcPath,
-}) {
+}: TransformArgs): string {
   const { name, version } = getPackage(options, srcPath);
   const prefix = getPrefix(options);
   const img = renderBadge(prefix, name, version, options);

packages/version-badge/package.json

@@ -3,17 +3,21 @@
   "version": "2.0.0",
   "description": "Version badge via Markdown Magic",
   "type": "module",
-  "main": "index.js",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
   "exports": {
-    ".": "./index.js",
+    ".": "./dist/index.js",
     "./package.json": "./package.json"
   },
   "engines": {
     "node": ">=22.18.0"
   },
   "scripts": {
+    "prebuild": "rm -rf dist",
+    "build": "tsc --project tsconfig.build.json",
+    "prepack": "pnpm build",
     "test": "vitest run",
-    "docs": "node example.js && prettier --write README.md",
+    "docs": "node example.ts && prettier --write README.md",
     "format": "prettier --write ."
   },
   "keywords": [
@@ -24,8 +28,11 @@
   "author": "Patrick Camacho <patrick@daftdevelopers.com>",
   "license": "MIT",
   "devDependencies": {
+    "@types/node": "^24.13.2",
+    "@types/semver": "^7.7.1",
     "markdown-magic": "catalog:",
     "prettier": "catalog:",
+    "typescript": "^6.0.3",
     "vitest": "catalog:"
   },
   "peerDependencies": {
@@ -45,6 +52,6 @@
     "url": "https://github.com/camacho/markdown-magic-plugins/issues"
   },
   "files": [
-    "index.js"
+    "dist"
   ]
 }

packages/version-badge/tsconfig.build.json

@@ -0,0 +1,18 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "noEmit": false,
+    "outDir": "dist",
+    "rootDir": ".",
+    "types": ["node"]
+  },
+  "exclude": [
+    "node_modules",
+    "dist",
+    "*.spec.ts",
+    "example.ts",
+    "__fixtures__",
+    "__snapshots__"
+  ],
+  "include": ["*.ts"]
+}

packages/version-badge/types.ts

@@ -0,0 +1,17 @@
+// Transform interface shared by markdown-magic plugins. Adapted from
+// format-package's scripts/markdown-transformers.ts TransformArgs/TransformOptions
+// (content: unknown -> content: string, the plugins' actual contract), plus
+// this package's own `pkg`/`prefix`/`link`/`color` options.
+export interface TransformOptions {
+  pkg?: string;
+  prefix?: string;
+  link?: string;
+  color?: string;
+  [key: string]: unknown;
+}
+
+export interface TransformArgs {
+  content: string;
+  options: TransformOptions;
+  srcPath: string;
+}